This commit is contained in:
parent
166480323c
commit
a8de74cfd4
|
|
@ -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>
|
||||||
|
|
|
||||||
|
|
@ -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() {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue