From 3a5325039b8782785d029b8ebab8ff807f357eca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=AE=B8=E5=AE=8F=E6=9D=B0?= <1943105267@qq.com>
Date: Fri, 8 Nov 2024 16:19:13 +0800
Subject: [PATCH] =?UTF-8?q?=E6=88=B7=E5=8A=9F=E8=83=BD=E5=90=8C=E6=AD=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/system/dict/data.js        |  52 ++++++
 api/system/dict/type.js        |  60 +++++++
 api/taicangpop/house.js        |  68 ++++----
 api/taicangpop/person.js       |  60 +++----
 components/BottomBtn/index.vue |  45 ++++++
 components/ColorItem/index.vue |  36 +++--
 main.js                        |   2 +
 pages.json                     | 171 +++++++++++---------
 pages/building/building.vue    |  22 ++-
 pages/house/addAndEdit.vue     | 238 +++++++++++++++++++++++++++
 pages/house/house.vue          | 288 +++++++++++++++++++++++++++++++++
 pages/house/personInfo.vue     | 107 ++++++++++++
 pages/index.vue                |   3 +-
 static/scss/index.scss         |   3 +-
 store/getters.js               |   2 +-
 store/modules/user.js          |   6 +-
 utils/handlerColor.js          |  48 ++++++
 17 files changed, 1048 insertions(+), 163 deletions(-)
 create mode 100644 api/system/dict/data.js
 create mode 100644 api/system/dict/type.js
 create mode 100644 components/BottomBtn/index.vue
 create mode 100644 pages/house/addAndEdit.vue
 create mode 100644 pages/house/house.vue
 create mode 100644 pages/house/personInfo.vue

diff --git a/api/system/dict/data.js b/api/system/dict/data.js
new file mode 100644
index 0000000..6c9eb79
--- /dev/null
+++ b/api/system/dict/data.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+
+// 查询字典数据列表
+export function listData(query) {
+  return request({
+    url: '/system/dict/data/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询字典数据详细
+export function getData(dictCode) {
+  return request({
+    url: '/system/dict/data/' + dictCode,
+    method: 'get'
+  })
+}
+
+// 根据字典类型查询字典数据信息
+export function getDicts(dictType) {
+  return request({
+    url: '/system/dict/data/type/' + dictType,
+    method: 'get'
+  })
+}
+
+// 新增字典数据
+export function addData(data) {
+  return request({
+    url: '/system/dict/data',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改字典数据
+export function updateData(data) {
+  return request({
+    url: '/system/dict/data',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除字典数据
+export function delData(dictCode) {
+  return request({
+    url: '/system/dict/data/' + dictCode,
+    method: 'delete'
+  })
+}
diff --git a/api/system/dict/type.js b/api/system/dict/type.js
new file mode 100644
index 0000000..a7a6e01
--- /dev/null
+++ b/api/system/dict/type.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+// 查询字典类型列表
+export function listType(query) {
+  return request({
+    url: '/system/dict/type/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询字典类型详细
+export function getType(dictId) {
+  return request({
+    url: '/system/dict/type/' + dictId,
+    method: 'get'
+  })
+}
+
+// 新增字典类型
+export function addType(data) {
+  return request({
+    url: '/system/dict/type',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改字典类型
+export function updateType(data) {
+  return request({
+    url: '/system/dict/type',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除字典类型
+export function delType(dictId) {
+  return request({
+    url: '/system/dict/type/' + dictId,
+    method: 'delete'
+  })
+}
+
+// 刷新字典缓存
+export function refreshCache() {
+  return request({
+    url: '/system/dict/type/refreshCache',
+    method: 'delete'
+  })
+}
+
+// 获取字典选择框列表
+export function optionselect() {
+  return request({
+    url: '/system/dict/type/optionselect',
+    method: 'get'
+  })
+}
\ No newline at end of file
diff --git a/api/taicangpop/house.js b/api/taicangpop/house.js
index 55493d9..a8143be 100644
--- a/api/taicangpop/house.js
+++ b/api/taicangpop/house.js
@@ -1,55 +1,55 @@
-import { request } from '@/api/request.js'
+import request from '@/utils/request'
 
 // 查询住户管理列表
 export function listHouse(query) {
-  return request({
-    url: '/taicangpop/house/list',
-    method: 'get',
-    params: query,
-  })
+	return request({
+		url: '/taicangpop/house/list',
+		method: 'get',
+		params: query,
+	})
 }
 
 // 查询住户管理详细
 export function getHouse(id) {
-  return request({
-    url: '/taicangpop/house/' + id,
-    method: 'get',
-  })
+	return request({
+		url: '/taicangpop/house/' + id,
+		method: 'get',
+	})
 }
 
 // 新增住户管理
 export function addHouse(data) {
-  return request({
-    url: '/taicangpop/house',
-    method: 'post',
-    data: data,
-  })
+	return request({
+		url: '/taicangpop/house',
+		method: 'post',
+		data: data,
+	})
 }
 
 // 修改住户管理
 export function updateHouse(data) {
-  return request({
-    url: '/taicangpop/house',
-    method: 'put',
-    data: data,
-  })
+	return request({
+		url: '/taicangpop/house',
+		method: 'put',
+		data: data,
+	})
 }
 
 // 删除住户管理
 export function delHouse(id) {
-  return request({
-    url: '/taicangpop/house/' + id,
-    method: 'delete',
-  })
+	return request({
+		url: '/taicangpop/house/' + id,
+		method: 'delete',
+	})
 }
 
 // 导出住户管理
 export function exportHouse(query) {
-  return request({
-    url: '/taicangpop/house/export',
-    method: 'get',
-    params: query,
-  })
+	return request({
+		url: '/taicangpop/house/export',
+		method: 'get',
+		params: query,
+	})
 }
 
 // 查询住户管理排摸
@@ -61,8 +61,8 @@ export function exportHouse(query) {
 // }
 
 export function listPaimoHouse(id) {
-  return request({
-    url: '/taicangpop/house/getweigengxinnew?buildingid=' + id,
-    method: 'get',
-  })
-}
+	return request({
+		url: '/taicangpop/house/getweigengxinnew?buildingid=' + id,
+		method: 'get',
+	})
+}
\ No newline at end of file
diff --git a/api/taicangpop/person.js b/api/taicangpop/person.js
index 9d545ce..ce0f10e 100644
--- a/api/taicangpop/person.js
+++ b/api/taicangpop/person.js
@@ -1,53 +1,53 @@
-import { request } from '@/api/request.js'
+import request from '@/utils/request'
 
 // 查询居民管理列表
 export function listPerson(query) {
-  return request({
-    url: '/taicangpop/person/list',
-    method: 'get',
-    params: query,
-  })
+	return request({
+		url: '/taicangpop/person/list',
+		method: 'get',
+		params: query,
+	})
 }
 
 // 查询居民管理详细
 export function getPerson(id) {
-  return request({
-    url: '/taicangpop/person/' + id,
-    method: 'get',
-  })
+	return request({
+		url: '/taicangpop/person/' + id,
+		method: 'get',
+	})
 }
 
 // 新增居民管理
 export function addPerson(data) {
-  return request({
-    url: '/taicangpop/person',
-    method: 'post',
-    data: data,
-  })
+	return request({
+		url: '/taicangpop/person',
+		method: 'post',
+		data: data,
+	})
 }
 
 // 修改居民管理
 export function updatePerson(data) {
-  return request({
-    url: '/taicangpop/person',
-    method: 'put',
-    data: data,
-  })
+	return request({
+		url: '/taicangpop/person',
+		method: 'put',
+		data: data,
+	})
 }
 
 // 删除居民管理
 export function delPerson(id) {
-  return request({
-    url: '/taicangpop/person/' + id,
-    method: 'delete',
-  })
+	return request({
+		url: '/taicangpop/person/' + id,
+		method: 'delete',
+	})
 }
 
 // 导出居民管理
 export function exportPerson(query) {
-  return request({
-    url: '/taicangpop/person/export',
-    method: 'get',
-    params: query,
-  })
-}
+	return request({
+		url: '/taicangpop/person/export',
+		method: 'get',
+		params: query,
+	})
+}
\ No newline at end of file
diff --git a/components/BottomBtn/index.vue b/components/BottomBtn/index.vue
new file mode 100644
index 0000000..08b2faa
--- /dev/null
+++ b/components/BottomBtn/index.vue
@@ -0,0 +1,45 @@
+<template>
+	<view class="bottom-btn">
+		<u-button :type="type" @click="handlerClick()">{{title}}</u-button>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			title: {
+				type: String,
+				default: ''
+			},
+			type: {
+				type: String,
+				default: 'success'
+			},
+		},
+		name: "bottomBtn",
+		data() {
+			return {
+
+			};
+		},
+		methods: {
+			handlerClick() {
+				this.$emit('handlerClick')
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.bottom-btn {
+		border-top: 1px solid #e4e7ed;
+		box-sizing: border-box;
+		padding: 20rpx 20rpx;
+		padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
+		background: #fff;
+		position: fixed;
+		bottom: 0%;
+		left: 0%;
+		width: 100%;
+	}
+</style>
\ No newline at end of file
diff --git a/components/ColorItem/index.vue b/components/ColorItem/index.vue
index 286a060..e1e5379 100644
--- a/components/ColorItem/index.vue
+++ b/components/ColorItem/index.vue
@@ -1,17 +1,16 @@
 <template>
-	<view class="color-item" :class="size">
+	<view class="color-item" @click="clickHouse()">
 		<div class="left-color" :style="{ background: item.leftColor }"></div>
 		<div class="rigth-color">
 			<div :style="{ background: item.rightTopColor }"></div>
 			<div class="rigth-bottom" v-show="item.color == 'HF' || item.color == 'NF'"></div>
 		</div>
 		<view v-show="showColorName" class="color-name">{{item.color}}</view>
-		<view v-show="showBuildingName" class="color-building-name">{{item.name.replace("室","")}}</view>
+		<view v-if="showBuildingName" class="color-building-name">{{item.name.replace("室","")}}</view>
 		<!-- 红绿点 -->
 		<view class="color-warn" v-show="showBuildingName">
 			<view class="warn-item" style="background: red" v-show="item.daycount > 0"></view>
-			<view class="warn-item" style="background: green"
-          v-show="item.daycount == '0'"></view>
+			<view class="warn-item" style="background: green" v-show="item.daycount == '0'"></view>
 		</view>
 		<!-- 四个is -->
 		<view class="color-is-type" v-show="showBuildingName">
@@ -31,7 +30,7 @@
 				type: Boolean,
 				default: false,
 			},
-			
+
 			showColorName: {
 				type: Boolean,
 				default: true,
@@ -49,6 +48,12 @@
 			return {
 
 			};
+		},
+		methods: {
+			clickHouse() {
+				if (!this.showBuildingName) return
+				this.$emit('clickHouse', this.item)
+			},
 		}
 	}
 </script>
@@ -61,7 +66,8 @@
 		border: 2rpx solid #fff;
 		display: flex;
 		align-items: center;
-		.color-building-name{
+
+		.color-building-name {
 			position: absolute;
 			top: 0;
 			left: 0;
@@ -73,30 +79,34 @@
 			align-items: center;
 			justify-content: center;
 		}
-		
-		.color-warn{
+
+		.color-warn {
 			position: absolute;
 			bottom: 0;
 			right: 0;
 			display: flex;
 			align-items: center;
-			&>view{
+
+			&>view {
 				height: 20rpx;
 				width: 20rpx;
 				border-radius: 50%;
 				border: 1px solid #fff;
 			}
 		}
-		.color-is-type{
+
+		.color-is-type {
 			position: absolute;
 			top: -20rpx;
-			left:0;
-			&>image{
+			left: 0;
+
+			&>image {
 				height: 20rpx;
 				width: 20rpx;
 				margin-right: 6rpx;
 			}
 		}
+
 		.left-color,
 		.rigth-color {
 			flex: 1;
@@ -127,6 +137,4 @@
 			font-size: 28rpx;
 		}
 	}
-
-
 </style>
\ No newline at end of file
diff --git a/main.js b/main.js
index bfb5c1e..06a2f89 100644
--- a/main.js
+++ b/main.js
@@ -14,9 +14,11 @@ Vue.use(uView);
 // 自定义包含导航栏容器
 import NavigationGeneral from "@/components/NavigationGeneral";
 import ColorItem from "@/components/ColorItem";
+import BottomBtn from "@/components/BottomBtn";
 
 Vue.component("NavigationGeneral", NavigationGeneral);
 Vue.component("ColorItem", ColorItem);
+Vue.component("BottomBtn", BottomBtn);
 
 App.mpType = 'app'
 
diff --git a/pages.json b/pages.json
index e2e0e04..82e3dbb 100644
--- a/pages.json
+++ b/pages.json
@@ -3,84 +3,103 @@
 		"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
 	},
 	"pages": [{
-		"path": "pages/login",
-		"style": {
-			"navigationBarTitleText": "登录"
-		}
-	}, {
-		"path": "pages/register",
-		"style": {
-			"navigationBarTitleText": "注册"
-		}
-	}, {
-		"path": "pages/index",
-		"style": {
-			"navigationBarTitleText": "若依移动端框架",
-			"navigationStyle": "custom"
-		}
-	}, {
-		"path": "pages/work/index",
-		"style": {
-			"navigationBarTitleText": "工作台"
-		}
-	}, {
-		"path": "pages/mine/index",
-		"style": {
-			"navigationBarTitleText": "我的"
-		}
-	}, {
-		"path": "pages/mine/avatar/index",
-		"style": {
-			"navigationBarTitleText": "修改头像"
-		}
-	}, {
-		"path": "pages/mine/info/index",
-		"style": {
-			"navigationBarTitleText": "个人信息"
-		}
-	}, {
-		"path": "pages/mine/info/edit",
-		"style": {
-			"navigationBarTitleText": "编辑资料"
-		}
-	}, {
-		"path": "pages/mine/pwd/index",
-		"style": {
-			"navigationBarTitleText": "修改密码"
-		}
-	}, {
-		"path": "pages/mine/setting/index",
-		"style": {
-			"navigationBarTitleText": "应用设置"
-		}
-	}, {
-		"path": "pages/mine/help/index",
-		"style": {
-			"navigationBarTitleText": "常见问题"
-		}
-	}, {
-		"path": "pages/mine/about/index",
-		"style": {
-			"navigationBarTitleText": "关于我们"
-		}
-	}, {
-		"path": "pages/common/webview/index",
-		"style": {
-			"navigationBarTitleText": "浏览网页"
-		}
-	}, {
-		"path": "pages/common/textview/index",
-		"style": {
-			"navigationBarTitleText": "浏览文本"
-		}
-	},
-	{
-		"path" : "pages/building/building",
-		"style" : 
+			"path": "pages/login",
+			"style": {
+				"navigationBarTitleText": "登录"
+			}
+		}, {
+			"path": "pages/register",
+			"style": {
+				"navigationBarTitleText": "注册"
+			}
+		}, {
+			"path": "pages/index",
+			"style": {
+				"navigationBarTitleText": "若依移动端框架",
+				"navigationStyle": "custom"
+			}
+		}, {
+			"path": "pages/work/index",
+			"style": {
+				"navigationBarTitleText": "工作台"
+			}
+		}, {
+			"path": "pages/mine/index",
+			"style": {
+				"navigationBarTitleText": "我的"
+			}
+		}, {
+			"path": "pages/mine/avatar/index",
+			"style": {
+				"navigationBarTitleText": "修改头像"
+			}
+		}, {
+			"path": "pages/mine/info/index",
+			"style": {
+				"navigationBarTitleText": "个人信息"
+			}
+		}, {
+			"path": "pages/mine/info/edit",
+			"style": {
+				"navigationBarTitleText": "编辑资料"
+			}
+		}, {
+			"path": "pages/mine/pwd/index",
+			"style": {
+				"navigationBarTitleText": "修改密码"
+			}
+		}, {
+			"path": "pages/mine/setting/index",
+			"style": {
+				"navigationBarTitleText": "应用设置"
+			}
+		}, {
+			"path": "pages/mine/help/index",
+			"style": {
+				"navigationBarTitleText": "常见问题"
+			}
+		}, {
+			"path": "pages/mine/about/index",
+			"style": {
+				"navigationBarTitleText": "关于我们"
+			}
+		}, {
+			"path": "pages/common/webview/index",
+			"style": {
+				"navigationBarTitleText": "浏览网页"
+			}
+		}, {
+			"path": "pages/common/textview/index",
+			"style": {
+				"navigationBarTitleText": "浏览文本"
+			}
+		},
+		{
+			"path": "pages/building/building",
+			"style": {
+				"navigationBarTitleText": ""
+			}
+		},
+		{
+			"path": "pages/house/house",
+			"style": {
+				"navigationBarTitleText": ""
+			}
+		},
+		{
+			"path": "pages/house/personInfo",
+			"style": {
+				"navigationBarTitleText": ""
+			}
+		},
 		{
-			"navigationBarTitleText" : ""
+			"path" : "pages/house/addAndEdit",
+			"style" : 
+			{
+				"navigationBarTitleText" : ""
+			}
 		}
-	}],
+	],
 	"tabBar": {
 		"color": "#000000",
 		"selectedColor": "#000000",
diff --git a/pages/building/building.vue b/pages/building/building.vue
index be1221f..c0cb98a 100644
--- a/pages/building/building.vue
+++ b/pages/building/building.vue
@@ -19,7 +19,7 @@
 				<view class="list-scroll-x" :style="handlerWidth">
 					<view class="color-rows" v-for="(item,index) in groupedRooms" :key="index">
 						<color-item :showBuildingName="true" :showColorName="false" :item="house" v-for="house in item"
-							:key="house.id"></color-item>
+							:key="house.id" @clickHouse="clickHouse"></color-item>
 					</view>
 					<view class="color-rows">
 						<view class="unitItem" v-for="unitItem in buildingInfo.unit" :key="unitItem">
@@ -67,7 +67,6 @@
 		},
 		computed: {
 			handlerWidth() {
-
 				return {
 					width: (this.buildingInfo.house + 1) * 122 + 'rpx'
 				}
@@ -103,10 +102,25 @@
 			this.boxTop = (systemData.statusBarHeight + 44) * 2
 			this.title = option.deptname
 			this.queryParams.buildingId = option.buildingId
-			this.getBuildingInfo()
 
+
+		},
+		onShow() {
+			this.getBuildingInfo()
 		},
 		methods: {
+			//单击house
+			clickHouse(e) {
+				this.$u.route({
+					url: 'pages/house/house',
+					params: {
+						buildingId: e.building_id,
+						houseId: e.id,
+						deptId: e.dept_id,
+						houseName: e.name
+					}
+				})
+			},
 			//楼信息
 			async getBuildingInfo() {
 				const res = await getBuilding(this.queryParams.buildingId)
@@ -125,7 +139,7 @@
 		}
 	}
 </script>
-<style lang="scss">
+<style lang="scss" scoped>
 	page {
 		background: #113666;
 	}
diff --git a/pages/house/addAndEdit.vue b/pages/house/addAndEdit.vue
new file mode 100644
index 0000000..3f012cd
--- /dev/null
+++ b/pages/house/addAndEdit.vue
@@ -0,0 +1,238 @@
+<template>
+	<navigation-general :title="title">
+		<u-form :model="form" ref="uForm" label-width="130rpx">
+			<u-form-item label="姓名" prop="name"><u-input v-model="form.name" /></u-form-item>
+			<u-form-item label="身份证"><u-input v-model="form.credentialNo" /></u-form-item>
+			<u-form-item label="手机号" prop="phone"><u-input v-model="form.phone" /></u-form-item>
+			<u-form-item label="人员类型">
+				<u-checkbox-group @change="checkboxGroupChange">
+					<u-checkbox v-model="item.checked" v-for="(item, index) in typeList" :key="index" :name="item.name">
+						{{ item.name }}
+					</u-checkbox>
+				</u-checkbox-group>
+			</u-form-item>
+			<u-form-item label="户籍" prop="color">
+				<u-radio-group v-model="form.color">
+					<u-radio v-for="(item, index) in hujiList" :key="index" :name="item.dictLabel">
+						{{item.dictLabel}}
+					</u-radio>
+				</u-radio-group>
+			</u-form-item>
+			<u-form-item label="流动" prop="color">
+				<u-radio-group v-model="form.color">
+					<u-radio v-for="(item, index) in liudList" :key="index" :name="item.dictLabel">
+						{{item.dictLabel}}
+					</u-radio>
+				</u-radio-group>
+			</u-form-item>
+			<u-form-item label="工作单位"><u-input v-model="form.workunit" /></u-form-item>
+			<u-form-item label="备注"><u-input v-model="form.remark" /></u-form-item>
+		</u-form>
+		<bottom-btn type="primary" title="提交" @handlerClick="handlerClick"></bottom-btn>
+
+
+	</navigation-general>
+</template>
+
+<script>
+	import {
+		mapGetters
+	} from "vuex";
+
+	import {
+		addPerson,
+		getPerson,
+		updatePerson
+	} from "@/api/taicangpop/person.js";
+	import {
+		getDicts
+	} from "@/api/system/dict/data";
+	export default {
+
+		data() {
+			return {
+				multiple: [],
+				hujiList: [],
+				liudList: [],
+				title: '',
+				form: {
+					buildingId: undefined,
+					color: undefined,
+					credentialNo: undefined,
+					deptId: undefined,
+					houseId: undefined,
+					id: null,
+					isD: 0,
+					isJ: 0,
+					isK: 0,
+					isX: 0,
+					name: undefined,
+					phone: undefined,
+					remark: undefined,
+					type: null,
+					userId: null,
+				},
+				rules: {
+					name: [{
+							required: true,
+							message: '请输入姓名',
+							trigger: ['change', 'blur'],
+						},
+
+					],
+					phone: [{
+							required: true,
+							message: '请输入手机号',
+							trigger: ['change', 'blur'],
+						},
+						{
+							validator: (rule, value, callback) => {
+								console.log("value:" + value);
+								if (!/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/.test(value)) {
+									callback(new Error("手机号只能为数字！"));
+								} else {
+									callback();
+								}
+							},
+							trigger: "blur"
+						},
+					],
+					color: [{
+						required: true,
+						message: '请选择分色',
+						trigger: ['change', 'blur'],
+					}],
+				},
+				typeList: [{
+						name: '中共党员',
+						key: 'isD',
+						checked: false,
+
+					},
+					{
+						name: '帮扶对象',
+						key: 'isK',
+						checked: false,
+
+					},
+					{
+						name: '重点人群',
+						checked: false,
+						key: 'isX',
+
+					},
+					{
+						name: '退伍军人',
+						key: 'isJ',
+						checked: false,
+
+					},
+				]
+			};
+		},
+		computed: {
+			...mapGetters(["userId"]),
+		},
+		onReady() {
+			this.$refs.uForm.setRules(this.rules);
+		},
+		onLoad(option) {
+			if (option.personId) {
+				this.title = '居民信息修改'
+				//获取人员详细信息
+				this.getPersonInfo(option.personId)
+			} else {
+				this.title = '新增居民'
+				this.form.buildingId = option.buildingId
+				this.form.houseId = option.houseId
+				this.form.deptId = option.deptId
+
+			}
+
+			this.getDictList()
+		},
+		methods: {
+			async getPersonInfo(personId) {
+				const res = await getPerson(personId)
+				for (let key in res.data) {
+					const item = res.data[key]
+					let index = this.typeList.findIndex(it => it.key == key)
+					if (index != -1) {
+						this.typeList[index].checked = item > 0 ? true : false
+					}
+				}
+				this.form = res.data
+			},
+			handlerClick() {
+				this.$refs.uForm.validate(valid => {
+					if (valid) {
+						if (this.form.color == "HZ" || this.form.color == "HO") {
+							this.form.type = 1;
+						} else {
+							this.form.type = 2;
+						}
+						this.form.userId = this.userId
+						if (this.form.id != null) {
+							updatePerson(this.form).then((response) => {
+								uni.showToast({
+									title: '修改成功',
+									success: () => {
+										setTimeout(() => {
+											uni.navigateBack()
+										}, 1000)
+									}
+								})
+							});
+						} else {
+							addPerson(this.form).then((res) => {
+								uni.showToast({
+									title: '新增成功',
+									success: () => {
+										setTimeout(() => {
+											uni.navigateBack()
+										}, 1000)
+									}
+								})
+
+							});
+						}
+
+					} else {
+						console.log('没有痛苦')
+					}
+				})
+
+			},
+			checkboxGroupChange(e) {
+				console.log(e)
+				this.form.isD = e.some((item) => item == "中共党员") ?
+					1 :
+					0;
+				this.form.isK = e.some((item) => item == "帮扶对象") ?
+					1 :
+					0;
+				this.form.isJ = e.some((item) => item == "退伍军人") ?
+					1 :
+					0;
+				this.form.isX = e.some((item) => item == "重点人群") ?
+					1 :
+					0;
+			},
+			//获取字典
+			async getDictList() {
+				const res = await getDicts('b_census_color_type')
+				this.hujiList = res.data
+				const result = await getDicts('b_flow_color_type')
+				this.liudList = result.data
+				console.log(this.hujiList)
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.u-form {
+		background: #fff;
+		padding: 20rpx;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/house/house.vue b/pages/house/house.vue
new file mode 100644
index 0000000..ef8a4fd
--- /dev/null
+++ b/pages/house/house.vue
@@ -0,0 +1,288 @@
+<template>
+	<navigation-general :title="title">
+		<view class="row-title">
+			<view class="main-title">住户信息</view>
+			<u-button type="primary" :plain="true" size="mini">房屋信息采集</u-button>
+		</view>
+
+		<u-cell-group>
+			<u-cell-item title="人数" :arrow="false" :value="personTotal + '人'"></u-cell-item>
+			<u-cell-item title="户籍类型" :arrow="false">
+				<view :style="{color:houseInfo.type !== 1 ? ' rgb(0, 140, 94)' : '#d13b69' }">{{houseInfo.typename}}
+				</view>
+			</u-cell-item>
+			<u-cell-item title="房屋类型" :arrow="false"
+				v-show="houseInfo.isD>0 || houseInfo.isJ>0 || houseInfo.isK>0 || houseInfo.isX>0">
+				<div class="is-type">
+					<view style="color:#e73388 ;border-color: #81204e;" v-show="houseInfo.isD>0">中共党员</view>
+					<view style="color:#734700 ;border-color: #e09100;" v-show="houseInfo.isK>0">帮扶对象</view>
+					<view style="color:#00694c ;border-color: #00c185;" v-show="houseInfo.isX>0">重点人群</view>
+					<view style="color:#006382 ;border-color: #02b4e7;" v-show="houseInfo.isJ>0">退伍军人</view>
+				</div>
+
+			</u-cell-item>
+			<u-cell-item title="分色" :arrow="false">
+				<color-item :item="houseInfo"></color-item>
+			</u-cell-item>
+			<u-cell-item title="更新时间" :arrow="false" :value="houseInfo.updateTime"></u-cell-item>
+			<u-cell-item title="公安地址" :arrow="false"
+				:value="publicAddress[houseInfo.xiaoquId] + houseInfo.deptname + houseInfo.buildingname"></u-cell-item>
+		</u-cell-group>
+
+		<view class="row-title">
+			<view class="main-title">居民信息</view>
+			<u-button type="primary" :plain="true" size="mini" @click="addPerson()">新增居民</u-button>
+		</view>
+		<view class="person-list">
+			<view class="person-item" v-for="item in personList" :key="item.id" @click="handlerInfo(item.id)">
+				<text>{{item.name}}</text>
+				<text>{{ filterCarId(item.credentialNo, "性别") }}</text>
+				<text>{{ filterCarId(item.credentialNo, "年龄") }} 岁</text>
+				<text>{{ filterCarId(item.credentialNo, "出生年月") }}</text>
+				<text
+					:style="{color:item.color !== 'NL' ? ' rgb(0, 140, 94)' : '#d13b69' }">{{personType[item.color]}}</text>
+				<color-item :item="item" :showColorName="false"></color-item>
+
+				<view class="circle-point">
+					<view class="point-item" v-show="filterPoint(item.updateTime)" style="background: green;">
+					</view>
+					<view class="point-item" v-show="!filterPoint(item.updateTime)" style="background: red;">
+					</view>
+				</view>
+
+				<view class="color-is-type">
+					<image src="../../static/images/isd.png" mode="" v-show="item.isD"></image>
+					<image src="../../static/images/isj.png" mode="" v-show="item.isJ"></image>
+					<image src="../../static/images/isx.png" mode="" v-show="item.isX"></image>
+					<image src="../../static/images/isk.png" mode="" v-show="item.isK"></image>
+				</view>
+			</view>
+		</view>
+		<u-loadmore :status="status" :load-text="loadText" />
+	</navigation-general>
+</template>
+
+<script>
+	import {
+		handleColor,
+		validateAndParseIDCard
+	} from '@/utils/handlerColor.js'
+	import {
+		getHouse
+	} from '@/api/taicangpop/house.js'
+	import {
+		listPerson
+	} from '@/api/taicangpop/person.js'
+	import moment from 'moment'
+	export default {
+		data() {
+			return {
+				status: 'loadmore',
+				loadText: {
+					loadmore: '轻轻上拉',
+					loading: '努力加载中',
+					nomore: '没有更多了~'
+				},
+				title: '',
+				queryParams: {},
+				houseInfo: {},
+				personList: [],
+				personTotal: 0,
+				publicAddress: {
+					202: "滨河路大庆锦绣新城",
+					215: "常胜路景瑞荣御蓝湾",
+					242: "东仓路星雨华府",
+					235: "兰州路华盛六园",
+					267: "太平北路森茂汽车城",
+				},
+				personType: {
+					HZ: '自住',
+					HO: '自住',
+					NZ: '自住',
+					NL: '租客',
+				}
+			};
+		},
+		onLoad(option) {
+			this.title = option.houseName
+			this.queryParams = option
+
+
+		},
+		onShow() {
+
+			this.getHouseInfo()
+			this.getPersonList()
+		},
+		methods: {
+			//详情页
+			handlerInfo(id) {
+				this.$u.route({
+					url: 'pages/house/personInfo',
+					params: {
+						personId: id,
+					}
+				})
+			},
+
+			//添加居民
+			addPerson() {
+				this.$u.route({
+					url: 'pages/house/addAndEdit',
+					params: {
+						buildingId: this.houseInfo.buildingId,
+						houseId: this.houseInfo.id,
+						deptId: this.houseInfo.deptId,
+					}
+				})
+			},
+
+			//获取房屋信息
+			async getHouseInfo() {
+				const res = await getHouse(this.queryParams.houseId)
+				res.data.updateTime = moment(res.data.updateTime).format(
+					"YYYY-MM-DD"
+				);
+				this.houseInfo = handleColor([res.data])[0]
+			},
+			//获取house居民
+			async getPersonList() {
+				this.status = 'loading';
+				const res = await listPerson({
+					buildingId: this.queryParams.buildingId,
+					houseId: this.queryParams.houseId,
+
+				})
+				this.personList = handleColor(res.rows)
+				this.personTotal = res.total
+				this.status = 'nomore';
+			},
+			// 身份证过滤
+			filterCarId(carId, type) {
+				return validateAndParseIDCard(carId, type);
+			},
+			//人员预警
+			filterPoint(updateTime) {
+				if (!updateTime) return false
+				let update_m = moment(updateTime).format('MM')
+				let curent_m = moment().format('MM')
+				if (update_m == curent_m) {
+					return true
+				} else {
+					return false
+				}
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.app-container {
+		box-sizing: border-box;
+		padding: 30rpx;
+	}
+
+	.row-title {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		margin-bottom: 15rpx;
+
+		.main-title {
+			font-size: 30rpx;
+		}
+
+		button {
+			margin: 0;
+		}
+	}
+
+	.person-list {
+		box-sizing: border-box;
+
+		display: grid;
+		/* 启用 Grid 布局 */
+		grid-template-columns: repeat(3, 1fr);
+		/* 创建三列，列宽相等 */
+		gap: 25rpx;
+
+		.person-item {
+			position: relative;
+			/* 背景色，方便查看 */
+			padding: 20rpx;
+			/* 内边距 */
+			text-align: center;
+			/* 文本居中 */
+			background-color: #fff;
+			box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
+			border-radius: 3px;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+
+			.circle-point {
+				position: absolute;
+				top: 10rpx;
+				left: 10rpx;
+
+				.point-item {
+					height: 15rpx;
+					width: 15rpx;
+					border-radius: 50%;
+					margin-right: 10rpx;
+				}
+
+			}
+
+			.color-is-type {
+				position: absolute;
+				top: -10rpx;
+				right: 0;
+
+				&>image {
+					height: 25rpx;
+					width: 25rpx;
+					margin-left: 6rpx;
+				}
+			}
+		}
+	}
+
+	.is-type {
+		display: flex;
+		align-items: center;
+
+		&>view {
+			margin-left: 6rpx;
+			border: 1px solid;
+			box-sizing: border-box;
+			padding: 0 6rpx;
+			height: 40rpx;
+			font-size: 24rpx;
+			line-height: 40rpx;
+		}
+	}
+
+	/deep/ .u-cell-box {
+		margin-bottom: 15rpx;
+		border-radius: 3px;
+		overflow: hidden;
+	}
+
+	/deep/ .u-cell {
+		padding: 10rpx 20rpx;
+	}
+
+	/deep/.u-cell__value {
+		display: flex;
+		flex-direction: row-reverse;
+
+		.color-item {
+			margin-right: 40rpx;
+		}
+	}
+
+	/deep/ .u-load-more-wrap {
+		margin-top: 10rpx !important;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/house/personInfo.vue b/pages/house/personInfo.vue
new file mode 100644
index 0000000..5b48b6d
--- /dev/null
+++ b/pages/house/personInfo.vue
@@ -0,0 +1,107 @@
+<template>
+	<navigation-general title="居民详情">
+		<template v-slot:right>
+			<u-button style="margin-right: 20rpx;" type="error" size="mini" @click="handlerDel">删除</u-button>
+		</template>
+		<u-cell-group>
+			<u-cell-item title="姓名" :arrow="false" :value="info.name"></u-cell-item>
+			<u-cell-item title="身份证" :arrow="false" :value="info.credentialNo || '/'"></u-cell-item>
+			<u-cell-item title="手机号" :arrow="false" :value="info.phone || '/'"></u-cell-item>
+			<u-cell-item title="类型" :arrow="false" :value="info.typename"></u-cell-item>
+			<u-cell-item title="分色" :arrow="false" :value="info.color"></u-cell-item>
+			<u-cell-item title="参保单位" :arrow="false" :value="info.qymc || '/'"></u-cell-item>
+			<u-cell-item title="社保电话" :arrow="false" :value="info.lxdh || '/'"></u-cell-item>
+			<u-cell-item title="参保类型" :arrow="false" :value="info.eacaabbff"></u-cell-item>
+			<u-cell-item title="民族" :arrow="false" :value="info.mzcgf"></u-cell-item>
+			<u-cell-item title="社保地址" :arrow="false" :value="info.lxdzDzmc || '/'"></u-cell-item>
+			<u-cell-item title="实际工作单位" :arrow="false" :value="info.workunit || '/'"></u-cell-item>
+			<u-cell-item title="数据更新时间" :arrow="false" :value="info.updateTime || '/'"></u-cell-item>
+			<u-cell-item title="备注" :arrow="false" :value="info.remark || '/'"></u-cell-item>
+		</u-cell-group>
+		<u-top-tips ref="uTips"></u-top-tips>
+		<bottom-btn title="修改信息" @handlerClick="handlerClick"></bottom-btn>
+	</navigation-general>
+</template>
+
+<script>
+	import {
+		getPerson,
+		delPerson
+	} from "@/api/taicangpop/person.js";
+	import {
+		getDicts
+	} from "@/api/system/dict/data";
+
+	export default {
+		data() {
+			return {
+				info: {},
+				personId: null,
+				nationList: [],
+				sbList: []
+			};
+		},
+		onLoad(option) {
+			this.personId = option.personId
+
+
+		},
+		onShow() {
+			this.getnationList()
+		},
+		methods: {
+			async getnationList() {
+				const res = await getDicts('sys_nationality')
+				this.nationList = res.data
+				const reslut = await getDicts('sys_sb_type')
+				this.sbList = reslut.data
+				this.getPersonInfo()
+			},
+			async getPersonInfo() {
+				const res = await getPerson(this.personId)
+				const mzcgf = this.nationList.find(item => item.dictValue == res.data.mzcgf)
+				res.data.mzcgf = mzcgf && mzcgf.dictLabel ? mzcgf.dictLabel : '/'
+
+				const eacaabbff = this.sbList.find(item => item.dictValue == res.data.eacaabbff)
+				res.data.eacaabbff = eacaabbff && eacaabbff.dictLabel ? eacaabbff.dictLabel : '/'
+				this.info = res.data
+			},
+			handlerDel() {
+				uni.showModal({
+					title: `删除操作`,
+					content: `确定要删除编号为${this.personId}的居民吗？`,
+					success: (res) => {
+						if (res.confirm) {
+							delPerson(this.personId).then(res => {
+								uni.showToast({
+									title: '删除成功',
+									success: () => {
+										setTimeout(() => {
+											uni.navigateBack()
+										}, 1000)
+									}
+								})
+							})
+						} else if (res.cancel) {
+							console.log('用户点击取消');
+						}
+					}
+				})
+			},
+			handlerClick() {
+				this.$u.route({
+					url: 'pages/house/addAndEdit',
+					params: {
+						personId: this.personId
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	/deep/ .u-cell {
+		padding: 15rpx 20rpx;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/index.vue b/pages/index.vue
index 3ef2959..5b7899a 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -66,12 +66,11 @@
 		methods: {
 			//跳转楼栋页面
 			handlerBuilding(item) {
-				console.log(item)
 				this.$u.route({
 					url: 'pages/building/building',
 					params: {
 						buildingId: item.id,
-						deptname:  item.name
+						deptname: item.name
 					}
 				})
 			},
diff --git a/static/scss/index.scss b/static/scss/index.scss
index 745cffa..64595e6 100644
--- a/static/scss/index.scss
+++ b/static/scss/index.scss
@@ -3,4 +3,5 @@
 // color-ui
 @import "@/static/scss/colorui.css";
 // iconfont
-@import "@/static/font/iconfont.css";
\ No newline at end of file
+@import "@/static/font/iconfont.css";
+
diff --git a/store/getters.js b/store/getters.js
index 7304960..8accd64 100644
--- a/store/getters.js
+++ b/store/getters.js
@@ -6,6 +6,6 @@ const getters = {
 	permissions: state => state.user.permissions,
 	dept: state => state.user.dept,
 	deptId: state => state.user.deptId,
-
+	userId: state => state.user.userId,
 }
 export default getters
\ No newline at end of file
diff --git a/store/modules/user.js b/store/modules/user.js
index 7aa3e76..6c68100 100644
--- a/store/modules/user.js
+++ b/store/modules/user.js
@@ -19,7 +19,7 @@ const baseUrl = config.baseUrl
 
 const user = {
 	state: {
-
+		userId: null,
 		dept: {},
 		deptId: null,
 		token: getToken(),
@@ -34,6 +34,9 @@ const user = {
 		SET_DEPT_ID: (state, deptId) => {
 			state.deptId = deptId
 		},
+		SET_USER_ID: (state, userId) => {
+			state.userId = userId
+		},
 		SET_DEPT: (state, dept) => {
 			state.dept = dept
 		},
@@ -97,6 +100,7 @@ const user = {
 						commit('SET_ROLES', ['ROLE_DEFAULT'])
 					}
 					commit('SET_NAME', username)
+					commit('SET_USER_ID', user.userId)
 					commit('SET_DEPT', user.dept)
 					commit('SET_AVATAR', avatar)
 
diff --git a/utils/handlerColor.js b/utils/handlerColor.js
index 9a949eb..875d321 100644
--- a/utils/handlerColor.js
+++ b/utils/handlerColor.js
@@ -62,4 +62,52 @@ function checkType(value) {
 	} else {
 		return "neither";
 	}
+}
+
+export function validateAndParseIDCard(idCard, type) {
+	// 验证身份证号格式
+	const idCardPattern =
+		/^[1-9]\d{5}(18|19|20)?\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2][0-9]|3[0-1])\d{3}([0-9Xx])$/;
+	if (!idCardPattern.test(idCard)) {
+		return "-";
+	}
+
+	// 提取出生年月
+	const birthYear =
+		idCard.length === 18 ?
+		idCard.substring(6, 10) :
+		`19${idCard.substring(6, 8)}`;
+	const birthMonth =
+		idCard.length === 18 ? idCard.substring(10, 12) : idCard.substring(8, 10);
+	const birthDay =
+		idCard.length === 18 ? idCard.substring(12, 14) : idCard.substring(10, 12);
+
+	// 计算年龄
+	const today = new Date();
+	const birthDate = new Date(`${birthYear}-${birthMonth}-${birthDay}`);
+	let age = today.getFullYear() - birthDate.getFullYear();
+	if (
+		today.getMonth() < birthDate.getMonth() ||
+		(today.getMonth() === birthDate.getMonth() &&
+			today.getDate() < birthDate.getDate())
+	) {
+		age--;
+	}
+
+	// 提取性别（第17位，奇数为男，偶数为女）
+	const genderCode =
+		idCard.length === 18 ? idCard.substring(16, 17) : idCard.substring(14, 15);
+	const gender = genderCode % 2 === 0 ? "女" : "男";
+
+	// 根据type返回对应的信息
+	switch (type) {
+		case "年龄":
+			return age;
+		case "性别":
+			return gender;
+		case "出生年月":
+			return `${birthYear}-${birthMonth}-${birthDay}`;
+		default:
+			return "无效的type参数";
+	}
 }
\ No newline at end of file