优化数据库初始化,新增用户收货地址表以支持多地址管理;更新章节页面和我的页面,整合底部导航组件,提升用户体验;调整小程序设置页面,增加收货地址管理功能,优化样式与布局。
This commit is contained in:
136
miniprogram/pages/address-edit/address-edit.js
Normal file
136
miniprogram/pages/address-edit/address-edit.js
Normal file
@@ -0,0 +1,136 @@
|
||||
/**
|
||||
* Soul创业派对 - 收货地址新建/编辑
|
||||
*/
|
||||
const app = getApp()
|
||||
|
||||
Page({
|
||||
data: {
|
||||
statusBarHeight: 44,
|
||||
id: '',
|
||||
isEdit: false,
|
||||
name: '',
|
||||
phone: '',
|
||||
region: ['广东省', '广州市', '天河区'],
|
||||
province: '广东省',
|
||||
city: '广州市',
|
||||
district: '天河区',
|
||||
detail: '',
|
||||
isDefault: false,
|
||||
loading: false
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
this.setData({ statusBarHeight: app.globalData.statusBarHeight })
|
||||
if (options.id) {
|
||||
this.setData({ id: options.id, isEdit: true })
|
||||
this.loadItem(options.id)
|
||||
}
|
||||
},
|
||||
|
||||
async loadItem(id) {
|
||||
wx.showLoading({ title: '加载中...' })
|
||||
try {
|
||||
const res = await app.request('/api/user/addresses/' + id)
|
||||
wx.hideLoading()
|
||||
if (res.success && res.item) {
|
||||
const item = res.item
|
||||
this.setData({
|
||||
name: item.name,
|
||||
phone: item.phone,
|
||||
province: item.province || '',
|
||||
city: item.city || '',
|
||||
district: item.district || '',
|
||||
region: [item.province || '', item.city || '', item.district || ''],
|
||||
detail: item.detail,
|
||||
isDefault: item.isDefault
|
||||
})
|
||||
}
|
||||
} catch (e) {
|
||||
wx.hideLoading()
|
||||
wx.showToast({ title: '加载失败', icon: 'none' })
|
||||
}
|
||||
},
|
||||
|
||||
onNameInput(e) {
|
||||
this.setData({ name: e.detail.value.trim() })
|
||||
},
|
||||
|
||||
onPhoneInput(e) {
|
||||
this.setData({ phone: e.detail.value.replace(/\D/g, '').slice(0, 11) })
|
||||
},
|
||||
|
||||
onRegionChange(e) {
|
||||
const region = e.detail.value
|
||||
this.setData({
|
||||
region,
|
||||
province: region[0] || '',
|
||||
city: region[1] || '',
|
||||
district: region[2] || ''
|
||||
})
|
||||
},
|
||||
|
||||
onDetailInput(e) {
|
||||
this.setData({ detail: e.detail.value.trim() })
|
||||
},
|
||||
|
||||
onDefaultChange(e) {
|
||||
this.setData({ isDefault: e.detail.value })
|
||||
},
|
||||
|
||||
async save() {
|
||||
const { id, isEdit, name, phone, province, city, district, detail, isDefault } = this.data
|
||||
if (!name) {
|
||||
wx.showToast({ title: '请输入收货人姓名', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (!phone || !/^1[3-9]\d{9}$/.test(phone)) {
|
||||
wx.showToast({ title: '请输入正确的手机号', icon: 'none' })
|
||||
return
|
||||
}
|
||||
// 省/市/区为选填,不校验
|
||||
if (!detail) {
|
||||
wx.showToast({ title: '请输入详细地址', icon: 'none' })
|
||||
return
|
||||
}
|
||||
const userId = app.globalData.userInfo?.id
|
||||
if (!userId) {
|
||||
wx.showToast({ title: '请先登录', icon: 'none' })
|
||||
return
|
||||
}
|
||||
this.setData({ loading: true })
|
||||
try {
|
||||
if (isEdit && id) {
|
||||
const res = await app.request('/api/user/addresses/' + id, {
|
||||
method: 'PUT',
|
||||
data: { name, phone, province, city, district, detail, isDefault }
|
||||
})
|
||||
if (res.success) {
|
||||
wx.showToast({ title: '保存成功', icon: 'success' })
|
||||
setTimeout(() => wx.navigateBack(), 1500)
|
||||
} else {
|
||||
wx.showToast({ title: res.message || '保存失败', icon: 'none' })
|
||||
this.setData({ loading: false })
|
||||
}
|
||||
} else {
|
||||
const res = await app.request('/api/user/addresses', {
|
||||
method: 'POST',
|
||||
data: { userId, name, phone, province, city, district, detail, isDefault }
|
||||
})
|
||||
if (res.success) {
|
||||
wx.showToast({ title: '添加成功', icon: 'success' })
|
||||
setTimeout(() => wx.navigateBack(), 1500)
|
||||
} else {
|
||||
wx.showToast({ title: res.message || '添加失败', icon: 'none' })
|
||||
this.setData({ loading: false })
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
this.setData({ loading: false })
|
||||
wx.showToast({ title: '保存失败', icon: 'none' })
|
||||
}
|
||||
},
|
||||
|
||||
goBack() {
|
||||
wx.navigateBack()
|
||||
}
|
||||
})
|
||||
4
miniprogram/pages/address-edit/address-edit.json
Normal file
4
miniprogram/pages/address-edit/address-edit.json
Normal file
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"navigationBarTitleText": "编辑地址",
|
||||
"usingComponents": {}
|
||||
}
|
||||
40
miniprogram/pages/address-edit/address-edit.wxml
Normal file
40
miniprogram/pages/address-edit/address-edit.wxml
Normal file
@@ -0,0 +1,40 @@
|
||||
<!-- 收货地址 新建/编辑 -->
|
||||
<view class="page">
|
||||
<view class="nav-bar" style="padding-top: {{statusBarHeight}}px;">
|
||||
<view class="nav-back" bindtap="goBack">
|
||||
<text class="back-icon">‹</text>
|
||||
</view>
|
||||
<text class="nav-title">{{isEdit ? '编辑地址' : '新增地址'}}</text>
|
||||
<view class="nav-placeholder"></view>
|
||||
</view>
|
||||
<view style="height: {{statusBarHeight + 44}}px;"></view>
|
||||
|
||||
<view class="form">
|
||||
<view class="form-item">
|
||||
<text class="label">收货人</text>
|
||||
<input class="input" placeholder="请输入收货人姓名" value="{{name}}" bindinput="onNameInput" />
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">手机号码</text>
|
||||
<input class="input" type="number" maxlength="11" placeholder="请输入手机号" value="{{phone}}" bindinput="onPhoneInput" />
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">所在地区(选填)</text>
|
||||
<picker mode="region" value="{{region}}" bindchange="onRegionChange">
|
||||
<view class="picker-value">
|
||||
{{region[0] && region[1] && region[2] ? region[0] + ' ' + region[1] + ' ' + region[2] : '选填,可不选'}}
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
<view class="form-item detail">
|
||||
<text class="label">详细地址</text>
|
||||
<textarea class="textarea" placeholder="街道、楼栋、门牌号等" value="{{detail}}" bindinput="onDetailInput" maxlength="200" />
|
||||
</view>
|
||||
<view class="form-item switch-row">
|
||||
<text class="label">设为默认地址</text>
|
||||
<switch checked="{{isDefault}}" bindchange="onDefaultChange" color="#00CED1" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn-save {{loading ? 'disabled' : ''}}" bindtap="save">保存</view>
|
||||
</view>
|
||||
21
miniprogram/pages/address-edit/address-edit.wxss
Normal file
21
miniprogram/pages/address-edit/address-edit.wxss
Normal file
@@ -0,0 +1,21 @@
|
||||
.page { min-height: 100vh; background: #000; padding-bottom: 120rpx; }
|
||||
.nav-bar { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(0,0,0,0.9); backdrop-filter: blur(40rpx); display: flex; align-items: center; justify-content: space-between; padding: 0 32rpx; height: 88rpx; }
|
||||
.nav-back { width: 64rpx; height: 64rpx; display: flex; align-items: center; justify-content: center; }
|
||||
.back-icon { font-size: 40rpx; color: rgba(255,255,255,0.6); }
|
||||
.nav-title { font-size: 34rpx; font-weight: 600; color: #fff; }
|
||||
.nav-placeholder { width: 64rpx; }
|
||||
|
||||
.form { margin: 24rpx; background: #1c1c1e; border-radius: 24rpx; overflow: hidden; border: 2rpx solid rgba(0,206,209,0.2); }
|
||||
.form-item { display: flex; align-items: center; padding: 28rpx 24rpx; border-bottom: 2rpx solid rgba(255,255,255,0.06); }
|
||||
.form-item:last-child { border-bottom: none; }
|
||||
.form-item.detail { align-items: flex-start; }
|
||||
.form-item .label { width: 160rpx; font-size: 28rpx; color: rgba(255,255,255,0.8); flex-shrink: 0; }
|
||||
.form-item .input { flex: 1; font-size: 28rpx; color: #fff; }
|
||||
.form-item .picker-value { flex: 1; font-size: 28rpx; color: #fff; }
|
||||
.form-item .picker-value:empty:before { content: '请选择省市区'; color: rgba(255,255,255,0.4); }
|
||||
.form-item .textarea { flex: 1; font-size: 28rpx; color: #fff; min-height: 120rpx; }
|
||||
.form-item.switch-row { justify-content: space-between; }
|
||||
.form-item switch { transform: scale(0.9); }
|
||||
|
||||
.btn-save { margin: 48rpx 24rpx 0; height: 88rpx; line-height: 88rpx; text-align: center; background: #00CED1; color: #000; font-size: 30rpx; font-weight: 600; border-radius: 44rpx; }
|
||||
.btn-save.disabled { opacity: 0.6; }
|
||||
Reference in New Issue
Block a user