<template>
<div class="water-analysis-page">
<div class="top">
<el-form
label-width="auto"
ref="ruleForm"
:rules="projectTableRules"
inline
:model="FormList"
:key="isKey"
>
<el-form-item
:label="i.label"
:prop="i.prop"
v-for="i in projectTableForm"
:disabled="typeList.type == 1 || typeList.type == 2"
:style="{width:i.prop=='buildContent'||i.prop=='supplement'? '97%':'31%'}"
>
<el-select
v-if="i.prop == 'province'"
@change="provieceListChange"
clearable
v-model="FormList.province"
class="m-2"
:placeholder="i.placeholder"
size="mini"
filterable
style="width: 100%"
:disabled="typeList.type == 1 || typeList.type == 2"
>
<el-option
v-for="item in provieceList"
:key="item.areaCode"
:label="item.name"
:value="item.areaCode"
/>
</el-select>
<el-select
v-else-if="i.prop == 'city'"
@change="citListChange"
clearable
v-model="FormList.city"
class="m-2"
:placeholder="i.placeholder"
:disabled="typeList.type == 1 || typeList.type == 2"
filterable
size="mini"
style="width: 100%"
>
<el-option
v-for="item in provieceCity"
:key="item.areaCode"
:label="item.name"
:value="item.areaCode"
/>
</el-select>
<el-select
clearable
v-else-if="i.prop == 'county'"
v-model="FormList.county"
class="m-2"
:placeholder="i.placeholder"
filterable
:disabled="typeList.type == 1 || typeList.type == 2"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in citList"
:key="item.areaCode"
:label="item.name"
:value="item.areaCode"
/>
</el-select>
<el-select
v-else-if="i.prop == 'projectTypeId'"
clearable
v-model="FormList.projectTypeId"
class="m-2"
:placeholder="i.placeholder"
:disabled="typeList.type == 1 || typeList.type == 2"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in project_TypeId"
:key="item.value"
:label="item.projectTypeName"
:value="item.id"
/>
</el-select>
<el-select
clearable
v-else-if="i.prop == 'buildCategory'"
v-model="FormList.buildCategory"
class="m-2"
:disabled="typeList.type == 1 || typeList.type == 2"
:placeholder="i.placeholder"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in build_category"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-date-picker
style="width: 100%"
v-else-if="i.prop == 'startTime'"
clearable
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
v-model="FormList.startTime"
:disabled="typeList.type == 1 || typeList.type == 2"
type="date"
range-separator="到"
:placeholder="i.placeholder"
/>
<el-date-picker
v-else-if="i.prop == 'endTime'"
style="width: 100%"
clearable
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
:disabled="typeList.type == 1 || typeList.type == 2"
v-model="FormList.endTime"
type="date"
range-separator="到"
:placeholder="i.placeholder"
@change="endTimeChange"
/>
<el-select
clearable
v-model="FormList.drainagePartition"
v-else-if="i.prop == 'drainagePartition'"
class="m-2"
:disabled="typeList.type == 1 || typeList.type == 2"
:placeholder="i.placeholder"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in drainage_partition"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-date-picker
style="width: 100%"
clearable
v-else-if="i.prop == 'endTime'"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
:disabled="typeList.type == 1 || typeList.type == 2"
v-model="FormList.endTime"
type="date"
range-separator="到"
:placeholder="i.placeholder"
@change="endTimeChange"
/>
<el-select
clearable
v-model="FormList.projectStatus"
class="m-2"
v-else-if="i.prop == 'projectStatus'"
:disabled="typeList.type == 1 || typeList.type == 2"
:placeholder="i.placeholder"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in project_status"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-select
clearable
v-model="FormList.buildStatus"
v-else-if="i.prop == 'buildStatus'"
:disabled="typeList.type == 1 || typeList.type == 2"
class="m-2"
:placeholder="i.placeholder"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in build_status"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-input
min="0"
:max="100"
v-model="FormList.projectProgress"
v-else-if="i.prop == 'projectProgress'"
type="number"
:disabled="typeList.type == 1 || typeList.type == 2"
:placeholder="i.placeholder"
>
<template #append>%</template></el-input
>
<el-select
clearable
v-model="FormList.projectOperationPattern"
v-else-if="i.prop == 'projectOperationPattern'"
class="m-2"
:placeholder="i.placeholder"
size="mini"
style="width: 100%"
:disabled="typeList.type == 1 || typeList.type == 2"
>
<el-option
v-for="item in project_operation_pattern"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-input
min="0"
v-else-if="
i.prop == 'valuation' ||
i.prop == 'govermentInvest' ||
i.prop == 'socialInvest' ||
i.prop == 'centralSpecialFunds'||
i.prop == 'totalInvest'||
i.prop == 'spongeInvest'||
i.prop == 'totalQuantites'
"
v-model="FormList[i.prop]"
type="number"
:placeholder="i.placeholder"
:disabled="typeList.type == 1 || typeList.type == 2"
>
<template #append> {{i.prop == 'totalInvest' ? '含主体工程万元': i.prop == 'spongeInvest'? '不含主体工程万元': '万元' }} </template>
</el-input>
<el-select
clearable
v-model="FormList.designUnit"
class="m-2"
:placeholder="i.placeholder"
v-else-if="i.prop == 'designUnit'"
:disabled="typeList.type == 1 || typeList.type == 2"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in unit_list"
:key="item.value"
:label="item.unitName"
:value="item.id"
/>
</el-select>
<el-select
clearable
v-else-if="i.prop == 'constructUnit'"
v-model="FormList.constructUnit"
class="m-2"
:placeholder="i.placeholder"
size="mini"
:disabled="typeList.type == 1 || typeList.type == 2"
style="width: 100%"
>
<el-option
v-for="item in unit_list"
:key="item.value"
:label="item.unitName"
:value="item.id"
/>
</el-select>
<el-select
clearable
v-model="FormList.operationUnit"
v-else-if="i.prop == 'operationUnit'"
class="m-2"
:placeholder="i.placeholder"
size="mini"
:disabled="typeList.type == 1 || typeList.type == 2"
style="width: 100%"
>
<el-option
v-for="item in unit_list"
:key="item.value"
:label="item.unitName"
:value="item.id"
/>
</el-select>
<el-select
clearable
v-model="FormList.dealUsers"
v-else-if="i.prop == 'dealUsers'"
class="m-2"
:disabled="typeList.type == 1 || typeList.type == 2"
:placeholder="i.placeholder"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in personList"
:key="item.userId"
:label="item.nickName"
:value="item.userId + ''"
/>
</el-select>
<el-select
clearable
:disabled="typeList.type == 1 || typeList.type == 2"
v-model="FormList.pushUsers"
v-else-if="i.prop == 'pushUsers'"
class="m-2"
:placeholder="i.placeholder"
size="mini"
style="width: 100%"
>
<el-option
v-for="item in personList"
:key="item.userId"
:label="item.nickName"
:value="item.userId + ''"
/>
</el-select>
<el-upload
:disabled="typeList.type == 1 || typeList.type == 2"
v-model:file-list="fileList1"
v-else-if="i.prop == 'fileList1'"
class="upload-demo"
action="/prod-api/system/upload"
:headers="uploadHeader"
limit='1'
:on-preview="handlePreview"
:before-remove="beforeRemove"
>
<el-button type="primary">选择文件</el-button> <span style="margin-left: 5px;"> 支持扩展名pdf.jpg...</span>
</el-upload>
<el-input
v-else
v-model="FormList[i.prop]"
:disabled="typeList.type == 1 || typeList.type == 2"
:placeholder="i.placeholder"
:type="
i.prop == 'buildContent' ||
i.prop == 'supplement' ||
i.prop == 'approveComment'
? 'textarea'
: ''
"
/>
</el-form-item>
<el-form-item
label="处理意见："
style="width: 94%"
prop="approveComment"
v-if="typeList.type == 2"
>
<el-input
style="width: 100%"
v-model="FormList.approveComment"
type="textarea"
:disabled="typeList.type == 1"
placeholder="请输入处理意见"
/>
</el-form-item>
</el-form>
<div
v-if="typeList.type != 4 && stapesDate.length > 0"
prop="stapesDate"
>
<el-divider content-position="left">流程日志</el-divider>
<div>
<el-steps direction="vertical" :active="stapesDate.length" >
<el-step
v-for="i in stapesDate"
:title="'当前步骤:' + i.activityName"
style="height: 90px;width: 300px;"
>
<template #description>
<div class="direction">时间:{{ i.endTime}}</div>
<div class="direction">
分配人:{{ i.assigneeName }}
</div>
<div class="direction">
任务备注:{{ i.comment }}
</div>
</template>
</el-step>
</el-steps>
</div>
</div>
</div>
</div>
</template>
<script setup>
import {
projectInfoAdd,
projectTypeList,
projectCompany,
getUserProfile,
userList,
projectInfoAddInformation
} from "@/api/projectInformation";
import {
projectInfoSubmit,
} from "@/api/projectTable";
import { ElMessage, ElMessageBox } from "element-plus";
import { useRouter } from 'vue-router'
import { regionList } from "@/api/projectTable";
import { workflowProcess } from "@/api/project/qualityRectificationDetails";
import { projectTableRules } from "@/utils/rules";
import { projectTableForm } from "@/utils/form";
import {
onMounted,
toRefs,
defineEmits,
reactive,
defineProps,
defineExpose,
} from "vue";
const { proxy } = getCurrentInstance();
const { typeList, onModalClose } = defineProps(["typeList", "onModalClose"]);
const {
build_category,
project_status,
project_operation_pattern,
drainage_partition,
build_status
} = proxy.useDict(
"build_category",
"project_status",
"project_operation_pattern",
"drainage_partition",
'build_status'
);
const emits = defineEmits();
const router = useRouter()
const project_TypeId = ref([]);
const unit_list = ref([]);
const personList = ref([]);
let dataForm = reactive({
tableData: "",
tableLoading: false,
selectList: [],
startTime: "",
endTime: "",
projectCategory: "",
total: "",
});
let FormList = ref({
pageNum: 1,
pageSize: 10,
});
const stapesDate = ref([]);
const provieceList = ref([]);
const provieceCity = ref([]);
const citList = ref([]);
let areCode = ref(0);
//区县
const regionListM = async (p) => {
let { data } = await regionList(p);
switch (areCode.value) {
case 0:
provieceList.value = data;
break;
case 1:
provieceCity.value = data;
break;
case 2:
citList.value = data;
break;
}
};
function provieceListChange(parentCode) {
areCode.value = 1;
regionListM({ parentCode });
}
function citListChange(parentCode) {
areCode.value = 2;
regionListM({ parentCode });
}
const regionM = async (p) => {
let { data } = await regionList({ parentCode: typeList.province });
nextTick(() => {
provieceCity.value = data;
});
};
const regionM1 = async (p) => {
let { data } = await regionList({ parentCode: typeList.city });
nextTick(() => {
citList.value = data;
});
};
const submit = (v) => {
proxy.$refs.ruleForm.validate((valid) => {
if (valid) {
let { dealUsers, pushUsers } = FormList.value;
if (dealUsers?.length > 0 && Array.isArray(dealUsers)) {
FormList.value.dealUsers = dealUsers?.join(",");
}
if (pushUsers?.length > 0 && Array.isArray(pushUsers)) {
FormList.value.pushUsers = pushUsers.join(",");
}
if(typeList.type == 5){
FormList.value.operation ='update'
FormList.value.oldContent = JSON.stringify(FormList.value)
// FormList.value.content = [
// FormList.value.content[0],
// FormList.value
// ];
console.log(FormList.value,7177);
// console.log(FormList.value, "typeListtypeList");
projectInfoAdd(FormList.value).then(({ code }) => {
if (code == 200) {
emits("onModalClose");
proxy.$refs.ruleForm.resetFields();
}
});
} else if (FormList.value.type == 3 || v == 6) {
console.log(FormList.value.dealUsers, "FormList.value.dealUsers");
if (!FormList.value.dealUsers) {
ElMessage({
message: "请您选择指定处理人",
type: "warning",
});
} else {
projectInfoSubmit(FormList.value).then(({ code }) => {
if (code == 200) {
emits("onModalClose");
router.push({ path: 'projectTable' })
}
});
}
}
else {
projectInfoAddInformation(FormList.value).then(({ code }) => {
if (code == 200) {
emits("onModalClose");
router.push({ path: 'projectTable' })
}
});
}
}
});
};
function closeds() {
FormList.value={}
proxy.$refs.ruleForm.resetFields();
}
defineExpose({ submit, closeds });
const projectTypeListM = async () => {
let p={status:'0'}
let { data } = await projectTypeList(p);
project_TypeId.value = data;
};
const projectCompanyM = async () => {
let { data } = await projectCompany();
unit_list.value = data;
};
const userListM = async () => {
let { data } = await userList();
personList.value = data;
FormList.value = typeList;
// if (typeList?.dealUsers) {
// FormList.value.dealUsers = typeList.dealUsers.split(",");
// }
// if (typeList?.pushUsers) {
// FormList.value.pushUsers = typeList.pushUsers.split(",");
// }
// FormList.value.content = [{ type: "old", projectInfo: { ...typeList } }];
FormList.value.newContent = JSON.stringify(typeList)
regionM();
regionM1();
};
//获取流程日志
const workflowProcessM = async () => {
let params = {
businessKey: typeList.id,
workflowKey: "ProjectInfo",
workflowUserId: "",
};
let { data } = await workflowProcess(params);
stapesDate.value = data;
};
onMounted(() => {
console.log("typeListtypeList", typeList)
projectTypeListM();
projectCompanyM();
// getUserProfileM();
userListM();
regionListM();
if (typeList.status != "start" && typeList.type != "4") {
workflowProcessM();
}
});
</script>
<style lang="scss" scoped>
.water-analysis-page {
padding: 20px;
}
</style>
