293 lines
12 KiB
Vue
293 lines
12 KiB
Vue
|
<template>
|
||
|
|
<el-dialog
|
||
|
|
title="子系统管理"
|
||
|
|
:visible.sync="dialogVisible"
|
||
|
|
width="60%"
|
||
|
|
center
|
||
|
|
>
|
||
|
|
<el-button type="primary" size="small" style="position: relative;left: 90%;margin-bottom: 10px;" @click="handleAddSubsystem">新增</el-button>
|
||
|
|
<el-table v-loading="loading" :data="tableData" border style="width: 100%">
|
||
|
|
<el-table-column prop="name" label="名称" />
|
||
|
|
<el-table-column prop="simType" label="类型">
|
||
|
|
<template slot-scope="scope">
|
||
|
|
<span>{{ simTypeMap[scope.row.simType] }}</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="simUsage" label="使用方式">
|
||
|
|
<template slot-scope="scope">
|
||
|
|
<span>{{ simUsageMap[scope.row.simUsage] }}</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="desc" label="描述" width="400px" />
|
||
|
|
<el-table-column label="操作">
|
||
|
|
<template slot-scope="scope">
|
||
|
|
<el-button type="text" size="small" @click="updateRow(scope.row)">更新</el-button>
|
||
|
|
<el-button type="text" size="small" @click="deleteRow(scope.row)">删除</el-button>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
<el-dialog
|
||
|
|
width="30%"
|
||
|
|
:title="innerTitle"
|
||
|
|
:visible.sync="innerVisible"
|
||
|
|
center
|
||
|
|
append-to-body
|
||
|
|
>
|
||
|
|
<el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="120px" class="demo-ruleForm">
|
||
|
|
<el-form-item label="子系统名称：" prop="name">
|
||
|
|
<el-input v-model="ruleForm.name" style="width: 200px;" />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="类型：" prop="type">
|
||
|
|
<el-select v-model="ruleForm.type" placeholder="请选择类型">
|
||
|
|
<el-option label="地铁" value="METRO" />
|
||
|
|
<el-option label="铁路/大铁" value="RAILWAY" />
|
||
|
|
<el-option label="应急调度" value="EMERGENCY" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="使用方式：" prop="usage">
|
||
|
|
<el-select v-model="ruleForm.usage" placeholder="请选择使用方式">
|
||
|
|
<el-option label="单角色仿真" value="SINGLE_MEMBER" />
|
||
|
|
<el-option label="单客户端仿真" value="SINGLE_CLIENT" />
|
||
|
|
<el-option label="综合演练" value="JOINT" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item v-if="ruleForm.usage === 'SINGLE_MEMBER' || ruleForm.usage === 'JOINT'" label="角色：" prop="memberType">
|
||
|
|
<el-select v-model="ruleForm.memberType" placeholder="请选择角色">
|
||
|
|
<el-option v-for="option in roleList" :key="option.value" :label="option.label" :value="option.value" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item v-if="stationRoles.includes(ruleForm.memberType)" label="车站：" prop="deviceCode">
|
||
|
|
<el-select v-model="ruleForm.deviceCode" placeholder="请选择设备">
|
||
|
|
<el-option v-for="option in stationList" :key="option.code" :label="option.name" :value="option.code" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item v-if="ruleForm.memberType === 'DRIVER'" label="列车：" prop="deviceCode">
|
||
|
|
<el-select v-model="ruleForm.deviceCode" placeholder="请选择设备">
|
||
|
|
<el-option v-for="option in trainList" :key="option.code" :label="option.code" :value="option.code" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item v-if="ruleForm.usage === 'SINGLE_CLIENT'" label="客户端：" prop="client">
|
||
|
|
<el-select v-model="ruleForm.client" placeholder="请选择使用客户端">
|
||
|
|
<el-option label="联锁" value="INTERLOCK" />
|
||
|
|
<el-option label="大屏" value="BIG_SCREEN" />
|
||
|
|
<el-option label="综合监控" value="ISCS" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="功能：" prop="function">
|
||
|
|
<el-select v-model="ruleForm.function" placeholder="请选择功能">
|
||
|
|
<el-option label="大客流" value="LPF" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="描述：" prop="desc">
|
||
|
|
<el-input
|
||
|
|
v-model="ruleForm.desc"
|
||
|
|
type="textarea"
|
||
|
|
:rows="2"
|
||
|
|
placeholder="请输入内容"
|
||
|
|
/>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
<span slot="footer" class="dialog-footer">
|
||
|
|
<el-button @click="closeInner">取 消</el-button>
|
||
|
|
<el-button type="primary" @click="commit">确 定</el-button>
|
||
|
|
</span>
|
||
|
|
</el-dialog>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { getStationListNeedAttendant } from '@/api/jmap/map';
|
||
|
|
import { queryMapSystemList, updateMapSystem, createMapSystem, deleteMapSystem } from '@/api/trainingPlatform';
|
||
|
|
export default {
|
||
|
|
name: 'Subsystem',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
dialogVisible: false,
|
||
|
|
tableData: [],
|
||
|
|
mapId: '',
|
||
|
|
loading: false,
|
||
|
|
innerVisible: false,
|
||
|
|
mapSystemId: '',
|
||
|
|
stationList: [],
|
||
|
|
trainList: [],
|
||
|
|
innerTitle: '',
|
||
|
|
ruleForm: {
|
||
|
|
name: '',
|
||
|
|
type: '',
|
||
|
|
usage: '',
|
||
|
|
memberType: '',
|
||
|
|
deviceCode: '',
|
||
|
|
client: '',
|
||
|
|
function: ''
|
||
|
|
},
|
||
|
|
simTypeMap: {
|
||
|
|
METRO: '地铁',
|
||
|
|
RAILWAY: '铁路/大铁',
|
||
|
|
EMERGENCY: '应急调度'
|
||
|
|
},
|
||
|
|
simUsageMap: {
|
||
|
|
SINGLE_MEMBER: '单角色仿真',
|
||
|
|
SINGLE_CLIENT: '单客户端仿真',
|
||
|
|
JOINT: '综合演练'
|
||
|
|
},
|
||
|
|
stationRoles: ['STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_MASTER', 'STATION_SIGNALER', 'STATION_PASSENGER', 'STATION_SWITCH_MAN',
|
||
|
|
'STATION_FACILITATOR', 'STATION_WORKER', 'TRAIN_MASTER'],
|
||
|
|
rules: {
|
||
|
|
name: [
|
||
|
|
{ required: true, message: '请输入子系统名称', trigger: 'blur' }
|
||
|
|
],
|
||
|
|
type: [
|
||
|
|
{ required: true, message: '请选择子系统类型', trigger: 'change' }
|
||
|
|
],
|
||
|
|
usage: [
|
||
|
|
{ required: true, message: '请选择使用方式', trigger: 'change' }
|
||
|
|
]
|
||
|
|
},
|
||
|
|
roleList: [
|
||
|
|
{label: '行调', value: 'DISPATCHER'},
|
||
|
|
{label: '行值', value: 'STATION_SUPERVISOR'},
|
||
|
|
{label: '司机', value: 'DRIVER'},
|
||
|
|
{label: '通号', value: 'MAINTAINER'},
|
||
|
|
{label: '车辆段信号楼', value: 'DEPOT_DISPATCHER'},
|
||
|
|
{label: '停车场信号楼', value: 'PARKING_LOT_SIGNAL_BUILDING'},
|
||
|
|
{label: '车站助理', value: 'STATION_ASSISTANT'},
|
||
|
|
{label: '车站站长', value: 'STATION_MASTER'},
|
||
|
|
{label: '车站信号员', value: 'STATION_SIGNALER'},
|
||
|
|
{label: '车站客运员', value: 'STATION_PASSENGER'},
|
||
|
|
{label: '车站扳道员', value: 'STATION_SWITCH_MAN'},
|
||
|
|
{label: '车站引导员', value: 'STATION_FACILITATOR'},
|
||
|
|
{label: '车站工务工', value: 'STATION_WORKER'},
|
||
|
|
{label: '车务段段长', value: 'TRAIN_MASTER'}
|
||
|
|
]
|
||
|
|
};
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
handleAddSubsystem() {
|
||
|
|
this.innerTitle = '创建子系统';
|
||
|
|
this.innerVisible = true;
|
||
|
|
},
|
||
|
|
doShow(data) {
|
||
|
|
if (data && data.id) {
|
||
|
|
this.mapId = data.id;
|
||
|
|
this.stationList = [];
|
||
|
|
getStationListNeedAttendant(data.id).then(resp => {
|
||
|
|
if (resp.data && resp.data.length) {
|
||
|
|
this.stationList = resp.data;
|
||
|
|
}
|
||
|
|
}).catch(() => {
|
||
|
|
this.$message.error('获取车站列表失败');
|
||
|
|
});
|
||
|
|
this.reload();
|
||
|
|
this.dialogVisible = true;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
reload() {
|
||
|
|
this.loading = true;
|
||
|
|
this.tableData = [];
|
||
|
|
queryMapSystemList({mapId: this.mapId}).then(resp => {
|
||
|
|
if (resp.data && resp.data.length) {
|
||
|
|
this.tableData = resp.data;
|
||
|
|
}
|
||
|
|
this.loading = false;
|
||
|
|
}).catch(() => {
|
||
|
|
this.loading = false;
|
||
|
|
this.$message.error('获取地图系统列表！');
|
||
|
|
});
|
||
|
|
},
|
||
|
|
doClose() {
|
||
|
|
this.dialogVisible = false;
|
||
|
|
},
|
||
|
|
deleteRow(row) {
|
||
|
|
this.$confirm('删除子系统，是否继续？', '提 示', {
|
||
|
|
confirmButtonText: '确 定',
|
||
|
|
cancelButtonText: '取 消',
|
||
|
|
type: 'warning'
|
||
|
|
}).then(() => {
|
||
|
|
deleteMapSystem(row.id).then(resp => {
|
||
|
|
this.reload();
|
||
|
|
}).catch(error => {
|
||
|
|
this.$message.error(`删除子系统: ${error.message}`);
|
||
|
|
});
|
||
|
|
}).catch( () => { });
|
||
|
|
},
|
||
|
|
updateRow(row) {
|
||
|
|
this.mapSystemId = row.id;
|
||
|
|
this.ruleForm.name = row.name;
|
||
|
|
this.ruleForm.desc = row.desc;
|
||
|
|
this.ruleForm.type = row.paramVO.type;
|
||
|
|
this.ruleForm.usage = row.paramVO.usageInfo.usage;
|
||
|
|
this.ruleForm.client = row.paramVO.usageInfo.param.client;
|
||
|
|
this.ruleForm.memberType = row.paramVO.usageInfo.param.memberType;
|
||
|
|
this.ruleForm.deviceCode = row.paramVO.usageInfo.param.deviceCode;
|
||
|
|
const functionList = Object.keys(row.paramVO.functionMap);
|
||
|
|
if (functionList && functionList.length) {
|
||
|
|
this.ruleForm.function = functionList[0];
|
||
|
|
}
|
||
|
|
this.innerTitle = '修改子系统';
|
||
|
|
this.innerVisible = true;
|
||
|
|
},
|
||
|
|
commit() {
|
||
|
|
const functionMap = {};
|
||
|
|
if (this.ruleForm.function) {
|
||
|
|
functionMap[this.ruleForm.function] = null;
|
||
|
|
}
|
||
|
|
const data = {
|
||
|
|
mapId: this.mapId,
|
||
|
|
name: this.ruleForm.name,
|
||
|
|
desc: this.ruleForm.desc,
|
||
|
|
paramVO: {
|
||
|
|
type: this.ruleForm.type,
|
||
|
|
usageInfo: {
|
||
|
|
usage: this.ruleForm.usage,
|
||
|
|
param: {
|
||
|
|
client: this.ruleForm.client,
|
||
|
|
memberType: this.ruleForm.memberType,
|
||
|
|
deviceCode: this.ruleForm.deviceCode
|
||
|
|
}
|
||
|
|
},
|
||
|
|
functionMap: functionMap
|
||
|
|
}
|
||
|
|
};
|
||
|
|
if (this.innerTitle === '创建子系统') {
|
||
|
|
createMapSystem(data).then(resp => {
|
||
|
|
this.innerVisible = false;
|
||
|
|
this.reload();
|
||
|
|
this.$message.success('创建子系统成功！');
|
||
|
|
this.closeInner();
|
||
|
|
}).catch(() => {
|
||
|
|
this.$message.error('创建子系统失败！');
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
data.id = this.mapSystemId;
|
||
|
|
updateMapSystem(data).then(resp => {
|
||
|
|
this.innerVisible = false;
|
||
|
|
this.reload();
|
||
|
|
this.closeInner();
|
||
|
|
this.$message.success('修改子系统成功！');
|
||
|
|
}).catch(() => {
|
||
|
|
this.$message.error('修改子系统失败！');
|
||
|
|
});
|
||
|
|
}
|
||
|
|
},
|
||
|
|
closeInner() {
|
||
|
|
this.mapSystemId = '';
|
||
|
|
this.ruleForm = {
|
||
|
|
name: '',
|
||
|
|
type: '',
|
||
|
|
usage: '',
|
||
|
|
memberType: '',
|
||
|
|
deviceCode: '',
|
||
|
|
client: '',
|
||
|
|
function: ''
|
||
|
|
};
|
||
|
|
this.innerVisible = false;
|
||
|
|
this.$refs.ruleForm.resetFields();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
|
||
|
|
</style>
|