产品

src/views/modules/common/attach-detail.vue

@@ -0,0 +1,65 @@
+<template>
+  <div>
+      <div class="my-title">附件列表</div>
+      <div v-if="attachList">
+        <e-desc column="3" style="margin-bottom: 20px">
+          <e-desc-item span="2" label="文件">
+            <div v-for="(item, index) in attachList" style="display: inline">
+              <span v-if="index > 0">, </span>
+              <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
+            </div>
+          </e-desc-item>
+        </e-desc>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="onChose">返回</el-button>
+      </span>
+    <!-- 文件预览 -->
+    <preview-component v-if="previewVisible" ref="preview"/>
+  </div>
+</template>
+
+<script>
+  import EDesc from '../common/e-desc'
+  import EDescItem from '../common/e-desc-item'
+  import { downloadUrl } from '@/api/file'
+  import UploadComponent from '../common/upload-component'
+  import PreviewComponent from '../common/preview-component'
+  export default {
+    name: 'attach-detail',
+    components: {
+      PreviewComponent,
+      UploadComponent,
+      EDesc,
+      EDescItem
+    },
+    data () {
+      return {
+        visible: false,
+        previewVisible: false,
+        attachList: [],
+        downloadUrl: downloadUrl
+      }
+    },
+    methods: {
+      onChose () {
+        this.$emit('onChose')
+      },
+      async init (attachList) {
+        this.visible = true
+        this.attachList = attachList
+      },
+      // 预览
+      previewFile (fileName, url) {
+        this.previewVisible = true
+        this.$nextTick(() => {
+          this.$refs.preview.init(fileName, url)
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>

src/views/modules/tech/product-detail.vue

@@ -34,10 +34,29 @@
         <e-desc-item label="产品类别">{{dataForm.productTypeValue}}</e-desc-item>
 
         <e-desc-item label="产品来源">{{dataForm.sourceName}}</e-desc-item>
-        <e-desc-item label="备注说明" span="2">{{dataForm.notes}}</e-desc-item>
-      </e-desc>
-      <e-desc title="产品图纸">
-        <upload-component :display="true" :display-title="false" :accept="'*'" :file-obj-list="fileList"/>
+
+        <e-desc-item v-if="fileList" label="产品图纸" span="3">
+          <div v-for="(item, index) in fileList" style="display: inline">
+            <span v-if="index > 0">,</span>
+            <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
+          </div>
+        </e-desc-item>
+
+        <e-desc-item v-if="dataForm.noticeChangeRecord && dataForm.noticeChangeRecord.attachList" label="所需文件资料" span="3">
+          <div v-for="(item, index) in dataForm.noticeChangeRecord.attachList" style="display: inline">
+            <span v-if="index > 0">,</span>
+            <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
+          </div>
+        </e-desc-item>
+
+        <e-desc-item v-if="dataForm.attachList" label="产品技术文件" span="3">
+          <div v-for="(item, index) in dataForm.attachList" style="display: inline">
+            <span v-if="index > 0">,</span>
+            <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
+          </div>
+        </e-desc-item>
+
+        <e-desc-item label="备注说明" span="2" style="min-height: 80px">{{dataForm.notes}}</e-desc-item>
       </e-desc>
       <e-desc title="组合小产品">
         <el-table
@@ -123,8 +142,9 @@
     <span slot="footer" class="dialog-footer">
       <el-button @click="onChose">返回</el-button>
     </span>
+    <!-- 文件预览 -->
+    <preview-component v-if="previewVisible" ref="preview"/>
   </div>
-  <!-- </el-dialog> -->
 </template>
 
 <script>
@@ -134,15 +154,21 @@
   import uploadComponent from '../common/upload-component'
   import { getProductDetail } from '@/api/product'
   import ApproveComponent from '../common/approve-component'
-  export default {
+  import PreviewComponent from '../common/preview-component'
+export default {
     name: 'product-detail',
     components: {
-      EDesc, EDescItem, uploadComponent, ApproveComponent
+      PreviewComponent,
+      EDesc,
+      EDescItem,
+      uploadComponent,
+      ApproveComponent
     },
     data () {
       return {
         visible: false,
         isFlow: false,
+        previewVisible: false,
         id: 0,
         dataForm: {},
         materialList: [],
@@ -192,7 +218,7 @@
                 if (item.attachList) {
                   item.attachList.forEach((item1) => {
                     this.fileList.push({
-                      name: item1.fileName,
+                      fileName: item1.fileName,
                       url: item1.url,
                       id: item1.url
                     })
@@ -217,6 +243,13 @@
       approveFinished () {
         this.onChose()
         this.$emit('approveFinished')
+      },
+      // 预览
+      previewFile (fileName, url) {
+        this.previewVisible = true
+        this.$nextTick(() => {
+          this.$refs.preview.init(fileName, url)
+        })
       }
     }
   }

src/views/modules/tech/product-management.vue

@@ -1,7 +1,7 @@
 <!-- 产品管理 -->
 <template>
   <div class="product-management">
-    <template v-if="!addOrUpdateVisible && !detailVisible && !craftsVisible && !drawVisible">
+    <template v-if="!addOrUpdateVisible && !attachVisible && !detailVisible && !craftsVisible && !drawVisible && !changeVisible">
       <el-form :inline="true" :model="dataForm" @keyup.enter.native="search()">
         <el-form-item label="名称">
           <el-input v-model="dataForm.productName" placeholder="产品名称" clearable/>
@@ -47,7 +47,7 @@
           prop="productName"
           header-align="center"
           align="center"
-          min-width="120"
+          min-width="140"
           :show-tooltip-when-overflow="true"
           label="产品名称">
         </el-table-column>
@@ -55,6 +55,7 @@
           prop="productType"
           header-align="center"
           align="center"
+          min-width="120"
           :formatter="typeFormat"
           label="产品类别">
         </el-table-column>
@@ -62,6 +63,7 @@
           prop="isCompose"
           header-align="center"
           align="center"
+          min-width="120"
           :formatter="composeFormat"
           label="是否组合产品">
         </el-table-column>
@@ -74,26 +76,30 @@
           label="来源">
         </el-table-column>
         <el-table-column
-          prop="createTime"
           header-align="center"
           align="center"
-          min-width="160"
-          label="创建时间">
+          min-width="140"
+          :show-overflow-tooltip="true"
+          label="更改说明">
+          <template slot-scope="scope">
+            <span>{{scope.row.noticeChangeRecord?scope.row.noticeChangeRecord.description:''}}</span>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="creatorName"
           header-align="center"
           align="center"
-          min-width="100"
-          label="创建人">
+          label="更改单">
+          <template slot-scope="scope">
+            <el-button :disabled="!scope.row.noticeChangeRecord || !scope.row.noticeChangeRecord.attachList || scope.row.noticeChangeRecord.attachList.length === 0" type="text" size="small" @click="changeDetails(scope.row)">查看</el-button>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="notes"
           header-align="center"
           align="center"
-          min-width="180"
-          :show-overflow-tooltip="true"
-          label="备注">
+          label="技术文件">
+          <template slot-scope="scope">
+            <el-button :disabled="!scope.row.attachList || scope.row.attachList.length === 0" type="text" size="small" @click="attachDetails(scope.row)">查看</el-button>
+          </template>
         </el-table-column>
         <el-table-column
           header-align="center"
@@ -111,6 +117,28 @@
             <el-button :disabled="!scope.row.techId" type="text" size="small" @click="techDetails(scope.row.techId)">查看</el-button>
           </template>
         </el-table-column>
+        <el-table-column
+          prop="createTime"
+          header-align="center"
+          align="center"
+          min-width="160"
+          label="创建时间">
+        </el-table-column>
+        <el-table-column
+          prop="creatorName"
+          header-align="center"
+          align="center"
+          min-width="100"
+          label="创建人">
+        </el-table-column>
+        <el-table-column
+          prop="notes"
+          header-align="center"
+          align="center"
+          min-width="180"
+          :show-overflow-tooltip="true"
+          label="备注">
+        </el-table-column>
         <el-table-column
           fixed="right"
           header-align="center"
@@ -138,6 +166,8 @@
     <detail v-if="detailVisible" ref="detail" @onChose="onChose"/>
     <crafts-detail v-if="craftsVisible" ref="craftsDetail" @onChose="onChose"/>
     <product-draw-detail v-if="drawVisible" ref="drawDetail" @onChose="onChose"/>
+    <attach-detail v-if="changeVisible" ref="changeDetail" @onChose="onChose"/>
+    <attach-detail v-if="attachVisible" ref="attachDetail" @onChose="onChose"/>
   </div>
 </template>
 
@@ -148,9 +178,11 @@
   import { getProductList } from '@/api/product'
   import CraftsDetail from './crafts-detail'
   import ProductDrawDetail from './product-draw-detail'
-  export default {
+  import AttachDetail from '../common/attach-detail'
+export default {
     name: 'product-management',
     components: {
+      AttachDetail,
       ProductDrawDetail,
       CraftsDetail,
       AddOrUpdate,
@@ -159,9 +191,11 @@
     data () {
       return {
         addOrUpdateVisible: false,
+        attachVisible: false,
         detailVisible: false,
         craftsVisible: false,
         drawVisible: false,
+        changeVisible: false,
         dataForm: {},
         dataList: [],
         pageIndex: 1,
@@ -180,9 +214,11 @@
     methods: {
       onChose () {
         this.addOrUpdateVisible = false
+        this.attachVisible = false
         this.detailVisible = false
         this.craftsVisible = false
         this.drawVisible = false
+        this.changeVisible = false
       },
       // 获取产品类别字典
       getTypeList () {
@@ -306,6 +342,20 @@
         this.$nextTick(() => {
           this.$refs.craftsDetail.init(id)
         })
+      },
+      // 产品更改通知单
+      changeDetails (row) {
+        this.changeVisible = true
+        this.$nextTick(() => {
+          this.$refs.changeDetail.init(row.noticeChangeRecord.attachList)
+        })
+      },
+      // 附件
+      attachDetails (row) {
+        this.attachVisible = true
+        this.$nextTick(() => {
+          this.$refs.attachDetail.init(row.attachList)
+        })
       }
     }
   }