充值优化

hdApp/src/admin/member/detail.vue

@@ -166,52 +166,128 @@
       </template>
     </modal-module>
 
-    <modal-module :show="rechargeModal" @click="toRecharge" :maskClosable="false" title="充值" padding="30rpx 30rpx" >
-      <template v-slot:content>
-        <div class="app-modal-input-wrap">
-          <div class="inp-list-line">
-            <div class="line-label">充值金额</div>
-            <div class="line-input">
-              <input type="digit" placeholder="请输入金额" v-model="rForm.rechargeAmount" :adjust-position="false" class="inp-input" style="text-align:center;" />
-            </div>
-          </div>
-          <div class="inp-list-line" style="margin-top:35upx;">
-						<div class="line-label">付款方式</div>
-						<div class="line-input">
-                <button style="margin-right:2upx;" class="admin-button-com middle" :class="[rForm.rechargePayWay == 0 ? 'blue' : '']" @click="rForm.rechargePayWay = 0">微 信</button>
-                <button style="margin-right:2upx;" class="admin-button-com middle" :class="[rForm.rechargePayWay == 1 ? 'blue' : '']" @click="rForm.rechargePayWay = 1">支付宝</button>
-                <button style="margin-right:2upx;" class="admin-button-com middle" :class="[rForm.rechargePayWay == 4 ? 'blue' : '']" @click="rForm.rechargePayWay = 4">现 金</button>
-                <button class="admin-button-com middle" :class="[rForm.rechargePayWay == 5 ? 'blue' : '']" @click="rForm.rechargePayWay = 5">银行卡</button>
-						</div>
-					</div>
-          <div class="inp-list-line">
-            <div class="line-label"></div>
-            <div class="line-input">
-            <input type="text" style="text-align:center;margin-top:40upx;font-size:32upx;" v-model="rForm.rechargeRemark" class="inp-input" placeholder="这里写备注" />
-            </div>
-          </div>
+    <!-- 充值弹框 - 使用uni-popup替代 -->
+    <uni-popup ref="rechargePopupRef" background-color="#fff" type="center" :animation="true" :mask-click="false">
+      <view class="recharge-popup-container">
+        <!-- 弹框头部 -->
+        <view class="popup-header">
+          <text class="popup-title">充值</text>
+          <view class="popup-close" @click="closeRechargePopup">
+            <text class="close-icon">×</text>
+          </view>
+        </view>
+        
+        <!-- 弹框内容 -->
+        <scroll-view class="popup-content" scroll-y="true" :style="{maxHeight: '60vh'}">
+          <!-- 充值金额输入 -->
+          <view class="input-section">
+            <view class="input-label">充值金额</view>
+            <view class="input-wrapper">
+              <input 
+                type="digit" 
+                placeholder="请输入金额" 
+                v-model="rForm.rechargeAmount" 
+                :adjust-position="false" 
+                class="amount-input" 
+              />
+            </view>
+          </view>
+
+          <!-- 付款方式 -->
+          <view class="input-section">
+            <view class="input-label">付款方式</view>
+                         <view class="payment-buttons">
+               <button 
+                 class="admin-button-com middle" 
+                 :class="[rForm.rechargePayWay == 0 ? 'blue' : 'default']" 
+                 @click="rForm.rechargePayWay = 0"
+               >微信</button>
+               <button 
+                 class="admin-button-com middle" 
+                 :class="[rForm.rechargePayWay == 1 ? 'blue' : 'default']" 
+                 @click="rForm.rechargePayWay = 1"
+               >支付宝</button>
+               <button 
+                 class="admin-button-com middle" 
+                 :class="[rForm.rechargePayWay == 4 ? 'blue' : 'default']" 
+                 @click="rForm.rechargePayWay = 4"
+               >现金</button>
+               <button 
+                 class="admin-button-com middle" 
+                 :class="[rForm.rechargePayWay == 5 ? 'blue' : 'default']" 
+                 @click="rForm.rechargePayWay = 5"
+               >银行卡</button>
+             </view>
+          </view>
 
-          <view v-if="rechargeWeal == 1" style="font-size:28upx;">
-            <view v-for="(item,index) in weal" :key="index" style="margin-top:42upx;">
-              <view @click="getRecharge(item.recharge)">
-                充值{{ item.recharge }}元 升{{ item.name }} （{{item.discount*100}}折）
-                <text style="margin-left:10upx;color:#3385FF;font-weight:bold;">选这个</text>
-              </view>
+          <!-- 备注输入 -->
+          <view class="input-section">
+            <view class="input-label">备注</view>
+            <view class="input-wrapper">
+              <input 
+                type="text" 
+                v-model="rForm.rechargeRemark" 
+                class="remark-input" 
+                placeholder="这里写备注" 
+              />
             </view>
           </view>
 
-          <view v-if="rechargeWeal == 2" style="font-size:28upx;">
-            <view v-for="(item,index) in weal" :key="index" style="margin-top:42upx;">
-              <view @click="getRecharge(item.recharge)">
-                充值{{ item.recharge }}元 送{{ item.give }}元
-                <text style="margin-left:10upx;color:#3385FF;font-weight:bold;">选这个</text>
-              </view>
+                     <!-- 充值升级优惠 -->
+           <view v-if="rechargeWeal == 1" class="recharge-options">
+             <view class="options-title">充值优惠方案：</view>
+             <view v-for="(item,index) in weal" :key="index" class="option-item">
+               <button 
+                 @click="getRecharge(item.recharge)"
+                 class="admin-button-com big"
+                 :class="[rForm.rechargeAmount == item.recharge ? 'blue' : 'default']"
+                 style="width:100%;text-align:left;justify-content:space-between;"
+               >
+                <view class="option-content">
+                  <view class="option-left">
+                    <text class="recharge-amount">充值{{ item.recharge }}元</text>
+                    <text class="upgrade-info">升{{ item.name }}</text>
+                    <text class="discount-info">（{{item.discount*100}}折）</text>
+                  </view>
+                  <view class="option-right">
+                    {{ rForm.rechargeAmount == item.recharge ? '✓' : '选择' }}
+                  </view>
+                </view>
+              </button>
             </view>
           </view>
 
-        </div>
-      </template>
-    </modal-module>
+                     <!-- 充值送金额 -->
+           <view v-if="rechargeWeal == 2" class="recharge-options">
+             <view class="options-title">充值优惠方案：</view>
+             <view v-for="(item,index) in weal" :key="index" class="option-item">
+               <button 
+                 @click="getRecharge(item.recharge)"
+                 class="admin-button-com big"
+                 :class="[rForm.rechargeAmount == item.recharge ? 'blue' : 'default']"
+                 style="width:100%;text-align:left;justify-content:space-between;"
+               >
+                <view class="option-content">
+                  <view class="option-left">
+                    <text class="recharge-amount">充值{{ item.recharge }}元</text>
+                    <text class="give-info">送{{ item.give }}元</text>
+                  </view>
+                  <view class="option-right">
+                    {{ rForm.rechargeAmount == item.recharge ? '✓' : '选择' }}
+                  </view>
+                </view>
+              </button>
+            </view>
+          </view>
+        </scroll-view>
+        
+                 <!-- 弹框底部按钮 -->
+         <view class="popup-footer">
+           <button class="admin-button-com middle" @click="closeRechargePopup">取消</button>
+           <button class="admin-button-com middle blue" @click="confirmRecharge">确认充值</button>
+         </view>
+      </view>
+    </uni-popup>
     
     <modal-module :show="passwordModal" @click="passwordModalClick" :maskClosable="false" title="重置密码" padding="30rpx 30rpx" >
       <template v-slot:content>
@@ -358,13 +434,13 @@ export default {
             this.reduceShow = true
           }
         },
-        {
-          name: "充值",
-          icon: "iconzeng",
-          funtion: () => {
-			      this.rechargeModal = true
-          }
-        },
+                 {
+           name: "充值",
+           icon: "iconzeng",
+           funtion: () => {
+ 			      this.openRechargePopup()
+           }
+         },
         {
           name: "改密码",
           icon: "iconbianji",
@@ -459,34 +535,40 @@ export default {
 		getRecharge(amount){
 			this.rForm.rechargeAmount = amount
 		},
-    toRecharge(e){
-      if(e.index === 0){
-        this.rechargeModal = false
-        return false
-      }
-      if (this.$util.isEmpty(this.rForm.rechargeAmount)){
-        this.$msg('请填写充值金额')
-        return false
-      }
-      if(Number(this.rForm.rechargeAmount)<0){
-        this.$msg('充值金额要大于0')
-        return false
-      }
-      this.$util.confirmModal({content:'确认充值？'},() => {
-        uni.showLoading({mask:true})
-        toManRecharge({amount:this.rForm.rechargeAmount,remark:this.rForm.rechargeRemark,payWay:this.rForm.rechargePayWay,customId:this.option.id}).then(res=>{
-          uni.hideLoading()
-          if(res.code == 1){
-            this.rechargeModal = false
-            this.$msg('充值成功')
-            this.rForm.rechargeAmount = ''
-            this.rForm.rechargeRemark = ''
-            this.rForm.rechargePayWay = 0
-            this.init()
-          }
-        })
-      })
-    },
+         // 打开充值弹框
+     openRechargePopup(){
+       this.$refs.rechargePopupRef.open('center')
+     },
+     // 关闭充值弹框
+     closeRechargePopup(){
+       this.$refs.rechargePopupRef.close()
+       // 重置表单
+       this.rForm.rechargeAmount = ''
+       this.rForm.rechargeRemark = ''
+       this.rForm.rechargePayWay = 0
+     },
+     // 确认充值
+     confirmRecharge(){
+       if (this.$util.isEmpty(this.rForm.rechargeAmount)){
+         this.$msg('请填写充值金额')
+         return false
+       }
+       if(Number(this.rForm.rechargeAmount)<0){
+         this.$msg('充值金额要大于0')
+         return false
+       }
+       this.$util.confirmModal({content:'确认充值？'},() => {
+         uni.showLoading({mask:true})
+         toManRecharge({amount:this.rForm.rechargeAmount,remark:this.rForm.rechargeRemark,payWay:this.rForm.rechargePayWay,customId:this.option.id}).then(res=>{
+           uni.hideLoading()
+           if(res.code == 1){
+             this.closeRechargePopup()
+             this.$msg('充值成功')
+             this.init()
+           }
+         })
+       })
+     },
     callMobile() {
       uni.makePhoneCall({ phoneNumber:this.data.mobile })
     },
@@ -905,14 +987,156 @@ export default {
     }
   }
 }
-.user_tag{
-  border:1px solid #CCCCCC;
-  padding:5upx 12upx 5upx 12upx;
-  border-radius:25upx;
-  color:#BBBBBB;
-  margin-right:10upx;
-  margin-bottom:12upx;
-  display:inline-block;
-  font-size:30upx;
-}
+ .user_tag{
+   border:1px solid #CCCCCC;
+   padding:5upx 12upx 5upx 12upx;
+   border-radius:25upx;
+   color:#BBBBBB;
+   margin-right:10upx;
+   margin-bottom:12upx;
+   display:inline-block;
+   font-size:30upx;
+ }
+
+ // 充值弹框样式
+ .recharge-popup-container {
+   width: 98vw;
+   max-width: 600upx;
+   background: #fff;
+   border-radius: 20upx;
+   overflow: hidden;
+   box-shadow: 0 10upx 30upx rgba(0,0,0,0.3);
+ }
+
+ .popup-header {
+   display: flex;
+   justify-content: space-between;
+   align-items: center;
+   padding: 30upx 30upx 20upx;
+   border-bottom: 1upx solid #f0f0f0;
+   background: #fff;
+ }
+
+ .popup-title {
+   font-size: 32upx;
+   font-weight: 600;
+   color: #333;
+ }
+
+ .popup-close {
+   width: 60upx;
+   height: 60upx;
+   display: flex;
+   align-items: center;
+   justify-content: center;
+   border-radius: 50%;
+   background: #f8f9fa;
+ }
+
+ .close-icon {
+   font-size: 40upx;
+   color: #999;
+   line-height: 1;
+ }
+
+ .popup-content {
+   padding: 30upx;
+   background: #fff;
+ }
+
+ .input-section {
+   margin-bottom: 30upx;
+ }
+
+ .input-label {
+   font-size: 28upx;
+   color: #333;
+   margin-bottom: 15upx;
+   font-weight: 500;
+ }
+
+ .input-wrapper {
+   position: relative;
+ }
+
+ .amount-input, .remark-input {
+   width: 100%;
+   height: 80upx;
+   padding: 0 20upx;
+   border: 2upx solid #e9ecef;
+   border-radius: 12upx;
+   font-size: 28upx;
+   text-align: center;
+   background: #fff;
+   box-sizing: border-box;
+ }
+
+ .amount-input:focus, .remark-input:focus {
+   border-color: #3385FF;
+   background: #f8f9fa;
+ }
+
+ .payment-buttons {
+   display: flex;
+   flex-wrap: wrap;
+   gap: 12upx;
+ }
+
+ .recharge-options {
+   margin-top: 20upx;
+ }
+
+ .options-title {
+   font-size: 26upx;
+   color: #666;
+   margin-bottom: 20upx;
+ }
+
+ .option-item {
+   margin-bottom: 15upx;
+ }
+
+ .option-content {
+   display: flex;
+   justify-content: space-between;
+   align-items: center;
+ }
+
+ .option-left {
+   display: flex;
+   align-items: center;
+   flex-wrap: wrap;
+   gap: 10upx;
+ }
+
+ .recharge-amount {
+   font-weight: 500;
+   font-size: 26upx;
+   color: #333;
+ }
+
+ .upgrade-info {
+   font-size: 24upx;
+   color: #666;
+ }
+
+ .discount-info, .give-info {
+   font-size: 24upx;
+   color: #ff6b35;
+   font-weight: bold;
+ }
+
+ .option-right {
+   color: #3385FF;
+   font-size: 24upx;
+   font-weight: bold;
+ }
+
+   .popup-footer {
+    display: flex;
+    gap: 20upx;
+    padding: 30upx;
+    background: #fff;
+    border-top: 1upx solid #f0f0f0;
+  }
 </style>

mallApp/src/pages/settle/debt.vue

@@ -18,7 +18,7 @@
         <AppWrapperEmpty title="暂无数据" :is-empty="$util.isEmpty(detailsList)" />
       </block>
     </view>
-    <view class="bar-view">
+    <view :class="device == 'ios' ? 'ios-bar-view':'android-bar-view'">
       <template>
         <view class="info-view">
           <view class="details-select" @click="checkAllFn" >
@@ -57,7 +57,8 @@ export default {
 			searchTime:'',
 			startTime:'',
 			endTime:'',
-      hdId:0
+      hdId:0,
+      device:'android'
     }
   },
   onPullDownRefresh() {
@@ -98,6 +99,9 @@ export default {
       }
     }
   },
+	onLoad(){
+    this.device = uni.getSystemInfoSync().platform
+	},
   methods: {
 		selectDateFn(val){
 			this.searchTime = val.searchTime
@@ -167,6 +171,7 @@ export default {
     batchConfirm () {
       let arr = []
       let that = this
+      let account = this.option.account?this.option.account:0
       if (this.$util.isEmpty(this.selectList)) {
         this.$msg('请选择订单')
         return false
@@ -188,7 +193,7 @@ export default {
                 that.pageTo({ url: '/admin/clear/list', type: 2})
               })              
             }else{
-              that.pageTo({ url: '/pages/settle/pay?id='+res.data.id, type: 2 })
+              that.pageTo({ url: '/pages/settle/pay?id='+res.data.id+'&account='+account, type: 2 })
             } 
           }
         })
@@ -251,6 +256,93 @@ export default {
     flex: 1;
     padding-bottom: 100upx;
   }
+	.ios-bar-view {
+		bottom: 0;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 0 30upx;
+		width: 100%;
+		height: 100upx;
+		background: #fff;
+		box-shadow: 0upx -1upx 6upx 0upx rgba(4, 0, 0, 0.06);
+		.info-view {
+			display: flex;
+			align-items: center;
+			color: #333;
+			font-size: 24upx;
+			.iconfont {
+				font-size: 32upx;
+				color: #dddddd;
+			}
+			.price {
+				margin: 0 3upx;
+				color: $redColor;
+				font-size: 30upx;
+			}
+			.unit {
+				margin: 0 3upx;
+				color: $redColor;
+				font-size: 30upx;
+			}
+		}
+		.btn-view {
+			display: flex;
+			.admin-button-com {
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin: 0 6upx;
+				width: 200upx;
+				height: 70upx;
+				font-size: 30upx;
+			}
+		}
+	}
+	.android-bar-view {
+		position: fixed;
+		bottom: 0;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 0 30upx;
+		width: 100%;
+		height: 100upx;
+		background: #fff;
+		box-shadow: 0upx -1upx 6upx 0upx rgba(4, 0, 0, 0.06);
+		.info-view {
+			display: flex;
+			align-items: center;
+			color: #333;
+			font-size: 24upx;
+			.iconfont {
+				font-size: 32upx;
+				color: #dddddd;
+			}
+			.price {
+				margin: 0 3upx;
+				color: $redColor;
+				font-size: 30upx;
+			}
+			.unit {
+				margin: 0 3upx;
+				color: $redColor;
+				font-size: 30upx;
+			}
+		}
+		.btn-view {
+			display: flex;
+			.admin-button-com {
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin: 0 6upx;
+				width: 200upx;
+				height: 94upx;
+				font-size: 30upx;
+			}
+		}
+	}
   .bar-view {
     position: fixed;
     bottom: 0;

mallApp/src/pages/settle/pay.vue

@@ -105,7 +105,8 @@ export default {
     },
     getSuccess () {
       let that = this
-      that.pageTo({ url: '/pages/settle/result?id='+that.id,type:2})
+      let account = this.option.account?this.option.account:0
+      that.pageTo({ url: '/pages/settle/result?id='+that.id+'&account='+account,type:2})
     },
     getError () {
     }