- <template>
- <div class="water-analysis-page">
- <div class="top">
- <div class="LeftBox1">
- <el-progress
- type="circle"
- :percentage="(postList.totalProgress * 1).toFixed(2)"
- :width="120"
- style="margin: 10px 10px 20px 70px"
- :stroke-width="20"
- striped
- striped-flow
- />
- <el-progress
- type="circle"
- :percentage="
- stapesDate.totalInvest == 0 ? '0.00' : (((postList.completeTotalInvest * 1) / (stapesDate.totalInvest * 1)) * 100).toFixed(2)
- "
- :width="120"
- style="margin: 10px 10px 20px 130px"
- :stroke-width="20"
- striped
- striped-flow
- >
- </el-progress>
- <el-progress
- type="circle"
- :percentage="
- stapesDate.spongeInvest == 0 ? '0.00' : (((postList.completeSpongeInvest * 1) / (stapesDate.spongeInvest * 1)) * 100).toFixed(2)
- "
- :width="120"
- style="margin: 10px 10px 20px 120px"
- :stroke-width="20"
- striped
- striped-flow
- />
- <div style="" class="Top_cont">
- <div class="HTMoney1">
- <div class="JENum">{{ postList.totalProgress || 0 }}<span style="font-size: 14px">(%)</span></div>
- <div class="JEName">项目进度</div>
- </div>
- <div class="HTMoney1">
- <div class="JENum">{{ postList.completeTotalInvest || 0 }}</div>
- <div class="JEName">完成项目总投资(万元)</div>
- </div>
-
- <div class="HTMoney1">
- <div class="JENum">{{ postList.completeSpongeInvest || 0 }}</div>
- <div class="JEName">完成海绵相关投资(万元)</div>
- </div>
-
- <div class="HTMoney1">
- <div class="JENum">{{ typeList.startTime?.substring(0, 10) }}</div>
- <div class="JEName">项目开始日期</div>
- </div>
- <div class="HTMoney1">
- <div class="JENum">{{ build_statusM(typeList.buildStatus) }}</div>
- <div class="JEName">项目建设状态</div>
- </div>
- <div class="HTMoney1" :class="{ HTMoney2: Time > 0 }">
- <div class="JENum">
- {{ typeList.endTime?.substring(0, 10) || '2024-12-15' }}
- </div>
- <div class="JEName">项目交付日期</div>
- </div>
- </div>
- </div>
- <el-table :data="postList.details" style="width: 100%" row-key="id" default-expand-all :tree-prop="{ children: 'children' }">
- <el-table-column prop="nodeName" label="一级节点" width="180" show-overflow-tooltip />
- <el-table-column prop="status" label="状态" show-overflow-tooltip>
- <template #default="{ row }">
- <el-tag :key="row.status" class="mx-1" :type="row.status == 0 ? 'success' : 'danger'">
- {{ row.status == 0 ? '正常' : '超期' }}
- </el-tag>
- </template>
- </el-table-column>
- <el-table-column prop="schedule" label="进度" show-overflow-tooltip>
- <template #default="{ row }"> {{ row.schedule || 0 }}% </template>
- </el-table-column>
- <el-table-column prop="planStartTime" label="计划日期起" show-overflow-tooltip>
- <template #default="{ row }">
- {{ row.planStartTime?.substring(0, 10) }}
- </template>
- </el-table-column>
- <el-table-column prop="planEndTime" label="计划日期止" show-overflow-tooltip>
- <template #default="{ row }">
- {{ row.planEndTime?.substring(0, 10) }}
- </template>
- </el-table-column>
- <el-table-column prop="estimatedWorkHours" label="预算工时H" show-overflow-tooltip />
- <el-table-column prop="planStartTime" label="实际日期起">
- <template #default="{ row }">
- {{ row.planStartTime?.substring(0, 10) }}
- </template>
- </el-table-column>
- <el-table-column prop="planEndTime" label="实际日期止" show-overflow-tooltip>
- <template #default="{ row }">
- {{ row.planEndTime?.substring(0, 10) }}
- </template>
- </el-table-column>
- <el-table-column prop="manHour" label="实际工时H" show-overflow-tooltip />
- <el-table-column prop="dutyUserId" label="负责人" show-overflow-tooltip>
- <template #default="{ row }">
- <span>{{ getStateName(row.dutyUserId) }}</span>
- </template>
- </el-table-column>
- <el-table-column prop="fileSaveRequestList" label="输出资料" show-overflow-tooltip>
- <template #default="{ row }">
- <span @click="handlePreview(i, 2, '详情')" class="projectName" v-for="i in row?.fileSaveRequestList">
- {{ i.originalName }}</span
- >
- </template>
- </el-table-column>
- <el-table-column prop="remark" label="备注" />
- </el-table>
- </div>
- </div>
- </template>
- <script setup>
- import { projectInfoAdd, userList } from '@/api/project/projectInformation';
- import { projectPlanMonthlyInfolast } from '@/api/project/xmbglishi';
- import { ElMessageBox } from 'element-plus';
- import { projectInfoGetProjectStatistics } from '@/api/project/tenderReview';
- const { proxy } = getCurrentInstance();
- const { build_status } = proxy.useDict('build_status');
- const emits = defineEmits();
- const typeList = inject('typeList1');
- const postList = ref([]);
- const stapesDate = ref({});
- const personList = ref([]);
- let FormList = ref({
- pageNum: 1,
- pageSize: 10,
- });
-
- function handlePreview(file) {
- return ElMessageBox.confirm(`下载此文件: ${file.name}?`).then(
- () => window.open(file.url),
- () => false
- );
- }
- const submit = () => {
- proxy.$refs.ruleForm.validate(valid => {
- if (valid) {
- if (typeList.type == 3) {
- FormList.value.operation = 'add';
- projectInfoAdd(FormList.value).then(({ code }) => {
- if (code == 200) {
- emits('onModalClose');
- proxy.$refs.ruleForm.resetFields();
- }
- });
- } else if (typeList.type == 5) {
- FormList.value.operation = 'update';
- projectInfoAdd(FormList.value).then(({ code }) => {
- if (code == 200) {
- emits('onModalClose');
- proxy.$refs.ruleForm.resetFields();
- }
- });
- }
- }
- });
- };
- function closeds() {
- proxy.$refs.ruleForm.resetFields();
- }
- defineExpose({ submit, closeds });
-
- const userListM = async () => {
- let { data } = await userList();
- personList.value = data;
- FormList.value = typeList.value;
- };
- const getStateName = r => {
- let a = '';
- personList.value.map(i => {
- if (i.userId == r) {
- a = i;
- }
- });
- return a.nickName;
- };
- const projectPlanMonthlyInfolastM = async p => {
- let { data } = await projectPlanMonthlyInfolast(p);
- postList.value = data;
- };
- function build_statusM(v) {
- const arr = build_status.value.filter(i => {
- return v == i.value;
- });
- return arr[0]?.label;
- }
- const Time = computed(() => {
- return Date.now() - new Date(typeList.value.endTime?.substring(0, 10));
- });
- const projectInfoGetProjectStatisticsM = async p => {
- let { data } = await projectInfoGetProjectStatistics(p);
- stapesDate.value = data;
- };
- onMounted(() => {
- userListM();
- projectPlanMonthlyInfolastM({ projectNo: typeList.value.projectNo });
- projectInfoGetProjectStatisticsM(typeList.value.projectNo);
- });
- </script>
- <style lang="scss" scoped>
- .water-analysis-page {
- padding: 20px;
- }
-
- .iconCLass {
- :deep .el-input__wrapper {
- box-shadow: 0 0 0 0;
- }
- }
- .tabs {
- :deep .el-input__wrapper {
- box-shadow: 0 0 0 0;
- }
- }
- .LeftBox1 {
- // width: 280px;
- height: 100%;
-
- .HTMoney1 {
- flex: 1;
- text-align: center;
- .JENum {
- height: 40px;
- font-size: 18px;
- font-weight: 400;
- color: #409eff;
- }
-
- .JEName {
- width: 100%;
- height: 40px;
- font-size: 16px;
- color: black;
- }
- }
- .HTMoney2 {
- background: red;
- .JEName {
- color: #fff;
- }
- .JENum {
- color: #fff;
- }
- }
- }
- .Top_cont {
- display: flex;
- width: 80vw;
- justify-content: center;
- align-itemas: center;
- margin-bottom: 35px;
- }
- </style>