|
|
@ -4,6 +4,7 @@ import { dayjs, ElMessage } from 'element-plus' |
|
|
import request from '@/util/http' |
|
|
import request from '@/util/http' |
|
|
import API from '@/util/http' |
|
|
import API from '@/util/http' |
|
|
import moment from 'moment' |
|
|
import moment from 'moment' |
|
|
|
|
|
import {marketMapping, reverseMarketMapping} from "@/utils/marketMap.js"; |
|
|
// 之后整理一下 |
|
|
// 之后整理一下 |
|
|
|
|
|
|
|
|
/* |
|
|
/* |
|
|
@ -277,6 +278,7 @@ const reset = function () { |
|
|
sortOrder.value = '' |
|
|
sortOrder.value = '' |
|
|
getTime.value = {} |
|
|
getTime.value = {} |
|
|
activeTimeRange.value = '' // 清除激活状态 |
|
|
activeTimeRange.value = '' // 清除激活状态 |
|
|
|
|
|
selectedMarketPath.value = [] |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 点完重置后，重新请求数据 |
|
|
// 点完重置后，重新请求数据 |
|
|
@ -361,28 +363,50 @@ const getGoods = async function () { |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 获取地区列表的方法 |
|
|
// 获取地区列表的方法 |
|
|
|
|
|
|
|
|
|
|
|
// 获取地区，修改为级联下拉框 |
|
|
const getMarket = async function () { |
|
|
const getMarket = async function () { |
|
|
|
|
|
console.log('获取地区adminid', adminData.value) |
|
|
try { |
|
|
try { |
|
|
// 发送请求获取地区列表 |
|
|
|
|
|
const result = await request({ |
|
|
|
|
|
// url: '/general/market', |
|
|
|
|
|
|
|
|
// 发送POST请求 |
|
|
|
|
|
const result = await API({ |
|
|
|
|
|
|
|
|
url: '/general/adminMarkets', // todo 换成实际接口地址 |
|
|
|
|
|
|
|
|
url: '/market/selectMarket', |
|
|
data: {account: adminData.value.account} |
|
|
data: {account: adminData.value.account} |
|
|
}) |
|
|
|
|
|
console.log('请求地区列表成功', result) |
|
|
|
|
|
// 存储地区数据 |
|
|
|
|
|
market.value = result.data |
|
|
|
|
|
console.log('地区数据', market.value) |
|
|
|
|
|
|
|
|
}); |
|
|
|
|
|
// 将响应结果存储到响应式数据中 |
|
|
|
|
|
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 |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
return { |
|
|
|
|
|
value: node.name, //使用地区名称作为值 |
|
|
|
|
|
label: node.name, //显示名称 |
|
|
|
|
|
children |
|
|
|
|
|
}; |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
// 存储地区信息 |
|
|
|
|
|
market.value = transformTree(result.data) |
|
|
|
|
|
console.log('转换后的地区树', market.value) |
|
|
} catch (error) { |
|
|
} catch (error) { |
|
|
console.log('请求地区列表失败', error) |
|
|
|
|
|
ElMessage({ |
|
|
|
|
|
type: 'error', |
|
|
|
|
|
message: '获取地区列表失败，请稍后重试' |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
console.log('请求失败', error) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 处理排序事件 |
|
|
// 处理排序事件 |
|
|
const handleSortChange = (column) => { |
|
|
const handleSortChange = (column) => { |
|
|
console.log('排序字段：', column.prop) |
|
|
console.log('排序字段：', column.prop) |
|
|
@ -525,6 +549,24 @@ const getTagText = (state) => { |
|
|
return '未知状态'; |
|
|
return '未知状态'; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 存储地区选择变化 |
|
|
|
|
|
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; |
|
|
|
|
|
|
|
|
|
|
|
// 反向映射 |
|
|
|
|
|
consumeUser.value.market = reverseMarketMapping[selectedName] || ''; |
|
|
|
|
|
} else { |
|
|
|
|
|
consumeUser.value.market = ''; |
|
|
|
|
|
} |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<template> |
|
|
<template> |
|
|
@ -541,7 +583,7 @@ const getTagText = (state) => { |
|
|
<el-col :span="6"> |
|
|
<el-col :span="6"> |
|
|
<div class="head-card-element"> |
|
|
<div class="head-card-element"> |
|
|
<el-text class="mx-1" size="large">商品名称：</el-text> |
|
|
<el-text class="mx-1" size="large">商品名称：</el-text> |
|
|
<el-select v-model="consumeUser.goodsName" placeholder="请选择商品名称" size="large" style="width: 180px" |
|
|
|
|
|
|
|
|
<el-select v-model="consumeUser.goodsName" placeholder="请选择商品名称" style="width: 180px" |
|
|
clearable> |
|
|
clearable> |
|
|
<!-- 修改 v-for 绑定逻辑 --> |
|
|
<!-- 修改 v-for 绑定逻辑 --> |
|
|
<el-option v-for="(item, index) in goods" :key="index" :label="item" :value="item"/> |
|
|
<el-option v-for="(item, index) in goods" :key="index" :label="item" :value="item"/> |
|
|
@ -549,17 +591,21 @@ const getTagText = (state) => { |
|
|
</div> |
|
|
</div> |
|
|
</el-col> |
|
|
</el-col> |
|
|
<el-col :span="6"> |
|
|
<el-col :span="6"> |
|
|
<div class="head-card-element"> |
|
|
|
|
|
<el-text class="mx-1" size="large">所属地区：</el-text> |
|
|
<el-text class="mx-1" size="large">所属地区：</el-text> |
|
|
<el-select v-model="consumeUser.market" placeholder="请选择所属地区" size="large" style="width: 180px" clearable> |
|
|
|
|
|
<el-option v-for="(item, index) in market" :key="index" :label="item" :value="item" /> |
|
|
|
|
|
</el-select> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
<el-cascader |
|
|
|
|
|
v-model="selectedMarketPath" |
|
|
|
|
|
:options="market" |
|
|
|
|
|
placeholder="请选择所属地区" |
|
|
|
|
|
clearable |
|
|
|
|
|
style="width:180px" |
|
|
|
|
|
@change="handleMarketChange" |
|
|
|
|
|
/> |
|
|
</el-col> |
|
|
</el-col> |
|
|
<el-col :span="6"> |
|
|
<el-col :span="6"> |
|
|
<div class="head-card-element"> |
|
|
<div class="head-card-element"> |
|
|
<el-text class="mx-1" size="large">消耗平台：</el-text> |
|
|
<el-text class="mx-1" size="large">消耗平台：</el-text> |
|
|
<el-select v-model="consumeUser.payPlatform" placeholder="请选择消耗平台" size="large" style="width: 180px" |
|
|
|
|
|
|
|
|
<el-select v-model="consumeUser.payPlatform" placeholder="请选择消耗平台" |
|
|
|
|
|
style="width: 180px" |
|
|
clearable> |
|
|
clearable> |
|
|
<el-option v-for="item in consumePlatform" :key="item.value" :label="item.label" :value="item.value"/> |
|
|
<el-option v-for="item in consumePlatform" :key="item.value" :label="item.label" :value="item.value"/> |
|
|
</el-select> |
|
|
</el-select> |
|
|
@ -573,11 +619,14 @@ const getTagText = (state) => { |
|
|
<el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间" |
|
|
<el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间" |
|
|
end-placeholder="结束时间" style="width: 400px" @change="handleDatePickerChange"/> |
|
|
end-placeholder="结束时间" style="width: 400px" @change="handleDatePickerChange"/> |
|
|
<el-button @click="getToday()" style="margin-left: 10px" |
|
|
<el-button @click="getToday()" style="margin-left: 10px" |
|
|
:type="activeTimeRange === 'today' ? 'primary' : ''"> 今</el-button> |
|
|
|
|
|
|
|
|
:type="activeTimeRange === 'today' ? 'primary' : ''"> 今 |
|
|
|
|
|
</el-button> |
|
|
<el-button @click="getYesterday()" style="margin-left: 10px" |
|
|
<el-button @click="getYesterday()" style="margin-left: 10px" |
|
|
:type="activeTimeRange === 'yesterday' ? 'primary' : ''"> 昨</el-button> |
|
|
|
|
|
|
|
|
:type="activeTimeRange === 'yesterday' ? 'primary' : ''"> 昨 |
|
|
|
|
|
</el-button> |
|
|
<el-button @click="get7Days()" style="margin-left: 10px" |
|
|
<el-button @click="get7Days()" style="margin-left: 10px" |
|
|
:type="activeTimeRange === '7days' ? 'primary' : ''"> 近7天</el-button> |
|
|
|
|
|
|
|
|
:type="activeTimeRange === '7days' ? 'primary' : ''"> 近7天 |
|
|
|
|
|
</el-button> |
|
|
<!-- </div> |
|
|
<!-- </div> |
|
|
</el-col> |
|
|
</el-col> |
|
|
<el-col :span="3"> |
|
|
<el-col :span="3"> |
|
|
@ -614,7 +663,11 @@ const getTagText = (state) => { |
|
|
<el-table-column prop="name" label="姓名" width="150px" fixed="left"/> |
|
|
<el-table-column prop="name" label="姓名" width="150px" fixed="left"/> |
|
|
<!-- 固定精网号列 --> |
|
|
<!-- 固定精网号列 --> |
|
|
<el-table-column prop="jwcode" label="精网号" width="110px" fixed="left"/> |
|
|
<el-table-column prop="jwcode" label="精网号" width="110px" fixed="left"/> |
|
|
<el-table-column prop="market" label="所属地区" width="110px" /> |
|
|
|
|
|
|
|
|
<el-table-column prop="market" label="所属地区" width="110px"> |
|
|
|
|
|
<template #default="scope"> |
|
|
|
|
|
{{ marketMapping[scope.row.market] || scope.row.market }} |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-table-column> |
|
|
<el-table-column prop="goodsName" label="商品" width="160px" show-overflow-tooltip/> |
|
|
<el-table-column prop="goodsName" label="商品" width="160px" show-overflow-tooltip/> |
|
|
<el-table-column prop="payPlatform" label="消耗平台" width="120px"> |
|
|
<el-table-column prop="payPlatform" label="消耗平台" width="120px"> |
|
|
<template #default="scope"> |
|
|
<template #default="scope"> |
|
|
@ -664,7 +717,8 @@ const getTagText = (state) => { |
|
|
<!-- 分页 --> |
|
|
<!-- 分页 --> |
|
|
<div class="pagination"> |
|
|
<div class="pagination"> |
|
|
<el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]" |
|
|
<el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]" |
|
|
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange" |
|
|
|
|
|
|
|
|
layout="total, sizes, prev, pager, next, jumper" :total="total" |
|
|
|
|
|
@size-change="handlePageSizeChange" |
|
|
@current-change="handleCurrentChange"></el-pagination> |
|
|
@current-change="handleCurrentChange"></el-pagination> |
|
|
</div> |
|
|
</div> |
|
|
</el-card> |
|
|
</el-card> |
|
|
|
lihui
3 weeks ago