From 3db2ddb1ff8e33a17d32a642d2621b865db77f75 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E6=AF=85?= <1335909236@qq.com>
Date: Thu, 31 Jul 2025 17:40:29 +0800
Subject: [PATCH] =?UTF-8?q?=E7=89=A9=E4=B8=9A=E7=BC=B4=E8=B4=B9=20-=20?=
 =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E5=88=87=E6=8D=A2=E6=88=BF=E6=BA=90=E5=A4=B1?=
 =?UTF-8?q?=E8=B4=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/community/propertyPayment/index.vue | 522 +++++++++++--------
 1 file changed, 298 insertions(+), 224 deletions(-)

diff --git a/packages/community/propertyPayment/index.vue b/packages/community/propertyPayment/index.vue
index 25e7e873..0d16f11f 100644
--- a/packages/community/propertyPayment/index.vue
+++ b/packages/community/propertyPayment/index.vue
@@ -1,245 +1,305 @@
 <template>
-	<div class="container">
-		<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
-			<div class="searchBox_add">
-				<u-icon bold color="#000" size="40" name="arrow-left" @click="back"></u-icon>
-			</div>
-		</div>
+  <div class="container">
+    <div
+      class="searchBox"
+      :style="{ height: localHeight + 'px', paddingTop: top + 'px' }"
+    >
+      <div class="searchBox_add">
+        <u-icon
+          bold
+          color="#000"
+          size="40"
+          name="arrow-left"
+          @click="back"
+        ></u-icon>
+      </div>
+    </div>
 
-		<div class="community">
-			<div class="community_left">
-				<image mode="aspectFill"
-					src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/test.png" alt="" />
-			</div>
-			<div class="community_right" @click="changeShow">
-				<div class="community_right_text">
-					<div class="community_right_text1">{{ currentRoom.name }}</div>
-					<div class="community_right_text2">{{ currentCommunityAddr }}</div>
-				</div>
-				<div class="community_right_more">
-					<u-icon bold color="#999999" size="30" name="arrow-right"></u-icon>
-				</div>
-			</div>
-		</div>
+    <div class="community">
+      <div class="community_left">
+        <image
+          mode="aspectFill"
+          src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/test.png"
+          alt=""
+        />
+      </div>
+      <div class="community_right" @click="changeShow">
+        <div class="community_right_text">
+          <div class="community_right_text1">{{ currentRoom.name }}</div>
+          <div class="community_right_text2">{{ currentCommunityAddr }}</div>
+        </div>
+        <div class="community_right_more">
+          <u-icon bold color="#999999" size="30" name="arrow-right"></u-icon>
+        </div>
+      </div>
+    </div>
 
-		<div class="tabList">
-			<div class="tabItem" :class="active == 0 ? 'active' : ''" @click="changeTab(0)">账单</div>
-			<div class="line"></div>
-			<div class="tabItem" :class="active == 1 ? 'active' : ''" @click="changeTab(1)">缴费记录</div>
-		</div>
+    <div class="tabList">
+      <div
+        class="tabItem"
+        :class="active == 0 ? 'active' : ''"
+        @click="changeTab(0)"
+      >
+        账单
+      </div>
+      <div class="line"></div>
+      <div
+        class="tabItem"
+        :class="active == 1 ? 'active' : ''"
+        @click="changeTab(1)"
+      >
+        缴费记录
+      </div>
+    </div>
 
-		<div class="homeMoney" v-if="active == 0">
-			<div class="homeMoney_box">
-				<div class="homeMoney_box_left">
-					<div class="homeMoney_box_left1">物业公积金</div>
-					<div class="homeMoney_box_left2">可抵扣账户金额</div>
-				</div>
-				<div class="homeMoney_box_right">
-					<div class="homeMoney_box_right1"><span>￥</span>{{ balanceMoney }}</div>
-					<div class="homeMoney_box_right2" @click="more">
-						查看详情
-						<div style="margin-left: 12rpx;">
-							<u-icon bold color="#894B11" size="30" name="arrow-right" ></u-icon>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
+    <div class="homeMoney" v-if="active == 0">
+      <div class="homeMoney_box">
+        <div class="homeMoney_box_left">
+          <div class="homeMoney_box_left1">物业公积金</div>
+          <div class="homeMoney_box_left2">可抵扣账户金额</div>
+        </div>
+        <div class="homeMoney_box_right">
+          <div class="homeMoney_box_right1">
+            <span>￥</span>{{ balanceMoney }}
+          </div>
+          <div class="homeMoney_box_right2" @click="more">
+            查看详情
+            <div style="margin-left: 12rpx">
+              <u-icon
+                bold
+                color="#894B11"
+                size="30"
+                name="arrow-right"
+              ></u-icon>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
 
-		<div class="payList" v-if="active == 0">
-			<div class="payItem" v-for="(item, index) in Bill" :key="index">
-				<div class="payItem_tit">
-					<div class="payItem_left">
-						<checkbox :checked="item.check" @click="checkChange(item, index)"></checkbox>
-						<div style="margin-left: 24rpx;">{{ item.order_date }}年</div>
-					</div>
-					<div class="payItem_right">
-						<span>￥</span>
-						{{ item.unpaid_amount }}
-						<p>未缴</p>
+    <div class="payList" v-if="active == 0">
+      <div class="payItem" v-for="(item, index) in Bill" :key="index">
+        <div class="payItem_tit">
+          <div class="payItem_left">
+            <checkbox
+              :checked="item.check"
+              @click="checkChange(item, index)"
+            ></checkbox>
+            <div style="margin-left: 24rpx">{{ item.order_date }}年</div>
+          </div>
+          <div class="payItem_right">
+            <span>￥</span>
+            {{ item.unpaid_amount }}
+            <p>未缴</p>
 
-						<div style="margin-left: 40rpx;" @click="changeCheck(item, index)">
-							<u-icon bold color="#894B11" size="30" name="arrow-down" v-if="!item.more"></u-icon>
-							<u-icon bold color="#894B11" size="30" name="arrow-up" v-if="item.more"></u-icon>
-						</div>
-					</div>
-				</div>
-				<div v-if="item.more">
-					<div class="payItem_List" v-for="(items, indes) in item.community_order_rows"
-						:key="items.order_id">
-						<checkbox :checked="items.check" @click="itemsCheckChange(items, indes, index)"></checkbox>
-						<div class="Item_time" v-if="items.billing_cycle == 1">{{ items.order_date }}年</div>
-						<div class="Item_time" v-if="items.billing_cycle == 2">{{ items.order_datetime }}月</div>
-						<div class="Item_type">{{ items.community_fee_type.type_name }}</div>
-						<div class="Item_money">￥{{ items.money }}</div>
-						<div class="Item_status" v-if="items.status == 0">未付款</div>
-						<div class="Item_status sucess" v-if="items.status == 1">已付款</div>
-					</div>
-				</div>
-			</div>
-		</div>
+            <div style="margin-left: 40rpx" @click="changeCheck(item, index)">
+              <u-icon
+                bold
+                color="#894B11"
+                size="30"
+                name="arrow-down"
+                v-if="!item.more"
+              ></u-icon>
+              <u-icon
+                bold
+                color="#894B11"
+                size="30"
+                name="arrow-up"
+                v-if="item.more"
+              ></u-icon>
+            </div>
+          </div>
+        </div>
+        <div v-if="item.more">
+          <div
+            class="payItem_List"
+            v-for="(items, indes) in item.community_order_rows"
+            :key="items.order_id"
+          >
+            <checkbox
+              :checked="items.check"
+              @click="itemsCheckChange(items, indes, index)"
+            ></checkbox>
+            <div class="Item_time" v-if="items.billing_cycle == 1">
+              {{ items.order_date }}年
+            </div>
+            <div class="Item_time" v-if="items.billing_cycle == 2">
+              {{ items.order_datetime }}月
+            </div>
+            <div class="Item_type">
+              {{ items.community_fee_type.type_name }}
+            </div>
+            <div class="Item_money">￥{{ items.money }}</div>
+            <div class="Item_status" v-if="items.status == 0">未付款</div>
+            <div class="Item_status sucess" v-if="items.status == 1">
+              已付款
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
 
-		<!-- 选择支付类型 -->
-		<div class="payTypeList" v-if="active == 0">
-			<div class="PayTypeItem">
-				<div class="PayTypeItem_left">
-					<div class="PayTypeItem_img">
-						<image mode="aspectFill"
-							src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_wechat.png"
-							alt="" />
-					</div>
-					<div class="PayTypeItem_con">
-						<div class="PayTypeItem_con_tit">微信支付</div>
-						<div class="PayTypeItem_con_msg">单笔支付限额：￥10000.00</div>
-					</div>
-				</div>
+    <!-- 选择支付类型 -->
+    <div class="payTypeList" v-if="active == 0">
+      <div class="PayTypeItem">
+        <div class="PayTypeItem_left">
+          <div class="PayTypeItem_img">
+            <image
+              mode="aspectFill"
+              src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_wechat.png"
+              alt=""
+            />
+          </div>
+          <div class="PayTypeItem_con">
+            <div class="PayTypeItem_con_tit">微信支付</div>
+            <div class="PayTypeItem_con_msg">单笔支付限额：￥10000.00</div>
+          </div>
+        </div>
 
-				<div class="PayTypeItem_right">
-					<radio :checked="payType == 1" @click="changePayType(1)"></radio>
-				</div>
-			</div>
-			<div class="line3"></div>
-			<div class="PayTypeItem">
-				<div class="PayTypeItem_left">
-					<div class="PayTypeItem_img">
-						<image mode="aspectFill"
-							src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_homeMoney.png"
-							alt="" />
-					</div>
-					<div class="PayTypeItem_con">
-						<div class="PayTypeItem_con_tit">物业公积金支付</div>
-						<div class="PayTypeItem_con_msg">单笔支付限额：￥10000.00</div>
-					</div>
-				</div>
+        <div class="PayTypeItem_right">
+          <radio :checked="payType == 1" @click="changePayType(1)"></radio>
+        </div>
+      </div>
+      <div class="line3"></div>
+      <div class="PayTypeItem">
+        <div class="PayTypeItem_left">
+          <div class="PayTypeItem_img">
+            <image
+              mode="aspectFill"
+              src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_homeMoney.png"
+              alt=""
+            />
+          </div>
+          <div class="PayTypeItem_con">
+            <div class="PayTypeItem_con_tit">物业公积金支付</div>
+            <div class="PayTypeItem_con_msg">单笔支付限额：￥10000.00</div>
+          </div>
+        </div>
 
-				<div class="PayTypeItem_right">
-					<radio :checked="payType == 2" @click="changePayType(2)"></radio>
-				</div>
-			</div>
-		</div>
+        <div class="PayTypeItem_right">
+          <radio :checked="payType == 2" @click="changePayType(2)"></radio>
+        </div>
+      </div>
+    </div>
 
-		<div class="bottom" v-if="active == 0">
-			<div class="bottom_left">
-				<span>合计</span>
-				<p>￥</p>
-				{{ currentMoney }}
-			</div>
-			<div class="bottom_right" @click="OrderPay">
-				立即支付
-			</div>
-		</div>
+    <div class="bottom" v-if="active == 0">
+      <div class="bottom_left">
+        <span>合计</span>
+        <p>￥</p>
+        {{ currentMoney }}
+      </div>
+      <div class="bottom_right" @click="OrderPay">立即支付</div>
+    </div>
 
+    <div class="payHisList" v-if="active == 1">
+      <div class="payHisItem" v-for="item in payOrderList" :key="item.id">
+        <div class="row">
+          <div class="row_label">缴费金额</div>
+          <div class="row_con1">￥{{ item.money }}</div>
+        </div>
+        <div class="row">
+          <div class="row_label2"></div>
+          <div class="row_con2">{{ item.pay_time }}支付</div>
+        </div>
+        <div class="line4"></div>
+        <div class="row">
+          <div class="row_label">绑定房源</div>
+          <div class="row_con3">
+            <div class="row_con3_1">
+              {{ item.community_order.length }}个账单
+            </div>
+            <div class="row_con3_2">明细可从收据查看</div>
+          </div>
+        </div>
 
-		<div class="payHisList" v-if="active == 1">
-			<div class="payHisItem" v-for="item in payOrderList" :key="item.id">
-				<div class="row">
-					<div class="row_label">缴费金额</div>
-					<div class="row_con1">￥{{ item.money }}</div>
-				</div>
-				<div class="row">
-					<div class="row_label2"></div>
-					<div class="row_con2">{{ item.pay_time }}支付</div>
-				</div>
-				<div class="line4"></div>
-				<div class="row">
-					<div class="row_label">绑定房源</div>
-					<div class="row_con3">
-						<div class="row_con3_1">{{ item.community_order.length }}个账单</div>
-						<div class="row_con3_2">明细可从收据查看</div>
-					</div>
-				</div>
+        <div class="row">
+          <div class="row_label">应缴费金额</div>
+          <div class="row_con4">￥{{ item.money }}</div>
+        </div>
 
-				<div class="row">
-					<div class="row_label">应缴费金额</div>
-					<div class="row_con4">￥{{ item.money }}</div>
-				</div>
+        <div class="row">
+          <div class="row_label">物业费公积金抵扣金额</div>
+          <div class="row_con4">-￥{{ item.reduction_money }}</div>
+        </div>
 
-				<div class="row">
-					<div class="row_label">物业费公积金抵扣金额</div>
-					<div class="row_con4">-￥{{ item.reduction_money }}</div>
-				</div>
+        <div class="row">
+          <div class="row_label">缴费单号</div>
+          <div class="row_con4">{{ item.order_pay_no }}</div>
+        </div>
+        <div class="line4"></div>
+        <div class="Receipt">收据</div>
+      </div>
+    </div>
 
-				<div class="row">
-					<div class="row_label">缴费单号</div>
-					<div class="row_con4">{{ item.order_pay_no }} </div>
-				</div>
-				<div class="line4"></div>
-				<div class="Receipt">收据</div>
+    <div class="boxshadow" v-if="show" @click="changeShow">
+      <div class="boxshadowCon">
+        <div class="boxshadowCon_Tit">
+          选择房源
+          <div class="cancel">取消</div>
+        </div>
+        <div class="lines"></div>
+        <div class="communityList" v-if="roomList.length > 0">
+          <div
+            class="communityItem"
+            v-for="item in roomList"
+            :key="item.room_id"
+            @click="selectRoom(item)"
+          >
+            <div class="communityItem_text">
+              {{ item.facility_name }}{{ item.floor }} {{ item.number }}
+            </div>
+            <div class="communityItem_radio">
+              <radio :checked="selectedRoomId === item.room_id"></radio>
+            </div>
+          </div>
+        </div>
+        <div class="communityList" v-else>
+          <div class="communityItem">
+            <div class="communityItem_text">暂无房源</div>
+          </div>
+        </div>
+      </div>
+    </div>
 
-			</div>
-		</div>
+    <div class="boxshadow" v-if="show2" @click="changeShow2">
+      <div class="boxshadowCon">
+        <div class="boxshadowCon_Tit">
+          付款总金额
+          <div class="cancel">取消</div>
+        </div>
+        <div class="boxshadowCon_subTit"><span>￥</span>4900.00</div>
+        <div class="lines"></div>
 
+        <div class="BanlenceList">
+          <div class="banlenceItem">
+            <div class="banlenceItem_left">
+              <image
+                mode="aspectFill"
+                src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_wechat.png"
+                alt=""
+              />
+              微信支付
+            </div>
+            <div class="banlenceItem_right"><span>￥</span>4900.00</div>
+          </div>
+          <div class="line3"></div>
+          <div class="banlenceItem">
+            <div class="banlenceItem_left">
+              <image
+                mode="aspectFill"
+                src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_homeMoney.png"
+                alt=""
+              />
+              物业公积金支付
+            </div>
+            <div class="banlenceItem_right"><span>￥</span>4900.00</div>
+          </div>
+        </div>
 
-		<div class="boxshadow" v-if="show" @click="changeShow">
-			<div class="boxshadowCon">
-				<div class="boxshadowCon_Tit">
-					选择房源
-					<div class="cancel">取消</div>
-				</div>
-				<div class="lines"></div>
-				<div class="communityList" v-if="roomList.length > 0">
-					<div class="communityItem" v-for="item in roomList" :key="item.room_id">
-						<div class="communityItem_text">{{ item.facility_name }}{{ item.floor }} {{ item.number }}</div>
-						<div class="communityItem_radio">
-							<radio></radio>
-						</div>
-					</div>
-				</div>
-				<div class="communityList" v-else>
-					<div class="communityItem">
-						<div class="communityItem_text">暂无房源</div>
-					</div>
-				</div>
-			</div>
-		</div>
-
-		<div class="boxshadow" v-if="show2" @click="changeShow2">
-			<div class="boxshadowCon">
-				<div class="boxshadowCon_Tit">
-					付款总金额
-					<div class="cancel">取消</div>
-				</div>
-				<div class="boxshadowCon_subTit">
-					<span>￥</span>4900.00
-				</div>
-				<div class="lines"></div>
-
-				<div class="BanlenceList">
-					<div class="banlenceItem">
-						<div class="banlenceItem_left">
-							<image mode="aspectFill"
-								src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_wechat.png"
-								alt="" />
-							微信支付
-						</div>
-						<div class="banlenceItem_right">
-							<span>￥</span>4900.00
-						</div>
-					</div>
-					<div class="line3"></div>
-					<div class="banlenceItem">
-						<div class="banlenceItem_left">
-							<image mode="aspectFill"
-								src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_homeMoney.png"
-								alt="" />
-							物业公积金支付
-						</div>
-						<div class="banlenceItem_right">
-							<span>￥</span>4900.00
-						</div>
-					</div>
-
-				</div>
-
-				<div class="btn">
-					物业公积金+微信支付 <span>￥</span>4900.00
-				</div>
-
-			</div>
-		</div>
-
-	</div>
-
+        <div class="btn">物业公积金+微信支付 <span>￥</span>4900.00</div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
@@ -266,6 +326,7 @@ export default {
 			show2: false,
 			roomList: [],
 			currentRoom: {},
+			selectedRoomId: '', // 选中的房源ID
 			currentCommunity: "", //当前房源
 			currentCommunityAddr: "", //当前房源地址
 			Bill: "", //账单
@@ -321,11 +382,24 @@ export default {
 			}).then(res => {
 				this.roomList = res.rows
 				this.currentRoom = this.roomList[0]
+				this.selectedRoomId = this.currentRoom.room_id
 				this.getOrderList()
 
 			})
 		},
 
+		
+		// 选择房源
+		selectRoom(item){
+			// 更新选中的房源ID
+			this.selectedRoomId = item.room_id;
+			// 在控制台输出选中的数据
+			console.log('选中的房源数据:', item);
+
+			this.currentRoom = item;
+			this.getOrderList()
+		},
+
 		//获取用户公积金
 		async getUserGovenmentMoney() {
 			request(apiArr.getUserGovenmentMoney, "POST", {}).then(res => {