Commit e578bcdf authored by 前端-许佳敏's avatar 前端-许佳敏
parents 2cfb8c6a 494d5a58
registry="http://npm.shushangyun.com"
registry = "https://registry.npmjs.org/"
@linkseeks:registry="http://npm.shushangyun.com"
......@@ -63,7 +63,7 @@
"@linkseeks/design-core": "^1.0.0",
"@linkseeks/design-react": "^1.0.2",
"@linkseeks/design-react-web": "^1.0.0",
"@linkseeks/design-ui": "^1.0.9",
"@linkseeks/design-ui": "^1.0.11",
"@linkseeks/design-utils": "^1.0.0",
"@linkseeks/god": "^1.0.0",
"@types/crypto-js": "^4.0.1",
......
......@@ -102,9 +102,9 @@ const CommodityList = {
"CommodityList.SwapProduct": {
propsConfig: {}
},
"CommodityList.CombineSale": {
propsConfig: {}
},
// "CommodityList.CombineSale": {
// propsConfig: {}
// },
"CommodityList.FlashSale": {
propsConfig: {}
}
......
......@@ -80,10 +80,26 @@ const useGetSameKeys = () => {
result[dataIndex] = [];
}
if (dataIndex === 'combination') {
/** combination 单独处理, 这里不使用递归了 */
childNodes?.forEach((_son, _index) => {
const sonElement = pageConfig[_son];
result[`combination_${_index}`] = [];
sonElement?.childNodes?.forEach((_row) => {
const rowData = pageConfig[_row];
result[`combination_${_index}`].push(
`${rowData?.props?.id}_${rowData?.props?.activityId}`
);
});
});
return;
}
if (dataIndex !== 'suggestProduct') {
childNodes?.forEach((_son) => {
const sonElement = pageConfig[_son];
const formatedData = formatProps[dataIndex]?.(sonElement.props);
const formatedData = formatProps[dataIndex]?.(sonElement.props || {});
if (formatProps) {
result[dataIndex].push(formatedData);
}
......
......@@ -102,7 +102,7 @@ function useSaveData(options: Options) {
childrenData: childrenData
}
});
} else if (ACTIVITY_LIST.includes( dataIndex as ACTIVITY_KEYS )) {
} else if (ACTIVITY_LIST.includes( dataIndex as ACTIVITY_KEYS ) && dataIndex !== 'combination') {
const { ...otherProps } = props || {};
const childrenData = childNodes.map((_record) => {
const childTargetProps = pageConfig[_record].props;
......@@ -117,31 +117,37 @@ function useSaveData(options: Options) {
childrenData: childrenData
}
});
} else if (dataIndex === 'suggestProduct') {
} else if (dataIndex === 'suggestProduct' || dataIndex === 'combination') {
const { ...otherProps } = props || {};
const { childNodes } = target;
const temp = {
sort: sort,
props: {
visible: otherProps.status ?? true,
title: otherProps.title,
childrenData: childNodes?.filter((_record) => /\d+-\d+/.test(_record)).map((_row) => {
const childrenNodeTarget = pageConfig[_row];
const { ...childRestProps } = childrenNodeTarget?.props;
return {
title: childRestProps.title,
theme: childRestProps.theme || 0,
childrenData: childrenNodeTarget.childNodes?.map((_listItem) => {
const childrenData = childrenNodeTarget.childNodes?.map((_listItem) => {
const sonNodeTarget = pageConfig[_listItem];
if (dataIndex === 'suggestProduct') {
return {
id: sonNodeTarget?.props.id,
label: sonNodeTarget?.props?.label || []
};
}
return sonNodeTarget?.props.id
})
return {
title: childRestProps.title,
theme: childRestProps.theme || 0,
childrenData: childrenData
};
})
}
};
result = generaterData(result, 'suggestProduct', temp);
result = generaterData(result, dataIndex, temp);
}
});
const withThemeStyle = {
......
import React, { useEffect, useState } from 'react';
import { Switch } from 'antd';
import { useSelector } from '@linkseeks/design-react';
interface Iprops {
image?: string,
title: string,
visible: boolean,
onChange?: ((checked: boolean, option: { dataIndex: string, treeKey: string, }) => void) | null,
dataIndex: string,
treeKey: string
}
const ComponentModule: React.FC<Iprops> = (props: Iprops) => {
const { image, title, visible, onChange = null, dataIndex, treeKey } = props;
const [innerVisible, setInnerVisible] = useState<boolean>(false);
const { pageConfig } = useSelector(['pageConfig']);
useEffect(() => {
setInnerVisible(visible);
}, [visible]);
const handleChange = (checked: boolean) => {
const props = pageConfig[treeKey].props;
onChange?.(checked, { dataIndex: dataIndex, treeKey: treeKey, props });
};
return (
<div style={{ height: '160px', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center'}}>
<img style={{width: '24px', height: '24px'}} src={image} />
<div style={{margin: '8px 0'}}>{title}</div>
<div>
<Switch size="small" checked={innerVisible} onChange={handleChange} />
</div>
</div>
);
};
export default ComponentModule;
import React, { useMemo } from 'react';
import { useSelector, changeProps } from '@linkseeks/design-react';
import ComponentModule from './ComponentModule';
import styles from './index.less';
import attemptImg from '@/asserts/activity/attempt.png';
import bargainImg from '@/asserts/activity/bargain.png';
import buySwapImg from '@/asserts/activity/buySwap.png';
import combinationImg from '@/asserts/activity/combination.png';
import fullMoneyDiscountImg from '@/asserts/activity/fullMoneyDiscount.png';
import fullMoneySubImg from '@/asserts/activity/fullMoneySub.png';
import fullQuantityDiscountImg from '@/asserts/activity/fullQuantityDiscount.png';
import fullQuantitySubImg from '@/asserts/activity/fullQuantitySub.png';
import fullSwapImg from '@/asserts/activity/fullSwap.png';
import giveProductImg from '@/asserts/activity/giveProduct.png';
import groupPurchaseImg from '@/asserts/activity/groupPurchase.png';
import morePieceImg from '@/asserts/activity/morePiece.png';
import plummetImg from '@/asserts/activity/plummet.png';
import preSaleImg from '@/asserts/activity/preSale.png';
import secKillImg from '@/asserts/activity/secKill.png';
import setMealImg from '@/asserts/activity/setMeal.png';
import discountImg from '@/asserts/activity/discount.png';
import specialOfferImg from '@/asserts/activity/specialOffer.png';
import giveCouponImg from '@/asserts/activity/giveCoupon.png';
const ACTIVITYS = ["specialOffer", "plummet", "discount", "fullQuantitySub", "fullQuantityDiscount", "fullMoneySub", "fullMoneyDiscount", "giveProduct", "giveCoupon", "morePiece", "combination", "groupPurchase", "bargain", "secKill", "fullSwap", "buySwap", "preSale", "setMeal", "attempt"];
type ModuleType = {
title: string,
visible: boolean,
dataIndex: string,
treeKey: string,
}
const ModuleContainer = () => {
const { pageConfig } = useSelector(['pageConfig']);
const modules = useMemo(() => {
const config = pageConfig;
const res: ModuleType[] = [];
Object.keys(config).forEach((_item) => {
const { props = {} } = config[_item];
const dataIndex = config[_item]?.otherProps?.type;
if (ACTIVITYS.includes(dataIndex)) {
const visible = typeof props.visible === 'undefined' ? true : (props as any)?.visible;
res.push({
title: (props as any)?.title || _item,
visible: visible,
dataIndex: dataIndex,
treeKey: _item,
});
}
});
return res;
}, [pageConfig]);
const onModuleVisibleChange = (checked: boolean, option) => {
const props = pageConfig[option.treeKey];
changeProps({
treeKey: option.treeKey,
props: {
...props,
visible: checked
}
});
};
const imgMap = {
"attempt": attemptImg,
"bargain": bargainImg,
"buySwap": buySwapImg,
"combination": combinationImg,
"fullMoneyDiscount": fullMoneyDiscountImg,
"fullMoneySub": fullMoneySubImg,
"fullQuantityDiscount": fullQuantityDiscountImg,
"fullQuantitySub": fullQuantitySubImg,
"fullSwap": fullSwapImg,
"giveProduct": giveProductImg,
"groupPurchase": groupPurchaseImg,
"morePiece": morePieceImg,
"plummet": plummetImg,
"preSale": preSaleImg,
"secKill": secKillImg,
"setMeal": setMealImg,
"discount": discountImg,
"specialOffer": specialOfferImg,
"giveCoupon": giveCouponImg,
};
return (
<div className={styles.module}>
{
modules.map((_item) => {
const { visible, title, dataIndex } = _item;
return (
<div className={styles.moduleItem} key={dataIndex}>
<ComponentModule image={imgMap[dataIndex]} treeKey={_item.treeKey} title={title} visible={visible} onChange={onModuleVisibleChange} dataIndex={dataIndex} />
</div>
);
})
}
</div>
);
};
export default ModuleContainer;
......@@ -208,8 +208,8 @@ const COMPONENT_NAME = {
// combination: "Combination",
[ACTIVITY_COMBINATION]: {
mobile: {
container: 'Combination',
childContainer: 'Combination.Item'
container: 'CommodityList',
childContainer: 'Combination'
},
web: {
container: 'WebCommodityContainer',
......@@ -348,6 +348,38 @@ const WebComponentModule: React.FC<Iprops> = (props: Iprops) => {
const newKey = childNodes[childNodes.length - 1] + 1
if (platform === 'mobile' && _item === 'combination') {
addChildComponent({
newKey: `${newKey}`,
componentName: COMPONENT_NAME[_item][platform]['container'],
parentPropName: '',
parentKey: '0',
childProps: {
addBtnText: "添加子节点",
canDelete: true,
childComponentName: COMPONENT_NAME[_item][platform]['childContainer'],
childNodes: [],
childProps: {
addBtnText: "添加组合促销节点",
canDelete: true,
childComponentName: 'Combination.Item',
otherProps: {
type: `combinationItemProduct`
},
childProps: {
otherProps: {
type: `combinationItem`
},
}
},
otherProps: { type: _item },
props: {visible: true, theme: 0, title: ACTIVITYS_MAP[_item].title},
title: ACTIVITYS_MAP[_item].title,
}
})
return;
}
addChildComponent({
newKey: `${newKey}`,
componentName: COMPONENT_NAME[_item][platform]['container'],
......
......@@ -93,6 +93,11 @@ const EditPanelForm = () => {
}
const componentType = (selectedInfo as any)?.otherProps?.type;
if (componentType === 'combinationItemProduct') {
handleOnClose();
return;
}
const propsMapToValue = {
top: {
imageUrl: [{ name: '广告图', url: selectedInfo?.props?.imageUrl }]
......@@ -139,14 +144,18 @@ const EditPanelForm = () => {
const activityType = ACTIVITY_MAP[componentType] ? { activityType: ACTIVITY_MAP[componentType] } : {};
const isWithLabels = componentType === 'suggestProductItem' ? { isWithLabels: true } : { isWithLabels: false };
const isWithMinType = minTypeToOne.includes(componentType) ? 1 : minTypeToTwo.includes(componentType) ? 2 : null
console.log("isWithMinType", isWithMinType);
// console.log(hotItem".substring(0, 1));
formActions.setFieldState('product', (fieldState) => {
const [, parentKey] = selectedInfo.parentKey.split('-');
const disabledKeys = componentType === 'suggestProductItem'
? sameKeys[`suggestProduct_${parseInt(parentKey) - 1}`]
: componentType === 'combinationItem'
? sameKeys[`combination_${parseInt(parentKey) - 1}`]
: sameKeys[`${componentType?.substring(0, componentType.length - 4)}`] || [];
FormPath.setIn(fieldState, 'props.x-component-props', {
activityImage: activityImage,
...activityType,
disabledKeys: componentType === 'suggestProductItem' ? sameKeys[`suggestProduct_${parseInt(parentKey) - 1}`] : sameKeys[`${componentType?.substring(0, componentType.length - 4)}`] || [],
disabledKeys: disabledKeys,
...isWithLabels,
minType: isWithMinType,
});
......
.combiantion {
margin-top: 24px;
padding: 0 8px;
margin-bottom: 12px;
padding: 0 0px;
.title {
font-size: 20px;
color: #fff;
......
......@@ -18,7 +18,10 @@ const Combination: React.FC<Iprops> & { Item: typeof CombinationItem } = (props:
const { children, className, title, theme, status = true, ...other } = props;
const visible = status
const classNameStr = cx(styles.combiantion, className, { [styles.hide]: !visible });
const { onClick, onMouseOver, getOperateState } = props as any;
const divProps = {
onClick, onMouseOver
};
// const { onClick, onDrag, onDragEnd, onDragEnter, onDragStart, onMouseOver, getOperateState } = other as any;
const count = React.Children.count(children);
const renderChildren = () => {
......@@ -37,8 +40,8 @@ const Combination: React.FC<Iprops> & { Item: typeof CombinationItem } = (props:
};
return (
<div className={classNameStr} {...other}>
<p className={styles.title}>{title}</p>
<div className={classNameStr} {...divProps}>
{/* <p className={styles.title}>{title}</p> */}
<div className={styles.container}>
<div className={styles['container-title']}>以下商品认选2件,只需800元</div>
{renderChildren()}
......
.commodityGroupEmpty {
min-height: 430px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 12px;
border: 1px dashed #C8CACD;
}
.section {
// padding: 12px;
background: #fff;
border-radius: 8px;
margin-bottom: 8px;
.mainCommodity {
padding: 4px;
}
.content {
padding: 0 12px 12px 12px;
.title {
color: #252D37;
font-size: 16px;
font-weight: 600;
margin-bottom: 14px;
}
}
.list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-right: -12px;
.item {
padding-right: 12px;
flex-basis: 33.33%;
}
}
}
import React, { useMemo } from 'react';
import { Commodity, Progress } from '@linkseeks/design-ui';
import { identifier } from '@babel/types';
import { PlusOutlined } from '@ant-design/icons';
import cs from 'classnames';
import styles from './combineSale.less';
import TabFooter from './tabFooter';
interface Iprops {
className: string,
onClick: () => void,
onDrag: () => void,
onDragEnd: () => void,
onDragEnter: () => void,
onDragStart: () => void,
onMouseOver: () => void,
draggable?: boolean,
getOperateState: any,
productImgUrl?: string,
productName?: string,
productId?: number,
id?: number,
price?: number,
activityPrice?: number,
}
const CombineSale: React.FC<Iprops> = (props: Iprops) => {
const { className, onClick, onDrag, onDragEnd, onDragEnter, onDragStart, onMouseOver, ...other } = props;
const divProps = {
onClick, onDrag, onDragEnd, onDragEnter, onDragStart, onMouseOver,
};
const isEmpty = useMemo(() => other.id, [other]);
if (!isEmpty) {
return (
<div className={cs(styles.commodityGroupEmpty, className)} {...divProps}>
<div><PlusOutlined style={{color: '#C8CACD'}} /></div>
</div>
);
}
return (
<div className={className} {...divProps}>
<div className={styles.section}>
<div className={styles.mainCommodity}>
<Commodity
name={other.productName}
image={other.productImgUrl}
mode="horizontal"
discountPrice={other.activityPrice}
tags={["组合促销"]}
buyBtn={false}
/>
</div>
<div className={styles.content}>
<div className={styles.title}>超值换购区(3选1)</div>
<div className={styles.list}>
{
[1].map((_item) => {
return (
<div className={styles.item} key={_item}>
<Commodity
name={"例子: 后端数据未确定"}
image={"https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/src=http___photo.16pic.com_00_49_30_16pic_4930729_b.jpg&refer=http___photo.16picd098747f66234351b47d95ab5fc16f90.jpg"}
mode="vertical"
footer={<div></div>}
tags={["满300减20"]}
style={{padding: '0'}}
/>
</div>
);
})
}
</div>
<TabFooter discountPrice={60} originalPrice={50} />
</div>
</div>
</div>
);
};
export default CombineSale;
......@@ -9,7 +9,7 @@ import TabFooter from './tabFooter';
import styles from './index.less';
import SwapCoupon from './swapCoupon';
import SwapProduct from './swapProduct';
import CombineSale from './combineSale';
// import CombineSale from './combineSale';
import FlashSale from './flashSale';
const { TabPane } = Tabs;
......@@ -27,7 +27,7 @@ const CommodityList: React.FC<Iprops> & {
CommodityTab: typeof CommodityTab,
SwapCoupon: typeof SwapCoupon,
SwapProduct: typeof SwapProduct
CombineSale: typeof CombineSale,
// CombineSale: typeof CombineSale,
FlashSale: typeof FlashSale
} =
(props: Iprops) => {
......@@ -120,8 +120,12 @@ const CommodityItem: React.FC<Iprops> = (props: Iprops) => {
plummetPrice,
...otherRestProps
} = rest as any;
const activityLabel = activityList?.find((_item) => _item.id === activityId);
const withLabel = activityLabel && activityLabel.label ? {tags: [activityLabel.label]} : {};
const tags = {
tags: otherRestProps?.label || []
}
const withLabel = activityLabel && activityLabel.label ? {tags: [activityLabel.label, ...tags.tags]} : tags;
const horizontalData = {
name,
image,
......@@ -262,7 +266,7 @@ CommodityList.CommodityTab = CommodityGroup;
CommodityList.SwapCoupon = SwapCoupon;
CommodityList.SwapProduct = SwapProduct;
CommodityList.CombineSale = CombineSale;
// CommodityList.CombineSale = CombineSale;
CommodityList.FlashSale = FlashSale;
export default CommodityList;
......@@ -2,17 +2,6 @@
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { ISchema } from '@formily/antd';
const commonTimeList = [
{ label: '今天', value: 1},
{ label: '一周内', value: 2},
{ label: '一个月内', value: 3},
{ label: '三个月内', value: 4},
{ label: '六个月内', value: 5},
{ label: '一年内', value: 6 },
{ label: '一年前', value: 7}
];
const orderTime = [{label: '下单时间(所有)', value: 0}].concat(commonTimeList);
const payTime = [{label: '支付时间(所有)', value: 0}].concat(commonTimeList);
/**
* 应收账款管理--物流单结算明细详情, 生产通知单结算明细
......
......@@ -1823,10 +1823,10 @@
react-dom "^17.0.2"
sortablejs "^1.10.2"
"@linkseeks/design-ui@^1.0.9":
version "1.0.9"
resolved "http://npm.shushangyun.com/@linkseeks%2fdesign-ui/-/design-ui-1.0.9.tgz#fffef978a0846366ebc59fe951b1089affedbd40"
integrity sha512-230k00FsXrV+x5yXWXukyJZWcWi0ht11zPEtalGGHZAK894NauvGhK7pUQDrvfesABlO+lCrlRv49+NsXDDhgw==
"@linkseeks/design-ui@^1.0.11":
version "1.0.11"
resolved "http://npm.shushangyun.com/@linkseeks%2fdesign-ui/-/design-ui-1.0.11.tgz#184fc802a76121ed58e6c0b60604d7068355f0ec"
integrity sha512-0GXhzAEUUmO3a0XmTSe2Z/zBaABZhJ6ajJc1bPifZxLQJV0q2zTUD2xLg9kB3bZjXYdovkOQ3Fc+OTW4dhj33Q==
dependencies:
"@linkseeks/design-utils" "^1.0.0"
antd "^4.15.1"
......
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