<template>
|
<div class="riskBox">
|
<el-form ref="formRef" :model="state.formData" :rules="state.rules" class="register-form" label-position="top">
|
<el-row :gutter="30">
|
<el-col :span="10">
|
<!-- <el-button type="primary" :disabled="projectType === 'edit'" @click="addUpload">新增附件列表</el-button>-->
|
<span style="font-size: 20px;font-weight: 600">附件列表</span>
|
<span style="font-size: 13px;color: rgb(232, 78, 79);font-weight: 400;margin-left: 10px">项目列表仅支持pdf、jpg、jpeg 等格式上传</span>
|
</el-col>
|
</el-row>
|
<el-table :data="state.uploadList" :border="true" style="margin: 20px 0">
|
<el-table-column label="序号" width="60" align="center" type="index"></el-table-column>
|
<el-table-column label="名称" align="center" class-name="small-padding fixed-width">
|
<template #default="scope">
|
<el-input v-model="scope.row.name" show-word-limit type="text" size="large"/>
|
</template>
|
</el-table-column>
|
<el-table-column label="是否必须文件" align="center" class-name="small-padding fixed-width">
|
<template #default="scope">
|
<el-radio-group v-model="scope.row.type" >
|
<el-radio :label="1">是</el-radio>
|
<el-radio :label="0">否</el-radio>
|
</el-radio-group>
|
</template>
|
</el-table-column>
|
<el-table-column label="原因说明" align="center" class-name="small-padding fixed-width">
|
<template #default="scope">
|
<el-input v-model="scope.row.remark" show-word-limit type="text" size="large"/>
|
</template>
|
</el-table-column>
|
<el-table-column label="附件上传" align="center" class-name="small-padding fixed-width">
|
<template #default="scope">
|
<el-upload accept=".pdf,.doc,.docx"
|
:action="state.uploadUrl"
|
:disabled="state.disabled"
|
:headers="state.header"
|
method="post"
|
:on-success="handleAvatarSuccess"
|
v-model:file-list="scope.row.fileList"
|
:on-remove="handleRemove"
|
:data="state.uploadData"
|
:on-preview="handlePreview"
|
>
|
<el-button type="primary">附件上传</el-button>
|
</el-upload>
|
</template>
|
</el-table-column>
|
<!-- <el-table-column label="操作" align="center" class-name="small-padding fixed-width">-->
|
<!-- <template #default="scope">-->
|
<!-- <el-button link type="danger" @click="delUpload(scope.$index)">删除</el-button>-->
|
<!-- </template>-->
|
<!-- </el-table-column>-->
|
</el-table>
|
<el-row :gutter="30">
|
<el-col :span="6">
|
<el-form-item prop="contractSignDate" label="合同签订日期">
|
<el-date-picker
|
style="width: 100%"
|
v-model="state.formData.contractSignDate"
|
type="date"
|
value-format="YYYY-MM-DD 00:00:00"
|
placeholder="选择日期"
|
size="large"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="18">
|
<el-form-item prop="contractMoney">
|
<template #label>
|
项目合同额<span style="font-size: 13px;color: red;font-weight: normal;display: inline-block;margin-left: 6px">预估合同金额，归档阶段可以进行修改。仅支持数字，单位万元，小数点后最多两位，数值范围（0.01-999.99）</span>
|
</template>
|
<el-input
|
v-model="state.actualContract.actualContractMoney"
|
size="large"
|
type="number"
|
placeholder="请输入项目合同额"
|
>
|
<template #append>万元</template>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item label="实际合同额说明">
|
<el-input
|
v-model="state.actualContract.actualContractIntroduction"
|
:autosize="{ minRows: 6 }"
|
maxlength="100"
|
show-word-limit
|
type="textarea">
|
</el-input>
|
</el-form-item>
|
</el-form>
|
</div>
|
|
</template>
|
<script setup>
|
|
import {defineEmits, defineProps, onMounted, reactive, ref} from "vue";
|
import {ElMessage} from "element-plus";
|
import {addRecord, editRecord, getDetail} from "@/api/projectManage/contractMng";
|
import Cookies from "js-cookie";
|
import { getToken } from "@/utils/auth";
|
import axios from "axios";
|
import {delAccessoryFile, getAccessoryFile} from "@/api/projectManage/project";
|
import {addProcessMaterial, getProcessMaterialDetail, editProcessMaterial} from "@/api/projectManage/riskAnalysis";
|
const props = defineProps(['projectId'])
|
const emit = defineEmits(["getNextStatus"]);
|
const state = reactive({
|
formData: {
|
id: '',
|
contractSignDate: '',
|
|
},
|
actualContract: {
|
actualContractMoney: '',
|
actualContractIntroduction: ''
|
},
|
uploadList: [
|
{
|
name: '安全评价过程控制记录文档',
|
type: 1,
|
remark: '',
|
},
|
{
|
name: '项目发票电子版',
|
type: 1,
|
remark: '',
|
},
|
{
|
name: '项目转账记录/入账证明',
|
type: 1,
|
remark: '',
|
}
|
],
|
rules: {
|
contractSignDate: [{required: true, message: '请选择合同签订日期', trigger: 'blur'}],
|
actualContractMoney: [{required: true, message: '请输入项目合同额', trigger: 'blur'}]
|
},
|
fileList: [],
|
uploadUrl: import.meta.env.VITE_APP_BASE_API + '/manage/accessory-file/uploadFile',
|
header: {
|
Authorization: getToken()
|
},
|
uploadData: {
|
moduleType: 9
|
},
|
})
|
|
const isAmin = ref(false)
|
const formRef = ref();
|
onMounted(async () => {
|
const userInfo = JSON.parse(Cookies.get('userInfo'))
|
if(userInfo.identity === 0){
|
isAmin.value = true;
|
}
|
if(props.projectId){
|
state.uploadData.projectId = props.projectId;
|
await getRecord(state.uploadData.projectId);
|
// const res = await getAccessoryFile({projectId: val,moduleType: 9});
|
// console.log('res',res)
|
}
|
});
|
|
const getRecord = async (val) =>{
|
const res = await getDetail({projectId: val});
|
if(res.code == 200){
|
state.formData = res.data;
|
state.actualContract.actualContractMoney = res.data.actualContractMoney;
|
state.actualContract.actualContractIntroduction = res.data.actualContractIntroduction;
|
}else {
|
ElMessage.warning(res.message)
|
}
|
}
|
|
const projectType = ref('')
|
const riskOpen = async (type,val) => {
|
projectType.value = type;
|
state.uploadData.projectId = val;
|
if(type === 'detail' || type === 'edit' ){
|
const res = await getProcessMaterialDetail({projectId: val});
|
if(res.code == 200){
|
state.uploadList = res.data;
|
state.uploadList.forEach((item,index) => {
|
if(item.accessoryFile){
|
item.accessoryFile.name = item.accessoryFile.originName
|
state.uploadList[index].fileList = [item.accessoryFile];
|
}
|
})
|
|
console.log("res",state.uploadList)
|
}else {
|
ElMessage.warning(res.message)
|
}
|
}
|
if(type === 'add' || type === 'clickEdit') {
|
const valid = await formRef.value.validate();
|
if(valid){
|
if (isAmin.value) {
|
ElMessage.warning("当前用户暂无权限");
|
return;
|
}
|
console.log(state.uploadList,'state.uploadList')
|
const file = state.uploadList.map(item => {
|
return{
|
id: item.id ? item.id : null,
|
fileId: item.fileList ? item.fileList[0].response ? item.fileList[0].response.data.id : item.fileList[0].id : '',
|
name: item.name,
|
type: item.type,
|
remark: item.remark,
|
projectId: val
|
}
|
})
|
const { ...data} = JSON.parse(JSON.stringify(state.formData))
|
data.actualContractMoney = state.actualContract.actualContractMoney;
|
data.actualContractIntroduction = state.actualContract.actualContractIntroduction;
|
const params = {
|
projectId: val,
|
projectMaterials: file,
|
contract: data
|
}
|
console.log("params",params)
|
if(type === 'add'){
|
const res = await addProcessMaterial(params);
|
if (res.code == 200) {
|
ElMessage.success('保存成功')
|
formRef.value.clearValidate();
|
emit('getNextStatus', val);
|
} else {
|
ElMessage.warning(res.message)
|
}
|
}else if(type === 'clickEdit'){
|
const res = await editProcessMaterial(params);
|
if (res.code == 200) {
|
ElMessage.success('变更成功')
|
projectType.value='edit';
|
formRef.value.clearValidate();
|
// emit('getNextStatus', data.project.id);
|
} else {
|
ElMessage.warning(res.message)
|
}
|
}
|
}
|
}
|
}
|
|
|
const addUpload = ()=>{
|
let file = {
|
name: '',
|
type: 1,
|
remark: '',
|
}
|
state.uploadList.push(file)
|
}
|
|
const delUpload = (index)=>{
|
state.uploadList.splice(index,1)
|
}
|
|
// 图片上传
|
const showTip =()=>{
|
ElMessage({
|
type: 'warning',
|
message: '超出文件上传数量'
|
});
|
}
|
|
const picSize = async (rawFile) => {
|
if(rawFile.size / 1024 / 1024 > 5){
|
ElMessage({
|
type: 'warning',
|
message: '文件大小不能超过5M'
|
});
|
return false
|
}
|
};
|
|
const handleAvatarSuccess = (res, uploadFile) => {
|
if(res.code === 200){
|
console.log("if",state.uploadList)
|
// ElMessage({
|
// type: 'success',
|
// message: '文件上传成功'
|
// })
|
}else {
|
ElMessage({
|
type: 'warning',
|
message: res.message
|
})
|
}
|
}
|
|
const handlePreview = (file) => {
|
let path = "";
|
if(file.path){
|
path = file.path
|
}else {
|
path = file.response.data.path
|
|
}
|
const url = import.meta.env.VITE_APP_BASE_API + '/' + path
|
axios.get( url,{
|
headers:
|
{
|
'Content-Type': 'application/json',
|
'Authorization':getToken(),
|
},
|
responseType: 'blob'
|
}
|
).then(res=>{
|
if (res) {
|
const link = document.createElement('a')
|
let blob = new Blob([res.data],{type: res.data.type})
|
link.style.display = "none";
|
link.href = URL.createObjectURL(blob); // 创建URL
|
link.setAttribute("download", file.name);
|
document.body.appendChild(link);
|
link.click();
|
document.body.removeChild(link);
|
} else {
|
this.$message.error('获取文件失败')
|
}
|
})
|
}
|
|
const handleRemove = async (file, uploadFiles) => {
|
console.log("file",file)
|
let accessoryFileId = "";
|
if(file.id){
|
accessoryFileId = file.id
|
}else {
|
accessoryFileId = file.response.data.id
|
|
}
|
const res = await delAccessoryFile(accessoryFileId)
|
if(res.code == 200){
|
ElMessage({
|
type: 'success',
|
message: '文件已删除'
|
})
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: res.message
|
})
|
}
|
}
|
|
defineExpose({
|
riskOpen
|
});
|
|
|
</script>
|
<style scoped lang="scss">
|
.riskBox{
|
:deep(.el-form .el-form-item__label) {
|
font-size: 15px;
|
}
|
}
|
|
</style>
|
