Skip to content

H
horse
Commit 4a0b85cd authored by 罗超's avatar 罗超
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/xiangwei/horse into master 

# Conflicts:
#	src/api/customer.ts
parents ba312684 ee691719
Hide whitespace changes
Inline Side-by-side
Showing with 551 additions and 203 deletions
src/api/customer.ts
View file @ 4a0b85cd
...@@ -30,15 +30,23 @@ ...@@ -30,15 +30,23 @@
responseType: 'json', responseType: 'json',
data data
}) })
} }
// 获取客户标签 // 获取客户标签
static async getLabelList(data: any): Promise<HttpResponse> { static async getLabelList(data: any): Promise<HttpResponse> {
return Axios('/QYWeChat/GetWeChatLableList', { return Axios('/QYWeChat/GetWeChatLableList', {
method: 'post', method: 'post',
responseType: 'json', responseType: 'json',
data data
}) })
} }
// 客户标签移动
static async setCustomerFiledState(data: {Type:number, SortFiledId:number,FiledId:number}): Promise<HttpResponse> {
return Axios('/QYCustomer/SetCustomerFiledState', {
method: 'post',
responseType: 'json',
data
})
}
// 获取客户线索规则列表 // 获取客户线索规则列表
static async getCustomerClueRuleList(data: any): Promise<HttpResponse> { static async getCustomerClueRuleList(data: any): Promise<HttpResponse> {
return Axios('/QYCustomer/GetCustomerClueRuleList', { return Axios('/QYCustomer/GetCustomerClueRuleList', {
......
src/components/customer/request-group.vue
View file @ 4a0b85cd
<style> <style>
.my-special-class { .my-special-class {
width: 200px; width: 200px;
margin-right: 6px; margin-right: 6px;
} }
.input_label { .input_label {
width: 200px; width: 200px;
height: 40px; height: 40px;
border-radius: 4px; border-radius: 4px;
border: 1px solid rgb(0 0 0 / 24%); border: 1px solid rgb(0 0 0 / 24%);
font-size: 14px; font-size: 14px;
padding: 0 10px 0 10px; padding: 0 10px 0 10px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
cursor: pointer; cursor: pointer;
} }
.right_select { .right_select {
width: 40px; width: 40px;
position: absolute; position: absolute;
left: 0; left: 0;
top: 20px; top: 20px;
} }
.border_top { .border_top {
border: 1px solid #d7d7d7; border: 1px solid #d7d7d7;
width: 29px; width: 29px;
border-bottom: none; border-bottom: none;
border-right: none; border-right: none;
margin-left: 12px; margin-left: 12px;
} }
.border-bottom { .border-bottom {
border: 1px solid #d7d7d7; border: 1px solid #d7d7d7;
width: 29px; width: 29px;
border-top: none; border-top: none;
border-right: none; border-right: none;
margin-left: 12px; margin-left: 12px;
} }
.right_select .border_mid div { .right_select .border_mid div {
width: 23px; width: 23px;
height: 23px; height: 23px;
text-align: center; text-align: center;
line-height: 23px; line-height: 23px;
color: #000; color: #000;
font-size: 12px; font-size: 12px;
cursor: pointer; cursor: pointer;
background: #d8d8d8; background: #d8d8d8;
} }
.right_select .border_mid .checked { .right_select .border_mid .checked {
background: #333 !important; background: #333 !important;
color: #fff !important; color: #fff !important;
} }
.tag-select-input {
padding: 4px 10px; .tag-select-input {
border-radius: 5px; padding: 4px 10px;
background-color: #f6f6f6; border-radius: 5px;
font-size: 14px; background-color: #f6f6f6;
} font-size: 14px;
}
</style> </style>
<template> <template>
<div class="requestgroup"> <div class="requestgroup">
<div :style="{'position':'relative','padding-left':addMsg.length>1?'40px':'0'}"> <div :style="{ 'position': 'relative', 'padding-left': addMsg.length > 1 ? '40px' : '0' }">
<div class="row" v-for="(x,y) in addMsg" :key='y' style="margin-bottom: 8px"> <div class="row" v-for="(x,y) in addMsg" :key="y" style="margin-bottom: 8px">
<q-select outlined v-model="x.Name" :options="filedList" dense class="my-special-class" label='请选择客户信息' <!-- name -->
option-value="Id" option-label="Name" /> <q-select
<q-select v-if="x.Type==1 || x.Type=='' " outlined v-model="x.Direction" :options="directionList1" dense outlined
label='请选择' class="my-special-class" option-value="Id" option-label="Name" /> v-model="x.Name"
<q-input v-if="x.Type==''" outlined v-model="x.StartValue" label="请输入" dense /> :options="filedList"
<div v-if="x.Name=='标签'" class="input_label" @click="showlabel(y)"> dense
<div style="display: flex;" v-if="x.StartValue && x.StartValue.length>0"> class="my-special-class"
<div class="text-clamp-1 tag-select-input" style="max-width:110px;"> label="请选择客户信息"
{{x.StartValue[0].Name}} option-value="Id"
</div> option-label="Name"
<div v-if="x.StartValue.length>1" class="tag-select-input" style="margin-left: 5px;"> option-disable="disable"
{{x.StartValue.length-1}}+ emit-value
</div> map-options
@update:model-value="changeName($event, y)"
/>
<!-- Direction -->
<q-select
v-if="x.Type === 1 || x.Type === 2 || x.Type === 5 || x.Type == ''"
outlined
v-model="x.Direction"
:options="x.directionList"
dense
label="请选择"
class="my-special-class"
option-value="Id"
option-label="Name"
emit-value
map-options
/>
<!-- StartValue -->
<div v-if="x.Name == '标签'" class="input_label" @click="showlabel(y)">
<div style="display: flex;" v-if="x.StartValue && x.StartValue.length > 0">
<div
class="text-clamp-1 tag-select-input"
style="max-width:110px;"
>{{ x.StartValue[0].Name }}</div>
<div
v-if="x.StartValue.length > 1"
class="tag-select-input"
style="margin-left: 5px;"
>{{ x.StartValue.length - 1 }}+</div>
</div> </div>
<div v-if="x.StartValue && x.StartValue.length>0" class="lablec">
<i style="font-size: 16px;" class="el-icon-error" <div v-if="x.StartValue && x.StartValue.length > 0" class="lablec">
@click.stop="addMsg[y].StartValue=[]"></i> <i
style="font-size: 16px;"
class="el-icon-error"
@click.stop="addMsg[y].StartValue = []"
></i>
</div> </div>
</div> </div>
<div
v-if="(x.Type === 1 || x.Type === 2 || x.Type === 5 || x.Type == '') && x.Name !== '标签'"
>
<q-select
v-if="x.isSelect"
outlined
v-model="x.StartValue"
:options="x.OptionsList"
dense
label="请选择"
class="my-special-class"
option-value="Id"
option-label="Name"
emit-value
map-options
/>
<q-input v-if="!x.isSelect&&x.Direction" outlined v-model="x.StartValue" label="请输入" dense />
</div>
<!-- 新增和删除 --> <!-- 新增和删除 -->
<div style="display: flex;align-items: center;"> <div style="display: flex;align-items: center;">
<img src="../../assets/images/customer/delete.png" alt="" v-if="addMsg.length>1" <img
style='width: 20px;height: 20px;margin-left: 10px;' @click="deleteadd(y)" /> src="../../assets/images/customer/delete.png"
<img src="../../assets/images/customer/add.png" alt="" v-if="addMsg.length==y+1" alt
style='width: 20px;height: 20px;margin-left: 10px;' @click="addsList()" /> v-if="addMsg.length > 1"
style="width: 20px;height: 20px;margin-left: 10px;"
@click="deleteadd(y)"
/>
<img
src="../../assets/images/customer/add.png"
alt
v-if="addMsg.length == y + 1"
style="width: 20px;height: 20px;margin-left: 10px;"
@click="addsList()"
/>
</div> </div>
</div> </div>
<div data-v-0dbac2e3="" class="right_select" v-if="addMsg.length>1"> <div class="right_select" v-if="addMsg.length > 1">
<div data-v-0dbac2e3="" class="border_top" <div
:style="{height:((addMsg.length*48 -8 - 46 - 40 )/2) + 'px'}"></div> class="border_top"
<div data-v-0dbac2e3="" class="border_mid"> :style="{ height: ((addMsg.length * 48 - 8 - 46 - 40) / 2) + 'px' }"
<div data-v-0dbac2e3="" class="and" :class="{ 'checked': addtion == 1 }" @click="addtion=1">且</div> ></div>
<div data-v-0dbac2e3="" class="no" :class="{ 'checked': addtion == 2 }" @click="addtion=2">或</div> <div class="border_mid">
<div class="and" :class="{ 'checked': addtion == 1 }" @click="addtion = 1">且</div>
<div class="no" :class="{ 'checked': addtion == 2 }" @click="addtion = 2">或</div>
</div> </div>
<div data-v-0dbac2e3="" class="border-bottom" <div
:style="{height:((addMsg.length*48 -8 - 46 - 40 )/2) + 'px'}"></div> class="border-bottom"
:style="{ height: ((addMsg.length * 48 - 8 - 46 - 40) / 2) + 'px' }"
></div>
</div> </div>
</div> </div>
<labelgroup v-if="isshowlabel" :list='LableList' @close="isshowlabel=false" @submit='getlabel'></labelgroup> <labelgroup
v-if="isshowlabel"
:list="LableList"
@close="isshowlabel = false"
@submit="getlabel"
></labelgroup>
</div> </div>
</template> </template>
<script> <script lang="ts">
import { defineComponent, ref, onMounted } from 'vue' import {
import customerService from '@/api/customer' defineComponent,
import labelgroup from './label-group.vue' ref,
export default defineComponent({ watch,
props: { onMounted
addCondition: { } from 'vue'
type: Number, import customerService from '@/api/customer'
default: 1 import labelgroup from './label-group.vue'
}, interface params {
Name: number | string
IsCustom: number
Type: number | string
Id?: number | string
Direction?: string
StartValue?: string
EndValue?: string
disable?: boolean
directionList?: Array<any>
OptionsList?: Array<any>
isSelect?: boolean
}
export default defineComponent({
props: {
addCondition: {
type: Number,
default: 1
}, },
components: { },
labelgroup, components: {
}, labelgroup,
setup(props) { },
let addtion = ref(props.addCondition) setup(props) {
let filedList = ref([]);//客户字段数组 let addtion = ref(props.addCondition)
let addMsg = ref([])//筛选数组 let filedList = ref<Array<params>>([]); //客户字段数组
let isshowlabel = ref(false)//标签弹出显示 let addMsg = ref<Array<params>>([]) //筛选数组
let selectindex = ref(0)//现在筛选数组 索引 let isshowlabel = ref(false) //标签弹出显示
let LableList = []//标签的数组 let selectindex = ref(0) //现在筛选数组 索引
const directionList1 = ref([{ Id: 1, Name: '包含所有' }, { Id: 2, Name: '包含任意' }, { Id: 3, Name: '不包含' }, { Id: 4, Name: '为空' }, { Id: 5, Name: '不为空' },]) let LableList = ref<Array<any> | string>([]) //标签的数组
const directionList2 = ref([{ Id: 1, Name: '等于' }, { Id: 1, Name: '不等于' }, { Id: 1, Name: '为空' }, { Id: 1, Name: '不为空' }, { Id: 1, Name: '模糊' },]) const directionList1 = [{
const directionList5 = ref([{ Id: 1, Name: '等于' }, { Id: 1, Name: '大于' }, { Id: 1, Name: '大于等于' }, { Id: 1, Name: '小于' }, { Id: 1, Name: '小于等于' },]) Id: 1,
Name: '包含所有'
onMounted(() => {//进入页面就调用 }, {
getCustomerFiledList();//获取客户字段 Id: 2,
Name: '包含任意'
}, {
Id: 3,
Name: '不包含'
}, {
Id: 4,
Name: '为空'
}, {
Id: 5,
Name: '不为空'
},]
const directionList2 = [{
Id: 1,
Name: '等于'
}, {
Id: 2,
Name: '不等于'
}, {
Id: 3,
Name: '为空'
}, {
Id: 4,
Name: '不为空'
}, {
Id: 5,
Name: '模糊'
},]
const directionList5 = [{
Id: 1,
Name: '等于'
}, {
Id: 2,
Name: '大于'
}, {
Id: 3,
Name: '大于等于'
}, {
Id: 4,
Name: '小于'
}, {
Id: 5,
Name: '小于等于'
},]
const getCustomerFiledList = () => {
customerService.getCustomerFiledList({
Enable: 1
}).then((res) => {
let data = res.data.Data
filedList.value = data;
filedList.value.forEach((x) => { // IsCustom 是否自定义字段 1是 2标签 3阶段
x.IsCustom = 1
})
getCustomerStageList(); //获取客户阶段
}) })
const getCustomerFiledList = () => { }
const getCustomerStageList = () => {
customerService.getCustomerStageList({}).then(res => {
customerService.getCustomerFiledList({ Enable: 1 }).then((res) => { let obj: params = {
let data = res.data.Data Id: '客户阶段',
filedList.value = data; Name: '客户阶段',
filedList.value.forEach((x) => {// IsCustom 是否自定义字段 1是 2标签 3阶段 Type: 3,
x.IsCustom = 1 IsCustom: 3,
}) OptionsList: res.data.Data
}
let obj = { Id: '客户阶段', Name: '客户阶段', Type: 3, IsCustom: 3 } filedList.value.unshift(obj)
filedList.value.unshift(obj) let obj2: params = {
let obj2 = { Id: '标签', Name: '标签', Type: 4, IsCustom: 2 } Id: '标签',
filedList.value.unshift(obj2) Name: '标签',
let type = 1; Type: 4,
if (filedList.value[0].Type == 4) {//多选 IsCustom: 2
type = 1; }
filedList.value.unshift(obj2)
addMsg.value.push({
Name: '标签',
Type: 1,
Direction: '',
StartValue: '',
EndValue: '',
IsCustom: 2,
directionList: directionList1
})
console.log("标签", filedList.value)
})
}
const deleteadd = (index) => { //删除addMsg某一项
addMsg.value.splice(index, 1)
}
const addsList = () => {
let obj: params = {
Name: '',
Type: '',
Direction: '',
StartValue: '',
EndValue: '',
IsCustom: 2,
directionList: directionList2
}
addMsg.value.push(obj)
}
const showlabel = (y) => {
selectindex.value = y;
if (addMsg.value[y].StartValue == '') { //为空赋值为数组
LableList.value = []
} else {
LableList.value = addMsg.value[y].StartValue || ''
}
isshowlabel.value = true
}
const getlabel = (list) => {
isshowlabel.value = false;
addMsg.value[selectindex.value].StartValue = list
}
//----------------------------------------------------------------------------
// 禁用标签
let changeLabel = () => {
let find: any = addMsg.value.find((e) => {
return e.Name == '标签'
})
if (find) {
filedList.value.map((_e) => {
if (_e.Id == '标签') {
_e.disable = true
}
})
} else {
filedList.value.map((_e) => {
if (_e.Id == '标签') {
_e.disable = false
} }
addMsg.value.push({
Name: filedList.value[0].Id,
Type: type,
Direction: '',
StartValue: '',
EndValue: '',
IsCustom: filedList.value[0].IsCustom,
})
}) })
} }
const deleteadd = (index) => {//删除addMsg某一项 //禁用生日
addMsg.value.splice(index, 1) let find2: any = addMsg.value.find((e) => {
return e.Name == 26
})
if (find2) {
filedList.value.map((_e) => {
if (_e.Id == 26) {
_e.disable = true
}
})
} else {
filedList.value.map((_e) => {
if (_e.Id == 26) {
_e.disable = false
}
})
} }
const addsList = () => { }
let obj = {
Name: '', //标签改变
Type: '', let changeName = (val: any, y: number) => {
Direction: '',
StartValue: '', switch (val) {
EndValue: '', case "标签": {
IsCustom: '2', addMsg.value[y].IsCustom = 2
break;
} }
addMsg.value.push(obj) case "客户阶段": {
} addMsg.value[y].IsCustom = 3
break;
const showlabel = (y) =>{ }
default: {
selectindex.value = y; addMsg.value[y].IsCustom = 1
if(addMsg.value[y].StartValue==''){//为空赋值为数组
LableList.value = []
}else{
LableList.value = addMsg.value[y].StartValue
} }
isshowlabel.value = true
}
const getlabel=(list)=> {
isshowlabel.value = false;
addMsg.value[selectindex.value].StartValue = list
} }
return { let find: any = filedList.value.find((e) => {
getCustomerFiledList, return e.Id == val
filedList, })
addMsg, console.log(400, find)
directionList1, switch (find.Type) {
directionList2, case 1: {
directionList5, addMsg.value[y].directionList = directionList2
deleteadd, addMsg.value[y].Type = 2
addsList, addMsg.value[y].isSelect = false
addtion, break;
isshowlabel, }
selectindex, case 2: {
LableList, addMsg.value[y].directionList = directionList2
showlabel, addMsg.value[y].Type = 2
getlabel addMsg.value[y].isSelect = false
break;
}
case 3: {
addMsg.value[y].directionList = directionList2
addMsg.value[y].Type = 2
if (find.OptionsList) {
addMsg.value[y].isSelect = true
addMsg.value[y].OptionsList = find.OptionsList
}
break;
}
case 4: {
addMsg.value[y].directionList = directionList1
addMsg.value[y].Type = 1
if (find.OptionsList) {
addMsg.value[y].isSelect = true
addMsg.value[y].OptionsList = find.OptionsList
}
console.log(426, addMsg.value[y])
break;
}
case 5: {
addMsg.value[y].Type = 3
addMsg.value[y].isSelect = false
break;
}
case 6: {
addMsg.value[y].Type = 4
addMsg.value[y].isSelect = false
break;
}
case 7: {
addMsg.value[y].directionList = directionList5
addMsg.value[y].Type = 5
addMsg.value[y].isSelect = false
break;
}
} }
} }
watch(() => [...addMsg.value], (val) => {
console.log('watch', val)
changeLabel()
}, { deep: true })
onMounted(() => { //进入页面就调用
getCustomerFiledList(); //获取客户字段
})
return {
getCustomerFiledList,
filedList,
addMsg,
deleteadd,
addsList,
addtion,
isshowlabel,
selectindex,
LableList,
showlabel,
getlabel,
changeName
}
}
}) })
</script> </script>
\ No newline at end of file
src/pages/customer/components/customerField.vue
View file @ 4a0b85cd
<template> <template>
<requestgroup></requestgroup> <!-- <requestgroup></requestgroup> -->
<div class="q-pa-md customerField"> <div class="q-pa-md customerField">
<table class="payTable"> <table class="payTable">
<thead> <thead>
...@@ -30,11 +30,11 @@ ...@@ -30,11 +30,11 @@
<q-toggle v-if="element.IsLock==1" v-model="element.Enable" :true-value="1" :false-value="2" <q-toggle v-if="element.IsLock==1" v-model="element.Enable" :true-value="1" :false-value="2"
icon="lock" disable /> icon="lock" disable />
<q-toggle v-else v-model="element.Enable" :true-value="1" :false-value="2" <q-toggle v-else v-model="element.Enable" :true-value="1" :false-value="2"
@input="godelete(element,1,index)" /> @update:model-value="godelete(element,1,index)" />
</td> </td>
<td> <td>
<q-toggle v-model="element.Required" :true-value="1" :false-value="2" <q-toggle v-model="element.Required" :true-value="1" :false-value="2"
@input="godelete(element,2,index)" /> @update:model-value="godelete(element,2,index)" />
</td> </td>
<td> <td>
<div>{{element.UpdateByName}}</div> <div>{{element.UpdateByName}}</div>
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
class="q-mr-xs" label="删除" @click="godelete(element,3,index)" /> class="q-mr-xs" label="删除" @click="godelete(element,3,index)" />
</td> </td>
<td> <td>
<i class="iconfont icon-weiyi" style="font-size: 14px;color: #777;"></i> <i class="iconfont icon-drag" style="font-size: 20px;color: #777;"></i>
</td> </td>
</tr> </tr>
</template> </template>
...@@ -58,28 +58,109 @@ ...@@ -58,28 +58,109 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent ,ref, onMounted } from 'vue' import { defineComponent ,ref, onMounted,reactive } from 'vue'
import requestgroup from '../../../components/customer/request-group.vue' import requestgroup from '../../../components/customer/request-group.vue'
import customerService from '@/api/customer' import customerService from '@/api/customer'
import draggable from "vuedraggable"; import draggable from "vuedraggable";
import { useQuasar } from 'quasar'
interface listType {
Id: number
Enable:number
Required:number
[propName:string]:any
}
export default defineComponent({ export default defineComponent({
components: { draggable ,requestgroup}, components: { draggable ,requestgroup},
setup() { setup() {
const data =ref([]); const $q = useQuasar()
const dragId =ref(0); let data= ref<Array<listType>>([])
let dragId =ref(0);
const changePage = () => { const changePage = () => {
customerService.getCustomerFiledList({ Enable: -1 }).then((res) => { customerService.getCustomerFiledList({ Enable: -1 }).then((res) => {
data.value=res.data.Data data.value=res.data.Data
}) })
} }
const datadragEnd = (e:any) => { const datadragEnd = (e:any) => {
console.log('拖动结束',e) // console.log('拖动结束',e)
let olddragId = 0
if(e.newIndex>0){
olddragId = data.value[e.newIndex-1].Id
}else{
olddragId = 0
}
let msg = {
Type: 4,
FiledId: dragId.value,
SortFiledId: olddragId,
}
customerService.setCustomerFiledState(msg).then((res) => {
if (res.data.Code == 1) {
}else{//如果移动失败 重新获取列表
changePage()
}
})
} }
const getdata = (e:any) => { const getdata = (e:any) => {
console.log('拖动结束22323',e)
dragId.value = e.draggedContext.element.Id dragId.value = e.draggedContext.element.Id
} }
const setFiledState = (item, Type) => {
let msg = {
Type: Type,
FiledId: item.Id,
SortFiledId: 0,
}
customerService.setCustomerFiledState(msg).then((res) => {
if (res.data.Code == 1) {
$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: `操作成功`,
position: 'top'
})
changePage()
}else{//如果移动失败 重新获取列表
}
})
}
const godelete = (item:any,type:number,index:number) => {
let text = ''
if(type==1){//tyep等于1和2的时候 先让弹出提示 然后再给予掉接口 所以把原本的值暂时先赋值给本身
text = '确定修改启用状态'
if(item.Enable==2){
data.value[index].Enable = 1
}else{
data.value[index].Enable = 2
}
}else if(type==2){
text = '确定修改必填状态'
if(item.Required==2){
data.value[index].Required = 1
}else{
data.value[index].Required = 2
}
}else if(type==3){
text = '删除后字段不在显示,是否删除？'
}
console.log(text)
$q.dialog({
title: "提示信息",
message: text,
cancel: {
label: "取消",
flat: true
},
ok: {
label: "确认",
flat: true,
focus: true
}
}).onOk(() => {
setFiledState(item, type)
});
}
onMounted(() => { onMounted(() => {
changePage() changePage()
...@@ -89,7 +170,9 @@ ...@@ -89,7 +170,9 @@
data, data,
changePage, changePage,
datadragEnd, datadragEnd,
getdata getdata,
godelete,
setFiledState
} }
} }
...@@ -107,7 +190,7 @@ ...@@ -107,7 +190,7 @@
font-size: 12px; font-size: 12px;
font-weight: bold; font-weight: bold;
color: #2D2D2D; color: #2D2D2D;
background: #DDDEE0; background: #f5f5fa;
} }
.customerField .payTable tr { .customerField .payTable tr {
......
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