Skip to content

C
confucius
Commit bc9a0e85 authored by Mac's avatar Mac
Browse files
Options

提交企业微信 客户筛选

parent b7efe7cb
Hide whitespace changes
Inline Side-by-side
Showing with 332 additions and 44 deletions
src/pages/enterprise/customer/customer.vue
View file @ bc9a0e85
......@@ -103,31 +103,16 @@
</div>
<q-dialog v-model="isscreen" persistent>
<q-card style="width: 520px; max-width: 80vw;">
<q-card-section>
<div class="text-h6">自定义筛选</div>
</q-card-section>
<q-separator />
<!-- <q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;">
<q-input filled clearable v-model="addMsg.Name" label="分组名称"
:rules="[val => !!val || '请输入分组名称']" ref="Name" />
<q-input filled clearable v-model="addMsg.Sort" label="分组排序"
style="margin-top: 20px;" :rules="[val => !!val || '请输入分组排序']" ref="Sort"/>
</q-card-section> -->
<q-separator />
<q-card-actions align="right" class="bg-white">
<q-btn class="q-mr-md" label="取消" @click="isscreen = false" />
<q-btn color="accent" class="q-mr-md" label="确定" @click="submit()" />
</q-card-actions>
</q-card>
</q-dialog>
<div v-if="isscreen==true">
<customFilter :selectList="msg.SelectList" @close='isscreen=false'></customFilter>
</div>
</div>
</template>
<script>
import selectTree from '../../../components/common/select-tree'
import customFilter from './kehucomponents/customFilter'
import {
getEmployeeAddrBook,
getCustomerAddWayEnumList
......@@ -136,7 +121,8 @@
export default {
components: {
selectTree
selectTree,
customFilter
},
meta: {
title: "客户"
......@@ -334,7 +320,8 @@
},
customSettings() {//自定义设置
}
},
......
src/pages/enterprise/customer/kehucomponents/customFilter.vue
View file @ bc9a0e85
<style>
.customFilter .el-input__inner {
border: 1px solid #DCDFE6 !important;
}
.customFilter .text-clamp-1{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.customFilter .tag-select-input{
padding: 4px 10px;border-radius: 5px;background-color:#f6f6f6;font-size: 14px;
}
.customFilter .lablec{
display: none;
}
.customFilter .label-input{
width: 200px;height: 36px;border-radius: 4px;border: 1px solid #DCDFE6;font-size: 14px;padding: 0 10px 0 10px;display: flex;align-items: center;justify-content: space-between;
}
.customFilter .label-input:hover .lablec{
display: inline;
}
</style>
<template>
<div class="addwelcome page-body row" style="background: transparent;">
<div style="background: transparent;" class="customFilter">
<el-dialog title="自定义筛选" :visible.sync="isscreen" width="860" :close-on-click-modal='false' :before-close="goclose" >
<div v-if="selectList.length==0" style="color: #606266;">添加筛选条件 <i class="el-icon-circle-plus"
style="font-size: 17px;" @click="addsList"></i></div>
<div v-if="selectList.length>0">
<div style="margin-bottom: 17px;font-size: 14px;color: #000;font-weight: 700;">当客户符合以下条件时</div>
</div>
<div class="row" v-for="(x,y) in selectList">
<el-select v-model="x.Name" placeholder="请选择客户信息" @change="getName(x,y)" size='medium'>
<el-option v-for="item in filedList" :key="item.Id" :label="item.Name" :value="item.Id">
</el-option>
</el-select>
<!-- 图片 -->
<selectMaterial v-if="isshowselectMaterial" :materialType="materialType" :classifyList='classifyList'
@close="getclose()" @success='getsuccess'>
</selectMaterial>
<div v-if="x.Type==1||x.Type==2||x.Type==5 " style="margin-left: 10px;">
<el-select v-if="x.Type==1" v-model="x.Direction" placeholder="请选择" style="width: 150px;" size='medium'>
<el-option v-for="item in directionList1" :key="item.Id" :label="item.Name" :value="item.Id">
</el-option>
</el-select>
<el-select v-if="x.Type==2" v-model="x.Direction" placeholder="请选择" style="width: 150px;" size='medium'>
<el-option v-for="item in directionList2" :key="item.Id" :label="item.Name" :value="item.Id">
</el-option>
</el-select>
<el-select v-if="x.Type==3" v-model="x.Direction" placeholder="请选择" style="width: 150px;" size='medium'>
<el-option v-for="item in directionList5" :key="item.Id" :label="item.Name" :value="item.Id">
</el-option>
</el-select>
</div>
<div v-if="x.Name=='标签'" style="margin-left: 10px;">
<div class="label-input" @click="showlabel(y)">
<div style="display: flex;" v-if="x.LableIds && x.LableIds.length>0">
<div class="text-clamp-1 tag-select-input" style="max-width:110px;">
{{x.LableIds[0].Name}}
</div>
<div v-if="x.LableIds.length>1" class="tag-select-input" style="margin-left: 5px;">
{{x.LableIds.length-1}}+
</div>
</div>
<div v-if="x.LableIds && x.LableIds.length>0" class="lablec">
<i style="font-size: 16px;" class="el-icon-error" @click.stop="selectList[y].LableIds=[]"></i>
</div>
</div>
</div>
<el-select v-if="x.Name=='客户阶段'" v-model="x.Direction" placeholder="请选择" style="margin-left: 10px;" size='medium'>
<el-option v-for="item in StageList" :key="item.Id" :label="item.Name" :value="item.Id">
</el-option>
</el-select>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="goclose">取 消</el-button>
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
</span>
</el-dialog>
<labelPopup v-if="isshowlabel" :list='LableList' @close="isshowlabel=false" @submit='getlabel'></labelPopup>
</div>
</template>
<script>
import {
setWeChatWelcomesInfo,
getWeChatMediumGroupList,
getWeChatWelcomesInfo
} from '../../api/system/wechat';
getCustomerFiledList,//标签
getCustomerStageList,//阶段
} from '../../../../api/system/wechat';
import labelPopup from './labelPopup.vue'
export default {
meta: {
// title: "自定义筛选"
props: {
selectList: {
type: Array
}
},
components: {
labelPopup
},
name: "customFilter",
data() {
return {
isscreen: true,
filedList: [],
directionList1: [{ Id: 1, Name: '包含所有' }, { Id: 2, Name: '包含任意' }, { Id: 3, Name: '不包含' }, { Id: 4, Name: '为空' }, { Id: 5, Name: '不为空' },],
directionList2: [{ Id: 1, Name: '等于' }, { Id: 1, Name: '不等于' }, { Id: 1, Name: '为空' }, { Id: 1, Name: '不为空' }, { Id: 1, Name: '模糊' },],
directionList5: [{ Id: 1, Name: '等于' }, { Id: 1, Name: '大于' }, { Id: 1, Name: '大于等于' }, { Id: 1, Name: '小于' }, { Id: 1, Name: '小于等于' },],
isshowlabel:false,
selectindex:0,
LableList:[],
StageList:[]
}
},
created() {
if (this.selectList.length == 0) {//如果进来没有先增加一条
this.addsList()
this.selectList[0].Name = '标签'
this.selectList[0].Type = 1
}
this.getCustomerFiledList()
this.getCustomerStageList()
},
methods: {
goclose() {
this.$emit('close')
},
getCustomerFiledList() {//获取客户字段
getCustomerFiledList({ Enable: 1 }).then(res => {
if (res.Code == 1) {
this.filedList = res.Data;
let obj = { Id: '客户阶段', Name: '客户阶段', Type: 2 }
this.filedList.unshift(obj)
let obj2 = { Id: '标签', Name: '标签', Type: 1 }
this.filedList.unshift(obj2)
}
})
},
getCustomerStageList() {
getCustomerStageList({}).then(res => {
this.loading = false
if (res.Code == 1) {
this.StageList = res.Data;
}
})
},
addsList() {//给msg.SelectList追加
let obj = {
Name: '',
Type: '',
Direction: '',
StartValue: '',
EndValue: '',
IsCustom: '2',
LableIds:[],
StageId:'',
}
this.selectList.push(obj)
},
getName(item, index) {//选择客户信息的变化
for (var i = 0; i < this.filedList.length; i++) {
if (this.selectList[index].Name == this.filedList[i].Id) {
this.selectList[index].Type = this.filedList[i].Type;
break
}
}
},
showlabel(index){
this.isshowlabel = true
this.selectindex = index;
this.LableList = this.selectList[index].LableIds
},
getlabel(list){
this.isshowlabel = false;
this.selectList[this.selectindex].LableIds = list
}
......
src/pages/enterprise/customer/kehucomponents/labelPopup.vue 0 → 100644
View file @ bc9a0e85
<style>
.labelPopup .el-input__inner {
border: 1px solid #DCDFE6 !important;
}
.labelPopup .unchecked {
margin-right: 10px;
margin-top: 5px;
cursor: pointer;
padding: 0 10px;
font-size: 14px;
font-weight: 400;
height: 28px;
line-height: 28px;
border-radius: 4px;
background: #f6f6f6;
}
.labelPopup .select {
color: #3c66ee;
background-color: #edf2fd;
}
.labelPopup .el-tag{
color: #3470ff;
background: #edf2fd;
border-radius: 5px;
font-size: 14px;
font-weight: 400;
color: #3470ff;
height: 26px;
line-height: 26px;
}
</style>
<template>
<div style="background: transparent;" class="labelPopup">
<el-dialog title="客户标签" :visible.sync="isscreen" width="560" :close-on-click-modal='false'
:before-close="goclose">
<div style="max-height: 378px;overflow-y: auto;border-bottom: 1px solid #d7d7d7;">
<div v-for="(x,y) in LableList" :key="y" style="padding-bottom: 15px;">
<div style="color: #606266;font-size: 14px;font-weight: 700;">{{x.Name}}</div>
<div style="display: flex;flex-wrap: wrap;">
<div v-for="(item,index) in x.ChildList" :key="index" class="unchecked"
:class="{'select':item.chek==true}" @click="changechek(y,index)">{{item.Name}}</div>
</div>
</div>
</div>
<div style="display: flex;flex-wrap: wrap;max-height: 110px;overflow-y: auto;margin: 10px 0;">
<el-tag
v-for="(tag,tagindex) in selectList"
style="margin-right: 10px;margin-bottom: 10px;"
:key="tagindex"
closable
@close= "getclose(tag,tagindex)"
>
{{tag.Name}}
</el-tag>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="goclose">取 消</el-button>
<el-button type="primary" @click="determine">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import {
getWeChatLableList
} from '../../../../api/system/wechat';
export default {
props: {
list:{
type: Array
}
},
components: {
},
name: "customFilter",
data() {
return {
isscreen: true,
LableList: [],
selectList: [],
}
},
created() {
this.getLableList()
this.selectList = JSON.parse(JSON.stringify(this.list))
},
methods: {
goclose() {
this.$emit('close')
},
getLableList() {
getWeChatLableList({}).then(res => {
if (res.Code == 1) {
this.LableList = res.Data;
this.LableList.forEach(x => {
if (x.ChildList.length > 0) {
x.ChildList.forEach(j => {
j.chek = false;
for (let index = 0; index < this.list.length; index++) {
const element = this.list[index];
if(element.Id== j.Id){
j.chek = true;
break
}
}
})
}
})
}
}).catch(() => {
})
},
changechek(y, index) {//改变标签的状态
this.LableList[y].ChildList[index].chek = !this.LableList[y].ChildList[index].chek;
this.$forceUpdate();
this.getselectList()
},
getselectList() {
this.selectList = [];
this.LableList.forEach(x => {
if (x.ChildList.length > 0) {
x.ChildList.forEach(j => {
if(j.chek == true){
this.selectList.push(j)
}
})
}
})
},
getclose(tag,index){
let Id = tag.Id
for(let i=0;i<this.LableList.length;i++){
let ChildList = this.LableList[i].ChildList
if(ChildList.length>0){
for(let j=0;j<ChildList.length;j++){
if(Id == ChildList[j].Id){
this.LableList[i].ChildList[j].chek = false
this.selectList.splice(index,1)
this.$forceUpdate();
return
}
}
}
}
},
determine(){//确定提交
this.$emit('submit',this.selectList)
}
}
}
</script>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment