From 7d0a954d23d21c0cdaff6ed20ad7291b3dbf889a Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期四, 30 六月 2022 17:45:39 +0800
Subject: [PATCH] 1.完成制造模型(工序定义)页面开发

---
 src/views/jcsz/jsqd.vue |  190 +++++++++++++++++++++++++++++++++++------------
 1 files changed, 141 insertions(+), 49 deletions(-)

diff --git a/src/views/jcsz/jsqd.vue b/src/views/jcsz/jsqd.vue
index 096d44a..a6ff328 100644
--- a/src/views/jcsz/jsqd.vue
+++ b/src/views/jcsz/jsqd.vue
@@ -1,8 +1,7 @@
 <template>
   <div>
-    <!--    <div class="body" style="background-color: #ffffff;  padding: 20px 10px 0 20px;">-->
-    <div class="body" style="background-color: #ffffff;  padding: 20px 10px 0 20px;" :style="{height:mainHeight+'px'}">
-      <div>
+    <div class="body" :style="{height:mainHeight+'px'}">
+      <div style="padding: 10px 5px 0 0">
         <el-form
           ref="form"
           :model="form"
@@ -18,7 +17,13 @@
               <el-input v-model="form.RoleName" placeholder="璇疯緭鍏�" style="width: 200px" />
             </el-form-item>
             <el-form-item label="瑙掕壊绫诲瀷" style=" display: flex;">
-              <el-select v-model="form.RoleTypeCode" filterable style="width: 200px" placeholder="璇烽�夋嫨">
+              <el-select
+                v-model="form.RoleTypeCode"
+                :popper-append-to-body="false"
+                filterable
+                style="width: 200px"
+                placeholder="璇烽�夋嫨"
+              >
                 <el-option
                   v-for="item in RoleTypeCodeArr2"
                   :key="item.roletype_code"
@@ -37,17 +42,19 @@
           </div>
         </el-form>
       </div>
-      <div style="margin-bottom: 20px;display: flex; z-index: 2">
+      <el-divider />
+      <div style="margin-left: 10px;display: flex">
         <el-button type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">鏂板</el-button>
         <el-button type="primary" icon="el-icon-setting" @click="settingButton">璁剧疆</el-button>
         <el-button type="primary" icon="el-icon-upload2" @click="upload">瀵煎叆</el-button>
       </div>
-
-      <div style="display: flex;border: 1px solid #eee">
+      <el-divider />
+      <div class="elTableDiv">
         <el-table
           :data="tableData"
           border
           stripe
+          :height="tableHeight"
           :style="{width: 100+'%',height:tableHeight+'px'}"
           highlight-current-row
           :header-cell-style="this.$headerCellStyle"
@@ -143,10 +150,11 @@
 
     <!--    鏂板淇敼瀵硅瘽妗�-->
     <el-dialog
-      :title="operation==='add'?'娣诲姞':'淇敼'"
+      :title="operation==='add'?'鏂板':'淇敼'"
       :visible.sync="dialogVisible"
       width="50%"
       top="15vh"
+      :close-on-click-modal="false"
       @closed="handleClose"
       @close="handleClose"
     >
@@ -161,6 +169,7 @@
           <el-select
             v-model="dialogForm.RoleTypeCode"
             filterable
+            :popper-append-to-body="false"
             style="width: 220px"
             placeholder="璇烽�夋嫨"
           >
@@ -185,12 +194,12 @@
     </el-dialog>
     <!--    璁剧疆鎸夐挳瀵硅瘽妗�-->
     <el-dialog
-      title="瑙掕壊绫诲瀷"
+      title="璁剧疆"
       :visible.sync="settingDialogVisible"
       width="50%"
       top="15vh"
+      :close-on-click-modal="false"
       class="settingDialogVisible"
-      @closed="handleCloseSetting"
       @close="handleCloseSetting"
     >
       <div style="margin-bottom: 20px;display: flex">
@@ -200,12 +209,14 @@
       <el-table
         :data="RoleTypeCodeArr"
         border
+        height="400"
         highlight-current-row
-        :style="{width: 100+'%',height:tableHeight-300+'px'}"
         :header-cell-style="this.$headerCellStyle"
         :cell-style="this.$cellStyle"
         @sort-change="sortChangeOfSetting"
       >
+        <!--        :style="{width: 100+'%',height:tableHeight-300+'px'}"-->
+
         <!--        <el-table-column-->
         <!--          type="selection"-->
         <!--          width="50"-->
@@ -236,7 +247,6 @@
           </template>
         </el-table-column>
         <el-table-column label="鎿嶄綔">
-
           <template slot-scope="{row}">
             <div class="operationClass">
               <el-button v-if="row.isVisible===0" type="text" @click="delSetting(row)">鍒犻櫎</el-button>
@@ -244,12 +254,6 @@
               <el-button v-if="row.isVisible===1" type="text" @click="formSettingCancel(row)">鍙栨秷</el-button>
             </div>
           </template>
-          <!--          <template v-for="item in RoleTypeCodeArr" slot-scope="{row}">-->
-          <!--            <div :key="item.roletype_code" class="operationClass">-->
-          <!--              <el-button v-if="item.isVisible" type="text" @click="formSettingSave(row)">淇濆瓨</el-button>-->
-          <!--              <el-button v-if="item.isVisible" type="text" @click="formSettingCancel(row)">鍙栨秷</el-button>-->
-          <!--            </div>-->
-          <!--          </template>-->
         </el-table-column>
       </el-table>
       <!--鍒嗛〉-->
@@ -274,7 +278,8 @@
     <el-dialog
       title="瑙掕壊鍏宠仈鐢ㄦ埛"
       :visible.sync="userDialogVisible"
-      width="90%"
+      width="80%"
+      :close-on-click-modal="false"
       top="15vh"
       class="userDialogVisible"
       @closed="handleCloseUser"
@@ -300,6 +305,8 @@
               ref="dialogCascaderUser"
               key="cascaderKey"
               filterable
+              popper-class="elCascader"
+              :append-to-body="false"
               :options="StuOrgArr"
               :props="defaultProps"
               class="userDialogVisibleInput"
@@ -312,6 +319,7 @@
             <el-select
               v-model="dialogFormUser.isrole"
               filterable
+              :popper-append-to-body="false"
               style="width: 220px"
               placeholder="璇烽�夋嫨"
               class="userDialogVisibleInput"
@@ -345,7 +353,7 @@
         :data="dialogFormUserTable"
         border
         highlight-current-row
-        :style="{width: 100+'%',height:tableHeight-300+'px'}"
+        height="300"
         :header-cell-style="this.$headerCellStyle"
         :cell-style="this.$cellStyle"
         :row-key="getRowKey"
@@ -416,6 +424,7 @@
       :visible.sync="dialogVisibleRight"
       width="50%"
       top="15vh"
+      :close-on-click-modal="false"
       class="dialogVisibleRight"
       @closed="handleCloseRight"
       @close="handleCloseRight"
@@ -778,7 +787,7 @@
     // 鑾峰彇椤甸潰楂樺害
     getHeight() {
       this.$nextTick(() => {
-        this.mainHeight = window.innerHeight - 200
+        this.mainHeight = window.innerHeight - 250
         this.tableHeight = this.mainHeight - 100
       })
     },
@@ -801,7 +810,9 @@
     },
     // 娣诲姞鎸夐挳
     addSetting() {
-      const data = { roletype_code: '', roletype_name: '', isVisible: 1 }
+      let number = Math.random() * Math.random()// 浣滀负鍒犻櫎鏃剁殑鏍囪瘑绗�
+      number = number === 0 ? Math.random() * Math.random() : number
+      const data = { roletype_code: '', roletype_name: '', isVisible: 1, number: number }
       this.RoleTypeCodeArr.unshift(data)
     },
     // 鍒犻櫎鎸夐挳
@@ -835,14 +846,14 @@
       }
       const res = await RoleTypeAdd([data])
       if (res.code === '200') {
-        this.$message.success('娣诲姞鎴愬姛锛�')
+        this.$message.success('淇濆瓨鎴愬姛锛�')
         await this.getRoleTypeSearch()
       }
     },
     // 璁剧疆琛ㄥ崟鍙栨秷浜嬩欢
     formSettingCancel(row) {
       this.RoleTypeCodeArr.forEach((item, index) => {
-        if (item.isVisible === 1 && item.roletype_code === row.roletype_code) {
+        if (item.isVisible === 1 && item.number === row.number) {
           this.RoleTypeCodeArr.splice(index, 1)
         }
       })
@@ -963,31 +974,51 @@
       const rightPCArrFlag = res[0][0].flag
       const rightAPPArrFlag = res[1][0].flag
 
+      let waitFlag = false// 鍥炴樉绛夊緟鏄惁鏀捐
+
       // 1.绗竴绉嶆儏鍐礟C鍜孉PP閮戒竴娆¢兘娌¢�変腑鏃�    PC鏈�変腑锛孉PP鏈�変腑
       if (rightPCArrFlag === 'N' && rightAPPArrFlag === 'N') {
         pcIsSelected1 = true
         this.dialogFormRight.rightCurrentCode = this.dialogFormRight.rightPCArr[0].code
       }
+
       // 2.绗簩绉嶆儏鍐礟C宸查�変腑锛孉PP鏈�変腑
       if (rightPCArrFlag === 'Y' && rightAPPArrFlag === 'N') {
         pcIsSelected1 = true
         pcIsSelected2 = true
-        setTimeout(() => {
-          this.$nextTick(() => {
-            $('input:checkbox').eq(0).prop('checked', true)// 鑷畾涔夊崟閫夋鍥炴樉
-          })
-        }, 10)
+
+        const interval = setInterval(() => {
+          if ($('input:checkbox').length > 0) {
+            waitFlag = true
+          }
+          if (waitFlag) {
+            clearInterval(interval)
+            this.$nextTick(() => {
+              $("input[name='PC']").eq(0).prop('checked', true)// 鑷畾涔夊崟閫夋鍥炴樉
+            })
+          }
+        }, 100)
+
         this.dialogFormRight.rightCurrentCode = this.dialogFormRight.rightPCArr[0].code
       }
+
       // 3.绗笁绉嶆儏鍐礟C鏈�変腑锛孉PP宸查�変腑
       if (rightPCArrFlag === 'N' && rightAPPArrFlag === 'Y') {
         appIsSelected1 = true
         appIsSelected2 = true
-        setTimeout(() => {
-          this.$nextTick(() => {
-            $('input:checkbox').eq(1).prop('checked', true)// 鑷畾涔夊崟閫夋鍥炴樉
-          })
-        }, 10)
+
+        const interval = setInterval(() => {
+          if ($('input:checkbox').length > 0) {
+            waitFlag = true
+          }
+          if (waitFlag) {
+            clearInterval(interval)
+            this.$nextTick(() => {
+              $("input[name='APP']").eq(0).prop('checked', true)// 鑷畾涔夊崟閫夋鍥炴樉
+            })
+          }
+        }, 100)
+
         this.dialogFormRight.rightCurrentCode = this.dialogFormRight.rightAPPArr[0].code
       }
       // 4.绗洓绉嶆儏鍐礟C宸查�変腑锛孉PP宸查�変腑
@@ -996,12 +1027,20 @@
         pcIsSelected2 = true
         appIsSelected1 = false
         appIsSelected2 = true
-        setTimeout(() => {
-          this.$nextTick(() => {
-            $('input:checkbox').eq(0).prop('checked', true)// 鑷畾涔夊崟閫夋鍥炴樉
-            $('input:checkbox').eq(1).prop('checked', true)// 鑷畾涔夊崟閫夋鍥炴樉
-          })
-        }, 10)
+
+        const interval = setInterval(() => {
+          if ($('input:checkbox').length > 0) {
+            waitFlag = true
+          }
+          if (waitFlag) {
+            clearInterval(interval)
+            this.$nextTick(() => {
+              $("input[name='PC']").eq(0).prop('checked', true)// 鑷畾涔夊崟閫夋鍥炴樉
+              $("input[name='APP']").eq(0).prop('checked', true)// 鑷畾涔夊崟閫夋鍥炴樉
+            })
+          }
+        }, 100)
+
         this.dialogFormRight.rightCurrentCode = this.dialogFormRight.rightPCArr[0].code
       }
       this.dialogFormRight.rightOperationArr.push({
@@ -1278,11 +1317,16 @@
   height: 30px;
   display: flex;
   align-items: center;
-  border: 1px solid $main_color;
+  //border: 1px solid $main_color;
+  border: none;
   padding: 0 20px;
 }
 
-::v-deep .el-button--info{
+::v-deep .el-button--primary:hover {
+  border: none;
+}
+
+::v-deep .el-button--info {
   //background-color: $main_color !important;
   height: 30px;
   display: flex;
@@ -1376,8 +1420,8 @@
     }
 
     input[type=checkbox]:checked::after {
-      content: "鉁�";
-      //content: "鈭�";
+      //content: "鉁�";
+      content: "鈭�";
       color: #fff;
       font-size: 12px;
       font-weight: bold;
@@ -1413,6 +1457,10 @@
 ::v-deep .el-input__inner {
   height: 30px;
   line-height: 30px;
+}
+
+::v-deep .el-input__inner:focus {
+  border-color: $main_color;
 }
 
 ::v-deep .el-table .caret-wrapper {
@@ -1474,10 +1522,54 @@
   margin: 10px 30px 0px 0;
 }
 
-.elForm {
-  display: flex;
-  justify-content: flex-start;
-  width: 100%;
-  flex-wrap: wrap;
+.body ::v-deep .el-divider {
+  border: 1px solid #eee;
+  width: 99%;
+  margin: 10px auto;
+}
+
+.body ::v-deep .el-form-item {
+  margin-bottom: 0;
+}
+
+::v-deep .el-input__inner:focus {
+  border-color: $main_color;
+}
+
+::v-deep .el-select .el-input__inner:focus {
+  border-color: $main_color;
+}
+
+::v-deep .el-select-dropdown__item.selected {
+  color: $main_color;
+}
+
+::v-deep .el-textarea__inner:focus {
+  border-color: $main_color;
+}
+
+</style>
+<style lang="scss">
+.elCascader {
+  //.el-cascader-node.in-active-path, .el-cascader-node.is-active, .el-cascader-node.is-selectable.in-checked-path {
+  //  color: #42b983 ;
+  //}
+  .el-cascader-node.is-selectable.in-checked-path {
+    color: #42b983;
+  }
+
+  .el-radio__input.is-checked .el-radio__inner {
+    background-color: #42b983;
+    border-color: #42b983;
+  }
+
+  .el-radio__input.is-checked .el-radio__inner:hover {
+    border-color: #42b983;
+  }
+
+  .el-input__inner {
+    border-color: #42b983 !important;
+  }
+
 }
 </style>

--
Gitblit v1.9.3