-
![]()
-
- {{ item.goodInfo }}
+
+
+
+
![]()
+
+ {{ item.goodInfo }}
+
+
+
+
{{ item.refundedOrders }}
+
+
+
{{ item.refundAmount }}
-
-
-
{{ item.refundedOrders }}
-
-
-
{{ item.refundAmount }}
@@ -176,7 +184,7 @@
From ebdd3f45389ddfd33264dd24f0f5ced2a330199c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=83=AD=E6=B0=B8=E8=B6=85?= <2090205686@qq.com>
Date: Thu, 19 Jun 2025 10:54:39 +0800
Subject: [PATCH 4/4] =?UTF-8?q?=E7=94=B5=E5=95=86=E4=BA=A4=E6=98=93=20-=20?=
=?UTF-8?q?=E4=BA=A4=E6=98=93=E5=88=86=E6=9E=90=E7=9C=8B=E6=9D=BF=E5=9B=BE?=
=?UTF-8?q?=E8=A1=A8=E6=8E=A5=E5=8F=A3=E5=AF=B9=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/api/trade/dataBoard.js | 2 +-
src/views/trade/dataBoard.vue | 72 +++++++++++++++--------------------
2 files changed, 32 insertions(+), 42 deletions(-)
diff --git a/src/api/trade/dataBoard.js b/src/api/trade/dataBoard.js
index 569fbad..66bedcf 100644
--- a/src/api/trade/dataBoard.js
+++ b/src/api/trade/dataBoard.js
@@ -11,7 +11,7 @@ export function getAstsTransTotals(data) {
//获取顶部右侧数据（线形图）
export function getEchartsData(data) {
return request({
- url: "/brand/brandbase/save",
+ url: "/tairui-transettle/astsInfo/getSalesChartData",
method: "post",
data: data,
});
diff --git a/src/views/trade/dataBoard.vue b/src/views/trade/dataBoard.vue
index 965053d..ce73a11 100644
--- a/src/views/trade/dataBoard.vue
+++ b/src/views/trade/dataBoard.vue
@@ -197,7 +197,6 @@ import img2 from "@/assets/images/second.png";
import img3 from "@/assets/images/third.png";
import alert from "@/assets/images/alert.png";
let tomato = ref("http://gov-cloud.oss-cn-chengdu.aliyuncs.com/backend/a866613495ed4678957a4440b8d3776c.png");
-import bottomLefttableData from "./bottomLeft.json"
// 图表 DOM 引用
const chartRef = ref(null);
@@ -284,8 +283,8 @@ const option = {
},
grid: {
top: '20%',
- left: 20,
- right: 20,
+ left: 26,
+ right: 26,
bottom: 40, // 底部留白给图例
},
xAxis: [
@@ -538,13 +537,12 @@ const resizeChart = () => {
const loadEchartsData = async () => {
try {
let response = await getEchartsData({
- queryStartTime: startDate.value,
- queryEndTime: endDate.value,
+ queryStartTime: startDate.value + " 00:00:00",
+ queryEndTime: endDate.value + " 23:59:59",
queryType: dateRadio.value,
});
- console.log(response);
if (response.code == 200) {
- option.xAxis[0].data = response.data?.xData ?? generateDateArray(7);
+ option.xAxis[0].data = response.data?.xdata ?? generateDateArray(7);
option.series[0].data = response.data?.totalSalesData;
option.series[1].data = response.data?.totalOrdersData;
option.series[2].data = response.data?.pageViewData;
@@ -556,7 +554,7 @@ const loadEchartsData = async () => {
} catch (error) { }
};
const echartsMockData = (count = 7) => {
- console.log("右上角图表数据更新");
+ // console.log("右上角图表数据更新");
const xzData = generateDateArray(count);
let obj = Mock.mock({
// x轴数据 (日期/月份)
@@ -579,7 +577,6 @@ const echartsMockData = (count = 7) => {
option.series[1].data = obj.totalOrdersData;
option.series[2].data = obj.pageViewData;
option.series[3].data = obj.refundAmountData;
- console.log(option);
chartInstance.setOption(option);
};
const generateDateArray = (count) => {
@@ -604,21 +601,19 @@ let dateRadio = ref(1);
let startDate = ref('');
let endDate = ref('');
const changeDateRadio = (val) => {
- console.log(val);
// val 1 按周 2 按月 3 按年
let date = generateDateRange(val);
- console.log(date);
startDate.value = date.startDate;
endDate.value = date.endDate;
// 调用各个模块的方法更新数据
loadTopLeftData();
- // loadEchartsData(); //真实图表数据
+ loadEchartsData(); //真实图表数据
loadMiddleData();
loadbottomLeftData();
loadbottomRightData();
- // 测试-----------
+ // 测试图表数据-----------
let day = 7;
if (val == 1) {
day = 7;
@@ -627,7 +622,7 @@ const changeDateRadio = (val) => {
} else if (val == 3) {
day = 365;
}
- echartsMockData(day); //模拟图表数据
+ // echartsMockData(day); //模拟图表数据
};
/**
@@ -675,9 +670,17 @@ function generateDateRange(type) {
}
let topLeftData = ref({});
+const initTopLeftData = () => {
+ topLeftData.value = Object.assign({}, {
+ salesTotalAmount: 0, //销售总额
+ orderTotalNum: 0, //订单总数
+ viewCount: 0, //浏览量
+ refundSuccessAmout: 0, //成功退款金额
+ });
+};
// 加载数据-顶部左侧模块
const loadTopLeftData = async () => {
- console.log('左上角数据更新');
+ // console.log('左上角数据更新');
try {
let response = await getAstsTransTotals({
queryStartTime: startDate.value + " 00:00:00",
@@ -687,20 +690,10 @@ const loadTopLeftData = async () => {
if (response.code == 200) {
topLeftData.value = response.data;
} else {
- topLeftData.value = Object.assign({}, {
- salesTotalAmount: 0, //销售总额
- orderTotalNum: 0, //订单总数
- viewCount: 0, //浏览量
- refundSuccessAmout: 0, //成功退款金额
- });
+ initTopLeftData();
}
} catch (error) {
- topLeftData.value = Object.assign({}, {
- salesTotalAmount: 0, //销售总额
- orderTotalNum: 0, //订单总数
- viewCount: 0, //浏览量
- refundSuccessAmout: 0, //成功退款金额
- });
+ initTopLeftData();
}
};
@@ -731,7 +724,7 @@ const generateMockData = () => {
};
// 加载数据-中间模块
const loadMiddleData = async () => {
- console.log('中间数据更新');
+ // console.log('中间数据更新');
// middleData.value = generateMockData();
try {
@@ -740,7 +733,6 @@ const loadMiddleData = async () => {
queryEndTime: endDate.value + " 23:59:59",
queryType: dateRadio.value,
});
- console.log(response);
if (response.code == 200) {
middleData.value = response.data;
} else {
@@ -761,35 +753,34 @@ const columns = ref([
]);
// 加载数据-底部左侧模块
const loadbottomLeftData = async () => {
- console.log('左下角数据更新');
+ // console.log('左下角数据更新');
// tableLoading.value = true;
// tableData.value = generateMockData();
- // tableData.value = bottomLefttableData.data;
// tableLoading.value = false;
try {
tableLoading.value = true;
let response = await getGoodsSalesInfo({
- queryStartTime: startDate.value,
- queryEndTime: endDate.value,
+ queryStartTime: startDate.value + " 00:00:00",
+ queryEndTime: endDate.value + " 23:59:59",
queryType: dateRadio.value,
orderByType: 0 // 0: 按照销售金额排序 2: 按照销售数量排序
});
tableLoading.value = false;
- console.log(response);
if (response.code == 200) {
tableData.value = response.data;
} else {
tableData.value = [];
}
- } catch (error) { }
+ } catch (error) {
+ tableLoading.value = false;
+ }
};
-// 底部右侧模块
const afterSalesData = ref({});
// 加载数据-底部右侧模块
const loadbottomRightData = async () => {
- console.log('右下角数据更新');
+ // console.log('右下角数据更新');
// afterSalesData.value = {
// totalAfterSalesOrders: 1128,
// totalRefundAmount: 265,
@@ -806,11 +797,10 @@ const loadbottomRightData = async () => {
try {
let response = await getAfterSalesData({
- queryStartTime: startDate.value,
- queryEndTime: endDate.value,
+ queryStartTime: startDate.value + " 00:00:00",
+ queryEndTime: endDate.value + " 23:59:59",
queryType: dateRadio.value,
});
- console.log(response);
if (response.code == 200) {
afterSalesData.value = response.data;
}
@@ -840,11 +830,11 @@ const calculateTableHeight = () => {
};
onMounted(async() => {
+ initTopLeftData
await initChart();
changeDateRadio(1);
await nextTick();
calculateTableHeight();
- console.log(tableViewportHeight.value);
window.addEventListener("resize", calculateTableHeight);
});
// 组件卸载前销毁图表