Merge pull request 'zjl' (#26) from zjl into test

Reviewed-on: http://git.picaiba.com/mt-fe-group/yudao-dev/pulls/26

.env.dev

@@ -14,8 +14,13 @@ VUE_APP_TITLE = 芋道管理系统
 # 芋道管理系统/开发环境
 # VUE_APP_BASE_API = 'http://192.168.1.49:48080'
 # VUE_APP_BASE_API = 'http://192.168.1.8:48080'
+<<<<<<< HEAD
+VUE_APP_BASE_API = 'http://192.168.0.33:48080'
+# VUE_APP_BASE_API = 'http://192.168.1.188:48080'
+=======
 # VUE_APP_BASE_API = 'http://192.168.0.33:48080'
 VUE_APP_BASE_API = 'http://192.168.1.188:48080'
+>>>>>>> test
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

src/api/base/groupTeam.js

@@ -50,3 +50,11 @@ export function getCode() {
     method: 'get'
   })
 }
+
+// 获得可用的排班列表
+export function listEnabled() {
+  return request({
+    url: '/base/group-team/listEnabled',
+    method: 'get'
+  })
+}

src/api/base/groupTeamScheduling.js

@@ -1,54 +1,27 @@
 import request from '@/utils/request'
 
-// 创建排班信息
-export function createGroupTeamScheduling(data) {
+// 获取某月预排班-已有排班
+export function getPreset(query) {
   return request({
-    url: '/base/group-team-scheduling/create',
-    method: 'post',
-    data: data
+    url: '/base/group-team-scheduling/getPreset',
+    method: 'get',
+    params: query
   })
 }
 
-// 更新排班信息
-export function updateGroupTeamScheduling(data) {
+// 批量创建-更新排班信息
+export function createOrUpdateList(data) {
   return request({
-    url: '/base/group-team-scheduling/update',
-    method: 'put',
+    url: '/base/group-team-scheduling/createOrUpdateList',
+    method: 'post',
     data: data
   })
 }
 
-// 删除排班信息
-export function deleteGroupTeamScheduling(id) {
+// 自动排班，填充上月已有的排班
+export function autoSet() {
   return request({
-    url: '/base/group-team-scheduling/delete?id=' + id,
-    method: 'delete'
-  })
-}
-
-// 获得排班信息
-export function getGroupTeamScheduling(id) {
-  return request({
-    url: '/base/group-team-scheduling/get?id=' + id,
+    url: '/base/group-team-scheduling/autoSet',
     method: 'get'
   })
-}
-
-// 获得排班信息分页
-export function getGroupTeamSchedulingPage(query) {
-  return request({
-    url: '/base/group-team-scheduling/page',
-    method: 'get',
-    params: query
-  })
-}
-
-// 导出排班信息 Excel
-export function exportGroupTeamSchedulingExcel(query) {
-  return request({
-    url: '/base/group-team-scheduling/export-excel',
-    method: 'get',
-    params: query,
-    responseType: 'blob'
-  })
-}
+}

src/assets/icons/svg/toggle.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>切换</title>
+    <g id="1班组管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="切换" fill="#FFFFFF" fill-rule="nonzero">
+            <rect id="矩形" opacity="0" x="0" y="0" width="16" height="16"></rect>
+            <path d="M14.5,9.15 C14.969442,9.15 15.35,9.53055796 15.35,10 C15.35,10.4333311 15.0257376,10.7909267 14.6066222,10.8433773 L14.5,10.85 L3.523,10.8493636 L5.10448737,12.4305126 C5.26177017,12.5877954 5.34716031,12.7990496 5.34764236,13.015701 L5.34074746,13.1242515 L5.31933966,13.2323523 C5.24258033,13.518822 5.01882201,13.7425803 4.73235229,13.8193397 C4.48169128,13.8865041 4.21633806,13.832194 4.01342676,13.6770775 L3.93051263,13.6044874 L1.04232939,10.7055042 C0.831903536,10.5688042 0.689345737,10.3541899 0.656994192,10.1075365 L0.65,10 L0.65778959,9.88152374 C0.670925502,9.77175364 0.705946489,9.66606949 0.76033092,9.57061601 L0.821076439,9.47880032 L0.894170559,9.39517056 C1.02591288,9.26342824 1.19742791,9.1808136 1.37731459,9.15882561 L1.5,9.15 L14.5,9.15 Z M11.9865732,2.32292254 L12.0694874,2.39551263 L14.9508862,5.29019827 C15.1653597,5.42263107 15.3074642,5.64305498 15.3419246,5.89182346 L15.35,6 L15.3417548,6.1198336 C15.3282251,6.22918814 15.2930578,6.33441548 15.2387207,6.42946868 L15.1780851,6.52090655 L15.1052179,6.60421789 C14.9738843,6.73555151 14.8030912,6.81820523 14.622959,6.840766 L14.5,6.85 L1.5,6.85 C1.03055796,6.85 0.65,6.46944204 0.65,6 C0.65,5.56666889 0.974262406,5.20907332 1.39337781,5.15662271 L1.5,5.15 L12.475,5.14936355 L10.8955126,3.56948738 C10.7382298,3.41220459 10.6528397,3.20095039 10.6523576,2.98429905 L10.6592525,2.8757485 L10.6806603,2.76764771 C10.7478247,2.5169867 10.9275353,2.31433911 11.1633258,2.21617103 L11.2676477,2.18066033 C11.5183087,2.11349592 11.7836619,2.167806 11.9865732,2.32292254 Z" id="形状结合"></path>
+        </g>
+    </g>
+</svg>

src/views/energy/analysis/contrastAnalysis/components/searchArea.vue

@@ -1,7 +1,8 @@
 <template>
   <el-form :inline="true" class="demo-form-inline">
+    <span class="blue-block"></span>
     <el-form-item label="能源类型">
-      <el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;">
+      <el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;" size="small">
         <el-option
           v-for="item in energyTypeList"
           :key="item.id"
@@ -11,7 +12,7 @@
       </el-select>
     </el-form-item>
     <el-form-item label="时间维度">
-      <el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;">
+      <el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;" size="small">
         <el-option
           v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
           :key="item.value"
@@ -33,6 +34,7 @@
           :picker-options="pickerOptions"
           popper-class="noneMinute"
           @change="timeSelect"
+          size="small"
           :clearable="false"
           >
         </el-date-picker>
@@ -47,6 +49,7 @@
           value-format="timestamp"
           :picker-options="pickerOptions"
           :clearable="false"
+          size="small"
           @change="timeSelect"
           >
         </el-date-picker>
@@ -60,6 +63,7 @@
           :picker-options="pickerOptionsWeek"
           @change="startWeek"
           :clearable="false"
+          size="small"
           placeholder="选择周">
         </el-date-picker>-
         <el-date-picker
@@ -70,6 +74,7 @@
           style='width:150px;'
           @change="endWeek"
           :clearable="false"
+          size="small"
           placeholder="选择周">
         </el-date-picker>
       </div>
@@ -83,6 +88,7 @@
           value-format="timestamp"
           :clearable="false"
           :picker-options="pickerOptions"
+          size="small"
           @change="timeSelect"
           >
         </el-date-picker>
@@ -96,6 +102,7 @@
           value-format="timestamp"
           placeholder="选择年"
           @change="startYear"
+          size="small"
           :clearable="false"
         >
         </el-date-picker>-
@@ -107,13 +114,14 @@
           value-format="timestamp"
           placeholder="选择年"
           @change="endYear"
+          size="small"
           :clearable="false"
         >
         </el-date-picker>
       </div>
     </el-form-item>
     <el-form-item label="对象维度">
-      <el-select v-model="queryParams.objType" placeholder="请选择" style="width: 80px;" @change="selectObjs">
+      <el-select v-model="queryParams.objType" placeholder="请选择" style="width: 80px;" @change="selectObjs" size="small">
         <el-option
           v-for="item in getDictDatas(this.DICT_TYPE.OBJECT_TYPE)"
           :key="item.value"
@@ -123,7 +131,7 @@
       </el-select>
     </el-form-item>
     <el-form-item label="对象选择">
-      <el-select v-model="queryParams.objIds" placeholder="请选择" multiple collapse-tags style="width: 200px;">
+      <el-select v-model="queryParams.objIds" placeholder="请选择" multiple collapse-tags style="width: 200px;" size="small">
         <el-option
           v-for="item in objectList"
           :key="item.id"
@@ -135,7 +143,7 @@
       </el-select>
     </el-form-item>
     <el-form-item>
-      <el-button type="primary" @click="search">查询</el-button>
+      <el-button type="primary" size="small" @click="search">查询</el-button>
     </el-form-item>
   </el-form>
 </template>
@@ -400,4 +408,17 @@ export default {
 .noneMinute .el-scrollbar:nth-of-type(2) {
   display: none;
 }
+</style>
+<style lang="scss" scoped>
+.demo-form-inline {
+  .blue-block {
+    display: inline-block;
+    width: 4px;
+    height: 16px;
+    background-color: #0B58FF;
+    border-radius: 1px;
+    margin-right: 8px;
+    margin-top: 10px;
+  }
+}
 </style>

src/views/energy/analysis/qoqAnalysis/components/searchArea.vue

@@ -1,15 +1,17 @@
 <template>
   <el-form :inline="true" class="demo-form-inline">
+    <span class="blue-block"></span>
     <el-form-item label="对象选择">
       <el-cascader
         v-model="objArr"
         :options="objList"
         :props="{ checkStrictly: true, value: 'id', label: 'name' }"
         popper-class="cascaderParent"
+        size="small"
         clearable></el-cascader>
     </el-form-item>
     <el-form-item label="时间维度">
-      <el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;">
+      <el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;" size="small">
         <el-option
           v-for="item in timeType"
           :key="item.id"
@@ -27,6 +29,7 @@
           :picker-options="pickerOptions"
           @change="selectTime"
           :clearable="false"
+          size="small"
           placeholder="选择月">
         </el-date-picker>
       </div>
@@ -38,6 +41,7 @@
           :picker-options="pickerOptionsWeek"
           @change="selectTime"
           :clearable="false"
+          size="small"
           placeholder="选择周">
         </el-date-picker>
       </div>
@@ -48,18 +52,19 @@
           :picker-options="pickerOptions"
           @change="selectTime"
           :clearable="false"
+          size="small"
           placeholder="选择日">
         </el-date-picker>
       </div>
     </el-form-item>
     <el-form-item>
-      <el-button type="primary" @click="search">查询</el-button>
+      <el-button type="primary" size="small" @click="search">查询</el-button>
     </el-form-item>
     <el-form-item>
       <span class="separateStyle"></span>
     </el-form-item>
     <el-form-item>
-      <el-button type="primary" @click="exportData" plain>导出</el-button>
+      <el-button type="primary" size="small" @click="exportData" plain>导出</el-button>
     </el-form-item>
   </el-form>
 </template>
@@ -178,4 +183,17 @@ export default {
   background: #E8E8E8;
   vertical-align: middle;
 }
+</style>
+<style lang="scss" scoped>
+.demo-form-inline {
+  .blue-block {
+    display: inline-block;
+    width: 4px;
+    height: 16px;
+    background-color: #0B58FF;
+    border-radius: 1px;
+    margin-right: 8px;
+    margin-top: 10px;
+  }
+}
 </style>

src/views/energy/analysis/trendAnalysis/components/searchArea.vue

@@ -1,7 +1,8 @@
 <template>
   <el-form :inline="true" class="demo-form-inline">
+    <span class="blue-block"></span>
     <el-form-item label="能源类型">
-      <el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;">
+      <el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;" size="small">
         <el-option
           v-for="item in energyTypeList"
           :key="item.id"
@@ -16,15 +17,17 @@
         :options="objList"
         :props="{ checkStrictly: true, value: 'id', label: 'name' }"
         popper-class="cascaderParent"
+        size="small"
         clearable></el-cascader>
     </el-form-item>
     <el-form-item label="时间维度">
-      <el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;">
+      <el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;" size="small">
         <el-option
           v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
           :key="item.value"
           :label="item.label"
-          :value="item.value">
+          :value="item.value"
+          size="small">
         </el-option>
       </el-select>
     </el-form-item>
@@ -41,6 +44,7 @@
           :picker-options="pickerOptions"
           popper-class="noneMinute"
           @change="timeSelect"
+          size="small"
           >
         </el-date-picker>
       </div>
@@ -54,6 +58,7 @@
           value-format="timestamp"
           :picker-options="pickerOptions"
           @change="timeSelect"
+          size="small"
           >
         </el-date-picker>
       </div>
@@ -65,6 +70,7 @@
           style='width:150px;'
           :picker-options="pickerOptionsWeek"
           @change="startWeek"
+          size="small"
           placeholder="选择周">
         </el-date-picker>-
         <el-date-picker
@@ -74,6 +80,7 @@
           :picker-options="pickerOptionsWeek"
           style='width:150px;'
           @change="endWeek"
+          size="small"
           placeholder="选择周">
         </el-date-picker>
       </div>
@@ -86,6 +93,7 @@
           end-placeholder="结束日期"
           value-format="timestamp"
           :picker-options="pickerOptions"
+          size="small"
           @change="timeSelect"
           >
         </el-date-picker>
@@ -98,6 +106,7 @@
           :picker-options="pickerOptions"
           value-format="timestamp"
           placeholder="选择年"
+          size="small"
           @change="startYear"
         >
         </el-date-picker>-
@@ -108,13 +117,14 @@
           :picker-options="pickerOptions"
           value-format="timestamp"
           placeholder="选择年"
+          size="small"
           @change="endYear"
         >
         </el-date-picker>
       </div>
     </el-form-item>
     <el-form-item>
-      <el-button type="primary" @click="search">查询</el-button>
+      <el-button type="primary" size="small" @click="search">查询</el-button>
     </el-form-item>
   </el-form>
 </template>
@@ -162,6 +172,7 @@ export default {
     this.getTypeList()
     this.getObjTree()
     this.queryParams.timeDim = this.getDictDatas(this.DICT_TYPE.TIME_DIM)[0].value // 默认时
+    this.timeValue = [moment().startOf('day'), moment().endOf('day')-59*61*1000]
   },
   methods: {
     getTypeList() {
@@ -266,7 +277,7 @@ export default {
         this.$modal.msgError('请选择能源类型')
         return false
       }
-      if (!this.objArr.length === 0) {
+      if (this.objArr.length === 0) {
         this.$modal.msgError('请选择对象')
         return false
       } else {
@@ -361,4 +372,17 @@ export default {
 .noneMinute .el-scrollbar:nth-of-type(2) {
   display: none;
 }
+</style>
+<style lang="scss" scoped>
+.demo-form-inline {
+  .blue-block {
+    display: inline-block;
+    width: 4px;
+    height: 16px;
+    background-color: #0B58FF;
+    border-radius: 1px;
+    margin-right: 8px;
+    margin-top: 10px;
+  }
+}
 </style>

src/views/energy/analysis/trendAnalysis/index.vue

@@ -37,16 +37,6 @@ export default {
           this.chartData = []
         }
       })
-      // getEnergyTrend({
-      //   energyTypeId: "1681183397517406210",
-      //   objId: "1679031282510532610",
-      //   timeDim: "2",
-      //   startTime: "1690732800000",
-      //   endTime: "1690992000000"
-      // }).then((res) => {
-      //   console.log(res)
-      //   this.chartData = res.data
-      // })
     },
     switchChart() {
       if (this.activeName === 'bar') {

src/views/energy/analysis/yoyAnalysis/components/searchArea.vue

@@ -1,15 +1,17 @@
 <template>
   <el-form :inline="true" class="demo-form-inline">
+    <span class="blue-block"></span>
     <el-form-item label="对象选择">
       <el-cascader
         v-model="objArr"
         :options="objList"
         :props="{ checkStrictly: true, value: 'id', label: 'name' }"
         popper-class="cascaderParent"
+        size="small"
         clearable></el-cascader>
     </el-form-item>
     <el-form-item label="时间维度">
-      <el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;">
+      <el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;" size="small">
         <el-option
           v-for="item in timeType"
           :key="item.id"
@@ -27,6 +29,7 @@
           :picker-options="pickerOptions"
           @change="selectTime"
           :clearable="false"
+          size="small"
           placeholder="选择年">
         </el-date-picker>
       </div>
@@ -37,18 +40,19 @@
           :picker-options="pickerOptions"
           @change="selectTime"
           :clearable="false"
+          size="small"
           placeholder="选择月">
         </el-date-picker>
       </div>
     </el-form-item>
     <el-form-item>
-      <el-button type="primary" @click="search">查询</el-button>
+      <el-button type="primary" size="small" @click="search">查询</el-button>
     </el-form-item>
     <el-form-item>
       <span class="separateStyle"></span>
     </el-form-item>
     <el-form-item>
-      <el-button type="primary" @click="exportData" plain>导出</el-button>
+      <el-button type="primary" size="small" @click="exportData" plain>导出</el-button>
     </el-form-item>
   </el-form>
 </template>
@@ -153,4 +157,17 @@ export default {
   background: #E8E8E8;
   vertical-align: middle;
 }
+</style>
+<style lang="scss" scoped>
+.demo-form-inline {
+  .blue-block {
+    display: inline-block;
+    width: 4px;
+    height: 16px;
+    background-color: #0B58FF;
+    border-radius: 1px;
+    margin-right: 8px;
+    margin-top: 10px;
+  }
+}
 </style>

src/views/energy/base/energyPlcConnect/index.vue

@@ -92,7 +92,7 @@ export default {
           type: 'input',
           label: '标识名',
           placeholder: '标识名',
-          param: 'name'
+          param: 'cnName'
         },
         {
           type: 'button',
@@ -149,7 +149,7 @@ export default {
       queryParams: {
         pageNo: 1,
         pageSize: 20,
-        name: null
+        cnName: null
       },
       paramVisible: false,
       energyTypeList: [],
@@ -173,7 +173,7 @@ export default {
       switch (val.btnName) {
         case 'search':
           this.queryParams.pageNo = 1;
-          this.queryParams.name = val.name
+          this.queryParams.cnName = val.cnName
           this.getList()
           break
         default:

src/views/energy/monitoring/energyLimit/components/energyLimitAdd.vue

@@ -47,7 +47,7 @@
       </el-select>
     </el-form-item>
     <el-form-item label="消耗量阈值" prop="limitValue">
-      <el-input v-model="form.limitValue"></el-input>
+      <el-input-number v-model="form.limitValue" :min="0" :max="10000000000000000" style="width: 100%;"></el-input-number>
     </el-form-item>
   </el-form>
 </template>

src/views/energy/monitoring/energyReportSearch/index.vue

@@ -118,7 +118,11 @@ export default {
     window.addEventListener('resize', () => {
       this.tableH = this.tableHeight(260)
     })
-    this.formConfig[2].defaultSelect = [Date.now() - 7*24*3600000, Date.now()]
+    if (this.$route.params.startTime && this.$route.params.endTime) {
+      this.formConfig[2].defaultSelect = [this.$route.params.startTime, this.$route.params.endTime]
+    } else {
+      this.formConfig[2].defaultSelect = [Date.now() - 7*24*3600000, Date.now()]
+    }
     this.queryParams.startTime = this.formConfig[2].defaultSelect[0]
     this.queryParams.endTime = this.formConfig[2].defaultSelect[1]
     this.getList()

src/views/energy/monitoring/energyStatistics/components/energyStatisticsDetAdd.vue

@@ -75,7 +75,7 @@ export default {
         {
           type: 'input',
           label: '参数名称',
-          placeholder: '方案名称',
+          placeholder: '参数名称',
           param: 'paramName'
         },
         {

src/views/group/base/groupClasses/components/groupClassAdd.vue

@@ -46,7 +46,7 @@
             format='HH:mm'
             value-format='HH:mm'
             style="width: 100%;"
-            @change="timeFun"
+            @change="timeFun('start')"
           >
           </el-time-picker>
         </el-form-item>
@@ -58,7 +58,7 @@
             format='HH:mm'
             value-format='HH:mm'
             style="width: 100%;"
-            @change="timeFun"
+            @change="timeFun('end')"
           >
           </el-time-picker>
         </el-form-item>
@@ -126,12 +126,19 @@ export default {
         })
       }
     },
-    timeFun() {
+    timeFun(val) {
       if (this.form.startTime && this.form.endTime) {
         if (this.form.startTime > this.form.endTime) {
           this.form.daySpan = 1
-        } else {
+        } else if (this.form.startTime < this.form.endTime) {
           this.form.daySpan = 0
+        } else {
+          if (val === 'start') {
+            this.form.startTime = ''
+          } else {
+            this.form.endTime = ''
+          }
+          this.$modal.msgWarning('班次开始时间和结束时间不能相同')
         }
       }
     },

src/views/group/base/groupClasses/index.vue

@@ -116,7 +116,17 @@ export default {
           : undefined,
           {
             type: 'cancel',
-            btnName: '作废'
+            btnName: '作废',
+            showParam: {
+              type: '&',
+              data: [
+                {
+                  type: 'unequal',
+                  name: 'status',
+                  value: '不可用'
+                }
+              ]
+            }
           },
         this.$auth.hasPermi('base:group-classes:delete')
           ? {
@@ -225,8 +235,9 @@ export default {
     },
     /** 删除按钮操作 */
     handleDelete(row) {
-      if (row.status) {
-        let _this = this
+      console.log(row)
+      let _this = this
+      if (row.status === '可用') {// 可用
         _this.$modal.confirm('删除的班次"' + row.name + '"可能会影响交接班计划，请点取消再次确认！').then(function() {
           return _this.$modal.confirm('是否确认删除班次名称为"' + row.name + '"的数据项?').then(function() {
               return deleteGroupClasses(row.id);

src/views/group/base/groupTeam/components/groupTeamAdd.vue

@@ -7,7 +7,7 @@
       <el-input v-model="form.code" disabled></el-input>
     </el-form-item>
     <el-form-item label="班组人数" prop="num">
-      <el-input v-model="form.num"></el-input>
+      <el-input-number v-model="form.num" :min="1" :max="99999999" style="width: 100%;"></el-input-number>
     </el-form-item>
     <el-form-item label="班组组长" prop="leaderName">
       <el-input v-model="form.leaderName"></el-input>

src/views/group/base/groupTeamScheduling/index.vue

@@ -1,67 +1,467 @@
 <template>
-  <div class="app-container">
-    <div>
+  <div class="groupTeamScheduling">
+    <div class="operationArea">
       <el-form :inline="true" class="demo-form-inline">
+        <span class="blue-block"></span>
         <el-form-item label="月份选择">
           <el-date-picker
-            v-model="queryParams.startDay"
+            v-model="startDay"
             type="month"
-            placeholder="选择月">
+            placeholder="选择月"
+            size="small"
+            :disabled="showSetting"
+            @change="selectMonth"
+            :clearable="false"
+            style="width: 120px">
           </el-date-picker>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary">自动排班</el-button>
+          <span class="separateStyle"></span>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary">编辑</el-button>
+          <el-button type="primary" size="small" :disabled="showSetting || settingBtnDis" @click="settingMsg">设置</el-button>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" plain @click="toUpperLower">班组上下片查询</el-button>
+          <el-button type="primary" size="small" v-show="showSetting && autoScheduling" @click="schedulingBtn">自动排班</el-button>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" plain>班组能源查询</el-button>
+          <span class="separateStyle" v-show="showSetting"></span>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" plain>班组检测查询</el-button>
+          <el-button type="primary" size="small" v-show="showSetting" @click="confirmSetting">确认</el-button>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" size="small" plain v-show="showSetting" @click="cancelSetting">取消</el-button>
+        </el-form-item>
+        <el-form-item label="请先选择查询的班组" class="rightItem">
+          <el-button type="primary" size="small" :disabled="jumpDisabled" @click="toOtherPage('1')">班组上下片查询</el-button>
+          <el-button type="primary" size="small" :disabled="jumpDisabled" @click="toOtherPage('2')">班组能源查询</el-button>
+          <el-button type="primary" size="small" :disabled="jumpDisabled" @click="toOtherPage('3')">班组检测查询</el-button>
         </el-form-item>
       </el-form>
     </div>
-    <!-- 班组上下片查询 -->
-    <group-upper-lower v-if="upperLowerVisible" ref="upperLowerParam"></group-upper-lower>
+    <!-- 日历区域 -->
+    <div class="calenderArea">
+      <div style="font-size: 24px;font-weight: 500">{{ this.month }} {{ this.year }}</div>
+      <el-calendar v-model="startDay">
+        <!-- 这里使用的是 2.5 slot 语法，对于新项目请使用 2.6 slot 语法-->
+        <template
+          slot="dateCell"
+          slot-scope="{date, data}">
+          <div v-if="data.type === 'current-month'">
+            <!-- 日期 -->
+            <div class="dateStyle">
+              {{ Number(data.day.split('-')[2]) }}
+              {{ data.day }}
+            </div>
+            <!-- 班次班组 -->
+            <!-- class有两个样式，一个是类似class1，还有个是选中红框显示 -->
+            <el-row :gutter="2" :class="'class' + (index+1) + (chooseTip === (item.startDay+item.classesId) ? ' team-active' : '')" v-for="(item, index) in list[Number(data.day.split('-')[2])]" :key='index'>
+              <el-col :span="12">
+                <div class="selectDiv">
+                  <!-- 选择班组图标 -->
+                  <div class="toggle-icon" v-show="showSetting && (new Date(data.day).valueOf() < new Date().valueOf() ? false: true)">
+                    <svg-icon icon-class="toggle"/>
+                  </div>
+                  <!-- 不能选择班组 -->
+                  <div class="toggle-icon-hide" v-show="!(showSetting && (new Date(data.day).valueOf() < new Date().valueOf() ? false: true))"></div>
+                  <el-select v-model="item.teamId" size='small' :disabled="!showSetting || (new Date(data.day).valueOf() > new Date().valueOf() ? false: true)">
+                    <el-option
+                      v-for="i in teamList"
+                      :key="i.id"
+                      :label="i.name"
+                      :value="i.id">
+                    </el-option>
+                  </el-select>
+              </div>
+              </el-col>
+              <el-col :span="12">
+                <el-button class="labelClass" @click="chooseTeam(item)">{{ item.classesName }}</el-button>
+              </el-col>
+            </el-row>
+          </div>
+        </template>
+      </el-calendar>
+    </div>
   </div>
 </template>
 
 <script>
-import { createGroupTeamScheduling } from "@/api/base/groupTeamScheduling";
-import GroupUpperLower from "./components/groupUpperLower.vue"
+import { getPreset, createOrUpdateList, autoSet } from "@/api/base/groupTeamScheduling";
+import { listEnabled } from "@/api/base/groupTeam";
+import moment from 'moment';
 
 export default {
   name: "GroupTeamScheduling",
-  components: { GroupUpperLower },
   data() {
     return {
-      monthList: [
-        {id: ''}
-      ],
-      // 查询参数
-      queryParams: {
-        pageNo: 1,
-        pageSize: 10
-      },
-      upperLowerVisible: false
+      startDay: '',// 查询参数
+      year: '',// 2023
+      month: '',// 九月
+      monthList: ["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],
+      list: {},
+      teamList: [],// 班组下拉
+      showSetting: false,// 设置模式。自动排班，确认，取消按钮显示
+      settingBtnDis: false,
+      jumpDisabled: true,// 操作按钮控制
+      chooseObj: {}, //当前选中的数据，查询按钮用
+      chooseTip: '',// 当前选中数据的唯一值，显示红框
+      autoScheduling: false // 只有在当前日期后的月份才生效
     };
   },
   created() {
+    this.startDay = new Date()
+    // 设置按钮是否置灰
+    this.settingBtn()
+    this.getTeamList()
+    this.toggleMonth()
     this.getList()
   },
   methods: {
-    getList() {},
-    toUpperLower() {
-      this.upperLowerVisible = true
-      this.$nextTick(() => {
-        this.$refs.upperLowerParam.init()
+    // 切换月份
+    selectMonth() {
+      if (this.startDay) {
+        this.settingBtn() // 设置按钮状态,需在getlist前面
+        this.toggleMonth()
+        this.getList()
+        this.clearChoose()
+        if ( moment(this.startDay).valueOf() > moment().endOf('month').valueOf()) {
+          this.autoScheduling = true
+        } else {
+          this.autoScheduling = false
+        }
+      }
+    },
+    // 获取班组列表
+    getTeamList() {
+      listEnabled().then(res => {
+        this.teamList = res.data || []
+      })
+    },
+    // 获取日历数据
+    getList() {
+      let year = moment(this.startDay).format('YYYY')
+      let month = moment(this.startDay).format('M')
+      getPreset({
+        year: year,
+        month: month
+      }).then(res => {
+        let obj = res.data || {}
+        if (obj) {
+          for (let item in obj) {
+            for (let i = 0; i < obj[item].length; i++) {
+              if (!obj[item][i].teamId) {
+                obj[item][i].teamId = ''
+              }
+            }
+          }
+        }
+        this.list = obj
+      }).catch(() => {
+        this.list = {}
+        this.settingBtnDis = true // 禁用设置按钮
+      })
+    },
+    // 设置
+    settingMsg() {
+      this.showSetting = !this.showSetting
+      this.clearChoose()
+    },
+    // 取消
+    cancelSetting() {
+      this.showSetting = !this.showSetting
+      this.getList() // 数据还原
+    },
+    // 确认
+    confirmSetting() {
+      let num = 0
+      // 当月数据的话，今天及今天之前的不传
+      if (moment(this.startDay).format('YYYY-MM') === moment().format('YYYY-MM')) {
+        num = Number(moment().format('DD'))
+      } else {
+        num = 0
+      }
+      // 下月数据全部都传
+      // 打平数据
+      let tempArr = Object.values(this.list)
+      let arr = []
+      for (let i = num; i < tempArr.length; i++) {
+        for (let j = 0; j < tempArr[i].length; j++) {
+          arr.push(tempArr[i][j])
+        }
+      }
+      createOrUpdateList(arr).then(res => {
+        if (res.code === 0) {
+          this.showSetting = !this.showSetting
+          this.$modal.msgSuccess("操作成功")
+          this.getList() // 数据更新
+        }
       })
+    },
+    // 点击班次红框选中当前数据
+    chooseTeam(value) {
+      if (this.showSetting) {
+        this.$modal.msgWarning("当前处于设置模式")
+        return false
+      }
+      this.chooseObj = value
+      this.chooseTip = value.startDay + value.classesId // 匹配当前的样式
+      this.jumpDisabled = false //查询按钮不禁用
+    },
+    // 自动排班
+    schedulingBtn() {
+      let tempData = this.list
+      // 次月1号有值前端排班
+      if (this.list[1][0].teamId) {
+        let tempArr = Object.values(this.list)
+        let arr = []
+        let n = 0
+        for (let i = 0; i < tempArr.length; i++) {
+          if (n > 0) {
+            break;
+          }
+          for (let j = 0; j < tempArr[i].length; j++) {
+            if (tempArr[i][j].teamId) {
+              arr.push(tempArr[i][j].teamId)
+            } else {
+              n++
+            }
+          }
+        }
+        let tempNum = 0
+        for (let k = 0; k < tempArr.length; k++) {
+          for (let v = 0; v < tempArr[k].length; v++) {
+            let t = tempNum % arr.length
+            if (arr.length === 1) {
+              tempData[k+1][v].teamId = arr[0]
+            } else {
+              tempData[k+1][v].teamId = arr[t]
+            }
+            tempNum++
+          }
+        }
+        this.list = []
+        this.list = tempData
+      } else {
+        // 次月1号没有值,接口排班
+        autoSet().then(res => {
+          this.list = res.data || {}
+        })
+      }
+    },
+    // 设置按钮如果是上个月或者今天是本月最后一天，设置按钮置灰
+    settingBtn() {
+      let nowMonth = moment().startOf('month').valueOf()
+      let startMonth = moment(this.startDay).valueOf()
+      let nowDate = moment(new Date()).date()
+      let sumDate = moment().daysInMonth()
+      if (nowMonth > startMonth) { // 之前月
+        this.settingBtnDis = true
+      } else {
+        if (nowDate < sumDate) {
+          this.settingBtnDis = false
+        } else {
+          this.settingBtnDis = true
+        }
+      }
+    },
+    // 清除红框选中数据
+    clearChoose() {
+      this.chooseObj = {}
+      this.chooseTip = ""
+      this.jumpDisabled = true
+    },
+    // 切换月份显示
+    toggleMonth() {
+      this.year = moment(this.startDay).format("YYYY")
+      let month = Number(moment(this.startDay).format("MM"))
+      this.month = this.monthList[month - 1]
+    },
+    // 3个跳转按钮
+    toOtherPage(val) {
+      switch (val) {
+        case '1':
+          this.$router.push({
+            // path: '/core/monitoring/production-line-data',
+            name: 'ProductionLineData',
+            params: { startTime: this.chooseObj.startTime, endTime: this.chooseObj.endTime }
+          })
+          break;
+        case '2': // 能源
+          this.$router.push({
+            name: 'EnergyReportSearch',
+            params: { startTime: this.chooseObj.startTime, endTime: this.chooseObj.endTime }
+          })
+          break;
+        default:
+          this.$router.push({
+            // path: '/quality/monitoring/quality-statistics',
+            name: 'QualityStatistics',
+            params: { startTime: this.chooseObj.startTime, endTime: this.chooseObj.endTime }
+          })
+      }
+    }
     }
   }
-};
 </script>
+<style lang='scss'>
+.groupTeamScheduling {
+  background-color: #F2F4F9;
+  .operationArea {
+    padding: 14px 10px 0 16px;
+    margin-bottom: 8px;
+    background-color: #fff;
+    border-radius: 8px;
+    .blue-block {
+      display: inline-block;
+      width: 4px;
+      height: 16px;
+      background-color: #0B58FF;
+      border-radius: 1px;
+      margin-right: 8px;
+      margin-top: 10px;
+    }
+    .separateStyle {
+      display: inline-block;
+      width: 1px;
+      height: 24px;
+      background: #E8E8E8;
+      vertical-align: middle;
+    }
+    .el-form-item {
+      margin-bottom: 10px;
+    }
+    .rightItem {
+      float: right;
+    }
+  }
+  // 日历
+  .calenderArea {
+    padding: 14px 10px 0 20px;
+    background-color: #fff;
+    border-radius: 8px;
+    .el-calendar__body {
+      padding: 10px 16px 16px 0;
+    }
+    .el-calendar__header {
+      display: none;
+    }
+    .el-calendar-table > thead {
+      height: 48px;
+      font-size: 20px;
+      font-weight: 500;
+      color: #000000;
+      background-color: rgba(242, 244, 249, 1);
+    }
+    .el-calendar-table__row {
+      height: 133px;
+      .prev, .next {
+        pointer-events: none;
+      }
+      .el-calendar-day {
+        padding: 0 10px;
+        height: 100%;
+        .dateStyle {
+          font-size: 20px;
+          font-weight: 500;
+          color: #000000;
+          text-align: right;
+          height: 32px;
+          line-height: 28px;
+          padding-right: 10px;
+        }
+      }
+    }
+    .team-active {// 选中班组
+      border:2px solid red
+    }
+    .class1, .class2, .class3 {
+      padding: 0;
+      font-weight: 600;
+      margin-bottom: 2px;
+      .selectDiv {
+        position: relative;
+        .toggle-icon {
+          position: absolute;
+          width: 26px;
+          height: 26px;
+          line-height: 26px;
+          font-size: 14px;
+          z-index: 1;
+          text-align: center;
+        }
+        .toggle-icon-hide {
+          position: absolute;
+          width: 2px;
+          height: 28px;
+          z-index: 1;
+        }
+        .el-input__suffix {
+          display: none;
+        }
+        .el-input--suffix .el-input__inner {
+          padding: 0 4px 0 28px;
+        }
+        .el-input--small .el-input__inner {
+          height: 28px;
+          border: none;
+          font-weight: 600;
+        }
+      }
+      .labelClass {
+        width: 100%;
+        height: 28px;
+        border: none;
+        padding: 0;
+        font-weight: 600;
+        text-align: center;
+      }
+    }
+    .class1 {
+      .selectDiv {
+        .toggle-icon, .toggle-icon-hide {
+          background-color: #FACE00;
+        }
+        .el-input--small .el-input__inner {
+          color: #E7A200;
+          background-color: #FFEFC0;
+        }
+      }
+      .labelClass {
+        color: #E7A200;
+        background-color: #FFEFC0;
+      }
+    }
+    .class2 {
+      .selectDiv {
+        .toggle-icon, .toggle-icon-hide {
+          background-color: #3984FF;
+        }
+        .el-input--small .el-input__inner {
+          color: #2D7BFF;
+          background-color: #BEEAFF;
+        }
+      }
+      .labelClass {
+        color: #2D7BFF;
+        background-color: #BEEAFF;
+      }
+    }
+    .class3 {
+      .selectDiv {
+        .toggle-icon, .toggle-icon-hide {
+          background-color: #37D97F;
+        }
+        .el-input--small .el-input__inner {
+          color: #129F51;
+          background-color: #E0FFEE;
+        }
+      }
+      .labelClass {
+        color: #129F51;
+        background-color: #E0FFEE;
+      }
+    }
+  }
+}
+</style>