添加按指定日期配置作息，取消error模态框展示

package.json

@@ -84,7 +84,7 @@
     "webpack": "^5.88.2"
   },
   "engines": {
-    "node": ">=8.9",
+    "node": ">= 10.0",
     "npm": ">= 3.0.0"
   },
   "browserslist": [

src/components/orgTreeSelect/index.vue

@@ -4,7 +4,15 @@
       placement="bottom-start"
       v-model="visible">
 
+      <!--  选中的值  -->
+      <div slot="reference" class="tags-box">
+        <i v-if="sNodeList.length > 0" class="el-icon-circle-close close-icon" @click="clickClear"></i>
+        <el-tag type="success" v-for="v in sNodeList" :key="v.id">{{v.name}}</el-tag>
+      </div>
+
+      <!--  文本框    -->
       <el-input style="width: 100%;margin-bottom: 20px;" v-model="queryForm.value" placeholder="请输入过滤值" clearable></el-input>
+      <!--  下拉框   -->
       <el-row :gutter="20" type="flex" align="middle">
         <el-col :span="14" :xs="24">
           <el-select  v-model="queryForm.type" placeholder="请选择过滤机构类型" clearable>
@@ -17,10 +25,10 @@
           </el-select>
         </el-col>
         <el-col :span="10" :xs="24" >
-          <el-checkbox v-model="isIncludeSub">按过滤机构类型勾选</el-checkbox>
+          <el-checkbox v-model="checked">按过滤机构类型勾选</el-checkbox>
         </el-col>
       </el-row>
-
+      <!--  机构树   -->
       <div class="tree-box">
         <el-tree
           ref="tree"
@@ -29,7 +37,6 @@
           node-key="id"
           show-checkbox
           check-strictly
-          :default-expand-all="showAll"
           :expand-on-click-node="false"
           :default-checked-keys="defaultNode"
           @node-click="handleNodeClick"
@@ -37,33 +44,37 @@
           :filter-node-method="filterNode">
         </el-tree>
       </div>
-
-
-      <!--  选中的值  -->
-      <div slot="reference" class="tags-box"></div>
   </el-popover>
 </template>
 
 <script>
-import {deptTreeSelect} from "@/api/system/user";
+import {deptTreeSelect} from "@/api/system/public";
 
 export default {
   dicts:['org_type_number'],
   data (){
     return {
+      //清除图标
+      showClearable:false,
+      //弹窗显示
       visible:false,
+      //结构树
       orgTree:null,
+      //自定义字段
       props: {
         label: 'name',
       },
+      //过滤条件
       queryForm:{
         value:null,
         type:null,
       },
-      isIncludeSub:false,
+      //受否全选
+      checked:false,
+      //默认展示的node
       defaultNode:[],
-      selectNode:[],
-      showAll:false
+      //已选中的node
+      sNodeList:[],
     }
   },
   mounted(){
@@ -78,6 +89,12 @@ export default {
     },
   },
   methods:{
+    clickClear(){
+      this.sNodeList = [];
+      this.$refs.tree.setCheckedKeys([]);
+      this.$refs.tree.setCurrentKey(null);
+      this.$emit("selectNode", JSON.stringify(this.sNodeList));
+    },
     /** 查询机构树 */
     getDeptTree() {
       deptTreeSelect().then(response => {
@@ -94,15 +111,13 @@ export default {
       if (this.queryForm.type) {
         return data.type == this.queryForm.type;
       }
-      console.log('ttttt')
-      this.showAll = false;
       return true
     },
     handleNodeClick(){
 
     },
     onCheck(data, checked, tree) {
-        if (this.queryForm.type && this.isIncludeSub) {
+        if (this.queryForm.type && this.checked) {
           let subOrgIds = [];
           let currentCheckedIndex = checked.checkedKeys.findIndex(
             (x) => {
@@ -126,8 +141,8 @@ export default {
           console.log(checked,'checked')
           this.$refs.tree.setCheckedKeys(checked.checkedKeys);
       }
-      const dataList = this.$refs.tree.getCheckedNodes();
-      this.$emit("selectNode", JSON.stringify(dataList));
+      this.sNodeList = this.$refs.tree.getCheckedNodes();
+      this.$emit("selectNode", JSON.stringify(this.sNodeList));
     },
     getSubOrgIdsByOrgType(topOrg, orgType, orgIdList) {
         if (!topOrg) return;
@@ -149,12 +164,29 @@ export default {
     border: 1px solid #DCDFE6;
     box-sizing: border-box;
     color: #606266;
-    display: inline-block;
     outline: 0;
-    padding: 0 15px;
+    padding: 0 5px;
     width: 100%;
-    height: 36px;
-    line-height: 36px;
+    min-height: 40px;
+    display: flex;
+    flex-wrap: wrap;
+    position: relative;
+    >span{
+      margin: 5px;
+    }
+    &:hover{
+      .close-icon{
+        display: block;
+        color: #666;
+      }
+    }
+    .close-icon{
+      position: absolute;
+      top:30%;
+      right: 10px;
+      display: none;
+      cursor: pointer;
+    }
   }
   .tree-box{
     margin-top: 20px;

src/utils/request.js

@@ -1,7 +1,7 @@
 import axios from 'axios'
 import { Notification, MessageBox, Message, Loading } from 'element-ui'
 import store from '@/store'
-import { getToken } from '@/utils/auth'
+import {getToken, removeSession} from '@/utils/auth'
 import errorCode from '@/utils/errorCode'
 import { tansParams, blobValidate } from "@/utils/ruoyi";
 import cache from '@/plugins/cache'
@@ -85,19 +85,21 @@ let success = res => {
       MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
         isRelogin.show = false;
         store.dispatch('LogOut').then(() => {
+          removeSession();
           location.href = '/index';
         })
       }).catch(() => {
         isRelogin.show = false;
       });
     }
-    return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
+    Message({ message: msg, type: 'error' }) ()
+    return  Promise.reject('error')
   } else if (code === 500) {
     Message({ message: msg, type: 'error' })
-    return Promise.reject(new Error(msg))
+    return  Promise.reject('error')
   } else if (code === 601) {
     Message({ message: msg, type: 'warning' })
-    return Promise.reject('error')
+    return  Promise.reject('error')
   } else if (code !== 200) {
     Notification.error({ title: msg })
     return Promise.reject('error')

src/views/system/workTimeSet/dialog.add.vue

@@ -0,0 +1,321 @@
+<template>
+  <div class="question-infos">
+    <el-dialog title="新增作息" @close="handleClose" :visible.sync="isShow" :close-on-click-modal="false"
+      custom-class="gxDialog" width="75%" append-to-body>
+<!--      <div class="p-5 work-time">-->
+        <el-form label-width="90px" label-suffix=":" label-position="right">
+
+          <el-form-item label="分配机构">
+            <org-tree-select @selectNode="queryNode"></org-tree-select>
+          </el-form-item >
+          <el-form-item label="调整日期">
+            <el-button type="primary" @click="addData()">新增日期</el-button>
+          </el-form-item>
+          <!--  -->
+          <el-form-item label="作息规则">
+            <el-table class="w-auto" height="250" border :data="workTimeList">
+              <el-table-column label="日期" width="180px">
+                <template slot-scope="r">
+                  <el-date-picker  v-model="r.row.date" :clearable=false popper-class="no-atTheMoment" :picker-options="startDatepickerOptions" type="date" placeholder="请选择日期">
+                  </el-date-picker>
+                </template>
+              </el-table-column>
+              <el-table-column label="星期" width="60px">
+                <template slot-scope="r">
+                  <span>{{ r.row.date | dateTime("dddd") }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="状态" width="180px">
+                <template slot-scope="r">
+                  <el-radio-group
+                      :disabled="r.row.disabled"
+                      v-model="r.row.isEnable"
+                      @change="onEnableChange(r.row)"
+                  >
+                    <el-radio text-color="#48bb78" :label="true">营业</el-radio>
+                    <el-radio text-color="#f56565" :label="false">歇业</el-radio>
+                  </el-radio-group>
+                </template>
+              </el-table-column>
+              <el-table-column label="上班时间">
+                <template slot-scope="r">
+                  <el-time-select
+                      :picker-options="pickerOptions"
+                      :disabled="r.row.disabled || r.row.isEnable === false"
+                      v-model="r.row.workTime"/>
+                </template>
+              </el-table-column>
+              <el-table-column label="营业时间">
+                <template slot-scope="r">
+                  <el-time-select
+                      :picker-options="pickerOptions"
+                      :disabled="r.row.disabled || r.row.isEnable === false"
+                      v-model="r.row.openTime"
+                  />
+                </template>
+              </el-table-column>
+              <el-table-column label="午休开始">
+                <template slot-scope="r">
+                  <el-time-select
+                      :picker-options="pickerOptions"
+                      :disabled="r.row.disabled || r.row.isEnable === false"
+                      v-model="r.row.noonbreakStart"
+                  />
+                </template>
+              </el-table-column>
+              <el-table-column label="午休结束">
+                <template slot-scope="r">
+                  <el-time-select
+                      :picker-options="pickerOptions"
+                      :disabled="r.row.disabled || r.row.isEnable === false"
+                      v-model="r.row.noonbreakEnd"
+                  />
+                </template>
+              </el-table-column>
+              <el-table-column label="营业终了">
+                <template slot-scope="r">
+                  <el-time-select
+                      :picker-options="pickerOptions"
+                      :disabled="r.row.disabled || r.row.isEnable === false"
+                      v-model="r.row.closeTime"
+                  />
+                </template>
+              </el-table-column>
+              <el-table-column label="下班时间">
+                <template slot-scope="r">
+                  <el-time-select
+                      :picker-options="pickerOptions"
+                      :disabled="r.row.disabled || r.row.isEnable === false"
+                      v-model="r.row.workOffTime"
+                  />
+                </template>
+              </el-table-column>
+              <el-table-column label="操作列表">
+                <template slot-scope="r">
+                  <k-btn-tip type="text" @click="deleteData(r.row,r.$index)"
+                  >删除</k-btn-tip>
+                  <el-button type="text" @click="coppy(r.$index)"
+                  >复制至全部</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-form-item>
+        </el-form>
+<!--      </div>-->
+
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="onHide">取消</el-button>
+        <btn-tip tip="确定要提交吗?" type="primary" @click="onSubmit">保存</btn-tip>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+
+import OrgTreeSelect from '@/components/orgTreeSelect'
+import BtnTip from "@/components/btnTip";
+import dayjs from "dayjs";
+import { timeCheck } from "@/utils/ruoyi";
+
+
+export default {
+  components:{OrgTreeSelect,BtnTip},
+  data() {
+    let { params, query } = this.$route;
+    return {
+      selectTreeStrictly: true,
+      isShow: false,
+      workTimeList: [],
+      data: {
+        orgIdList:  [],
+      },
+      startDatepickerOptions: {
+        disabledDate(time) {
+          const date = new Date();
+          date.setTime(date.getTime()- 3600 * 1000 * 24 );
+          return time.getTime() < date;
+        },
+      },
+    };
+  },
+  props: {},
+  watch: {
+
+  },
+  computed: {
+    //...mapState([]),
+    pickerOptions() {
+      // const now = new Date();
+      return {
+        start: "00:00",
+        end: "24:00",
+        step: "00:10",
+      };
+    },
+  },
+  methods: {
+    queryNode(){
+
+    },
+    add(){
+      this.isShow = true;
+    },
+    async refresh() {
+    },
+    reset() {
+      return {
+        workTimeList:[]
+      };
+    },
+    addData(){
+      //获取workTimeList最后一条数据
+      let workTime = {
+        isEnable: true,
+        workTime: '07:00',
+        openTime: '09:00',
+        noonbreakStart: null,
+        noonbreakEnd: null,
+        closeTime: '17:00',
+        workOffTime: '20:00',
+        date: new Date(),
+        disabled: false,
+      };
+      if(this.workTimeList.length>0){
+        if(this.workTimeList[this.workTimeList.length-1].date!=null){
+          workTime.date = dayjs(this.workTimeList[this.workTimeList.length-1].date).add(1,'day').toDate();
+        }
+      }
+      this.workTimeList.push(workTime);
+      console.log("addData",this.workTimeList);
+    },
+    coppy(index){
+      let workTime = this.workTimeList[index];
+      for(let i=0;i<this.workTimeList.length;i++){
+        this.workTimeList[i].isEnable = workTime.isEnable;
+        this.workTimeList[i].workTime = workTime.workTime;
+        this.workTimeList[i].openTime = workTime.openTime;
+        this.workTimeList[i].noonbreakStart = workTime.noonbreakStart;
+        this.workTimeList[i].noonbreakEnd = workTime.noonbreakEnd;
+        this.workTimeList[i].closeTime = workTime.closeTime;
+        this.workTimeList[i].workOffTime = workTime.workOffTime;
+      }
+    },
+    deleteData(row,index){
+      console.log(index);
+      this.workTimeList.splice(index,1);
+    },
+    //
+    check(other) {
+      if(other.date == null){
+        this.onError(`日期不能为空`);
+        return false;
+      }
+      const ds = this.$date(other.date).format("YYYY-MM-DD");
+      if (!other.disabled && other.isEnable == null) {
+        this.onError(`${ds}未进行配置`);
+        return false;
+      }
+      if (other.isEnable) {
+        if (
+            !(
+                other.workTime &&
+                other.openTime &&
+                other.closeTime &&
+                other.workOffTime
+            )
+        ) {
+          this.onError(`${ds}未配置时间`);
+          return;
+        }
+        if (!other.noonbreakStart ^ !other.noonbreakEnd) {
+          this.onError(`午休开始及结束时间必须同时配置`);
+          return;
+        }
+
+        if (
+            !timeCheck([
+              other.workTime,
+              other.openTime,
+              other.noonbreakStart,
+              other.noonbreakEnd,
+              other.closeTime,
+              other.workOffTime,
+            ])
+        ) {
+          this.onError(
+              `${ds}上班时间<=营业时间<=午休开始<=午休结束<=营业终了<=下班时间`
+          );
+          return false;
+        }
+      }
+      return true;
+    },
+    onHide() {
+      this.isShow = false;
+      this.workTimeList = [];
+      this.data.orgIdList=[];
+    },
+    handleClose() {
+      this.isShow = false;
+      this.workTimeList = [];
+      this.data.orgIdList=[];
+    },
+    onEnableChange(workTime) {
+      if (workTime.isEnable === false) {
+        workTime.openTime = null;
+        workTime.closeTime = null;
+        workTime.noonbreakStart = null;
+        workTime.noonbreakEnd = null;
+        workTime.workTime = null;
+        workTime.workOffTime = null;
+      }
+    },
+    async onSubmit() {
+      //判断是否有重复的日期
+      let dateList = [];
+      for (let workTime of this.workTimeList) {
+        if (workTime.date) {
+          let date = this.$date(workTime.date).format("YYYY-MM-DD");
+          if (dateList.indexOf(date) > -1) {
+            this.onError(`日期${date}重复`);
+            return;
+          }
+          dateList.push(date);
+        }
+      }
+      // 校验
+      for (let workTime of this.workTimeList) {
+        if (!this.check(workTime)) {
+          return;
+        }
+      }
+      // await this.$api.workTimeMonth.edit({
+      //   ...this.data,
+      //   workTimeList: this.workTimeList,
+      // }).then((v) => {
+      //   this.$emit("success");
+      //   this.onHide();
+      // });
+    },
+    //apimark//
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.question-infos {
+  .el-form {
+    padding-top: 10px;
+
+  }
+}
+
+.el-rate {
+  margin-top: 6px;
+}
+
+.change-icon {
+  font-size: 18px;
+}
+
+</style>

src/views/system/workTimeSet/dialog.template.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="question-infos">
-    <el-dialog :title="id? '编辑作息模版':'新增作息模版'" @close="handleClose" :visible.sync="isShow" :close-on-click-modal="false"
-      custom-class="gxDialog" width="75%" top="10vh" append-to-body>
+    <el-dialog :title="title" @close="handleClose" :visible.sync="isShow" :close-on-click-modal="false"
+      custom-class="gxDialog" width="75%"  append-to-body>
 <!--      <div class="p-5 work-time-modify">-->
         <el-form
             label-width="140px"
@@ -10,32 +10,25 @@
             label-position="left">
           <el-form-item>
             <span slot="label"> <span style="color: red"> * </span>机构 </span>
-            <org-tree-select
-                ref="tree"
-                multiple
-                orgTypeFilter
-                :strictly="true"
-                :active-value="formData.orgIdList"
-                v-model="data.orgIdList"
-                :disabled="data.disabled"
-                :clearable="!data.disabled"
-                :style="id? 'background-color: #f5f7fa;color: #c0c4cc;': ''"
-            ></org-tree-select>
+            <org-tree-select @selectNode="queryNode"></org-tree-select>
           </el-form-item>
           <el-form-item >
             <span slot="label"> <span style="color: red"> * </span>生效日期 </span>
-            <el-date-picker  v-model="formData.effectiveDate"  :disabled="data.disabled"
-                             :clearable="!data.disabled" :picker-options="startDatepickerOptions"  popper-class="no-atTheMoment"  type="date" placeholder="请选择日期">
+            <el-date-picker
+              v-model="formData.effectiveDate"
+              :disabled="data.disabled"
+              :clearable="!data.disabled"
+              :picker-options="startDatepickerOptions"
+              popper-class="no-atTheMoment"
+              type="date"
+              placeholder="请选择日期">
             </el-date-picker>
           </el-form-item>
-          <div style="color: red">
-            （保存后生成或更新本月或下月生效日期后的每日作息）
-          </div>
           <!--  -->
-          <div class="grid">
-            <div class="title">
-              <span style="color: red"> * </span>作息设置(勾选表示当日正常上班)
-            </div>
+          <div class="grid" >
+            <p>
+              <span style="color: red;"> * </span>作息设置(勾选表示当日正常上班)
+            </p >
             <div class="box">
               <el-table class="w-auto" border :data="formData.dayOfWeeks">
                 <el-table-column label="星期" width="60px" prop="dayOfWeekText">
@@ -111,6 +104,9 @@
             </div>
           </div>
         </el-form>
+      <div style="color: red;font-size: 12px;line-height: 30px;">
+        注：保存后生成或更新本月或下月生效日期后的每日作息
+      </div>
 <!--      </div>-->
       <div slot="footer" class="dialog-footer">
         <el-button @click="onHide">取消</el-button>
@@ -148,16 +144,16 @@
 
 import BtnTip from "@/components/btnTip";
 import OrgTreeSelect from '@/components/orgTreeSelect'
-//import { timeCheck } from "@/util/util";
+import { timeCheck } from "@/utils/ruoyi";
 export default {
   components:{BtnTip,OrgTreeSelect},
   data() {
     let { params, query } = this.$route;
     return {
+      title:'',
       isShow: false,
       id:null,
       orgId:null,
-      orgTree:null,
       formData: {
         orgIdList: [],
         dayOfWeeks: [],
@@ -214,8 +210,17 @@ export default {
   },
   computed: {},
   methods: {
+    queryNode(json){
+      this.nodes = JSON.parse(json);
+      console.log(this.nodes,'nodes')
+    },
+    edit(row){
+      this.title = '编辑作息模版';
+      this.isShow = true;
+      this.formData = row;
+    },
     add(tree){
-      this.orgTree = tree;
+      this.title = '新增作息模版';
       this.isShow = true;
     },
    // ...mapMutations([]),

src/views/system/workTimeSet/index.vue

@@ -8,9 +8,6 @@
       <el-tab-pane v-hasPermi="['system:time:query']" label="按周配置作息" name="按周配置作息">
         <work-time-week ></work-time-week>
       </el-tab-pane>
-      <el-tab-pane label="指定日期配置" name="指定日期配置">
-
-      </el-tab-pane>
     </el-tabs>
 
   </div>

src/views/system/workTimeSet/workTime.vue

@@ -72,6 +72,16 @@
         <el-row :gutter="10" class="mb8">
           <el-col :span="1.5">
             <el-button
+              type="primary"
+              plain
+              size="mini"
+              icon="el-icon-thumb"
+              @click="clickAdd"
+              v-hasPermi="['system:user:add']"
+            >指定日期配置</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button
               type="warning"
               plain
               icon="el-icon-download"
@@ -126,8 +136,10 @@
       </el-col>
     </el-row>
 
-
+    <!--  编辑作息  -->
     <dialog-edit ref="modalEdit" ></dialog-edit>
+    <!--  指定日期配置  -->
+    <dialog-add ref="modalAdd" ></dialog-add>
 
   </div>
 </template>
@@ -135,16 +147,17 @@
 <script>
 import tableList  from '@/mixins/tableList'
 import DialogEdit from './dialog.edit'
+import DialogAdd from './dialog.add'
 import {json} from'./json'
 /** 引入节点树接口*/
-import { deptTreeSelect } from "@/api/system/user";
+import { deptTreeSelect } from "@/api/system/public";
 
 export default {
   /**  得先引入字典才能使用 */
   dicts: ['sys_business_type'],
   /** 引入基础minxins*/
   mixins:[tableList],
-  components: {DialogEdit},
+  components: {DialogEdit,DialogAdd},
   data() {
     //初始化查询日期
     let timea = new Date();
@@ -250,11 +263,14 @@ export default {
       this.queryParams.orgId = data.id;
       this.handleQuery();
     },
+    //添加指定日期作息
+    clickAdd(){
+      this.$refs.modalAdd.add();
+    },
     /** 编辑按钮操作 */
     onEditTime(row) {
       this.selectRow = row;
       this.$refs.modalEdit.edit(row);
-      console.log(this.$refs.modalEdit,'modalEdit');
     },
 
     /** 提交按钮 */

src/views/system/workTimeSet/workTimeWeek.vue

@@ -103,7 +103,7 @@
           </el-table-column>
           <el-table-column v-if="columns[8].visible" label="操作列表" width="100" >
             <template slot-scope="r">
-              <el-button type="text"  v-hasPermi="['system:user:edit']" @click="onEditTime(r.row)">编辑</el-button>
+              <el-button type="text"  v-hasPermi="['system:user:edit']" @click="editTemplate(r.row)">编辑</el-button>
             </template>
           </el-table-column>
         </el-table>
@@ -129,7 +129,7 @@ import tableList  from '@/mixins/tableList'
 import DialogTemplate from './dialog.template'
 import {json} from'./json'
 /** 引入节点树接口*/
-import { deptTreeSelect } from "@/api/system/user";
+import { deptTreeSelect } from "@/api/system/public";
 
 export default {
   /**  得先引入字典才能使用 */
@@ -198,6 +198,12 @@ export default {
     });
   },
   methods: {
+    /** 编辑按钮操作 */
+    editTemplate(row) {
+      this.selectRow = row;
+      this.$refs.modalTemplate.edit(row);
+      console.log(this.$refs.modalEdit,'modalEdit');
+    },
     addTemplate(){
       this.$refs.modalTemplate.add(this.orgTree)
     },
@@ -242,12 +248,6 @@ export default {
       this.queryParams.orgId = data.id;
       this.handleQuery();
     },
-    /** 编辑按钮操作 */
-    onEditTime(row) {
-      this.selectRow = row;
-      this.$refs.modalEdit.edit(row);
-      console.log(this.$refs.modalEdit,'modalEdit');
-    },
 
     /** 提交按钮 */
     submitForm: function() {

vue.config.js

@@ -1,9 +1,7 @@
 'use strict'
 const path = require('path')
 const NodePolyfillPlugin = require('node-polyfill-webpack-plugin')
-configureWebpack: {
 
-}
 
 function resolve(dir) {
   return path.join(__dirname, dir)
@@ -33,9 +31,10 @@ module.exports = {
   productionSourceMap: false,
   // webpack-dev-server 相关配置
   devServer: {
-    historyApiFallback:false,
-    allowedHosts:'all',
     //host: '0.0.0.0',
+    client:{
+      overlay:false
+    },
     port: port,
     open: false,
     proxy: {