From b46bc2dba51a3885a68e4c58316b41a31ea16bb2 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期二, 14 二月 2023 13:35:03 +0800
Subject: [PATCH] 1.存货档案修改

---
 src/views/zzmx/gylx.vue |  664 +++++++++++++++++++++++++++++++-----------------------
 1 files changed, 382 insertions(+), 282 deletions(-)

diff --git a/src/views/zzmx/gylx.vue b/src/views/zzmx/gylx.vue
index d2202be..f733d87 100644
--- a/src/views/zzmx/gylx.vue
+++ b/src/views/zzmx/gylx.vue
@@ -1,16 +1,22 @@
 <template>
   <div>
     <div class="body" :style="{height:mainHeight+'px'}">
-      <div style="padding: 10px 5px 0 0">
+
+      <div class="bodyTopButtonGroup">
+        <el-button v-waves type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">鏂板</el-button>
+        <!--        <el-button v-waves type="primary" icon="el-icon-upload2" @click="upload">瀵煎叆</el-button>-->
+      </div>
+
+      <div class="bodyTopFormGroup">
         <el-form
           ref="form"
           :model="form"
-          label-width="80px"
+          label-width="100px"
           inline
-          style="display: flex;justify-content: space-between"
+          style="display: flex;"
         >
           <div class="elForm">
-            <el-form-item label="宸ヨ壓缂栫爜" style=" display: flex;">
+            <el-form-item label="宸ヨ壓璺嚎缂栫爜" style=" display: flex;">
               <el-input v-model="form.routecode" placeholder="璇疯緭鍏�" style="width: 200px" />
             </el-form-item>
             <el-form-item label="宸ヨ壓鍚嶇О" style=" display: flex;">
@@ -23,24 +29,24 @@
               <el-input v-model="form.createuser" style="width: 200px" placeholder="璇疯緭鍏�" />
             </el-form-item>
           </div>
-          <div style="display: flex;align-items: start;margin-top: 5px;z-index: 2">
-            <el-button type="primary" icon="el-icon-search" @click="search">鏌ヨ</el-button>
-            <el-button type="info" icon="el-icon-refresh" @click="reset">閲嶇疆</el-button>
+          <div class="bodySearchReset" :style="{marginLeft:$store.state.app.sidebar.opened? $store.state.settings.menuIsHorizontal?'15%':'3%':'10%'}">
+            <el-button v-waves type="primary" icon="el-icon-search" @click="search">鏌ヨ</el-button>
+            <el-button v-waves type="info" icon="el-icon-refresh" @click="reset">閲嶇疆</el-button>
           </div>
         </el-form>
+        <div
+          class="bodyTopFormExpand"
+        />
       </div>
-      <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-upload2" @click="upload">瀵煎叆</el-button>
-      </div>
-      <el-divider />
+
       <div class="elTableDiv">
         <el-table
+          ref="tableDataRef"
+          class="tableFixed"
           :data="tableData"
           :height="tableHeight"
           border
-          stripe
+          :row-class-name="tableRowClassName"
           :style="{width: 100+'%',height:tableHeight+'px',}"
           highlight-current-row
           :header-cell-style="this.$headerCellStyle"
@@ -55,14 +61,17 @@
             prop="RowNum"
             width="50"
             label="搴忓彿"
+            fixed
           />
           <el-table-column
             prop="code"
             label="缂栫爜"
+            show-tooltip-when-overflow
             sortable="custom"
           />
           <el-table-column
             prop="name"
+            show-tooltip-when-overflow
             label="鍚嶇О"
             sortable="custom"
           />
@@ -70,35 +79,64 @@
             prop="description"
             label="宸ヨ壓璺嚎鎻忚堪"
             sortable="custom"
-          />
+            show-tooltip-when-overflow
+          >
+            <template slot-scope="{row}">
+              <div v-if="row.description">{{ row.description }}</div>
+              <div v-else>/</div>
+            </template>
+          </el-table-column>
           <el-table-column
             prop="enable"
+            show-tooltip-when-overflow
             label="浣跨敤鐘舵��"
             sortable="custom"
           >
             <template slot-scope="{row}">
-              <div v-if="row.enable==='Y'">鏄�</div>
-              <div v-if="row.enable==='N'">鍚�</div>
+              <div v-if="row.enable==='Y'">
+                <i class="el-icon-success" :style="{color:$store.state.settings.theme}" style="margin-right: 2px" />
+                鏄�
+              </div>
+              <div v-if="row.enable==='N'">
+                <i class="el-icon-info" style="margin-right: 2px" />
+                鍚�
+              </div>
             </template>
           </el-table-column>
           <el-table-column
             prop="lm_user"
+            show-tooltip-when-overflow
             label="鍒涘缓浜哄憳"
             sortable="custom"
           />
           <el-table-column
             prop="lm_date"
             label="鍒涘缓鏃堕棿"
+            show-tooltip-when-overflow
             sortable="custom"
+            width="160"
           />
           <el-table-column
             label="鎿嶄綔"
+            width="120"
+            fixed="right"
           >
             <template slot-scope="{row}">
               <div class="operationClass">
-                <!--                <el-button type="text" @click="edit('edit',row)">缂栬緫</el-button>-->
-                <el-button type="text" @click="edit('edit',row)">棰勮</el-button>
-                <el-button type="text" @click="del(row)">鍒犻櫎</el-button>
+                <el-tooltip class="item" effect="dark" content="棰勮" placement="top">
+                  <i
+                    class="el-icon-view"
+                    :style="{color:$store.state.settings.theme}"
+                    style="margin-right:15px;cursor: pointer;"
+                    @click="edit('edit',row)"
+                  />
+                </el-tooltip>
+                <el-tooltip v-del-tab-index class="item" effect="dark" content="鍒犻櫎" placement="top">
+                  <i :style="{color:$store.state.settings.theme}" class="el-icon-delete" style="margin-right:15px;" @click="del(row)" />
+                </el-tooltip>
+                <el-tooltip v-del-tab-index class="item" effect="dark" content="澶嶅埗" placement="top">
+                  <i :style="{color:$store.state.settings.theme}" class="el-icon-document-copy" style="cursor: pointer;color:#42b983" @click="copy('copy',row)" />
+                </el-tooltip>
               </div>
             </template>
           </el-table-column>
@@ -106,31 +144,30 @@
       </div>
       <!--鍒嗛〉-->
       <pagination
-        v-show="total>0"
         :total="total"
         :page.sync="form.page"
         :limit.sync="form.rows"
         align="right"
-        layout="prev, pager, next,sizes"
+        layout="total,prev, pager, next,sizes"
         popper-class="select_bottom"
         @pagination="getRouteSearch"
       />
     </div>
 
     <el-dialog
-      :title="operation==='add'?'鏂板':'棰勮'"
+      v-el-drag-dialog
+      :title="operation==='add'?'鏂板':(operation==='edit'?'棰勮':'澶嶅埗')"
       :visible.sync="dialogVisible"
-      width="1200px"
+      width="1000px"
       :close-on-click-modal="false"
-      top="15vh"
-      :fullscreen="isFullscreen"
+      :top="isIpad?'5vh':'15vh'"
       @closed="handleClose"
       @close="handleClose"
     >
-      <el-form ref="dialogForm" style="height: 500px" :rules="dialogFormRules" :model="dialogForm" label-width="80px">
+      <el-form ref="dialogForm" style="height: 500px" :rules="dialogFormRules" :model="dialogForm" label-width="110px">
         <div style="display: flex">
-          <el-form-item label="宸ヨ壓缂栫爜" prop="code" style="margin-right: 20px">
-            <el-input v-model="dialogForm.code" :disabled="operation!=='add'" style="width: 220px" />
+          <el-form-item label="宸ヨ壓璺嚎缂栫爜" prop="code" style="margin-right: 20px">
+            <el-input v-model="dialogForm.code" :disabled="operation==='edit'" style="width: 220px" />
           </el-form-item>
           <el-form-item label="宸ヨ壓鍚嶇О" prop="name">
             <el-input v-model="dialogForm.name" :disabled="operation==='edit'" style="width: 220px" />
@@ -140,6 +177,7 @@
           <el-form-item prop="enable" label="浣跨敤鐘舵��" style="margin-right: 20px">
             <el-select
               v-model="dialogForm.enable"
+              filterable
               :disabled="operation==='edit'"
               :popper-append-to-body="false"
               style="width: 220px"
@@ -154,7 +192,12 @@
             </el-select>
           </el-form-item>
           <el-form-item label="宸ヨ壓鎻忚堪" prop="description">
-            <el-input v-model="dialogForm.description" :disabled="operation==='edit'" type="textarea" style="width: 220px" />
+            <el-input
+              v-model="dialogForm.description"
+              :disabled="operation==='edit'"
+              type="textarea"
+              style="width: 220px"
+            />
           </el-form-item>
         </div>
         <el-form-item label="宸ヨ壓璁剧疆" prop="Data" style="margin-top: 30px">
@@ -171,7 +214,7 @@
                     zIndex:tag.label===selectedName?0:2
                   }"
                 >
-                  {{ index+1 }}
+                  {{ index + 1 }}
                 </div>
 
                 <!--                <el-tooltip-->
@@ -198,7 +241,7 @@
                   />
                 </el-tag>
                 <!--                </el-tooltip>-->
-
+                <!--                {{ tag.editDisabled }}-->
                 <!--                left:tag.stepname===selectedName?'191px':'141px',-->
                 <i
                   v-if="index!==0&&tag.editDisabled&&operation!=='edit'"
@@ -220,9 +263,11 @@
                   :debounce="300"
                   :popper-append-to-body="false"
                   popper-class="autocompleteClass"
-                  @select="handleSelect"
+                  @select="val=>handleSelect(val,tag)"
                   @keyup.enter.native="handleInputConfirm(tag)"
                 />
+                <!--                @keyup.enter.native="handleInputConfirm(tag)"-->
+
                 <!--        @blur="handleBlur2"-->
                 <div
                   v-if="index!==dynamicTags.length-1"
@@ -233,6 +278,7 @@
 
             <el-button
               v-if="operation!=='edit'"
+              v-waves
               type="success"
               :disabled="addDisabled"
               class="tagSuccess"
@@ -246,9 +292,16 @@
       </el-form>
       <span slot="footer" class="dialog-footer">
         <div class="footerButton">
-          <el-button v-if="operation==='edit'" @click="dialogVisibleCancel">杩� 鍥�</el-button>
-          <el-button v-if="operation!=='edit'" @click="dialogVisibleCancel">鍙� 娑�</el-button>
-          <el-button v-if="operation!=='edit'" type="primary" @click="dialogVisibleConfirm">纭� 瀹�</el-button>
+          <el-button v-if="operation==='edit'" v-waves @click="dialogVisibleCancel">杩� 鍥�</el-button>
+          <el-button v-if="operation!=='edit'" v-waves @click="dialogVisibleCancel">鍙� 娑�</el-button>
+          <el-button
+            v-if="operation!=='edit'"
+            v-waves
+            type="primary"
+            :loading="$store.state.app.buttonIsDisabled"
+            :disabled="$store.state.app.buttonIsDisabled"
+            @click="dialogVisibleConfirm"
+          >纭� 瀹�</el-button>
         </div>
       </span>
     </el-dialog>
@@ -257,28 +310,20 @@
 
 <script>
 import Pagination from '@/components/Pagination'
-import { AddUpdateRoute, DeleteRoute, RouteSearch, RouteSelect, StepSelect, ViewRoute } from '@/api/zzmx'
+import { AddUpdateRoute, DeleteRoute, RouteSearch, StepSelect, ViewRoute } from '@/api/zzmx'
+import { validateCode } from '@/utils/global'
+import elDragDialog from '@/directive/el-drag-dialog'
+import waves from '@/directive/waves'
 
-const SER_HZ = /^[\u4e00-\u9fa5]+$/
 export default {
   name: 'GYLX',
   components: {
     Pagination
   },
+  directives: { elDragDialog, waves },
   data() {
-    const validateName = (rule, value, callback) => {
-      if (!value) {
-        return callback(new Error('璇疯緭鍏ョ紪鐮�'))
-      } else {
-        if (SER_HZ.test(value)) {
-          return callback(new Error('缂栫爜涓嶈兘涓轰腑鏂�'))
-        } else {
-          callback()
-        }
-      }
-    }
     return {
-      isFullscreen: false,
+      isIpad: false,
       mainHeight: 0,
       tableHeight: 0,
       form: {
@@ -302,12 +347,12 @@
         id: '',
         code: '',
         name: '',
-        enable: '',
+        enable: 'Y',
         description: '',
         Data: []
       },
       dynamicTags: [// 宸ヨ壓璁剧疆鏁扮粍
-        { editDisabled: true, stepcode: 'Step01', seq: 1, stepname: ' ', effect: 'light' }
+        { editDisabled: true, stepcode: '', seq: 1, stepname: ' ', effect: 'light' }
         // { editDisabled: true, stepcode: 'Step02', seq: 2, stepname: '濂�', effect: 'light' },
         // { editDisabled: true, stepcode: 'Step03', seq: 3, stepname: '澶�', effect: 'light' }
       ],
@@ -315,13 +360,14 @@
       selectedName: '', // 閫変腑鐨勫悕绉�
       autocompleteValue: '', // 鍙悳绱㈣緭鍏ユ涓殑鍊�
       routeArr: [], // 宸ヨ壓璁剧疆涓嬫媺鎵�鏈夊��
-      addDisabled: false, // 娣诲姞鎸夐挳鏄惁鍙偣鍑�
-      editDisabled: true, // 淇敼鎸夐挳鏄惁鍙偣鍑�
+      routeSelectedArr: [], // 宸ヨ壓璁剧疆涓嬫媺宸查�夌殑鍊�
+      addDisabled: true, // 娣诲姞鎸夐挳鏄惁鍙偣鍑�
+      // editDisabled: true, // 淇敼鎸夐挳鏄惁鍙偣鍑�
       mouseFocusPosition: 0, // 榧犳爣鑱氱劍鐨勪綅缃�
       operation: '',
       dialogFormRules: {
         code: [
-          { required: true, validator: validateName, trigger: ['blur', 'change'] }
+          { required: true, validator: validateCode, trigger: ['blur', 'change'] }
         ],
         name: [
           { required: true, message: '璇疯緭鍏ュ悕绉�', trigger: ['blur', 'change'] }
@@ -361,21 +407,20 @@
       }
     },
     // 宸ヨ壓璁剧疆 涓嬫媺鑾峰彇鎵�鏈�
-    async  getStepSelectArr() {
+    async getStepSelectArr() {
       const { data: res } = await StepSelect()
       this.routeArr = res
     },
     // 澶勭悊涓嬫媺閫夋嫨
-    handleSelect(item) {
+    handleSelect(item, tag) {
       this.autocompleteValue = item.value
       this.$nextTick(_ => {
         this.$refs['saveTagInput' + this.mouseFocusPosition][0].focus()
+        this.handleInputConfirm(tag)
       })
     },
     // 杈撳叆妗嗙‘璁や簨浠�
     handleInputConfirm(tag) {
-      console.log(tag, 111)
-      console.log(this.autocompleteValue, 2)
       // 1.閫夋嫨鍐呭涓嶈兘涓虹┖
       if (this.autocompleteValue.trim().length < 1) {
         return this.$message.info('閫夋嫨鍐呭涓嶈兘涓虹┖锛�')
@@ -391,30 +436,71 @@
         return this.$message.info('杈撳叆妗嗗唴瀹逛笌涓嬫媺閫夐」鍐呭涓嶅尮閰嶏紒')
       }
 
+      // 3.杈撳叆妗嗗唴瀹逛笌宸查�夊唴瀹圭浉鍚屾椂涓嶈兘淇濆瓨
+      let flag2 = false
+      this.dynamicTags.forEach(item => {
+        if (item.stepname === this.autocompleteValue.trim()) {
+          flag2 = true
+        }
+      })
+      if (tag.stepname === this.autocompleteValue.trim()) {
+        flag2 = false
+      }
+      if (flag2) {
+        return this.$message.info('姝ゅ伐搴忓凡閫夛紝璇烽�夋嫨鍏跺畠宸ュ簭锛�')
+      }
+
+      this.routeArr.forEach((item, index) => {
+        if (this.autocompleteValue.trim() === item.stepname) {
+          this.routeSelectedArr.push({
+            stepcode: item.stepcode,
+            stepname: item.stepname,
+            value: item.value
+          })
+
+          this.routeArr.splice(index, 1)
+        }
+      })
+
       // 灏嗗�兼浛鎹㈠埌鍘焧ag浣嶇疆涓�
       this.dynamicTags.forEach((item, index) => {
         if ((index + 1) === tag.seq) {
-          console.log(tag)
           item.stepname = this.autocompleteValue
+          item.effect = 'dark'
         }
         item.editDisabled = true
       })
-      console.log(this.dynamicTags, 234)
+      this.clickSelected = this.dynamicTags.findIndex(i => i.effect === 'dark') + 1
+
       this.addDisabled = false
       this.editDisabled = true
       this.selectedName = ''
     },
     // tag鐐瑰嚮淇敼鎸夐挳
     tagEdit(tag) {
-      console.log(tag, 2)
       this.autocompleteValue = ''
       this.dynamicTags.forEach(item => {
         item.stepname = item.stepname.trim()
+        item.editDisabled = false
         if (item.seq !== tag.seq) {
-          item.editDisabled = false
-          // return this.$message.info('璇峰厛濉啓鎴栭�夋嫨宸ヨ壓锛�')
+          item.effect = 'light'
+        } else {
+          item.effect = 'dark'
         }
       })
+
+      if (tag.stepname !== '') {
+        const routeSelectedArr = this.routeSelectedArr.find(item => item.stepname === tag.stepname)
+
+        this.routeArr.push(
+          {
+            stepcode: routeSelectedArr.stepcode,
+            stepname: routeSelectedArr.stepname,
+            value: routeSelectedArr.value
+          }
+        )
+      }
+
       this.addDisabled = true
       this.selectedName = tag.stepname
       this.autocompleteValue = tag.stepname
@@ -425,70 +511,76 @@
     },
     // tag鐐瑰嚮浜嬩欢
     elTagClick(tag) {
-      console.log(tag, 1)
-      this.clickSelected = tag.seq
-      if (tag.effect === 'dark') {
-        tag.effect = 'light'
-        this.clickSelected = ''
-      } else {
-        this.dynamicTags.forEach(item => {
-          item.effect = 'light'
-        })
-        if (tag.effect === 'light') {
-          tag.effect = 'dark'
-        } else if (tag.effect === 'dark') {
-          tag.effect = 'light'
+      if (this.dynamicTags.every(i => i.editDisabled)) {
+        this.clickSelected = tag.seq
+        if (tag.effect === 'dark') {
+
+        } else {
+          this.dynamicTags.forEach(item => {
+            item.effect = 'light'
+          })
+          if (tag.effect === 'light') {
+            tag.effect = 'dark'
+          } else if (tag.effect === 'dark') {
+            tag.effect = 'light'
+          }
         }
       }
-      console.log(this.$el)
-      // console.log(this.$el.style.color = 'red')
     },
     // 澶勭悊tag鍏抽棴浜嬩欢
     handleTagClose(tag) {
-      console.log(tag)
-
       // 褰撻�変腑鐨勬楠よ鍒犻櫎鏃�
-      if (tag.seq === this.clickSelected) {
-        this.clickSelected = ''
+      if (tag.effect === 'dark') {
+        this.clickSelected = this.dynamicTags.length - 1
       }
       this.dynamicTags.forEach((item, index) => {
         if (item.seq === tag.seq) {
           this.dynamicTags.splice(index, 1)
         }
       })
+
+      const routeSelectedArr = this.routeSelectedArr.find(item => item.stepname === tag.stepname)
+
+      if (routeSelectedArr !== undefined) {
+        this.routeArr.push(
+          {
+            stepcode: routeSelectedArr.stepcode,
+            stepname: routeSelectedArr.stepname,
+            value: routeSelectedArr.value
+          }
+        )
+      }
+      this.routeArr = this.routeArr.filter((currentValue, currentIndex, selfArr) => {
+        return selfArr.findIndex(item => item.stepcode === currentValue.stepcode) === currentIndex
+      })
+
       // 閲嶆柊鎺掑簭
       this.dynamicTags.forEach((item, index) => {
         item.editDisabled = true
         item.seq = index + 1
-        item.stepcode = 'Step' + ((index + 1).toString().length === 2 ? (index + 1) : '0' + (index + 1))
+        item.stepcode = ''
+        item.effect = index === this.dynamicTags.length - 1 ? 'dark' : 'light'
       })
-      if (this.clickSelected === '') {
-        this.selectedName = ''
-      }
       this.addDisabled = false
     },
     // tag娣诲姞鎸夐挳
     showInput() {
+      const seq = this.dynamicTags.findIndex(i => i.effect === 'dark') + 2
+
+      // 鍏堝皢姣忎釜鐨則ag鏍囩棰滆壊鏀逛负娴呰壊
+      this.dynamicTags.forEach(i => {
+        i.effect = 'light'
+      })
+
       this.autocompleteValue = ''
       this.addDisabled = true
       this.editDisabled = false
-      let seq = 0
-      // 1.绗竴绉嶆儏鍐�   褰撴湭閫変腑鎯呭喌涓嬫垨鑰呴�変腑鏈�鍚庝竴涓殑鎯呭喌涓�
-      if (this.clickSelected === '' || this.clickSelected === this.dynamicTags.length) {
-        seq = this.dynamicTags.length + 1
-        this.dynamicTags.push(
-          { editDisabled: true, seq: seq, stepname: '', effect: 'light', stepcode: ('Step' + (seq.toString().length === 2 ? seq : '0' + seq)) }
-        )
-      } else {
-        // 2.绗簩绉嶆儏鍐�   褰撻�変腑鏌愪釜tag   灏嗗湪tag鍚庨潰娣诲姞
-        seq = this.clickSelected + 1
-        this.dynamicTags.splice(this.clickSelected, 0, { editDisabled: true, seq: seq, stepname: '', effect: 'light' })
-        this.dynamicTags.forEach((item, index) => {
-          item.seq = index + 1
-          item.stepcode = 'Step' + ((index + 1).toString().length === 2 ? (index + 1) : '0' + (index + 1))
-        })
-      }
 
+      this.dynamicTags.splice(this.clickSelected, 0, { editDisabled: true, seq: seq, stepname: '', effect: 'dark' })
+      this.dynamicTags.forEach((item, index) => {
+        item.seq = index + 1
+        item.stepcode = ''
+      })
       this.$nextTick(_ => {
         this.$refs['saveTagInput' + seq][0].focus()
       })
@@ -498,8 +590,6 @@
       this.dynamicTags.forEach((item, index) => {
         item.editDisabled = seq === index + 1
       })
-
-      console.log(this.dynamicTags, 1)
     },
 
     // 鑾峰彇宸ヨ壓璺嚎鍒楄〃娓呭崟
@@ -530,10 +620,10 @@
     },
     // 閲嶇疆
     reset() {
-      this.form.OrgCode = ''
-      this.form.OrgName = ''
-      this.form.OrgType = ''
-      this.form.UserName = ''
+      this.form.routecode = ''
+      this.form.routename = ''
+      this.form.description = ''
+      this.form.createuser = ''
       this.getRouteSearch()
     },
 
@@ -544,7 +634,7 @@
       this.getStepSelectArr()
     },
     // 宸ヨ壓璺嚎棰勮
-    async  edit(operation, row) {
+    async edit(operation, row) {
       this.operation = operation
       this.dialogVisible = true
 
@@ -574,6 +664,9 @@
         DeleteRoute({ routecode: row.code }).then(res => {
           if (res.code === '200') {
             this.$message.success('鍒犻櫎鎴愬姛!')
+            if (this.form.page > 1 && this.tableData.length === 1) {
+              this.form.page--
+            }
             this.getRouteSearch()
           }
         })
@@ -581,16 +674,50 @@
         this.$message.info('宸插彇娑堝垹闄�')
       })
     },
+    // 澶嶅埗鎸夐挳
+    async copy(operation, row) {
+      this.operation = operation
+      this.dialogVisible = true
+
+      await this.getStepSelectArr()
+      const { data: res } = await ViewRoute({ routecode: row.code })
+      // 寰呮敼
+      this.dynamicTags = []
+      this.routeSelectedArr = []
+      this.$nextTick(() => {
+        this.dialogForm.code = res[0].code
+        this.dialogForm.name = res[0].name
+        this.dialogForm.enable = res[0].enable
+        this.dialogForm.description = res[0].description
+        res[0].Data.forEach((item, index) => {
+          this.dynamicTags.push(
+            { seq: item.seq, stepname: item.stepname, stepcode: item.stepcode, editDisabled: true, effect: index === res[0].Data.length - 1 ? 'dark' : 'light' }
+          )
+          this.routeSelectedArr.push({
+            stepcode: item.stepcode,
+            stepname: item.stepname,
+            value: item.stepname
+          })
+          this.routeArr = this.routeArr.filter(i => i.stepcode !== item.stepcode)
+        })
+
+        this.addDisabled = false
+        this.clickSelected = this.dynamicTags.length
+      })
+    },
     // 瀵硅瘽妗嗗叧闂簨浠�
     handleClose() {
       this.dialogForm.code = ''
       this.dialogForm.name = ''
-      this.dialogForm.enable = ''
+      this.dialogForm.enable = 'Y'
       this.dialogForm.description = ''
       this.dialogForm.Data = []
+
       this.dynamicTags = [
-        { editDisabled: true, stepcode: 'Step01', seq: 1, stepname: ' ', effect: 'light' }
+        { editDisabled: true, stepcode: '', seq: 1, stepname: ' ', effect: 'light' }
       ]
+      this.addDisabled = true
+      this.routeSelectedArr = []
       this.$refs.dialogForm.clearValidate()
     },
     // 瀵硅瘽妗嗗彇娑�
@@ -602,13 +729,24 @@
       if (this.dynamicTags[0].stepname.trim() === '') {
         return this.$message.info('宸ヨ壓璁剧疆绗竴椤逛笉鑳戒负绌猴紒')
       }
-      console.log(this.dynamicTags, 3)
       const Data = []
       this.dynamicTags.forEach(item => {
-        Data.push({ seq: item.seq, stepcode: item.stepcode, stepname: item.stepname })
+        Data.push({
+          seq: item.seq,
+          stepcode: this.routeSelectedArr.find(it => it.stepname === item.stepname).stepcode,
+          stepname: item.stepname
+        })
       })
+
+      Data.forEach(item => {
+        if (item.stepname === this.routeSelectedArr.find(it => it.stepname === item.stepname).stepname) {
+          item.stepcode = this.routeSelectedArr.find(it => it.stepname === item.stepname).stepcode
+        }
+      })
+
       this.$refs.dialogForm.validate(valid => {
         if (valid) {
+          this.$store.state.app.buttonIsDisabled = true
           const data = {
             code: this.dialogForm.code,
             name: this.dialogForm.name,
@@ -616,14 +754,15 @@
             description: this.dialogForm.description,
             Data: Data
           }
-          console.log(data, 2)
-          AddUpdateRoute(this.dialogForm.id, this.operation === 'add' ? 'Add' : 'Update', data).then(res => {
+
+          AddUpdateRoute(this.dialogForm.id, this.operation === 'edit' ? 'Update' : 'Add', data).then(res => {
             if (res.code === '200') {
-              this.$message.success(this.operation === 'add' ? '娣诲姞鎴愬姛锛�' : '淇敼鎴愬姛锛�')
               this.dialogVisible = false
+              this.$message.success(this.operation === 'add' ? '娣诲姞鎴愬姛锛�' : '澶嶅埗鎴愬姛锛�')
               this.getRouteSearch()
+              this.$store.state.app.buttonIsDisabled = false
             } else {
-              this.$message.error(this.operation === 'add' ? '娣诲姞澶辫触锛�' : '淇敼澶辫触锛�')
+              this.$message.error(this.operation === 'add' ? '娣诲姞澶辫触锛�' : '澶嶅埗澶辫触锛�')
             }
           })
         }
@@ -632,10 +771,17 @@
     // 鑾峰彇椤甸潰楂樺害
     getHeight() {
       this.$nextTick(() => {
-        this.mainHeight = window.innerHeight - 250
-        this.tableHeight = this.mainHeight - 100
-        // this.isFullscreen = window.innerHeight < 800
+        this.mainHeight = window.innerHeight - 85
+        this.tableHeight = this.mainHeight - 195
+        if (window.innerHeight < 769) {
+          this.tableHeight = this.tableHeight - 40
+        }
+        this.isIpad = window.innerHeight < 769 && window.innerWidth < 1367
+        this.$refs.tableDataRef.doLayout()
       })
+    },
+    tableRowClassName({ row, rowIndex }) {
+      return 'custom-row'
     }
   }
 }
@@ -643,162 +789,6 @@
 
 <style lang="scss" scoped>
 $main_color: #42b983;
-::v-deep .el-button--primary {
-  background-color: $main_color !important;
-  height: 30px;
-  display: flex;
-  align-items: center;
-  border: 1px solid $main_color;
-  padding: 0 20px;
-}
-
-::v-deep .el-button--info {
-  height: 30px;
-  display: flex;
-  align-items: center;
-  padding: 0 20px;
-}
-
-::v-deep .el-pagination.is-background .el-pager li:not(.disabled).active {
-  background-color: $main_color !important;
-}
-
-::v-deep .el-dialog__footer {
-  display: flex;
-  justify-content: flex-end;
-}
-
-.footerButton {
-  display: flex;
-  justify-content: end;
-}
-
-::v-deep .el-button--default {
-  background-color: #ffffff !important;
-  height: 30px;
-  display: flex;
-  align-items: center;
-  padding: 0 20px;
-}
-
-::v-deep .el-button--default:hover {
-  color: #606266;
-}
-
-::v-deep .el-dialog__body {
-  padding: 20px 100px !important;
-}
-
-::v-deep .el-radio__input.is-checked .el-radio__inner {
-  background-color: $main_color;
-  border-color: $main_color;
-}
-
-::v-deep .el-radio__input.is-checked + .el-radio__label {
-  color: $main_color !important;
-}
-
-::v-deep .el-checkbox__input.is-checked .el-checkbox__inner {
-  border-color: $main_color;
-  background-color: $main_color;
-}
-
-::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 {
-  transform: scale(0.8);
-}
-
-::v-deep .cell {
-  display: flex !important;
-  align-items: center !important;
-  justify-content: space-between !important;
-}
-
-::v-deep .el-button--text {
-  color: $main_color;
-  font-size: 14px;
-  cursor: pointer;
-}
-
-.operationClass {
-  height: 23px;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.el-icon-share {
-  color: $main_color;
-  cursor: pointer;
-}
-
-.el-checkbox.is-bordered.is-checked {
-  border-color: $main_color;
-}
-
-::v-deep .el-radio__input.is-checked .el-radio__inner {
-  border-color: $main_color;
-  background: $main_color;
-}
-
-::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner {
-  border-color: $main_color;
-  background: $main_color;
-}
-
-::v-deep .el-checkbox__input.is-checked + .el-checkbox__label {
-  color: $main_color !important;
-}
-
-::v-deep .el-checkbox.is-bordered + .el-checkbox.is-bordered {
-  margin: 10px 30px 0px 0;
-}
-
-::v-deep .el-radio__input.is-checked + .el-radio__label {
-  color: $main_color;
-}
-
-::v-deep .el-radio.is-bordered + .el-radio.is-bordered {
-  margin: 10px 30px 0px 0;
-}
-
-.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-checkbox__inner:hover {
-  border-color: $main_color;
-}
-
-::v-deep .el-textarea__inner:focus {
-  border-color: $main_color;
-}
 
 /*
 瀹炵幇宸ヨ壓璁剧疆鍔ㄦ�佹坊鍔犳牱寮�
@@ -809,8 +799,8 @@
   position: absolute;
   margin-left: -7px;
   z-index: 2;
-  width: 15px;
-  height: 15px !important;
+  width: 16px;
+  height: 16px !important;
   font-size: 12px;
   text-align: center;
   line-height: 15px;
@@ -872,8 +862,9 @@
   border-radius: 0;
   color: $main_color;
 }
+
 ::v-deep .el-button--success:disabled {
-  background-color:#eeeeee;
+  background-color: #eeeeee;
   color: $main_color;
 }
 
@@ -907,9 +898,118 @@
   white-space: nowrap;
 }
 
-.autocompleteClass{
-  .el-autocomplete-suggestion li{
+.autocompleteClass {
+  .el-autocomplete-suggestion li {
     //color: red;
   }
 }
 </style>
+
+<!--鍏叡椤甸潰鏍峰紡-->
+<style lang="scss" scoped>
+$main_color: #42b983;
+.el-icon-share, .el-icon-delete, .el-icon-edit-outline {
+  color: $main_color;
+  cursor: pointer;
+}
+
+.el-icon-edit-outline {
+  margin-right: 15px;
+}
+
+::v-deep .el-button--primary, .el-button--default, .el-button--info {
+  height: 34px;
+  display: flex;
+  align-items: center;
+  padding: 0 15px;
+}
+
+::v-deep .el-button--primary {
+  //background-color: $main_color !important;
+}
+
+::v-deep .el-button--default {
+  background-color: #f8f8fa;
+  border: none;
+}
+
+::v-deep .el-input__inner {
+  height: 34px;
+  line-height: 34px;
+  //color: #a7a7a7;
+}
+
+::v-deep .el-dialog__body {
+  padding: 20px 20px !important;
+}
+
+::v-deep .dialogVisibleRoles .el-dialog__body {
+  padding: 20px 20px !important;
+}
+
+::v-deep .importPickerClass .el-dialog__body {
+  padding: 20px 20px !important;
+}
+
+::v-deep .el-dialog__footer {
+  display: flex;
+  justify-content: flex-end;
+}
+
+::v-deep .el-table .caret-wrapper {
+  transform: scale(0.8);
+}
+
+::v-deep .cell {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+::v-deep .el-table::before {
+  height: 0;
+}
+
+::v-deep .el-table__body-wrapper {
+  background-color: #f8f8fa;
+}
+
+::v-deep .el-table__body .el-table__row.hover-row td {
+  background-color: #eaecef;
+}
+
+::v-deep .el-form--inline .el-form-item__label {
+  color: #a7a7a7;
+}
+
+.body ::v-deep .el-divider {
+  border: 1px solid #eee;
+  width: 99%;
+  margin: 10px auto;
+}
+
+.body ::v-deep .el-form-item {
+  margin-bottom: 0;
+}
+
+.userDialogVisible ::v-deep .el-form-item {
+  margin-bottom: 0;
+}
+
+.tableFixed {
+  ::v-deep .el-table__fixed-right {
+    height: 100% !important;
+  }
+
+  ::v-deep .el-table__fixed {
+    height: 100% !important;
+  }
+}
+
+</style>
+<style>
+
+.el-table .custom-row {
+  background: #f8f8fa;
+}
+</style>

--
Gitblit v1.9.3