rt-sim-training-client/src/views/system/existingSimulation/index.vue

<template>
  <div>
    <QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
  </div>
</template>
<script>
import ConstConfig from '@/scripts/ConstConfig';
import Cookies from 'js-cookie';
import { getExistingSimulation, deleteExistingSimulation } from '@/api/simulation';
export default {
    name: 'SimulationManage',
    components: {
    },
    data() {
        return {
            examResultList: [],
            LessonList: [],
            mapList: [],
            pagerConfig: {
                pageSize: 'pageSize',
                pageIndex: 'pageNum'
            },
            queryForm: {
                labelWidth: '130px',
                reset: true,
                queryObject: {
                    group: {
                        type: 'text',
                        label: this.$t('system.simulationGroup')
                    },
                    userName: {
                        type: 'text',
                        label: this.$t('system.userName')
                    },
                    prdType: {
                        type: 'select',
                        label: this.$t('system.prdType'),
                        config: {
                            data: []
                        }
                    }
                }

            },
            queryList: {
                query: getExistingSimulation,
                selectCheckShow: false,
                indexShow: true,
                columns: [
                    {
                        title: this.$t('system.userName'),
                        prop: 'creator.name'
                    },
                    {
                        title: this.$t('system.mapName'),
                        prop: 'map.name'
                    },
                    {
                        title: 'Group',
                        prop: 'group'
                    },
                    {
                        title: this.$t('system.isError'),
                        prop: 'error',
                        type: 'tag',
                        columnValue: (row) => { return this.$ConstSelect.translate(row.error, 'Whether'); },
                        tagType: (row) => {
                            switch (row.error) {
                            case true: return 'success';
                            case false: return 'danger';
                            }
                        }
                    },
                    {
                        title: this.$t('system.isSuspend'),
                        prop: 'pause',
                        type: 'tag',
                        columnValue: (row) => { return this.$ConstSelect.translate(row.pause, 'Whether'); },
                        tagType: (row) => {
                            switch (row.pause) {
                            case true: return 'success';
                            case false: return 'danger';
                            }
                        }
                    },
                    {
                        title: this.$t('system.isDrivingAsplanned'),
                        prop: 'planRunning',
                        type: 'tag',
                        columnValue: (row) => { return this.$ConstSelect.translate(row.planRunning, 'Whether'); },
                        tagType: (row) => {
                            switch (row.runAsPlan) {
                            case true: return 'success';
                            case false: return 'danger';
                            }
                        }
                    },
                    {
                        title: this.$t('system.prdType'),
                        prop: 'prodType',
                        type: 'tag',
                        columnValue: (row) => { return this.$convertField(row.prodType, this.prdTypeList, ['value', 'label']); },
                        tagType: (row) => { return ''; }

                    },
                    {
                        title: this.$t('system.simulationGroupId'),
                        prop: 'onlineUserIdList',
                        type: 'basicText',
                        columnValue: (row) => { return this.listJoiningTogether(row.onlineUserIdList); }
                    },
                    {
                        type: 'button',
                        title: this.$t('global.operate'),
                        buttons: [
                            {
                                name: this.$t('system.destory'),
                                handleClick: this.handleDelete,
                                type: 'danger'
                            }
                        ]
                    }
                ]
            },
            currentModel: {}
        };
    },
    computed:{
        prdTypeList() {
            const productTypeList = ConstConfig.ConstSelect.prdType;
            return Cookies.get('user_lang') == 'en'
                ? productTypeList.map(elem => { return { value: elem.value, label: elem.enlabel }; })
                : productTypeList.map(elem => { return { value: elem.value, label: elem.label }; });
        }
    },
    created() {
        this.queryForm.queryObject.prdType.config.data = this.prdTypeList;
    },
    methods: {
        listJoiningTogether(sessionList) {
            let sessionId = '';
            if (sessionList.length > 0) {
                sessionList.forEach((item) => {
                    sessionId = sessionId + item + ',';
                });
                sessionId = sessionId.substring(0, sessionId.length - 1);
            }
            return sessionId;
        },
        handleDelete(index, row) {
            this.$confirm(this.$t('system.wellDelUserSimulation'), this.$t('global.tips'), {
                confirmButtonText: this.$t('global.confirm'),
                cancelButtonText: this.$t('global.cancel'),
                type: 'warning'
            }).then(() => {
                deleteExistingSimulation(row.group).then(response => {
                    this.$message.success(this.$t('system.deleteSuccess'));
                    this.reloadTable();
                }).catch(() => {
                    this.reloadTable();
                    this.$messageBox(this.$t('error.deleteFailed'));
                });
            });
        },
        reloadTable() {
            this.queryList.reload();
        }
    }
};
</script>