✨ feat: 优化代码以及订单列表调整查询字段

2024-01-29 16:28:02 +08:00 · 2024-01-29 16:28:02 +08:00 · 9f11e4e202
parent 5a53adbcad
commit 9f11e4e202
13 changed files with 802 additions and 699 deletions
--- a/src/assets/api.js
+++ b/src/assets/api.js
@ -999,4 +999,9 @@ export const receiveRetry = (data) => {
  return req("post", baseurl + "/voucher/receiveRetry", data)
 }

+/* 获取计划下的商品 */
+export const goodsListByPlanId = (id) => {
+  return req("get", baseurl + "/goods/goodsListByPlanId/" + id)
+}
+
 export { req }
--- a/src/pages/order/list/list.js
+++ b/src/pages/order/list/list.js
@ -7,7 +7,10 @@ import {
  putOrderSuccess,
  receiveRetry,
  refund,
-  resendCardCode
+  resendCardCode,
+  getPlanChoseOption,
+  getReSellerOption,
+  goodsListByPlanId
 } from "@/assets/api.js"
 import "@/assets/comm.css"
 import { nowDay, nowMonth } from "@/assets/comm.js"
@ -47,6 +50,9 @@ export default class orderList extends React.Component {
      status: null,
      pay_status: null,
      voucher_status: null,
+      planOptions: [],
+      resellerOptions: [],
+      productOptions: [],
      page: 1,
      limit: 10,
      key_word: "",
@ -58,11 +64,26 @@ export default class orderList extends React.Component {
      visible: false /* 手动退款提示款 */,
      model: {
        account: ""
-      }
+      },
+      search: this.initSearch()
    }
    this.onChangeCombinedDate = this.onChangeCombinedDate.bind(this)
  }

+  initSearch() {
+    return {
+      plan_id: "",
+      reseller_id: "",
+      product_id: ""
+    }
+  }
+
+  searchChange(key, va) {
+    const search = this.state.search
+    search[key] = va
+    this.setState({ search })
+  }
+
  //选中表格的选框
  selection(selection) {
    this.setState({ selectiondata: selection })
@ -79,6 +100,50 @@ export default class orderList extends React.Component {
    this.setState({ officialprice, contractprice, costprice, totalprice })
  }

+  /* 获取营销计划/分销商 */
+  getPlan() {
+    getPlanChoseOption().then((res) =>
+      handelResponse(
+        res,
+        (req, msg) => {
+          const planOptions = req.map((item) => ({
+            key: item.id,
+            text: item.title
+          }))
+          this.setState({ planOptions })
+        },
+        (err) => {}
+      )
+    )
+
+    getReSellerOption().then((res) => {
+      handelResponse(res, (req, msg) => {
+        const resellerOptions = req.map((item) => ({
+          key: item.id,
+          text: item.name
+        }))
+        this.setState({ resellerOptions })
+      })
+    })
+  }
+
+  /* 获取营销计划下的商品 */
+  getProducts(id) {
+    goodsListByPlanId(id).then((res) =>
+      handelResponse(
+        res,
+        (req, msg) => {
+          const productOptions = req.map((item) => ({
+            key: item.goods_id,
+            text: item.goods_name
+          }))
+          this.setState({ productOptions })
+        },
+        (err) => {}
+      )
+    )
+  }
+
  /* 手动退款 */
  handlerRefundFunction() {
    if (this.refs.form.validator()) {
@ -299,13 +364,6 @@ export default class orderList extends React.Component {
    })
  }

-  //敲回车查询
-  sureFn() {
-    this.setState({ page: 1 }, () => {
-      this.getOrderFn()
-    })
-  }
-
  //!提取动态删除核销状态条件
  dynamicVoucher() {
    if (this.state.menuList.length === 3) {
@ -336,9 +394,16 @@ export default class orderList extends React.Component {
  //!获取订单列表
  getOrderFn(time = {}) {
    let _self = this
-    let { page, limit, status, option, key_word, orderType, pay_status, voucher_status } =
+    let { page, limit, status, option, key_word, orderType, pay_status, voucher_status, search } =
      _self.state
-    let data = { page, limit }
+    const { plan_id, product_id, reseller_id } = search
+    let data = {
+      page,
+      limit,
+      plan_id: plan_id ? plan_id.key : "",
+      product_id: product_id ? product_id.key : "",
+      reseller_id: reseller_id ? reseller_id.key : ""
+    }
    if (orderType) {
      //区分立减金和商品
      data.type = orderType
@ -387,6 +452,7 @@ export default class orderList extends React.Component {
  componentWillMount() {
    let datetime = [tomonth + " " + "00:00:00", day + " " + "23:59:59"]
    this.getOrderFn(datetime)
+    this.getPlan()
    this.setState({ tableHeight: window.innerHeight - 430, combinedValue: datetime })
  }

@ -529,6 +595,14 @@ export default class orderList extends React.Component {
    }
  }

+  /* 重置 */
+  reset() {
+    this.setState(
+      { search: this.initSearch(), page: 1, limit: 10, key_word: "", placeholder: "", option: "" },
+      () => this.getOrderFn()
+    )
+  }
+
  //过滤表格枚举状态
  render() {
    const date = (
@ -547,42 +621,102 @@ export default class orderList extends React.Component {
    return (
      <div id="dislist" className="orderList">
        <TabPage tabs={this.state.tabList} slot={date}>
-          <div className="distable dflexj">
-            <p>
-              <Button type="default" icon="download" onClick={this.exportFn.bind(this)}>
-                导出订单
-              </Button>
-            </p>
-            <div className="dfleac query-order">
-              <Select
-                width="180px"
-                value={this.state.option}
-                onChange={(e) =>
-                  this.setState({ option: e, key_word: "", placeholder: e && e.placeholder })
-                }
-                disableSearch
-                options={options}
-                clearable
-                placeholder="请选择查询分类"
-              />
-              {this.state.option ? (
-                <Ipt
-                  labelWidth={0}
-                  onClearItem={(e) => {
-                    this.setState({ key_word: "" })
+          <div className="order-query">
+            <Form>
+              <FormItem labelname="计划名称：" required="" labelwidth="95px">
+                <Select
+                  name="state"
+                  value={this.state.search.plan_id}
+                  options={this.state.planOptions}
+                  placeholder="请选择"
+                  width={204}
+                  clearable
+                  onChange={(va) => {
+                    this.searchChange("plan_id", va)
+                    if (va) {
+                      this.getProducts(va.key)
+                    } else {
+                      this.setState({ productOptions: [] })
+                      this.searchChange("product_id", "")
+                    }
                  }}
-                  wordSearch={this.sureFn.bind(this)}
-                  onChange={(e) => this.setState({ key_word: e })}
-                  value={this.state.key_word}
-                  icon="search"
-                  placeholder={this.state.placeholder}
-                  countShow={false}
-                  height={"36px"}
-                  width={"260px"}
-                  alignment={"left"}
                />
+              </FormItem>
+              <FormItem labelname="分销商名称：" required="" labelwidth="120px">
+                <Select
+                  name="state"
+                  value={this.state.search.reseller_id}
+                  options={this.state.resellerOptions}
+                  placeholder="请选择"
+                  width={204}
+                  clearable
+                  onChange={(va) => {
+                    this.searchChange("reseller_id", va)
+                  }}
+                />
+              </FormItem>
+              <FormItem labelname="商品名称：" required="" labelwidth="100px">
+                <Select
+                  name="state"
+                  value={this.state.search.product_id}
+                  options={this.state.productOptions}
+                  placeholder="请先选择计划"
+                  width={204}
+                  clearable
+                  onChange={(va) => {
+                    this.searchChange("product_id", va)
+                  }}
+                />
+              </FormItem>
+              <FormItem labelname="多功能查询：" required="" labelwidth="120px">
+                <Select
+                  width="204px"
+                  value={this.state.option}
+                  style={{ marginBottom: "5px" }}
+                  onChange={(e) =>
+                    this.setState({ option: e, key_word: "", placeholder: e && e.placeholder })
+                  }
+                  disableSearch
+                  options={options}
+                  clearable
+                  placeholder="请选择查询分类"
+                />
+              </FormItem>
+              {this.state.option ? (
+                <FormItem labelname="" required="" labelwidth="0">
+                  <Ipt
+                    className="query-ip"
+                    labelWidth={0}
+                    onClearItem={(e) => {
+                      this.setState({ key_word: "" })
+                    }}
+                    onChange={(e) => this.setState({ key_word: e })}
+                    value={this.state.key_word}
+                    placeholder={this.state.placeholder}
+                    countShow={false}
+                    height={32}
+                    width={204}
+                  />
+                </FormItem>
              ) : null}
-            </div>
+
+              <FormItem labelname="" required="" labelwidth="0">
+                <div style={{ width: "200px" }}>
+                  <Button type="primary" onClick={() => this.getOrderFn()}>
+                    查询
+                  </Button>
+                  <Button onClick={() => this.reset()}>重置</Button>
+                </div>
+              </FormItem>
+            </Form>
+            <Button
+              className="exportOrder"
+              type="default"
+              icon="download"
+              onClick={this.exportFn.bind(this)}
+            >
+              导出订单
+            </Button>
          </div>
          <Filterbar
            onClose={(e) => {
--- a/src/pages/order/list/list.less
+++ b/src/pages/order/list/list.less
@ -32,6 +32,50 @@
  border-right: 0;
 }

+.order-query {
+  padding: 24px;
+
+
+  .form {
+    display: flex;
+    flex-wrap: wrap;
+
+    .form-Item {
+      width: auto;
+    }
+
+    .form-label {
+      height: 80% !important;
+    }
+
+    .form-compontent {
+      padding-top: 0px !important;
+      height: 65% !important;
+
+
+
+      .keep-ipt {
+        height: 32px !important;
+      }
+    }
+
+    .form-Item:nth-child(5) {
+      .iptfillself {
+        display: block;
+        margin-right: 25px;
+      }
+    }
+  }
+
+  .button_box {
+    padding-top: 10px
+  }
+
+  .exportOrder {
+    margin-top: 20px;
+  }
+}
+


 .refundForm {
--- a/src/pages/order/list/utils.js
+++ b/src/pages/order/list/utils.js
@ -175,11 +175,6 @@ export const options = [
    text: "key查询",
    placeholder: "请输入key查询"
  },
-  {
-    key: "product_name",
-    text: "商品名称",
-    placeholder: "请输入商品名称查询"
-  },
  {
    key: "key_batch_id",
    text: "key批次",
@ -190,16 +185,6 @@ export const options = [
    text: "充值账号",
    placeholder: "请输入充值账号查询"
  },
-  {
-    key: "plan_title",
-    text: "计划标题",
-    placeholder: "请输入计划标题查询"
-  },
-  {
-    key: "reseller_name",
-    text: "分销商名称",
-    placeholder: "请输入分销商名称查询"
-  },
  {
    key: "cash_activity_id",
    text: "红包批次号",
--- a/src/pages/plan/add/add.js
+++ b/src/pages/plan/add/add.js
@ -1,29 +1,15 @@
 /* 新增营销计划 */
-import React from "react";
-import {
-  Button,
-  Card,
-  Icon,
-  Notify,
-  Radio,
-  RadioGroup,
-  Sweetalert
-} from "zent";
-import "./add.less";
-import Step1 from "./step1.js";
-import Step2 from "./step2.js";
-import Step3 from "./step3.js";
-import {
-  addPlanStep,
-  handelResponse,
-  getReseller,
-  planSend,
-  approvals
-} from "@/assets/api.js";
+import React from "react"
+import { Button, Card, Icon, Notify, Radio, RadioGroup, Sweetalert } from "zent"
+import "./add.less"
+import Step1 from "./step1.js"
+import Step2 from "./step2.js"
+import Step3 from "./step3.js"
+import { addPlanStep, handelResponse, getReseller, planSend, approvals } from "@/assets/api.js"

 export default class add extends React.Component {
  constructor(props) {
-    super(props);
+    super(props)
    this.state = {
      keys: ["step2-0"],
      step1_pagetitle: "新建计划",
@ -60,223 +46,211 @@ export default class add extends React.Component {
      keyStyle: 1,
      direct_reseller_id: 0,
      keyType: 1
-    };
+    }
  }

  submit() {
-    this.refs.step1.submit();
+    this.refs.step1.submit()
  }
  onReturn() {
-    let self = this;
+    let self = this
    Sweetalert.confirm({
      type: "warning",
      closeBtn: true,
      title: "确认操作",
      content: <p> 是否返回计划列表?</p>,
      onConfirm: () => {
-        self.props.history.push("/home/plan-list/");
+        self.props.history.push("/home/plan-list/")
      },
      onCancel: this.onCancel,
      className: "questModal",
      parentComponent: this
-    });
+    })
  }
  componentDidMount(e) {
-    sessionStorage.setItem("white", 3);
-    sessionStorage.setItem("plan_id", "");
-    sessionStorage.setItem("keyType", "1");
+    sessionStorage.setItem("white", 3)
+    sessionStorage.setItem("plan_id", "")
+    sessionStorage.setItem("keyType", "1")
  }

  onConfirm(e) {
-    let plan_id = sessionStorage.getItem("plan_id");
-    this.setState({ is_audit: true });
-    this.setState({ audit_visible: false });
+    let plan_id = sessionStorage.getItem("plan_id")
+    this.setState({ audit_visible: false, is_audit: true })
    let data = {
      reseller_id: this.state.reseller.id,
      reseller_name: this.state.reseller.name,
      company_name: this.state.reseller.company_name,
      receive_email: this.state.email_list[0],
      payment_direction: this.state.payment_direction[this.state.paytype - 1]
-    };
+    }
    approvals(plan_id, data).then((res) => {
      handelResponse(
        res,
        (req, msg) => {
-          Notify.success("成功发起审批");
-          this.props.history.push("/home/plan-list/");
-          this.setState({ is_audit: false });
+          Notify.success("成功发起审批")
+          this.props.history.push("/home/plan-list/")
+          this.setState({ is_audit: false })
        },
        (err) => {
-          Notify.error(err);
+          Notify.error(err)
        }
-      );
-    });
+      )
+    })
  }
  onPayTypeChange(e) {
-    console.log("渠道类型", e.target.value);
-    this.setState({ paytype: e.target.value });
+    this.setState({ paytype: e.target.value })
  }

  async onNextStep() {
    if (this.state.curstep >= 1) {
      if ((await this.refs.step1.submit()) == true) {
-        this.setState({ isload: true });
-        this.setState({ curstep: 2 });
+        this.setState({ curstep: 2, isload: true })
      } else {
-        return;
+        return
      }
    }

    if (this.state.curstep >= 2) {
-      let temp = [];
+      let temp = []
      for (let i = 0; i < this.state.keys.length; i++) {
-        let data = null;
+        let data = null
        if (this.refs[this.state.keys[i]]) {
-          data = this.refs[this.state.keys[i]].submit();
+          data = this.refs[this.state.keys[i]].submit()
        } else {
-          continue;
+          continue
        }

        if (data) {
-          temp.push(data);
+          temp.push(data)
        } else {
-          return;
+          return
        }
      }

      let obj = {
        info: JSON.parse(sessionStorage.getItem("step1")),
        key: temp
-      };
-      let plan_id = sessionStorage.getItem("plan_id");
+      }
+      let plan_id = sessionStorage.getItem("plan_id")

      await addPlanStep(plan_id, obj).then((res) => {
        handelResponse(
          res,
          (req, msg) => {
-            this.setState({ curstep: 3 });
-            sessionStorage.setItem("step2", JSON.stringify(temp));
-            this.setState({ card_visible: true });
-            return;
+            sessionStorage.setItem("step2", JSON.stringify(temp))
+            this.setState({ card_visible: true, curstep: 3 })
+            return
          },
          (err) => {
-            Notify.error(err);
+            Notify.error(err)
          }
-        );
-      });
+        )
+      })
    }
    if (this.state.curstep == 3) {
      if (this.state.direct_reseller_id <= 0) {
        // 老数据不能进行新增商品操作
-        Notify.error(`请添加映射分销商`);
-        return;
+        Notify.error(`请添加映射分销商`)
+        return
      }

-      let data = this.refs.step3.submit();
+      let data = this.refs.step3.submit()
      if (data) {
        let obj = {
          info: JSON.parse(sessionStorage.getItem("step1")),
          key: JSON.parse(sessionStorage.getItem("step2")),
          theme: data,
          complete: true
-        };
+        }

-        let plan_id = sessionStorage.getItem("plan_id");
+        let plan_id = sessionStorage.getItem("plan_id")
        addPlanStep(plan_id, obj).then((res) => {
          handelResponse(
            res,
            (req, msg) => {
              //获取电话 邮箱

-              let id = obj.info.reseller_id;
+              let id = obj.info.reseller_id

              getReseller(id).then((res) => {
                handelResponse(res, (req, msg) => {
-                  console.log("分销商数据");
-                  console.log(req);
-                  this.setState({ reseller: req });
-                  this.setState({ phone_list: req.contact_phone });
-                  this.setState({ email_list: req.contact_email });
-                  this.setState({ audit_visible: true });
-                });
-              });
+                  this.setState({
+                    phone_list: req.contact_phone,
+                    reseller: req,
+                    email_list: req.contact_email,
+                    audit_visible: true
+                  })
+                })
+              })
            },
            (err) => {
-              Notify.error(err);
+              Notify.error(err)
            }
-          );
-        });
+          )
+        })
      } else {
-        return;
+        return
      }
    }
  }
  addNewkey() {
-    let step = "step2-" + this.state.keys.length;
-    this.state.keys.push(step);
-    this.setState({ keys: this.state.keys });
-    this.setState({ isload: true });
+    let step = "step2-" + this.state.keys.length
+    this.state.keys.push(step)
+    this.setState({ isload: true, keys: this.state.keys })
    if (this.refs[this.state.keys[0]].state.model.style == 6) {
-      this.setState({ whiteStyle: true });
-      this.setState({ keyStyle: 6 });
+      this.setState({ keyStyle: 6, whiteStyle: true })
    } else {
-      this.setState({ keyStyle: 1 });
-      this.setState({ whiteStyle: false });
+      this.setState({ whiteStyle: false, keyStyle: 1 })
    }
  }
  onStyleChange(e) {
    if (e.target.value == 6) {
-      this.setState({ whiteStyle: true });
-      this.setState({ keyStyle: 6 });
-      sessionStorage.setItem("white", 1);
+      this.setState({ keyStyle: 6, whiteStyle: true })
+      sessionStorage.setItem("white", 1)
      for (let i = 0; i < this.state.keys.length; i++) {
        if (this.refs[this.state.keys[i]]) {
          if (i > 0) {
-            this.refs[this.state.keys[i]].setkeyStyle(6);
+            this.refs[this.state.keys[i]].setkeyStyle(6)
          }
        }
      }
    } else {
-      console.log(88888, this.refs);
-
-      sessionStorage.setItem("white", 3);
+      sessionStorage.setItem("white", 3)
      for (let i = 0; i < this.state.keys.length; i++) {
        if (this.refs[this.state.keys[i]]) {
          if (i > 0) {
-            this.refs[this.state.keys[i]].setkeyStyle(1);
+            this.refs[this.state.keys[i]].setkeyStyle(1)
          }
        }
      }

-      this.setState({ whiteStyle: false });
+      this.setState({ whiteStyle: false })
    }
  }
  onPhoneChange(e) {
-    this.setState({ phone_radio: e.target.value });
+    this.setState({ phone_radio: e.target.value })
  }
  onEmailChange(e) {
-    this.setState({ email_radio: e.target.value });
+    this.setState({ email_radio: e.target.value })
  }
  cancel(e) {
-    this.setState({ audit_visible: false });
+    this.setState({ audit_visible: false })
  }

  closeStep(index) {
-    this.state.keys[index] = "";
-    this.setState({ keys: this.state.keys });
-    console.log("当前的key");
-    console.log(this.state.keys);
+    this.state.keys[index] = ""
+    this.setState({ keys: this.state.keys })
  }

  // 获取落地页
  getStep3Theme() {
    if (this.state.card_visible) {
-      this.refs.step3.getThemeData();
+      this.refs.step3.getThemeData()
    }
  }

  send(e) {
-    let plan_id = sessionStorage.getItem("plan_id");
+    let plan_id = sessionStorage.getItem("plan_id")
    let data = {
      phone:
        this.state.phone_radio > -1
@ -286,92 +260,87 @@ export default class add extends React.Component {
        this.state.email_radio > -1
          ? this.state.email_list[this.state.email_radio]
          : this.state.email
-    };
+    }

-    let phoneReg = new RegExp("^[1][3,4,5,6,7,8,9][0-9]{9}$");
+    let phoneReg = new RegExp("^[1][3,4,5,6,7,8,9][0-9]{9}$")

    if (!phoneReg.test(data.phone)) {
-      Notify.error("手机号格式不正确");
-      return;
+      Notify.error("手机号格式不正确")
+      return
    }

    planSend(plan_id, data).then((res) => {
      handelResponse(
        res,
        (req, msg) => {
-          Notify.success("发送成功,请在1-2分钟后查看");
-          this.props.history.push("/home/plan-list/");
+          Notify.success("发送成功,请在1-2分钟后查看")
+          this.props.history.push("/home/plan-list/")
        },
        (err) => {
-          Notify.error(err);
-          this.props.history.push("/home/plan-list/");
+          Notify.error(err)
+          this.props.history.push("/home/plan-list/")
        }
-      );
-    });
+      )
+    })
  }
  phoneChange = (e) => {
-    this.setState({ phone: e.target.value });
-  };
+    this.setState({ phone: e.target.value })
+  }
  emailChange = (e) => {
-    this.setState({ email: e.target.value });
-  };
+    this.setState({ email: e.target.value })
+  }

  // 获取分销商 id
  getDirectResellerId = (data) => {
    this.setState({
      direct_reseller_id: data.direct_reseller_id
-    });
-  };
+    })
+  }
  render() {
    return (
-      <div id='plan-add'>
-        <div className='plan-left'>
+      <div id="plan-add">
+        <div className="plan-left">
          {this.state.menuList.map((item, index) => {
            return (
-              <div className='box-item' key={item.title}>
-                <div className='main-title'>{item.title}</div>
+              <div className="box-item" key={item.title}>
+                <div className="main-title">{item.title}</div>
                {item.child.map((item2, index2) => {
                  return (
-                    <div className='title-inline' key={index2}>
+                    <div className="title-inline" key={index2}>
                      <div
                        key={item2.title}
                        className={
-                          this.state.curstep >= item.id
-                            ? "child-title active"
-                            : "child-title"
-                        }>
+                          this.state.curstep >= item.id ? "child-title active" : "child-title"
+                        }
+                      >
                        {item2.title}{" "}
                      </div>
                      {this.state.curstep >= item.id ? (
-                        <Icon type='check' className='checkIcon' />
+                        <Icon type="check" className="checkIcon" />
                      ) : null}
                    </div>
-                  );
+                  )
                })}
-                <div className='under-line'></div>
+                <div className="under-line"></div>
              </div>
-            );
+            )
          })}
        </div>
-        <div className='plan-right'>
-          <div className='action-panel'>
-            <div id='step1' className='step1'>
-              <div className='plan-title'>营销计划</div>
-              <Card
-                style={{ width: "100%" }}
-                title={this.state.step1_pagetitle}>
+        <div className="plan-right">
+          <div className="action-panel">
+            <div id="step1" className="step1">
+              <div className="plan-title">营销计划</div>
+              <Card style={{ width: "100%" }} title={this.state.step1_pagetitle}>
                <Step1
-                  ref='step1'
-                  onGetDirectResellerId={(data) =>
-                    this.getDirectResellerId(data)
-                  }
+                  ref="step1"
+                  onGetDirectResellerId={(data) => this.getDirectResellerId(data)}
                />
              </Card>
            </div>

            {this.state.curstep >= 2 ? (
-              <div id='step2' className='step2'>
-                <div className='plan-title'>key</div>
+              <div id="step2" className="step2">
+                <div className="plan-title">key</div>
                {this.state.keys.map((item, index) => {
                  return item ? (
                    <Card
@ -385,22 +354,24 @@ export default class add extends React.Component {
                      action={
                        index > 0 ? (
                          <span
-                            className='zent-link'
-                            target='_blank'
+                            className="zent-link"
+                            target="_blank"
                            onClick={(e) => {
-                              this.closeStep(index);
-                            }}>
+                              this.closeStep(index)
+                            }}
+                          >
                            关闭
                          </span>
                        ) : null
-                      }>
+                      }
+                    >
                      <Step2
                        ref={item}
                        addNewkey={() => {
-                          this.addNewkey();
+                          this.addNewkey()
                        }}
                        onStyleChange={(e) => {
-                          this.onStyleChange(e);
+                          this.onStyleChange(e)
                        }}
                        getStep3Theme={() => this.getStep3Theme()}
                        keyStyle={this.state.keyStyle}
@ -413,77 +384,78 @@ export default class add extends React.Component {
                        whiteStyle={this.state.whiteStyle}
                      />
                    </Card>
-                  ) : null;
+                  ) : null
                })}
              </div>
            ) : null}

            {this.state.card_visible ? (
-              <div id='step3' className='step3'>
-                <Card
-                  style={{ width: "100%", height: "auto" }}
-                  title={this.state.step3_pagetitle}>
-                  <Step3 ref='step3' />
+              <div id="step3" className="step3">
+                <Card style={{ width: "100%", height: "auto" }} title={this.state.step3_pagetitle}>
+                  <Step3 ref="step3" />
                </Card>
              </div>
            ) : null}

            {this.state.curstep == 3 ? (
-              <div className='step-btn-group'>
-                <Button type='primary' onClick={() => this.onNextStep()}>
+              <div className="step-btn-group">
+                <Button type="primary" onClick={() => this.onNextStep()}>
                  提交审核
                </Button>
-                <Button type='normal' onClick={() => this.onReturn()}>
+                <Button type="normal" onClick={() => this.onReturn()}>
                  取消
                </Button>
              </div>
            ) : (
-              <div className='step-btn-group'>
-                <Button type='primary' onClick={() => this.onNextStep()}>
+              <div className="step-btn-group">
+                <Button type="primary" onClick={() => this.onNextStep()}>
                  下一步
                </Button>
-                <Button type='normal' onClick={() => this.onReturn()}>
+                <Button type="normal" onClick={() => this.onReturn()}>
                  取消
                </Button>
              </div>
            )}

            {this.state.audit_visible ? (
-              <div className='audit'>
-                <div className='modal'> </div>
-                <div className='audit-box'>
+              <div className="audit">
+                <div className="modal"> </div>
+                <div className="audit-box">
                  <Icon
-                    type='close'
-                    className='audit-close'
+                    type="close"
+                    className="audit-close"
                    onClick={(e) => {
-                      this.setState({ audit_visible: false });
+                      this.setState({ audit_visible: false })
                    }}
                  />
-                  <div className='audit-box-title'>提交审核</div>
-                  <div className='payType'>
+                  <div className="audit-box-title">提交审核</div>
+                  <div className="payType">
                    <RadioGroup
                      onChange={(e) => {
-                        this.onPayTypeChange(e);
+                        this.onPayTypeChange(e)
                      }}
                      value={this.state.paytype}
-                      className='audit-obj'>
+                      className="audit-obj"
+                    >
                      <Radio value={3}>预付款扣除</Radio>
                      <Radio value={1}>对私账户</Radio>
                      <Radio value={2}>对公账户</Radio>
                    </RadioGroup>
                  </div>
-                  <div className='audit-btn-group'>
+                  <div className="audit-btn-group">
                    <Button
                      onClick={(e) => {
-                        this.setState({ audit_visible: false });
-                      }}>
+                        this.setState({ audit_visible: false })
+                      }}
+                    >
                      取消
                    </Button>
                    <Button
-                      type='primary'
+                      type="primary"
                      onClick={(e) => {
-                        this.onConfirm(e);
-                      }}>
+                        this.onConfirm(e)
+                      }}
+                    >
                      确定
                    </Button>
                  </div>
@ -493,6 +465,6 @@ export default class add extends React.Component {
          </div>
        </div>
      </div>
-    );
+    )
  }
 }
--- a/src/pages/plan/add/edit.js
+++ b/src/pages/plan/add/edit.js
--- a/src/pages/plan/add/plan-copy.js
+++ b/src/pages/plan/add/plan-copy.js
@ -1,18 +1,18 @@
 /* 新增营销计划 */
+import {
+  addPlanStep,
+  approvals,
+  getReseller,
+  get_copy_data,
+  handelResponse,
+  planSend
+} from "@/assets/api.js"
 import React from "react"
 import { Button, Card, Icon, Notify, Radio, RadioGroup, Sweetalert } from "zent"
 import "./add.less"
 import Step1 from "./step1.js"
 import Step2 from "./step2.js"
 import Step3 from "./step3.js"
-import {
-  addPlanStep,
-  handelResponse,
-  getReseller,
-  planSend,
-  approvals,
-  get_copy_data
-} from "@/assets/api.js"

 export default class add extends React.Component {
  constructor(props) {
@ -155,8 +155,7 @@ export default class add extends React.Component {

  onConfirm(e) {
    let plan_id = sessionStorage.getItem("plan_id")
-    this.setState({ is_audit: true })
-    this.setState({ audit_visible: false })
+    this.setState({ audit_visible: false, is_audit: true })
    let data = {
      reseller_id: this.state.reseller.id,
      reseller_name: this.state.reseller.name,
@ -185,8 +184,7 @@ export default class add extends React.Component {
  async onNextStep() {
    if (this.state.curstep >= 1) {
      if ((await this.refs.step1.submit()) == true) {
-        this.setState({ isload: true })
-        this.setState({ curstep: 2 })
+        this.setState({ curstep: 2, isload: true })
      } else {
        return
      }
@ -217,9 +215,8 @@ export default class add extends React.Component {
        handelResponse(
          res,
          (req, msg) => {
-            this.setState({ curstep: 3 })
            sessionStorage.setItem("step2", JSON.stringify(temp))
-            this.setState({ card_visible: true })
+            this.setState({ card_visible: true, curstep: 3 })
            return
          },
          (err) => {
@ -253,10 +250,12 @@ export default class add extends React.Component {
              let id = obj.info.reseller_id
              getReseller(id).then((res) => {
                handelResponse(res, (req, msg) => {
-                  this.setState({ reseller: req })
-                  this.setState({ phone_list: req.contact_phone })
-                  this.setState({ email_list: req.contact_email })
-                  this.setState({ audit_visible: true })
+                  this.setState({
+                    phone_list: req.contact_phone,
+                    reseller: req,
+                    email_list: req.contact_email,
+                    audit_visible: true
+                  })
                })
              })
            },
@ -272,22 +271,17 @@ export default class add extends React.Component {
  }
  addNewkey() {
    let step = "step2-" + this.state.keys.length
-    console.log("step =>", step)
    this.state.keys.push(step)
-    this.setState({ keys: this.state.keys })
-    this.setState({ isload: true })
+    this.setState({ isload: true, keys: this.state.keys })
    if (this.refs[this.state.keys[0]].state.model.style == 6) {
-      this.setState({ whiteStyle: true })
-      this.setState({ keyStyle: 6 })
+      this.setState({ keyStyle: 6, whiteStyle: true })
    } else {
-      this.setState({ keyStyle: 1 })
-      this.setState({ whiteStyle: false })
+      this.setState({ whiteStyle: false, keyStyle: 1 })
    }
  }
  onStyleChange(e) {
    if (e.target.value == 6) {
-      this.setState({ whiteStyle: true })
-      this.setState({ keyStyle: 6 })
+      this.setState({ keyStyle: 6, whiteStyle: true })
      sessionStorage.setItem("white", 1)
      for (let i = 0; i < this.state.keys.length; i++) {
        if (this.refs[this.state.keys[i]]) {
--- a/src/pages/plan/add/step1.js
+++ b/src/pages/plan/add/step1.js
@ -1,13 +1,13 @@
 /* 新建计划 step1 */
-import React from "react"
-import { DateRangePicker, Select, RadioButton, RadioGroup, Notify } from "zent"
-import Ipt from "@/components/input/main"
-import Form from "@/components/form/main"
-import FormItem from "@/components/form-item/main"
+import { addPlanStep, getReSellerOption, handelResponse, putPlanStep } from "@/assets/api.js"
 import Bus from "@/assets/eventBus.js"
+import FormItem from "@/components/form-item/main"
+import Form from "@/components/form/main"
+import Ipt from "@/components/input/main"
 import { map } from "lodash-es"
 import moment from "moment"
-import { addPlanStep, handelResponse, getReSellerOption, putPlanStep } from "@/assets/api.js"
+import React from "react"
+import { DateRangePicker, Notify, RadioButton, RadioGroup, Select } from "zent"

 export default class accList extends React.Component {
  constructor(props) {
@ -113,13 +113,11 @@ export default class accList extends React.Component {
        formdata.info.copy_plan_id = sessionStorage.getItem("plan_id_copy")
        if (plan_id == "") {
          await addPlanStep("", formdata).then((res) => {
-            console.log("res step1=>", res)
            handelResponse(
              res,
              (req, msg) => {
                sessionStorage.setItem("plan_id", req.id)
                delete data.copy_plan_id
-                console.log("step 1-2 =>", data)
                sessionStorage.setItem("step1", JSON.stringify(data))
                sessionStorage.setItem("knockGold_effectDate", JSON.stringify(data))
                sessionStorage.setItem("redPackets_effectDate", JSON.stringify(data))
--- a/src/pages/plan/add/step2.js
+++ b/src/pages/plan/add/step2.js
@ -1,23 +1,27 @@
 /* 生成key step2 */
-import ReactDOM from "react-dom"
-import React from "react"
-import { deWeightThree } from "@/tools/utils.js"
-import "./step2.less"
-import { Drawer, Button, Notify, Input, Radio, Switch, Icon, RadioGroup, RadioButton } from "zent"
-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 { handelResponse, getAccessVerification, getProductInfoSelect } from "@/assets/api.js"
-import { divNum } from "@/tools/number"
+import {
+  getAccessVerification,
+  getProductInfoSelect,
+  handelResponse,
+  uploadImg
+} from "@/assets/api.js"
 import UseCouponAddEdit from "@/components/UseCouponAddEdit" // 优惠券
 import UseExchangeAddEdit from "@/components/UseExchangeAddEdit" // 兑换码
-import moment from "moment"
-import { uploadImg } from "@/assets/api.js"
-import { submitIsKm, productTypeMenu } from "@/tools/index"
-import "./add.less"
+import FormItem from "@/components/form-item/main"
+import Form from "@/components/form/main"
+import Grid from "@/components/gird/main.js"
+import Ipt from "@/components/input/main"
+import { productTypeMenu, submitIsKm } from "@/tools/index"
+import { divNum } from "@/tools/number"
+import { deWeightThree } from "@/tools/utils.js"
 import { isSameDay } from "date-fns"
-import { map, forEach } from "lodash-es"
+import { forEach, map } from "lodash-es"
+import moment from "moment"
+import React from "react"
+import ReactDOM from "react-dom"
+import { Button, Drawer, Icon, Input, Notify, Radio, RadioButton, RadioGroup, Switch } from "zent"
+import "./add.less"
+import "./step2.less"

 const initArray = (targetNum) => {
  return Array.from({ length: targetNum }, (_, index) => index)
@ -276,7 +280,6 @@ export default class acclist extends React.Component {
        data.coupon = param
        data.mobile_excel = this.state.mobile_excel
        data.mobile_repeat = this.state.mobile_repeat
-        console.log("data =>", data)
        // 校验 卡密时间判断
        for (let i = 0; i < param.length; i++) {
          if (submitIsKm(param[i].product.legal) === false) {
@ -419,7 +422,6 @@ export default class acclist extends React.Component {
  }

  async productSubmit() {
-    console.log(1)
    let visible = ""
    if (this.state.addIsType === "addProduct") {
      visible = await this.refs.product.submit()
@ -549,7 +551,6 @@ export default class acclist extends React.Component {
      let coupon_validator = this.refs.addEditCouponEl.submit()
      if (coupon_validator) {
        let param = this.refs.addEditCouponEl.getModel()
-        console.log("param =>", param)
        let tempdata = this.state.couponData
        // 优惠券编辑
        if (this.state.rowIndex > -1) {
--- a/src/pages/plan/add/step3.js
+++ b/src/pages/plan/add/step3.js
@ -1,11 +1,11 @@
 /* 绑定落地页 step3 */
-import React from "react"
-import { Select, RadioGroup, RadioButton } from "zent"
-import Form from "@/components/form/main"
-import FormItem from "@/components/form-item/main"
-import { handelResponse, getThemeChoice } from "@/assets/api.js"
-import { map } from "lodash-es"
+import { getThemeChoice, handelResponse } from "@/assets/api.js"
 import Bus from "@/assets/eventBus.js"
+import FormItem from "@/components/form-item/main"
+import Form from "@/components/form/main"
+import { map } from "lodash-es"
+import React from "react"
+import { RadioButton, RadioGroup, Select } from "zent"
 import "./add.less"

 export default class accList extends React.Component {
@ -67,10 +67,9 @@ export default class accList extends React.Component {
            return obj
          })

-          this.setState({ options: arr })
          let model = this.state.model
          model.theme_id = ""
-          this.setState({ model: model })
+          this.setState({ model: model, options: arr })
          if (this.props.data && this.props.data.theme_id) {
            let selctobj = this.state.options.find((o) => o.key == this.props.data.theme_id)
            let model = this.state.model
@ -100,13 +99,11 @@ export default class accList extends React.Component {
  onLinkChange(e) {
    let model2 = this.state.model
    model2.link = e.target.value
-
    this.setState({ model: model2 })
  }
  onListChange(e) {
    let model2 = this.state.model
    model2.list = e.target.value
-
    this.setState({ model: model2 })
  }
  onUserChange(e) {
--- a/src/pages/plan/key/UseKeyAddEdit.jsx
+++ b/src/pages/plan/key/UseKeyAddEdit.jsx
@ -1,35 +1,35 @@
-import React, { useRef, useEffect } from "react"
-import { useSetState } from "ahooks"
 import {
-  Radio,
-  Card,
-  Sweetalert,
-  Drawer,
-  Button,
-  Notify,
-  Input,
-  Icon,
-  RadioGroup,
-  RadioButton,
-  Switch
-} from "zent"
-import { map } from "lodash-es"
-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 { submitIsKm } from "@/tools/index"
+  addKeysBatchInfo,
+  getAccessVerification,
+  getKeyBatchDetail,
+  getReseller,
+  handelResponse,
+  keyEditApproval,
+  uploadImg
+} from "@/assets/api.js"
 import UseCouponAddEdit from "@/components/UseCouponAddEdit" // 优惠券
 import UseExchangeAddEdit from "@/components/UseExchangeAddEdit" // 兑换码
+import FormItem from "@/components/form-item/main"
+import Form from "@/components/form/main"
+import Grid from "@/components/gird/main.js"
+import Ipt from "@/components/input/main"
+import { submitIsKm } from "@/tools/index"
+import { useSetState } from "ahooks"
+import { map } from "lodash-es"
+import React, { useEffect, useRef } from "react"
 import {
-  handelResponse,
-  getReseller,
-  addKeysBatchInfo,
-  keyEditApproval,
-  getKeyBatchDetail,
-  uploadImg,
-  getAccessVerification
-} from "@/assets/api.js"
+  Button,
+  Card,
+  Drawer,
+  Icon,
+  Input,
+  Notify,
+  Radio,
+  RadioButton,
+  RadioGroup,
+  Sweetalert,
+  Switch
+} from "zent"

 const formRules = {
  quantity: [
@ -308,23 +308,21 @@ const UseKeyAddEdit = () => {
    let mobile_repeat = map(temp, (o) => {
      return o.mobile
    })
-    setState({ mobile_repeat: mobile_repeat })
-
    setModel({
      quantity: state.excel_count - state.error_count + mobile_repeat.length
    })
-
-    setState({ model: model })
-    setState({ accessVerify: false })
-    setState({ excel_visible: false })
-    setState({ import_visible: false })
-    setState({ import_success: true })
+    setState({
+      mobile_repeat: mobile_repeat,
+      accessVerify: false,
+      model: model,
+      excel_visible: false,
+      import_visible: false,
+      import_success: true
+    })
  }

  const resetUpload = () => {
-    setState({ excel_visible: false })
-    setState({ import_visible: true })
-    setState({ accessVerify: true })
+    setState({ import_visible: true, excel_visible: false, accessVerify: true })
  }

  const switchChange = (e, rowData) => {
@ -344,9 +342,7 @@ const UseKeyAddEdit = () => {
      Notify.error("文件正在解析中请稍等")
    } else {
      if (state.success_visible) {
-        setState({ accessVerify: false })
-        setState({ excel_visible: true })
-        setState({ import_visible: false })
+        setState({ excel_visible: true, accessVerify: false, import_visible: false })
      } else {
        Notify.error("请上传正确的文件")
      }
@ -383,14 +379,15 @@ const UseKeyAddEdit = () => {
              handelResponse(
                res,
                (req, msg) => {
-                  setState({ accessVerify: true })
-                  setState({ excel_count: req.count })
-                  setState({ error_count: req.errorCount })
                  let success = req.count - req.errorCount
-                  setState({ success_count: success })
-                  setState({ exceldata: req.validationFailed })
-
-                  setState({ success_visible: true })
+                  setState({
+                    excel_count: req.count,
+                    accessVerify: true,
+                    error_count: req.errorCount,
+                    success_count: success,
+                    exceldata: req.validationFailed,
+                    success_visible: true
+                  })
                },
                (err) => {
                  Notify.error(err)
@ -534,8 +531,7 @@ const UseKeyAddEdit = () => {
        addEditCouponEl.current.clearCouponForm()
      }, 300)
    }
-    setState({ rowIndex: -1 })
-    setState({ drawerVisible: true })
+    setState({ drawerVisible: true, rowIndex: -1 })
  }

  // 绑定数改变
@ -770,13 +766,15 @@ const UseKeyAddEdit = () => {

  // 导入白名单
  const initUpload = () => {
-    setState({ import_visible: false })
-    setState({ success_visible: false })
-    setState({ fail_visible: false })
-    setState({ file_loading: false })
-    setState({ upload_visible: false })
-    setState({ excel_visible: false })
-    setState({ accessVerify: false })
+    setState({
+      file_loading: false,
+      fail_visible: false,
+      success_visible: false,
+      import_visible: false,
+      upload_visible: false,
+      excel_visible: false,
+      accessVerify: false
+    })
  }
  //#endRegion event handler *******************/

--- a/src/pages/plan/key/edit.js
+++ b/src/pages/plan/key/edit.js
@ -390,7 +390,6 @@ export default class accList extends React.Component {
      let ex_validator = this.refs.addEditExChangeEl.submit()
      if (ex_validator) {
        let param = this.refs.addEditExChangeEl.getModel()
-        console.log("兑换码 param =>", param)
        let tempdata = this.state.distdata
        // 优惠券编辑
        if (this.state.rowIndex > -1) {
--- a/src/pages/plan/key/list.js
+++ b/src/pages/plan/key/list.js
@ -1,43 +1,44 @@
 /* key列表 */
-import React from "react"
 import {
-  Input,
-  Notify,
-  Menu,
-  MenuItem,
-  Button,
-  RadioGroup,
-  Radio,
-  Sweetalert,
-  Dropdown,
-  DropdownPosition,
-  DropdownClickTrigger,
-  Icon,
-  DropdownContent,
-  BlockLoading
-} from "zent"
-import dayjs from "dayjs"
-import "./list.less"
-import { Switch, Pop } from "zent"
-import "@/assets/comm.css"
-import Ipt from "@/components/input/main"
-import Grid from "@/components/gird/main.js"
-import TabPage from "@/components/tabPage/main.js"
-import menu from "@/assets/enum.js"
-import {
-  terminateApprovals,
-  getKeyList,
-  handelResponse,
-  startOrStopKeybatch,
-  cancelKey,
-  getReseller,
  batchSend,
+  cancelKey,
  deleteKeyBatch,
  dingTaskQuery,
-  keyBatchExport
+  getKeyList,
+  getReseller,
+  handelResponse,
+  keyBatchExport,
+  startOrStopKeybatch,
+  terminateApprovals
 } from "@/assets/api.js"
-import { findIndex } from "lodash-es"
+import "@/assets/comm.css"
+import menu from "@/assets/enum.js"
+import Grid from "@/components/gird/main.js"
+import Ipt from "@/components/input/main"
+import TabPage from "@/components/tabPage/main.js"
 import { commonSearchOrder } from "@/tools/apiTools.js"
+import dayjs from "dayjs"
+import { findIndex } from "lodash-es"
+import React from "react"
+import {
+  BlockLoading,
+  Button,
+  Dropdown,
+  DropdownClickTrigger,
+  DropdownContent,
+  DropdownPosition,
+  Icon,
+  Input,
+  Menu,
+  MenuItem,
+  Notify,
+  Pop,
+  Radio,
+  RadioGroup,
+  Sweetalert,
+  Switch
+} from "zent"
+import "./list.less"
 const Column = [
  {
    title: "key-批次ID",