修改

1 month ago · d5375d8682
parent 3f4266ffce
commit d5375d8682
1 changed files with 123 additions and 108 deletions
--- 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>