You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
spms-vue/src/views/warehouse/companyAddSalesman.vue

348 lines
14 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div>
<el-form :model="formData" :rules="formRules" ref="dataForm">
<div style="display: flex; margin-top: -30px" v-if="hiddenAdd === true && hiddenAdd2 !== true">
<el-button style="margin: 0 20px 0 auto"type="primary" size="small" @click.native="updateAuditStatus(1)">通过</el-button>
<el-button style="margin: 0 20px 0 0"type="primary" size="small" @click.native="updateAuditStatus(2)">不通过</el-button>
<el-button style="margin: 0 20px 0 0" @click="centerDialogVisible = false">取消</el-button>
</div>
<el-card>
<el-button-group style="display: flex" v-if="hiddenAdd !== true">
<el-button
type="primary"
@click.native="submitUpload()"
style="margin: 0 60px 10px auto; height: 35px"
:loading="loading"
>提交
</el-button
>
</el-button-group>
<el-row :gutter="20">
<el-col :span="10">
<el-form-item label="姓名:" label-width="150px" prop="name">
<el-input v-model="formData.name" auto-complete="off" :disabled="hiddenAdd"></el-input>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="电话:" label-width="150px" prop="tel">
<el-input v-model="formData.tel" auto-complete="off" :disabled="hiddenAdd">></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="10">
<el-form-item label="手机:" label-width="150px" prop="phone">
<el-input v-model="formData.phone" auto-complete="off" :disabled="hiddenAdd">></el-input>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="邮箱:" label-width="150px" prop="email">
<el-input v-model="formData.email" auto-complete="off" :disabled="hiddenAdd">></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="10" class="el-col">
<el-form-item label="证件类型:" label-width="150px" prop="certType">
<el-select
size="small"
v-model="formData.certType"
placeholder="证件类型"
style="width: 100%;"
:disabled="hiddenAdd">
>
<el-option label="身份证" value="1"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="证件号码:" label-width="150px" prop="certCode">
<el-input v-model="formData.certCode" auto-complete="off" :disabled="hiddenAdd">></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="10" class="el-col">
<el-form-item label="证件电子档:" label-width="150px">
<el-upload
v-if="hiddenAdd !== true"
class="upload-demo"
ref="upload"
:action="this.uploadUrl"
:limit="1"
:headers="headers"
:on-exceed="uploadHandleExceed"
accept=".jpg,.png"
:on-change="uploadOnchange"
:on-success="uploadHandleSuccess"
:file-list="fileList"
:data="{type:'image5'}"
:auto-upload="false">
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<div>只能上传 .jpg,.png 文件,且不超过 2 MB</div>
</el-upload>
<el-button
v-if="hiddenAdd === true"
:disabled="formData.filePath === null"
type="primary"
@click.native="openFile(formData.filePath)"
style="margin: 0 60px 10px auto; height: 35px"
:loading="loading"
>查看
</el-button
>
</el-form-item>
</el-col>
<el-col :span="10" class="el-col">
<el-form-item label="授权书电子档:" label-width="150px">
<el-upload
v-if="hiddenAdd !== true"
class="upload-demo2"
ref="upload2"
:action="this.uploadUrl"
:limit="1"
:headers="headers"
:on-exceed="uploadHandleExceed"
accept=".jpg,.png"
:on-change="uploadOnchange"
:on-success="uploadHandleSuccess2"
:file-list="fileList2"
:data="{type:'image5'}"
:auto-upload="false">
<el-button slot="trigger" size="small" type="primary"></el-button>
<div>只能上传 .jpg,.png 文件且不超过 2 MB</div>
</el-upload>
<el-button
v-if="hiddenAdd === true"
:disabled="formData.filePath2 === null"
type="primary"
@click.native="openFile(formData.filePath2)"
style="margin: 0 60px 10px auto; height: 35px"
:loading="loading"
>查看
</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-card>
</el-form>
</div>
</template>
<script>
import draggable from "vuedraggable";
import {saveAs} from "file-saver";
import {parseTime} from "../../filtres/index";
import store from "../../store";
import {BASE_URL} from "../../config/app";
import {insertCompanySalesman, updateCompanySalesman} from "../../api/warehouse/companySalesman";
export default {
name: "idQuery",
props: {
closeDialog: {
type: Function,
required: true,
},
idQuery: {
type: Object,
required: true,
},
},
data() {
return {
code: "",
formData: {
certType: "1"
},
formRules: {
name: [
{required: true, message: "请输入姓名", trigger: "blur"}
],
tel: [
{required: true, message: "请输入电话", trigger: "blur"}
],
certType: [
{required: true, message: "请选择证件类型", trigger: "blur"}
],
certCode: [
{required: true, message: "请输入证件号码", trigger: "blur"}
],
},
loading: false,
uploadUrl: "",
fileList: [],
fileList2: [],
hiddenAdd: false,
hiddenAdd2: false,
headers: {},
};
},
components: {
draggable,
},
methods: {
submitUpload() {
this.$refs["dataForm"].validate(valid => {
if (valid) {
if (this.$refs.upload.uploadFiles.length > 0) {
this.$refs.upload.submit();
} else if (this.$refs.upload2.uploadFiles.length > 0) {
this.$refs.upload2.submit();
} else if (this.$isBlank(this.idQuery)) {
this.$message.warning(`请选择文件`);
} else {
this.onSubmit();
}
}
});
},
openFile(filePath) {
window.open(BASE_URL + "/udiwms/image/register/file/getImage?type=image5&name=" + filePath)
},
updateAuditStatus(num) {
this.formData.auditStatus = num;
updateCompanySalesman(this.formData).then(response => {
this.loading = false;
if (response.code === 20000) {
this.$message.success("成功");
this.closeDialog(true);
} else {
this.$message.error(response.message);
}
});
},
onSubmit() {
this.loading = true;
if (this.$isBlank(this.idQuery)) {
this.formData.customerId = store.getters.customerId;
insertCompanySalesman(this.formData).then(response => {
this.loading = false;
if (response.code === 20000) {
this.$message.success("添加成功");
this.closeDialog(true);
} else {
this.$message.error(response.message);
}
});
} else {
updateCompanySalesman(this.formData).then(response => {
this.loading = false;
if (response.code === 20000) {
this.$message.success("修改成功");
this.closeDialog(true);
} else {
this.$message.error(response.message);
}
});
}
},
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") {
this.$message.error("上传文件只能是 .jpg,.png 格式");
for (let i = 0; i < fileList.length; i++) {//从list删除
if (fileList[i].uid === uid) {
fileList.splice(i, 1)
}
}
return;
}
// 限制上传文件的大小
const isLt = file.size / 1024 / 1024 / 2 <= 1;
if (!isLt) {
this.$message.error("上传文件大小不能超过 2MB");
for (let i = 0; i < fileList.length; i++) {
if (fileList[i].uid === uid) {
fileList.splice(i, 1)
}
}
}
return isLt;
},
uploadHandleSuccess(response, file, fileList) {
if (response.code === 20000) {
if (this.$isBlank(this.idQuery)) {
this.formData.filePath = response.data.name;
} else {
this.formData.newFilePath = response.data.name;
}
if(this.$refs.upload2.uploadFiles.length > 0) {
this.$refs.upload2.submit();
} else {
this.onSubmit();
}
} else {
this.$message.error("文件上传失败:" + response.message);
}
},
uploadHandleSuccess2(response, file, fileList) {
if (response.code === 20000) {
if (this.$isBlank(this.idQuery)) {
this.formData.filePath2 = response.data.name;
} else {
this.formData.newFilePath2 = response.data.name;
}
this.onSubmit();
} else {
this.$message.error("文件上传失败:" + response.message);
}
},
},
filters: {},
mounted() {
document.body.ondrop = function (event) {
event.preventDefault();
event.stopPropagation();
};
},
created() {
this.uploadUrl = BASE_URL + "/udiwms/upload/register/file";
if (this.$isNotBlank(this.idQuery)) {
this.formData = this.idQuery.formData;
if (this.$isNotBlank(this.idQuery.toView)) {
this.hiddenAdd = true;
if (this.$isNotBlank(this.idQuery.toView2)) {
this.hiddenAdd2 = true;
}
} else {
this.hiddenAdd = false;
}
}
this.headers = {
ADMIN_ID: store.getters.adminId,
ADMIN_TOKEN: store.getters.token,
};
},
};
</script>
<style>
.ao-text {
width: 100%;
font-size: 13px;
font-family: "Microsoft YaHei";
float: right;
text-align: right;
margin-top: 10px;
}
</style>