|
|
@@ -27,7 +27,24 @@
|
|
|
</el-aside>
|
|
|
<el-main>
|
|
|
<hc-body scrollbar padding="0px">
|
|
|
- 1111
|
|
|
+ <hc-card-item v-for="item in contractList" :key="item.id" class="hc-contract-list-card">
|
|
|
+ <div class="contract-type">
|
|
|
+ <div v-if="item.contractType === 1" class="name bg-1">施工</div>
|
|
|
+ <div v-if="item.contractType === 2" class="name bg-2">监理</div>
|
|
|
+ <div v-if="item.contractType === 3" class="name bg-3">业主</div>
|
|
|
+ </div>
|
|
|
+ <div class="contract-content">
|
|
|
+ <div class="name">{{ item.contractName }}</div>
|
|
|
+ <div class="footer">
|
|
|
+ <div class="time">{{ item.updateTime }}</div>
|
|
|
+ <div class="action">
|
|
|
+ <el-link type="warning">编辑合同段信息</el-link>
|
|
|
+ <el-link v-if="item.contractType === 1" type="success">分配WBS</el-link>
|
|
|
+ <el-link type="danger">删除</el-link>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </hc-card-item>
|
|
|
</hc-body>
|
|
|
</el-main>
|
|
|
</el-container>
|
|
|
@@ -76,7 +93,6 @@ const getProjectInfo = async () => {
|
|
|
if (isNullES(projectId.value)) return
|
|
|
const { data } = await mainApi.detail(projectId.value)
|
|
|
projectInfo.value = getObjValue(data)
|
|
|
- console.log(data)
|
|
|
await getContractList(projectId.value)
|
|
|
}
|
|
|
|
|
|
@@ -86,7 +102,6 @@ const getContractList = async (id) => {
|
|
|
if (isNullES(projectId.value)) return
|
|
|
const { data } = await contractApi.getList(id)
|
|
|
contractList.value = getArrValue(data)
|
|
|
- console.log(data)
|
|
|
}
|
|
|
|
|
|
//关闭弹窗
|
|
|
@@ -132,5 +147,66 @@ const dialogClose = () => {
|
|
|
.hc-list-item .content {
|
|
|
flex: 1;
|
|
|
}
|
|
|
+ .hc-contract-list-card {
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-right: 14px;
|
|
|
+ margin-bottom: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ padding: 8px 14px;
|
|
|
+ background: #f3f3f3 !important;
|
|
|
+ transition: all 0.3s;
|
|
|
+ .hc-card-item-body {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .contract-type {
|
|
|
+ position: relative;
|
|
|
+ margin-right: 14px;
|
|
|
+ .name {
|
|
|
+ position: relative;
|
|
|
+ height: 43px;
|
|
|
+ width: 43px;
|
|
|
+ border-radius: 50px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+ .name.bg-1 {
|
|
|
+ background-color: #2a9b79;
|
|
|
+ }
|
|
|
+ .name.bg-2 {
|
|
|
+ background-color: #9b6c2a;
|
|
|
+ }
|
|
|
+ .name.bg-3 {
|
|
|
+ background-color: #2a359b;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .contract-content {
|
|
|
+ position: relative;
|
|
|
+ flex: 1;
|
|
|
+ .name {
|
|
|
+ color: #101010;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ .footer {
|
|
|
+ margin-top: 10px;
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ .time {
|
|
|
+ color: #747474;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .el-link + .el-link{
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
+ box-shadow: 2px 2px var(--el-color-primary-light-7);
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
