zc

src/views/comprehensive/message/noticeconfig/index.vue

@@ -1,28 +1,56 @@
 <template>
   <div class="app-container noticeconfig">
     <div class="title-box">
-      <div class="title-min-box">
+      <div class="title-min-box" :class="buttonType == 1 ? 'check-box' : ''" @click="titleButton(1)">
         <p>检查通知</p>
         <p></p>
       </div>
-      <div class="title-min-box">
+      <div v-if="versionField() != 'xiBeiNongLinDaXue'"
+        class="title-min-box" :class="buttonType == 2 ? 'check-box' : ''" @click="titleButton(2)">
         <p>预案通知</p>
         <p></p>
       </div>
-      <div class="title-min-box">
-        <p>疏散通知</p>
-        <p></p>
-      </div>
     </div>
     <div class="content-box scrollbar-box">
-      <el-form :model="form" ref="form" :inline="true" label-width="120px">
-        <div class="top-title-box">
-          <p>预案通知</p>
-          <p class="inquire-button-one" @click="upData" v-if="form.id" v-hasPermi="['laboratory:noticeconfig:edit']">
-            保存</p>
-          <p class="inquire-button-one" @click="upData" v-if="!form.id" v-hasPermi="['laboratory:noticeconfig:add']">
-            提交</p>
+      <el-form v-if="buttonType == 1" :model="examineForm" ref="examineForm" :inline="true" label-width="120px">
+        <div class="examine-big-box">
+          <div class="examine-div-one">
+            <p>检查任务通知方式：</p>
+            <el-checkbox v-model="examineType" style="margin:1px 0 0 10px;" @change="examineAll">全选</el-checkbox>
+          </div>
+          <div class="examine-div-two">
+            <el-checkbox-group v-model="examineForm.data1" @change="examineChange">
+              <el-checkbox style="margin-right:48px;"
+                v-for="item in examineList" :label="item.key" :key="item.key">{{item.label}}</el-checkbox>
+            </el-checkbox-group>
+          </div>
+        </div>
+        <div class="examine-big-box">
+          <div class="examine-div-one">
+            <p>整改通知方式：</p>
+            <el-checkbox v-model="rectificationType" style="margin:1px 0 0 10px;" @change="rectificationAll">全选</el-checkbox>
+          </div>
+          <div class="examine-div-two">
+            <el-checkbox-group v-model="examineForm.data2" @change="rectificationChange">
+              <el-checkbox style="margin-right:48px;"
+                v-for="item in rectificationList" :label="item.key" :key="item.key">{{item.label}}</el-checkbox>
+            </el-checkbox-group>
+          </div>
         </div>
+        <div class="examine-big-box">
+          <div class="examine-div-one">
+            <p>复核结果通知方式：</p>
+            <el-checkbox v-model="reviewType" style="margin:1px 0 0 10px;" @change="reviewAll">全选</el-checkbox>
+          </div>
+          <div class="examine-div-two">
+            <el-checkbox-group v-model="examineForm.data3" @change="reviewChange">
+              <el-checkbox style="margin-right:48px;"
+                v-for="item in reviewList" :label="item.key" :key="item.key">{{item.label}}</el-checkbox>
+            </el-checkbox-group>
+          </div>
+        </div>
+      </el-form>
+      <el-form v-if="buttonType == 2" :model="form" ref="form" :inline="true" label-width="120px">
         <el-form-item label="广播通知" prop="riskRadio" class="form-item-box">
           <el-input
             style="width:350px;"
@@ -68,59 +96,13 @@
           </el-input>
         </el-form-item>
       </el-form>
-      <el-form :model="form" ref="form" :inline="true" label-width="120px">
-        <div class="top-title-box">
-          <p>疏散通知</p>
-        </div>
-        <el-form-item label="广播通知" prop="exitRadio" class="form-item-box">
-          <el-input
-            style="width:350px;"
-            type="textarea"
-            maxlength="50"
-            :rows="3"
-            resize="none"
-            placeholder="请输入广播通知内容"
-            v-model="form.exitRadio">
-          </el-input>
-        </el-form-item>
-        <el-form-item label="语音播报" prop="exitVoice" class="form-item-box">
-          <el-input
-            style="width:350px;"
-            type="textarea"
-            maxlength="50"
-            :rows="3"
-            resize="none"
-            placeholder="请输入语音播报内容"
-            v-model="form.exitVoice">
-          </el-input>
-        </el-form-item>
-        <el-form-item label="电话通知" prop="exitPhone" class="form-item-box">
-          <el-input
-            style="width:350px;"
-            type="textarea"
-            maxlength="50"
-            :rows="3"
-            resize="none"
-            placeholder="请输入电话通知内容"
-            v-model="form.exitPhone">
-          </el-input>
-        </el-form-item>
-        <el-form-item label="短信提示" prop="exitMessage" class="form-item-box">
-          <el-input
-            style="width:350px;"
-            type="textarea"
-            maxlength="50"
-            :rows="3"
-            resize="none"
-            placeholder="请输入短信提示内容"
-            v-model="form.exitMessage">
-          </el-input>
-        </el-form-item>
-      </el-form>
     </div>
     <div class="button-box">
       <p class="null-p"></p>
-      <p class="inquire-button-one button-p" @click="upData" v-if="!form.id" v-hasPermi="['laboratory:noticeconfig:add']">提交</p>
+      <p class="inquire-button-one button-p" @click="upData" v-if="form.id" v-hasPermi="['laboratory:noticeconfig:edit']">
+        保存</p>
+      <p class="inquire-button-one button-p" @click="upData" v-if="!form.id" v-hasPermi="['laboratory:noticeconfig:add']">
+        提交</p>
       <p class="null-p"></p>
     </div>
   </div>
@@ -133,6 +115,7 @@ export default {
   name: "Noticeconfig",
   data() {
     return {
+      buttonType:1,
       // 遮罩层
       loading: true,
       // 选中数组
@@ -163,23 +146,137 @@ export default {
         exitPhone: null,
         exitMessage: null
       },
+      examineType:false,
+      examineList:[
+        {
+          label:"短信通知",
+          key:"1",
+        },
+        {
+          label:"系统通知",
+          key:"2",
+        },
+        {
+          label:"一体机通知",
+          key:"3",
+        },
+      ],
+      rectificationType:false,
+      rectificationList:[
+        {
+          label:"短信通知",
+          key:"1",
+        },
+        {
+          label:"系统通知",
+          key:"2",
+        },
+        {
+          label:"一体机通知",
+          key:"3",
+        },
+      ],
+      reviewType:false,
+      reviewList:[
+        {
+          label:"短信通知",
+          key:"1",
+        },
+        {
+          label:"系统通知",
+          key:"2",
+        },
+      ],
+      examineForm:{
+        data1:[],
+        data2:[],
+        data3:[],
+      },
     };
   },
   created() {
     this.getList();
   },
   methods: {
+    // 匹配
+    examineAll(item){
+      let self = this;
+      if(item){
+        let list = [];
+        for(let i=0;i<self.examineList.length;i++){
+          list.push(self.examineList[i].key)
+        }
+        this.$set(this.examineForm,'data1',list);
+      }else{
+        this.$set(this.examineForm,'data1',[]);
+      }
+    },
+    examineChange(item){
+      if(item[2]){
+        this.$set(this,'examineType',true);
+      }else{
+        this.$set(this,'examineType',false);
+      }
+    },
+    rectificationAll(item){
+      let self = this;
+      if(item){
+        let list = [];
+        for(let i=0;i<self.rectificationList.length;i++){
+          list.push(self.rectificationList[i].key)
+        }
+        this.$set(this.examineForm,'data2',list);
+      }else{
+        this.$set(this.examineForm,'data2',[]);
+      }
+    },
+    rectificationChange(item){
+      if(item[2]){
+        this.$set(this,'rectificationType',true);
+      }else{
+        this.$set(this,'rectificationType',false);
+      }
+    },
+    reviewAll(item){
+      let self = this;
+      if(item){
+        let list = [];
+        for(let i=0;i<self.reviewList.length;i++){
+          list.push(self.reviewList[i].key)
+        }
+        this.$set(this.examineForm,'data3',list);
+      }else{
+        this.$set(this.examineForm,'data3',[]);
+      }
+    },
+    reviewChange(item){
+      if(item[1]){
+        this.$set(this,'reviewType',true);
+      }else{
+        this.$set(this,'reviewType',false);
+      }
+    },
+    //切换
+    titleButton(type){
+      if(type != this.buttonType){
+        this.$set(this,'buttonType',type)
+      }
+    },
     upData(){
       let self = this;
-      this.$confirm('是否确定提交？', "警告", {
+      this.$confirm('是否确定'+(self.form.id?'保存':'提交')+'？', "警告", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning"
       }).then(function() {
-        if(self.form.id){
-          self.putNoticeconfigInfo();
-        }else{
-          self.postNoticeconfigInfo();
+        if(self.buttonType == 1){
+
+        }else if(self.buttonType == 2){
+          if(self.form.id){
+            self.putNoticeconfigInfo();
+          }else{
+            self.postNoticeconfigInfo();
+          }
         }
       }).then(() => {
 
@@ -308,6 +405,7 @@ export default {
     overflow: hidden;
     *{
       margin:0;
+      font-weight:500;
     }
     .title-box{
       height:80px;
@@ -315,16 +413,33 @@ export default {
       overflow-x:scroll;
       overflow-y:hidden;
       white-space: nowrap;
+      padding:0 40px;
       .title-min-box{
+        cursor: pointer;
         display: inline-block;
         overflow: hidden;
-        height:158px;
-        width:158px;
+        height:80px;
+        width:65px;
+        margin:10px 70px 5px 0;
         p:nth-child(1){
-
+          line-height: 40px;
+          margin-top: 10px;
+          font-size:16px;
+          text-align: center;
         }
         p:nth-child(2){
-
+          width:60px;
+          height:4px;
+          margin:0 auto;
+          border-radius:4px;
+        }
+      }
+      .check-box{
+        p:nth-child(1){
+          color:#0045AF!important;
+        }
+        p:nth-child(2){
+          background: #0045AF!important;
         }
       }
     }
@@ -343,7 +458,27 @@ export default {
     }
     .content-box{
       flex:1;
-      padding:0 20px;
+      padding:40px 46px 0;
+      .examine-big-box{
+        display: inline-block;
+        overflow: hidden;
+        border:1px solid #E0E0E0;
+        border-radius:4px;
+        margin-left:35px;
+        width:450px;
+        height:130px;
+        div{
+          font-size:14px;
+          color:#333;
+        }
+        .examine-div-one{
+          display: flex;
+          margin:25px 0 30px 12px;
+        }
+        .examine-div-two{
+          margin:0 0 20px 18px;
+        }
+      }
     }
     .button-box{
       display: flex;