Skip to content

H
horse
Commit fb6831e2 authored by Mac's avatar Mac
Browse files
Options

1

parent b7463bfe
Hide whitespace changes
Inline Side-by-side
Showing with 648 additions and 520 deletions
src/pages/customer/customerSetup.vue
View file @ fb6831e2
<template> <template>
<div class="q-pa-md"> <div class="q-pa-md">
<q-page padding style="background: #FFF;border-radius: 10px;"> <q-page padding style="background: #FFF;border-radius: 10px;" >
<q-tabs <q-tabs
v-model="tab" v-model="tab"
dense dense
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
active-color="primary" active-color="primary"
indicator-color="primary" indicator-color="primary"
narrow-indicator narrow-indicator
@update:model-value='gettabs'
> >
<q-tab name="yewumoshi" label="业务模式" /> <q-tab name="yewumoshi" label="业务模式" />
<q-tab name="field" label="客户字段" /> <q-tab name="field" label="客户字段" />
...@@ -29,19 +30,36 @@ ...@@ -29,19 +30,36 @@
import customerField from './components/customerField.vue' import customerField from './components/customerField.vue'
import clueRule from './components/clueRule.vue' import clueRule from './components/clueRule.vue'
import customerPhase from './components/customerPhase.vue' import customerPhase from './components/customerPhase.vue'
import router from '@/router/index'
import { import {
defineComponent, defineComponent,
ref ref
} from 'vue' } from 'vue'
export default defineComponent({ export default defineComponent({
components: { components: {
customerField, customerField,
clueRule, clueRule,
customerPhase customerPhase
}, },
setup() { setup() {
let tab = ref<string>('phase')
if( router.currentRoute.value.query && router.currentRoute.value.query.type){
// let type = router.currentRoute.value.query.type;
tab.value = router.currentRoute.value.query.type as string
}
const gettabs = () => {
// console.log(tab.value)
}
// if(props && props.type){
// }
return { return {
tab: ref('phase') tab,
gettabs
} }
} }
......
src/pages/editor/createStageRange.vue
View file @ fb6831e2
...@@ -10,73 +10,113 @@ ...@@ -10,73 +10,113 @@
<div class="container"> <div class="container">
<div class="content-block"> <div class="content-block">
<div class="bold">名称</div> <div class="bold">名称</div>
<q-input clearable debounce filled maxlength="20" counter v-model="state.addMsg.FlowName" <q-input
style="width:600px" placeholder="名称" :rules="[val => !!val || '不能为空']" /> clearable
debounce
filled
maxlength="20"
counter
v-model="state.addMsg.FlowName"
style="width:600px"
placeholder="名称"
:rules="[val => !!val || '不能为空']"
/>
</div> </div>
<div class="content-block"> <div class="content-block">
<div class="bold">阶段适用范围</div> <div class="bold">阶段适用范围</div>
<!-- <q-input clearable debounce filled maxlength="20" counter v-model="state.addMsg.FlowName" style="width:600px" <!-- <q-input clearable debounce filled maxlength="20" counter v-model="state.addMsg.FlowName" style="width:600px"
placeholder="名称" :rules="[val => !!val || '不能为空']" /> --> placeholder="名称" :rules="[val => !!val || '不能为空']" />-->
</div> </div>
<div class="content-block"> <div class="content-block">
<div class="bold">选择使用阶段 <div class="bold">
选择使用阶段
<span style="font-size: 14px;font-weight: 300;color:rgb(133, 133, 152);"> <span style="font-size: 14px;font-weight: 300;color:rgb(133, 133, 152);">
若没有找到可选项，请前往 <span style="color:#3470ff;cursor: pointer;" @click="stageManagement"> 若没有找到可选项，请前往
"阶段管理"</span>进行</span> <span style="color:#3470ff;cursor: pointer;" @click="stageManagement">"阶段管理"</span>进行
</span>
</div> </div>
<div style="display:flex;align-items: center;"> <div style="display:flex;align-items: center;">
<div class="all-stage" :style="{height:state.getheight+'px'}"> <div class="all-stage" :style="{ height: state.getheight + 'px' }">
<p class="select-item-title">全部阶段</p> <p class="select-item-title">全部阶段</p>
<div class="" v-for="(x,y) in state.StageList" :key='y'> <div class v-for="(x,y) in state.StageList" :key="y">
<q-checkbox v-model="state.addMsg.UseStage" :val="x.Id" :label="x.Name" <q-checkbox
:disable="x.IsDefault==0?false:true" v-if="x.Type==1" v-model="state.addMsg.UseStage"
@update:model-value="getusestageName" /> :val="x.Id"
:label="x.Name"
:disable="x.IsDefault == 0 ? false : true"
v-if="x.Type == 1"
@update:model-value="getusestageName"
/>
</div> </div>
</div> </div>
<div class="right-arrow"><i class="el-icon-arrow-right"></i></div> <div class="right-arrow">
<div class="all-stage" :style="{height:state.getheight+'px'}"> <i class="el-icon-arrow-right"></i>
</div>
<div class="all-stage" :style="{ height: state.getheight + 'px' }">
<p class="select-item-title">已选阶段</p> <p class="select-item-title">已选阶段</p>
<div v-for="(x,y) in state.UseStageName" :key='y'> <div v-for="(x,y) in state.UseStageName" :key="y">
<div style="height:40px;line-height: 40px;" v-if="x.IsDefault==0"> <div style="height:40px;line-height: 40px;" v-if="x.IsDefault == 0">
<span>{{x.Name}}</span> <span >{{ x.Name }}</span>
</div> </div>
</div> </div>
<div style="height:40px;line-height: 40px;" v-for="(x,y) in state.UseStageName" :key='y'> <div
<span v-if="x.IsDefault==1" style="color: #ccc;">{{x.Name}}</span> v-for="(x,y) in state.UseStageName"
:key="y"
>
<span v-if="x.IsDefault == 1" style="color: #ccc;height:40px;line-height: 40px;">{{ x.Name }}</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div v-if="state.StageList"> <div v-if="state.StageList">
<div v-for="(x,y) in state.StageList" :key="y" > <div v-for="(x,y) in state.StageList" :key="y">
<div class="content-block" v-if="x.Type==2"> <div class="content-block" v-if="x.Type == 2">
<div class="bold" v-if="x.Name=='已输单'">选择输单原因 <div class="bold" v-if="x.Name == '已输单'">
<span style="font-size: 14px;font-weight: 300;color:rgb(133, 133, 152);">若没有找到可选项，请前往 <span 选择输单原因
style="color:#3470ff;cursor: pointer;" @click="stageManagement"> <span
"阶段管理"</span>进行</span> style="font-size: 14px;font-weight: 300;color:rgb(133, 133, 152);"
>
若没有找到可选项，请前往
<span
style="color:#3470ff;cursor: pointer;"
@click="stageManagement"
>"阶段管理"</span>进行
</span>
</div> </div>
<div class="bold" v-if="x.Name=='无效'"> <div class="bold" v-if="x.Name == '无效'">
选择无效原因 选择无效原因
<span style="font-size: 14px;font-weight: 300;color:rgb(133, 133, 152);">若没有找到可选项，请前往 <span <span
style="color:#3470ff;cursor: pointer;" @click="stageManagement"> style="font-size: 14px;font-weight: 300;color:rgb(133, 133, 152);"
"阶段管理"</span>进行</span> >
若没有找到可选项，请前往
<span
style="color:#3470ff;cursor: pointer;"
@click="stageManagement"
>"阶段管理"</span>进行
</span>
</div> </div>
<div style="display:flex;align-items: center;flex-wrap: wrap;"> <div style="display:flex;align-items: center;flex-wrap: wrap;">
<div v-if='x.Name=="已输单"'> <div v-if="x.Name =='已输单'">
<q-checkbox v-model="state.addMsg.LoseCause" <q-checkbox
v-for="(item,index) in x.OptionsList" :key='index' :val="item.Id" :label="item.Name" /> v-model="state.addMsg.LoseCause"
v-for="(item,index) in x.OptionsList"
:key="index"
:val="item.Id"
:label="item.Name"
/>
</div>
<div v-if="x.Name =='无效'">
<q-checkbox
v-model="state.addMsg.InvalidCause"
v-for="(item,index) in x.OptionsList"
:key="index"
:val="item.Id"
:label="item.Name"
/>
</div> </div>
<div v-if='x.Name=="无效"'>
<q-checkbox v-model="state.addMsg.InvalidCause"
v-for="(item,index) in x.OptionsList" :key='index' :val="item.Id" :label="item.Name" />
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -85,236 +125,238 @@ ...@@ -85,236 +125,238 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, onMounted, reactive, } from 'vue' import { defineComponent, onMounted, reactive, } from 'vue'
import router from '@/router/index' import router from '@/router/index'
import customerService from '@/api/customer' import customerService from '@/api/customer'
import { useQuasar } from 'quasar' import { useQuasar } from 'quasar'
export default defineComponent({ export default defineComponent({
setup() { setup() {
const $q = useQuasar() const $q = useQuasar()
const state:any = reactive({ const state: any = reactive({
addMsg: { addMsg: {
Id: 0, Id: 0,
FlowName: '', FlowName: '',
DeptEmpList: [], DeptEmpList: [],
UseStage: [], UseStage: [],
LoseCause: [], LoseCause: [],
InvalidCause: [], InvalidCause: [],
}, },
StageList: [], StageList: [],
gettypeoneList: [], gettypeoneList: [],
getheight: 270, getheight: 270,
loading: false, loading: false,
UseStageName: [], UseStageName: [],
})
const jumpBeforePage = () => {
router.push({
path: '/customerSetup',
query: {
type:'phase'
}
}) })
const jumpBeforePage = () => { }
router.go(-1)
}
const getList = () => { const getList = () => {
customerService.getCustomerStageList({}).then((res) => { customerService.getCustomerStageList({}).then((res) => {
if (res.data.Code == 1) { if (res.data.Code == 1) {
state.StageList = res.data.Data; state.StageList = res.data.Data;
state.gettypeoneList = [] state.gettypeoneList = []
state.StageList.forEach(x => { state.StageList.forEach(x => {
if (x.Type == 1) { if (x.Type == 1) {
if (x.IsDefault == 1) { if (x.IsDefault == 1) {
state.addMsg.UseStage.push(x.Id) state.addMsg.UseStage.push(x.Id)
}
state.gettypeoneList.push(x)
} }
}) state.gettypeoneList.push(x)
if (state.gettypeoneList.length > 5) {//阶段数量大于5个的时候
state.getheight = 71 + Number(state.gettypeoneList.length) * 40
} }
getusestageName() })
// if (this.$route.query && this.$route.query.FlowId) {//如果有的话 调接口 if (state.gettypeoneList.length > 5) {//阶段数量大于5个的时候
// this.FlowId = this.$route.query.FlowId state.getheight = 71 + Number(state.gettypeoneList.length) * 40
// this.getdetails()
// }
} else {//如果移动失败 重新获取列表
} }
}) getusestageName()
} // if (this.$route.query && this.$route.query.FlowId) {//如果有的话 调接口
const compare = (property: string) => { // this.FlowId = this.$route.query.FlowId
return function (a, b) { // this.getdetails()
var value1 = a[property]; // }
var value2 = b[property]; } else {//如果移动失败 重新获取列表
return value1 - value2;
} }
})
}
const compare = (property: string) => {
return function (a, b) {
var value1 = a[property];
var value2 = b[property];
return value1 - value2;
} }
const getusestageName = () => { }
state.UseStageName = [] const getusestageName = () => {
if (state.addMsg.UseStage && state.addMsg.UseStage.length > 0) { state.UseStageName = []
state.addMsg.UseStage.forEach(x => { if (state.addMsg.UseStage && state.addMsg.UseStage.length > 0) {
state.StageList.forEach(j => { state.addMsg.UseStage.forEach(x => {
if (x == j.Id) { state.StageList.forEach(j => {
state.UseStageName.push(j) if (x == j.Id) {
} state.UseStageName.push(j)
}) }
}) })
state.UseStageName = state.UseStageName.sort(compare('Sort'))
}
}
const stageManagement = () => {
router.push({
path: '/editor/manageStageRange',
query: {
}
}) })
state.UseStageName = state.UseStageName.sort(compare('Sort'))
} }
const savemove=()=>{ }
$q.notify({ const stageManagement = () => {
type: 'negative', router.push({
message: '不能删除', path: '/editor/manageStageRange',
position: 'top' query: {
})
} }
onMounted(() => { })
getList() }
const savemove = () => {
$q.notify({
type: 'negative',
message: '不能删除',
position: 'top'
}) })
return {
state,
jumpBeforePage,
getList,
getusestageName,
compare,
stageManagement,
savemove
}
} }
onMounted(() => {
getList()
})
return {
state,
jumpBeforePage,
getList,
getusestageName,
compare,
stageManagement,
savemove
}
}
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.page { .page {
min-height: 100vh; min-height: 100vh;
background-color: #f4f4f6; background-color: #f4f4f6;
padding-bottom: 20px; padding-bottom: 20px;
padding-top: 80px; padding-top: 80px;
.mt20 { .mt20 {
margin-top: 90px; margin-top: 90px;
}
} }
}
.navbar { .navbar {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
height: 70px; height: 70px;
font-size: 16px; font-size: 16px;
border-bottom: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7;
background-color: #fff; background-color: #fff;
position: fixed; position: fixed;
/* left: 0; */ /* left: 0; */
top: 0; top: 0;
right: 0; right: 0;
z-index: 9; z-index: 9;
} }
.container { .container {
margin: 0 auto; margin: 0 auto;
width: 1087px; width: 1087px;
.content-block { .content-block {
padding: 30px 20px; padding: 30px 20px;
border-radius: 8px; border-radius: 8px;
background-color: #fff; background-color: #fff;
margin-top: 20px; margin-top: 20px;
.fission-title { .fission-title {
color: #000; color: #000;
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
} }
.fission-subtitle { .fission-subtitle {
color: #000; color: #000;
font-weight: bold; font-weight: bold;
margin-top: 15px; margin-top: 15px;
margin-bottom: 15px; margin-bottom: 15px;
font-size: 14px; font-size: 14px;
} }
.departs { .departs {
.depart-title { .depart-title {
font-size: 14px; font-size: 14px;
.per { .per {
height: 16px; height: 16px;
width: 2px; width: 2px;
display: inline-block; display: inline-block;
margin: 0 15px; margin: 0 15px;
background: #d7d7d7; background: #d7d7d7;
}
} }
} }
} }
.btn {
display: flex;
align-items: center;
margin-top: 24px;
margin-left: 56px;
;
margin-bottom: 30px;
}
.bold {
font-weight: 760;
font-size: 16px;
color: #333;
border-left: 3px solid #3470ff;
margin-bottom: 20px;
margin-left: -20px;
padding: 0 20px;
display: flex;
align-items: center;
justify-content: space-between;
}
} }
.addPhase .all-stage { .btn {
width: 300px; display: flex;
padding: 20px 45px; align-items: center;
border: 1px solid #d7d7d7; margin-top: 24px;
border-radius: 8px; margin-left: 56px;
min-height: 260px; margin-bottom: 30px;
}
.addPhase .select-item-title {
font-size: 14px;
font-weight: 800;
padding-bottom: 10px;
} }
.addPhase .right-arrow { .bold {
width: 28px; font-weight: 760;
height: 28px;
background: #e7e7e7;
border-radius: 50%;
align-self: center;
line-height: 28px;
text-align: center;
color: #fff;
font-size: 16px; font-size: 16px;
margin: 0 30px; color: #333;
} border-left: 3px solid #3470ff;
margin-bottom: 20px;
.addPhase .user_lists { margin-left: -20px;
width: 100%; padding: 0 20px;
display: flex; display: flex;
flex-wrap: wrap; align-items: center;
margin-top: 20px; justify-content: space-between;
} }
}
.addPhase .all-stage {
width: 300px;
padding: 20px 45px;
border: 1px solid #d7d7d7;
border-radius: 8px;
min-height: 260px;
}
.addPhase .select-item-title {
font-size: 14px;
font-weight: 800;
padding-bottom: 10px;
}
.addPhase .right-arrow {
width: 28px;
height: 28px;
background: #e7e7e7;
border-radius: 50%;
align-self: center;
line-height: 28px;
text-align: center;
color: #fff;
font-size: 16px;
margin: 0 30px;
}
.addPhase .user_lists {
width: 100%;
display: flex;
flex-wrap: wrap;
margin-top: 20px;
}
</style> </style>
\ No newline at end of file
src/pages/editor/manageStageRange.vue
View file @ fb6831e2
...@@ -5,375 +5,443 @@ ...@@ -5,375 +5,443 @@
<q-breadcrumbs-el label="返回" icon="navigate_before" @click="jumpBeforePage" /> <q-breadcrumbs-el label="返回" icon="navigate_before" @click="jumpBeforePage" />
<q-breadcrumbs-el label="阶段管理" /> <q-breadcrumbs-el label="阶段管理" />
</q-breadcrumbs> </q-breadcrumbs>
<q-btn color="primary" label="完成" @click="savemove" :loading="state.loading"/> <q-btn color="primary" label="完成" @click="savemove" :loading="state.loading" />
</div> </div>
<div class="container"> <div class="container">
<div class="content-block" > <div class="content-block">
<div class="bold" style="margin-bottom: 30px;">跟进阶段</div> <div class="bold" style="margin-bottom: 30px;">跟进阶段</div>
<draggable v-model="state.followupStage" item-key="Id"> <draggable v-model="state.followupStage" item-key="Id">
<template #item="{ element ,index}"> <template #item="{ element, index }">
<div style="display: flex;align-items: flex-start;"> <div style="display: flex;align-items: flex-start;">
<div style="width: 57px;margin-top: 5px;"> <div style="width: 57px;margin-top: 5px;">
<i class="iconfont icon-drag" style="font-size: 25px;color: #777;margin: 0 10px;"></i> <i
class="iconfont icon-drag"
style="font-size: 25px;color: #777;margin: 0 10px;"
></i>
</div> </div>
<q-input clearable debounce filled maxlength="10" counter v-model="element.Name" <q-input
style="width:500px" placeholder="名称" :rules="[val => !!val || '不能为空']" /> clearable
<q-btn flat size="md" icon="delete" color="negative" class="q-mr-xs" debounce
style="margin-left: 10px;margin-top: 10px;" label="" filled
@click="getStageDel(element.Id,index)" /> maxlength="10"
counter
v-model="element.Name"
style="width:500px"
placeholder="名称"
:rules="[val => !!val || '不能为空']"
/>
<q-btn
flat
size="md"
icon="delete"
color="negative"
class="q-mr-xs"
style="margin-left: 10px;margin-top: 10px;"
label
@click="getStageDel(element.Id, index)"
/>
</div> </div>
</template> </template>
</draggable> </draggable>
<div> <div>
<div v-for="(x,y) in state.followupStage_d" :key="y" style="display: flex;"> <div v-for="(x,y) in state.followupStage_d" :key="y" style="display: flex;">
<div style="width: 57px;height: 1px;"> <div style="width: 57px;height: 1px;"></div>
</div> <q-input
<q-input clearable debounce filled v-model="x.Name" style="width:500px" disable placeholder="名称" clearable
:rules="[val => !!val || '不能为空']" /> debounce
filled
v-model="x.Name"
style="width:500px"
disable
placeholder="名称"
:rules="[val => !!val || '不能为空']"
/>
</div> </div>
</div> </div>
<div class="btn"> <div class="btn">
<q-btn v-if="state.followupStage.length<30" color="accent" class="q-mr-md" label="添加" icon='add' <q-btn
@click="state.followupStage.push({Id: 0, v-if="state.followupStage.length < 30"
IsDefault: 0, color="accent"
Name: '', class="q-mr-md"
OptionsList: [], label="添加"
Sort: 0, icon="add"
Type: 1})" style="width: 100px;" /> @click="state.followupStage.push({
<span style="color:#858598"> 已设/可设上限：{{state.followupStage.length}}/30 </span> Id: 0,
IsDefault: 0,
Name: '',
OptionsList: [],
Sort: 0,
Type: 1
})"
style="width: 100px;"
/>
<span style="color:#858598">已设/可设上限：{{ state.followupStage.length }}/30</span>
</div> </div>
</div> </div>
<div class="content-block"> <div class="content-block">
<div class="bold">结束跟进</div> <div class="bold">结束跟进</div>
<div v-for="(x,y) in state.reasonList" :key="y"> <div v-for="(x,y) in state.reasonList" :key="y">
<ul style="margin-left: 30px;margin-top: 10px;" v-if="x.Type==2"> <ul style="margin-left: 30px;margin-top: 10px;" v-if="x.Type == 2">
<li> <li>
<q-input clearable filled debounce placeholder="名称" v-model="x.Name" style="width:500px" <q-input
disable /> clearable
filled
debounce
placeholder="名称"
v-model="x.Name"
style="width:500px"
disable
/>
</li> </li>
<li class="bold" style="margin: 10px 0 30px;" v-if="x.Name=='已输单'">输单原因</li> <li class="bold" style="margin: 10px 0 30px;" v-if="x.Name == '已输单'">输单原因</li>
<li class="bold" style="margin: 10px 0 30px;" v-if="x.Name=='无效'">无效原因</li> <li class="bold" style="margin: 10px 0 30px;" v-if="x.Name == '无效'">无效原因</li>
<draggable v-model="x.OptionsList" item-key="Id"> <draggable v-model="x.OptionsList" item-key="Id">
<template #item="{ element ,index}"> <template #item="{ element, index }">
<div style="display: flex;"> <div style="display: flex;">
<div style="width: 31px;"> <div style="width: 31px;">
<i class="iconfont icon-weiyi" <i
style="font-size: 14px;color: #777;margin: 0 10px;"></i> class="iconfont icon-weiyi"
style="font-size: 14px;color: #777;margin: 0 10px;"
></i>
</div> </div>
<q-input clearable debounce filled maxlength="10" counter v-model="element.Name" <q-input
style="width:500px" placeholder="名称" :rules="[val => !!val || '不能为空']" /> clearable
<q-btn flat size="sm" icon="delete" color="negative" class="q-mr-xs" debounce
style="margin-left: 10px;" label="" filled
@click="setCauseDel(y,index,x.Name,element.Id)" /> maxlength="10"
counter
v-model="element.Name"
style="width:500px"
placeholder="名称"
:rules="[val => !!val || '不能为空']"
/>
<q-btn
flat
size="sm"
icon="delete"
color="negative"
class="q-mr-xs"
style="margin-left: 10px;"
label
@click="setCauseDel(y, index, x.Name, element.Id)"
/>
</div> </div>
</template> </template>
</draggable> </draggable>
</ul> </ul>
<div class="btn" style="margin-left: 61px" v-if="x.Type==2"> <div class="btn" style="margin-left: 61px" v-if="x.Type == 2">
<q-btn v-if="x.OptionsList.length<30" color="accent" class="q-mr-md" label="添加" icon='add' <q-btn
@click="state.reasonList[y].OptionsList.push({Id:0,Name:'',disable:false})" v-if="x.OptionsList.length < 30"
style="width: 100px;" /> color="accent"
<span style="color:#858598"> 已设/可设上限：{{x.OptionsList.length}}/30 </span> class="q-mr-md"
label="添加"
icon="add"
@click="state.reasonList[y].OptionsList.push({ Id: 0, Name: '', disable: false })"
style="width: 100px;"
/>
<span style="color:#858598">已设/可设上限：{{ x.OptionsList.length }}/30</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, onMounted, reactive ,ref} from 'vue' import { defineComponent, onMounted, reactive, ref } from 'vue'
import router from '@/router/index' import router from '@/router/index'
import customerService from '@/api/customer' import customerService from '@/api/customer'
import draggable from "vuedraggable"; import draggable from "vuedraggable";
import { useQuasar } from 'quasar' import { useQuasar } from 'quasar'
export default defineComponent({ export default defineComponent({
components: { components: {
draggable draggable
}, },
setup() { setup() {
const $q = useQuasar() const $q = useQuasar()
const state:any = reactive({ const state: any = reactive({
addMsg: [], addMsg: [],
followupStage: [], followupStage: [],
followupStage_d: [], followupStage_d: [],
reasonList: [], reasonList: [],
loading:false loading: false
})
const jumpBeforePage = () => {
// router.go(-1)
router.push({
path: '/customerSetup',
query: {
type:'phase'
}
}) })
const jumpBeforePage = () => { }
router.go(-1)
}
const getList = () => { const getList = () => {
customerService.getCustomerStageList({}).then((res) => { customerService.getCustomerStageList({}).then((res) => {
if (res.data.Code == 1) { if (res.data.Code == 1) {
state.addMsg = res.data.Data state.addMsg = res.data.Data
state.followupStage = []; state.followupStage = [];
state.followupStage_d = []; state.followupStage_d = [];
state.reasonList = []; state.reasonList = [];
let orderEntered = false //判读是否有已输单 let orderEntered = false //判读是否有已输单
let invalid = false //无效 let invalid = false //无效
let list = JSON.parse(JSON.stringify(state.addMsg)) let list = JSON.parse(JSON.stringify(state.addMsg))
list.forEach(x => { list.forEach(x => {
if (x.Type == 1) { if (x.Type == 1) {
if (x.IsDefault == 0) { if (x.IsDefault == 0) {
state.followupStage.push(x) state.followupStage.push(x)
} else { } else {
state.followupStage_d.push(x) state.followupStage_d.push(x)
}
} }
}
if (x.Type == 2) { if (x.Type == 2) {
state.reasonList.push(x) state.reasonList.push(x)
if (x.Name == '已输单') { if (x.Name == '已输单') {
orderEntered = true orderEntered = true
} }
if (x.Name == '无效') { if (x.Name == '无效') {
invalid = true invalid = true
}
} }
})
if (orderEntered == false) { //没有的话 加一个已输单
let obj = {
Id: 0,
IsDefault: 0,
Name: '已输单',
OptionsList: [],
Sort: 0,
Type: 2
};
state.reasonList.push(obj)
} }
if (invalid == false) { //没有的话 加一个无效 })
let obj = { if (orderEntered == false) { //没有的话 加一个已输单
Id: 0, let obj = {
IsDefault: 0, Id: 0,
Name: '无效', IsDefault: 0,
OptionsList: [], Name: '已输单',
Sort: 0, OptionsList: [],
Type: 2 Sort: 0,
}; Type: 2
state.reasonList.push(obj) };
state.reasonList.push(obj)
}
if (invalid == false) { //没有的话 加一个无效
let obj = {
Id: 0,
IsDefault: 0,
Name: '无效',
OptionsList: [],
Sort: 0,
Type: 2
};
state.reasonList.push(obj)
}
} else {//如果移动失败 重新获取列表
}
})
}
const getStageDel = (Id: number, index: number) => {
if (Id > 0) {//判断是否是新加
customerService.validataCustomerStageDel({ StageId: Id }).then((res) => {
if (res.data.Code == 1) {
if (res.data.Data.UseState == false) {//可以删除
state.followupStage.splice(index, 1)
} else {
$q.notify({
type: 'negative',
message: '不能删除',
position: 'top'
})
} }
} else {//如果移动失败 重新获取列表 } else {//如果移动失败 重新获取列表
} }
}) })
} else {//不是的话直接删除
state.followupStage.splice(index, 1)
} }
const getStageDel = (Id: number, index: number) => {
if (Id > 0) {//判断是否是新加
customerService.validataCustomerStageDel({ StageId: Id }).then((res) => {
if (res.data.Code == 1) {
if (res.data.Data.UseState == false) {//可以删除
state.followupStage.splice(index, 1)
} else {
$q.notify({
type: 'negative',
message: '不能删除',
position: 'top'
})
}
} else {//如果移动失败 重新获取列表
}
const setCauseDel = (y: number, index: number, Name: string, Id: number) => {
let Type = 1
if (Name == '无效') Type = 2
let data = {
CauseId: Id,
Type: Type
}
if (Id > 0) {
customerService.validataCustomerCauseDel(data).then((res) => {
if (res.data.Code == 1) {
if (res.data.Data.UseState == false) {//可以删除
state.reasonList[y].OptionsList.splice(index, 1)
} else {
$q.notify({
type: 'negative',
message: '不能删除',
position: 'top'
})
} }
}) } else {//如果移动失败 重新获取列表
} else {//不是的话直接删除
state.followupStage.splice(index, 1)
}
}
})
} else {
state.reasonList[y].OptionsList.splice(index, 1)
} }
const setCauseDel = (y: number, index: number, Name: string, Id: number) => {
let Type = 1
if (Name == '无效') Type = 2
let data = {
CauseId: Id,
Type: Type
}
if (Id > 0) {
customerService.validataCustomerCauseDel(data).then((res) => {
if (res.data.Code == 1) {
if (res.data.Data.UseState == false) {//可以删除
state.reasonList[y].OptionsList.splice(index, 1)
} else {
$q.notify({
type: 'negative',
message: '不能删除',
position: 'top'
})
}
} else {//如果移动失败 重新获取列表
} }
const savemove = () => {
var show = ref(false)
for (let i = 0; i < state.followupStage.length; i++) {//判断根据阶段的值填写没有
let x = state.followupStage[i]
if (x.Name == '' || x.Name == null) {
$q.notify({
type: 'negative',
message: '请填写跟进阶段列表选项值',
position: 'top'
}) })
} else { return
state.reasonList[y].OptionsList.splice(index, 1)
}
}
} }
const savemove = () => { for (let i = 0; i < state.reasonList.length; i++) {
var show = ref(false) let x = state.reasonList[i]
for (let i = 0; i < state.followupStage.length; i++) {//判断根据阶段的值填写没有 if (show.value == true) {
let x = state.followupStage[i] return
if (x.Name == '' || x.Name==null) { }
let list = JSON.parse(JSON.stringify(x.OptionsList))
let maxnum = list.sort((a, b) => { return b.Id - a.Id })[0].Id
for (let j = 0; j < x.OptionsList.length; j++) {
let z = x.OptionsList[j]
if (z.Name == '' || z.Name == null) {
$q.notify({ $q.notify({
type: 'negative', type: 'negative',
message: '请填写跟进阶段列表选项值', message: '请填写' + x.Name + '原因值',
position: 'top' position: 'top'
}) })
show.value = true
return return
} }
} if (z.Id == 0) {
for (let i = 0; i < state.reasonList.length; i++) { z.Id = maxnum + 1;
let x = state.reasonList[i] maxnum++
if (show.value == true) {
return
}
let list = JSON.parse(JSON.stringify(x.OptionsList))
let maxnum = list.sort((a, b) => { return b.Id - a.Id })[0].Id
for (let j = 0; j < x.OptionsList.length; j++) {
let z = x.OptionsList[j]
if (z.Name == ''|| z.Name == null) {
$q.notify({
type: 'negative',
message: '请填写' + x.Name + '原因值',
position: 'top'
})
show.value = true
return
}
if (z.Id == 0) {
z.Id = maxnum + 1;
maxnum++
}
} }
} }
state.addMsg = []
state.addMsg = (state.followupStage.concat(state.followupStage_d)).concat(state.reasonList)
state.addMsg.forEach((x, i) => {
x.Sort = i + 1
})
state.loading = true
customerService.setCustomerStageInfo(state.addMsg).then((res) => {
if (res.data.Code == 1) {
state.loading = false
$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: res.data.Message,
position: 'top'
})
getList()
} else {//如果移动失败 重新获取列表
state.loading = false
}
})
} }
onMounted(() => { state.addMsg = []
getList() state.addMsg = (state.followupStage.concat(state.followupStage_d)).concat(state.reasonList)
state.addMsg.forEach((x, i) => {
x.Sort = i + 1
}) })
return { state.loading = true
state, customerService.setCustomerStageInfo(state.addMsg).then((res) => {
jumpBeforePage, if (res.data.Code == 1) {
getList, state.loading = false
getStageDel, $q.notify({
setCauseDel, icon: 'iconfont icon-chenggong',
savemove, color: 'accent',
} timeout: 2000,
message: res.data.Message,
position: 'top'
})
getList()
} else {//如果移动失败 重新获取列表
state.loading = false
}
})
}
onMounted(() => {
getList()
})
return {
state,
jumpBeforePage,
getList,
getStageDel,
setCauseDel,
savemove,
} }
}
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.page { .page {
/* height: 100vh; */ /* height: 100vh; */
background-color: #f4f4f6; background-color: #f4f4f6;
padding-bottom: 20px; padding-bottom: 20px;
padding-top: 80px; padding-top: 80px;
.mt20 { .mt20 {
margin-top: 90px; margin-top: 90px;
}
} }
}
.navbar { .navbar {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
height: 70px; height: 70px;
font-size: 16px; font-size: 16px;
border-bottom: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7;
background-color: #fff; background-color: #fff;
position: fixed; position: fixed;
/* left: 0; */ /* left: 0; */
top: 0; top: 0;
right: 0; right: 0;
z-index: 9; z-index: 9;
} }
.container { .container {
margin: 0 auto; margin: 0 auto;
width: 1087px; width: 1087px;
.content-block { .content-block {
padding: 30px 20px; padding: 30px 20px;
border-radius: 8px; border-radius: 8px;
background-color: #fff; background-color: #fff;
margin-top:30px; margin-top: 30px;
.fission-title { .fission-title {
color: #000; color: #000;
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
} }
.fission-subtitle { .fission-subtitle {
color: #000; color: #000;
font-weight: bold; font-weight: bold;
margin-top: 15px; margin-top: 15px;
margin-bottom: 15px; margin-bottom: 15px;
font-size: 14px; font-size: 14px;
} }
.departs { .departs {
.depart-title { .depart-title {
font-size: 14px; font-size: 14px;
.per { .per {
height: 16px; height: 16px;
width: 2px; width: 2px;
display: inline-block; display: inline-block;
margin: 0 15px; margin: 0 15px;
background: #d7d7d7; background: #d7d7d7;
}
} }
} }
} }
}
.btn { .btn {
display: flex; display: flex;
align-items: center; align-items: center;
margin-top: 24px; margin-top: 24px;
margin-left: 56px; margin-left: 56px;
; margin-bottom: 30px;
margin-bottom: 30px; }
}
.bold {
font-weight: 700;
font-size: 14px;
color: #333;
}
.bold {
font-weight: 700;
font-size: 14px;
color: #333;
} }
}
</style> </style>
\ 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