Skip to content

M
missis-demo
Commit 4b118e61 authored by 张泽丹's avatar 张泽丹 💻
Browse files
Options

优化

parent cd2dc6b8
Show whitespace changes
Inline Side-by-side
Showing with 80 additions and 133 deletions
public/index.html
View file @ 4b118e61
...@@ -5,11 +5,11 @@ ...@@ -5,11 +5,11 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title> <title>图层设计</title>
</head> </head>
<body> <body>
<noscript> <noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> <strong>We're sorry but 图层设计 doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript> </noscript>
<div id="app"></div> <div id="app"></div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
......
src/store/modules/layer.js
View file @ 4b118e61
...@@ -2,7 +2,7 @@ import defaultStyle from '../../config/default' ...@@ -2,7 +2,7 @@ import defaultStyle from '../../config/default'
const state = { const state = {
layersData:[], layersData:[],
layerStyle:{}, layerStyle:{},
setLayerStyle:{}, afterLayerStyle:{},
addLayerData:[] addLayerData:[]
} }
const mutations = { const mutations = {
...@@ -13,7 +13,7 @@ const mutations = { ...@@ -13,7 +13,7 @@ const mutations = {
state.layerStyle = data state.layerStyle = data
}, },
SET_LAYER_STYLE(state,data){ SET_LAYER_STYLE(state,data){
state.setLayerStyle = JSON.parse(JSON.stringify(data)) state.afterLayerStyle = JSON.parse(JSON.stringify(data))
}, },
ADD_LAYER_DATA(state,data){ ADD_LAYER_DATA(state,data){
state.addLayerData = data state.addLayerData = data
...@@ -35,12 +35,12 @@ const actions = { ...@@ -35,12 +35,12 @@ const actions = {
} }
const getters = { const getters = {
showStyleLayer:state => { showStyleLayer:state => {
return state.setLayerStyle return state.afterLayerStyle
}, },
getStyleUrl: state => { styleUrl: state => {
const layers = [] const layers = []
const urlStyle = {} const urlStyle = {}
const afterStyle = state.setLayerStyle const afterStyle = state.afterLayerStyle
Object.keys(afterStyle).forEach(layerId => { Object.keys(afterStyle).forEach(layerId => {
const _layerProp = state.layersData.find(item => item.id === layerId) const _layerProp = state.layersData.find(item => item.id === layerId)
const _afterStyle = afterStyle[layerId] const _afterStyle = afterStyle[layerId]
...@@ -61,7 +61,7 @@ const getters = { ...@@ -61,7 +61,7 @@ const getters = {
_urlStyleItem[styleType][key] = `${_afterStyleCfg[key]}` _urlStyleItem[styleType][key] = `${_afterStyleCfg[key]}`
} }
}) })
if (Object.keys(_urlStyleItem[styleType]).length === 0) { if (styleType !== 'icon_config' && Object.keys(_urlStyleItem[styleType]).length === 0) {
delete _urlStyleItem[styleType] delete _urlStyleItem[styleType]
} }
if (_urlStyleItem[styleType]) { if (_urlStyleItem[styleType]) {
...@@ -71,10 +71,10 @@ const getters = { ...@@ -71,10 +71,10 @@ const getters = {
_urlStyleItem[styleType] = iconCfg _urlStyleItem[styleType] = iconCfg
delete _urlStyleItem.PointSymbolizer delete _urlStyleItem.PointSymbolizer
} }
}
if (styleType === 'Filter') { if (styleType === 'Filter') {
_urlStyleItem[styleType] = _afterStyleItem[styleType] _urlStyleItem[styleType] = _afterStyleItem[styleType]
} }
}
}) })
if (Object.keys(_urlStyleItem).length > 0) { if (Object.keys(_urlStyleItem).length > 0) {
urlStyle[layerId].push(_urlStyleItem) urlStyle[layerId].push(_urlStyleItem)
......
src/views/Main.vue
View file @ 4b118e61
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
@mouseup="stopMove"> @mouseup="stopMove">
<div class="left" :style="{width: leftWidth}"> <div class="left" :style="{width: leftWidth}">
<add-controls v-show="curShow === 'style'"></add-controls> <add-controls v-show="curShow === 'style'"></add-controls>
<code-mirror v-show="curShow === 'code'" class="code-mirror" ref='codeMirror' :url="getStyleUrl"></code-mirror> <code-mirror v-show="curShow === 'code'" class="code-mirror" ref='codeMirror' :url="styleUrl"></code-mirror>
</div> </div>
<div class="width-slider" <div class="width-slider"
@mousedown="startMove" @mousedown="startMove"
...@@ -39,7 +39,7 @@ export default { ...@@ -39,7 +39,7 @@ export default {
} }
}, },
computed: { computed: {
...mapGetters('layer', ['getStyleUrl']) ...mapGetters('layer', ['styleUrl'])
}, },
components:{ components:{
AddControls, AddControls,
......
src/views/addcontrols.vue
View file @ 4b118e61
...@@ -20,7 +20,8 @@ ...@@ -20,7 +20,8 @@
handle=".handle"> handle=".handle">
<transition-group> <transition-group>
<div class="layer-item" v-for="layer in layerProp" :key="layer.id"> <div class="layer-item" v-for="layer in layerProp" :key="layer.id">
<layer-setting :ref="layer.id" :layer="layer" @change="onChange"></layer-setting> <layer-setting :ref="layer.id" :layer="layer" @change="onChange"
:layerStyle="afterLayerStyle[layer.id]"></layer-setting>
</div> </div>
</transition-group> </transition-group>
</draggable> </draggable>
...@@ -33,24 +34,14 @@ ...@@ -33,24 +34,14 @@
<script> <script>
import draggable from 'vuedraggable' import draggable from 'vuedraggable'
import layerSetting from '@/components/layerSetting/LayerSetting' import layerSetting from '@/components/layerSetting/LayerSetting'
import axios from 'axios'; import axios from 'axios'
import { mapActions } from 'vuex'; import { mapActions, mapState } from 'vuex'
export default { export default {
data() { data() {
return { return {
styleVisible: false,
provincevisible: false,
regionvisible:false,
province:[],
region:[],
indeterminate: true,
checkAll: true, checkAll: true,
plainOptions:[],
layerData:[],
layerProp:[], layerProp:[],
drawerTitle:{}, layerStyles: {}
endStyleLayer:{},
allLayer: true
} }
}, },
components:{ components:{
...@@ -62,6 +53,7 @@ export default { ...@@ -62,6 +53,7 @@ export default {
this.$bus.$on('updateStyle', this.onChange) this.$bus.$on('updateStyle', this.onChange)
}, },
computed: { computed: {
...mapState('layer', ['afterLayerStyle']),
checkedList () { checkedList () {
return this.layerProp.filter(item => item.isShow) return this.layerProp.filter(item => item.isShow)
}, },
...@@ -86,51 +78,8 @@ export default { ...@@ -86,51 +78,8 @@ export default {
} }
} }
}, },
watch:{
checkedList(val){
let len = this.checkedList.length
let len2 = this.layerData.length
let newarr = []
for(let i = 0;i<len;i++){
for(let a = 0;a<len2;a++){
if(this.checkedList[i] === this.layerData[a].title){
newarr.push(this.layerData[a].id)
}
}
}
this.addlayerdata(newarr)
}
},
methods: { methods: {
...mapActions('layer', ['getlayerdata','getlayerstyle','setlayerstyle','addlayerdata']), ...mapActions('layer', ['getlayerdata', 'setlayerstyle']),
submit(){
console.log(this.endStyleLayer,'this.endStyleLayer')
let _self= this
let type
switch (this.endStyleLayer.type) {
case 'marker':
type = 'MarkersSymbolizer'
break;
case 'line':
type = 'LineSymbolizer'
break;
case 'Polygon':
type = 'PolygonSymbolizer'
break;
case 'text':
type = 'TextSymbolizer'
break;
default:
break;
}
let a = JSON.parse(JSON.stringify(this.endStyleLayer).replace(/val/g,type))
delete a.type
let obj = {
[this.drawerTitle.id]:[a]
}
this.setlayerstyle(obj)
this.styleVisible = false
},
getData(){ getData(){
axios.get('/api/messis/server/china/info').then((res => { axios.get('/api/messis/server/china/info').then((res => {
// axios.get('/api/test.json').then((res => { // axios.get('/api/test.json').then((res => {
...@@ -139,8 +88,6 @@ export default { ...@@ -139,8 +88,6 @@ export default {
item.isEditing = false item.isEditing = false
return item return item
}) })
this.plainOptions = this.layerProp.map(item => ({label: item.title, value: item.id}))
this.layerData = res.data.layer
this.getlayerdata(this.layerProp) this.getlayerdata(this.layerProp)
this.$nextTick(() => { this.$nextTick(() => {
setTimeout(() => { setTimeout(() => {
......
vue.config.js
View file @ 4b118e61
...@@ -28,5 +28,5 @@ module.exports = { ...@@ -28,5 +28,5 @@ module.exports = {
} }
} }
} }
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment