471 lines
15 KiB
Vue
Raw Normal View History

2023-08-12 18:01:52 +08:00
<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="search-select">
<span style="margin: 0 10px 2px 0px">验收阶段</span>
<el-input style="width: 200px" v-model="allForm.stage" clearable placeholder="请输入" />
<span style="margin: 0 10px 2px 10px">类型</span>
<el-select style="width: 200px" v-model="allForm.type" clearable placeholder="请选择">
<el-option v-for="item in typeList" :key="item.dictLabel" :label="item.dictValue" :value="item.dictLabel" />
</el-select>
<span style="margin: 0 10px 2px 20px">备注</span>
<el-input style="width: 200px" v-model="allForm.remark" clearable placeholder="请输入" />
</div>
<!-- 验收内容 -->
2023-08-12 18:01:52 +08:00
<div class="detail-table">
<div class="content-title">验收内容</div>
2023-08-12 18:01:52 +08:00
<div class="content-button"><el-button class="addButtonStyle" @click="addPlan">新增</el-button></div>
<div class="table">
<el-table
:data="recordData"
class="el-table"
height="300"
2023-08-12 18:01:52 +08:00
: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="类型" width="150">
2023-08-12 18:01:52 +08:00
<template #default="{ row }">
<el-select style="width: 120px" v-model="row.type1" clearable placeholder="请选择" v-if="!row.id">
<el-option v-for="item in typeList" :key="item.dictLabel" :label="item.dictValue" :value="item.dictLabel" />
</el-select>
2023-08-12 18:01:52 +08:00
<span v-else>{{ row.type1 }}</span>
</template>
</el-table-column>
<el-table-column prop="type2" label="单体工程" width="150">
2023-08-12 18:01:52 +08:00
<template #default="{ row }">
<el-select v-if="!row.id" style="width: 100%" v-model="row.type1" clearable placeholder="请选择">
<el-option v-for="item in singleEngineerList" :key="item.singleId" :label="item.name" :value="item.singleId" />
</el-select>
2023-08-12 18:01:52 +08:00
<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="起始标识" width="150">
2023-08-12 18:01:52 +08:00
<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="截止标识" width="150">
2023-08-12 18:01:52 +08:00
<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="验收负责人" width="150">
2023-08-12 18:01:52 +08:00
<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="负责人电话" width="150">
2023-08-12 18:01:52 +08:00
<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="状态" width="150">
2023-08-12 18:01:52 +08:00
<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="备注" width="150">
2023-08-12 18:01:52 +08:00
<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 align="center" width="300" label="操作">
<template #default="scope">
<el-button type="primary" v-if="scope.row.id" link @click="handleEditItem(scope.row)">
<img src="@/assets/images/tableIcon/updateIcon.png" alt="" class="configureIcon" />
<span>编辑</span>
</el-button>
<el-button v-if="scope.row.id" type="danger" link :icon="Delete" @click="handleDeleteItem(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
<template #empty>
<div class="table-empty">
<slot name="empty">
<img src="@/assets/images/notData.png" alt="notData" />
<div>暂无数据</div>
</slot>
</div>
</template>
</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>
<!-- 资料附件 -->
<div class="detail-table">
<div class="content-title">资料附件</div>
<div class="table">
<el-table
:data="documentData"
border
height="300"
class="el-table"
:row-style="{ height: '40px', textAlign: 'center' }"
:header-cell-style="{ height: '40px', backgroundColor: '#e1eeff', textAlign: 'center' }"
:cell-style="{ height: '40px', textAlign: 'center' }"
>
<el-table-column type="index" label="序号" width="200" />
<el-table-column prop="name" label="附件名称">
<template #default="{ row, $index }">
<el-input class="test" v-model="row.type1" />
</template>
</el-table-column>
<el-table-column prop="floorNum" label="操作">
<template #default="{ row, $index }">
<el-upload
accept=".mpp"
:headers="headers"
:action="`${baseUrl}` + '/project/projectSubItem/importMpp'"
:on-success="uploadFileSuccess"
multiple
:limit="1"
:show-file-list="false"
>
<el-button type="primary" link>上传附件</el-button>
</el-upload>
</template>
</el-table-column>
<el-table-column fixed="right">
<template #header>
<el-button type="primary" round @click="addEngineeringSingle"> 添加 </el-button>
</template>
<template #default="{ row }">
<el-button type="danger" link @click="removeEngineeringSingle(row)">删除</el-button>
</template>
</el-table-column>
<template #empty>
<div class="table-empty">
<slot name="empty">
<img src="@/assets/images/notData.png" alt="notData" />
<div>暂无数据</div>
</slot>
</div>
</template>
2023-08-12 18:01:52 +08:00
</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>
<!-- 驳回原因 -->
<div class="back-reason" v-if="title == '驳回'">
<div class="content-title">驳回原因</div>
<div class="form-content">
<el-input v-model="allForm.textValue" :rows="4" type="textarea" placeholder="请输入" />
</div>
</div>
<!-- 现场检查 -->
<div class="detail-table" v-if="title == '检查'">
<div class="content-title">现场检查</div>
<div class="table">
<el-table
:data="checkData"
class="el-table"
height="300"
: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="监督员" width="150" />
<el-table-column prop="type1" label="检查时间" width="150" />
<el-table-column prop="type1" label="施工单位" width="150" />
<el-table-column prop="type1" label="监理单位" width="150" />
<el-table-column prop="type1" label="项目经理" width="150" />
<el-table-column prop="type1" label="总监理工程师" width="150" />
<el-table-column prop="type1" label="状态" width="150" />
<el-table-column align="center" width="300" label="操作">
<template #default="scope">
<el-button type="primary" v-if="scope.row.id" link @click="handleEditItem(scope.row)">
<img src="@/assets/images/tableIcon/look.png" alt="" class="configureIcon" />
<span>编辑</span>
</el-button>
</template>
</el-table-column>
<template #empty>
<div class="table-empty">
<slot name="empty">
<img src="@/assets/images/notData.png" alt="notData" />
<div>暂无数据</div>
</slot>
</div>
</template>
</el-table>
</div>
</div>
<template #footer>
<div>
<el-button type="primary" @click="visible1 = false" v-if="title != '新增'">关闭</el-button>
<el-button type="primary" @click="confirm()">提交申请</el-button>
</div>
</template>
2023-08-12 18:01:52 +08:00
</el-dialog>
<transformInfo v-model:detailsDialog="detailsDialog" :relativeId="relativeId" @confirm="confirmReform"></transformInfo>
2023-08-12 18:01:52 +08:00
</div>
</template>
<script lang="ts" setup>
import { onMounted, ref, watch, reactive } from "vue";
import { ElMessage } from "element-plus";
2023-08-12 18:01:52 +08:00
import { relativeInfo, timeLineData, submitReform, submitAll } from "@/api/modules/project";
import { Delete } from "@element-plus/icons-vue";
import { jxj_User } from "@/api/types";
import { useHandleData } from "@/hooks/useHandleData";
import { GlobalStore } from "@/stores";
import transformInfo from "../../../qualitySupervision/components/transformInfo.vue";
import { getDicList } from "@/api/modules/jxjview";
import { singleEngineer } from "@/api/modules/common";
const singleEngineerList = ref([]);
const typeList = ref([]);
const detailsDialog = ref(false);
const checkData = ref([]);
const globalStore = GlobalStore();
const headers = ref({ Authorization: "Bearer " + globalStore.token });
const documentData = ref<any>([]);
2023-08-12 18:01:52 +08:00
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 allForm = ref({
stage: "",
type: null,
remark: "",
textValue: ""
2023-08-12 18:01:52 +08:00
});
// 整改完成,全部已提交审核
const confirmReform = () => {};
const confirm = async () => {};
const getSingleEngineerData = async () => {
const res = await singleEngineer({ engineeringSn: globalStore.engineeringSn });
singleEngineerList.value = res.result;
console.log(res);
};
const getDicMainList = async () => {
// 获取学历字典
const { result } = await getDicList({ dictType: "check_accept_type" });
typeList.value.length = 0;
typeList.value.push(...result);
};
// 导入文件
const uploadFileSuccess = (response: any) => {
console.log(response);
};
const removeEngineeringSingle = (row: any) => {
// const i = form.value.engineeringSingles?.indexOf(row);
// i != null && form.value.engineeringSingles?.splice(i, 1);
};
const addEngineeringSingle = () => {
documentData.value.push({
type1: "",
type2: ""
});
};
// 删除用户信息
const handleDeleteItem = async (params: jxj_User.ResUserList) => {
// await useHandleData(deleteBigItem, { id: params.id }, `删除【${params.name}】`);
};
2023-08-12 18:01:52 +08:00
const addPlan = () => {
recordData.value.push({
type1: "",
type2: "",
type3: "",
type4: "",
type5: "",
type6: "",
type7: "",
type8: "",
type9: ""
});
};
// 修改数据按钮
const handleEditItem = async (row: any) => {
console.log(row);
};
2023-08-12 18:01:52 +08:00
// 全部整改完成,提交
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 auditVisible = ref(false);
// 监听父组件的visible用来简介控制el-dialog的弹框开关一般是用于开
watch(
() => props.dialogVisible,
(n, o) => {
visible1.value = n;
if (n) {
// getInfo();
2023-08-12 18:01:52 +08:00
} else {
emits("confirm");
}
}
);
// 监听el-dialog显示状态再通过@update:visible 通知父组件,一般是用于关
watch(visible1, (n, o) => {
emits("update:dialogVisible", n);
});
onMounted(() => {
getDicMainList();
getSingleEngineerData();
});
2023-08-12 18:01:52 +08:00
</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;
}
}
.search-select {
@include flex;
box-shadow: none;
}
2023-08-12 18:01:52 +08:00
.detail-table {
// height: 391px;
2023-08-12 18:01:52 +08:00
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%;
}
.table-empty {
display: flex;
justify-content: center;
align-items: center;
flex: 1;
flex-direction: column;
color: #999;
}
2023-08-12 18:01:52 +08:00
}
.operation-btn {
display: flex;
align-items: center;
justify-content: center;
margin-top: 20px;
}
}
.back-reason {
// height: 391px;
margin-top: 18px;
.content-title {
@include title;
}
.form-content {
margin-top: 20px;
}
}
2023-08-12 18:01:52 +08:00
}
</style>