109 lines
3.2 KiB
Vue
109 lines
3.2 KiB
Vue
<template>
|
|
<view class="p-[32rpx] bg-white">
|
|
<view class="flex justify-between items-center mb-[20rpx]">
|
|
<text class="text-[44rpx] font-bold">修改跟进信息</text>
|
|
<text class="text-[28rpx]" @click="handleClear">全部清空</text>
|
|
</view>
|
|
<TForm ref="tForm" :model="form" :rules="rules" errorType="toast">
|
|
<TFormItem prop="studentName">
|
|
<TInputField
|
|
v-model="form.studentName"
|
|
label="客户姓名"
|
|
placeholder="请填写客户姓名（必填）"
|
|
inputAlign="left"
|
|
/>
|
|
</TFormItem>
|
|
<TFormItem prop="phone">
|
|
<TInputField
|
|
v-model="form.phone"
|
|
label="电话"
|
|
placeholder="请填写电话（必填）"
|
|
inputAlign="left"
|
|
/>
|
|
</TFormItem>
|
|
<TFormItem prop="basicInformation">
|
|
<TTextareaField
|
|
v-model="form.basicInformation"
|
|
label="基本情况"
|
|
placeholder="请填写基本情况（必填）"
|
|
autoHeight
|
|
/>
|
|
</TFormItem>
|
|
</TForm>
|
|
<u-button
|
|
class="btn"
|
|
color="#0E66FB"
|
|
shape="circle"
|
|
:loading="loading"
|
|
@click="handleConfirm"
|
|
>
|
|
确认
|
|
</u-button>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
import { ref } from 'vue'
|
|
import { useClueDetail } from '@/hooks/useCommon'
|
|
import { apiEditClue } from '@/api/clue'
|
|
import { toast } from '@/utils/util'
|
|
|
|
const { fetchClueDetail, clueDetailInfo } = useClueDetail()
|
|
|
|
const tForm = ref()
|
|
const form = ref({
|
|
id: '',
|
|
studentName: '',
|
|
phone: '',
|
|
basicInformation: ''
|
|
})
|
|
const rules = {
|
|
studentName: [{ required: true, message: '请填写客户姓名', trigger: 'blur' }],
|
|
phone: [{ required: true, message: '请填写电话', trigger: 'blur' }],
|
|
basicInformation: [{ required: true, message: '请填写基本情况', trigger: 'blur' }]
|
|
}
|
|
const loading = ref(false)
|
|
const handleConfirm = () => {
|
|
tForm.value
|
|
.validate()
|
|
.then(async valid => {
|
|
if (valid) {
|
|
loading.value = true
|
|
try {
|
|
await apiEditClue(form.value)
|
|
toast('修改成功')
|
|
uni.navigateBack()
|
|
uni.$emit('refreshPage')
|
|
} catch (error) {}
|
|
loading.value = false
|
|
}
|
|
})
|
|
.catch(() => {})
|
|
}
|
|
const handleClear = () => {
|
|
tForm.value.resetFields()
|
|
}
|
|
onLoad(async option => {
|
|
if (option?.id) {
|
|
await fetchClueDetail(option.id)
|
|
setFormData()
|
|
}
|
|
})
|
|
const setFormData = () => {
|
|
for (const key in clueDetailInfo.value) {
|
|
if (Object.prototype.hasOwnProperty.call(form.value, key)) {
|
|
form.value[key] = clueDetailInfo.value[key] as any
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
:deep(.btn) {
|
|
button {
|
|
@apply h-[88rpx] px-[60rpx] mt-[60rpx] mb-[28rpx];
|
|
}
|
|
}
|
|
</style>
|