Commit a4ffd663 authored by tianhongyang's avatar tianhongyang

fix bug

parent 7cb9ba54
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
.el-form-item__label { .el-form-item__label {
font-weight: 400; font-weight: 400;
color: rgba(35, 35, 35, 0.8); color: rgba(35, 35, 35, 0.8);
text-align: left; text-align: right;
font-size: 14px; font-size: 14px;
line-height: 32px; line-height: 32px;
padding-right: 0px; padding-right: 0px;
......
...@@ -48,6 +48,7 @@ ...@@ -48,6 +48,7 @@
<script> <script>
import vuedraggable from "vuedraggable"; import vuedraggable from "vuedraggable";
import { v4 } from 'uuid'; import { v4 } from 'uuid';
import { elementMessageSingleton } from "@/utils";
export default { export default {
name: "dskTableHeaderSettingBar", name: "dskTableHeaderSettingBar",
components: { components: {
...@@ -131,9 +132,12 @@ export default { ...@@ -131,9 +132,12 @@ export default {
checkedChange(index, flag, item) { checkedChange(index, flag, item) {
// 至少保证一个自适应列存在 // 至少保证一个自适应列存在
const hasOnly = this.checkeOnlySelfAdaptation(); const hasOnly = this.checkeOnlySelfAdaptation();
if (!hasOnly && !flag) { if (!hasOnly) {
this.$message.warning("列表至少保证一个自适应列存在"); elementMessageSingleton("warning", "列表至少保证一个自适应列存在");
item.use = true; this.useColumn.splice(index, 1, {
...item,
use: true
});
return; return;
} }
// 选中 往use push // 选中 往use push
......
...@@ -324,7 +324,7 @@ export default { ...@@ -324,7 +324,7 @@ export default {
/** /**
* @type {HTMLDivElement} * @type {HTMLDivElement}
*/ */
const inner = document.querySelector(".basic-engineering-information-inner"); const inner = this.$el.querySelector(".basic-engineering-information-inner");
if (inner) { if (inner) {
const td = parseInt((inner.offsetWidth - 140 * 2) / 2); const td = parseInt((inner.offsetWidth - 140 * 2) / 2);
this.tableKeyWidth = `${parseInt(parseFloat(td / inner.offsetWidth) * 100)}%`; this.tableKeyWidth = `${parseInt(parseFloat(td / inner.offsetWidth) * 100)}%`;
......
<template> <template>
<div class="consulting-agency-container"> <div class="consulting-agency-container">
<el-form :model="comProjectDetailInfo" :rules="rules" :inline-message="false" class="basic-engineering-information-inner">
<!-- 基础信息 -->
<div class="project-basic-information">
<div class="info-module-title"><span>基础信息</span></div>
<table>
<colgroup>
<col>
<col :style="{width : tableKeyWidth}">
<col>
<col :style="{width : tableKeyWidth}">
</colgroup>
<tr>
<td class="table-key">咨询机构名称</td>
<td>
<span
v-if="!comIsModify">{{comProjectDetailInfo.advisoryBody && comProjectDetailInfo.advisoryBody.advisoryBodyName ? comProjectDetailInfo.advisoryBody.advisoryBodyName : "-"}}</span>
<el-form-item label="" v-if="comIsModify">
<el-input v-model="comProjectDetailInfo.advisoryBody.advisoryBodyName" clearable></el-input>
</el-form-item>
</td>
<td class="table-key">法人代表</td>
<td>
{{comProjectDetailInfo.corporatePerson ? comProjectDetailInfo.corporatePerson : "-"}}
</td>
</tr>
<tr>
<!-- <td class="table-key">法人联系电话</td>
<td>
{{comProjectDetailInfo.corporatePerson ? comProjectDetailInfo.corporatePerson : "-"}}
</td> -->
<td class="table-key">注册地址</td>
<td colspan="3">
{{comProjectDetailInfo.regAddress ? comProjectDetailInfo.regAddress : "-"}}
</td>
</tr>
</table>
</div>
<!-- 项目联系人 -->
<div class="project-contact">
<div class="info-module-title"><span>项目联系人</span></div>
<table>
<colgroup>
<col>
<col :style="{width : tableKeyWidth}">
<col>
<col :style="{width : tableKeyWidth}">
</colgroup>
<tr>
<td class="table-key">项目负责人</td>
<td>
{{comProjectDetailInfo.advisoryBodyProject && comProjectDetailInfo.advisoryBodyProject.projectLeader ? comProjectDetailInfo.advisoryBodyProject.projectLeader : "-"}}
</td>
<td class="table-key">项目负责人专业</td>
<td>
{{comProjectDetailInfo.advisoryBodyProject && comProjectDetailInfo.advisoryBodyProject.projectLeaderMajor ? comProjectDetailInfo.advisoryBodyProject.projectLeaderMajor : "-"}}
</td>
</tr>
<tr>
<td class="table-key">联系电话</td>
<td colspan="3">
{{comProjectDetailInfo.advisoryBodyProject && comProjectDetailInfo.advisoryBodyProject.projectLeaderPhone ? comProjectDetailInfo.advisoryBodyProject.projectLeaderPhone : "-"}}
</td>
</tr>
</table>
</div>
<!-- 项目结算信息 -->
<div class="project-settlement-information">
<div class="info-module-title"><span>项目结算信息</span></div>
<table>
<colgroup>
<col>
<col :style="{width : tableKeyWidth}">
<col>
<col :style="{width : tableKeyWidth}">
</colgroup>
<tr>
<td class="table-key">结算开始时间</td>
<td>
{{comProjectDetailInfo.advisoryBodyProject && comProjectDetailInfo.advisoryBodyProject.settleStartTime ? comProjectDetailInfo.advisoryBodyProject.settleStartTime : "-"}}
</td>
<td class="table-key">结算完成时间</td>
<td>
{{comProjectDetailInfo.advisoryBodyProject && comProjectDetailInfo.advisoryBodyProject.settleFinishTime ? comProjectDetailInfo.advisoryBodyProject.settleFinishTime : "-"}}
</td>
</tr>
<tr>
<td class="table-key">是否为终审单位</td>
<td colspan="3">
{{comProjectDetailInfo.advisoryBodyProject && statusCheck(comProjectDetailInfo.advisoryBodyProject.isFinalJudgeUnit) ? statusCheck(comProjectDetailInfo.advisoryBodyProject.isFinalJudgeUnit) : "-"}}
</td>
</tr>
</table>
</div>
</el-form>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: "consultingAgency", name: "consultingAgency",
props: { props: {
projectDetailInfo: Object projectDetailInfo: Object,
isModify: {
type: Boolean,
default: false
}
},
watch: {
projectDetailInfo: {
handler(newValue) {
this.comProjectDetailInfo = JSON.parse(JSON.stringify(newValue));
},
deep: true
},
isModify: {
handler(newValue) {
this.comIsModify = newValue;
}
}
}, },
data() { data() {
return { return {
comIsModify: this.isModify,
comProjectDetailInfo: JSON.parse(JSON.stringify(this.projectDetailInfo)),
rules: {
},
tableKeyWidth: 0
}; };
}, },
//可访问data属性 //可访问data属性
created() { created() {
this.setTableKeyWidth();
}, },
//计算集 //计算集
computed: { computed: {
...@@ -24,7 +139,30 @@ export default { ...@@ -24,7 +139,30 @@ export default {
}, },
//方法集 //方法集
methods: { methods: {
statusCheck(status) {
if (status == "0") {
return "是";
}
if (status == "1") {
return "否";
}
return "";
},
async setTableKeyWidth() {
try {
await this.$nextTick();
/**
* @type {HTMLDivElement}
*/
const inner = this.$el.querySelector(".basic-engineering-information-inner");
if (inner) {
const td = parseInt((inner.offsetWidth - 140 * 2) / 2);
this.tableKeyWidth = `${parseInt(parseFloat(td / inner.offsetWidth) * 100)}%`;
}
} catch (error) {
}
}
}, },
} }
</script> </script>
...@@ -38,5 +176,112 @@ export default { ...@@ -38,5 +176,112 @@ export default {
padding: 16px; padding: 16px;
box-sizing: border-box; box-sizing: border-box;
overflow: auto; overflow: auto;
::v-deep .basic-engineering-information-inner {
width: 100%;
.info-module-title {
line-height: 24px;
color: #232323;
font-weight: bold;
font-size: 16px;
margin-bottom: 16px;
display: flex;
align-items: center;
& > span {
display: inline-block;
position: relative;
padding-left: 8px;
box-sizing: border-box;
&::before {
content: "";
position: absolute;
left: 0px;
top: 50%;
transform: translateY(-50%);
background: rgba(35, 35, 35, 0.8);
width: 2px;
height: 14px;
}
}
}
table {
width: 100%;
border-spacing: 0;
border-collapse: collapse;
&,
th,
td {
border: 1px solid #e6eaf1;
box-sizing: border-box;
}
td {
padding: 9px 12px;
line-height: 22px;
color: #232323;
font-size: 12px;
position: relative;
& > span {
display: inline-block;
line-height: 22px;
}
.el-form-item {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
margin-bottom: 0px;
z-index: 9;
.el-form-item__content {
height: 100%;
font-size: 12px;
line-height: 1;
.el-input {
height: 100%;
font-size: 12px;
}
.el-input__inner {
height: 100%;
line-height: 22px;
border-radius: unset;
border-color: transparent;
color: #232323;
font-size: 12px;
font-weight: 400;
padding-left: 12px;
outline: unset;
&:focus {
border: 1px solid #0081ff;
}
}
}
}
}
.table-key {
background: #f0f3fa;
color: rgba(35, 35, 35, 0.8);
width: 140px;
&.lot {
height: 62px;
}
}
.data-td {
width: calc(100% - 140px);
}
}
.project-contact,
.project-settlement-information {
margin-top: 24px;
}
}
} }
</style> </style>
...@@ -17,14 +17,27 @@ ...@@ -17,14 +17,27 @@
<!-- tab切换部分 --> <!-- tab切换部分 -->
<div class="project-consulting-agency"> <div class="project-consulting-agency">
<!-- tab切换栏 --> <!-- tab切换栏 -->
<dsk-tab-toggle v-model="currentList" :tabs="toggleTabs"></dsk-tab-toggle> <div class="project-consulting-tab-container">
<dsk-tab-toggle v-model="currentList" :tabs="toggleTabs"></dsk-tab-toggle>
<!-- 编辑按钮 展示咨询机构结算信息显示 -->
<transition name="fade" appear mode="out-in">
<div class="edit-project-detail-container" v-if="currentList === 'consultingAgency' && !isModify" :key="'edit-project'">
<el-button type="primary" @click="editProjectDetail">编辑信息</el-button>
</div>
<div class="save-project-detail-container" v-if="currentList === 'consultingAgency' && isModify" :key="'save-project'">
<el-button type="primary" @click="editProjectDetail">保存</el-button>
<el-button @click="cancelSave">取消</el-button>
</div>
</transition>
</div>
<!-- tab切换容器 --> <!-- tab切换容器 -->
<div class="project-consulting-agency-inner"> <div class="project-consulting-agency-inner">
<!-- 工程基本信息 --> <!-- 工程基本信息 -->
<basic-engineering-information v-if="currentList === 'project'" :projectDetailInfo="projectDetailInfo"></basic-engineering-information> <basic-engineering-information v-if="currentList === 'project'" :projectDetailInfo="projectDetailInfo"></basic-engineering-information>
<!-- 咨询机构结算信息 --> <!-- 咨询机构结算信息 -->
<consulting-agency v-if="currentList === 'consultingAgency'" :projectDetailInfo="projectDetailInfo"></consulting-agency> <consulting-agency v-if="currentList === 'consultingAgency'" :projectDetailInfo="projectDetailInfo"
:isModify="isModify"></consulting-agency>
</div> </div>
</div> </div>
...@@ -62,7 +75,9 @@ export default { ...@@ -62,7 +75,9 @@ export default {
], ],
projectDetailInfo: {}, projectDetailInfo: {},
projectKey: "", projectKey: "",
advisoryBodyCid: "" advisoryBodyCid: "",
// 咨询机构结算信息 修改
isModify: false
}; };
}, },
//可访问data属性 //可访问data属性
...@@ -91,7 +106,16 @@ export default { ...@@ -91,7 +106,16 @@ export default {
} catch (error) { } catch (error) {
} }
} },
editProjectDetail() {
this.isModify = true;
},
saveProjectDetail() {
},
cancelSave() {
this.isModify = false;
},
}, },
} }
</script> </script>
...@@ -157,6 +181,45 @@ export default { ...@@ -157,6 +181,45 @@ export default {
height: calc(100% - 110px); height: calc(100% - 110px);
margin-top: 16px; margin-top: 16px;
.project-consulting-tab-container {
position: relative;
.edit-project-detail-container {
position: absolute;
right: 16px;
top: 50%;
transform: translateY(-50%);
& > button {
height: 32px;
line-height: 32px;
padding: 0px 16px;
box-sizing: border-box;
background-color: #0081ff;
border-color: #0081ff;
}
}
.save-project-detail-container {
position: absolute;
right: 16px;
top: 50%;
transform: translateY(-50%);
& > button {
height: 32px;
line-height: 32px;
padding: 0px 16px;
box-sizing: border-box;
&.el-button--primary {
background-color: #0081ff;
border-color: #0081ff;
}
}
}
}
.project-consulting-agency-inner { .project-consulting-agency-inner {
width: 100%; width: 100%;
height: calc(100% - 47px); height: calc(100% - 47px);
......
...@@ -480,7 +480,7 @@ export default { ...@@ -480,7 +480,7 @@ export default {
height: auto; height: auto;
overflow: initial; overflow: initial;
box-sizing: border-box; box-sizing: border-box;
min-width: 1200px; /* min-width: 1200px; */
} }
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment