完成访客搭建，完善之前审核界面
This commit is contained in:
Zy
@@ -7,19 +7,167 @@
|
||||
<el-button type="primary" text>编辑</el-button>
|
||||
</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<div style="width: 50%">
|
||||
<el-descriptions>
|
||||
<el-descriptions-item label-align="right" label="房号:"> 娜美 </el-descriptions-item>
|
||||
<el-descriptions-item label-align="right" label="所属小区:">18100000000</el-descriptions-item>
|
||||
<el-descriptions-item label-align="right" label="楼栋:">2栋</el-descriptions-item>
|
||||
<el-descriptions-item label-align="right" label="单元:">2单元</el-descriptions-item>
|
||||
<el-descriptions-item label-align="right" label="楼层:">3楼</el-descriptions-item>
|
||||
<el-descriptions-item label-align="right" label="建筑面积:">112㎡</el-descriptions-item>
|
||||
<el-descriptions-item label-align="right" label="公摊面积:">12㎡</el-descriptions-item>
|
||||
<el-descriptions-item label-align="right" label="套内面积:">100㎡</el-descriptions-item>
|
||||
<el-descriptions-item label-align="right" label="户型:">3室2厅2卫</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">房号:</div>
|
||||
<div class="value">娜美</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">所属小区:</div>
|
||||
<div class="value">18100000000</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">楼栋:</div>
|
||||
<div class="value">2栋</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">单元:</div>
|
||||
<div class="value">2单元</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">楼层:</div>
|
||||
<div class="value">3楼</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">建筑面积:</div>
|
||||
<div class="value">112㎡</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">公摊面积:</div>
|
||||
<div class="value">12㎡</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">户型:</div>
|
||||
<div class="value">3室2厅2卫</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">
|
||||
<span>储藏室信息 </span>
|
||||
<el-button type="primary" text>编辑</el-button>
|
||||
</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">房号:</div>
|
||||
<div class="value">娜美</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">所属小区:</div>
|
||||
<div class="value">18100000000</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">楼栋:</div>
|
||||
<div class="value">2栋</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">单元:</div>
|
||||
<div class="value">2单元</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">楼层:</div>
|
||||
<div class="value">3楼</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">建筑面积:</div>
|
||||
<div class="value">112㎡</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">公摊面积:</div>
|
||||
<div class="value">12㎡</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">户型:</div>
|
||||
<div class="value">3室2厅2卫</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 车位信息 -->
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">
|
||||
<span>车位信息</span>
|
||||
<el-button type="primary" text>编辑</el-button>
|
||||
</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">房号:</div>
|
||||
<div class="value">娜美</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">所属小区:</div>
|
||||
<div class="value">18100000000</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">楼栋:</div>
|
||||
<div class="value">2栋</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">单元:</div>
|
||||
<div class="value">2单元</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">楼层:</div>
|
||||
<div class="value">3楼</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">建筑面积:</div>
|
||||
<div class="value">112㎡</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">公摊面积:</div>
|
||||
<div class="value">12㎡</div>
|
||||
</div>
|
||||
<div class="descriptionsbox">
|
||||
<div class="label">户型:</div>
|
||||
<div class="value">3室2厅2卫</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 收费项目 -->
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">
|
||||
<span>收费项目</span>
|
||||
</div>
|
||||
<div>
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<el-table-column prop="date" label="收费项目" />
|
||||
<el-table-column prop="name" label="收费标准" />
|
||||
<el-table-column prop="name" label="开始时间" />
|
||||
<el-table-column prop="name" label="结束时间" />
|
||||
<el-table-column prop="name" label="备注" />
|
||||
<el-table-column prop="address" label="操作" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 相关住户 -->
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">
|
||||
<span>相关住户</span>
|
||||
</div>
|
||||
<div>
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<el-table-column prop="date" label="姓名" />
|
||||
<el-table-column prop="name" label="性别" />
|
||||
<el-table-column prop="name" label="联系电话" />
|
||||
<el-table-column prop="name" label="身份" />
|
||||
<el-table-column prop="name" label="备注" />
|
||||
<el-table-column prop="address" label="操作" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 缴费账单 -->
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">
|
||||
<span>缴费账单</span>
|
||||
</div>
|
||||
<div>
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<el-table-column prop="date" label="姓名" />
|
||||
<el-table-column prop="name" label="性别" />
|
||||
<el-table-column prop="name" label="联系电话" />
|
||||
<el-table-column prop="name" label="身份" />
|
||||
<el-table-column prop="name" label="备注" />
|
||||
<el-table-column prop="address" label="操作" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -28,6 +176,28 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
const tableData = [
|
||||
{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
},
|
||||
{
|
||||
date: '2016-05-02',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
},
|
||||
{
|
||||
date: '2016-05-04',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
},
|
||||
{
|
||||
date: '2016-05-01',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
}
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@@ -35,6 +205,7 @@ import PageHeader from '@/components/Pageheader/index.vue';
|
||||
padding: 15px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.AddBuildingBody {
|
||||
margin-top: 20px;
|
||||
@@ -47,14 +218,32 @@ import PageHeader from '@/components/Pageheader/index.vue';
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding-left: 20px;
|
||||
font-size: 15px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
border-bottom: 1px solid #bbbbbb;
|
||||
margin-bottom: 60px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.addBuildingFormBody {
|
||||
font-size: large;
|
||||
font-weight: bold;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: repeat(3, 1fr);
|
||||
|
||||
.descriptionsbox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 10px 0;
|
||||
font-size: 15px;
|
||||
.label {
|
||||
width: 100px;
|
||||
text-align: right;
|
||||
font-weight: 800;
|
||||
}
|
||||
.value {
|
||||
flex: 1;
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -57,6 +57,12 @@ function contextMenuFun(val: { type: string; value: string }) {
|
||||
break;
|
||||
case 'main':
|
||||
console.log('你选择了：', val);
|
||||
router.push({
|
||||
path: '/house/HouseDetails',
|
||||
query: {
|
||||
id: val.value
|
||||
}
|
||||
});
|
||||
break;
|
||||
case 'delete':
|
||||
console.log('你选择了：', val);
|
||||
|
||||
Reference in New Issue
Block a user