style:图表的设置
Showing
13 changed files
with
72 additions
and
129 deletions
... | @@ -31,5 +31,6 @@ npm install --registry=https://registry.npm.taobao.org | ... | @@ -31,5 +31,6 @@ npm install --registry=https://registry.npm.taobao.org |
31 | "CODE": "BDCJGPT", {"BDCSBPT":上报: "BDCJGPT":监管} | 31 | "CODE": "BDCJGPT", {"BDCSBPT":上报: "BDCJGPT":监管} |
32 | "SERVERAPI": "/bdcsjsb", | 32 | "SERVERAPI": "/bdcsjsb", |
33 | "calcHeight": 200, {上报:160 监管:200} | 33 | "calcHeight": 200, {上报:160 监管:200} |
34 | "echartTextColor": "#FFFFFF", {上报:"#4A4A4A" 监管:"#FFFFFF"} | ||
34 | "MANAGEMENTAPI": "http://192.168.2.38:8090/management" | 35 | "MANAGEMENTAPI": "http://192.168.2.38:8090/management" |
35 | } | 36 | } |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
1 | { | 1 | { |
2 | "TITLE": "汉中市数据上报系统", | 2 | "TITLE": "汉中市数据上报系统", |
3 | "THEME": "sb", | 3 | "THEME": "sb", |
4 | "CODE": "BDCSBPT", | 4 | "CODE": "BDCJGPT", |
5 | "SERVERAPI": "/bdcsjsb", | 5 | "SERVERAPI": "/bdcsjsb", |
6 | "calcHeight": 160, | 6 | "calcHeight": 160, |
7 | "echartTextColor": "#FFFFFF", | ||
7 | "MANAGEMENTAPI": "http://192.168.2.38:8090/management" | 8 | "MANAGEMENTAPI": "http://192.168.2.38:8090/management" |
8 | } | 9 | } |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -16,13 +16,3 @@ export default { | ... | @@ -16,13 +16,3 @@ export default { |
16 | } | 16 | } |
17 | } | 17 | } |
18 | </script> | 18 | </script> |
... | \ No newline at end of file | ... | \ No newline at end of file |
19 | <style lang="scss" scoped> | ||
20 | .hasTagsView { | ||
21 | .app-main { | ||
22 | overflow-x: auto; | ||
23 | box-sizing: border-box; | ||
24 | background-color: #EDF1F7; | ||
25 | box-sizing: border-box; | ||
26 | } | ||
27 | } | ||
28 | </style> | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
1 | <!-- | 1 | <!-- |
2 | * @Description: | 2 | * @Description: |
3 | * @Autor: renchao | 3 | * @Autor: renchao |
4 | * @LastEditTime: 2023-03-22 10:23:46 | 4 | * @LastEditTime: 2023-03-28 10:12:27 |
5 | --> | 5 | --> |
6 | <template> | 6 | <template> |
7 | <section> | ||
8 | <transition name="fade-transform" mode="out-in"> | 7 | <transition name="fade-transform" mode="out-in"> |
9 | <router-view /> | 8 | <router-view /> |
10 | </transition> | 9 | </transition> |
11 | </section> | ||
12 | </template> | 10 | </template> |
13 | <script> | 11 | <script> |
14 | export default { | 12 | export default { | ... | ... |
1 | <!-- | 1 | <!-- |
2 | * @Description: | 2 | * @Description: |
3 | * @Autor: renchao | 3 | * @Autor: renchao |
4 | * @LastEditTime: 2023-03-23 09:21:00 | 4 | * @LastEditTime: 2023-03-28 10:14:20 |
5 | --> | 5 | --> |
6 | <template> | 6 | <template> |
7 | <div class="app-wrapper"> | 7 | <div class="app-wrapper"> |
8 | <navbar /> | 8 | <navbar /> |
9 | <div class="main-container"> | 9 | <div class="main-container"> |
10 | <sidebar class="sidebar-container" /> | 10 | <sidebar class="sidebar-container" /> |
11 | <div class="app-main"> | 11 | <div class="app-content"> |
12 | <tags-view v-if="needTagsView" /> | 12 | <tags-view v-if="needTagsView" /> |
13 | <app-main /> | 13 | <app-main /> |
14 | </div> | 14 | </div> |
... | @@ -40,17 +40,6 @@ export default { | ... | @@ -40,17 +40,6 @@ export default { |
40 | } | 40 | } |
41 | } | 41 | } |
42 | </script> | 42 | </script> |
43 | <style lang="scss" scoped> | ||
44 | .app-main { | ||
45 | height: calc(100vh - 74px); | ||
46 | overflow-x: hidden; | ||
47 | box-sizing: border-box; | ||
48 | flex: 1; | ||
49 | width: 100%; | ||
50 | background: #EAEBF0; | ||
51 | padding: 10px; | ||
52 | } | ||
53 | </style> | ||
54 | <style lang="scss"> | 43 | <style lang="scss"> |
55 | @import "~@/styles/mixin.scss"; | 44 | @import "~@/styles/mixin.scss"; |
56 | @import "~@/styles/sbSidebar.scss"; | 45 | @import "~@/styles/sbSidebar.scss"; |
... | @@ -83,4 +72,13 @@ export default { | ... | @@ -83,4 +72,13 @@ export default { |
83 | width: 100%; | 72 | width: 100%; |
84 | transition: width 0.28s; | 73 | transition: width 0.28s; |
85 | } | 74 | } |
75 | |||
76 | .app-content { | ||
77 | overflow-x: hidden; | ||
78 | box-sizing: border-box; | ||
79 | flex: 1; | ||
80 | width: 100%; | ||
81 | background: #EAEBF0; | ||
82 | padding: 10px; | ||
83 | } | ||
86 | </style> | 84 | </style> | ... | ... |
... | @@ -190,6 +190,12 @@ | ... | @@ -190,6 +190,12 @@ |
190 | } | 190 | } |
191 | } | 191 | } |
192 | 192 | ||
193 | .echarts-box { | ||
194 | display: flex; | ||
195 | justify-content: center; | ||
196 | height: calc(100vh - 260px); | ||
197 | } | ||
198 | |||
193 | .complex-header { | 199 | .complex-header { |
194 | .el-table--border th.el-table__cell { | 200 | .el-table--border th.el-table__cell { |
195 | border-bottom: 1px solid #458ACF !important; | 201 | border-bottom: 1px solid #458ACF !important; |
... | @@ -1080,12 +1086,15 @@ | ... | @@ -1080,12 +1086,15 @@ |
1080 | .informationbase { | 1086 | .informationbase { |
1081 | margin: 0.1875rem 1.0417rem; | 1087 | margin: 0.1875rem 1.0417rem; |
1082 | overflow-y: auto; | 1088 | overflow-y: auto; |
1089 | |||
1083 | .form-wrapper { | 1090 | .form-wrapper { |
1084 | padding: 0px 120px 0px; | 1091 | padding: 0px 120px 0px; |
1092 | |||
1085 | .el-form-item { | 1093 | .el-form-item { |
1086 | /deep/.el-form-item__label { | 1094 | /deep/.el-form-item__label { |
1087 | color: #ffffff; | 1095 | color: #ffffff; |
1088 | } | 1096 | } |
1097 | |||
1089 | ::v-deep .el-input .el-input__inner { | 1098 | ::v-deep .el-input .el-input__inner { |
1090 | padding: 0 8px; | 1099 | padding: 0 8px; |
1091 | height: 40px; | 1100 | height: 40px; |
... | @@ -1093,13 +1102,14 @@ | ... | @@ -1093,13 +1102,14 @@ |
1093 | border: 1px solid #6bc1fc; | 1102 | border: 1px solid #6bc1fc; |
1094 | } | 1103 | } |
1095 | } | 1104 | } |
1105 | |||
1096 | .el-form-item--small.el-form-item { | 1106 | .el-form-item--small.el-form-item { |
1097 | margin-bottom: 16px; | 1107 | margin-bottom: 16px; |
1098 | } | 1108 | } |
1099 | } | 1109 | } |
1110 | |||
1100 | .bottom-wrapper { | 1111 | .bottom-wrapper { |
1101 | padding: 0px 120px 0px; | 1112 | padding: 0px 120px 0px; |
1102 | text-align: center; | 1113 | text-align: center; |
1103 | } | 1114 | } |
1104 | } | 1115 | } |
... | \ No newline at end of file | ... | \ No newline at end of file |
1105 | ... | ... |
... | @@ -9,7 +9,7 @@ | ... | @@ -9,7 +9,7 @@ |
9 | 9 | ||
10 | 10 | ||
11 | .from-clues { | 11 | .from-clues { |
12 | height: 100%; | 12 | // height: 100%; |
13 | width: 100%; | 13 | width: 100%; |
14 | min-width: 1280px; | 14 | min-width: 1280px; |
15 | box-sizing: border-box; | 15 | box-sizing: border-box; |
... | @@ -19,7 +19,6 @@ | ... | @@ -19,7 +19,6 @@ |
19 | width: 100%; | 19 | width: 100%; |
20 | padding: 7px 15px 15px 15px; | 20 | padding: 7px 15px 15px 15px; |
21 | box-sizing: border-box; | 21 | box-sizing: border-box; |
22 | background-size: 100% 100%; | ||
23 | background: #FFFFFF; | 22 | background: #FFFFFF; |
24 | border-radius: 4px; | 23 | border-radius: 4px; |
25 | } | 24 | } |
... | @@ -30,7 +29,6 @@ | ... | @@ -30,7 +29,6 @@ |
30 | margin-top: 10px; | 29 | margin-top: 10px; |
31 | background: #FFFFFF; | 30 | background: #FFFFFF; |
32 | border-radius: 4px; | 31 | border-radius: 4px; |
33 | background-size: 100% 100%; | ||
34 | padding: 15px; | 32 | padding: 15px; |
35 | } | 33 | } |
36 | 34 | ||
... | @@ -57,6 +55,12 @@ | ... | @@ -57,6 +55,12 @@ |
57 | } | 55 | } |
58 | } | 56 | } |
59 | 57 | ||
58 | .echarts-box { | ||
59 | display: flex; | ||
60 | justify-content: center; | ||
61 | height: calc(100vh - 230px); | ||
62 | } | ||
63 | |||
60 | /* --------------进度条美化---------------- */ | 64 | /* --------------进度条美化---------------- */ |
61 | ::-webkit-scrollbar { | 65 | ::-webkit-scrollbar { |
62 | width: 7px; | 66 | width: 7px; | ... | ... |
1 | <template> | 1 | <template> |
2 | <!-- 监控日志 --> | 2 | <!-- 监控日志 --> |
3 | <div class="jktjDetail form-clues"> | 3 | <div class="jktjDetail from-clues"> |
4 | <!-- 头部搜索 --> | 4 | <!-- 头部搜索 --> |
5 | <div class="from-clues-header"> | 5 | <div class="from-clues-header"> |
6 | <el-form ref="form" :model="form" label-width="100px"> | 6 | <el-form ref="form" :model="form" label-width="100px"> |
7 | <el-form-item v-if="BASE_API.THEME == 'jg'"> | 7 | <el-form-item v-if="BASE_API.THEME == 'jg'"> |
8 | <Breadcrumb /> | 8 | <Breadcrumb /> |
9 | </el-form-item> | 9 | </el-form-item> |
10 | <el-row> | 10 | <el-row class="mb-5"> |
11 | <el-col :span="4"> | 11 | <el-col :span="4"> |
12 | <el-form-item label="开始日期" prop="startTime" class="d-flex"> | 12 | <el-form-item label="开始日期" prop="startTime" class="d-flex"> |
13 | <el-date-picker type="date" :clearable="false" class="width100" placeholder="开始日期" | 13 | <el-date-picker type="date" :clearable="false" class="width100" placeholder="开始日期" |
... | @@ -31,11 +31,11 @@ | ... | @@ -31,11 +31,11 @@ |
31 | </el-form> | 31 | </el-form> |
32 | </div> | 32 | </div> |
33 | <!-- 表格 --> | 33 | <!-- 表格 --> |
34 | <div class="form-clues-content echarts-box" v-if="pieChartsData.length"> | 34 | <div class="from-clues-content echarts-box" v-if="pieChartsData.length"> |
35 | <div id="myChart" class="chart"></div> | 35 | <div id="myChart" class="chart" style="height:100%;width:100%;"></div> |
36 | <div id="myChart-bar" class="chart-bar"></div> | 36 | <div id="myChart-bar" class="chart-bar" style="height:100%;width:100%;"></div> |
37 | </div> | 37 | </div> |
38 | <div class="form-clues-content echarts-box center" v-else>暂无数据</div> | 38 | <div class="from-clues-content center" v-else>暂无数据</div> |
39 | </div> | 39 | </div> |
40 | </template> | 40 | </template> |
41 | <script> | 41 | <script> |
... | @@ -123,10 +123,10 @@ export default { | ... | @@ -123,10 +123,10 @@ export default { |
123 | // 绘制图表 | 123 | // 绘制图表 |
124 | myChart.setOption({ | 124 | myChart.setOption({ |
125 | legend: { | 125 | legend: { |
126 | bottom: "2%", | 126 | bottom: "-1%", |
127 | left: "center", | 127 | left: "center", |
128 | textStyle: { | 128 | textStyle: { |
129 | color: "#fff", | 129 | color: this.BASE_API.echartTextColor, |
130 | }, | 130 | }, |
131 | }, | 131 | }, |
132 | tooltip: { | 132 | tooltip: { |
... | @@ -141,7 +141,7 @@ export default { | ... | @@ -141,7 +141,7 @@ export default { |
141 | name: "各业务类型办理数量", | 141 | name: "各业务类型办理数量", |
142 | type: "pie", | 142 | type: "pie", |
143 | radius: [0, 250], | 143 | radius: [0, 250], |
144 | center: ["50%", "45%"], | 144 | center: ["50%", "32%"], |
145 | roseType: "area", | 145 | roseType: "area", |
146 | itemStyle: { | 146 | itemStyle: { |
147 | borderRadius: 8, | 147 | borderRadius: 8, |
... | @@ -227,7 +227,7 @@ export default { | ... | @@ -227,7 +227,7 @@ export default { |
227 | top: 20, | 227 | top: 20, |
228 | textStyle: { | 228 | textStyle: { |
229 | show: true, | 229 | show: true, |
230 | color: "#fff", | 230 | color: this.BASE_API.echartTextColor, |
231 | fontSize: "16", | 231 | fontSize: "16", |
232 | }, | 232 | }, |
233 | }, | 233 | }, |
... | @@ -239,7 +239,7 @@ export default { | ... | @@ -239,7 +239,7 @@ export default { |
239 | interval: 0, | 239 | interval: 0, |
240 | textStyle: { | 240 | textStyle: { |
241 | show: true, | 241 | show: true, |
242 | color: "#fff", | 242 | color: this.BASE_API.echartTextColor, |
243 | fontSize: "16", | 243 | fontSize: "16", |
244 | }, | 244 | }, |
245 | }, | 245 | }, |
... | @@ -250,13 +250,13 @@ export default { | ... | @@ -250,13 +250,13 @@ export default { |
250 | type: "value", | 250 | type: "value", |
251 | name: "单位:天", | 251 | name: "单位:天", |
252 | nameTextStyle: { | 252 | nameTextStyle: { |
253 | color: "#fff", | 253 | color: this.BASE_APIechartTextColor, |
254 | fontSize: "16", | 254 | fontSize: "16", |
255 | }, | 255 | }, |
256 | axisLabel: { | 256 | axisLabel: { |
257 | textStyle: { | 257 | textStyle: { |
258 | show: true, | 258 | show: true, |
259 | color: "#fff", | 259 | color: this.BASE_API.echartTextColor, |
260 | fontSize: "16", | 260 | fontSize: "16", |
261 | }, | 261 | }, |
262 | }, | 262 | }, |
... | @@ -322,8 +322,6 @@ export default { | ... | @@ -322,8 +322,6 @@ export default { |
322 | </script> | 322 | </script> |
323 | <style scoped lang="scss"> | 323 | <style scoped lang="scss"> |
324 | .jktjDetail { | 324 | .jktjDetail { |
325 | height: 100%; | ||
326 | display: flex; | ||
327 | flex-direction: column; | 325 | flex-direction: column; |
328 | 326 | ||
329 | .rows { | 327 | .rows { |
... | @@ -333,26 +331,6 @@ export default { | ... | @@ -333,26 +331,6 @@ export default { |
333 | .center { | 331 | .center { |
334 | line-height: 50vh; | 332 | line-height: 50vh; |
335 | text-align: center; | 333 | text-align: center; |
336 | } | ||
337 | |||
338 | .echarts-box { | ||
339 | display: flex; | ||
340 | justify-content: center; | ||
341 | |||
342 | .chart { | ||
343 | width: 40%; | ||
344 | height: 100%; | ||
345 | float: left; | ||
346 | } | ||
347 | |||
348 | .chart-bar { | ||
349 | width: 60%; | ||
350 | } | ||
351 | } | ||
352 | |||
353 | .form-clues-content { | ||
354 | flex: 1; | ||
355 | height: 100%; | ||
356 | color: #b6b5b5; | 334 | color: #b6b5b5; |
357 | } | 335 | } |
358 | } | 336 | } | ... | ... |
1 | <template> | 1 | <template> |
2 | <!-- 监控日志 --> | 2 | <!-- 监控日志 --> |
3 | <div class="jktjDetail form-clues"> | 3 | <div class="jktjDetail from-clues"> |
4 | <!-- 头部搜索 --> | 4 | <!-- 头部搜索 --> |
5 | <div class="from-clues-header"> | 5 | <div class="from-clues-header"> |
6 | <el-form ref="form" :model="form" label-width="80px"> | 6 | <el-form ref="form" :model="form" label-width="80px"> |
7 | <el-form-item v-if="BASE_API.THEME=='jg'"> | 7 | <el-form-item v-if="BASE_API.THEME == 'jg'"> |
8 | <Breadcrumb /> | 8 | <Breadcrumb /> |
9 | </el-form-item> | 9 | </el-form-item> |
10 | <el-row> | 10 | <el-row class="mb-5"> |
11 | <el-col :span="4"> | 11 | <el-col :span="4"> |
12 | <el-form-item label="行政区" class="d-flex"> | 12 | <el-form-item label="行政区" class="d-flex"> |
13 | <el-select v-model="form.qxdm" class="width100" clearable placeholder="行政区"> | 13 | <el-select v-model="form.qxdm" class="width100" clearable placeholder="行政区"> |
... | @@ -39,10 +39,10 @@ | ... | @@ -39,10 +39,10 @@ |
39 | </el-form> | 39 | </el-form> |
40 | </div> | 40 | </div> |
41 | <!-- 图表 --> | 41 | <!-- 图表 --> |
42 | <div class="form-clues-content echarts-box" v-if="chartData.length"> | 42 | <div class="from-clues-content echarts-box" v-if="chartData.length"> |
43 | <div id="myChart" class="chart"></div> | 43 | <div id="myChart" class="chart" style="height:100%;width:100%;"></div> |
44 | </div> | 44 | </div> |
45 | <div class="form-clues-content echarts-box center" v-else>暂无数据</div> | 45 | <div class="from-clues-content echarts-box center" v-else>暂无数据</div> |
46 | </div> | 46 | </div> |
47 | </template> | 47 | </template> |
48 | 48 | ||
... | @@ -136,7 +136,7 @@ export default { | ... | @@ -136,7 +136,7 @@ export default { |
136 | axisPointer: { | 136 | axisPointer: { |
137 | type: "cross", | 137 | type: "cross", |
138 | crossStyle: { | 138 | crossStyle: { |
139 | color: "#fff", | 139 | color: this.BASE_API.echartTextColor, |
140 | }, | 140 | }, |
141 | }, | 141 | }, |
142 | }, | 142 | }, |
... | @@ -145,7 +145,7 @@ export default { | ... | @@ -145,7 +145,7 @@ export default { |
145 | top: '16', | 145 | top: '16', |
146 | textStyle: { | 146 | textStyle: { |
147 | show: true, | 147 | show: true, |
148 | color: "#fff", | 148 | color: this.BASE_API.echartTextColor, |
149 | fontSize: "16", | 149 | fontSize: "16", |
150 | }, | 150 | }, |
151 | }, | 151 | }, |
... | @@ -162,7 +162,7 @@ export default { | ... | @@ -162,7 +162,7 @@ export default { |
162 | axisLabel: { | 162 | axisLabel: { |
163 | textStyle: { | 163 | textStyle: { |
164 | show: true, | 164 | show: true, |
165 | color: "#fff", | 165 | color: this.BASE_API.echartTextColor, |
166 | fontSize: "16", | 166 | fontSize: "16", |
167 | }, | 167 | }, |
168 | formatter: function (val) { | 168 | formatter: function (val) { |
... | @@ -195,7 +195,7 @@ export default { | ... | @@ -195,7 +195,7 @@ export default { |
195 | type: "value", | 195 | type: "value", |
196 | name: "数量/个", | 196 | name: "数量/个", |
197 | nameTextStyle: { | 197 | nameTextStyle: { |
198 | color: "#fff", | 198 | color: this.BASE_API.echartTextColor, |
199 | fontSize: "16", | 199 | fontSize: "16", |
200 | }, | 200 | }, |
201 | // interval: this.interval, | 201 | // interval: this.interval, |
... | @@ -203,7 +203,7 @@ export default { | ... | @@ -203,7 +203,7 @@ export default { |
203 | formatter: "{value}", | 203 | formatter: "{value}", |
204 | textStyle: { | 204 | textStyle: { |
205 | show: true, | 205 | show: true, |
206 | color: "#fff", | 206 | color: this.BASE_API.echartTextColor, |
207 | fontSize: "16", | 207 | fontSize: "16", |
208 | }, | 208 | }, |
209 | }, | 209 | }, |
... | @@ -212,7 +212,7 @@ export default { | ... | @@ -212,7 +212,7 @@ export default { |
212 | type: "value", | 212 | type: "value", |
213 | name: "成功率", | 213 | name: "成功率", |
214 | nameTextStyle: { | 214 | nameTextStyle: { |
215 | color: "#fff", | 215 | color: this.BASE_API.echartTextColor, |
216 | fontSize: "16", | 216 | fontSize: "16", |
217 | }, | 217 | }, |
218 | splitNumber: 2, | 218 | splitNumber: 2, |
... | @@ -220,7 +220,7 @@ export default { | ... | @@ -220,7 +220,7 @@ export default { |
220 | formatter: "{value} %", | 220 | formatter: "{value} %", |
221 | textStyle: { | 221 | textStyle: { |
222 | show: true, | 222 | show: true, |
223 | color: "#fff", | 223 | color: this.BASE_API.echartTextColor, |
224 | fontSize: "16", | 224 | fontSize: "16", |
225 | }, | 225 | }, |
226 | }, | 226 | }, |
... | @@ -287,8 +287,6 @@ export default { | ... | @@ -287,8 +287,6 @@ export default { |
287 | </script> | 287 | </script> |
288 | <style scoped lang="scss"> | 288 | <style scoped lang="scss"> |
289 | .jktjDetail { | 289 | .jktjDetail { |
290 | height: 100%; | ||
291 | display: flex; | ||
292 | flex-direction: column; | 290 | flex-direction: column; |
293 | 291 | ||
294 | .rows { | 292 | .rows { |
... | @@ -300,21 +298,5 @@ export default { | ... | @@ -300,21 +298,5 @@ export default { |
300 | text-align: center; | 298 | text-align: center; |
301 | color: #b6b5b5; | 299 | color: #b6b5b5; |
302 | } | 300 | } |
303 | |||
304 | .echarts-box { | ||
305 | display: flex; | ||
306 | justify-content: center; | ||
307 | height: 500px; | ||
308 | |||
309 | .chart { | ||
310 | width: 100%; | ||
311 | height: 100%; | ||
312 | } | ||
313 | } | ||
314 | |||
315 | .form-clues-content { | ||
316 | flex: 1; | ||
317 | height: 100%; | ||
318 | } | ||
319 | } | 301 | } |
320 | </style> | 302 | </style> | ... | ... |
1 | <template> | 1 | <template> |
2 | <!-- 监控日志 --> | 2 | <!-- 监控日志 --> |
3 | <div class="jktjDetail form-clues"> | 3 | <div class="jktjDetail from-clues"> |
4 | <!-- 头部搜索 --> | 4 | <!-- 头部搜索 --> |
5 | <div class="from-clues-header"> | 5 | <div class="from-clues-header"> |
6 | <el-form ref="form" :model="form" label-width="100px"> | 6 | <el-form ref="form" :model="form" label-width="100px"> |
7 | <el-form-item v-if="BASE_API.THEME == 'jg'"> | 7 | <el-form-item v-if="BASE_API.THEME == 'jg'"> |
8 | <Breadcrumb /> | 8 | <Breadcrumb /> |
9 | </el-form-item> | 9 | </el-form-item> |
10 | <el-row> | 10 | <el-row class="mb-5"> |
11 | <el-col :span="4"> | 11 | <el-col :span="4"> |
12 | <el-form-item label="行政区" class="d-flex"> | 12 | <el-form-item label="行政区" class="d-flex"> |
13 | <el-select v-model="form.qxdm" class="width100" clearable placeholder="行政区"> | 13 | <el-select v-model="form.qxdm" class="width100" clearable placeholder="行政区"> |
... | @@ -39,13 +39,12 @@ | ... | @@ -39,13 +39,12 @@ |
39 | </el-form> | 39 | </el-form> |
40 | </div> | 40 | </div> |
41 | <!-- 图表 --> | 41 | <!-- 图表 --> |
42 | <div class="form-clues-content echarts-box" v-if="chartData.length"> | 42 | <div class="from-clues-content echarts-box" v-if="chartData.length"> |
43 | <div id="myChart" class="chart"></div> | 43 | <div id="myChart" class="chart" style="height:100%;width:100%;"></div> |
44 | </div> | 44 | </div> |
45 | <div class="form-clues-content echarts-box center" v-else>暂无数据</div> | 45 | <div class="from-clues-content echarts-box center" v-else>暂无数据</div> |
46 | </div> | 46 | </div> |
47 | </template> | 47 | </template> |
48 | |||
49 | <script> | 48 | <script> |
50 | import { mapGetters } from "vuex"; | 49 | import { mapGetters } from "vuex"; |
51 | import efficient from "@/api/efficient"; | 50 | import efficient from "@/api/efficient"; |
... | @@ -168,7 +167,7 @@ export default { | ... | @@ -168,7 +167,7 @@ export default { |
168 | }, | 167 | }, |
169 | textStyle: { | 168 | textStyle: { |
170 | show: true, | 169 | show: true, |
171 | color: "#fff", | 170 | color: this.BASE_API.echartTextColor, |
172 | fontSize: "16", | 171 | fontSize: "16", |
173 | }, | 172 | }, |
174 | }, | 173 | }, |
... | @@ -179,13 +178,13 @@ export default { | ... | @@ -179,13 +178,13 @@ export default { |
179 | type: "value", | 178 | type: "value", |
180 | name: "数量/个", | 179 | name: "数量/个", |
181 | nameTextStyle: { | 180 | nameTextStyle: { |
182 | color: "#fff", | 181 | color: this.BASE_API.echartTextColor, |
183 | fontSize: "16", | 182 | fontSize: "16", |
184 | }, | 183 | }, |
185 | axisLabel: { | 184 | axisLabel: { |
186 | textStyle: { | 185 | textStyle: { |
187 | show: true, | 186 | show: true, |
188 | color: "#fff", | 187 | color: this.BASE_API.echartTextColor, |
189 | fontSize: "16", | 188 | fontSize: "16", |
190 | }, | 189 | }, |
191 | }, | 190 | }, |
... | @@ -215,8 +214,6 @@ export default { | ... | @@ -215,8 +214,6 @@ export default { |
215 | </script> | 214 | </script> |
216 | <style scoped lang="scss"> | 215 | <style scoped lang="scss"> |
217 | .jktjDetail { | 216 | .jktjDetail { |
218 | height: 100%; | ||
219 | display: flex; | ||
220 | flex-direction: column; | 217 | flex-direction: column; |
221 | 218 | ||
222 | .rows { | 219 | .rows { |
... | @@ -228,21 +225,5 @@ export default { | ... | @@ -228,21 +225,5 @@ export default { |
228 | text-align: center; | 225 | text-align: center; |
229 | color: #b6b5b5; | 226 | color: #b6b5b5; |
230 | } | 227 | } |
231 | |||
232 | .echarts-box { | ||
233 | display: flex; | ||
234 | justify-content: center; | ||
235 | height: 500px; | ||
236 | |||
237 | .chart { | ||
238 | width: 100%; | ||
239 | height: 100%; | ||
240 | } | ||
241 | } | ||
242 | |||
243 | .form-clues-content { | ||
244 | flex: 1; | ||
245 | height: 100%; | ||
246 | } | ||
247 | } | 228 | } |
248 | </style> | 229 | </style> | ... | ... |
... | @@ -33,7 +33,7 @@ | ... | @@ -33,7 +33,7 @@ |
33 | </div> | 33 | </div> |
34 | <!-- 列表区域 --> | 34 | <!-- 列表区域 --> |
35 | <div class="from-clues-content complex-header"> | 35 | <div class="from-clues-content complex-header"> |
36 | <lb-table ref="table" :header-cell-style="headerStyle1" :calcHeight="200" :pagination="false" | 36 | <lb-table ref="table" :header-cell-style="headerStyle1" :calcHeight="BASE_API.calcHeight" :pagination="false" |
37 | :column="tableData.columns" :data="tableData.data"> | 37 | :column="tableData.columns" :data="tableData.data"> |
38 | </lb-table> | 38 | </lb-table> |
39 | 39 | ... | ... |
... | @@ -34,7 +34,7 @@ | ... | @@ -34,7 +34,7 @@ |
34 | </div> | 34 | </div> |
35 | <!-- 列表区域 --> | 35 | <!-- 列表区域 --> |
36 | <div class="from-clues-content complex-header"> | 36 | <div class="from-clues-content complex-header"> |
37 | <lb-table ref="table" :pagination="false" :calcHeight="200" :column="tableData.columns" :data="tableData.data"> | 37 | <lb-table ref="table" :pagination="false" :calcHeight="BASE_API.calcHeight" :column="tableData.columns" :data="tableData.data"> |
38 | </lb-table> | 38 | </lb-table> |
39 | <down-lb-table ref="table" v-show="false" :id="'mytable'" :downExcel="true" :pagination="false" | 39 | <down-lb-table ref="table" v-show="false" :id="'mytable'" :downExcel="true" :pagination="false" |
40 | :column="tableData.columns" :data="tableData.data" :downTitle="downTitle"> | 40 | :column="tableData.columns" :data="tableData.data" :downTitle="downTitle"> | ... | ... |
... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
2 | * @Author: yangwei | 2 | * @Author: yangwei |
3 | * @Date: 2023-02-17 16:32:50 | 3 | * @Date: 2023-02-17 16:32:50 |
4 | * @LastEditors: Please set LastEditors | 4 | * @LastEditors: Please set LastEditors |
5 | * @LastEditTime: 2023-03-27 14:58:51 | 5 | * @LastEditTime: 2023-03-28 10:24:52 |
6 | * @FilePath: \bdcjg-web\src\views\statistics\registerBookQuality\index.vue | 6 | * @FilePath: \bdcjg-web\src\views\statistics\registerBookQuality\index.vue |
7 | * @Description: | 7 | * @Description: |
8 | * | 8 | * |
... | @@ -43,8 +43,8 @@ | ... | @@ -43,8 +43,8 @@ |
43 | </div> | 43 | </div> |
44 | <!-- 列表区域 --> | 44 | <!-- 列表区域 --> |
45 | <div class="from-clues-content complex-header"> | 45 | <div class="from-clues-content complex-header"> |
46 | <lb-table ref="table" :pagination="false" :border="true" :calcHeight="200" :header-cell-style="headerStyle" | 46 | <lb-table ref="table" :pagination="false" :border="true" :calcHeight="BASE_API.calcHeight" |
47 | :column="tableData.columns" :data="tableData.data"> | 47 | :header-cell-style="headerStyle" :column="tableData.columns" :data="tableData.data"> |
48 | </lb-table> | 48 | </lb-table> |
49 | <down-lb-table ref="table" v-show="false" :id="'mytable'" :header-cell-style="headerStyle1" :downExcel="true" | 49 | <down-lb-table ref="table" v-show="false" :id="'mytable'" :header-cell-style="headerStyle1" :downExcel="true" |
50 | :pagination="false" :column="tableData.columns" :data="tableData.data" :downTitle="downTitle"> | 50 | :pagination="false" :column="tableData.columns" :data="tableData.data" :downTitle="downTitle"> | ... | ... |
-
Please register or sign in to post a comment