Skip to content

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

1

parent b7463bfe
Show whitespace changes
Inline Side-by-side
Showing with 648 additions and 520 deletions
src/pages/customer/customerSetup.vue
View file @ fb6831e2
<template>
<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
v-model="tab"
dense
......@@ -9,6 +9,7 @@
active-color="primary"
indicator-color="primary"
narrow-indicator
@update:model-value='gettabs'
>
<q-tab name="yewumoshi" label="业务模式" />
<q-tab name="field" label="客户字段" />
......@@ -29,19 +30,36 @@
import customerField from './components/customerField.vue'
import clueRule from './components/clueRule.vue'
import customerPhase from './components/customerPhase.vue'
import router from '@/router/index'
import {
defineComponent,
ref
} from 'vue'
export default defineComponent({
components: {
customerField,
clueRule,
customerPhase
},
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 {
tab: ref('phase')
tab,
gettabs
}
}
......
src/pages/editor/createStageRange.vue
View file @ fb6831e2
......@@ -10,73 +10,113 @@
<div class="container">
<div class="content-block">
<div class="bold">名称</div>
<q-input clearable debounce filled maxlength="20" counter v-model="state.addMsg.FlowName"
style="width:600px" placeholder="名称" :rules="[val => !!val || '不能为空']" />
<q-input
clearable
debounce
filled
maxlength="20"
counter
v-model="state.addMsg.FlowName"
style="width:600px"
placeholder="名称"
:rules="[val => !!val || '不能为空']"
/>
</div>
<div class="content-block">
<div class="bold">阶段适用范围</div>
<!-- <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 class="content-block">
<div class="bold">选择使用阶段
<div class="bold">
选择使用阶段
<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 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>
<div class="" v-for="(x,y) in state.StageList" :key='y'>
<q-checkbox v-model="state.addMsg.UseStage" :val="x.Id" :label="x.Name"
:disable="x.IsDefault==0?false:true" v-if="x.Type==1"
@update:model-value="getusestageName" />
<div class v-for="(x,y) in state.StageList" :key="y">
<q-checkbox
v-model="state.addMsg.UseStage"
:val="x.Id"
:label="x.Name"
:disable="x.IsDefault == 0 ? false : true"
v-if="x.Type == 1"
@update:model-value="getusestageName"
/>
</div>
</div>
<div class="right-arrow"><i class="el-icon-arrow-right"></i></div>
<div class="all-stage" :style="{height:state.getheight+'px'}">
<div class="right-arrow">
<i class="el-icon-arrow-right"></i>
</div>
<div class="all-stage" :style="{ height: state.getheight + 'px' }">
<p class="select-item-title">已选阶段</p>
<div v-for="(x,y) in state.UseStageName" :key='y'>
<div style="height:40px;line-height: 40px;" v-if="x.IsDefault==0">
<span>{{x.Name}}</span>
<div v-for="(x,y) in state.UseStageName" :key="y">
<div style="height:40px;line-height: 40px;" v-if="x.IsDefault == 0">
<span >{{ x.Name }}</span>
</div>
</div>
<div style="height:40px;line-height: 40px;" v-for="(x,y) in state.UseStageName" :key='y'>
<span v-if="x.IsDefault==1" style="color: #ccc;">{{x.Name}}</span>
<div
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 v-if="state.StageList">
<div v-for="(x,y) in state.StageList" :key="y" >
<div class="content-block" v-if="x.Type==2">
<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>
<div v-for="(x,y) in state.StageList" :key="y">
<div class="content-block" v-if="x.Type == 2">
<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>
</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
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 style="display:flex;align-items: center;flex-wrap: wrap;">
<div v-if='x.Name=="已输单"'>
<q-checkbox v-model="state.addMsg.LoseCause"
v-for="(item,index) in x.OptionsList" :key='index' :val="item.Id" :label="item.Name" />
<div v-if="x.Name =='已输单'">
<q-checkbox
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 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>
......@@ -85,17 +125,17 @@
</div>
</template>
<script lang="ts">
import { defineComponent, onMounted, reactive, } from 'vue'
import router from '@/router/index'
import customerService from '@/api/customer'
import { useQuasar } from 'quasar'
import { defineComponent, onMounted, reactive, } from 'vue'
import router from '@/router/index'
import customerService from '@/api/customer'
import { useQuasar } from 'quasar'
export default defineComponent({
export default defineComponent({
setup() {
const $q = useQuasar()
const state:any = reactive({
const state: any = reactive({
addMsg: {
Id: 0,
FlowName: '',
......@@ -111,7 +151,12 @@
UseStageName: [],
})
const jumpBeforePage = () => {
router.go(-1)
router.push({
path: '/customerSetup',
query: {
type:'phase'
}
})
}
const getList = () => {
......@@ -168,7 +213,7 @@
}
})
}
const savemove=()=>{
const savemove = () => {
$q.notify({
type: 'negative',
message: '不能删除',
......@@ -189,11 +234,11 @@
}
}
})
})
</script>
<style lang="scss" scoped>
.page {
.page {
min-height: 100vh;
background-color: #f4f4f6;
padding-bottom: 20px;
......@@ -202,9 +247,9 @@
.mt20 {
margin-top: 90px;
}
}
}
.navbar {
.navbar {
width: 100%;
display: flex;
justify-content: space-between;
......@@ -218,9 +263,9 @@
top: 0;
right: 0;
z-index: 9;
}
}
.container {
.container {
margin: 0 auto;
width: 1087px;
......@@ -264,7 +309,6 @@
align-items: center;
margin-top: 24px;
margin-left: 56px;
;
margin-bottom: 30px;
}
......@@ -280,25 +324,23 @@
align-items: center;
justify-content: space-between;
}
}
}
.addPhase .all-stage {
.addPhase .all-stage {
width: 300px;
padding: 20px 45px;
border: 1px solid #d7d7d7;
border-radius: 8px;
min-height: 260px;
}
}
.addPhase .select-item-title {
.addPhase .select-item-title {
font-size: 14px;
font-weight: 800;
padding-bottom: 10px;
}
}
.addPhase .right-arrow {
.addPhase .right-arrow {
width: 28px;
height: 28px;
background: #e7e7e7;
......@@ -309,12 +351,12 @@
color: #fff;
font-size: 16px;
margin: 0 30px;
}
}
.addPhase .user_lists {
.addPhase .user_lists {
width: 100%;
display: flex;
flex-wrap: wrap;
margin-top: 20px;
}
}
</style>
\ No newline at end of file
src/pages/editor/manageStageRange.vue
View file @ fb6831e2
......@@ -5,105 +5,176 @@
<q-breadcrumbs-el label="返回" icon="navigate_before" @click="jumpBeforePage" />
<q-breadcrumbs-el label="阶段管理" />
</q-breadcrumbs>
<q-btn color="primary" label="完成" @click="savemove" :loading="state.loading"/>
<q-btn color="primary" label="完成" @click="savemove" :loading="state.loading" />
</div>
<div class="container">
<div class="content-block" >
<div class="content-block">
<div class="bold" style="margin-bottom: 30px;">跟进阶段</div>
<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="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>
<q-input clearable debounce filled 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)" />
<q-input
clearable
debounce
filled
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>
</template>
</draggable>
<div>
<div v-for="(x,y) in state.followupStage_d" :key="y" style="display: flex;">
<div style="width: 57px;height: 1px;">
</div>
<q-input clearable debounce filled v-model="x.Name" style="width:500px" disable placeholder="名称"
:rules="[val => !!val || '不能为空']" />
<div style="width: 57px;height: 1px;"></div>
<q-input
clearable
debounce
filled
v-model="x.Name"
style="width:500px"
disable
placeholder="名称"
:rules="[val => !!val || '不能为空']"
/>
</div>
</div>
<div class="btn">
<q-btn v-if="state.followupStage.length<30" color="accent" class="q-mr-md" label="添加" icon='add'
@click="state.followupStage.push({Id: 0,
<q-btn
v-if="state.followupStage.length < 30"
color="accent"
class="q-mr-md"
label="添加"
icon="add"
@click="state.followupStage.push({
Id: 0,
IsDefault: 0,
Name: '',
OptionsList: [],
Sort: 0,
Type: 1})" style="width: 100px;" />
<span style="color:#858598"> 已设/可设上限：{{state.followupStage.length}}/30 </span>
Type: 1
})"
style="width: 100px;"
/>
<span style="color:#858598">已设/可设上限：{{ state.followupStage.length }}/30</span>
</div>
</div>
<div class="content-block">
<div class="bold">结束跟进</div>
<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>
<q-input clearable filled debounce placeholder="名称" v-model="x.Name" style="width:500px"
disable />
<q-input
clearable
filled
debounce
placeholder="名称"
v-model="x.Name"
style="width:500px"
disable
/>
</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">
<template #item="{ element ,index}">
<template #item="{ element, index }">
<div style="display: flex;">
<div style="width: 31px;">
<i class="iconfont icon-weiyi"
style="font-size: 14px;color: #777;margin: 0 10px;"></i>
<i
class="iconfont icon-weiyi"
style="font-size: 14px;color: #777;margin: 0 10px;"
></i>
</div>
<q-input clearable debounce filled 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)" />
<q-input
clearable
debounce
filled
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>
</template>
</draggable>
</ul>
<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'
@click="state.reasonList[y].OptionsList.push({Id:0,Name:'',disable:false})"
style="width: 100px;" />
<span style="color:#858598"> 已设/可设上限：{{x.OptionsList.length}}/30 </span>
<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"
@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>
</template>
<script lang="ts">
import { defineComponent, onMounted, reactive ,ref} from 'vue'
import router from '@/router/index'
import customerService from '@/api/customer'
import draggable from "vuedraggable";
import { useQuasar } from 'quasar'
import { defineComponent, onMounted, reactive, ref } from 'vue'
import router from '@/router/index'
import customerService from '@/api/customer'
import draggable from "vuedraggable";
import { useQuasar } from 'quasar'
export default defineComponent({
export default defineComponent({
components: {
draggable
},
setup() {
const $q = useQuasar()
const state:any = reactive({
const state: any = reactive({
addMsg: [],
followupStage: [],
followupStage_d: [],
reasonList: [],
loading:false
loading: false
})
const jumpBeforePage = () => {
router.go(-1)
// router.go(-1)
router.push({
path: '/customerSetup',
query: {
type:'phase'
}
})
}
const getList = () => {
......@@ -217,7 +288,7 @@
var show = ref(false)
for (let i = 0; i < state.followupStage.length; i++) {//判断根据阶段的值填写没有
let x = state.followupStage[i]
if (x.Name == '' || x.Name==null) {
if (x.Name == '' || x.Name == null) {
$q.notify({
type: 'negative',
message: '请填写跟进阶段列表选项值',
......@@ -238,7 +309,7 @@
for (let j = 0; j < x.OptionsList.length; j++) {
let z = x.OptionsList[j]
if (z.Name == ''|| z.Name == null) {
if (z.Name == '' || z.Name == null) {
$q.notify({
type: 'negative',
message: '请填写' + x.Name + '原因值',
......@@ -289,11 +360,11 @@
}
}
})
})
</script>
<style lang="scss" scoped>
.page {
.page {
/* height: 100vh; */
background-color: #f4f4f6;
padding-bottom: 20px;
......@@ -302,9 +373,9 @@
.mt20 {
margin-top: 90px;
}
}
}
.navbar {
.navbar {
width: 100%;
display: flex;
justify-content: space-between;
......@@ -318,9 +389,9 @@
top: 0;
right: 0;
z-index: 9;
}
}
.container {
.container {
margin: 0 auto;
width: 1087px;
......@@ -328,7 +399,7 @@
padding: 30px 20px;
border-radius: 8px;
background-color: #fff;
margin-top:30px;
margin-top: 30px;
.fission-title {
color: #000;
......@@ -364,7 +435,6 @@
align-items: center;
margin-top: 24px;
margin-left: 56px;
;
margin-bottom: 30px;
}
......@@ -373,7 +443,5 @@
font-size: 14px;
color: #333;
}
}
}
</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