diff --git a/src/store/index.js b/src/store/index.js index 2a86cd8..de91a35 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,10 +1,11 @@ // src/store/index.js -import { defineStore } from 'pinia' +import {defineStore} from 'pinia' export const useAdminStore = defineStore('admin', { state: () => ({ adminData: null, // 用户信息 - menuTree: null, // 菜单权限树 + menuTree: [], // 菜单权限树 + marketList: {}, // 市场列表 }), actions: { // 设置用户信息并同步到localStorage @@ -18,11 +19,16 @@ export const useAdminStore = defineStore('admin', { this.menuTree = tree localStorage.setItem('menuTree', JSON.stringify(tree)) }, + setMarketList(list) { + this.marketList = list + localStorage.setItem('marketList', JSON.stringify(list)) + }, // 从localStorage初始化数据 initFromLocalStorage() { const adminData = localStorage.getItem('adminData') const menuTree = localStorage.getItem('menuTree') + const marketList = localStorage.getItem('marketList') if (adminData) { this.adminData = JSON.parse(adminData) @@ -31,14 +37,20 @@ export const useAdminStore = defineStore('admin', { if (menuTree) { this.menuTree = JSON.parse(menuTree) } + + if (marketList) { + this.marketList = JSON.parse(marketList) + } }, // 清空状态并移除localStorage数据 clearState() { this.adminData = null - this.menuTree = null + this.menuTree = [] + this.marketList = {} localStorage.removeItem('adminData') localStorage.removeItem('menuTree') + localStorage.removeItem('marketList') // localStorage.removeItem('token') } } diff --git a/src/utils/marketMap.js b/src/utils/marketMap.js index 6c1d227..e752179 100644 --- a/src/utils/marketMap.js +++ b/src/utils/marketMap.js @@ -1,30 +1,12 @@ -// 地区映射表 -export const marketMapping = { - 1: "Capt", - 2: "公司", - 3: "市场部", - 4: "新加坡", - 5: "马来西亚", - 6: "Marymount", - 7: "City Hall", - 8: "Jurong", - 9: "研发部", - 10: "Tampines", - 11: "吉隆坡", - 13: "香港", - 14: "湾仔", - 24016: "加拿大", - 24018: "泰国", - 24019: "Asoke", - 24020: "槟城", - 24021: "新山", - 24022: "越南HCM", - 24027: "韩国", - 24028: "深圳运营", - 24029: "深圳", - 24030: "未知", - null:"---" -}; +import {storeToRefs} from 'pinia'; +import {useAdminStore} from '@/store/index.js'; + +const adminStore = useAdminStore(); +const {marketList} = storeToRefs(adminStore); + +// 地区映射 +export const marketMapping = marketList.value; +console.log('marketList:', marketList) // 反向映射 export const reverseMarketMapping = Object.entries(marketMapping).reduce((acc, [key, value]) => { acc[value] = key; diff --git a/src/views/login.vue b/src/views/login.vue index 2595477..b491ff0 100644 --- a/src/views/login.vue +++ b/src/views/login.vue @@ -7,6 +7,7 @@ import API from "@/util/http.js"; import {useAdminStore} from '@/store' // 方法抽出来 三个地方会用到 import {filterFirstMenu, findFirstThirdLevelMenu, getRoutePath,} from "../utils/menuUtils.js" +import {storeToRefs} from "pinia"; const router = useRouter() // 获取路由实例 //获取当前浏览器地址 @@ -74,6 +75,10 @@ const login = async function () { router.push(redirectPath) ElMessage.success('登录成功') + + // 获取地区 + + await selectMarket() console.log('请求成功', result) } else { form.value.password = '' @@ -100,6 +105,43 @@ const getMenuTree = async function () { } } +// 获取地区列表 用于映射 +const selectMarket = async function () { + try { + const selectMarketResult = await API({ url: '/market/selectMarket' }); + const marketList = {}; + + // 递归遍历树形结构（从子节点开始） + const traverseTree = (nodes) => { + nodes.forEach(node => { + // 存储当前节点的 id 和 name + marketList[node.id] = node.name; + // 递归处理子节点 + if (node.children && node.children.length > 0) { + traverseTree(node.children); + } + }); + }; + + // 关键：跳过第一级节点，直接遍历第一级的子节点 + // 假设 selectMarketResult.data 是根节点数组（第一级） + selectMarketResult.data.forEach(rootNode => { + // 只处理第一级节点的子节点（从第二级开始遍历） + if (rootNode.children && rootNode.children.length > 0) { + traverseTree(rootNode.children); + } + }); + + console.log('排除第一级后的地区列表：', marketList); + adminStore.setMarketList(marketList); + + // return marketList; + + } catch (error) { + console.error('获取地区树失败：', error); + return {}; + } +}; onMounted(() => { getMachineId() diff --git a/src/views/recharge/coinRechargeDetail.vue b/src/views/recharge/coinRechargeDetail.vue index 9a51aa6..52cb5da 100644 --- a/src/views/recharge/coinRechargeDetail.vue +++ b/src/views/recharge/coinRechargeDetail.vue @@ -33,26 +33,66 @@ const handleDatePickerChange = () => { // 搜索=========================================== // 搜索recharge const rechargeUser = ref({ - adminId: adminData.value.id + adminId: adminData.value.id, + markets: [], }) // 存储地区选择变化 -const selectedMarketPath = ref([]) +const selectedMarketPath = ref([]) //处理地区选择变化 const handleMarketChange = (value) => { - if (value && value.length > 0) { - const lastValue = value[value.length - 1]; - let selectedName = lastValue.endsWith('_all') - ? lastValue.replace('_all', '') - : lastValue; - - // 反向映射 - rechargeUser.value.market = reverseMarketMapping[selectedName] || ''; + 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); // 所有叶子节点和对应父级名称 + + // 构建一个 { parentName: [childName1, childName2, ...] } 的结构 + 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])); + } + }); + + rechargeUser.value.markets = Array.from(ids); } else { - rechargeUser.value.market = ''; + rechargeUser.value.markets = []; } -}; + console.log('最终映射后的 market IDs:', rechargeUser.value.markets); +}; // 搜索对象 const getObj = ref({ @@ -68,7 +108,7 @@ const activity = ref([]) // 所有信息 const allData = ref([]) // 搜索地区列表 -const market = ref([]) +const markets = ref([]) //时间格式化 const formatTime = (val) => val ? moment(val).format('YYYY-MM-DD HH:mm:ss') : '' // 初始化 money 和 permanentGold 和 freeGold @@ -136,7 +176,7 @@ const getActivity = async function () { // 在这里可以处理错误逻辑，比如显示错误提示等 } } - +const marketsTree = ref("") // 获取地区，修改为级联下拉框 const getArea = async function () { console.log('获取地区adminid', adminData.value) @@ -150,30 +190,26 @@ const getArea = async function () { // 将响应结果存储到响应式数据中 console.log('请求成功', result) - // 递归转换树形结构为级联选择器需要的格式 + // 递归转换树形结构为级联选择器需要的格式（跳过第一级节点） const transformTree = (nodes) => { - return nodes.map(node => { - const children = node.children && node.children.length - ? transformTree(node.children) - : null; - // 如果有子节点，添加“全部”选项 - if (children) { - children.unshift({ - value: `${node.name}_all`, // 唯一标识 - label: '全部', - children: null - }); - } + // 直接处理第一级节点的子节点 + const allChildren = nodes.flatMap(node => node.children || []); + + return allChildren.map(child => { + const grandchildren = child.children && child.children.length + ? transformTree([child]) // 递归处理子节点 + : null; + return { - value: node.name, //使用地区名称作为值 - label: node.name, //显示名称 - children + value: child.name, + label: child.name, + children: grandchildren }; }); - } + }; // 存储地区信息 - market.value = transformTree(result.data) - console.log('转换后的地区树', market.value) + markets.value = transformTree(result.data) + console.log('转换后的地区树==============', markets.value) } catch (error) { console.log('请求失败', error) } @@ -239,7 +275,7 @@ const get = async function (val) { }) // 复制一份 rechargeUser.value 并移除排序字段和排序方式 const detailWithoutSort = ref({ - market: rechargeUser.value.market, + markets: rechargeUser.value.markets, activity: rechargeUser.value.activity, adminId: rechargeUser.value.adminId, startTime: rechargeUser.value.startTime, @@ -297,8 +333,8 @@ const reset = function () { delete rechargeUser.value.jwcode delete rechargeUser.value.activity delete rechargeUser.value.payPlatform - delete rechargeUser.value.market - selectedMarketPath .value = [] // 重置地区选择路径 + rechargeUser.value.markets = [] + selectedMarketPath.value = [] // 重置地区选择路径 delete rechargeUser.value.startTime delete rechargeUser.value.endTime delete sortField.value @@ -508,6 +544,7 @@ const getTagText = (state) => { return '未知状态'; } } +const props = {multiple: true} @@ -543,13 +580,16 @@ const getTagText = (state) => {
所属地区： + v-model="selectedMarketPath" + :options="markets" + placeholder="请选择所属地区" + clearable + collapse-tags + collapse-tags-tooltip + style="width:180px" + @change="handleMarketChange" + :props="props" + />
@@ -609,7 +649,7 @@ const getTagText = (state) => { diff --git a/src/views/workspace/index.vue b/src/views/workspace/index.vue index 98d914b..29c9f00 100644 --- a/src/views/workspace/index.vue +++ b/src/views/workspace/index.vue @@ -230,6 +230,9 @@ import utc from 'dayjs-plugin-utc' dayjs.extend(utc) import {ArrowUpBold, ArrowDownBold, SemiSelect} from '@element-plus/icons-vue' import {marketMapping} from "@/utils/marketMap.js"; + + + // 地区数据 const markets = ref([]) // 图表相关 @@ -454,7 +457,7 @@ const getMarkets = async () => { } }) if (Array.isArray(response.data)) { - markets.value = response.data + markets.value = response.data.filter(data => data !== "1") console.log('市场列表获取成功:', markets.value) } else { console.error('获取市场列表失败', response)