页面调整

src/views/modules/common/upload-component-v2.vue

@@ -1,25 +1,10 @@
 <template>
   <section>
     <span>
-      <el-upload
-        :disabled="display"
-        class="upload-demo"
-        ref="upload"
-        :multiple="multiple"
-        action="#"
-        :accept="accept"
-        :on-preview="handlePreview"
-        :on-remove="handleRemove"
-        :on-change="handleChange"
-        :file-list="fileList"
-        :limit="limit"
-        :on-exceed="handleExceed"
-        :http-request="handleUpload"
-        :auto-upload="true"
-      >
-        <el-button v-show="!display" slot="trigger" size="small" type="primary"
-          >点击上传</el-button
-        >
+      <el-upload :disabled="display" class="upload-demo" ref="upload" :multiple="multiple" action="#" :accept="accept"
+        :on-preview="handlePreview" :on-remove="handleRemove" :on-change="handleChange" :file-list="fileList"
+        :limit="limit" :on-exceed="handleExceed" :http-request="handleUpload" :auto-upload="true">
+        <el-button v-show="!display" slot="trigger" size="small" type="primary">点击上传</el-button>
         <!-- <el-button
           v-show="!display"
           style="margin-left: 10px"
@@ -32,17 +17,8 @@
       </el-upload>
     </span>
     <!-- 图片预览 -->
-    <el-dialog
-      title="图片预览"
-      :append-to-body="true"
-      :visible.sync="previewVisible"
-      width="50%"
-    >
-      <img
-        :src="previewPath"
-        :alt="previewName"
-        style="width: 100%; height: 100%"
-      />
+    <el-dialog title="图片预览" :append-to-body="true" :visible.sync="previewVisible" width="50%">
+      <img :src="previewPath" :alt="previewName" style="width: 100%; height: 100%" />
     </el-dialog>
   </section>
 </template>
@@ -95,11 +71,11 @@ export default {
     }
   },
   watch: {
-    fileList (newVal) {
+    fileList(newVal) {
       this.$emit('uploadSuccess', newVal)
     },
-    fileObjList (newVal) {
-      console.log('fileObjList:', newVal)
+    fileObjList(newVal) {
+      // console.log('fileObjList:', newVal)
       if (newVal && newVal instanceof Array) {
         newVal.forEach(t => { t.name = t.fileName })
       }
@@ -113,7 +89,7 @@ export default {
     //   }
     // }
   },
-  data () {
+  data() {
     return {
       fileList: [],
       uploadUrl: uploadUrl,
@@ -124,8 +100,8 @@ export default {
     }
   },
   methods: {
-    handleUpload (file) {
-      function getBase64 (file) {
+    handleUpload(file) {
+      function getBase64(file) {
         return new Promise((resolve, reject) => {
           const reader = new FileReader()
           reader.readAsDataURL(file)
@@ -159,15 +135,15 @@ export default {
       })
     },
     // 上传
-    submitUpload () {
+    submitUpload() {
       this.$refs.upload.submit()
     },
     // 移除
-    handleRemove (file, fileList) {
+    handleRemove(file, fileList) {
       this.$emit('input', fileList)
     },
     // 预览
-    handlePreview (file) {
+    handlePreview(file) {
       if (!file || !file.name || !file.url) {
         this.$message.error('没有可预览的文件！')
         return
@@ -183,19 +159,18 @@ export default {
       }
     },
     // 改变上传内容
-    handleChange (file, fileList) {
+    handleChange(file, fileList) {
       this.fileList = fileList
     },
     // 超限
-    handleExceed (files, fileList) {
+    handleExceed(files, fileList) {
       this.$message.warning(
-        `当前限制选择 ${this.limit} 个文件，本次选择了 ${
-          files.length
+        `当前限制选择 ${this.limit} 个文件，本次选择了 ${files.length
         } 个文件，共选择了 ${files.length + fileList.length} 个文件`
       )
     },
     // 下载模板
-    downloadTemplate () {
+    downloadTemplate() {
       if (this.templateCode !== '') {
         location.href = this.$http.adornUrl(`/file-service/minio-file/systemTable/download/${this.templateCode}`)
       }

src/views/modules/production/plan-submit.vue

@@ -54,10 +54,13 @@
             </div>
           </template>
         </el-table-column>
-        <el-table-column prop="unit" header-align="center" align="center" min-width="140"
+        <el-table-column prop="materials" header-align="center" align="center" min-width="140"
+          :show-tooltip-when-overflow="true" label="材料">
+        </el-table-column>
+        <el-table-column prop="unit" header-align="center" align="center" min-width="50"
           :show-tooltip-when-overflow="true" label="单位">
         </el-table-column>
-        <el-table-column prop="cnt" header-align="center" align="center" min-width="140"
+        <el-table-column prop="cnt" header-align="center" align="center" min-width="80"
           :show-tooltip-when-overflow="true" label="单套数量">
         </el-table-column>
         <el-table-column prop="productSpec" header-align="center" align="center" min-width="140"

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

@@ -44,15 +44,15 @@
       </e-desc>
       <e-desc title="简图">
         <template slot-scope="scope">
-          <div v-for="(item, index) in dataForm.attachList2" 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 class="thumb-list" v-if="getImageList(dataForm.attachList2).length">
+            <img v-for="(img, idx) in getImageList(dataForm.attachList2)" :key="(img.url || '') + idx" class="thumb"
+              :src="downloadUrl + img.url" :alt="img.fileName" @click="previewFile(img.fileName, img.url)" />
           </div>
+          <div v-else style="color: #909399;">暂无图片</div>
         </template>
       </e-desc>
       <e-desc title="技术资料附件">
-        <upload-component :display="true" :display-title="false" :accept="'*'" :value="dataForm.attachList" />
+        <upload-component :display="true" :display-title="false" :accept="'*'" :file-obj-list="dataForm.attachList" />
       </e-desc>
       <e-desc title="关联图纸">
         <el-table :data="dataForm.proDrawings" border style="width: 100%;">
@@ -64,7 +64,7 @@
                 scope.row.drawingName }}</a>
             </template>
           </el-table-column>
-          <el-table-column prop="drawingNo" header-align="center" align="center" label="图号">
+          <el-table-column prop="drawingName" header-align="center" align="center" label="图号">
           </el-table-column>
           <el-table-column prop="source" header-align="center" align="center" label="来源">
           </el-table-column>
@@ -169,10 +169,11 @@
 import EDesc from '../common/e-desc'
 import EDescItem from '../common/e-desc-item'
 import { dealStepData, dealStepLogs } from '@/api/util'
-import uploadComponent from '../common/upload-component-v2'
+import uploadComponent from '../common/upload-component'
 import { getProductDetail, getChildren } from '@/api/product'
 import ApproveComponent from '../common/approve-component'
 import PreviewComponent from '../common/preview-component'
+import { downloadUrl } from '@/api/file'
 export default {
   name: 'product-detail',
   components: {
@@ -194,7 +195,8 @@ export default {
       activeNo: 0,
       stepList: [],
       logList: [],
-      fileList: []
+      fileList: [],
+      downloadUrl: downloadUrl
     }
   },
   methods: {
@@ -278,6 +280,16 @@ export default {
       this.onChose()
       this.$emit('approveFinished')
     },
+    // 过滤图片附件
+    getImageList(attachList) {
+      if (!attachList || !Array.isArray(attachList)) return []
+      return attachList.filter(item => this.isImage(item && item.fileName))
+    },
+    isImage(fileName) {
+      if (!fileName || typeof fileName !== 'string') return false
+      const ext = fileName.split('.').pop().toLowerCase()
+      return ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(ext)
+    },
     // 预览
     previewFile(fileName, url) {
       this.previewVisible = true
@@ -307,4 +319,20 @@ export default {
 .title {
   padding: 10px 0;
 }
+
+/* 简图缩略图样式 */
+.thumb-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.thumb {
+  width: 48px;
+  height: 48px;
+  object-fit: cover;
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  cursor: pointer;
+}
 </style>

src/views/modules/tech/project-tech-submit.vue

@@ -48,6 +48,9 @@
             </div>
           </template>
         </el-table-column>
+        <el-table-column prop="materials" header-align="center" align="center" min-width="140"
+          :show-tooltip-when-overflow="true" label="材料">
+        </el-table-column>
         <el-table-column prop="unit" header-align="center" align="center" min-width="140"
           :show-tooltip-when-overflow="true" label="单位">
         </el-table-column>

src/views/modules/tech/work-type.vue

@@ -4,245 +4,184 @@
     <template v-if="!addOrUpdateVisible && !detailVisible">
       <el-form :inline="true" :model="dataForm" @keyup.enter.native="queryData()">
         <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="级别">
-          <el-select
-            v-model="dataForm.level"
-            remote
-            placeholder="请选择">
-            <el-option
-              v-for="item in optionsLevel"
-              :key="item.code"
-              :label="item.value"
-              :value="item.code">
+          <el-select v-model="dataForm.level" remote placeholder="请选择">
+            <el-option v-for="item in optionsLevel" :key="item.code" :label="item.value" :value="item.code">
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item>
           <el-button @click="queryData()">查询</el-button>
-          <el-button v-if="isAuth('pro:worktype:save')" type="primary" @click="addOrUpdateHandle(0, false)">创建新工种</el-button>
+          <el-button v-if="isAuth('pro:worktype: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="code"
-          header-align="center"
-          align="center"
-          min-width="160"
-          :show-tooltip-when-overflow="true"
-          label="工种编码">
+        <el-table-column prop="code" header-align="center" align="center" min-width="160"
+          :show-tooltip-when-overflow="true" label="工种编码">
         </el-table-column>
-        <el-table-column
-          prop="name"
-          header-align="center"
-          align="center"
-          min-width="140"
-          :show-tooltip-when-overflow="true"
-          label="工种名称">
+        <el-table-column prop="proWorkshopName" header-align="center" align="center" min-width="120"
+          :show-tooltip-when-overflow="true" label="车间">
         </el-table-column>
-        <el-table-column
-          prop="level"
-          header-align="center"
-          align="center"
-          :formatter="formatLevel"
-          label="工种级别">
+        <el-table-column prop="name" header-align="center" align="center" min-width="120"
+          :show-tooltip-when-overflow="true" label="工种名称">
         </el-table-column>
-        <el-table-column
-          prop="requirement"
-          header-align="center"
-          align="center"
-          min-width="120"
-          :show-tooltip-when-overflow="true"
-          label="工种要求">
+        <el-table-column prop="level" header-align="center" align="center" :formatter="formatLevel" label="工种级别">
         </el-table-column>
-        <el-table-column
-          prop="quotedPrice"
-          header-align="center"
-          align="center"
-          min-width="120"
-          :show-tooltip-when-overflow="true"
-          label="工时单价">
+        <el-table-column prop="requirement" header-align="center" align="center" min-width="120"
+          :show-tooltip-when-overflow="true" label="工种要求">
+        </el-table-column>
+        <el-table-column prop="quotedPrice" header-align="center" align="center" min-width="120"
+          :show-tooltip-when-overflow="true" label="工时单价">
           <template slot-scope="scope">
             <span>{{ Number(scope.row.quotedPrice || 0).toFixed(2) }}元</span>
           </template>
         </el-table-column>
-        <el-table-column
-          prop="masterNames"
-          header-align="center"
-          align="center"
-          :formatter="formatNames"
-          min-width="140"
-          :show-tooltip-when-overflow="true"
-          label="掌握人">
+        <el-table-column prop="masterNames" header-align="center" align="center" :formatter="formatNames"
+          min-width="140" :show-tooltip-when-overflow="true" label="掌握人">
         </el-table-column>
-        <el-table-column
-          prop="foremanName"
-          header-align="center"
-          align="center"
-          min-width="140"
-          :show-tooltip-when-overflow="true"
-          label="负责人">
+        <el-table-column prop="foremanName" header-align="center" align="center" min-width="140"
+          :show-tooltip-when-overflow="true" 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 v-if="isAuth('pro:worktype:info')" type="text" size="small" @click="detailHandle(scope.row.typeId)">查看</el-button>
-            <el-button v-if="isAuth('pro:worktype:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.typeId, false)">编辑</el-button>
+            <el-button v-if="isAuth('pro:worktype:info')" type="text" size="small"
+              @click="detailHandle(scope.row.typeId)">查看</el-button>
+            <el-button v-if="isAuth('pro:worktype:update')" type="text" size="small"
+              @click="addOrUpdateHandle(scope.row.typeId, false)">编辑</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" />
   </div>
 </template>
 
 <script>
-  import AddOrUpdate from './work-type-add-or-update'
-  import Detail from './work-type-detail'
-  import { getDictList } from '@/api/dict'
-  import { getWorkTypeList } from '@/api/product'
-  export default {
-    name: 'work-type',
-    components: {
-      AddOrUpdate, Detail
+import AddOrUpdate from './work-type-add-or-update'
+import Detail from './work-type-detail'
+import { getDictList } from '@/api/dict'
+import { getWorkTypeList } from '@/api/product'
+export default {
+  name: 'work-type',
+  components: {
+    AddOrUpdate, Detail
+  },
+  data() {
+    return {
+      addOrUpdateVisible: false,
+      detailVisible: false,
+      dataForm: {},
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      optionsLevel: []
+    }
+  },
+  created() {
+    this.getLevelList()
+    this.getDataList()
+  },
+  methods: {
+    onChose() {
+      this.addOrUpdateVisible = false
+      this.detailVisible = false
     },
-    data () {
-      return {
-        addOrUpdateVisible: false,
-        detailVisible: false,
-        dataForm: {},
-        dataList: [],
-        pageIndex: 1,
-        pageSize: 10,
-        totalPage: 0,
-        dataListLoading: false,
-        dataListSelections: [],
-        optionsLevel: []
-      }
+    // 获取工种级别
+    getLevelList() {
+      getDictList({ type: 'pro_work_level' }).then(({ data }) => {
+        if (data) {
+          this.optionsLevel = data
+        }
+      })
     },
-    created () {
-      this.getLevelList()
+    // 查询
+    queryData() {
+      this.pageIndex = 1
       this.getDataList()
     },
-    methods: {
-      onChose () {
-        this.addOrUpdateVisible = false
-        this.detailVisible = false
-      },
-      // 获取工种级别
-      getLevelList () {
-        getDictList({type: 'pro_work_level'}).then(({data}) => {
-          if (data) {
-            this.optionsLevel = data
-          }
-        })
-      },
-      // 查询
-      queryData () {
-        this.pageIndex = 1
-        this.getDataList()
-      },
-      // 获取数据列表
-      getDataList () {
-        this.dataListLoading = true
-        this.addOrUpdateVisible = false
-        let params = {
-          'current': this.pageIndex,
-          'size': this.pageSize,
-          'name': this.dataForm.name ? this.dataForm.name : null,
-          'level': this.dataForm.level ? this.dataForm.level : null
-        }
-        getWorkTypeList(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
-        })
-      },
-      // 每页数
-      sizeChangeHandle (val) {
-        this.pageSize = val
-        this.pageIndex = 1
-        this.getDataList()
-      },
-      // 当前页
-      currentChangeHandle (val) {
-        this.pageIndex = val
-        this.getDataList()
-      },
-      // 多选
-      selectionChangeHandle (val) {
-        this.dataListSelections = val
-      },
-      // 新增 / 修改
-      addOrUpdateHandle (id, disable) {
-        this.addOrUpdateVisible = true
-        this.$nextTick(() => {
-          this.$refs.addOrUpdate.init(id, disable)
-        })
-      },
-      // 转换属性“类别”
-      formatLevel (row) {
-        if (this.optionsLevel && row.level) {
-          const item1 = this.optionsLevel.find((item) => item.code === row.level.toString())
-          return item1 ? item1.value : ''
+    // 获取数据列表
+    getDataList() {
+      this.dataListLoading = true
+      this.addOrUpdateVisible = false
+      let params = {
+        'current': this.pageIndex,
+        'size': this.pageSize,
+        'name': this.dataForm.name ? this.dataForm.name : null,
+        'level': this.dataForm.level ? this.dataForm.level : null
+      }
+      getWorkTypeList(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
         }
-      },
-      // 转换属性“掌握人”
-      formatNames (row) {
-        if (row.masterNames && row.masterNames.length > 0) {
-          return row.masterNames.toString()
-        } else { return '' }
-      },
-      // 详情
-      detailHandle (id) {
-        this.detailVisible = true
-        this.$nextTick(() => {
-          this.$refs.detail.init(id)
-        })
+        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, disable) {
+      this.addOrUpdateVisible = true
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id, disable)
+      })
+    },
+    // 转换属性“类别”
+    formatLevel(row) {
+      if (this.optionsLevel && row.level) {
+        const item1 = this.optionsLevel.find((item) => item.code === row.level.toString())
+        return item1 ? item1.value : ''
       }
+    },
+    // 转换属性“掌握人”
+    formatNames(row) {
+      if (row.masterNames && row.masterNames.length > 0) {
+        return row.masterNames.toString()
+      } else { return '' }
+    },
+    // 详情
+    detailHandle(id) {
+      this.detailVisible = true
+      this.$nextTick(() => {
+        this.$refs.detail.init(id)
+      })
     }
   }
+}
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>