From 6c30667309b4a2273bbca36f9b59ae1d54f4a999 Mon Sep 17 00:00:00 2001 From: air <30444667+sszdot@users.noreply.github.com> Date: Mon, 22 Sep 2025 19:29:44 +0800 Subject: [PATCH] =?UTF-8?q?=E3=80=90=E7=B1=BB=20=20=E5=9E=8B=E3=80=91?= =?UTF-8?q?=EF=BC=9Afeat=20=E3=80=90=E5=8E=9F=20=20=E5=9B=A0=E3=80=91?= =?UTF-8?q?=EF=BC=9A=E5=9C=B0=E5=9B=BE=E8=AE=BE=E7=BD=AE=20=E7=9A=84?= =?UTF-8?q?=E6=8E=92=E5=BA=8F=E5=8A=9F=E8=83=BD=E5=AE=8C=E5=96=84=20?= =?UTF-8?q?=E3=80=90=E8=BF=87=20=20=E7=A8=8B=E3=80=91=EF=BC=9A=20=E3=80=90?= =?UTF-8?q?=E5=BD=B1=20=20=E5=93=8D=E3=80=91=EF=BC=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/MapBox.vue | 4 +- src/router/index.js | 45 ++++ src/store/index.js | 22 ++ src/styles/index.scss | 4 + src/views/layout/components/main/home/set.vue | 15 ++ .../layout/components/main/mapstyle/add.vue | 229 ++++++++++++++++++ .../layout/components/main/mapstyle/index.vue | 112 +++++++++ src/views/layout/index.vue | 3 +- 8 files changed, 432 insertions(+), 2 deletions(-) create mode 100644 src/views/layout/components/main/mapstyle/add.vue create mode 100644 src/views/layout/components/main/mapstyle/index.vue diff --git a/src/components/MapBox.vue b/src/components/MapBox.vue index 791fd19..38d5cdc 100644 --- a/src/components/MapBox.vue +++ b/src/components/MapBox.vue @@ -123,7 +123,9 @@ export default { }, async mounted () { // 等待 异步 加载 后端地图源 地址 - await this.$store.dispatch('fetchMapStyleList', this.$store.state.settings.host) + if (this.$store.state.mapStyleList.length === 0) { + await this.$store.dispatch('fetchMapStyleList', this.$store.state.settings.host) + } // 等待 异步 地图初始化 await this.init() diff --git a/src/router/index.js b/src/router/index.js index 8e5a81e..f5edccd 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -16,6 +16,51 @@ const routes = [ hidden: true } }, + { + path: '/mapstyle', + component: Layout, + redirect: '/mapstyle/index', + meta: { + title: '地图类型', + icon: 'el-icon-map-location', + roles: ['master'], + hidden: true + }, + children: [ + { + path: '/mapstyle/index', + component: () => import('@/views/layout/components/main/mapstyle/index'), + meta: { + title: '地图列表', + icon: 'el-icon-tickets', + roles: ['master'], + hidden: true + } + }, + { + path: '/mapstyle/add', + component: () => import('@/views/layout/components/main/mapstyle/add'), + meta: { + title: '地图添加', + icon: 'el-icon-plus', + roles: ['master'], + tapName: 'plane', + hidden: true + } + }, + { + path: '/mapstyle/edit/:id', + component: () => import('@/views/layout/components/main/mapstyle/add'), + meta: { + title: '地图更新', + icon: 'el-icon-edit', + roles: ['master'], + tapName: 'plane', + hidden: true + } + } + ] + }, { path: '/home', component: Layout, diff --git a/src/store/index.js b/src/store/index.js index 7eea0c6..89cd1b1 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1217,6 +1217,11 @@ const store = new Vuex.Store({ const sourceKey = style.source_key || 'default' return { + // 附带原始字段，便于管理端展示和操作 + id: style.id, + is_active: Number(style.is_active ?? 1), + sort_order: Number(style.sort_order ?? 0), + source_key: sourceKey, name: style.name, sprite: `${host}/Public/map/sprite`, glyphs: 'mapbox://fonts/mapbox/{fontstack}/{range}.pbf', @@ -1241,6 +1246,23 @@ const store = new Vuex.Store({ commit('setMapStyleList', []) Message.error(res.data.msg || '地图样式获取失败') } + }, + /** + * @description: 地图样式排序 + * @param {*} form { id, sort_order } + */ + async fetchOrderMapStyle ({ dispatch }, form) { + const params = new URLSearchParams() + params.append('id', form.id) + params.append('sort_order', form.sort_order) + const res = await api.post('orderMapStyle', params, 'Plane') + if (res.data.status === 1) { + await dispatch('fetchMapStyleList') // 刷新样式列表 + Message.success(res.data.msg || '排序已更新') + } else { + Message.error(res.data.msg || '排序更新失败') + } + return res } }, modules: { diff --git a/src/styles/index.scss b/src/styles/index.scss index 6189df9..10986d1 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -137,6 +137,10 @@ label { color: #606266 !important; } +.el-form-item__content { + padding-left: 25px !important; +} + /* 当屏幕宽度小于等于480px时 */ @media (max-width: 480px) { .el-dialog { diff --git a/src/views/layout/components/main/home/set.vue b/src/views/layout/components/main/home/set.vue index 2f8b206..e1dbfde 100644 --- a/src/views/layout/components/main/home/set.vue +++ b/src/views/layout/components/main/home/set.vue @@ -40,6 +40,16 @@ + +
+ + 地图组件设置 + +
+ + 前往地图样式 + + @@ -102,7 +112,12 @@ export default { this.$store.commit('settings/setLanguage', lang) this.$message.success(`语言已切换为：${lang === 'zh-CN' ? '简体中文' : lang}`) // 如果你用的是 vue-i18n，这里可能还需要调用 i18n.global.locale = lang + }, + goMapStyle () { + this.$router.push('/mapstyle/index') } } } + diff --git a/src/views/layout/components/main/mapstyle/add.vue b/src/views/layout/components/main/mapstyle/add.vue new file mode 100644 index 0000000..d9289d8 --- /dev/null +++ b/src/views/layout/components/main/mapstyle/add.vue @@ -0,0 +1,229 @@ + + + + + diff --git a/src/views/layout/components/main/mapstyle/index.vue b/src/views/layout/components/main/mapstyle/index.vue new file mode 100644 index 0000000..c895c69 --- /dev/null +++ b/src/views/layout/components/main/mapstyle/index.vue @@ -0,0 +1,112 @@ + + + + + diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue index 722b454..1408d7e 100644 --- a/src/views/layout/index.vue +++ b/src/views/layout/index.vue @@ -122,7 +122,8 @@ export default { this.$store.dispatch('fetchSpuList'), this.$store.dispatch('fetchSkuList'), this.$store.dispatch('fetchPaidOrderList'), - this.$store.dispatch('fetchMessageList') + this.$store.dispatch('fetchMessageList'), + this.$store.dispatch('fetchMapStyleList', this.$store.state.settings.host) ]).then(() => { return this.$store.dispatch('fetchNoflyData', this.shop_id) })