crm：code review 客户配置管理

Author: YunaiV

src/views/crm/customer/detail/index.vue

@@ -1,4 +1,5 @@
 <template>
+  <!-- TODO @wanwan：要不要把上面这一整块，搞成一个组件，就是把 下面 + Details + BasitcInfo 合并成一个 -->
   <div v-loading="loading">
     <div class="flex items-start justify-between">
       <div>
@@ -74,20 +75,20 @@
       <el-tab-pane label="客户关系" lazy> 客户关系</el-tab-pane>
       <!-- TODO wanwan 以下标签上的数量需要接口统计返回 -->
       <el-tab-pane label="联系人" lazy>
-        <template #label> 联系人<el-badge :value="12" class="item" type="primary" /> </template>
+        <template #label> 联系人<el-badge class="item" type="primary" /> </template>
         联系人
       </el-tab-pane>
       <el-tab-pane label="团队成员" lazy>
-        <template #label> 团队成员<el-badge :value="2" class="item" type="primary" /> </template>
+        <template #label> 团队成员<el-badge class="item" type="primary" /> </template>
         团队成员
       </el-tab-pane>
       <el-tab-pane label="商机" lazy> 商机</el-tab-pane>
       <el-tab-pane label="合同" lazy>
-        <template #label> 合同<el-badge :value="3" class="item" type="primary" /> </template>
+        <template #label> 合同<el-badge class="item" type="primary" /> </template>
         合同
       </el-tab-pane>
       <el-tab-pane label="回款" lazy>
-        <template #label> 回款<el-badge :value="4" class="item" type="primary" /> </template>
+        <template #label> 回款<el-badge class="item" type="primary" /> </template>
         回款
       </el-tab-pane>
       <el-tab-pane label="回访" lazy> 回访</el-tab-pane>
@@ -116,14 +117,12 @@ const { currentRoute } = useRouter() // 路由
 const id = Number(route.params.id)
 const loading = ref(true) // 加载中
 
-// 客户详情
-const customer = ref<CustomerApi.CustomerVO>({} as CustomerApi.CustomerVO)
-
 /**
  * 获取详情
  *
  * @param id
  */
+const customer = ref<CustomerApi.CustomerVO>({} as CustomerApi.CustomerVO) // 客户详情
 const getCustomerData = async (id: number) => {
   loading.value = true
   try {

src/views/crm/customerLimitConfig/CustomerLimitConfDetails.vue

@@ -144,4 +144,3 @@ onMounted(() => {
   getList()
 })
 </script>
-<style scoped lang="scss"></style>

src/views/crm/customerLimitConfig/CustomerLimitConfigForm.vue

@@ -83,6 +83,7 @@ const formRules = reactive({
   maxCount: [{ required: true, message: '数量上限不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
+// TODO @芋艿：看看怎么搞个部门选择组件
 const deptTree = ref() // 部门树形结构
 const userTree = ref() // 用户树形结构
 
@@ -179,6 +180,7 @@ const getUserTree = async () => {
   handleUserData(userTree.value, deptUserMap)
 }
 
+// TODO @芋艿：看看怎么搞个用户选择的组件
 /**
  * 处理用户树
  *

src/views/crm/customerLimitConfig/customerLimitConf.ts

@@ -1,3 +1,4 @@
+// TODO 可以挪到它对应的 api.ts 文件里哈
 /**
  * 客户限制配置类型
  */

src/views/crm/customerLimitConfig/index.vue

@@ -1,8 +1,9 @@
 <template>
   <!-- 列表 -->
   <ContentWrap>
-    <el-tabs tab-position="left">
+    <el-tabs>
       <el-tab-pane label="拥有客户数限制">
+        <!-- TODO @wanwan：CustomerLimitConfigList，因为它是列表哈 -->
         <CustomerLimitConfDetails :confType="LimitConfType.CUSTOMER_QUANTITY_LIMIT" />
       </el-tab-pane>
       <el-tab-pane label="锁定客户数限制">
@@ -11,7 +12,6 @@
     </el-tabs>
   </ContentWrap>
 </template>
-
 <script setup lang="ts">
 import CustomerLimitConfDetails from '@/views/crm/customerLimitConfig/CustomerLimitConfDetails.vue'
 import { LimitConfType } from '@/views/crm/customerLimitConfig/customerLimitConf'

src/views/crm/customerPoolConf/index.vue

@@ -8,18 +8,20 @@
       v-loading="formLoading"
     >
       <el-card shadow="never">
+        <!-- 操作 -->
         <template #header>
           <div class="flex items-center justify-between">
             <CardTitle title="客户公海规则设置" />
             <el-button
               type="primary"
               @click="onSubmit"
               v-hasPermi="['crm:customer-pool-config:update']"
-              >保存</el-button
             >
+              保存
+            </el-button>
           </div>
         </template>
-
+        <!-- 表单 -->
         <el-form-item label="客户公海规则设置" prop="enabled">
           <el-radio-group v-model="formData.enabled" class="ml-4">
             <el-radio :label="false" size="large">不启用</el-radio>
@@ -41,22 +43,19 @@
           </el-form-item>
           <div v-if="formData.notifyEnabled">
             <el-form-item>
-              提前
-              <el-input-number class="mx-2" v-model="formData.notifyDays" />
-              天提醒
+              提前 <el-input-number class="mx-2" v-model="formData.notifyDays" /> 天提醒
             </el-form-item>
           </div>
         </div>
       </el-card>
     </el-form>
   </ContentWrap>
 </template>
-
 <script setup lang="ts">
 import * as CustomerPoolConfApi from '@/api/crm/customerPoolConf'
 import { CardTitle } from '@/components/Card'
-import { CustomerPoolConfigVO } from '@/api/crm/customerPoolConf'
 
+// TODO @wanwan：CustomerPoolConf =》 CustomerPoolConfig；另外，我们在 crm 目录下，新建一个 config 目录，然后把 customerPoolConfig 和 customerLimitConfig 都挪进
 defineOptions({ name: 'CustomerPoolConf' })
 
 const message = useMessage() // 消息弹窗
@@ -70,15 +69,12 @@ const formData = ref({
   notifyEnabled: false,
   notifyDays: 0
 })
-
 const formRules = reactive({
   enabled: [{ required: true, message: '是否启用客户公海不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
 
-/**
- * 获取配置
- */
+/** 获取配置 */
 const getConfig = async () => {
   try {
     formLoading.value = true
@@ -92,9 +88,7 @@ const getConfig = async () => {
   }
 }
 
-/**
- * 提交配置
- */
+/** 提交配置 */
 const onSubmit = async () => {
   // 校验表单
   if (!formRef) return
@@ -113,6 +107,7 @@ const onSubmit = async () => {
   }
 }
 
+// TODO @wanwan：el-radio-group 选择后，触发会不会更好哈；
 watch(
   () => formData.value.enabled,
   (val: boolean) => {
@@ -124,6 +119,7 @@ watch(
     }
   }
 )
+// TODO @wanwan：el-radio-group 选择后，触发会不会更好哈；
 watch(
   () => formData.value.notifyEnabled,
   (val: boolean) => {