2

src/css/app.scss

@@ -27,6 +27,6 @@
 }
 ::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
   border-radius: 8px;
-  -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+  -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.4);
   background: #dddddd;
 }
\ No newline at end of file

src/module/customer/editor/editCustomerLibModule.ts

-import { reactive } from 'vue'
+import { ref,reactive } from 'vue'
 import customerSetService from '@/api/customerSet'
 // import customerService from '@/api/customer'
 import router from '@/router/index'
@@ -9,14 +9,93 @@ const msg = () => {
     RuleId: curQueryId
   }
 }
+const dateOption = [
+  {
+    label: '天',
+    value: 1
+  },
+  {
+    label: '小时',
+    value: 2
+  },
+  {
+    label: '分钟',
+    value: 3
+  }
+]
 const data = reactive<any>({
   step: 1,
   text: '',
   radio: 1,
   showDeptDialog: false,
   dataTree: [],
-  defaultDept:[],
+  defaultDept: [],
+  ruleSelect: [],
+  stageList:[],
 })
+
+const ruleList = ref([
+  {
+    Id: 1,
+    text1: '超过',
+    text2: '从未跟进',
+    Num: 1,
+    DateType: 1,
+    showType: 1,
+    showTip: true,
+    tipText: ` 未进行以下操作：<br/>
+        ① 客户信息的编辑；<br/>
+        ② 给客户发消息；<br/>
+        ③ 拨打电话（电销手机模式）；<br/>
+        ④ 发短信（电销手机模式）；<br/>
+        则会视为未跟进。`
+  },
+  {
+    Id: 2,
+    text1: '超过',
+    text2: '未加微信好友',
+    Num: 1,
+    DateType: 1,
+    showType: 1,
+    showTip: true,
+    tipText: '未申请添加微信好友或未成为微信好友',
+  },
+  {
+    Id: 3,
+    text1: '超过',
+    text2: '没有成交的订单 或 客户阶段未到达"成交"阶段',
+    Num: 1,
+    DateType: 1,
+    showType: 1
+  },
+  {
+    Id: 4,
+    text1: '超过',
+    text2: '没有成交的订单 或 客户阶段未到达"成交"阶段',
+    text3: '没有签到拜访',
+    StageId: 1, //阶段Id
+    Num: 1,
+    DateType: 1,
+    showType: 2
+  },
+  {
+    Id: 5,
+    text1: '距离上次跟进，超过',
+    text2: '没有再次跟进',
+    Num: 1,
+    DateType: 1,
+    showType: 1
+  },
+  {
+    Id: 6,
+    text1: '距离上次设置客户阶段，超过',
+    text2: '没有再次更新客户阶段',
+    Num: 1,
+    DateType: 1,
+    showType: 1
+  }
+])
+
 const editMsg = reactive({
   Id: 0,
   Name: '打丧尸',
@@ -26,9 +105,9 @@ const editMsg = reactive({
   RecyclingType: 1,
   ConditionList: [] as any,
   NotRecycleTimeList: [] as any,
-  RemindDay: 0,
+  RemindDay: 1,
   RemindType: 1,
-  LimitDay: 0,
+  LimitDay: 1,
   PrivateLibraryType: ''
 })
 
@@ -44,20 +123,27 @@ const jumpBeforePage = () => {
 
 
 const editRuleModule = () => {
-  
+  //获取阶段下拉
+  customerSetService.getCustomerStageList({}).then(res => {
+    data.stageList = res.data.Data
+  })
+  //获取部门下拉
+  customerSetService.getDeptTree({}).then(res => {
+    data.dataTree = res.data.Data
+  })
   //获取已选部门成员
   const getdpt = val => {
     editMsg.DeptList = []
     val.map(e => {
-     editMsg.DeptList.push({
-       DeptId: e.Id,
-       DeptName: e.DeptName
-     })
+      editMsg.DeptList.push({
+        DeptId: e.Id,
+        DeptName: e.DeptName
+      })
     })
     console.log(val, 'dpt')
   }
   //获取已选人数
-  const getNum = (n) => {
+  const getNum = n => {
     data.peopleNum = n
   }
   //获取线索详情
@@ -78,57 +164,34 @@ const editRuleModule = () => {
   const showDeptDig = () => {
     data.showDeptDialog = true
   }
-  //获取部门数据
-  const getEmployeeData = () => {
-    customerSetService.getDeptTree({}).then(res => {
-      console.log(res.data.Data, '部门')
-      data.dataTree = res.data.Data
-      // 重组唯一id
-
-      if (data.dataTree.length == 0) return
-      // data.dataTree.forEach(x => {
-      //   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 setCustomerClueRuleInfo = () => {
-      customerSetService.setCustomerClueRuleInfo(data.editMsg).then(res => {
-        message.successMsg(res.data.Message)
-        setTimeout(() => {
-          router.push({
-            path: '/customerSetup',
-            query: {
-              type: 'clue'
-            }
-          })
-        }, 2000)
-      })
+    customerSetService.setCustomerClueRuleInfo(data.editMsg).then(res => {
+      message.successMsg(res.data.Message)
+      setTimeout(() => {
+        router.push({
+          path: '/customerSetup',
+          query: {
+            type: 'clue'
+          }
+        })
+      }, 2000)
+    })
   }
-  
+
   return {
     msg,
     data,
     editMsg,
     getDetail,
-    getEmployeeData,
     jumpBeforePage,
     setCustomerClueRuleInfo,
     getdpt,
     getNum,
     //----------new---
     showDeptDig,
+    dateOption,
+    ruleList
   }
 }
 

src/pages/customerManage/editor/editCustomerLib.vue

@@ -7,7 +7,7 @@
       </q-breadcrumbs>
       <q-btn color="primary" label="完成" @click="setCustomerClueRuleInfo" />
     </div>
-    <div class="editCustomerLib flex">
+    <div class="editCustomerLib flex no-wrap">
       <q-stepper v-model="step" vertical color="primary" animated flat header-nav class="step-container">
         <q-step :name="1" title="基础设置" icon="settings" :done="step > 1" style="height: 125px;">
         </q-step>
@@ -58,7 +58,73 @@
             </div>
             <div class="Dept-box ">
               <q-chip color="primary" v-for="(item,index) in editMsg.DeptList" :key="index" text-color="white"
-                icon="work">{{item.DeptName}}</q-chip>
+                icon="work">{{item.DeptName}}
+                <q-icon name="widgets" />
+              </q-chip>
+            </div>
+          </div>
+        </div>
+        <div v-if="step==2">
+          <div class="content-block">
+            <div class="block-title q-mb-sm">回收规则</div>
+            <q-radio v-model="editMsg.RecyclingType" :val="1" dense>
+              手动回收
+            </q-radio>
+            <q-radio v-model="editMsg.RecyclingType" :val="2" dense class="q-ml-md">
+              <span class="q-ml-sm">自动回收</span>
+              <span class="text-subTip q-ml-sm"> （获取客户后，当触发以下条件时，将进行自动回收）</span>
+            </q-radio>
+            <div class="ruleBox q-mt-md" v-if="editMsg.RecyclingType==2">
+              <div class="flex justify-between items-center">
+                <div style="font-size: 18px;color: #9696a6;">获取客户后：</div>
+                <q-btn color="white" text-color="black" label="设置免回收时间" unelevated outline />
+              </div>
+              <div v-for="item in ruleList" :key="item.id" class="q-my-sm full-width">
+                <div class=" flex items-center" v-if="item.showType===1">
+                  <q-checkbox v-model="ruleSelect" color="teal" :val="item.Id"> </q-checkbox>
+                  {{item.text1}}
+                  <q-input dense outlined v-model="item.Num" type="number" :min="0" style='width:100px'
+                    class="q-mx-sm" />
+                  <q-select dense outlined v-model="item.DateType" :options="dateOption" class="q-mx-sm" emit-value
+                    map-options />
+                  {{item.text2}}
+                  <n-popover trigger="hover" placement="right-start" v-if="item.showTip">
+                    <template #trigger>
+                      <q-icon name="help" size="xs" color="grey-4" class="q-ml-xs" />
+                    </template>
+                    <div class="tipBox" v-html="item.tipText"></div>
+                  </n-popover>
+                </div>
+                <div class="flex items-center" v-if="item.showType===2">
+                  <q-checkbox v-model="ruleSelect" color="teal" :val="item.Id"> </q-checkbox>
+                  {{item.text1}}
+                  <q-select dense outlined v-model="item.StageId" :options="stageList" option-label="Name"
+                    option-value="Id" class="q-mx-sm" emit-value map-options />
+                  {{item.text2}}
+                  <q-input dense outlined v-model="item.Num" type="number" :min="0" style='width:100px'
+                    class="q-mx-sm" />
+                  <q-select dense outlined v-model="item.DateType" :options="dateOption" class="q-mx-sm" emit-value
+                    map-options />
+                  {{item.text3}}
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="content-block q-mt-md" v-if="editMsg.RecyclingType==2">
+            <div class="block-title q-mb-sm">其他设置</div>
+            <div class="block-subtitle q-mb-xs"> 回收前提醒 <span style="color:#f00">*</span></div>
+            <div class=" flex items-center">
+              回收前
+              <q-input dense outlined v-model="editMsg.RemindDay" type="number" :min="0" style='width:100px' class="q-mx-sm" />
+              <q-select dense outlined v-model="editMsg.RemindType" :options="dateOption" class="q-mx-sm" emit-value
+                map-options />
+              提醒销售跟进
+            </div>
+            <div class="block-subtitle q-mb-xs q-mt-md"> 回收后领取限制 <span style="color:#f00">*</span></div>
+            <div class=" flex items-center">
+             客户被回收到公海后，前负责
+              <q-input dense outlined v-model="editMsg.LimitDay" type="number" :min="0" style='width:100px' class="q-mx-sm" />
+              天内不可领取
             </div>
           </div>
         </div>
@@ -66,7 +132,6 @@
           <q-btn unelevated color="white" text-color="black" label="上一步" />
           <q-btn unelevated color="accent" label="下一步" class="q-ml-md" />
         </div>
-
       </div>
     </div>
     <departmentStaff v-model="showDeptDialog" :defaultArray="defaultDept" nodeKey="DeptId" :showType="1"
@@ -94,18 +159,18 @@
         data,
         editMsg,
         // getDetail,
-        getEmployeeData,
         setCustomerClueRuleInfo,
         getdpt,
         getNum,
         showDeptDig,
+        dateOption,
+        ruleList,
       } = editRuleModule();
       onMounted(() => {
         if (msg().RuleId > 0) {
           //   data.editMsg.Id = msg().RuleId
           // getDetail()
         }
-        getEmployeeData()
       })
       return {
         jumpBeforePage,
@@ -114,7 +179,9 @@
         setCustomerClueRuleInfo,
         getdpt,
         getNum,
-        showDeptDig
+        showDeptDig,
+        dateOption,
+        ruleList,
       }
     }
 
@@ -187,4 +254,9 @@
     color: #858598;
   }
 
+  .ruleBox {
+    background-color: rgb(249, 249, 249);
+    padding: 20px;
+  }
+
 </style>