智慧教务系统
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

425 lines
11 KiB

<template>
<view class="assemble">
<view class="title">跟进任务</view>
<view class="form-style">
<fui-form class="input-style" ref="form" top="0" :model="formData" :show="false">
<!--基础表单-->
<!--下拉-->
<fui-form-item
asterisk
label="跟进类型"
asteriskPosition="right"
labelSize='26'
prop=""
background='#434544'
labelColor='#fff'
:bottomBorder='false'
>
<view class="input-title" style="margin-right:14rpx;">
<view v-if="!formData.entry_type" class="input-title" style="margin-right:14rpx;" @click="selectCon(`entry_type`)">点击选择
</view>
<view v-else class="input-title" style="margin-right:14rpx;" @click="selectCon(`entry_type`)">
{{ str_entry_type }}
</view>
</view>
</fui-form-item>
<!--下拉-->
<fui-form-item
asterisk
label="跟进人员"
asteriskPosition="right"
labelSize='26'
prop=""
background='#434544'
labelColor='#fff'
:bottomBorder='false'
>
<view class="input-title" style="margin-right:14rpx;">
<view v-if="!formData.follow_staff_id" class="input-title" style="margin-right:14rpx;" @click="selectCon(`follow_staff_id`)">点击选择
</view>
<view v-else class="input-title" style="margin-right:14rpx;" @click="selectCon(`follow_staff_id`)">
{{ str_follow_staff_id }}
</view>
</view>
</fui-form-item>
<!--下拉-->
<fui-form-item
asterisk
label="跟进时间"
asteriskPosition="right"
labelSize='26'
prop=""
background='#434544'
labelColor='#fff'
:bottomBorder='false'
>
<view class="input-title" style="margin-right:14rpx;">
<view v-if="!formData.reminder_time" class="input-title" style="margin-right:14rpx;" @click="selectCon(`reminder_time`)">点击选择
</view>
<view v-else class="input-title" style="margin-right:14rpx;" @click="selectCon(`reminder_time`)">
{{ formData.reminder_time }}
</view>
</view>
</fui-form-item>
<!--手写-->
<fui-form-item
label="备注"
asteriskPosition="right"
labelSize='26'
prop=""
background='#434544'
labelColor='#fff'
:bottomBorder='false'
>
<view class="input-title" style="margin-right:14rpx;">
<fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.follow_content"
backgroundColor="#434544" size="26" color="#fff"></fui-input>
</view>
</fui-form-item>
</fui-form>
</view>
<view class="fui-btn__box">
<fui-button background="#434544" color="#24BA9F" borderColor="#24BA9F" @click="submit">保存</fui-button>
</view>
<!-- 年月日-选择时间 -->
<fui-date-picker :show="show_date" type="5" @change="change_date" @cancel="cancel_date"></fui-date-picker>
<!-- 下拉选择器 -->
<fui-picker :linkage='linkage' :options="options" :layer="1" :show="show" @change="changeOptions"
@cancel="cancel"></fui-picker>
</view>
</template>
<script>
import marketApi from '@/api/market.js';
import memberApi from '@/api/member.js';
const rules = [{
name: "mobile",
rule: ["required", "isMobile"],
msg: ["请输入手机号", "请输入正确的手机号"]
}];
export default {
data() {
return {
rules,
is_submit: true,//是否提交(防止重复提交)|true=可提交,false=不可提交
//表单数据
formData:{
//##### 基础表单 #####
entry_type:'',//跟进类型(1=市场人员录入的,2=销售人员录入)
follow_staff_id:'',//跟进人员
reminder_time:'',//跟进时间
follow_content:'',//备注
},
//下拉选择器组件
options_type: undefined,//选择器标识
show: false,//是否显示下拉选择器
linkage: true,//是否联动选择
options: [
// {
// 'value': 1,
// 'text': '类型1'
// }
],//下拉选择器可选值列表
//时间选择器相关
show_date: false,//是否显示时间选择器|true=是,false=否
//跟进类型-相关
//字典-跟进类型
options_entry_type:[
{
value: 1,
text: '市场人员'
},
{
value: 2,
text: '销售人员'
},
],
//文本展示-跟进类型
str_entry_type:'',
//跟进人员-相关
//字典-跟进人员
options_follow_staff_id_sc:[],//(市场-跟进人员)
options_follow_staff_id_xs:[],//(销售-跟进人员)
//文本展示-跟进人员
str_follow_staff_id:'',
}
},
onShow() {
this.init()
},
methods: {
//初始化
async init() {
this.getUserInfo()
//获取字典-跟进人员(市场)
this.getDic_staff_id('5')
//获取字典-跟进人员(销售)
this.getDic_staff_id('6')
},
//获取当前登陆用户信息
async getUserInfo(){
let res = await marketApi.member({})
if (res.code != 1) {
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
console.log(111,res.data)
this.formData.staff_id = res.data.staff_id//基础表单->跟进人员
this.str_staff_id = res.data.name//基础表单->跟进人员名字
},
//获取字典-跟进人员(全部)
//获取人员列表 role_id|5=市场,6=销售
async getDic_staff_id(role_id){
let res = await memberApi.staffList({
type: 2,
role_id:role_id
})
if (res.code != 1) {
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
let arr = []
res.data.forEach((v,k)=>{
arr.push({
text: v.name,
value: v.id,
})
})
if(role_id == 5){
this.options_follow_staff_id_sc = arr
console.log('市场',arr)
}else if(role_id == 6){
this.options_follow_staff_id_xs = arr
console.log('销售',arr)
}else{
//全部
this.options_staff_id = arr
console.log('全部',arr)
}
},
//表单验证
async validatorForm(data) {
//跟进类型
if(!data.entry_type){
uni.showToast({
title: '跟进类型必填',
icon: 'none'
})
return false
}
//跟进人员
if(!data.follow_staff_id){
uni.showToast({
title: '跟进人员必填',
icon: 'none'
})
return false
}
//跟进时间
if(!data.reminder_time){
uni.showToast({
title: '跟进时间必填',
icon: 'none'
})
return false
}
return true
},
//提交
async submit() {
console.log('提交',this.formData)
let data = {...this.formData}
//表单验证
let validatorForm = await this.validatorForm(data)
console.log('验证结果',validatorForm)
if(!validatorForm){
return
}
//防止重复提交
if (!this.is_submit) {
return
}
this.is_submit = false
let res = await marketApi.createTask(data)//转移跟进任务
this.is_submit = true
if(res.code != 1){
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
uni.showToast({
title: res.msg,
icon: 'success'
})
//延迟1s执行
setTimeout(() => {
//跳转页面-线索列表
//关闭当前页跳转新页面
uni.redirectTo({
url: `/pages/market/clue/index`
})
}, 1000)
},
//选择弹窗
selectCon(type) {
this.options_type = type
switch (type) {
//跟进类型
case 'entry_type':
this.options = this.options_entry_type
this.show = true
this.linkage = true
//清空跟进任务->跟进人员
this.formData.follow_staff_id = ''
break;
//跟进任务->跟进人员
case 'follow_staff_id':
if(!this.formData.entry_type){
uni.showToast({
title: '请先选择跟进类型',
icon: 'none'
})
return
}
if(this.formData.entry_type == 1){
//市场人员列表
this.options = this.options_follow_staff_id_sc
}else{
//销售人员列表
this.options = this.options_follow_staff_id_xs
}
this.show = true
this.linkage = true
break;
//跟进时间
case 'reminder_time':
this.show_date = true
break;
}
},
//监听-下拉选择框
changeOptions(e) {
console.log('选择器选中',e)
this.show = false
let type = this.options_type
switch (type) {
//跟进类型
case 'entry_type':
this.str_entry_type = e.text//选中的text值
this.formData.entry_type = e.value//选中value值
break;
//跟进人员
case 'follow_staff_id':
this.str_follow_staff_id = e.text//选中的text值
this.formData.follow_staff_id = e.value//选中value值
break;
}
},
//关闭选择框
cancel() {
this.show = false
},
//监听-时间选择器
change_date(e) {
this.show_date = false
//跟进时间
let type = this.options_type
console.log('时间选择器',type,e)
let val = (e.result ?? '')
if(val){
val = val + ':00'
}
switch (type) {
//跟进任务->跟进时间
case 'reminder_time':
this.formData.reminder_time = val
break;
}
},
//关闭时间选择器
cancel_date() {
this.show_date = false
},
}
}
</script>
<style lang="less" scoped>
.assemble {
width: 100%;
height: 100vh;
background: #292929;
}
.title {
font-size: 26rpx;
color: #fff;
padding: 26rpx 0 26rpx 32rpx;
}
.input-title {
font-size: 26rpx;
color: #fff;
}
.form-style {
width: 100%;
background: #434544;
}
.form-style-vid {
display: flex;
align-items: center;
justify-content: space-between;
padding: 12rpx 0;
}
.input-style {
text-align: right !important;
}
.fui-btn__box {
margin: 20rpx auto;
width: 92%;
}
</style>