代码调整&司机驾驶调整

This commit is contained in:
fan 2022-07-05 09:08:12 +08:00
parent 98916ac312
commit 4779efbc23
15 changed files with 2325 additions and 718 deletions

View File

@ -76,6 +76,7 @@ const IscsStationConfig = () => import('@/views/iscs/iscsSystem/stationConfig/in
const NewMapDraft = () => import('@/views/newMap/newMapdraft/index');
const NewMapDraftSystem = () => import('@/views/newMap/newMapdraftSystem/index');
const MapDraftPicture = () => import('@/views/newMap/mapDraftPicture/index');
const NewDesignPlatformUser = () => import('@/views/newMap/newDesignUser/index');
const Taskmanage = () => import('@/views/lesson/taskmanage/list');
@ -1356,6 +1357,11 @@ export const asyncRouter = [
component: NewMapDraftSystem,
hidden: true
},
{ // 地图画面管理
path: 'usermap/map/pictureDraw/:mapId/:view',
component: MapDraftPicture,
hidden: true
},
{
path:'iscs/design',
redirect: '/iscs/design',

View File

@ -24,10 +24,11 @@ export function handlerUrl(data) {
if (process.env.NODE_ENV === 'development') {
// const data = null;
// BASE_API = 'https://joylink.club/jlcloud';
// BASE_API = 'https://test.joylink.club/jlcloud';
BASE_API = 'https://test.joylink.club/jlcloud';
// BASE_API = 'http://192.168.3.233/rtss-server';
// BASE_API = 'http://114.116.51.125/jlcloud';
// BASE_API = 'http://192.168.8.152:9000'; // 袁琪
BASE_API = 'http://192.168.3.94:9000'; // 旭强
// BASE_API = 'http://192.168.3.94:9000'; // 旭强
// BASE_API = 'http://192.168.3.15:9000'; // 张赛
// BASE_API = 'http://192.168.8.140:9000'; // 杜康
// BASE_API = 'http://192.168.3.37:9000'; // 卫志宏

View File

@ -1,18 +1,17 @@
<template>
<div id="drivediv" class="jalmap3ddiv" >
<div id="drivediv" class="jalmap3ddiv">
<div style="position: absolute;right:50%;top:40px;z-index:10;background: #EBEBEB;" v-show="tuoguanbutton" @click="tuoguan">{{ tuoguanbuttonmsg }}</div>
<div style="position: absolute;right:50%;top:0%;z-index:10;background: #EBEBEB;" v-show="isTraining" >
<el-select v-model="value" :placeholder="initMsg" @change="currentsel" @visible-change="clickselect" >
<div v-show="tuoguanbutton" style="position: absolute;right:50%;top:40px;z-index:10;background: #EBEBEB;" @click="tuoguan">{{ tuoguanbuttonmsg }}</div>
<div v-show="isTraining" style="position: absolute;right:50%;top:0%;z-index:10;background: #EBEBEB;">
<el-select v-model="value" :placeholder="initMsg" @change="currentsel" @visible-change="clickselect">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
>
</el-option>
/>
</el-select>
</div>
@ -30,7 +29,7 @@
<el-button type="primary" @click="cctvplane">{{ cctvbuttonmsg }}</el-button>
<el-button type="primary" @click="showmmiplane">{{ showbuttonmmimsg }}</el-button>
<el-button type="primary" @click="showtmsplane">{{ showbuttontmsmsg }}</el-button>
<el-button type="primary" @click="back">{{backmsg}}</el-button>
<el-button type="primary" @click="back">{{ backmsg }}</el-button>
</el-button-group>
</div>
@ -40,18 +39,17 @@
<div id="jlsimulation" class="jlmap3ddraw">
<canvas id="canvastexture" />
</div>
<div id="jlcctv" v-show="cctvshow" class="jlmap3cctv">
</div>
<div v-show="cctvshow" id="jlcctv" class="jlmap3cctv" />
<div class="msg" v-show ="msgshow">
<div v-show="msgshow" class="msg">
<div class="msgtext">
{{controlmsg}}
{{ controlmsg }}
</div>
</div>
<Drive-Mmi v-if="mmishow" ref="mmiui" />
<Drive-Tms v-if="tmsshow" ref="tmsui"/>
<Drive-Control v-if="dcontrolshow" ref="dcontrol" :group-num="groupnum" :user-role="userrole"/>
<Drive-Tms v-if="tmsshow" ref="tmsui" />
<Drive-Control v-if="dcontrolshow" ref="dcontrol" :group-num="groupnum" :user-role="userrole" />
<Equip-Box v-if="equipboxshow" :group-num="groupnum" />
<psl v-if="pslShow" ref="psl" pop-class="xian-01__systerm" />
</div>
@ -72,7 +70,7 @@ import { simulationNotify, setTrainingCbtcInitTime } from '@/api/simulation';
import { getPublishMapDetail, getPublish3dMapDetail } from '@/api/jlmap3d/load3ddata';
import { getSimulationInfoNew } from '@/api/simulation';
import { bindSimulationTrain,getSimulationTrainlistNew,getSimulationMembersNew,trainSimulationEb,trainSimulationForce,trainSimulationGear} from '@/jlmap3d/jl3ddrive/drivecontrol/simulation.js';
import { bindSimulationTrain, getSimulationTrainlistNew, getSimulationMembersNew, trainSimulationEb, trainSimulationForce, trainSimulationGear} from '@/jlmap3d/jl3ddrive/drivecontrol/simulation.js';
import { tuoguan3ddrive } from '@/api/jlmap3d/load3ddata';
import { UrlConfig } from '@/scripts/ConstDic';
@ -99,7 +97,7 @@ export default {
},
data() {
return {
groupnum:"",
groupnum:'',
userrole:'',
driveIndex:1500,
@ -115,9 +113,9 @@ export default {
jlmap3d: null,
selectmodel: null,
cctvshow:true,
equipboxmsg:"设备柜——隐藏",
pslmsg:"PSL",
pslCode:"",
equipboxmsg:'设备柜——隐藏',
pslmsg:'PSL',
pslCode:'',
pslShow:false,
cctvbuttonmsg: this.$t('jlmap3d.surveillanceHidden'),
mmishow: false,
@ -130,22 +128,27 @@ export default {
dcontrolshow: true,
equipboxshow:false,
msgshow:false,
controlmsg:"不能选择其它列车",
controlmsg:'不能选择其它列车',
tuoguanbutton:false,
tuoguanbuttonmsg:"托管",
tuoguanbuttonmsg:'托管',
tuoguanstatus:false,
isTraining:true,
options: [],
initMsg:"请选择列车",
initMsg:'请选择列车',
value: '',
topid:null,
trainlist:null,
groupnum:"",
userrole:'',
nowdrive:null,
nowdrive:null
};
},
computed: {
group() {
return this.$route.query.group;
},
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
}
},
watch: {
'jlmap3d.nowspeed': {
handler: function (newVal, oldVal) {
@ -206,7 +209,7 @@ export default {
this.$refs.mmiui.updatedrivedata(this.jlmap3d.drivedata);
}
}
},
}
},
beforeDestroy() {
@ -220,16 +223,8 @@ export default {
// this.$destroy();
}
},
destroyed(){
destroyed() {
// window.removeEventListener('popstate', this.goBack, false);
},
computed: {
group() {
return this.$route.query.group;
},
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
},
},
mounted() {
this.mmishow = true;
@ -240,18 +235,18 @@ export default {
window.updateDriverTrust = this.updateDriverTrust;
window.updateDriveValue = this.updateDriveValue;
window.jl3dUpdatePslCode = this.jl3dUpdatePslCode;
if(this.$route.query.group){
if (this.$route.query.group) {
getSimulationInfoNew(this.$route.query.group).then(netdata => {
if(netdata.data.type == "SCRIPT_MAKING"){
if (netdata.data.type == 'SCRIPT_MAKING') {
this.tuoguanbutton = true;
}
this.inittrainlist();
});
}
if(this.$route.query.type == "DRIVE"){
this.backmsg = "退出";
if (this.$route.query.type == 'DRIVE') {
this.backmsg = '退出';
}
// if (window.history && window.history.pushState) {
@ -277,40 +272,44 @@ export default {
// // this.jlmap3d = null;
// }
// },
show: function (skinCode,group,zindex,isTraining) {
show: function (skinCode, group, zindex, isTraining, deviceCode) {
// console.log("show");
// console.log(skinCode);
// console.log(this.jlmap3d);
if(zindex){
if (zindex) {
this.driveIndex = zindex;
document.getElementById("drivediv").style.zIndex = zindex;
document.getElementById('drivediv').style.zIndex = zindex;
}
if (this.jlmap3d == null) {
this.init(skinCode,group);
this.init(skinCode, group);
} else {
// this.jlmap3d.restart();
this.jlmap3d.eventon();
this.jlmap3d.animateon();
}
if(isTraining){
if (isTraining) {
// this.$refs.dcontrol.changeTrainSelect(isTraining);
}
if (deviceCode) {
this.value = deviceCode;
this.groupnum = deviceCode;
}
},
init: function (skinCode,group) {
init: function (skinCode, group) {
const mapdata = this.$store.getters['map/map'];
const dom = document.getElementById('app');
let translation = {
const translation = {
trainAtoOn: this.$t('jlmap3d.trainAtoOn'),
trainAtoOff: this.$t('jlmap3d.trainAtoOff'),
stopTime: this.$t('jlmap3d.stopTime')
};
let project = this.$route.query.project;
const project = this.$route.query.project;
// console.log(project);
if(project){
this.jlmap3d = new JLmapDriving(dom, mapdata, skinCode,this.$store,translation,group,project);
}else{
this.jlmap3d = new JLmapDriving(dom, mapdata, skinCode,this.$store,translation,group,project);
if (project) {
this.jlmap3d = new JLmapDriving(dom, mapdata, skinCode, this.$store, translation, group, project);
} else {
this.jlmap3d = new JLmapDriving(dom, mapdata, skinCode, this.$store, translation, group, project);
}
// console.log(translation);
@ -346,19 +345,17 @@ export default {
back() {
if(this.$route.query.type == "DRIVE"){
if (this.$route.query.type == 'DRIVE') {
store.dispatch('LogOut').then(() => {
location.reload();
});
}else{
} else {
this.$emit('showdriving');
this.jlmap3d.eventoff();
this.jlmap3d.animateoff();
// this.jlmap3d = null;
}
},
showmmiplane() {
if (this.mmishow == true) {
@ -380,15 +377,15 @@ export default {
}
},
datanew(){
datanew() {
this.dcontrolshow = true;
},
equipboxplane(){
equipboxplane() {
if (this.equipboxshow == true) {
this.equipboxmsg = "设备柜——隐藏";
this.equipboxmsg = '设备柜——隐藏';
this.equipboxshow = false;
} else {
this.equipboxmsg = "设备柜——显示";
this.equipboxmsg = '设备柜——显示';
this.equipboxshow = true;
}
@ -406,7 +403,7 @@ export default {
},
updatestatus(newdata){
updatestatus(newdata) {
// if(newdata.groupNumber){
// this.trainnum = newdata.groupNumber;
//
@ -416,50 +413,49 @@ export default {
// console.log(newdata.v);
updatetmsstatus(newdata);
if(this.$refs.mmiui){
if (this.$refs.mmiui) {
this.$refs.mmiui.updatetrainstatus(newdata);
}
updatabuttonlight(newdata);
},
warningmsg(nowmsg){
warningmsg(nowmsg) {
this.controlmsg = nowmsg;
this.msgshow = true;
setTimeout(this.warningmsgoff,3000);
setTimeout(this.warningmsgoff, 3000);
},
warningmsgoff(){
warningmsgoff() {
this.msgshow = false;
},
tuoguan(){
tuoguan() {
let posttrust = null;
if(this.tuoguanstatus){
if (this.tuoguanstatus) {
posttrust = false;
}else{
} else {
posttrust = true;
}
tuoguan3ddrive(this.$route.query.group,{}).then(netdata => {
tuoguan3ddrive(this.$route.query.group, {}).then(netdata => {
// this.$store.dispatch('training/updateMemberListInScript', {oldMemberId:this.oldMemberId, newMemberId:role, userId:this.userId});
this.tuoguanstatus = posttrust;
if(this.tuoguanstatus){
this.tuoguanbuttonmsg = "取消托管";
}else{
this.tuoguanbuttonmsg = "托管";
if (this.tuoguanstatus) {
this.tuoguanbuttonmsg = '取消托管';
} else {
this.tuoguanbuttonmsg = '托管';
}
}).catch((error) => {
});
},
currentsel(selVal){
let oldgroupnum = this.groupnum;
currentsel(selVal) {
const oldgroupnum = this.groupnum;
this.groupnum = selVal;
bindSimulationTrain(this.group,this.groupnum).then(netdata => {
bindSimulationTrain(this.group, this.groupnum).then(netdata => {
this.selVal = selVal;
this.dialogVisible = true;
// this.groupnum = selVal;
for(let i=0;i<this.trainlist.length;i++){
if(this.trainlist[i].groupNumber == this.groupnum){
for (let i = 0; i < this.trainlist.length; i++) {
if (this.trainlist[i].groupNumber == this.groupnum) {
// console.log(this.trainlist[i].gear);
// this.groupnum
this.$refs.dcontrol.centerstate(this.trainlist[i].gear);
@ -470,56 +466,55 @@ export default {
}).catch(error => {
this.groupnum = oldgroupnum;
this.selVal = oldgroupnum;
this.$emit('warningmsg',error.message);
this.$emit('warningmsg', error.message);
this.value = this.nowdrive;
});
},
clickselect(e){
if(e == true){
clickselect(e) {
if (e == true) {
this.updatetrainlist();
}
},
updateDriverTrust(code,trustStatus){
if(this.tuoguanstatus != trustStatus){
updateDriverTrust(code, trustStatus) {
if (this.tuoguanstatus != trustStatus) {
this.tuoguanstatus = trustStatus;
if(this.tuoguanstatus){
this.tuoguanbuttonmsg = "取消托管";
}else{
this.tuoguanbuttonmsg = "托管";
if (this.tuoguanstatus) {
this.tuoguanbuttonmsg = '取消托管';
} else {
this.tuoguanbuttonmsg = '托管';
}
this.$store.dispatch('training/updateMemberTrust', {deviceCode:code,trust:trustStatus});
this.$store.dispatch('training/updateMemberTrust', {deviceCode:code, trust:trustStatus});
}
},
inittrainlist(){
inittrainlist() {
getSimulationTrainlistNew(this.group).then(netdata => {
this.options = [];
this.trainlist = netdata.data;
for(let i=0;i<netdata.data.length;i++){
let option= {
for (let i = 0; i < netdata.data.length; i++) {
const option = {
value: netdata.data[i].groupNumber,
label: netdata.data[i].groupNumber,
name:null,
}
name:null
};
option.disabled = false;
if(netdata.data[i].name){
option.label = netdata.data[i].name+"正在驾驶"+netdata.data[i].groupNumber;
this.initMsg = netdata.data[i].name+"正在驾驶"+netdata.data[i].groupNumber;
if (netdata.data[i].name) {
option.label = netdata.data[i].name + '正在驾驶' + netdata.data[i].groupNumber;
this.initMsg = netdata.data[i].name + '正在驾驶' + netdata.data[i].groupNumber;
this.groupNumber = netdata.data[i].groupNumber;
option.disabled = true;
}
if(netdata.data[i].driverId){
if(netdata.data[i].driverId == this.userId){
if (netdata.data[i].driverId) {
if (netdata.data[i].driverId == this.userId) {
this.selVal = netdata.data[i].groupNumber;
this.groupnum = netdata.data[i].groupNumber;
this.dialogVisible = true;
for(let i=0;i<this.trainlist.length;i++){
if(this.trainlist[i].groupNumber == this.groupnum){
for (let i = 0; i < this.trainlist.length; i++) {
if (this.trainlist[i].groupNumber == this.groupnum) {
// console.log(this.trainlist[i].gear);
// this.groupnum
this.$refs.dcontrol.centerstate(this.trainlist[i].gear);
@ -537,31 +532,30 @@ export default {
}
}
this.options.push(option);
}
this.options.sort(
function(obj1,obj2) {
let val1 = obj1.value;
let val2 = obj2.value;
function(obj1, obj2) {
const val1 = obj1.value;
const val2 = obj2.value;
return val1 - val2;
}
);
});
//
if(this.tuoguanbutton == true){
//
if (this.tuoguanbutton == true) {
let netdata = this.$store.state.training.memberData;
for(let k in netdata){
if(netdata[k].userId == this.userId){
const netdata = this.$store.state.training.memberData;
for (const k in netdata) {
if (netdata[k].userId == this.userId) {
// console.log(this.$store.state.scriptRecord.type);
this.userrole = netdata[k].type;
if(netdata[k].trust){
if (netdata[k].trust) {
this.tuoguanstatus = netdata[k].trust;
if(this.tuoguanstatus){
this.tuoguanbuttonmsg = "取消托管";
}else{
this.tuoguanbuttonmsg = "托管";
if (this.tuoguanstatus) {
this.tuoguanbuttonmsg = '取消托管';
} else {
this.tuoguanbuttonmsg = '托管';
}
}
break;
@ -570,17 +564,17 @@ export default {
}
}
},
updateDriveValue(newvalue){
updateDriveValue(newvalue) {
if(newvalue != this.value){
if (newvalue != this.value) {
this.value = newvalue;
this.groupnum = newvalue;
}
},
jl3dUpdatePslCode(newPslCode){
if(newPslCode == null){
jl3dUpdatePslCode(newPslCode) {
if (newPslCode == null) {
this.pslShow = false;
}else{
} else {
this.pslShow = true;
}
this.pslCode = newPslCode;
@ -588,27 +582,27 @@ export default {
openPsl() {
this.$refs.psl.doShow({code:this.pslCode});
},
updatetrainlist(){
updatetrainlist() {
getSimulationTrainlistNew(this.group).then(netdata => {
console.log(netdata);
this.options = [];
this.trainlist = netdata.data;
for(let i=0;i<netdata.data.length;i++){
let option= {
for (let i = 0; i < netdata.data.length; i++) {
const option = {
value: netdata.data[i].groupNumber,
label: netdata.data[i].groupNumber,
name:null,
}
name:null
};
option.disabled = false;
if(netdata.data[i].name){
option.label = netdata.data[i].name+"正在驾驶"+netdata.data[i].groupNumber;
this.initMsg = netdata.data[i].name+"正在驾驶"+netdata.data[i].groupNumber;
if (netdata.data[i].name) {
option.label = netdata.data[i].name + '正在驾驶' + netdata.data[i].groupNumber;
this.initMsg = netdata.data[i].name + '正在驾驶' + netdata.data[i].groupNumber;
this.groupNumber = netdata.data[i].groupNumber;
option.disabled = true;
}
if(netdata.data[i].driverId){
if(netdata.data[i].driverId == this.userId){
if (netdata.data[i].driverId) {
if (netdata.data[i].driverId == this.userId) {
this.selVal = netdata.data[i].groupNumber;
this.groupnum = netdata.data[i].groupNumber;
}
@ -616,27 +610,27 @@ export default {
this.options.push(option);
}
this.options.sort(
function(obj1,obj2) {
let val1 = obj1.value;
let val2 = obj2.value;
function(obj1, obj2) {
const val1 = obj1.value;
const val2 = obj2.value;
return val1 - val2;
}
);
});
//
if(this.tuoguanbutton == true){
//
if (this.tuoguanbutton == true) {
let netdata = this.$store.state.training.memberData;
for(let k in netdata){
if(netdata[k].userId == this.userId){
const netdata = this.$store.state.training.memberData;
for (const k in netdata) {
if (netdata[k].userId == this.userId) {
// console.log(this.$store.state.scriptRecord.type);
this.userrole = netdata[k].type;
if(netdata[k].trust){
if (netdata[k].trust) {
this.tuoguanstatus = netdata[k].trust;
if(this.tuoguanstatus){
this.tuoguanbuttonmsg = "取消托管";
}else{
this.tuoguanbuttonmsg = "托管";
if (this.tuoguanstatus) {
this.tuoguanbuttonmsg = '取消托管';
} else {
this.tuoguanbuttonmsg = '托管';
}
}
break;
@ -647,7 +641,6 @@ export default {
}
}
}
};
</script>

View File

@ -600,7 +600,7 @@ export default {
if (this.$store.state.training.prdType == '04') {
this.panelShow = false;
this.drivingShow = true;
this.$refs.Jl3dDrive.show(this.mapId, this.group, 34, 'isTraining');
this.$refs.Jl3dDrive.show(this.mapId, this.group, 34, 'isTraining', this.deviceCode);
} else {
const routeData = this.$router.resolve({
path:'/jlmap3d/sandbox',
@ -733,8 +733,8 @@ export default {
} else if (item.messageType === 'PLAY_CHANGE' && item.userId == this.userId) {
this.userRole = item.type || 'AUDIENCE';
this.$store.dispatch('training/setRoleDeviceCode', item.deviceCode);
this.setSimulationPrdType(this.centralizedStationMap[item.deviceCode]);
this.deviceCode = item.deviceCode;
this.setSimulationPrdType(this.centralizedStationMap[item.deviceCode]);
this.$nextTick(() => {
if (item.deviceCode && this.$store.state.training.prdType !== '09') { this.setCenter(item.deviceCode); }
});

View File

@ -0,0 +1,660 @@
<template>
<transition name="el-zoom-in-center">
<div class="mapPaint">
<div v-show="maskOpen" class="mask" />
<div class="map-view">
<div class="operation_box" :class="{'rightShow': draftShow}">
<el-button-group>
<el-button size="small" :disabled="!stepData.length" @click="revocation">撤销</el-button>
<el-button size="small" :disabled="!recoverStepData.length" @click="recover">恢复</el-button>
</el-button-group>
</div>
<div class="operation_box back_box">
<el-button size="small" @click="backRoute">返回</el-button>
<el-button size="small" style="margin-left: 5px;" @click="updateObjAxis">更新坐标</el-button>
</div>
<jlmap-visual ref="jlmapVisual" :draft-show="draftShow" @onSelect="clickEvent" @onMenu="onContextmenu" />
</div>
<div class="map-draft" :class="{'hide': draftShow}">
<div class="btn_left_box" @click="clickRightBtn"><i :class="draftShow?'el-icon-arrow-right':'el-icon-arrow-left'" /></div>
<div class="box">
<map-operate
ref="mapOperate"
:map-info="mapInfo"
:selected="selected"
:map-saveing="mapSaveing"
@saveMapEvent="saveMapEvent"
@updateMapModel="updateMapModel"
@setCenter="setCenter"
/>
</div>
</div>
<pop-menu ref="popMenu" :menu="menu" />
</div>
</transition>
</template>
<script>
import { saveMap, verifyMap, getMapDetail, postBuildMapImport, getRouteNewList, getAutoReentryList } from '@/api/jmap/mapdraft';
import { ViewMode, TrainingMode, getDeviceMenuByDeviceType, DeviceMenu } from '@/scripts/ConstDic';
import JlmapVisual from '@/views/newMap/jlmapNew/index';
import MapOperate from './mapoperate/index';
import { EventBus } from '@/scripts/event-bus';
import { mapGetters } from 'vuex';
import PopMenu from '@/components/PopMenu';
export default {
name: 'MapView',
components: {
JlmapVisual,
MapOperate,
PopMenu
},
data() {
return {
viewSelect: ViewMode.MIX,
mapSaveing: false,
ViewMode: ViewMode,
viewDraft: 'draft',
autoSaveTask: null,
selected: null,
mapInfo: { name: this.$t('map.pleaseSelectMap') },
oldDevice: null,
draftShow: false,
size: {
width: document.documentElement.clientWidth - 521,
height: document.documentElement.clientHeight - 90
},
updtModel: {
code: '',
scaling: '',
origin: {
x: '',
y: ''
}
},
menu: [],
menuNormal: []
};
},
computed: {
...mapGetters('map', [
'stepData',
'recoverStepData',
'stationList'
]),
maskOpen() {
return this.$store.state.config.maskOpen;
}
},
watch: {
'$store.state.map.mapDataLoadedCount': function () {
this.initAutoSaveTask();
},
'$store.state.app.windowSizeCount': function() {
this.setWindowSize();
},
$route() {
this.clearAutoSave();
this.$nextTick(() => {
this.loadInitPage();
});
},
'$store.state.menuOperation.menuCount': function () {
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.Cancel)) {
this.popDoShow(this.$store.state.menuOperation.menuPosition);
} else {
this.popDoClose();
}
}
},
mounted() {
this.setWindowSize();
this.loadInitPage();
EventBus.$on('SELECTON', () => {
this.selected = null;
});
},
beforeDestroy() {
EventBus.$off('SELECTON');
this.clearAutoSave();
this.$store.dispatch('map/mapClear');
},
methods: {
clickRightBtn() {
this.draftShow = !this.draftShow;
},
getMapOrigin() {
const dataZoom = this.$store.state.map.dataZoom;
if (dataZoom && dataZoom.offsetX) {
this.updtModel.origin.x = Number.parseInt(dataZoom.offsetX);
this.updtModel.origin.y = Number.parseInt(dataZoom.offsetY);
this.updtModel.scaling = dataZoom.scaleRate;
}
},
//
mapLocation(item) {
if (item) {
this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: item.code });
this.popDoClose();
}
},
initMenu() {
this.menuNormal = [];
this.stationList.forEach(station => {
if (station.chargeStationCodeList && station.chargeStationCodeList.length) {
const node = {
label: station.name,
children: []
};
station.chargeStationCodeList.forEach(item => {
const next = this.$store.getters['map/getDeviceByCode'](item);
node.children.push({
code: next.code,
label: next.name,
handler: this.mapLocation
});
});
this.menuNormal.push(node);
}
});
this.menu = [...this.menuNormal];
},
popDoShow(point) {
this.popClickEvent();
this.initMenu();
if (this.$refs && this.$refs.popMenu && this.menu && this.menu.length) {
this.$refs.popMenu.resetShowPosition(point);
}
},
popClickEvent() {
const self = this;
window.onclick = function () {
self.popDoClose();
};
},
popDoClose() {
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.close();
}
},
updateObjAxis() {
this.getMapOrigin();
this.$confirm('您确认按当前绘图位置更新坐标及缩放比例?', this.$t('tip.hint'), {
confirmButtonText: this.$t('tip.confirm'),
cancelButtonText: this.$t('tip.cancel'),
type: 'warning'
}).then(() => {
const map = this.$store.state.map.map;
this.$store.dispatch('map/saveMapDeviceDefaultRelations').then(() => {
const param = {
mapId: this.$route.params.mapId,
skinVO: {
code: this.$store.state.map.map.skinVO.code,
name: this.$store.state.map.map.skinVO.name
},
origin: {
x: this.updtModel.origin.x || map.origin.x,
y: this.updtModel.origin.y || map.origin.y
},
scaling: this.updtModel.scaling
};
saveMap(Object.assign(map, param)).then(() => {
this.$message.success(this.$t('map.updateSuccessfully'));
}).catch(() => {
this.$messageBox(this.$t('map.updateFailed'));
});
});
}).catch(() => { });
},
setWindowSize() {
this.$nextTick(() => {
const width = this.$store.state.app.width;
const height = this.$store.state.app.height - 90;
this.$store.dispatch('config/resize', { width, height });
});
},
endViewLoading(isSuccess) {
if (!isSuccess) {
this.$store.dispatch('map/mapClear');
}
this.$nextTick(() => {
EventBus.$emit('viewLoading', false);
});
},
loadInitPage() {
this.$store.dispatch('training/changeMode', { mode: TrainingMode.MAP_EDIT });
this.$store.commit('map/clearStepData'); //
this.mapInfo = { name: this.$t('map.pleaseSelectMap'), id: this.$route.params.mapId };
if (parseInt(this.mapInfo.id)) {
this.mapInfo.name = this.$route.query.name;
getMapDetail(this.$route.params.mapId).then(response => {
this.$store.dispatch('map/setMapData', response.data).then(() => {
this.$store.dispatch('training/setMapDefaultState');
});
this.initAutoSaveTask();
}).catch((error) => {
console.log(error, '加载地图错误提示');
this.$message.error(this.$t('tip.failedLoadMap'));
this.endViewLoading();
});
} else {
this.endViewLoading();
}
},
initAutoSaveTask() {
const timeout = 1000 * 60 * 3;
this.clearAutoSave(this.autoSaveTask);
if (this.viewDraft === 'draft') {
this.autoSaveTask = setInterval(this.saveMapEvent, timeout);
}
},
clearAutoSave() {
if (this.autoSaveTask) {
clearInterval(this.autoSaveTask);
this.autoSaveTask = null;
}
},
handleSelectControlPage (model) {
if (this.$refs.mapOperate) {
this.$refs.mapOperate.handleSelectControlPage(model);
this.$store.dispatch('menuOperation/setMapDrawSelectCount');
}
},
handleSelectPhysicalView(handle) {
if (this.$refs.jlmapVisual) {
this.$refs.jlmapVisual.setLevelVisible(handle);
}
},
clickEvent(em) {
const device = this.getDeviceByEm(em);
this.deviceHighLight(this.oldDevice, false);
this.deviceHighLight(device, true);
this.oldDevice = device;
this.onSelect(device);
},
//
getDeviceByEm(em) {
var device = this.$store.getters['map/getDeviceByCode'](em.deviceCode) || null;
if (device) {
device._viewVal = em.val;
}
return device;
},
onSelect(device) {
this.selected = device || null;
this.selected && this.handleSelectControlPage(device);
},
onContextmenu(em) {
this.point = {
x: em.clientX,
y: em.clientY
};
if (!em.deviceType) {
var menu = getDeviceMenuByDeviceType('Cancel');
this.$store.dispatch('menuOperation/setPopMenu', { position: this.point, menu: menu });
}
},
verifySectionPoint(map) { //
let flag = true;
map.sectionList.forEach(elem => {
if (elem.points.length > 0) {
for (let index = 0; index < elem.points.length; index++) {
if (String(elem.points[index].x) === 'undefined' || String(elem.points[index].y) === 'undefined') {
this.$message(`${elem.name}${this.$t('tip.sectionPointsDeficiency')}`);
flag = false;
}
}
} else {
this.$message(this.$t('tip.sectionPointsDeficiency'));
flag = false;
}
});
return flag;
},
verifySectionRelation(map) {
let flag = true;
const tipInfoList = [];
map.sectionList.forEach(section => {
section.type === '01' && map.sectionList.forEach(item => {
if (section.code !== item.code && item.type === '01' && this.checkSectionPointsHasCoincide(section.points, item.points) && !this.checkCorrelation(section, item)) {
tipInfoList.push('区段' + section.name + '(' + section.code + '): 或者区段' + item.name + '(' + item.code + ')' + '关联关系设置错误!' );
}
});
});
if (!tipInfoList.length) {
flag = true;
} else {
flag = false;
this.$messageBox(this.$t('tip.dataValidationFailed'));
this.tableToExcel(tipInfoList);
}
return flag;
},
async verifyInterlockDevice(map) {
let flag = true;
const tipInfoList = [];
const routeCodeList = [];
const cycleCodeList = [];
const resp1 = await getRouteNewList(this.$route.params.mapId, {pageSize:9999, pageNum:1});
if (resp1.data && resp1.data.list) {
resp1.data.list.forEach(item => {
routeCodeList.push(item.code);
});
}
const resp2 = await getAutoReentryList(this.$route.params.mapId, {pageSize:9999, pageNum:1});
if (resp2.data && resp2.data.list) {
resp2.data.list.forEach(item => {
cycleCodeList.push(item.code);
});
}
map.cycleButtonList.forEach(cycleButton => {
if (!cycleCodeList.includes(cycleButton.cycleCode)) {
flag = false;
tipInfoList.push('自动折返功能按钮' + cycleButton.name + '(' + cycleButton.code + ')' + '的关联自动折返数据不存在!');
}
});
map.automaticRouteButtonList.forEach(routeButton => {
if (!routeCodeList.includes(routeButton.automaticRouteCode)) {
flag = false;
tipInfoList.push('自动进路功能按钮' + routeButton.name + '(' + routeButton.code + ')' + '的关联进路数据不存在!');
}
});
if (!flag) {
this.$messageBox(this.$t('tip.dataValidationFailed'));
this.tableToExcel(tipInfoList);
}
return flag;
},
verifyStationPosition(map) {
let flag = true;
const tipInfoList = [];
map.stationStandList.forEach(stationStand => {
const section = this.$store.getters['map/getDeviceByCode'](stationStand.standTrackCode);
const list = [];
section && section.points.forEach(point => {
list.push(point.x);
});
if (stationStand.position.x > Math.max(...list) || stationStand.position.x < Math.min(...list)) {
flag = false;
tipInfoList.push('站台' + stationStand.name + '(' + stationStand.code + ')' + '位置偏移出关联站台轨,请检查关联站台轨是否正确!');
}
});
if (!flag) {
this.$messageBox(this.$t('tip.dataValidationFailed'));
this.tableToExcel(tipInfoList);
}
return flag;
},
verifySignalPosition(map) {
let flag = true;
const tipInfoList = [];
map.signalList.forEach(signal => {
const section = this.$store.getters['map/getDeviceByCode'](signal.sectionCode);
if (section) {
const offsetX = signal.positionPoint ? signal.positionPoint.x : 0;
const signalPositionX = signal.position.x - offsetX;
const max = Math.max(section.points[section.points.length - 1].x, section.points[0].x);
const min = Math.min(section.points[section.points.length - 1].x, section.points[0].x);
if (signalPositionX < min && signalPositionX > max) {
tipInfoList.push('信号机' + signal.name + '(' + signal.code + ')未在其关联的区段' + section.name + '(' + section.code + ')里');
}
} else {
tipInfoList.push('信号机' + signal.name + '(' + signal.code + ')所关联的区段不存在');
}
});
if (!tipInfoList.length) {
flag = true;
} else {
flag = false;
this.$messageBox(this.$t('tip.dataValidationFailed'));
this.tableToExcel(tipInfoList);
}
return flag;
},
checkPointsCoincide(point1, point2) { //
if (point1 && point2) {
return point1.x === point2.x && point1.y === point2.y;
}
return false;
},
checkSectionPointsHasCoincide(points1, points2) { //
return points1.length && points2.length && (this.checkPointsCoincide(points1[0], points2[0]) || this.checkPointsCoincide(points1[0], points2[points2.length - 1]) || this.checkPointsCoincide(points1[points1.length - 1], points2[points2.length - 1]) || this.checkPointsCoincide(points1[points1.length - 1], points2[0]));
},
checkCorrelation(section1, section2) { //
return section1.leftSectionCode === section2.code || section1.rightSectionCode === section2.code;
},
saveMapEvent() { //
const map = this.$store.state.map.map;
if (this.$refs.jlmapVisual && map && parseInt(this.$route.params.mapId)) {
this.mapSaveing = true;
this.$store.dispatch('map/saveMapDeviceDefaultRelations').then(() => { // 稿
saveMap(Object.assign(map, { mapId: this.$route.params.mapId })).then(() => {
this.$message.success(this.$t('tip.saveSuccessfully'));
this.mapSaveing = false;
this.initAutoSaveTask();
}).catch(error => {
console.log(error);
this.$messageBox(this.$t('tip.saveFailed'));
this.mapSaveing = false;
if (error.code === 40004 || error.code === 40005 || error.code === 40003) {
this.clearAutoSave();
} else {
this.initAutoSaveTask();
}
});
}).catch(error => {
console.log(error, '错误提示');
this.mapSaveing = false;
this.$message(this.$t('tip.saveFailed'));
});
}
},
async checkOver() {
if (this.$refs.jlmapVisual) {
const map = this.$store.state.map.map;
if (map && this.$route.params.mapId) {
const checkInterlockDevice = await this.verifyInterlockDevice(map);
if (this.verifySectionRelation(map) && this.verifySignalPosition(map) && checkInterlockDevice && this.verifyStationPosition(map)) {
verifyMap(this.$route.params.mapId).then(res => {
if (res.data.length) {
this.tableToExcel(res.data);
this.$messageBox(this.$t('tip.dataValidationFailed'));
} else {
this.$message.success(this.$t('tip.dataValidationSuccess'));
}
}).catch(() => {
this.$message.error(this.$t('tip.requestFailed'));
});
}
}
}
},
tableToExcel(data) {
const filterVal = ['index'];
const arr = [];
data.forEach(item => {
arr.push({ index: item });
});
const dataList = this.formatJson(filterVal, arr);
import('@/utils/Export2Excel').then(excel => { excel.export_json_to_excel([this.$t('tip.dataQuestion')], dataList, this.$t('tip.dataList')); });
},
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => v[j]));
},
backRoute() {
this.$router.push({ path: `/design/usermap/home` });
},
updateMapModel(models) { //
this.$store.dispatch('map/updateSystemMapDevices', models);
},
//
revocation() {
this.$store.dispatch('map/setRevocation');
},
//
recover() {
this.$store.dispatch('map/setRecover');
},
//
setCenter(code) {
this.$refs.jlmapVisual.setCenter(code);
const device = this.$store.getters['map/getDeviceByCode'](code);
this.deviceHighLight(this.oldDevice, false);
this.deviceHighLight(device, true);
this.oldDevice = device;
},
createMap() {
this.$refs.mapCreate.show();
},
importf() { // jsons
const loading = this.$loading({
lock: true,
text: '正在导入中...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
setTimeout(() => {
const obj = this.$refs.files;
if (!obj.files) return;
const f = obj.files[0];
const reader = new FileReader();
const that = this;
reader.readAsText(f, 'utf-8');
reader.onload = function(e) {
const data = e.target.result;
postBuildMapImport(JSON.parse(data)).then(() => {
loading.close();
that.$message.success('导入成功!');
that.refresh();
loading.close();
}).catch(error => {
loading.close();
that.$message.error('导入失败' + error.message);
});
obj.value = '';
};
});
},
//
deviceHighLight(device, flag) {
if (device && device.instance && typeof device.instance.drawSelected === 'function' ) {
if (device._type === 'Section' && device.type === '04') {
device.relevanceSectionList.forEach(item => {
const sectionModel = this.$store.getters['map/getDeviceByCode'](item);
sectionModel && sectionModel.instance.drawSelected(flag);
});
} else if (device._type === 'Section' && device.type === '01' && device.logicSectionCodeList && device.logicSectionCodeList.length) {
device.logicSectionCodeList.forEach(item => {
const sectionModel = this.$store.getters['map/getDeviceByCode'](item);
sectionModel && sectionModel.instance.drawSelected(flag);
});
} else {
device.instance.drawSelected(flag);
}
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
/deep/ {
.menu-item{
background: #f1ecec;
.pop-menu {
background: #5F9EA0;
}
}
}
.mask{
opacity: 0;
background: #000;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 9;
}
.operation_box{
position: absolute;
right: 20px;
top: 15px;
z-index: 9;
&.rightShow{
right: 540px;
}
}
.back_box{
left: 10px;
display: inline-block;
width: 180px;
}
.btn_left_box{
position: absolute;
left: 0;
top: 50%;
padding: 8px 3px;
background: #fff;
z-index: 10;
transform: translateX(-22px);
cursor: pointer;
border-radius: 5px 0 0 5px;
}
.box{
height: 100%;
}
.mapPaint{
height: 100%;
overflow: hidden;
position: relative;
}
.map-view {
float: left;
width: 100%;
position: relative;
}
.map-draft {
width: 520px;
height: 100%;
position: absolute;
right: 0;
transform: translateX(520px);
transition: all 0.5s;
background: #fff;
z-index: 9;
/deep/{
.v-modal{
opacity: 0;
}
}
&.hide{
transform: translateX(0);
}
}
.uploadDemo {
position: relative;
overflow: hidden;
float: right;
padding: 3px 0;
margin-right: 3px;
cursor: pointer;
input {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
opacity: 0;
cursor: pointer;
}
}
</style>

View File

@ -0,0 +1,50 @@
<template>
<div style="height:100%">
<div class="view-control-content">
<config-list ref="createForm" :form="createForm" :form-model="addModel" :rules="createRules" />
</div>
<div class="button_box">
<el-button-group class="map-draft-group">
<el-button type="primary" size="small" @click="create">{{ $t('map.create') }}</el-button>
</el-button-group>
</div>
</div>
</template>
<script>
import ConfigList from '../config/list';
export default {
name:'CreateOperate',
components: {
ConfigList
},
props:{
createForm:{
type:Object,
required:true
},
addModel:{
type:Object,
required:true
},
createRules:{
type:Object,
required:true
}
},
methods:{
create() {
this.$refs['createForm'].validate((valid) => {
if (valid) {
this.$emit('create');
}
});
},
resetFields() {
this.$refs.createForm && this.$refs.createForm.resetFields();
},
resetForm() {
this.$refs.createForm.resetForm();
}
}
};
</script>

View File

@ -0,0 +1,67 @@
<template>
<div style="height:100%">
<div class="view-control-content">
<config-list ref="dataform" :form="form" :form-model="editModel" :rules="rules" />
</div>
<div class="button_box">
<el-button-group class="map-draft-group">
<el-button type="primary" size="small" @click="edit">{{ $t('map.updateObj') }}</el-button>
</el-button-group>
</div>
</div>
</template>
<script>
import ConfigList from '../config/list';
export default {
name:'OperateProperty',
components: {
ConfigList
},
props:{
form:{
type:Object,
required:true
},
editModel:{
type:Object,
required:true
},
rules:{
type:Object,
required:true
},
type:{
type:String,
required:true
}
},
data() {
return {
isDeleteHide:true
};
},
methods:{
//
edit() {
this.$refs['dataform'].validate((valid) => {
if (valid) {
const data = Object.assign({_type: this.type}, this.editModel);
if (this.type == 'Text') {
data.content = `${this.editModel.prepend}::${this.editModel.content}`;
}
this.$emit('updateMapModel', data);
this.$emit('clearDeviceSelect');
} else {
this.$message('还有属性未填写,修改未生效!');
}
});
},
resetFields() {
this.$refs.dataform && this.$refs.dataform.resetFields();
},
clearValidate() {
this.$refs.dataform && this.$refs.dataform.clearValidate();
}
}
};
</script>

View File

@ -0,0 +1,477 @@
<template>
<el-form ref="form" :label-width="form.labelWidth" size="mini" :rules="rules" :model="formModel" class="form_data">
<template v-for="(items, index) in form.items">
<fieldset v-if="items.item.length" :key="index" :class="items.name?'card':'noCard'">
<legend class="card_title">{{ items.name }}</legend>
<template v-for="item in items.item">
<template v-if="checkFieldType(item, 'select')">
<el-form-item :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-select
v-model="formModel[item.prop]"
filterable
:placeholder="item.placeholder"
:disabled="item.disabled"
:clearable="item.clearable"
@change="((val)=>{deviceChange(val, item)})"
>
<el-option
v-for="option in item.options"
:key="option[item.optionValue]"
:label="handleLabel(option, item.optionLabel)"
:value="option[item.optionValue]"
/>
</el-select>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'multiSelect')">
<el-form-item :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-select
v-model="formModel[item.prop]"
filterable
multiple
:placeholder="item.placeholder"
:disabled="item.disabled"
:clearable="item.clearable"
@change="((val)=>{deviceChange(val, item)})"
>
<el-option
v-for="option in item.options"
:key="option[item.optionValue]"
:label="handleLabel(option, item.optionLabel)"
:value="option[item.optionValue]"
/>
</el-select>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'selectHover')">
<el-form-item :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-select
v-model="formModel[item.prop]"
filterable
:placeholder="item.placeholder"
:disabled="item.disabled"
:clearable="item.clearable"
@change="((val)=>{deviceChange(val, item)})"
>
<el-option
v-for="option in item.options"
:key="option.code"
:label="handleLabel(option, item.optionLabel)"
:value="option.code"
/>
</el-select>
<el-button
:type="item.buttonShowType ? 'danger' : 'primary'"
@click="item.hover(item.buttonType)"
>{{ $t('map.activate') }}</el-button>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'multiSelectHover')">
<el-form-item :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-select
v-model="formModel[item.prop]"
filterable
multiple
:placeholder="item.placeholder"
:disabled="item.disabled"
:clearable="item.clearable"
@change="((val)=>{deviceChange(val, item)})"
>
<el-option
v-for="option in item.options"
:key="option.code"
:label="handleLabel(option, item.optionLabel)"
:value="option.code"
/>
</el-select>
<el-button
:type="item.buttonShowType ? 'danger' : 'primary'"
@click="item.hover(item.buttonType)"
>{{ $t('map.activate') }}</el-button>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'input')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-input v-model="formModel[item.prop]" type="text" :disabled="item.disabled" maxlength="30" :show-word-limit="true" @input="((val)=>{deviceChange(val, item)})" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'number')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<template v-if="!item.firstLevel">
<template>
<el-input-number v-model="formModel[item.prop]" :min="item.min" :max="item.max" :label="item.label" :disabled="item.disabled" style="width: 140px" @change="((val)=>{deviceChange(val,item)})" />
</template>
<span class="numberSpan">{{ item.placeholder }}</span>
<el-button v-if="item.button" type="primary" size="mini" class="numberBtn" @click="item.clickFunction">{{ item.buttonText }}</el-button>
</template>
<template v-else>
<el-input-number v-model="formModel[item.firstLevel][item.secondLevel]" :min="item.min" :max="item.max" :label="item.label" :disabled="item.disabled" />
<span class="numberSpan">{{ item.placeholder }}</span>
<el-button v-if="item.button" type="primary" size="mini" class="numberBtn" @click="item.clickFunction">{{ item.buttonText }}</el-button>
</template>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'color')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-color-picker v-model="formModel[item.prop]" show-alpha :predefine="skins" :disabled="item.disabled" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'radio')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-radio-group v-model="formModel[item.prop]" :disabled="item.disabled">
<el-radio v-for="(opts, indexs) in item.radioList" :key="indexs" :border="item.border" :label="opts[item.optionValue]">{{ opts[item.optionLabel] }}</el-radio>
</el-radio-group>
</el-form-item>
</template>
<!-- 坐标点并列显示 -->
<template v-if="checkFieldType(item, 'coordinate')">
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div v-for="opt in item.children" :key="opt.code" class="listWidth">
<el-form-item :label="opt.label" :prop="opt.prop" :label-width="opt.labelWidth">
<template>
<el-input-number v-model="formModel[opt.firstLevel][opt.secondLevel]" :label="opt.label" :disabled="opt.disabled" @change="((val)=>{deviceChange(val, opt)})" />
</template>
</el-form-item>
</div>
</div>
</template>
<template v-if="checkFieldType(item, 'sectionUnit')">
<div :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div class="point-section">
<template v-for="(sectionUnit, j) in formModel[item.prop]">
<div :key="j" class="sectionUnit">
<el-form-item label="左端区段" :prop="'sectionUnitList[' + j + '].leftCode'" label-width="70px">
<el-select v-model="sectionUnit.leftCode" filterable placeholder="请选择" clearable class="sectionUnitCode">
<el-option
v-for="elem in item.options"
:key="elem.code"
:label="elem.name"
:value="elem.code"
/>
</el-select>
<el-button
:type="item.buttonShowType && item.listIndex === ('leftCode' + j) ? 'danger' : 'primary'"
@click="item.hover(item.buttonType, `leftCode${j}`)"
>{{ $t('map.activate') }}</el-button>
</el-form-item>
<el-form-item label="右端区段" :prop="'sectionUnitList[' + j + '].rightCode'" label-width="70px">
<el-select v-model="sectionUnit.rightCode" filterable placeholder="请选择" clearable class="sectionUnitCode">
<el-option
v-for="elem in item.options"
:key="elem.code"
:label="elem.name"
:value="elem.code"
/>
</el-select>
<el-button
:type="item.buttonShowType && item.listIndex === ('rightCode' + j) ? 'danger' : 'primary'"
@click="item.hover(item.buttonType, `rightCode${j}`)"
>{{ $t('map.activate') }}</el-button>
<el-button type="success" icon="el-icon-plus" circle @click="item.addSectionUnit(j)" />
<el-button v-if="j" type="danger" icon="el-icon-delete" circle @click="item.delSectionUnit(j)" />
</el-form-item>
</div>
</template>
</div>
</div>
</template>
<!-- 多个坐标点绘制 -->
<template v-if="checkFieldType(item, 'points')">
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div class="point-section">
<template v-for="(point, j) in formModel[item.prop]">
<div :key="j" style="overflow: hidden;">
<span v-if="!item.hiddenSpan" class="pointsEach" :style="{'margin-right': j == 0 || j == formModel[item.prop].length - 1 ? '9px' : '5px'}">{{ j == 0 ? ' ' : j == formModel[item.prop].length - 1 ? ' ' : `中点${j}` }}</span>
<el-form-item
label=""
:prop="'points[' + j + '].x'"
class="pointsEachItem"
label-width="0px"
>
<el-input-number v-model="point.x" :disabled="item.pointDisabled" />
</el-form-item>
<span class="pointsEachNext">, </span>
<el-form-item
label=""
:prop="'points[' + j + '].y'"
class="pointsEachItem"
style="margin-right: 5px;"
label-width="4px"
>
<el-input-number v-model="point.y" :disabled="item.pointDisabled" />
</el-form-item>
<el-button
icon="el-icon-plus"
:disabled="item.pointDisabled"
circle
class="point-button"
@click="item.addPoint(j)"
/>
<el-button
icon="el-icon-minus"
:disabled="j == 0 || j == formModel[item.prop].length - 1"
circle
class="point-button"
style="margin-left: 4px;"
@click="item.delPoint(j)"
/>
</div>
</template>
</div>
</div>
</template>
<!-- 多个坐标点绘制 -->
<template v-if="checkFieldType(item, 'coordinatePoint')">
<div :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div class="point-section" :style="{ width: `calc(100% - 10px - ${item.width})` }">
<template v-for="(point, j) in formModel[item.prop]">
<div :key="j" style="overflow: hidden;">
<span style="display: table; margin-right: 6px; font-size: 14px; float: left; line-height: 28px;">{{ j + 1 }}.</span>
<el-form-item style="display: table; float: left;" label-width="0px">
<el-input-number v-model="point.x" :disabled="item.pointDisabled" />
</el-form-item>
<span style="display: table; margin-left: 8px; float: left; line-height: 28px;">, </span>
<el-form-item style="display: table; float: left; margin-right: 5px;" label-width="4px">
<el-input-number v-model="point.y" :disabled="item.pointDisabled" />
</el-form-item>
<el-button
icon="el-icon-plus"
:disabled="item.pointDisabled"
circle
class="point-button"
@click="item.addPoint(j)"
/>
<el-button
icon="el-icon-minus"
:disabled="j == 0"
circle
class="point-button"
style="margin-left: 4px;"
@click="item.delPoint(j)"
/>
</div>
</template>
</div>
</div>
</template>
<template v-if="checkFieldType(item, 'checkbox')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-checkbox v-model="formModel[item.prop]" :disabled="item.disabled" @change="((val)=>{deviceChange(val, item)})" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'font')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-font v-model="formModel[item.prop]" :disabled="item.disabled" :placeholder="item.placeholder" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'fontContent')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-input v-model="formModel[item.content]" :placeholder="item.placeholder" class="input-with-select">
<el-select slot="prepend" v-model="formModel[item.prepend]" :placeholder="item.placeholder">
<el-option :label="$t('map.horizontal')" value="H" />
<el-option :label="$t('map.vertical')" value="V" />
</el-select>
</el-input>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'lengthFact')">
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div class="point-section">
<template v-for="(elem, j) in formModel[item.prop]">
<div :key="j" style="overflow: hidden;">
<el-form-item :label="elem.name" :prop="'logicLengthList[' + j + '].lengthFact'" label-width="20px">
<el-input-number v-model="elem.lengthFact" :min="0" :precision="3" style="width: 120px;" /><span></span>
<el-button v-if="!j" type="primary" size="mini" style="margin-left: 20px;" @click="item.mergeLength">合并长度</el-button>
</el-form-item>
</div>
</template>
</div>
</div>
</template>
</template>
</fieldset>
</template>
<slot />
</el-form>
</template>
<script>
import ElFont from '@/views/components/font/index';
export default {
name: 'ConfigList',
components: {
ElFont
},
props: {
formModel: {
type: Object,
required: true
},
form: {
type: Object,
required: true
},
rules: {
type: Object,
default: function () {
return null;
}
}
},
data () {
return {
skins: []
};
},
methods: {
deviceChange(data, item) {
if (item.deviceChange) {
item.deviceChange(data);
}
},
handleLabel(option, label) {
if (label == 'name') {
return option.name;
} else if (label == 'code') {
return option.code;
} else if (label == 'label') {
return option.label;
} else if (label == 'name&&code') {
if (option.code) {
return option.name + ' (' + option.code + ')';
} else {
return option.name;
}
} else if (label == 'code&&name') {
return option.code + ' (' + option.name + ')';
} else {
return option.label;
}
},
decompose(item, prop) {
if (!prop.includes('.')) {
return prop;
}
const keyArr = prop.split('.');
return keyArr[0][keyArr[1]];
},
checkFieldType(field, type) {
if (field.hasOwnProperty('isHidden')) {
return field.type === type && !field.isHidden;
} else {
return field.type === type;
}
},
validate(callback) {
this.$refs.form.validate((valid) => {
if (valid) {
callback(true);
} else {
callback(false);
}
});
},
resetForm() {
this.$refs.form.resetFields();
},
clearValidate() {
this.$refs.form.clearValidate(); //
},
resetFields() {
this.$refs.form.resetFields(); //
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.coordinate {
overflow: hidden;
.title {
text-align: right;
font-size: 14px;
color: #606266;
line-height: 40px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 28px;
width: 120px;
font-weight: bold;
display: block;
float: left;
margin-right: 7px;
}
.listWidth{
display: table;
float: left;
margin-right: 20px;
&:last-child{
margin: 0;
}
}
}
.point-section {
float: left;
}
.point-button {
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
float: left;
/deep/ {
.el-icon-plus,
.el-icon-minus {
transform: translateY(0px);
}
}
}
.el-input-number--mini {
width: 110px;
}
.form_data{
padding: 6px 10px 10px 10px;
}
.card{
border: 1px solid #ccc;
margin-bottom: 5px;
.card_title {
padding: 0px 5px;
}
}
.noCard{
border: none;
margin-bottom: 0px;
padding: 0;
}
/deep/ {
.input-with-select .el-input-group__prepend {
background-color: #fff;
}
}
.numberSpan{padding-left: 1px;}
.numberBtn{margin-left: 20px;}
.sectionUnit{border: 1px solid #CCCCCC; border-radius: 5px;padding: 2px;padding-top: 10px;}
.sectionUnitCode{width: 115px;}
.pointsEach{display: table; margin-right: 3px; font-size: 14px; float: left; line-height: 28px;}
.pointsEachNext{display: table; margin-left: 8px; float: left; line-height: 28px;}
.pointsEachItem{display: table; float: left; }
</style>

View File

@ -0,0 +1,84 @@
<template>
<div>
<operate-property
ref="dataform"
:form="form"
:edit-model="editModel"
:rules="rules"
type="Line"
@updateMapModel="updateMapModel"
@clearDeviceSelect="clearDeviceSelect"
/>
</div>
</template>
<script>
import OperateProperty from './components/operateProperty';
import { mapGetters } from 'vuex';
export default {
name: 'Device',
components: {
OperateProperty
},
data() {
return {
editModel: {},
rules: {},
typeList: []
};
},
computed: {
...mapGetters('map', [
'signalList',
'sectionList',
'switchList',
'stationList',
'stationStandList'
]),
form () {
return {
labelWidth: '130px',
items: {
code: {
name: '',
item: []
},
draw: {
name: this.$t('map.drawData'),
item: [
{ prop: 'type', label: '类型', type: 'select', optionLabel: 'label', optionValue: 'value', options: this.typeList },
{ prop: 'code', label: this.$t('map.textCode'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.textList, deviceChange: this.deviceChange },
{ prop: 'position', label: this.$t('map.textPoints'), type: 'coordinate', width: '120px', children: [
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '25px', disabled: false },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '25px', disabled: false }
] }
]
},
map: {
name: this.$t('map.mapData'),
item: []
}
}
};
},
deviceList () {
return [];
}
},
methods: {
updateMapModel() {
},
clearDeviceSelect() {
},
deviceChange() {
}
}
};
</script>
<style scoped>
</style>

View File

@ -0,0 +1,236 @@
<template>
<transition name="el-zoom-in-center">
<div class="map-control">
<div class="map-operate">
<div class="draftMapName">
<span>{{ $t('map.mapName') }}</span>
<el-tooltip class="item" effect="dark" :content="mapInfo.name" placement="top">
<b>{{ mapInfo.name }}</b>
</el-tooltip>
</div>
<el-button v-if="isSave" type="text" style="padding: 3px 0;float: right;" :disabled="$attrs.mapSaveing" @click="saveMapEvent">{{ $t('map.save') }}</el-button>
</div>
<el-tabs v-model="enabledTab" class="mapEdit" type="card">
<el-tab-pane v-for="(each,index) in tabList" :key="index" :label="each.label" class="tab_pane_box" :name="each.name" :lazy="lazy">
<component
:is="each.menus"
:ref="each.name"
:selected="selected"
v-bind="$attrs"
v-on="$listeners"
@deviceSelect="deviceSelect"
/>
</el-tab-pane>
</el-tabs>
</div>
</transition>
</template>
<script>
import DeviceDraft from './device';
import MultiSelect from './multiSelect';
export default {
name: 'MapOperate',
components: {
},
props: {
selected: {
type: Object,
default: function () {
return null;
}
},
mapInfo: {
type: Object,
default: function() { return {name: this.$t('map.pleaseSelectMap')}; }
}
},
data() {
return {
lazy: true,
tabList:[
{label: '设备', name: 'device', menus: DeviceDraft},
{label: '多选', name: 'multiSelect', menus: MultiSelect}
],
selectDevice:'',
enabledTab: 'Line'
};
},
computed: {
isSave() {
return this.mapInfo && this.mapInfo.id;
}
},
watch: {
'$store.state.map.updateCount': function () {
this.$refs[this.enabledTab][0].edit();
},
selected(val) {
if (this.selected) {
this.$nextTick(() => {
this.$refs[this.enabledTab][0].deviceSelect(val);
});
}
}
},
mounted() {},
methods: {
handleSelectControlPage(device) {
const type = device._type;
if (this.selectDevice) {
this.enabledTab = this.selectDevice;
} else {
this.enabledTab = type;
}
},
deviceSelect(type) {
this.selectDevice = type;
},
saveMapEvent() {
this.$emit('saveMapEvent');
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.draftMapName{
width:280px;
overflow:hidden;
height:17px;
text-overflow:ellipsis;
white-space:nowrap;
}
.el-dropdown-link {
cursor: pointer;
color: #409EFF;
}
.el-icon-arrow-down {
font-size: 12px;
}
.map-control {
width: 100%;
height: 100%;
}
.operate-button{
padding: 3px 0;
margin-right: 5px;
}
// .physical-view {
// line-height: 25px;
// height: 118px;
// padding-left: 12px;
// .el-checkbox {
// width: 70px;
// margin: 0;
// margin-right: 30px;
// }
// }
.map-operate{
height: 47px;
padding: 15px;
display:flex;
}
.mapEdit{
height: calc(100% - 47px);
.tab_pane_box{
height: 100%;
}
}
/deep/ .button_box{
width: 100%;
background: #ffffff;
border-top: 1px #f3f1f1 solid;
box-shadow: 4px 7px 10px #565656;
border-radius: 0;
border-bottom: 1px transparent solid;
position:absolute;
bottom:0;
z-index:3;
}
/deep/ .view-control-content{
height:100%;
padding-bottom:46px;
overflow-y:auto;
}
/deep/ .map-draft-group {
float: right;
margin: 6px 5px;
}
/deep/ .view-control {
height:100%;
}
/deep/ {
.mapEdit .el-tabs__nav-wrap.is-scrollable {
padding: 0 20px;
}
.mapEdit .el-tabs__header .el-tabs__item.is-active {
border-bottom-color: #f5f7fa;
background: #f5f7fa;
}
.mapEdit .el-tabs__active-bar{
background: transparent;
}
.mapEdit .el-tabs__content {
height: calc(100% - 56px);
}
.card .el-tabs__nav .el-tabs__item.is-active {
border-bottom: 2px solid #E4E7ED;
background: #409eff;
color: #fff;
}
.card .el-tabs__nav .el-tabs__item{
padding: 0 20px!important;
}
.mapEdit .el-tabs__nav-prev {
width: 20px;
height: 41px;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 1px 1px 4px #ccc;
}
.mapEdit .el-tabs__nav-next {
width: 20px;
height: 41px;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 1px 1px 4px #ccc;
}
}
//
/deep/ {
.card .el-transfer-panel__filter{
margin: 5px 15px;
}
.card .el-transfer-panel__list.is-filterable{
height: 290px;
}
.card .el-transfer-panel__body{
height: 328px;
}
.card .el-transfer__buttons{
padding: 0 16px;
}
.card .el-transfer{
display: flex;
justify-content: center;
align-items: center;
}
}
</style>

View File

@ -0,0 +1,13 @@
<template>
</template>
<script>
export default {
name: "multiSelect"
}
</script>
<style scoped>
</style>

View File

@ -45,19 +45,19 @@
</div>
</template>
<script>
import { DeviceMenu } from '@/scripts/ConstDic'
import { listMap, deleteAllMap } from '@/api/jmap/mapdraft'
import { UrlConfig } from '@/scripts/ConstDic'
import { removeSessionStorage } from '@/utils/auth'
import MapOperateMenu from './mapmanage/operateMenu'
import MapImport from './mapmanage/mapImport'
import { getSessionStorage } from '@/utils/auth'
import { DeviceMenu } from '@/scripts/ConstDic';
import { listMap, deleteAllMap } from '@/api/jmap/mapdraft';
import { UrlConfig } from '@/scripts/ConstDic';
import { removeSessionStorage } from '@/utils/auth';
import MapOperateMenu from './mapmanage/operateMenu';
import MapImport from './mapmanage/mapImport';
import { getSessionStorage } from '@/utils/auth';
export default {
name: 'UserMapList',
components: {
MapOperateMenu,
MapImport,
MapImport
},
data() {
return {
@ -69,66 +69,66 @@ export default {
selected: {},
defaultProps: {
children: 'children',
label: 'name',
label: 'name'
},
point: {
x: 0,
y: 0,
y: 0
},
editModel: {},
lineCode: '',
loadingProjectList: ['login', 'design', 'xty', 'designxty', 'gzb', 'designxty', 'xadt', 'designxadt', 'drts', 'designdrts', 'hlsdrts', 'designhlsdrts'],
}
loadingProjectList: ['login', 'design', 'xty', 'designxty', 'gzb', 'designxty', 'xadt', 'designxadt', 'drts', 'designdrts', 'hlsdrts', 'designhlsdrts']
};
},
computed: {
project() {
return getSessionStorage('project')
},
return getSessionStorage('project');
}
},
watch: {
filterText(val) {
this.$refs.tree.filter(val)
},
this.$refs.tree.filter(val);
}
},
beforeDestroy() {
removeSessionStorage('demonList')
removeSessionStorage('demonList');
},
mounted() {
this.loadInitData()
this.loadInitData();
},
methods: {
filterNode(value, data) {
if (!value) return true
return data.name.indexOf(value) !== -1
if (!value) return true;
return data.name.indexOf(value) !== -1;
},
createMap() {
this.$emit('createMap')
this.$emit('createMap');
},
deleteAllMap() {
this.$confirm('确定删除全部地图数据?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
type: 'warning'
})
.then(() => {
deleteAllMap().then(res => {
this.$message({
type: 'success',
message: '删除成功!',
message: '删除成功!'
});
this.loadInitData();
});
})
this.loadInitData()
})
})
.catch(e => {})
.catch(e => {});
},
async loadInitData() {
this.loading = true
this.treeData = this.treeList = []
this.loading = true;
this.treeData = this.treeList = [];
try {
const res = await listMap({ drawWay: true })
const res = await listMap({ drawWay: true });
res.data &&
res.data.forEach(elem => {
elem.type = 'map'
elem.type = 'map';
elem.children = [
{
id: '1',
@ -136,7 +136,7 @@ export default {
type: 'mapDesign',
mapId: elem.id,
mapName: elem.name,
lineCode: elem.lineCode,
lineCode: elem.lineCode
},
{
id: '2',
@ -144,74 +144,91 @@ export default {
type: 'mapSystem',
mapId: elem.id,
mapName: elem.name,
lineCode: elem.lineCode,
lineCode: elem.lineCode
},
]
})
this.treeData = res.data
{
id: '3',
name: '画面管理',
type: 'mapPicture',
mapId: elem.id,
mapName: elem.name,
lineCode: elem.lineCode
}
];
});
this.treeData = res.data;
this.treeList = this.filterText
? res.data.filter(elem => {
return elem.name.includes(this.filterText)
return elem.name.includes(this.filterText);
})
: res.data
this.loading = false
: res.data;
this.loading = false;
} catch (error) {
this.loading = false
this.$messageBox(this.$t('error.refreshFailed'))
this.loading = false;
this.$messageBox(this.$t('error.refreshFailed'));
}
},
clickEvent(obj, data, ele) {
switch (obj.type) {
case 'mapDesign': {
if (this.loadingProjectList.includes(this.project)) {
this.$store.dispatch('app/transitionAnimations')
this.$store.dispatch('app/transitionAnimations');
}
this.$router.push({
path: `${UrlConfig.newDesignuser.mapDraw}/${obj.mapId}/draft`,
query: { name: obj.mapName, lineCode: obj.lineCode },
})
break
query: { name: obj.mapName, lineCode: obj.lineCode }
});
break;
}
case 'mapSystem': {
if (this.loadingProjectList.includes(this.project)) {
this.$store.dispatch('app/transitionAnimations')
this.$store.dispatch('app/transitionAnimations');
}
this.$router.push({
path: `/design/usermap/map/systemDraw/${obj.mapId}/draft`,
query: { name: obj.mapName, lineCode: obj.lineCode },
})
break
query: { name: obj.mapName, lineCode: obj.lineCode }
});
break;
}
case 'mapPicture': {
if (this.loadingProjectList.includes(this.project)) {
this.$store.dispatch('app/transitionAnimations');
}
this.$router.push({
path: `/design/usermap/map/pictureDraw/${obj.mapId}/draft`,
query: { name: obj.mapName, lineCode: obj.lineCode }
});
break;
}
}
},
showContextMenu(e, obj, node, vueElem) {
this.$refs.tree.setCurrentKey(obj.id)
this.$refs.tree.currentNode = node
this.$refs.tree.setCurrentKey(obj.id);
this.$refs.tree.currentNode = node;
if (obj && obj.type == 'map') {
e.preventDefault()
const menu = DeviceMenu.Map
e.preventDefault();
const menu = DeviceMenu.Map;
this.point = {
x: e.clientX,
y: e.clientY,
}
this.editModel = obj
this.editModel.lineCode = obj.lineCode
this.$store.dispatch('menuOperation/setPopMenu', { position: this.point, menu: menu })
y: e.clientY
};
this.editModel = obj;
this.editModel.lineCode = obj.lineCode;
this.$store.dispatch('menuOperation/setPopMenu', { position: this.point, menu: menu });
}
},
jlmap3d() {
this.$router.push({ path: '/design/jlmap3d/edit', query: { mapid: this.editModel.id } })
this.$router.push({ path: '/design/jlmap3d/edit', query: { mapid: this.editModel.id } });
},
assetmanager3d() {
this.$router.push({ path: '/design/jlmap3d/assetmanager' })
this.$router.push({ path: '/design/jlmap3d/assetmanager' });
},
importMap() {
this.$refs.mapImport.show()
},
},
}
this.$refs.mapImport.show();
}
}
};
</script>
<style lang="scss" scoped>
.clearfix {

View File

@ -1,5 +1,5 @@
<template>
<div style="border: 1px solid #000000;margin-top: 20px;padding: 20px;">
<div style="border: 1px solid #000000;margin-top: 20px;padding: 20px;background: #9df59b;">
<div style="text-align: center;font-size: 28px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
<div style="font-size: 14px;margin-top: 15px;display: flex;align-items: center;margin-bottom: 20px;justify-content: end;">
<div></div>

View File

@ -1,5 +1,5 @@
<template>
<div style="border: 1px solid #000000;margin-top: 20px;padding: 20px;">
<div style="border: 1px solid #000000;margin-top: 20px;padding: 20px;background: #e799d8;">
<div style="text-align: center;font-size: 28px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
<div style="font-size: 14px;margin-top: 15px;display: flex;align-items: center;margin-bottom: 20px;justify-content: end;">
<div></div>

View File

@ -31,6 +31,9 @@
<el-input v-model="ticketForm.no" size="small" :disabled="switchFlag" style="width: 80px;" />
</div>
</div>
<div style="text-align: center;">
<!-- <el-select v-model=""></el-select>-->
</div>
</div>
</template>