Skip to content

J
jinfa-admin
Commit 5f89e4ab authored by Bill's avatar Bill
Browse files
Options

fix: 修改装修页，自定义组件

parent 0ad19413
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 280 additions and 113 deletions
config/routes/index.ts
View file @ 5f89e4ab
......@@ -109,7 +109,7 @@ const router = [
// ...routeList,
// merchantMarketingRoute,
// ruleSettingRoutes,
marketingRoutes,
// marketingRoutes,
// platformCouponManageRoute,
...asyncRoutes,
// purchaseBidRoute,
......
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/common/configs/index.tsx
View file @ 5f89e4ab
......@@ -19,7 +19,7 @@ const mallLayoutConfig: PageConfigType = {
"paddingBottom": "50px",
}
},
"childNodes": ["1", "2", "3", "4", "5"]
"childNodes": ["1", "2", "3", "4", "5", "23"]
},
};
......@@ -71,28 +71,19 @@ const activityContainer: PageConfigType = {
props: {
title: '活动推荐',
},
childNodes: ['3-1'],
// childNodes: ['3-1'],
childComponentName: "CommodityList.Item",
addBtnText: '添加'
addBtnText: '添加商品',
childProps: {
dataIndex: 'hotItem',
title: '活动推荐商品'
}
},
"3-1": {
dataIndex: 'hotItem',
componentName: 'CommodityList.Item',
title: '活动推荐商品',
props: {
// name: "轩妈家蛋黄酥6枚 雪媚娘糕点点心网红零食休闲小吃食品早餐下午茶",
// image: "https://img2.baidu.com/it/u=4073850171,2776482768&fm=26&fmt=auto&gp=0.jpg",
// mode:"horizonal",
// discountPrice:289.28,
// tags:[{
// type: 'purple',
// // icon: <TagOutlined />,
// name: "满300减20"
// }],
// buyBtn:false,
// originalPrice:300,
},
props: {},
},
"4": {
dataIndex: 'specialOffer',
......@@ -100,26 +91,27 @@ const activityContainer: PageConfigType = {
title: "促销组合",
props: {
title: '促销组合',
theme: 2,
},
childNodes: ["4-1"],
// addBtnText: '添加',
// childComponentName: "CommodityList.CommodityTab",
// childNodes: ["4-1"],
childComponentName: "CommodityList.CommodityTab",
addBtnText: '添加商品'
},
"4-1": {
componentName: 'CommodityList.CommodityTab',
props: {},
},
"5": {
dataIndex: 'plummet',
componentName: 'CommodityList',
title: '特价促销',
childComponentName: "CommodityList.Item",
addBtnText: '添加商品',
props: {
title: '特价促销',
theme: 1,
},
childNodes: ['5-1', "5-2"],
// childNodes: ['5-1'],
},
"5-1": {
componentName: 'CommodityList.Item',
......@@ -140,23 +132,17 @@ const activityContainer: PageConfigType = {
},
addBtnText: '添加'
},
"5-2": {
componentName: 'CommodityList.Item',
title: '活动推荐商品',
props: {
empty: "true",
},
addBtnText: '添加'
},
"6": {
dataIndex: 'discount',
componentName: 'CommodityList',
childComponentName: "CommodityList.Item",
addBtnText: '添加商品',
title: '折扣促销',
props: {
title: '折扣促销',
theme: 1
},
childNodes: ["6-1"]
// childNodes: ["6-1"]
},
"6-1": {
componentName: 'CommodityList.Item',
......@@ -167,12 +153,14 @@ const activityContainer: PageConfigType = {
"7": {
dataIndex: 'fullQuantitySub',
componentName: 'CommodityList',
childComponentName: "CommodityList.Item",
addBtnText: '添加商品',
title: '满量促销--满量减',
props: {
title: '满量促销--满量减',
theme: 1
},
childNodes: ["7-1"]
// childNodes: ["7-1"]
},
"7-1": {
componentName: 'CommodityList.Item',
......@@ -183,28 +171,31 @@ const activityContainer: PageConfigType = {
"8": {
dataIndex: 'fullQuantityDiscount',
componentName: 'CommodityList',
childComponentName: "CommodityList.Item",
addBtnText: '添加商品',
title: '满量促销--满量折',
props: {
title: '满量促销--满量折',
theme: 0
},
childNodes: ["8-1"]
// childNodes: ["8-1"]
},
"8-1": {
componentName: 'CommodityList.Item',
title: '满量促销--满量折',
props: {},
addBtnText: '添加'
},
"9": {
dataIndex: 'fullMoneySub',
componentName: 'CommodityList',
childComponentName: "CommodityList.Item",
addBtnText: '添加商品',
title: '满额促销--满额减',
props: {
title: '满额促销--满额减',
theme: 0
},
childNodes: ["9-1"]
// childNodes: ["9-1"]
},
"9-1": {
componentName: 'CommodityList.Item',
......@@ -215,12 +206,14 @@ const activityContainer: PageConfigType = {
"10": {
dataIndex: 'fullMoneyDiscount',
componentName: 'CommodityList',
childComponentName: "CommodityList.Item",
addBtnText: '添加商品',
title: '满额促销--满额折',
props: {
title: '满额促销--满额折',
theme: 0
},
childNodes: ["10-1"]
// childNodes: ["10-1"]
},
"10-1": {
componentName: 'CommodityList.Item',
......@@ -231,12 +224,14 @@ const activityContainer: PageConfigType = {
"11": {
dataIndex: 'giveProduct',
componentName: 'CommodityList',
childComponentName: "CommodityList.Item",
addBtnText: '添加商品',
title: '赠送促销--赠送商品(满额赠+买商品赠)',
props: {
title: '赠送促销--赠送商品(满额赠+买商品赠)',
theme: 0
},
childNodes: ["11-1"]
// childNodes: ["11-1"]
},
"11-1": {
componentName: 'CommodityList.Item',
......@@ -252,7 +247,7 @@ const activityContainer: PageConfigType = {
title: '赠送促销--赠送商品(满额赠+买商品赠)',
theme: 0
},
childNodes: ["12-1"]
// childNodes: ["12-1"]
},
"12-1": {
componentName: 'CommodityList.Item',
......@@ -268,7 +263,7 @@ const activityContainer: PageConfigType = {
title: '多件促销',
theme: 0
},
childNodes: ["13-1"]
// childNodes: ["13-1"]
},
"13-1": {
componentName: 'CommodityList.Item',
......@@ -284,7 +279,7 @@ const activityContainer: PageConfigType = {
title: '组合促销',
theme: 0
},
childNodes: ["14-1"]
// childNodes: ["14-1"]
},
"14-1": {
componentName: 'CommodityList.Item',
......@@ -300,7 +295,7 @@ const activityContainer: PageConfigType = {
title: '拼团',
theme: 0
},
childNodes: ["15-1"]
// childNodes: ["15-1"]
},
"15-1": {
componentName: 'CommodityList.Item',
......@@ -316,7 +311,7 @@ const activityContainer: PageConfigType = {
title: '砍价',
theme: 1
},
childNodes: ["16-1"]
// childNodes: ["16-1"]
},
"16-1": {
componentName: 'CommodityList.Item',
......@@ -332,7 +327,7 @@ const activityContainer: PageConfigType = {
title: '组合促销',
theme: 0
},
childNodes: ["17-1"]
// childNodes: ["17-1"]
},
"17-1": {
componentName: 'CommodityList.Item',
......@@ -348,7 +343,7 @@ const activityContainer: PageConfigType = {
title: '换购-满额换购',
theme: 0
},
childNodes: ["18-1"]
// childNodes: ["18-1"]
},
"18-1": {
componentName: 'CommodityList.Item',
......@@ -364,7 +359,7 @@ const activityContainer: PageConfigType = {
title: '组合促销',
theme: 0
},
childNodes: ["19-1"]
// childNodes: ["19-1"]
},
"19-1": {
componentName: 'CommodityList.Item',
......@@ -380,7 +375,7 @@ const activityContainer: PageConfigType = {
title: '预售',
theme: 0
},
childNodes: ["20-1"]
// childNodes: ["20-1"]
},
"20-1": {
componentName: 'CommodityList.Item',
......@@ -396,7 +391,7 @@ const activityContainer: PageConfigType = {
title: '套餐',
theme: 0
},
childNodes: ["21-1"]
// childNodes: ["21-1"]
},
"21-1": {
componentName: 'CommodityList.Item',
......@@ -412,7 +407,7 @@ const activityContainer: PageConfigType = {
title: '试用',
theme: 0
},
childNodes: ["22-1"]
// childNodes: ["22-1"]
},
"22-1": {
componentName: 'CommodityList.Item',
......@@ -422,6 +417,34 @@ const activityContainer: PageConfigType = {
},
};
const customizeActiveProducts: PageConfigType = {
"23": {
componentName: 'WrapCommodityList',
title: '自定义区域',
dataIndex: 'suggestProduct',
// childNodes: ["23-1"],
childComponentName: "CommodityList",
addBtnText: '添加活动',
},
"23-1": {
componentName: 'CommodityList',
addBtnText: '添加商品',
childComponentName: "CommodityList.Item",
title: 'test',
props: {
title: 'test',
theme: 0
},
// childNodes: ["23-1-1"]
},
"23-1-1": {
componentName: 'CommodityList.Item',
title: '试用-商品',
props: {},
addBtnText: '添加'
},
};
......@@ -429,7 +452,8 @@ const configs = {
...mallLayoutConfig,
...divWrap,
...couponContainer,
...activityContainer
...activityContainer,
...customizeActiveProducts,
};
export default configs;
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/common/configs/schema.ts
View file @ 5f89e4ab
......@@ -12,7 +12,7 @@ const View: ComponentSchemaType = {
const Advertisement: ComponentSchemaType = {
propsConfig: {
componentType: {
type: "Advertisement",
type: "Advertisement" as any,
},
imageUrl: {
label: '图片链接',
......@@ -98,8 +98,19 @@ const CommodityList = {
}
};
const WrapCommodityList = {
WrapCommodityList: {
propsConfig: {
componentType: {
type: "WrapCommodityList",
},
}
}
};
export default {
Commodity,
WrapCommodityList,
Advertisement,
...Coupon,
View,
......
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/common/hooks/useGetData.tsx
View file @ 5f89e4ab
......@@ -5,7 +5,6 @@ import cloneDeep from 'lodash/cloneDeep';
import { PublicApi } from '@/services/api';
import { PostMarketingCouponPlatformActivityPageSelectDetailResponse } from '@/services/MaketingV2Api';
import mock from '../mock/index.json';
import dataMock from '../mock/data.json';
type PageConfigType = {
[key: string]: {
......@@ -80,15 +79,38 @@ const SERVICE_MAP = {
products: res,
};
}
},
"suggestProduct": {
prefixFormat: (data) => {
const postData = data.reduce((prev, current) => {
prev = prev.concat(
current.childrenData.map((_item) => {
return _item.id;
}
));
return prev;
}, []);
return { ids: postData };
},
service: PublicApi.getMarketingPlatformActivityGoodsAdorn,
propsName: 'products',
format: (res) => {
return {
products: res,
};
}
}
};
const ACTIVITYS = ["specialOffer", "plummet", "discount", "fullQuantitySub", "fullQuantityDiscount", "fullMoneySub", "fullMoneyDiscount", "giveProduct", "giveCoupon", "morePiece", "combination", "groupPurchase", "bargain", "secKill", "fullSwap", "buySwap", "preSale", "setMeal", "attempt"];
function useGetData(pageConfig: PageConfigType) {
const [dataSource, setDataSource] = useState<null | DataSourceType>(null);
const [loading, setLoading] = useState<boolean>(true);
// const [pageConfigData, setPageConfigData] = useState(pageConfig);
const [modules, setModules] = useState({});
useEffect(() => {
async function fetchData() {
......@@ -134,6 +156,7 @@ function useGetData(pageConfig: PageConfigType) {
});
const newSortChild: string[] = [];
const newModule = {};
/** _item: "top" | "coupon" | string */
for (const _item of sortedArray) {
if(prevSortMap[_item]) {
......@@ -144,15 +167,21 @@ function useGetData(pageConfig: PageConfigType) {
...props,
...targetPageConfig.props,
};
if (ACTIVITYS.includes(_item)) {
newModule[_item] = {
title: props?.title || _item,
visible: props?.visible,
};
}
/** 如果包含children， 那么給他的children 设置props, @toReview 只支持一层 */
if (typeof sortedChildren[_item].props.children !== 'undefined') {
if (typeof sortedChildren[_item].props.childrenData !== 'undefined') {
/** 先拿一层儿子的config */
const defaultChildConfig = newPageConfig[`${current}-1`];
const newChildKeys: string[] = [];
const { service = null, format, prefixFormat, propsName } = SERVICE_MAP[_item] || {};
/** @request */
if (service && sortedChildren[_item]?.props?.children?.length > 0) {
const postData = prefixFormat && prefixFormat(sortedChildren[_item].props.children);
if (service && sortedChildren[_item]?.props?.childrenData?.length > 0) {
const postData = prefixFormat && prefixFormat(sortedChildren[_item].props.childrenData);
const { data, code } = await service(postData, {ctlType: 'none'});
if (code === 1000) {
const formatedData = format(data);
......@@ -163,8 +192,7 @@ function useGetData(pageConfig: PageConfigType) {
}
}
sortedChildren[_item].props.children?.forEach((_row, _index: number) => {
sortedChildren[_item].props.childrenData?.forEach((_row, _index: number) => {
if (typeof newPageConfig[`${current}-${_index + 1}`] === 'undefined') {
newPageConfig[`${current}-${_index + 1}`] = {
...defaultChildConfig,
......@@ -172,11 +200,35 @@ function useGetData(pageConfig: PageConfigType) {
};
}
const childrenProps = newPageConfig[`${current}-${_index + 1}`].props;
const requestData = typeof _row.childrenData === 'undefined' ? newPageConfig[`${current}`]?.props?.[propsName]?.[_index] || {} : { [propsName]: newPageConfig[`${current}`]?.props?.[propsName]};
newPageConfig[`${current}-${_index + 1}`].props = {
...childrenProps,
..._row,
...newPageConfig[`${current}`]?.props?.[propsName]?.[_index] || {},
...requestData,
};
/** 这里不考虑扩展递归情况， 直接写死算了@toReview 有时间再优化 */
if (typeof _row.childrenData !== 'undefined') {
const copyConfig = newPageConfig[`${current}-1-1`];
const tempChildrenKeys: any = [];
_row.childrenData.forEach((_record, _childrenIndex) => {
if (typeof newPageConfig[`${current}-${_index + 1}-${_childrenIndex + 1}`] === 'undefined') {
newPageConfig[`${current}-${_index + 1}-${_childrenIndex + 1}`] = {
...copyConfig,
props: {}
};
}
const tempProps = newPageConfig[`${current}-${_index + 1}-${_childrenIndex + 1}`].props;
newPageConfig[`${current}-${_index + 1}-${_childrenIndex + 1}`].props = {
...tempProps,
..._record,
...newPageConfig[`${current}`]?.props?.[propsName]?.[_index] || {},
};
tempChildrenKeys.push(`${current}-${_index + 1}-${_childrenIndex + 1}`);
});
newPageConfig[`${current}-${_index + 1}`].childNodes = tempChildrenKeys;
}
newChildKeys.push(`${current}-${_index + 1}`);
});
if(newChildKeys.length > 0) {
......@@ -187,20 +239,18 @@ function useGetData(pageConfig: PageConfigType) {
newSortChild.push(current);
}
}
// sortedArray.forEach((_item: "top" | "coupon" | string) => {
// });
/** 添加剩余的子节点进去 */
const restNode = childrenNodes?.filter((_item) => !newSortChild.includes(_item));
newPageConfig[0]["childNodes"] = newSortChild.concat(restNode as string[]);
// setPageConfigData(newPageConfig);
setLoading(false);
setModules(newModule);
updatePageConfig(newPageConfig);
}
setPageConfigData();
}, [dataSource]);
return { dataSource, loading};
return { dataSource, loading, modules};
}
export default useGetData;
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/common/mock/index.json
View file @ 5f89e4ab
......@@ -3,7 +3,7 @@
"sort":1,
"props": {
"theme":0,
"visible": "true",
"visible": 1,
"imageUrl": "https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/f1554b3d35c9419b8b9fa0efbd0965721610953764867.png"
}
},
......@@ -12,7 +12,7 @@
"props": {
"theme":0,
"visible": 1,
"children": [
"childrenData": [
{"id": 4, "type": 1},
{"id": 57, "type": 2}
]
......@@ -23,18 +23,18 @@
"props": {
"theme":0,
"visible": 1,
"children": [22]
"childrenData": [22]
}
},
"specialOffer":{
"sort":4,
"props": {
"theme":2,
"visible": 1,
"visible": 0,
"title":"特价促销",
"explain":"爆款限时特价",
"icon":"xxx.png",
"children": [1]
"childrenData": [1]
}
},
"plummet":{
......@@ -45,7 +45,7 @@
"title":"直降促销",
"explain":"大牌商品最高直降100元",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children": [1, 2, 3]
"childrenData": [1, 2, 3]
}
},
"discount":{
......@@ -56,7 +56,7 @@
"title":"折扣促销",
"explain":"大牌商品低至5折起",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children": [1, 2, 3]
"childrenData": [1, 2, 3]
}
},
"fullQuantitySub":{
......@@ -67,7 +67,7 @@
"title":"满量促销--满量减",
"explain":"大牌商品多买最高减100元",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children": [1]
"childrenData": [1]
}
},
"fullQuantityDiscount":{
......@@ -78,7 +78,7 @@
"title":"满量促销--满量折",
"explain":"大牌商品多买最高5折起",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children": [1]
"childrenData": [1]
}
},
"fullMoneySub":{
......@@ -88,7 +88,7 @@
"title":"满额促销--满额减",
"explain":"大牌商品买满299元最高减100元",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children": [1]
"childrenData": [1]
}
},
"fullMoneyDiscount":{
......@@ -99,7 +99,7 @@
"title":"满额促销--满额折",
"explain":"大牌商品买满199元最高5折起",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children": [1]
"childrenData": [1]
}
},
"giveProduct":{
......@@ -110,7 +110,7 @@
"title":"赠送促销--赠送商品(满额赠+买商品赠)",
"explain":"买满199元即有机会获赠以下商品",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"giveCoupon":{
......@@ -121,7 +121,7 @@
"title":"赠送促销--赠送优惠劵(满额赠+买商品赠)",
"explain":"买满199元即有机会获赠以下商品",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"morePiece":{
......@@ -132,7 +132,7 @@
"title":"多件促销",
"explain":"以下商品第二件5折起",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"combination":{
......@@ -143,7 +143,7 @@
"title":"组合促销",
"explain":"任选3件，只需99元",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"groupPurchase":{
......@@ -154,7 +154,7 @@
"title":"拼团",
"explain":"时令水果拼团专场",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"bargain":{
......@@ -165,7 +165,7 @@
"title":"砍价",
"explain":"砍一砍，免费拿",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"secKill":{
......@@ -176,7 +176,7 @@
"title":"秒杀",
"explain":"今日大牌秒杀",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"fullSwap":{
......@@ -187,7 +187,7 @@
"title":"换购-满额换购",
"explain":"买满199元即可换购下面商品",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"buySwap":{
......@@ -198,7 +198,7 @@
"title":"换购-买商品换购",
"explain":"买了这台苹果18元即可换购下面商品",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"preSale":{
......@@ -209,7 +209,7 @@
"title":"预售",
"explain":"大牌新品火爆预售",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"setMeal":{
......@@ -220,7 +220,7 @@
"title":"套餐",
"explain":"超级搭配套餐",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"attempt":{
......@@ -231,7 +231,22 @@
"title":"试用",
"explain":"大牌新品免费试用",
"icon":"https://shushangyun-lingxi.oss-cn-shenzhen.aliyuncs.com/7a7edf5a086346c2bc6f7c123181023a1611024003828.png",
"children":[1]
"childrenData":[1]
}
},
"suggestProduct":{
"sort":23,
"props": {
"theme":0,
"visible":true,
"childrenData":[
{
"title":"应季爆款1",
"childrenData": [
{"id": 22, "label":["特价", "满299减30"]}
]
}
]
}
}
}
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/components/ActivityAreaSetting/index.tsx
View file @ 5f89e4ab
......@@ -62,6 +62,10 @@ const ActivityAreaSetting: React.FC<Iprops> = (props: Iprops) => {
getListType();
}, []);
const handleInputChange = (e) => {
setInnerTitle(e.target.value);
};
const onSelectedChange = (value: number) => {
setSelectedType(value);
};
......@@ -70,7 +74,6 @@ const ActivityAreaSetting: React.FC<Iprops> = (props: Iprops) => {
if (!visible) {
return;
}
console.log(products);
setInnerProducts(products as any);
}, [visible, products]);
......@@ -88,13 +91,13 @@ const ActivityAreaSetting: React.FC<Iprops> = (props: Iprops) => {
const onConfirm = () => {
const selectedKey = selectedInfo.selectedKey;
const { theme } = selectedInfo.props;
const elements: any = innerProducts.map((_item, index) => {
return {
key: `${selectedKey}-${index + 1}`,
title: _item.productName,
props: _item,
componentName: 'CommodityList.Item'
componentName: theme === 2 ? 'CommodityList.CommodityTab' : 'CommodityList.Item'
};
});
resetCurrentComponent({
......@@ -106,18 +109,9 @@ const ActivityAreaSetting: React.FC<Iprops> = (props: Iprops) => {
products: innerProducts,
},
});
// changeProps({
// props: {
// ...rest,
// children: innerProducts.map((_item) => _item.id),
// products: innerProducts,
// },
// });
};
const onRemove = (data: { id: number, activityId: number }) => {
console.log(data);
const newData = innerProducts.filter((_item) => (_item.activityId !== data.activityId || _item.id !== data.id));
setInnerProducts(newData);
};
......@@ -130,7 +124,7 @@ const ActivityAreaSetting: React.FC<Iprops> = (props: Iprops) => {
<div className={styles.container}>
<div className={styles.name}>
<span className={styles.label}>名称</span>
<Input value={innerTitle} />
<Input value={innerTitle} onChange={handleInputChange} />
</div>
{
withTypeSelect && (
......
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/components/ComponentTree/ComponentModule.tsx
View file @ 5f89e4ab
import React from 'react';
import React, { useEffect, useState } from 'react';
import { Switch } from 'antd';
const ComponentModule = () => {
interface Iprops {
image?: React.ReactNode,
title: string,
visible: boolean,
onChange?: ((checked: boolean) => void) | null
}
const ComponentModule: React.FC<Iprops> = (props: Iprops) => {
const { image, title, visible, onChange = null, } = props;
const [innerVisible, setInnerVisible] = useState<boolean>(false);
useEffect(() => {
setInnerVisible(visible);
}, [visible])
const handleChange = (checked: boolean) => {
onChange?.(checked);
};
return (
<div style={{ height: '160px', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center'}}>
<img style={{width: '24px', height: '24px'}} />
<div style={{margin: '8px 0'}}>特价促销</div>
<div style={{margin: '8px 0'}}>{title}</div>
<div>
<Switch size="small" />
<Switch size="small" checked={innerVisible} onChange={handleChange} />
</div>
</div>
);
......
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/components/Layouts/CommodityList/index.tsx
View file @ 5f89e4ab
......@@ -39,7 +39,10 @@ const CommodityList: React.FC<Iprops> & { Item: typeof CommodityItem, CommodityT
<div className={styles.twoColumns}>
{
React.Children.map(children, (_child: any) => {
return React.cloneElement(_child, {..._child.props, customizeClassName: styles.commodityItem, mode: 'vertical'});
if (_child === null) {
return null;
}
return React.cloneElement(_child, {..._child?.props || {}, customizeClassName: styles.commodityItem, mode: 'vertical'});
})
}
</div>
......@@ -51,6 +54,9 @@ const CommodityList: React.FC<Iprops> & { Item: typeof CommodityItem, CommodityT
<div>
{
React.Children.map(children, (_child: any) => {
if (_child === null) {
return null;
}
return React.cloneElement(_child, {..._child.props});
})
}
......
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/components/Layouts/WrapCommodityList/index.tsx 0 → 100644
View file @ 5f89e4ab
import React, { useState } from 'react';
import cx from 'classnames';
import _omit from 'lodash/omit';
interface Iprops {
className: any,
children: any
}
const WrapCommodityList: React.FC<Iprops> = (props: Iprops) => {
const { children, className, ...other } = props;
const classNameStr = cx(className);
const { onClick, onDrag, onDragEnd, onDragEnter, onDragStart, onMouseOver, getOperateState } = other as any;
const divProps = {
onClick, onDrag, onDragEnd, onDragEnter, onDragStart, onMouseOver, getOperateState,
};
const renderComponent = () => {
return (
<div>
{
React.Children.map(children, (_child: any) => {
console.log(_child);
return React.cloneElement(_child, {title: '123', ..._child.props || {}});
})
}
</div>
);
};
return (
<div className={classNameStr} {...divProps}>
{
renderComponent()
}
</div>
);
};
export default WrapCommodityList;
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/components/Layouts/index.tsx
View file @ 5f89e4ab
import Advertisement from './Advertisement';
import Coupon from './Coupon';
import CommodityList from './CommodityList';
import WrapCommodityList from './WrapCommodityList';
export default {
Advertisement,
Coupon,
CommodityList
CommodityList,
WrapCommodityList
};
src/pages/marketing/marketingActivitiesManagement/activePage/fixtures/index.tsx
View file @ 5f89e4ab
import React from 'react';
import React, { useEffect } from 'react';
import { Spin, message , Tabs } from 'antd';
import { BrickProvider, ModuleTree, useSelector } from '@lingxi-disign/react';
// import MobileDesignPanel from '@/pages/pageCustomized/components/MobileDesignPanel';
......@@ -28,9 +28,15 @@ interface Iprops {
}
const Fixtures: React.FC<Iprops> = (props: Iprops) => {
const { dataSource, loading } = useGetData(componentConfigs as any);
const { dataSource, loading, modules } = useGetData(componentConfigs as any);
console.log(modules);
const onModuleVisibleChange = (checked) => {
console.log(checked);
}
return (
<Spin spinning={false}>
<Spin spinning={loading}>
<BrickProvider
config={configs}
warn={(msg: string) => {
......@@ -49,10 +55,11 @@ const Fixtures: React.FC<Iprops> = (props: Iprops) => {
<TabPane tab="全部模块" key="2">
<div className={styles.module}>
{
[1,2,3].map((_item) => {
Object.keys(modules).map((_item) => {
const { visible, title } = modules[_item];
return (
<div className={styles.moduleItem} key={_item}>
<ComponentModule />
<ComponentModule title={title} visible={visible} onChange={onModuleVisibleChange} />
</div>
);
})
......@@ -63,9 +70,7 @@ const Fixtures: React.FC<Iprops> = (props: Iprops) => {
</div>
<div className={styles['app-wrapper']}>
<div className={styles['app-canvas-container']}>
<MobileDesignPanel theme={'theme-mall-science'} onlyEidt />
</div>
</div>
<EditPanel />
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment