79 lines
3.6 KiB
Vue
79 lines
3.6 KiB
Vue
<template>
|
||
<view class="page">
|
||
<view class="field"><text class="label">客户名称</text><input class="value" v-model="form.name" placeholder="必填" /></view>
|
||
<view class="field">
|
||
<text class="label">售价档位</text>
|
||
<picker :range="priceLabels" :value="priceIdx" @change="onPriceChange">
|
||
<view class="value">{{ priceLabels[priceIdx] }}</view>
|
||
</picker>
|
||
</view>
|
||
<view class="field"><text class="label">联系人</text><input class="value" v-model="form.contactName" placeholder="可选" /></view>
|
||
<view class="field"><text class="label">手机</text><input class="value" v-model="form.mobile" placeholder="可选" /></view>
|
||
<view class="field"><text class="label">电话</text><input class="value" v-model="form.phone" placeholder="可选（座机）" /></view>
|
||
<view class="field"><text class="label">送货地址</text><input class="value" v-model="form.address" placeholder="可选" /></view>
|
||
<view class="field"><text class="label">初始应收</text><input class="value" type="digit" v-model.number="form.arOpening" placeholder="默认 0.00" /></view>
|
||
<view class="textarea"><textarea v-model="form.remark" maxlength="200" placeholder="备注（最多200字）"></textarea></view>
|
||
|
||
<view class="bottom"><button class="primary" @click="save">保存</button></view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { get, post, put } from '../../common/http.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
id: null,
|
||
form: { name:'', priceLevel:'retail', contactName:'', mobile:'', phone:'', address:'', arOpening:0, remark:'' },
|
||
priceLevels: ['零售价','批发价','大单报价'],
|
||
priceLabels: ['零售价','批发价','大单报价'],
|
||
priceIdx: 0
|
||
}
|
||
},
|
||
onLoad(query) { if (query && query.id) { this.id = Number(query.id); this.load() } },
|
||
methods: {
|
||
onPriceChange(e){ this.priceIdx = Number(e.detail.value); this.form.priceLevel = this.priceLevels[this.priceIdx] },
|
||
async load() {
|
||
if (!this.id) return
|
||
try {
|
||
const d = await get(`/api/customers/${this.id}`)
|
||
this.form = {
|
||
name: d?.name || '',
|
||
priceLevel: d?.priceLevel || '零售价',
|
||
contactName: d?.contactName || '',
|
||
mobile: d?.mobile || '',
|
||
phone: d?.phone || '',
|
||
address: d?.address || '',
|
||
arOpening: Number(d?.arOpening || 0),
|
||
remark: d?.remark || ''
|
||
}
|
||
// 同步 priceIdx
|
||
const idx = this.priceLevels.indexOf(this.form.priceLevel || '零售价')
|
||
this.priceIdx = idx >= 0 ? idx : 0
|
||
} catch(e) { uni.showToast({ title: e?.message || '加载失败', icon: 'none' }) }
|
||
},
|
||
async save() {
|
||
if (!this.form.name) return uni.showToast({ title:'请填写客户名称', icon:'none' })
|
||
try {
|
||
if (this.id) await put(`/api/customers/${this.id}`, this.form)
|
||
else await post('/api/customers', this.form)
|
||
uni.showToast({ title:'保存成功', icon:'success' })
|
||
setTimeout(() => uni.navigateBack(), 500)
|
||
} catch(e) { uni.showToast({ title: e?.message || '保存失败', icon:'none' }) }
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.page { padding-bottom: 140rpx; }
|
||
.field { display:flex; justify-content: space-between; padding: 22rpx 24rpx; background:$uni-bg-color-grey; border-bottom:1rpx solid $uni-border-color; }
|
||
.label { color:$uni-text-color-grey; }
|
||
.value { color:$uni-text-color; text-align: right; flex: 1; }
|
||
.textarea { padding: 16rpx 24rpx; background:$uni-bg-color-grey; margin-top: 12rpx; }
|
||
.bottom { position: fixed; left:0; right:0; bottom:0; background:$uni-bg-color-grey; padding: 16rpx 24rpx calc(env(safe-area-inset-bottom) + 16rpx); box-shadow: 0 -4rpx 12rpx rgba(0,0,0,0.10); }
|
||
.primary { width: 100%; background: $uni-color-primary; color:#fff; border-radius: 999rpx; padding: 20rpx 0; }
|
||
</style>
|
||
|
||
|