修改组件和接口返回信息

2025-11-05 16:28:25 +08:00
parent 9bfdf0b03e
commit 29bf4dae74
15 changed files with 537 additions and 54 deletions
--- a/src/components/Pay.vue
+++ b/src/components/Pay.vue
@ -0,0 +1,125 @@
+<template>
+    <view class="pay-radio">
+        <wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44" @change="Pay.handleChangePay">
+            <block v-for="(item, index) in PayList" :key="index">
+                <wd-radio :value="item.value">
+                    <view
+                        class="flex justify-between items-center"
+                        v-if="!(hidePlatformBalance && item.type === PayCategory.PlatformBalance) && !(hideStoreBalance && item.type === PayCategory.StoreBalance) && !(hideWechat && item.type === PayCategory.WeChatPay)"
+                    >
+                        <view class="flex items-center">
+                            <wd-img width="50rpx" height="50rpx" :src="`${OSS}${item.icon}`"></wd-img>
+                            <view class="ml-20rpx text-30rpx text-[#303133] leading-42rpx">{{ item.name }}</view>
+                        </view>
+                    </view>
+                    <view class="absolute right-0 top-6rpx right-60rpx" v-if="item.type !== PayCategory.WeChatPay">可用{{ userInfo.user_money }}</view>
+                </wd-radio>
+            </block>
+        </wd-radio-group>
+    </view>
+</template>
+
+<script lang="ts" setup name="RechargeBtn">
+	/**
+	 * Pay 支付组件
+	 * @description 用于展示支付
+     */
+    import { PayList as OriginPayList, PayCategory, PayValue } from '@/utils/pay'
+    import { IUserInfoResult } from '@/api/types/user'
+    import { getUserInfo } from '@/api/user'
+
+	const OSS = inject('OSS')
+    const pay = ref<number>() // 支付方式
+
+    // 当前用户信息
+    const userInfo = reactive<IUserInfoResult>({
+        account: '',
+        avatar: '',
+        create_time: '',
+        has_auth: false,
+        has_password: false,
+        id: 0,
+        mobile: '',
+        nickname: '',
+        real_name: '',
+        sex: '',
+        sn: 0,
+        user_money: '',
+        version: 0
+    })
+
+    onMounted(async () => {
+        // 获取个人用户信息
+        const userRes = await getUserInfo()
+        Object.assign(userInfo, userRes || {})
+
+    })
+
+    const props = defineProps({
+        // 是否隐藏平台余额支付
+        hidePlatformBalance: {
+            type: Boolean,
+            default: false
+        },
+
+        // 是否隐藏门店余额支付
+        hideStoreBalance: {
+            type: Boolean,
+            default: false
+        },
+
+        // 是否隐藏微信支付
+        hideWechat: {
+            type: Boolean,
+            default: false
+        }
+    })
+
+    // 定义emit事件
+    const emit = defineEmits(['pay'])
+    
+    const Pay = {
+        // 支付方式改变
+        handleChangePay(e: {value: number}) {
+            emit('pay', e.value)
+        }
+    }
+
+    const PayList = computed(() => {
+        return OriginPayList.filter(item => {
+            if (props.hidePlatformBalance && item.type === PayCategory.PlatformBalance) return false
+            if (props.hideStoreBalance && item.type === PayCategory.StoreBalance) return false
+            if (props.hideWechat && item.type === PayCategory.WeChatPay) return false
+            return true
+        })
+    })
+
+    watch(PayList, (list) => {
+        if (list.length > 0) {
+            pay.value = list[0].value
+            emit('pay', pay.value )
+        } else {
+            pay.value = undefined
+        }
+        }, { immediate: true })
+        
+</script>
+
+<script lang="ts">
+    export default {}
+</script>
+
+<style lang="scss">
+    .pay-radio {
+        :deep() {
+            .wd-radio {
+                position: relative;
+                margin-bottom: 40rpx;
+            }
+            
+            .wd-radio:last-child {
+                margin-bottom: 0;
+            }
+        }
+    }
+</style>