joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

地图列表获取城市列表样式调整

Browse Source
This commit is contained in:
joylink_cuiweidong 2019-10-18 16:57:40 +08:00
parent 5e83d06250
commit 1b342fee6e
6 changed files with 40 additions and 161 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/designPlatform.js
View File

@ -177,3 +177,12 @@ export function loadDraftScript(scriptId, memberId, group) {
method: 'post'
});
}
/** 获取已发布的有地图的城市列表*/
export function publisMapCityList(data) {
return request({
url: `/api/map/city?dicCode=${data}`,
method: 'get'
});
}

161
src/views/components/filterCity/index.vue
View File

@ -1,16 +1,6 @@
<template>
<div class="filter">
<template v-if="isCascader">
<el-cascader
v-model="filterSelect"
:size="size"
popper-class="cascader"
:options="filterOptions"
:placeholder="$t('global.chooseCityAndRoute')"
@change="filterSelectChange"
/>
</template>
<template v-else>
<template>
<el-select v-model="filterSelect" :size="size" popper-class="select" @change="filterSelectChange">
<el-option v-for="item in filterOptions" :key="item.code" :label="item.name" :value="item.code" />
</el-select>
@ -21,7 +11,7 @@
<script>
import { setUserConfigInfo } from '@/api/management/user';
import { listPublishMap } from '@/api/jmap/map';
import {getUserMapTree} from '@/api/designPlatform';
import {getUserMapTree,publisMapCityList} from '@/api/designPlatform';
import { getPublishMapTree } from '@/api/management/mapprd';
import localStore from 'storejs';
@ -35,12 +25,6 @@ export default {
return 'medium';
}
},
isCascader: {
type: Boolean,
default() {
return false;
}
},
filterEmpty: {
type: Boolean,
default() {
@ -50,6 +34,10 @@ export default {
queryFunction: {
type: Function,
required: true
},
localParamName:{
type:String,
required: true
}
},
data() {
@ -62,148 +50,27 @@ export default {
this.loadInitData();
},
methods: {
loadFirstLevelFilterOptions(cityList, mapDict) {
this.filterSelect = '000000';
// 根据mapDict过滤filterOptions
cityList.forEach(elem => {
if (this.filterEmpty && (mapDict[elem.code] || elem.code === this.filterSelect)) {
// 如果需要过滤，则过滤掉mapDict不存在的数据，特殊保存'000000'
this.filterOptions.push({ code: elem.code, name: elem.name });
} else if (!this.filterEmpty) {
// 如果不需要过滤，则直接添加filterOptions
this.filterOptions.push({ code: elem.code, name: elem.name });
}
});
if (this.filterEmpty && mapDict[localStore.get('_cityCode')] || !this.filterEmpty && localStore.get('_cityCode')) {
this.filterSelect = localStore.get('_cityCode');
} else if (this.filterEmpty && mapDict[localStore.get('cityCode')] || !this.filterEmpty && localStore.get('cityCode')) {
this.filterSelect = localStore.get('cityCode');
}
this.$emit('filterSelectChange', this.filterSelect);
},
loadSecondLevelFilterOptions(cityList, mapDict, nodeList) {
this.filterSelect = ['000000', ''];
if (nodeList && nodeList.length > 0) {
cityList.forEach(city => {
// 构造联动子选项
const cityNode = {
value: city.code,
label: city.name,
children: []
};
nodeList.forEach(node => {
if (this.filterEmpty && mapDict[node.id] || !this.filterEmpty) {
if (node.cityCode === city.code) {
cityNode.children.push({ value: node.id, label: node.name });
}
if (!this.filterSelect[1] && node.cityCode === this.filterSelect[0]) {
this.filterSelect[1] = node.id;
}
}
});
if (this.filterEmpty && cityNode.children.length > 0 || !this.filterEmpty) {
this.filterOptions.push(cityNode);
}
});
}
if (localStore.get('cityCode') && localStore.get('mapId')) {
this.filterSelect = [localStore.get('cityCode'), localStore.get('mapId')];
}
this.$emit('filterSelectChange', this.filterSelect);
},
async loadInitData() {
// 获取城市列表
this.filterOptions=[];
const resp = await this.$Dictionary.cityType();
let resp = this.$route.fullPath.includes('design/userlist')?await this.$Dictionary.cityType():await publisMapCityList('city_type');
resp=this.$route.fullPath.includes('design/userlist')?resp:resp.data;
const cityList = resp.sort((a, b) => {
return a.code.localeCompare(b.code);
});
if (this.isCascader) {
// 设置二级联动组件
const mapDict = {};
const response = await listPublishMap();
const nodeList = response.data;
if (nodeList && nodeList.length > 0) {
// 如果需要过滤的处理
if (this.filterEmpty && this.queryFunction) {
// 根据mapDict过滤filterOptions
for (var j = 0; j < nodeList.length; j++) {
const response = await this.queryFunction({ mapId: nodeList[j].id } || '');
const mapList = response.data;
if (mapList && mapList.length > 0) {
mapDict[nodeList[j].id] = true;
}
}
}
}
this.filterOptions=cityList;
this.filterSelect = localStore.get(this.localParamName) || cityList[0].code;
this.loadSecondLevelFilterOptions(cityList, mapDict, nodeList);
} else {
// 设置一级选择组件
const mapDict = {};
if (this.filterEmpty && this.queryFunction) {
if (this.queryFunction === getPublishMapTree || this.queryFunction === getUserMapTree) {
// 查询同一种类citycode的mapList
for (var i = 0; i < cityList.length; i++) {
const response = await this.queryFunction(cityList[i].code);
const mapList = response.data;
if (mapList && mapList.length > 0) {
mapDict[cityList[i].code] = true;
}
}
} else {
// 查询所有citycode的mapList
const response = await this.queryFunction();
const mapList = response.data;
if (mapList && mapList.length > 0) {
mapList.forEach(elem => {
mapDict[elem.cityCode] = true;
});
}
}
}
// 根据mapDict构建一级filterSelect
this.loadFirstLevelFilterOptions(cityList, mapDict);
}
this.$emit('filterSelectChange', this.filterSelect);
},
filterSelectChange(filterSelect) {
if (this.isCascader) {
// 设置二级联动组件
localStore.set('cityCode', filterSelect[0]);
localStore.set('mapId', filterSelect[1]);
setUserConfigInfo([{ code: 'cityCode', val: filterSelect[0] }, { code: 'mapId', val: filterSelect[1] }]);
this.$emit('filterSelectChange', filterSelect);
} else {
// 设置一级选择组件
localStore.set('_cityCode', filterSelect);
// localStore.set('_cityCode', filterSelect);
localStore.set(this.localParamName, filterSelect);
this.$emit('filterSelectChange', filterSelect);
}
},
setFilterSelect(filterSelect) {
this.filterSelect = filterSelect;
if (this.isCascader) {
localStore.set('cityCode', filterSelect[0]);
localStore.set('mapId', filterSelect[1]);
} else {
localStore.set('_cityCode', filterSelect);
}
},
setFilterOptions(filterOptions) {
this.filterOptions = filterOptions;
}
}
};
</script>

3
src/views/designPlatform/demonList.vue
View File

@ -1,7 +1,7 @@
<template>
<div>
<el-card v-loading="loading" class="map-list-main" header="已发布地图列表">
<filter-city ref="filerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" />
<filter-city ref="filerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" :localParamName="localParamName"/>
<el-input v-model="filterText" :placeholder="this.$t('global.filteringKeywords')" clearable />
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: (height-125) +'px' }">
<!-- :style="{ height: heightUp +'px' }" -->
@ -74,6 +74,7 @@
y: 0
},
editModel: {},
localParamName:'publish_cityCode'
// skinCode:''
};
},

5
src/views/designPlatform/userDemonList.vue
View File

@ -1,6 +1,6 @@
<template>
<el-card v-loading="loading" class="map-list-main" header="我的地图列表">
<filter-city ref="myfilerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" />
<filter-city ref="myfilerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" :localParamName="localParamName"/>
<el-input v-model="filterText" :placeholder="this.$t('global.filteringKeywords')" clearable />
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: (height-185) +'px' }">
<el-tree
@ -96,7 +96,8 @@
y: 0
},
editModel: {},
skinCode:''
skinCode:'',
localParamName:'user_cityCode'
};
},
computed: {

10
src/views/planMonitor/detail.vue
View File

@ -10,7 +10,7 @@
<el-table-column prop="name" :label="this.$t('planMonitor.runGraphName')" />
<el-table-column :label="this.$t('global.status')">
<template slot-scope="scope">
<span>{{handlerStatus(scope.row)}}</span>
<el-tag>{{handlerStatus(scope.row)}}</el-tag>
</template>
</el-table-column>
<el-table-column
@ -20,13 +20,13 @@
</el-table-column>
<el-table-column :label="this.$t('planMonitor.creationDate')">
<template slot-scope="scope">
<span>{{handleTime(scope.row.createTime)}}</span>
<el-tag type="success">{{handleTime(scope.row.createTime)}}</el-tag>
</template>
</el-table-column>
<el-table-column :label="this.$t('global.operate')" width="500">
<el-table-column :label="this.$t('global.operate')" width="400">
<template slot-scope="scope">
<el-button size="mini" class="button_box" @click="handleConfirm(scope.row)" v-if="scope.row.status !=='1'">{{$t('planMonitor.load')}}</el-button>
<el-button size="mini" class="button_box" @click="handleEdit(scope.row)" v-if="isCreate && scope.row.status !=='1'">{{$t('planMonitor.modifyName')}}</el-button>
<el-button size="mini" class="button_box" type="success" @click="handleConfirm(scope.row)" v-if="scope.row.status !=='1'">{{$t('planMonitor.load')}}</el-button>
<el-button size="mini" class="button_box" type="primary" @click="handleEdit(scope.row)" v-if="isCreate && scope.row.status !=='1'">{{$t('planMonitor.modifyName')}}</el-button>
<el-button size="mini" class="button_box" type="danger" @click="handleDelete(scope.row)" v-if="isCreate && scope.row.status !=='1'">{{$t('global.delete')}}</el-button>
<el-button size="mini" class="button_box" type="primary" @click="handlePublish(scope.row)" v-if="isCreate && scope.row.status ==='0'">{{hasRelease?$t('global.release'):'申请发布'}}</el-button>
<el-button size="mini" class="button_box" type="primary" @click="handlePreview(scope.row)" v-if="scope.row.status === '1'">预览</el-button>

5
src/views/trainingPlatform/demonList.vue
View File

@ -3,7 +3,7 @@
<div slot="header" class="clearfix">
<span>{{ $t('global.mapList') }}</span>
</div>
<filter-city v-if="project!=='xty' " ref="filerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" />
<filter-city v-if="project!=='xty' " ref="filerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" :localParamName="localParamName"/>
<el-input v-if="project!=='xty' " v-model="filterText" :placeholder="this.$t('global.filteringKeywords')" clearable />
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: (height-(project?50:125)) +'px' }">
<el-tree
@ -65,7 +65,8 @@
},
mapId: '',
expandList: [],
filterSelect: ''
filterSelect: '',
localParamName:'training_cityCode'
};
},
watch: {