Merge remote-tracking branch 'origin/dev-nx' into dev-nx

sgzb-ui/src/views/warehouseManage/newPurchase/component/fileView.vue

@@ -0,0 +1,60 @@
+<template>
+    <!-- 新购验收文件查询 -->
+    <div>
+        <el-table border :data="fileList">
+            <el-table-column align="center" label="文件名称" prop="name" />
+            <el-table-column align="center" label="操作">
+                <template slot-scope="{ row }">
+                    <a :href="`${filePreviewUrl}${row.url}`" target="_blank"
+                        >查看</a
+                    >
+                </template>
+            </el-table-column>
+        </el-table>
+    </div>
+</template>
+
+<script>
+export default {
+    props: {
+        // 文件地址
+        fileUrlView: {
+            type: String,
+            default: () => '',
+        },
+        // 文件名称
+        fileNameView: {
+            type: String,
+            default: () => '',
+        },
+    },
+    data() {
+        return {
+            filePreviewUrl: process.env.VUE_APP_BASE_API + '/system/',
+        }
+    },
+    computed: {
+        fileList() {
+            let urlList = this.fileUrlView.split(',')
+            let nameList = this.fileNameView.split(',')
+            let tableList = []
+            nameList.map((e, index) => {
+                const fileObj = {
+                    name: e,
+                    url: urlList[index],
+                }
+
+                tableList.push(fileObj)
+            })
+
+            return tableList || []
+        },
+    },
+}
+</script>
+
+<style scoped>
+a {
+    color: #409eff;
+}
+</style>

sgzb-ui/src/views/warehouseManage/newPurchase/serviceCenter/index.vue

@@ -317,6 +317,13 @@
                     :show-overflow-tooltip="true"
                     width="200"
                 />
+                <el-table-column label="附件材料" align="center">
+                    <template slot-scope="{ row }">
+                        <el-button type="text" @click="handleQueryFile(row)"
+                            >查看附件</el-button
+                        >
+                    </template>
+                </el-table-column>
 
                 <!--                <el-table-column-->
                 <!--                    label="不通过原因"-->
@@ -513,6 +520,18 @@
                 <el-button @click="openPrint = false">关 闭</el-button>
             </div>
         </el-dialog>
+        <!-- 验收附件弹框 -->
+        <DialogModal
+            :dialogConfig="dialogConfig"
+            @closeDialogOuter="closeDialogOuter"
+        >
+            <template slot="outerContent">
+                <FileView
+                    :fileUrlView="fileUrlView"
+                    :fileNameView="fileNameView"
+                />
+            </template>
+        </DialogModal>
     </div>
 </template>
 
@@ -537,10 +556,12 @@ import {
     warehousingEntry,
 } from '@/api/store/newDevicesServiceCenterList'
 import vueEasyPrint from 'vue-easy-print'
+import FileView from '../component/fileView.vue'
+import DialogModal from '@/components/DialogModel'
 export default {
     // name: "NewDevicesWarehousing",
     dicts: ['sys_normal_disable'],
-    components: { vueEasyPrint },
+    components: { vueEasyPrint, FileView, DialogModal },
     data() {
         return {
             // 遮罩层
@@ -614,6 +635,13 @@ export default {
                     },
                 ],
             },
+            fileUrlView: '',
+            fileNameView: '',
+            dialogConfig: {
+                outerWidth: '30%',
+                outerTitle: '附件详情',
+                outerVisible: false,
+            },
         }
     },
     mounted() {
@@ -916,6 +944,18 @@ export default {
                 this.$store.dispatch('dict/cleanDict')
             })
         },
+
+        // 查看附件
+        handleQueryFile(row) {
+            console.log(row, '当前行数据')
+            this.fileUrlView = row.checkUrl
+            this.fileNameView = row.checkUrlName
+            this.dialogConfig.outerVisible = true
+        },
+        // 关闭附件弹框
+        closeDialogOuter(val) {
+            this.dialogConfig.outerVisible = val
+        },
     },
 }
 </script>

sgzb-ui/src/views/warehouseManage/newPurchase/toolsAcceptance/component/queryTools.vue

@@ -136,12 +136,12 @@
                 :show-overflow-tooltip="true"
             />
             <el-table-column
-                label="验收图片"
+                label="验收资料"
                 align="center"
                 prop="checkUrlName"
             >
-                <template slot-scope="scope">
+                <template slot-scope="{ row }">
-                    <template
+                    <!-- <template
                         v-if="
                             scope.row.imgUrlList &&
                             scope.row.imgUrlList.length > 0
@@ -156,7 +156,11 @@
                             class="img-box"
                         />
                     </template>
-                    <template v-else> - </template>
+                    <template v-else> - </template> -->
+
+                    <el-button type="text" @click="handleQueryFile(row)"
+                        >查看附件</el-button
+                    >
 
                     <!-- <div
                         v-for="(item, index) in scope.row.imgUrlList"
@@ -221,7 +225,7 @@
             :title="title"
             :visible.sync="open"
             v-if="open"
-            width="650px"
+            width="35%"
             append-to-body
             :close-on-click-modal="false"
         >
@@ -263,8 +267,8 @@
                         :max="form.purchaseNum"
                     />
                 </el-form-item>
-                <el-form-item label="验收图片" prop="checkUrl">
+                <el-form-item label="验收材料" prop="fileListNew" required>
-                    <el-upload
+                    <!-- <el-upload
                         :http-request="(obj) => imgUpLoad(obj, 'fileUrl')"
                         action="#"
                         :limit="5"
@@ -276,12 +280,34 @@
                         :on-preview="handlePictureCardPreview"
                         :on-remove="handleRemove"
                     >
-                        <!-- <img v-if="imageUrl" :src="uploadUrl+imageUrl" style="width: 140px;height: 140px;" class="avatar"> -->
                         <i class="el-icon-plus avatar-uploader-icon"></i>
                         <div class="el-upload__tip" slot="tip"
                             >请上传.png、.jpg,、.jpeg类型文件，且文件个数不可超过5个</div
                         >
-                    </el-upload>
+                    </el-upload> -->
+
+                    <Upload
+                        :file-list="form.fileListNew"
+                        :action-url="actionUrl"
+                        :limit="5"
+                        :multiple="true"
+                        @remove="handleRemove"
+                        @success="handleSuccess"
+                    >
+                        <template>
+                            <el-row class="Upload-tip" style="text-align: left">
+                                <el-button size="small" type="primary"
+                                    >点击上传</el-button
+                                >
+                            </el-row>
+                            <el-row class="upload-tip">
+                                <span class="tip-text"
+                                    >请上传jpg、jpeg、png、.pdf
+                                    、.doc、.docx格式的文件，单个文件大小不可超过1M，最多可上传5个文件</span
+                                >
+                            </el-row>
+                        </template>
+                    </Upload>
                 </el-form-item>
             </el-form>
             <div slot="footer" class="dialog-footer" style="text-align: center">
@@ -295,41 +321,61 @@
             :title="title"
             :visible.sync="openAll"
             v-if="openAll"
-            width="650px"
             append-to-body
         >
-            <el-form
+            <el-form ref="aform" :model="aform" :rules="arules">
-                ref="aform"
-                :model="aform"
-                :rules="arules"
-                label-width="120px"
-            >
                 <el-form-item label="验收结论" prop="checkResult">
                     <el-radio v-model="aform.checkResult" label="通过"
                         >通过</el-radio
                     >
                     <!-- <el-radio v-model="aform.checkResult" label="不通过">不通过</el-radio> -->
                 </el-form-item>
-                <el-form-item label="验收图片" prop="checkUrl">
+                <el-form-item
-                    <el-upload
+                    label="验收材料"
+                    prop="fileListNew"
+                    class="upload-box"
+                    required
+                >
+                    <!-- <el-upload
                         :http-request="(obj) => imgUpLoad(obj, 'fileUrl')"
                         action="#"
                         :limit="5"
                         :file-list="fileList1"
                         :show-file-list="true"
                         list-type="picture-card"
-                        accept=".png, .jpg, .jpeg"
+                        accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                         :on-preview="handlePictureCardPreview"
                         :class="{ disabled: uploadDisabled }"
                         :on-remove="handleRemove"
                     >
-                        <!-- <img v-if="imageUrl" :src="uploadUrl+imageUrl" style="width: 140px;height: 140px;" class="avatar"> -->
                         <i class="el-icon-plus avatar-uploader-icon"> </i>
-
                         <div class="el-upload__tip" slot="tip"
-                            >请上传.png、.jpg,、.jpeg类型文件，且文件个数不可超过5个</div
+                            >请上传.png、.jpg,、.jpeg、.doc、.docx类型文件，且文件个数不可超过5个</div
                         >
-                    </el-upload>
+                    </el-upload> -->
+
+                    <Upload
+                        :file-list="aform.fileListNew"
+                        :action-url="actionUrl"
+                        :limit="5"
+                        :multiple="true"
+                        @remove="handleRemove"
+                        @success="handleSuccess"
+                    >
+                        <template>
+                            <el-row class="Upload-tip">
+                                <el-button size="small" type="primary"
+                                    >点击上传</el-button
+                                >
+                            </el-row>
+                            <el-row class="upload-tip">
+                                <span class="tip-text"
+                                    >请上传jpg、jpeg、png、.pdf
+                                    、.doc、.docx格式的文件，单个文件大小不可超过1M，最多可上传5个文件</span
+                                >
+                            </el-row>
+                        </template>
+                    </Upload>
                 </el-form-item>
             </el-form>
             <div slot="footer" class="dialog-footer" style="text-align: center">
@@ -517,6 +563,18 @@
         <el-dialog :visible.sync="dialogVisible">
             <img width="100%" height="650px" :src="dialogImageUrl" alt />
         </el-dialog>
+
+        <DialogModal
+            :dialogConfig="dialogConfig"
+            @closeDialogOuter="closeDialogOuter"
+        >
+            <template slot="outerContent">
+                <FileView
+                    :fileUrlView="fileUrlView"
+                    :fileNameView="fileNameView"
+                />
+            </template>
+        </DialogModal>
     </div>
 </template>
 
@@ -539,6 +597,9 @@ import {
     delNoticeUser,
 } from '@/api/store/newBuy'
 import { imgUpLoad, fileUpLoad } from '@/api/system/upload'
+import Upload from './upload.vue'
+import FileView from '../../component/fileView.vue'
+import DialogModal from '@/components/DialogModel'
 
 export default {
     name: 'NewDevicesAccept',
@@ -557,6 +618,11 @@ export default {
             },
         },
     },
+    components: {
+        Upload,
+        FileView,
+        DialogModal,
+    },
     data() {
         return {
             //任务ID
@@ -616,7 +682,9 @@ export default {
             dialogVisible: false,
             //--------------
             // 表单参数
-            form: {},
+            form: {
+                fileListNew: [],
+            },
             // 表单校验
             rules: {
                 checkResult: [
@@ -633,16 +701,18 @@ export default {
                         trigger: 'blur',
                     },
                 ],
-                checkUrl: [
+                fileListNew: [
                     {
                         required: true,
-                        message: '验收图片不能为空',
+                        message: '请上传验收材料',
                         trigger: 'blur',
                     },
                 ],
             },
             // 表单参数
-            aform: {},
+            aform: {
+                fileListNew: [],
+            },
             // 表单校验
             arules: {
                 checkResult: [
@@ -652,10 +722,10 @@ export default {
                         trigger: 'blur',
                     },
                 ],
-                checkUrl: [
+                fileListNew: [
                     {
                         required: true,
-                        message: '验收图片不能为空',
+                        message: '请上传验收材料',
                         trigger: 'blur',
                     },
                 ],
@@ -675,6 +745,14 @@ export default {
                 ],
             },
             deptName: undefined,
+            actionUrl: process.env.VUE_APP_BASE_API + '/system/sys/file/upload',
+            fileUrlView: '',
+            fileNameView: '',
+            dialogConfig: {
+                outerWidth: '30%',
+                outerTitle: '附件详情',
+                outerVisible: false,
+            },
         }
     },
     computed: {
@@ -886,7 +964,8 @@ export default {
             this.$set(this.form, 'checkNum', row.purchaseNum)
             this.$set(this.form, 'checkUrl', '')
             this.$set(this.form, 'checkUrlName', '')
-            this.fileList = []
+            this.$set(this.form, 'fileListNew', [])
+            // this.fileList = []
             this.checkUrlList = []
             this.checkUrlNameList = []
             this.open = true
@@ -902,6 +981,7 @@ export default {
                 checkResult: '通过',
                 checkUrl: '',
                 checkUrlName: '',
+                fileListNew: [],
             }
             this.imageUrl = ''
             this.openAll = true
@@ -909,8 +989,16 @@ export default {
         },
         /** 提交按钮 */
         submitForm: function () {
-            this.form.checkUrl = this.checkUrlList.join(',')
+            let fileUrl = ''
-            this.form.checkUrlName = this.checkUrlNameList.join(',')
+            let fileName = ''
+
+            this.form.fileListNew.map((e) => {
+                fileUrl += e.url + ','
+                fileName += e.name + ','
+            })
+            this.form.checkUrl = fileUrl.substring(fileUrl.length - 1, 1)
+            this.form.checkUrlName = fileName.substring(fileName.length - 1, 1)
+
             // console.log(this.form)
             // console.log(equipments)
             this.$refs['form'].validate((valid) => {
@@ -923,9 +1011,10 @@ export default {
                                 type: 'success',
                             })
                             this.open = false
-                            this.fileList = []
+                            this.form.fileListNew = []
-                            this.checkUrlList = []
+                            // this.fileList = []
-                            this.checkUrlNameList = []
+                            // this.checkUrlList = []
+                            // this.checkUrlNameList = []
                             this.getTaskInfo()
                         }
                     })
@@ -933,10 +1022,17 @@ export default {
             })
         },
         submitListForm: function () {
-            this.aform.checkUrl = this.checkUrlList1.join(',')
+            // this.aform.checkUrl = this.checkUrlList1.join(',')
-            this.aform.checkUrlName = this.checkUrlNameList1.join(',')
+            // this.aform.checkUrlName = this.checkUrlNameList1.join(',')
-            // console.log(this.aform)
+            let fileUrl = ''
-            // console.log(equipments)
+            let fileName = ''
+            this.aform.fileListNew.map((e) => {
+                fileUrl += e.url + ','
+                fileName += e.name + ','
+            })
+            this.aform.checkUrl = fileUrl.substring(fileUrl.length - 1, 1)
+            this.aform.checkUrlName = fileName.substring(fileName.length - 1, 1)
+
             this.$refs['aform'].validate((valid) => {
                 if (valid) {
                     this.ids.forEach((item) => {
@@ -955,9 +1051,10 @@ export default {
                             })
                             this.openAll = false
                             this.open = false
-                            this.fileList1 = []
+                            // this.fileList1 = []
-                            this.checkUrlList1 = []
+                            // this.checkUrlList1 = []
-                            this.checkUrlNameList1 = []
+                            // this.checkUrlNameList1 = []
+                            this.aform.fileListNew = []
                             this.getTaskInfo()
                         }
                     })
@@ -994,28 +1091,28 @@ export default {
         handleAvatarSuccess(res, file) {
             // console.log("success")
         },
-        handleRemove(file, fileList) {
+        // handleRemove(file, fileList) {
-            if (this.open) {
+        //     if (this.open) {
-                let sum = 0
+        //         let sum = 0
-                this.checkUrlNameList.forEach((item, index) => {
+        //         this.checkUrlNameList.forEach((item, index) => {
-                    if (item == file.name) {
+        //             if (item == file.name) {
-                        sum = index
+        //                 sum = index
-                    }
+        //             }
-                })
+        //         })
-                this.checkUrlNameList.splice(sum, 1)
+        //         this.checkUrlNameList.splice(sum, 1)
-                this.checkUrlList.splice(sum, 1)
+        //         this.checkUrlList.splice(sum, 1)
-            }
+        //     }
-            if (this.openAll) {
+        //     if (this.openAll) {
-                let sum1 = 0
+        //         let sum1 = 0
-                this.checkUrlNameList1.forEach((item, index) => {
+        //         this.checkUrlNameList1.forEach((item, index) => {
-                    if (item == file.name) {
+        //             if (item == file.name) {
-                        sum1 = index
+        //                 sum1 = index
-                    }
+        //             }
-                })
+        //         })
-                this.checkUrlNameList1.splice(sum1, 1)
+        //         this.checkUrlNameList1.splice(sum1, 1)
-                this.checkUrlList1.splice(sum1, 1)
+        //         this.checkUrlList1.splice(sum1, 1)
-            }
+        //     }
-        },
+        // },
         //图片点击查看
         handlePictureCardPreview(file) {
             // console.log(file)
@@ -1053,6 +1150,49 @@ export default {
                 this.$store.dispatch('dict/cleanDict')
             })
         },
+        // 移除文件
+        handleRemove(file) {
+            if (this.openAll) {
+                this.aform.fileListNew = this.aform.fileListNew.filter(
+                    (e) => e.uid !== file.uid,
+                )
+            }
+            if (this.open) {
+                this.form.fileListNew = this.form.fileListNew.filter(
+                    (e) => e.uid !== file.uid,
+                )
+            }
+
+            console.log(this.aform, '移除后--')
+        },
+        // 文件上传成功
+        handleSuccess(res) {
+            if (res.code == 200) {
+                const fileObj = {
+                    name: res.data.fileName,
+                    url: res.data.fileUrl,
+                }
+                if (this.openAll) {
+                    this.aform.fileListNew.push(fileObj)
+                    this.$refs.aform.clearValidate('fileListNew')
+                }
+                if (this.open) {
+                    this.form.fileListNew.push(fileObj)
+                    this.$refs.form.clearValidate('fileListNew')
+                }
+            }
+        },
+        // 查看附件
+        handleQueryFile(row) {
+            console.log(row, '当前行数据')
+            this.fileUrlView = row.checkUrl
+            this.fileNameView = row.checkUrlName
+            this.dialogConfig.outerVisible = true
+        },
+        // 关闭附件弹框
+        closeDialogOuter(val) {
+            this.dialogConfig.outerVisible = val
+        },
     },
 }
 </script>
@@ -1078,4 +1218,22 @@ export default {
     font-size: 14px;
     color: red;
 }
+
+.upload-box {
+    display: flex;
+
+    .Upload-tip {
+        text-align: left;
+    }
+}
+
+.upload-tip {
+    text-align: left;
+
+    .tip-text {
+        font-size: 13px;
+        color: red;
+        letter-spacing: 1px;
+    }
+}
 </style>

sgzb-ui/src/views/warehouseManage/newPurchase/toolsAcceptance/component/upload.vue

@@ -0,0 +1,117 @@
+<template>
+    <el-upload
+        class="upload-demo"
+        :action="actionUrl"
+        :on-preview="handlePreview"
+        :on-remove="handleRemove"
+        :before-remove="beforeRemove"
+        :multiple="multiple"
+        :limit="limit"
+        :on-exceed="handleExceed"
+        :file-list="fileList"
+        :headers="headers"
+        :on-success="handleSuccess"
+        :data="uploadData"
+        :before-upload="beforeUpload"
+    >
+        <slot name="default">
+            <el-button size="small" type="primary">点击上传</el-button>
+        </slot>
+        <!-- <div slot="tip" class="el-upload__tip">{{ uploadTip }}</div> -->
+    </el-upload>
+</template>
+
+<script>
+import { getToken } from '@/utils/auth'
+export default {
+    name: 'UploadFile',
+    props: {
+        fileList: {
+            type: Array,
+            default: () => [],
+        },
+        actionUrl: {
+            type: String,
+            default: 'https://jsonplaceholder.typicode.com/posts/',
+        },
+        limit: {
+            type: Number,
+            default: 3,
+        },
+        // uploadTip: {
+        //   type: String,
+        //   default: '只能上传jpg/png文件，且不超过500kb'
+        // },
+        multiple: {
+            type: Boolean,
+            default: true,
+        },
+    },
+    data() {
+        return {
+            uploadImgUrl:
+                process.env.VUE_APP_BASE_API + '/dev-api' + this.actionUrl,
+            headers: {
+                Authorization: 'Bearer ' + getToken(),
+            },
+            uploadData: {
+                fileType: 'ma',
+            },
+        }
+    },
+    methods: {
+        handleRemove(file, fileList) {
+            this.$emit('remove', file, fileList)
+        },
+        handleSuccess(response, file, fileList) {
+            this.$emit('success', response, fileList)
+        },
+        handlePreview(file) {
+            this.$emit('preview', file)
+        },
+        handleExceed(files, fileList) {
+            // this.$message.warning(
+            //     `当前已选择 ${this.limit} 个文件，本次选择了 ${
+            //         files.length
+            //     } 个文件，共选择了 ${files.length + fileList.length} 个文件`,
+            // )
+            // this.$emit('exceed', files, fileList)
+
+            this.$message.error(`最多只能上传${this.limit}个文件！`)
+        },
+        beforeRemove(file, fileList) {
+            // return this.$confirm(`确定移除 ${file.name} ？`)
+            //   .then(() => {
+            //     this.$emit('before-remove', file, fileList)
+            //   })
+            //   .catch(() => {})
+        },
+        beforeUpload(file) {
+            const isJPGorPNG =
+                file.type == 'image/png' ||
+                file.type == 'image/jpg' ||
+                file.type == 'image/jpeg' ||
+                file.type == 'application/pdf' ||
+                file.type ==
+                    'application/vnd.openxmlformats-officedocument.wordprocessingml.document' ||
+                file.type == 'application/msword'
+            const isLt5M = file.size / 1024 / 1024 < 10 // 小于 5MB
+            if (!isJPGorPNG) {
+                this.$message.error(
+                    '只能上传 jpg、jpeg、png 、.pdf、.doc、.docx 格式的文件！',
+                )
+            }
+            if (!isLt5M) {
+                this.$message.error('上传图片大小不能超过 10MB')
+            }
+            return isJPGorPNG && isLt5M
+        },
+    },
+}
+</script>
+
+<style scoped>
+.upload-demo .el-upload__tip {
+    margin-top: 10px;
+}
+</style>