jinqian 3 年 前
コミット
f9b08af512

+ 112 - 0
src/views/system/index/fjmap.vue

@@ -0,0 +1,112 @@
1
+<style lang="scss" scoped>
2
+.o-echarts {
3
+  margin-top: 150px;
4
+  min-width: 30px;
5
+  min-height: 30px;
6
+  width: 100%;
7
+  height: 80%;
8
+}
9
+</style>
10
+<template>
11
+  <div id="echarts_map" class="o-echarts"></div>
12
+</template>
13
+
14
+<script>
15
+import fjJson from "./map/quanzhou.json";
16
+
17
+export default {
18
+  name: "echart-map",
19
+  data() {
20
+    return {
21
+      echartObj: null,
22
+      option: {
23
+        // tooltip: {
24
+        //   trigger: "item",
25
+        //   formatter: "{b}<br/>{c} (p / km2)",
26
+        // },
27
+        toolbox: {
28
+          show: false,
29
+          orient: "vertical",
30
+          left: "right",
31
+          top: "center",
32
+          feature: {
33
+            dataView: { readOnly: false },
34
+            restore: {},
35
+            saveAsImage: {},
36
+          },
37
+        },
38
+        geo: {
39
+          show: true,
40
+          map: "泉州",
41
+          lable: {
42
+            color: "white",
43
+            normal: {
44
+              show: false,
45
+            },
46
+            emphasis: {
47
+              show: false,
48
+            },
49
+          },
50
+
51
+          itemStyle: {
52
+            normal: {
53
+              //阴影
54
+              areaColor: "#7dc1d5",
55
+              borderWidth: 0,
56
+              borderColor: "#0395fc",
57
+              shadowColor: "#0395fc",
58
+              shadowBlur: 0,
59
+              opacity: 0.8,
60
+              // shadowOffsetX: 0,
61
+              // shadowOffsetY: 0,
62
+            },
63
+          },
64
+        },
65
+        series: [
66
+          {
67
+            name: "泉州",
68
+            type: "map",
69
+            map: "泉州",
70
+            zoom: 1,
71
+            label: {
72
+              show: true,
73
+              color: "#fff",
74
+            },
75
+            itemStyle: {
76
+              normal: {
77
+                color: "#fff",
78
+                borderWidth: 2, //边际线大小
79
+                borderColor: "#a9f7fb", //边界线颜色
80
+                areaColor: "#62b1cc", //默认区域颜色
81
+              },
82
+              emphasis: {
83
+                show: true,
84
+                color: "#fff",
85
+                areaColor: "#a2ebee", //鼠标滑过区域颜色
86
+                label: {
87
+                  show: true,
88
+                  textStyle: {
89
+                    color: "#fff",
90
+                  },
91
+                },
92
+              },
93
+            },
94
+            data: [],
95
+          },
96
+        ],
97
+      },
98
+    };
99
+  },
100
+  mounted() {
101
+    this.echartObj = this.$echarts.init(document.getElementById("echarts_map"));
102
+    this.$echarts.registerMap("泉州", fjJson);
103
+    this.echartObj.setOption(this.option);
104
+    window.addEventListener("resize", () => {
105
+      if (this.echartObj && this.echartObj.resize) {
106
+        this.echartObj.resize();
107
+      }
108
+    });
109
+  },
110
+  methods: {},
111
+};
112
+</script>

BIN
src/views/system/index/image/bg.png


BIN
src/views/system/index/image/bjck.png


BIN
src/views/system/index/image/ckl.png


BIN
src/views/system/index/image/crbg.png


BIN
src/views/system/index/image/jiangdi.png


BIN
src/views/system/index/image/rkl.png


BIN
src/views/system/index/image/szkBlue.png


BIN
src/views/system/index/image/szkGreen.png


BIN
src/views/system/index/image/zezhang.png


File diff suppressed because it is too large
+ 1 - 0
src/views/system/index/map/chongqing.json


File diff suppressed because it is too large
+ 27 - 0
src/views/system/index/map/fujian.js


File diff suppressed because it is too large
+ 1 - 0
src/views/system/index/map/fujian.json


File diff suppressed because it is too large
+ 15925 - 0
src/views/system/index/map/quanzhou.json


+ 495 - 66
src/views/system/index/page.vue

@@ -1,71 +1,166 @@
1 1
 <template>
2 2
   <d2-container class="page">
3
-    <el-row class="content">
4
-      <div class="page-content left-content">
5
-        <span class="content-title">报警待处理</span>
6
-        <el-table
7
-          :data="tableData"
8
-          class="table-content"
9
-          @row-click="jumpDetails"
10
-          :row-class-name="tableRowClassName"
11
-        >
12
-          <el-table-column
13
-            prop="name"
14
-            align="center"
15
-            label="仓库名称"
16
-          ></el-table-column>
17
-          <el-table-column
18
-            prop="itemName"
19
-            label="仓房名称"
20
-            align="center"
21
-          ></el-table-column>
22
-          <el-table-column
23
-            prop="submitter"
24
-            label="报警时间"
25
-            align="center"
26
-          ></el-table-column>
27
-          <el-table-column
28
-            prop="reportDate"
29
-            align="center"
30
-            label="已处理等待时常"
31
-          ></el-table-column>
32
-          <el-table-column align="center" label="操作">
33
-            <el-button type="text" size="small" icon="el-icon-edit"
34
-              >编辑</el-button
35
-            >
36
-          </el-table-column>
37
-        </el-table>
38
-      </div>
39
-      <div class="page-content right-content">
40
-        <span class="content-title">通知公告</span>
41
-        <ul class="tzggList">
42
-          <li v-for="(item, index) in tzggListData" :key="index">
43
-            <span>{{ item.name }}</span>
44
-            <span class="tzggListLi">2011-10-19 11:11:11</span>
45
-          </li>
46
-        </ul>
3
+    <div class="mapPosition">
4
+      <div>
5
+        <div class="ckt-bg">
6
+          <span class="ckt-bg-font">当天出库量(吨)</span>
7
+          <div class="ckt-szk-bg">70</div>
8
+          <span class="ckt-bg-little"
9
+            >较昨日增长<span class="zcColor">15.9%</span
10
+            ><img src="./image/zezhang.png"
11
+          /></span>
12
+        </div>
13
+        <div class="rkt-bg">
14
+          <span class="rkt-bg-font">当天入库量(吨)</span>
15
+          <div class="rkt-szk-bg">80</div>
16
+          <span class="rkt-bg-little"
17
+            >较昨日降低<span class="jdColor">15.9%</span
18
+            ><img src="./image/jiangdi.png"
19
+          /></span>
20
+        </div>
47 21
       </div>
48
-    </el-row>
49
-    <el-row class="content contentX">
50
-      <div class="page-content left-content">
51
-        <span class="content-title">出入库数量趋势</span>
52
-        <div id="myChart" :style="{ width: '400px', height: '250px' }"></div>
53
-      </div>
54
-      <div class="page-content right-content">
55
-        <span class="content-title">库区报警排名</span>
22
+
23
+      <div class="kck-content">
24
+        <div class="kck-content-out">
25
+          <span class="kck-content-in-1"
26
+            >总仓容<span class="kck-content-num1">100</span>吨</span
27
+          >
28
+          <span class="kck-content-in-2"
29
+            >已用<span class="kck-content-num2">70</span>吨</span
30
+          >
31
+          <span class="kck-content-in-3"
32
+            >剩余可用<span class="kck-content-num3">30</span>吨</span
33
+          >
34
+        </div>
56 35
       </div>
57
-    </el-row>
36
+      <fjmap></fjmap>
37
+      <!-- <div id="map-content" class="echarts-map"></div> -->
38
+    </div>
39
+    <!-- <el-row class="content"> -->
40
+    <div class="page-content left-content">
41
+      <span class="content-title">报警待处理</span>
42
+      <el-table
43
+        :data="tableData"
44
+        class="table-content"
45
+        @row-click="jumpDetails"
46
+        :row-class-name="tableRowClassName"
47
+      >
48
+        <el-table-column
49
+          prop="ckmc"
50
+          align="center"
51
+          label="仓库名称"
52
+          show-overflow-tooltip
53
+        >
54
+          <template slot-scope="scope">
55
+            <img class="ckmcImg" src="./image/bjck.png" />
56
+            <span>{{ scope.row.ckmc }}</span>
57
+          </template>
58
+        </el-table-column>
59
+        <el-table-column
60
+          prop="cfmc"
61
+          label="仓房名称"
62
+          align="center"
63
+          show-overflow-tooltip
64
+        ></el-table-column>
65
+        <el-table-column
66
+          prop="bjsj"
67
+          label="报警时间"
68
+          align="center"
69
+          show-overflow-tooltip
70
+        ></el-table-column>
71
+        <el-table-column
72
+          prop="yclddsc"
73
+          align="center"
74
+          label="已处理等待时常"
75
+          show-overflow-tooltip
76
+        ></el-table-column>
77
+        <el-table-column align="center" label="处理">
78
+          <el-button
79
+            class="czBut"
80
+            type="button"
81
+            size="small"
82
+            icon="el-icon-edit"
83
+            >反馈</el-button
84
+          >
85
+        </el-table-column>
86
+      </el-table>
87
+      <span class="seeMore">查看更多></span>
88
+    </div>
89
+    <div class="page-content right-content">
90
+      <span class="content-title">通知公告</span>
91
+      <ul class="tzggList">
92
+        <li v-for="(item, index) in tzggListData" :key="index">
93
+          <span class="tzXyd"></span><span>{{ item.name }}</span>
94
+          <span class="tzggListLi">2011-10-19 11:11:11</span>
95
+        </li>
96
+      </ul>
97
+      <span class="seeMore">查看更多></span>
98
+    </div>
99
+    <!-- </el-row> -->
100
+    <!-- <el-row class="content contentX"> -->
101
+    <div class="page-content left-content contentX">
102
+      <span class="content-title">出入库数量趋势</span>
103
+      <el-row>
104
+        <el-date-picker
105
+          class="timeOption"
106
+          v-model="time"
107
+          type="monthrange"
108
+          range-separator="-"
109
+          start-placeholder="开始月份"
110
+          end-placeholder="结束月份"
111
+        >
112
+        </el-date-picker>
113
+      </el-row>
114
+
115
+      <div
116
+        class="myChart"
117
+        id="myChart"
118
+        :style="{ width: '100%', height: '82%', top: '10%' }"
119
+      ></div>
120
+    </div>
121
+    <div class="page-content right-content contentX">
122
+      <span class="content-title">库区报警排名</span>
123
+      <div
124
+        class="myChart"
125
+        id="myChart1"
126
+        :style="{ width: '100%', height: '80%' }"
127
+      ></div>
128
+    </div>
129
+    <!-- </el-row> -->
58 130
   </d2-container>
59 131
 </template>
60 132
 
61 133
 <script>
134
+import fjmap from "./fjmap";
62 135
 export default {
136
+  components: { fjmap },
63 137
   data() {
64 138
     return {
65
-      tableData: [{ name: "哈哈哈" }, { name: "哈哈哈" }],
139
+      time: "",
140
+      tableData: [
141
+        {
142
+          ckmc: "商丘中转库",
143
+          cfmc: "3号仓",
144
+          bjsj: "2020-10-21",
145
+          yclddsc: "2小时",
146
+        },
147
+        {
148
+          ckmc: "商丘中转库",
149
+          cfmc: "5号仓",
150
+          bjsj: "2020-10-22",
151
+          yclddsc: "5小时",
152
+        },
153
+      ],
66 154
       tzggListData: [{ name: "哈哈哈" }, { name: "哈哈哈" }],
67 155
     };
68 156
   },
157
+  created() {},
158
+  mounted() {
159
+    //出入库数量趋势
160
+    this.drawLine();
161
+    //库区报警排名
162
+    this.drawBar();
163
+  },
69 164
   methods: {
70 165
     jumpDetails() {},
71 166
     tableRowClassName({ row, rowIndex }) {
@@ -75,19 +170,138 @@ export default {
75 170
         return "two-row";
76 171
       }
77 172
     },
173
+    drawBar() {
174
+      let myChart = this.$echarts.init(document.getElementById("myChart1"));
175
+      // 绘制图表
176
+      myChart.setOption({
177
+        tooltip: {
178
+          trigger: "axis",
179
+          backgroundColor: "rgba(21, 96, 176, 0.5)",
180
+          borderColor: "#7dc9de",
181
+          textStyle: {
182
+            color: "dafaff",
183
+          },
184
+          axisPointer: {
185
+            type: "shadow",
186
+          },
187
+        },
188
+        legend: {
189
+          textStyle: {
190
+            color: "#dafaff",
191
+          },
192
+        },
193
+        grid: {
194
+          top: "40px",
195
+          left: "3%",
196
+          right: "4%",
197
+          bottom: "3%",
198
+          containLabel: true,
199
+        },
200
+        xAxis: {
201
+          type: "value",
202
+          splitLine: {
203
+            show: true,
204
+            lineStyle: {
205
+              width: 1,
206
+              type: "solid",
207
+              color: "#0a4b88",
208
+            },
209
+          },
210
+          boundaryGap: [0, 0.01],
211
+          axisLine: {
212
+            lineStyle: {
213
+              color: "#dafaff",
214
+              width: 1,
215
+              type: "solid",
216
+            },
217
+          },
218
+        },
219
+        yAxis: {
220
+          type: "category",
221
+          splitLine: {
222
+            show: true,
223
+            lineStyle: {
224
+              width: 1,
225
+              type: "solid",
226
+              color: "#0a4b88",
227
+            },
228
+          },
229
+          axisLine: {
230
+            lineStyle: {
231
+              color: "#dafaff",
232
+              width: 1,
233
+              type: "solid",
234
+            },
235
+          },
236
+          data: [
237
+            "民权粮食储备公司",
238
+            "宁陵粮食储备公司",
239
+            "拓城粮食储备公司",
240
+            "虞城粮食储备公司",
241
+          ],
242
+        },
243
+        series: [
244
+          {
245
+            name: "逐次报警",
246
+            type: "bar",
247
+            data: [1, 2, 2, 4, 7, 3],
248
+          },
249
+          {
250
+            name: "总数报警",
251
+            type: "bar",
252
+            data: [1, 2, 2, 4, 7, 3],
253
+          },
254
+          {
255
+            name: "设备断链",
256
+            type: "bar",
257
+            data: [1, 2, 2, 4, 7, 3],
258
+          },
259
+        ],
260
+      });
261
+    },
78 262
     drawLine() {
79 263
       // 基于准备好的dom,初始化echarts实例
80 264
       let myChart = this.$echarts.init(document.getElementById("myChart"));
81 265
       // 绘制图表
82 266
       myChart.setOption({
83 267
         // title: { text: "在Vue中使用echarts" },
84
-        tooltip: {},
268
+        tooltip: {
269
+          backgroundColor: "rgba(21, 96, 176, 0.5)",
270
+          borderColor: "#7dc9de",
271
+          textStyle: {
272
+            color: "dafaff",
273
+          },
274
+        },
85 275
         legend: {
86 276
           data: ["出库", "入库"],
277
+          textStyle: {
278
+            color: "#dafaff",
279
+          },
280
+        },
281
+        grid: {
282
+          top: "40px",
87 283
         },
88 284
         xAxis: {
89 285
           type: "category",
90 286
           boundaryGap: false,
287
+          splitLine: {
288
+            show: true,
289
+            lineStyle: {
290
+              width: 1,
291
+              type: "solid",
292
+              color: "#0a4b88",
293
+            },
294
+          },
295
+          axisLine: {
296
+            lineStyle: {
297
+              color: "#dafaff",
298
+              width: 1,
299
+              type: "solid",
300
+            },
301
+          },
302
+          axisLabel: {
303
+            interval: 0,
304
+          },
91 305
           data: [
92 306
             "1月",
93 307
             "2月",
@@ -103,7 +317,24 @@ export default {
103 317
             "12月",
104 318
           ],
105 319
         },
106
-        yAxis: { type: "value" },
320
+        yAxis: {
321
+          type: "value",
322
+          splitLine: {
323
+            show: true,
324
+            lineStyle: {
325
+              width: 1,
326
+              type: "solid",
327
+              color: "#0a4b88",
328
+            },
329
+          },
330
+          axisLine: {
331
+            lineStyle: {
332
+              color: "#dafaff",
333
+              width: 1,
334
+              type: "solid",
335
+            },
336
+          },
337
+        },
107 338
         series: [
108 339
           {
109 340
             name: "出库",
@@ -123,10 +354,6 @@ export default {
123 354
       });
124 355
     },
125 356
   },
126
-  created() {},
127
-  mounted() {
128
-    this.drawLine();
129
-  },
130 357
 };
131 358
 </script>
132 359
 
@@ -135,16 +362,22 @@ export default {
135 362
   width: 100%;
136 363
   height: 100%;
137 364
   color: #dafaff;
138
-  background-image: url("./image/bg.png") no-repeat;
365
+  background: url("./image/bg.png") center no-repeat;
366
+  background-size: 100%;
367
+  ::v-deep.el-button--small,
368
+  .el-button--small.is-round {
369
+    padding: 7px 15px;
370
+  }
139 371
   ::v-deep.el-table::before {
140 372
     background-color: #042c59 !important;
141 373
   }
142 374
   ::v-deep.el-table td.el-table__cell,
143 375
   ::v-deep.el-table th.el-table__cell.is-leaf {
144 376
     border: 0px !important;
377
+    padding: 5px 0px;
145 378
   }
146 379
   ::v-deep.el-table th.el-table__cell {
147
-    background-color: #042c59;
380
+    background-color: #1460b0;
148 381
   }
149 382
   ::v-deep.el-table--enable-row-hover
150 383
     .el-table__body
@@ -164,7 +397,7 @@ export default {
164 397
   }
165 398
   ::v-deep.el-table .two-row {
166 399
     background-color: #063c67 !important;
167
-    color: #dafaff;
400
+    color: #f7feff;
168 401
   }
169 402
   .table-content {
170 403
     width: 98%;
@@ -188,6 +421,7 @@ export default {
188 421
     margin-top: 4%;
189 422
   }
190 423
   .page-content {
424
+    position: relative;
191 425
     width: 35%;
192 426
     min-width: 350px;
193 427
     height: 100%;
@@ -195,10 +429,14 @@ export default {
195 429
     background-size: 100% 100%;
196 430
   }
197 431
   .right-content {
432
+    height: 45%;
433
+    min-height: 300px;
198 434
     margin-right: -20px;
199 435
     float: right;
200 436
   }
201 437
   .left-content {
438
+    height: 45%;
439
+    min-height: 300px;
202 440
     float: left;
203 441
   }
204 442
   .tzggList {
@@ -206,19 +444,210 @@ export default {
206 444
     padding: 0;
207 445
   }
208 446
   .tzggList li {
209
-    margin: 5px;
210
-    padding-left: 10px;
447
+    margin: 0 5px;
448
+    padding-left: 20px;
211 449
     list-style: none;
212 450
     padding-right: 10px;
213 451
     height: 40px;
214 452
     line-height: 40px;
215 453
     border-bottom: 1px solid #1460b0;
216 454
   }
455
+  .tzggList li:hover {
456
+    background: #1460af;
457
+    // border-bottom: 1px solid #1460b0;
458
+    border-radius: 25px;
459
+  }
217 460
   .tzggListLi {
218 461
     float: right;
219 462
   }
220
-  #myChart {
463
+  .myChart {
464
+    margin: 0 auto;
465
+    color: #f7feff;
466
+  }
467
+  .mapPosition {
468
+    width: 30%;
221 469
     margin: 0 auto;
470
+    min-width: 400px;
471
+    height: 92%;
472
+    position: absolute;
473
+    left: 36%;
474
+    right: center;
475
+  }
476
+  .echarts-map {
477
+    min-width: 30px;
478
+    min-height: 30px;
479
+    width: 100%;
480
+    height: 100%;
481
+  }
482
+  .kck-content {
483
+    font-size: 14px;
484
+    width: 91%;
485
+    height: 50px;
486
+    margin: 5% 0 0 4%;
487
+    float: left;
488
+    background: url("./image/crbg.png") no-repeat;
489
+    background-size: 100% 100%;
490
+    background-position: center;
491
+  }
492
+  .kck-content-out {
493
+    text-align: center;
494
+    line-height: 47px;
495
+  }
496
+  .kck-content-in-2 {
497
+    margin: 0 15px;
498
+  }
499
+  .kck-content-num1 {
500
+    margin: 0 5px;
501
+    font-size: 20px;
502
+    font-weight: bold;
503
+  }
504
+  .kck-content-num2 {
505
+    display: inline-block;
506
+    width: 35px;
507
+    height: 22px;
508
+    line-height: 22px;
509
+    background: url("./image/szkBlue.png") no-repeat;
510
+    background-size: 100%;
511
+    letter-spacing: 12px;
512
+    padding-left: 6px;
513
+  }
514
+  .kck-content-num3 {
515
+    display: inline-block;
516
+
517
+    width: 35px;
518
+    height: 22px;
519
+    line-height: 22px;
520
+    background: url("./image/szkBlue.png") no-repeat;
521
+    background-size: 100% 100%;
522
+    letter-spacing: 12px;
523
+    padding-left: 6px;
524
+  }
525
+  .ckt-bg {
526
+    position: relative;
527
+    width: 190px;
528
+    height: 100px;
529
+    float: left;
530
+    background: url("./image/ckl.png") no-repeat;
531
+    background-size: 100% 100%;
532
+  }
533
+  .rkt-bg {
534
+    width: 190px;
535
+    height: 100px;
536
+    float: right;
537
+    background: url("./image/rkl.png") no-repeat;
538
+    background-size: 100% 100%;
539
+  }
540
+  .czBut {
541
+    color: #dafaff;
542
+    background-color: #142f66;
543
+    border: 1.5px solid #4a95be;
544
+    border-radius: 7px;
545
+  }
546
+  .czBut:hover {
547
+    color: #dafaff;
548
+    background-color: #3d8ee9;
549
+    border: 1.5px solid #4a95be;
550
+    border-radius: 7px;
551
+  }
552
+  .ckmcImg {
553
+    width: 17px;
554
+    margin: 0px 10px 0 -5px;
555
+  }
556
+  .seeMore {
557
+    font-size: 14px;
558
+    position: absolute;
559
+    bottom: 10px;
560
+    right: 0px;
561
+    margin: 10px 20px;
562
+    cursor: pointer;
563
+  }
564
+  .tzXyd {
565
+    background: #dafaff;
566
+    display: inline-block;
567
+    width: 7px;
568
+    height: 7px;
569
+    border-radius: 50%;
570
+    margin-right: 10px;
571
+  }
572
+  .ckt-szk-bg {
573
+    position: absolute;
574
+    width: 35px;
575
+    height: 22px;
576
+    left: 100px;
577
+    top: 50px;
578
+    background: url("./image/szkBlue.png") no-repeat;
579
+    background-size: 100% 100%;
580
+    letter-spacing: 12px;
581
+    padding-left: 6px;
582
+  }
583
+  .rkt-szk-bg {
584
+    position: absolute;
585
+    width: 35px;
586
+    height: 22px;
587
+    right: 100px;
588
+    top: 50px;
589
+    background: url("./image/szkGreen.png") no-repeat;
590
+    background-size: 100% 100%;
591
+    letter-spacing: 12px;
592
+    padding-left: 6px;
593
+  }
594
+  .rkt-bg-font {
595
+    font-size: 14px;
596
+    position: absolute;
597
+    right: 70px;
598
+    top: 23px;
599
+  }
600
+  .ckt-bg-font {
601
+    font-size: 14px;
602
+    position: absolute;
603
+    left: 70px;
604
+    top: 23px;
605
+  }
606
+  .ckt-bg-little {
607
+    font-size: 12px;
608
+    position: absolute;
609
+    left: 60px;
610
+    top: 79px;
611
+  }
612
+  .rkt-bg-little {
613
+    font-size: 12px;
614
+    position: absolute;
615
+    right: 40px;
616
+    top: 79px;
617
+  }
618
+  .zcColor {
619
+    margin-right: 5px;
620
+    color: #19d606;
621
+  }
622
+  .jdColor {
623
+    margin-right: 5px;
624
+    color: #ff8ca7;
625
+  }
626
+  .timeOption {
627
+    position: absolute;
628
+    width: 187px;
629
+    right: 20px;
630
+    height: 28px;
631
+    background-color: #142f66;
632
+    padding: 0;
633
+    margin: -16px 0 0 0;
634
+  }
635
+  ::v-deep.el-date-editor .el-range__icon {
636
+    font-size: 12px;
637
+    margin-left: 5px;
638
+    color: #f7feff;
639
+    float: left;
640
+    line-height: 26px;
641
+  }
642
+  ::v-deep.el-range-editor .el-range-input {
643
+    background: #142f66;
644
+    font-size: 12px;
645
+  }
646
+  ::v-deep.el-date-editor .el-range-separator {
647
+    padding: 0 5px;
648
+    line-height: 25px;
649
+    width: 5%;
650
+    color: #f7feff;
222 651
   }
223 652
   // .btn-group {
224 653
   //   color: $color-text-placehoder;

BIN
src/views/system/login/image/logo1.png


BIN
src/views/system/login/image/logo2.png