+
+
- 管理费用·万元
+ {{ item.name }}·{{ item.unit }}
-
-
-
-
-
-
-
-
-
- 财务费用·万元
-
-
-
+
+ 完成率:{{item.detailData.rate}}%
+ 差值:{{item.detailData.diff}}
+
@@ -63,69 +51,66 @@ export default {
},
},
data() {
- return {
- // 初始化费用数据（包含flag字段）
- manageCostData: { title: "管理费用", budget: 0, real: 0, rate: 0, diff: 0, flag: 0 },
- saleCostData: { title: "销售费用", budget: 0, real: 0, rate: 0, diff: 0, flag: 0 },
- financeCostData: { title: "财务费用", budget: 0, real: 0, rate: 0, diff: 0, flag: 0 }
- }
+ return {}
+ },
+ computed: {
+ indicatorDefs() {
+ return [
+ { key: 'mgmtFee', name: '管理费用', unit: '万元'},
+ { key: 'salesFee', name: '销售费用', unit: '万元'},
+ { key: 'finFee', name: '财务费用', unit: '万元'}
+ ]
+ },
+ indicators() {
+ let _this = this
+ const fallback = { budget: 0, real: 0, rate: 0, diff: 0, flag: 0 }
+ const list = (Array.isArray(_this.monthAnalysis) ? _this.monthAnalysis : [])
+ return _this.indicatorDefs.map(def => {
+ const data = list.find(item => item && item.title === def.name) || fallback
+ const detailData = {
+ ...data,
+ flag: _this.getRateFlag(data.rate, data.real, data.budget),
+ }
+ return {
+ ...def,
+ detailData,
+ sortValue: Number((data && data.real) ?? 0)
+ }
+ })
+ },
+ sortedIndicators() {
+ const unitOrder = ['万元']
+ const unitRank = (u) => {
+ const idx = unitOrder.indexOf(u)
+ return idx === -1 ? 999 : idx
+ }
+
+ return this.indicators.slice().sort((a, b) => {
+ const ur = unitRank(a.unit) - unitRank(b.unit)
+ if (ur !== 0) return ur
+ const vr = (b.sortValue ?? -Infinity) - (a.sortValue ?? -Infinity)
+ if (vr !== 0) return vr
+ return String(a.key).localeCompare(String(b.key))
+ })
+ },
},
watch: {
monthAnalysis: {
- handler(newVal) {
- this.updateCostData(newVal)
- },
+ handler(newVal) {},
deep: true,
immediate: true // 初始化立即执行
}
},
- mounted() {
- this.updateCostData(this.monthAnalysis)
- },
+ mounted() {},
methods: {
- // 达标标识判断（≥100返回1，<100返回0）
-getRateFlag(rate, real, target) {
- if (isNaN(rate) || rate === null || rate === undefined) return 0;
-
- // 1. 完成率 >= 100 => 达标
- if (rate >= 100) return 1;
-
- // 2. 完成率 = 0 且 (目标值=0 或 实际值=目标值=0) => 达标
- if (rate === 0 && target === 0) return 1;
-
- // 其他情况 => 未达标
- return 0;
-},
-
- // 处理费用数据
- updateCostData(data) {
- // 数据兜底：确保是数组且长度≥3
- const validData = Array.isArray(data) && data.length >= 3
- ? data
- : this.$props.monthAnalysis;
-
- // 提取三个费用项数据（兜底处理）
- const manageItem = validData[0] || { title: "管理费用", budget: 0, real: 0, rate: 0, diff: 0 };
- const saleItem = validData[1] || { title: "销售费用", budget: 0, real: 0, rate: 0, diff: 0 };
- const financeItem = validData[2] || { title: "财务费用", budget: 0, real: 0, rate: 0, diff: 0 };
-
- // 整合flag字段
- this.manageCostData = {
- ...manageItem,
- flag: this.getRateFlag(manageItem.rate, manageItem.real, manageItem.budget)
- };
- this.saleCostData = {
- ...saleItem,
- flag: this.getRateFlag(saleItem.rate, saleItem.real, saleItem.budget)
- };
- this.financeCostData = {
- ...financeItem,
- flag: this.getRateFlag(financeItem.rate, financeItem.real, financeItem.budget)
- };
- // 调试日志
- console.log('管理费用数据：', this.manageCostData);
- console.log('销售费用数据：', this.saleCostData);
- console.log('财务费用数据：', this.financeCostData);
+ getRateFlag(rate, real, target) {
+ if (isNaN(rate) || rate === null || rate === undefined) return 0;
+ // 1. 完成率 >= 100 => 达标
+ if (rate >= 100) return 1;
+ // 2. 完成率 = 0 且 (目标值=0 或 实际值=目标值=0) => 达标
+ if (rate === 0 && target === 0) return 1;
+ // 其他情况 => 未达标
+ return 0;
}
}
}
@@ -169,7 +154,6 @@ getRateFlag(rate, real, target) {
line-height: 18px;
letter-spacing: 2px;
text-align: left;
- margin-bottom: 12px;
}
// 图表容器：适配高度
diff --git a/src/views/home/expenseAnalysisComponents/operatingBar.vue b/src/views/home/expenseAnalysisComponents/operatingBar.vue
index 55261062..d1666bd1 100644
--- a/src/views/home/expenseAnalysisComponents/operatingBar.vue
+++ b/src/views/home/expenseAnalysisComponents/operatingBar.vue
@@ -39,7 +39,7 @@
+ 
+ 
+