Explorar el Código

1.各中心设备指标纵坐标修改;2新增时间筛选条件及修改样式

duanxiaoduan hace 2 años
padre
commit
7b52c91e7c
Se han modificado 2 ficheros con 91 adiciones y 5 borrados
  1. 1 1
      src/permission.js
  2. 90 4
      src/views/dashboard/editor/index.vue

+ 1 - 1
src/permission.js

@@ -7,7 +7,7 @@ import { getToken,removeToken } from '@/utils/auth' // get token from cookie
 import Cookies from 'js-cookie'
 import getPageTitle from '@/utils/get-page-title'
 // 1为单点登录,其他不是
-Cookies.set('sso',1)
+Cookies.set('sso',0)
 NProgress.configure({ showSpinner: false }) // NProgress Configuration
 
 const whiteList = ['/login'] // no redirect whitelist

+ 90 - 4
src/views/dashboard/editor/index.vue

@@ -4,8 +4,13 @@
       <el-col :span="12">
         <div class="generalTitle"> 现代牧业设备管理系统 </div>
       </el-col>
-      <el-col :span="12">
-        <div class="date"> {{ row1.date }} </div>
+      <el-col :span="6">
+        <!-- <div class="date"> {{ row1.date }} </div> -->
+      </el-col>
+    </el-row>
+    <el-row type="flex" justify="end">
+      <el-col :span="4">
+        <el-date-picker popper-class="jlpMySelectPopper" style="width: 100%;" v-model="row1.month" type="monthrange"range-separator="至" start-placeholder="开始月份" end-placeholder="结束月份" class="month" :clearable="false"> </el-date-picker>
       </el-col>
     </el-row>
 
@@ -188,13 +193,15 @@ import { parseTime } from '@/utils/index.js'
 import echarts from 'echarts'
 import 'echarts/map/js/china'
 import $ from 'jquery'
+import 'element-ui/lib/theme-chalk/index.css'
 require('echarts/theme/macarons')
 export default {
   name: 'DashboardEditor',
   data() {
     return {
       row1: {
-        date: parseTime(new Date(), '{y}-{m}-{d}')
+        date: parseTime(new Date(), '{y}-{m}-{d}'),
+        month:[new Date(),new Date()]
       },
 
       row2: {
@@ -725,7 +732,7 @@ export default {
               }
             }
           },
-          { type: 'value', name: '', min: 0, max: 100, interval: 20, splitLine:{show: false}, axisLabel: { formatter: '{value} %' }, axisLine: { lineStyle: { color: '#ffff00' }} }
+          { type: 'value', name: '', min: 0, max: 200, interval: 20, splitLine:{show: false}, axisLabel: { formatter: '{value} %' }, axisLine: { lineStyle: { color: '#ffff00' }} }
         ],
         series: [
           { type: 'bar', barWidth: 15, data: chart_data1.data2, name:'设备指标迄今预算' },
@@ -1164,5 +1171,84 @@ export default {
       margin: 0 5px;
     }
   }
+  // 单个
+  .month /deep/ .el-date-editor .el-range-input{
+    background: #031951;
+    color: #fff;
+    border: 1px solid #235fa7;
+  }
+  /deep/input::-webkit-input-placeholder {
+      color: #fff;
+      font-size: 12px;
+  }
+
+  /deep/input::-moz-input-placeholder {
+      color: #fff;
+      font-size: 12px;
+  }
 
+  /deep/input::-ms-input-placeholder {
+      color: #fff;
+      font-size: 12px;
+  }
+  // 多个
+  /deep/ .el-range-editor.el-input__inner{
+    background: #031951;
+    color: #fff;
+    border: 1px solid #235fa7;
+  }
+  /deep/ .el-range-input{
+    background: #031951;
+  }
+  /deep/.el-date-editor .el-range-input{
+    color: #fff;
+  }
+  /deep/input::-webkit-input-placeholder {
+      color: #fff;
+      font-size: 12px;
+  }
+
+  /deep/input::-moz-input-placeholder {
+      color: #fff;
+      font-size: 12px;
+  }
+
+  /deep/input::-ms-input-placeholder {
+      color: #fff;
+      font-size: 12px;
+  }
+  /deep/.el-input__icon{
+    color:#fff;
+  }
+  /deep/ .el-date-editor .el-range-separator{
+    color: #fff;
+  }
+</style>
+<style lang="scss">
+   .jlpMySelectPopper {
+      background: #031951;
+      color: #fff;
+      border: 1px solid #0d2f6b;
+      /deep/.cell{
+        color:#fff;
+      }
+      .el-date-picker__header-label {
+          color: #ffffff;
+      }
+      .el-picker-panel__icon-btn{
+        color: #ffffff;
+      }
+      .el-month-table td .cell {
+          color: #fff;
+      }
+      .el-month-table td.start-date .cell{
+        background: #031951;
+      }
+      .el-month-table td.end-date .cell{
+        background: #031951;
+      }
+      .el-month-table td.in-range div{
+        background: #b9c8ee;
+      }
+  }
 </style>