64 lines
2.2 KiB
Vue
64 lines
2.2 KiB
Vue
<template>
|
|
<view class="page" :style="themePageStyle">
|
|
<ThemeNavbar :title="id ? '编辑地址' : '新增地址'" />
|
|
<view class="form" :style="{ background: themeSurface }">
|
|
<input v-model="form.name" class="input" placeholder="收件人" />
|
|
<input v-model="form.phone" class="input" type="number" placeholder="手机号" />
|
|
<input v-model="form.address" class="input" placeholder="详细地址" />
|
|
<view class="switch-row" @tap="form.is_default = form.is_default === 1 ? 0 : 1">
|
|
<text :style="{ color: themeText }">设为默认</text>
|
|
<text :style="{ color: themePrimary }">{{ form.is_default === 1 ? '是' : '否' }}</text>
|
|
</view>
|
|
<button class="submit" :style="{ background: themePrimary, color: themeSurface }" @tap="save">保存</button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { createAddressApi, getAddressDetailApi, updateAddressApi } from '@/api/page/address'
|
|
import ThemeNavbar from '@/components/theme/ThemeNavbar.vue'
|
|
import themeMixin from '@/mixins/theme'
|
|
|
|
export default {
|
|
components: { ThemeNavbar },
|
|
mixins: [themeMixin],
|
|
data() {
|
|
return { id: 0, form: { name: '', phone: '', address: '', is_default: 0 } }
|
|
},
|
|
async onLoad(options) {
|
|
await this.applyThemeOnShow()
|
|
this.id = Number(options.id || 0)
|
|
if (this.id) {
|
|
getAddressDetailApi(this.id).then((res) => {
|
|
this.form = {
|
|
name: res.name || '',
|
|
phone: res.phone || '',
|
|
address: res.address || '',
|
|
is_default: Number(res.is_default) === 1 ? 1 : 0,
|
|
}
|
|
})
|
|
}
|
|
},
|
|
methods: {
|
|
save() {
|
|
const payload = { ...this.form }
|
|
const req = this.id
|
|
? updateAddressApi({ id: this.id, ...payload })
|
|
: createAddressApi(payload)
|
|
req.then(() => {
|
|
uni.showToast({ title: '已保存', icon: 'success' })
|
|
setTimeout(() => uni.navigateBack(), 400)
|
|
})
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.page { min-height: 100vh; }
|
|
.form { margin: 24rpx; padding: 24rpx; border-radius: 16rpx; }
|
|
.input { height: 88rpx; border-bottom: 1rpx solid #eee; font-size: 28rpx; }
|
|
.switch-row { display: flex; justify-content: space-between; padding: 24rpx 0; }
|
|
.submit { margin-top: 24rpx; }
|
|
</style>
|