Merge branch 'main' of http://gitea.bugtc.com/zhouyanli/property-resident-side

# Conflicts:
#	property-uniapp-project/pageSubPack/payment-list/addHydropower.vue
#	property-uniapp-project/pageSubPack/payment-list/paymentIndex.vue

property-uniapp-project/manifest.json

@@ -54,17 +54,13 @@
         "setting" : {
             "urlCheck" : false
         },
-        "usingComponents" : true,
-		"requiredPrivateInfos": [
-		    "getLocation", // 定位接口（必填）
-		    "chooseLocation" // 如果用到选择位置也加
-		],
 		"permission": {
-		    "scope.userLocation": {
+		  "scope.camera": {
-		    "desc": "你的位置信息将用于活动地点定位、签到验证等功能"
+		    "desc": "用于扫码"
-			}
 		  }
 		},
+        "usingComponents" : true
+    },
     "mp-alipay" : {
         "usingComponents" : true
     },

property-uniapp-project/pageSubPack/api/apiSub.js

@@ -0,0 +1,90 @@
+import request, {
+	get,
+	post,
+	deleteMethod,
+	putMethod
+} from "./request.js"
+
+
+// =======公告列表========
+export const getResidentNoticeList = (data) => {
+	return get('/api/resident/notice/list', data)
+}
+// 我的房屋列表
+export const getMyHouseList = (data) => {
+	return get('/api/resident/my/house/list', data)
+}
+// 提交房屋注册认证申请
+export const myHouseApply = (data) => {
+	return post('/api/resident/my/house/apply', data)
+}
+// 查询小区列表
+export const getVillageList = (data) => {
+	return get('/api/resident/village/list', data)
+} // 查询楼栋列表
+export const getHouseBuildings = (data) => {
+	return get('/api/resident/house/buildings', data)
+}
+// 查询单元列表
+export const getHouseUnits = (data) => {
+	return get('/api/resident/house/units', data)
+}
+// 查询楼层列表
+export const getHouseFloors = (data) => {
+	return get('/api/resident/house/floors', data)
+}
+// 查询户号列表
+export const getHouseHouses = (data) => {
+	return get('/api/resident/house/houses', data)
+}
+// 房屋绑定手机获取验证码
+export const getHouseAuthSendSmsCode = (data) => {
+	return post('/api/resident/auth/sendSmsCode', data)
+}
+// 房屋详情
+export const getMyHouseDetail = (data) => {
+	return get(`/api/resident/my/house/${data.id}`, data)
+}
+// 删除房屋
+export const deleteMyHouse = (data) => {
+	return deleteMethod(`/api/resident/my/house/${data.id}`, data)
+}
+// 设置默认房屋
+export const setMyHouseDefault = (data) => {
+	return post(`/api/resident/my/house/default`, data)
+}
+// 获取当前用户登录信息
+export const getUserProfile = (data) => {
+	return get(`/api/resident/user/profile`, data)
+}
+// 发送新手机号验证码
+export const getAuthSendSmsCode = (data) => {
+	return post(`/api/resident/auth/sendSmsCode`, data)
+}
+// 更改手机号
+export const getUserChangePhone = (data) => {
+	return post(`/api/resident/user/changePhone`, data)
+}
+// 获取消息通知开关
+export const getUserNotify = (data) => {
+	return get(`/api/resident/user/notify`, data)
+}
+// 更新消息通知开关
+export const changeUserNotify = (data) => {
+	return post(`/api/resident/user/notify`, data)
+} // 修改密码(需登录)
+export const authChangePassword = (data) => {
+	return post(`/api/resident/auth/changePassword`, data)
+} // 退出登录
+export const authLogout = (data) => {
+	return post(`/api/resident/auth/logout`, data)
+}
+// 编辑房屋
+export const upDateMyHouse = (data) => {
+	return putMethod(`/api/resident/my/house/${data.id}`, data)
+}
+
+// 修改身份证照片
+export const uploadFileUploadImage = (data) => {
+	return post(`/api/resident/file/uploadImage`, data)
+}

property-uniapp-project/pageSubPack/api/request.js

@@ -1,15 +1,19 @@
-
 let baseUrl = '';
 if (process.env.NODE_ENV === 'development') {
-	baseUrl = 'http://192.168.1.215:8080'; // 开发环境
+	// http://192.168.1.215
+	// http://192.168.0.224
+	baseUrl = 'http://192.168.0.224:8080'; // 开发环境
 } else {
-	baseUrl = 'http://192.168.1.224:8080'; // 生产环境
+	baseUrl = 'http://192.168.0.224:8080'; // 生产环境
 }
 
 export default function request(url, data = {}, method = "GET") {
 	return new Promise((resolve, reject) => {
 		// 加载中提示（提升用户体验）
-		uni.showLoading({ title: '请求中...', mask: true });
+		uni.showLoading({
+			title: '请求中...',
+			mask: true
+		});
 
 		uni.request({
 			url: baseUrl + url,
@@ -30,7 +34,11 @@ export default function request(url, data = {}, method = "GET") {
 				// 处理HTTP状态码（网络层面）
 				if (res.statusCode !== 200) {
 					const errMsg = `请求失败（${res.statusCode}）`;
-					uni.showToast({ title: errMsg, icon: "none", duration: 2000 });
+					uni.showToast({
+						title: errMsg,
+						icon: "none",
+						duration: 2000
+					});
 					reject(errMsg);
 					return;
 				}
@@ -40,10 +48,16 @@ export default function request(url, data = {}, method = "GET") {
 
 				// 优先处理token过期（401）
 				if (resData.code === 401) {
-					uni.showToast({ title: '登录过期，请重新登录', icon: 'none', duration: 2000 });
+					uni.showToast({
+						title: '登录过期，请重新登录',
+						icon: 'none',
+						duration: 2000
+					});
 					uni.clearStorageSync('token');
 					setTimeout(() => {
-						uni.reLaunch({ url: '/pageSubPack/loginSub/pwd-login' });
+						uni.reLaunch({
+							url: '/pageSubPack/loginSub/pwd-login'
+						});
 					}, 1500);
 					reject('token 过期');
 					return;
@@ -56,20 +70,31 @@ export default function request(url, data = {}, method = "GET") {
 				// 业务失败（code=500）
 				else if (resData.code === 500) {
 					const errMsg = resData.msg || '请求失败';
-					uni.showToast({ title: errMsg, icon: "none", duration: 2000 });
+					uni.showToast({
+						title: errMsg,
+						icon: "none",
+						duration: 2000
+					});
 					// resolve(null)
 					reject(errMsg);
-				}
+				} else {
-				else {
 					const errMsg = resData.msg || '业务异常';
-					uni.showToast({ title: errMsg, icon: "none", duration: 2000 });
+					uni.showToast({
+						title: errMsg,
+						icon: "none",
+						duration: 2000
+					});
 					reject(errMsg);
 				}
 			},
 			fail: (err) => {
 				uni.hideLoading(); // 关闭加载提示
 				const errMsg = err.msg || '网络请求失败';
-				uni.showToast({ title: errMsg, icon: "none", duration: 2000 });
+				uni.showToast({
+					title: errMsg,
+					icon: "none",
+					duration: 2000
+				});
 				reject(err);
 			}
 		});
@@ -77,35 +102,5 @@ export default function request(url, data = {}, method = "GET") {
 }
 export const get = (url, data) => request(url, data, 'GET');
 export const post = (url, data) => request(url, data, 'POST');
-
+export const deleteMethod = (url, data) => request(url, data, 'DELETE');
-// 通用文件上传
+export const putMethod = (url, data) => request(url, data, 'PUT');
-export const upload = (filePath, url) => {
-	return new Promise((resolve, reject) => {
-		uni.uploadFile({
-			url: baseUrl + url,
-			filePath: filePath,
-			name: 'file',
-			header: {
-				"Authorization": "Bearer " + (uni.getStorageSync("token") || ''),
-				"clientid": "resident"
-			},
-			success: (res) => {
-				if (res.statusCode === 200) {
-					const data = JSON.parse(res.data);
-					if (data.code === 200) {
-						resolve(data);
-					} else {
-						reject(data.msg || '上传失败');
-					}
-				} else {
-					reject('上传失败');
-				}
-			},
-			fail: (err) => {
-				reject(err);
-			}
-		});
-	});
-};
-
-

property-uniapp-project/pageSubPack/api/useImageUpload.js

@@ -0,0 +1,173 @@
+// 服务器地址（与 request.js 保持一致）
+const baseUrl = 'http://192.168.0.224:8080';
+
+/**
+ * 图片上传 Hook
+ * 支持 uniapp 和微信小程序
+ * 解决编辑回显后重新上传的问题
+ */
+
+import { ref } from 'vue'
+
+/**
+ * @param {Object} options 配置
+ * @param {string} options.uploadUrl - 上传接口地址
+ * @param {string} options.fileKey - 上传文件的字段名，默认 'file'
+ * @returns {Object}
+ */
+export function useImageUpload(options = {}) {
+	const {
+		uploadUrl = '/api/resident/file/uploadImage',
+		fileKey = 'file'
+	} = options
+
+	// 当前显示的图片（前端展示用，支持 base64/blob URL/网络URL）
+	const previewUrl = ref('')
+	// 服务器返回的 URL（提交时使用）
+	const serverUrl = ref('')
+	// 临时的文件路径（重新上传时用）
+	const tempFilePath = ref(null)
+	// 上传状态
+	const uploading = ref(false)
+
+	/**
+	 * 设置回显图片（编辑时从后端获取）
+	 * @param {string} url - 后端返回的图片URL
+	 */
+	const setPreviewUrl = (url) => {
+		if (url) {
+			previewUrl.value = url
+			serverUrl.value = url
+			tempFilePath.value = null // 重置临时文件，表示没有重新上传
+		}
+	}
+
+	/**
+	 * 选择图片并预览（不上传）
+	 * @returns {Promise<string>} 返回临时文件路径
+	 */
+	const chooseImage = () => {
+		return new Promise((resolve, reject) => {
+			uni.chooseImage({
+				count: 1,
+				sizeType: ['compressed'],
+				sourceType: ['camera', 'album'],
+				success: (res) => {
+					const path = res.tempFilePaths[0]
+					// 设置预览
+					previewUrl.value = path
+					// 记录临时文件路径
+					tempFilePath.value = path
+					// 置空服务器URL，等实际上传后再获取
+					serverUrl.value = ''
+					resolve(path)
+				},
+				fail: (err) => {
+					reject(err)
+				}
+			})
+		})
+	}
+
+	/**
+	 * 上传图片到服务器
+	 * @returns {Promise<string>} 返回服务器上的URL
+	 */
+	const uploadImage = () => {
+		// 如果没有新选择临时文件，直接返回已有的服务器URL
+		if (!tempFilePath.value) {
+			return Promise.resolve(serverUrl.value)
+		}
+
+		// 如果已经有服务器URL且没有重新选择，也直接返回
+		if (serverUrl.value && !tempFilePath.value) {
+			return Promise.resolve(serverUrl.value)
+		}
+
+		uploading.value = true
+
+		return new Promise((resolve, reject) => {
+			uni.uploadFile({
+				url: baseUrl + uploadUrl,
+				filePath: tempFilePath.value,
+				name: fileKey,
+				header: {
+					'Authorization': 'Bearer ' + (uni.getStorageSync('token') || ''),
+					'clientid': 'resident'
+				},
+				success: (res) => {
+					try {
+						const data = JSON.parse(res.data)
+						if (data.code === 200 && data.data) {
+							// 更新服务器URL（确保存的是字符串）
+							const url = typeof data.data === 'string' ? data.data : (data.data?.url || '')
+							serverUrl.value = url
+							// 清空临时文件
+							tempFilePath.value = null
+							resolve(url)
+						} else {
+							uni.showToast({
+								title: data.msg || '上传失败',
+								icon: 'none'
+							})
+							reject(new Error(data.msg || '上传失败'))
+						}
+					} catch (e) {
+						uni.showToast({
+							title: '上传失败',
+							icon: 'none'
+						})
+						reject(e)
+					}
+				},
+				fail: (err) => {
+					uni.showToast({
+						title: err.message || '上传失败',
+						icon: 'none'
+					})
+					reject(err)
+				},
+				complete: () => {
+					uploading.value = false
+				}
+			})
+		})
+	}
+
+	/**
+	 * 获取最终可提交的URL
+	 * 如果有新上传的图片，先上传再返回URL
+	 * 如果没有新上传，直接返回已有的服务器URL
+	 * @returns {Promise<string>}
+	 */
+	const getSubmitUrl = async () => {
+		// 如果重新选择了新图片，先上传
+		if (tempFilePath.value) {
+			return await uploadImage()
+		}
+		// 否则返回已有的服务器URL
+		return serverUrl.value
+	}
+
+	/**
+	 * 重置状态
+	 */
+	const reset = () => {
+		previewUrl.value = ''
+		serverUrl.value = ''
+		tempFilePath.value = null
+		uploading.value = false
+	}
+
+	return {
+		previewUrl,    // 前端展示用
+		serverUrl,     // 提交时使用的URL
+		tempFilePath,  // 临时文件路径
+		uploading,     // 上传中状态
+		setPreviewUrl, // 设置回显图片（编辑时用）
+		chooseImage,   // 选择图片（预览用，不上传）
+		uploadImage,  // 上传到服务器
+		getSubmitUrl, // 获取最终可提交的URL（自动处理上传）
+		reset          // 重置
+	}
+}

property-uniapp-project/pageSubPack/my/addHouse.vue

@@ -73,7 +73,8 @@
 					<!-- 点击这里弹出下拉选择 -->
 					<view class="form-item" @click="showPopup = true">
 						<text class="label">房屋状态</text>
-						<text class="value" :class="{selected:formData.status}">{{ formData.status || '请选择' }}</text>
+						<text class="value"
+							:class="{selected:formData.status}">{{ formData.status.name || '请选择' }}</text>
 						<text class="item-arrow"></text>
 					</view>
 
@@ -86,9 +87,9 @@
 						</view>
 
 						<view class="list">
-							<view :class="{ active: formData.status === item }" class="item"
+							<view :class="{ active: formData.status.id == item.id }" class="item"
-								v-for="(item, index) in statusList" :key="index" @click="selectClick(item)">
+								v-for="(item, index) in statusList" :key="upDataListNum" @click="selectClick(item)">
-								{{ item }}
+								{{ item.name }}
 							</view>
 						</view>
 					</view>
@@ -127,7 +128,8 @@
 
 						<view class="form-item arrow-item" @click="openCardType">
 							<text class="label">证件类型</text>
-							<text class="value" :class="{selected:form.cardType}">{{ form.cardType || '请选择' }}</text>
+							<text class="value"
+								:class="{selected:form.cardType}">{{ form.cardType.name || '请选择' }}</text>
 						</view>
 
 						<view class="form-item">
@@ -137,7 +139,8 @@
 
 						<view class="form-item arrow-item" @click="openRelation">
 							<text class="label">与业主关系</text>
-							<text class="value" :class="{selected:form.relation}">{{ form.relation || '请选择' }}</text>
+							<text class="value"
+								:class="{selected:form.relation}">{{ form.relation.name || '请选择' }}</text>
 						</view>
 
 						<view class="form-item phone-item">
@@ -164,15 +167,15 @@
 								<!-- 身份证人像面 -->
 								<view class="upload-item" @click="chooseIdCard('front')">
 									<!-- 已上传 → 显示图片 -->
-									<image :src="idCardFront?idCardFront:frontSideOfIDcardSrc" class="preview-img"
+									<image :src="idCardFrontUpload.previewUrl || frontSideOfIDcardSrc"
-										mode="aspectFit">
+										class="preview-img" mode="aspectFit">
 									</image>
 
 								</view>
 
 								<!-- 身份证国徽面 -->
 								<view class="upload-item" @click="chooseIdCard('back')">
-									<image :src="idCardBack?idCardBack:backSideOfIDcardSrc" class="preview-img"
+									<image :src="idCardBackUpload.previewUrl || backSideOfIDcardSrc" class="preview-img"
 										mode="aspectFit">
 									</image>
 
@@ -196,14 +199,13 @@
 					<text class="close" @click="showCardType=false">✕</text>
 				</view>
 				<view class="popup-list">
-					<view :class="{ active: form.cardType === item }" class="item" v-for="item in cardTypes" :key="item"
+					<view :class="{ active: form.cardType.id == item.id }" class="item" v-for="item in cardTypes"
-						@click="selectCard(item)">
+						:key="item.id" @click="selectCard(item)">
-						{{item}}
+						{{item.name}}
 					</view>
 				</view>
 			</view>
 
-			<!-- 关系弹窗 -->
 			<view v-if="showRelation" class="mask" @click="showRelation=false"></view>
 			<view v-if="showRelation" class="popup">
 				<view class="popup-header">
@@ -211,9 +213,9 @@
 					<text class="close" @click="showRelation=false">✕</text>
 				</view>
 				<view class="popup-list">
-					<view :class="{ active: form.relation === item }" class="item" v-for="item in relations" :key="item"
+					<view :class="{ active: form.relation.id == item.id }" class="item" v-for="item,index in relations"
-						@click="selectRelation(item)">
+						:key="upDataListNum" @click="selectRelation(item)">
-						{{item}}
+						{{item.name}}
 					</view>
 				</view>
 			</view>
@@ -231,72 +233,38 @@
 
 </template>
 
-<script>
+<!-- myHouseApply -->
-	export default {
+<script setup>
-		onReady: function(e) {},
+	import {
-		components: {
+		ref,
-
+		onMounted,
-		},
+		reactive
-
+	} from 'vue'
-		computed: {
+	import {
-
+		onReachBottom,
-		},
+		onLoad,
-
+		onUnload,
-		created() {
+		onPullDownRefresh
-
+	} from '@dcloudio/uni-app'
-		},
+	import {
-		onShow() {
+		myHouseApply,
-
+		getHouseAuthSendSmsCode,
-		},
+		getMyHouseDetail,
-		onLoad(option) {
+		upDateMyHouse,
-			if (uni.getStorageSync('operationType') == 'update') {
+	} from '/pageSubPack/api/apiSub.js'
-				this.id = option.id;
+	import {
-				this.type = '修改';
+		useImageUpload
-				//根据id获取回显数据
+	} from '/pageSubPack/api/useImageUpload.js'
-				this.formData.community = '北境碧桂园小区';
+	const form = reactive({
-				this.formData.building = '01栋';
+		name: '',
-				this.formData.unit = '01单元';
+		gender: '男',
-				this.formData.floor = '01层';
+		cardType: {},
-				this.formData.houseNumber = '01';
+		cardNo: '',
-				this.formData.communityId = '1';
+		relation: {},
-				this.formData.buildingId = '1';
+		phone: '',
-				this.formData.unitId = '1';
+		code: ''
-				this.formData.floorId = '1';
+	})
-				this.formData.houseNumberId = '1';
+	const formData = reactive({
-				this.formData.status = '租赁';
-				this.formData.isDefault = true;
-				this.form.name = '王芳';
-				this.form.gender = '女';
-				this.form.cardType = '身份证';
-				this.form.cardNo = '370203200000000911';
-				this.form.relation = '本人';
-				this.form.phone = '17711111111';
-				this.form.code = '';
-
-
-			} else if (uni.getStorageSync('operationType') == 'add') {
-				this.id = undefined;
-				this.type = '添加';
-			}
-
-		},
-
-		onUnload() {
-			clearInterval(this.timer)
-		},
-		mounted() {},
-		data() {
-			return {
-				frontSideOfIDcardSrc: 'http://47.104.199.163:9090/images/propertyImgs/frontSideOfIDcard.png',
-				backSideOfIDcardSrc: 'http://47.104.199.163:9090/images/propertyImgs/backSideOfIDcard.png',
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				id: undefined,
-				type: '',
-				currentStep: 0,
-				showPopup: false,
-				statusList: ["自住", "闲置", "租赁", "其他"],
-				formData: {
 		community: uni.getStorageSync('communityName'),
 		building: uni.getStorageSync('buildingName'),
 		unit: uni.getStorageSync('unitName'),
@@ -309,148 +277,505 @@
 		houseNumberId: uni.getStorageSync('houseNumberId'),
 		status: uni.getStorageSync('houseStatus'),
 		isDefault: uni.getStorageSync('houseIsDefault') == true ? true : false, // 开关默认开启
-
+	})
+	const statusList = ref([{
+			id: 0,
+			name: '自住'
 		},
-				form: {
+		{
-					name: '',
+			id: 1,
-					gender: '男',
+			name: '闲置'
-					cardType: '',
-					cardNo: '',
-					relation: '',
-					phone: '',
-					code: ''
 		},
-				cd: 0,
+		{
-				timer: null,
+			id: 2,
-				showCardType: false,
+			name: '租赁'
-				showRelation: false,
+		},
-				cardTypes: ['居民身份证', '护照', '其他'],
+		{
-				relations: ['本人', '配偶', '父母', '子女', '亲属', '租户', '其他'],
+			id: 3,
-				// 身份证图片路径
+			name: '其他'
-				idCardFront: '', // 人像面
-				idCardBack: '' // 国徽面
 		}
+	])
+	const cardTypes = ref([{
+			id: 0,
+			name: '居民身份证'
 		},
+		{
+			id: 1,
+			name: '护照'
+		},
+		{
+			id: 2,
+			name: '其他'
+		}
+	])
 
 
-		methods: {
 
-			chooseIdCard(type) {
+	const relations = ref([{
-				uni.chooseImage({
+			id: 0,
-					count: 1, // 每次只选1张
+			name: '本人'
-					sizeType: ['compressed'], // 压缩
+		},
-					sourceType: ['camera', 'album'], // 相机+相册
+		{
-					success: (res) => {
+			id: 1,
-						const tempPath = res.tempFilePaths[0]
+			name: '配偶'
+		},
+		{
+			id: 2,
+			name: '父母'
+		},
+		{
+			id: 3,
+			name: '子女'
+		},
+		{
+			id: 4,
+			name: '亲属'
+		},
+		{
+			id: 5,
+			name: '租户'
+		},
+		{
+			id: 6,
+			name: '其他'
+		}
+	])
 
-						// 赋值回显
+	const upDataListNum = ref(0)
-						if (type === 'front') {
+	// const idCardFront = ref('')
-							this.idCardFront = tempPath
+	// const idCardBack = ref('')
-						} else {
+	const frontSideOfIDcardSrc = ref('http://47.104.199.163:9090/images/propertyImgs/frontSideOfIDcard.png')
-							this.idCardBack = tempPath
+	const backSideOfIDcardSrc = ref('http://47.104.199.163:9090/images/propertyImgs/backSideOfIDcard.png')
+
+	const houseId = ref(undefined)
+	const type = ref('')
+	const currentStep = ref(0)
+	const showPopup = ref(false)
+	const cd = ref(0)
+	const timer = ref(null)
+	const showCardType = ref(false)
+	const showRelation = ref(false)
+
+	// 身份证正面 - 使用 hook 管理上传
+	const idCardFrontUpload = useImageUpload({
+		uploadUrl: '/api/resident/file/uploadImage'
+	})
+	// 身份证反面 - 使用 hook 管理上传
+	const idCardBackUpload = useImageUpload({
+		uploadUrl: '/api/resident/file/uploadImage'
+	})
+	// ==================== 获取列表数据 ====================
+	const getDetail = async () => {
+
+		try {
+			const res = await getMyHouseDetail({
+				id: houseId.value
+			})
+
+			const data = res
+			console.log(data);
+			if (data.code === 200) {
+				uni.setStorageSync('communityName', data.data.villageName)
+				uni.setStorageSync('buildingName', data.data.buildingName)
+				uni.setStorageSync('unitName', data.data.unitNo)
+				uni.setStorageSync('floorName', data.data.floorNo)
+				uni.setStorageSync('houseNumberName', data.data.houseNo)
+				uni.setStorageSync('communityId', data.data.villageId)
+				uni.setStorageSync('buildingId', data.data.buildingId)
+				uni.setStorageSync('unitId', data.data.unitNo)
+				uni.setStorageSync('floorId', data.data.floorNo)
+				uni.setStorageSync('houseNumberId', data.data.houseId)
+				uni.setStorageSync('houseStatus', data.data.houseStatus)
+				uni.setStorageSync('houseIsDefault', data.data.isDefault)
+				formData.community = uni.getStorageSync('communityName')
+				formData.building = uni.getStorageSync('buildingName')
+				formData.unit = uni.getStorageSync('unitName')
+				formData.floor = uni.getStorageSync('floorName')
+				formData.houseNumber = uni.getStorageSync('houseNumberName')
+				formData.communityId = uni.getStorageSync('communityId')
+				formData.buildingId = uni.getStorageSync('buildingId')
+				formData.unitId = uni.getStorageSync('unitId')
+				formData.floorId = uni.getStorageSync('floorId')
+				formData.houseNumberId = uni.getStorageSync('houseNumberId')
+				formData.status = uni.getStorageSync('houseStatus')
+				formData.isDefault = uni.getStorageSync('houseIsDefault')
+				form.name = data.data.name
+				form.gender = data.data.gender == '0' ? '男' : data.data.gender == '1' ? '女' : ''
+				form.cardNo = data.data.idCard
+				// 房屋状态回显
+				let checkHouseStatus = {}
+				statusList.value.forEach(item => {
+					if (item.id == data.data.houseStatus) {
+						checkHouseStatus = {
+							id: data.data.houseStatus,
+							name: item.name
 						}
 					}
 				})
-			},
+				// 证件类型回显
-			openCardType() {
+				let checkCardType = {}
-				this.showCardType = true
+				cardTypes.value.forEach(item => {
-			},
+					if (item.id == data.data.idCardType) {
-			openRelation() {
+						checkCardType = {
-				this.showRelation = true
+							id: data.data.idCardType,
-			},
+							name: item.name
-			selectCard(v) {
+						}
-				this.form.cardType = v
+					}
-				this.showCardType = false
+				})
-			},
+				// 与户主关系回显
-			selectRelation(v) {
+				let checkRelation = {}
-				this.form.relation = v
+				relations.value.forEach(item => {
-				this.showRelation = false
+					if (item.id == data.data.ownerRelationship) {
-			},
+						checkRelation = {
+							id: data.data.ownerRelationship,
+							name: item.name
+						}
+					}
+				})
+				selectClick(checkHouseStatus)
+				selectCard(checkCardType)
+				selectRelation(checkRelation)
 
-			sendCode() {
+				form.phone = data.data.phone
-				if (!/^1[3-9]\d{9}$/.test(this.form.phone)) {
+				form.code = ''
+				// 使用 hook 设置回显图片
+				idCardFrontUpload.setPreviewUrl(data.data.cardImageFront?.url || data.data.cardImageFront || '')
+				idCardBackUpload.setPreviewUrl(data.data.cardImageBack?.url || data.data.cardImageBack || '')
+			} else {
+				uni.showToast({
+					title: `${res.msg}`,
+					icon: 'error'
+				});
+			}
+		} catch (err) {
+			uni.showToast({
+				title: `${err}`,
+				icon: 'none'
+			})
+		} finally {
+
+		}
+	}
+
+
+	onUnload(() => {
+		clearInterval(timer)
+	})
+	onLoad((option) => {
+		console.log(uni.getStorageSync('updateHouseId'));
+		if (option.id) {
+			if (uni.getStorageSync('operationType') == 'update') {
+				houseId.value = option.id;
+				uni.setStorageSync('updateHouseId', houseId.value)
+				type.value = '修改';
+				getDetail()
+			}
+		} else {
+			if (uni.getStorageSync('operationType') == 'update') {
+				houseId.value = uni.getStorageSync('updateHouseId')
+			} else
+			if (uni.getStorageSync('operationType') == 'add') {
+				houseId.value = undefined;
+				type.value = '添加';
+			}
+		}
+
+	})
+	const chooseIdCard = async (type) => {
+		try {
+			const tempPath = await (type === 'front' ? idCardFrontUpload.chooseImage() : idCardBackUpload
+				.chooseImage())
+			// 已经由 hook 自动处理了 previewUrl 和 tempFilePath
+		} catch (err) {
+			// 用户取消选择，不处理
+		}
+	}
+
+
+
+
+
+
+
+
+	const openCardType = () => {
+		showCardType.value = true
+	}
+	const openRelation = () => {
+		showRelation.value = true
+	}
+	const selectCard = (v) => {
+		form.cardType = v
+		showCardType.value = false
+		upDataListNum.value++
+	}
+	const selectRelation = (v) => {
+		form.relation = v
+		showRelation.value = false
+		upDataListNum.value++
+	}
+	const selectClick = (item) => {
+		formData.status = item;
+		uni.setStorageSync('houseStatus', item)
+		showPopup.value = false;
+		upDataListNum.value++
+	}
+	const sendCode = () => {
+		if (!/^1[3-9]\d{9}$/.test(form.phone)) {
 			return uni.showToast({
 				title: '手机号格式错误',
 				icon: 'none'
 			})
 		}
-				this.cd = 60
+		cd.value = 60
-				this.timer = setInterval(() => {
+		timer.value = setInterval(() => {
-					this.cd--
+			cd.value--
-					if (this.cd <= 0) clearInterval(this.timer)
+			if (cd.value <= 0) clearInterval(timer)
 		}, 1000)
-			},
+
+		let params = {
+			phone: form.phone,
+			scene: "house_bind"
+		}
+		getHouseAuthSendSmsCode(params).then(res => {
+			if (res.code === 200) {
+				uni.showToast({
+					title: `发送成功！`,
+					icon: 'error'
+				});
+			} else {
+				uni.showToast({
+					title: `${res.msg}`,
+					icon: 'error'
+				});
+			}
+		}).catch(err => {
+			uni.showToast({
+				title: err.msg || '发送失败',
+				icon: 'none'
+			});
+		})
+	}
+
+	// 下一步
+	const goNext = () => {
+		console.log(typeof(uni.getStorageSync('communityId')));
+		// 基础校验
+		if (!formData.community) {
+			uni.showToast({
+				title: '请选择小区',
+				icon: 'none'
+			})
+			return
+		}
+		if (!formData.building) {
+			uni.showToast({
+				title: '请选择楼栋',
+				icon: 'none'
+			})
+			return
+		}
+		if (!formData.unit) {
+			uni.showToast({
+				title: '请选择单元',
+				icon: 'none'
+			})
+			return
+		}
+		if (!formData.floor) {
+			uni.showToast({
+				title: '请选择楼层',
+				icon: 'none'
+			})
+			return
+		}
+		if (!formData.houseNumber) {
+			uni.showToast({
+				title: '请选择户号',
+				icon: 'none'
+			})
+			return
+		}
+		if (!formData.status) {
+			uni.showToast({
+				title: '请选择房屋状态',
+				icon: 'none'
+			})
+			return
+		}
+		currentStep.value = 1
+		//跳转
+	}
+
+
 	// 完整校验
-			goSubmit() {
+	const goSubmit = async () => {
-				if (!this.form.name) return uni.showToast({
+		// 1. 前端校验
+		if (!form.name) return uni.showToast({
 			title: '请输入住户姓名',
 			icon: 'none'
 		})
-				if (!this.form.gender) return uni.showToast({
+		if (!form.gender) return uni.showToast({
 			title: '请选择住户性别',
 			icon: 'none'
 		})
-				if (!this.form.cardType) return uni.showToast({
+		if (!form.cardType && form.cardType != 0) return uni.showToast({
 			title: '请选择证件类型',
 			icon: 'none'
 		})
-				if (!this.form.cardNo) return uni.showToast({
+		if (!form.cardNo) return uni.showToast({
 			title: '请输入证件号',
 			icon: 'none'
 		})
-				if (!this.form.relation) return uni.showToast({
+		if (!form.relation && form.relation != 0) return uni.showToast({
 			title: '请选择关系',
 			icon: 'none'
 		})
-				if (!/^1[3-9]\d{9}$/.test(this.form.phone)) return uni.showToast({
+		if (!/^1[3-9]\d{9}$/.test(form.phone)) return uni.showToast({
 			title: '手机号错误',
 			icon: 'none'
 		})
-				if (!this.form.code || this.form.code.length !== 6) return uni.showToast({
+		if (!form.code || form.code.length !== 6) return uni.showToast({
 			title: '请输入6位验证码',
 			icon: 'none'
 		})
-				if (!this.idCardFront) return uni.showToast({
+		if (!idCardFrontUpload.previewUrl) return uni.showToast({
 			title: '请上传身份证人像面',
 			icon: 'none'
 		})
-				if (!this.idCardBack) return uni.showToast({
+		if (!idCardBackUpload.previewUrl) return uni.showToast({
 			title: '请上传身份证国徽面',
 			icon: 'none'
 		})
 
+		// 2. 确认弹窗
+		const modalRes = await new Promise((resolve) => {
 			uni.showModal({
 				title: '确认提交',
 				content: '提交后进入审核',
-					mask: true,
+				success: resolve
-					success: (res) => {
+			})
+		})
+		if (!modalRes.confirm) return
 
+		// 3. 开始提交
 		uni.showLoading({
 			title: '提交中...',
 			mask: true
-						});
+		})
+
+		try {
+			// 4. 获取图片URL
+			let cardImageFrontUrl = ''
+			let cardImageBackUrl = ''
+
+			// 编辑模式
+			if (houseId.value) {
+				// 如果重新选择了图片，需要上传
+				if (idCardFrontUpload.tempFilePath) {
+					cardImageFrontUrl = await idCardFrontUpload.uploadImage()
+				} else {
+					const frontUrl = idCardFrontUpload.serverUrl || idCardFrontUpload.previewUrl
+					cardImageFrontUrl = typeof frontUrl === 'string' ? frontUrl : ''
+				}
+				if (idCardBackUpload.tempFilePath) {
+					cardImageBackUrl = await idCardBackUpload.uploadImage()
+				} else {
+					const backUrl = idCardBackUpload.serverUrl || idCardBackUpload.previewUrl
+					cardImageBackUrl = typeof backUrl === 'string' ? backUrl : ''
+				}
+			} else {
+				// 新增模式：必须上传
+				cardImageFrontUrl = await idCardFrontUpload.uploadImage()
+				cardImageBackUrl = await idCardBackUpload.uploadImage()
+			}
+			console.log(cardImageFrontUrl);
+			// 5. 组装公共参数
+			const params = {
+				villageId: uni.getStorageSync('communityId'),
+				buildingId: uni.getStorageSync('buildingId'),
+				unitNo: uni.getStorageSync('unitId'),
+				floorNo: uni.getStorageSync('floorId'),
+				houseNo: uni.getStorageSync('houseNumberName'),
+				houseId: uni.getStorageSync('houseNumberId'),
+				name: form.name,
+				gender: form.gender == '男' ? '0' : '1',
+				idCardType: form.cardType.id,
+				idCard: form.cardNo,
+				houseStatus: uni.getStorageSync('houseStatus').id,
+				ownerRelationship: form.relation.id,
+				phone: form.phone,
+				smsCode: form.code,
+				isDefault: uni.getStorageSync('houseIsDefault'),
+				cardImageFront: cardImageFrontUrl.url,
+				cardImageBack: cardImageBackUrl.url,
+			}
+
+			// 6. 判断是新增还是修改
+			if (houseId.value) {
+				// 修改
+				params.id = houseId.value
+				await upDateMyHouse(params)
+			} else {
+				// 新增
+				await myHouseApply(params)
+			}
+
+			// 7. 成功
+			uni.hideLoading()
+			uni.showToast({
+				title: '提交成功',
+				icon: 'success'
+			})
 			setTimeout(() => {
+				goBack()
+			}, 1500)
+
+		} catch (err) {
+			// 8. 统一错误处理
+			uni.hideLoading()
+			console.log('提交失败：', err)
+			uni.showToast({
+				title: err.msg || '提交失败',
+				icon: 'none',
+				duration: 2500
+			})
+		}
+	}
+
+	const updateMethod = async (params) => {
+		await upDateMyHouse(params).then(res => {
+			console.log('33333', res)
+			if (res.code === 200) {
+				uni.hideLoading();
 				uni.showToast({
 					title: '提交成功',
 					icon: 'success'
 				});
-						}, 1000);
 				setTimeout(() => {
-							// 提交成功后跳转列表页
+					goBack()
-							uni.hideLoading();
+				}, 1500);
-							this.goBack();
+			} else {
-						}, 2500);
+				uni.showToast({
+					title: `${res.msg}`,
+					icon: 'error'
+				});
 			}
-				})
-			},
 
-			selectClick(item) {
+		}).catch(err => {
-				this.formData.status = item;
+			console.log(err);
-				uni.setStorageSync('houseStatus', item)
+			uni.showToast({
-				this.showPopup = false;
+				title: `${err}`,
-			},
+				icon: 'error'
+			});
+		})
+	}
+
+
+
+
 	// 选择项点击事件（可替换为picker/弹窗选择）
-			selectItem(type) {
+	const selectItem = (type) => {
 		console.log(type);
 		console.log(uni.getStorageSync('checkType'));
 		if (type === '小区') {
@@ -461,7 +786,7 @@
 				complete: () => {}
 			});
 		} else if (type === '楼栋') {
-					if (!this.formData.community) {
+			if (!formData.community) {
 				uni.showToast({
 					title: '请先选择上级',
 					icon: 'none'
@@ -478,7 +803,7 @@
 			}
 
 		} else if (type === '单元') {
-					if (!this.formData.community || !this.formData.building) {
+			if (!formData.community || !formData.building) {
 				uni.showToast({
 					title: '请先选择上级',
 					icon: 'none'
@@ -494,7 +819,7 @@
 				});
 			}
 		} else if (type === '楼层') {
-					if (!this.formData.community || !this.formData.building || !this.formData.unit) {
+			if (!formData.community || !formData.building || !formData.unit) {
 				uni.showToast({
 					title: '请先选择上级',
 					icon: 'none'
@@ -510,7 +835,7 @@
 				});
 			}
 		} else if (type === '户号') {
-					if (!this.formData.community || !this.formData.building || !this.formData.unit || !this.formData
+			if (!formData.community || !formData.building || !formData.unit || !formData
 				.floor) {
 				uni.showToast({
 					title: '请先选择上级',
@@ -527,63 +852,15 @@
 				});
 			}
 		}
-			},
+	}
 
 	// 开关切换
-			onSwitchChange(e) {
+	const onSwitchChange = (e) => {
-				this.formData.isDefault = e.detail.value
+		formData.isDefault = e.detail.value
 		uni.setStorageSync('houseIsDefault', e.detail.value)
-			},
+	}
 
-			// 下一步
+	const goBack = () => {
-			goNext() {
-				// 基础校验
-				if (!this.formData.community) {
-					uni.showToast({
-						title: '请选择小区',
-						icon: 'none'
-					})
-					return
-				}
-				if (!this.formData.building) {
-					uni.showToast({
-						title: '请选择楼栋',
-						icon: 'none'
-					})
-					return
-				}
-				if (!this.formData.unit) {
-					uni.showToast({
-						title: '请选择单元',
-						icon: 'none'
-					})
-					return
-				}
-				if (!this.formData.floor) {
-					uni.showToast({
-						title: '请选择楼层',
-						icon: 'none'
-					})
-					return
-				}
-				if (!this.formData.houseNumber) {
-					uni.showToast({
-						title: '请选择户号',
-						icon: 'none'
-					})
-					return
-				}
-				if (!this.formData.status) {
-					uni.showToast({
-						title: '请选择房屋状态',
-						icon: 'none'
-					})
-					return
-				}
-				this.currentStep = 1
-				//跳转
-			},
-			goBack() {
 		uni.removeStorageSync('communityId');
 		uni.removeStorageSync('communityName');
 		uni.removeStorageSync('buildingId');
@@ -596,18 +873,13 @@
 		uni.removeStorageSync('houseNumberName');
 		uni.removeStorageSync('houseStatus')
 		uni.removeStorageSync('houseIsDefault')
-
+		uni.removeStorageSync('updateHouseId')
 		uni.redirectTo({
 			url: '/pageSubPack/my/myHouseIndex',
 			success: res => {},
 			fail: () => {},
 			complete: () => {}
 		});
-			},
-
-		},
-
-
 	}
 </script>
 <style lang="scss">
@@ -1003,10 +1275,38 @@
 		color: #fff;
 		font-size: 26rpx;
 		padding: 6rpx 30rpx;
-		border: 2rpx solid #efefef;
+		border: none !important;
+		border-radius: 16rpx;
 		/* border-radius: 99px; */
 	}
 
+	.code-btn::after {
+		border: none !important;
+		display: none !important;
+	}
+
+	/* 自己加一层稳定的边框 */
+	.code-btn::before {
+		content: "";
+		position: absolute;
+		left: 0;
+		top: 0;
+		right: 0;
+		bottom: 0;
+		border: 1px solid #ccc !important;
+		/* 边框颜色 */
+		border-radius: 16rpx;
+		box-sizing: border-box;
+		pointer-events: none;
+	}
+
+	/* 禁用状态 */
+	.code-btn[disabled] {
+		opacity: 1 !important;
+		background: #f5f5f5 !important;
+		color: #999 !important;
+	}
+
 	/* 上传区域 */
 	.upload-section {
 		margin-top: 30rpx;

property-uniapp-project/pageSubPack/my/houseDetail.vue

@@ -32,21 +32,23 @@
 				</view>
 				<view class="info-row">
 					<text class="info-label">小区</text>
-					<text class="info-value">{{form.community}}}</text>
+					<text class="info-value">{{form.villageName}}</text>
 				</view>
 				<view class="info-row">
 					<text class="info-label">房间号</text>
-					<text class="info-value">{{form.houseNumber}}</text>
+					<text class="info-value">{{form.houseNo}}</text>
 				</view>
 				<view class="info-row">
 					<text class="info-label">业主</text>
-					<text class="info-value">{{form.owner}}</text>
+					<text class="info-value">{{form.ownerName}}</text>
 				</view>
 				<view class="info-row">
 					<text class="info-label">房间状态</text>
-					<text class="info-value"
+					<text class="info-value" :style="{color: form.status === '0' ? '#00aaff' : form.status === '1' ? 
-						:style="{color: form.status === '自住' ? '#00aaff' : form.status === '闲置' ? 
+					'#FF700A' : form.status === '2' ? '#00aa00' :  form.status === '3' ? '#00557f' : '#999' }">{{
-					'#FF700A' : form.status === '租赁' ? '#00aa00' :  form.status === '其他' ? '#00557f' : '#999' }">{{form.status}}</text>
+						form.status === '0' ? '自住' : form.status === '1' ?
+						'闲置' : form.status === '2' ? '租赁' :  form.status === '3' ? '其他' : ''
+					}}</text>
 				</view>
 
 			</view>
@@ -59,35 +61,42 @@
 				</view>
 				<view class="info-row">
 					<text class="info-label">住户</text>
-					<text class="info-value">{{form.resident}}</text>
+					<text class="info-value">{{form.name}}</text>
 				</view>
 				<view class="info-row">
 					<text class="info-label">房间号</text>
-					<text class="info-value">{{form.gender}}</text>
+					<text class="info-value">{{form.houseNo}}</text>
 				</view>
 				<view class="info-row">
 					<text class="info-label">证件类型</text>
-					<text class="info-value">{{form.documentType}}</text>
+					<text
+						class="info-value">{{form.idCardType=='0'?'居民身份证':form.idCardType=='1'?'护照':form.idCardType=='2'?'其他':''}}</text>
 				</view>
 				<view class="info-row">
 					<text class="info-label">证件号码</text>
-					<text class="info-value">{{form.documentNumber}}</text>
+					<text class="info-value">{{form.idCard}}</text>
 				</view>
 				<view class="info-row">
 					<text class="info-label">与业主关系</text>
-					<text class="info-value">{{form.relationship}}</text>
+					<text
+						class="info-value">{{form.ownerRelationship=='0'?'本人':form.ownerRelationship=='1'?'配偶':form.ownerRelationship=='2'?'父母':form.ownerRelationship=='3'?'子女':form.ownerRelationship=='4'?'亲属':form.ownerRelationship=='5'?'租户':form.ownerRelationship=='6'?'其他':''}}</text>
 				</view>
 				<view class="info-row">
 					<text class="info-label">手机号码</text>
-					<text class="info-value">{{form.phoneNum}}</text>
+					<text class="info-value">{{form.phone}}</text>
 				</view>
 
 				<!-- 身份证照片区 -->
 				<view class="photo-row">
 					<text class="info-label" style="width: 200rpx;">本人身份证照片</text>
 					<view class="photo-list">
-						<view class="photo-item"></view>
+						<view class="photo-item"
-						<view class="photo-item"></view>
+							:style="{backgroundImage: `url(${form.cardImageFront||''})`,backgroundSize: 'cover', backgroundPosition: 'center', backgroundRepeat: 'no-repeat'}">
+						</view>
+						<view class="photo-item"
+							:style="{backgroundImage: `url(${form.cardImageBack||''})`,backgroundSize: 'cover', backgroundPosition: 'center', backgroundRepeat: 'no-repeat'}">
+						</view>
+
 					</view>
 				</view>
 			</view>
@@ -103,64 +112,32 @@
 			</button>
 		</view>
 	</view>
-
-
-
 </template>
 
-<script>
+<script setup>
-	export default {
+	import {
-		onReady: function(e) {},
+		ref,
-		components: {
+		onMounted,
+		computed
+	} from 'vue'
+	import {
+		onReachBottom,
+		onPullDownRefresh,
+		onLoad,
+		onShow
+	} from '@dcloudio/uni-app'
+	import {
+		getMyHouseDetail,
+		deleteMyHouse
+	} from '/pageSubPack/api/apiSub.js'
 
-		},
+	// 响应式数据
-		computed: {
+	const statusBarHeight = ref(20)
-			// 动态计算当前状态配置
+	const id = ref()
-			statusConfig() {
+	const currentStatus = ref('')
-				return this.statusMap[this.currentStatus];
+	const stepList = ref(["房屋信息", "住户信息", "物业审核", "认证成功"])
-			},
+	const form = ref([])
-			// 动态计算当前步骤
+	const statusMap = ref({
-			currentStep() {
-				return this.statusConfig.currentStep;
-			},
-
-		},
-
-		created() {
-
-		},
-		onShow() {
-
-		},
-		onLoad(option) {
-			this.id = option.id;
-			this.currentStatus = option.statusClass;
-
-
-		},
-		mounted() {},
-		data() {
-			return {
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				// 可通过页面传参动态修改状态：success / pending / fail
-				id: undefined,
-				currentStatus: "",
-				stepList: ["房屋信息", "住户信息", "物业审核", "认证成功"],
-				form: {
-					community: '北境碧桂园小区小区',
-					houseNumber: '101栋2单元402',
-					owner: '张三',
-					status: '租赁',
-					resident: '蒋依依',
-					gender: '女',
-					documentType: '身份证',
-					documentNumber: '371100200001010888',
-					relationship: '亲属',
-					phoneNum: '16599999999',
-				},
-				// 状态配置表
-				statusMap: {
 		success: {
 			title: "房屋认证成功",
 			iconClass: "icon-success",
@@ -179,27 +156,59 @@
 			iconText: "✕",
 			currentStep: 3,
 		},
-				},
+	})
 
+	// 计算属性
+	const statusConfig = computed(() => {
+		return statusMap.value[currentStatus.value]
+	})
+	const currentStep = computed(() => {
+		return statusConfig.value.currentStep
+	})
+
+	// 生命周期
+	onLoad((option) => {
+		id.value = option.id
+		currentStatus.value = option.certificationStatus == '0' ? 'pending' : option.certificationStatus == '1' ?
+			'success' : option.certificationStatus == '2' ? 'fail' : ''
+
+	})
+
+	onShow(() => {})
+	onMounted(() => {
+		getDetail()
+	})
+
+	const getDetail = async () => {
+		// 防重复请求
+
+		try {
+			const res = await getMyHouseDetail({
+				id: id.value
+			})
+
+			const data = res.data
+			form.value = data
+			console.log(form.value);
+		} catch (err) {
+			uni.showToast({
+				title: `${err}`,
+				icon: 'none'
+			})
+			console.error('列表接口报错：', err)
+		} finally {
 
 		}
-		},
+	}
-
+	// 方法（函数名完全不变）
-
+	const clickUpdate = () => {
-		methods: {
-			// 修改按钮事件（仅认证失败显示）
-			clickUpdate() {
 		uni.setStorageSync('operationType', 'update')
 		uni.redirectTo({
-					url: '/pageSubPack/my/addHouse?id=' + this.id + '&sourcePage=' + 'addHouse',
+			url: '/pageSubPack/my/addHouse?id=' + id.value + '&sourcePage=addHouse'
-					success: res => {},
+		})
-					fail: () => {},
+	}
-					complete: () => {}
-				});
-			},
 
-			// 删除按钮事件
+	const onDelete = () => {
-			onDelete() {
 		uni.showModal({
 			title: "确认删除",
 			content: "确认删除此房屋信息吗?",
@@ -208,38 +217,44 @@
 					uni.showLoading({
 						title: '删除中...',
 						mask: true
-							});
+					})
-							setTimeout(() => {
+					deleteMyHouse({
+						id: id.value
+					}).then(res => {
+						if (res.code === 200) {
 							uni.showToast({
 								title: '删除成功',
 								icon: 'success'
-								});
+							})
-							}, 1000);
 							setTimeout(() => {
-								// 提交成功后跳转列表页
+								goBack()
-								uni.hideLoading();
+							}, 1000)
-								this.goBack();
+						} else {
-							}, 2500);
+							uni.showToast({
+								title: res.msg,
+								icon: 'error'
+							});
+						}
 
+					}).catch(err => {
+						uni.showToast({
+							title: err,
+							icon: 'error'
+						});
+					})
 
 				}
-					},
+			}
-				});
+		})
-			},
+	}
-			goBack() {
+
+	const goBack = () => {
 		uni.redirectTo({
-					url: '/pageSubPack/my/myHouseIndex',
+			url: '/pageSubPack/my/myHouseIndex'
-					success: res => {},
+		})
-					fail: () => {},
-					complete: () => {}
-				});
-			},
-
-		},
-
-
 	}
 </script>
+
 <style lang="scss">
 	page {
 		background: #fff;
@@ -251,7 +266,6 @@
 		display: flex;
 		flex-direction: column;
 		height: 100vh;
-		/* 关键：占满屏幕高度 */
 		background-color: #f5f7fa;
 	}
 
@@ -262,13 +276,10 @@
 		box-sizing: border-box;
 	}
 
-
-	/* 顶部状态区 */
 	.status-header {
 		display: flex;
 		flex-direction: column;
 		align-items: center;
-
 		padding: 20rpx 0px 20rpx;
 	}
 
@@ -284,17 +295,14 @@
 
 	.icon-success {
 		background-color: #2F77FD;
-		/* border: 4rpx solid #00b42a; */
 	}
 
 	.icon-pending {
 		background-color: #2F77FD;
-		/* border: 4rpx solid #1677ff; */
 	}
 
 	.icon-fail {
 		background-color: #E34D59;
-		/* border: 4rpx solid #f53f3f; */
 	}
 
 	.icon-text {
@@ -322,7 +330,6 @@
 		margin-bottom: 40rpx;
 	}
 
-	/* 步骤条 */
 	.step-bar {
 		display: flex;
 		align-items: center;
@@ -382,7 +389,6 @@
 		background-color: #1677ff;
 	}
 
-	/* 信息卡片 */
 	.info-card {
 		padding: 20rpx;
 		border: 1rpx solid #f0f0f0;
@@ -435,7 +441,6 @@
 		font-weight: 500;
 	}
 
-	/* 身份证照片区 */
 	.photo-row {
 		margin-top: 30rpx;
 		display: flex;
@@ -456,13 +461,10 @@
 		border-radius: 8rpx;
 	}
 
-	/* 底部按钮区 */
 	.bottom-btn-wrap {
 		padding: 20rpx 30rpx 40rpx;
 		display: flex;
 		gap: 20rpx;
-
-		/* background-color: #fff; */
 	}
 
 	.btn-modify {
@@ -491,7 +493,6 @@
 		flex: 1;
 	}
 
-	/* 成功提示弹窗 */
 	.toast-mask {
 		position: fixed;
 		top: 0;

property-uniapp-project/pageSubPack/my/myHouseIndex.vue

@@ -18,10 +18,12 @@
 					<!-- 标题 + 状态 -->
 					<view class="card-header">
 						<view class="title-box">
-							<text class="tag-default" v-if="item.isDefault">默认</text>
+							<text class="tag-default" v-if="item.isDefault==1">默认</text>
-							<text class="house-name">{{ item.houseName }}</text>
+							<text
+								class="house-name">{{ item.villageName+item.buildingName+item.unitNo+'单元'+item.floorNo+'楼' }}</text>
 						</view>
-						<text class="status-tag" :class="item.statusClass">{{ item.statusText }}</text>
+						<text class="status-tag"
+							:class="item.certificationStatus=='0'?'pending':item.certificationStatus=='1'?'success':item.certificationStatus=='2'?'fail':''">{{ item.certificationStatus=='0'?'未认证':item.certificationStatus=='1'?'认证成功':item.certificationStatus=='2'?'认证失败':'' }}</text>
 					</view>
 
 					<!-- 房屋信息 -->
@@ -29,21 +31,22 @@
 						<view class="row">
 							<text class="label">房间号</text>
 							<view class="value-box">
-								<text class="value">{{ item.roomNo }}</text>
+								<text class="value">{{ item.houseNo }}</text>
 							</view>
 						</view>
 						<view class="row">
 							<text class="label">业主</text>
-							<text class="value">{{ item.owner }}</text>
+							<text class="value">{{ item.name }}</text>
 						</view>
 						<view class="row">
 							<text class="label">房屋状态</text>
-							<text class="value">{{ item.houseStatus }}</text>
+							<text
+								class="value">{{ item.houseStatus==0?'自住':item.houseStatus==1?'闲置':item.houseStatus==2?'租赁':item.houseStatus==3?'其他':''}}</text>
 						</view>
-						<view class="defaultBox" v-if="item.statusText=='认证成功'&&!item.isDefault">
+						<view class="defaultBox" v-if="item.certificationStatus=='1'&&!item.isDefault==1">
 							<text class="set-default">设为默认</text>
-							<switch class="no-cross-switch" :checked="item.isDefault" color="#1677ff"
+							<switch class="no-cross-switch" :checked="item.isDefault==1" color="#1677ff"
-								@change="onSwitchChange($event,index)" @click.stop />
+								@change="onSwitchChange($event,item)" @click.stop />
 						</view>
 						<!-- <text v-if="item.showSetDefault" class="set-default"
 							@click="setDefault(item.id)">设为默认</text> -->
@@ -61,122 +64,145 @@
 
 
 </template>
+<script setup>
+	import {
+		ref,
+		onMounted,
 
-<script>
+	} from 'vue'
-	export default {
+	import {
-		onReady: function(e) {},
+		onReachBottom,
-		components: {
+		onPullDownRefresh
-
+	} from '@dcloudio/uni-app'
-		},
+	import {
-
+		getMyHouseList,
-		computed: {
+		setMyHouseDefault
+	} from '/pageSubPack/api/apiSub.js'
 
 
-		},
+	const houseList = ref([])
-		created() {
+	const loadingMore = ref(false)
+	const noMoreData = ref(false)
 
-		},
+	const pageNum = ref(1)
-		onShow() {
+	const pageSize = ref(10)
+	// ==================== 获取列表数据 ====================
+	const getList = async () => {
+		// 防重复请求
 
-		},
+		if (loadingMore.value || noMoreData.value) return
-		onUnload() {
-			// 页面卸载时清除定时器
-			if (this.timer) clearInterval(this.timer)
-		},
-		mounted() {},
-		data() {
-			return {
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				houseList: [{
-						id: 1,
-						houseName: "北境碧桂园小区（别墅）",
-						roomNo: "2号楼2层",
-						owner: "张三",
-						houseStatus: "自住",
-						isDefault: true,
-						statusText: "认证成功",
-						statusClass: "success",
-						showSetDefault: false,
-					},
-					{
-						id: 2,
-						houseName: "北境碧桂园小区（别墅）",
-						roomNo: "3号楼2层",
-						owner: "张三",
-						houseStatus: "自住",
-						isDefault: false,
-						statusText: "认证成功",
-						statusClass: "success",
-						showSetDefault: true,
-					},
-					{
-						id: 3,
-						houseName: "北境碧桂园小区（别墅）",
-						roomNo: "2号楼1层",
-						owner: "张三",
-						houseStatus: "闲置",
-						isDefault: false,
-						statusText: "认证失败",
-						statusClass: "fail",
-						showSetDefault: false,
-					},
-					{
-						id: 4,
-						houseName: "北境碧桂园小区（别墅）",
-						roomNo: "2号楼1层",
-						owner: "张三",
-						houseStatus: "闲置",
-						isDefault: false,
-						statusText: "认证中",
-						statusClass: "pending",
 
-						showSetDefault: false,
+		loadingMore.value = true
-					},
+		try {
-
+			const res = await getMyHouseList({
-				]
+				pageNum: pageNum.value,
+				pageSize: pageSize.value
+			})
 
+			const data = res
+			const newList = data.rows || []
 
+			// 第一页 → 覆盖数据
+			if (pageNum.value === 1) {
+				houseList.value = newList
+			} else {
+				// 后续页 → 追加数据
+				houseList.value = [...houseList.value, ...newList]
 			}
-		},
+			// 判断是否没有更多数据
+			if (newList.length < pageSize.value) {
+				noMoreData.value = true
+			} else {
+				pageNum.value++
+			}
+		} catch (err) {
+			uni.showToast({
+				title: '加载失败',
+				icon: 'none'
+			})
+			console.error('列表接口报错：', err)
+		} finally {
+			loadingMore.value = false
+			uni.stopPullDownRefresh() // 关闭下拉刷新
+		}
+	}
+
+	// ==================== 上拉加载更多（页面生命周期） ====================
+	onReachBottom(() => {
+		getList()
+	})
+
+	// ==================== 下拉刷新 ====================
+	const refresh = () => {
+		// 重置所有状态
+		pageNum = 1
+		pageSize = 10
+		noMoreData = false
+		houseList = []
+		loadingMore = false
+		getList()
+	}
+	onPullDownRefresh(() => {
+		refresh()
+	})
+
+	// 页面加载时请求第一页
+	onMounted(() => {
+		getList()
+	})
 
 
-		methods: {
-			// 开关切换
-			onSwitchChange(e, i) {
 
-				uni.showLoading({
+	const onSwitchChange = async (e, i) => {
-					title: '设置中...',
+		// uni.showLoading({
-					mask: true
+		// 	title: '设置中...',
-				});
+		// 	mask: true
-				setTimeout(() => {
+		// });
+
+		try {
+			const res = await setMyHouseDefault({
+				houseId: i.houseId
+			})
+			const data = res
+			if (data.code === 200) {
+				// uni.hideLoading();
+				loadingMore.value = false
+				noMoreData.value = false
+				getList()
+				uni.setStorageSync('houseIsDefault', e.detail.value)
 				uni.showToast({
 					title: '设置默认房屋成功',
 					icon: 'success'
 				});
-				}, 1000);
-				setTimeout(() => {
-					this.houseList.forEach((item, index) => {
-						if (index != i) {
-							item.isDefault = false
 			} else {
-							this.houseList[i].isDefault = e.detail.value
+				// uni.hideLoading();
-
+				uni.showToast({
+					title: `${res.msg}`,
+					icon: 'error'
+				});
 			}
+		} catch (err) {
+			// uni.hideLoading();
+			uni.showToast({
+				title: `${err}`,
+				icon: 'none'
 			})
-					uni.setStorageSync('houseIsDefault', e.detail.value)
+			console.error('列表接口报错：', err)
-				}, 2500);
+		}
-			},
+	}
-			tapHouse(item) {
+
+
+
+	const tapHouse = (item) => {
 		uni.redirectTo({
-					url: '/pageSubPack/my/houseDetail?id=' + item.id + '&statusClass=' + item.statusClass,
+			url: '/pageSubPack/my/houseDetail?id=' + item.id + '&certificationStatus=' + item.certificationStatus,
 			success: res => {},
 			fail: () => {},
 			complete: () => {}
 		});
-			},
+	}
 
-			addHouse() {
+	const addHouse = () => {
 		uni.setStorageSync('operationType', 'add');
 		uni.redirectTo({
 			url: '/pageSubPack/my/addHouse',
@@ -186,22 +212,18 @@
 		});
 
 
-			},
+	}
 
-			goBack() {
+	const goBack = () => {
 		uni.switchTab({
 			url: '/pages/myIndex/myIndex',
 			success: res => {},
 			fail: () => {},
 			complete: () => {}
 		});
-			},
-
-		},
-
-
 	}
 </script>
+
 <style lang="scss">
 	page {
 		// background: #F3F8FD;
@@ -224,6 +246,7 @@
 		padding: 0px 40rpx;
 		box-sizing: border-box;
 	}
+
 	/* 空状态 */
 	.empty-state {
 		display: flex;
@@ -273,11 +296,16 @@
 		display: flex;
 		align-items: center;
 		gap: 16rpx;
+		width: 100%;
+		overflow-x: hidden;
 	}
 
 	.house-name {
 		font-size: 32rpx;
 		font-weight: 600;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
 	}
 
 	.tag-default {
@@ -286,6 +314,7 @@
 		font-size: 24rpx;
 		padding: 2rpx 16rpx;
 		border-radius: 30rpx;
+		min-width: 48rpx;
 	}
 
 	/* 状态标签 */
@@ -294,6 +323,8 @@
 		padding: 6rpx 14rpx;
 		font-weight: 600;
 		border-radius: 6rpx;
+		min-width: 120rpx;
+		text-align: center;
 	}
 
 	.success {

property-uniapp-project/pageSubPack/my/selectBuilding.vue

@@ -8,13 +8,13 @@
 		<scroll-view class="page" scroll-y>
 			<!-- 楼栋网格列表 -->
 
-			<view class="building-grid">
 			<view v-if="dataList.length === 0" class="empty-state">
 				<uni-icons type="info" size="60" color="#ccc"></uni-icons>
 				<text class="empty-text">
 					{{ '暂无数据'}}
 				</text>
 			</view>
+			<view class="building-grid">
 				<view class="building-item"
 					:class="{ active:(checkType=='楼栋'&& selectedBuilding === item.id)||(checkType=='单元'&& selectedUnit === item.id)||(checkType=='楼层'&&selectedFloor === item.id) ||(checkType=='户号'&&selectedHouseNumber === item.id) }"
 					v-for="(item, index) in dataList" :key="index" @click="selectBuilding(item)">
@@ -29,339 +29,209 @@
 
 </template>
 
-<script>
+<script setup>
-	export default {
+	import {
-		onReady: function(e) {},
+		ref,
-		components: {
+		onMounted,
+	} from 'vue'
+	import {
+		onUnload,
+		onShow
 
-		},
+	} from '@dcloudio/uni-app'
+	import {
+		getHouseBuildings,
+		getHouseUnits,
+		getHouseFloors,
+		getHouseHouses
+	} from '/pageSubPack/api/apiSub.js'
 
-		computed: {
+	// 状态栏高度
+	const statusBarHeight = ref(20)
+
+	// 从缓存获取类型
+	const checkType = ref(uni.getStorageSync('checkType') || '')
+	const dataList = ref([])
 
 
-		},
-		created() {
 
-		},
+	// 选中项（从缓存读取）
-		onShow() {
+	const selectedBuilding = ref(uni.getStorageSync('buildingId') || '')
-
+	const selectedUnit = ref(uni.getStorageSync('unitId') || '')
-		},
+	const selectedFloor = ref(uni.getStorageSync('floorId') || '')
-		onUnload() {},
+	const selectedHouseNumber = ref(uni.getStorageSync('houseNumberId') || '')
-		mounted() {
-
-			if (this.checkType == '楼栋') {
-				this.dataList = this.buildingList
-
-			} else if (this.checkType == '单元') {
-				this.dataList = this.unitList
-
-			} else if (this.checkType == '楼层') {
-				this.dataList = this.floorList
-
-			} else if (this.checkType == '户号') {
-				this.dataList = this.houseNumberList
 
+	// 页面挂载后赋值列表
+	onMounted(() => {
+		console.log(checkType);
+		if (checkType.value === '楼栋') {
+			getList('楼栋')
+		} else if (checkType.value === '单元') {
+			getList('单元')
+		} else if (checkType.value === '楼层') {
+			getList('楼层')
+		} else if (checkType.value === '户号') {
+			getList('户号')
 		}
-		},
-		data() {
-			return {
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				checkType: uni.getStorageSync('checkType'),
-				dataList: [],
-				// 楼栋列表（可动态生成/接口返回）
-				buildingList: [{
-						id: 1,
-						name: '01栋'
-					},
-					{
-						id: 2,
-						name: '02栋'
-					},
-					{
-						id: 3,
-						name: '03栋'
-					},
-					{
-						id: 4,
-						name: '04栋'
-					},
-					{
-						id: 5,
-						name: '05栋'
-					},
-					{
-						id: 6,
-						name: '06栋'
-					},
-					{
-						id: 7,
-						name: '07栋'
-					},
-					{
-						id: 8,
-						name: '08栋'
-					},
-					{
-						id: 9,
-						name: '09栋'
-					},
-					{
-						id: 10,
-						name: '10栋'
-					},
-					{
-						id: 11,
-						name: '11栋'
-					},
-					{
-						id: 12,
-						name: '12栋'
-					}
-				],
 
-				floorList: [{
+	})
-						id: 13,
-						name: '01层'
-					},
-					{
-						id: 14,
-						name: '02层'
-					},
-					{
-						id: 15,
-						name: '03层'
-					},
-					{
-						id: 16,
-						name: '04层'
-					}, {
-						id: 17,
-						name: '05层'
-					},
-					{
-						id: 18,
-						name: '06层'
-					},
-					{
-						id: 19,
-						name: '07层'
-					},
-					{
-						id: 20,
-						name: '08层'
-					}, {
-						id: 21,
-						name: '09层'
-					},
-					{
-						id: 22,
-						name: '10层'
-					},
-					{
-						id: 23,
-						name: '11层'
-					},
-					{
-						id: 24,
-						name: '12层'
-					}, {
-						id: 25,
-						name: '13层'
-					},
-					{
-						id: 26,
-						name: '14层'
-					},
-					{
-						id: 27,
-						name: '15层'
-					},
-					{
-						id: 28,
-						name: '16层'
-					},
-					{
-						id: 29,
-						name: '17层'
-					},
-					{
-						id: 30,
-						name: '18层'
-					},
-					{
-						id: 31,
-						name: '19层'
-					},
-					{
-						id: 32,
-						name: '20层'
-					},
 
-				],
+	// 选择项方法
-
+	const selectBuilding = (item) => {
-				unitList: [{
+		const modalContent = `确认选择此${checkType.value}吗?`
-						id: 33,
-						name: '01单元'
-					},
-					{
-						id: 34,
-						name: '02单元'
-					},
-					{
-						id: 35,
-						name: '03单元'
-					},
-					{
-						id: 36,
-						name: '04单元'
-					},
-
-				],
-				houseNumberList: [{
-						id: 37,
-						name: '01'
-					},
-					{
-						id: 38,
-						name: '02'
-					},
-					{
-						id: 39,
-						name: '03'
-					},
-					{
-						id: 40,
-						name: '04'
-					},
-
-				],
-				// 选中的楼栋
-				selectedBuilding: uni.getStorageSync('buildingId'),
-				// 选中的单元
-				selectedUnit: uni.getStorageSync('unitId'),
-				// 选中的楼层
-				selectedFloor: uni.getStorageSync('floorId'),
-				// 选中的户号
-				selectedHouseNumber: uni.getStorageSync('houseNumberId'),
-
-			}
-		},
-
-
-		methods: {
-			selectBuilding(item) {
-				let modalContent = '确认选择此' + this.checkType + '吗?'
 		uni.showModal({
-					title: "确认选择",
+			title: '确认选择',
 			content: modalContent,
 			success: (res) => {
-						if (res.confirm) {
+				if (!res.confirm) return
 				uni.showLoading({
 					title: '选择中...',
 					mask: true
-							});
+				})
-
+				if (checkType.value === '楼栋') {
-
+					selectedBuilding.value = item.id
-
+					uni.setStorageSync('buildingId', item.id)
-
+					uni.setStorageSync('buildingName', item.name)
-							if (this.checkType == '楼栋') {
+					uni.removeStorageSync('unitId')
-								this.selectedBuilding = item.id
+					uni.removeStorageSync('unitName')
-								uni.setStorageSync('buildingId', item.id);
+					uni.removeStorageSync('floorId')
-								uni.setStorageSync('buildingName', item.name);
+					uni.removeStorageSync('floorName')
-								uni.removeStorageSync('unitId');
+					uni.removeStorageSync('houseNumberId')
-								uni.removeStorageSync('unitName');
+					uni.removeStorageSync('houseNumberName')
-								uni.removeStorageSync('floorId');
+					uni.setStorageSync('checkType', '单元')
-								uni.removeStorageSync('floorName');
+				} else if (checkType.value === '单元') {
-								uni.removeStorageSync('houseNumberId');
+					selectedUnit.value = item.id
-								uni.removeStorageSync('houseNumberName');
+					uni.setStorageSync('unitId', item.id)
-								uni.setStorageSync('checkType', '单元');
+					uni.setStorageSync('unitName', item.name)
-							} else if (this.checkType == '单元') {
+					uni.removeStorageSync('floorId')
-								this.selectedUnit = item.id
+					uni.removeStorageSync('floorName')
-								uni.setStorageSync('unitId', item.id);
+					uni.removeStorageSync('houseNumberId')
-								uni.setStorageSync('unitName', item.name);
+					uni.removeStorageSync('houseNumberName')
-								uni.removeStorageSync('floorId');
+					uni.setStorageSync('checkType', '楼层')
-								uni.removeStorageSync('floorName');
+				} else if (checkType.value === '楼层') {
-								uni.removeStorageSync('houseNumberId');
+					selectedFloor.value = item.id
-								uni.removeStorageSync('houseNumberName');
+					uni.setStorageSync('floorId', item.id)
-								uni.setStorageSync('checkType', '楼层');
+					uni.setStorageSync('floorName', item.name)
-							} else if (this.checkType == '楼层') {
+					uni.removeStorageSync('houseNumberId')
-								this.selectedFloor = item.id
+					uni.removeStorageSync('houseNumberName')
-								uni.setStorageSync('floorId', item.id);
+					uni.setStorageSync('checkType', '户号')
-								uni.setStorageSync('floorName', item.name);
+				} else if (checkType.value === '户号') {
-								uni.removeStorageSync('houseNumberId');
+					selectedHouseNumber.value = item.id
-								uni.removeStorageSync('houseNumberName');
+					uni.setStorageSync('houseNumberId', item.id)
-								uni.setStorageSync('checkType', '户号');
+					uni.setStorageSync('houseNumberName', item.name)
-							} else if (this.checkType == '户号') {
-								this.selectedHouseNumber = item.id
-								uni.setStorageSync('houseNumberId', item.id);
-								uni.setStorageSync('houseNumberName', item.name);
-
 				}
+
 				setTimeout(() => {
 					uni.showToast({
 						title: '选择成功',
 						icon: 'success'
-								});
+					})
-							}, 500);
+				}, 500)
+
 				setTimeout(() => {
-								// 提交成功后跳转列表页
+					uni.hideLoading()
-								uni.hideLoading();
+					goFreash()
-								this.goFreash();
+				}, 2000)
-							}, 2000);
+			}
-
+		})
-
-
 	}
-					},
-				});
 
-			},
+	// 刷新跳转
-			goFreash() {
+	const goFreash = () => {
-				console.log(this.checkType, '刷新页面');
+		console.log(checkType.value, '刷新页面')
-				if (this.checkType != '户号') {
+		if (checkType.value !== '户号') {
 			uni.redirectTo({
-						url: '/pageSubPack/my/selectBuilding',
+				url: '/pageSubPack/my/selectBuilding'
-						success: res => {},
+			})
-						fail: () => {},
-						complete: () => {}
-					});
 		} else {
 			uni.redirectTo({
-						url: '/pageSubPack/my/addHouse',
+				url: '/pageSubPack/my/addHouse'
-						success: res => {},
+			})
-						fail: () => {},
-						complete: () => {}
-					});
 		}
-			},
-			goBackAdd() {
-				if (this.checkType == '楼栋') {
-					uni.removeStorageSync('buildingId');
-					uni.removeStorageSync('buildingName');
-				} else if (this.checkType == '单元') {
-					uni.removeStorageSync('unitId');
-					uni.removeStorageSync('unitName');
-				} else if (this.checkType == '楼层') {
-					uni.removeStorageSync('floorId');
-					uni.removeStorageSync('floorName');
-				} else if (this.checkType == '户号') {
-					uni.removeStorageSync('houseNumberId');
-					uni.removeStorageSync('houseNumberName');
 	}
 
+	// 返回新增
+	const goBackAdd = () => {
+		if (checkType.value === '楼栋') {
+			uni.removeStorageSync('buildingId')
+			uni.removeStorageSync('buildingName')
+		} else if (checkType.value === '单元') {
+			uni.removeStorageSync('unitId')
+			uni.removeStorageSync('unitName')
+		} else if (checkType.value === '楼层') {
+			uni.removeStorageSync('floorId')
+			uni.removeStorageSync('floorName')
+		} else if (checkType.value === '户号') {
+			uni.removeStorageSync('houseNumberId')
+			uni.removeStorageSync('houseNumberName')
+		}
 		uni.redirectTo({
-					url: '/pageSubPack/my/addHouse',
+			url: '/pageSubPack/my/addHouse'
-					success: res => {},
+		})
-					fail: () => {},
+	}
-					complete: () => {}
+	// 获取数据
-				});
+	const getList = async (type) => {
-			},
+		try {
+			if (type == '楼栋') {
+				const res = await getHouseBuildings({
+					villageId: uni.getStorageSync('communityId')
+				})
+				const newList = res.data.map(item => ({
+					id: item.id,
+					name: item.buildingName
+				}))
 
-		},
+				dataList.value = newList
+			} else if (type == '单元') {
+				const res = await getHouseUnits({
+					buildingId: selectedBuilding.value
+				})
+				const newList = res.data.map(item => ({
+					id: item,
+					name: item
+				}))
 
+				dataList.value = newList
+			} else if (type == '楼层') {
+				const res = await getHouseFloors({
+					buildingId: selectedBuilding.value,
+					unitNo: selectedUnit.value
+				})
+				const newList = res.data.map(item => ({
+					id: item,
+					name: item
+				}))
+
+				dataList.value = newList
+			} else if (type == '户号') {
+				const res = await getHouseHouses({
+					buildingId: selectedBuilding.value,
+					unitNo: selectedUnit.value,
+					floorNo: selectedFloor.value
+				})
+				const newList = res.data.map(item => ({
+					id: item.houseId,
+					name: item.houseNo
+				}))
+
+				dataList.value = newList
+			}
+
+		} catch (err) {
+			uni.showToast({
+				title: '加载失败',
+				icon: 'none'
+			})
+			console.error('列表接口报错：', err)
+		} finally {
 
 		}
+	}
+	// 生命周期
+	onShow(() => {
+
+	})
+	onUnload(() => {})
 </script>
 <style lang="scss">
 	page {

property-uniapp-project/pageSubPack/my/selectResidentialCommunity.vue

@@ -22,7 +22,7 @@
 				</view>
 				<view class="community-item" v-for="(item, index) in filteredList" :key="index"
 					@click="selectCommunity(item)">
-					<text class="community-name">{{ item.name }}</text>
+					<text class="community-name">{{ item.villageName }}</text>
 					<text class="item-arrow"></text>
 				</view>
 			</view>
@@ -33,87 +33,80 @@
 
 </template>
 
-<script>
-	export default {
-		onReady: function(e) {},
-		components: {
 
-		},
+<script setup>
-		computed: {
+	import {
-			// 过滤后的列表（搜索功能）
+		ref,
-			filteredList() {
+		onMounted,
-				if (!this.searchKey.trim()) {
+		computed
-					return this.communityList
+	} from 'vue'
+	import {
+		onReachBottom,
+		onPullDownRefresh,
+		onLoad
+	} from '@dcloudio/uni-app'
+	import {
+		getVillageList
+	} from '/pageSubPack/api/apiSub.js'
+
+
+
+	const sourcePage = ref('')
+	const searchKey = ref('')
+	const communityList = ref([])
+	// const refreshing = ref(false)
+	const filteredList = computed(() => {
+		if (!searchKey.value.trim()) {
+			return communityList.value
 		}
-				return this.communityList.filter(item =>
+		return communityList.value.filter(item =>
-					item.name.includes(this.searchKey.trim())
+			item.villageName.includes(searchKey.value.trim())
 		)
-			},
 
-
+	})
-		},
-
-		created() {
-
-		},
-
-		onShow() {
-
-		},
-		onUnload() {
-
-		},
-		onLoad(option) {
-			// addHouse
-			// addParkingSpace
-			this.sourcePage = option.sourcePage;
-
-		},
-		mounted() {},
-		data() {
-			return {
-
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				sourcePage: '',
-				searchKey: '',
-				communityList: [{
-						id: 1,
-						name: '北境碧桂园小区'
-					},
-					{
-						id: 2,
-						name: '东境碧桂园小区'
-					},
-					{
-						id: 3,
-						name: '南境碧桂园小区'
-					},
-					{
-						id: 4,
-						name: '西境碧桂园小区'
-					},
 
 
 
 
-				]
+	onLoad((option) => {
+		sourcePage.value = option.sourcePage;
+		getList()
+	})
 
+	// ==================== 获取列表数据 ====================
+
+
+	const getList = async () => {
+
+
+		try {
+			const res = await getVillageList({
+
+			})
+			console.log(res);
+			const data = res
+			communityList.value = data.data || []
+
+		} catch (err) {
+			uni.showToast({
+				title: '加载失败',
+				icon: 'none'
+			})
+			console.error('列表接口报错：', err)
+		} finally {
 
 		}
-		},
+	}
 
-
-		methods: {
 	// 搜索输入事件
-			onSearch() {
+	const onSearch = () => {
 		// 实时过滤，computed 自动处理
-			},
+	}
 
 	// 选择小区
-			selectCommunity(item) {
+	const selectCommunity = (item) => {
-				uni.setStorageSync('communityId', item.id);
+		uni.setStorageSync('communityId', item.villageId);
-				uni.setStorageSync('communityName', item.name);
+		uni.setStorageSync('communityName', item.villageName);
 		uni.setStorageSync('checkType', '楼栋');
 		uni.removeStorageSync('buildingId');
 		uni.removeStorageSync('buildingName');
@@ -131,14 +124,14 @@
 		uni.removeStorageSync('parkingSpaceId');
 		uni.removeStorageSync('parkingSpaceName');
 
-				if (this.sourcePage == 'addHouse') {
+		if (sourcePage.value == 'addHouse') {
 			uni.redirectTo({
 				url: '/pageSubPack/my/selectBuilding',
 				success: res => {},
 				fail: () => {},
 				complete: () => {}
 			});
-				} else if (this.sourcePage == 'addParkingSpace') {
+		} else if (sourcePage.value == 'addParkingSpace') {
 			uni.redirectTo({
 				url: '/pageSubPack/my/bindHouse',
 				success: res => {},
@@ -149,18 +142,18 @@
 
 		}
 
-			},
+	}
-			goBackAdd() {
+	const goBackAdd = () => {
 		uni.removeStorageSync('communityId');
 		uni.removeStorageSync('communityName');
-				if (this.sourcePage == 'addHouse') {
+		if (sourcePage.value == 'addHouse') {
 			uni.redirectTo({
 				url: '/pageSubPack/my/addHouse',
 				success: res => {},
 				fail: () => {},
 				complete: () => {}
 			});
-				} else if (this.sourcePage == 'addParkingSpace') {
+		} else if (sourcePage.value == 'addParkingSpace') {
 			uni.redirectTo({
 				url: '/pageSubPack/my/addParkingSpace',
 				success: res => {},
@@ -170,10 +163,10 @@
 		} else {
 
 		}
-			},
-		},
 	}
 </script>
+
+
 <style lang="scss">
 	page {
 		background: #f6f6f6;

property-uniapp-project/pageSubPack/my/settingIndex.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="contentStyle" style="">
+	<view class="contentStyle">
 		<view class="status-bar"></view>
 		<uni-nav-bar title="设置" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false">
 		</uni-nav-bar>
@@ -8,7 +8,6 @@
 			<view class="setting-item" v-for="(item, index) in settingList" :key="index" @click="onItemClick(item)">
 				<text class="item-title">{{ item.title }}</text>
 
-				<!-- 不同类型的右侧内容 -->
 				<view class="item-right" v-if="item.type === 'text'">
 					<text :class="item.valueClass || 'item-value'">{{ item.value }}</text>
 					<view class="item-arrow"></view>
@@ -20,46 +19,33 @@
 				<view class="item-arrow" v-else></view>
 			</view>
 		</scroll-view>
-		<!-- 底部下一步按钮 -->
+
 		<view class="bottom-btn">
 			<button class="logout-btn" @click="logout">退出登录</button>
 		</view>
-
-
 	</view>
-
-
-
 </template>
 
-<script>
+<script setup>
-	export default {
+	import {
-		onReady: function(e) {},
+		ref,
-		components: {
+		onMounted,
+		reactive
+	} from 'vue'
+	import {
+		onReachBottom,
+		onLoad,
+		onUnload,
+		onPullDownRefresh
+	} from '@dcloudio/uni-app'
+	import {
+		authLogout
+	} from '/pageSubPack/api/apiSub.js'
 
-		},
+	// 
-
+	const statusBarHeight = ref(20)
-		computed: {
+	const cacheSize = ref(0)
-
+	const settingList = ref([{
-
-		},
-		created() {
-
-		},
-		onShow() {
-
-		},
-		onLoad() {
-
-		},
-		mounted() {},
-		data() {
-			return {
-				message: '',
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				cacheSize: 0,
-				settingList: [{
 			title: '更改手机号码',
 			type: 'arrow'
 		},
@@ -83,34 +69,21 @@
 			value: '当前版本 2.9.8',
 			valueClass: 'item-version'
 		}
-				]
+	])
 
-
+	// 
-			}
+	const onItemClick = (item) => {
-		},
-
-
-		methods: {
-			onItemClick(item) {
-				// console.log('点击了：', item.title,item.title == '更改手机号码')
 		if (item.title == '更改手机号码') {
 			uni.redirectTo({
-						url: '/pageSubPack/my/changePhone',
+				url: '/pageSubPack/my/changePhone'
-						success: res => {},
-						fail: () => {},
-						complete: () => {}
 			});
 		} else if (item.title == '修改密码') {
 			uni.redirectTo({
-						url: '/pageSubPack/my/changePwd',
+				url: '/pageSubPack/my/changePwd'
-						success: res => {},
-						fail: () => {},
-						complete: () => {}
 			});
 		} else if (item.title == '清除缓存') {
 			uni.clearStorageSync();
-					this.message = '清除成功'
+			settingList.value[3].value = '0M'
-					this.settingList[3].value = '0M'
 			uni.showLoading({
 				title: '清除中...',
 				mask: true
@@ -122,149 +95,135 @@
 				});
 			}, 1000);
 			setTimeout(() => {
-						// 提交成功后跳转列表页
 				uni.hideLoading();
-
 			}, 2500);
-
-
 		}
-			},
+	}
-			logout() {
+
+	const logout = () => {
 		uni.showModal({
 			title: '提示',
 			content: '确定要退出当前账号吗?',
 			success: (res) => {
 				if (res.confirm) {
-							this.message = '退出成功'
 					uni.showLoading({
 						title: '退出中...',
 						mask: true
 					});
-							setTimeout(() => {
+					authLogout().then(res => {
+						if (res.code === 200) {
+							uni.hideLoading();
 							uni.showToast({
 								title: '退出成功',
 								icon: 'success'
 							});
-							}, 1000);
 							setTimeout(() => {
-								// 登出成功后跳转回登录页
 								uni.hideLoading();
-
 								uni.redirectTo({
-									url: '/pageSubPack/loginSub/pwd-login',
+									url: '/pageSubPack/loginSub/pwd-login'
-									success: res => {},
-									fail: () => {},
-									complete: () => {}
 								});
+							}, 1500);
+						} else {
+							uni.showToast({
+								title: `${res.msg}`,
+								icon: 'error'
+							});
+						}
 
-							}, 2500);
+					}).catch(err => {
+						console.log(err);
+						uni.showToast({
+							title: `${err}`,
+							icon: 'error'
+						});
+					})
 
 				}
 			}
 		})
+	}
 
-			},
+	const onSwitchChange = (item, e) => {
-			onSwitchChange(item, e) {
 		item.checked = e.detail.value
-			},
+	}
-			goBack() {
+
+	const goBack = () => {
 		uni.switchTab({
-					url: '/pages/myIndex/myIndex',
+			url: '/pages/myIndex/myIndex'
-					success: res => {},
-					fail: () => {},
-					complete: () => {}
 		});
-			},
-
-		},
-
-
 	}
 </script>
+
 <style lang="scss">
 	page {
 		background: #f9f9f9;
 	}
 </style>
+
 <style lang="scss" scoped>
 	.contentStyle {
 		display: flex;
 		flex-direction: column;
 		height: 100vh;
-		/* 关键：占满屏幕高度 */
 		background-color: #f9f9f9;
 	}
 
 	.page {
 		flex: 1;
 		overflow-y: auto;
-		padding: 0px 40rpx;
+		padding: 0 40rpx;
 		box-sizing: border-box;
 		background-color: #fff;
 	}
 
-	/* 底部按钮 */
 	.bottom-btn {
 		padding: 20rpx 30rpx 40rpx;
 		background-color: #fff;
 	}
 </style>
+
 <style scoped>
-	/* 列表项 */
 	.setting-item {
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
-		background-color: #ffffff;
+		background-color: #fff;
-		padding: 30rpx 30rpx;
+		padding: 30rpx;
 		border-bottom: 2rpx solid #f0f0f0;
 	}
 
-	/* 标题文字 */
 	.item-title {
 		font-size: 32rpx;
-		color: #333333;
+		color: #333;
 		line-height: 1.4;
 	}
 
-	/* 右侧区域（文字+箭头） */
 	.item-right {
 		display: flex;
 		align-items: center;
 		gap: 10rpx;
 	}
 
-	/* 右侧数值/版本文字 */
 	.item-value {
 		font-size: 28rpx;
-		color: #333333;
+		color: #333;
 	}
 
 	.item-version {
 		font-size: 28rpx;
-		color: #999999;
+		color: #999;
 	}
 
-	/* 右侧箭头 */
 	.item-arrow {
-		display: inline-block;
 		width: 10rpx;
 		height: 10rpx;
 		border-top: 2rpx solid #999;
 		border-right: 2rpx solid #999;
 		transform: rotate(45deg);
 		margin-left: 10rpx;
-		margin-right: 10rpx;
 	}
 
-	/* 开关样式适配 */
-	/* switch {
-		transform: scale(0.8);
-	} */
-	/* 底部按钮 */
 	.logout-btn {
-
 		width: 100%;
 		height: 96rpx;
 		line-height: 96rpx;
@@ -273,31 +232,27 @@
 		border-radius: 12rpx;
 		color: #666;
 		background-color: #F3F3F3;
-
 		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
 	}
 
-	/* 按钮点击态 */
 	.logout-btn:active {
 		background-color: #f5f5f5;
 		opacity: 0.8;
 	}
 
-
 	.status-bar {
 		width: 100vw;
 		height: 46px;
 	}
 </style>
+
 <style>
 	::v-deep .uni-switch-input:before {
 		background-color: #cccccd !important;
 	}
 
-	/* 隐藏 switch 关闭状态的 × 号 */
 	.no-cross-switch::before {
 		display: none !important;
-
 	}
 
 	.no-cross-switch {

property-uniapp-project/pageSubPack/payment-list/addHydropower.vue

@@ -1,522 +0,0 @@
-<template>
-	<view class="contentStyle" style="">
-		<view class="status-bar"></view>
-		<uni-nav-bar :title="'新增'+paymentType+'缴费'" left-icon="left" @clickLeft="goBack" backgroundColor="transparent"
-			:border="false">
-		</uni-nav-bar>
-		<!-- 表单区域 -->
-		<scroll-view class="page" scroll-y="true">
-			<view class="card-box">
-				<!-- 头部水费标题+水滴图标 -->
-				<view class="card-header">
-					<image class="iconStyle"
-						:src="paymentType=='水'?'http://47.104.199.163:9090/images/propertyImgs/water.png':'http://47.104.199.163:9090/images/propertyImgs/electric.png'">
-					</image>
-					<text class="card-title">{{paymentType+'费'}}</text>
-				</view>
-				<!-- 分割线 -->
-				<view class="line"></view>
-				<view class="input-item">
-					<view class="input-label">缴费单位</view>
-					<text class="company-name">XXXXXXXX有限公司</text>
-				</view>
-				<!-- 分割线 -->
-				<view class="line"></view>
-				<!-- 设备号输入项 -->
-				<view class="input-item">
-					<view class="input-label">缴费设备号</view>
-					<view class="input-wrap">
-						<!-- 输入框 -->
-						<input class="input" placeholder="请输入设备号" placeholder-class="input-placeholder"
-							v-model="deviceNo" />
-						<!-- 右边扫码图标 text标签直接用 双端不乱码 -->
-						<image class="scanTheCodeIconStyle"
-							src="http://47.104.199.163:9090/images/propertyImgs/scanTheCodeIcon.png" @click="scanCode">
-						</image>
-					</view>
-				</view>
-
-				<!-- 底部分割线 -->
-				<view class="line"></view>
-			</view>
-
-
-			<!-- 底部协议和提交按钮 -->
-			<view class="bottom-area">
-				<!-- <view class="agreement">
-					<checkbox-group @change="handleAgreeChange">
-						<checkbox :checked="isAgree" />
-					</checkbox-group>
-					<text class="agreement-text">我已阅并同意</text>
-					<text class="agreement-link" @click="handleProtocol">《协议链接》</text>
-				</view> -->
-
-
-				<button class="submit-btn" @click="goPay">
-					提交
-				</button>
-			</view>
-
-
-
-
-
-
-
-
-		</scroll-view>
-
-
-	</view>
-
-
-
-</template>
-
-<script setup>
-	import {
-		ref,
-		onMounted,
-		computed
-
-	} from 'vue'
-	import {
-		onShow,
-		onReady,
-		onReachBottom,
-		onLoad,
-		onUnload,
-		onPullDownRefresh
-	} from '@dcloudio/uni-app'
-
-	// 响应式数据
-	const paymentType = ref(uni.getStorageSync('addPaymentType'))
-	const deviceNo = ref('')
-	const isAgree = ref(false)
-	const scanResult = ref('')
-
-	// 生命周期
-	onMounted(() => {})
-
-	// 协议勾选
-	const handleAgreeChange = (e) => {
-		isAgree.value = e.detail.value.length > 0
-	}
-
-	// 扫码
-	const scanCode = async () => {
-		try {
-			uni.showLoading({
-				title: '扫码中...',
-				mask: true
-			})
-
-			const res = await uni.scanCode({
-				onlyFromCamera: false,
-				scanType: ['qrCode', 'barCode']
-			})
-
-			// 扫码成功，赋值
-			deviceNo.value = res.result
-			scanResult.value = res.result
-			uni.hideLoading()
-			uni.showToast({
-				title: '扫码成功',
-				icon: 'success'
-			})
-		} catch (err) {
-			uni.hideLoading()
-			console.log('扫码失败', err)
-			uni.showToast({
-				title: '扫码取消/失败',
-				icon: 'none'
-			})
-		}
-	}
-
-	// 提交缴费
-	const goPay = () => {
-		if (!deviceNo.value) {
-			uni.showToast({
-				title: '请输入设备号',
-				icon: 'none'
-			})
-			return
-		}
-		// if (!isAgree.value) {
-		// 	uni.showToast({
-		// 		title: '请同意协议',
-		// 		icon: 'none'
-		// 	})
-		// 	return
-		// }
-
-		uni.showModal({
-			title: '确认提交',
-			content: '确认要提交吗?',
-			success: (res) => {
-				if (res.confirm) {
-					uni.showLoading({
-						title: '提交中...',
-						mask: true
-					})
-
-					setTimeout(() => {
-						uni.showToast({
-							title: '提交成功',
-							icon: 'success'
-						})
-					}, 1000)
-
-					setTimeout(() => {
-						uni.hideLoading()
-						goNext()
-					}, 2500)
-				}
-			}
-		})
-	}
-	const handleProtocol = () => {
-
-	}
-	// 跳转成功页
-	const goNext = () => {
-		uni.redirectTo({
-			url: '/pageSubPack/payment-list/addPaymentSuccess'
-		})
-	}
-
-	// 返回
-	const goBack = () => {
-		uni.redirectTo({
-			url: '/pageSubPack/payment-list/paymentIndex'
-		})
-	}
-</script>
-<style lang="scss">
-	page {
-		background: #f2f1f6;
-	}
-</style>
-
-<style scoped>
-	.contentStyle {
-		display: flex;
-		flex-direction: column;
-		height: 100vh;
-		/* 关键：占满屏幕高度 */
-		background-color: #f9f9f9;
-	}
-
-	.page {
-		flex: 1;
-		overflow-y: auto;
-		padding: 0px 40rpx;
-		box-sizing: border-box;
-	}
-
-
-	/* 白色卡片容器 */
-	.card-box {
-		background: #ffffff;
-		border-radius: 24rpx;
-		padding: 32rpx;
-	}
-
-	/* 头部水费标题 */
-	.card-header {
-		display: flex;
-		align-items: center;
-		gap: 16rpx;
-		margin-bottom: 32rpx;
-	}
-
-	.iconStyle {
-		width: 88rpx;
-		height: 88rpx;
-	}
-
-	.scanTheCodeIconStyle {
-		width: 48rpx;
-		height: 48rpx;
-		padding-left: 20rpx;
-	}
-
-	.water-icon {
-		font-size: 32rpx;
-	}
-
-	.card-title {
-		font-size: 32rpx;
-		color: #333;
-		font-weight: 500;
-	}
-
-	/* 分割线 */
-	.line {
-		width: 100%;
-		height: 1rpx;
-		background: #eeeeee;
-	}
-
-	/* 输入项整体 */
-	.input-item {
-		padding: 32rpx 0;
-	}
-
-	.input-label {
-		font-size: 28rpx;
-		color: #333;
-		margin-bottom: 24rpx;
-	}
-
-	/* 输入框+扫码图标横向布局 */
-	.input-wrap {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-	}
-
-	.input {
-		flex: 1;
-		font-size: 32rpx;
-		color: #333;
-	}
-
-	/* 占位符样式 */
-	.input-placeholder {
-		color: #cccccc;
-	}
-
-
-
-	/* 底部协议+按钮区域 */
-	.bottom-area {
-		margin-top: 60rpx;
-		padding: 0 10rpx;
-	}
-
-	/* 协议勾选 */
-	.agree-item {
-		display: flex;
-		align-items: center;
-		gap: 16rpx;
-		margin-bottom: 40rpx;
-	}
-
-	.radio-box {
-		width: 36rpx;
-		height: 36rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.radio-icon {
-		font-size: 32rpx;
-		color: #999;
-	}
-
-	.agree-text {
-		font-size: 28rpx;
-		color: #666;
-	}
-
-	.agree-link {
-		font-size: 28rpx;
-		color: #007aff;
-	}
-
-	/* 立即缴费按钮 */
-	.pay-btn {
-		width: 100%;
-		height: 96rpx;
-		background: #007aff;
-		border-radius: 16rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.pay-text {
-		font-size: 36rpx;
-		color: #ffffff;
-	}
-
-	/* 白色卡片容器 */
-	.card-box {
-		background: #ffffff;
-		border-radius: 24rpx;
-		padding: 32rpx;
-	}
-
-	/* 头部水费标题 */
-	.card-header {
-		display: flex;
-		align-items: center;
-		gap: 16rpx;
-		margin-bottom: 32rpx;
-	}
-
-	.water-icon {
-		font-size: 48rpx;
-	}
-
-	.card-title {
-		font-size: 36rpx;
-		color: #333;
-		font-weight: 500;
-	}
-
-	/* 分割线 */
-	.line {
-		width: 100%;
-		height: 1rpx;
-		background: #eeeeee;
-	}
-
-	/* 输入项整体 */
-	.input-item {
-		padding: 32rpx 0;
-	}
-
-	.input-label {
-		font-size: 32rpx;
-		color: #333;
-		margin-bottom: 24rpx;
-	}
-
-	/* 输入框+扫码图标横向布局 */
-	.input-wrap {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-	}
-
-	.input {
-		flex: 1;
-		font-size: 32rpx;
-		color: #333;
-	}
-
-	/* 占位符样式 */
-	.input-placeholder {
-		color: #cccccc;
-	}
-
-	/* 右边扫码图标 text标签直接用 双端不乱码 */
-	.scan-icon {
-		font-size: 40rpx;
-		color: #999;
-		padding-left: 20rpx;
-	}
-
-	/* 底部协议+按钮区域 */
-	.bottom-area {
-		margin-top: 60rpx;
-		padding: 0 10rpx;
-	}
-
-	/* 协议勾选 */
-	.agree-item {
-		display: flex;
-		align-items: center;
-		gap: 16rpx;
-		margin-bottom: 40rpx;
-	}
-
-	.radio-box {
-		width: 36rpx;
-		height: 36rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.radio-icon {
-		font-size: 32rpx;
-		color: #999;
-	}
-
-	.agree-text {
-		font-size: 28rpx;
-		color: #666;
-	}
-
-	.agree-link {
-		font-size: 28rpx;
-		color: #007aff;
-	}
-
-	/* 立即缴费按钮 */
-	.pay-btn {
-		width: 100%;
-		height: 96rpx;
-		background: #007aff;
-		border-radius: 16rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.pay-text {
-		font-size: 36rpx;
-		color: #ffffff;
-	}
-
-	.status-bar {
-		width: 100vw;
-		height: 46px;
-	}
-
-	/* 底部区域 */
-	.bottom-area {
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		right: 0;
-		padding: 30rpx;
-		box-sizing: border-box;
-	}
-
-	.agreement {
-		display: flex;
-		align-items: center;
-		margin-bottom: 20rpx;
-	}
-
-	.agreement checkbox {
-		transform: scale(0.8);
-		margin-right: 10rpx;
-	}
-
-	.agreement-text {
-		font-size: 24rpx;
-		color: #333;
-	}
-
-	.agreement-link {
-		font-size: 28rpx;
-		color: #4080ff;
-		margin-left: 10rpx;
-	}
-
-	.submit-btn {
-		width: 100%;
-		height: 90rpx;
-		line-height: 90rpx;
-		background-color: #4080ff;
-		color: #fff;
-		border-radius: 10rpx;
-		font-size: 36rpx;
-		font-weight: 500;
-		border: none;
-		outline: none;
-	}
-
-	.submit-btn[disabled] {
-		background-color: #a0c4ff;
-		color: #fff;
-		opacity: 0.7;
-	}
-</style>

property-uniapp-project/pageSubPack/payment-list/addPayment.vue

@@ -87,75 +87,64 @@
 
  </template>
 
- <script>
+ <script setup>
- 	export default {
+ 	import {
- 		onReady: function(e) {},
+ 		ref,
- 		components: {
+ 		onMounted,
+ 		computed
 
- 		},
+ 	} from 'vue'
-
+ 	import {
- 		computed: {
+ 		onShow,
-
+ 		onReady,
- 			style() {
+ 		onReachBottom,
- 				var statusBarHeight = this.statusBarHeight;
+ 		onLoad,
- 				return statusBarHeight;
+ 		onUnload,
- 			},
+ 		onPullDownRefresh
-
+ 	} from '@dcloudio/uni-app'
-
+ 	// 响应式数据
- 		},
+ 	const statusBarHeight = ref(20)
- 		created() {
+ 	const paymentType = ref(uni.getStorageSync('addPaymentType'))
- 			let statusBarObj = this.getPhoneInfo()
+ 	const userNo = ref('')
- 			this.statusBarHeight = statusBarObj.statusBarHeight
+ 	const isAgree = ref(false)
- 		},
+ 	const showPopup = ref(false)
- 		onShow() {
-
- 		},
-
- 		mounted() {},
-
- 		onReady() {
- 			this.$nextTick(() => {
 
+ 	// 生命周期
+ 	onShow(() => {})
+ 	onMounted(() => {})
+ 	onReady(() => {
+ 		// nextTick 用法
+ 		// nextTick(() => {})
  	})
- 		},
+
- 		data() {
+ 	// 勾选协议
- 			return {
+ 	const handleAgreeChange = (e) => {
- 				/* 设定状态栏默认高度 */
+ 		isAgree.value = e.detail.value.length > 0
- 				statusBarHeight: 20,
- 				paymentType: uni.getStorageSync('addPaymentType'),
- 				userNo: '',
- 				isAgree: false,
- 				showPopup: false, // 控制弹窗显示
  	}
- 		},
 
- 		methods: {
+ 	// 协议链接点击
- 			handleAgreeChange(e) {
+ 	const handleProtocol = () => {
- 				// e.detail.value 是数组，有值 = 选中，空 = 未选中
+ 		uni.navigateTo({})
- 				this.isAgree = e.detail.value.length > 0
+ 	}
- 			},
- 			// 处理协议链接点击
- 			handleProtocol() {
- 				uni.navigateTo({
 
- 				})
+ 	// 提交
- 			},
+ 	const handleSubmit = () => {
- 			// 处理提交
+ 		if (!userNo.value) {
- 			handleSubmit() {
- 				if (!this.userNo) {
  			uni.showToast({
  				title: '请输入户号',
  				icon: 'none'
  			})
  			return
  		}
- 				if (!this.isAgree) {
+
+ 		if (!isAgree.value) {
  			uni.showToast({
  				title: '请先同意协议',
  				icon: 'none'
  			})
  			return
  		}
+
  		uni.showModal({
  			title: '确认提交',
  			content: '确认要提交吗?',
@@ -164,53 +153,43 @@
  					uni.showLoading({
  						title: '提交中...',
  						mask: true
- 							});
+ 					})
+
  					setTimeout(() => {
  						uni.showToast({
  							title: '提交成功',
  							icon: 'success'
- 								});
+ 						})
- 							}, 1000);
+ 					}, 1000)
+
  					setTimeout(() => {
- 								// 提交成功后跳转列表页
+ 						uni.hideLoading()
- 								uni.hideLoading();
+ 						goNext()
- 								this.goNext()
+ 					}, 2500)
- 							}, 2500);
-
-
  				}
  			}
  		})
+ 	}
 
- 			},
+ 	// 跳转成功页
- 			goNext() {
+ 	const goNext = () => {
  		uni.redirectTo({
- 					url: '/pageSubPack/payment-list/addPaymentSuccess',
+ 			url: '/pageSubPack/payment-list/addPaymentSuccess'
- 					success: res => {},
+ 		})
- 					fail: () => {},
+ 	}
- 					complete: () => {}
+
- 				});
+ 	// 切换（注释保留）
- 			},
+ 	const goToChange = () => {
- 			goToChange() {
  		// uni.redirectTo({
- 				// 	url: '/pageSubPack/payment-list/selectPaymentEntity',
+ 		//   url: '/pageSubPack/payment-list/selectPaymentEntity'
- 				// 	success: res => {},
+ 		// })
- 				// 	fail: () => {},
+ 	}
- 				// 	complete: () => {}
+
- 				// });
+ 	// 返回
- 			},
+ 	const goBack = () => {
- 			goBack() {
  		uni.redirectTo({
- 					url: '/pageSubPack/payment-list/paymentIndex',
+ 			url: '/pageSubPack/payment-list/paymentIndex'
- 					success: res => {},
+ 		})
- 					fail: () => {},
- 					complete: () => {}
- 				});
- 			},
-
- 		},
-
-
  	}
  </script>
  <style lang="scss">

property-uniapp-project/pageSubPack/payment-list/addPaymentSuccess.vue

@@ -5,10 +5,8 @@
 			:border="false">
 		</uni-nav-bar>
 
-
 		<!-- 表单区域 -->
 		<scroll-view class="page" scroll-y="true">
-
 			<view class="container">
 				<!-- 成功图标 -->
 				<view class="success-icon">
@@ -29,69 +27,43 @@
 					<button class="btn-back" @click="goBack">返回生活缴费</button>
 				</view>
 			</view>
-
 		</scroll-view>
 	</view>
-
-
-
 </template>
 
-<script>
+<script setup>
-	export default {
+	import {
-		onReady: function(e) {},
+		ref,
-		components: {
+		onMounted,
+		computed
 
-		},
+	} from 'vue'
+	import {
+		onShow,
+		onReady,
+		onReachBottom,
+		onLoad,
+		onUnload,
+		onPullDownRefresh
+	} from '@dcloudio/uni-app'
 
-		computed: {
+	// 响应式数据
+	const statusBarHeight = ref(20)
+	const paymentType = ref(uni.getStorageSync('addPaymentType'))
 
+	// 生命周期
+	onShow(() => {})
+	onMounted(() => {})
+	onReady(() => {})
 
-
+	// 方法
-
+	const goBack = () => {
-		},
-		created() {
-			 
-		},
-		onShow() {
-
-		},
-
-		mounted() {},
-
-		onReady() {
-			this.$nextTick(() => {
-
-			})
-		},
-		data() {
-			return {
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				paymentType: uni.getStorageSync('addPaymentType'),
-
-
-
-			}
-		},
-
-
-		methods: {
-
-			goBack() {
 		uni.redirectTo({
-					url: '/pageSubPack/payment-list/paymentIndex',
+			url: '/pageSubPack/payment-list/paymentIndex'
-					success: res => {},
+		})
-					fail: () => {},
-					complete: () => {}
-				});
-			},
-
-		},
-
-
 	}
 </script>
+
 <style lang="scss">
 	page {
 		background: #f9f9f9;
@@ -103,7 +75,6 @@
 		display: flex;
 		flex-direction: column;
 		height: 100vh;
-		/* 关键：占满屏幕高度 */
 		background-color: #f9f9f9;
 	}
 
@@ -112,10 +83,9 @@
 		overflow-y: auto;
 		padding: 0px 40rpx;
 		box-sizing: border-box;
-		
-		/* background-color: #fff; */
 	}
 </style>
+
 <style scoped>
 	/* 全局容器 */
 	.container {
@@ -183,7 +153,9 @@
 	/* 按钮默认样式重置（解决uni-app button默认样式问题） */
 	.btn-back::after {
 		border: none;
-	}.status-bar{
+	}
+
+	.status-bar {
 		width: 100vw;
 		height: 46px;
 	}

property-uniapp-project/pageSubPack/payment-list/arrearsPayment.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="contentStyle" style="">
 		<view class="status-bar"></view>
-		<uni-nav-bar :title="arrearsPayment" left-icon="left" @clickLeft="goBack" backgroundColor="transparent"
+		<uni-nav-bar :title="arrearsPayment.value" left-icon="left" @clickLeft="goBack" backgroundColor="transparent"
 			:border="false">
 		</uni-nav-bar>
 
@@ -21,32 +21,9 @@
 					<view style="border-bottom: 2rpx solid #ededed;margin:10rpx 0rpx;"></view>
 					<!-- 缴费信息 -->
 					<view class="info-section" style="">
-						<view v-if="arrearsPayment=='物业费'">
+
-							<view class="info-item">
+						<view>
-								<text class="info-label">户名</text>
+
-								<text class="info-value">桂花园（别墅）2号楼2层</text>
-							</view>
-							<view class="info-item">
-								<text class="info-label">户主</text>
-								<text class="info-value">周大声</text>
-							</view>
-							<view class="info-item">
-								<text class="info-label">缴费单位</text>
-								<text class="info-value">CT物业</text>
-							</view>
-							<view class="info-item">
-								<text class="info-label">可用余额</text>
-								<text class="info-value">0.00</text>
-							</view>
-							<!-- <view class="info-payAmountItem">
-								<text class="info-payAmount">{{'￥'+payAmount}}</text>
-							</view> -->
-						</view>
-						<view v-else>
-							<view class="info-item" v-if="arrearsPayment=='暖气费'">
-								<text class="info-label">房屋</text>
-								<text class="info-value">桂花园（别墅）2号楼2层</text>
-							</view>
 							<view class="info-item">
 								<text class="info-label">户号</text>
 								<text class="info-value">101123456</text>
@@ -68,10 +45,13 @@
 								</input>
 							</view>
 							<view style="border-bottom: 2rpx solid #ededed;margin:10rpx 0rpx;"></view>
-							<view class="arrears-row">
+							<view class="arrears-row" v-if="outstandingPayment==true">
 								<text class="arrears-text">当前欠费金额¥{{ arrearsAmount }}元</text>
 								<text class="auto-fill-btn" @click="handleAutoFill">点击自动填入</text>
 							</view>
+							<view class="arrears-row" v-if="outstandingPayment==false">
+								<text class="arrears-text">暂未查询到欠费</text>
+							</view>
 						</view>
 					</view>
 
@@ -102,22 +82,14 @@
 						<view class="pay-way">
 							<text class="way-label">支付方式</text>
 							<view class="way-content">
-								<image class="bank-icon" src="http://47.104.199.163:9090/images/propertyImgs/bank-logo.png" mode="aspectFit">
+								<image class="bank-icon"
+									src="http://47.104.199.163:9090/images/propertyImgs/bank-logo.png" mode="aspectFit">
 								</image>
 								<text class="bank-name">建设银行储蓄卡(8888)</text>
 								<text class="arrow-icon">></text>
 							</view>
 						</view>
 
-						<!-- 银行卡选择列表 -->
-						<!-- <view v-if="showBankList" class="bank-list">
-							<view v-for="(item, index) in bankList" :key="index" class="bank-item"
-								@click="selectBank(item)">
-								<image class="bank-item-icon" :src="item.icon" mode="aspectFit"></image>
-								<text class="bank-item-name">{{ item.name }}</text>
-								<text v-if="selectedBank.id === item.id" class="check-icon">&#xe60c;</text>
-							</view>
-						</view> -->
 
 						<!-- 密码输入框 -->
 						<view class="password-input">
@@ -189,158 +161,198 @@
 
 </template>
 
-<script>
+<script setup>
-	export default {
+	import {
-		onReady: function(e) {},
+		ref
-		components: {
+	} from 'vue'
 
-		},
+	// 响应式数据
+	const statusBarHeight = ref(20)
+	const outstandingPayment = ref(true)
+	const arrearsPayment = ref(uni.getStorageSync('arrearsPayment'))
+	const currentStep = ref(1)
+	const payAmount = ref('1680.00')
+	const password = ref('')
+	const showBankList = ref(false)
+	const arrearsAmount = ref('21.21')
+	const payNum = ref('')
 
-		computed: {
-
-
-
-
-		},
-		created() {
-
-		},
-		onShow() {
-
-		},
-
-		mounted() {},
-
-		onReady() {
-			this.$nextTick(() => {
-
-			})
-		},
-		data() {
-			return {
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				outstandingPayment: true, //是否欠费
-				arrearsPayment: uni.getStorageSync('arrearsPayment'),
-				currentStep: 1, // 1: 详情页 2: 密码弹窗 3: 成功页
-				payAmount: "1680.00", // 缴费金额
-				password: "", // 输入的密码
-				showBankList: false, // 是否显示银行卡列表
-				arrearsAmount: "21.21",
-				payNum: '',
 	// 银行卡列表
-				bankList: [{
+	const bankList = ref([{
 			id: 1,
-						name: "建设银行储蓄卡(8888)",
+			name: '建设银行储蓄卡(8888)',
-						icon: "/static/bank-logo.png"
+			icon: '/static/bank-logo.png'
 		},
 		{
 			id: 2,
-						name: "工商银行储蓄卡(6666)",
+			name: '工商银行储蓄卡(6666)',
-						icon: "/static/icbc-logo.png"
+			icon: '/static/icbc-logo.png'
 		},
 		{
 			id: 3,
-						name: "招商银行储蓄卡(9999)",
+			name: '招商银行储蓄卡(9999)',
-						icon: "/static/cmb-logo.png"
+			icon: '/static/cmb-logo.png'
 		}
-				],
+	])
+
 	// 默认选中的银行卡
-				selectedBank: {
+	const selectedBank = ref({
 		id: 1,
-					name: "建设银行储蓄卡(8888)",
+		name: '建设银行储蓄卡(8888)',
-					icon: "/static/bank-logo.png"
+		icon: '/static/bank-logo.png'
-				}
+	})
-			}
-		},
 
-
+	// 自动填充欠费金额
-		methods: {
+	const handleAutoFill = () => {
-			handleAutoFill() {
+		payNum.value = arrearsAmount.value
-				this.payNum = this.arrearsAmount;
 		uni.vibrateShort({
-					type: "light"
+			type: 'light'
-				});
+		})
-			},
-			goBack() {
-				uni.redirectTo({
-					url: '/pageSubPack/payment-list/paymentIndex',
-					success: res => {},
-					fail: () => {},
-					complete: () => {}
-				});
-			},
-			// 点击立即缴费
-			handlePay() {
-				if (!this.payAmount || Number(this.payAmount) <= 0) {
-					uni.showToast({
-						title: "请输入正确的缴费金额",
-						icon: "none"
-					});
-					return;
 	}
-				this.currentStep = 2;
-			},
 
-			// 关闭密码弹窗
+	// 返回
-			closePasswordModal() {
+	const goBack = () => {
-				this.currentStep = 1;
+		uni.redirectTo({
-				this.password = "";
+			url: '/pageSubPack/payment-list/paymentIndex'
-				this.showBankList = false;
+		})
+	}
+
+	// 立即缴费
+	const handlePay = () => {
+		if (!payAmount.value || Number(payAmount.value) <= 0) {
+			uni.showToast({
+				title: '请输入正确的缴费金额',
+				icon: 'none'
+			})
+			return
+		}
+		requestPayOrder()
+		// 原支付注释
+		// currentStep.value = 2
+	}
+	// 统一下单后后端返回的支付参数
+	const payInfo = ref({
+		appId: '', // 公众号/小程序ID
+		timeStamp: '', // 时间戳
+		nonceStr: '', // 随机串
+		package: '', // 数据包 如 prepay_id=xxx
+		signType: 'MD5', // 签名方式
+		paySign: '' // 签名
+	})
+
+	// 1. 先请求后端接口生成预支付订单
+	const requestPayOrder = async () => {
+		try {
+			uni.showLoading({
+				title: '发起支付中'
+			})
+
+			const res = await getMyHouseList({
+				deviceNo: '设备号',
+				money: 0.01, // 金额
+				openid: '用户openid'
+			})
+
+
+			uni.hideLoading()
+
+			// 后端返回支付所需参数
+			const data = res.data
+			if (data.code !== 0) {
+				uni.showToast({
+					title: data.msg || '下单失败',
+					icon: 'none'
+				})
+				return
+			}
+
+			// 赋值支付参数
+			payInfo.value = {
+				appId: data.appId,
+				timeStamp: data.timeStamp,
+				nonceStr: data.nonceStr,
+				package: data.package,
+				signType: data.signType,
+				paySign: data.paySign
+			}
+
+			// 2. 调起微信支付
+			wx.requestPayment({
+				...payInfo.value,
+				success(res) {
+					console.log('支付成功', res)
+					uni.showToast({
+						title: '支付成功'
+					})
+					currentStep.value == 3
 				},
+				fail(err) {
+					console.log('支付失败', err)
+					uni.showToast({
+						title: '支付取消或失败',
+						icon: 'none'
+					})
+				}
+			})
+
+		} catch (err) {
+			uni.hideLoading()
+			console.log('请求异常', err)
+			uni.showToast({
+				title: '支付请求异常',
+				icon: 'none'
+			})
+		}
+	}
+	// 关闭密码弹窗
+	const closePasswordModal = () => {
+		currentStep.value = 1
+		password.value = ''
+		showBankList.value = false
+	}
 
 	// 选择银行卡
-			selectBank(item) {
+	const selectBank = (item) => {
-				this.selectedBank = item;
+		selectedBank.value = item
-				this.showBankList = false;
+		showBankList.value = false
-			},
+	}
 
 	// 输入密码
-			inputPassword(num) {
+	const inputPassword = (num) => {
-				if (this.password.length >= 6) return;
+		if (password.value.length >= 6) return
-				this.password += num.toString();
+		password.value += num.toString()
 
-				// 密码满6位，自动提交
+		// 满6位自动提交
-				if (this.password.length === 6) {
+		if (password.value.length === 6) {
-					this.handleConfirmPay();
+			handleConfirmPay()
+		}
 	}
-			},
 
 	// 删除密码
-			deletePassword() {
+	const deletePassword = () => {
-				this.password = this.password.slice(0, -1);
+		password.value = password.value.slice(0, -1)
-			},
-
-			// 确认支付
-			handleConfirmPay() {
-				// 这里模拟支付请求，实际项目中调用后端接口
-				uni.showLoading({
-					title: "支付中...",
-					mask: true
-				});
-
-				setTimeout(() => {
-					uni.hideLoading();
-					// 支付成功，跳转到成功页
-					this.currentStep = 3;
-					this.password = "";
-					this.showBankList = false;
-				}, 1500);
-			},
-
-			// 返回生活缴费列表
-			handleBackToList() {
-				uni.redirectTo({
-					url: '/pageSubPack/payment-list/paymentIndex',
-					success: res => {},
-					fail: () => {},
-					complete: () => {}
-				});
 	}
 
-		},
+	// 确认支付（模拟）
+	const handleConfirmPay = () => {
+		uni.showLoading({
+			title: '支付中...',
+			mask: true
+		})
 
+		setTimeout(() => {
+			uni.hideLoading()
+			currentStep.value = 3
+			password.value = ''
+			showBankList.value = false
+		}, 1500)
+	}
 
+	// 返回缴费列表
+	const handleBackToList = () => {
+		uni.redirectTo({
+			url: '/pageSubPack/payment-list/paymentIndex'
+		})
 	}
 </script>
 <style lang="scss">

property-uniapp-project/pageSubPack/payment-list/noArrearsPayment.vue

@@ -5,14 +5,11 @@
 			:border="false">
 		</uni-nav-bar>
 
-
 		<!-- 表单区域 -->
 		<scroll-view class="page" scroll-y="true">
-
 			<view class="container">
 				<!-- 1. 物业费详情页 -->
 				<view class="pay-page">
-
 					<!-- 未欠费 -->
 					<view class="amount-section">
 						<image src="http://47.104.199.163:9090/images/propertyImgs/noArrears.png" class="background-image-style"></image>
@@ -22,7 +19,6 @@
 							<text class="lineStyle">{{'|'}}</text>
 							<text>{{'缴费金额：'+lastPayNum+'元'}}</text>
 						</view>
-
 					</view>
 
 					<!-- 缴费信息 -->
@@ -44,7 +40,6 @@
 								<text class="info-label">可用余额</text>
 								<text class="info-value">0.00</text>
 							</view>
-
 						</view>
 						<view v-else>
 							<view class="info-item" v-if="arrearsPayment=='暖气费'">
@@ -63,153 +58,58 @@
 								<text class="info-label">缴费单位</text>
 								<text class="info-value">HN热力有限公司</text>
 							</view>
-
 						</view>
 					</view>
-
-
 				</view>
-
 			</view>
-
-
-
-
-
-
-
 		</scroll-view>
 	</view>
-
-
-
 </template>
 
-<script>
+<script setup>
-	export default {
+import {
-		onReady: function(e) {},
+		ref,
-		components: {
+		onMounted,
+		computed
 
-		},
+	} from 'vue'
+	import {
+		onShow,
+		onReady,
+		onReachBottom,
+		onLoad,
+		onUnload,
+		onPullDownRefresh
+	} from '@dcloudio/uni-app'
 
-		computed: {
+// 响应式数据
+const lastPayTime = ref('2022-11-29')
+const lastPayNum = ref('2022.00')
+const statusBarHeight = ref(20)
+const arrearsPayment = ref(uni.getStorageSync('arrearsPayment'))
 
+// 生命周期
+onShow(() => {})
+onMounted(() => {})
+onReady(() => {})
 
-
+// 方法
-
+const goBack = () => {
-		},
+	uni.redirectTo({
-		created() {
+		url: '/pageSubPack/payment-list/paymentIndex'
-
-		},
-		onShow() {
-
-		},
-
-		mounted() {},
-
-		onReady() {
-			this.$nextTick(() => {
-
 	})
-		},
-		data() {
-			return {
-				lastPayTime: '2022-11-29',
-				lastPayNum: '2022.00',
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				arrearsPayment: uni.getStorageSync('arrearsPayment'),
-
-
-
-
-			}
-		},
-
-
-		methods: {
-
-			goBack() {
-				uni.redirectTo({
-					url: '/pageSubPack/payment-list/paymentIndex',
-					success: res => {},
-					fail: () => {},
-					complete: () => {}
-				});
-			},
-			// 点击立即缴费
-			handlePay() {
-				if (!this.payAmount || Number(this.payAmount) <= 0) {
-					uni.showToast({
-						title: "请输入正确的缴费金额",
-						icon: "none"
-					});
-					return;
-				}
-				this.currentStep = 2;
-			},
-
-			// 关闭密码弹窗
-			closePasswordModal() {
-				this.currentStep = 1;
-				this.password = "";
-				this.showBankList = false;
-			},
-
-			// 选择银行卡
-			selectBank(item) {
-				this.selectedBank = item;
-				this.showBankList = false;
-			},
-
-			// 输入密码
-			inputPassword(num) {
-				if (this.password.length >= 6) return;
-				this.password += num.toString();
-
-				// 密码满6位，自动提交
-				if (this.password.length === 6) {
-					this.handleConfirmPay();
-				}
-			},
-
-			// 删除密码
-			deletePassword() {
-				this.password = this.password.slice(0, -1);
-			},
-
-			// 确认支付
-			handleConfirmPay() {
-				// 这里模拟支付请求，实际项目中调用后端接口
-				uni.showLoading({
-					title: "支付中...",
-					mask: true
-				});
-
-				setTimeout(() => {
-					uni.hideLoading();
-					// 支付成功，跳转到成功页
-					this.currentStep = 3;
-					this.password = "";
-					this.showBankList = false;
-				}, 1500);
-			},
-
-			// 返回生活缴费列表
-			handleBackToList() {
-				uni.redirectTo({
-					url: '/pageSubPack/payment-list/paymentIndex',
-					success: res => {},
-					fail: () => {},
-					complete: () => {}
-				});
 }
 
-		},
+// 以下为原代码保留的方法（未使用但保持功能完整）
-
+const handlePay = () => {}
-
+const closePasswordModal = () => {}
-	}
+const selectBank = () => {}
+const inputPassword = () => {}
+const deletePassword = () => {}
+const handleConfirmPay = () => {}
+const handleBackToList = () => {}
 </script>
+
 <style lang="scss">
 	page {
 		background: #f9f9f9;
@@ -221,7 +121,6 @@
 		display: flex;
 		flex-direction: column;
 		height: 100vh;
-		/* 关键：占满屏幕高度 */
 		background-color: #f9f9f9;
 	}
 
@@ -232,8 +131,6 @@
 		box-sizing: border-box;
 	}
 
-
-	/* 1. 物业费详情页 */
 	.pay-page {
 		width: 100%;
 	}
@@ -245,11 +142,9 @@
 		flex-direction: column;
 		align-items: center;
 		color: #999999;
-
 	}
 
 	.background-image-style {
-
 		width: 466rpx;
 		height: 250rpx;
 		margin-bottom: 140rpx;
@@ -268,11 +163,8 @@
 		font-weight: 600;
 	}
 
-	.info-section {}
-
 	.lineStyle {
 		margin: 0rpx 30rpx;
-
 	}
 
 	.info-item {
@@ -302,7 +194,6 @@
 		font-size: 50rpx;
 		color: #333;
 		font-weight: 600;
-
 	}
 
 	.input-section {
@@ -334,7 +225,6 @@
 		outline: none;
 	}
 
-	/* 2. 支付密码弹窗 */
 	.modal-overlay {
 		position: fixed;
 		top: 0;
@@ -434,7 +324,6 @@
 		color: #999;
 	}
 
-	/* 银行卡列表 */
 	.bank-list {
 		padding: 0 30rpx;
 		border-bottom: 2rpx solid #f0f0f0;
@@ -468,7 +357,6 @@
 		color: #007aff;
 	}
 
-	/* 密码输入框 */
 	.password-input {
 		display: flex;
 		justify-content: space-between;
@@ -478,7 +366,6 @@
 	.password-item {
 		width: 100rpx;
 		height: 100rpx;
-		/* border: 2rpx solid #dcdcdc; */
 		background-color: #efefef;
 		border-radius: 8rpx;
 		display: flex;
@@ -493,7 +380,6 @@
 		border-radius: 50%;
 	}
 
-	/* 数字键盘 */
 	.keyboard {
 		width: 100%;
 	}
@@ -527,7 +413,6 @@
 		border: none;
 	}
 
-	/* 3. 缴费成功页 */
 	.success-page {
 		width: 100%;
 		min-height: 100vh;
@@ -544,7 +429,6 @@
 	}
 
 	.success-icon {
-		/* margin-top: 120rpx; */
 		margin-bottom: 40rpx;
 		width: 100px;
 		height: 100px;
@@ -553,12 +437,8 @@
 		background-color: #007aff;
 		color: #fff;
 		border-radius: 50%;
-
-
 	}
 
-	.success-icon .iconfont {}
-
 	.success-text {
 		font-size: 40rpx;
 		font-weight: 600;

property-uniapp-project/pageSubPack/payment-list/paymentIndex.vue

@@ -1,453 +0,0 @@
-<template>
-	<view class="contentStyle" style="">
-		<view class="status-bar"></view>
-
-		<uni-nav-bar title="生活缴费" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false">
-		</uni-nav-bar>
-		<view class="topbox">
-			<image class="titleImg" src="http://47.104.199.163:9090/images/propertyImgs/payTitle.png"></image>
-			<image class="payImg" src="http://47.104.199.163:9090/images/propertyImgs/payImg.png"></image>
-		</view>
-		<scroll-view class="page" scroll-y="true">
-			<view class="container">
-				<!-- 已缴费/欠费列表 -->
-				<view class="bill-list">
-					<view v-if="paymentList.length === 0" class="empty-state">
-						<uni-icons type="info" size="60" color="#ccc"></uni-icons>
-						<text class="empty-text">
-							{{ '暂无数据'}}
-						</text>
-					</view>
-					<view class="bill-item" @click="goToBill(item)" v-for="item,index in paymentList" :key="index">
-						<image class="billIcon" :src="item.icon"></image>
-						<view class="bill-info">
-							<view class="bill-title">{{item.name}}
-								<view class="bill-status debt" v-if="item.status=='已欠费'">已欠费</view>
-							</view>
-							<view class="bill-desc">{{item.address}}</view>
-						</view>
-
-						<view class="arrow"></view>
-					</view>
-
-
-				</view>
-
-				<!-- 新增缴费区域 -->
-				<view class="add-section">
-					<view class="section-header">
-						<text class="section-title">新增缴费</text>
-						<text class="record-link" @click="goToRecord">缴费记录</text>
-					</view>
-
-					<view class="grid-list">
-
-						<view class="grid-item" v-for="(item, index) in addList" :key="index" @click="goToAdd(item)">
-							<view class="icon-box" :class="item.iconClass">
-								<image class="iconStyle" :src="item.icon"></image>
-							</view>
-							<text class="item-name">{{ item.name +'费'}}</text>
-						</view>
-					</view>
-				</view>
-				<view style="width: 100%;height: 30rpx;"></view>
-			</view>
-		</scroll-view>
-
-	</view>
-
-
-
-</template>
-
-<script>
-	export default {
-		onReady: function(e) {
-			// console.log('onReady')
-		},
-		components: {
-
-
-		},
-		computed: {
-
-
-		},
-		created() {
-
-		},
-		onShow() {
-
-
-		},
-		onLoad() {
-
-		},
-		mounted() {},
-		data() {
-			return {
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				paymentList: [{
-						id: 1,
-						name: '物业费',
-						status: '已欠费',
-						address: '桂花园（别墅）2号楼2层',
-						icon: "http://47.104.199.163:9090/images/propertyImgs/property.png",
-
-					},
-					{
-						id: 2,
-						// name: '暖气费',
-						name: '物业费',
-
-						status: '',
-						address: '山东省日照市东港区桂花园（别墅）2号楼2层',
-						icon: "http://47.104.199.163:9090/images/propertyImgs/heating.png",
-
-					},
-					{
-						id: 3,
-						// name: '电费',
-						name: '物业费',
-						status: '已欠费',
-						address: '山东省日照市东港区桂花园（别墅）2号楼2层',
-						icon: "http://47.104.199.163:9090/images/propertyImgs/electric.png",
-
-					}
-				],
-				// 新增缴费列表数据
-				addList: [{
-						// name: "燃气",
-						name: '物业',
-						type: "gas",
-						icon: "http://47.104.199.163:9090/images/propertyImgs/gas.png",
-						iconClass: "gas"
-					},
-					{
-						// name: "水",
-						name: '物业',
-						type: "water",
-						icon: "http://47.104.199.163:9090/images/propertyImgs/water.png",
-						iconClass: "water"
-					},
-					{
-						// name: "物业",
-						name: '物业',
-						type: "property",
-						icon: "http://47.104.199.163:9090/images/propertyImgs/property.png",
-						iconClass: "property"
-					},
-					{
-						// name: "电",
-						name: '物业',
-						type: "electric",
-						icon: "http://47.104.199.163:9090/images/propertyImgs/electric.png",
-						iconClass: "electric"
-					},
-					{
-						// name: "暖气",
-						name: '物业',
-						type: "heating",
-						icon: "http://47.104.199.163:9090/images/propertyImgs/heating.png",
-						iconClass: "heating"
-					},
-					{
-						// name: "车位",
-						name: '物业',
-						type: "parking",
-						icon: "http://47.104.199.163:9090/images/propertyImgs/parkingIcon.png",
-						iconClass: "parking"
-					}
-				]
-
-			}
-		},
-
-
-		methods: {
-			// 跳转到缴费
-			goToBill(item) {
-				uni.setStorageSync('arrearsPayment', item.name)
-				if (item.status == '已欠费') {
-					uni.redirectTo({
-						url: '/pageSubPack/payment-list/arrearsPayment',
-						success: res => {},
-						fail: () => {},
-						complete: () => {}
-					});
-				} else {
-					uni.redirectTo({
-						url: '/pageSubPack/payment-list/noArrearsPayment',
-						success: res => {},
-						fail: () => {},
-						complete: () => {}
-					});
-				}
-			},
-			// 跳转到缴费记录
-			goToRecord() {
-				uni.redirectTo({
-					url: '/pageSubPack/payment-list/paymentRecord',
-					success: res => {},
-					fail: () => {},
-					complete: () => {}
-				});
-			},
-			// 跳转到新增缴费
-			goToAdd(type) {
-				// else if (type.name == '水' || type.name == '电')
-				if (type.name == '燃气' || type.name == '暖气') {
-					uni.redirectTo({
-						url: '/pageSubPack/payment-list/selectPaymentEntity',
-						success: res => {},
-						fail: () => {},
-						complete: () => {}
-					});
-				} else if (type.name == '物业' || type.name == '物业') {
-					uni.redirectTo({
-						url: '/pageSubPack/payment-list/addHydropower',
-						success: res => {},
-						fail: () => {},
-						complete: () => {}
-					});
-				}
-				uni.setStorageSync('addPaymentType', type.name)
-
-			},
-			goBack() {
-				console.log(uni.getStorageSync('sourcePage'));
-				if (uni.getStorageSync('sourcePage') == 'serviceIndex') {
-					uni.switchTab({
-						url: '/pages/serviceIndex/serviceIndex',
-						success: res => {},
-						fail: () => {},
-						complete: () => {}
-					});
-				} else if (uni.getStorageSync('sourcePage') == 'index') {
-					uni.switchTab({
-						url: '/pages/index/index',
-						success: res => {},
-						fail: () => {},
-						complete: () => {}
-					});
-				}
-				uni.removeStorageSync('sourcePage');
-
-
-
-			},
-		},
-
-
-	}
-</script>
-<style lang="scss">
-	page {
-		background: linear-gradient(180deg, #dfedfd, #F6FAFF);
-	}
-</style>
-
-<style scoped>
-	.contentStyle {
-		display: flex;
-		flex-direction: column;
-		height: 100vh;
-		/* 关键：占满屏幕高度 */
-		background: linear-gradient(180deg, #dfedfd, #F6FAFF);
-	}
-
-	.page {
-		flex: 1;
-		overflow-y: auto;
-		padding: 0px 40rpx;
-		box-sizing: border-box;
-		/* background-color: #fff; */
-	}
-
-	.topbox {
-		height: 150rpx;
-		width: 100%;
-		position: relative;
-	}
-
-	.titleImg {
-		width: 262rpx;
-		height: 74rpx;
-		position: absolute;
-		left: 40rpx;
-		bottom: 20rpx;
-	}
-
-	.payImg {
-		width: 349.97rpx;
-		height: 313.57rpx;
-		position: absolute;
-		right: -80rpx;
-		bottom: -140rpx;
-	}
-
-	.container {
-		/* padding:30rpx; */
-	}
-
-	/* ===================== 欠费列表 ===================== */
-	.bill-list {
-		margin-bottom: 40rpx;
-		background-color: #fff;
-		padding: 30rpx;
-		border-radius: 10rpx;
-	}
-
-	/* 空状态 */
-	.empty-state {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		padding: 100rpx 0;
-		color: #ccc;
-	}
-
-	.empty-text {
-		font-size: 32rpx;
-		color: #999;
-		margin-top: 20rpx;
-		margin-bottom: 10rpx;
-	}
-
-	.bill-item {
-		display: flex;
-		align-items: center;
-		background-color: #F6F9FE;
-		border-radius: 12rpx;
-		padding: 20rpx 20rpx 20rpx 0px;
-		margin-bottom: 20rpx;
-	}
-
-	.bill-item:last-child {
-		margin-bottom: 0rpx;
-	}
-
-	.bill-info {
-		width: calc(90% - 100rpx);
-		flex: 1;
-	}
-
-	.billIcon {
-		width: 64rpx;
-		height: 64rpx;
-		margin: 20rpx;
-	}
-
-	.bill-title {
-		font-size: 32rpx;
-		font-weight: 600;
-		color: #333;
-		margin-bottom: 10rpx;
-		display: flex;
-	}
-
-	.bill-desc {
-
-		font-size: 28rpx;
-		font-weight: 600;
-		color: #999;
-		white-space: nowrap;
-		overflow: hidden;
-		text-overflow: ellipsis;
-	}
-
-	/* 已欠费标签 */
-	.bill-status {
-		padding: 2rpx 16rpx;
-		border-radius: 30rpx;
-		font-size: 24rpx;
-		font-weight: 500;
-		color: #fff;
-		background-color: #E34D59;
-		margin-left: 10rpx;
-	}
-
-	/* 右侧箭头 */
-	.arrow {
-		width: 12rpx;
-		height: 12rpx;
-		border-right: 4rpx solid #ccc;
-		border-bottom: 4rpx solid #ccc;
-		transform: rotate(-45deg);
-	}
-
-	/* ===================== 新增缴费区域 ===================== */
-	.add-section {
-		background-color: #fff;
-		padding: 30rpx;
-		border-radius: 10rpx;
-	}
-
-	.section-header {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		margin-bottom: 30rpx;
-	}
-
-	.section-title {
-		font-size: 32rpx;
-		font-weight: 600;
-		color: #333;
-	}
-
-	.record-link {
-		font-size: 28rpx;
-		color: #1677ff;
-	}
-
-	/* 网格列表 */
-	.grid-list {
-		display: flex;
-		flex-wrap: wrap;
-		justify-content: flex-start;
-		gap: 26rpx;
-	}
-
-	.grid-item {
-		width: calc(25% - 60rpx);
-		background-color: #F6F9FE;
-		border-radius: 12rpx;
-		padding: 20rpx;
-		margin-bottom: 20rpx;
-		display: flex;
-		align-items: center;
-		flex-direction: column;
-	}
-
-	/* 图标容器 */
-	.icon-box {
-		width: 88rpx;
-		height: 88rpx;
-		border-radius: 50%;
-		/* background-color: #e6f0ff; */
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		/* margin-right: 24rpx; */
-		font-size: 40rpx;
-	}
-
-	.iconStyle {
-		width: 100%;
-		height: 100%;
-	}
-
-	.item-name {
-		font-size: 28rpx;
-		font-weight: 600;
-		color: #333;
-	}
-
-	.status-bar {
-		width: 100vw;
-		height: 46px;
-	}
-</style>

property-uniapp-project/pageSubPack/payment-list/paymentRecord.vue

@@ -4,7 +4,6 @@
 		<uni-nav-bar title="缴费记录" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false">
 		</uni-nav-bar>
 
-
 		<!-- 表单区域 -->
 		<scroll-view class="page" scroll-y="true">
 
@@ -14,8 +13,6 @@
 					<view class="total-title">累计缴费</view>
 					<view class="total-price">¥800.00</view>
 				</view>
-				<!-- 折线图 Canvas -->
-				<!-- <canvas canvas-id="chargeChart" class="chart-canvas"></canvas> -->
 
 				<view class="chart-box">
 					<view v-if="chartData.length === 0" class="empty-state">
@@ -66,63 +63,30 @@
 				</view>
 			</view>
 
-
-
 		</scroll-view>
 	</view>
-
-
-
 </template>
 
-<script>
+<script setup>
-	export default {
+	import {
-		onReady: function(e) {},
+		ref,
-		components: {
+		onMounted,
+		computed
 
-		},
+	} from 'vue'
+	import {
+		onShow,
+		onReady,
+		onReachBottom,
+		onLoad,
+		onUnload,
+		onPullDownRefresh
+	} from '@dcloudio/uni-app'
 
-		computed: {
+	// 响应式数据
+	const statusBarHeight = ref(20)
 
-
+	const chartData = ref([{
-			// 自动按月份分组
-			monthGroups() {
-				let map = {}
-				this.billList.forEach(bill => {
-					if (!map[bill.month]) {
-						map[bill.month] = {
-							month: bill.month,
-							total: 0,
-							list: []
-						}
-					}
-					map[bill.month].list.push(bill)
-					map[bill.month].total += bill.amount
-				})
-				return Object.values(map).sort((a, b) => b.month - a.month)
-			}
-		},
-		created() {
-
-		},
-		onShow() {
-
-		},
-
-		mounted() {},
-
-		onReady() {
-			this.$nextTick(() => {
-
-				this.drawLineChart();
-			})
-		},
-		data() {
-			return {
-				/* 设定状态栏默认高度 */
-				statusBarHeight: 20,
-				// 完全对应你图片的数据
-				chartData: [{
 			month: '1月',
 			price: 250
 		},
@@ -146,24 +110,23 @@
 			month: '6月',
 			price: 130
 		}
-				],
+	])
-				maxPrice: 250, // 最大值（基准高度）
+
-				barMaxHeight: 300, // 柱子最大高度rpx
+	const maxPrice = ref(250)
-				// canvas折线图数据
+	const barMaxHeight = ref(300)
-				chart: {
+
+	const chart = ref({
 		months: ['1月', '2月', '3月', '4月', '5月', '6月'],
 		values: [100, 140, 230, 100, 130, 100]
-				},
+	})
 
-				billList: [
+	const billList = ref([{
-					// 5月数据
-					{
 			id: 1,
 			month: 5,
 			name: '燃气费',
 			account: '123123123123',
 			amount: 25,
-						icon: "http://47.104.199.163:9090/images/propertyImgs/gas.png",
+			icon: "http://47.104.199.163:9090/images/propertyImgs/gas.png"
 		},
 		{
 			id: 2,
@@ -171,17 +134,15 @@
 			name: '水费',
 			account: '123123123123',
 			amount: 25,
-						icon: "http://47.104.199.163:9090/images/propertyImgs/water.png",
+			icon: "http://47.104.199.163:9090/images/propertyImgs/water.png"
 		},
-
-					// 6月数据
 		{
 			id: 3,
 			month: 6,
 			name: '燃气费',
 			account: '123123123123',
 			amount: 30,
-						icon: "http://47.104.199.163:9090/images/propertyImgs/gas.png",
+			icon: "http://47.104.199.163:9090/images/propertyImgs/gas.png"
 		},
 		{
 			id: 4,
@@ -189,7 +150,7 @@
 			name: '水费',
 			account: '123123123123',
 			amount: 10,
-						icon: "http://47.104.199.163:9090/images/propertyImgs/water.png",
+			icon: "http://47.104.199.163:9090/images/propertyImgs/water.png"
 		},
 		{
 			id: 5,
@@ -197,36 +158,59 @@
 			name: '电费',
 			account: '123123123123',
 			amount: 30,
-						icon: "http://47.104.199.163:9090/images/propertyImgs/electric.png",
+			icon: "http://47.104.199.163:9090/images/propertyImgs/electric.png"
 		}
-				]
+	])
-
 
+	// 计算属性 —— 月份分组
+	const monthGroups = computed(() => {
+		let map = {}
+		billList.value.forEach(bill => {
+			if (!map[bill.month]) {
+				map[bill.month] = {
+					month: bill.month,
+					total: 0,
+					list: []
 				}
-		},
+			}
+			map[bill.month].list.push(bill)
+			map[bill.month].total += bill.amount
+		})
+		return Object.values(map).sort((a, b) => b.month - a.month)
+	})
 
+	// 生命周期
+	onShow(() => {})
+	onMounted(() => {})
+	onReady(() => {
+		drawLineChart()
+	})
 
-		methods: {
+	// 方法
-			// 计算每个柱子自适应高度（按金额比例换算）
+	const barHeight = (price) => {
-			barHeight(price) {
+		const height = (price / maxPrice.value) * barMaxHeight.value
-				const height = (price / this.maxPrice) * this.barMaxHeight
 		return `${height}rpx`
-			},
+	}
-			drawLineChart() {
+
+	const drawLineChart = () => {
+		// #ifdef MP-WEIXIN
+		const ctx = uni.createCanvasContext('chargeChart')
+		// #endif
+		// #ifndef MP-WEIXIN
 		const ctx = uni.createCanvasContext('chargeChart', this)
+		// #endif
+
 		const canvasPage = uni.getSystemInfoSync();
 		const w = canvasPage.windowWidth - 30;
 		const h = canvasPage.windowHeight * 0.3;
-
 		const padding = 40
-				const stepX = (w - 60) / (this.chart.months.length - 1)
+		const stepX = (w - 60) / (chart.value.months.length - 1)
 		const maxVal = 250
 
 		ctx.setFillStyle('#999')
 		ctx.setFontSize(12)
 		ctx.setTextAlign('center')
 
-				// 绘制网格
 		ctx.beginPath()
 		ctx.setStrokeStyle('#d8d8d8')
 		ctx.setLineWidth(1)
@@ -238,15 +222,13 @@
 		}
 		ctx.stroke()
 
-				// 绘制X轴月份
+		chart.value.months.forEach((m, i) => {
-				this.chart.months.forEach((m, i) => {
 			let x = 40 + i * stepX
 			ctx.fillText(m, x, h - 20)
 		})
 
-				// 绘制折线
 		let points = []
-				this.chart.values.forEach((val, i) => {
+		chart.value.values.forEach((val, i) => {
 			let x = 40 + i * stepX
 			let y = padding + (h - padding * 2) * (1 - val / maxVal)
 			points.push({
@@ -264,7 +246,6 @@
 		})
 		ctx.stroke()
 
-				// 绘制圆点
 		points.forEach((p, i) => {
 			ctx.beginPath()
 			ctx.arc(p.x, p.y, 3, 0, 2 * Math.PI)
@@ -276,25 +257,19 @@
 
 			ctx.setFillStyle('#4080FF')
 			ctx.setFontSize(13)
-					ctx.fillText(this.chart.values[i] + '元', p.x, p.y - 10)
+			ctx.fillText(chart.value.values[i] + '元', p.x, p.y - 10)
 		})
 
 		ctx.draw()
-			},
+	}
-			goBack() {
+
+	const goBack = () => {
 		uni.redirectTo({
-					url: '/pageSubPack/payment-list/paymentIndex',
+			url: '/pageSubPack/payment-list/paymentIndex'
-					success: res => {},
+		})
-					fail: () => {},
-					complete: () => {}
-				});
-			},
-
-		},
-
-
 	}
 </script>
+
 <style lang="scss">
 	page {
 		// background: #f2f1f6;
@@ -306,7 +281,6 @@
 		display: flex;
 		flex-direction: column;
 		height: 100vh;
-		/* 关键：占满屏幕高度 */
 		background: linear-gradient(to left bottom, #e2efff 0%, #f9f9f9 50%);
 	}
 
@@ -315,15 +289,12 @@
 		overflow-y: auto;
 		padding: 0px 40rpx;
 		box-sizing: border-box;
-		/* background-color: #fff; */
 	}
 
-
 	.total-box {
 		margin-bottom: 30rpx;
 	}
 
-	/* 空状态 */
 	.empty-state {
 		display: flex;
 		flex-direction: column;
@@ -399,7 +370,6 @@
 	.bill-icon {
 		width: 80rpx;
 		height: 80rpx;
-		/* background: #e6efff; */
 		border-radius: 50%;
 		display: flex;
 		align-items: center;
@@ -440,19 +410,17 @@
 		height: 46px;
 	}
 </style>
+
 <style scoped>
-	/* 图表外层容器 横向排列 */
 	.chart-box {
 		width: 100%;
 		height: 444rpx;
 		display: flex;
 		align-items: flex-end;
 		justify-content: space-around;
-		/* padding: 40rpx 20rpx; */
 		box-sizing: border-box;
 	}
 
-	/* 单个柱子单元：垂直排列 文字+柱子+月份 */
 	.chart-item {
 		display: flex;
 		flex-direction: column;
@@ -462,22 +430,18 @@
 		font-size: 24rpx;
 	}
 
-	/* 顶部金额标签 */
 	.chart-label {
 		font-size: 32rpx;
 		color: #333;
 		margin-bottom: 20rpx;
 	}
 
-	/* 蓝色圆角柱子 完全还原原图顶部圆角 */
 	.chart-bar {
 		width: 40rpx;
 		background: #3388ff;
 		border-radius: 40rpx 40rpx 0 0;
-		/* 只有顶部圆角！和原图一模一样 */
 	}
 
-	/* 底部月份文字 */
 	.chart-month {
 		font-size: 32rpx;
 		color: #666;

property-uniapp-project/pageSubPack/payment-list/selectPaymentEntity.vue

@@ -4,7 +4,6 @@
 		<uni-nav-bar title="选择缴费单位" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false">
 		</uni-nav-bar>
 
-
 		<!-- 表单区域 -->
 		<scroll-view class="page" scroll-y="true">
 			<!-- 城市 + 搜索 -->
@@ -20,9 +19,6 @@
 				</uni-data-picker>
 
 				<!-- 搜索框 -->
-				<!-- <view class="search-input">
-					<input v-model="keyword" placeholder="请输入缴费单位名称" placeholder-class="ph" />
-				</view> -->
 				<view class="search-box">
 					<input class="search-input" v-model="searchKey" placeholder="请输入缴费单位名称"
 						placeholder-class="input-placeholder" @input="onSearch" />
@@ -32,11 +28,9 @@
 
 			<view v-if="filterList.length === 0" class="empty-state">
 				<uni-icons type="info" size="60" color="#ccc"></uni-icons>
-				<text class="empty-text">
+				<text class="empty-text">{{ '暂无数据' }}</text>
-					{{ '暂无数据'}}
-				</text>
 			</view>
-			<!-- 	<scroll-view scroll-y class="list-scroll"> -->
+
 			<view v-for="item in filterList">
 				<view class="group-title">{{item.name}}</view>
 				<view class="item" v-for="itemChild in item.children" :key="itemChild.id"
@@ -44,75 +38,30 @@
 					{{ itemChild.name }}
 				</view>
 			</view>
-			<!-- </scroll-view> -->
-
-
 		</scroll-view>
 	</view>
-
-
-
 </template>
 
-<script>
+<script setup>
-	// 引入外部城市数据
+	import {
-	// import Address from '@/static/js/chinaRegions/picker-region.js'
+		ref,
-	export default {
+		onMounted,
-		onReady: function(e) {},
+		computed
-		components: {
 
-		},
+	} from 'vue'
-		computed: {
+	import {
+		onShow,
+		onReady,
+		onReachBottom,
+		onLoad,
+		onUnload,
+		onPullDownRefresh
+	} from '@dcloudio/uni-app'
 
-
+	// 响应式数据
-
+	const selectedCity = ref('选择城市')
-			filterList() {
+	const cityValue = ref('')
-				// 没有关键词直接返回全部
+	const alladdress = ref([{
-				if (!this.searchKey) return this.companyList;
-				const key = this.searchKey.trim().toLowerCase();
-				// 过滤第一层 + 第二层
-				return this.companyList.filter(group => {
-					// 过滤子项：只要子项包含关键词就保留
-					const hasChild = group.children.some(child =>
-						child.name.toLowerCase().includes(key)
-					);
-					// 同时支持 分组名 搜索（不需要可删除）
-					const groupMatch = group.name.toLowerCase().includes(key);
-
-					return hasChild || groupMatch;
-				}).map(group => {
-					// 返回过滤后的子项
-					return {
-						...group,
-						children: group.children.filter(child =>
-							child.name.toLowerCase().includes(key)
-						)
-					};
-				});
-			}
-
-		},
-		created() {
-
-		},
-		onShow() {
-
-		},
-		onLoad() {
-
-		},
-		mounted() {},
-
-		onReady() {
-			this.$nextTick(() => {
-
-			})
-		},
-		data() {
-			return {
-				selectedCity: '选择城市',
-				cityValue: '',
-				alladdress: [{
 		text: "北京市",
 		value: "110000000000",
 		children: [{
@@ -184,17 +133,14 @@
 				}
 			]
 		}]
-				}, ],
+	}])
 
-				searchKey: '',
+	const searchKey = ref('')
-				/* 设定状态栏默认高度 */
+	const statusBarHeight = ref(20)
-				statusBarHeight: 20,
+	const showPicker = ref(false)
-				showPicker: false,
+	const keyword = ref('')
-				keyword: '',
 
-
+	const companyList = ref([{
-				// 列表：一个大数组
-				companyList: [{
 			id: 7,
 			name: '官方机构',
 			children: [{
@@ -233,69 +179,66 @@
 				{
 					id: 10,
 					name: "XX能源集团"
-							},
+				}
-
 			]
 		}
+	])
 
-				]
+	// 计算属性：搜索过滤
-
+	const filterList = computed(() => {
+		if (!searchKey.value) return companyList.value
+		const key = searchKey.value.trim().toLowerCase()
 
+		return companyList.value.filter(group => {
+			const hasChild = group.children.some(child =>
+				child.name.toLowerCase().includes(key)
+			)
+			const groupMatch = group.name.toLowerCase().includes(key)
+			return hasChild || groupMatch
+		}).map(group => {
+			return {
+				...group,
+				children: group.children.filter(child =>
+					child.name.toLowerCase().includes(key)
+				)
 			}
-		},
+		})
+	})
 
+	// 生命周期
+	onShow(() => {})
+	onMounted(() => {})
+	onReady(() => {})
 
-		methods: {
+	// 方法
-			selectItem(item) {
+	const selectItem = (item) => {
-				console.log(item);
+		console.log(item)
 		uni.redirectTo({
-					url: '/pageSubPack/payment-list/addPayment',
+			url: '/pageSubPack/payment-list/addPayment'
-					success: res => {},
+		})
-					fail: () => {},
+	}
-					complete: () => {}
+
-				});
+	const onchange = (e) => {
-			},
-			onchange(e) {
 		console.log('选中text数组:', e.detail.value)
-				let arr = e.detail.value
+		const arr = e.detail.value
-				let selectedCity = ''
+		let city = ''
-				// 拼接省市区
+		if (arr[1].text === '市辖区') {
-				// arr.forEach((item, index) => {
+			city = arr[0].text
-				// 	if (index != arr.length - 1) {
-				// 		selectedCity = selectedCity + item.text + '/'
-				// 	} else {
-				// 		selectedCity = selectedCity + item.text
-				// 	}
-
-				// })
-				// 只显示城市判断
-				if (arr[1].text == '市辖区') {
-					selectedCity = arr[0].text
 		} else {
-					selectedCity = arr[1].text
+			city = arr[1].text
+		}
+		selectedCity.value = city
 	}
-				this.selectedCity = selectedCity
-			},
 
-			// 搜索输入事件
+	const onSearch = () => {}
-			onSearch() {
-				// 实时过滤，computed 自动处理
-			},
 
-			goBack() {
+	const goBack = () => {
 		uni.redirectTo({
-					url: '/pageSubPack/payment-list/paymentIndex',
+			url: '/pageSubPack/payment-list/paymentIndex'
-					success: res => {},
+		})
-					fail: () => {},
-					complete: () => {}
-				});
-			},
-
-		},
-
-
 	}
 </script>
+
 <style lang="scss">
 	page {
 		background: #f9f9f9;
@@ -307,14 +250,12 @@
 		display: flex;
 		flex-direction: column;
 		height: 100vh;
-		/* 关键：占满屏幕高度 */
 		background-color: #f9f9f9;
 	}
 
 	.page {
 		flex: 1;
 		overflow-y: auto;
-
 		box-sizing: border-box;
 		background-color: #fff;
 	}
@@ -326,13 +267,11 @@
 		align-items: center;
 	}
 
-	/* 隐藏 uni-data-picker 原生样式，只保留点击功能 */
 	.city-picker {
 		display: block;
 		width: auto;
 	}
 
-	/* 自定义城市选择区域，完美还原「日照市 ▼」 */
 	.city-select {
 		display: flex;
 		align-items: center;
@@ -350,32 +289,26 @@
 
 	.city-text {
 		font-size: 28rpx;
-		/* 匹配截图字体大小 */
 		font-weight: 600;
 		color: #000000;
 		line-height: 1;
 	}
 
-	/* 自定义下拉箭头，1:1 还原截图样式 */
 	.arrow-icon {
 		width: 0;
 		height: 0;
 		border-left: 10rpx solid transparent;
 		border-right: 10rpx solid transparent;
 		border-top: 16rpx solid #333333;
-		/* 纯黑实心三角，和截图一致 */
 		margin-top: 4rpx;
 	}
 
-
-	/* 搜索框 */
 	.search-box {
 		display: flex;
 		width: 100%;
 		align-items: center;
 		background-color: #f3f4f6;
 		border-radius: 20rpx;
-		/* margin: 0rpx 30rpx 20rpx 30rpx; */
 		padding: 0 30rpx;
 		margin: 10rpx 0px 0px 10rpx;
 		height: 70rpx;
@@ -399,9 +332,6 @@
 		color: #999;
 	}
 
-	/* 列表 */
-	.list-scroll {}
-
 	.group-title {
 		padding: 20rpx 40rpx;
 		font-size: 28rpx;
@@ -430,7 +360,6 @@
 		height: 46px;
 	}
 
-	/* 空状态 */
 	.empty-state {
 		display: flex;
 		flex-direction: column;

property-uniapp-project/pages.json

@@ -8,7 +8,6 @@
 				"navigationStyle": "custom"
 			}
 		},
-
 		{
 			"path": "pages/index/index",
 			"style": {