94 lines
2.8 KiB
Vue
94 lines
2.8 KiB
Vue
<template>
|
|
<view class="mt-[32rpx] 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 { apiAddCluse } from '@/api/clue'
|
|
import { toast, validate } from '@/utils/util'
|
|
import { validateContact } from '@/utils/validate'
|
|
import { ref } from 'vue'
|
|
|
|
const tForm = ref()
|
|
const form = ref({
|
|
studentName: '',
|
|
phone: '',
|
|
basicInformation: ''
|
|
})
|
|
const loading = ref(false)
|
|
const rules = {
|
|
studentName: [{ required: true, message: '请填写客户姓名', trigger: 'blur' }],
|
|
phone: [
|
|
{ required: true, message: '请填写电话', trigger: 'blur' },
|
|
{ validator: validateContact, trigger: 'blur' }
|
|
],
|
|
basicInformation: [{ required: true, message: '请填写基本情况', trigger: 'blur' }]
|
|
}
|
|
const handleConfirm = () => {
|
|
tForm.value
|
|
.validate()
|
|
.then(async valid => {
|
|
if (valid) {
|
|
loading.value = true
|
|
try {
|
|
await apiAddCluse(form.value)
|
|
toast('添加成功')
|
|
handleClear()
|
|
} catch (error) {}
|
|
loading.value = false
|
|
}
|
|
})
|
|
.catch(() => {})
|
|
}
|
|
const handleClear = () => {
|
|
tForm.value.resetFields()
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
:deep(.btn) {
|
|
button {
|
|
@apply h-[88rpx] px-[60rpx] mt-[60rpx] mb-[28rpx];
|
|
}
|
|
}
|
|
</style>
|