【类 型】:feat
【原 因】:地图设置 的排序功能完善 【过 程】: 【影 响】:
This commit is contained in:
parent
be9fb71e66
commit
6c30667309
@ -123,7 +123,9 @@ export default {
|
|||||||
},
|
},
|
||||||
async mounted () {
|
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()
|
await this.init()
|
||||||
|
|
||||||
|
|||||||
@ -16,6 +16,51 @@ const routes = [
|
|||||||
hidden: true
|
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',
|
path: '/home',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
|
|||||||
@ -1217,6 +1217,11 @@ const store = new Vuex.Store({
|
|||||||
const sourceKey = style.source_key || 'default'
|
const sourceKey = style.source_key || 'default'
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
// 附带原始字段,便于管理端展示和操作
|
||||||
|
id: style.id,
|
||||||
|
is_active: Number(style.is_active ?? 1),
|
||||||
|
sort_order: Number(style.sort_order ?? 0),
|
||||||
|
source_key: sourceKey,
|
||||||
name: style.name,
|
name: style.name,
|
||||||
sprite: `${host}/Public/map/sprite`,
|
sprite: `${host}/Public/map/sprite`,
|
||||||
glyphs: 'mapbox://fonts/mapbox/{fontstack}/{range}.pbf',
|
glyphs: 'mapbox://fonts/mapbox/{fontstack}/{range}.pbf',
|
||||||
@ -1241,6 +1246,23 @@ const store = new Vuex.Store({
|
|||||||
commit('setMapStyleList', [])
|
commit('setMapStyleList', [])
|
||||||
Message.error(res.data.msg || '地图样式获取失败')
|
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: {
|
modules: {
|
||||||
|
|||||||
@ -137,6 +137,10 @@ label {
|
|||||||
color: #606266 !important;
|
color: #606266 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.el-form-item__content {
|
||||||
|
padding-left: 25px !important;
|
||||||
|
}
|
||||||
|
|
||||||
/* 当屏幕宽度小于等于480px时 */
|
/* 当屏幕宽度小于等于480px时 */
|
||||||
@media (max-width: 480px) {
|
@media (max-width: 480px) {
|
||||||
.el-dialog {
|
.el-dialog {
|
||||||
|
|||||||
@ -40,6 +40,16 @@
|
|||||||
</el-checkbox-group>
|
</el-checkbox-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
|
<!-- 地图组件设置 -->
|
||||||
|
<div class="p-t-10 p-b-5">
|
||||||
|
<el-divider content-position="left">
|
||||||
|
<font class="fb f-s-18 normalFontColor">地图组件设置</font>
|
||||||
|
</el-divider>
|
||||||
|
</div>
|
||||||
|
<el-form-item label="地图样式" v-if="this.$store.state.user.power === 'master'">
|
||||||
|
<el-button type="text" @click="goMapStyle">前往地图样式</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
</el-form>
|
</el-form>
|
||||||
</el-main>
|
</el-main>
|
||||||
</el-container>
|
</el-container>
|
||||||
@ -102,7 +112,12 @@ export default {
|
|||||||
this.$store.commit('settings/setLanguage', lang)
|
this.$store.commit('settings/setLanguage', lang)
|
||||||
this.$message.success(`语言已切换为:${lang === 'zh-CN' ? '简体中文' : lang}`)
|
this.$message.success(`语言已切换为:${lang === 'zh-CN' ? '简体中文' : lang}`)
|
||||||
// 如果你用的是 vue-i18n,这里可能还需要调用 i18n.global.locale = lang
|
// 如果你用的是 vue-i18n,这里可能还需要调用 i18n.global.locale = lang
|
||||||
|
},
|
||||||
|
goMapStyle () {
|
||||||
|
this.$router.push('/mapstyle/index')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
</style>
|
||||||
|
|||||||
229
src/views/layout/components/main/mapstyle/add.vue
Normal file
229
src/views/layout/components/main/mapstyle/add.vue
Normal file
@ -0,0 +1,229 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-row class="m-t-0">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-container>
|
||||||
|
<el-header height="42px" class="l-h-42 p-l-10 p-r-10 border border-b-n">
|
||||||
|
<div class="l">
|
||||||
|
<i :class="pageState === 'add' ? 'el-icon-plus f-s-20' : 'el-icon-edit f-s-20'"></i>
|
||||||
|
<font class="m-l-10 f-s-18 fb">{{ $route.meta.title }}</font>
|
||||||
|
</div>
|
||||||
|
</el-header>
|
||||||
|
<el-main class="border p-20 m-b-20">
|
||||||
|
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px" :label-position="$store.state.app.isWideScreen ? 'top' : 'right'" class="w-80">
|
||||||
|
|
||||||
|
<!-- 基本信息 -->
|
||||||
|
<div class="p-b-5">
|
||||||
|
<el-divider content-position="left">
|
||||||
|
<font class="fb f-s-18 normalFontColor">基本信息</font>
|
||||||
|
</el-divider>
|
||||||
|
</div>
|
||||||
|
<el-form-item label="样式名称" prop="name">
|
||||||
|
<el-input v-model="form.name" placeholder="例如:谷歌卫星瓦片" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="版本" prop="version">
|
||||||
|
<el-input-number v-model="form.version" :min="1" :max="8" :step="1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="是否启用" prop="is_active">
|
||||||
|
<el-switch v-model="form.is_active" :active-value="1" :inactive-value="0" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="排序" prop="sort_order">
|
||||||
|
<el-input-number v-model="form.sort_order" :min="0" :max="9999" :step="1" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<!-- 资源信息 -->
|
||||||
|
<div class="p-t-10 p-b-5">
|
||||||
|
<el-divider content-position="left">
|
||||||
|
<font class="fb f-s-18 normalFontColor">资源与源配置</font>
|
||||||
|
</el-divider>
|
||||||
|
</div>
|
||||||
|
<el-form-item label="sprite 路径" prop="sprite">
|
||||||
|
<el-input v-model="form.sprite" placeholder="可选:sprite 路径(如有)" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="glyphs 路径" prop="glyphs">
|
||||||
|
<el-input v-model="form.glyphs" placeholder="可选:glyphs 路径(如有)" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="source 名称" prop="source_name">
|
||||||
|
<el-input v-model="form.source_name" placeholder="例如:google、bing" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="source 类型" prop="source_type">
|
||||||
|
<el-select v-model="form.source_type" placeholder="请选择 source 类型">
|
||||||
|
<el-option label="raster" value="raster" />
|
||||||
|
<el-option label="vector" value="vector" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="瓦片大小" prop="tile_size">
|
||||||
|
<el-input-number v-model="form.tile_size" :min="1" :max="1024" :step="1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="瓦片URL列表" prop="tiles">
|
||||||
|
<el-input
|
||||||
|
type="textarea"
|
||||||
|
:rows="4"
|
||||||
|
v-model="tilesInput"
|
||||||
|
placeholder="每行一个URL,或粘贴JSON数组,例如:\nhttps://server.com/tiles/{z}/{x}/{y}.png"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据来源(署名)" prop="attribution">
|
||||||
|
<el-input type="textarea" :rows="2" v-model="form.attribution" placeholder="可选,如:© Google" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<!-- 图层配置 -->
|
||||||
|
<div class="p-t-10 p-b-5">
|
||||||
|
<el-divider content-position="left">
|
||||||
|
<font class="fb f-s-18 normalFontColor">图层配置</font>
|
||||||
|
</el-divider>
|
||||||
|
</div>
|
||||||
|
<el-form-item label="图层ID" prop="layer_id">
|
||||||
|
<el-input v-model="form.layer_id" placeholder="用于 map.addLayer 的 id" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="图层类型" prop="layer_type">
|
||||||
|
<el-select v-model="form.layer_type" placeholder="请选择图层类型">
|
||||||
|
<el-option label="raster" value="raster" />
|
||||||
|
<el-option label="background" value="background" />
|
||||||
|
<el-option label="fill" value="fill" />
|
||||||
|
<el-option label="line" value="line" />
|
||||||
|
<el-option label="symbol" value="symbol" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="图层source" prop="layer_source">
|
||||||
|
<el-input v-model="form.layer_source" placeholder="通常与 source 名称一致" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<!-- 提交按钮 -->
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" :icon="pageState === 'add' ? 'el-icon-plus' : 'el-icon-edit'" @click="handleSubmit">
|
||||||
|
{{ pageState === 'add' ? '创建' : '更新' }}
|
||||||
|
</el-button>
|
||||||
|
<el-button v-if="pageState === 'add'" class="iconfont icon-qingchu" @click="resetForm">
|
||||||
|
<font class="m-l-5">重填</font>
|
||||||
|
</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
</el-form>
|
||||||
|
</el-main>
|
||||||
|
</el-container>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'MapStyleAdd',
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
form: {
|
||||||
|
id: null,
|
||||||
|
name: '',
|
||||||
|
sprite: '',
|
||||||
|
glyphs: '',
|
||||||
|
version: 8,
|
||||||
|
source_name: '',
|
||||||
|
source_type: 'raster',
|
||||||
|
tile_size: 256,
|
||||||
|
tiles: [], // 存数组,表单用 tilesInput 辅助
|
||||||
|
attribution: '',
|
||||||
|
layer_id: '',
|
||||||
|
layer_type: 'raster',
|
||||||
|
layer_source: '',
|
||||||
|
is_active: 1,
|
||||||
|
sort_order: 0
|
||||||
|
},
|
||||||
|
tilesInput: '', // 文本域字符串(行/JSON)
|
||||||
|
pageState: 'add',
|
||||||
|
mapStyleId: this.$route.params.id,
|
||||||
|
rules: {
|
||||||
|
name: [{ required: true, message: '请输入样式名称', trigger: 'blur' }],
|
||||||
|
version: [{ type: 'number', required: true, message: '请输入版本', trigger: 'change' }],
|
||||||
|
source_name: [{ required: true, message: '请输入 source 名称', trigger: 'blur' }],
|
||||||
|
source_type: [{ required: true, message: '请选择 source 类型', trigger: 'change' }],
|
||||||
|
tile_size: [{ type: 'number', required: true, message: '请输入瓦片大小', trigger: 'change' }],
|
||||||
|
layer_id: [{ required: true, message: '请输入图层ID', trigger: 'blur' }],
|
||||||
|
layer_type: [{ required: true, message: '请选择图层类型', trigger: 'change' }],
|
||||||
|
layer_source: [{ required: true, message: '请输入图层source', trigger: 'blur' }]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created () {
|
||||||
|
// 初始化页面状态与预填充
|
||||||
|
if (this.mapStyleId != null) {
|
||||||
|
this.pageState = 'edit'
|
||||||
|
this.form.id = this.mapStyleId
|
||||||
|
const item = (this.$store.state.mapStyleList || []).find(i => String(i.id) === String(this.mapStyleId))
|
||||||
|
if (item) {
|
||||||
|
this.fillFormFromItem(item)
|
||||||
|
} else {
|
||||||
|
this.$message.warning('未在列表中找到该样式,表单为空')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 校验 tiles 输入(行或JSON数组)
|
||||||
|
parseTilesInput (val) {
|
||||||
|
const text = (val || '').trim()
|
||||||
|
if (!text) return []
|
||||||
|
try {
|
||||||
|
const asJson = JSON.parse(text)
|
||||||
|
if (Array.isArray(asJson)) return asJson
|
||||||
|
} catch (e) {
|
||||||
|
// 不是JSON,按行解析
|
||||||
|
}
|
||||||
|
return text.split(/\r?\n/).map(s => s.trim()).filter(Boolean)
|
||||||
|
},
|
||||||
|
fillFormFromItem (item) {
|
||||||
|
this.form.name = item.name || ''
|
||||||
|
this.form.sprite = item.sprite || ''
|
||||||
|
this.form.glyphs = item.glyphs || ''
|
||||||
|
this.form.version = Number(item.version ?? 8)
|
||||||
|
this.form.source_name = item.source_name || ''
|
||||||
|
this.form.source_type = item.source_type || 'raster'
|
||||||
|
this.form.tile_size = Number(item.tile_size ?? 256)
|
||||||
|
// tiles 兼容字符串JSON或数组
|
||||||
|
let tiles = []
|
||||||
|
if (Array.isArray(item.tiles)) tiles = item.tiles
|
||||||
|
else if (typeof item.tiles === 'string') {
|
||||||
|
try { tiles = JSON.parse(item.tiles) } catch (e) { tiles = [] }
|
||||||
|
}
|
||||||
|
this.form.tiles = tiles
|
||||||
|
this.tilesInput = tiles.join('\n')
|
||||||
|
this.form.attribution = item.attribution || ''
|
||||||
|
this.form.layer_id = item.layer_id || ''
|
||||||
|
this.form.layer_type = item.layer_type || 'raster'
|
||||||
|
this.form.layer_source = item.layer_source || ''
|
||||||
|
this.form.is_active = Number(item.is_active ?? 1)
|
||||||
|
this.form.sort_order = Number(item.sort_order ?? 0)
|
||||||
|
},
|
||||||
|
resetForm () {
|
||||||
|
this.$refs.formRef && this.$refs.formRef.resetFields()
|
||||||
|
this.tilesInput = ''
|
||||||
|
this.form.version = 8
|
||||||
|
this.form.source_type = 'raster'
|
||||||
|
this.form.tile_size = 256
|
||||||
|
this.form.layer_type = 'raster'
|
||||||
|
this.form.is_active = 1
|
||||||
|
this.form.sort_order = 0
|
||||||
|
},
|
||||||
|
handleSubmit () {
|
||||||
|
this.$refs.formRef.validate((valid) => {
|
||||||
|
if (!valid) return
|
||||||
|
// 准备 tiles
|
||||||
|
const tiles = this.parseTilesInput(this.tilesInput)
|
||||||
|
if (!tiles.length) {
|
||||||
|
this.$message.error('请至少填写一个瓦片URL')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.form.tiles = tiles
|
||||||
|
|
||||||
|
// 提交占位:待接入 store actions: fetchAddMapStyle / fetchSaveMapStyle
|
||||||
|
this.$message.success(`${this.pageState === 'add' ? '创建' : '更新'}成功(示例页,待接入后端)`)
|
||||||
|
this.$router.replace('/mapstyle/index')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/styles/theme.scss";
|
||||||
|
.w-80 { max-width: 880px; }
|
||||||
|
</style>
|
||||||
112
src/views/layout/components/main/mapstyle/index.vue
Normal file
112
src/views/layout/components/main/mapstyle/index.vue
Normal file
@ -0,0 +1,112 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<!-- 操作按钮 -->
|
||||||
|
<el-button-group>
|
||||||
|
<el-button type="primary" icon="el-icon-plus" @click="$router.replace('/mapstyle/add')">添加</el-button>
|
||||||
|
<el-button type="warning" icon="el-icon-edit" @click="toEditPage()">编辑</el-button>
|
||||||
|
</el-button-group>
|
||||||
|
|
||||||
|
<!-- 样式表格 -->
|
||||||
|
<el-table class="m-t-20 w-100" ref="myTable" :data="styleListPaged" border tooltip-effect="dark">
|
||||||
|
<el-table-column align="center" type="selection" width="40" />
|
||||||
|
<el-table-column align="center" label="排序" width="120">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input
|
||||||
|
v-model="scope.row.sort_order"
|
||||||
|
size="mini"
|
||||||
|
style="width: 80px;"
|
||||||
|
placeholder="排序"
|
||||||
|
@focus="tempSort = scope.row.sort_order"
|
||||||
|
@blur="blurOrder(scope.row)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" label="ID" width="60">
|
||||||
|
<template slot-scope="scope">{{ (currentPage - 1) * pageSize + scope.$index + 1 }}</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="name" label="样式名称" min-width="160">
|
||||||
|
<template slot-scope="scope">{{ displayName(scope.row, scope.$index) }}</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="style" label="样式/URL" min-width="260" show-overflow-tooltip>
|
||||||
|
<template slot-scope="scope">{{ displayStyle(scope.row) }}</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<!-- 分页 -->
|
||||||
|
<el-pagination class="m-t-20" layout="prev, pager, next" :current-page.sync="currentPage" :page-size="pageSize"
|
||||||
|
:total="styleList.length" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'MapStyleIndex',
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
pageSize: 8,
|
||||||
|
currentPage: 1,
|
||||||
|
tempSort: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
// 来自全局 store 的地图样式列表(已被 MapBox 使用)
|
||||||
|
styleList () {
|
||||||
|
// 允许为数组或对象数组,尽量宽容显示
|
||||||
|
return Array.isArray(this.$store.state.mapStyleList) ? this.$store.state.mapStyleList : []
|
||||||
|
},
|
||||||
|
styleListPaged () {
|
||||||
|
const start = (this.currentPage - 1) * this.pageSize
|
||||||
|
return this.styleList.slice(start, start + this.pageSize)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created () {
|
||||||
|
setTimeout(() => {
|
||||||
|
console.log(this.styleList)
|
||||||
|
}, 1000)
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
displayName (row, idx) {
|
||||||
|
// 兼容样式为字符串或对象(包含 name/title)
|
||||||
|
if (typeof row === 'string') return `样式 ${idx + 1}`
|
||||||
|
return row.name || row.title || `样式 ${idx + 1}`
|
||||||
|
},
|
||||||
|
displayStyle (row) {
|
||||||
|
if (typeof row === 'string') return row
|
||||||
|
// 常见字段:style/url/id
|
||||||
|
return row.style || row.url || JSON.stringify(row)
|
||||||
|
},
|
||||||
|
// 排序input失焦 更新排序
|
||||||
|
async blurOrder (row) {
|
||||||
|
if (this.tempSort !== row.sort_order) {
|
||||||
|
if (!row || row.id == null) {
|
||||||
|
this.$message.warning('该样式缺少ID,无法排序')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
await this.$store.dispatch('fetchOrderMapStyle', {
|
||||||
|
id: row.id,
|
||||||
|
sort_order: row.sort_order
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toEditPage () {
|
||||||
|
const sel = this.$refs.myTable.selection || []
|
||||||
|
if (!sel.length) {
|
||||||
|
this.$message.error('请选择一条需要编辑的记录')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (sel.length > 1) {
|
||||||
|
this.$message.error('只能选择一条记录')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
// 这里暂时用序号作为 id(样式可能没有后端 id),编辑页仅作占位
|
||||||
|
const row = sel[0]
|
||||||
|
const id = typeof row === 'object' && row.id != null ? row.id : this.styleList.indexOf(row)
|
||||||
|
this.$router.push('/mapstyle/edit/' + id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/styles/theme.scss";
|
||||||
|
</style>
|
||||||
@ -122,7 +122,8 @@ export default {
|
|||||||
this.$store.dispatch('fetchSpuList'),
|
this.$store.dispatch('fetchSpuList'),
|
||||||
this.$store.dispatch('fetchSkuList'),
|
this.$store.dispatch('fetchSkuList'),
|
||||||
this.$store.dispatch('fetchPaidOrderList'),
|
this.$store.dispatch('fetchPaidOrderList'),
|
||||||
this.$store.dispatch('fetchMessageList')
|
this.$store.dispatch('fetchMessageList'),
|
||||||
|
this.$store.dispatch('fetchMapStyleList', this.$store.state.settings.host)
|
||||||
]).then(() => {
|
]).then(() => {
|
||||||
return this.$store.dispatch('fetchNoflyData', this.shop_id)
|
return this.$store.dispatch('fetchNoflyData', this.shop_id)
|
||||||
})
|
})
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user