运费模板区域改成多选
This commit is contained in:
parent
b12aefe46e
commit
70c5082776
@ -10,7 +10,7 @@ export interface DeliveryExpressTemplateVO {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export declare type ExpressTemplateChargeVO = {
|
export declare type ExpressTemplateChargeVO = {
|
||||||
areaId: number
|
areaIds: number[]
|
||||||
startCount: number
|
startCount: number
|
||||||
startPrice: number
|
startPrice: number
|
||||||
extraCount: number
|
extraCount: number
|
||||||
@ -18,7 +18,7 @@ export declare type ExpressTemplateChargeVO = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export declare type ExpressTemplateFreeVO = {
|
export declare type ExpressTemplateFreeVO = {
|
||||||
areaId: number
|
areaIds: number[]
|
||||||
freeCount: number
|
freeCount: number
|
||||||
freePrice: number
|
freePrice: number
|
||||||
}
|
}
|
||||||
|
@ -6,11 +6,11 @@ export const getAreaTree = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const getChildrenArea = async (id: number) => {
|
export const getChildrenArea = async (id: number) => {
|
||||||
return await request.get({ url: '/system/area/getChildrenArea?id=' + id })
|
return await request.get({ url: '/system/area/get-children?id=' + id })
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getAreaListByIds = async (data) => {
|
export const getAreaListByIds = async (ids) => {
|
||||||
return await request.post({ url: '/system/area/list', data })
|
return await request.get({ url: '/system/area/get-by-ids?ids=' + ids })
|
||||||
}
|
}
|
||||||
|
|
||||||
// 获得 IP 对应的地区名
|
// 获得 IP 对应的地区名
|
||||||
|
@ -27,10 +27,11 @@
|
|||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
<!-- 区域数据太多,用赖加载方式,要不然性能有问题 -->
|
<!-- 区域数据太多,用赖加载方式,要不然性能有问题 -->
|
||||||
<el-tree-select
|
<el-tree-select
|
||||||
v-model="row.areaId"
|
v-model="row.areaIds"
|
||||||
lazy
|
lazy
|
||||||
:load="loadChargeArea"
|
:load="loadChargeArea"
|
||||||
:props="defaultProps"
|
:props="defaultProps"
|
||||||
|
multiple
|
||||||
node-key="id"
|
node-key="id"
|
||||||
check-strictly
|
check-strictly
|
||||||
show-checkbox
|
show-checkbox
|
||||||
@ -90,7 +91,8 @@
|
|||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
<!-- 区域数据太多,用赖加载方式,要不然性能有问题 -->
|
<!-- 区域数据太多,用赖加载方式,要不然性能有问题 -->
|
||||||
<el-tree-select
|
<el-tree-select
|
||||||
v-model="row.areaId"
|
v-model="row.areaIds"
|
||||||
|
multiple
|
||||||
lazy
|
lazy
|
||||||
:load="loadFreeArea"
|
:load="loadFreeArea"
|
||||||
:props="defaultProps"
|
:props="defaultProps"
|
||||||
@ -98,7 +100,7 @@
|
|||||||
check-strictly
|
check-strictly
|
||||||
show-checkbox
|
show-checkbox
|
||||||
check-on-click-node
|
check-on-click-node
|
||||||
:render-after-expand="false"
|
:render-after-expand="true"
|
||||||
:cache-data="areaCache"
|
:cache-data="areaCache"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
@ -170,7 +172,6 @@ const formRules = reactive({
|
|||||||
})
|
})
|
||||||
const formRef = ref() // 表单 Ref
|
const formRef = ref() // 表单 Ref
|
||||||
const areaCache = ref([]) //由于区域节点懒加载,已选区域节点需要缓存展示
|
const areaCache = ref([]) //由于区域节点懒加载,已选区域节点需要缓存展示
|
||||||
// let areaTree: any[]
|
|
||||||
/** 打开弹窗 */
|
/** 打开弹窗 */
|
||||||
const open = async (type: string, id?: number) => {
|
const open = async (type: string, id?: number) => {
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
@ -183,25 +184,30 @@ const open = async (type: string, id?: number) => {
|
|||||||
formLoading.value = true
|
formLoading.value = true
|
||||||
formData.value = await DeliveryExpressTemplateApi.getDeliveryExpressTemplate(id)
|
formData.value = await DeliveryExpressTemplateApi.getDeliveryExpressTemplate(id)
|
||||||
columnTitle.value = columnTitleMap.get(formData.value.chargeMode)
|
columnTitle.value = columnTitleMap.get(formData.value.chargeMode)
|
||||||
//已选的区域节点
|
const chargeAreaIds = []
|
||||||
const areaIds = []
|
const freeAreaIds = []
|
||||||
formData.value.templateCharge.forEach((item) => {
|
formData.value.templateCharge.forEach((item) => {
|
||||||
//不等于全国的节点
|
for (let i = 0; i < item.areaIds.length; i++) {
|
||||||
if (item.areaId !== 1) {
|
if (!chargeAreaIds.includes(item.areaIds[i])) {
|
||||||
areaIds.push(item.areaId)
|
chargeAreaIds.push(item.areaIds[i])
|
||||||
|
}
|
||||||
}
|
}
|
||||||
//前端价格以元展示
|
//前端价格以元展示
|
||||||
item.startPrice = fenToYuan(item.startPrice)
|
item.startPrice = fenToYuan(item.startPrice)
|
||||||
item.extraPrice = fenToYuan(item.extraPrice)
|
item.extraPrice = fenToYuan(item.extraPrice)
|
||||||
})
|
})
|
||||||
formData.value.templateFree.forEach((item) => {
|
formData.value.templateFree.forEach((item) => {
|
||||||
if (item.areaId !== 1 && !areaIds.includes(item.areaId)) {
|
for (let i = 0; i < item.areaIds.length; i++) {
|
||||||
areaIds.push(item.areaId)
|
if (!chargeAreaIds.includes(item.areaIds[i]) && !freeAreaIds.includes(item.areaIds[i])) {
|
||||||
|
freeAreaIds.push(item.areaIds[i])
|
||||||
|
}
|
||||||
}
|
}
|
||||||
item.freePrice = fenToYuan(item.freePrice)
|
item.freePrice = fenToYuan(item.freePrice)
|
||||||
})
|
})
|
||||||
|
//已选的区域节点
|
||||||
|
const areaIds = chargeAreaIds.concat(freeAreaIds)
|
||||||
//区域节点,懒加载方式。 已选节点需要缓存展示
|
//区域节点,懒加载方式。 已选节点需要缓存展示
|
||||||
areaCache.value = await getAreaListByIds(areaIds)
|
areaCache.value = await getAreaListByIds(areaIds.join(','))
|
||||||
}
|
}
|
||||||
} finally {
|
} finally {
|
||||||
formLoading.value = false
|
formLoading.value = false
|
||||||
@ -250,7 +256,7 @@ const resetForm = () => {
|
|||||||
chargeMode: 1,
|
chargeMode: 1,
|
||||||
templateCharge: [
|
templateCharge: [
|
||||||
{
|
{
|
||||||
areaId: 1,
|
areaIds: [1],
|
||||||
startCount: 2,
|
startCount: 2,
|
||||||
startPrice: 5,
|
startPrice: 5,
|
||||||
extraCount: 5,
|
extraCount: 5,
|
||||||
@ -300,10 +306,11 @@ const initData = async () => {
|
|||||||
|
|
||||||
/** 懒加载运费区域树 */
|
/** 懒加载运费区域树 */
|
||||||
const loadChargeArea = async (node, resolve) => {
|
const loadChargeArea = async (node, resolve) => {
|
||||||
|
//已选区域需要禁止再次选择
|
||||||
const areaIds = []
|
const areaIds = []
|
||||||
formData.value.templateCharge.forEach((item) => {
|
formData.value.templateCharge.forEach((item) => {
|
||||||
if (item.areaId) {
|
if (item.areaIds.length > 0) {
|
||||||
areaIds.push(item.areaId)
|
item.areaIds.forEach((areaId) => areaIds.push(areaId))
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
if (node.isLeaf) return resolve([])
|
if (node.isLeaf) return resolve([])
|
||||||
@ -312,7 +319,8 @@ const loadChargeArea = async (node, resolve) => {
|
|||||||
const data = cloneDeep(defaultArea)
|
const data = cloneDeep(defaultArea)
|
||||||
const item = data[0]
|
const item = data[0]
|
||||||
if (areaIds.includes(item.id)) {
|
if (areaIds.includes(item.id)) {
|
||||||
item.disabled = true
|
// TODO 禁止选中的区域有些问题, 导致修改时候不能重新选择 不知道如何处理。 暂时注释掉 @芋艿 有空瞅瞅
|
||||||
|
//item.disabled = true
|
||||||
}
|
}
|
||||||
resolve(data)
|
resolve(data)
|
||||||
} else {
|
} else {
|
||||||
@ -320,7 +328,7 @@ const loadChargeArea = async (node, resolve) => {
|
|||||||
const data = await getChildrenArea(id)
|
const data = await getChildrenArea(id)
|
||||||
data.forEach((item) => {
|
data.forEach((item) => {
|
||||||
if (areaIds.includes(item.id)) {
|
if (areaIds.includes(item.id)) {
|
||||||
item.disabled = true
|
//item.disabled = true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
resolve(data)
|
resolve(data)
|
||||||
@ -330,11 +338,11 @@ const loadChargeArea = async (node, resolve) => {
|
|||||||
/** 懒加载包邮区域树 */
|
/** 懒加载包邮区域树 */
|
||||||
const loadFreeArea = async (node, resolve) => {
|
const loadFreeArea = async (node, resolve) => {
|
||||||
if (node.isLeaf) return resolve([])
|
if (node.isLeaf) return resolve([])
|
||||||
//已经选择的区域id
|
//已选区域需要禁止再次选择
|
||||||
const areaIds = []
|
const areaIds = []
|
||||||
formData.value.templateFree.forEach((item) => {
|
formData.value.templateFree.forEach((item) => {
|
||||||
if (item.areaId) {
|
if (item.areaIds.length > 0) {
|
||||||
areaIds.push(item.areaId)
|
item.areaIds.forEach((areaId) => areaIds.push(areaId))
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
const length = node.data.length
|
const length = node.data.length
|
||||||
@ -343,7 +351,7 @@ const loadFreeArea = async (node, resolve) => {
|
|||||||
const data = cloneDeep(defaultArea)
|
const data = cloneDeep(defaultArea)
|
||||||
const item = data[0]
|
const item = data[0]
|
||||||
if (areaIds.includes(item.id)) {
|
if (areaIds.includes(item.id)) {
|
||||||
item.disabled = true
|
//item.disabled = true
|
||||||
}
|
}
|
||||||
resolve(data)
|
resolve(data)
|
||||||
} else {
|
} else {
|
||||||
@ -352,7 +360,8 @@ const loadFreeArea = async (node, resolve) => {
|
|||||||
//已选区域需要禁止再次选择
|
//已选区域需要禁止再次选择
|
||||||
data.forEach((item) => {
|
data.forEach((item) => {
|
||||||
if (areaIds.includes(item.id)) {
|
if (areaIds.includes(item.id)) {
|
||||||
item.disabled = true
|
// TODO 禁止选中的区域有些问题, 导致修改时候不能重新选择 不知道如何处理。 暂时注释掉 @芋艿 有空瞅瞅
|
||||||
|
//item.disabled = true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
resolve(data)
|
resolve(data)
|
||||||
@ -362,7 +371,7 @@ const loadFreeArea = async (node, resolve) => {
|
|||||||
const addChargeArea = () => {
|
const addChargeArea = () => {
|
||||||
const data = formData.value
|
const data = formData.value
|
||||||
data.templateCharge.push({
|
data.templateCharge.push({
|
||||||
areaId: undefined,
|
areaIds: [],
|
||||||
startCount: 1,
|
startCount: 1,
|
||||||
startPrice: 1,
|
startPrice: 1,
|
||||||
extraCount: 1,
|
extraCount: 1,
|
||||||
@ -378,7 +387,7 @@ const deleteChargeArea = (index) => {
|
|||||||
const addFreeArea = () => {
|
const addFreeArea = () => {
|
||||||
const data = formData.value
|
const data = formData.value
|
||||||
data.templateFree.push({
|
data.templateFree.push({
|
||||||
areaId: undefined,
|
areaIds: [],
|
||||||
freeCount: 1,
|
freeCount: 1,
|
||||||
freePrice: 1
|
freePrice: 1
|
||||||
})
|
})
|
@ -90,13 +90,13 @@
|
|||||||
</ContentWrap>
|
</ContentWrap>
|
||||||
|
|
||||||
<!-- 表单弹窗:添加/修改 -->
|
<!-- 表单弹窗:添加/修改 -->
|
||||||
<DeliveryExpressTemplateForm ref="formRef" @success="getList" />
|
<ExpressTemplateForm ref="formRef" @success="getList" />
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts" name="DeliveryExpressTemplate">
|
<script setup lang="ts" name="DeliveryExpressTemplate">
|
||||||
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
|
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
|
||||||
import { dateFormatter } from '@/utils/formatTime'
|
import { dateFormatter } from '@/utils/formatTime'
|
||||||
import * as DeliveryExpressTemplateApi from '@/api/mall/trade/delivery/expressTemplate'
|
import * as DeliveryExpressTemplateApi from '@/api/mall/trade/delivery/expressTemplate'
|
||||||
import DeliveryExpressTemplateForm from './DeliveryExpressTemplateForm.vue'
|
import ExpressTemplateForm from './ExpressTemplateForm.vue'
|
||||||
|
|
||||||
const message = useMessage() // 消息弹窗
|
const message = useMessage() // 消息弹窗
|
||||||
const { t } = useI18n() // 国际化
|
const { t } = useI18n() // 国际化
|
||||||
|
Loading…
Reference in New Issue
Block a user