优化门店选择组件，可传入默认查询参数；

王强
1 parent 7c7c540f
Showing 3 changed files with 80 additions and 16 deletions
src/components/ShopSelectNew/api.ts
src/components/ShopSelectNew/components/ShopModal.tsx
src/components/ShopSelectNew/index.tsx
 /*
  * @Date: 2021-07-08 16:53:36
  * @LastEditors: wangqiang@feewee.cn
- * @LastEditTime: 2022-05-25 11:32:53
+ * @LastEditTime: 2022-10-08 16:17:27
  */
 import { http } from "@/typing/http";
 import request from "@/utils/request";
 import { OOP_HOST } from "@/utils/host";
 import { LabelValueType } from "rc-tree-select/lib/interface";
  
-export interface QueryParams {
-  type: 1 | 2; // 1 集团维度 2 自定义门店维度
-  shops?: string; // 门店集合 ,分割
-  keywords?: string; // 门店关键字搜索
+export interface ShopSelectNewOptions {
   bizTypes?: string; // 业态类型集合 ,分割
   brands?: string; // 品牌id集合 ,分割
   regions?: string; // 区域编码集合 ,分割
   dealers?: string; // 商家id集合 ,分割
 }
  
+export interface QueryParams extends ShopSelectNewOptions {
+  type: 1 | 2; // 1 集团维度 2 自定义门店维度
+  shops?: string; // 门店集合 ,分割
+  keywords?: string; // 门店关键字搜索
+}
+
 export interface ShopItem {
   shopId?: number; //门店id
   shopFullName?: string; //门店全称
@@ -2,7 +2,7 @@
  * @Author: wangqiang@feewee.cn
  * @Date: 2022-05-25 10:03:00
  * @LastEditors: wangqiang@feewee.cn
- * @LastEditTime: 2022-06-10 15:57:29
+ * @LastEditTime: 2022-10-08 16:33:31
  */
 import { InitialReturn } from "@/hooks/useInitail";
 import {
@@ -29,6 +29,7 @@ import {
   Value,
   Option,
   QueryParams,
+  ShopSelectNewOptions,
 } from "../api";
  
 interface Props {
@@ -47,6 +48,7 @@ interface Props {
   multiple?: boolean;
   optionInitial: InitialReturn<Option, QueryParams>;
   listInitial: InitialReturn<ShopItem[], QueryParams>;
+  defaultOptions?: ShopSelectNewOptions;
 }
  
 export default function ShopModal({
@@ -62,6 +64,7 @@ export default function ShopModal({
   multiple,
   optionInitial,
   listInitial,
+  defaultOptions = {},
 }: Props) {
   const fetchListByName = debounce(
     (keywords) => listInitial.setParams({ type, keywords }, true),
@@ -245,14 +248,26 @@ export default function ShopModal({
                 ? listInitial.params.bizTypes.split(",")
                 : undefined
             }
-            onChange={(bizs) => listInitial.setParams({ type, bizTypes: bizs?.join(",") }, true)}
+            onChange={(bizs) => listInitial.setParams(
+                {
+                  type,
+                  bizTypes: bizs.length
+                    ? bizs?.join(",")
+                    : defaultOptions.bizTypes,
+                },
+                true
+              )}
             showSearch
             optionFilterProp="children"
             style={{ minWidth: 260, marginBottom: 10, marginRight: 10 }}
             getPopupContainer={(triggerNode) => triggerNode.parentNode}
           >
             {optionInitial.data.bizList?.map((biz) => (
-              <Select.Option key={biz.type} value={"" + biz.type!}>
+              <Select.Option
+                key={biz.type}
+                value={"" + biz.type!}
+                disabled={defaultOptions.bizTypes?.includes("" + biz.type)}
+              >
                 {biz.name}
               </Select.Option>
             ))}
@@ -266,14 +281,26 @@ export default function ShopModal({
                 ? listInitial.params.regions.split(",")
                 : undefined
             }
-            onChange={(regions) => listInitial.setParams({ type, regions: regions?.join(",") }, true)}
+            onChange={(regions) => listInitial.setParams(
+                {
+                  type,
+                  regions: regions.length
+                    ? regions?.join(",")
+                    : defaultOptions.regions,
+                },
+                true
+              )}
             showSearch
             optionFilterProp="children"
             style={{ minWidth: 260, marginBottom: 10, marginRight: 10 }}
             getPopupContainer={(triggerNode) => triggerNode.parentNode}
           >
             {optionInitial.data.regionList?.map((region) => (
-              <Select.Option key={region.bh} value={region.bh!}>
+              <Select.Option
+                key={region.bh}
+                value={region.bh!}
+                disabled={defaultOptions.regions?.includes("" + region.bh)}
+              >
                 {region.fullName}
               </Select.Option>
             ))}
@@ -288,7 +315,12 @@ export default function ShopModal({
                 : undefined
             }
             onChange={(brandList) => listInitial.setParams(
-                { type, brands: brandList?.join(",") },
+                {
+                  type,
+                  brands: brandList.length
+                    ? brandList?.join(",")
+                    : defaultOptions.brands,
+                },
                 true
               )}
             showSearch
@@ -297,7 +329,11 @@ export default function ShopModal({
             getPopupContainer={(triggerNode) => triggerNode.parentNode}
           >
             {optionInitial.data.brandList?.map((brand) => (
-              <Select.Option key={brand.id} value={"" + brand.id!}>
+              <Select.Option
+                key={brand.id}
+                value={"" + brand.id!}
+                disabled={defaultOptions.brands?.includes("" + brand.id)}
+              >
                 {brand.name}
               </Select.Option>
             ))}
@@ -312,7 +348,12 @@ export default function ShopModal({
                 : undefined
             }
             onChange={(dealerList) => listInitial.setParams(
-                { type, dealers: dealerList?.join(",") },
+                {
+                  type,
+                  dealers: dealerList.length
+                    ? dealerList?.join(",")
+                    : defaultOptions.dealers,
+                },
                 true
               )}
             showSearch
@@ -321,7 +362,11 @@ export default function ShopModal({
             getPopupContainer={(triggerNode) => triggerNode.parentNode}
           >
             {optionInitial.data.dealerList?.map((dealer) => (
-              <Select.Option key={dealer.id} value={"" + dealer.id!}>
+              <Select.Option
+                key={dealer.id}
+                value={"" + dealer.id!}
+                disabled={defaultOptions.dealers?.includes("" + dealer.id)}
+              >
                 {dealer.name}
               </Select.Option>
             ))}
@@ -2,7 +2,7 @@
  * @Author: wangqiang@feewee.cn
  * @Date: 2022-05-25 09:14:31
  * @LastEditors: wangqiang@feewee.cn
- * @LastEditTime: 2022-07-12 09:41:43
+ * @LastEditTime: 2022-10-08 16:36:39
  */
 import useInitial from "@/hooks/useInitail";
 import { Tag } from "antd";
@@ -14,7 +14,12 @@ import React, {
   useImperativeHandle,
   useState,
 } from "react";
-import { Value, getShopListChooseOptionsApi, getShopListApi } from "./api";
+import {
+  Value,
+  getShopListChooseOptionsApi,
+  getShopListApi,
+  ShopSelectNewOptions,
+} from "./api";
 import Close from "./components/Close";
 import ShopModal from "./components/ShopModal";
 import "./style.less";
@@ -28,6 +33,14 @@ interface Props {
   placeholder?: string;
   type?: 1 | 2; // 1 集团维度 2 自定义门店维度
   shopIds?: number[]; // 仅查询门店ID列表，与 type = 2 时搭配使用
+  /**
+   * 默认筛选参数，下拉框中不可删除；
+   * 用于特殊业务，例如 售前CRM-零售任务 选择门店时，需要默认查询 新车销售 的门店信息，则传入 
+      defaultOptions={{
+        bizTypes: "1",
+      }}
+   */
+  defaultOptions?: ShopSelectNewOptions;
 }
  
 export interface ShopSelectNewRef {
@@ -46,6 +59,7 @@ function ShopSelectNew(
     type = 1,
     disabled = false,
     shopIds,
+    defaultOptions = {},
   }: Props,
   ref: Ref<ShopSelectNewRef>
 ) {
@@ -62,6 +76,7 @@ function ShopSelectNew(
     [],
     {
       type,
+      ...defaultOptions,
     },
     delay
   );
@@ -173,6 +188,7 @@ function ShopSelectNew(
           setVisible={setVisible}
           optionInitial={optionInitial}
           listInitial={listInitial}
+          defaultOptions={defaultOptions}
         />
       )}
     </div>