Commit 056e173c authored by Mac's avatar Mac

修改

parent 1cee7e6a
<style lang="scss">
</style>
<template>
<div class="labelgroup">
<q-dialog v-model="alert">
<q-card>
<q-card-section>
<div class="text-h6">标签</div>
</q-card-section>
<q-card-section class="q-pt-none">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Rerum repellendus sit voluptate voluptas eveniet
porro. Rerum blanditiis perferendis totam, ea at omnis vel numquam exercitationem aut, natus minima, porro
labore.
</q-card-section>
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="goclose" />
<q-btn label="确定" color="accent q-px-md" style="font-weight:400 !important" @click="determine" />
</q-card-actions>
</q-card>
</q-dialog>
</div>
</template>
<script>
import { defineComponent, ref, onMounted} from 'vue'
import customerService from '@/api/customer'
export default defineComponent({
props: {
list: {
type: Array,
default: []
},
},
setup(props,ctx) {
let selectList = ref(props.list)
const goclose = () => {
ctx.emit('close')
}
const determine = () => {
ctx.emit('submit',selectList.value)
}
return {
alert: ref(true),
goclose,
determine,
selectList
}
}
})
</script>
\ No newline at end of file
<style>
.my-special-class {
width: 200px;
margin-right: 6px;
}
.input_label {
width: 200px;
height: 40px;
border-radius: 4px;
border: 1px solid rgb(0 0 0 / 24%);
font-size: 14px;
padding: 0 10px 0 10px;
display: flex;
align-items: center;
justify-content: space-between;
cursor: pointer;
}
.right_select {
width: 40px;
position: absolute;
left: 0;
top: 20px;
}
.border_top {
border: 1px solid #d7d7d7;
width: 29px;
border-bottom: none;
border-right: none;
margin-left: 12px;
}
.border-bottom {
border: 1px solid #d7d7d7;
width: 29px;
border-top: none;
border-right: none;
margin-left: 12px;
}
.right_select .border_mid div {
width: 23px;
height: 23px;
text-align: center;
line-height: 23px;
color: #000;
font-size: 12px;
cursor: pointer;
background: #d8d8d8;
}
.right_select .border_mid .checked {
background: #333 !important;
color: #fff !important;
}
</style>
<template> <template>
<div class="requestgroup"> <div class="requestgroup">
123 <div :style="{'position':'relative','padding-left':addMsg.length>1?'40px':'0'}">
<div> <div class="row" v-for="(x,y) in addMsg" style="margin-bottom: 8px">
收快递费老师{{a}} <q-select outlined v-model="x.Name" :options="filedList" dense class="my-special-class" label='请选择客户信息'
<div class="row" v-for="(x,y) in addMsg" style="margin-bottom: 8px;"> option-value="Id" option-label="Name" />
<q-select outlined v-model="x.Name" :options="filedList" label="客户字段" /> <q-select v-if="x.Type==1 || x.Type=='' " outlined v-model="x.Direction" :options="directionList1" dense
</div> label='请选择' class="my-special-class" option-value="Id" option-label="Name" />
<q-input v-if="x.Type==''" outlined v-model="x.StartValue" label="请输入" dense />
<div v-if="x.Name=='标签'" class="input_label" @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="addMsg[y].LableIds=[]"></i>
</div>
</div>
<!-- 新增和删除 -->
<div style="display: flex;align-items: center;">
<img src="../../assets/images/customer/delete.png" alt="" 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 data-v-0dbac2e3="" class="right_select" v-if="addMsg.length>1">
<div data-v-0dbac2e3="" class="border_top"
:style="{height:((addMsg.length*48 -8 - 46 - 40 )/2) + 'px'}"></div>
<div data-v-0dbac2e3="" class="border_mid">
<div data-v-0dbac2e3="" class="and" :class="{ 'checked': addtion == 1 }" @click="addtion=1">且</div>
<div data-v-0dbac2e3="" class="no" :class="{ 'checked': addtion == 2 }" @click="addtion=2">或</div>
</div>
<div data-v-0dbac2e3="" class="border-bottom"
:style="{height:((addMsg.length*48 -8 - 46 - 40 )/2) + 'px'}"></div>
</div>
</div> </div>
<labelgroup v-if="isshowlabel" :list='LableList' @close="isshowlabel=false" @submit='getlabel'></labelgroup>
</div> </div>
</template> </template>
<script lang="ts"> <script>
import { defineComponent, ref,reactive, onMounted } from 'vue' import { defineComponent, ref, onMounted } from 'vue'
import { Student } from '@/@types/index'
import customerService from '@/api/customer' import customerService from '@/api/customer'
import labelgroup from './label-group.vue'
export default defineComponent({ export default defineComponent({
setup() { props: {
addCondition: {
let filedList: Array<Student> = reactive([]) type: Number,
const addMsg = ref([]) default: 1
},
},
components: {
labelgroup,
},
setup(props) {
let addtion = ref(props.addCondition)
let filedList = ref([]);//客户字段数组
let addMsg = ref([])//筛选数组
let isshowlabel = ref(false)//标签弹出显示
let selectindex = ref(0)//现在筛选数组 索引
let LableList = []//标签的数组
const directionList1 = ref([{ Id: 1, Name: '包含所有' }, { Id: 2, Name: '包含任意' }, { Id: 3, Name: '不包含' }, { Id: 4, Name: '为空' }, { Id: 5, Name: '不为空' },])
const directionList2 = ref([{ Id: 1, Name: '等于' }, { Id: 1, Name: '不等于' }, { Id: 1, Name: '为空' }, { Id: 1, Name: '不为空' }, { Id: 1, Name: '模糊' },])
const directionList5 = ref([{ Id: 1, Name: '等于' }, { Id: 1, Name: '大于' }, { Id: 1, Name: '大于等于' }, { Id: 1, Name: '小于' }, { Id: 1, Name: '小于等于' },])
onMounted(() => {//进入页面就调用 onMounted(() => {//进入页面就调用
getCustomerFiledList();//获取客户字段 getCustomerFiledList();//获取客户字段
...@@ -28,38 +135,73 @@ ...@@ -28,38 +135,73 @@
customerService.getCustomerFiledList({ Enable: 1 }).then((res) => { customerService.getCustomerFiledList({ Enable: 1 }).then((res) => {
let data = res.data.Data let data = res.data.Data
console.log(data) filedList.value = data;
filedList = data; filedList.value.forEach((x) => {// IsCustom 是否自定义字段 1是 2标签 3阶段
filedList.forEach((x:Student) => {// IsCustom 是否自定义字段 1是 2标签 3阶段 x.IsCustom = 1
x.ID=0 })
})
// let obj = { Id: '客户阶段', Name: '客户阶段', Type: 3, IsCustom: 3 } let obj = { Id: '客户阶段', Name: '客户阶段', Type: 3, IsCustom: 3 }
// filedList.value.unshift(obj) filedList.value.unshift(obj)
// let obj2 = { Id: '标签', Name: '标签', Type: 4, IsCustom: 2 } let obj2 = { Id: '标签', Name: '标签', Type: 4, IsCustom: 2 }
// filedList.value.unshift(obj2) filedList.value.unshift(obj2)
// let type = 1; let type = 1;
// if (filedList.value[0].Type == 4) {//多选 if (filedList.value[0].Type == 4) {//多选
// type = 1; type = 1;
// } }
// addMsg.value.push({ addMsg.value.push({
// Name: filedList.value[0].Id, Name: filedList.value[0].Id,
// Type: type, Type: type,
// Direction: '', Direction: '',
// StartValue: '', StartValue: '',
// EndValue: '', EndValue: '',
// IsCustom: filedList.value[0].IsCustom, IsCustom: filedList.value[0].IsCustom,
// StageId: '', StageId: [],
// LableIds:'', LableIds: [],
// }) })
}) })
} }
const deleteadd = (index) => {//删除addMsg某一项
addMsg.value.splice(index, 1)
}
const addsList = () => {
let obj = {
Name: '',
Type: '',
Direction: '',
StartValue: '',
EndValue: '',
IsCustom: '2',
LableIds: [],
StageId: [],
}
addMsg.value.push(obj)
}
const showlabel = (y) =>{
isshowlabel.value = true
selectindex.value = y;
LableList.value = addMsg.value[y].LableIds
}
const getlabel=(list)=> {
console.log(list)
isshowlabel.value = false;
addMsg.value[selectindex.value].LableIds = list
}
return { return {
getCustomerFiledList, getCustomerFiledList,
filedList,
addMsg,
directionList1,
directionList2,
directionList5,
deleteadd,
addsList,
addtion,
isshowlabel,
selectindex,
LableList,
showlabel,
getlabel
} }
} }
......
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