1) 增加列表状态显示

src/pages/coupon/list/index.jsx

@@ -7,6 +7,7 @@ import _ from "lodash";
 import TabPage from "@/components/tabPage/main.js";
 import Ipt from "@/components/input/main";
 import Grid from "@/components/gird/main.js";
+import menu from "@/assets/enum.js";
 import { getCouponList, handelResponse } from "@/assets/api.js";
 
 import "./style.less";
@@ -22,16 +23,16 @@ const tableColumn = [
   {
     title: "优惠券批次名称",
     width: "auto",
-    type: "normal",
+    type: "slot",
     prop: "title",
     name: "title",
   },
   {
     title: "有效期",
-    width: "auto",
     type: "slot",
     prop: "dates",
     name: "dates",
+    width: "250px",
   },
   {
     title: "归属营销计划名称",
@@ -47,6 +48,26 @@ const tableColumn = [
     prop: "keyBatch.plan.title",
     name: "keyBatch.plan.title",
   },
+  {
+    title: "启用/暂停",
+    width: "auto",
+    type: "slot",
+    prop: "switch",
+  },
+  {
+    title: "操作",
+    prop: "opearo",
+    name: "opearo",
+    type: "slot",
+    width: "200px",
+  },
+  {
+    title: "状态",
+    width: "auto",
+    type: "slot",
+    prop: "status",
+    name: "status",
+  },
   {
     title: "卷总数(已发放)",
     width: "auto",
@@ -89,26 +110,6 @@ const tableColumn = [
     prop: "invalid",
     name: "invalid",
   },
-  {
-    title: "状态",
-    width: "auto",
-    type: "normal",
-    prop: "status",
-    name: "status",
-  },
-  {
-    title: "启用/暂停",
-    width: "auto",
-    type: "slot",
-    prop: "switch",
-  },
-  {
-    title: "操作",
-    prop: "opearo",
-    name: "opearo",
-    type: "slot",
-    width: "200px",
-  },
 ];
 
 const UseCouponList = () => {
@@ -232,6 +233,109 @@ const UseCouponList = () => {
   };
 
   const changeStatus = (data) => {};
+  // 跳转商品范围
+  const goPagesScopePop = (e, row) => {
+    console.log("商品范围。。。");
+    // sessionStorage.setItem("pathname2", "/home/exchange-addcommodity");
+    // let activerou = [
+    //   {
+    //     pagetitle: "编辑",
+    //     items: [
+    //       {
+    //         path: "/home/exchangecode-list",
+    //         name: "兑换码管理",
+    //       },
+    //       {
+    //         path: "/home/exchangecode-add",
+    //         name: row.title + "兑换码的商品范围列表",
+    //       },
+    //     ],
+    //   },
+    // ];
+    // sessionStorage.setItem("code_id", row.id);
+    // sessionStorage.setItem("breaknav", JSON.stringify(activerou));
+    // window.open("#/home/exchange-addcommodity");
+  };
+
+  /* 新建/复制/编辑/兑换码 */
+  const addCodeFunction = (type, param) => {
+    sessionStorage.setItem("knockGold_effectDate", JSON.stringify({}));
+    let activerou = [
+      {
+        pagetitle: "新建兑换码",
+        items: [
+          {
+            path: "/home/exchangecode-list",
+            name: "兑换码管理",
+          },
+          {
+            path: "/home/exchangecode-exchangecodeAdd",
+            name: "新建兑换码",
+          },
+        ],
+      },
+    ];
+    /* 1：复制 2：编辑 */
+    if (type === 1) {
+      activerou[0].pagetitle = "复制";
+      activerou[0].items[1].name = `复制:${param.title}`;
+      sessionStorage.setItem(
+        "knockGold_effectDate",
+        JSON.stringify(param.keyBatch.plan)
+      );
+      /* 复制兑换码的key批次Id */
+      sessionStorage.setItem("keyBatch_id", param.key_batch_id);
+    } else if (type === 2) {
+      activerou[0].pagetitle = "编辑";
+      activerou[0].items[1].name = `编辑:${param.title}兑换码的商品范围列表`;
+      sessionStorage.setItem("approval_id", param.approval_id);
+      sessionStorage.setItem("approval_status", param.status);
+    }
+
+    sessionStorage.setItem("code_id", param?.id);
+    sessionStorage.setItem("isState", type);
+    sessionStorage.setItem("breaknav", JSON.stringify(activerou));
+    sessionStorage.setItem("pathname2", "/home/exchangecode-exchangecodeAdd");
+    this.props.history.push("/home/exchangecode-exchangecodeAdd");
+  };
+
+  /* 处理可复制数据逻辑  */
+  const copyElementFunction = (params) => {
+    let element = "";
+    /* 
+        条件一 如果兑换码状态为1（进行中）、2（暂停中）、3（未开始）可直接复制
+        条件二 如果兑换码状态为4（已完结）、5（已作废）则判断key批次是否是 生效中、暂停中、审核驳回状态且营销计划是待生效、进行中、暂停中
+       */
+    const isCopy =
+      [1, 2, 3].includes(params.status) ||
+      ([4, 5].includes(params.status) &&
+        [4, 5, 8].includes(params.keyBatch.status) &&
+        [3, 5, 4].includes(params.keyBatch.plan.status));
+
+    if (isCopy) {
+      element = (
+        <span
+          className="grid-link"
+          style={{}}
+          onClick={(e) => this.addCodeFunction(1, params)}
+        >
+          复制
+        </span>
+      );
+    } else {
+      element = (
+        <span
+          style={{
+            paddingRight: "10px",
+            color: "#d8dbdd",
+          }}
+        >
+          复制
+        </span>
+      );
+    }
+    return element;
+  };
 
   /**
    * 日期
@@ -266,7 +370,7 @@ const UseCouponList = () => {
           value={state.key_word}
           wordSearch={() => searchCallback()}
           icon="search"
-          placeholder={"请输入批次号、名称、key批次名称、计划名称 进行搜索"}
+          placeholder={"请输入关键字进行匹配查询"}
           countShow={false}
           height={"36px"}
           width={"260px"}
@@ -280,9 +384,10 @@ const UseCouponList = () => {
         spliteColor={"#fff"}
         tableData={state.tableData}
         Column={tableColumn}
-        countbarVisible={false}
         maxheight={state.tableHeight}
         isSwitch={false}
+        isMultiple={false}
+        countbarVisible={false}
         page={state.page}
         ref={table_el}
         dataCount={state.total}
@@ -295,30 +400,99 @@ const UseCouponList = () => {
         countChange={(e) => onCountChange(e)}
         checkChange={(data) => selectionFun(data)}
         ComponentHandler={(com, rowData) => {
-          if (com == "dates") {
+          if (com === "title") {
+            return (
+              <span
+                className="grid-link"
+                onClick={(e) => goPagesScopePop(e, rowData)}
+              >
+                {rowData.title}
+              </span>
+            );
+          }
+          if (com === "dates") {
             return (
               <span>
-                {rowData.begin_time} 至 {rowData.end_time}
+                {rowData.begin_time} 至222 {rowData.end_time}
               </span>
             );
           }
 
-          if (com === "switch") {
+          if (com == "switch") {
             return (
               <Switch
                 size="small"
                 checked={rowData.status == 2 ? false : true}
-                onChange={(e) => changeStatus(e, rowData)}
+                onChange={(e) => this.changestatus(e, rowData)}
                 disabled={rowData.status == 4 || rowData.status == 5}
               ></Switch>
             );
           }
 
-          if (com === "opearo") {
+          if (com == "status") {
+            return (
+              <p className="dflexa">
+                <span>
+                  <font
+                    className="icon"
+                    style={{
+                      background: menu.exchangeStatusBg(
+                        parseInt(rowData.status)
+                      ),
+                    }}
+                  ></font>
+                  {rowData.status_text}
+                </span>
+              </p>
+            );
+          }
+
+          if (com == "opearo") {
             return (
               <div>
-                <span>删除</span>
+                {rowData.status != 4 &&
-                <span>编辑</span>
+                rowData.status != 5 &&
+                rowData.status != 6 &&
+                rowData.status != -1 ? (
+                  <span
+                    className="grid-link"
+                    onClick={(e) => addCodeFunction(2, rowData)}
+                  >
+                    编辑
+                  </span>
+                ) : (
+                  <span style={{ color: "#d8dbdd" }} className="grid-link">
+                    编辑
+                  </span>
+                )}
+                {copyElementFunction(rowData)}
+                {rowData.status != 4 && rowData.status != 5 ? (
+                  <span
+                    className="grid-link"
+                    onClick={(e) => this.delFn(e, rowData)}
+                  >
+                    作废
+                  </span>
+                ) : (
+                  <span
+                    style={{
+                      paddingRight: "10px",
+                      color: "#d8dbdd",
+                    }}
+                  >
+                    作废
+                  </span>
+                )}
+                {rowData.status == 6 ? (
+                  <span
+                    className="grid-link"
+                    onClick={(e) => this.onReCall(e, rowData)}
+                  >
+                    撤销审批
+                  </span>
+                ) : (
+                  <span style={{ color: "#d8dbdd" }}>撤销审批</span>
+                )}
               </div>
             );
           }

src/pages/coupon/list/style.less

@@ -0,0 +1,6 @@
+.table-box-app{
+    .grid-link {
+        color: #2B66F2;
+        cursor: pointer;
+      }
+}