Skip to content

bdc / bdcjg-web

Go to a project
Toggle navigation
Toggle navigation pinning
2061f67a by 田浩浩
Options

Merge branch 'master' of http://yun.pashanhoo.com:9090/bdc/bdcjg-web

2 parents 63c19846 1f639c9c
Inline Side-by-side
Showing 6 changed files with 276 additions and 119 deletions
1 <template> 1 <template>
2 <!-- 折线图 --> 2 <!-- 折线图 -->
3 <Echart :options="options" id="bottomLeftChart" height="100%" width="100%"></Echart> 3 <Echart
4 :options="options"
5 id="bottomLeftChart"
6 height="100%"
7 width="100%"
8 ></Echart>
4 </template> 9 </template>
5 10
6 <script> 11 <script>
7 import Echart from "@/common/echart"; 12 import Echart from "@/common/echart";
8 export default { 13 export default {
9 data () { 14 data() {
10 return { 15 return {
11 xAxisData: {}, 16 xAxisData: {},
12 yAxisData1: {}, 17 yAxisData1: {},
...@@ -22,10 +27,10 @@ export default { ...@@ -22,10 +27,10 @@ export default {
22 cdata: { 27 cdata: {
23 type: Object, 28 type: Object,
24 default: () => ({}), 29 default: () => ({}),
25 } 30 },
26 }, 31 },
27 methods: { 32 methods: {
28 hexToRgba (hex, opacity) { 33 hexToRgba(hex, opacity) {
29 let rgbaColor = ""; 34 let rgbaColor = "";
30 let reg = /^#[\da-f]{6}$/i; 35 let reg = /^#[\da-f]{6}$/i;
31 if (reg.test(hex)) { 36 if (reg.test(hex)) {
...@@ -34,41 +39,45 @@ export default { ...@@ -34,41 +39,45 @@ export default {
34 )},${parseInt("0x" + hex.slice(5, 7))},${opacity})`; 39 )},${parseInt("0x" + hex.slice(5, 7))},${opacity})`;
35 } 40 }
36 return rgbaColor; 41 return rgbaColor;
37 } 42 },
38 }, 43 },
39 watch: { 44 watch: {
40 cdata: { 45 cdata: {
41 handler (newData) { 46 handler(newData) {
42 this.xAxisData = newData.echartData.map(v => v.name); 47 this.xAxisData = newData.echartData.map((v) => v.name);
43 this.yAxisData1 = newData.echartData.map(v => v.value1); 48 this.yAxisData1 = newData.echartData.map((v) => v.value1);
44 this.yAxisData2 = newData.echartData.map(v => v.value2); 49 this.yAxisData2 = newData.echartData.map((v) => v.value2);
45 this.yAxisData3 = newData.echartData.map(v => v.value3); 50 this.yAxisData3 = newData.echartData.map((v) => v.value3);
46 this.options = { 51 this.options = {
47 color: newData.color, 52 color: newData.color,
48 legend: { 53 legend: {
49 center: true, 54 center: true,
50 top: '20%', 55 top: "20%",
51 data: newData.legendItem, 56 data: newData.legendItem,
52 textStyle: { 57 textStyle: {
53 color: '#00DEFF' 58 color: "#00DEFF",
54 } 59 },
55 }, 60 },
56 // calculable: true, 61 // calculable: true,
57 tooltip: { 62 tooltip: {
58 trigger: "axis", 63 trigger: "axis",
59 formatter: function (params) { 64 formatter: function (params) {
60 let html = ''; 65 let html = "";
61 params.forEach(v => { 66 params.forEach((v) => {
62 html += `<div style="color: #000;font-size: 14px;line-height: 24px background-color: #000000"> 67 html += `<div style="color: #000;font-size: 14px;line-height: 24px background-color: #000000">
63 <span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${newData.color[v.componentIndex]};"></span> 68 <span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${
69 newData.color[v.componentIndex]
70 };"></span>
64 ${v.seriesName}.${v.name} 71 ${v.seriesName}.${v.name}
65 <span style="color:${newData.color[v.componentIndex]};font-weight:700;font-size: 18px">${v.value}</span> 72 <span style="color:${
73 newData.color[v.componentIndex]
74 };font-weight:700;font-size: 18px">${v.value}</span>
66 个`; 75 个`;
67 }) 76 });
68 return html 77 return html;
69 }, 78 },
70 extraCssText: 'background: #85a2eb; border-radius: 0;box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);color: #333;', 79 extraCssText:
71 80 "background: #85a2eb; border-radius: 0;box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);color: #333;",
72 }, 81 },
73 // grid: { 82 // grid: {
74 // top: 70, 83 // top: 70,
...@@ -81,54 +90,59 @@ export default { ...@@ -81,54 +90,59 @@ export default {
81 bottom: "8%", 90 bottom: "8%",
82 containLabel: true, 91 containLabel: true,
83 }, 92 },
84 xAxis: [{ 93 xAxis: [
85 type: 'category', 94 {
95 type: "category",
86 axisLine: { 96 axisLine: {
87 show: true, 97 show: true,
88 lineStyle: { 98 lineStyle: {
89 color: "#458ACF" 99 color: "#458ACF",
90 } 100 },
91 }, 101 },
92 axisLabel: { 102 axisLabel: {
93 inside: false, 103 inside: false,
94 textStyle: { 104 textStyle: {
95 color: 'rgba(255, 255, 255,0.7)', // x轴颜色 105 color: "rgba(255, 255, 255,0.7)", // x轴颜色
96 fontWeight: 'normal', 106 fontWeight: "normal",
97 fontSize: '12', 107 fontSize: "12",
98 lineHeight: 22 108 lineHeight: 22,
99 } 109 },
110 },
111 data: this.xAxisData,
100 }, 112 },
101 data: this.xAxisData 113 ],
102 }], 114 yAxis: [
103 yAxis: [{ 115 {
104 type: "value", 116 type: "value",
105 axisLabel: { 117 axisLabel: {
106 textStyle: { 118 textStyle: {
107 color: "rgba(255, 255, 255,0.7)" 119 color: "rgba(255, 255, 255,0.7)",
108 } 120 },
109 }, 121 },
110 splitLine: { 122 splitLine: {
111 show: true, 123 show: true,
112 lineStyle: { 124 lineStyle: {
113 color: "#458ACF" 125 color: "#458ACF",
114 } 126 },
115 }, 127 },
116 axisLine: { 128 axisLine: {
117 show: true, 129 show: true,
118 lineStyle: { 130 lineStyle: {
119 color: "#458ACF" 131 color: "#458ACF",
120 } 132 },
121 }, 133 },
122 axisTick: { 134 axisTick: {
123 show: false 135 show: false,
124 } 136 },
125 }], 137 },
126 series: [{ 138 ],
139 series: [
140 {
127 name: newData.legendItem[0], 141 name: newData.legendItem[0],
128 type: "line", 142 type: "line",
129 smooth: true, //是否平滑 143 smooth: true, //是否平滑
130 showSymbol: false, 144 showSymbol: false,
131 symbol: 'circle', 145 symbol: "circle",
132 symbolSize: 6, 146 symbolSize: 6,
133 zlevel: 3, 147 zlevel: 3,
134 lineStyle: { 148 lineStyle: {
...@@ -136,16 +150,17 @@ export default { ...@@ -136,16 +150,17 @@ export default {
136 color: newData.color[0], 150 color: newData.color[0],
137 shadowBlur: 3, 151 shadowBlur: 3,
138 shadowColor: this.hexToRgba(newData.color[0], 0.5), 152 shadowColor: this.hexToRgba(newData.color[0], 0.5),
139 shadowOffsetY: 0 153 shadowOffsetY: 0,
140 } 154 },
141 }, 155 },
142 data: this.yAxisData1 156 data: this.yAxisData1,
143 }, { 157 },
158 {
144 name: newData.legendItem[1], 159 name: newData.legendItem[1],
145 type: "line", 160 type: "line",
146 smooth: true, 161 smooth: true,
147 showSymbol: false, 162 showSymbol: false,
148 symbol: 'circle', 163 symbol: "circle",
149 symbolSize: 8, 164 symbolSize: 8,
150 zlevel: 3, 165 zlevel: 3,
151 lineStyle: { 166 lineStyle: {
...@@ -153,17 +168,17 @@ export default { ...@@ -153,17 +168,17 @@ export default {
153 color: newData.color[1], 168 color: newData.color[1],
154 shadowBlur: 0, 169 shadowBlur: 0,
155 shadowColor: this.hexToRgba(newData.color[1], 0.5), 170 shadowColor: this.hexToRgba(newData.color[1], 0.5),
156 shadowOffsetY: 0 171 shadowOffsetY: 0,
157 } 172 },
158 }, 173 },
159 data: this.yAxisData2 174 data: this.yAxisData2,
160 }, 175 },
161 { 176 {
162 name: newData.legendItem[2], 177 name: newData.legendItem[2],
163 type: "line", 178 type: "line",
164 smooth: true, 179 smooth: true,
165 showSymbol: false, 180 showSymbol: false,
166 symbol: 'circle', 181 symbol: "circle",
167 symbolSize: 8, 182 symbolSize: 8,
168 zlevel: 3, 183 zlevel: 3,
169 lineStyle: { 184 lineStyle: {
...@@ -171,12 +186,12 @@ export default { ...@@ -171,12 +186,12 @@ export default {
171 color: newData.color[2], 186 color: newData.color[2],
172 shadowBlur: 3, 187 shadowBlur: 3,
173 shadowColor: this.hexToRgba(newData.color[2], 0.5), 188 shadowColor: this.hexToRgba(newData.color[2], 0.5),
174 shadowOffsetY: 0 189 shadowOffsetY: 0,
175 }
176 }, 190 },
177 data: this.yAxisData3 191 },
178 } 192 data: this.yAxisData3,
179 ] 193 },
194 ],
180 }; 195 };
181 }, 196 },
182 immediate: true, 197 immediate: true,
......
...@@ -264,7 +264,10 @@ table td { ...@@ -264,7 +264,10 @@ table td {
264 display: none; 264 display: none;
265 } 265 }
266 // 时间选择框样式 266 // 时间选择框样式
267 .el-date-picker { 267 .el-date-picker{
268 .el-date-table td.disabled div{
269 background-color:#074487;
270 }
268 background-color: #031a46; 271 background-color: #031a46;
269 .el-date-picker__header-label{ 272 .el-date-picker__header-label{
270 color:#A6CFD6; 273 color:#A6CFD6;
...@@ -273,9 +276,7 @@ table td { ...@@ -273,9 +276,7 @@ table td {
273 background-color:#074487; 276 background-color:#074487;
274 .disabled{ 277 .disabled{
275 background-color:#074487; 278 background-color:#074487;
276 .el-date-table td.disabled div{ 279
277 background-color:#074487;
278 }
279 } 280 }
280 } 281 }
281 282
...@@ -301,6 +302,83 @@ table td { ...@@ -301,6 +302,83 @@ table td {
301 302
302 } 303 }
303 304
305 // 时间选择框2
306
307
308 .el-date-range-picker{
309 .el-date-range-picker__time-header > .el-icon-arrow-right{
310 color:#E3F1FF;;
311 }
312 background-color: #074487;
313 color: #fff;
314 .el-input__inner{
315 background: color #074487;
316 }
317
318 .el-input__inner{
319 background-color: #074487;
320 }
321 .el-input.is-disabled .el-input__inner{
322 background-color: #074487;
323 }
324 .el-date-range-picker__time-header{
325 background-color: #031a46;
326 }
327 .el-picker-panel__footer{
328 background-color: #031a46;
329 }
330 .el-time-panel{
331 background-color: #074487!important;
332 color: #E3F1FF;
333 }
334 .el-picker-panel__icon-btn{
335 color:#E3F1FF;
336 }
337 .el-date-table th{
338 color:#E3F1FF;
339 }
340 .el-time-spinner__item{
341 color: #E3F1FF;
342 }
343 .el-time-spinner__item.active:not(.disabled){
344 color: #fff;
345 }
346 .el-time-panel__btn{
347 color:#0F93F6;
348 }
349 .el-time-panel__btn.confirm{
350 width: 50px;
351 height: 25px;
352 line-height: 25px;
353 border-radius: 3px;
354 background-color: #fff;
355 }
356 .el-time-panel__footer{
357 background-color: #031a46;
358 }
359 .el-date-table td.in-range div{
360 background-color: #031a46;
361 }
362 .el-date-table td.start-date span, .el-date-table td.end-date span{
363 background-color: #074487;
364 // border:1px solid saddlebrown;
365 box-shadow: inset 0 0 7px #02D9FD;
366 border: 1px solid #02D9FD;
367 }
368 }
369 .el-date-editor{
370
371 .el-range-separator{
372 color: #E3F1FF;
373 }
374 .el-range-input{
375 background:none !important;
376 color: #fff;
377 }
378
379
380 }
381
304 382
305 383
306 384
......
...@@ -2,11 +2,22 @@ ...@@ -2,11 +2,22 @@
2 <!-- 监控日志 --> 2 <!-- 监控日志 -->
3 <div class="jktjDetail form-clues"> 3 <div class="jktjDetail form-clues">
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <el-form ref="form" :model="form" :inline="true" class="from-clues-header" label-width="100px"> 5 <el-form
6 <el-row> 6 ref="form"
7 :model="form"
8 :inline="true"
9 class="from-clues-header"
10 label-width="100px"
11 >
12 <el-row class="rows">
7 <el-col :span="8"> 13 <el-col :span="8">
8 <el-date-picker v-model="valueTime" type="datetimerange" range-separator="至" 14 <el-date-picker
9 start-placeholder="开始日期" end-placeholder="结束日期"> 15 v-model="valueTime"
16 type="datetimerange"
17 range-separator="至"
18 start-placeholder="开始日期"
19 end-placeholder="结束日期"
20 >
10 </el-date-picker> 21 </el-date-picker>
11 </el-col> 22 </el-col>
12 <!-- 按钮操作 --> 23 <!-- 按钮操作 -->
...@@ -26,53 +37,47 @@ ...@@ -26,53 +37,47 @@
26 <script> 37 <script>
27 export default { 38 export default {
28 name: "jktj", 39 name: "jktj",
29 data () { 40 data() {
30 return { 41 return {
31 // 开始结束日期限制 42 // 开始结束日期限制
32 pickerOptionsStart: { 43 pickerOptionsStart: {
33 disabledDate: (time) => { 44 disabledDate: (time) => {
34 if (this.form.endTime) { 45 if (this.form.endTime) {
35 return ( 46 return time.getTime() >= new Date(this.form.endTime).getTime();
36 time.getTime() >= new Date(this.form.endTime).getTime()
37 );
38 }
39 } 47 }
40 }, 48 },
49 },
41 // 结束日期限制 50 // 结束日期限制
42 pickerOptionsEnd: { 51 pickerOptionsEnd: {
43 disabledDate: (time) => { 52 disabledDate: (time) => {
44 if (this.form.startTime) { 53 if (this.form.startTime) {
45 return ( 54 return time.getTime() <= new Date(this.form.startTime).getTime();
46 time.getTime() <= new Date(this.form.startTime).getTime()
47 );
48 }
49 } 55 }
50 }, 56 },
57 },
51 // 搜索表单 58 // 搜索表单
52 valueTime: '', 59 valueTime: "",
53 form: { 60 form: {
54 startTime: "", 61 startTime: "",
55 endTime: "" 62 endTime: "",
56 } 63 },
57 } 64 };
58 }, 65 },
59 mounted () { 66 mounted() {
60 // 初始化图表 67 // 初始化图表
61 this.echartInit(); 68 this.echartInit();
62 }, 69 },
63 methods: { 70 methods: {
64 // 重置 71 // 重置
65 resetForm () { 72 resetForm() {
66 this.form = { 73 this.form = {
67 startTime: "", 74 startTime: "",
68 endTime: "" 75 endTime: "",
69 } 76 };
70 }, 77 },
71 echartInit () { 78 echartInit() {
72 // 基于准备好的dom，初始化echarts实例 79 // 基于准备好的dom，初始化echarts实例
73 let myChart = this.$echarts.init( 80 let myChart = this.$echarts.init(document.getElementById("myChart"));
74 document.getElementById("myChart")
75 );
76 // 绘制图表 81 // 绘制图表
77 myChart.setOption({ 82 myChart.setOption({
78 color: ["#00bdb1", "#ff6e6e", "#3f99ff", "#ffaf48"], 83 color: ["#00bdb1", "#ff6e6e", "#3f99ff", "#ffaf48"],
...@@ -81,10 +86,10 @@ export default { ...@@ -81,10 +86,10 @@ export default {
81 text: "汉中市接入数量与上报数量统计(单位:个)\n(2022年02月05日~2022年03月07日)", 86 text: "汉中市接入数量与上报数量统计(单位:个)\n(2022年02月05日~2022年03月07日)",
82 left: "center", 87 left: "center",
83 textStyle: { 88 textStyle: {
84 fontSize: 18, 89 fontSize: 30,
85 lineHeight: 30, 90 lineHeight: 30,
86 height: 60, 91 height: 60,
87 color: "#777", 92 color: "#fff",
88 }, 93 },
89 }, 94 },
90 legend: { 95 legend: {
...@@ -95,10 +100,20 @@ export default { ...@@ -95,10 +100,20 @@ export default {
95 "上报失败数量", 100 "上报失败数量",
96 ], 101 ],
97 top: 80, 102 top: 80,
103 textStyle: {
104 fontSize: 24,
105 lineHeight: 30,
106 height: 60,
107 color: "#777",
108 },
98 }, 109 },
99 tooltip: { 110 tooltip: {
100 show: true, 111 show: true,
101 trigger: "axis", 112 trigger: "axis",
113 textStyle: {
114 fontSize: 22 // 字体大小
115 },
116 extraCssText: 'width:260px;height:200px;' // 背景色
102 }, 117 },
103 grid: { 118 grid: {
104 top: 120, 119 top: 120,
...@@ -107,11 +122,25 @@ export default { ...@@ -107,11 +122,25 @@ export default {
107 { 122 {
108 type: "category", 123 type: "category",
109 data: ["汉台区", "南郑区", "城固县", "洋县", "西乡县"], 124 data: ["汉台区", "南郑区", "城固县", "洋县", "西乡县"],
125 axisLabel: {
126 textStyle: {
127 show: true,
128 color: "#fff",
129 fontSize: "24",
130 },
131 },
110 }, 132 },
111 ], 133 ],
112 yAxis: [ 134 yAxis: [
113 { 135 {
114 type: "value", 136 type: "value",
137 axisLabel: {
138 textStyle: {
139 show: true,
140 color: "#fff",
141 fontSize: "24",
142 },
143 },
115 }, 144 },
116 ], 145 ],
117 series: [ 146 series: [
...@@ -148,7 +177,9 @@ export default { ...@@ -148,7 +177,9 @@ export default {
148 height: 100%; 177 height: 100%;
149 display: flex; 178 display: flex;
150 flex-direction: column; 179 flex-direction: column;
151 180 .rows {
181 margin-left: 100px;
182 }
152 .echarts-box { 183 .echarts-box {
153 display: flex; 184 display: flex;
154 justify-content: center; 185 justify-content: center;
......
...@@ -2,11 +2,22 @@ ...@@ -2,11 +2,22 @@
2 <!-- 监控日志 --> 2 <!-- 监控日志 -->
3 <div class="jktjDetail form-clues"> 3 <div class="jktjDetail form-clues">
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <el-form ref="form" :model="form" :inline="true" class="from-clues-header" label-width="100px"> 5 <el-form
6 <el-row> 6 ref="form"
7 :model="form"
8 :inline="true"
9 class="from-clues-header"
10 label-width="100px"
11 >
12 <el-row class="rows">
7 <el-col :span="8"> 13 <el-col :span="8">
8 <el-date-picker v-model="valueTime" type="datetimerange" range-separator="至" 14 <el-date-picker
9 start-placeholder="开始日期" end-placeholder="结束日期"> 15 v-model="valueTime"
16 type="datetimerange"
17 range-separator="至"
18 start-placeholder="开始日期"
19 end-placeholder="结束日期"
20 >
10 </el-date-picker> 21 </el-date-picker>
11 </el-col> 22 </el-col>
12 <!-- 按钮操作 --> 23 <!-- 按钮操作 -->
...@@ -26,53 +37,47 @@ ...@@ -26,53 +37,47 @@
26 <script> 37 <script>
27 export default { 38 export default {
28 name: "jktj", 39 name: "jktj",
29 data () { 40 data() {
30 return { 41 return {
31 // 开始结束日期限制 42 // 开始结束日期限制
32 pickerOptionsStart: { 43 pickerOptionsStart: {
33 disabledDate: (time) => { 44 disabledDate: (time) => {
34 if (this.form.endTime) { 45 if (this.form.endTime) {
35 return ( 46 return time.getTime() >= new Date(this.form.endTime).getTime();
36 time.getTime() >= new Date(this.form.endTime).getTime()
37 );
38 }
39 } 47 }
40 }, 48 },
49 },
41 // 结束日期限制 50 // 结束日期限制
42 pickerOptionsEnd: { 51 pickerOptionsEnd: {
43 disabledDate: (time) => { 52 disabledDate: (time) => {
44 if (this.form.startTime) { 53 if (this.form.startTime) {
45 return ( 54 return time.getTime() <= new Date(this.form.startTime).getTime();
46 time.getTime() <= new Date(this.form.startTime).getTime()
47 );
48 }
49 } 55 }
50 }, 56 },
57 },
51 // 搜索表单 58 // 搜索表单
52 valueTime: '', 59 valueTime: "",
53 form: { 60 form: {
54 startTime: "", 61 startTime: "",
55 endTime: "" 62 endTime: "",
56 } 63 },
57 } 64 };
58 }, 65 },
59 mounted () { 66 mounted() {
60 // 初始化图表 67 // 初始化图表
61 this.echartInit(); 68 this.echartInit();
62 }, 69 },
63 methods: { 70 methods: {
64 // 重置 71 // 重置
65 resetForm () { 72 resetForm() {
66 this.form = { 73 this.form = {
67 startTime: "", 74 startTime: "",
68 endTime: "" 75 endTime: "",
69 } 76 };
70 }, 77 },
71 echartInit () { 78 echartInit() {
72 // 基于准备好的dom，初始化echarts实例 79 // 基于准备好的dom，初始化echarts实例
73 let myChart = this.$echarts.init( 80 let myChart = this.$echarts.init(document.getElementById("myChart"));
74 document.getElementById("myChart")
75 );
76 // 绘制图表 81 // 绘制图表
77 myChart.setOption({ 82 myChart.setOption({
78 color: ["#00bdb1", "#ff6e6e", "#3f99ff", "#ffaf48"], 83 color: ["#00bdb1", "#ff6e6e", "#3f99ff", "#ffaf48"],
...@@ -81,10 +86,10 @@ export default { ...@@ -81,10 +86,10 @@ export default {
81 text: "汉中市接入数量与上报数量统计(单位:个)\n(2022年02月05日~2022年03月07日)", 86 text: "汉中市接入数量与上报数量统计(单位:个)\n(2022年02月05日~2022年03月07日)",
82 left: "center", 87 left: "center",
83 textStyle: { 88 textStyle: {
84 fontSize: 18, 89 fontSize: 30,
85 lineHeight: 30, 90 lineHeight: 30,
86 height: 60, 91 height: 60,
87 color: "#777", 92 color: "#fff",
88 }, 93 },
89 }, 94 },
90 legend: { 95 legend: {
...@@ -95,10 +100,20 @@ export default { ...@@ -95,10 +100,20 @@ export default {
95 "上报失败数量", 100 "上报失败数量",
96 ], 101 ],
97 top: 80, 102 top: 80,
103 textStyle: {
104 fontSize: 24,
105 lineHeight: 30,
106 height: 60,
107 color: "#777",
108 },
98 }, 109 },
99 tooltip: { 110 tooltip: {
100 show: true, 111 show: true,
101 trigger: "axis", 112 trigger: "axis",
113 textStyle: {
114 fontSize: 22 // 字体大小
115 },
116 extraCssText: 'width:260px;height:200px;' // 背景色
102 }, 117 },
103 grid: { 118 grid: {
104 top: 120, 119 top: 120,
...@@ -107,11 +122,25 @@ export default { ...@@ -107,11 +122,25 @@ export default {
107 { 122 {
108 type: "category", 123 type: "category",
109 data: ["汉台区", "南郑区", "城固县", "洋县", "西乡县"], 124 data: ["汉台区", "南郑区", "城固县", "洋县", "西乡县"],
125 axisLabel: {
126 textStyle: {
127 show: true,
128 color: "#fff",
129 fontSize: "24",
130 },
131 },
110 }, 132 },
111 ], 133 ],
112 yAxis: [ 134 yAxis: [
113 { 135 {
114 type: "value", 136 type: "value",
137 axisLabel: {
138 textStyle: {
139 show: true,
140 color: "#fff",
141 fontSize: "24",
142 },
143 },
115 }, 144 },
116 ], 145 ],
117 series: [ 146 series: [
...@@ -148,7 +177,9 @@ export default { ...@@ -148,7 +177,9 @@ export default {
148 height: 100%; 177 height: 100%;
149 display: flex; 178 display: flex;
150 flex-direction: column; 179 flex-direction: column;
151 180 .rows {
181 margin-left: 100px;
182 }
152 .echarts-box { 183 .echarts-box {
153 display: flex; 184 display: flex;
154 justify-content: center; 185 justify-content: center;
......
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
75 </div> 75 </div>
76 <!-- 引入详情组件 --> 76 <!-- 引入详情组件 -->
77 <!-- 编辑 --> 77 <!-- 编辑 -->
78 <dataDetails ref="editLog" /> 78 <dataDetails ref="editLog" :title="title" />
79 </div> 79 </div>
80 </template> 80 </template>
81 <script> 81 <script>
...@@ -182,6 +182,7 @@ export default { ...@@ -182,6 +182,7 @@ export default {
182 label: "河南县", 182 label: "河南县",
183 }, 183 },
184 ], 184 ],
185 title: ''
185 }; 186 };
186 }, 187 },
187 methods: { 188 methods: {
...@@ -205,6 +206,7 @@ export default { ...@@ -205,6 +206,7 @@ export default {
205 handleEscalation () { }, 206 handleEscalation () { },
206 // 详情 207 // 详情
207 handleDetail (row) { 208 handleDetail (row) {
209 this.title = row.rectypeName
208 this.$refs.editLog.isShow(row); 210 this.$refs.editLog.isShow(row);
209 }, 211 },
210 }, 212 },
......