From beecb6a56aee1460095d4f9a949eff165238e535 Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期二, 31 三月 2026 10:27:04 +0800
Subject: [PATCH] 生产成品核算页面接口对接
---
src/api/costAccounting/productionCost.js | 9 ++++
src/views/costAccounting/productionCostAccounting/index.vue | 101 +++++++++++++++++++++++++++++++++++++++++++++++++-
2 files changed, 108 insertions(+), 2 deletions(-)
diff --git a/src/api/costAccounting/productionCost.js b/src/api/costAccounting/productionCost.js
index e50f5f6..cfc54d9 100644
--- a/src/api/costAccounting/productionCost.js
+++ b/src/api/costAccounting/productionCost.js
@@ -33,4 +33,13 @@
method: 'get',
params
});
+}
+
+// 浜у搧鐗╂枡Top10
+export function getProductionCostTopProducts(params) {
+ return request({
+ url: '/cost/productionCost/top/product',
+ method: 'get',
+ params
+ });
}
\ No newline at end of file
diff --git a/src/views/costAccounting/productionCostAccounting/index.vue b/src/views/costAccounting/productionCostAccounting/index.vue
index c1bc7fe..9471fe5 100644
--- a/src/views/costAccounting/productionCostAccounting/index.vue
+++ b/src/views/costAccounting/productionCostAccounting/index.vue
@@ -196,7 +196,7 @@
<span class="card-title">浜у搧鐗╂枡Top10</span>
</div>
</template>
- <div ref="topOrdersChartRef"
+ <div ref="topProductChartRef"
class="chart-container"
style="height: 300px;"></div>
</el-card>
@@ -209,6 +209,9 @@
<span class="card-title">鐢熶骇璁㈠崟Top10</span>
</div>
</template>
+ <div ref="topOrdersChartRef"
+ class="chart-container"
+ style="height: 300px;"></div>
</el-card>
</el-col>
</el-row>
@@ -289,6 +292,7 @@
getProductionCostAggregateByProduct,
getProductionCostAggregateByOrder,
getProductionCostTopOrders,
+ getProductionCostTopProducts,
} from "@/api/costAccounting/productionCost.js";
const statisticsType = ref("day");
@@ -614,6 +618,9 @@
// 鍥捐〃鐩稿叧
const topOrdersChartRef = ref(null);
let topOrdersChartInstance = null;
+ const topProductChartRef = ref(null);
+ let topProductChartInstance = null;
+ const topProductData = ref([]);
const detailVisible = ref(false);
const detailRow = ref(null);
@@ -635,6 +642,16 @@
if (topOrdersChartRef.value) {
topOrdersChartInstance = echarts.init(topOrdersChartRef.value);
updateTopOrdersChart();
+ }
+ });
+ };
+
+ // 鍒濆鍖栦骇鍝佺墿鏂橳op10鍥捐〃
+ const initTopProductChart = () => {
+ nextTick(() => {
+ if (topProductChartRef.value) {
+ topProductChartInstance = echarts.init(topProductChartRef.value);
+ updateTopProductChart();
}
});
};
@@ -661,7 +678,7 @@
grid: {
left: "3%",
right: "4%",
- bottom: "15%",
+ bottom: "5%",
top: "3%",
containLabel: true,
},
@@ -702,9 +719,73 @@
topOrdersChartInstance.setOption(option);
};
+ // 鏇存柊浜у搧鐗╂枡Top10鍥捐〃
+ const updateTopProductChart = () => {
+ if (!topProductChartInstance) return;
+
+ const data = topProductData.value;
+ const xAxisData = data.map(item => item.name);
+ const seriesData = data.map(item => item.totalCost);
+
+ const option = {
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ type: "shadow",
+ },
+ backgroundColor: "rgba(255, 255, 255, 0.95)",
+ borderColor: "#409EFF",
+ borderWidth: 1,
+ textStyle: { color: "#303133" },
+ },
+ grid: {
+ left: "3%",
+ right: "4%",
+ bottom: "5%",
+ top: "3%",
+ containLabel: true,
+ },
+ xAxis: {
+ type: "category",
+ data: xAxisData,
+ axisLabel: {
+ color: "#606266",
+ rotate: 45,
+ },
+ axisLine: { lineStyle: { color: "#ebeef5" } },
+ splitLine: { show: false },
+ },
+ yAxis: {
+ type: "value",
+ name: "鎴愭湰(鍏�)",
+ nameTextStyle: { color: "#606266" },
+ axisLabel: { color: "#606266" },
+ axisLine: { show: false },
+ splitLine: { lineStyle: { color: "#f0f2f5" } },
+ },
+ series: [
+ {
+ name: "鎴愭湰",
+ type: "bar",
+ data: seriesData,
+ itemStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ { offset: 0, color: "#16a34a" },
+ { offset: 1, color: "#4ade80" },
+ ]),
+ },
+ barWidth: "60%",
+ },
+ ],
+ };
+
+ topProductChartInstance.setOption(option);
+ };
+
// 绐楀彛澶у皬鍙樺寲鏃堕噸鏂版覆鏌撳浘琛�
const handleResize = () => {
topOrdersChartInstance && topOrdersChartInstance.resize();
+ topProductChartInstance && topProductChartInstance.resize();
};
const handleTypeChange = () => {
@@ -790,6 +871,21 @@
console.error("鑾峰彇鐢熶骇璁㈠崟Top10鏁版嵁澶辫触锛�", err);
ElMessage.error("绯荤粺寮傚父锛岃幏鍙栫敓浜ц鍗昑op10鏁版嵁澶辫触");
});
+
+ // 璋冪敤API鑾峰彇浜у搧鐗╂枡Top10鏁版嵁
+ getProductionCostTopProducts(apiParams)
+ .then(res => {
+ if (res.code === 200) {
+ topProductData.value = res.data || [];
+ updateTopProductChart();
+ } else {
+ ElMessage.error(res.message || "鑾峰彇浜у搧鐗╂枡Top10鏁版嵁澶辫触");
+ }
+ })
+ .catch(err => {
+ console.error("鑾峰彇浜у搧鐗╂枡Top10鏁版嵁澶辫触锛�", err);
+ ElMessage.error("绯荤粺寮傚父锛岃幏鍙栦骇鍝佺墿鏂橳op10鏁版嵁澶辫触");
+ });
};
const handleReset = () => {
@@ -813,6 +909,7 @@
loadOrders();
handleQuery();
initTopOrdersChart();
+ initTopProductChart();
window.addEventListener("resize", handleResize);
});
--
Gitblit v1.9.3