<template>
<div class="app-container">
<div v-show="type == 1">
<el-table border :data="dueList">
<!-- <el-table-column type="selection" width="55" align="center" /> -->
<el-table-column
label="尽调名称"
align="center"
prop="investigateName"
/>
<el-table-column
label="尽调人员"
align="center"
prop="investigatePerson"
/>
<el-table-column
label="尽调费用(元)"
align="center"
prop="investigateCost"
/>
<el-table-column label="描述" align="center" prop="describe" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="创建时间" align="center" prop="createTime" />
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
width="220"
>
<template slot-scope="scope">
<el-button
class="custom-blue-color"
size="mini"
type="text"
icon="el-icon-search"
@click="handleLook(scope.row)"
>查看尽调报告</el-button
>
<el-button
v-show="scope.row.investigatePersonId.indexOf(user.userId) > -1"
size="mini"
type="text"
icon="el-icon-upload2"
@click="handleSurvey('3', scope.row, scope.row)"
>上传尽调报告</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
>修改</el-button
>
<el-button
class="custom-red-color"
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
<!-- 添加或修改尽调申请 -->
<el-dialog
:title="dueDiligenceTit"
:visible.sync="dueDiligenceOpen"
width="1000px"
append-to-body
>
<el-form
ref="dueForm"
class="special-el-form"
:model="dueForm"
:rules="dueRules"
label-width="120px"
>
<el-form-item label="尽调名称" prop="investigateName">
<el-input
:disabled="dueDiligenceType === '3'"
v-model="dueForm.investigateName"
placeholder="请输入尽调名称"
/>
</el-form-item>
<el-form-item label="项目名称" prop="projectName">
<el-input disabled v-model="dueForm.projectName" />
</el-form-item>
<el-form-item label="尽调人员" prop="investigatePerson">
<div
class="el-input__inner inputSimulation"
@click="handleSelectPeople"
:class="{ show_disabled: dueDiligenceType === '3' }"
>
{{
dueForm.investigatePerson
? dueForm.investigatePerson
: "请选择尽调人员"
}}
</div>
</el-form-item>
<el-form-item label="尽调费用(元)" prop="investigateCost">
<el-input
:disabled="dueDiligenceType === '3'"
v-model="dueForm.investigateCost"
placeholder="请输入尽调费用"
onkeyup="value=value.replace(/[^0-9.]/g,'').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3').replace(/-/g, '')"
/>
</el-form-item>
<el-form-item label="文件" prop="file" class="special-el-form-item">
<fileItem
:class="{ show_disabled: dueDiligenceType === '3' }"
ref="fileItems"
:id="dueForm.id"
@getFileList="getFileList"
></fileItem>
</el-form-item>
<el-form-item
label="描述"
prop="describe"
class="special-el-form-item"
>
<el-input
:disabled="dueDiligenceType === '3'"
rows="4"
v-model="dueForm.describe"
type="textarea"
placeholder="请输入内容"
/>
</el-form-item>
<el-form-item
label="备注"
prop="remark"
class="special-el-form-item"
>
<el-input
:disabled="dueDiligenceType === '3'"
rows="4"
type="textarea"
v-model="dueForm.remark"
placeholder="请输入备注"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitDueForm" v-preventReClick
>确 定</el-button
>
<el-button @click="cancelDueForm">取 消</el-button>
</div>
</el-dialog>
<!-- 添加或修改尽调报告 -->
<el-dialog
:title="dueDiligenceTit1"
:visible.sync="dueDiligenceOpen1"
width="1000px"
append-to-body
>
<h3>尽调申请详情</h3>
<el-divider></el-divider>
<el-form
ref="duePeportForm"
class="special-el-form"
:model="duePeportForm"
:rules="dueRules1"
label-width="100px"
>
<el-form-item label="尽调名称">
<el-input
disabled
v-model="dueForm.investigateName"
placeholder="请输入尽调名称"
/>
</el-form-item>
<el-form-item label="项目名称">
<el-input disabled v-model="dueForm.projectName" />
</el-form-item>
<el-form-item label="尽调人员">
<el-input disabled v-model="dueForm.investigatePerson" />
</el-form-item>
<el-form-item label="尽调费用(元)">
<el-input disabled v-model="dueForm.investigateCost" />
</el-form-item>
<el-form-item label="文件" class="special-el-form-item">
<!-- class="show_disabled" -->
<fileItem
ref="fileItems1"
:id="dueForm.id"
@getFileList="getFileList"
></fileItem>
</el-form-item>
<el-form-item label="描述" class="special-el-form-item">
<el-input
disabled
rows="4"
v-model="dueForm.describe"
type="textarea"
/>
</el-form-item>
<el-form-item label="备注" class="special-el-form-item">
<el-input
disabled
rows="4"
type="textarea"
v-model="dueForm.remark"
/>
</el-form-item>
<h3>尽调报告</h3>
<el-divider></el-divider>
<el-form-item
label="文件"
prop="listFile"
class="special-el-form-item"
>
<fileItem
ref="reportFileItems"
:id="duePeportForm.id"
@getFileList="getreportFileList"
></fileItem>
</el-form-item>
<el-form-item
label="备注"
prop="remark"
class="special-el-form-item"
>
<el-input
rows="4"
type="textarea"
v-model="duePeportForm.remark"
placeholder="请输入备注"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button
type="primary"
@click="submitduePeportForm"
v-preventReClick
>确 定</el-button
>
<el-button @click="cancelduePeportForm">取 消</el-button>
</div>
</el-dialog>
<!-- 查看该申请下的所有尽调报告 -->
<el-dialog
title="尽调报告"
:visible.sync="dueDiligenceOpen2"
width="1000px"
append-to-body
class="examineDialog"
>
<div v-if="dueAllPeportList.length > 0">
<el-form
v-for="(item, index) in dueAllPeportList"
:key="index"
class="special-el-form"
:model="item"
label-width="100px"
>
<el-form-item label="尽调人员" class="special-el-form-item">
<el-input disabled v-model="item.investigatePerson" />
</el-form-item>
<el-form-item label="文件" class="special-el-form-item">
<!-- class="show_disabled" -->
<fileItem
ref="dueAllreportFileItems"
:id="item.id"
@getFileList="getreportFileList"
></fileItem>
</el-form-item>
<el-form-item label="备注" class="special-el-form-item">
<el-input
disabled
rows="4"
type="textarea"
v-model="item.remark"
placeholder="请输入备注"
/>
</el-form-item>
<el-divider></el-divider>
</el-form>
</div>
<div
v-else
class="public-flex-center public-padded-t-20"
style="color: #909399"
>
暂无数据
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="dueDiligenceOpen2 = false"
>确 定</el-button
>
<el-button @click="dueDiligenceOpen2 = false">取 消</el-button>
</div>
</el-dialog>
</el-table>
</div>
<!--选择人员-->
<selecUser
ref="flowUser"
:checkType="checkType"
:selectValues="selectValues"
:selectNameValues="selectNameValues"
@handleUserSelect="handleUserSelect"
></selecUser>
</div>
</template>
<script>
import {
getInvestigatelist,
getlistProjectPoolId,
delInvestigate,
updateInvestigate,
addInvestigatePerson,
addInvestigate,
getProjectInvestigateId,
dueAllPeportList,
} from "@/api/invest/pool";
import projectItem from "./projectItem";
import fileItem from "./fileItem";
import selecDept from "./selecDept";
import selecUser from "./selecUser";
export default {
props: {
projectId: {
type: String,
},
projectName: {
type: String,
default: null,
required: false,
},
type: {
type: Number, //1显示表格 2不显示
},
},
dicts: ["up_way", "project_stage"],
components: { projectItem, fileItem, selecDept, selecUser },
data() {
const validateLogo = (rule, value, callback) => {
if (this.reportFileList.length <= 0) {
callback(new Error("请上传文件"));
} else {
callback();
}
};
return {
// 人员选择器
checkType: "multiple",
// 数据回显
selectValues: null,
selectNameValues: null,
userVisible: false,
dueList: [],
total: null,
user: {
userId: null,
nickName: null,
},
dueDiligenceTit: "",
dueDiligenceOpen: false,
dueDiligenceTit1: "",
dueDiligenceOpen1: false,
dueDiligenceOpen2: false,
duePeportForm: {
createBy: null,
createTime: null,
deptId: null,
deptName: null,
id: null,
investigatePerson: null,
investigatePersonId: null,
listFile: null,
projectInvestigateId: null,
remark: null,
updateBy: null,
updateTime: null,
},
dueForm: {
id: null,
investigateName: null,
investigateCode: null,
projectPoolId: null,
investigatePerson: null,
investigatePersonId: null,
investigateCost: null,
describe: null,
remark: null,
delFlag: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
projectPoolId: null,
projectName: null,
},
dueAllPeportList: [],
dueRules1: {
listFile: [{ required: true, validator: validateLogo }],
remark: [{ required: true, trigger: "blur", message: "请输入" }],
},
dueRules: {
investigateName: [
{ required: true, trigger: "blur", message: "请输入" },
],
projectName: [{ required: true, trigger: "blur", message: "请输入" }],
investigatePerson: [
{ required: true, trigger: "blur", message: "请选择" },
],
investigateCost: [
{ required: true, trigger: "blur", message: "请输入" },
],
describe: [{ required: true, trigger: "blur", message: "请输入" }],
},
fileList: [],
reportFileList: [],
dueDiligenceType: "0",
};
},
watch: {
dueDiligenceOpen: function (newValue, oldValue) {
if (newValue === false) {
this.selectValues = null;
this.selectNameValues = null;
}
},
},
mounted() {
this.user = this.$store.getters.user;
this.user.userId = this.user.userId.toString();
this.getList();
},
methods: {
// getProjectName(projectName) {
// this.projectName = projectName;
// },
/** 查询文件资料列表 */
getList() {
// this.loading = true;
getInvestigatelist(this.projectId).then((response) => {
this.dueList = response.rows;
this.total = response.total;
// this.loading = false;
});
},
handleSelectPeople() {
this.$refs.flowUser.handleUserVisible(true);
},
// 查看尽调报告
handleLook(row) {
let that = this;
dueAllPeportList(row.id).then((response) => {
let rows = response.rows;
this.dueAllPeportList = rows;
this.dueDiligenceOpen2 = true;
if (rows && rows.length > 0) {
for (let i in rows) {
setTimeout(() => {
this.$refs.dueAllreportFileItems[i].handleButton();
this.$refs.dueAllreportFileItems[i].getListFileBusinessId(
rows[i].id
);
}, 300);
}
}
});
},
// 修改尽调申请
handleUpdate(row) {
let that = this;
this.resetDueForm();
const id = row.projectPoolId || row.id;
getlistProjectPoolId(id).then((response) => {
if (response.tProjectInvestigate) {
this.dueForm = response.tProjectInvestigate;
this.dueForm.projectName = this.projectName;
this.selectValues = response.tProjectInvestigate.investigatePersonId;
this.selectNameValues =
response.tProjectInvestigate.investigatePerson;
this.dueDiligenceTit = "修改尽调申请";
this.dueDiligenceOpen = true;
setTimeout(() => {
that.$refs.fileItems.fileList = [];
that.$refs.fileItems.getListFileBusinessId(this.dueForm.id);
}, 300);
}
});
},
/*用户选中赋值*/
checkUserComplete() {
this.userVisible = false;
// this.checkType = "";
},
// 获取fileList
getFileList(fileList) {
this.fileList = fileList;
},
getreportFileList(fileList) {
this.reportFileList = fileList;
},
// 用户选中数据
handleUserSelect(selection) {
const that = this;
if (selection) {
if (selection instanceof Array) {
const userIds = selection.map((item) => item.userId);
const nickName = selection.map((item) => item.nickName);
this.dueForm.investigatePerson = nickName.join(",");
this.dueForm.investigatePersonId = userIds.join(",");
this.selectNameValues = nickName.join(",");
this.selectValues = userIds.join(",");
} else {
this.dueForm.investigatePerson = selection.nickName;
this.dueForm.investigatePersonId = selection.userId;
this.selectNameValues = selection.nickName;
this.selectValues = selection.userId;
}
this.$refs.dueForm.clearValidate(["investigatePerson"]);
}
},
// 发起尽调申请
handleSurvey(type, row, transmitForm) {
// console.log(type, row, transmitForm);
let that = this;
this.dueDiligenceType = type;
//type 1=发起 2=修改 3=上传
if (type === "1") {
this.resetDueForm();
setTimeout(() => {
that.$refs.fileItems.fileList = [];
}, 300);
this.dueDiligenceTit = "发起尽调申请";
this.dueDiligenceOpen = true;
} else if (type === "2") {
this.handleUpdate(row);
} else if (type === "3") {
this.dueForm = transmitForm;
this.dueForm.projectName = this.projectName;
this.duePeportForm.projectInvestigateId = this.dueForm.id;
setTimeout(() => {
that.$refs.fileItems1.handleButton();
that.$refs.fileItems1.getListFileBusinessId(this.dueForm.id);
}, 300);
this.dueDiligenceTit1 = "上传尽调报告";
getProjectInvestigateId(this.dueForm.id).then((response) => {
if (response.data) {
this.duePeportForm = response.data;
setTimeout(() => {
that.$refs.reportFileItems.fileList = [];
that.$refs.reportFileItems.getListFileBusinessId(
this.duePeportForm.id
);
}, 300);
}
this.dueDiligenceOpen1 = true;
});
}
this.dueForm.projectName = row.projectName;
// this.dueForm.projectPoolId = row.id;
this.dueForm.projectPoolId = this.projectId;
},
// 尽调报告
submitduePeportForm() {
this.$refs["duePeportForm"].validate((valid) => {
if (valid) {
this.duePeportForm.projectPoolId = this.dueForm.projectPoolId;
this.duePeportForm.listFile = this.reportFileList;
addInvestigatePerson(this.duePeportForm).then((response) => {
this.$modal.msgSuccess("操作成功");
this.dueDiligenceOpen1 = false;
});
}
});
},
cancelduePeportForm() {
this.dueDiligenceOpen1 = false;
this.resetduePeportForm();
},
resetduePeportForm() {
this.duePeportForm = {
createBy: null,
createTime: null,
deptId: null,
deptName: null,
id: null,
investigatePerson: null,
investigatePersonId: null,
listFile: null,
remark: null,
updateBy: null,
updateTime: null,
projectInvestigateId: this.dueForm.id,
};
},
// 尽调申请
submitDueForm() {
this.$refs["dueForm"].validate((valid) => {
if (valid) {
this.dueForm.listFile = this.fileList;
this.dueForm.investigateCost = this.dueForm.investigateCost.replace(
/-/g,
""
);
if (this.dueForm.id != null) {
updateInvestigate(this.dueForm).then((response) => {
this.$modal.msgSuccess("修改成功");
this.dueDiligenceOpen = false;
this.getList();
});
} else {
addInvestigate(this.dueForm).then((response) => {
this.$modal.msgSuccess("新增成功");
this.dueDiligenceOpen = false;
this.getList();
});
}
this.getList();
}
});
},
cancelDueForm() {
this.dueDiligenceOpen = false;
this.resetDueForm();
},
// 表单重置
resetDueForm() {
this.dueForm = {
id: null,
investigateName: null,
investigateCode: null,
projectPoolId: null,
investigatePerson: null,
investigatePersonId: null,
investigateCost: null,
describe: null,
remark: null,
delFlag: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
projectPoolId: null,
projectName: null,
};
this.resetForm("dueForm");
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
const investigateName = row.investigateName
? row.investigateName
: "此项";
this.$modal
.confirm('是否确认删除"' + investigateName + '"？')
.then(function () {
return delInvestigate(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
},
};
</script>
<style lang="scss">
.examineDialog {
.el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
background-color: #fff;
color: #333;
}
}
</style>