From 6d8f62c89b725d828982373dea15dc6359033757 Mon Sep 17 00:00:00 2001 From: zhangds Date: Wed, 7 Sep 2022 17:18:52 +0800 Subject: [PATCH] =?UTF-8?q?1)=20=E4=BF=AE=E5=A4=8D=E5=95=86=E5=93=81?= =?UTF-8?q?=E8=81=94=E5=8A=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../UseCouponAddEdit/index copy 2.jsx | 820 ++++++++++++++++++ .../UseCouponAddEdit/index copy 3.jsx | 795 +++++++++++++++++ .../UseCouponAddEdit/index copy.jsx | 204 +++-- src/components/UseCouponAddEdit/index.jsx | 43 +- .../UseGoodsScopePop/index copy 2.jsx | 143 +++ .../UseGoodsScopePop/index copy.jsx | 78 +- src/components/UseGoodsScopePop/index.jsx | 67 +- 7 files changed, 2021 insertions(+), 129 deletions(-) create mode 100644 src/components/UseCouponAddEdit/index copy 2.jsx create mode 100644 src/components/UseCouponAddEdit/index copy 3.jsx create mode 100644 src/components/UseGoodsScopePop/index copy 2.jsx diff --git a/src/components/UseCouponAddEdit/index copy 2.jsx b/src/components/UseCouponAddEdit/index copy 2.jsx new file mode 100644 index 00000000..dbb5b582 --- /dev/null +++ b/src/components/UseCouponAddEdit/index copy 2.jsx @@ -0,0 +1,820 @@ +import React, { + forwardRef, + useImperativeHandle, + useRef, + useEffect, +} from "react"; +import { useSetState } from "ahooks"; +import { FixedSizeList } from "react-window"; +import { + Card, + DateRangePicker, + Button, + Select, + Notify, + BlockLoading, +} from "zent"; +import moment from "moment"; +import _ from "lodash"; + +import Ipt from "@/components/input/main"; +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 { isAmount } from "@/tools/validate"; + +import { getProductInfoSelect, handelResponse } from "@/assets/api.js"; +import { mulNum } from "@/tools/number"; +import "./style.less"; + +const tableColumn = [ + { + title: "商品编号", + name: "product_id", + prop: "product_id", + type: "normal", + width: "auto", + }, + { + title: "商品名称", + name: "product_name", + prop: "product_name", + type: "normal", + width: "auto", + }, + { + title: "官方价", + name: "official_price", + prop: "official_price", + type: "normal", + width: "auto", + }, + { + title: "合同单价", + name: "contract_price", + prop: "contract_price", + type: "normal", + width: "auto", + }, + { + title: "库存数量", + name: "quantity", + prop: "quantity", + type: "normal", + width: "auto", + }, + { + title: "批次号", + name: "channel_activity_id", + prop: "channel_activity_id", + type: "normal", + width: "auto", + }, + { + title: "总预算", + name: "all_budget", + prop: "all_budget", + type: "normal", + width: "auto", + }, + { + title: "有效时间段", + name: "effectDate", + prop: "effectDate", + type: "normal", + width: "auto", + }, + { + title: "创建时间", + name: "createDate", + prop: "createDate", + type: "normal", + width: "auto", + }, + { + title: "类型", + name: "goods_type", + prop: "goods_type", + type: "slot", + width: "auto", + }, + { + title: "上游平台", + name: "upstream", + prop: "upstream", + type: "normal", + width: "auto", + }, + { + title: "操作", + name: "opearo", + prop: "opearo", + type: "slot", + width: "200px", + }, +]; + +const info_rules = { + plan_id: [{ type: "required", message: "请选择归属计划" }], + key_batch_id: [{ type: "required", message: "请选择归属key" }], + name: [{ type: "required", message: "请输入批次名称" }], + date_time: [{ type: "required", message: "请选择时间" }], +}; + +const rule_rules = { + full: [ + { type: "required", message: "请输入面额" }, + { + type: "regExp", + message: "请输入两位小数", + reg: "^[0-9][0-9]*([.][0-9]{1,2})?$", + }, + ], + restrict: [ + { type: "required", message: "请输入发放总量" }, + { + type: "regExp", + message: "请输入正整数", + reg: "^[1-9]*$", + }, + ], +}; + +const UseCouponAddEdit = forwardRef((props, ref) => { + const { type = 0, isAuditButton = true, isCopy = false } = props; // type 入口类型 0优惠券新增 1计划、key批次 (是否显示两个字段) + + useEffect(() => { + if (type === 0) { + delete info_rules.plan_id; + delete info_rules.key_batch_id; + } else { + info_rules.plan_id = [{ type: "required", message: "请选择归属计划" }]; + info_rules.key_batch_id = [ + { type: "required", message: "请选择归属key" }, + ]; + } + }, []); + + const [state, setState] = useSetState({ + setup1_title: "基本信息", + setup2_title: "发放规则", + setup3_title: "商品范围", + time_disabled: false, + tableData: [], + tableHeight: 500, + page: 1, + dataCount: 0, + rankoptions: [], + rank: [], + newGoodsBtnLoading: false, + newGoldLoading: false, + lodgingTable: true, + isRestrict: true, + plan_OPTIONS: [ + { + key: "1", + text: `plan 1`, + }, + { + key: "2", + text: `plan 2`, + }, + ], + key_OPTIONS: [ + { + key: 2, + text: `key 1`, + }, + ], + addProductBtnLoading: false, + addGoldBtnLoading: false, + product_title: "", + showScopePop: false, + scopePopType: "", + productData: {}, + direct_reseller_id: 23329, + tableLoading: false, + }); + + // 基础信息 + const [form_info_data, setForm_info_data] = useSetState({ + plan_id: "", + key_batch_id: "", + name: "", + date_time: "", + }); + const form_info_el = useRef(null); + + // 发放规则 + const [form_rule_data, setForm_rule_data] = useSetState({ + full: "", + reduce: "", + restrict: "", + budget: "", + }); + const form_rule_el = useRef(null); + + // 设置发放总量是否可用 + useEffect(() => { + setIsRestrict(); + }, [form_rule_data.reduce, form_rule_data.full]); + + // 计算发放总数 + useEffect(() => { + setBudget(); + }, [form_rule_data.reduce, form_rule_data.restrict]); + + const table_el = useRef(null); + + useImperativeHandle(ref, () => ({ + submit: submit, + })); + + 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("rank =>", state.rank); + }; + + const onReturn = () => {}; + const onChangeCombinedDate = (e) => { + setForm_info_data({ date_time: e }); + // 传入时间 + sessionStorage.setItem( + "knockGold_effectDate", + JSON.stringify({ + begin_time: e[0], + end_time: e[1], + }) + ); + }; + const onDisabledRange = (date, type) => { + let disabled = false; + if (type === "end") { + disabled = moment(date.getTime()).add(1, "days") <= new Date().getTime(); + } + if (type === "start") { + disabled = date.getTime() <= new Date().getTime(); + } + return disabled; + }; + const onPageChange = () => {}; + const onCountChange = () => {}; + + // 清除商品和立减金本地存储 + const clearStorageData = () => { + if (state.tableData.length <= 0) { + sessionStorage.setItem("productData", ""); + sessionStorage.setItem("knockGoldData", ""); + } + + // 新建商品 + let product_data = state.tableData.filter((item) => item.goods_type === 1); + if (product_data.length <= 0) { + sessionStorage.setItem("productData", ""); + } else { + sessionStorage.setItem("productData", JSON.stringify(product_data)); + } + + // 立减金 + let knockGold_data = state.tableData.filter( + (item) => item.goods_type === 2 + ); + if (knockGold_data.length <= 0) { + sessionStorage.setItem("knockGoldData", ""); + } else { + sessionStorage.setItem("knockGoldData", JSON.stringify(knockGold_data)); + } + }; + + const addProduct = (type) => { + try { + // 第一步：获取直连天下的商品数据需要分销商 id + const direct_reseller_ids = state.direct_reseller_id; + if (direct_reseller_ids <= 0) { + Notify.error(`请添加映射分销商`); + return; + } + // 第二步：清除本地存储数据 + clearStorageData(); + + // 第三步: 区分是新建商品还是立减金 + 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, + }; + getProductInfoSelect(param).then((res) => { + setState({ addProductBtnLoading: false, addGoldBtnLoading: false }); + handelResponse( + res, + (req, msg) => { + // !!!!!!!!!!!!!! 为了兼容老版本 新增商品设为空！！！老版本使用 productsList 获取商品数据！！！！！！！！！！ + sessionStorage.setItem("productsList", JSON.stringify(req.data)); + // !!!!!!!!!!!!!! 为了兼容老版本 新增商品设为空！！！老版本使用 productsList 获取商品数据！！！！！！！！！！ + setState({ productData: null }); + setState({ + showScopePop: true, + }); + }, + (err) => { + console.log("err =>", err); + } + ); + }); + } catch (err) { + setState({ addProductBtnLoading: false, addGoldBtnLoading: false }); + } + }; + + // 编辑 + const productEditShow = (rowData) => { + try { + // 第一步：获取直连天下的商品数据需要分销商 id + const direct_reseller_ids = state.direct_reseller_id; + if (direct_reseller_ids <= 0) { + Notify.error(`请添加映射分销商`); + return; + } + setState({ + tableLoading: true, + }); + // 第二步：获取商品数据 + let param = { + reseller_id: direct_reseller_ids, + }; + getProductInfoSelect(param).then((res) => { + setState({ tableLoading: false }); + handelResponse( + res, + (req, msg) => { + // 设置所有的商品数据 + sessionStorage.setItem("productsList", JSON.stringify(req.data)); + /* 区分立减金 */ + if (rowData.goods_type === 2) { + let obj = rowData.only; + setState({ + product_title: "编辑立减金", + productData: obj, + addIsType: "addKnockGold", + showScopePop: true, + }); + } else { + setState({ + product_title: "编辑商品", + productData: rowData, + addIsType: "addProduct", + showScopePop: true, + }); + } + }, + (err) => { + console.log("err =>", err); + } + ); + }); + } catch (err) { + setState({ tableLoading: false }); + console.log("err =>", err); + } + }; + + const renderOptionList = (options, renderOption) => { + return ( + + {({ index, style }) => ( +
{renderOption(options[index], index)}
+ )} + + ); + }; + + // 判断是否可用 + const setIsRestrict = () => { + if (isAmount(form_rule_data.reduce) && isAmount(form_rule_data.full)) { + setState({ isRestrict: false }); + } else { + setState({ isRestrict: true }); + } + }; + + // 计算总预算 + const setBudget = () => { + if (isAmount(form_rule_data.reduce) && isAmount(form_rule_data.restrict)) { + let num = mulNum( + Number(form_rule_data.reduce), + Number(form_rule_data.restrict) + ); + setForm_rule_data({ + budget: num, + }); + } else { + setForm_rule_data({ + budget: "", + }); + } + }; + + // 优惠券弹窗 取消 + const scopePopClose = () => { + setState({ + showScopePop: false, + }); + }; + + const selectionFun = (e) => { + let arr = []; + _.map(e, (res) => { + let obj = {}; + obj.key = res; + obj.text = res.product_name; + arr.push(obj); + return obj; + }); + setState({ rank: arr }); + }; + + const onRankChange = (e) => { + let new_table_data = state.tableData.map((item) => { + item.checked = + e.findIndex((checks) => { + return checks.key === item; + }) > -1; + return item; + }); + setState({ tableData: new_table_data, rank: e }); + }; + + // 优惠券弹窗 提交 + const scopePopSubmit = (data) => { + try { + // 格式化表格数据 + let data_new = data; + let new_table = state.tableData; + + // 判断是否是编辑 商品 + if (data_new.goods_type === 1) { + let el_index = new_table.findIndex( + (item) => item.product_id === data_new.product_id + ); + if (el_index !== -1) { + new_table[el_index] = data_new; + } else { + new_table.push(data_new); + } + } + + // 立减金 + if (data_new.goods_type === 2) { + let el_index = new_table.findIndex( + (item) => + item.channel_activity_id === data_new.only.channel_activity_id + ); + if (el_index !== -1) { + new_table[el_index] = data_new; + } else { + new_table.push(data_new); + } + } + + console.log("所有数据 =>", new_table); + + // 设置商品范围选择 + let select_opt = []; + new_table.map((item) => { + let obj = {}; + obj.key = item; // 确保差异 + obj.text = item.product_name; + select_opt.push(obj); + }); + + // 格式化商品范围 + setState({ + tableData: new_table, + rankoptions: select_opt, + }); + } catch (err) { + console.log("err =>", err); + } + }; + + // 商品范围删除 + const deleteGoodsScope = (index) => { + let new_table = state.tableData; + if (index === 0) { + new_table = []; + } else { + new_table = new_table.splice(index, 1); + } + let select_opt = []; + new_table.map((item) => { + let obj = {}; + obj.key = item; // 确保差异 + obj.text = item.product_name; + select_opt.push(obj); + }); + selectionFun(new_table); + setState({ + tableData: new_table, + rankoptions: select_opt, + }); + }; + + return ( +
+ +
+ {type === 1 ? ( + + { + setForm_info_data({ key_batch_id: e }); + }} + /> + + ) : null} + + + { + setForm_info_data({ name: e }); + }} + onClearItem={() => { + setForm_info_data({ name: "" }); + }} + value={form_info_data.name} + placeholder={"请输入"} + labelWidth={"0px"} + maxLength={20} + height={"36px"} + countShow={true} + width={"520px"} + alignment={"left"} + /> + + + + { + onChangeCombinedDate(e); + }} + disabledDate={onDisabledRange} + /> + +
+ + + +
+ +
+ { + setForm_rule_data({ full: e }); + }} + onClearItem={() => { + setForm_rule_data({ full: "" }); + }} + value={form_rule_data.full} + placeholder={"请输入"} + labelWidth={"0px"} + maxLength={20} + height={"36px"} + countShow={false} + width={"130px"} + alignment={"left"} + front="满" + /> + { + setForm_rule_data({ reduce: e }); + }} + onClearItem={() => { + setForm_rule_data({ reduce: "" }); + }} + value={form_rule_data.reduce} + placeholder={"请输入"} + labelWidth={"0px"} + maxLength={20} + height={"36px"} + countShow={false} + width={"130px"} + alignment={"left"} + front="减" + unit="元" + /> +
+ + + + { + setForm_rule_data({ + restrict: e, + }); + }} + onClearItem={() => { + setForm_rule_data({ restrict: "" }); + }} + disabled={state.isRestrict} + value={form_rule_data.restrict} + placeholder={"请输入"} + labelWidth={"0px"} + maxLength={20} + height={"36px"} + countShow={false} + width={"520px"} + alignment={"left"} + unit="个" + /> + + + + +
+ + + + +
+ { + setForm_info_data({ plan_id: e }); + }} + /> + + ) : null} + + {type === 1 ? ( + + { + onRankChange(e); + }} + /> + + +
+ + + + onPageChange(e)} + emptyText={ + state.lodgingTable + ? "抱歉，暂无相关数据记录" + : "查询 请输入【分销商】或【计划名称】或【key】进行查询" + } + countChange={(e) => onCountChange(e)} + checkChange={(data) => selectionFun(data)} + ComponentHandler={(com, rowData, rowIndex) => { + if (com === "opearo") { + return ( +
+ productEditShow(rowData)} + > + 编辑 + + deleteGoodsScope(rowIndex)} + > + 删除 + +
+ ); + } + + if (com === "goods_type") { + return ( + {rowData.goods_type === 1 ? "商品" : "立减金"} + ); + } + }} + /> + + + + {isAuditButton ? ( +
+ + +
+ ) : null} + + scopePopClose()} + tableData={state.tableData} + submit={(data) => scopePopSubmit(data)} + > +
+ ); +}); + +export default UseCouponAddEdit; diff --git a/src/components/UseCouponAddEdit/index copy.jsx b/src/components/UseCouponAddEdit/index copy.jsx index e6b64ca2..dbb5b582 100644 --- a/src/components/UseCouponAddEdit/index copy.jsx +++ b/src/components/UseCouponAddEdit/index copy.jsx @@ -6,21 +6,27 @@ import React, { } from "react"; import { useSetState } from "ahooks"; import { FixedSizeList } from "react-window"; -import { Card, DateRangePicker, Button, Select, Notify } from "zent"; +import { + Card, + DateRangePicker, + Button, + Select, + Notify, + BlockLoading, +} from "zent"; import moment from "moment"; +import _ from "lodash"; import Ipt from "@/components/input/main"; 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 { isAmount } from "@/tools/validate"; import { getProductInfoSelect, handelResponse } from "@/assets/api.js"; import { mulNum } from "@/tools/number"; import "./style.less"; -import _ from "lodash"; const tableColumn = [ { @@ -60,8 +66,8 @@ const tableColumn = [ }, { title: "批次号", - name: "key_batch_id", - prop: "key_batch_id", + name: "channel_activity_id", + prop: "channel_activity_id", type: "normal", width: "auto", }, @@ -136,7 +142,7 @@ const rule_rules = { }; const UseCouponAddEdit = forwardRef((props, ref) => { - const { type = 0, isAuditButton = true } = props; // type 入口类型 0优惠券新增 1计划、key批次 (是否显示两个字段) + const { type = 0, isAuditButton = true, isCopy = false } = props; // type 入口类型 0优惠券新增 1计划、key批次 (是否显示两个字段) useEffect(() => { if (type === 0) { @@ -186,7 +192,9 @@ const UseCouponAddEdit = forwardRef((props, ref) => { product_title: "", showScopePop: false, scopePopType: "", - productData: [], + productData: {}, + direct_reseller_id: 23329, + tableLoading: false, }); // 基础信息 @@ -232,7 +240,8 @@ const UseCouponAddEdit = forwardRef((props, ref) => { // 发放规则 let el_setup2 = form_rule_el.current.validator(); // console.log("el_setup2 =>", el_setup2); - // console.log("发放规则 =>", form_rule_data); + + console.log("rank =>", state.rank); }; const onReturn = () => {}; @@ -289,7 +298,7 @@ const UseCouponAddEdit = forwardRef((props, ref) => { const addProduct = (type) => { try { // 第一步：获取直连天下的商品数据需要分销商 id - const direct_reseller_ids = 23329; + const direct_reseller_ids = state.direct_reseller_id; if (direct_reseller_ids <= 0) { Notify.error(`请添加映射分销商`); return; @@ -323,6 +332,8 @@ const UseCouponAddEdit = forwardRef((props, ref) => { (req, msg) => { // !!!!!!!!!!!!!! 为了兼容老版本 新增商品设为空！！！老版本使用 productsList 获取商品数据！！！！！！！！！！ sessionStorage.setItem("productsList", JSON.stringify(req.data)); + // !!!!!!!!!!!!!! 为了兼容老版本 新增商品设为空！！！老版本使用 productsList 获取商品数据！！！！！！！！！！ + setState({ productData: null }); setState({ showScopePop: true, }); @@ -332,12 +343,63 @@ const UseCouponAddEdit = forwardRef((props, ref) => { } ); }); - // !!!!!!!!!!!!!! 为了兼容老版本 新增商品设为空！！！老版本使用 productsList 获取商品数据！！！！！！！！！！ - setState({ productData: null }); } catch (err) { setState({ addProductBtnLoading: false, addGoldBtnLoading: false }); } }; + + // 编辑 + const productEditShow = (rowData) => { + try { + // 第一步：获取直连天下的商品数据需要分销商 id + const direct_reseller_ids = state.direct_reseller_id; + if (direct_reseller_ids <= 0) { + Notify.error(`请添加映射分销商`); + return; + } + setState({ + tableLoading: true, + }); + // 第二步：获取商品数据 + let param = { + reseller_id: direct_reseller_ids, + }; + getProductInfoSelect(param).then((res) => { + setState({ tableLoading: false }); + handelResponse( + res, + (req, msg) => { + // 设置所有的商品数据 + sessionStorage.setItem("productsList", JSON.stringify(req.data)); + /* 区分立减金 */ + if (rowData.goods_type === 2) { + let obj = rowData.only; + setState({ + product_title: "编辑立减金", + productData: obj, + addIsType: "addKnockGold", + showScopePop: true, + }); + } else { + setState({ + product_title: "编辑商品", + productData: rowData, + addIsType: "addProduct", + showScopePop: true, + }); + } + }, + (err) => { + console.log("err =>", err); + } + ); + }); + } catch (err) { + setState({ tableLoading: false }); + console.log("err =>", err); + } + }; + const renderOptionList = (options, renderOption) => { return ( { // 格式化表格数据 let data_new = data; let new_table = state.tableData; - new_table.push(data_new); + + // 判断是否是编辑 商品 + if (data_new.goods_type === 1) { + let el_index = new_table.findIndex( + (item) => item.product_id === data_new.product_id + ); + if (el_index !== -1) { + new_table[el_index] = data_new; + } else { + new_table.push(data_new); + } + } + + // 立减金 + if (data_new.goods_type === 2) { + let el_index = new_table.findIndex( + (item) => + item.channel_activity_id === data_new.only.channel_activity_id + ); + if (el_index !== -1) { + new_table[el_index] = data_new; + } else { + new_table.push(data_new); + } + } + + console.log("所有数据 =>", new_table); + // 设置商品范围选择 let select_opt = []; new_table.map((item) => { @@ -649,47 +738,60 @@ const UseCouponAddEdit = forwardRef((props, ref) => { - onPageChange(e)} - emptyText={ - state.lodgingTable - ? "抱歉，暂无相关数据记录" - : "查询 请输入【分销商】或【计划名称】或【key】进行查询" - } - countChange={(e) => onCountChange(e)} - checkChange={(data) => selectionFun(data)} - ComponentHandler={(com, rowData, rowIndex) => { - if (com === "opearo") { - return ( -
- 编辑 - deleteGoodsScope(rowIndex)} - > - 删除 - -
- ); + + onPageChange(e)} + emptyText={ + state.lodgingTable + ? "抱歉，暂无相关数据记录" + : "查询 请输入【分销商】或【计划名称】或【key】进行查询" } + countChange={(e) => onCountChange(e)} + checkChange={(data) => selectionFun(data)} + ComponentHandler={(com, rowData, rowIndex) => { + if (com === "opearo") { + return ( +
+ productEditShow(rowData)} + > + 编辑 + + deleteGoodsScope(rowIndex)} + > + 删除 + +
+ ); + } - if (com === "goods_type") { - return ( - {rowData.goods_type === 1 ? "商品" : "立减金"} - ); - } - }} - /> + if (com === "goods_type") { + return ( + {rowData.goods_type === 1 ? "商品" : "立减金"} + ); + } + }} + /> + {isAuditButton ? ( diff --git a/src/components/UseCouponAddEdit/index.jsx b/src/components/UseCouponAddEdit/index.jsx index dbb5b582..1560fe63 100644 --- a/src/components/UseCouponAddEdit/index.jsx +++ b/src/components/UseCouponAddEdit/index.jsx @@ -452,7 +452,7 @@ const UseCouponAddEdit = forwardRef((props, ref) => { let arr = []; _.map(e, (res) => { let obj = {}; - obj.key = res; + obj.key = res.product_id; obj.text = res.product_name; arr.push(obj); return obj; @@ -462,9 +462,10 @@ const UseCouponAddEdit = forwardRef((props, ref) => { const onRankChange = (e) => { let new_table_data = state.tableData.map((item) => { + console.log("item =>", item); item.checked = e.findIndex((checks) => { - return checks.key === item; + return checks.key == item.product_id; }) > -1; return item; }); @@ -472,47 +473,20 @@ const UseCouponAddEdit = forwardRef((props, ref) => { }; // 优惠券弹窗 提交 - const scopePopSubmit = (data) => { + const scopePopSubmit = (table_all) => { try { // 格式化表格数据 - let data_new = data; - let new_table = state.tableData; - - // 判断是否是编辑 商品 - if (data_new.goods_type === 1) { - let el_index = new_table.findIndex( - (item) => item.product_id === data_new.product_id - ); - if (el_index !== -1) { - new_table[el_index] = data_new; - } else { - new_table.push(data_new); - } - } - - // 立减金 - if (data_new.goods_type === 2) { - let el_index = new_table.findIndex( - (item) => - item.channel_activity_id === data_new.only.channel_activity_id - ); - if (el_index !== -1) { - new_table[el_index] = data_new; - } else { - new_table.push(data_new); - } - } - + let new_table = table_all; console.log("所有数据 =>", new_table); - // 设置商品范围选择 let select_opt = []; new_table.map((item) => { let obj = {}; - obj.key = item; // 确保差异 + obj.key = item.product_id; // 确保差异 obj.text = item.product_name; select_opt.push(obj); }); + console.log("select_opt =>", select_opt); // 格式化商品范围 setState({ @@ -535,7 +509,7 @@ const UseCouponAddEdit = forwardRef((props, ref) => { let select_opt = []; new_table.map((item) => { let obj = {}; - obj.key = item; // 确保差异 + obj.key = item.product_id; obj.text = item.product_name; select_opt.push(obj); }); @@ -811,6 +785,7 @@ const UseCouponAddEdit = forwardRef((props, ref) => { type={state.scopePopType} productData={state.productData} onClose={() => scopePopClose()} + tableData={state.tableData} submit={(data) => scopePopSubmit(data)} > diff --git a/src/components/UseGoodsScopePop/index copy 2.jsx b/src/components/UseGoodsScopePop/index copy 2.jsx new file mode 100644 index 00000000..6f3fe8a0 --- /dev/null +++ b/src/components/UseGoodsScopePop/index copy 2.jsx @@ -0,0 +1,143 @@ +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"; /* 立减金 */ + +const UseGoodsScopePop = forwardRef((props, ref) => { + const { + product_title, + drawerVisible, + onClose, + type, + productData, + submit, + tableData, + } = props; + + // 如果需要 通过ref 控制此组件 放开注释 + // useImperativeHandle(ref, () => ({ + // submit: submitPop, + // })); + + const product_el = useRef(null); + const knockGold_el = useRef(null); + + // 新建商品数据处理 + const format_product_model = () => { + // 是编辑还是新增 + + // 新增 + let form_model = product_el.current.state.model; + form_model.goods_type = 1; + form_model.upstream = "直连天下"; + form_model.all_budget = + Number(form_model.contract_price) * Number(form_model.quantity); + form_model.effectDate = "-"; + + let new_tableData = tableData; + new_tableData.push(form_model); + + return new_tableData; + }; + + // 立减金数据处理 + const format_knockGold_model = () => { + let channel_activity_id = + knockGold_el.current.state.model.channel_activity_id; + let form_data_arr = JSON.parse(sessionStorage.getItem("knockGoldData")); + let table_obj = {}; + let form_model = form_data_arr.find( + (item) => item.channel_activity_id === channel_activity_id + ); + if (form_model) { + table_obj.only = form_model; // 存储就数据 编辑好用 + table_obj.product_id = channel_activity_id; // 商品编号 + table_obj.product_name = form_model.batch_goods_name; // 商品名 + table_obj.official_price = form_model.reduce_amount; // 官方价 + table_obj.contract_price = form_model.price; // 合同价格 + table_obj.quantity = Math.trunc( + form_model.all_budget / form_model.reduce_amount + ); // 库存数量 + table_obj.channel_activity_id = form_model.channel_activity_id; // 批次号 + table_obj.all_budget = Number(form_model.all_budget); // 总预算 + table_obj.effectDate = `${form_model.time_limit.effect_time.end_time} 至 ${form_model.time_limit.effect_time.start_time}`; // 有效时间段 + table_obj.createDate = ""; // 创建时间 + table_obj.goods_type = 2; // 类型 + table_obj.upstream = + String(form_model.channel) === "1" ? "支付宝" : "微信"; // 上游平台 + // 格式化字段 适配table显示 + return table_obj; + } + }; + + // 提交数据 + const submitPop = async () => { + try { + // 第一步：判断是立减金还是新建商品 + let visible = false; + if (type === "addProduct") { + visible = await product_el.current.submit(); + } else { + visible = await knockGold_el.current.submit(); + } + if (visible) { + // 第二步：获取商品或者立减金的数据 并格式化为table一样的字段 以商品数据为准 合并 + let form_data = {}; + if (type === "addProduct") { + form_data = format_product_model(); + } else { + form_data = format_knockGold_model(); + } + console.log("form_data 1=>", form_data); + submit(form_data); + onClose(); + } + } catch (err) { + console.log("err =>", err); + } + }; + + return ( + + + + + } + visible={drawerVisible} + onClose={(e) => onClose()} + maskClosable={false} + > +
+ + {type === "addKnockGold" ? ( + + ) : ( + + )} + +
+ + ); +}); + +export default UseGoodsScopePop; diff --git a/src/components/UseGoodsScopePop/index copy.jsx b/src/components/UseGoodsScopePop/index copy.jsx index 107552b1..1e623767 100644 --- a/src/components/UseGoodsScopePop/index copy.jsx +++ b/src/components/UseGoodsScopePop/index copy.jsx @@ -1,17 +1,15 @@ import React, { forwardRef, useImperativeHandle, useRef } from "react"; import { Card, Drawer, Button } from "zent"; -import { deWeightThree } from "@/utils"; - 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; + console.log("productData =>", productData); + // 如果需要 通过ref 控制此组件 放开注释 // useImperativeHandle(ref, () => ({ // submit: submitPop, @@ -20,27 +18,67 @@ const UseGoodsScopePop = forwardRef((props, ref) => { const product_el = useRef(null); const knockGold_el = useRef(null); + // 新建商品数据处理 + const format_product_model = () => { + let form_model = product_el.current.state.model; + form_model.goods_type = 1; + form_model.upstream = "直连天下"; + form_model.all_budget = + Number(form_model.contract_price) * Number(form_model.quantity); + form_model.effectDate = "-"; + return form_model; + }; + + // 立减金数据处理 + const format_knockGold_model = () => { + let channel_activity_id = + knockGold_el.current.state.model.channel_activity_id; + let form_data_arr = JSON.parse(sessionStorage.getItem("knockGoldData")); + let table_obj = {}; + let form_model = form_data_arr.find( + (item) => item.channel_activity_id === channel_activity_id + ); + if (form_model) { + table_obj.only = form_model; // 存储就数据 编辑好用 + table_obj.product_id = "-"; // 商品编号 + table_obj.product_name = form_model.batch_goods_name; // 商品名 + table_obj.official_price = form_model.reduce_amount; // 官方价 + table_obj.contract_price = form_model.price; // 合同价格 + table_obj.quantity = Math.trunc( + form_model.all_budget / form_model.reduce_amount + ); // 库存数量 + table_obj.channel_activity_id = form_model.channel_activity_id; // 批次号 + table_obj.all_budget = Number(form_model.all_budget); // 总预算 + table_obj.effectDate = `${form_model.time_limit.effect_time.end_time} 至 ${form_model.time_limit.effect_time.start_time}`; // 有效时间段 + table_obj.createDate = ""; // 创建时间 + table_obj.goods_type = 2; // 类型 + table_obj.upstream = + String(form_model.channel) === "1" ? "支付宝" : "微信"; // 上游平台 + // 格式化字段 适配table显示 + return table_obj; + } + }; + // 提交数据 const submitPop = async () => { - let scope_table_data = []; - // 第一步：判断是立减金还是新建商品 - let visible = false; - if (type === "addProduct") { - visible = await product_el.current.submit(); - } else { - visible = await knockGold_el.current.submit(); - } try { + // 第一步：判断是立减金还是新建商品 + let visible = false; + if (type === "addProduct") { + visible = await product_el.current.submit(); + } else { + visible = await knockGold_el.current.submit(); + } if (visible) { - let a1 = product_el.current.state.model; - console.log("a1 =>", a1); - // 第二步：数据格式化 - scope_table_data = sessionStorage.getItem("productData"); - if (scope_table_data) { - scope_table_data = JSON.parse(scope_table_data); + // 第二步：获取商品或者立减金的数据 并格式化为table一样的字段 以商品数据为准 + let form_data = {}; + if (type === "addProduct") { + form_data = format_product_model(); + } else { + form_data = format_knockGold_model(); } - console.log("所有数据:", scope_table_data); - submit(scope_table_data); + console.log("form_data 1=>", form_data); + submit(form_data); onClose(); } } catch (err) { diff --git a/src/components/UseGoodsScopePop/index.jsx b/src/components/UseGoodsScopePop/index.jsx index 628e4961..6f3fe8a0 100644 --- a/src/components/UseGoodsScopePop/index.jsx +++ b/src/components/UseGoodsScopePop/index.jsx @@ -5,10 +5,15 @@ import Productform from "@/pages/plan/product/add"; /* 商品 */ import KnockGold from "@/components/knockGold"; /* 立减金 */ const UseGoodsScopePop = forwardRef((props, ref) => { - const { product_title, drawerVisible, onClose, type, productData, submit } = - props; - - console.log("productData =>", productData); + const { + product_title, + drawerVisible, + onClose, + type, + productData, + submit, + tableData, + } = props; // 如果需要 通过ref 控制此组件 放开注释 // useImperativeHandle(ref, () => ({ @@ -20,36 +25,50 @@ const UseGoodsScopePop = forwardRef((props, ref) => { // 新建商品数据处理 const format_product_model = () => { + // 是编辑还是新增 + + // 新增 let form_model = product_el.current.state.model; form_model.goods_type = 1; form_model.upstream = "直连天下"; form_model.all_budget = Number(form_model.contract_price) * Number(form_model.quantity); form_model.effectDate = "-"; - return form_model; + + let new_tableData = tableData; + new_tableData.push(form_model); + + return new_tableData; }; // 立减金数据处理 const format_knockGold_model = () => { - let form_model = knockGold_el.current.state.model; + let channel_activity_id = + knockGold_el.current.state.model.channel_activity_id; + let form_data_arr = JSON.parse(sessionStorage.getItem("knockGoldData")); let table_obj = {}; - table_obj.only = form_model; // 存储就数据 编辑好用 - - table_obj.product_id = "-"; // 商品编号 - table_obj.product_name = form_model.batch_goods_name; // 商品名 - table_obj.official_price = form_model.reduce_amount; // 官方价 - table_obj.contract_price = form_model.price; // 合同价格 - table_obj.quantity = Math.trunc( - form_model.all_budget / form_model.reduce_amount - ); // 库存数量 - table_obj.channel_activity_id = form_model.channel_activity_id; // 批次号 - table_obj.all_budget = Number(form_model.all_budget); // 总预算 - table_obj.effectDate = form_model.entry_time; // 有效时间段 - table_obj.createDate = ""; // 创建时间 - table_obj.goods_type = 2; // 类型 - table_obj.upstream = String(form_model.channel) === "1" ? "支付宝" : "微信"; // 上游平台 - // 格式化字段 适配table显示 - return table_obj; + let form_model = form_data_arr.find( + (item) => item.channel_activity_id === channel_activity_id + ); + if (form_model) { + table_obj.only = form_model; // 存储就数据 编辑好用 + table_obj.product_id = channel_activity_id; // 商品编号 + table_obj.product_name = form_model.batch_goods_name; // 商品名 + table_obj.official_price = form_model.reduce_amount; // 官方价 + table_obj.contract_price = form_model.price; // 合同价格 + table_obj.quantity = Math.trunc( + form_model.all_budget / form_model.reduce_amount + ); // 库存数量 + table_obj.channel_activity_id = form_model.channel_activity_id; // 批次号 + table_obj.all_budget = Number(form_model.all_budget); // 总预算 + table_obj.effectDate = `${form_model.time_limit.effect_time.end_time} 至 ${form_model.time_limit.effect_time.start_time}`; // 有效时间段 + table_obj.createDate = ""; // 创建时间 + table_obj.goods_type = 2; // 类型 + table_obj.upstream = + String(form_model.channel) === "1" ? "支付宝" : "微信"; // 上游平台 + // 格式化字段 适配table显示 + return table_obj; + } }; // 提交数据 @@ -63,7 +82,7 @@ const UseGoodsScopePop = forwardRef((props, ref) => { visible = await knockGold_el.current.submit(); } if (visible) { - // 第二步：获取商品或者立减金的数据 并格式化为table一样的字段 以商品数据为准 + // 第二步：获取商品或者立减金的数据 并格式化为table一样的字段 以商品数据为准 合并 let form_data = {}; if (type === "addProduct") { form_data = format_product_model();