|
|
@@ -7,17 +7,40 @@
|
|
|
<view class="title">{{ hdInfo.name?hdInfo.name:'' }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view style="padding:10upx 0 25upx 10upx;font-size:30upx;" v-if="!$util.isEmpty(customInfo)">
|
|
|
- 您好，{{ customInfo.name?customInfo.name:'' }}
|
|
|
- <text v-if="hdInfo.balance >= 0">账户余额：¥{{ hdInfo.balance?parseFloat(hdInfo.balance):0 }}元</text>
|
|
|
- <text v-else>
|
|
|
- 欠账：¥{{ hdInfo.balance?parseFloat(hdInfo.balance):0 }}元
|
|
|
- <text>查看账单</text>
|
|
|
- <text>查看明细</text>
|
|
|
- </text>
|
|
|
+
|
|
|
+ <!-- 用户账户信息区域 -->
|
|
|
+ <view class="account-info-wrap" v-if="!$util.isEmpty(customInfo)">
|
|
|
+ <view class="user-greeting">
|
|
|
+ <text class="greeting-text">您好，{{ customInfo.name?customInfo.name:'' }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="balance-info">
|
|
|
+ <view v-if="hdInfo.balance >= 0" class="balance-item positive">
|
|
|
+ <view class="balance-label">账户余额</view>
|
|
|
+ <view class="balance-amount">¥{{ hdInfo.balance?parseFloat(hdInfo.balance).toFixed(2):0.00 }}</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view v-else class="balance-item negative">
|
|
|
+ <view class="debt-info">
|
|
|
+ <view class="debt-label">当前欠账</view>
|
|
|
+ <view class="debt-amount">¥{{ hdInfo.balance?Math.abs(parseFloat(hdInfo.balance)).toFixed(2):0.00 }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="action-buttons">
|
|
|
+ <view class="action-btn bill-btn" @click="viewBill">
|
|
|
+ <view class="btn-icon bill-icon"></view>
|
|
|
+ <text class="btn-text">查看账单</text>
|
|
|
+ </view>
|
|
|
+ <view class="action-btn detail-btn" @click="viewDetail">
|
|
|
+ <view class="btn-icon chart-icon"></view>
|
|
|
+ <text class="btn-text">查看明细</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
+
|
|
|
<view class="module-com pay-input-wrap">
|
|
|
- <pay-input-module :focus="inpFocus" :num="amount" @focusFn="focusFn" @blurFn="blurFn" @clickKey="clickKeyFn" />
|
|
|
+ <pay-input-module :focus="inpFocus" :num="amount" :hint="hint" @focusFn="focusFn" @blurFn="blurFn" @clickKey="clickKeyFn" />
|
|
|
</view>
|
|
|
|
|
|
<view style="text-align: center;" v-if="hdInfo.balance > 0 && (rechargeWeal == 1 || rechargeWeal == 2)">
|
|
|
@@ -83,11 +106,13 @@ export default {
|
|
|
payCallData: null,
|
|
|
id:0,
|
|
|
salt:'',
|
|
|
+ account:0,
|
|
|
hdInfo:{balance:0},
|
|
|
customInfo:{balance:0},
|
|
|
loginComeBack:0,
|
|
|
rechargeWeal:0,
|
|
|
- weal:[]
|
|
|
+ weal:[],
|
|
|
+ hint:'请输入充值金额'
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -132,9 +157,11 @@ export default {
|
|
|
let that = this
|
|
|
let id = 0
|
|
|
let salt = ''
|
|
|
+ let account = 0
|
|
|
if(this.option.id){
|
|
|
//if(this.option.id && this.option.salt){
|
|
|
id = this.option.id?this.option.id:0
|
|
|
+ account = this.option.account?this.option.account:0
|
|
|
//salt = this.option.salt?this.option.salt:''
|
|
|
}else{
|
|
|
if(this.option.q){
|
|
|
@@ -159,12 +186,16 @@ export default {
|
|
|
}
|
|
|
this.id = id
|
|
|
this.salt = salt
|
|
|
+ this.account = account
|
|
|
|
|
|
getHdInfo({id:this.id}).then(res=>{
|
|
|
let that = this
|
|
|
if(res.code == 1){
|
|
|
that.hdInfo = res.data.hd ? res.data.hd : []
|
|
|
that.customInfo = res.data.custom ? res.data.custom : []
|
|
|
+ if(that.hdInfo.balance < 0){
|
|
|
+ that.hint = '请输入结账金额'
|
|
|
+ }
|
|
|
if (!that.$util.isEmpty(that.customInfo)){
|
|
|
getMemberWeal().then(ret=>{
|
|
|
if(ret.code == 1){
|
|
|
@@ -253,6 +284,12 @@ export default {
|
|
|
this.$util.pageTo({url: '/pages/member/rechargeResult?id='+this.id+'&salt='+this.salt,type: 2})
|
|
|
},
|
|
|
payFail() {
|
|
|
+ },
|
|
|
+ viewBill() {
|
|
|
+ this.pageTo({ url: '/pages/settle/debt?id='+this.id+'&account='+this.account})
|
|
|
+ },
|
|
|
+ viewDetail() {
|
|
|
+ this.$util.pageTo({url: '/pages/member/detail?id='+this.id+'&salt='+this.salt})
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -343,6 +380,173 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ // 用户账户信息区域
|
|
|
+ .account-info-wrap {
|
|
|
+ background-color: #fff;
|
|
|
+ margin: 20upx 20upx;
|
|
|
+ border-radius: 16upx;
|
|
|
+ padding: 30upx;
|
|
|
+ box-shadow: 0 4upx 12upx rgba(0, 0, 0, 0.08);
|
|
|
+
|
|
|
+ .user-greeting {
|
|
|
+ margin-bottom: 24upx;
|
|
|
+ .greeting-text {
|
|
|
+ font-size: 32upx;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .balance-info {
|
|
|
+ .balance-item {
|
|
|
+ &.positive {
|
|
|
+ background: linear-gradient(135deg, #e8f5e8 0%, #f0f9f0 100%);
|
|
|
+ border: 2upx solid #4CAF50;
|
|
|
+ border-radius: 12upx;
|
|
|
+ padding: 24upx;
|
|
|
+
|
|
|
+ .balance-label {
|
|
|
+ font-size: 28upx;
|
|
|
+ color: #666;
|
|
|
+ margin-bottom: 8upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .balance-amount {
|
|
|
+ font-size: 40upx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #4CAF50;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.negative {
|
|
|
+ background: linear-gradient(135deg, #fef2f2 0%, #fef7f7 100%);
|
|
|
+ border: 2upx solid #f56565;
|
|
|
+ border-radius: 12upx;
|
|
|
+ padding: 24upx;
|
|
|
+
|
|
|
+ .debt-info {
|
|
|
+ margin-bottom: 20upx;
|
|
|
+
|
|
|
+ .debt-label {
|
|
|
+ font-size: 28upx;
|
|
|
+ color: #666;
|
|
|
+ margin-bottom: 8upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .debt-amount {
|
|
|
+ font-size: 40upx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #f56565;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .action-buttons {
|
|
|
+ display: flex;
|
|
|
+ gap: 16upx;
|
|
|
+
|
|
|
+ .action-btn {
|
|
|
+ flex: 1;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 8upx;
|
|
|
+ padding: 16upx 12upx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ box-shadow: 0 2upx 8upx rgba(0, 0, 0, 0.1);
|
|
|
+ transition: all 0.3s ease;
|
|
|
+
|
|
|
+ &:active {
|
|
|
+ transform: scale(0.95);
|
|
|
+ box-shadow: 0 1upx 4upx rgba(0, 0, 0, 0.15);
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn-icon {
|
|
|
+ width: 28upx;
|
|
|
+ height: 28upx;
|
|
|
+ margin-right: 8upx;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &.bill-icon {
|
|
|
+ background-color: #3b82f6;
|
|
|
+ border-radius: 4upx;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ top: 6upx;
|
|
|
+ left: 4upx;
|
|
|
+ right: 4upx;
|
|
|
+ height: 2upx;
|
|
|
+ background-color: white;
|
|
|
+ border-radius: 1upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &::after {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ top: 12upx;
|
|
|
+ left: 4upx;
|
|
|
+ width: 12upx;
|
|
|
+ height: 2upx;
|
|
|
+ background-color: white;
|
|
|
+ border-radius: 1upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.chart-icon {
|
|
|
+ border: 1upx solid #8b5cf6;
|
|
|
+ border-radius: 3upx;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 2upx;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ width: 4upx;
|
|
|
+ height: 10upx;
|
|
|
+ background-color: #8b5cf6;
|
|
|
+ margin-right: 2upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &::after {
|
|
|
+ content: '';
|
|
|
+ width: 4upx;
|
|
|
+ height: 16upx;
|
|
|
+ background-color: #8b5cf6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn-text {
|
|
|
+ font-size: 26upx;
|
|
|
+ font-weight: 500;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.bill-btn {
|
|
|
+ border: 2upx solid #3b82f6;
|
|
|
+
|
|
|
+ .btn-text {
|
|
|
+ color: #3b82f6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.detail-btn {
|
|
|
+ border: 2upx solid #8b5cf6;
|
|
|
+
|
|
|
+ .btn-text {
|
|
|
+ color: #8b5cf6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
// 可选优惠
|
|
|
.discount-wrap {
|
|
|
.module-det {
|
