完成小程序前端部分

app.json

@@ -1,11 +1,12 @@
 {
   "pages": [
-    "pages/loginModule/pwdLogin/pwdLogin",
     "pages/personCenter/mine/mine",
+    "pages/personCenter/withdrawalAccount/withdrawalAccount",
+    "pages/personCenter/bindBankCard/bindBankCard",
+    "pages/loginModule/pwdLogin/pwdLogin",
     "pages/personCenter/subCommissionSetting/subCommissionSetting",
     "pages/test/testVideo/testVideo",
     "pages/personCenter/withdrawal/withdrawal",
-    "pages/personCenter/withdrawalAccount/withdrawalAccount",
     "pages/personCenter/accountSetting/accountSetting",
     "pages/personCenter/contactSuper/contactSuper",
     "pages/personCenter/fundingDetails/fundingDetails",

pages/personCenter/bindBankCard/bindBankCard.js

@@ -0,0 +1,66 @@
+// pages/personCenter/bindBankCard/bindBankCard.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/personCenter/bindBankCard/bindBankCard.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/personCenter/bindBankCard/bindBankCard.wxml

@@ -0,0 +1,44 @@
+<view class="flex-col page">
+  <text class="self-center font text">绑定银行卡</text>
+  <text class="self-center font_2 text_2">请绑定持卡人本人的银行卡</text>
+  <view class="flex-col self-stretch group">
+    <view class="self-start group_2">
+      <text class="font_2">持卡人</text>
+      <text class="font_3">*</text>
+    </view>
+    <view class="flex-col justify-start items-start self-stretch text-wrapper mt-11">
+      <input class="text_3 font" placeholder="请输入持卡人" />
+    </view>
+    <view class="self-start group_3 mt-11">
+      <text class="font_2 text_4">身份证号</text>
+      <text class="font_3">*</text>
+    </view>
+    <view class="flex-col justify-start items-start self-stretch text-wrapper_2 mt-11">
+      <input class="text_12 font_4" placeholder="请输入持卡人身份证号" />
+    </view>
+    <view class="self-start group_4 mt-11">
+      <text class="font_2">手机号</text>
+      <text class="font_3">*</text>
+    </view>
+    <view class="flex-col justify-start items-start self-stretch text-wrapper_2 mt-11">
+      <input class="text_1 font_4" placeholder="请输入持卡人绑定的手机号" />
+    </view>
+    <view class="self-start group_5 mt-11">
+      <text class="font_2 text_6">银行卡号</text>
+      <text class="font_3">*</text>
+    </view>
+    <view class="flex-col justify-start items-start self-stretch text-wrapper_2 mt-11">
+      <input class="text_5 font_4" placeholder="请输入持卡人银行卡号" />
+    </view>
+    <view class="self-start group_6 mt-11">
+      <text class="font_2 text_7">开户银行</text>
+      <text class="font_3">*</text>
+    </view>
+    <view class="flex-col justify-start items-start self-stretch text-wrapper_2 mt-11">
+      <input class="text_1 font_4" placeholder="请输入开户银行" />
+    </view>
+  </view>
+  <view class="flex-col justify-start items-center self-center text-wrapper_3">
+    <text class="font_2 text_8">保存</text>
+  </view>
+</view>

pages/personCenter/bindBankCard/bindBankCard.wxss

@@ -0,0 +1,103 @@
+.mt-11 {
+  margin-top: 20.99rpx;
+}
+.page {
+  padding: 77.27rpx 45.8rpx 372.14rpx 45.8rpx;
+  background-color: #ffffff;
+  width: 100%;
+  overflow-y: auto;
+  overflow-x: hidden;
+  height: 100%;
+}
+.font_2 {
+  font-size: 30.53rpx;
+  font-family: SourceHanSansCN;
+  line-height: 28.09rpx;
+  color: #000000;
+}
+.text_2 {
+  margin-top: 53.49rpx;
+  color: #808080;
+  line-height: 28.4rpx;
+}
+.group {
+  margin-top: 84.43rpx;
+}
+.group_2 {
+  line-height: 28.09rpx;
+}
+.font_3 {
+  font-size: 30.53rpx;
+  font-family: SourceHanSansCN;
+  line-height: 9.92rpx;
+  color: #ff5733;
+}
+.text-wrapper {
+  padding: 26.87rpx 0 23.32rpx;
+  background-color: #f5f5f5;
+  border-radius: 10rpx;
+}
+.text_3 {
+  margin-left: 27.52rpx;
+}
+.font {
+  font-size: 34.35rpx;
+  font-family: SourceHanSansCN;
+  line-height: 31.87rpx;
+  color: #000000;
+}
+.text {
+  line-height: 32.25rpx;
+}
+.group_3 {
+  line-height: 28.44rpx;
+}
+.text_4 {
+  line-height: 28.44rpx;
+}
+.text-wrapper_2 {
+  padding: 30.38rpx 0 25.61rpx;
+  background-color: #f5f5f5;
+  border-radius: 10rpx;
+}
+.text_12 {
+  margin-left: 25.8rpx;
+}
+.group_4 {
+  line-height: 28.09rpx;
+}
+.text_1 {
+  width: 400rpx;
+  margin-left: 27.82rpx;
+}
+.group_5 {
+  line-height: 28.21rpx;
+}
+.text_6 {
+  line-height: 28.21rpx;
+}
+.text_5 {
+  margin-left: 26.74rpx;
+}
+.font_4 {
+  font-size: 34.35rpx;
+  font-family: SourceHanSansCN;
+  line-height: 26.07rpx;
+  color: #000000;
+}
+.group_6 {
+  line-height: 28.49rpx;
+}
+.text_7 {
+  line-height: 28.49rpx;
+}
+.text-wrapper_3 {
+  margin-top: 57.25rpx;
+  padding: 25.84rpx 0 20.5rpx;
+  background-color: #ff8d1a;
+  border-radius: 19.08rpx;
+  width: 248.09rpx;
+}
+.text_8 {
+  color: #ffffff;
+}

pages/personCenter/commissionSetting/commissionSetting.js

@@ -7,6 +7,43 @@ Page({
   data: {
     items_1: [null, null, null],
     items: [null, null],
+    showPopup: false,  // 控制弹窗显隐
+    showCommissionRatePop: false,
+  },
+  // 显示弹窗
+  showPopup() {
+    this.setData({
+      showPopup: true
+    });
+  },
+  // 关闭弹窗
+  closePopup() {
+    this.setData({
+      showPopup: false
+    });
+  },
+  // 处理抽佣比例提交
+  handleCommissionSubmit(e) {
+    const { commissionRate } = e.detail;
+    console.log(`设置的抽佣比例是：${commissionRate}%`);
+    // 你可以在这里保存提交的数据，或者执行其他操作
+    this.closePopup();  // 确认后关闭弹窗
+  },
+  // 点击“设价”按钮，显示弹窗
+  showCommissionRatePop() {
+    this.setData({ showCommissionRatePop: true });
+  },
+
+  // 关闭弹窗（包括遮罩点击和取消按钮）
+  closeCommissionRatePop() {
+    this.setData({ showCommissionRatePop: false });
+  },
+
+  // 确认按钮回调
+  handleCommissionRateConfirm(e) {
+    const { agentPrice, commissionRate, pricingMethod } = e.detail;
+    console.log('设置数据:', agentPrice, commissionRate, pricingMethod);
+    this.closeCommissionRatePop();
   },
   gotoSubCommission() {
     wx.navigateTo({

pages/personCenter/commissionSetting/commissionSetting.json

@@ -1,3 +1,6 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "commissionPop": "/pages/personCenter/component/commissionPop/commissionPop",
+    "commissionRatePop": "/pages/personCenter/component/commissionRatePop/commissionRatePop"
+  }
 }

pages/personCenter/commissionSetting/commissionSetting.wxml

@@ -1,5 +1,5 @@
 <view class="flex-col page">
-  <view class="flex-row justify-between items-center section">
+  <view class="flex-row justify-between items-center section" bindtap="showPopup">
     <view class="flex-row items-center">
       <image
         class="shrink-0 image"
@@ -54,7 +54,7 @@
           >
             <text class="font_6 text_6 pos">3.6元购买</text>
             <text class="font_7 text_9">0.30/0.30/0.00%</text>
-            <view class="flex-row group_5 pos_2">
+            <view class="flex-row group_5 pos_2" bindtap="showCommissionRatePop">
               <image
                 class="image_4 image_6"
                 src="https://ide.code.fun/api/image?token=68368d354ae84d001230f4d1&name=2994ec01c6859d93ce653a6cb3d50301.png"
@@ -67,3 +67,12 @@
     </view>
   </view>
 </view>
+ <!-- 弹窗组件 -->
+ <commissionPop show="{{showPopup}}" bind:close="closePopup" bind:submit="handleCommissionSubmit" />
+ <!-- 弹窗组件 -->
+<commissionRatePop
+  show="{{showCommissionRatePop}}"
+  bind:cancel="closeCommissionRatePop"
+  bind:close="closeCommissionRatePop"
+  bind:confirm="handleCommissionRateConfirm"
+/>

pages/personCenter/component/InvitationCodePop/InvitationCodePop.js

@@ -1,24 +1,32 @@
-// pages/personCenter/component/InvitationCodePop/InvitationCodePop.js
 Component({
-
-  /**
-   * 组件的属性列表
-   */
   properties: {
-
+    // 接收传递进来的二维码图片路径
+    show: {           // 控制显示/隐藏
+      type: Boolean,
+      value: false
+    },
+    qrcode: {
+      type: String,
+      value: ""
+    },
   },
 
-  /**
-   * 组件的初始数据
-   */
   data: {
-
+    closeIcon: "./images/cha.png",  // 关闭按钮的图标
   },
 
-  /**
-   * 组件的方法列表
-   */
   methods: {
+    // 关闭弹窗
+    close() {
+      // 触发关闭弹窗事件
+      this.triggerEvent('close');
+    },
 
+    // 预览二维码
+    previewQrcode() {
+      wx.previewImage({
+        urls: [this.data.qrcode],  // 预览图片
+      });
+    }
   }
-})
+});

pages/personCenter/component/InvitationCodePop/InvitationCodePop.wxml

@@ -6,8 +6,8 @@
   <!-- 弹窗内容 -->
   <view class="flex-col page" wx:if="{{show}}">
     <view class="flex-col self-stretch section">
-      <text class="self-center text">作业码</text>
+      <text class="self-center text">邀请码</text>
-      <text class="self-center font text_2 mt-23">引导用户通过扫描此码来完成相应的任务</text>
+      <text class="self-center font text_2 mt-23">分享邀请码，邀请好友一起赚钱</text>
       <view class="flex-col self-stretch group mt-23">
         <image
           class="self-center image"
@@ -16,9 +16,6 @@
         />
         <view class="mt-20 flex-col items-start self-stretch">
           <text class="font text_3">点击二维码放大，长按保存</text>
-          <view class="flex-col justify-start items-center text-wrapper mt-19" bindtap="copyLink">
-            <text class="font text_4">复制推广链接</text>
-          </view>
         </view>
       </view>
     </view>

pages/personCenter/component/InvitationCodePop/InvitationCodePop.wxss

@@ -1,4 +1,4 @@
-@import "../../../app.wxss";
+@import "../../../../app.wxss";
 
 .mt-23 {
   margin-top: 53.57rpx;

pages/personCenter/component/commissionPop/commissionPop.js

@@ -1,24 +1,57 @@
-// pages/personCenter/component/commissionPop/commissionPop.js
 Component({
 
   /**
    * 组件的属性列表
    */
   properties: {
-
+    show: {
+      type: Boolean,
+      value: false,
+    },
   },
 
   /**
    * 组件的初始数据
    */
   data: {
-
+    commissionRate: "",  // 用户输入的抽佣比例
   },
 
   /**
    * 组件的方法列表
    */
   methods: {
+    // 获取用户输入的比例
+    handleInput(e) {
+      this.setData({
+        commissionRate: e.detail.value,
+      });
+    },
 
-  }
+    // 提交设置
+    submit() {
+      const rate = parseFloat(this.data.commissionRate);
+
+        if (isNaN(rate) || rate <= 0 || rate > 5) {
+          wx.showToast({
+            title: `请输入有效的比例，最大为 5%`,
+            icon: 'none',
+          });
+          return;
+        }
+
+        // 触发父组件的事件，将设置的比例传递出去
+        this.triggerEvent('submit', {
+          commissionRate: rate,
+        });
+
+        // 关闭弹窗
+        this.triggerEvent('close');
+      },
+
+      // 关闭弹窗
+      close() {
+        this.triggerEvent('close');
+      }
+   }
 })

pages/personCenter/component/commissionPop/commissionPop.wxml

@@ -1,16 +1,19 @@
-<view class="flex-col section">
+<view wx:if="{{show}}" class="popup-wrapper">
-  <text class="self-center text">一键设置</text>
+  <view class="promo-mask" bindtap="close"></view>
-  <view class="flex-col self-stretch mt-36">
+  <view class="flex-col section popup-content">
-    <view class="flex-row justify-between items-baseline self-stretch">
+    <text class="self-center text">一键设置</text>
-      <input class="font text_2" placeholder="请设置抽佣比例" />
+    <view class="flex-col self-stretch mt-36">
-      <text class="font text_3">%</text>
+      <view class="flex-row justify-between items-baseline self-stretch">
-    </view>
+        <input class="font text_2" placeholder="请设置抽佣比例" bindinput="handleInput" />
-    <view class="self-start group mt-17">
+        <text class="font text_3">%</text>
-      <text class="font_2 text_4">注意：最高抽成比例</text>
+      </view>
-      <text class="font_2 text_5">5%</text>
+      <view class="self-start group mt-17">
-    </view>
+        <text class="font_2 text_4">注意：最高抽成比例</text>
-    <view class="flex-col justify-start items-center self-center text-wrapper mt-17">
+        <text class="font_2 text_5">5%</text>
-      <text class="font_2 text_6">确认设置</text>
+      </view>
+      <view class="flex-col justify-start items-center self-center text-wrapper mt-17" bindtap="submit">
+        <text class="font_2 text_6">确认设置</text>
+      </view>
     </view>
   </view>
 </view>

pages/personCenter/component/commissionPop/commissionPop.wxss

@@ -1,3 +1,4 @@
+@import "../../../../app.wxss";
 .mt-17 {
   margin-top: 31.88rpx;
 }
@@ -51,3 +52,31 @@
   color: #ffffff;
   line-height: 20.83rpx;
 }
+/* 弹窗整体容器，覆盖全屏，层级最高，居中弹窗 */
+.popup-wrapper {
+  position: fixed;
+  top: -15%; left: 0; right: 0; bottom: 0;
+  z-index: 10000;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: transparent; /* 透明，遮罩层单独控制 */
+}
+
+/* 遮罩层，覆盖全屏半透明黑色 */
+.promo-mask {
+  position: fixed;
+  top: 0; left: 0; right: 0; bottom: 0;
+  background: rgba(0,0,0,0.45);
+  z-index: 9999;
+}
+
+/* 弹窗内容的容器，承载你现有的.section */
+.popup-content {
+  position: relative;
+  z-index: 10001; /* 比遮罩层高 */
+  max-width: 90vw;
+  width: 600rpx;  /* 你可以根据需求调整 */
+  max-height: 90vh;
+  overflow-y: auto; /* 超高时滚动 */
+}

pages/personCenter/component/commissionRatePop/commissionRatePop.js

@@ -1,24 +1,28 @@
-// pages/personCenter/component/commissionRatePop/commissionRatePop.js
 Component({
-
   /**
    * 组件的属性列表
    */
   properties: {
-
+    show: {           // 控制显示/隐藏
-  },
+      type: Boolean,
-
+      value: false
-  /**
+    },
-   * 组件的初始数据
-   */
-  data: {
-
   },
 
   /**
    * 组件的方法列表
    */
   methods: {
-
+    close() {
+      this.triggerEvent('close');
+    },
+    cancel() {
+      this.triggerEvent('cancel');
+    },
+    confirm() {
+      // 触发confirm事件带数据
+      this.triggerEvent('confirm', {/*数据*/});
+    },
   }
 })
+

pages/personCenter/component/commissionRatePop/commissionRatePop.wxml

@@ -1,45 +1,50 @@
-<view class="flex-col section">
+<view wx:if="{{show}}" class="popup-wrapper">
-  <text class="self-center font text">代理价设置</text>
+  <view class="promo-mask" bindtap="close"></view>
-  <view class="flex-col self-stretch mt-24">
+    <view class="flex-col section popup-content">
-    <view class="flex-col">
+      <text class="self-center font text">代理价设置</text>
-      <text class="self-start font_2 text_2">我的价格0.30，我的抽成0.17元</text>
+      <view class="flex-col self-stretch mt-24">
-      <view class="flex-col self-stretch section_2 mt-13">
+        <view class="flex-col">
-        <view class="flex-row justify-between items-center">
+          <text class="self-start font_2 text_2">我的价格0.30，我的抽成0.17元</text>
-          <text class="font_2 text_4">结算标准</text>
+          <view class="flex-col self-stretch section_2 mt-13">
-          <text class="font_2 text_3">3.6元购买30元券包3.6元购买</text>
+            <view class="flex-row justify-between items-center">
-        </view>
+              <text class="font_2 text_4">结算标准</text>
-        <view class="flex-row justify-between items-center group">
+              <text class="font_2 text_3">3.6元购买30元券包3.6元购买</text>
-          <text class="font_2 text_5">代理价</text>
+            </view>
-          <view class="flex-col justify-start items-start text-wrapper">
+            <view class="flex-row justify-between items-center group">
-            <input class="text_6 font" placeholder="0.30" />
+              <text class="font_2 text_5">代理价</text>
+              <view class="flex-col justify-start items-start text-wrapper">
+                <input class="text_6 font" placeholder="0.30" />
+              </view>
+            </view>
+            <view class="flex-row justify-between items-center group_2">
+              <text class="font_2 text_7">抽成比例</text>
+              <view class="flex-col justify-start items-start text-wrapper">
+                <input class="text_8 font" placeholder="0.30" />
+              </view>
+            </view>
+
+            <view class="flex-row justify-between items-center group_3">
+              <text class="font_2 text_10">设价方式</text>
+                <radio-group class="flex-col group_4">
+                  <view class="flex-row items-center">
+                    <radio class="radio" color="#FF8D1A"></radio>
+                    <text class="font_2 text_9 ml-7">代理价</text>
+                  </view>
+                  <view class="flex-row items-center mt-14">
+                    <radio class="radio_1" color="#FF8D1A"></radio>
+                    <text class="font_2 text_11 ml-7">抽成比例</text>
+                  </view>
+                </radio-group>
+            </view>
+
           </view>
         </view>
-        <view class="flex-row justify-between items-center group_2">
+        <view class="flex-col items-center mt-22">
-          <text class="font_2 text_7">抽成比例</text>
+          <view class="flex-col justify-start items-center text-wrapper_2"><text class="font_3 text_12">确定</text></view>
-          <view class="flex-col justify-start items-start text-wrapper">
+          <view class="flex-col justify-start items-center text-wrapper_3 mt-12">
-            <input class="text_8 font" placeholder="0.30" />
+            <text class="font_3 text_13">取消</text>
           </view>
         </view>
-        <view class="flex-row justify-between items-center group_3">
-          <text class="font_2 text_10">设价方式</text>
-          <radio-group class="flex-col group_4">
-            <view class="flex-row items-center">
-              <radio class="radio"></radio>
-              <text class="font_2 text_9 ml-7">代理价</text>
-            </view>
-            <view class="flex-row items-center mt-14">
-              <radio class="radio_1"></radio>
-              <text class="font_2 text_11 ml-7">抽成比例</text>
-            </view>
-          </radio-group>
-        </view>
-      </view>
-    </view>
-    <view class="flex-col items-center mt-22">
-      <view class="flex-col justify-start items-center text-wrapper_2"><text class="font_3 text_12">确定</text></view>
-      <view class="flex-col justify-start items-center text-wrapper_3 mt-12">
-        <text class="font_3 text_13">取消</text>
       </view>
     </view>
   </view>
-</view>

pages/personCenter/component/commissionRatePop/commissionRatePop.wxss

@@ -1,3 +1,4 @@
+@import "../../../../app.wxss";
 .mt-13 {
   margin-top: 24.38rpx;
 }
@@ -40,11 +41,10 @@
 }
 .text-wrapper {
   margin-right: 12.02rpx;
-  padding: 17.89rpx 0 13.73rpx;
+  padding: 13.89rpx 0 9.73rpx;
   background-color: #ffffff;
   border-radius: 9.38rpx;
   width: 211.88rpx;
-  height: 54.38rpx;
 }
 .text_6 {
   margin-left: 16.5rpx;
@@ -116,3 +116,37 @@
   width: 30rpx;
   height: 30rpx;
 }
+
+radio {
+  transform: scale(0.8); /* 调整为你需要的缩放比例 */
+}
+
+/* 弹窗外围容器，覆盖全屏并居中 */
+.popup-wrapper {
+  position: fixed;
+  top: -10%; left: 0; right: 0; bottom: 0;
+  z-index: 10000;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: transparent; /* 遮罩层单独负责 */
+}
+
+/* 遮罩层 */
+.promo-mask {
+  position: fixed;
+  top: 0; left: 0; right: 0; bottom: 0;
+  background: rgba(0,0,0,0.45);
+  z-index: 9999;
+}
+
+/* 弹窗内容容器，使用你现有的.section样式 */
+.popup-content {
+  position: relative;
+  z-index: 10001;
+  max-width: 90vw;
+  width: 600rpx; /* 你可以根据需求调整 */
+  max-height: 90vh;
+  overflow-y: auto; /* 高度超出时滚动 */
+}
+

pages/personCenter/mine/mine.js

@@ -16,7 +16,22 @@ Page({
     currentBalance: "", // 当前余额
     withdrawalAmount: "",   // 提现中的余额
     withdrawnAmount: "",    // 已提现的余额
-    totalIncome:""    // 累计收入
+    totalIncome:"",    // 累计收入
+    showPopup: false,  // 控制弹窗显示与否
+    qrcode: "https://img.picui.cn/free/2025/05/29/6837c53582068.gif",  // 设置二维码图片的路径
+  },
+  // 点击二维码时，显示弹窗
+  showPromoPopup() {
+    this.setData({
+      showPopup: true
+    });
+  },
+
+  // 关闭弹窗
+  closePopup() {
+    this.setData({
+      showPopup: false
+    });
   },
   myteam(){
     wx.navigateTo({

pages/personCenter/mine/mine.json

@@ -1,3 +1,5 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "InvitationCodePop": "/pages/personCenter/component/InvitationCodePop/InvitationCodePop"
+  }
 }

pages/personCenter/mine/mine.wxml

@@ -25,6 +25,7 @@
           class="image_2"
           src="./images/erweima.png"
           mode="aspectFill"
+          bindtap="showPromoPopup"
         />
         <text class="font_3 text_4 mt-6">二维码邀请</text>
       </view>
@@ -165,3 +166,6 @@
     </view>
   </view>
 </view>
+
+<!-- 调用弹窗组件 -->
+<InvitationCodePop show="{{showPopup}}" bind:close="closePopup" qrcode="{{qrcode}}"/>

pages/personCenter/subCommissionSetting/subCommissionSetting.js

@@ -7,6 +7,24 @@ Page({
   data: {
     items_1: [null, null, null],
     items: [null, null],
+    showCommissionRatePop: false,
+  },
+  
+  // 点击“设价”按钮，显示弹窗
+  showCommissionRatePop() {
+    this.setData({ showCommissionRatePop: true });
+  },
+
+  // 关闭弹窗（包括遮罩点击和取消按钮）
+  closeCommissionRatePop() {
+    this.setData({ showCommissionRatePop: false });
+  },
+
+  // 确认按钮回调
+  handleCommissionRateConfirm(e) {
+    const { agentPrice, commissionRate, pricingMethod } = e.detail;
+    console.log('设置数据:', agentPrice, commissionRate, pricingMethod);
+    this.closeCommissionRatePop();
   },
 
   /**

pages/personCenter/subCommissionSetting/subCommissionSetting.json

@@ -1,3 +1,5 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "commissionRatePop": "/pages/personCenter/component/commissionRatePop/commissionRatePop"
+  }
 }

pages/personCenter/subCommissionSetting/subCommissionSetting.wxml

@@ -28,7 +28,7 @@
           >
             <text class="font_5 text_5">3.6元购买30元</text>
             <text class="shrink-0 font_2 text_8">0.30/0.00%</text>
-            <view class="flex-row shrink-0 group_2">
+            <view class="flex-row shrink-0 group_2" bindtap="showCommissionRatePop">
               <image
                 class="image_2"
                 src="https://ide.code.fun/api/image?token=68368d354ae84d001230f4d1&name=2994ec01c6859d93ce653a6cb3d50301.png"
@@ -41,3 +41,10 @@
     </view>
   </view>
 </view>
+ <!-- 弹窗组件 -->
+ <commissionRatePop
+  show="{{showCommissionRatePop}}"
+  bind:cancel="closeCommissionRatePop"
+  bind:close="closeCommissionRatePop"
+  bind:confirm="handleCommissionRateConfirm"
+/>

pages/personCenter/withdrawalAccount/withdrawalAccount.js

@@ -7,7 +7,11 @@ Page({
   data: {
 
   },
-
+  gotoEditBankCardInfo() {
+    wx.navigateTo({
+      url: '/pages/personCenter/bindBankCard/bindBankCard',
+    })
+  },
   /**
    * 生命周期函数--监听页面加载
    */

pages/personCenter/withdrawalAccount/withdrawalAccount.wxml

@@ -8,20 +8,26 @@
       <text class="font text">姓名</text>
       <text class="font text_2">陈新知</text>
     </view>
-    <view class="flex-col mt-25">
+    <view class="flex-row justify-between items-center group_2 mt-27">
-      <view class="flex-row justify-between items-center">
+      <text class="font text_3">手机号</text>
-        <text class="font text_3">支付宝账号</text>
+      <text class="font_2 text_4">15888610253</text>
-        <text class="font_2 text_4">15888610253</text>
+    </view>
+    <view class="flex-col mt-27">
+      <view class="flex-row justify-between items-center group_3">
+        <text class="font">身份证号</text>
+        <text class="font_2">33100420******50910</text>
       </view>
-      <view class="flex-row justify-between items-center group_3 mt-21">
+      <view class="flex-row justify-between items-center group_4">
-        <text class="font text_6">开户银行</text>
+        <text class="font">开户银行</text>
         <text class="font_2 text_5">浙江省台州市中国工商银行台州蓬街支行</text>
       </view>
     </view>
-    <view class="flex-row justify-between mt-25">
+    <view class="flex-row justify-between mt-27">
-      <text class="font text_7">银行卡号</text>
+      <text class="font text_6">银行卡号</text>
       <text class="font_2">62220********363442</text>
     </view>
   </view>
-  <view class="flex-col justify-start items-center self-center text-wrapper"><text class="text_8">修改账户</text></view>
+  <view class="flex-col justify-start items-center self-center text-wrapper" bind:tap="gotoEditBankCardInfo">
+    <text class="font text_7">修改账户</text>
+  </view>
 </view>

pages/personCenter/withdrawalAccount/withdrawalAccount.wxss

@@ -1,11 +1,8 @@
-.mt-25 {
+.mt-27 {
-  margin-top: 46.88rpx;
+  margin-top: 50.63rpx;
-}
-.mt-21 {
-  margin-top: 39.38rpx;
 }
 .page {
-  padding: 99.38rpx 41.25rpx 826.88rpx 56.25rpx;
+  padding: 65.63rpx 37.5rpx 701.25rpx 58.13rpx;
   background-color: #ffffff;
   width: 100%;
   overflow-y: auto;
@@ -17,65 +14,63 @@
   height: 176.25rpx;
 }
 .group {
-  margin-top: 90rpx;
+  margin-top: 82.5rpx;
 }
 .group_2 {
   padding-bottom: 41.25rpx;
   border-bottom: solid 1.88rpx #d1d1d1;
 }
 .font {
-  font-size: 26.25rpx;
+  font-size: 30rpx;
   font-family: SourceHanSansCN;
-  line-height: 24.36rpx;
+  line-height: 27.94rpx;
   color: #615151;
 }
 .text {
-  line-height: 24.21rpx;
+  line-height: 27.66rpx;
 }
 .text_2 {
   margin-right: 11.25rpx;
   color: #000000;
+  line-height: 27.84rpx;
 }
 .text_3 {
-  line-height: 24.49rpx;
+  line-height: 27.6rpx;
 }
 .font_2 {
-  font-size: 26.25rpx;
+  font-size: 30rpx;
   font-family: SourceHanSansCN;
-  line-height: 21.24rpx;
+  line-height: 24.26rpx;
   color: #000000;
 }
 .text_4 {
-  margin-right: 7.5rpx;
+  margin-right: 3.75rpx;
-  line-height: 19.93rpx;
+  line-height: 22.76rpx;
 }
 .group_3 {
+  padding-bottom: 41.25rpx;
+}
+.group_4 {
   margin-right: 11.25rpx;
-  padding: 26.25rpx 0 15rpx;
+  padding: 30rpx 0;
   border-top: solid 1.88rpx #d1d1d1;
   border-bottom: solid 1.88rpx #d1d1d1;
 }
-.text_6 {
-  line-height: 24.43rpx;
-}
 .text_5 {
-  margin-right: 3.75rpx;
+  line-height: 35.63rpx;
-  line-height: 31.88rpx;
+  text-align: right;
   width: 418.13rpx;
 }
-.text_7 {
+.text_6 {
-  line-height: 24.26rpx;
+  line-height: 27.71rpx;
 }
 .text-wrapper {
-  margin-top: 101.25rpx;
+  margin-top: 105rpx;
   padding: 26.25rpx 0;
   background-color: #ff8d1a;
   border-radius: 18.75rpx;
   width: 243.75rpx;
 }
-.text_8 {
+.text_7 {
   color: #ffffff;
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.94rpx;
 }