1) 增加优惠券新建商品

src/components/UseCouponAddEdit/index.jsx

@@ -1,8 +1,13 @@
-import React, { forwardRef, useImperativeHandle, useRef } from "react";
+import React, {
+  forwardRef,
+  useImperativeHandle,
+  useRef,
+  useEffect,
+} from "react";
 import { useSetState } from "ahooks";
 import { FixedSizeList } from "react-window";
 import { isAmount } from "@/tools/validate";
-import { Card, DateRangePicker, Button, Select } from "zent";
+import { Card, DateRangePicker, Button, Select, Notify } from "zent";
 import moment from "moment";
 
 import Ipt from "@/components/input/main";
@@ -10,8 +15,11 @@ import Form from "@/components/form/main";
 import FormItem from "@/components/form-item/main";
 import Grid from "@/components/gird/main.js";
 
+import UseGoodsScopePop from "../UseGoodsScopePop/index";
+
+import { getProductInfoSelect, handelResponse } from "@/assets/api.js";
+
 import "./style.less";
-import { useEffect } from "react";
 
 const tableColumn = [
   {
@@ -172,6 +180,12 @@ const UseCouponAddEdit = forwardRef((props, ref) => {
         text: `key 1`,
       },
     ],
+    addProductBtnLoading: false,
+    addGoldBtnLoading: false,
+    product_title: "",
+    showScopePop: false,
+    scopePopType: "",
+    productData: [],
   });
 
   // 基础信息
@@ -209,13 +223,17 @@ const UseCouponAddEdit = forwardRef((props, ref) => {
   }));
 
   const submit = () => {
+    // 基础信息
     let el_setup1 = form_info_el.current.validator();
     console.log("el_setup1 =>", el_setup1);
     console.log("form_info_data =>", form_info_data);
 
+    // 发放规则
     let el_setup2 = form_rule_el.current.validator();
     console.log("el_setup2 =>", el_setup2);
     console.log("form_rule_data =>", form_rule_data);
+
+    // 商品范围
   };
 
   const onReturn = () => {};
@@ -234,7 +252,56 @@ const UseCouponAddEdit = forwardRef((props, ref) => {
   const onCountChange = () => {};
   const selectionFun = () => {};
   const onRankChange = () => {};
-  const addProduct = () => {};
+  const addProduct = (type) => {
+    // 第一步：获取直连天下的商品数据需要分销商 id
+    const direct_reseller_ids = 23329;
+    if (direct_reseller_ids <= 0) {
+      Notify.error(`请添加映射分销商`);
+      return;
+    }
+
+    // 第二步: 区分是新建商品还是立减金
+    if (type === "addProduct") {
+      setState({
+        product_title: "新建商品",
+        addProductBtnLoading: true,
+        scopePopType: "addProduct",
+      });
+    } else {
+      setState({
+        product_title: "新增立减金",
+        addGoldBtnLoading: true,
+        scopePopType: "addKnockGold",
+      });
+    }
+
+    // 第三步：获取商品数据
+    let param = {
+      reseller_id: direct_reseller_ids,
+    };
+    try {
+      getProductInfoSelect(param).then((res) => {
+        setState({ addProductBtnLoading: false, addGoldBtnLoading: false });
+        handelResponse(
+          res,
+          (req, msg) => {
+            // !!!!!!!!!!!!!! 为了兼容老版本 新增商品设为空！！！老版本使用 productsList 获取商品数据！！！！！！！！！！
+            sessionStorage.setItem("productsList", JSON.stringify(req.data));
+            setState({
+              showScopePop: true,
+            });
+          },
+          (err) => {
+            console.log("err =>", err);
+          }
+        );
+      });
+    } catch (err) {
+      setState({ addProductBtnLoading: false, addGoldBtnLoading: false });
+    }
+    // !!!!!!!!!!!!!! 为了兼容老版本 新增商品设为空！！！老版本使用 productsList 获取商品数据！！！！！！！！！！
+    setState({ productData: null });
+  };
   const renderOptionList = (options, renderOption) => {
     return (
       <FixedSizeList
@@ -275,6 +342,19 @@ const UseCouponAddEdit = forwardRef((props, ref) => {
       });
     }
   };
+
+  // 优惠券弹窗 取消
+  const scopePopClose = () => {
+    setState({
+      showScopePop: false,
+    });
+  };
+
+  // 优惠券弹窗 提交
+  const scopePopSubmit = (data) => {
+    console.log("data =>", data);
+  };
+
   return (
     <div className="coupon-box">
       <Card style={{ margin: "10px auto" }} title={state.setup1_title}>
@@ -444,7 +524,7 @@ const UseCouponAddEdit = forwardRef((props, ref) => {
             <Button
               type="primary"
               style={{ marginLeft: "20px" }}
-              loading={state.newGoodsBtnLoading}
+              loading={state.addProductBtnLoading}
               onClick={() => {
                 addProduct("addProduct");
               }}
@@ -454,7 +534,7 @@ const UseCouponAddEdit = forwardRef((props, ref) => {
             <Button
               type="primary"
               style={{ marginLeft: "20px" }}
-              loading={state.newGoldLoading}
+              loading={state.addGoldBtnLoading}
               onClick={() => {
                 addProduct("addKnockGold");
               }}
@@ -505,6 +585,15 @@ const UseCouponAddEdit = forwardRef((props, ref) => {
           取消
         </Button>
       </div>
+
+      <UseGoodsScopePop
+        product_title={state.product_title}
+        drawerVisible={state.showScopePop}
+        type={state.scopePopType}
+        productData={state.productData}
+        onClose={() => scopePopClose()}
+        submit={(data) => scopePopSubmit(data)}
+      ></UseGoodsScopePop>
     </div>
   );
 });

src/components/UseGoodsScopePop/index.jsx

@@ -0,0 +1,85 @@
+import React, { forwardRef, useImperativeHandle, useRef } from "react";
+import { Card, Drawer, Button } from "zent";
+
+import Productform from "@/pages/plan/product/add"; /* 商品 */
+import KnockGold from "@/components/knockGold"; /* 立减金 */
+
+import _ from "lodash";
+
+const UseGoodsScopePop = forwardRef((props, ref) => {
+  const { product_title, drawerVisible, onClose, type, productData, submit } =
+    props;
+
+  // 如果需要 通过ref 控制此组件 放开注释
+  // useImperativeHandle(ref, () => ({
+  //   submit: submitPop,
+  // }));
+
+  const product_el = useRef(null);
+  const knockGold_el = useRef(null);
+
+  // 提交数据
+  const submitPop = async () => {
+    let data = null;
+    let temp = null;
+    let concatData = [];
+    // 第一步：判断是立减金还是新建商品
+    let visible = false;
+    if (type === "addProduct") {
+      visible = await product_el.current.submit();
+    } else {
+      visible = await knockGold_el.current.submit();
+    }
+    console.log("visible =>", visible);
+    if (visible) {
+      if (type === "addProduct") {
+        data = sessionStorage.getItem("productData");
+        console.log("商品data =>", JSON.parse(data));
+      }
+      submit(1);
+    }
+  };
+
+  return (
+    <Drawer
+      className="draw"
+      width={"86%"}
+      title={product_title}
+      footer={
+        <div style={{ textAlign: "center" }}>
+          <Button
+            type="primary"
+            onClick={(e) => {
+              submitPop();
+            }}
+          >
+            提交
+          </Button>
+          <Button onClick={(e) => onClose()}>取消</Button>
+        </div>
+      }
+      visible={drawerVisible}
+      onClose={(e) => onClose()}
+      maskClosable={false}
+    >
+      <div className="draw2">
+        <Card
+          className="borderNone"
+          style={{ width: "95%", margin: "10px auto" }}
+        >
+          {type === "addKnockGold" ? (
+            <KnockGold
+              className="addKnockGold"
+              data={productData}
+              ref={knockGold_el}
+            />
+          ) : (
+            <Productform data={productData} ref={product_el}></Productform>
+          )}
+        </Card>
+      </div>
+    </Drawer>
+  );
+});
+
+export default UseGoodsScopePop;

src/tools/ls.js

@@ -0,0 +1,44 @@
+"use strict";
+exports.__esModule = true;
+var Store = /** @class */ (function () {
+  function Store() {
+    this.store = window.localStorage;
+    this.prefix = "bk_";
+  }
+  Store.prototype.set = function (key, value, callback) {
+    if (callback === void 0) {
+      callback = function () {};
+    }
+    var val;
+    try {
+      val = JSON.stringify(value);
+    } catch (e) {
+      val = value;
+    }
+    this.store.setItem(this.prefix + key, val);
+    callback();
+  };
+  Store.prototype.get = function (key) {
+    if (!key) {
+      throw new Error("没有找到key。");
+    }
+    if (typeof key === "object") {
+      throw new Error("key不能是一个对象。");
+    }
+    var value = this.store.getItem(this.prefix + key);
+    var val;
+    if (value !== null) {
+      try {
+        val = JSON.parse(value);
+      } catch (e) {
+        val = value;
+      }
+    }
+    return val;
+  };
+  Store.prototype.remove = function (key) {
+    this.store.removeItem(this.prefix + key);
+  };
+  return Store;
+})();
+exports["default"] = new Store();