添加地图功能配置项
This commit is contained in:
fan
parent
cc285801f6
commit
dd935f0aec
@ -31,6 +31,7 @@
|
||||
@generateCIEvent="generateCIEvent"
|
||||
@updateMapModel="updateMapModel"
|
||||
@generateDepotCiEvent="generateDepotCiEvent"
|
||||
@setMapFunctionConfig="setMapFunctionConfig"
|
||||
@setCenter="setCenter"
|
||||
@selectView="selectViewDraft"
|
||||
@showMap="showMap"
|
||||
@ -48,6 +49,7 @@
|
||||
</div>
|
||||
<config-map ref="configMap" @handleSelectPhysicalView="handleSelectPhysicalView" />
|
||||
<ci-config ref="ciConfig" />
|
||||
<map-function-config ref="mapFunctionConfig" />
|
||||
<depot-station ref="depotStation" />
|
||||
<pop-menu ref="popMenu" :menu="menu" />
|
||||
<check-config ref="checkConfig" @checkOver="checkOver" />
|
||||
@ -67,6 +69,7 @@ import CheckConfig from './checkConfig';
|
||||
import ElementImport from './elementImport';
|
||||
import PopMenu from '@/components/PopMenu';
|
||||
import DepotStation from './depotStation';
|
||||
import mapFunctionConfig from './mapFunctionConfig';
|
||||
|
||||
import ConfigMap from './configMap';
|
||||
|
||||
@ -83,7 +86,8 @@ export default {
|
||||
PopMenu,
|
||||
CheckConfig,
|
||||
ElementImport,
|
||||
DepotStation
|
||||
DepotStation,
|
||||
mapFunctionConfig
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@ -312,6 +316,9 @@ export default {
|
||||
generateDepotCiEvent() {
|
||||
this.$refs.depotStation.doShow();
|
||||
},
|
||||
setMapFunctionConfig() {
|
||||
this.$refs.mapFunctionConfig.show();
|
||||
},
|
||||
handleSelectControlPage(model) {
|
||||
if (this.$refs.mapOperate) {
|
||||
this.$refs.mapOperate.handleSelectControlPage(model);
|
||||
|
||||
218
src/views/newMap/newMapdraft/mapFunctionConfig.vue
Normal file
218
src/views/newMap/newMapdraft/mapFunctionConfig.vue
Normal file
@ -0,0 +1,218 @@
|
||||
<template>
|
||||
<div v-show="dialogVisible">
|
||||
<el-dialog v-dialogDrag title="请确认地图功能配置项" :visible.sync="dialogVisible" fullscreen :before-close="handleClose" center :close-on-click-modal="false" :z-index="2000" append-to-body>
|
||||
<div style="overflow-y: scroll;" :style="{height: height+ 'px'}">
|
||||
<el-card style="margin-top: 10px">
|
||||
<div slot="header" style="font-weight: bold;text-align: center;">
|
||||
<span>地图功能配置项</span>
|
||||
</div>
|
||||
<el-table :data="roadData" style="width: 100%;">
|
||||
<el-table-column prop="configKey" label="key" />
|
||||
<el-table-column prop="configValue" label="value">
|
||||
<template slot-scope="scope">
|
||||
<div v-if="scope.row.type === 'input'">
|
||||
<div v-if="!scope.row.focus" style="width: 100%;cursor: pointer;" @click="changeFocus(scope.row, '1')">{{ scope.row.configValue }}</div>
|
||||
<el-input v-if="scope.row.focus" v-model="scope.row.configValue" size="mini" style="width: 100%" @blur="changeFocus(scope.row, '0')" />
|
||||
</div>
|
||||
<div v-else-if="scope.row.type === 'number'">
|
||||
<div v-if="!scope.row.focus" style="width: 100%;cursor: pointer" @click="changeFocus(scope.row, '1')">{{ scope.row.configValue }}</div>
|
||||
<el-input-number v-if="scope.row.focus" v-model="scope.row.configValue" size="mini" style="width: 100px;" :min="0" controls-position="right" @blur="changeFocus(scope.row, '0')" />
|
||||
</div>
|
||||
<div v-else-if="scope.row.type === 'boolean'">
|
||||
<el-radio v-model="scope.row.configValue" :label="trueValue">是</el-radio>
|
||||
<el-radio v-model="scope.row.configValue" :label="falseValue">否</el-radio>
|
||||
</div>
|
||||
<div v-else-if="scope.row.type === 'select'">
|
||||
<el-select v-model="scope.row.configValue" size="mini" style="width: 80px;">
|
||||
<el-option
|
||||
v-for="item in scope.row.options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div v-else-if="scope.row.type === 'multiple'">
|
||||
<div v-if="!scope.row.focus" style="width: 100%;cursor: pointer;height: 20px;" @click="changeFocus(scope.row, '1')">
|
||||
<template v-for="(item, i) in scope.row.configValue">
|
||||
<el-tag :key="i" size="mini">{{ getMultipleName(item, scope.row.options) }}</el-tag>
|
||||
</template>
|
||||
</div>
|
||||
<el-select v-if="scope.row.focus" v-model="scope.row.configValue" size="mini" multiple placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in scope.row.options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" label="描述" />
|
||||
</el-table>
|
||||
</el-card>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" :loading="loading" @click="save">{{ $t('global.confirm') }}</el-button>
|
||||
<el-button :loading="loading" @click="dialogVisible = false">{{ $t('global.cancel') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { saveMap } from '@/api/jmap/mapdraft';
|
||||
import { mapGetters } from 'vuex';
|
||||
export default {
|
||||
name: 'Config',
|
||||
components: {
|
||||
// EditConfig
|
||||
},
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default() {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
dialogVisible: false,
|
||||
index: 0,
|
||||
trueValue: true,
|
||||
falseValue: false,
|
||||
id: '',
|
||||
height: 800,
|
||||
roadData: [],
|
||||
focus: false,
|
||||
booleanList: ['hasCTC', 'hasTDCS'],
|
||||
multipleList: [],
|
||||
selectList: [],
|
||||
numberList: [],
|
||||
optionsMap: {
|
||||
},
|
||||
remarkMap: {
|
||||
hasCTC: '有CTC系统？（大铁）',
|
||||
hasTDCS: '有TDCS系统？（大铁）'
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'stationList'
|
||||
])
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
async show() {
|
||||
this.optionsMap.sharingECStations = [];
|
||||
this.stationList.forEach(item => {
|
||||
this.optionsMap.sharingECStations.push({ value: item.code, label: item.name });
|
||||
});
|
||||
this.dialogVisible = true;
|
||||
this.height = document.documentElement.clientHeight - 180;
|
||||
const map = this.$store.state.map.map;
|
||||
this.getList(map.mapFunctionConfig);
|
||||
},
|
||||
changeFocus(row, flag) {
|
||||
if (flag === '0') {
|
||||
this.$set(row, 'focus', false);
|
||||
} else {
|
||||
this.$set(row, 'focus', true);
|
||||
}
|
||||
},
|
||||
getMultipleName(value, options) {
|
||||
const obj = options.find(item => {
|
||||
return item.value === value;
|
||||
});
|
||||
return (obj || {}).label;
|
||||
},
|
||||
async getList(data) {
|
||||
try {
|
||||
if (data) {
|
||||
const keys = Object.keys(data);
|
||||
this.roadData = [];
|
||||
keys.forEach(key => {
|
||||
let type = 'input';
|
||||
let options = [];
|
||||
if (this.booleanList.indexOf(key) >= 0) {
|
||||
type = 'boolean';
|
||||
} else if (this.selectList.indexOf(key) >= 0) {
|
||||
type = 'select';
|
||||
options = this.optionsMap[key];
|
||||
} else if (this.numberList.indexOf(key) >= 0) {
|
||||
type = 'number';
|
||||
} else if (this.multipleList.indexOf(key) >= 0) {
|
||||
type = 'multiple';
|
||||
options = this.optionsMap[key];
|
||||
} else {
|
||||
type = 'input';
|
||||
}
|
||||
const param = {
|
||||
configKey: key,
|
||||
configValue: data[key],
|
||||
type: type,
|
||||
options: options,
|
||||
remark: this.remarkMap[key]
|
||||
};
|
||||
this.roadData.push(param);
|
||||
});
|
||||
} else {
|
||||
this.roadData = [];
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
handleClose(done) {
|
||||
if (done) {
|
||||
done();
|
||||
} else {
|
||||
this.dialogVisible = false;
|
||||
}
|
||||
},
|
||||
addModel() {
|
||||
this.$refs.addConfig.show();
|
||||
},
|
||||
editModel(item, index) {
|
||||
this.$refs.editConfig.show(item);
|
||||
this.index = index;
|
||||
},
|
||||
save() {
|
||||
this.loading = true;
|
||||
const map = this.$store.state.map.map;
|
||||
this.$store.dispatch('map/saveMapDeviceDefaultRelations').then(() => {
|
||||
const param = {};
|
||||
this.roadData.forEach(item => {
|
||||
param[item.configKey] = item.configValue;
|
||||
});
|
||||
saveMap(Object.assign(map, {mapFunctionConfig: param, mapId: this.$route.params.mapId})).then(response => {
|
||||
this.dialogVisible = false;
|
||||
this.loading = false;
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$messageBox(this.$t('map.updateFailed'));
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.icon_font{
|
||||
font-size: 18px;
|
||||
margin-left: 15px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.flex_box{
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
<el-dropdown-item><div @click="showLocalConfig">现地配置</div></el-dropdown-item>
|
||||
<el-dropdown-item><div @click="showScreenConfig">大屏配置</div></el-dropdown-item>
|
||||
<el-dropdown-item><div @click="showDepotConfig">车辆段配置</div></el-dropdown-item>
|
||||
<el-dropdown-item><div @click="showDepotConfig">地图配置</div></el-dropdown-item>
|
||||
<el-dropdown-item><div @click="setMapFunctionConfig">地图配置</div></el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<el-dropdown class="operate-button" trigger="click">
|
||||
@ -244,6 +244,9 @@ export default {
|
||||
generateCIEvent() {
|
||||
this.$emit('generateCIEvent');
|
||||
},
|
||||
setMapFunctionConfig() {
|
||||
this.$emit('setMapFunctionConfig');
|
||||
},
|
||||
generateDepotCiEvent() {
|
||||
this.$emit('generateDepotCiEvent');
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user