259 lines
7.1 KiB
Vue
259 lines
7.1 KiB
Vue
|
<template>
|
|||
|
|
<div class="overview">
|
|||
|
|
<el-dialog :show-close="false" v-model="visible1" :style="dialogStyle" width="1305" @close="closeMain">
|
|||
|
|
<template #title>
|
|||
|
|
<div class="title-detail">
|
|||
|
|
<span>{{ title }}</span>
|
|||
|
|
<el-icon>
|
|||
|
|
<close @click="closeMain" />
|
|||
|
|
</el-icon>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<div class="detail-table">
|
|||
|
|
<div class="content-title">验收计划</div>
|
|||
|
|
<div class="content-button"><el-button class="addButtonStyle" @click="addPlan">新增</el-button></div>
|
|||
|
|
<div class="table">
|
|||
|
|
<el-table
|
|||
|
|
:data="recordData"
|
|||
|
|
class="el-table"
|
|||
|
|
:row-style="{ height: '40px' }"
|
|||
|
|
:header-cell-style="{ backgroundColor: '#F5F7FA', textAlign: 'center', height: '40px' }"
|
|||
|
|
:cell-style="{ textAlign: 'center', height: '40px' }"
|
|||
|
|
>
|
|||
|
|
<el-table-column type="index" label="序号" width="100" />
|
|||
|
|
<el-table-column prop="type1" label="类型">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-input v-model="row.type1" v-if="!row.id" />
|
|||
|
|
<span v-else>{{ row.type1 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="type2" label="单体工程">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-input v-model="row.type1" v-if="!row.id" />
|
|||
|
|
<span v-else>{{ row.type1 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="type3" label="计划验收时间" width="180">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-date-picker
|
|||
|
|
v-if="!row.id"
|
|||
|
|
v-model="row.type3"
|
|||
|
|
style="width: 100%"
|
|||
|
|
format="YYYY-MM-DD"
|
|||
|
|
value-format="YYYY-MM-DD"
|
|||
|
|
type="date"
|
|||
|
|
placeholder="请选择"
|
|||
|
|
/>
|
|||
|
|
<span v-else>{{ row.type3 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="type4" label="起始标识">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-input v-model="row.type1" v-if="!row.id" />
|
|||
|
|
<span v-else>{{ row.type1 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="type5" label="截止标识">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-input v-model="row.type1" v-if="!row.id" />
|
|||
|
|
<span v-else>{{ row.type1 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="type6" label="验收负责人">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-input v-model="row.type1" v-if="!row.id" />
|
|||
|
|
<span v-else>{{ row.type1 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="type7" label="负责人电话">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-input v-model="row.type1" v-if="!row.id" />
|
|||
|
|
<span v-else>{{ row.type1 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="type8" label="状态">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-input v-model="row.type1" v-if="!row.id" />
|
|||
|
|
<span v-else>{{ row.type1 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="type9" label="备注">
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
<el-input v-model="row.type1" v-if="!row.id" />
|
|||
|
|
<span v-else>{{ row.type1 }}</span>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</div>
|
|||
|
|
<!-- <div class="operation-btn" v-if="basicData?.state != 4">
|
|||
|
|
<el-button type="info" style="margin-right: 98px">驳回,请尽快整改</el-button>
|
|||
|
|
<el-button type="primary">整改完成,全部合格</el-button>
|
|||
|
|
<el-button type="primary" @click="allSubmit">全部整改完成,提交审核</el-button>
|
|||
|
|
</div> -->
|
|||
|
|
</div>
|
|||
|
|
</el-dialog>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script lang="ts" setup>
|
|||
|
|
import { onMounted, ref, watch, reactive } from "vue";
|
|||
|
|
import { ElMessage, ElMessageBox } from "element-plus";
|
|||
|
|
import type { FormInstance, UploadProps } from "element-plus";
|
|||
|
|
import { relativeInfo, timeLineData, submitReform, submitAll } from "@/api/modules/project";
|
|||
|
|
const baseUrl = import.meta.env.VITE_API_URL;
|
|||
|
|
const props = defineProps({
|
|||
|
|
dialogVisible: Boolean,
|
|||
|
|
relativeId: String,
|
|||
|
|
title: String
|
|||
|
|
});
|
|||
|
|
const emits = defineEmits(["update:dialogVisible", "confirm"]);
|
|||
|
|
const visible1 = ref(false);
|
|||
|
|
const transformDialog = ref(false); // 整改记录对话框
|
|||
|
|
const recordData = ref<any>([]); // 整改记录表格数据
|
|||
|
|
const recordRowData = ref(); // 整改记录表格行数据
|
|||
|
|
const basicData = ref(); // 基础信息
|
|||
|
|
const dialogStyle = ref({
|
|||
|
|
"min-width": "824px"
|
|||
|
|
});
|
|||
|
|
const reformInfo = ref({
|
|||
|
|
solveBy: "",
|
|||
|
|
solveTime: "",
|
|||
|
|
solveDesc: "",
|
|||
|
|
solveImage: []
|
|||
|
|
});
|
|||
|
|
const addPlan = () => {
|
|||
|
|
recordData.value.push({
|
|||
|
|
type1: "",
|
|||
|
|
type2: "",
|
|||
|
|
type3: "",
|
|||
|
|
type4: "",
|
|||
|
|
type5: "",
|
|||
|
|
type6: "",
|
|||
|
|
type7: "",
|
|||
|
|
type8: "",
|
|||
|
|
type9: ""
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
// 全部整改完成，提交
|
|||
|
|
const allSubmit = async () => {
|
|||
|
|
const res = await submitAll({ id: basicData.value.id });
|
|||
|
|
closeMain();
|
|||
|
|
ElMessage.success("提交成功");
|
|||
|
|
};
|
|||
|
|
// 关闭两个对话框
|
|||
|
|
const closeMain = () => {
|
|||
|
|
visible1.value = false;
|
|||
|
|
transformDialog.value = false;
|
|||
|
|
dialogStyle.value = {
|
|||
|
|
"min-width": "824px",
|
|||
|
|
transform: "translateX(0px)"
|
|||
|
|
};
|
|||
|
|
};
|
|||
|
|
// 相关信息接口调用
|
|||
|
|
const getInfo = async () => {
|
|||
|
|
const res = await relativeInfo({ id: props.relativeId });
|
|||
|
|
basicData.value = res.result;
|
|||
|
|
recordData.value = res.result.inspectQuestionList;
|
|||
|
|
recordData.value.map(item => {
|
|||
|
|
item.image = eval(item.image);
|
|||
|
|
});
|
|||
|
|
console.log(recordData);
|
|||
|
|
};
|
|||
|
|
const timelineList = ref([{ name: 1 }]);
|
|||
|
|
// 获取整改情况时间轴列表
|
|||
|
|
const getTimeLineList = async () => {
|
|||
|
|
const res = await timeLineData({ inspectQuestionId: recordRowData.value.id });
|
|||
|
|
|
|||
|
|
res.result.map(item => {
|
|||
|
|
item.solveImage = eval(item.solveImage);
|
|||
|
|
});
|
|||
|
|
timelineList.value = res.result;
|
|||
|
|
};
|
|||
|
|
const auditVisible = ref(false);
|
|||
|
|
// 监听父组件的visible，用来简介控制el-dialog的弹框开关，一般是用于开
|
|||
|
|
watch(
|
|||
|
|
() => props.dialogVisible,
|
|||
|
|
(n, o) => {
|
|||
|
|
visible1.value = n;
|
|||
|
|
if (n) {
|
|||
|
|
getInfo();
|
|||
|
|
} else {
|
|||
|
|
emits("confirm");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
);
|
|||
|
|
// 监听el-dialog显示状态，再通过@update:visible 通知父组件，一般是用于关
|
|||
|
|
watch(visible1, (n, o) => {
|
|||
|
|
emits("update:dialogVisible", n);
|
|||
|
|
});
|
|||
|
|
onMounted(() => {});
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
@mixin fullwidth {
|
|||
|
|
width: -webkit-fill-available;
|
|||
|
|
width: -moz-available;
|
|||
|
|
width: stretch;
|
|||
|
|
}
|
|||
|
|
@mixin flex {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
@mixin title {
|
|||
|
|
font-size: 14px;
|
|||
|
|
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #333333;
|
|||
|
|
border-left: 2px solid #008bff;
|
|||
|
|
padding-left: 5px;
|
|||
|
|
}
|
|||
|
|
.overview {
|
|||
|
|
:deep() {
|
|||
|
|
.el-dialog__body {
|
|||
|
|
padding-top: 0;
|
|||
|
|
padding-bottom: 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.title-detail {
|
|||
|
|
@include flex;
|
|||
|
|
border-left: 3px solid #0f81ff;
|
|||
|
|
> span {
|
|||
|
|
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #333333;
|
|||
|
|
margin-left: 12px;
|
|||
|
|
margin-right: auto;
|
|||
|
|
font-size: 18px;
|
|||
|
|
}
|
|||
|
|
:deep(.el-icon) {
|
|||
|
|
cursor: pointer;
|
|||
|
|
color: #a8abb2;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.detail-table {
|
|||
|
|
height: 391px;
|
|||
|
|
margin-top: 18px;
|
|||
|
|
.content-title {
|
|||
|
|
@include title;
|
|||
|
|
}
|
|||
|
|
.content-button {
|
|||
|
|
@include flex;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
}
|
|||
|
|
.table {
|
|||
|
|
height: 310px;
|
|||
|
|
margin-top: 20px;
|
|||
|
|
:deep(.el-table) {
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.operation-btn {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-top: 20px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|