作息界面调整

src/components/dateTime/daterange.picker.vue

@@ -1,6 +1,6 @@
 <template>
   <el-date-picker
-    v-model="value"
+    v-model="values"
     type="daterange"
     :clearable="clearable"
     :picker-options="pickerOptions"
@@ -22,6 +22,7 @@ export default {
     let data= {
       start_placeHolder: this.startPlaceholder,
       end_placeHolder: this.endPlaceholder,
+      values:null,
     };
     return data;
   },
@@ -86,7 +87,7 @@ export default {
             this.end_placeHolder = this.endPlaceholder;
             return;
           }
-          
+
           if (param.minDate) {
             // debugger
             this.start_placeHolder = dayjs(param.minDate).format("YYYY-MM-DD");
@@ -98,7 +99,16 @@ export default {
       };
     },
   },
-  watch: {},
+  watch: {
+    value: {
+      handler(v) {
+        if (v && v.length > 0) {
+          this.values = v;
+        }
+      },
+      immediate: true,
+    },
+  },
   props: {
     value: {},
     clearable: {
@@ -124,6 +134,10 @@ export default {
     },
   },
   mounted() {},
+  mode:{
+    props: 'value',
+    event: 'input'
+  }
 };
 </script>
 <style lang="scss" scoped>

src/views/login.vue

@@ -164,7 +164,7 @@ export default {
 };
 </script>
 
-<style rel="stylesheet/scss" lang="scss">
+<style lang="scss">
 .login {
   display: flex;
   justify-content: right;
@@ -173,6 +173,10 @@ export default {
   background: rgba(0, 140, 214, 1) url("../assets/images/login-background.png") no-repeat;
   background-size: cover;
   position: relative;
+  .el-checkbox__inner::after{
+    height: 9px;
+    left:5px;
+  }
 }
 .color-model{
   width: 100%;

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

@@ -0,0 +1,259 @@
+<template>
+  <div class="question-infos">
+    <DialogCom :title="title" @close="handleClose" :visible="show" width="800px"  append-to-body>
+      <div class="page-body">
+        <el-form :model="formData" :disabled="title === '查看详情'" :rules="formData.isEnable?formDataRules:{}" size="small" ref="form" label-position="right"
+                 label-width="120px" label-prefix=":">
+          <el-row :gutter="20">
+            <el-col :span="24">
+              <el-form-item prop="orgName" label="机构：" >
+                <span>{{formData.orgName}}</span>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="日期：">
+                <span >{{formData.ymdDate}}</span>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="星期：">
+                <span>{{parseTime(formData.ymdDate,"dddd")}}</span>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item prop="isEnable" label="状态：">
+                <template >
+                  <el-radio-group v-model="formData.isEnable" @change="onEnableChange(formData)">
+                    <el-radio text-color="#48bb78" label="1">营业</el-radio>
+                    <el-radio text-color="#f56565" label="0">歇业</el-radio>
+                  </el-radio-group>
+                </template>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item prop="isEnable" label="值班打卡：">
+                <template >
+                  <el-radio-group v-model="formData.isDuty">
+                    <el-radio text-color="#48bb78" label="1">是</el-radio>
+                    <el-radio text-color="#f56565" label="0">否</el-radio>
+                  </el-radio-group>
+                </template>
+              </el-form-item>
+            </el-col>
+            <el-col v-if="formData.isEnable == '1'" :span="12">
+              <el-form-item prop="workTime" label="上班时间：">
+                <template >
+                  <el-time-select
+                    :picker-options="pickerOptions"
+                    v-model="formData.workTime"/>
+                </template>
+              </el-form-item>
+            </el-col>
+            <el-col v-if="formData.isEnable == '1'" :span="12">
+              <el-form-item prop="workOffTime" label="下班时间：">
+                <template >
+                  <el-time-select
+                    :picker-options="pickerOptions"
+                    v-model="formData.workOffTime"/>
+                </template>
+              </el-form-item>
+            </el-col>
+            <!--              <el-col :span="12">-->
+
+            <!--              <el-form-item prop="noonbreakStart" label="午休开始：">-->
+            <!--                <template>-->
+            <!--                  <el-time-select-->
+            <!--                      :picker-options="pickerOptions"-->
+            <!--                      v-model="formData.noonbreakStart"-->
+            <!--                      :disabled="!formData.isEnable || formData.isEnable === false"/>-->
+            <!--                </template>-->
+            <!--              </el-form-item>-->
+            <!--              </el-col>-->
+            <!--            <el-col :span="12">-->
+            <!--              <el-form-item prop="noonbreakEnd" label="午休结束：">-->
+            <!--                <template >-->
+            <!--                  <el-time-select-->
+            <!--                      :picker-options="pickerOptions"-->
+            <!--                      v-model="formData.noonbreakEnd"-->
+            <!--                      :disabled="!formData.isEnable || formData.isEnable === false"/>-->
+            <!--                </template>-->
+            <!--              </el-form-item>-->
+            <!--            </el-col>-->
+            <el-col v-if="formData.isEnable == '1'" :span="12">
+              <el-form-item prop="openTime" label="营业开始：">
+                <template >
+                  <el-time-select
+                    :picker-options="pickerOptions"
+                    v-model="formData.openTime"/>
+                </template>
+              </el-form-item>
+            </el-col>
+            <el-col v-if="formData.isEnable == '1'" :span="12">
+              <el-form-item prop="closeTime" label="营业结束：">
+                <template >
+                  <el-time-select
+                    :picker-options="pickerOptions"
+                    v-model="formData.closeTime"/>
+                </template>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+      </div>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="onSubmit">确定</el-button>
+        <el-button @click="handleClose">取消</el-button>
+      </div>
+    </DialogCom>
+  </div>
+</template>
+
+<script>
+
+
+import {queryOrgInfo,editWorkTime} from "@/views/system/workTimeSet/api";
+import {timeCheck }from '@/utils/ruoyi'
+export default {
+  data() {
+    return {
+      //弹窗展示
+      show:false,
+      title:null,
+      //选中的id
+      id: null,
+      //form数据
+      formData: {},
+      workTimeId:null,
+      //表单验证
+      formDataRules: {
+        isEnable: [{ required: true, message: "请选择状态" }],
+        workTime: [{ required: true, message: "请输入上班时间" }],
+        workOffTime: [{ required: true, message: "请输入下班时间" }],
+        // noonbreakStart: [{ required: true, message: "请输入午休开始时间" }],
+        // noonbreakEnd: [{ required: true, message: "请输入午休结束时间" }],
+        openTime: [{ required: true, message: "请输入营业开始时间" }],
+        closeTime: [{ required: true, message: "请输入营业结束时间" }],
+      },
+
+    };
+  },
+  created() {
+  },
+  computed: {
+    pickerOptions() {
+      return {
+        start: "00:00",
+        end: "24:00",
+        step: "00:05",
+      };
+    },
+  },
+  methods: {
+    detail(row){
+      this.orgId = row.id;
+      this.title='查看详情';
+      queryOrgInfo(row.id).then(res=>{
+        this.formData = res.data;
+        this.show = true;
+      })
+      console.log(row,'11111')
+    },
+    edit(row){
+      this.orgId = row.id;
+      this.title='编辑作息';
+      queryOrgInfo(row.id).then(res=>{
+        this.formData = res.data;
+        this.show = true;
+      })
+      console.log(row,'11111')
+    },
+    reset() {
+      return {
+        isEnable: 1,
+        openTime: null,
+        closeTime: null,
+        // noonbreakStart: null,
+        // noonbreakEnd: null,
+        workTime: null,
+        workOffTime: null,
+      };
+    },
+    onEnableChange(workTime) {
+      if (workTime.isEnable == '0') {
+        workTime.openTime = null;
+        workTime.closeTime = null;
+        // workTime.noonbreakStart = null;
+        // workTime.noonbreakEnd = null;
+        workTime.workTime = null;
+        workTime.workOffTime = null;
+      }
+    },
+    handleClose() {
+      this.show = false;
+      this.formData = this.reset();
+      console.log(this.$refs.form,'from')
+      this.$refs.form.clearValidate();
+      this.id=null;
+    },
+    onSubmit() {
+      this.$refs.form.validate((isValidate) => {
+        if (!isValidate) return;
+        // if (
+        //     !timeCheck([
+        //       this.formData.openTime,
+        //       this.formData.closeTime,
+        //     ])
+        // ) {
+        //   this.$message.warning(`营业开始时间应在营业结束之前`);
+        //   return false;
+        // }
+        // if (
+        //   !timeCheck([
+        //     this.formData.workTime,
+        //     this.formData.workOffTime,
+        //   ])
+        // ) {
+        //   this.$message.warning(`上班开始时间应在下班结束之前`);
+        //   return false;
+        // }
+        if (
+          !timeCheck([
+            this.formData.workTime,
+            this.formData.openTime,
+            this.formData.closeTime,
+            this.formData.workOffTime,
+          ])
+        ) {
+          this.$message.error(
+            `请按照（上班时间<营业时间<营业结束<下班时间）顺序配置`
+          );
+          return false;
+        }
+        editWorkTime(this.formData).then(res=>{
+          this.show = false;
+          this.$message.success('操作成功')
+          this.$emit('ok')
+        })
+      });
+    },
+  },
+};
+</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.edit.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="question-infos">
-    <DialogCom title="编辑作息" @close="handleClose" :visible="show" width="800px"  append-to-body>
+    <DialogCom :title="title" @close="handleClose" :visible="show" width="800px"  append-to-body>
       <div class="page-body">
-        <el-form :model="formData" :rules="formData.isEnable?formDataRules:{}" size="small" ref="form" label-position="right"
+        <el-form :model="formData" :disabled="title === '查看详情'" :rules="formData.isEnable?formDataRules:{}" size="small" ref="form" label-position="right"
                  label-width="120px" label-prefix=":">
           <el-row :gutter="20">
             <el-col :span="24">
@@ -119,6 +119,7 @@ export default {
     return {
       //弹窗展示
       show:false,
+      title:null,
       //选中的id
       id: null,
       //form数据
@@ -149,8 +150,18 @@ export default {
     },
   },
   methods: {
+    detail(row){
+      this.orgId = row.id;
+      this.title='查看详情';
+      queryOrgInfo(row.id).then(res=>{
+        this.formData = res.data;
+        this.show = true;
+      })
+      console.log(row,'11111')
+    },
     edit(row){
       this.orgId = row.id;
+      this.title='编辑作息';
       queryOrgInfo(row.id).then(res=>{
         this.formData = res.data;
         this.show = true;

src/views/system/workTimeSet/workTime.vue

@@ -31,7 +31,7 @@
                   ref="orgTree"
                 ></org-tree>
               </el-form-item>
-              <el-form-item label="起止日期">
+              <el-form-item label="日期范围">
                 <DataRangePicker
                   v-model="queryParams.range"
                   key="daterange"
@@ -105,7 +105,7 @@
             </el-row>
           </div>
           <el-table
-            height="595"
+            height="597"
             size="small"
             v-loading="loading"
             border
@@ -169,6 +169,12 @@
               <template slot-scope="r">
                 <el-button
                   size="mini"
+                  icon="el-icon-document"
+                  type="text"
+                  @click="showDetail(r.row)"
+                >查看</el-button>
+                <el-button
+                  size="mini"
                   icon="el-icon-edit-outline"
                   type="text"
                   v-if="hideEdit(r.row)"
@@ -181,7 +187,6 @@
           </el-table>
           <pagination
             class="pages-box"
-            v-show="total > 0"
             :total="total"
             :page.sync="queryParams.pageNum"
             :limit.sync="queryParams.pageSize"
@@ -339,6 +344,10 @@ export default {
     clickAdd() {
       this.$refs.modalAdd.add();
     },
+    showDetail(row){
+      this.selectRow = row;
+      this.$refs.modalEdit.detail(row);
+    },
     /** 编辑按钮操作 */
     onEditTime(row) {
       this.selectRow = row;

src/views/system/workTimeSet/workTimeWeek.vue

@@ -66,16 +66,16 @@
           <el-table
             v-loading="loading"
             border
-            height="596"
+            height="597"
             size="small"
             :data="tableList">
             <el-table-column label="序号" type="index" align="center" width="70"></el-table-column>
             <el-table-column prop="orgName" align="center" label="机构" :show-overflow-tooltip="true"></el-table-column>
-            <el-table-column prop="effectiveDate" align="center" label="生效日期" ></el-table-column>
-            <el-table-column prop="workDay" align="center" label="工作日"></el-table-column>
-            <el-table-column prop="modifiedName" align="center" label="更新人"></el-table-column>
-            <el-table-column prop="updateTime" align="center" label="更新时间" ></el-table-column>
-            <el-table-column label="操作" header-align="center" align="left" width="100" >
+            <el-table-column prop="effectiveDate" align="center" label="生效日期" width="160"></el-table-column>
+            <el-table-column prop="workDay" align="center" label="工作日" width="240"></el-table-column>
+            <el-table-column prop="modifiedName" align="center" label="更新人" width="160"></el-table-column>
+            <el-table-column prop="updateTime" align="center" label="更新时间" width="180"></el-table-column>
+            <el-table-column label="操作" header-align="center" align="left" width="140" >
               <template slot-scope="r">
                   <el-button size="mini" type="text" v-if="r.row.timeCheck===0||r.row.timeCheck===3" @click="onEdit(r.row)">编辑</el-button>
   <!--                <el-button type="text" v-if="r.row.timeCheck===0" @click="onDelete(r.row.id)">删除</el-button>-->
@@ -85,7 +85,6 @@
             </el-table-column>
           </el-table>
           <pagination
-            v-show="total >0"
             :total="total"
             :page.sync="queryParams.pageNum"
             :limit.sync="queryParams.pageSize"
@@ -253,7 +252,7 @@ export default {
       this.queryParams.pageSize=10;
       this.dateRange = [];
       this.queryParams.orgId=this.orgId
-      this.queryParams.checkSub = true;      
+      this.queryParams.checkSub = true;
       this.$refs["orgTree"].setCheckSub(this.queryParams.checkSub)
       this.getList();
     },