This commit is contained in:
wangxiaoxian 2026-05-09 17:01:20 +08:00
parent 166480323c
commit a8de74cfd4
2 changed files with 55 additions and 36 deletions

View File

@ -23,30 +23,23 @@
<input type="text" v-model="form.name" placeholder="请输入租客姓名" class="item-input"/> <input type="text" v-model="form.name" placeholder="请输入租客姓名" class="item-input"/>
</view> </view>
<view class="form-item"> <view class="form-item">
<text class="item-label required">手机号</text> <text class="item-label">手机号</text>
<input type="number" v-model="form.phone" placeholder="请输入手机号" class="item-input" maxlength="11"/> <input type="number" v-model="form.phone" placeholder="请输入手机号" class="item-input" maxlength="11"/>
</view> </view>
<view class="form-item"> <view class="form-item">
<text class="item-label">身份证号</text> <text class="item-label">身份证号</text>
<input type="text" v-model="form.idCard" placeholder="请输入身份证号" class="item-input" maxlength="18"/> <input type="text" v-model="form.idCard" placeholder="请输入身份证号" class="item-input" maxlength="18"/>
</view> </view>
<view class="form-item"> <view class="form-item" v-if="isEdit">
<text class="item-label">紧急联系人</text> <text class="item-label">状态</text>
<input type="text" v-model="form.emergencyContact" placeholder="请输入紧急联系人" class="item-input"/> <view class="status-options">
</view> <view class="status-option" :class="{ active: form.status === 'active' }" @click="form.status = 'active'">
<view class="form-item"> <text>正常</text>
<text class="item-label">紧急电话</text> </view>
<input type="number" v-model="form.emergencyPhone" placeholder="请输入紧急联系电话" class="item-input" maxlength="11"/> <view class="status-option" :class="{ active: form.status === 'inactive' }" @click="form.status = 'inactive'">
</view> <text>停用</text>
</view> </view>
</view> </view>
<view class="form-section">
<view class="section-title">备注信息</view>
<view class="form-card">
<view class="form-item">
<textarea v-model="form.remark" placeholder="请输入备注信息(选填)" class="remark-input" maxlength="200"/>
<text class="word-count">{{form.remark.length}}/200</text>
</view> </view>
</view> </view>
</view> </view>
@ -72,9 +65,7 @@
name: '', name: '',
phone: '', phone: '',
idCard: '', idCard: '',
emergencyContact: '', status: 'active'
emergencyPhone: '',
remark: ''
} }
} }
}, },
@ -95,9 +86,7 @@
name: data.name || '', name: data.name || '',
phone: data.phone || '', phone: data.phone || '',
idCard: data.idCard || '', idCard: data.idCard || '',
emergencyContact: data.emergencyContact || '', status: data.status || 'active'
emergencyPhone: data.emergencyPhone || '',
remark: data.remark || ''
} }
} catch (error) { } catch (error) {
uni.showToast({ title: '加载失败', icon: 'none' }) uni.showToast({ title: '加载失败', icon: 'none' })
@ -105,15 +94,34 @@
uni.hideLoading() uni.hideLoading()
} }
}, },
validateForm() {
const { name, phone, idCard } = this.form
if (!name || !name.trim()) {
uni.showToast({ title: '请输入租客姓名', icon: 'none' })
return false
}
if (name.trim().length < 2 || name.trim().length > 50) {
uni.showToast({ title: '姓名长度应在2-50个字符', icon: 'none' })
return false
}
if (phone && phone.trim()) {
const phonePattern = /^1[3-9]\d{9}$/
if (!phonePattern.test(phone.trim())) {
uni.showToast({ title: '请输入正确的手机号', icon: 'none' })
return false
}
}
if (idCard && idCard.trim()) {
const idCardPattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
if (!idCardPattern.test(idCard.trim())) {
uni.showToast({ title: '请输入正确的身份证号', icon: 'none' })
return false
}
}
return true
},
async save() { async save() {
if (!this.form.name.trim()) { if (!this.validateForm()) return
uni.showToast({ title: '请输入姓名', icon: 'none' })
return
}
if (!this.form.phone.trim()) {
uni.showToast({ title: '请输入手机号', icon: 'none' })
return
}
try { try {
uni.showLoading({ title: '保存中...' }) uni.showLoading({ title: '保存中...' })
if (this.isEdit) { if (this.isEdit) {
@ -172,8 +180,9 @@
.item-label { width: 180rpx; font-size: 30rpx; color: #1E293B; font-weight: 500; } .item-label { width: 180rpx; font-size: 30rpx; color: #1E293B; font-weight: 500; }
.item-label.required::after { content: '*'; color: #EF4444; margin-left: 8rpx; } .item-label.required::after { content: '*'; color: #EF4444; margin-left: 8rpx; }
.item-input { flex: 1; font-size: 30rpx; color: #1E293B; text-align: right; } .item-input { flex: 1; font-size: 30rpx; color: #1E293B; text-align: right; }
.remark-input { width: 100%; height: 200rpx; font-size: 30rpx; color: #1E293B; line-height: 1.6; }
.word-count { position: absolute; right: 32rpx; bottom: 24rpx; font-size: 24rpx; color: #94A3B8; }
.delete-section { margin-top: 48rpx; } .delete-section { margin-top: 48rpx; }
.delete-btn { width: 100%; height: 96rpx; background: #FEE2E2; color: #EF4444; font-size: 32rpx; font-weight: 600; border-radius: 16rpx; border: none; display: flex; align-items: center; justify-content: center; } .delete-btn { width: 100%; height: 96rpx; background: #FEE2E2; color: #EF4444; font-size: 32rpx; font-weight: 600; border-radius: 16rpx; border: none; display: flex; align-items: center; justify-content: center; }
.status-options { display: flex; gap: 24rpx; }
.status-option { padding: 16rpx 32rpx; border-radius: 12rpx; background: #F1F5F9; font-size: 28rpx; color: #64748B; }
.status-option.active { background: #DBEAFE; color: #2563EB; }
</style> </style>

View File

@ -59,7 +59,8 @@
data() { data() {
return { return {
renterId: null, renterId: null,
renter: null renter: null,
isLoading: false
} }
}, },
onLoad(options) { onLoad(options) {
@ -69,20 +70,29 @@
} }
}, },
onShow() { onShow() {
if (this.renterId) { // onLoad
if (this.renterId && this.renter) {
this.loadData() this.loadData()
} }
}, },
methods: { methods: {
async loadData() { async loadData() {
if (this.isLoading) return
this.isLoading = true
try { try {
uni.showLoading({ title: '加载中...' }) uni.showLoading({ title: '加载中...' })
const res = await renterApi.getDetail(this.renterId) const res = await renterApi.getDetail(this.renterId)
this.renter = res.data this.renter = res.data
} catch (error) { } catch (error) {
//
if (error?.message === '重复请求') {
console.log('重复请求被拦截')
return
}
uni.showToast({ title: '加载失败', icon: 'none' }) uni.showToast({ title: '加载失败', icon: 'none' })
} finally { } finally {
uni.hideLoading() uni.hideLoading()
this.isLoading = false
} }
}, },
editRenter() { editRenter() {