huangzhenbao/medical-mall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成consumer端同步

Browse Source
This commit is contained in:
huangzhenbao
2026-05-14 15:28:09 +08:00
parent 612fb3d360
commit 0ffbc53902
197 changed files with 92657 additions and 7564 deletions
Download Patch File Download Diff File Expand all files Collapse all files

160
.consumer-sync-backup/20260514-093851/pages/mall/consumer/bank-cards/add.uvue Normal file
View File

@@ -0,0 +1,160 @@
<template>
<view class="add-card-page">
<view class="form-container">
<view class="form-item">
<text class="label">持卡人</text>
<input class="input" type="text" v-model="form.holder_name" placeholder="请输入持卡人姓名" />
</view>
<view class="form-item">
<text class="label">卡号</text>
<input class="input" type="number" v-model="form.card_no" placeholder="请输入银行卡号" @input="detectBank" maxlength="19" />
</view>
<view class="form-item">
<text class="label">银行</text>
<input class="input" type="text" v-model="form.bank_name" placeholder="自动识别或手动输入" />
</view>
<view class="form-item">
<text class="label">手机号</text>
<input class="input" type="number" v-model="form.phone" placeholder="银行预留手机号" maxlength="11" />
</view>
<view class="form-item switch-item">
<text class="label">设为默认卡</text>
<switch :checked="form.is_default" @change="onSwitchChange" color="#ff5000" />
</view>
</view>
<view class="action-section">
<button class="submit-btn" :class="{ disabled: loading }" :disabled="loading" @click="submit">确认添加</button>
</view>
</view>
</template>
<script setup lang="uts">
import { ref, reactive } from 'vue'
import { supabaseService } from '@/utils/supabaseService.uts'
type BankCardForm = {
holder_name: string
card_no: string
bank_name: string
phone: string
is_default: boolean
}
const loading = ref(false)
const form = reactive({
holder_name: '',
card_no: '',
bank_name: '',
phone: '',
is_default: false
} as BankCardForm)
const onSwitchChange = (e: UniSwitchChangeEvent) => {
form.is_default = e.detail.value
}
// 模拟卡号识别
const detectBank = (e: any) => {
const val = form.card_no
if (val.length >= 6) {
if (val.startsWith('6222')) form.bank_name = '中国工商银行'
else if (val.startsWith('6227')) form.bank_name = '中国建设银行'
else if (val.startsWith('6225')) form.bank_name = '招商银行'
else if (val.startsWith('6228')) form.bank_name = '中国农业银行'
// else form.bank_name = ''
}
}
const submit = async () => {
if (form.holder_name == '' || form.card_no == '' || form.bank_name == '') {
uni.showToast({ title: '请完善卡片信息', icon: 'none' })
return
}
loading.value = true
try {
const cardData = new UTSJSONObject()
cardData.set('holder_name', form.holder_name)
cardData.set('bank_name', form.bank_name)
cardData.set('card_no', form.card_no) // Also save full card no if needed, or just last4
// 截取后4位
const last4 = form.card_no.length > 4 ? form.card_no.slice(-4) : form.card_no
cardData.set('card_no_last4', last4)
cardData.set('phone', form.phone)
cardData.set('is_default', form.is_default)
// 简单推定为储蓄卡
cardData.set('card_type', 'debit')
const success = await supabaseService.addBankCard(cardData)
if (success) {
uni.showToast({ title: '添加成功' })
setTimeout(() => {
uni.navigateBack()
}, 1000)
} else {
uni.showToast({ title: '添加失败', icon: 'none' })
}
} catch (e) {
console.error(e)
uni.showToast({ title: '系统错误', icon: 'none' })
} finally {
loading.value = false
}
}
</script>
<style>
.add-card-page {
background-color: #f5f5f5;
flex: 1;
}
.form-container {
background-color: #fff;
padding: 0 15px;
}
.form-item {
display: flex;
align-items: center;
padding: 15px 0;
border-bottom: 1px solid #eee;
}
.form-item:last-child {
border-bottom: none;
}
.label {
width: 80px;
font-size: 15px;
color: #333;
}
.input {
flex: 1;
font-size: 15px;
}
.switch-item {
justify-content: space-between;
}
.action-section {
padding: 30px 15px;
}
.submit-btn {
background-color: #ff5000;
color: #fff;
border-radius: 25px;
font-size: 16px;
}
.submit-btn.disabled {
opacity: 0.6;
}
</style>

240
.consumer-sync-backup/20260514-093851/pages/mall/consumer/bank-cards/index.uvue Normal file
View File

@@ -0,0 +1,240 @@
<template>
<view class="bank-cards-page">
<view class="card-list">
<view v-for="card in cards" :key="card.id" class="card-item" :class="getCardClass(card.bank_name)">
<view class="card-bg-mask"></view>
<view class="card-content">
<view class="card-header">
<text class="bank-name">{{ card.bank_name }}</text>
<text class="card-type">{{ card.card_type === 'credit' ? '信用卡' : '储蓄卡' }}</text>
</view>
<view class="card-number">
<text class="dots">**** **** ****</text>
<text class="last-digits">{{ card.card_no_last4 }}</text>
</view>
<view class="delete-btn" @click.stop="deleteCard(card)">
<text class="del-text">✕</text>
</view>
</view>
</view>
<view class="add-card-btn" @click="addCard">
<text class="plus-icon">+</text>
<text>添加银行卡</text>
</view>
</view>
</view>
</template>
<script setup lang="uts">
import { ref, onMounted } from 'vue'
import { supabaseService } from '@/utils/supabaseService.uts'
type BankCard = {
id: string
user_id: string
bank_name: string
card_no_last4: string
card_type: string
holder_name: string
is_default: boolean
}
const cards = ref<BankCard[]>([])
const loading = ref(true)
const loadData = async () => {
loading.value = true
try {
const rawList = await supabaseService.getUserBankCards()
const cardList: BankCard[] = []
// Use for loop instead of map to avoid complex closure typing issues
for (let i = 0; i < rawList.length; i++) {
const item = rawList[i]
let id = ''
let bankName = ''
let last4 = ''
let type = 'debit'
let holder = ''
let isDef = false
if (item instanceof UTSJSONObject) {
id = item.getString('id') ?? ''
bankName = item.getString('bank_name') ?? ''
last4 = item.getString('card_no_last4') ?? ''
type = item.getString('card_type') ?? 'debit'
holder = item.getString('holder_name') ?? ''
isDef = item.getBoolean('is_default') ?? false
} else {
const obj = JSON.parse(JSON.stringify(item)) as UTSJSONObject
id = obj.getString('id') ?? ''
bankName = obj.getString('bank_name') ?? ''
last4 = obj.getString('card_no_last4') ?? ''
type = obj.getString('card_type') ?? 'debit'
holder = obj.getString('holder_name') ?? ''
isDef = obj.getBoolean('is_default') ?? false
}
cardList.push({
id: id,
user_id: '',
bank_name: bankName,
card_no_last4: last4,
card_type: type,
holder_name: holder,
is_default: isDef
} as BankCard)
}
cards.value = cardList
} catch (e) {
console.error(e)
} finally {
loading.value = false
}
}
onShow(() => {
loadData()
})
const addCard = () => {
uni.navigateTo({
url: '/pages/mall/consumer/bank-cards/add'
})
}
const deleteCard = (card: BankCard) => {
uni.showModal({
title: '删除银行卡',
content: `确认删除尾号${card.card_no_last4}的${card.bank_name}卡片吗？`,
success: (res) => {
if (res.confirm) {
supabaseService.deleteBankCard(card.id).then((success) => {
if (success) {
uni.showToast({ title: '已删除' })
loadData()
} else {
uni.showToast({ title: '删除失败', icon: 'none' })
}
})
}
}
})
}
const getCardClass = (bankName: string): string => {
if (bankName.includes('招商')) return 'cmb'
if (bankName.includes('建设')) return 'ccb'
if (bankName.includes('工商')) return 'icbc'
if (bankName.includes('农业')) return 'abc'
return 'default-bank'
}
</script>
<style>
.bank-cards-page {
padding: 15px;
background-color: #f5f5f5;
flex: 1;
height: 140px;
border-radius: 12px;
margin-bottom: 15px;
color: #fff;
position: relative;
overflow: hidden;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.cmb { background: linear-gradient(135deg, #f55, #c00); }
.ccb { background: linear-gradient(135deg, #09f, #00609c); }
.icbc { background: linear-gradient(135deg, #f66, #c00); }
.abc { background: linear-gradient(135deg, #0b9, #086); }
.default-bank { background: linear-gradient(135deg, #666, #333); }
.card-content {
padding: 20px;
z-index: 2;
position: relative;
height: 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.card-header {
display: flex;
align-items: center;
}
.bank-name {
font-size: 18px;
font-weight: bold;
margin-right: 10px;
}
.card-type {
font-size: 12px;
background-color: rgba(255,255,255,0.2);
padding: 2px 6px;
border-radius: 4px;
}
.card-number {
display: flex;
align-items: center;
justify-content: flex-end; /* 右对齐 */
margin-bottom: 10px;
}
.dots {
font-size: 24px;
margin-right: 15px;
line-height: 1;
}
.last-digits {
font-size: 24px;
font-family: monospace;
}
.add-card-btn {
background-color: #fff;
height: 60px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
color: #666;
font-size: 16px;
border: 1px dashed #ccc;
}
.plus-icon {
font-size: 24px;
margin-right: 5px;
/* font-weight: 300; removed */
}
.delete-btn {
position: absolute;
top: 15px;
right: 15px;
width: 24px;
height: 24px;
background-color: rgba(0,0,0,0.2);
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
}
.del-text {
color: #fff;
font-size: 14px;
font-weight: bold;
}
</style>