* 'couponV1.5' of https://codeup.aliyun.com/5f9118049cffa29cfdd3be1c/marketing/frontend:
  1) 增加优惠券增加
  1) 增加消费卷table
This commit is contained in:
Apple 2022-08-25 18:07:16 +08:00
commit dad624a1bc
6 changed files with 344 additions and 136 deletions

View File

@ -0,0 +1,82 @@
import React, { forwardRef, useImperativeHandle, useRef } from "react";
import { useSetState } from "ahooks";
import { Card, DateRangePicker } from "zent";
import moment from "moment";
import Ipt from "@/components/input/main";
import Form from "@/components/form/main";
import FormItem from "@/components/form-item/main";
const rules = {
name: [{ type: "required", message: "请输入批次名称" }],
};
const UseCouponAddEdit = forwardRef((props, ref) => {
const [state, setState] = useSetState({
title: "基本信息",
disabled: false,
});
const [model, setModel] = useSetState({
name: "",
time: "",
});
useImperativeHandle(ref, () => ({
submit: submit,
}));
const form_el = useRef(null);
const submit = () => {};
const onChangeCombinedDate = () => {};
const onDisabledRange = () => {};
return (
<div className="coupon-box">
<Card
style={{ width: "98%", height: "auto", margin: "10px auto" }}
title={state.title}
>
<Form model={model} rules={rules} ref={form_el}>
<FormItem labelname="批次名称" prop="name">
<Ipt
onChange={(e) => {
setModel({ name: e });
}}
onClearItem={(e) => {
setModel({ name: "" });
}}
value={model.name}
placeholder={"请输入"}
labelWidth={"0px"}
maxLength={20}
height={"36px"}
countShow={false}
width={"520px"}
alignment={"left"}
/>
</FormItem>
<FormItem labelname="开始~结束时间" prop="date_time" id="date_time">
<DateRangePicker
className="zent-datepicker-plan"
showTime={{
format: "HH:mm:ss",
defaultTime: [moment().format("HH:mm:ss"), "23:59:59"],
}}
format="YYYY-MM-DD HH:mm:ss"
disabled={[state.disabled, false]}
value={model.date_time}
onChange={(e) => {
onChangeCombinedDate(e);
}}
disabledDate={onDisabledRange}
/>
</FormItem>
</Form>
</Card>
</div>
);
});
export default UseCouponAddEdit;

View File

@ -0,0 +1,14 @@
import React from "react";
import "./style.less";
import UseCouponAddEdit from "@/components/UseCouponAddEdit";
const CouponAddEdit = () => {
return (
<div className="coupon-add-edit">
<UseCouponAddEdit></UseCouponAddEdit>
</div>
);
};
export default CouponAddEdit;

View File

View File

@ -1,5 +1,7 @@
import React, { useRef, useEffect } from "react";
import { useHistory } from "react-router-dom";
import { useSetState } from "ahooks";
import { Button, CombinedDateRangePicker } from "zent";
import _ from "lodash";
import TabPage from "@/components/tabPage/main.js";
@ -9,14 +11,98 @@ import "./style.less";
const tableColumn = [
{
title: "table 示例 1",
title: "优惠券-批次ID",
name: "key_code",
prop: "key_code",
type: "normal",
width: "auto",
},
{
title: "table 示例 2",
title: "优惠券批次名称",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "有效期",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "归属营销计划名称",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "归属key批次名称",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "卷总数(已发放)",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "已领取",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "已使用",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "剩余数",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "已失效",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "已作废",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "状态",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "启用/暂停",
width: "auto",
type: "normal",
prop: "title",
name: "title",
},
{
title: "操作",
width: "auto",
type: "normal",
prop: "title",
@ -51,6 +137,7 @@ const UseCouponList = () => {
isQuery: false,
});
const table_el = useRef(null);
const history = useHistory();
/**
*
@ -85,7 +172,26 @@ const UseCouponList = () => {
getTable();
}, [state.isQuery]);
const addCouponBtn = () => {};
const addCouponBtn = () => {
let activerou = [
{
pagetitle: "新建优惠券",
items: [
{
path: "/home/coupon-list",
name: "优惠券管理",
},
{
path: "/home/coupon-add-edit",
name: "新建优惠券",
},
],
},
];
sessionStorage.setItem("breaknav", JSON.stringify(activerou));
history.push("/home/coupon-add-edit");
};
const selectionFun = () => {};
const searchCallback = () => {
getTable();
@ -149,7 +255,7 @@ const UseCouponList = () => {
value={state.key_word}
wordSearch={() => searchCallback()}
icon="search"
placeholder={"请输入xxxxx"}
placeholder={"请输入批次号、名称、key批次名称、计划名称 进行搜索"}
countShow={false}
height={"36px"}
width={"260px"}

View File

@ -1,261 +1,267 @@
import Extension from '@/pages/extension/main/main'
import Overview from '@/pages/overview/main/main'
import Distributor from '@/pages/distributor/main/main'
import ExchangeCodeList from '@/pages/exchangecode/list/list'
import ExchangeCodeAdd from '@/pages/exchangecode/add/add'
import ExchangeCodeEdit from '@/pages/exchangecode/edit/edit'
import ExchangeCommodity from '@/pages/exchangecode/commodity/commodity'
import ProductEdit from '@/pages/exchangecode/commodity/goodedit.js'
import ExchangePage from '@/pages/exchangepage/main/main'
import OrderList from '@/pages/order/list/list'
import OrderDetails from '@/pages/order/more/more'
import OrderAdd from '@/pages/order/add/add'
import Plan from '@/pages/plan/main/main'
import PlanList from '@/pages/plan/list/list'
import PlanAdd from '@/pages/plan/add/add'
import PlanEdit from '@/pages/plan/add/edit'
import PlanEditCopy from '@/pages/plan/add/plan-copy'
import KeyList from '@/pages/plan/key/list'
import KeysList from '@/pages/plan/keyList'
import KeyOrderList from '@/pages/plan/keyorder/keyorder'
import KeyEdit from '@/pages/plan/key/edit.js'
import KeyDetail from '@/pages/plan/key/detail/list.js'
import KeyLog from '@/pages/plan/key/detail/log.js'
import AccountList from '@/pages/system/account/list/list'
import AccountAdd from '@/pages/system/account/add/add'
import SubAccountList from '@/pages/system/subAccount/list/list'
import SubAccountAdd from '@/pages/system/subAccount/add/add'
import RoleList from '@/pages/system/role/list/list'
import RoleAdd from '@/pages/system/role/add/add'
import Station from '@/pages/system/station/main'
import Customize from '@/pages/system/customize/main.js'
import MyMould from '@/pages/system/systemMould/main.js'
import Menu from '@/pages/system/menu/main/main'
import DistriButorList from '@/pages/distributor/list/list'
import DistriButorAdd from '@/pages/distributor/add/add'
import DistriButorEdit from '@/pages/distributor/add/add'
import MyTempMouldAdd from '@/pages/exchangepage/template/main.js'
import MyExChangeTemplate from '@/pages/exchangepage/mytemplate/main.js'
import CopyCode from '@/pages/exchangecode/copyCode/index'
import ExchangeCodeAdds from '@/pages/exchangecode/exchangecodeAdd'
import CouponList from '@/pages/coupon/list'
import Extension from "@/pages/extension/main/main";
import Overview from "@/pages/overview/main/main";
import Distributor from "@/pages/distributor/main/main";
import ExchangeCodeList from "@/pages/exchangecode/list/list";
import ExchangeCodeAdd from "@/pages/exchangecode/add/add";
import ExchangeCodeEdit from "@/pages/exchangecode/edit/edit";
import ExchangeCommodity from "@/pages/exchangecode/commodity/commodity";
import ProductEdit from "@/pages/exchangecode/commodity/goodedit.js";
import ExchangePage from "@/pages/exchangepage/main/main";
import OrderList from "@/pages/order/list/list";
import OrderDetails from "@/pages/order/more/more";
import OrderAdd from "@/pages/order/add/add";
import Plan from "@/pages/plan/main/main";
import PlanList from "@/pages/plan/list/list";
import PlanAdd from "@/pages/plan/add/add";
import PlanEdit from "@/pages/plan/add/edit";
import PlanEditCopy from "@/pages/plan/add/plan-copy";
import KeyList from "@/pages/plan/key/list";
import KeysList from "@/pages/plan/keyList";
import KeyOrderList from "@/pages/plan/keyorder/keyorder";
import KeyEdit from "@/pages/plan/key/edit.js";
import KeyDetail from "@/pages/plan/key/detail/list.js";
import KeyLog from "@/pages/plan/key/detail/log.js";
import AccountList from "@/pages/system/account/list/list";
import AccountAdd from "@/pages/system/account/add/add";
import SubAccountList from "@/pages/system/subAccount/list/list";
import SubAccountAdd from "@/pages/system/subAccount/add/add";
import RoleList from "@/pages/system/role/list/list";
import RoleAdd from "@/pages/system/role/add/add";
import Station from "@/pages/system/station/main";
import Customize from "@/pages/system/customize/main.js";
import MyMould from "@/pages/system/systemMould/main.js";
import Menu from "@/pages/system/menu/main/main";
import DistriButorList from "@/pages/distributor/list/list";
import DistriButorAdd from "@/pages/distributor/add/add";
import DistriButorEdit from "@/pages/distributor/add/add";
import MyTempMouldAdd from "@/pages/exchangepage/template/main.js";
import MyExChangeTemplate from "@/pages/exchangepage/mytemplate/main.js";
import CopyCode from "@/pages/exchangecode/copyCode/index";
import ExchangeCodeAdds from "@/pages/exchangecode/exchangecodeAdd";
import CouponList from "@/pages/coupon/list";
import CouponAddEdit from "@/pages/coupon/addEdit";
/* 基础路由 */
const router = [
{
path: '/home/extension',
path: "/home/extension",
component: Extension,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/overview',
path: "/home/overview",
component: Overview,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/distributor',
path: "/home/distributor",
component: Distributor,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/exchangepage',
path: "/home/exchangepage",
component: ExchangePage,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/mytempMould',
path: "/home/mytempMould",
component: MyTempMouldAdd,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/myexchangetemplate',
path: "/home/myexchangetemplate",
component: MyExChangeTemplate,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/order-list',
path: "/home/order-list",
component: OrderList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/order-addetails',
path: "/home/order-addetails",
component: OrderDetails,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/order-add',
path: "/home/order-add",
component: OrderAdd,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/plan',
path: "/home/plan",
component: Plan,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/plan-list',
path: "/home/plan-list",
component: PlanList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/plan-create',
path: "/home/plan-create",
component: PlanAdd,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/plan-edit',
path: "/home/plan-edit",
component: PlanEdit,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/plan-edit-copy',
path: "/home/plan-edit-copy",
component: PlanEditCopy,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/key-list',
path: "/home/key-list",
component: KeyList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/plan-keyList',
path: "/home/plan-keyList",
component: KeysList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/key-edit',
path: "/home/key-edit",
component: KeyEdit,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/key-detail',
path: "/home/key-detail",
component: KeyDetail,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/key-log',
path: "/home/key-log",
component: KeyLog,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/addkeyorder',
path: "/home/addkeyorder",
component: KeyOrderList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/account-add',
path: "/home/system/account-add",
component: AccountAdd,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/subaccount-list',
path: "/home/system/subaccount-list",
component: SubAccountList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/subaccount-add',
path: "/home/system/subaccount-add",
component: SubAccountAdd,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/role-list',
path: "/home/system/role-list",
component: RoleList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/role-add',
path: "/home/system/role-add",
component: RoleAdd,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/station',
path: "/home/system/station",
component: Station,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/customize',
path: "/home/system/customize",
component: Customize,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/menu',
path: "/home/system/menu",
component: Menu,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/my-mould',
path: "/home/system/my-mould",
component: MyMould,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/distributor-list',
path: "/home/distributor-list",
component: DistriButorList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/distributor-add',
path: "/home/distributor-add",
component: DistriButorAdd,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/distributor-edit',
path: "/home/distributor-edit",
component: DistriButorEdit,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/exchangecode-list',
path: "/home/exchangecode-list",
component: ExchangeCodeList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/exchangecode-add',
path: "/home/exchangecode-add",
component: ExchangeCodeAdd,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/exchangecode-edit',
path: "/home/exchangecode-edit",
component: ExchangeCodeEdit,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/exchangecode-copyCode',
path: "/home/exchangecode-copyCode",
component: CopyCode,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/exchange-addcommodity',
path: "/home/exchange-addcommodity",
component: ExchangeCommodity,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/product-edit',
path: "/home/product-edit",
component: ProductEdit,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/system/account-list',
path: "/home/system/account-list",
component: AccountList,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/exchangecode-exchangecodeAdd',
path: "/home/exchangecode-exchangecodeAdd",
component: ExchangeCodeAdds,
meta: { exact: true }
meta: { exact: true },
},
{
path: '/home/coupon-list',
path: "/home/coupon-list",
component: CouponList,
meta: { exact: true }
}
]
meta: { exact: true },
},
{
path: "/home/coupon-add-edit",
component: CouponAddEdit,
meta: { exact: true },
},
];
/* 不显示路由 */
const noShowSubMenu = [
'/home/extension',
'/home/overview',
'/home/plan-create',
'/home/mytempMould',
'/home/edittemplate'
]
"/home/extension",
"/home/overview",
"/home/plan-create",
"/home/mytempMould",
"/home/edittemplate",
];
export { router, noShowSubMenu }
export { router, noShowSubMenu };