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

package.json

@@ -22,6 +22,7 @@
     "lockr": "^0.9.0-beta.0",
     "lodash": "^4.17.21",
     "mermaid": "^8.12.1",
+    "naive-ui": "^2.21.2",
     "quasar": "^2.0.0",
     "quasar-tiptap-branch": "^1.8.1",
     "vue-i18n": "^9.0.0",

quasar.conf.js

@@ -29,7 +29,7 @@ module.exports = configure(function (ctx) {
     // app boot file (/src/boot)
     // --> boot files are part of "main.js"
     // https://v2.quasar.dev/quasar-cli/boot-files
-    boot: ['i18n', 'axios', 'dict', 'permission', 'globalcmp', 'antDesign'],
+    boot: ['i18n', 'axios', 'dict', 'permission', 'globalcmp', 'antDesign','naiveUI'],
 
     // https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
     css: ['app.scss','svg.scss'],

src/api/customer.ts

@@ -176,22 +176,16 @@ class customerService {
       data
     })
   }
-    // 获取客户标签/分组 列表
-    static async getWeChatLableList(data: any): Promise<HttpResponse> {
-      return Axios('/QYWeChat/GetWeChatLableList', {
-        method: 'post',
-        responseType: 'json',
-        data
-      })
-    }
+  // 获取客户标签/分组 列表
+  static async getWeChatLableList(data: any): Promise<HttpResponse> {
+    return Axios('/QYWeChat/GetWeChatLableList', {
+      method: 'post',
+      responseType: 'json',
+      data
+    })
+  }
   // 新增修改分组/标签
-  static async setWeChatLable(data: {
-    Id:number,
-    ParentId:number,
-    Name:string,
-    Sort:string,
-    ChildList:Array<{Name:string, Sort:string}>
-  }): Promise<HttpResponse> {
+  static async setWeChatLable(data: { Id: number; ParentId: number; Name: string; Sort: string; ChildList: Array<{ Name: string; Sort: string }> }): Promise<HttpResponse> {
     return Axios('/QYWeChat/SetWeChatLable', {
       method: 'post',
       responseType: 'json',
@@ -199,7 +193,7 @@ class customerService {
     })
   }
   // 新增修改分组/标签
-  static async delWeChatLable(data: {LableId:number}): Promise<HttpResponse> {
+  static async delWeChatLable(data: { LableId: number }): Promise<HttpResponse> {
     return Axios('/QYWeChat/DelWeChatLable', {
       method: 'post',
       responseType: 'json',
@@ -207,14 +201,7 @@ class customerService {
     })
   }
   // 保存客户阶段流程
-  static async setCustomerStageFlowInfo(data: {
-    Id:number,
-    FlowName:string,
-    DeptEmpList:Array<{Id:number,Name:string,Type:number}>,
-    UseStage:string,
-    LoseCause:string,
-    InvalidCause:string,
-  }): Promise<HttpResponse> {
+  static async setCustomerStageFlowInfo(data: { Id: number; FlowName: string; DeptEmpList: Array<{ Id: number; Name: string; Type: number }>; UseStage: string; LoseCause: string; InvalidCause: string }): Promise<HttpResponse> {
     return Axios('/QYCustomer/SetCustomerStageFlowInfo', {
       method: 'post',
       responseType: 'json',
@@ -222,15 +209,29 @@ class customerService {
     })
   }
   // 获取客户阶段流程详情
-  static async getCustomerStageFlowInfo(data: {
-    FlowId:number,
-  }): Promise<HttpResponse> {
+  static async getCustomerStageFlowInfo(data: { FlowId: number }): Promise<HttpResponse> {
     return Axios('/QYCustomer/GetCustomerStageFlowInfo', {
       method: 'post',
       responseType: 'json',
       data
     })
   }
+  // 获取获取客户操作配置
+  static async getCustomerConfig(data: any): Promise<HttpResponse> {
+    return Axios('/QYCustomer/GetCustomerConfig', {
+      method: 'post',
+      responseType: 'json',
+      data
+    })
+  }
+  // 保存客户操作
+  static async setCustomerConfig(data: any): Promise<HttpResponse> {
+    return Axios('/QYCustomer/SetCustomerConfig', {
+      method: 'post',
+      responseType: 'json',
+      data
+    })
+  }
 }
 
 export default customerService

src/boot/axios.ts

 import { boot } from 'quasar/wrappers'
 import axios, { AxiosInstance } from 'axios'
-import {UploadSelfFile} from '@/utils/common'
+// import {UploadSelfFile} from '@/utils/upload'
 declare module '@vue/runtime-core' {
 	interface ComponentCustomProperties {
 		$axios: AxiosInstance
@@ -24,7 +24,7 @@ export default boot(({ app }) => {
 	 * @deprecated 弃用的方法
 	 */
 	app.config.globalProperties.$api = api
-	app.config.globalProperties.$UploadSelfFile = UploadSelfFile
+	// app.config.globalProperties.$UploadSelfFile = UploadSelfFile
 
 	// ^ ^ ^ this will allow you to use this.$api (for Vue Options API form)
 	//       so you can easily perform requests against your app's API

src/boot/naiveUI.ts

+import { boot } from 'quasar/wrappers'
+
+
+import naive from 'naive-ui'
+
+export default boot(({ app }) => {
+  // Set naive instance on app
+  app.use(naive)
+})
\ No newline at end of file

src/components/common/Cascader.vue

@@ -67,6 +67,7 @@
                                 :val="_item[optionValue]"
                                 :label="_item[optionLabel]"
                                 v-if="multiple"
+                                indeterminate-value
                                 @mouseenter.stop="getChild2(_index)"
                                 @update:model-value="getLabel($event, _item[optionLabel], _item[optionValue])"
                             />
@@ -94,6 +95,7 @@
                                 :val="_item[optionValue]"
                                 :label="_item[optionLabel]"
                                 v-if="multiple"
+                                indeterminate-value
                                 @mouseenter.stop="getChild3(_index)"
                                 @update:model-value="getLabel($event, _item[optionLabel], _item[optionValue])"
                             />
@@ -120,6 +122,7 @@
                                 :val="_item[optionValue]"
                                 :label="_item[optionLabel]"
                                 v-if="multiple"
+                                indeterminate-value
                                 @update:model-value="getLabel($event, _item[optionLabel], _item[optionValue])"
                             />
                             <q-icon
@@ -198,7 +201,6 @@ export default {
         watch(() => [...checkbox.value], (val) => {
             check.value = val
             selectArray.value = []
-            // console.log('多选', selectArray.value)
             console.log('多选2', checkbox.value)
         })
         const getChild = (index) => {
@@ -221,11 +223,10 @@ export default {
                 if (labelIndex > -1) {
                     checkBoxLabel.value.splice(labelIndex, 1)
                 }
-
             }
-            const newVal=JSON.parse(JSON.stringify(val))
-            getselectArray(props.options, newVal)
-            console.log(228,newVal)
+            console.log(228,  label, curVal)
+            getselectArray(props.options, curVal)
+
 
         }
 
@@ -237,24 +238,80 @@ export default {
                 radio.value = ""
             }
         }
-        //处理选中值-------------
+        //处理选中框-------------
         let selectArray = ref<Array<any>>([])
+        
         const getselectArray = (arr: any[], checkVal) => {
+            const index = checkbox.value.indexOf(checkVal)
+            //父级id数组
             arr.map(e => {
-                const flag = checkVal.indexOf(e[props.optionValue]) > -1&&e[props.optionValue].slice(0,1)==1
-                
-                if (flag) {
-                    checkbox.value.push(e[props.optionValue])
-                      console.log(246,checkVal)
-                    if(e[props.optionChildren]&&e[props.optionChildren].length>0){
-                          getselectArray(e[props.optionChildren],checkVal)
+                const child = e[props.optionChildren]
+                if (checkVal == e[props.optionValue]) {
+                    if (index > -1) {
+                        mapChildAdd(child)
+                    } else {
+                        mapChildDel(child)
                     }
-                  
+                } else {
+                    getselectArray(child, checkVal)
+                }
+                if(child.length>0){
+                     //处理父级
+                    mapfather(child, e[props.optionValue],checkVal)
                 }
             })
-
         }
+        const mapChildAdd = (arr: any[]) => {
+            arr.map(e => {
+                const index = checkbox.value.indexOf(e[props.optionValue])
+                if (index == -1) {
+                    checkbox.value.push(e[props.optionValue])
+                }
+                const child = e[props.optionChildren]
+                if (child.length > 0) {
+                    mapChildAdd(child)
+                }
+            })
+        }
+        const mapChildDel = (arr: any[]) => {
+            arr.map(e => {
+                const delIndex = checkbox.value.indexOf(e[props.optionValue])
+                checkbox.value.splice(delIndex, 1)
+                const child = e[props.optionChildren]
+                if (child.length > 0) {
+                    mapChildDel(child)
+                }
+            })
+        }
+        const mapfather = (arr: any[], faId,checkVal) => {
+           
+            //  判断自己是否选中
+             const self = checkbox.value.indexOf(checkVal) > -1
+             //  判断兄弟节点是否选中
+            //  const bro = child.every(e=>.indexOf(checkVal) > -1
+             arr.map(e => {
+                 
+                if (self) {
+                      const child = e[props.optionChildren]
+                    if (child.length > 0) {
+                         faId=faId+','+e[props.optionValue]
+                        mapfather(child, faId,checkVal)
+                    }
 
+                } else {
+                    if(checkVal===e[props.optionValue]){
+                         console.log('当前',e[props.optionValue])
+                         console.log('Ids',faId.split(','))
+                        faId.split(',').map(_e=>{
+                            const faIndex = checkbox.value.indexOf(_e)
+                            checkbox.value.splice(faIndex,1)
+                        })
+                    }
+                    return
+                }
+               
+            })
+        }
         return {
             selectRef,
             radio,

src/components/common/departmentStaff.vue

@@ -10,7 +10,7 @@
     >
         <q-card style="width: 600px;height:600px; max-width: 80vw;">
             <q-card-section class="row items-center q-pb-none">
-                <div class="text-h6">选择部门/员工</div>
+                <div class="text-h6">选择部门 <span v-if="showType===0">/员工</span></div>
                 <q-space />
                 <q-btn icon="close" flat round dense v-close-popup />
             </q-card-section>
@@ -50,7 +50,7 @@
                         />
                     </div>
                     <div class="col-6 q-px-sm">
-                        <div class="list-title">已选择的部门或成员</div>
+                        <div class="list-title">已选择的部门<span v-if="showType===0">或成员</span></div>
                         <div class="q-pb-none col-12 list-box">
                             <div v-for="(item,index) in selectArray" :key="index" class="list-item">
                                 <div class="flex-center">
@@ -75,7 +75,7 @@
 
             <q-card-actions align="right" class="bg-white text-teal">
                 <q-btn flat label="取消" v-close-popup />
-                <q-btn color="primary" @click="goback" label="确定" />
+                <q-btn color="primary" @click="goback" flat label="确定" />
             </q-card-actions>
         </q-card>
     </q-dialog>

src/module/customer/customerModule.ts

@@ -5,9 +5,16 @@
 // import { UserGetter } from '@/store/modules/user/getters'
 // import { dispatchAction, getStoreGetter, setStoreState } from '@/store/utils'
 // import message from '@/utils/message'
-import { StaticConfig } from '@/config/app'
-import { ref, reactive } from 'vue'
-import customer2, { CutomerParams } from '@/api/customer2'
+import {
+  StaticConfig
+} from '@/config/app'
+import {
+  ref,
+  reactive
+} from 'vue'
+import customer2, {
+  CutomerParams
+} from '@/api/customer2'
 interface Params {
   selectVal: string
   selectWay: number
@@ -19,22 +26,23 @@ interface customParams {
   customWay: number
 }
 interface friendParams {
-  frendArr: Array<number>
-  wayArr: Array<number>
+  frendArr: Array < number >
+    wayArr: Array < number >
 }
 interface memberParams {
   newId: number | string
   DataType: number | string
   DeptId: number
-  ChildList: Array<any>
+  ChildList: Array < any >|null
 }
 interface dataParams {
-  columns: Array<any>
-  dataList: Array<any>
-  WayList: Array<any>
-  selected: Array<any>
-  EmployeeList: Array<memberParams>
-  defaultArray: Array<number|string>
+  columns: Array < any >
+    dataList: Array < any >
+    WayList: Array < any >
+    selected: Array < any >
+    EmployeeList: Array < memberParams >
+    defaultArray: Array < number | string >
+    CascaderValue: Array < any > | string
 }
 const CustomerModule = () => {
   //调用方法
@@ -64,15 +72,21 @@ const CustomerModule = () => {
       if (data.EmployeeList.length == 0) return
       data.EmployeeList.forEach(x => {
         x.newId = x.DataType + '-' + x.DeptId
-        if (x.ChildList && x.ChildList.length > 0) {
-          getChildList(x.ChildList)
-        }
+          if (x.DataType === 2) {
+            x.ChildList = null
+          }
+          if (x.ChildList && x.ChildList.length > 0) {
+            getChildList(x.ChildList)
+          }
       })
     })
   }
-  const getChildList = (ChildList: Array<any>) => {
+  const getChildList = (ChildList: Array < any > ) => {
     ChildList.forEach(x => {
       x.newId = x.DataType + '-' + x.DeptId
+      if (x.DataType === 2) {
+        x.ChildList = null
+      }
       if (x.ChildList && x.ChildList.length > 0) {
         getChildList(x.ChildList)
       }
@@ -85,31 +99,76 @@ const CustomerModule = () => {
   })
   //日期对象
   // const daySelect =
-  const data = reactive<dataParams>({
-    columns: [
-      {
+  const data = reactive < dataParams > ({
+    columns: [{
         name: 'CustomerName',
         label: '客户',
         field: 'CustomerName',
         align: 'left'
       },
-      { name: 'StageName', align: 'center', field: 'StageName', label: '客户阶段' },
-      { name: 'LableList', label: '客户标签', field: 'LableList', align: 'left' },
-      { name: 'carbs', label: '内容标签', field: 'carbs', align: 'left' },
-      { name: 'CreateTime', label: '创建时间', field: 'CreateTime', align: 'left' },
-      { name: 'sodium', label: '负责人', field: 'sodium', align: 'left' },
-      { name: 'LastFollowUpTime', label: '上次跟进', field: 'LastFollowUpTime', align: 'left' },
-      { name: 'Source', label: '渠道活码来源', field: 'Source', align: 'left' },
+      {
+        name: 'StageName',
+        align: 'center',
+        field: 'StageName',
+        label: '客户阶段'
+      },
+      {
+        name: 'LableList',
+        label: '客户标签',
+        field: 'LableList',
+        align: 'left'
+      },
+      {
+        name: 'carbs',
+        label: '内容标签',
+        field: 'carbs',
+        align: 'left'
+      },
+      {
+        name: 'CreateTime',
+        label: '创建时间',
+        field: 'CreateTime',
+        align: 'left'
+      },
+      {
+        name: 'sodium',
+        label: '负责人',
+        field: 'sodium',
+        align: 'left'
+      },
+      {
+        name: 'LastFollowUpTime',
+        label: '上次跟进',
+        field: 'LastFollowUpTime',
+        align: 'left'
+      },
+      {
+        name: 'Source',
+        label: '渠道活码来源',
+        field: 'Source',
+        align: 'left'
+      },
       // { name: 'num', label: '7日内客户回复消息数', align: 'left'},
       // { name: 'num', label: '7日内员工发送消息数', align: 'left'},
-      { name: 'FriendTime', label: '添加好友时间', field: 'FriendTime', align: 'left' },
-      { name: 'CheckInNum', label: '签到拜访', field: 'CheckInNum', align: 'left' }
+      {
+        name: 'FriendTime',
+        label: '添加好友时间',
+        field: 'FriendTime',
+        align: 'left'
+      },
+      {
+        name: 'CheckInNum',
+        label: '签到拜访',
+        field: 'CheckInNum',
+        align: 'left'
+      }
     ],
     selected: [],
     dataList: [],
     WayList: [],
     EmployeeList: [],
-    defaultArray: [] //
+    defaultArray: [], //
+    CascaderValue: ""
   })
   const msg = reactive({
     PageIndex: 1,
@@ -133,8 +192,7 @@ const CustomerModule = () => {
     OrderBy: 1, //排序
     AddCondition: 0 //查询条件
   })
-  const TypeList = reactive([
-    {
+  const TypeList = reactive([{
       Name: '企业',
       Id: 0
     },
@@ -151,8 +209,7 @@ const CustomerModule = () => {
       Id: 3
     }
   ])
-  const TimeList = reactive([
-    {
+  const TimeList = reactive([{
       Name: '客户创建时间',
       Id: 1
     },
@@ -162,8 +219,7 @@ const CustomerModule = () => {
     }
   ])
   //自定义客户筛选
-  const CustomList = reactive([
-    {
+  const CustomList = reactive([{
       Name: '好友关系',
       Id: 1
     },
@@ -176,8 +232,7 @@ const CustomerModule = () => {
       Id: 3
     }
   ])
-  const friendOptions = reactive([
-    {
+  const friendOptions = reactive([{
       Name: '好友客户',
       Id: 1
     },
@@ -190,17 +245,17 @@ const CustomerModule = () => {
       Id: 3
     }
   ])
-  const SeletObj = reactive<Params>({
+  const SeletObj = reactive < Params > ({
     selectVal: '',
     selectWay: 0
   })
-  const TimeObj = reactive<timeParams>({
+  const TimeObj = reactive < timeParams > ({
     timeWay: 1
   })
-  const customSetObj = reactive<customParams>({
+  const customSetObj = reactive < customParams > ({
     customWay: 1
   })
-  const friendObj = reactive<friendParams>({
+  const friendObj = reactive < friendParams > ({
     frendArr: [],
     wayArr: []
   })
@@ -229,34 +284,59 @@ const CustomerModule = () => {
     getCustomerList(msg)
   }
   const getChild = (deptArray: any) => {
-    //数据处理 获取夏利是 1-2 前面代表部门还是人员  后面是原生ID
-    if(deptArray._value){
-      const Type = deptArray._value.split('-')[0];
-      const MyId = deptArray._value.split('-')[1]  
+    //数据处理 获取夏利是 1-2 前面代表部门还是人员 后面是原生ID
+    if (deptArray._value) {
+      const Type = deptArray._value.split('-')[0]
+      const MyId = deptArray._value.split('-')[1]
       //1部门
-      if(Type==1){
+      if (Type == 1) {
         msg.DeptId = MyId
       }
       //2人员
-      if(Type==2){
+      if (Type == 2) {
         msg.EmpId = MyId
       }
-    }else{
-      msg.DeptId=0;
-      msg.EmpId=0;
+    } else {
+      msg.DeptId = 0
+      msg.EmpId = 0
     }
     getCustomerList(msg)
   }
-  const getCkedFriend = (e:any)=>{
-    const Ids = e.map((x:any)=>{
-      return x.Id
-    }).toString();
-    msg.Q_Friends = Ids;
+  const getCkedFriend = (e: any) => {
+    const Ids = e
+      .map((x: any) => {
+        return x.Id
+      })
+      .toString()
+    msg.Q_Friends = Ids
     getCustomerList(msg)
   }
+  const CascaderUpdateValue = (val) => {
+    console.log('val', val)
+  }
 
-  return { getCustomerList, getWayList, getEmployeeData, data, msg, title, TypeList, SeletObj, getSelectWay, TimeObj, TimeList, changePage, pagination, 
-    CustomList, customSetObj, friendObj, friendOptions, getChild, getCkedFriend}
+  return {
+    getCustomerList,
+    getWayList,
+    getEmployeeData,
+    data,
+    msg,
+    title,
+    TypeList,
+    SeletObj,
+    getSelectWay,
+    TimeObj,
+    TimeList,
+    changePage,
+    pagination,
+    CustomList,
+    customSetObj,
+    friendObj,
+    friendOptions,
+    getChild,
+    getCkedFriend,
+    CascaderUpdateValue
+  }
 }
 
 export default CustomerModule

src/pages/customer/components/CustomerOperation.vue

+<template>
+  <div class="q-mt-md q-pa-md CustomerOperation flex">
+    <div class="customer-operation-category">
+      <div v-for="item in leftList" :key="item.Id" :class="{ active: curItem == item.Id }"
+        class="customer-operation-category--item" @click="changeActive(item)">{{ item.Name }}</div>
+    </div>
+    <div class="customer-operation-content">
+      <div v-if="curItem == 1" class="row">
+        <div class="col-2 content-left">领取公海客户:</div>
+        <div class="col-10">
+          <div class="flex items-center">
+            <q-toggle v-model="data.IsPublicAudit" :true-value="1" :false-value="2" />
+            开启后，员工领取公海客户时需要企微端设置的部门上级审批，审批同意后才可领取
+          </div>
+          <div class="flex items-center">
+            <q-toggle v-model="data.PublicGetDept" false-value="-1" />以下部门允许领取公海客户
+            <q-btn color="primary" label="修改" size="xs" class="q-ml-lg" @click="checkedPublicGetDept" />
+          </div>
+          <div>
+            <div v-for="item in items" :key="item.id">{{ item }}</div>
+          </div>
+        </div>
+      </div>
+      <div v-if="curItem == 2">
+        <div class="row">
+          <div class="col-2 content-left">可放弃客户:</div>
+          <div class="col-10">
+            <div class="q-gutter-sm">
+              <q-radio v-model="data.AbandonType" :val="1" label="全部客户" />
+              <q-radio v-model="data.AbandonType" :val="2" label="部分客户" />
+            </div>
+            <div v-if="data.AbandonType == 2">
+              <requestGroup />
+            </div>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-2 content-left">可操作员工:</div>
+          <div class="col-10">
+            <div class="flex items-center">
+              <q-toggle v-model="data.AbandonDept" false-value="-1" />以下部门允许将客户放弃到公海
+              <q-btn color="primary" label="修改" size="xs" class="q-ml-lg" @click="checkedPublicGetDept" />
+            </div>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-2 content-left">放弃后审核:</div>
+          <div class="col-10">
+            <div class="flex items-center">
+              <q-toggle v-model="data.AbandonAudit" false-value="-1" />开启后，员工放弃客户时需要企微端设置的部门上级审批，审批同意后才可放弃。</div>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-2 content-left" style="padding-top: 15px">放弃原因:</div>
+          <div class="col-10">
+            <draggable v-model="data.AbandonReasonList" tag="div" item-key="Id">
+              <template #item="{ element }">
+                <div class="flex items-center">
+                  <i class="iconfont icon-drag" style="font-size: 20px; color: #777"></i>
+                  <div class="AbandonReasonItem flex items-center">{{ element }}</div>
+                </div>
+              </template>
+            </draggable>
+          </div>
+        </div>
+      </div>
+      <div v-if="curItem == 3" class="row">
+        <div class="col-2 content-left">申请成为协作人：</div>
+        <div class="col-10">
+          <div class="flex items-center">
+            <q-toggle v-model="data.ApplyForTeamDept" :true-value="1" :false-value="0" />以下部门允许申请成为协作人
+            <q-btn color="primary" label="修改" size="xs" class="q-ml-lg" @click="checkedPublicGetDept" />
+            </div>
+          <div>
+            <div v-for="item in items" :key="item.id">{{ item }}</div>
+          </div>
+        </div>
+      </div>
+      <div v-if="curItem == 4" class="row">
+        <div class="col-2 content-left">添加协作人：</div>
+        <div class="col-10">
+          <div class="flex items-center">
+            <q-toggle v-model="data.AddTeamDept" :true-value="1" :false-value="0" />以下部门允许申请成为协作人
+            <q-btn color="primary" label="修改" size="xs" class="q-ml-lg" @click="checkedPublicGetDept" />
+            </div>
+          <div>
+            <div v-for="item in items" :key="item.id">{{ item }}</div>
+          </div>
+          <div class="flex">
+              <q-checkbox v-model="data.AddTeamDept" label="协作人被移除后（若该协作人已添加客户为好友），自动创建新的客户" />
+          </div>
+        </div>
+      </div>
+    </div>
+    <departmentStaff v-model="showDptDialog" :defaultArray="defaultDpt" nodeKey="newId" :showType="1"
+      labelKey="DeptName" childrenKey="ChildList" strategy="leaf" :treeData="DptDataTree" @select="getdpt" />
+  </div>
+</template>
+<script lang="ts">
+  import {
+    ref,
+    toRefs,
+    reactive,
+    defineComponent,
+    onMounted
+  } from 'vue'
+  import customerService from '@/api/customer'
+  // import customerService2 from '@/api/customer2'
+  import departmentStaff from '@/components/common/departmentStaff.vue'
+  import requestGroup from '@/components/customer/request-group.vue'
+  import draggable from 'vuedraggable'
+  export default defineComponent({
+    components: {
+      departmentStaff,
+      requestGroup,
+      draggable
+    },
+    setup() {
+      const leftList = ref([{
+          Id: 1,
+          Name: '领取公海客户'
+        },
+        {
+          Id: 2,
+          Name: '放弃到公海'
+        },
+        {
+          Id: 3,
+          Name: '申请成为协作人'
+        },
+        {
+          Id: 4,
+          Name: '添加协作人'
+        },
+        {
+          Id: 5,
+          Name: '转移客户'
+        },
+        {
+          Id: 6,
+          Name: '删除客户跟进记录'
+        },
+        {
+          Id: 7,
+          Name: '签到拜访设置'
+        },
+        {
+          Id: 8,
+          Name: '创建企业'
+        },
+        {
+          Id: 9,
+          Name: '写跟进'
+        }
+      ])
+      let curItem = ref(1)
+      let data = reactive({
+        data: {
+          IsPublicAudit: 1,
+          PublicGetDept: -1,
+          AbandonType: 1
+        },
+        showDptDialog: false,
+        defaultDpt: [],
+        DptDataTree: []
+      })
+      const changeActive = item => {
+        curItem.value = item.Id
+      }
+      const getConfig = () => {
+        customerService.getCustomerConfig({}).then(res => {
+          console.log('CONFIG', res.data.Data)
+          data.data = res.data.Data
+        })
+      }
+      const getDptTree = () => {
+        customerService.getDeptTree({}).then(res => {
+          console.log('DptDataTree', res.data.Data)
+          data.DptDataTree = res.data.Data
+          // 重组唯一id
+          if (data.DptDataTree.length == 0) return
+          data.DptDataTree.forEach((x: any) => {
+            x.newId = x.DataType + '-' + x.DeptId
+            if (x.ChildList && x.ChildList.length > 0) {
+              getChildList(x.ChildList)
+            }
+          })
+        })
+      }
+      const getChildList = (ChildList: Array < any > ) => {
+        ChildList.forEach(x => {
+          x.newId = x.DataType + '-' + x.DeptId
+          if (x.ChildList && x.ChildList.length > 0) {
+            getChildList(x.ChildList)
+          }
+        })
+      }
+      const getdpt = val => {
+        console.log('dpt', val)
+      }
+      //领取公海客户
+      const checkedPublicGetDept = () => {
+        data.showDptDialog = true
+      }
+      const setCustomerConfig = () => {
+        customerService.setCustomerConfig(data.data).then(res => {
+          console.log('set', res.data.Data)
+        })
+      }
+      onMounted(() => {
+        getDptTree()
+        getConfig()
+      })
+      return {
+        leftList,
+        curItem,
+        changeActive,
+        ...toRefs(data),
+        getdpt,
+        checkedPublicGetDept,
+        setCustomerConfig
+      }
+    }
+  })
+
+</script>
+<style lang="scss" scoped>
+  .CustomerOperation {
+    background-color: rgb(243, 246, 249);
+  }
+
+  .customer-operation-category {
+    margin-right: 10px;
+    width: 200px;
+    flex: none;
+    background-color: #fff;
+    border-radius: 8px;
+    padding: 15px 0;
+    overflow: auto;
+
+    .customer-operation-category--item {
+      padding: 15px 25px;
+      cursor: pointer;
+      font-weight: 600;
+      user-select: none;
+      color: #333;
+      font-size: 14px;
+    }
+
+    .active {
+      background-color: #eaf0ff;
+      color: #3470ff;
+    }
+  }
+
+  .customer-operation-content {
+    background: #fff;
+    flex: 1;
+    border-radius: 8px;
+    padding: 25px;
+    overflow: auto;
+  }
+
+  .content-left {
+    line-height: 40px;
+    font-weight: 600;
+    white-space: nowrap;
+  }
+
+  .AbandonReasonItem {
+    width: 453px;
+    height: 50px;
+    line-height: 50px;
+    padding-left: 22px;
+    background-color: #fff;
+    border-radius: 5px;
+    border: 1px solid #d7d7d7;
+    margin: 10px;
+  }
+
+</style>

src/pages/customer/customerSetup.vue

@@ -15,12 +15,14 @@
         <q-tab name="label" label="标签" />
         <q-tab name="clue" label="线索分配规则" />
         <q-tab name="phase" label="客户阶段" />
+        <q-tab name="operation" label="客户操作" />
       </q-tabs>
       <div class="container fit">
         <customer-Field v-if="tab == 'field'"></customer-Field>
         <clue-rule v-if="tab == 'clue'"></clue-rule>
         <customer-phase v-if="tab == 'phase'"></customer-phase>
         <customerlabel v-if="tab == 'label'"></customerlabel>
+        <CustomerOperation v-if="tab == 'operation'"></CustomerOperation>
       </div>
     </q-page>
   </div>
@@ -31,6 +33,7 @@ import customerField from './components/customerField.vue'
 import clueRule from './components/clueRule.vue'
 import customerPhase from './components/customerPhase.vue'
 import customerlabel from './components/customerlabel.vue'
+import CustomerOperation from "./components/CustomerOperation.vue"
 import router from '@/router/index'
 
 import {
@@ -44,7 +47,8 @@ export default defineComponent({
     customerField,
     clueRule,
     customerPhase,
-    customerlabel
+    customerlabel,
+    CustomerOperation
   },
   setup() {
     let tab = ref<string>('field')