From d5375d8682c88892f7fab74eeb4e37ef9a320133 Mon Sep 17 00:00:00 2001
From: lion <120344285@qq.com>
Date: Tue, 4 Nov 2025 16:50:40 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/stocks/component/showRuku.vue | 231 +++++++++++++-----------
 1 file changed, 123 insertions(+), 108 deletions(-)

diff --git a/src/views/stocks/component/showRuku.vue b/src/views/stocks/component/showRuku.vue
index f07a71c..513af73 100644
--- a/src/views/stocks/component/showRuku.vue
+++ b/src/views/stocks/component/showRuku.vue
@@ -1,55 +1,58 @@
 <template>
   <div>
     <xy-dialog :is-show.sync="isShow" type="normal" title="查看" class="contract-detail">
-      <template v-slot:normalContent>
-        <el-descriptions title="基本信息" :column="2" border>
-            <el-descriptions-item label="入库类型">{{form.rukuleixing}}</el-descriptions-item>
-            <el-descriptions-item label="入库日期">{{form.rukushijian}}</el-descriptions-item>
-            <el-descriptions-item label="经办人">{{form.jingbanren}}</el-descriptions-item>
-            <!-- <el-descriptions-item label="记录人">{{form.jilurenyuan}}</el-descriptions-item>
-            <el-descriptions-item label="保管人" :span="2">{{form.baoguanrenyuan}}</el-descriptions-item> -->
-            <el-descriptions-item label="附件" :span="2">
-              <div v-for="item in zuozhengList">
-                 <a style="color: blue;" :href="item.url" target="_blank">{{item.name}}</a>
-              </div>
-            </el-descriptions-item>
-            <el-descriptions-item label="备注" :span="2">{{form.beizhu}}</el-descriptions-item>
-        </el-descriptions>
-        <div style="margin: 10px 0;font-weight: bold;color:#303133;font-size: 16px;">
-          物资明细
-        </div>
-        <xy-table style="width: 100%" :height="260" :is-page="false" :list="mingxiList" :table-item="mingxiTable">
-          <template v-slot:btns>
-            <div></div>
-          </template>
-        </xy-table>
-        <div style="margin: 10px 0;font-weight: bold;color:#303133;font-size: 16px;">
-          现场实物图
-        </div>
-        <div>
-          <!-- 确认入库 -->
-          <el-upload v-if="form.zhuangtai===2" ref="upload" list-type="picture-card" class="upload-demo" :action="action" multiple :headers="headers"
-            :before-upload="beforeUpload" :on-success="onSuccess" :on-error="onError" :on-remove="onRemove"
-            :file-list="fileList" :auto-upload="true">
-            <i class="el-icon-plus"></i>
-          </el-upload>
-          <div v-else>
-            <template v-for="(item,index) in fileList">
-              <el-image
-                  style="width: 100px; height: 100px"
-                  :src="item.url"
-                  :key="index"
-                  :initial-index="index">
-                </el-image>
-            </template>
-
-          </div>
-
+      <template v-slot:normalContent>
+        <el-descriptions title="基本信息" :column="2" border>
+            <el-descriptions-item label="入库类型">{{form.rukuleixing}}</el-descriptions-item>
+            <el-descriptions-item label="入库日期">{{form.rukushijian}}</el-descriptions-item>
+            <el-descriptions-item label="经办人">{{form.jingbanren}}</el-descriptions-item>
+            <!-- <el-descriptions-item label="记录人">{{form.jilurenyuan}}</el-descriptions-item>
+            <el-descriptions-item label="保管人" :span="2">{{form.baoguanrenyuan}}</el-descriptions-item> -->
+            <el-descriptions-item label="附件" :span="2">
+              <div v-for="item in zuozhengList">
+                 <a style="color: blue;" :href="item.url" target="_blank">{{item.name}}</a>
+              </div>
+            </el-descriptions-item>
+            <el-descriptions-item label="备注" :span="2">{{form.beizhu}}</el-descriptions-item>
+        </el-descriptions>
+        <div style="margin: 10px 0;font-weight: bold;color:#303133;font-size: 16px;">
+          物资明细
+        </div>
+        <xy-table style="width: 100%" :height="260" :is-page="false" :list="mingxiList" :table-item="mingxiTable">
+          <template v-slot:btns>
+            <div></div>
+          </template>
+        </xy-table>
+        <div style="margin: 10px 0;font-weight: bold;color:#303133;font-size: 16px;">
+          现场实物图
+        </div>
+        <div>
+          <!-- 确认入库 -->
+          <el-upload v-if="form.zhuangtai===2" ref="upload" list-type="text" class="upload-demo" :action="action" multiple :headers="headers"
+            :before-upload="beforeUpload" :on-success="onSuccess" :on-error="onError" :on-remove="onRemove" :on-preview="onPreview"
+            :file-list="fileList" :auto-upload="true">
+            <el-button size="small" type="primary">点击上传</el-button>
+            <div slot="tip" class="el-upload__tip">支持上传任意类型文件</div>
+          </el-upload>
+          <div v-else>
+            <template v-for="(item,index) in fileList">
+              <div :key="index" style="display:inline-flex;align-items:center;margin:6px 10px 6px 0;">
+                
+                <div>
+                  <a :href="item.url" target="_blank" style="color:#409EFF;text-decoration:none;">
+                    {{ item.original_name}}
+                  </a>
+                </div>
+              </div>
+            </template>
+
+          </div>
+
         </div>
-      </template>
-      <template v-slot:footerContent>
-        <Button @click="isShow=false">关闭</Button>
-        <Button type="primary" v-if="form.zhuangtai===2" @click="submit">入库</Button>
+      </template>
+      <template v-slot:footerContent>
+        <Button @click="isShow=false">关闭</Button>
+        <Button type="primary" v-if="form.zhuangtai===2" @click="submit">入库</Button>
       </template>
     </xy-dialog>
   </div>
@@ -61,10 +64,10 @@
     index,
     show,
     destroy
-  } from '@/api/system/baseForm.js'
-  import {
-    saveStock,
-    showStock
+  } from '@/api/system/baseForm.js'
+  import {
+    saveStock,
+    showStock
   } from '@/api/stocks.js'
   import {
     Message
@@ -79,7 +82,7 @@
       return {
         id: '',
         isShow: false,
-        tableName: 'stocks',
+        tableName: 'stocks',
         zuozhengList:[],
         fileList: [],
         action: process.env.VUE_APP_UPLOAD_API,
@@ -94,7 +97,7 @@
           jilurenyuan: '',
           baoguanrenyuan: '',
           beizhu: '',
-          zuozhengwenjian: '',
+          zuozhengwenjian: '',
           rukutupian:''
         },
         mingxiList: [],
@@ -177,22 +180,22 @@
       isShow(newVal) {
         if (newVal) {
           this.getDetail()
-        }else{
-          this.id = ''
-          this.fileList = []
-          this.zuozhengList = []
-          this.form = {
-            rukushijian: '',
-            rukuleixing: '',
-            pandianleixing: '',
-            jingbanren: '',
-            jilurenyuan: '',
-            baoguanrenyuan: '',
-            beizhu: '',
-            zuozhengwenjian: '',
-            rukutupian:''
-          }
-
+        }else{
+          this.id = ''
+          this.fileList = []
+          this.zuozhengList = []
+          this.form = {
+            rukushijian: '',
+            rukuleixing: '',
+            pandianleixing: '',
+            jingbanren: '',
+            jilurenyuan: '',
+            baoguanrenyuan: '',
+            beizhu: '',
+            zuozhengwenjian: '',
+            rukutupian:''
+          }
+
         }
       }
     },
@@ -237,6 +240,18 @@
         })
       },
 
+      onPreview(file) {
+        const url = file.url || (file.response && file.response.url)
+        if (url) {
+          window.open(url, '_blank')
+        }
+      },
+
+      isImage(url) {
+        if (!url) return false
+        return /\.(png|jpe?g|gif|bmp|webp|svg)(\?.*)?$/i.test(url)
+      },
+
       // 打印二维码
       handlePrint() {
         // 这里添加打印二维码的逻辑
@@ -244,29 +259,29 @@
         this.isShow = false
         this.resetForm()
         window.open('/admin/print.html?ids=' + this.printArr, '_blank')
-      },
-      submit(){
-        if(this.fileList.length<1){
-          Message({
-            type:'warning',
-            message:'请上传现场实物图'
-          })
-          return
-        }else{
-          this.form.rukutupian = []
-          for (var k of this.fileList) {
-            this.form.rukutupian.push(k?.response?.id)
-          }
-        }
-        saveStock({
-          ...this.form,
-          zhuangtai:3,
-          id: this.id,
-        }).then(res => {
-          this.$message.success('入库成功')
-          this.$emit('refresh')
-          this.isShow = false
-        })
+      },
+      submit(){
+        if(this.fileList.length<1){
+          Message({
+            type:'warning',
+            message:'请上传现场实物图'
+          })
+          return
+        }else{
+          this.form.rukutupian = []
+          for (var k of this.fileList) {
+            this.form.rukutupian.push(k?.response?.id)
+          }
+        }
+        saveStock({
+          ...this.form,
+          zhuangtai:3,
+          id: this.id,
+        }).then(res => {
+          this.$message.success('入库成功')
+          this.$emit('refresh')
+          this.isShow = false
+        })
       },
       //
       async getDetail() {
@@ -282,10 +297,10 @@
           jilurenyuan: res?.jilurenyuan,
           baoguanrenyuan: res?.baoguanrenyuan,
           beizhu: res?.beizhu,
-          zuozhengwenjian: res?.zuozhengwenjian,
-          rukutupian:res?.rukutupian,
+          zuozhengwenjian: res?.zuozhengwenjian,
+          rukutupian:res?.rukutupian,
         }
-        this.form.id = this.id
+        this.form.id = this.id
         this.form.zhuangtai = res.zhuangtai?res.zhuangtai:0
         this.mingxiList = res.id_stocks_items_stocks_id_relation
         this.zuozhengList = []
@@ -296,17 +311,17 @@
             url: f?.url,
             response: f
           })
-        }
-
-        this.fileList = []
-        const ruku_lists = res.rukutupian_upload_details ? res.rukutupian_upload_details : []
-        for (var f of ruku_lists) {
-          this.fileList.push({
-            name: f?.original_name,
-            url: f?.url,
-            response: f
-          })
-        }
+        }
+
+        this.fileList = []
+        const ruku_lists = res.rukutupian_upload_details ? res.rukutupian_upload_details : []
+        for (var f of ruku_lists) {
+          this.fileList.push({
+            name: f?.original_name,
+            url: f?.url,
+            response: f
+          })
+        }
 
       },
     }
@@ -329,4 +344,4 @@
     align-items: center;
     height: 300px;
   }
-</style>
+</style>