You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
282 lines
8.4 KiB
282 lines
8.4 KiB
<template>
|
|
<div class="app-container">
|
|
<el-row :gutter="15">
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="110px">
|
|
<el-col :span="24">
|
|
<el-form-item label="计划审批日期" prop="approvalTime">
|
|
<el-date-picker
|
|
clearable
|
|
size="small"
|
|
style="width: 100%"
|
|
v-model="form.approvalTime"
|
|
type="date"
|
|
value-format="yyyy-MM-dd"
|
|
placeholder="选择计划审批日期"
|
|
>
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="审批人信息" prop="approvalPerson">
|
|
<el-input
|
|
v-model="form.approvalPerson"
|
|
placeholder="请输入审批人信息"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="审批意见" prop="approvalOpinion">
|
|
<el-input
|
|
v-model="form.approvalOpinion"
|
|
placeholder="请输入审批意见"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="意见附件" prop="opinionAttachment">
|
|
<!-- <el-input
|
|
v-model="form.opinionAttachment"
|
|
placeholder="请输入意见附件"
|
|
/> -->
|
|
<el-upload
|
|
class="upload-demo"
|
|
action="thinking/common/upload"
|
|
:headers="headers"
|
|
:on-preview="handlePreview"
|
|
:on-remove="handleRemove"
|
|
:before-remove="beforeRemove"
|
|
multiple
|
|
:on-exceed="handleExceed"
|
|
:on-success="submitOpinionUpload"
|
|
:file-list="opinionFileList"
|
|
>
|
|
<el-button size="small" type="primary" plain>
|
|
<i class="el-icon-upload el-icon--right"></i>
|
|
点击上传
|
|
</el-button>
|
|
<div slot="tip" class="el-upload__tip">
|
|
支持jpg/png/pdf/word/excel文件等，不超过100M
|
|
</div>
|
|
</el-upload>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-form>
|
|
</el-row>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button type="primary" @click="submitForm">保存</el-button>
|
|
<el-button @click="cancel">取消</el-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
listPlanApproval,
|
|
getPlanApproval,
|
|
delPlanApproval,
|
|
addPlanApproval,
|
|
updatePlanApproval,
|
|
exportPlanApproval,
|
|
} from "@/api/earlyStage/planApproval";
|
|
import { getToken } from "@/utils/auth";
|
|
import { getFileStream } from "@/api/system/upload";
|
|
|
|
export default {
|
|
name: "PlanApproval",
|
|
props: ["proNo", "planId"],
|
|
data() {
|
|
return {
|
|
// 遮罩层
|
|
loading: true,
|
|
// 查询参数
|
|
queryParams: {
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
ids: null,
|
|
data: {
|
|
approvalTime: null,
|
|
approvalPerson: null,
|
|
approvalOpinion: null,
|
|
opinionAttachment: null,
|
|
planId: null,
|
|
proNo: null,
|
|
createUid: null,
|
|
createTime: null,
|
|
updateUid: null,
|
|
updateTime: null,
|
|
owerDept: null,
|
|
remark: null,
|
|
},
|
|
},
|
|
// 表单参数
|
|
form: {},
|
|
// 表单校验
|
|
rules: {
|
|
approvalTime: [
|
|
{ required: true, message: "选择计划审批日期", trigger: "blur" },
|
|
],
|
|
approvalPerson: [
|
|
{
|
|
required: true,
|
|
message: "请输入审批人信息",
|
|
trigger: "blur",
|
|
},
|
|
{max:250,message:"字符长度最大为250",trigger:"blur"}
|
|
],
|
|
approvalOpinion: [
|
|
{ required: true, message: "请输入审批意见", trigger: "blur" },
|
|
{max:250,message:"字符长度最大为250",trigger:"blur"}
|
|
],
|
|
},
|
|
// 意见附件
|
|
opinionFileList: [],
|
|
// 请求头
|
|
headers: {
|
|
jianwei: "jwtech " + getToken(),
|
|
},
|
|
};
|
|
},
|
|
created() {
|
|
this.getList();
|
|
},
|
|
// 父组件 利用axios请求得到的值 传送到子组件，要监听，否则初始渲染时为空
|
|
watch: {
|
|
proNo: function (n, o) {
|
|
this.proNo = n;
|
|
this.getList();
|
|
},
|
|
planId: function (n, o) {
|
|
this.planId = n;
|
|
this.getList();
|
|
},
|
|
},
|
|
methods: {
|
|
/** 查询计划编制审批信息列表 */
|
|
getList() {
|
|
this.loading = true;
|
|
// 当planId存在时才发送请求，防止子组件渲染时，一开始planId为空，后面planId才有值
|
|
if (this.planId) {
|
|
this.queryParams.data.planId = this.planId;
|
|
// console.log("this.planId", this.planId);
|
|
listPlanApproval(this.queryParams).then((response) => {
|
|
// console.log("response", response.records);
|
|
// 当审批存在时，在赋值
|
|
if (response.records[0]) {
|
|
this.form = response.records[0];
|
|
if (response.records[0].opinionAttachment) {
|
|
this.opinionFileList = JSON.parse(
|
|
response.records[0].opinionAttachment
|
|
);
|
|
}
|
|
} else {
|
|
this.reset();
|
|
}
|
|
|
|
this.loading = false;
|
|
});
|
|
}
|
|
},
|
|
|
|
// 表单重置
|
|
reset() {
|
|
this.form = {
|
|
id: null,
|
|
approvalTime: null,
|
|
approvalPerson: null,
|
|
approvalOpinion: null,
|
|
opinionAttachment: null,
|
|
planId: null,
|
|
proNo: null,
|
|
createUid: null,
|
|
createTime: null,
|
|
updateUid: null,
|
|
updateTime: null,
|
|
owerDept: null,
|
|
remark: null,
|
|
};
|
|
this.resetForm("form");
|
|
this.opinionFileList = [];
|
|
},
|
|
/** 提交按钮 */
|
|
submitForm() {
|
|
this.$refs["form"].validate((valid) => {
|
|
// 合同附件
|
|
this.form.opinionAttachment = JSON.stringify(this.opinionFileList);
|
|
// console.log("this.form", this.form);
|
|
if (valid) {
|
|
if (this.form.id != null) {
|
|
updatePlanApproval(this.form).then((response) => {
|
|
if (response.code === 200) {
|
|
this.msgSuccess("修改成功");
|
|
this.getList();
|
|
}
|
|
});
|
|
} else {
|
|
this.form.planId = this.planId;
|
|
this.form.proNo = this.proNo;
|
|
addPlanApproval(this.form).then((response) => {
|
|
if (response.code === 200) {
|
|
this.msgSuccess("新增成功");
|
|
this.getList();
|
|
}
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
// 取消按钮
|
|
cancel() {
|
|
this.$router.push("/project/plan");
|
|
},
|
|
|
|
// 上传附件
|
|
submitOpinionUpload(_, fileList) {
|
|
console.log("fileList", fileList);
|
|
this.opinionFileList.push({
|
|
name: fileList.name,
|
|
fileName: fileList.response.fileName,
|
|
url: fileList.response.url,
|
|
uid: fileList.uid,
|
|
});
|
|
// console.log("this.opinionFileList", this.opinionFileList);
|
|
},
|
|
|
|
handleRemove(file, fileList) {
|
|
// console.log(file, fileList);
|
|
let index = this.opinionFileList.findIndex(
|
|
(item) => item.uid === file.uid
|
|
);
|
|
// 删除文件
|
|
this.opinionFileList.splice(index, 1);
|
|
},
|
|
// 点击预览的文件进行下载
|
|
handlePreview(file) {
|
|
// console.log(file);
|
|
getFileStream({ fileName: file.fileName }).then((res) => {
|
|
const blob = new Blob([res], {
|
|
// type类型后端返回来的数据中会有，根据自己实际进行修改
|
|
// 表格下载为 application/xlsx，压缩包为 application/zip等，
|
|
type: "application/xlsx",
|
|
}); //excel,pdf等
|
|
const href = URL.createObjectURL(blob); //创建新的URL表示指定的blob对象
|
|
const a = document.createElement("a"); //创建a标签
|
|
a.style.display = "none";
|
|
a.href = href; // 指定下载链接
|
|
a.download = file.name; //指定下载文件名
|
|
a.click(); //触发下载
|
|
URL.revokeObjectURL(a.href); //释放URL对象
|
|
});
|
|
},
|
|
handleExceed(files, fileList) {
|
|
this.$message.warning(
|
|
`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
|
|
files.length + fileList.length
|
|
} 个文件`
|
|
);
|
|
},
|
|
beforeRemove(file, fileList) {
|
|
return this.$confirm(`确定移除 ${file.name}？`);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|