Przeglądaj źródła

添加查询参数

duwendi 1 rok temu
rodzic
commit
2525fbb5f4

+ 61 - 27
src/pages/index/components/access_data_analysis.vue

@@ -1,23 +1,34 @@
1 1
 <template>
2 2
   <div class="body-wrapper">
3
-<!--      <el-form class="form-wrapper" :inline="true" :model="formInline">-->
4
-<!--        <el-form-item label="所在区">-->
5
-<!--          <el-select v-model="formInline.region" placeholder="请选择所在区">-->
6
-<!--            <el-option-->
7
-<!--              v-for="item in districtOptions"-->
8
-<!--              :key="item.value"-->
9
-<!--              :label="item.label"-->
10
-<!--              :value="item.value">-->
11
-<!--            </el-option>-->
12
-<!--          </el-select>-->
13
-<!--        </el-form-item>-->
14
-<!--        <el-form-item label="停车场名称">-->
15
-<!--          <el-input v-model="formInline.interfaceName" placeholder="请输入停车场名称"></el-input>-->
16
-<!--        </el-form-item>-->
17
-<!--        <el-form-item>-->
18
-<!--          <el-button type="primary" @click="onSubmit">查询</el-button>-->
19
-<!--        </el-form-item>-->
20
-<!--      </el-form>-->
3
+    <el-form class="form-wrapper" :inline="true" :model="formInline" style="margin-bottom: 20px;">
4
+      <el-form-item label="行政区">
5
+        <el-select clearable v-model="formInline.regionCode" placeholder="请选择" popper-class="cur-select">
6
+          <el-option v-for="item in districtOptions"  :key="item.label" :label="item.label" :value="item.value"></el-option>
7
+        </el-select>
8
+      </el-form-item>
9
+      <el-form-item clearable label="具体道路">
10
+        <el-input v-model="formInline.streetName" placeholder="请输入"></el-input>
11
+      </el-form-item>
12
+      <el-form-item label="停车场">
13
+        <el-select clearable v-model="formInline.parkId" placeholder="请选择" popper-class="cur-select">
14
+          <el-option v-for="item in carOptions" :key="item.parkId" :label="item.carParkName" :value="item.parkId"></el-option>
15
+        </el-select>
16
+      </el-form-item>
17
+      <el-form-item label="查询日期">
18
+        <el-date-picker
19
+          clearable
20
+          v-model="formInline.time"
21
+          type="daterange"
22
+          range-separator="至"
23
+          start-placeholder="开始日期"
24
+          value-format="yyyy-MM-dd"
25
+          end-placeholder="结束日期">
26
+        </el-date-picker>
27
+      </el-form-item>
28
+      <el-form-item>
29
+        <el-button type="primary" @click="queryAll">查询</el-button>
30
+      </el-form-item>
31
+    </el-form>
21 32
     <div style="display: flex; justify-content: space-between;">
22 33
       <div style="width: 50%; height: 300px">
23 34
         <barchart
@@ -67,11 +78,14 @@ export default {
67 78
   },
68 79
   data() {
69 80
     return {
81
+      districtOptions: options.districtOptions,
82
+      carOptions: [],
70 83
       formInline: {
71
-        interfaceName: '',
72
-        region: ''
84
+        regionCode: '',
85
+        streetName: '',
86
+        parkId: '',
87
+        time: [],
73 88
       },
74
-      districtOptions: options.districtOptions,
75 89
       value: '',
76 90
       modelPieColor: ["#4382f6", "#9078f8", "#79a7db", "#FF9800", "#9C27B0"],
77 91
       modelData: {
@@ -81,11 +95,31 @@ export default {
81 95
     }
82 96
   },
83 97
   mounted() {
84
-    this.dashAccessDataAnalysisStat1()
85
-    this.dashAccessDataAnalysisStat2()
98
+    this.getParkDic()
99
+    this.queryAll()
86 100
   },
87 101
   watch: {},
88 102
   methods: {
103
+    getParkDic() {
104
+      api.parkDic().then(res => {
105
+        this.carOptions = res.data || [];
106
+      })
107
+    },
108
+    queryAll() {
109
+      let params = {...this.formInline}
110
+      if (
111
+        this.formInline.time && this.formInline.time.length === 2 &&
112
+        this.formInline.time[1] !== ""
113
+      ) {
114
+        this.formInline.time[0] = this.formInline.time[0].substring(0, 10) + " 00:00:00";
115
+        this.formInline.time[1] = this.formInline.time[1].substring(0, 10) + " 23:59:59";
116
+        params.begin= this.formInline.time[0]
117
+        params.end = this.formInline.time[1]
118
+      }
119
+      delete params.time
120
+      this.dashAccessDataAnalysisStat1(params)
121
+      this.dashAccessDataAnalysisStat2(params)
122
+    },
89 123
     tooltipFormat(params) {
90 124
       const type = params[0].seriesType;
91 125
       const data = params[0].data;
@@ -104,13 +138,13 @@ export default {
104 138
       }
105 139
       return nameArr.join('\n');
106 140
     },
107
-    dashAccessDataAnalysisStat1(){
108
-      api.dashAccessDataAnalysisStat1().then(res =>{
141
+    dashAccessDataAnalysisStat1(params){
142
+      api.dashAccessDataAnalysisStat1(params).then(res =>{
109 143
         this.bardata = res.data
110 144
       })
111 145
     },
112
-    dashAccessDataAnalysisStat2(){
113
-      api.dashAccessDataAnalysisStat2().then(res =>{
146
+    dashAccessDataAnalysisStat2(params){
147
+      api.dashAccessDataAnalysisStat2(params).then(res =>{
114 148
         this.modelData.list = res.data
115 149
       })
116 150
     },

+ 125 - 16
src/pages/index/components/berth_peration_nalysis.vue

@@ -1,5 +1,35 @@
1 1
 <template>
2 2
   <div class="body-wrapper">
3
+    <el-form class="form-wrapper" :inline="true" :model="formInline">
4
+      <el-form-item label="行政区">
5
+        <el-select clearable v-model="formInline.regionCode" placeholder="请选择" popper-class="cur-select">
6
+          <el-option v-for="item in districtOptions"  :key="item.label" :label="item.label" :value="item.value"></el-option>
7
+        </el-select>
8
+      </el-form-item>
9
+      <el-form-item clearable label="具体道路">
10
+        <el-input v-model="formInline.streetName" placeholder="请输入"></el-input>
11
+      </el-form-item>
12
+      <el-form-item label="停车场">
13
+        <el-select clearable v-model="formInline.parkId" placeholder="请选择" popper-class="cur-select">
14
+          <el-option v-for="item in carOptions" :key="item.parkId" :label="item.carParkName" :value="item.parkId"></el-option>
15
+        </el-select>
16
+      </el-form-item>
17
+      <el-form-item label="查询日期">
18
+        <el-date-picker
19
+          clearable
20
+          v-model="formInline.time"
21
+          type="daterange"
22
+          range-separator="至"
23
+          start-placeholder="开始日期"
24
+          value-format="yyyy-MM-dd"
25
+          end-placeholder="结束日期">
26
+        </el-date-picker>
27
+      </el-form-item>
28
+      <el-form-item>
29
+        <el-button type="primary" @click="queryAll">查询</el-button>
30
+      </el-form-item>
31
+    </el-form>
32
+    <br>
3 33
     <div class="page-container">
4 34
       <h2 style="color: #3498db;">泊位运营分析</h2>
5 35
       <div style="width: 99%; height: 480px">
@@ -42,6 +72,7 @@
42 72
 <script>
43 73
 import linechart from "@/components/lineChart";
44 74
 import api from "@/api/article_z";
75
+import options from '@/util/options'
45 76
 
46 77
 
47 78
 export default {
@@ -50,31 +81,58 @@ export default {
50 81
   },
51 82
   data() {
52 83
     return {
53
-      linedata: [{month: '市图书馆停车场', lastAmount: 15}, {month: '中山公园停车场', lastAmount:32}
54
-        , {month: '天地广场停车场', lastAmount:22}, {month: '市中心医院停车场', lastAmount:64}, {month: '建设路停车场', lastAmount:18}],
55
-      linedata1: [{month: '市图书馆停车场', lastAmount: 2.3}, {month: '中山公园停车场', lastAmount:3.1}
56
-        , {month: '天地广场停车场', lastAmount:3.8}, {month: '市中心医院停车场', lastAmount:4.2}, {month: '建设路停车场', lastAmount:1.7}],
84
+      districtOptions: options.districtOptions,
85
+      keyAreaOptions: options.keyAreaOptions,
86
+      carOptions: [],
87
+      linedata: [],
88
+      linedata1: [],
89
+      formInline: {
90
+        regionCode: '',
91
+        streetName: '',
92
+        parkId: '',
93
+        time: [],
94
+      },
57 95
     }
58 96
   },
59 97
   mounted() {
60
-    this.getLinedata1Data()
61
-    this.getLinedataData()
98
+    this.getParkDic()
99
+    this.queryAll()
62 100
   },
63 101
   watch: {
64 102
 
65 103
   },
66 104
   methods: {
105
+    getParkDic() {
106
+      api.parkDic().then(res => {
107
+        this.carOptions = res.data || [];
108
+      })
109
+    },
110
+    queryAll() {
111
+      let params = {...this.formInline}
112
+      if (
113
+        this.formInline.time && this.formInline.time.length === 2 &&
114
+        this.formInline.time[1] !== ""
115
+      ) {
116
+        this.formInline.time[0] = this.formInline.time[0].substring(0, 10) + " 00:00:00";
117
+        this.formInline.time[1] = this.formInline.time[1].substring(0, 10) + " 23:59:59";
118
+        params.begin= this.formInline.time[0]
119
+        params.end = this.formInline.time[1]
120
+      }
121
+      delete params.time
122
+      this.getLinedata1Data(params)
123
+      this.getLinedataData(params)
124
+    },
67 125
     taskFinishXFormat(name) {
68 126
       var str = name.split("");
69 127
       return str.join("\n");
70 128
     },
71
-    getLinedata1Data(){
72
-      api.queryBerthPerationNalysis_Bwzzlfx().then(res=>{
129
+    getLinedata1Data(params){
130
+      api.queryBerthPerationNalysis_Bwzzlfx(params).then(res=>{
73 131
         this.linedata1=res.data;
74 132
       })
75 133
     },
76
-    getLinedataData(){
77
-      api.queryBerthPerationNalysis_Bwyyqk().then(res=>{
134
+    getLinedataData(params){
135
+      api.queryBerthPerationNalysis_Bwyyqk(params).then(res=>{
78 136
         this.linedata=res.data;
79 137
       })
80 138
     },
@@ -96,13 +154,64 @@ export default {
96 154
 }
97 155
 </script>
98 156
 <style  lang="scss" scoped>
157
+.form-wrapper {
158
+  margin-bottom: 20px;
159
+}
160
+/deep/ .el-input__inner {
161
+  background: #2d3744;
162
+  border: none;
163
+  border-radius: 0;
164
+}
165
+/deep/ .el-select {
166
+  height: 40px;
167
+  .el-input__inner {
168
+    height: 40px;
169
+  }
170
+  .el-input__prefix, .el-input__suffix {
171
+    height: 40px;
172
+  }
173
+
174
+  /* 下面设置右侧按钮居中 */
175
+  .el-input__suffix {
176
+    top: 0px;
177
+    display: flex;
178
+    justify-content: center;
179
+    align-items: center;
180
+    flex-wrap: nowrap;
181
+    flex-direction: row;
182
+    align-content: flex-start;
183
+  }
184
+  /* 输入框加上上下边是 32px + 2px =34px */
185
+  .el-input__icon {
186
+    line-height: 0px;
187
+  }
188
+}
189
+/deep/ .form-wrapper .el-button {
190
+  background: linear-gradient(90deg,#0158d9,#3c97e4);
191
+  width: 100px;
192
+  height: 40px;
193
+}
99 194
 .body-wrapper {
100
-  margin: 0;
101
-  padding: 0;
102
-  width: 100%;
103
-  height: 100%;
104
-  box-sizing: border-box;
195
+  padding: 20px;
105 196
   background: #0c0c0c;
197
+  .button-block{
198
+    text-align: right;
199
+    margin-bottom: 20px;
200
+  }
201
+  .table-pagination{
202
+    text-align: right;
203
+  }
204
+}
205
+.audit-dialog{
206
+  .mg-bt{
207
+    margin-bottom: 24px;
208
+  }
209
+  .label{
210
+    text-align: right;
211
+  }
212
+}
213
+/deep/ .el-textarea.is-disabled .el-textarea__inner {
214
+  background: #2a2a2a;
215
+  color: #fff;
106 216
 }
107
-
108 217
 </style>

+ 2 - 6
src/pages/index/components/berths_revenue.vue

@@ -1,8 +1,6 @@
1 1
 <template>
2 2
   <div class="body-wrapper">
3
-    <h4 style="color: #FFFFFF">泊位营收情况</h4>.
4
-    <br>
5
-    <br>
3
+    <h4 style="color: #FFFFFF">泊位营收情况</h4>
6 4
     <el-form class="form-wrapper" :inline="true" :model="formInline">
7 5
       <el-form-item label="行政区">
8 6
         <el-select clearable v-model="formInline.regionCode" placeholder="请选择" popper-class="cur-select">
@@ -34,12 +32,10 @@
34 32
         </el-date-picker>
35 33
       </el-form-item>
36 34
       <el-form-item>
37
-        <el-button type="primary" @click="onSubmit">查询</el-button>
35
+        <el-button type="primary" @click="queryAll">查询</el-button>
38 36
       </el-form-item>
39 37
     </el-form>
40 38
     <br>
41
-    <br>
42
-    <br>
43 39
     <div style="width: 100%;">
44 40
       <div style="width: 100%;height: 400px;">
45 41
         <h4 style="color: white">按小时统计</h4>

+ 64 - 60
src/pages/index/components/charge_business_analysis.vue

@@ -1,26 +1,40 @@
1 1
 <template>
2 2
   <div class="body-wrapper">
3 3
     <el-form class="form-wrapper" :inline="true" :model="formInline" style="margin-bottom: 20px;">
4
-      <el-row>
5
-        <el-col :span="8">
6
-          <el-form-item label="查询日期:">
7
-            <el-date-picker
8
-              v-model="formInline.time"
9
-              type="daterange"
10
-              range-separator="至"
11
-              start-placeholder="开始日期"
12
-              value-format="yyyy-MM-dd"
13
-              end-placeholder="结束日期">
14
-            </el-date-picker>
15
-          </el-form-item>
16
-        </el-col>
17
-        <el-col :span="8">
18
-          <el-form-item>
19
-            <el-button type="primary" class="query-btn" @click="onSubmit">查询</el-button>
20
-          </el-form-item>
21
-        </el-col>
22
-      </el-row>
4
+      <el-form-item label="行政区">
5
+        <el-select clearable v-model="formInline.regionCode" placeholder="请选择" popper-class="cur-select">
6
+          <el-option v-for="item in districtOptions"  :key="item.label" :label="item.label" :value="item.value"></el-option>
7
+        </el-select>
8
+      </el-form-item>
9
+      <el-form-item clearable label="重点区域">
10
+        <el-select clearable v-model="formInline.keyAreas" placeholder="请选择" popper-class="cur-select">
11
+          <el-option  v-for="item in keyAreaOptions"  :key="item.label" :label="item.label" :value="item.value"></el-option>
12
+        </el-select>
13
+      </el-form-item>
14
+      <el-form-item clearable label="具体道路">
15
+        <el-input v-model="formInline.streetName" placeholder="请输入"></el-input>
16
+      </el-form-item>
17
+      <el-form-item label="停车场">
18
+        <el-select clearable v-model="formInline.parkId" placeholder="请选择" popper-class="cur-select">
19
+          <el-option v-for="item in carOptions" :key="item.parkId" :label="item.carParkName" :value="item.parkId"></el-option>
20
+        </el-select>
21
+      </el-form-item>
22
+      <el-form-item label="查询日期">
23
+        <el-date-picker
24
+          clearable
25
+          v-model="formInline.time"
26
+          type="daterange"
27
+          range-separator="至"
28
+          start-placeholder="开始日期"
29
+          value-format="yyyy-MM-dd"
30
+          end-placeholder="结束日期">
31
+        </el-date-picker>
32
+      </el-form-item>
33
+      <el-form-item>
34
+        <el-button type="primary" @click="queryAll">查询</el-button>
35
+      </el-form-item>
23 36
     </el-form>
37
+    <br>
24 38
     <div style="width: 99%; height: 480px">
25 39
       <h4 style="color: white">收费数据分析</h4>
26 40
       <barchart
@@ -74,6 +88,7 @@
74 88
 import piechart from "@/components/pieChart";
75 89
 import barchart from "@/components/barChart";
76 90
 import api from "@/api/article_liao";
91
+import options from '@/util/options'
77 92
 
78 93
 export default {
79 94
   components: {
@@ -82,6 +97,9 @@ export default {
82 97
   },
83 98
   data() {
84 99
     return {
100
+      districtOptions: options.districtOptions,
101
+      keyAreaOptions: options.keyAreaOptions,
102
+      carOptions: [],
85 103
       modelPieColor: ["#4382f6","#9078f8", "#79a7db", "#FF9800", "#9C27B0"],
86 104
       modelPieColor1: ["#4382f6","#9078f8", "#6aa1e1", "#FF9800", "#9C27B0"],
87 105
       modelData: {
@@ -90,33 +108,28 @@ export default {
90 108
       },
91 109
       bardata: [],
92 110
       formInline: {
93
-        time: ''
111
+        regionCode: '',
112
+        keyAreas: '',
113
+        streetName: '',
114
+        parkId: '',
115
+        time: [],
94 116
       }
95 117
     }
96 118
   },
97 119
   mounted() {
98
-    this.businessAnalysisStat()
99
-    this.businessAnalysisStat2()
100
-    this.businessAnalysisStat3()
120
+    this.getParkDic()
121
+    this.queryAll()
101 122
   },
102 123
   watch: {
103 124
 
104 125
   },
105 126
   methods: {
106
-    onSubmit() {
107
-      this.businessAnalysisStat()
108
-      this.businessAnalysisStat2()
109
-      this.businessAnalysisStat3()
110
-    },
111
-    tooltipFormat(params) {
112
-      const type = params[0].seriesType;
113
-      const data = params[0].data;
114
-      return `<div class="line-tooltip">
115
-<div>${params[0].seriesName}: ${
116
-        params[0].data.hs || 0}元</div>
117
-</div>`;
127
+    getParkDic() {
128
+      api.parkDic().then(res => {
129
+        this.carOptions = res.data || [];
130
+      })
118 131
     },
119
-    businessAnalysisStat(){
132
+    queryAll() {
120 133
       let params = {...this.formInline}
121 134
       if (
122 135
         this.formInline.time && this.formInline.time.length === 2 &&
@@ -128,38 +141,29 @@ export default {
128 141
         params.end = this.formInline.time[1]
129 142
       }
130 143
       delete params.time
144
+      this.businessAnalysisStat(params)
145
+      this.businessAnalysisStat2(params)
146
+      this.businessAnalysisStat3(params)
147
+    },
148
+    tooltipFormat(params) {
149
+      const type = params[0].seriesType;
150
+      const data = params[0].data;
151
+      return `<div class="line-tooltip">
152
+<div>${params[0].seriesName}: ${
153
+        params[0].data.hs || 0}元</div>
154
+</div>`;
155
+    },
156
+    businessAnalysisStat(params){
131 157
       api.businessAnalysisStat(params).then(res =>{
132 158
         this.bardata = res.data
133 159
       })
134 160
     },
135
-    businessAnalysisStat2(){
136
-      let params = {...this.formInline}
137
-      if (
138
-        this.formInline.time && this.formInline.time.length === 2 &&
139
-        this.formInline.time[1] !== ""
140
-      ) {
141
-        this.formInline.time[0] = this.formInline.time[0].substring(0, 10) + " 00:00:00";
142
-        this.formInline.time[1] = this.formInline.time[1].substring(0, 10) + " 23:59:59";
143
-        params.begin= this.formInline.time[0]
144
-        params.end = this.formInline.time[1]
145
-      }
146
-      delete params.time
161
+    businessAnalysisStat2(params){
147 162
       api.businessAnalysisStat2(params).then(res =>{
148 163
         this.modelData.list = res.data
149 164
       })
150 165
     },
151
-    businessAnalysisStat3(){
152
-      let params = {...this.formInline}
153
-      if (
154
-        this.formInline.time && this.formInline.time.length === 2 &&
155
-        this.formInline.time[1] !== ""
156
-      ) {
157
-        this.formInline.time[0] = this.formInline.time[0].substring(0, 10) + " 00:00:00";
158
-        this.formInline.time[1] = this.formInline.time[1].substring(0, 10) + " 23:59:59";
159
-        params.begin= this.formInline.time[0]
160
-        params.end = this.formInline.time[1]
161
-      }
162
-      delete params.time
166
+    businessAnalysisStat3(params){
163 167
       api.businessAnalysisStat3(params).then(res =>{
164 168
         this.modelData.list1 = res.data
165 169
       })