1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
| <template>
| <div class="chart-wrapper">
| <div class="">
| <el-select v-model="value2" placeholder="请选择" @change="changeLineDay()">
| <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
| </el-option>
| </el-select>
| </div>
| <line-chart ref="linechartInfo" :gutter="10" :xaxis-array="lineXaxisArray" :series="lineSeries" />
| </div>
| </template>
|
| <script>
| import LineChart from "../components/LineChart";
|
| export default {
| components: {
| LineChart
| },
| data() {
| return {
| value2: "近一年",
| options: [
| {
| value: "今日",
| label: "今日"
| },
| {
| value: "近两日",
| label: "近两日"
| },
| {
| value: "近一星期",
| label: "近一星期"
| },
| {
| value: "近一月",
| label: "近一月"
| },
| {
| value: "近三月",
| label: "近三月"
| },
| {
| value: "近半年",
| label: "近半年"
| },
| {
| value: "近一年",
| label: "近一年"
| }
| ],
| lineXaxisArray: [],
| lineSeries: [{ name: "", data: [] }]
| };
| },
| mounted() {
| this.getEveryday();
| },
| methods: {
| getEveryday(refresh) {
| var dateType = this.value2;
| var the = this;
| const url = "/api/dashboard/wms/getEveryday";
| const params = { dateType: dateType, refresh: refresh };
| var callback = res => {
| if (res.result) {
| this.lineXaxisArray = [];
| this.lineSeries = [{ name: "", data: [] }];
| this.lineHistogramNumList = [];
| this.lineHistogramNumList = res.data;
| this.lineSeries[0].name = "订单数";
| this.lineHistogramNumList.forEach(row => {
| this.lineXaxisArray.push(row.year + "-" + row.month + "-" + row.day);
| this.lineSeries[0].data.push(row.countWayBillNum);
| });
| window.setTimeout(function() {
| the.$refs.linechartInfo.initChart();
| }, 10);
| }
| };
| this.common.ajax(url, params, callback, true);
| },
| changeLineDay() {
| this.getEveryday(true);
| }
| }
| };
| </script>
|
| <style rel="stylesheet/scss" lang="scss" scoped>
| .chart-wrapper {
| background: #fff;
| padding: 16px 16px;
| margin-bottom: 10px;
| .haocai-title {
| text-align: center;
| color: #888;
| font-size: 18px;
| }
| }
| </style>
|
|
