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.
377 lines
12 KiB
377 lines
12 KiB
<template>
|
|
<view class="assemble">
|
|
<view class="form-style">
|
|
<fui-form ref="form" top="0" :model="formData" :show="false">
|
|
|
|
<view class="title" style="margin-top: 20rpx;">基础信息</view>
|
|
<view class="input-style">
|
|
<fui-form-item label="跟进类型" asterisk asteriskPosition="right" labelSize='26' prop="name" background='#434544' labelColor='#fff'
|
|
:bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" v-if="result_leixing == ''"
|
|
@click="selectCon(2)">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" v-else @click="selectCon(2)">{{ result_leixing }}
|
|
</view>
|
|
</fui-form-item>
|
|
<fui-form-item label="跟进时间" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)"
|
|
v-if="result_date == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)" v-else>{{ result_date }}
|
|
</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.mobile"
|
|
backgroundColor="#434544" size="26" color="#fff"></fui-input>
|
|
</fui-form-item>
|
|
<fui-form-item label="学员名称" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(3)"
|
|
v-if="result_student == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(3)" v-else>{{ result_student }}
|
|
</view>
|
|
</fui-form-item>
|
|
<fui-form-item label="客户状态" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(4)"
|
|
v-if="result_status == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(4)" v-else>{{ result_status }}
|
|
</view>
|
|
</fui-form-item>
|
|
<fui-form-item label="签单意向联系人" labelWidth="230" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(5)"
|
|
v-if="result_intention == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(5)" v-else>{{ result_intention }}
|
|
</view>
|
|
</fui-form-item>
|
|
</view>
|
|
|
|
|
|
<view class="input-style" style="margin-top: 50rpx;">
|
|
<view class="input-style">
|
|
<fui-form-item label="客户状态" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(4)"
|
|
v-if="result_status == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(4)" v-else>{{ result_status }}
|
|
</view>
|
|
</fui-form-item>
|
|
<fui-form-item label="签单意向联系人" labelWidth="230" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(5)"
|
|
v-if="result_intention == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(5)" v-else>{{ result_intention }}
|
|
</view>
|
|
</fui-form-item>
|
|
</view>
|
|
<view>
|
|
<fui-form-item label="跟进内容" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
</fui-form-item>
|
|
<view style="width: 100%;background: #434544;">
|
|
<view style="margin: auto;width: 92%;padding: 20rpx 0 50rpx;">
|
|
<fui-textarea :padding="[0]" v-model="formData.mobile"
|
|
backgroundColor="#434544" size="26" color="#fff" :textareaBorder="true"></fui-textarea>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="title" style="margin-top: 20rpx;">跟进任务</view>
|
|
<view class="input-style">
|
|
<fui-form-item label="创建下次跟进任务" labelWidth="250" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
<fui-switch @change="switchChange" checked></fui-switch>
|
|
</fui-form-item>
|
|
<view v-if="switchChange_type == 1">
|
|
|
|
<fui-form-item label="跟进时间" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
|
|
background='#434544' labelColor='#fff' :bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(6)"
|
|
v-if="result_dates == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(6)" v-else>{{ result_dates }}
|
|
</view>
|
|
</fui-form-item>
|
|
<fui-form-item label="跟进内容" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
|
|
:bottomBorder='false'>
|
|
<fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.mobile"
|
|
backgroundColor="#434544" size="26" color="#fff"></fui-input>
|
|
</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.mobile"
|
|
backgroundColor="#434544" size="26" color="#fff"></fui-input>
|
|
</fui-form-item>
|
|
<fui-form-item label="任务提醒" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
|
|
:bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(7)"
|
|
v-if="result_renwu == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(7)" v-else>{{ result_renwu }}
|
|
</view>
|
|
</fui-form-item>
|
|
<fui-form-item label="提醒方式" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
|
|
:bottomBorder='false'>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(8)"
|
|
v-if="result_fangshi == ''">点击选择</view>
|
|
<view class="input-title" style="margin-right:14rpx;" @click="selectCon(8)" v-else>{{ result_fangshi }}
|
|
</view>
|
|
</fui-form-item>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
</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="3" @change="change_date" @cancel="cancel_date"></fui-date-picker>
|
|
|
|
<!-- 选择器 -->
|
|
<fui-picker :linkage='linkage' :options="options" :layer="1" :show="show" @change="change" @cancel="cancel"></fui-picker>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
const rules = [{
|
|
name: "mobile",
|
|
rule: ["required", "isMobile"],
|
|
msg: ["请输入手机号", "请输入正确的手机号"]
|
|
}];
|
|
export default {
|
|
data() {
|
|
return {
|
|
switchChange_type: 1,
|
|
rules,
|
|
formData: {},
|
|
show_date: false,
|
|
result_date: '',
|
|
result_leixing: '',
|
|
result_student: '',
|
|
result_status: '',
|
|
result_intention: '',
|
|
|
|
result_dates: '',
|
|
result_renwu: '',
|
|
result_fangshi: '',
|
|
|
|
show: false,
|
|
options: [],
|
|
linkage: true,
|
|
options_type : undefined,
|
|
options_leixing: [{
|
|
'value': 1,
|
|
'text': '类型1'
|
|
}, {
|
|
'value': 2,
|
|
'text': '类型2'
|
|
}, {
|
|
'value': 3,
|
|
'text': '类型3'
|
|
}],
|
|
options_student: [{
|
|
'value': 1,
|
|
'text': '张三'
|
|
}, {
|
|
'value': 2,
|
|
'text': '李四'
|
|
}, {
|
|
'value': 3,
|
|
'text': '王五'
|
|
}],
|
|
options_status: [{
|
|
'value': 1,
|
|
'text': '状态1'
|
|
}, {
|
|
'value': 2,
|
|
'text': '状态2'
|
|
}, {
|
|
'value': 3,
|
|
'text': '状态3'
|
|
}],
|
|
options_intention: [{
|
|
'value': 1,
|
|
'text': '张三1'
|
|
}, {
|
|
'value': 2,
|
|
'text': '李四2'
|
|
}, {
|
|
'value': 3,
|
|
'text': '王五3'
|
|
}],
|
|
options_kehu: [{
|
|
'value': 1,
|
|
'text': '张三'
|
|
}, {
|
|
'value': 2,
|
|
'text': '李四'
|
|
}, {
|
|
'value': 3,
|
|
'text': '王五'
|
|
}],
|
|
options_renwu: [{
|
|
'value': 1,
|
|
'text': '是'
|
|
}, {
|
|
'value': 2,
|
|
'text': '否'
|
|
}],
|
|
options_fangshi: [{
|
|
'value': 1,
|
|
'text': '短信'
|
|
}, {
|
|
'value': 2,
|
|
'text': '微信'
|
|
}]
|
|
}
|
|
},
|
|
methods: {
|
|
submit() {
|
|
console.log(this.formData)
|
|
this.$refs.form.validator(null, null, true).then(res => {
|
|
console.log(res)
|
|
if (res.isPassed) {
|
|
console.log('校验通过！')
|
|
} else {
|
|
console.log('向上滑动页面查看错误提示！')
|
|
}
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
},
|
|
//选择弹窗
|
|
selectCon(type) {
|
|
if (type == 1) {
|
|
//选择跟进时间
|
|
this.options_date_type = 1
|
|
this.show_date = true
|
|
} else if (type == 2) {
|
|
this.options_type = 2
|
|
this.options = this.options_leixing
|
|
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
|
|
}
|
|
},
|
|
//选择跟进时间
|
|
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 ?? ''
|
|
}
|
|
},
|
|
//关闭选择跟进时间
|
|
cancel_date() {
|
|
this.show_date = false
|
|
},
|
|
//选择框
|
|
change(e) {
|
|
this.show = false
|
|
console.log(e)
|
|
if(this.options_type == 2){
|
|
this.result_leixing = e.result
|
|
} 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
|
|
}
|
|
},
|
|
//关闭选择框
|
|
cancel() {
|
|
this.show = false
|
|
},
|
|
//开关选择
|
|
switchChange(e){
|
|
if(e.detail.value){
|
|
this.switchChange_type = 1
|
|
}else{
|
|
this.switchChange_type = 2
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.assemble {
|
|
width: 100%;
|
|
height: 100vh;
|
|
background: #292929;
|
|
overflow: auto;
|
|
}
|
|
|
|
.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: 50rpx auto 120rpx;
|
|
width: 92%;
|
|
}
|
|
</style>
|