综合演练仿真调整

src/store/modules/training.js

@@ -4,6 +4,7 @@ import OperateHandler from '@/scripts/plugin/OperateHandler';
 import deviceType from '../../jmap/constant/deviceType';
 import LangStorage from '@/utils/lang';
 import Handler from '@/scripts/cmdPlugin/Handler';
+import { deepAssign } from '@/utils/index';
 
 /**
  * 实训状态数据
@@ -35,7 +36,10 @@ const training = {
         prdType: '', 				// 产品类型
         roles: '', 					// 角色权限类型
         group: '',					// 设置全局 group
-        centerStationCode:'' // 当前居中的集中站code
+        centerStationCode:'', // 当前居中的集中站code
+        memberList: [], 			// 综合仿真成员列表
+        memberData: {}, 			// 综合仿真成员列表
+        simulationUserList: []		// 综合仿真用户列表
     },
 
     getters: {
@@ -81,6 +85,12 @@ const training = {
         roles: (state) => {
             return state.roles;
         },
+        memberList: (state) => {
+            return state.memberList;
+        },
+        simulationUserList: (state) => {
+            return state.simulationUserList;
+        },
         // 视图中的列车列表
         viewTrainList: (state) => () =>{
             const trainList = [];
@@ -111,6 +121,8 @@ const training = {
         },
         over: (state) => {
             state.started = false;
+            state.memberList = [];
+            state.simulationUserList = [];
             state.switchcount += 1;
         },
         updateMapState: (state, deviceStatus) => {
@@ -212,6 +224,49 @@ const training = {
         },
         setCenterStationCode:(state, centerStationCode) => {
             state.centerStationCode = centerStationCode;
+        },
+        setMemberList: (state, memberList) => {
+            state.memberList = memberList;
+            state.memberData = {};
+            if (memberList && memberList.length) {
+                memberList.forEach(item => {
+                    state.memberData[item.id] = deepAssign({userId: ''}, item);
+                });
+            }
+        },
+        setSimulationUserList: (state, simulationUserList) => {
+            state.simulationUserList = simulationUserList;
+        },
+        updateMemberAndUser: (state, data) => {
+            data.forEach(item => {
+                let memberIndex = -1;
+                let memberId = '';
+                state.simulationUserList.forEach((user, index) =>{
+                    if (user.userId === item.userId) {
+                        memberId = user.memberId;
+                        user.online = item.online;
+                        user.memberId = item.memberId;
+                        user.role = item.role;
+                        memberIndex = index;
+                    }
+                });
+                try {
+                    if (memberId !== item.memberId && memberId) {
+                        state.memberData[memberId].userId = '';
+                    }
+                    if (memberId !== item.memberId && item.memberId) {
+                        state.memberData[item.memberId].userId = item.userId;
+                    }
+                    if (item.messageType === 'ENTER' && memberIndex < 0) {
+                        delete item.messageType;
+                        state.simulationUserList.push(item);
+                    } else if (item.messageType === 'KICK_OUT' && memberIndex > -1) {
+                        state.simulationUserList.splice(memberIndex, 1);
+                    }
+                } catch (e) {
+                    console.error(e);
+                }
+            });
         }
     },
 
@@ -614,6 +669,18 @@ const training = {
         /** 设置当前居中的集中站code */
         setCenterStationCode:({ commit }, centerStationCode) => {
             commit('setCenterStationCode', centerStationCode);
+        },
+        /** 设置综合演练仿真成员列表 */
+        setMemberList: ({ commit }, memberList) => {
+            commit('setMemberList', memberList);
+        },
+        /** 设置综合演练仿真用户列表 */
+        setSimulationUserList: ({ commit }, simulationUserList) => {
+            commit('setSimulationUserList', simulationUserList);
+        },
+        /** 更新综合演练仿真成员和用户列表 */
+        updateMemberAndUser: ({ commit }, simulationUserList) => {
+            commit('updateMemberAndUser', simulationUserList);
         }
     }
 };

src/views/ibp/ibpsystem/index.vue

@@ -9,7 +9,6 @@
 import Vue from 'vue';
 import IbpPan from '@/ibp/ibpPan';
 import { parser } from '@/ibp/utils/parser';
-// import ibpData from '@/ibp/constant/ibpData';
 import { mapGetters } from 'vuex';
 import { exitFullscreen } from '@/utils/screen';
 import { handlerIbpEvent } from '@/api/simulation';

src/views/newMap/jointTrainingNew/index.vue

@@ -67,7 +67,7 @@ import { mapGetters } from 'vuex';
 import { OperateMode, TrainingMode } from '@/scripts/ConstDic';
 import { checkLoginLine } from '@/api/login';
 import { loadNewMapDataByGroup } from '@/utils/loaddata';
-import { clearSimulation, getSimulationInfoNew, getSimulationUserInfo } from '@/api/simulation';
+import { clearSimulation, getSimulationInfoNew, getSimulationUserInfo, getSimulationMemberList, getAllSimulationUser } from '@/api/simulation';
 import {getRaceUserById, getTestPaperDatail} from '@/api/competition';
 import { getSessionStorage, getToken } from '@/utils/auth';
 import Jl3dDrive from '@/views/jlmap3d/drive/jl3ddrive';
@@ -77,8 +77,8 @@ import { timeFormat } from '@/utils/date';
 import { Message } from 'element-ui';
 import Vue from 'vue';
 import localStore from 'storejs';
-import MembersManage from './membersManage';
+import MembersManage from './memberManage/membersManage';
-import AddMember from './addMember';
+import AddMember from './memberManage/addMember';
 import { getLoginInfo } from '@/api/login';
 
 export default {
@@ -194,6 +194,8 @@ export default {
             this.mapBoxP.style.cursor = '';
             this.mapViewLoadedOver = true;
             this.showSelectStation && this.setShowStation(this.showStation);
+            this.initMemberUserInfo();
+
         },
         '$store.state.socket.permissionOver': function () {
             this.$alert(this.$t('tip.userRightsHaveBeenReclaimed'), this.$t('tip.hint'), {
@@ -349,6 +351,18 @@ export default {
                 this.$store.dispatch('SetProjecteDevice', resp.data.deviceVO);
             });
         },
+        initMemberUserInfo() {
+            getSimulationMemberList(this.$route.query.group).then(resp => {
+                this.$store.dispatch('training/setMemberList', resp.data);
+            }).catch(() => {
+                this.$messageBox('获取仿真成员列表失败！');
+            });
+            getAllSimulationUser(this.$route.query.group).then(resp => {
+                this.$store.dispatch('training/setSimulationUserList', resp.data);
+            }).catch(() => {
+                this.$messageBox('获取所有仿真用户失败！');
+            });
+        },
         async loadSimulationInfo() {
             const resp = await getSimulationInfoNew(this.group);
             if (resp && resp.code == 200 && resp.data && !resp.data.dataError) {
@@ -617,7 +631,7 @@ export default {
             this.$refs.addMember.doShow();
         },
         refreshMemberTree() {
-            this.$refs.membersManage.doShow();
+            this.initMemberUserInfo();
         },
         changeAdminMode(adminMode, swch) {
             this.adminMode = adminMode;

src/views/newMap/jointTrainingNew/memberManage/content-menu.vue

@@ -0,0 +1,103 @@
+<template>
+  <div class="jointRoomMenu">
+    <pop-menu ref="popMenu" :menu="menu" />
+  </div>
+</template>
+
+<script>
+import PopMenu from '@/components/PopMenu';
+import { DeviceMenu } from '@/scripts/ConstDic';
+import { kickOutMember } from '@/api/jointSimulation';
+
+export default {
+    components: {
+        PopMenu
+    },
+    props: {
+        clickUserId: {
+            type: String,
+            default: ''
+        },
+        menuDisabled: {
+            type: Boolean,
+            default: false
+        }
+    },
+    data() {
+        return {
+            // menu: [{
+            //     label: this.$t('trainRoom.kickOutTheRoom'),
+            //     handler: this.kicked
+            // }]
+        };
+    },
+    computed: {
+        userId() {
+            return this.$store.state.user ? this.$store.state.user.id : '';
+        },
+        position() {
+            return this.$store.state.menuOperation.menuPosition;
+        },
+        drawWay() {
+            return this.$route.query.drawWay + '';
+        },
+        menu() {
+            return [{
+                label: this.$t('trainRoom.kickOutTheRoom'),
+                handler: this.kicked,
+                disabled: this.menuDisabled
+            }];
+        }
+    },
+    watch: {
+        '$store.state.menuOperation.menuCount': function (val) {
+            if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.JointRoom)) {
+                this.doShow();
+            } else {
+                this.doClose();
+            }
+        }
+    },
+    mounted() {
+        this.closeEvent();
+    },
+    methods: {
+        closeEvent() {
+            const self = this;
+            window.onclick = function (e) {
+                self.doClose();
+            };
+        },
+        doShow() {
+            this.closeEvent();
+            if (this.userId != this.clickUserId) {
+                if (this.$refs && this.$refs.popMenu) {
+                    this.$refs.popMenu.resetShowPosition(this.position);
+                }
+            }
+        },
+        doClose() {
+            if (this.$refs && this.$refs.popMenu) {
+                this.$refs.popMenu.close();
+            }
+        },
+        async kicked() {
+            try {
+                await kickOutMember(this.$route.query.group, this.clickUserId);
+            } catch (error) {
+                console.error(error);
+            }
+        }
+    }
+};
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+	/deep/ {
+		.menu-item{
+			background: #f1ecec;
+			.pop-menu {
+				background: #5F9EA0;
+			}
+		}
+	}
+</style>

src/views/newMap/jointTrainingNew/memberManage/e-members.vue

@@ -0,0 +1,142 @@
+<template>
+  <div class="member">
+    <div class="member__head">
+      <div class="member__head--title"> 成员列表</div>
+      <div class="member__head--notes"> {{ members.length }}/{{ room.totalNum }}</div>
+    </div>
+    <div class="member__container">
+      <el-input v-model="filterText" :placeholder="this.$t('global.enterNameToFilter')" clearable />
+      <el-scrollbar class="member__container--list" wrap-class="scrollbar-wrapper" :style="{height: treeHeight+'px'}">
+        <el-tree
+          ref="tree"
+          :data="filterMembers"
+          :filter-node-method="handleFilterNode"
+          :lazy="false"
+          :props="defaultProps"
+          @node-contextmenu="handleShowContextMenu"
+        >
+          <span slot-scope="{ node, data }">
+            <span v-if="node.data.online" style="color: green;">{{ data.nickName + (data.admin? '【管理员】':'') + (data.referee? '【裁判员】':'') + (data.deviceVO? ` -- (${data.deviceVO.code})`:'') }}</span>
+            <span v-else style="color: #ccc;">{{ data.nickName + (data.admin? '【管理员】':'') + (data.referee? '【裁判员】':'') + (data.deviceVO? ` -- (${data.deviceVO.code})`:'') }}</span>
+          </span>
+        </el-tree>
+      </el-scrollbar>
+    </div>
+    <content-menu ref="menu" :click-user-id="clickUserId" :menu-disabled="menuDisabled" />
+  </div>
+</template>
+
+<script>
+import { DeviceMenu } from '@/scripts/ConstDic';
+import ContentMenu from './content-menu';
+
+export default {
+    components: {
+        ContentMenu
+    },
+    props: {
+        room: {
+            type: Object,
+            required: true
+        },
+        members: {
+            type: Array,
+            required: true
+        },
+        height: {
+            type: Number,
+            required: true
+        },
+        isAdmin: {
+            type: Boolean,
+            default() {
+                return false;
+            }
+        }
+    },
+    data() {
+        return {
+            filterText: '',
+            clickUserId: '',
+            menuDisabled: false
+        };
+    },
+    computed: {
+        defaultProps() {
+            return { label: 'nickName' };
+        },
+        treeHeight() {
+            return this.height - 64;
+        },
+        filterMembers() {
+            return this.members.filter(e =>{ return e.nickName.includes(this.filterText); });
+        },
+        userId() {
+            return this.$store.state.user ? this.$store.state.user.id : '';
+        }
+    },
+    methods: {
+        handleFilterNode(value, data) {
+            if (!value) return true;
+            return data.name.indexOf(value) !== -1;
+        },
+        handleShowContextMenu(e, obj, node, vueElem) {
+            e.preventDefault();
+            const position = {
+                x: e.clientX,
+                y: e.clientY
+            };
+            if (this.isAdmin) {
+                this.clickUserId = `${obj.userId || ''}`;
+                this.menuDisabled = !!obj.deviceVO;
+                this.$store.dispatch('menuOperation/setPopMenu', { position, menu: DeviceMenu.JointRoom });
+            }
+        }
+    }
+};
+</script>
+
+<style scoped lang="scss">
+	.member {
+		background: #f0f0f0;
+		display: flex;
+		flex-direction: column;
+		border: 1px solid #ccc;
+
+		&__head {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 0 10px;
+			border-bottom: 1px solid #ccc;
+
+			&--title {
+                padding:10px 0px;
+				font-size: 16px;
+				font-weight: bold;
+			}
+
+			&--notes {
+				font-size: 16px;
+                padding:10px 0px;
+				display: flex;
+				align-items: flex-end;
+			}
+		}
+
+		&__container {
+			flex-grow: 1;
+			&--list {
+				background: #fff;
+				height: auto;
+				min-height: calc(100% - 200px);
+				max-height: calc(100% - 200px);
+                border-bottom: 1px #ccc solid;
+
+				&::-webkit-scrollbar {
+					display: none;
+				}
+			}
+		}
+	}
+</style>

src/views/newMap/jointTrainingNew/memberManage/membersManage.vue

@@ -31,12 +31,12 @@
             @node-click="handleNodeClick"
           >
             <span :id="data.id" slot-scope="{ node, data }" class="custom-tree-node">
-              <span>{{ node.label }}</span>
+              <span>{{ data.label }}</span>
-              <span v-if="memberData[data.id]">
+              <span v-if="data.role">
-                <el-select v-model="memberData[data.id].userId" placeholder="请选择" clearable size="mini" @change="nodeMemberChange($event, data)">
+                <el-select :key="data.id" v-model="data.userId" placeholder="请选择" clearable size="mini" @change="nodeMemberChange($event, data)">
                   <el-option
-                    v-for="item in members"
+                    v-for="item in simulationUserList"
-                    :key="item.id"
+                    :key="item.userId"
                     :label="item.nickName"
                     :value="item.userId"
                   />
@@ -48,7 +48,7 @@
         <e-members
           class="room__container--members"
           :room="room"
-          :members="members"
+          :members="simulationUserList"
           :is-admin="isAdmin"
           :height="height"
           @message="messageInfo"
@@ -60,8 +60,7 @@
 </template>
 
 <script>
-import eMembers from '../../trainRoom/e-members';
+import eMembers from './e-members';
-import { getSimulationMemberList, getAllSimulationUser } from '@/api/simulation';
 import { assignUsersPlayRoles } from '@/api/jointSimulation';
 export default {
     name: 'MembersManage',
@@ -96,9 +95,10 @@ export default {
                 children: 'children',
                 label: 'label'
             },
-            members: [],
+            simulationUserList: [],
             stationList: [],
             availableStationList:[],
+            activeTrains: [],
             standList: [],
             doorList: [],
             memberData: {},
@@ -148,45 +148,43 @@ export default {
             if (val && val.length) {
                 this.handlerMemberOnOff(val);
             }
-        }
         },
-    methods: {
+        '$store.state.training.simulationUserList': function(val) {
-        doShow() {
+            this.simulationUserList = val;
-            this.show = true;
+        },
-            this.memberData = [];
+        '$store.state.training.memberList': function (val) {
-            getSimulationMemberList(this.$route.query.group).then(resp => {
+            if (val && val.length) {
+                this.memberData = this.$store.state.training.memberData;
                 const dispatcherList = [];
                 const electricDispatcherList = [];
                 const depotDispatcherList = [];
                 const stationSupervisorList = [];
                 const driverList = [];
                 const maintainerList = [];
-                if (resp.data && resp.data.length) {
+                val.forEach(item => {
-                    resp.data.forEach(item => {
-                        this.memberData[item.id] = item;
                     const device = this.$store.getters['map/getDeviceByCode'](item.deviceCode);
                     switch (item.role) {
                     case 'DISPATCHER':
-                            item.label = '行调' + (dispatcherList.length + 1);
+                        this.memberData[item.id].label = '行调' + (dispatcherList.length + 1);
-                            dispatcherList.push(item);
+                        dispatcherList.push(this.memberData[item.id]);
                         break;
                     case 'ELECTRIC_DISPATCHER':
-                            electricDispatcherList.push(item);
+                        electricDispatcherList.push(this.memberData[item.id]);
                         break;
                     case 'DEPOT_DISPATCHER':
-                            depotDispatcherList.push(item);
+                        depotDispatcherList.push(this.memberData[item.id]);
                         break;
                     case 'STATION_SUPERVISOR':
-                            item.label = '值班员-' + device.name;
+                        this.memberData[item.id].label = '值班员-' + device.name;
-                            stationSupervisorList.push(item);
+                        stationSupervisorList.push(this.memberData[item.id]);
                         break;
                     case 'DRIVER':
-                            item.label = '司机-列车' + device.code;
+                        this.memberData[item.id].label = '司机-列车' + item.deviceCode;
-                            driverList.push(item);
+                        driverList.push(this.memberData[item.id]);
                         break;
                     case 'MAINTAINER':
-                            item.label = '通号' + (maintainerList.length + 1);
+                        this.memberData[item.id].label = '通号' + (maintainerList.length + 1);
-                            maintainerList.push(item);
+                        maintainerList.push(this.memberData[item.id]);
                         break;
                     }
                 });
@@ -212,15 +210,29 @@ export default {
                     children: maintainerList
                 }];
             }
-            }).catch(() => {
+        },
-                this.$messageBox('获取仿真成员列表失败！');
+        '$store.state.map.activeTrainListUpdate': function (val) {
+            this.activeTrains = [];
+            const activeTrainList = this.$store.state.map.activeTrainList;
+            if (activeTrainList && activeTrainList.length) {
+                activeTrainList.forEach(train => {
+                    this.activeTrains.push(train.groupNumber);
                 });
-            getAllSimulationUser(this.$route.query.group).then(resp => {
-                if (resp.data && resp.data.length) {
-                    this.members = resp.data;
             }
-            }).catch(() => {
+            this.$refs.tree.filter(this.queryMember);
-                this.$messageBox('获取所有仿真用户失败！');
+        }
+    },
+    mounted() {
+    },
+    methods: {
+        doShow() {
+            this.show = true;
+            this.memberData = this.$store.state.training.memberData;
+            this.simulationUserList = this.$store.state.training.simulationUserList;
+            this.$nextTick(() => {
+                if (this.$refs.tree) {
+                    this.$refs.tree.filter(this.queryMember);
+                }
             });
         },
         doClose() {
@@ -236,11 +248,9 @@ export default {
         handleNodeClick() {
         },
         nodeMemberChange(val, nodeData) {
-            let oldMemberId = '';
             let user = '';
-            this.members.forEach(item => {
+            this.simulationUserList.forEach(item => {
                 if (val && item.userId === val) {
-                    oldMemberId = item.memberId;
                     user = item;
                 } else if (!val && item.memberId === nodeData.id) {
                     user = item;
@@ -249,11 +259,6 @@ export default {
             const data = [{userId: user.userId, memberId:val ? nodeData.id : ''}];
             const self = this;
             assignUsersPlayRoles(data, this.$route.query.group).then(resp => {
-                if (oldMemberId) {
-                    self.memberData[oldMemberId].userId = '';
-                    self.memberData[oldMemberId].nickName = '';
-                }
-                self.memberData[nodeData.id].nickName = user.nickName;
                 this.$message.success('调整角色成员成功！');
             }).catch(() => {
                 self.memberData[nodeData.id].userId = '';
@@ -264,34 +269,18 @@ export default {
             this.$emit('addSimulationMember');
         },
         filterNode(value, data) {
-            if (!value) return true;
+            let flag = false;
-            let falg = false;
             if (this.memberData[data.id] && this.memberData[data.id].nickName) {
-                falg = this.memberData[data.id].nickName.indexOf(value) !== -1;
+                flag = this.memberData[data.id].nickName.indexOf(value) !== -1;
             }
-            return data.label.indexOf(value) !== -1 || falg;
+            let driverNoShow = true;
+            if (data.role && data.role === 'DRIVER' && !this.activeTrains.includes(data.deviceCode)) {
+                driverNoShow = false;
+            }
+            return (data.label.indexOf(value) !== -1 || flag) && driverNoShow;
         },
         handlerMemberOnOff(data) {
-            data.forEach(item => {
+            this.$store.dispatch('training/updateMemberAndUser', data);
-                let memberIndex = -1;
-                let memberId = -1;
-                this.members.forEach((member, index) =>{
-                    if (member.userId === item.userId) {
-                        member.online = item.online;
-                        member.memberId = item.memberId;
-                        member.role = item.role;
-                        memberIndex = index;
-                        memberId = member.id;
-                    }
-                });
-                if (item.messageType === 'ENTER' && memberIndex < 0) {
-                    delete item.messageType;
-                    this.members.push(item);
-                } else if (item.messageType === 'KICK_OUT' && memberIndex > -1) {
-                    this.members.splice(memberIndex, 1);
-                    this.memberData[memberId].userId = '';
-                }
-            });
         }
     }
 };