php
/
ZhiHuiJiaoWu_UniApp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

refactor(market): 重构线索添加页面 

- 优化了表单结构和字段名称
- 添加了来源渠道、跟进类型等新字段
- 重构了选择器组件的使用方式
- 优化了数据验证逻辑
-调整了字典数据的获取和展示
master
liutong 1 year ago
parent
7829e6db11
commit
7bf742fc00
1 changed files with 275 additions and 182 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 457
      pages/market/clue/add_clues.vue

457
pages/market/clue/add_clues.vue
View File

@ -20,29 +20,29 @@
</view>
</fui-form-item>
<fui-form-item label="来源渠道" asterisk asteriskPosition="right" labelSize='26' prop="" background='#434544'
<fui-form-item label="来源渠道" asteriskPosition="right" labelSize='26' prop="" background='#434544'
labelColor='#fff' :bottomBorder='false'>
<view class="input-title" style="margin-right:14rpx;">
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)"
v-if="result_customer_source == ''">点击选择
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(`source_channel`)"
v-if="!formData.source_channel">点击选择
</view>
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)" v-else>
{{ result_customer_source }}
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(`source_channel`)" v-else>
{{str_source_channel}}
</view>
</view>
</fui-form-item>
<fui-form-item label="客户来源" asterisk asteriskPosition="right" labelSize='26' prop="" background='#434544'
<fui-form-item label="客户来源" asteriskPosition="right" labelSize='26' prop="" background='#434544'
labelColor='#fff' :bottomBorder='false'>
<view class="input-title" style="margin-right:14rpx;">
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)"
v-if="result_customer_source == ''">点击选择
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(`customer_source`)"
v-if="!formData.customer_source">点击选择
</view>
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)" v-else>
{{ result_customer_source }}
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(`customer_source`)" v-else>
{{ str_customer_source }}
</view>
</view>
@ -52,12 +52,10 @@
labelColor='#fff' :bottomBorder='false'>
<view class="input-title" style="margin-right:14rpx;">
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(2)"
v-if="result_add_staff_id == ''">点击选择
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('add_staff_id')"
v-if="!formData.add_staff_id">点击选择
</view>
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(2)" v-else>{{
result_add_staff_id
}}
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('add_staff_id')" v-else>{{str_add_staff_id}}
</view>
</view>
@ -131,36 +129,48 @@
</fui-form-item>
<view v-if="is_follow">
<fui-form-item label="跟进类型" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
background='#434544' labelColor='#fff' :bottomBorder='false'>
<fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.community_name"
backgroundColor="#434544" size="26" color="#fff"></fui-input>
<fui-form-item label="跟进类型" asterisk asteriskPosition="right" labelSize='26' prop="" background='#434544'
labelColor='#fff' :bottomBorder='false'>
<view class="input-title" style="margin-right:14rpx;">
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('entry_type')"
v-if="!formData.entry_type">点击选择
</view>
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('entry_type')" v-else>{{str_entry_type}}
</view>
</view>
</fui-form-item>
<fui-form-item label="跟进人员" asterisk asteriskPosition="right" labelSize='26' prop="" background='#434544'
labelColor='#fff' :bottomBorder='false'>
<view class="input-title" style="margin-right:14rpx;">
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(2)"
v-if="result_add_staff_id == ''">点击选择
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('staff_id')"
v-if="!formData.staff_id">点击选择
</view>
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('staff_id')" v-else>{{
result_add_staff_id
}}
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('staff_id')" v-else>{{str_staff_id}}
</view>
</view>
</fui-form-item>
<fui-form-item label="跟进时间" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
background='#434544' labelColor='#fff' :bottomBorder='false'>
<fui-input :borderBottom="false" :padding="[0]" placeholder="请选择跟进时间" v-model="formData.follow_up_time"
backgroundColor="#434544" size="26" color="#fff" @click="selectCon(6)"></fui-input>
<fui-form-item label="跟进时间" asterisk asteriskPosition="right" labelSize='26' prop="" background='#434544'
labelColor='#fff' :bottomBorder='false'>
<view class="input-title" style="margin-right:14rpx;">
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('follow_up_time')"
v-if="!formData.follow_up_time">点击选择
</view>
<view class="input-title" style="margin-right:14rpx;" @click="selectCon('follow_up_time')" v-else>{{formData.follow_up_time}}
</view>
</view>
</fui-form-item>
<fui-form-item label="备注" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
<fui-form-item label="备注" labelSize='26' asteriskPosition="right" prop="mobile"
background='#434544' labelColor='#fff' :bottomBorder='false'>
<fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.community_name"
<fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.follow_up_content"
backgroundColor="#434544" size="26" color="#fff"></fui-input>
</fui-form-item>
@ -340,34 +350,91 @@ export default {
//表单
formData: {
title:'',//线索标题
sex:'1',//性别|0=保密,1=男,2=女
student_name: '',//学员姓名*
student_phone: '',//电话*
age: '',//年龄*
school_name: '',//学校
grade: '',//年级
class_name: '',//班级
customer_source: '',//客户来源*
add_staff_id: '',//顾问id*
contact_name: '',//联系人*
province_id: '',//所在地区-省
city_id: '',//所在地区-市
district_id: '',//所在地区-区
full_address: '',//所在地区中文名
community_name: '',//小区
customer_tags_name: '',//选中的标签名称,多个用,号分割
customer_tags: ['2', '3'],//客户标签
is_follow:'1',//是否创建跟进任务 1跟进 2不跟进
follow_up_time:'',//跟进时间*
follow_up_content:'',//跟进内容
staff_id:'',//跟进人员id*
is_warn:'2',//是否提醒 1提醒 2不提醒
reminder_method:'',//1=短信,2=邮箱,3=微信模板消息
source_channel:'',//来源渠道
customer_source:'',//客户来源
add_staff_id:'',//顾问id(添加这条数据的工作人员id)
student_name:'',//学生姓名
age:'',//学生年龄
sex:'',//性别|0=保密,1=男,2=女
student_phone:'',//学生电话
//### 跟进任务
is_follow:'',//是否跟进任务|1跟进 2不跟进
entry_type:'',//跟进类型
staff_id:'',//跟进人员id
follow_up_time:'',//跟进时间
follow_up_content:'',//备注
},
//选择器组件
options_type: undefined,//选择器类型
show: false,//是否显示下拉选择器
linkage: true,//是否联动选择
options: [],//下拉选择器可选值列表
//来源渠道-相关
//字典-来源渠道
options_source_channel: [
// {
// 'value': 1,
// 'text': '类型1'
// }
],
str_source_channel:'',//文本显示-来源渠道
//客户来源-相关
//字典-客户来源
options_customer_source: [
// {
// 'value': 1,
// 'text': '类型1'
// }
],
str_customer_source:'',//文本显示-客户来源
//顾问-相关
//字典-顾问
options_add_staff_id: [
// {
// 'value': 1,
// 'text': '类型1'
// }
],
str_add_staff_id:'',//文本显示-顾问
is_follow:true,//是否创建跟进任务
//跟进类型-相关
//字典-跟进类型
options_entry_type: [
{
'value': 1,
'text': '市场人员'
},
{
'value': 2,
'text': '销售人员'
}
],
str_entry_type:'',//文本显示-跟进类型
//跟进人员-相关
//字典-跟进人员
options_staff_id: [
// {
// 'value': 1,
// 'text': '类型1'
// }
],
str_staff_id:'',//文本显示-跟进人员
//跟进时间-相关
show_date: false,
@ -381,10 +448,9 @@ export default {
result_renwu: '',
result_fangshi: '',
show: false,
options: [],
linkage: true,
options_type: undefined,
options_leixing: [{
'value': 1,
'text': '类型1'
@ -452,25 +518,8 @@ export default {
result_customer_source: '',//选中项的中文名称
options_customer_source: [
{
'value': 1,
'text': '渠道1'
},
{
'value': 2,
'text': '渠道2'
}
],//客户来源可选值
//顾问(add_staff_id,添加这条数据的工作人员id)
result_add_staff_id: '',//选中项的中文名称
staff_id_name:'',//跟进人员的名字
options_add_staff_id: [
// {
// 'value': 1,
// 'text': '张三'
// },
],//顾问来源可选值
//客户标签
show_customer_tags: false,
@ -503,6 +552,7 @@ export default {
async init() {
//获取登录用户信息
this.getUserInfo()
this.getDict_source_channel()//获取字典-来源渠道
this.getDict_customer_source()//获取字典-客户来源
this.getDict_customer_tags()//获取字典-客户标签
this.getStaffList()//获取人员列表
@ -521,9 +571,13 @@ export default {
}
this.userInfo = res.data
console.log(111,res.data)
this.formData.staff_id = res.data.staff_id
this.result_add_staff_id = res.data.name
this.formData.add_staff_id = res.data.staff_id//顾问id
this.str_add_staff_id = res.data.name//顾问名字
this.formData.staff_id = res.data.staff_id//跟进人员id
this.str_staff_id = res.data.name//跟进人员名字
},
@ -538,12 +592,15 @@ export default {
return
}
let arr = []
res.data.forEach((v,k)=>{
this.options_add_staff_id.push({
arr.push({
text: v.name,
value: v.id,
})
})
this.options_add_staff_id = arr
this.options_staff_id = arr
},
//获取地区树形结构
@ -559,6 +616,29 @@ export default {
this.options_area = res.data
},
//获取字典-来源渠道
async getDict_source_channel(){
let res = await commonApi.getDictionary('source_channel')
if(res.code != 1){
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
let dictionary = res.data.dictionary
let arr = []
dictionary.forEach((v,k)=>{
arr.push({
text: v.name,
value: v.value,
})
})
this.options_source_channel = arr
},
//获取字典-客户来源
async getDict_customer_source(){
let res = await commonApi.getDictionary('customer_source')
@ -642,6 +722,7 @@ export default {
this.showDuplicateCheck = false
},
//跳转页面-客户详情
openViewClueInfo(item) {
let id = item.id
@ -670,6 +751,7 @@ export default {
//表单验证
async validatorForm(data) {
//线索标题
if(!data.title){
uni.showToast({
title: '线索标题必填',
@ -677,20 +759,15 @@ export default {
})
return false
}
//学生姓名
if(!data.student_name){
uni.showToast({
title: '学员姓名必填',
icon: 'none'
})
return false
}
if(!data.student_phone){
uni.showToast({
title: '电话必填',
title: '学生姓名必填',
icon: 'none'
})
return false
}
//年龄
if(!data.age){
uni.showToast({
title: '年龄必填',
@ -698,28 +775,49 @@ export default {
})
return false
}
if(!data.customer_source){
//性别
if(!data.sex){
uni.showToast({
title: '客户来源必填',
title: '性别必填',
icon: 'none'
})
return false
}
if(!data.staff_id){
//电话
if(!data.student_phone){
uni.showToast({
title: '顾问必填',
title: '电话必填',
icon: 'none'
})
return false
}
if(!data.contact_name){
uni.showToast({
title: '联系人必填',
icon: 'none'
})
return false
//##### 跟进 #####
if(data.is_follow == 1){
//跟进类型
if(!data.entry_type){
uni.showToast({
title: '跟进类型必填',
icon: 'none'
})
return false
}
//跟进人员
if(!data.staff_id){
uni.showToast({
title: '跟进人员必填',
icon: 'none'
})
return false
}
//跟进时间
if(!data.follow_up_time){
uni.showToast({
title: '跟进时间必填',
icon: 'none'
})
return false
}
}
return true
},
@ -729,7 +827,7 @@ export default {
let data = {...this.formData}
//表单验证
let validatorForm = await this.validatorForm(data)
console.log(123123,validatorForm)
console.log('验证结果',validatorForm)
if(!validatorForm){
return
}
@ -765,97 +863,92 @@ export default {
},
//选择弹窗
selectCon(type) {
if (type == 1) {
//客户来源
this.options_type = 1
this.options = this.options_customer_source
this.show = true
this.linkage = true
} else if (type == 2) {
//添加这条数据的工作人员id
this.options_type = 2
this.options = this.options_add_staff_id
this.show = true
this.linkage = true
} else if (type == 3) {
this.options_type = 3
this.options = this.options_student
this.show = true
this.linkage = true
} else if (type == 4) {
this.options_type = 4
this.options = this.options_status
this.show = true
this.linkage = true
} else if (type == 5) {
this.options_type = 5
this.options = this.options_intention
this.show = true
this.linkage = true
} else if (type == 6) {
//选择跟进时间
this.options_date_type = 6
this.show_date = true
} else if (type == 7) {
//选择任务提醒
this.options_type = 7
this.options = this.options_renwu
this.show = true
this.linkage = true
} else if (type == 8) {
//选择提醒方式
this.options_type = 8
this.options = this.options_fangshi
this.show = true
this.linkage = true
}else if (type == 'staff_id') {
//跟进人员
this.options_type = 2
this.options = this.options_add_staff_id
this.show = true
this.linkage = true
this.options_type = type
switch (type) {
//来源渠道
case 'source_channel':
this.options = this.options_source_channel
this.show = true
this.linkage = true
break;
//客户来源
case 'customer_source':
this.options = this.options_customer_source
this.show = true
this.linkage = true
break;
//顾问
case 'add_staff_id':
this.options = this.options_add_staff_id
this.show = true
this.linkage = true
break;
// 跟进类型
case 'entry_type':
this.options = this.options_entry_type
this.show = true
this.linkage = true
break;
// 跟进人员
case 'staff_id':
this.options = this.options_staff_id
this.show = true
this.linkage = true
break;
//跟进时间
case 'follow_up_time':
this.show_date = true
break;
}
},
//监听选择框
change(e) {
console.log('选择器选中',e)
this.show = false
let type = this.options_type
switch (type) {
//来源渠道
case 'source_channel':
this.str_source_channel = e.text//选中的text值
this.formData.source_channel = e.value//选中value值
break;
//客户来源
case 'customer_source':
this.str_customer_source = e.text//选中的text值
this.formData.customer_source = e.value//选中value值
break;
//顾问
case 'add_staff_id':
this.str_add_staff_id = e.text//选中的text值
this.formData.add_staff_id = e.value//选中value值
break;
// 跟进类型
case 'entry_type':
this.str_entry_type = e.text//选中的text值
this.formData.entry_type = e.value//选中value值
break;
// 跟进人员
case 'staff_id':
this.str_staff_id = e.text//选中的text值
this.formData.staff_id = e.value//选中value值
break;
//跟进时间
case 'follow_up_time':
break;
}
},
//选择跟进时间
change_date(e) {
if (this.options_date_type == 1) {
this.show_date = false
this.result_date = e.result ?? ''
} else if (this.options_date_type == 6) {
//跟进时间
this.show_date = false
this.result_dates = e.result ?? ''
this.formData.follow_up_time = e.result ?? ''
}
//跟进时间
this.show_date = false
this.formData.follow_up_time = e.result ?? ''
},
//关闭选择跟进时间
cancel_date() {
this.show_date = false
},
//监听选择框
change(e) {
this.show = false
console.log(e)
if (this.options_type == 1) {
//客户来源
this.result_customer_source = e.result
this.formData.customer_source = e.value
} else if (this.options_type == 2) {
//顾问(添加这条数据的工作人员id)
this.result_add_staff_id = e.result
this.formData.add_staff_id = e.value
} else if (this.options_type == 3) {
this.result_student = e.result
} else if (this.options_type == 4) {
this.result_status = e.result
} else if (this.options_type == 5) {
this.result_intention = e.result
} else if (this.options_type == 7) {
this.result_renwu = e.result
} else if (this.options_type == 8) {
this.result_fangshi = e.result
}
},
//多选客户标签-选中后回调
onConfirmCustomerTags(e) {
@ -917,10 +1010,10 @@ export default {
//2不跟进
this.formData.is_follow = '2'
// this.formData. = ''//跟进类型
this.formData.entry_type = ''//跟进类型
this.formData.staff_id = ''//跟进人员
this.formData.follow_up_time = ''//跟进时间
// this.formData. = ''//备注
this.formData.follow_up_content = ''//备注
}
},
}

Write Preview
Loading…
Cancel
Save