|
|
@ -7,7 +7,7 @@ import moment from 'moment' |
|
|
|
import API from '@/util/http' |
|
|
|
import {writeFile, utils} from 'xlsx' |
|
|
|
import request from "@/util/request.js"; |
|
|
|
import {marketMapping} from "../../utils/marketMap.js"; |
|
|
|
import {marketMapping, reverseMarketMapping} from "../../utils/marketMap.js"; |
|
|
|
|
|
|
|
// 标记当前激活的时间范围按钮 |
|
|
|
const activeTimeRange = ref('') |
|
|
@ -90,48 +90,9 @@ const type = [ |
|
|
|
// 定义加载状态,获取地区数据 |
|
|
|
// 定义加载状态,获取地区数据 |
|
|
|
const isLoadingmarket = ref(false); |
|
|
|
const market = ref([]) |
|
|
|
const markets = ref([]) |
|
|
|
|
|
|
|
|
|
|
|
const getmarket = async () => { |
|
|
|
isLoadingmarket.value = true; |
|
|
|
try { |
|
|
|
const result = await API({ |
|
|
|
url: '/general/adminMarkets', |
|
|
|
data: {account: adminData.value.account} |
|
|
|
}); |
|
|
|
console.log('获取地区数据成功', result) |
|
|
|
// 假设后端返回的是字符串数组,转换为 { value, label } 格式 |
|
|
|
if (Array.isArray(result.data) && typeof result.data[0] === 'string') { |
|
|
|
market.value = result.data |
|
|
|
.filter(item => item !== null && item !== undefined && item.trim() !== '') // 过滤空值 |
|
|
|
.map(item => ({ value: item, label: item })); |
|
|
|
} else { |
|
|
|
market.value = result.data; |
|
|
|
} |
|
|
|
} catch (error) { |
|
|
|
console.error('获取地区数据失败:', error); |
|
|
|
ElMessage.error('获取地区数据失败,请稍后重试'); |
|
|
|
// 可以提供默认数据 |
|
|
|
market.value = []; |
|
|
|
} finally { |
|
|
|
isLoadingmarket.value = false; |
|
|
|
} |
|
|
|
}; |
|
|
|
/*// 地区下拉框 |
|
|
|
const getMarket = async function () { |
|
|
|
try { |
|
|
|
const result = await API({ |
|
|
|
url: '/general/market', |
|
|
|
data: {} |
|
|
|
}) |
|
|
|
console.log('@@@@@@@@@@@@@地区数据', result) |
|
|
|
market.value = result.data |
|
|
|
console.log('@@@@@@@@@@@@@@@@地区', market.value) |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error) |
|
|
|
} |
|
|
|
}*/ |
|
|
|
|
|
|
|
// 充值明细表格 |
|
|
|
const tableData = ref([]) |
|
|
@ -146,7 +107,9 @@ const total = ref(100) |
|
|
|
// 搜索对象时间 |
|
|
|
const getTime = ref([]) |
|
|
|
// 搜索goldDetail |
|
|
|
const goldDetail = ref({}) |
|
|
|
const goldDetail = ref({ |
|
|
|
markets: [], |
|
|
|
}) |
|
|
|
// 搜索对象 |
|
|
|
const getObj = ref({ |
|
|
|
pageNum: 1, |
|
|
@ -239,7 +202,8 @@ const reset = function () { |
|
|
|
delete goldDetail.value.type |
|
|
|
delete goldDetail.value.startTime |
|
|
|
delete goldDetail.value.endTime |
|
|
|
delete goldDetail.value.markets |
|
|
|
// delete goldDetail.value.markets |
|
|
|
goldDetail.value.markets = [] |
|
|
|
delete sortField.value |
|
|
|
delete sortOrder.value |
|
|
|
getTime.value = [] |
|
|
@ -368,7 +332,7 @@ const handleCurrentChange = function (val) { |
|
|
|
onMounted(async function () { |
|
|
|
await getAdminData() |
|
|
|
await get() |
|
|
|
await getmarket() |
|
|
|
await getMarket() |
|
|
|
|
|
|
|
await getPlatform() // 调用获取平台信息的函数 |
|
|
|
}) |
|
|
@ -446,24 +410,103 @@ const getTagText = (state) => { |
|
|
|
return '未知状态'; |
|
|
|
} |
|
|
|
} |
|
|
|
const handleMarketChange = (val) => { |
|
|
|
if (!Array.isArray(val)) return |
|
|
|
|
|
|
|
const hasHeadquarters = val.includes('总部') |
|
|
|
const hasOther = val.some(item => item !== '总部') |
|
|
|
|
|
|
|
if (hasHeadquarters && hasOther) { |
|
|
|
if (val[val.length - 1] === '总部') { |
|
|
|
// 用户最后点的是总部,保留总部,清除其他 |
|
|
|
goldDetail.value.markets = ['总部'] |
|
|
|
ElMessage.warning('“总部”与其他地区不可同时选择,系统已为您保留“总部”') |
|
|
|
|
|
|
|
// 存储地区选择变化 |
|
|
|
const selectedMarketPath = ref([]) |
|
|
|
//处理地区选择变化 |
|
|
|
const handleMarketChange = (value) => { |
|
|
|
if (Array.isArray(value) && value.length > 0) { |
|
|
|
const ids = new Set(); |
|
|
|
|
|
|
|
value.forEach(path => { |
|
|
|
const lastName = path[path.length - 1]; |
|
|
|
const id = reverseMarketMapping[lastName]; |
|
|
|
if (id) ids.add(Number(id)); |
|
|
|
}); |
|
|
|
|
|
|
|
// 添加额外处理:如果一个父节点下所有子节点都被选中,则把父节点也加入 |
|
|
|
const getAllLeafNames = (nodes) => { |
|
|
|
const leafNames = []; |
|
|
|
|
|
|
|
const traverse = (node, parentName = null) => { |
|
|
|
if (!node.children || node.children.length === 0) { |
|
|
|
leafNames.push({name: node.label, parent: parentName}); |
|
|
|
} else { |
|
|
|
node.children.forEach(child => traverse(child, node.label)); |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
nodes.forEach(node => traverse(node)); |
|
|
|
return leafNames; |
|
|
|
}; |
|
|
|
|
|
|
|
const leafNameMap = getAllLeafNames(markets.value); // 所有叶子节点和对应父级名称 |
|
|
|
|
|
|
|
// 列表构建 |
|
|
|
const parentToChildren = {}; |
|
|
|
leafNameMap.forEach(({name, parent}) => { |
|
|
|
if (!parentToChildren[parent]) parentToChildren[parent] = []; |
|
|
|
parentToChildren[parent].push(name); |
|
|
|
}); |
|
|
|
|
|
|
|
// 构建当前被选中的叶子节点 |
|
|
|
const selectedLeafNames = value.map(path => path[path.length - 1]); |
|
|
|
|
|
|
|
// 如果 parent 下所有子节点都选中了,就把 parent 加进来 |
|
|
|
Object.entries(parentToChildren).forEach(([parent, children]) => { |
|
|
|
const allChildrenSelected = children.every(child => selectedLeafNames.includes(child)); |
|
|
|
if (allChildrenSelected && reverseMarketMapping[parent]) { |
|
|
|
ids.add(Number(reverseMarketMapping[parent])); |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
goldDetail.value.markets = Array.from(ids); |
|
|
|
} else { |
|
|
|
// 用户最后点的是其他,保留其他,移除总部 |
|
|
|
goldDetail.value.markets = val.filter(item => item !== '总部') |
|
|
|
ElMessage.warning('“总部”与其他地区不可同时选择,系统已为您去除“总部”') |
|
|
|
goldDetail.value.markets = []; |
|
|
|
} |
|
|
|
|
|
|
|
console.log('最终映射后的 market IDs:', goldDetail.value.markets); |
|
|
|
}; |
|
|
|
|
|
|
|
const props = {multiple: true} |
|
|
|
// 获取地区,修改为级联下拉框 |
|
|
|
const getMarket = async function () { |
|
|
|
try { |
|
|
|
// 发送POST请求 |
|
|
|
const result = await API({ |
|
|
|
|
|
|
|
url: '/market/selectMarket', |
|
|
|
}); |
|
|
|
// 将响应结果存储到响应式数据中 |
|
|
|
console.log('请求成功', result) |
|
|
|
|
|
|
|
// 递归转换树形结构为级联选择器需要的格式(跳过第一级节点) |
|
|
|
const transformTree = (nodes) => { |
|
|
|
// 直接处理第一级节点的子节点 |
|
|
|
const allChildren = nodes.flatMap(node => node.children || []); |
|
|
|
|
|
|
|
return allChildren.map(child => { |
|
|
|
const grandchildren = child.children && child.children.length |
|
|
|
? transformTree([child]) // 递归处理子节点 |
|
|
|
: null; |
|
|
|
|
|
|
|
return { |
|
|
|
value: child.name, |
|
|
|
label: child.name, |
|
|
|
children: grandchildren |
|
|
|
}; |
|
|
|
}); |
|
|
|
}; |
|
|
|
// 存储地区信息 |
|
|
|
markets.value = transformTree(result.data) |
|
|
|
console.log('转换后的地区树==============', markets.value) |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
</script> |
|
|
|
<template> |
|
|
|
<div> |
|
|
@ -498,16 +541,17 @@ const handleMarketChange = (val) => { |
|
|
|
<el-col :span="6"> |
|
|
|
<div class="head-card-element"> |
|
|
|
<el-text class="mx-1" size="large">所属地区:</el-text> |
|
|
|
<el-select v-model="goldDetail.markets" placeholder="请选择所属地区" style="width: 180px" clearable |
|
|
|
multiple |
|
|
|
:loading="isLoadingArea" @change="handleMarketChange"> |
|
|
|
<el-option v-for="item in market" |
|
|
|
:key="item.value || item" |
|
|
|
:label="item.label || item" |
|
|
|
:value="item.value || item" |
|
|
|
|
|
|
|
<el-cascader |
|
|
|
v-model="selectedMarketPath" |
|
|
|
:options="markets" |
|
|
|
placeholder="请选择所属地区" |
|
|
|
clearable |
|
|
|
collapse-tags |
|
|
|
collapse-tags-tooltip |
|
|
|
style="width:180px" |
|
|
|
@change="handleMarketChange" |
|
|
|
:props="props" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|