From 4efa964eede86720346feb454f5bb3c20d24d901 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 30 Oct 2023 17:07:22 +0800
Subject: [PATCH] 楼盘表相关页面
---
subPackage/house/roomDetails/index.vue | 249 ++++++++++++++++++++
pages.json | 36 +++
static/margin.css | 4
subPackage/house/family/index.vue | 310 +++++++++++++++++++++++++
subPackage/house/list/index.vue | 83 ++++++
5 files changed, 682 insertions(+), 0 deletions(-)
diff --git a/pages.json b/pages.json
index 205afdf..acbbe3d 100644
--- a/pages.json
+++ b/pages.json
@@ -435,8 +435,44 @@
}
]
+ },
+
+
+ // 楼栋管理
+ {
+ "root": "subPackage/house",
+ "pages": [{
+ "path": "list/index",
+ "style": {
+ "navigationBarTitleText": "楼栋列表",
+ "navigationBarBackgroundColor": "#5887f9",
+ "navigationBarTextStyle": "white",
+ "enablePullDownRefresh": false
+ }
+ },
+ {
+ "path": "family/index",
+ "style": {
+ "navigationBarTitleText": "楼盘",
+ "navigationBarBackgroundColor": "#5887f9",
+ "navigationBarTextStyle": "white",
+ "enablePullDownRefresh": false
+ }
+ },
+ {
+ "path": "roomDetails/index",
+ "style": {
+ "navigationBarTitleText": "房屋详情",
+ "navigationBarBackgroundColor": "#5887f9",
+ "navigationBarTextStyle": "white",
+ "enablePullDownRefresh": false
+ }
+ }
+
+ ]
}
+
],
"globalStyle": {
"navigationBarTextStyle": "black",
diff --git a/static/margin.css b/static/margin.css
index f17a34d..cdf34c3 100644
--- a/static/margin.css
+++ b/static/margin.css
@@ -59,6 +59,10 @@
margin-top: 20rpx;
}
+.mt-40 {
+ margin-top: 40rpx;
+}
+
.mt-55 {
margin-top: 55rpx;
}
diff --git a/subPackage/house/family/index.vue b/subPackage/house/family/index.vue
new file mode 100644
index 0000000..e3fd773
--- /dev/null
+++ b/subPackage/house/family/index.vue
@@ -0,0 +1,310 @@
+<template>
+ <view class="container">
+ <view class="flex f-d-c main">
+ <view class="cur-header">
+ <u-icon name="home" color="#fff"></u-icon>
+ {{housingName}}/{{buildingName}}栋
+ </view>
+ <view class="h0 flex-1 build-list-box">
+ <u-collapse :border="false">
+ <u-collapse-item style="border: none;" :title="item.unitName" :name="index"
+ v-for="(item, index) in buildingList" :key="index">
+ <view class="flex floor-content" v-for="(floor, floorIndex) in item.floorList"
+ :key="floorIndex">
+ <view class="floor-num-box flex a-i-c j-c-c">
+ {{floor.floorName}}
+ </view>
+ <view class="room-content">
+ <u-grid class="flex flex-wrap" col="2" :border="true">
+ <u-grid-item v-for="(family, familyIndex) in floor.familyList" :key="familyIndex">
+ <view class="room-box flex f-d-c">
+
+ <view class="flex a-i-c j-c-s-b" v-show="family.resideStatus">
+ <view class="l">{{family.houseHoldName}}</view>
+ <view class="r flex">
+ <view v-show="family.resideStatus">
+ <u-icon name="photo"></u-icon>
+ </view>
+
+ <view v-show="family.isOwner">
+ <u-icon name="photo"></u-icon>
+ </view>
+ </view>
+ </view>
+
+ <view class="flex">
+ <view class="l flex">
+ <u-icon name="home" color="blue"></u-icon>
+ {{family.roomNumber}}
+ </view>
+ <view class="r">
+
+ </view>
+ </view>
+
+ </view>
+ </u-grid-item>
+ </u-grid>
+ </view>
+ </view>
+ </u-collapse-item>
+ </u-collapse>
+
+ <u-divider text="已经到底了"></u-divider>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ export default {
+ components: {},
+
+ data() {
+ return {
+ housingName: '万达晶座',
+ buildingName: 11,
+ buildingList: [{
+ unitName: '一单元',
+ floorList: [{
+ floorName: '1层',
+ familyList: [{
+ houseHoldName: '王子豪1',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪2',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪3',
+ resideStatus: 0, // 1居住，0未居住
+ isOwner: 0, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪4',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪5',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪6',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ }
+ ]
+ },
+ {
+ floorName: '2层',
+ familyList: [{
+ houseHoldName: '王子豪1',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪2',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪3',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪4',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪5',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪6',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ }
+ ]
+ }
+ ]
+ },
+ {
+ unitName: '二单元',
+ floorList: [{
+ floorName: '1层',
+ familyList: [{
+ houseHoldName: '王子豪1',
+ resideStatus: 0, // 1居住，0未居住
+ isOwner: 0, // 1业主， 0不是业主
+ roomNumber: 301
+ }]
+ },
+ {
+ floorName: '2层',
+ familyList: [{
+ houseHoldName: '王子豪1',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪2',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪3',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪4',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪5',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪6',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ },
+ {
+ houseHoldName: '王子豪',
+ resideStatus: 1, // 1居住，0未居住
+ isOwner: 1, // 1业主， 0不是业主
+ roomNumber: 301
+ }
+ ]
+ }
+ ]
+ }
+ ]
+ }
+ },
+
+ onShow() {},
+
+ methods: {
+
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .container {
+ width: 100%;
+ height: 100%;
+
+ display: flex;
+ flex-direction: column;
+ background: #F9F9FA;
+ font-size: 26rpx;
+
+
+ .main {
+ position: relative;
+ height: 0;
+ flex: 1;
+ overflow-y: auto;
+
+ .cur-header {
+ padding-left: 16rpx;
+ display: flex;
+ align-items: center;
+ min-height: 96rpx;
+ color: #fff;
+ background: #6A9DFD;
+ }
+
+ .build-list-box {
+ /deep/ .u-cell {
+ background: #A0C0FC !important;
+ }
+
+ /deep/ .u-collapse-item__content__text {
+ padding: 0 !important;
+ }
+ }
+
+ /deep/ .floor-content {
+ border-bottom: 1rpx solid #ccc;
+
+ .floor-num-box {
+ padding: 0 20rpx !important;
+ background: #EAECF0;
+ }
+
+ .room-content {
+ width: 0;
+ flex: 1;
+ background: #FEFEFF;
+
+ .room-box {
+ padding: 8rpx;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ min-height: 116rpx;
+ box-sizing: border-box;
+
+ &>view {
+ margin: auto;
+ width: 100%;
+ }
+ }
+
+ .u-grid-item:nth-child(2n-1) {
+ border-right: 1rpx solid #dadbde !important;
+ }
+ }
+ }
+ }
+ }
+</style>
\ No newline at end of file
diff --git a/subPackage/house/list/index.vue b/subPackage/house/list/index.vue
new file mode 100644
index 0000000..c08138d
--- /dev/null
+++ b/subPackage/house/list/index.vue
@@ -0,0 +1,83 @@
+<template>
+ <view class="container">
+ <view class="flex f-d-c main">
+ <view class="flex house-container">
+ <view class="house-list-box" v-for="(item, index) in houseList">
+ <view class="l">
+ <u-icon name="home" color="#fff"></u-icon>
+ </view>
+ <view class="r">
+ {{item.title}}栋
+ </view>
+ </view>
+ </view>
+
+ <u-divider text="已经到底了"></u-divider>
+ </view>
+ </view>
+</template>
+
+<script>
+ export default {
+ components: {},
+
+ data() {
+ return {
+ houseList: [{
+ title: 11
+ },
+ {
+ title: 12
+ },
+ {
+ title: 13
+ }
+ ]
+ }
+ },
+
+ onShow() {},
+
+ methods: {
+
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .container {
+ width: 100%;
+ height: 100%;
+
+ display: flex;
+ flex-direction: column;
+ background: #F9F9FA;
+ font-size: 26rpx;
+
+
+ .main {
+ position: relative;
+ height: 0;
+ flex: 1;
+ overflow-y: auto;
+
+ .house-container {
+ flex-wrap: wrap;
+
+ .house-list-box {
+ margin: 16rpx;
+ padding: 0 16rpx;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: calc((100% - 96rpx) / 3);
+ height: 68rpx;
+ border-radius: 34rpx;
+ color: #fff;
+ background: linear-gradient(to right, #417BE9, #6D9FFB);
+ box-sizing: border-box;
+ }
+ }
+ }
+ }
+</style>
\ No newline at end of file
diff --git a/subPackage/house/roomDetails/index.vue b/subPackage/house/roomDetails/index.vue
new file mode 100644
index 0000000..657e006
--- /dev/null
+++ b/subPackage/house/roomDetails/index.vue
@@ -0,0 +1,249 @@
+<template>
+ <view class="container">
+ <view class="main">
+ <view class="content">
+ <view class="base b-c-w">
+ <view class="flex a-i-c">
+ <u-icon name="photo"></u-icon> 万达晶座：11栋
+ </view>
+ <view class="flex j-c-s-b">
+ <view>
+ 一单元单元 2901室（共2人）
+ </view>
+ <view class="flex a-i-c">
+ <u-button size='small' shape="circle" type="primary" :plain="true" text="房屋管理"></u-button>
+ </view>
+ </view>
+ </view>
+
+ <view class="mt-40 owner-box b-c-w" v-for="(item, index) in ownerInfoList" :key="index">
+ <view class="flex">
+ <view class="l flex-1 flex">
+ <view class="flex_base">
+ <view class="head-img flex_base">
+ <u--image shape="circle" :showLoading="true" :src="item.src" width="120rpx"
+ height="120rpx"></u--image>
+ </view>
+ </view>
+ <view class="info">
+ <view>姓名：{{item.name}}</view>
+ <view class="flex">
+ 手机：{{item.phone}} <u-icon name="phone-fill" color="#4586FE"></u-icon>
+ </view>
+ <view class="flex">
+ 关系：
+ <view class="flex a-i-c">
+ <u-tag :text="item.relation" size="mini"
+ :bgColor="item.relationType == 1 ? '#07C160' : '#1989FA'"></u-tag>
+ </view>
+ </view>
+ </view>
+ </view>
+ <view class="r flex f-d-c j-c-s-a">
+ <view>
+ <u-button size='small' type="primary" :plain="true" text="资料管理"></u-button>
+ </view>
+ <view>
+ <u-button size='small' type="primary" :plain="true" text="标签管理"></u-button>
+ </view>
+ </view>
+ </view>
+ <view class="flex a-i-c j-c-s-b">
+ <view class="l flex">
+ <u-icon name="photo"></u-icon>
+ <u-icon name="photo"></u-icon>
+ </view>
+ <view class="r">
+ <u-icon name="trash-fill" color="red"></u-icon>
+ </view>
+ </view>
+ </view>
+
+ <view class="mt-20 rent-out-box">
+ <box-title :title="'出租管理'"></box-title>
+
+ <view class="mt-40 rent-out-list b-c-w" v-for="(item, index) in rentOutList" :key="index">
+ <view class="t flex j-c-s-b a-i-c">
+ <view class="l">
+ 租客：{{item.name}}（共{{item.allNum}}人）
+ </view>
+ <view class="r">
+ <u-icon name="trash-fill" color="red"></u-icon>
+ </view>
+ </view>
+ <view class="t flex j-c-s-b a-i-c">
+ <view class="l">
+ {{item.startTime}} - {{item.endTime}}
+ </view>
+ <view class="r">
+ {{item.status == 1 ? '已到期' : '未到期'}}
+ </view>
+ </view>
+ <view class="btn-box flex j-c-s-a">
+ <u-button color="#CDF3DF" text="修改"></u-button>
+ <u-button color="#DAE7FF" text="续租"></u-button>
+ <u-button color="#FCCED3" text="终止"></u-button>
+ </view>
+ </view>
+ </view>
+
+ <u-divider text="已经到底了"></u-divider>
+ </view>
+
+ <view class="edit-btn">
+ <veiw>
+ <u-button type="primary" text="添加成员"></u-button>
+ </veiw>
+
+ <view>
+ <u-button type="primary" :plain="true" text="添加租赁信息"></u-button>
+ </view>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ export default {
+ components: {},
+
+ data() {
+ return {
+ ownerInfoList: [{
+ src: 'https://cdn.uviewui.com/uview/album/1.jpg',
+ name: '郑洪峰',
+ phone: 13566687549,
+ relationType: 1,
+ relation: '业主'
+ },
+ {
+ src: 'https://cdn.uviewui.com/uview/album/1.jpg',
+ name: '郑小峰',
+ phone: 13547687549,
+ relationType: 3,
+ relation: '儿子'
+ }
+ ],
+
+ rentOutList: [
+ {
+ name: '皇阿玛',
+ startTime: '2023-01-01',
+ endTime: '2024-01-01',
+ status: 0, // 0 未到期，1已到期
+ allNum: 1
+ },
+ {
+ name: '皇阿玛two',
+ startTime: '2023-01-01',
+ endTime: '2024-01-01',
+ status: 0, // 0 未到期，1已到期
+ allNum: 2
+ }
+ ]
+ }
+ },
+
+ onShow() {},
+
+ methods: {
+
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .container {
+ width: 100%;
+ height: 100%;
+
+ display: flex;
+ flex-direction: column;
+ background: #F9F9FA;
+ font-size: 26rpx;
+
+
+ .main {
+ position: relative;
+ height: 0;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+
+ .content {
+ height: 0;
+ flex: 1;
+ overflow-y: auto;
+
+ .base {
+ &>view {
+ padding: 0 10rpx;
+ height: 96rpx;
+ line-height: 96rpx;
+ border-bottom: 1rpx solid #EBEDF0;
+ }
+ }
+
+ .owner-box {
+
+
+ .l {
+ align-items: center;
+
+ .head-img {
+ width: 164rpx;
+ height: 164rpx;
+ background: #EBEDF0;
+ border-radius: 50%;
+ }
+
+ .info {
+ margin-left: 16rpx;
+
+ &>view {
+ height: 66rpx;
+ line-height: 66rpx;
+ }
+ }
+ }
+
+ &>view {
+ padding: 10px;
+ }
+
+ &>view:last-child {
+ height: 44rpx;
+ border-top: 1rpx solid #EBEDF0;
+ }
+ }
+
+ .rent-out-box {
+
+ .rent-out-list {
+ padding: 20rpx 16rpx;
+
+ .t {
+ height: 72rpx;
+
+ }
+
+ .btn-box {
+ &>.u-button {
+ margin: 0 16rpx;
+ }
+ }
+ }
+ }
+ }
+
+ .edit-btn {
+ height: 116rpx;
+ display: flex;
+ justify-content: space-around;
+ align-items: center;
+ background: #fff;
+ border-top: 1rpx solid #ccc;
+ }
+ }
+ }
+</style>
\ No newline at end of file
--
Gitblit v1.9.3