|
@@ -6,7 +6,7 @@
|
|
|
:title="'经营数据'"
|
|
|
@changeValue="changeValue"
|
|
|
:isShowQuert="true"
|
|
|
- :endDate='endDate'
|
|
|
+ :endDate="endDate"
|
|
|
/>
|
|
|
</div>
|
|
|
<statistic :col="5" class="statistic" :cols="0">
|
|
@@ -43,11 +43,12 @@
|
|
|
</el-radio-group>
|
|
|
</div>
|
|
|
<!-- v-if="timer == 'day'" DD-->
|
|
|
- <ve-line
|
|
|
+ <ve-histogram
|
|
|
:data="timer == 'day' ? chartData : chartDataForMoth"
|
|
|
height="350px"
|
|
|
:data-empty="dataEmpty"
|
|
|
:extend="chartExtend"
|
|
|
+ :settings="chartSettings"
|
|
|
:legend="legend"
|
|
|
/>
|
|
|
<!-- <ve-line
|
|
@@ -70,6 +71,7 @@
|
|
|
import "echarts/lib/component/dataZoom";
|
|
|
import countTo from "vue-count-to";
|
|
|
import veLine from "v-charts/lib/line.common";
|
|
|
+import histogram from "v-charts/lib/histogram.common";
|
|
|
import searchHeader from "./modals/searchHeader";
|
|
|
import { getIndex } from "../api";
|
|
|
import { getTimes } from "@/utils";
|
|
@@ -80,6 +82,7 @@ export default {
|
|
|
components: {
|
|
|
"ve-line": veLine,
|
|
|
"count-to": countTo,
|
|
|
+ "ve-histogram": histogram,
|
|
|
searchHeader,
|
|
|
},
|
|
|
computed: {
|
|
@@ -90,16 +93,19 @@ export default {
|
|
|
},
|
|
|
items() {
|
|
|
return {
|
|
|
+ TOTAL_AMOUNT: this.data["TOTAL_AMOUNT"] || {},
|
|
|
FINANCE_AMOUNT: this.data["FINANCE_AMOUNT"] || {},
|
|
|
FINANCE_BALANCE_AMOUNT: this.data["FINANCE_BALANCE_AMOUNT"] || {},
|
|
|
FINANCE_PAY: this.data["FINANCE_PAY"] || {},
|
|
|
};
|
|
|
+ //
|
|
|
},
|
|
|
chartExtend() {
|
|
|
return {
|
|
|
series: {
|
|
|
smooth: false,
|
|
|
},
|
|
|
+
|
|
|
yAxis: {
|
|
|
//纵轴标尺固定
|
|
|
minInterval: 1,
|
|
@@ -114,11 +120,15 @@ export default {
|
|
|
formatter: (item) => {
|
|
|
return [
|
|
|
item[0].axisValueLabel,
|
|
|
+ `<br/><span style="margin-right:5px;border-radius:10px;width:10px;height:10px;display:inline-block;"></span>总收入:${this.$helpers
|
|
|
+ .numeral(item[0].value + item[1].value-item[2].value)
|
|
|
+ .format("0,0.00")}元`,
|
|
|
...item.map((d) => {
|
|
|
return `<br/>${d.marker}${
|
|
|
d.seriesName
|
|
|
- }: ${this.$helpers.numeral(d.value[1]).format("0,0.00")}元`;
|
|
|
+ }: ${this.$helpers.numeral(d.value).format("0,0.00")}元`;
|
|
|
}),
|
|
|
+
|
|
|
].join("");
|
|
|
},
|
|
|
},
|
|
@@ -148,8 +158,9 @@ export default {
|
|
|
months[key][item.title] = row.percent;
|
|
|
}
|
|
|
}
|
|
|
+ // console.log(values);
|
|
|
return {
|
|
|
- columns: ["日期", ...values.map((item) => item.title)],
|
|
|
+ columns: ["日期", "现金收入", "余额收入", "财务支出"],
|
|
|
rows: Object.values(months),
|
|
|
loading: true,
|
|
|
};
|
|
@@ -175,35 +186,37 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
return {
|
|
|
- columns: ["月份", ...values.map((item) => item.title)],
|
|
|
+ columns: ["月份", "现金收入", "余额收入", "财务支出"],
|
|
|
rows: Object.values(months),
|
|
|
loading: true,
|
|
|
};
|
|
|
},
|
|
|
-
|
|
|
dataEmpty() {
|
|
|
return !this.chartData.rows.length;
|
|
|
},
|
|
|
},
|
|
|
data() {
|
|
|
+ this.chartSettings = {
|
|
|
+ stack: { 总收入: [`现金收入`, `余额收入`] },
|
|
|
+ };
|
|
|
return {
|
|
|
active: "SHOULD_INCOME_MONEY",
|
|
|
timer: "day",
|
|
|
- mdate:[],
|
|
|
+ mdate: [],
|
|
|
loading: false,
|
|
|
- endDate:''
|
|
|
+ endDate: "",
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
- this.mdate = this.getInitDate()
|
|
|
- this.endDate = this.$helpers
|
|
|
- .dayjs(new Date())
|
|
|
- .format("YYYY-MM-DD");
|
|
|
- this.changeValue(this.mdate)
|
|
|
+ this.init();
|
|
|
},
|
|
|
methods: {
|
|
|
+ init() {
|
|
|
+ this.mdate = this.getInitDate();
|
|
|
+ this.endDate = this.$helpers.dayjs(new Date()).format("YYYY-MM-DD");
|
|
|
+ this.changeValue(this.mdate);
|
|
|
+ },
|
|
|
changeValue(date) {
|
|
|
// 请求更改数据
|
|
|
this.mdate = date;
|
|
@@ -218,7 +231,9 @@ export default {
|
|
|
const res = await getIndex({
|
|
|
...rest,
|
|
|
...getTimes(this.mdate, ["startDate", "endDate"]),
|
|
|
- dataTypes: "FINANCE_AMOUNT,FINANCE_BALANCE_AMOUNT,FINANCE_PAY",
|
|
|
+ //
|
|
|
+ dataTypes:
|
|
|
+ "FINANCE_AMOUNT,FINANCE_BALANCE_AMOUNT,FINANCE_PAY,TOTAL_AMOUNT",
|
|
|
});
|
|
|
for (const item of res.data) {
|
|
|
// 再循环一遍
|
|
@@ -253,9 +268,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
getInitDate() {
|
|
|
- const end = this.$helpers
|
|
|
- .dayjs(new Date())
|
|
|
- .format("YYYY-MM-DD");
|
|
|
+ const end = this.$helpers.dayjs(new Date()).format("YYYY-MM-DD");
|
|
|
const start = this.$helpers
|
|
|
.dayjs(new Date())
|
|
|
.set("date", 1)
|