资质多图片上传

ywj_dev
郑明梁 2 years ago
parent 579ec615cf
commit 75166d488c

@ -112,10 +112,9 @@
:action="this.uploadUrl"
:on-preview="uploadHandlePreview"
:on-remove="uploadHandleRemove"
:limit="1"
:headers="headers"
:on-exceed="uploadHandleExceed"
accept=".jpg,.png,.pdf,.doc"
accept=".jpg,.png,.doc"
:on-change="uploadOnchange"
:on-success="uploadHandleSuccess"
:on-error="uploadHandleError"
@ -146,6 +145,7 @@
import draggable from "vuedraggable";
import store from "../../../store";
import {insertCompanyCert, updateCompanyCert} from "../../../api/purchase/companyCert";
import ElImageViewer from "element-ui/packages/image/src/image-viewer"
export default {
name: "supCompanyCertAdd",
@ -172,6 +172,7 @@ export default {
return {
BASE_URL: process.env.VUE_APP_BASE_API,
code: "",
isCleck:false,
formData: {
type: 0,
vailDate: null,
@ -200,6 +201,7 @@ export default {
},
components: {
draggable,
ElImageViewer
},
methods: {
submitUpload() {
@ -296,15 +298,15 @@ export default {
console.log(this.fileList);
},
uploadHandleExceed(files, fileList) {
this.$message.warning(`当前限制选择 1 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`);
},
uploadOnchange(file, fileList) {
let fileName = file.name;
let uid = file.uid
let pos = fileName.lastIndexOf(".");
let lastName = fileName.substring(pos, fileName.length);
if (lastName.toLowerCase() !== ".jpg" && lastName.toLowerCase() !== ".png" && lastName.toLowerCase() !== ".doc" && lastName.toLowerCase() !== ".pdf") {
this.$message.error("上传文件只能是 jpg,png,doc,pdf 格式");
if (lastName.toLowerCase() !== ".jpg" && lastName.toLowerCase() !== ".png" && lastName.toLowerCase() !== ".doc") {
this.$message.error("上传文件只能是 jpg,png,doc格式");
for (let i = 0; i < fileList.length; i++) {//list
if (fileList[i].uid === uid) {
fileList.splice(i, 1)
@ -326,7 +328,12 @@ export default {
},
uploadHandleSuccess(response, file, fileList) {
if (response.code === 20000) {
this.formData.filePath = response.data.name;
if(this.formData.filePath==null || this.isCleck==true){
this.formData.filePath=response.data.name+",";
this.isCleck=false;
}else{
this.formData.filePath+=response.data.name+",";
}
} else {
this.$message.error("文件上传失败:" + response.message);
}
@ -363,6 +370,7 @@ export default {
}
if (this.formData.filePath != null) {
this.choiceFile = "更换文件";
this.isCleck=true;
} else {
this.choiceFile = "选取文件";
}

@ -274,7 +274,7 @@
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="confirm"></el-button>
<el-button type="primary" @click="cancel"></el-button>
</div>
</el-dialog>
@ -525,29 +525,18 @@ export default {
return [
'png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff'].indexOf(ext.toLowerCase()) !== -1;
},
showImgViewer(row) {
var varindex = row.filePath.lastIndexOf(".");
var varext = row.filePath.substring(varindex + 1);
var isImage = this.isAssetTypeAnImage(varext);
if (isImage == true) {
this.certFileUrl = this.BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
this.imgList = [];
previewImage({imageUrl: row.filePath, certFileUrl: this.certFileUrl}).then(response => {
if (response.code === 20000) {
this.imgList.push(response.data);
}
});
this.imgViewerVisible = true;
const m = (e) => {
e.preventDefault()
};
document.body.style.overflow = 'hidden';
document.addEventListener("touchmove", m, false); //
} else {
this.toViewCompanyCert(row);
}
showImgViewer(row){
this.certFileUrl = this.BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
this.imgList=[];
previewImage({imageUrl:row.filePath,certFileUrl:this.certFileUrl}).then(response => {
if (response.code === 20000) {
this.imgList=response.data;
}
});
this.imgViewerVisible = true;
const m = (e) => { e.preventDefault() };
document.body.style.overflow = 'hidden';
document.addEventListener("touchmove", m, false); //
},
closeImgViewer() {
this.imgViewerVisible = false;

@ -545,15 +545,12 @@ export default {
'png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff'].indexOf(ext.toLowerCase()) !== -1;
},
showImgViewer(row) {
var varindex = row.filePath.lastIndexOf(".");
var varext = row.filePath.substring(varindex + 1);
var isImage = this.isAssetTypeAnImage(varext);
if (isImage == true) {
this.certFileUrl = this.BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
this.imgList = [];
previewImage({imageUrl: row.filePath, certFileUrl: this.certFileUrl}).then(response => {
if (response.code === 20000) {
this.imgList.push(response.data);
this.imgList=response.data;
}
});
this.imgViewerVisible = true;
@ -562,11 +559,6 @@ export default {
};
document.body.style.overflow = 'hidden';
document.addEventListener("touchmove", m, false); //
} else {
this.toViewCompanyCert(row);
}
},
closeImgViewer() {
this.imgViewerVisible = false;

@ -228,13 +228,14 @@
<el-table-column label="操作" width="250">
<template slot-scope="scope">
<el-button type="text" size="small" @click.native="addCert(scope.row)">编辑</el-button>
<el-button type="text" size="mini" @click.native="showImgViewer(scope.row)">预览</el-button>
<el-image-viewer v-if="imgViewerVisible" style="z-index:9999" :on-close="closeImgViewer" :url-list="imgList" />
<el-button type="text" size="mini" @click.native="showImgViewer(scope.row)">预览</el-button>
<el-button type="text" size="small" v-if="scope.row.auditStatus == 0 || scope.row.auditStatus == 2|| scope.row.auditStatus == 6" @click.native="deleteCompanyCert(scope.row)"></el-button>
</template>
</el-table-column>
</el-table>
<el-image-viewer v-if="imgViewerVisible" style="z-index:9999" :on-close="closeImgViewer" :url-list="imgList" />
<pagination
v-show="certTotal>0"
:total="certTotal"
@ -571,26 +572,17 @@ export default {
indexOf(ext.toLowerCase()) !== -1;
},
showImgViewer(row){
var varindex= row.filePath.lastIndexOf(".");
var varext = row.filePath.substring(varindex+1);
var isImage=this.isAssetTypeAnImage(varext);
if(isImage==true){
this.certFileUrl = this.BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
this.imgList=[];
previewImage({imageUrl:row.filePath,certFileUrl:this.certFileUrl}).then(response => {
if (response.code === 20000) {
this.imgList.push(response.data);
this.imgList=response.data;
}
});
this.imgViewerVisible = true;
const m = (e) => { e.preventDefault() };
document.body.style.overflow = 'hidden';
document.addEventListener("touchmove", m, false); //
}else{
this.toViewCompanyCert(row);
}
},
closeImgViewer(){
this.imgViewerVisible = false;

@ -555,26 +555,17 @@ export default {
indexOf(ext.toLowerCase()) !== -1;
},
showImgViewer(row){
var varindex= row.filePath.lastIndexOf(".");
var varext = row.filePath.substring(varindex+1);
var isImage=this.isAssetTypeAnImage(varext);
if(isImage==true){
this.certFileUrl = this.BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
this.imgList=[];
previewImage({imageUrl:row.filePath,certFileUrl:this.certFileUrl}).then(response => {
if (response.code === 20000) {
this.imgList.push(response.data);
this.imgList=response.data;
}
});
this.imgViewerVisible = true;
const m = (e) => { e.preventDefault() };
document.body.style.overflow = 'hidden';
document.addEventListener("touchmove", m, false); //
}else{
this.toViewCompanyCert(row);
}
},
closeImgViewer(){
this.imgViewerVisible = false;

@ -307,8 +307,6 @@
</el-button
>
<el-button type="text" size="mini" @click.native="showImgViewer(scope.row)">预览</el-button>
<el-image-viewer v-if="imgViewerVisible" style="z-index:9999" :on-close="closeImgViewer"
:url-list="imgList"/>
<el-button
type="text"
size="small"
@ -327,7 +325,8 @@
</template>
</el-table-column>
</el-table>
<el-image-viewer v-if="imgViewerVisible" style="z-index:9999" :on-close="closeImgViewer"
:url-list="imgList"/>
<pagination
v-show="certTotal>0"
:total="certTotal"
@ -667,15 +666,11 @@ export default {
'png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff'].indexOf(ext.toLowerCase()) !== -1;
},
showImgViewer(row) {
var varindex = row.filePath.lastIndexOf(".");
var varext = row.filePath.substring(varindex + 1);
var isImage = this.isAssetTypeAnImage(varext);
if (isImage == true) {
this.certFileUrl = this.BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
this.imgList = [];
previewImage({imageUrl: row.filePath, certFileUrl: this.certFileUrl}).then(response => {
if (response.code === 20000) {
this.imgList.push(response.data);
this.imgList=response.data;
}
});
this.imgViewerVisible = true;
@ -684,11 +679,6 @@ export default {
};
document.body.style.overflow = 'hidden';
document.addEventListener("touchmove", m, false); //
} else {
this.toViewCompanyCert(row);
}
},
closeImgViewer() {
this.imgViewerVisible = false;

@ -193,17 +193,13 @@
<template slot-scope="scope">
<el-button type="text" size="small" @click.native="addCert(scope.row)">编辑</el-button>
<el-button type="text" size="small" @click.native="showImgViewer(scope.row)">预览</el-button>
<el-image-viewer v-if="imgViewerVisible" style="z-index:9999" :on-close="closeImgViewer" :url-list="imgList" />
<el-button type="text" size="small"
v-if="scope.row.auditStatus == 0 || scope.row.auditStatus == 2|| scope.row.auditStatus == 6"
@click.native="deleteCompanyCert(scope.row)">删除
</el-button>
<el-button type="text" size="small" v-if="scope.row.auditStatus == 2"
@click.native="explainCompanyCert(scope.row)">说明
</el-button>
<el-button type="text" size="small" v-if="scope.row.auditStatus == 0 || scope.row.auditStatus == 2|| scope.row.auditStatus == 6" @click.native="deleteCompanyCert(scope.row)"></el-button>
<el-button type="text" size="small" v-if="scope.row.auditStatus == 2" @click.native="explainCompanyCert(scope.row)"></el-button>
</template>
</el-table-column>
</el-table>
<el-image-viewer v-if="imgViewerVisible" style="z-index:9999" :on-close="closeImgViewer" :url-list="imgList"/>
<pagination
v-show="certTotal>0"
:total="certTotal"
@ -274,11 +270,10 @@ import {regionDataPlus, CodeToText,} from "element-china-area-data";
import {filterCompanyCert, deleteCompanyCert, updateCompanyCert} from "@/api/purchase/companyCert";
import companyAddCert from "@/views/purchase/cert/supCertAddDialog";
import supCertSetSelectDialog from "@/views/purchase/cert/supCertSetSelectDialog";
import ElImageViewer from "element-ui/packages/image/src/image-viewer"
import draggable from "vuedraggable";
import {getCompany} from "@/api/supplier/company";
import { previewImage } from '@/api/purchase/supCompany'
import { previewImage } from '@/api/purchase/supCompany';
import ElImageViewer from "element-ui/packages/image/src/image-viewer";
export default {
@ -539,30 +534,20 @@ export default {
});
},
isAssetTypeAnImage(ext) {
return [
'png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff'].
indexOf(ext.toLowerCase()) !== -1;
},
showImgViewer(row){
var varindex= row.filePath.lastIndexOf(".");
var varext = row.filePath.substring(varindex+1);
var isImage=this.isAssetTypeAnImage(varext);
if(isImage==true){
this.certFileUrl = this.BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
this.imgList=[];
previewImage({imageUrl:row.filePath,certFileUrl:this.certFileUrl}).then(response => {
if (response.code === 20000) {
this.imgList.push(response.data);
this.imgList=response.data;
}
console.log(this.imgList)
this.imgViewerVisible = true;
});
this.imgViewerVisible = true;
const m = (e) => { e.preventDefault() };
document.body.style.overflow = 'hidden';
document.addEventListener("touchmove", m, false); //
}else{
this.toViewCompanyCert(row);
}
},
closeImgViewer(){
this.imgViewerVisible = false;

Loading…
Cancel
Save