图纸列表：展示附件

src/views/modules/device/repair-list.vue

@@ -4,31 +4,19 @@
       <!-- 查询、新增操作 -->
       <el-form :inline="true" :model="dataForm" @keyup.enter.native="search()">
         <el-form-item label="名称/编号">
-          <el-input v-model="dataForm.name" placeholder="名称/编号" clearable/>
+          <el-input v-model="dataForm.name" placeholder="名称/编号" clearable />
         </el-form-item>
         <el-form-item label="报修人">
-          <user-component v-model="dataForm.creatorId"/>
+          <user-component v-model="dataForm.creatorId" />
         </el-form-item>
         <el-form-item label="报修日期">
-          <el-date-picker
-            v-model="dataForm.date"
-            value-format="yyyy-MM-dd HH:mm:ss"
-            type="daterange"
-            range-separator="至"
-            start-placeholder="开始日期"
-            end-placeholder="结束日期">
+          <el-date-picker v-model="dataForm.date" value-format="yyyy-MM-dd HH:mm:ss" type="daterange"
+            range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
           </el-date-picker>
         </el-form-item>
         <el-form-item label="设备状态">
-          <el-select
-            v-model="dataForm.state"
-            remote
-            placeholder="请选择">
-            <el-option
-              v-for="item in optionsState"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value">
+          <el-select v-model="dataForm.state" remote placeholder="请选择">
+            <el-option v-for="item in optionsState" :key="item.value" :label="item.label" :value="item.value">
             </el-option>
           </el-select>
         </el-form-item>
@@ -37,126 +25,66 @@
         </el-form-item>
       </el-form>
       <!-- 数据表格 -->
-      <el-table
-        :data="dataList"
-        border
-        v-loading="dataListLoading"
-        style="width: 100%;">
-        <el-table-column
-          label="序号"
-          type="index"
-          width="50"
-          align="center">
+      <el-table :data="dataList" border v-loading="dataListLoading" style="width: 100%;">
+        <el-table-column label="序号" type="index" width="50" align="center">
         </el-table-column>
-        <el-table-column
-          prop="equipmentName"
-          header-align="center"
-          align="center"
-          min-width="140"
-          :show-overflow-tooltip="true"
-          label="设备名称">
+        <el-table-column prop="equipmentName" header-align="center" align="center" min-width="140"
+          :show-overflow-tooltip="true" label="设备名称">
         </el-table-column>
-        <el-table-column
-          prop="codeNumber"
-          header-align="center"
-          align="center"
-          min-width="100"
-          :show-overflow-tooltip="true"
-          label="设备编号">
+        <el-table-column prop="codeNumber" header-align="center" align="center" min-width="100"
+          :show-overflow-tooltip="true" label="设备编号">
         </el-table-column>
-        <el-table-column
-          prop="content"
-          header-align="center"
-          align="center"
-          min-width="140"
-          :show-overflow-tooltip="true"
-          label="报修问题说明">
+        <el-table-column prop="content" header-align="center" align="center" min-width="140"
+          :show-overflow-tooltip="true" label="报修问题说明">
         </el-table-column>
-        <el-table-column
-          header-align="center"
-          align="center"
-          min-width="140"
-          :show-overflow-tooltip="true"
+        <el-table-column header-align="center" align="center" min-width="140" :show-overflow-tooltip="true"
           label="报修附件">
           <template slot-scope="scope">
             <div v-for="(item, index) in scope.row.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>
+              <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{
+                item.fileName }}</a>
             </div>
           </template>
         </el-table-column>
-        <el-table-column
-          prop="createTime"
-          header-align="center"
-          align="center"
-          min-width="160"
-          :show-overflow-tooltip="true"
-          label="报修时间">
+        <el-table-column prop="createTime" header-align="center" align="center" min-width="160"
+          :show-overflow-tooltip="true" label="报修时间">
         </el-table-column>
-        <el-table-column
-          prop="repairName"
-          header-align="center"
-          align="center"
-          label="报修人">
+        <el-table-column prop="repairName" header-align="center" align="center" label="报修人">
         </el-table-column>
-        <el-table-column
-          prop="maintenanceRecord"
-          header-align="center"
-          align="center"
-          min-width="140"
-          :show-overflow-tooltip="true"
-          label="维修说明记录">
+        <el-table-column prop="maintenanceRecord" header-align="center" align="center" min-width="140"
+          :show-overflow-tooltip="true" label="维修说明记录">
         </el-table-column>
-        <el-table-column
-          header-align="center"
-          align="center"
-          min-width="140"
-          :show-overflow-tooltip="true"
+        <el-table-column header-align="center" align="center" min-width="140" :show-overflow-tooltip="true"
           label="维修完成记录附件">
           <template slot-scope="scope">
             <div v-for="(item, index) in scope.row.attachListRepair" 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>
+              <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{
+                item.fileName }}</a>
             </div>
           </template>
         </el-table-column>
-        <el-table-column
-          prop="updateTime"
-          header-align="center"
-          align="center"
-          min-width="160"
-          :show-overflow-tooltip="true"
-          label="维修完成时间">
+        <el-table-column prop="updateTime" header-align="center" align="center" min-width="160"
+          :show-overflow-tooltip="true" label="维修完成时间">
         </el-table-column>
-        <el-table-column
-          prop="state"
-          fixed="right"
-          header-align="center"
-          align="center"
-          label="状态">
+        <el-table-column prop="state" fixed="right" header-align="center" align="center" label="状态">
           <template slot-scope="scope">
             {{optionsState.find(t => t.value === scope.row.state).label}}
           </template>
         </el-table-column>
-        <el-table-column
-          fixed="right"
-          header-align="center"
-          align="center"
-          width="100"
-          label="操作">
+        <el-table-column fixed="right" header-align="center" align="center" width="100" label="操作">
           <template slot-scope="scope">
-            <el-button v-if="isAuth('prod:equipmentRepair:info')" type="text" size="small" @click="detailHandle(scope.row.repairId)">查看</el-button>
-            <el-button v-if="isAuth('prod:equipmentRepair:finish') && Number(scope.row.state) === 1 && scope.row.creatorId === userId" type="text" size="small" @click="finishHandle(scope.row.repairId)">完成</el-button>
+            <el-button v-if="isAuth('prod:equipmentRepair:info')" type="text" size="small"
+              @click="detailHandle(scope.row.repairId)">查看</el-button>
+            <el-button
+              v-if="isAuth('prod:equipmentRepair:finish') && Number(scope.row.state) === 1 && scope.row.creatorId === userId"
+              type="text" size="small" @click="finishHandle(scope.row.repairId)">完成</el-button>
           </template>
         </el-table-column>
       </el-table>
-      <el-pagination
-        @size-change="sizeChangeHandle"
-        @current-change="currentChangeHandle"
-        :current-page="pageIndex"
-        :page-sizes="[10, 20, 50, 100]"
-        :page-size="pageSize"
-        :total="totalPage"
+      <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex"
+        :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage"
         layout="total, sizes, prev, pager, next, jumper">
       </el-pagination>
     </template>
@@ -169,10 +97,10 @@
 <script>
 import Detail from './repair-detail'
 import UserComponent from '../common/user-component'
-import {optionsEquipmentRepairState} from '@/utils/enums'
-import {isAuth} from '@/utils'
+import { optionsEquipmentRepairState } from '@/utils/enums'
+import { isAuth } from '@/utils'
 import DeviceInspection from '@/views/modules/device/device-inspection.vue'
-import {getDate} from '@/utils/date-util'
+import { getDate } from '@/utils/date-util'
 import PreviewComponent from '@/views/modules/common/preview-component.vue'
 import RepairFinish from '@/views/modules/device/repair-finish.vue'
 export default {
@@ -185,7 +113,7 @@ export default {
     History,
     UserComponent
   },
-  data () {
+  data() {
     return {
       detailVisible: false,
       finishVisible: false,
@@ -201,23 +129,23 @@ export default {
       userId: this.$store.state.user.id
     }
   },
-  created () {
+  created() {
     this.getDataList()
   },
   methods: {
     getDate,
     isAuth,
-    onChose () {
+    onChose() {
       this.detailVisible = false
       this.finishVisible = false
     },
     // 查询
-    search () {
+    search() {
       this.pageIndex = 1
       this.getDataList()
     },
     // 获取数据列表
-    getDataList () {
+    getDataList() {
       this.dataListLoading = true
       this.addOrUpdateVisible = false
       this.$http({
@@ -232,7 +160,7 @@ export default {
           'dateStart': this.dataForm.date ? this.dataForm.date[0] : null,
           'dateEnd': this.dataForm.date ? this.dataForm.date[1] : null
         })
-      }).then(({data}) => {
+      }).then(({ data }) => {
         if (data && data.code === '200') {
           this.dataList = data.data.records
           this.totalPage = Number(data.data.total)
@@ -244,42 +172,42 @@ export default {
       })
     },
     // 每页数
-    sizeChangeHandle (val) {
+    sizeChangeHandle(val) {
       this.pageSize = val
       this.pageIndex = 1
       this.getDataList()
     },
     // 当前页
-    currentChangeHandle (val) {
+    currentChangeHandle(val) {
       this.pageIndex = val
       this.getDataList()
     },
     // 多选
-    selectionChangeHandle (val) {
+    selectionChangeHandle(val) {
       this.dataListSelections = val
     },
     // 新增 / 修改
-    addOrUpdateHandle (id, disable) {
+    addOrUpdateHandle(id, disable) {
       this.addOrUpdateVisible = true
       this.$nextTick(() => {
         this.$refs.addOrUpdate.init(id, disable)
       })
     },
-    detailHandle (id) {
+    detailHandle(id) {
       this.detailVisible = true
       this.$nextTick(() => {
         this.$refs.detail.init(id)
       })
     },
     // 预览
-    previewFile (fileName, url) {
+    previewFile(fileName, url) {
       this.previewVisible = true
       this.$nextTick(() => {
         this.$refs.preview.init(fileName, url)
       })
     },
     // 完成
-    finishHandle (id) {
+    finishHandle(id) {
       this.finishVisible = true
       this.$nextTick(() => {
         this.$refs.finish.init(id)
@@ -289,6 +217,4 @@ export default {
 }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

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

@@ -4,16 +4,11 @@
     <template v-if="!addOrUpdateVisible && !detailVisible">
       <el-form :inline="true" :model="dataForm" @keyup.enter.native="search()">
         <el-form-item label="名称">
-          <el-input v-model="dataForm.keyword" placeholder="名称" clearable/>
+          <el-input v-model="dataForm.keyword" placeholder="名称" clearable />
         </el-form-item>
         <el-form-item label="创建日期">
-          <el-date-picker
-            v-model="dataForm.date"
-            value-format="yyyy-MM-dd"
-            type="daterange"
-            range-separator="至"
-            start-placeholder="开始日期"
-            end-placeholder="结束日期">
+          <el-date-picker v-model="dataForm.date" value-format="yyyy-MM-dd" type="daterange" range-separator="至"
+            start-placeholder="开始日期" end-placeholder="结束日期">
           </el-date-picker>
         </el-form-item>
         <el-form-item label="物料" prop="productId">
@@ -21,19 +16,12 @@
         </el-form-item>
         <el-form-item>
           <el-button @click="search()">查询</el-button>
-          <el-button v-if="isAuth('pro:drawing:save')" type="primary" @click="addOrUpdateHandle(0, false)">上传图纸</el-button>
+          <el-button v-if="isAuth('pro:drawing:save')" type="primary"
+            @click="addOrUpdateHandle(0, false)">上传图纸</el-button>
         </el-form-item>
       </el-form>
-      <el-table
-        :data="dataList"
-        border
-        v-loading="dataListLoading"
-        style="width: 100%;">
-        <el-table-column
-          label="序号"
-          type="index"
-          width="50"
-          align="center">
+      <el-table :data="dataList" border v-loading="dataListLoading" style="width: 100%;">
+        <el-table-column label="序号" type="index" width="50" align="center">
         </el-table-column>
         <!-- <el-table-column
           prop="drawingCode"
@@ -43,29 +31,24 @@
           :show-tooltip-when-overflow="true"
           label="图纸编码">
         </el-table-column> -->
-        <el-table-column
-          prop="drawingName"
-          header-align="center"
-          align="center"
-          min-width="120"
-          :show-tooltip-when-overflow="true"
-          label="图纸名称">
+        <el-table-column prop="drawingName" header-align="center" align="center" min-width="120"
+          :show-tooltip-when-overflow="true" label="图纸名称">
         </el-table-column>
-        <el-table-column
-          prop="drawingNo"
-          header-align="center"
-          align="center"
-          min-width="120"
-          :show-tooltip-when-overflow="true"
-          label="图号">
+        <el-table-column prop="drawingNo" header-align="center" align="center" min-width="120"
+          :show-tooltip-when-overflow="true" label="图号">
         </el-table-column>
-        <el-table-column
-          prop="version"
-          header-align="center"
-          align="center"
-          min-width="120"
-          :show-tooltip-when-overflow="true"
-          label="版本">
+        <el-table-column prop="version" header-align="center" align="center" min-width="120"
+          :show-tooltip-when-overflow="true" label="版本">
+        </el-table-column>
+        <el-table-column header-align="center" align="center" min-width="140" :show-overflow-tooltip="true"
+          label="图纸文件">
+          <template slot-scope="scope">
+            <div v-for="(item, index) in scope.row.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>
+          </template>
         </el-table-column>
         <!-- <el-table-column
           prop="productName"
@@ -83,181 +66,166 @@
           :show-overflow-tooltip="true"
           label="来源">
         </el-table-column> -->
-        <el-table-column
-          prop="createTime"
-          header-align="center"
-          align="center"
-          min-width="160"
-          label="上传时间">
+        <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 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"
+        <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"
-          align="center"
-          width="150"
-          label="操作">
+        <el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
           <template slot-scope="scope">
             <el-button type="text" size="small" @click="detailHandle(scope.row.drawingId)">删除</el-button>
           </template>
         </el-table-column>
       </el-table>
-      <el-pagination
-        @size-change="sizeChangeHandle"
-        @current-change="currentChangeHandle"
-        :current-page="pageIndex"
-        :page-sizes="[10, 20, 50, 100]"
-        :page-size="pageSize"
-        :total="totalPage"
+      <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex"
+        :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage"
         layout="total, sizes, prev, pager, next, jumper">
       </el-pagination>
     </template>
     <!-- 弹窗, 新增 / 修改 -->
-    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList" @onChose="onChose"></add-or-update>
-    <detail v-if="detailVisible" ref="detail" @onChose="onChose"/>
+    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"
+      @onChose="onChose"></add-or-update>
+    <detail v-if="detailVisible" ref="detail" @onChose="onChose" />
+    <preview-component v-if="previewVisible" ref="preview" @onChose="onChose"></preview-component>
   </div>
 </template>
 
 <script>
-  import AddOrUpdate from './draw-add-or-update'
-  import Detail from './draw-detail'
-  import { getDrawList } from '@/api/product'
-  import ProductComponent from '@/views/modules/common/product-component'
-  export default {
-    name: 'draw-management',
-    components: {
-      ProductComponent,
-      AddOrUpdate,
-      Detail
+import AddOrUpdate from './draw-add-or-update'
+import Detail from './draw-detail'
+import { getDrawList } from '@/api/product'
+import ProductComponent from '@/views/modules/common/product-component'
+import PreviewComponent from '@/views/modules/common/preview-component.vue'
+export default {
+  name: 'draw-management',
+  components: {
+    ProductComponent,
+    AddOrUpdate,
+    Detail,
+    PreviewComponent
+  },
+  data() {
+    return {
+      addOrUpdateVisible: false,
+      previewVisible: false,
+      detailVisible: false,
+      dataForm: {
+        keyword: ''
+      },
+      optionsProducts: [],
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: []
+    }
+  },
+  created() {
+    this.getDataList()
+  },
+  methods: {
+    onChose() {
+      this.addOrUpdateVisible = false
+      this.detailVisible = false
+    },
+    // 查询
+    search() {
+      this.pageIndex = 1
+      this.getDataList()
     },
-    data () {
-      return {
-        addOrUpdateVisible: false,
-        detailVisible: false,
-        dataForm: {
-          keyword: ''
-        },
-        optionsProducts: [],
-        dataList: [],
-        pageIndex: 1,
-        pageSize: 10,
-        totalPage: 0,
-        dataListLoading: false,
-        dataListSelections: []
+    // 获取数据列表
+    getDataList() {
+      this.addOrUpdateVisible = false
+      this.dataListLoading = true
+      let params = {
+        'current': this.pageIndex,
+        'size': this.pageSize,
+        'keyword': this.dataForm.keyword,
+        'createTime': this.dataForm.createTime ? this.dataForm.createTime : null,
+        'productId': this.dataForm.productId ? this.dataForm.productId : null
       }
+      getDrawList(params).then(({ data }) => {
+        if (data && data.code === '200') {
+          this.dataList = data.data.records
+          this.totalPage = Number(data.data.total)
+        } else {
+          this.dataList = []
+          this.totalPage = 0
+        }
+        this.dataListLoading = false
+      })
     },
-    created () {
+    // 每页数
+    sizeChangeHandle(val) {
+      this.pageSize = val
+      this.pageIndex = 1
       this.getDataList()
     },
-    methods: {
-      onChose () {
-        this.addOrUpdateVisible = false
-        this.detailVisible = false
-      },
-      // 查询
-      search () {
-        this.pageIndex = 1
-        this.getDataList()
-      },
-      // 获取数据列表
-      getDataList () {
-        this.addOrUpdateVisible = false
-        this.dataListLoading = true
-        let params = {
-          'current': this.pageIndex,
-          'size': this.pageSize,
-          'keyword': this.dataForm.keyword,
-          'createTime': this.dataForm.createTime ? this.dataForm.createTime : null,
-          'productId': this.dataForm.productId ? this.dataForm.productId : null
-        }
-        getDrawList(params).then(({data}) => {
+    // 当前页
+    currentChangeHandle(val) {
+      this.pageIndex = val
+      this.getDataList()
+    },
+    // 多选
+    selectionChangeHandle(val) {
+      this.dataListSelections = val
+    },
+    // 新增 / 修改
+    addOrUpdateHandle(id, display) {
+      this.addOrUpdateVisible = true
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id, display)
+      })
+    },
+    // 删除
+    deleteHandle(id) {
+      if (!id) return
+      let ids = []
+      ids.push(id)
+      this.$confirm(`确定删除?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$http({
+          url: this.$http.adornUrl(`/biz-service/drawing/delete`),
+          method: 'DELETE',
+          data: ids
+        }).then(({ data }) => {
           if (data && data.code === '200') {
-            this.dataList = data.data.records
-            this.totalPage = Number(data.data.total)
+            this.$message({
+              message: '操作成功',
+              type: 'success',
+              duration: 1500,
+              onClose: () => {
+                this.getDataList()
+              }
+            })
           } else {
-            this.dataList = []
-            this.totalPage = 0
+            this.$message.error(data.msg)
           }
-          this.dataListLoading = false
         })
-      },
-      // 每页数
-      sizeChangeHandle (val) {
-        this.pageSize = val
-        this.pageIndex = 1
-        this.getDataList()
-      },
-      // 当前页
-      currentChangeHandle (val) {
-        this.pageIndex = val
-        this.getDataList()
-      },
-      // 多选
-      selectionChangeHandle (val) {
-        this.dataListSelections = val
-      },
-      // 新增 / 修改
-      addOrUpdateHandle (id, display) {
-        this.addOrUpdateVisible = true
-        this.$nextTick(() => {
-          this.$refs.addOrUpdate.init(id, display)
-        })
-      },
-      // 删除
-      deleteHandle (id) {
-        if (!id) return
-        let ids = []
-        ids.push(id)
-        this.$confirm(`确定删除?`, '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        }).then(() => {
-          this.$http({
-            url: this.$http.adornUrl(`/biz-service/drawing/delete`),
-            method: 'DELETE',
-            data: ids
-          }).then(({data}) => {
-            if (data && data.code === '200') {
-              this.$message({
-                message: '操作成功',
-                type: 'success',
-                duration: 1500,
-                onClose: () => {
-                  this.getDataList()
-                }
-              })
-            } else {
-              this.$message.error(data.msg)
-            }
-          })
-        }).catch(() => {})
-      },
-      // 详情
-      detailHandle (id) {
-        this.detailVisible = true
-        this.$nextTick(() => {
-          this.$refs.detail.init(id)
-        })
-      }
+      }).catch(() => { })
+    },
+    // 预览
+    previewFile (fileName, url) {
+      this.previewVisible = true
+      this.$nextTick(() => {
+        this.$refs.preview.init(fileName, url)
+      })
+    },
+    // 详情
+    detailHandle(id) {
+      this.detailVisible = true
+      this.$nextTick(() => {
+        this.$refs.detail.init(id)
+      })
     }
   }
+}
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>