From ff2f7d7bad0132c130c305364a863ff446e926b2 Mon Sep 17 00:00:00 2001
From: 小小儁爺 <1694218219@qq.com>
Date: 星期一, 30 十二月 2024 13:47:24 +0800
Subject: [PATCH] 1.在缓存模式下   页面切换会请求接口

---
 src/views/sopManager/sopRoute.vue | 1168 +++++++++++++++++++++++++++++-----------------------------
 1 files changed, 587 insertions(+), 581 deletions(-)

diff --git a/src/views/sopManager/sopRoute.vue b/src/views/sopManager/sopRoute.vue
index 440fd4e..1b5230a 100644
--- a/src/views/sopManager/sopRoute.vue
+++ b/src/views/sopManager/sopRoute.vue
@@ -1,581 +1,587 @@
-<template>
-  <div>
-    <div class="body" :style="{height:mainHeight+'px'}">
-      <div class="bodyTopButtonGroup" style="justify-content: space-between;align-items: center">
-        <el-button v-waves icon="el-icon-circle-plus-outline" type="primary" @click="add">鏂囦欢涓婁紶</el-button>
-        <div style="display: flex;align-items: center">
-          <el-form
-            ref="form"
-            :model="form"
-            label-width="100px"
-            inline
-          >
-            <div class="elForm" style="justify-content: flex-start">
-              <el-form-item style="margin-right: 30px">
-                <el-checkbox v-model="checked" @change="checkedChange">鏈�鏂扮増鏈�</el-checkbox>
-              </el-form-item>
-              <el-form-item>
-                <el-input v-model="form.search" placeholder="璇疯緭鍏ュ叧閿瓧" style="width: 260px" />
-              </el-form-item>
-            </div>
-          </el-form>
-          <el-button v-waves type="primary" style="margin-left: 30px" icon="el-icon-search" @click="search">鏌ヨ
-          </el-button>
-          <el-button v-waves type="info" icon="el-icon-refresh" @click="reset">閲嶇疆</el-button>
-        </div>
-      </div>
-
-      <div class="elTableDiv">
-        <el-table
-          ref="tableDataRef"
-          class="tableFixed"
-          :data="tableData"
-          :height="isExpandForm?tableHeight:(tableHeight+40)+'px'"
-          border
-          :row-class-name="tableRowClassName"
-          :style="{width: 100+'%',height:isExpandForm?tableHeight:(tableHeight+40)+'px',}"
-          highlight-current-row
-          :header-cell-style="this.$headerCellStyle"
-          :cell-style="this.$cellStyle"
-          @sort-change="sortChange"
-        >
-          <el-table-column
-            prop="rowNum"
-            width="50"
-            fixed
-            label="搴忓彿"
-          />
-
-          <el-table-column
-            prop="filename"
-            label="鏂囦欢鍚嶇О"
-            min-width="160"
-            show-tooltip-when-overflow
-            sortable="custom"
-          >
-            <template slot-scope="{row}">
-              <div v-if="row.filename">{{ row.filename }}</div>
-              <div v-else>/</div>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="filetypename"
-            label="鏂囦欢绫诲瀷"
-            min-width="110"
-            sortable="custom"
-          >
-            <template slot-scope="{row}">
-              <div v-if="row.filetypename">{{ row.filetypename }}</div>
-              <div v-else>/</div>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="version"
-            label="鐗堟湰鍙�"
-            min-width="110"
-            sortable="custom"
-          >
-            <template slot-scope="{row}">
-              <div v-if="row.version">{{ row.version }}</div>
-              <div v-else>/</div>
-            </template>
-          </el-table-column>
-
-          <el-table-column
-            prop="materielcode"
-            label="浜у搧缂栫爜"
-
-            show-tooltip-when-overflow
-            sortable="custom"
-          />
-          <el-table-column
-            prop="materielname"
-            label="浜у搧鍚嶇О"
-
-            show-tooltip-when-overflow
-            sortable="custom"
-          />
-          <el-table-column
-            v-if="mesSetting.route"
-            prop="routename"
-            label="宸ヨ壓璺嚎"
-
-            show-tooltip-when-overflow
-            sortable="custom"
-          />
-          <el-table-column
-            prop="stepname"
-            label="宸ュ簭鍚嶇О"
-
-            show-tooltip-when-overflow
-            sortable="custom"
-          />
-          <!--          <el-table-column-->
-          <!--            prop="eqptypename"-->
-          <!--            label="璁惧绫诲瀷"-->
-          <!--            min-width="110"-->
-          <!--            show-tooltip-when-overflow-->
-          <!--            sortable="custom"-->
-          <!--          />-->
-          <!--          <el-table-column-->
-          <!--            prop="eqpname"-->
-          <!--            label="璁惧淇℃伅"-->
-          <!--            min-width="110"-->
-          <!--            show-tooltip-when-overflow-->
-          <!--            sortable="custom"-->
-          />
-          <el-table-column
-            prop="username"
-            min-width="110"
-            label="涓婁紶浜哄憳"
-            sortable="custom"
-          >
-            <template slot-scope="{row}">
-              <div v-if="row.username">{{ row.username }}</div>
-              <div v-else>/</div>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="lm_date"
-            label="涓婁紶鏃堕棿"
-            min-width="160"
-            sortable="custom"
-          >
-            <template slot-scope="{row}">
-              <div v-if="row.lm_date">{{ row.lm_date }}</div>
-              <div v-else>/</div>
-            </template>
-          </el-table-column>
-          <el-table-column
-            label="鎿嶄綔"
-            width="120"
-            fixed="right"
-          >
-            <template slot-scope="{row}">
-              <div class="operationClass">
-                <el-tooltip v-del-tab-index class="item" effect="dark" content="棰勮" placement="top">
-                  <i
-                    class="el-icon-files"
-                    style="cursor: pointer;color:#42b983;margin-right: 15px"
-                    @click="check(row)"
-                  />
-                </el-tooltip>
-                <el-tooltip v-del-tab-index class="item" effect="dark" content="鍒犻櫎" placement="top">
-                  <i class="el-icon-delete" style="cursor: pointer;color:#42b983;" @click="del(row)" />
-                </el-tooltip>
-              </div>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-      <!--鍒嗛〉-->
-      <pagination
-        :total="total"
-        :page.sync="form.page"
-        :limit.sync="form.rows"
-        align="right"
-        layout="total,prev, pager, next,sizes"
-        popper-class="select_bottom"
-        @pagination="getProcessSopSearch"
-      />
-    </div>
-
-    <el-dialog
-      v-el-drag-dialog
-      title="鏂囦欢涓婁紶"
-      :visible.sync="dialogVisible"
-      width="800px"
-      :close-on-click-modal="false"
-      top="15vh"
-      @closed="handleClose"
-      @close="handleClose"
-    >
-      <el-form ref="dialogForm" inline :rules="dialogFormRules" :model="dialogForm" label-width="80px">
-        <el-form-item label="浜у搧淇℃伅" prop="partcode">
-          <el-select
-            v-model="dialogForm.partcode"
-            style="width: 200px"
-            placeholder="璇烽�夋嫨"
-            filterable
-            :popper-append-to-body="false"
-            @change="partcodeChange"
-          >
-            <el-option
-              v-for="item in partcodeArr"
-              :key="item.partcode"
-              :label="item.partname+' / '+item.partcode"
-              :value="item.partcode"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item
-          v-if="mesSetting.route"
-          label="宸ヨ壓淇℃伅"
-          prop="route"
-        >
-          <el-select
-            v-model="dialogForm.route"
-            style="width: 200px"
-            placeholder="璇烽�夋嫨"
-            filterable
-            collapse-tags
-            :popper-append-to-body="false"
-            @change="routeChange"
-          >
-            <el-option
-              v-for="item in routeArr"
-              :key="item.route_code"
-              :label="item.route_name"
-              :value="item.route_code"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="宸ュ簭淇℃伅" prop="stepcode">
-          <el-select
-            v-model="dialogForm.stepcode"
-            style="width: 200px"
-            placeholder="璇烽�夋嫨"
-            filterable
-            collapse-tags
-            :popper-append-to-body="false"
-            @change="stepcodeChange"
-          >
-            <el-option
-              v-for="item in stepcodeArr"
-              :key="item.step_code"
-              :label="item.step_name"
-              :value="item.step_code"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="鏂囦欢绫诲瀷" prop="filetypecode">
-          <el-select
-            v-model="dialogForm.filetypecode"
-            style="width: 200px"
-            placeholder="璇烽�夋嫨"
-            filterable
-            :popper-append-to-body="false"
-            @change="stepcodeChange"
-          >
-            <el-option
-              v-for="item in filetypeArr"
-              :key="item.code"
-              :label="item.name"
-              :value="item.code"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="鐗堟湰鍙�">
-          <el-input v-model="dialogForm.fileversion" disabled style="width: 200px" />
-        </el-form-item>
-        <el-form-item label="鏂囦欢涓婁紶" prop="Files">
-          <div style="width: 200px;">
-            <el-upload
-              ref="uploadFileRef"
-              style="display: inline-block;"
-              action="#"
-              :limit="1"
-              :show-file-list="true"
-              :on-exceed="handleExceed"
-              :auto-upload="false"
-              :multiple="false"
-              accept=".mp4,.pdf,.png,.jpeg,.jpg,.svg,.txt,.xlsx,.xls"
-            >
-              <!--              accept=".mp4,.pdf"-->
-              <el-button
-                v-waves
-                type="primary"
-                style="width: 200px;display: flex;justify-content: center"
-                icon="el-icon-upload2"
-              >閫夋嫨鏂囦欢
-              </el-button>
-            </el-upload>
-          </div>
-        </el-form-item>
-      </el-form>
-      <span slot="footer" class="dialog-footer">
-        <div class="footerButton">
-          <el-button v-waves @click="dialogVisibleCancel">鍙� 娑�</el-button>
-          <el-button
-            v-waves
-            type="primary"
-            :loading="$store.state.app.buttonIsDisabled"
-            :disabled="$store.state.app.buttonIsDisabled"
-            @click="dialogVisibleConfirm"
-          >纭� 瀹�</el-button>
-        </div>
-      </span>
-    </el-dialog>
-
-  </div>
-</template>
-
-<script>
-import Pagination from '@/components/Pagination'
-import { ProcessSopAddSeave, ProcessSopDeleteSeave, ProcessSopSearch, ProcessSopMaxVersion } from '@/api/SopManager'
-import waves from '@/directive/waves'
-import elDragDialog from '@/directive/el-drag-dialog'
-import { PartSelect } from '@/api/ProductModel'
-import { PartSelectRpute, RouteSelectStep } from '@/api/basicSettings'
-
-export default {
-  name: 'SopRoute',
-  directives: { waves, elDragDialog },
-  components: {
-    Pagination
-  },
-  data() {
-    return {
-      mouseHoverType: 'mouseout',
-      isExpandForm: false,
-      mainHeight: 0,
-      tableHeight: 0,
-      form: {
-        check: 'N', // 鏄惁閫変腑鏈�楂樼増鏈�
-        search: '', // 鎼滅储鍏抽敭瀛�
-        prop: 'lm_date', // 鎺掑簭瀛楁
-        order: 'desc', // 鎺掑簭瀛楁
-        page: 1, // 绗嚑椤�
-        rows: 20 // 姣忛〉澶氬皯鏉�
-      },
-      checked: false,
-
-      total: 10,
-      tableData: [],
-      dialogVisible: false,
-      dialogForm: {
-        partcode: '', // 璁惧绫诲瀷缂栫爜
-        route: '', // 鐗╂枡缂栫爜
-        stepcode: '',
-        defilename: '',
-        filetypecode: '', // 鏂囦欢绫诲瀷缂栫爜
-        Files: '', // 鏂囦欢
-
-        fileversion: ''// 鏂囦欢鐗堟湰鍙�
-      },
-      dialogFormRules: {
-        partcode: [
-          { required: true, message: '璇烽�夋嫨璁惧绫诲瀷', trigger: ['blur', 'change'] }
-        ],
-        route: [
-          { required: true, message: '璇烽�夋嫨璁惧淇℃伅', trigger: ['blur', 'change'] }
-        ],
-        stepcode: [
-          { required: true, message: '璇烽�夋嫨宸ュ簭淇℃伅', trigger: ['blur', 'change'] }
-        ],
-        defilename: [
-          { required: true, message: '璇疯緭鍏ュ悕鏂囦欢绉�', trigger: ['blur', 'change'] }
-        ],
-        filetypecode: [
-          { required: true, message: '璇烽�夋嫨鏂囦欢绫诲瀷', trigger: ['blur', 'change'] }
-        ]
-      },
-      partcodeArr: [],
-      routeArr: [],
-      stepcodeArr: [],
-      filetypeArr: [// 鏂囦欢绫诲瀷涓嬫媺鏁扮粍
-        { code: 'P001', name: '浣滀笟鎸囧涔�' },
-        { code: 'P002', name: '妫�楠屾寚瀵间功' },
-        { code: 'P003', name: '鍥剧焊' }
-      ],
-      mesSetting: JSON.parse(localStorage.getItem('mesSetting'))
-
-    }
-  },
-
-  activated() {
  window.addEventListener('resize', this.getHeight)
  this.getHeight()
},
created() {
-    this.getProcessSopSearch()
-    this.getPartSelect()
-  },
-  mounted() {
-    window.addEventListener('resize', this.getHeight)
-    this.getHeight()
-  },
-  methods: {
-    async getPartSelect() {
-      const { data: res } = await PartSelect()
-      this.partcodeArr = res
-    },
-    async getProcessSopSearch() {
-      const res = await ProcessSopSearch(this.form)
-      this.tableData = res.data
-      this.total = res.count
-    },
-
-    // 鎺掑簭鏀瑰彉鏃�
-    sortChange({ column, prop, order }) {
-      if (order === 'descending') {
-        order = 'desc'
-      } else if (order === 'ascending') {
-        order = 'asc'
-      } else {
-        order = 'desc'
-      }
-      this.form.order = order
-      this.form.prop = prop
-      this.getProcessSopSearch()
-    },
-    // 鏌ヨ
-    search() {
-      this.getProcessSopSearch()
-    },
-    // 鏈�鏂扮増鏈敼鍙樻椂瑙﹀彂
-    checkedChange(val) {
-      this.form.check = val ? 'Y' : 'N'
-      this.getProcessSopSearch()
-    },
-    // 鏂囦欢鏁伴噺瓒呰繃闄愬畾瑙﹀彂
-    handleExceed() {
-      this.$message.info('鏆備笉鏀寔澶氭枃浠朵笂浼狅紒')
-    },
-    async partcodeChange(partcode) {
-      const { data: res } = await PartSelectRpute({ partcode })
-      if (this.mesSetting.route) {
-        this.routeArr = res
-      } else {
-        this.stepcodeArr = res
-      }
-      this.dialogForm.route = ''
-      this.dialogForm.stepcode = ''
-      await this.stepcodeChange()
-    },
-    async routeChange() {
-      const data = {
-        partcode: this.dialogForm.partcode,
-        routecode: this.dialogForm.route
-      }
-      const { data: res } = await RouteSelectStep(data)
-      this.stepcodeArr = res
-      this.dialogForm.stepcode = ''
-      await this.stepcodeChange()
-    },
-    async stepcodeChange() {
-      if (this.dialogForm.partcode && this.dialogForm.stepcode && this.dialogForm.filetypecode) {
-        const data = {
-          partcode: this.dialogForm.partcode,
-          routecode: this.dialogForm.route,
-          stepcode: this.dialogForm.stepcode,
-          filetypecode: this.dialogForm.filetypecode
-        }
-        const { data: res } = await ProcessSopMaxVersion(data)
-        this.dialogForm.fileversion = res
-      }
-    },
-
-    // 閲嶇疆
-    reset() {
-      this.form.search = ''
-      this.getProcessSopSearch()
-    },
-    // 鏂板鎸夐挳
-    add() {
-      this.dialogVisible = true
-    },
-    // 棰勮
-    async check(row) {
-      window.open(process.env.VUE_APP_BASE_API_FILE + row.filepath)
-    },
-    // 鍒犻櫎鎸夐挳
-    async del(row) {
-      this.$confirm('鏄惁纭鍒犻櫎?', '鎻愮ず', {
-        confirmButtonText: '纭畾',
-        cancelButtonText: '鍙栨秷',
-        type: 'warning'
-      }).then(() => {
-        const data = {
-          id: row.id,
-          partcode: row.materielcode,
-          routecode: row.routecode ? row.routecode : '',
-          stepcode: row.stepcode,
-          filepath: row.filepath
-        }
-        ProcessSopDeleteSeave(data).then(res => {
-          if (res.code === '200') {
-            this.$message.success('鍒犻櫎鎴愬姛!')
-            if (this.form.page > 1 && this.tableData.length === 1) {
-              this.form.page--
-            }
-            this.getProcessSopSearch()
-          }
-        })
-      }).catch(() => {
-        this.$message.info('宸插彇娑堝垹闄�')
-      })
-    },
-    // 瀵硅瘽妗嗗叧闂簨浠�
-    handleClose() {
-      this.dialogForm.partcode = ''
-      this.dialogForm.route = ''
-      this.dialogForm.defilename = ''
-      this.dialogForm.filetypecode = ''
-      this.dialogForm.fileversion = ''
-      this.dialogForm.stepcode = ''
-      this.dialogForm.Files = ''
-      this.$refs.uploadFileRef.clearFiles()
-      this.$refs.dialogForm.clearValidate()
-    },
-    // 瀵硅瘽妗嗗彇娑�
-    dialogVisibleCancel() {
-      this.dialogVisible = false
-      this.$store.state.app.buttonIsDisabled = false
-    },
-    // 瀵硅瘽妗嗙‘璁�
-    dialogVisibleConfirm() {
-      console.log(this.$refs.uploadFileRef.uploadFiles[0])
-      if (!this.$refs.uploadFileRef.uploadFiles[0]) {
-        this.$message.info('璇烽�夋嫨鏂囦欢涓婁紶锛�')
-      }
-
-      const isLt100M = this.$refs.uploadFileRef.uploadFiles[0].size / 1024 / 1024 <= 1024
-      if (!isLt100M) {
-        return this.$message.info('璇锋鏌ワ紝涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃1024MB!')
-      }
-
-      this.$refs.dialogForm.validate(valid => {
-        if (valid) {
-          const formData = new FormData()
-          formData.append('partcode', this.dialogForm.partcode)
-          formData.append('routecode', this.dialogForm.route)
-          formData.append('stepcode', this.dialogForm.stepcode)
-          formData.append('filename', this.$refs.uploadFileRef.uploadFiles[0].name)
-          formData.append('filetypecode', this.dialogForm.filetypecode)
-          formData.append('version', this.dialogForm.fileversion)
-          formData.append('file', this.$refs.uploadFileRef.uploadFiles[0].raw)
-          // for (var [key, value] of formData) {
-          //   console.log(key, value)
-          // }
-          this.$store.state.app.buttonIsDisabled = true
-          ProcessSopAddSeave(formData).then(res => {
-            if (res.code === '200') {
-              this.$message.success('鏂囦欢涓婁紶鎴愬姛锛�')
-              this.dialogVisible = false
-              this.$store.state.app.buttonIsDisabled = false
-              this.getProcessSopSearch()
-            } else {
-              this.$message.error('鏂囦欢涓婁紶澶辫触锛�')
-              this.$store.state.app.buttonIsDisabled = false
-            }
-          })
-        }
-      })
-    },
-    // 鑾峰彇椤甸潰楂樺害
-    getHeight() {
-      this.$nextTick(() => {
-        this.mainHeight = window.innerHeight - 85
-        this.tableHeight = this.mainHeight - 185
-        this.$refs.tableDataRef.doLayout()
-      })
-    },
-    tableRowClassName({ row, rowIndex }) {
-      return 'custom-row'
-    }
-  }
-}
-</script>
-
-<style>
-.el-table .custom-row {
-  background: #f8f8fa;
-}
-</style>
+<template>
+  <div>
+    <div class="body" :style="{height:mainHeight+'px'}">
+      <div class="bodyTopButtonGroup" style="justify-content: space-between;align-items: center">
+        <el-button v-waves icon="el-icon-circle-plus-outline" type="primary" @click="add">鏂囦欢涓婁紶</el-button>
+        <div style="display: flex;align-items: center">
+          <el-form
+            ref="form"
+            :model="form"
+            label-width="100px"
+            inline
+          >
+            <div class="elForm" style="justify-content: flex-start">
+              <el-form-item style="margin-right: 30px">
+                <el-checkbox v-model="checked" @change="checkedChange">鏈�鏂扮増鏈�</el-checkbox>
+              </el-form-item>
+              <el-form-item>
+                <el-input v-model="form.search" placeholder="璇疯緭鍏ュ叧閿瓧" style="width: 260px" />
+              </el-form-item>
+            </div>
+          </el-form>
+          <el-button v-waves type="primary" style="margin-left: 30px" icon="el-icon-search" @click="search">鏌ヨ
+          </el-button>
+          <el-button v-waves type="info" icon="el-icon-refresh" @click="reset">閲嶇疆</el-button>
+        </div>
+      </div>
+
+      <div class="elTableDiv">
+        <el-table
+          ref="tableDataRef"
+          class="tableFixed"
+          :data="tableData"
+          :height="isExpandForm?tableHeight:(tableHeight+40)+'px'"
+          border
+          :row-class-name="tableRowClassName"
+          :style="{width: 100+'%',height:isExpandForm?tableHeight:(tableHeight+40)+'px',}"
+          highlight-current-row
+          :header-cell-style="this.$headerCellStyle"
+          :cell-style="this.$cellStyle"
+          @sort-change="sortChange"
+        >
+          <el-table-column
+            prop="rowNum"
+            width="50"
+            fixed
+            label="搴忓彿"
+          />
+
+          <el-table-column
+            prop="filename"
+            label="鏂囦欢鍚嶇О"
+            min-width="160"
+            show-tooltip-when-overflow
+            sortable="custom"
+          >
+            <template slot-scope="{row}">
+              <div v-if="row.filename">{{ row.filename }}</div>
+              <div v-else>/</div>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="filetypename"
+            label="鏂囦欢绫诲瀷"
+            min-width="110"
+            sortable="custom"
+          >
+            <template slot-scope="{row}">
+              <div v-if="row.filetypename">{{ row.filetypename }}</div>
+              <div v-else>/</div>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="version"
+            label="鐗堟湰鍙�"
+            min-width="110"
+            sortable="custom"
+          >
+            <template slot-scope="{row}">
+              <div v-if="row.version">{{ row.version }}</div>
+              <div v-else>/</div>
+            </template>
+          </el-table-column>
+
+          <el-table-column
+            prop="materielcode"
+            label="浜у搧缂栫爜"
+
+            show-tooltip-when-overflow
+            sortable="custom"
+          />
+          <el-table-column
+            prop="materielname"
+            label="浜у搧鍚嶇О"
+
+            show-tooltip-when-overflow
+            sortable="custom"
+          />
+          <el-table-column
+            v-if="mesSetting.route"
+            prop="routename"
+            label="宸ヨ壓璺嚎"
+
+            show-tooltip-when-overflow
+            sortable="custom"
+          />
+          <el-table-column
+            prop="stepname"
+            label="宸ュ簭鍚嶇О"
+
+            show-tooltip-when-overflow
+            sortable="custom"
+          />
+          <!--          <el-table-column-->
+          <!--            prop="eqptypename"-->
+          <!--            label="璁惧绫诲瀷"-->
+          <!--            min-width="110"-->
+          <!--            show-tooltip-when-overflow-->
+          <!--            sortable="custom"-->
+          <!--          />-->
+          <!--          <el-table-column-->
+          <!--            prop="eqpname"-->
+          <!--            label="璁惧淇℃伅"-->
+          <!--            min-width="110"-->
+          <!--            show-tooltip-when-overflow-->
+          <!--            sortable="custom"-->
+          />
+          <el-table-column
+            prop="username"
+            min-width="110"
+            label="涓婁紶浜哄憳"
+            sortable="custom"
+          >
+            <template slot-scope="{row}">
+              <div v-if="row.username">{{ row.username }}</div>
+              <div v-else>/</div>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="lm_date"
+            label="涓婁紶鏃堕棿"
+            min-width="160"
+            sortable="custom"
+          >
+            <template slot-scope="{row}">
+              <div v-if="row.lm_date">{{ row.lm_date }}</div>
+              <div v-else>/</div>
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="鎿嶄綔"
+            width="120"
+            fixed="right"
+          >
+            <template slot-scope="{row}">
+              <div class="operationClass">
+                <el-tooltip v-del-tab-index class="item" effect="dark" content="棰勮" placement="top">
+                  <i
+                    class="el-icon-files"
+                    style="cursor: pointer;color:#42b983;margin-right: 15px"
+                    @click="check(row)"
+                  />
+                </el-tooltip>
+                <el-tooltip v-del-tab-index class="item" effect="dark" content="鍒犻櫎" placement="top">
+                  <i class="el-icon-delete" style="cursor: pointer;color:#42b983;" @click="del(row)" />
+                </el-tooltip>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <!--鍒嗛〉-->
+      <pagination
+        :total="total"
+        :page.sync="form.page"
+        :limit.sync="form.rows"
+        align="right"
+        layout="total,prev, pager, next,sizes"
+        popper-class="select_bottom"
+        @pagination="getProcessSopSearch"
+      />
+    </div>
+
+    <el-dialog
+      v-el-drag-dialog
+      title="鏂囦欢涓婁紶"
+      :visible.sync="dialogVisible"
+      width="800px"
+      :close-on-click-modal="false"
+      top="15vh"
+      @closed="handleClose"
+      @close="handleClose"
+    >
+      <el-form ref="dialogForm" inline :rules="dialogFormRules" :model="dialogForm" label-width="80px">
+        <el-form-item label="浜у搧淇℃伅" prop="partcode">
+          <el-select
+            v-model="dialogForm.partcode"
+            style="width: 200px"
+            placeholder="璇烽�夋嫨"
+            filterable
+            :popper-append-to-body="false"
+            @change="partcodeChange"
+          >
+            <el-option
+              v-for="item in partcodeArr"
+              :key="item.partcode"
+              :label="item.partname+' / '+item.partcode"
+              :value="item.partcode"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          v-if="mesSetting.route"
+          label="宸ヨ壓淇℃伅"
+          prop="route"
+        >
+          <el-select
+            v-model="dialogForm.route"
+            style="width: 200px"
+            placeholder="璇烽�夋嫨"
+            filterable
+            collapse-tags
+            :popper-append-to-body="false"
+            @change="routeChange"
+          >
+            <el-option
+              v-for="item in routeArr"
+              :key="item.route_code"
+              :label="item.route_name"
+              :value="item.route_code"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="宸ュ簭淇℃伅" prop="stepcode">
+          <el-select
+            v-model="dialogForm.stepcode"
+            style="width: 200px"
+            placeholder="璇烽�夋嫨"
+            filterable
+            collapse-tags
+            :popper-append-to-body="false"
+            @change="stepcodeChange"
+          >
+            <el-option
+              v-for="item in stepcodeArr"
+              :key="item.step_code"
+              :label="item.step_name"
+              :value="item.step_code"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="鏂囦欢绫诲瀷" prop="filetypecode">
+          <el-select
+            v-model="dialogForm.filetypecode"
+            style="width: 200px"
+            placeholder="璇烽�夋嫨"
+            filterable
+            :popper-append-to-body="false"
+            @change="stepcodeChange"
+          >
+            <el-option
+              v-for="item in filetypeArr"
+              :key="item.code"
+              :label="item.name"
+              :value="item.code"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="鐗堟湰鍙�">
+          <el-input v-model="dialogForm.fileversion" disabled style="width: 200px" />
+        </el-form-item>
+        <el-form-item label="鏂囦欢涓婁紶" prop="Files">
+          <div style="width: 200px;">
+            <el-upload
+              ref="uploadFileRef"
+              style="display: inline-block;"
+              action="#"
+              :limit="1"
+              :show-file-list="true"
+              :on-exceed="handleExceed"
+              :auto-upload="false"
+              :multiple="false"
+              accept=".mp4,.pdf,.png,.jpeg,.jpg,.svg,.txt,.xlsx,.xls"
+            >
+              <!--              accept=".mp4,.pdf"-->
+              <el-button
+                v-waves
+                type="primary"
+                style="width: 200px;display: flex;justify-content: center"
+                icon="el-icon-upload2"
+              >閫夋嫨鏂囦欢
+              </el-button>
+            </el-upload>
+          </div>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <div class="footerButton">
+          <el-button v-waves @click="dialogVisibleCancel">鍙� 娑�</el-button>
+          <el-button
+            v-waves
+            type="primary"
+            :loading="$store.state.app.buttonIsDisabled"
+            :disabled="$store.state.app.buttonIsDisabled"
+            @click="dialogVisibleConfirm"
+          >纭� 瀹�</el-button>
+        </div>
+      </span>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+import Pagination from '@/components/Pagination'
+import { ProcessSopAddSeave, ProcessSopDeleteSeave, ProcessSopSearch, ProcessSopMaxVersion } from '@/api/SopManager'
+import waves from '@/directive/waves'
+import elDragDialog from '@/directive/el-drag-dialog'
+import { PartSelect } from '@/api/ProductModel'
+import { PartSelectRpute, RouteSelectStep } from '@/api/basicSettings'
+
+export default {
+  name: 'SopRoute',
+  directives: { waves, elDragDialog },
+  components: {
+    Pagination
+  },
+  data() {
+    return {
+      mouseHoverType: 'mouseout',
+      isExpandForm: false,
+      mainHeight: 0,
+      tableHeight: 0,
+      form: {
+        check: 'N', // 鏄惁閫変腑鏈�楂樼増鏈�
+        search: '', // 鎼滅储鍏抽敭瀛�
+        prop: 'lm_date', // 鎺掑簭瀛楁
+        order: 'desc', // 鎺掑簭瀛楁
+        page: 1, // 绗嚑椤�
+        rows: 20 // 姣忛〉澶氬皯鏉�
+      },
+      checked: false,
+
+      total: 10,
+      tableData: [],
+      dialogVisible: false,
+      dialogForm: {
+        partcode: '', // 璁惧绫诲瀷缂栫爜
+        route: '', // 鐗╂枡缂栫爜
+        stepcode: '',
+        defilename: '',
+        filetypecode: '', // 鏂囦欢绫诲瀷缂栫爜
+        Files: '', // 鏂囦欢
+
+        fileversion: ''// 鏂囦欢鐗堟湰鍙�
+      },
+      dialogFormRules: {
+        partcode: [
+          { required: true, message: '璇烽�夋嫨璁惧绫诲瀷', trigger: ['blur', 'change'] }
+        ],
+        route: [
+          { required: true, message: '璇烽�夋嫨璁惧淇℃伅', trigger: ['blur', 'change'] }
+        ],
+        stepcode: [
+          { required: true, message: '璇烽�夋嫨宸ュ簭淇℃伅', trigger: ['blur', 'change'] }
+        ],
+        defilename: [
+          { required: true, message: '璇疯緭鍏ュ悕鏂囦欢绉�', trigger: ['blur', 'change'] }
+        ],
+        filetypecode: [
+          { required: true, message: '璇烽�夋嫨鏂囦欢绫诲瀷', trigger: ['blur', 'change'] }
+        ]
+      },
+      partcodeArr: [],
+      routeArr: [],
+      stepcodeArr: [],
+      filetypeArr: [// 鏂囦欢绫诲瀷涓嬫媺鏁扮粍
+        { code: 'P001', name: '浣滀笟鎸囧涔�' },
+        { code: 'P002', name: '妫�楠屾寚瀵间功' },
+        { code: 'P003', name: '鍥剧焊' }
+      ],
+      mesSetting: JSON.parse(localStorage.getItem('mesSetting'))
+
+    }
+  },
+
+  activated() {
+    window.addEventListener('resize', this.getHeight)
+    this.getHeight()
+    this.getProcessSopSearch()
+    this.getPartSelect()
+  },
+  created() {
+    this.getProcessSopSearch()
+    this.getPartSelect()
+  },
+  mounted() {
+    window.addEventListener('resize', this.getHeight)
+    this.getHeight()
+  },
+  methods: {
+    async getPartSelect() {
+      const { data: res } = await PartSelect()
+      this.partcodeArr = res
+    },
+    async getProcessSopSearch() {
+      const res = await ProcessSopSearch(this.form)
+      this.tableData = res.data
+      this.total = res.count
+    },
+
+    // 鎺掑簭鏀瑰彉鏃�
+    sortChange({ column, prop, order }) {
+      if (order === 'descending') {
+        order = 'desc'
+      } else if (order === 'ascending') {
+        order = 'asc'
+      } else {
+        order = 'desc'
+      }
+      this.form.order = order
+      this.form.prop = prop
+      this.getProcessSopSearch()
+    },
+    // 鏌ヨ
+    search() {
+      this.getProcessSopSearch()
+    },
+    // 鏈�鏂扮増鏈敼鍙樻椂瑙﹀彂
+    checkedChange(val) {
+      this.form.check = val ? 'Y' : 'N'
+      this.getProcessSopSearch()
+    },
+    // 鏂囦欢鏁伴噺瓒呰繃闄愬畾瑙﹀彂
+    handleExceed() {
+      this.$message.info('鏆備笉鏀寔澶氭枃浠朵笂浼狅紒')
+    },
+    async partcodeChange(partcode) {
+      const { data: res } = await PartSelectRpute({ partcode })
+      if (this.mesSetting.route) {
+        this.routeArr = res
+      } else {
+        this.stepcodeArr = res
+      }
+      this.dialogForm.route = ''
+      this.dialogForm.stepcode = ''
+      await this.stepcodeChange()
+    },
+    async routeChange() {
+      const data = {
+        partcode: this.dialogForm.partcode,
+        routecode: this.dialogForm.route
+      }
+      const { data: res } = await RouteSelectStep(data)
+      this.stepcodeArr = res
+      this.dialogForm.stepcode = ''
+      await this.stepcodeChange()
+    },
+    async stepcodeChange() {
+      if (this.dialogForm.partcode && this.dialogForm.stepcode && this.dialogForm.filetypecode) {
+        const data = {
+          partcode: this.dialogForm.partcode,
+          routecode: this.dialogForm.route,
+          stepcode: this.dialogForm.stepcode,
+          filetypecode: this.dialogForm.filetypecode
+        }
+        const { data: res } = await ProcessSopMaxVersion(data)
+        this.dialogForm.fileversion = res
+      }
+    },
+
+    // 閲嶇疆
+    reset() {
+      this.form.search = ''
+      this.getProcessSopSearch()
+    },
+    // 鏂板鎸夐挳
+    add() {
+      this.dialogVisible = true
+    },
+    // 棰勮
+    async check(row) {
+      window.open(process.env.VUE_APP_BASE_API_FILE + row.filepath)
+    },
+    // 鍒犻櫎鎸夐挳
+    async del(row) {
+      this.$confirm('鏄惁纭鍒犻櫎?', '鎻愮ず', {
+        confirmButtonText: '纭畾',
+        cancelButtonText: '鍙栨秷',
+        type: 'warning'
+      }).then(() => {
+        const data = {
+          id: row.id,
+          partcode: row.materielcode,
+          routecode: row.routecode ? row.routecode : '',
+          stepcode: row.stepcode,
+          filepath: row.filepath
+        }
+        ProcessSopDeleteSeave(data).then(res => {
+          if (res.code === '200') {
+            this.$message.success('鍒犻櫎鎴愬姛!')
+            if (this.form.page > 1 && this.tableData.length === 1) {
+              this.form.page--
+            }
+            this.getProcessSopSearch()
+          }
+        })
+      }).catch(() => {
+        this.$message.info('宸插彇娑堝垹闄�')
+      })
+    },
+    // 瀵硅瘽妗嗗叧闂簨浠�
+    handleClose() {
+      this.dialogForm.partcode = ''
+      this.dialogForm.route = ''
+      this.dialogForm.defilename = ''
+      this.dialogForm.filetypecode = ''
+      this.dialogForm.fileversion = ''
+      this.dialogForm.stepcode = ''
+      this.dialogForm.Files = ''
+      this.$refs.uploadFileRef.clearFiles()
+      this.$refs.dialogForm.clearValidate()
+    },
+    // 瀵硅瘽妗嗗彇娑�
+    dialogVisibleCancel() {
+      this.dialogVisible = false
+      this.$store.state.app.buttonIsDisabled = false
+    },
+    // 瀵硅瘽妗嗙‘璁�
+    dialogVisibleConfirm() {
+      console.log(this.$refs.uploadFileRef.uploadFiles[0])
+      if (!this.$refs.uploadFileRef.uploadFiles[0]) {
+        this.$message.info('璇烽�夋嫨鏂囦欢涓婁紶锛�')
+      }
+
+      const isLt100M = this.$refs.uploadFileRef.uploadFiles[0].size / 1024 / 1024 <= 1024
+      if (!isLt100M) {
+        return this.$message.info('璇锋鏌ワ紝涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃1024MB!')
+      }
+
+      this.$refs.dialogForm.validate(valid => {
+        if (valid) {
+          const formData = new FormData()
+          formData.append('partcode', this.dialogForm.partcode)
+          formData.append('routecode', this.dialogForm.route)
+          formData.append('stepcode', this.dialogForm.stepcode)
+          formData.append('filename', this.$refs.uploadFileRef.uploadFiles[0].name)
+          formData.append('filetypecode', this.dialogForm.filetypecode)
+          formData.append('version', this.dialogForm.fileversion)
+          formData.append('file', this.$refs.uploadFileRef.uploadFiles[0].raw)
+          // for (var [key, value] of formData) {
+          //   console.log(key, value)
+          // }
+          this.$store.state.app.buttonIsDisabled = true
+          ProcessSopAddSeave(formData).then(res => {
+            if (res.code === '200') {
+              this.$message.success('鏂囦欢涓婁紶鎴愬姛锛�')
+              this.dialogVisible = false
+              this.$store.state.app.buttonIsDisabled = false
+              this.getProcessSopSearch()
+            } else {
+              this.$message.error('鏂囦欢涓婁紶澶辫触锛�')
+              this.$store.state.app.buttonIsDisabled = false
+            }
+          })
+        }
+      })
+    },
+    // 鑾峰彇椤甸潰楂樺害
+    getHeight() {
+      this.$nextTick(() => {
+        this.mainHeight = window.innerHeight - 85
+        this.tableHeight = this.mainHeight - 185
+        this.$refs.tableDataRef.doLayout()
+      })
+    },
+    tableRowClassName({ row, rowIndex }) {
+      return 'custom-row'
+    }
+  }
+}
+</script>
+
+<style>
+.el-table .custom-row {
+  background: #f8f8fa;
+}
+</style>

--
Gitblit v1.9.3