Merge branch 'v2' of http://10.0.0.22:3000/lingxi/lingxi-business-system into v2

package.json

@@ -23,7 +23,7 @@
     "build:scm": "cross-env SITE_ID=1 BACK_GATEWAY=http://lingxi-scm.wg.shushangyun.com SOCKET_URL=ws://lingxi-scm.wg.shushangyun.com yarn build",
     "build:all": "cross-env SITE_ID=1 BACK_GATEWAY=http://lingxi-all.wg.shushangyun.com SOCKET_URL=ws://lingxi-all.wg.shushangyun.com yarn build",
     "build:10": "cross-env SITE_ID=1 BACK_GATEWAY=http://10.0.0.10:8100 SOCKET_URL=ws://10.0.0.10:9400 yarn build",
-    "build:v2": "cross-env SITE_ID=1 BACK_GATEWAY=http://10.0.0.17:8100 SOCKET_URL=ws://10.0.0.17:9400 yarn build",
+    "build:v2": "cross-env SITE_ID=1 BACK_GATEWAY=http://10.0.0.17:8100 SOCKET_URL=ws://10.0.0.17:9880 yarn build",
     "build:v2Preview": "cross-env SITE_ID=1 BACK_GATEWAY=http://10.0.1.220:8100 SOCKET_URL=ws://10.0.1.220:9400 yarn build",
     "build:25": "cross-env SITE_ID=352 BACK_GATEWAY=http://10.0.0.25:8100 SOCKET_URL=ws://10.0.0.25:9400 yarn build",
     "build:study": "cross-env SITE_ID=1 BACK_GATEWAY=http://10.0.1.207:8100 SOCKET_URL=ws://10.0.1.207:9400 yarn build",

scripts/services/index.js

 /*
  * @Author: LeeJiancong
  * @Date: 2020-08-10 14:41:27
- * @LastEditors: LeeJiancong
- * @LastEditTime: 2020-08-18 14:55:46
+ * @LastEditors: XieZhiXiong
+ * @LastEditTime: 2021-08-11 10:01:27
  */
 /**
  * 用于在项目开始前获取所有的配置
@@ -55,7 +55,7 @@ const serviceConfig = {
       method: 'get'
     },
     orderMode: {
-      url: '/order/rule/configuration/all',
+      url: '/system/rule/getOrderMode',
       method: 'get'
     }
   },

src/pages/pageCustomized/components/marketingSwitch/index.tsx

 import React from 'react';
 import { Switch } from 'antd';
+import { cloneDeep } from 'lodash';
+import { updatePageConfig, STATE_PROPS, SelectedInfoType, PageConfigType } from '@lingxi-disign/core';
+import { useSelector } from '@lingxi-disign/react';
+
+import * as MarketingConfigs from '../../mobileClientEdit/config';
 
 import styles from './index.less';
 
 interface MarketingSwitchProps {
-  key: number,
+  type: number,
   title: string,
-  img: any
+  icon: any
+}
+
+type SettingPanelType = {
+  selectedInfo: SelectedInfoType,
+  pageConfig: PageConfigType
 }
 
 const MarketingSwitch: React.FC<MarketingSwitchProps> = (props: any) => {
-  const { key, title, img } = props;
+  const { type, title, icon } = props;
+  const { pageConfig } = useSelector<SettingPanelType, STATE_PROPS>(['pageConfig']);
+  const _checked = Object.keys(pageConfig).indexOf(`11-${type}`) >= 0;
+
+  const _onChange = (checked: boolean) => {
+    if (checked) {
+      let _pageConfig: any = { ...pageConfig }
+      const _marketingConfig = MarketingConfigs[`marketingConfig_${type}`];
+      _pageConfig = cloneDeep({ ..._pageConfig, ..._marketingConfig });
+      _pageConfig['0'].childNodes?.push(`11-${type}`);
+      updatePageConfig(_pageConfig);
+    } else {
+      const _type = `11-${type}`;
+      let _pageConfig: any = cloneDeep({ ...pageConfig })
+      for (let key in _pageConfig) {
+        if (key.indexOf(_type) > -1) {
+          delete _pageConfig[key]
+        }
+      }
+      _pageConfig['0'].childNodes.splice(_pageConfig['0'].childNodes.indexOf(_type), 1);
+      updatePageConfig(_pageConfig);
+    }
+  }
   return (
     <div className={styles.marketingSwitch}>
-      <img src={img} className={styles.marketingSwitch_img} />
+      <img src={icon} className={styles.marketingSwitch_img} />
       <div className={styles.marketingSwitch_text}>{title}</div>
-      <Switch size='small' />
+      <Switch size='small' onChange={_onChange} checked={_checked} />
     </div>
   );
 }

src/pages/pageCustomized/components/mobileClientEditLeft/iconsConfig.ts

@@ -19,25 +19,25 @@ import icon18 from '../../icons/marketing-18.svg';
 import icon19 from '../../icons/marketing-19.svg';
 
 const ICON_CONFIGS = [
-  {key : 1, title: '特价促销',img: icon1},
-  {key : 2, title: '直降促销',img: icon2},
-  {key : 3, title: '满量减',img: icon3},
-  {key : 4, title: '折扣促销',img: icon4},
-  {key : 5, title: '满量折',img: icon5},
-  {key : 6, title: '满额减',img: icon6},
-  {key : 7, title: '满额折',img: icon7},
-  {key : 8, title: '赠商品',img: icon8},
-  {key : 9, title: '赠优惠券',img: icon9},
-  {key : 10, title: '多件促销',img: icon10},
-  {key : 11, title: '组合促销',img: icon11},
-  {key : 12, title: '秒杀',img: icon12},
-  {key : 13, title: '拼团',img: icon13},
-  {key : 14, title: '满额换购',img: icon14},
-  {key : 15, title: '买商品换购',img: icon15},
-  {key : 16, title: '预售',img: icon16},
-  {key : 17, title: '试用',img: icon17},
-  {key : 18, title: '套餐',img: icon18},
-  {key : 19, title: '砍价',img: icon19},
+  {type : 1, title: '特价促销',explain: '爆款限时特价',icon: icon1},
+  {type : 2, title: '直降促销',explain: '大牌商品最高直降$元',icon: icon2},
+  {type : 3, title: '满量减',explain: '大牌商品最高减$元',icon: icon3},
+  {type : 4, title: '折扣促销',explain: '大牌商品低至$折',icon: icon4},
+  {type : 5, title: '满量折',explain: '大牌商品低至$折',icon: icon5},
+  {type : 6, title: '满额减',explain: '大牌商品最高减$元',icon: icon6},
+  {type : 7, title: '满额折',explain: '大牌商品低至$折',icon: icon7},
+  {type : 8, title: '赠商品',explain: '满$元即有机会获赠商品',icon: icon8},
+  {type : 9, title: '赠优惠券',explain: '价值$元优惠券免费领取',icon: icon9},
+  {type : 10, title: '多件促销',explain: '任选$件商品，$折起！',icon: icon10},
+  {type : 11, title: '组合促销',explain: '任选$件商品，仅需$元！',icon: icon11},
+  {type : 12, title: '秒杀',explain: '今日大牌秒杀',icon: icon12},
+  {type : 13, title: '拼团',explain: '大牌拼团直降$元',icon: icon13},
+  {type : 14, title: '满额换购',explain: '满$元即可换购以下商品',icon: icon14},
+  {type : 15, title: '买商品换购',explain: '购买指定商品即可换购以下商品',icon: icon15},
+  {type : 16, title: '预售',explain: '大牌新品火爆预售',icon: icon16},
+  {type : 17, title: '试用',explain: '新品抢先试用',icon: icon17},
+  {type : 18, title: '套餐',explain: '超级搭配套餐',icon: icon18},
+  {type : 19, title: '砍价',explain: '砍一砍，免费拿',icon: icon19},
 ]
 
 export default ICON_CONFIGS;

src/pages/pageCustomized/components/mobileClientEditLeft/index.tsx

@@ -5,7 +5,7 @@ import map from 'lodash/map';
 import cx from 'classnames';
 import { cloneDeep } from 'lodash';
 import { selectComponent, PageConfigType, PropsType, ChildNodesType, SelectedInfoBaseType, SelectedInfoType, clearSelectedStatus, STATE_PROPS } from '@lingxi-disign/core';
-import { useSelector } from '@lingxi-disign/react';
+import { useSelector, ModuleTree } from '@lingxi-disign/react';
 
 import MarketingSwitch from '../marketingSwitch';
 import TreeSelect from '../treeSelect';
@@ -31,100 +31,16 @@ export interface VirtualDOMType {
   [custom: string]: any;
 }
 
-type SettingPanelType = {
-  selectedInfo: SelectedInfoType,
-  pageConfig: PageConfigType
-}
-
 interface MobileClientEditLeftProps {
-  pageConfig: PageConfigType,
-  changePageConfig: (config) => void
-}
-
-const MobileClientEditLeft: React.FC<MobileClientEditLeftProps> = (props: any) => {
-  const { pageConfig, changePageConfig } = props;
-  const [treeConfigs, setTreeConfigs] = useState<VirtualDOMType[]>([]);
-  const { selectedInfo } = useSelector<SettingPanelType, STATE_PROPS>(['selectedInfo']);
-
 
-  useEffect(() => {
-    const newList: VirtualDOMType[] = [];
-    const config = cloneDeep(pageConfig);
-    let _level1: any = [];
-    let _level2: any = [];
-    let _level3: any = [];
-    Object.keys(config).forEach(key => {
-      if (config[key].level) {
-        config[key].key = key;
-        switch (config[key].level) {
-          case 1:
-            _level1.push(config[key]);
-            break;
-          case 2:
-            _level2.push(config[key]);
-            break;
-          case 3:
-            _level3.push(config[key]);
-            break;
-          default:
-            break;
-        }
-      }
-    });
-    if (_level1.length > 0) {
-      _level1?.forEach((item: any) => {
-        const _childNode = item.childNodes;
-        if (_childNode?.length > 0) {
-          const _levelChild = _level2.filter((child) => child.key.split('-')[0] == item.key);
-          item.props.dataList = [..._levelChild]
-        }
-        if (item?.props?.dataList) {
-          item?.props?.dataList.forEach((items: any) => {
-            const _childNode2 = items.childNodes;
-            if (_childNode2?.length > 0) {
-              const _levelChild2 = _level3.filter((child2) => child2.key.split('-')[1] == items.key.split('-')[1]);
-              items.props.dataList = [..._levelChild2]
-            }
-          })
-        }
-      });
-    }
-    console.log(_level1)
-    console.log(pageConfig)
-    console.log(selectedInfo)
-    setTreeConfigs(_level1);
-  }, [pageConfig, selectedInfo]);
-
-  const handleSelectComponent = (key: string | undefined) => {
-    if (!key) return;
-    if (!selectedInfo || selectedInfo.selectedKey !== key) {
-      const specialProps: SelectedInfoBaseType = {
-        parentKey: "0",
-        key,
-        domTreeKeys: ["0", key],
-      };
-      selectComponent(specialProps);
-    } else {
-      clearSelectedStatus();
-    }
-  };
-
-  const renderCompontentItem = (item: VirtualDOMType) => {
-    return (
-      <div className={cx(styles.components_item, (selectedInfo && selectedInfo.selectedKey === item.key) ? styles.active : {})} key={item.title} onClick={() => handleSelectComponent(item.key)}>
-        <span className={styles.components_item_text}>{item.title}</span>
-        {
-          item.canHide && (item.props?.visible !== false ? <EyeOutlined className={cx(styles.components_item_icon)} /> : <EyeInvisibleOutlined className={cx(styles.components_item_icon, styles.disable)} />)
-        }
-      </div>
-    );
-  };
+}
 
+const MobileClientEditLeft: React.FC<MobileClientEditLeftProps> = (props: MobileClientEditLeftProps) => {
   return (
     <div className={styles.edit_container}>
       <Tabs type="card">
         <TabPane tab="已添加" key="1">
-          <TreeSelect config={treeConfigs} changePageConfig={changePageConfig} pageConfig={pageConfig} />
+          <ModuleTree />
         </TabPane>
         <TabPane tab="全部模块" key="2">
           <Row gutter={16}>

src/pages/pageCustomized/configs/componentConfigs/LingXiUI/Banner.ts

+import {
+  ComponentSchemaType,
+  PROPS_SETTING_TYPES,
+  PROPS_TYPES,
+} from '@lingxi-disign/core';
+
+const Banner: ComponentSchemaType = {
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const BannerItems: ComponentSchemaType = {
+  fatherNodesRule: ['Banner.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+    componentType: {
+      type: PROPS_SETTING_TYPES.bannerItems,
+    },
+  },
+};
+
+export default {
+  Banner,
+  'Banner.Items': BannerItems,
+};

src/pages/pageCustomized/configs/componentConfigs/LingXiUI/BottomNavigation.ts

+import {
+  ComponentSchemaType,
+  PROPS_SETTING_TYPES,
+  PROPS_TYPES,
+} from '@lingxi-disign/core';
+
+const BottomNavigation: ComponentSchemaType = {
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const BottomNavigationItems: ComponentSchemaType = {
+  fatherNodesRule: ['BottomNavigation.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+    componentType: {
+      type: PROPS_SETTING_TYPES.bottomNavigationItems,
+    },
+  },
+};
+
+export default {
+  BottomNavigation,
+  'BottomNavigation.Items': BottomNavigationItems,
+};

src/pages/pageCustomized/configs/componentConfigs/LingXiUI/CouponsModal.ts

+import {
+  ComponentSchemaType,
+  PROPS_SETTING_TYPES,
+  PROPS_TYPES,
+} from '@lingxi-disign/core';
+
+const CouponsModal: ComponentSchemaType = {
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+    componentType: {
+      type: PROPS_SETTING_TYPES.couponsModal,
+    },
+  },
+};
+
+const CouponsItem: ComponentSchemaType = {
+  fatherNodesRule: ['CouponsModal.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+    componentType: {
+      type: PROPS_SETTING_TYPES.marketingCardCoupon,
+    },
+  },
+};
+
+export default {
+  CouponsModal,
+  'CouponsModal.CouponsItem': CouponsItem,
+};

src/pages/pageCustomized/configs/componentConfigs/LingXiUI/HeaderNav.ts

+import {
+  ComponentSchemaType,
+  PROPS_SETTING_TYPES,
+  PROPS_TYPES,
+} from '@lingxi-disign/core';
+
+const HeaderNav: ComponentSchemaType = {
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const ActionItem: ComponentSchemaType = {
+  fatherNodesRule: ['HeaderNav.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+export default {
+  HeaderNav,
+  'HeaderNav.ActionItem': ActionItem,
+};

src/pages/pageCustomized/configs/componentConfigs/LingXiUI/MarketingCard.ts

+import {
+  ComponentSchemaType,
+  PROPS_SETTING_TYPES,
+  PROPS_TYPES,
+} from '@lingxi-disign/core';
+
+const MarketingCard: ComponentSchemaType = {
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const Header: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+    componentType: {
+      type: PROPS_SETTING_TYPES.marketingCardHeader,
+    },
+  },
+};
+
+const CommonContainer: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const CollageContainer: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const PackageContainer: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const PackageContainerTabs: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.PackageContainer.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const PackageContainerTabsTabPane: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.PackageContainerTabs.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const DetailItem: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.PackageContainer.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+    componentType: {
+      type: PROPS_SETTING_TYPES.marketingCardDetailItem,
+    },
+  },
+};
+
+const CollageContainerItem: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.CollageContainer.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+  },
+};
+
+const GoodsItem: ComponentSchemaType = {
+  fatherNodesRule: [
+    'MarketingCard.CommonContainer.children',
+    'MarketingCard.PackageContainerTabsTabPane.children',
+  ],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+    componentType: {
+      type: PROPS_SETTING_TYPES.marketingCardGood,
+    },
+  },
+};
+
+const CouponsItem: ComponentSchemaType = {
+  fatherNodesRule: ['MarketingCard.CommonContainer.children'],
+  propsConfig: {
+    children: {
+      label: '内容',
+      type: PROPS_TYPES.string,
+    },
+    componentType: {
+      type: PROPS_SETTING_TYPES.marketingCardCoupon,
+    },
+  },
+};
+
+export default {
+  MarketingCard,
+  'MarketingCard.Header': Header,
+  'MarketingCard.CommonContainer': CommonContainer,
+  'MarketingCard.CollageContainer': CollageContainer,
+  'MarketingCard.PackageContainer': PackageContainer,
+  'MarketingCard.PackageContainerTabs': PackageContainerTabs,
+  'MarketingCard.PackageContainerTabsTabPane': PackageContainerTabsTabPane,
+  'MarketingCard.DetailItem': DetailItem,
+  'MarketingCard.CollageContainerItem': CollageContainerItem,
+  'MarketingCard.GoodsItem': GoodsItem,
+  'MarketingCard.CouponsItem': CouponsItem,
+};

src/pages/pageCustomized/configs/componentConfigs/LingXiUI/index.ts

@@ -40,6 +40,11 @@ import PlatformAddGoodsItem from './PlatformAddGoodsItem';
 import PlatformIndex from './PlatformIndex';
 import View from './View';
 import CustomizeTag from './CustomizeTag';
+import MarketingCard from './MarketingCard';
+import BottomNavigation from './BottomNavigation';
+import CouponsModal from './CouponsModal';
+import Banner from './Banner';
+import HeaderNav from './HeaderNav';
 
 export default {
   View,
@@ -83,5 +88,10 @@ export default {
   PlatformService,
   PlatformAddGoodsItem,
   ...PlatformIndex,
-  CustomizeTag
+  CustomizeTag,
+  ...MarketingCard,
+  ...BottomNavigation,
+  ...CouponsModal,
+  ...Banner,
+  ...HeaderNav
 };

src/pages/pageCustomized/mobileClientEdit/index.tsx

@@ -16,16 +16,10 @@ import MobileSettingPanel from '../mobileSettingPanel';
 
 import {
   mallLayoutConfig,
-  divWrap,
-  bannerWrap,
-  mobileHeaderNav,
-  mobileBanner,
-  mobileQuickNav,
-  mobileShowCase,
-  mobileInformation,
-  mobileRecommendShops,
-  mobileQuality,
-  mobileBottomNavigation,
+  headerConfig,
+  bannerConfig,
+  bottomNavigationConfig,
+  couponsModalConfig
 } from './config';
 import styles from './index.less';
 
@@ -53,16 +47,10 @@ const mobileClientEdit: React.FC<ShopPreviewPropsType> = (props) => {
   const [theme, setTheme] = useState<string>('theme-mall-science');
   const [componentConfigs, setComponentConfigs] = useState<any>({
     ...mallLayoutConfig,
-    ...divWrap,
-    ...mobileHeaderNav,
-    ...bannerWrap,
-    ...mobileBanner,
-    ...mobileQuickNav,
-    ...mobileShowCase,
-    ...mobileInformation,
-    ...mobileRecommendShops,
-    ...mobileQuality,
-    ...mobileBottomNavigation,
+    ...headerConfig,
+    ...bannerConfig,
+    ...bottomNavigationConfig,
+    ...couponsModalConfig
   });
 
   const headers = {
@@ -78,33 +66,20 @@ const mobileClientEdit: React.FC<ShopPreviewPropsType> = (props) => {
     // getComponentsConfig();
   }, []);
 
-  const _setComponentConfigs = (config) => {
-    let _config = {...config};
-    delete _config['key'];
-    setComponentConfigs(_config);
-  }
-
-  const _customReducer = (state,action) => {
-    console.log(state)
-    console.log(action)
-    return state
-  }
-
   return (
     <BrickProvider
       config={config}
       warn={(msg: string) => {
         message.warning(msg);
       }}
-      customReducer={_customReducer}
     >
       <div className={styles['wrapper']}>
         <ToolBar type={1} title="APP首页" showActions={true} templateId={id} />
         <div className={styles['content']}>
-          <MobileClientEditLeft changePageConfig={_setComponentConfigs} pageConfig={componentConfigs} />
+          <MobileClientEditLeft />
           <div className={styles['app-wrapper']}>
             <div className={styles['app-canvas-container']}>
-              {React.useMemo(() => <MobileDesignPanel theme={theme} onlyEidt pageConfig={componentConfigs} />,[componentConfigs])}
+              <MobileDesignPanel theme={theme} onlyEidt pageConfig={componentConfigs} />
             </div>
           </div>
           <MobileSettingPanel />

src/pages/pageCustomized/mobileSettingPanel/index.tsx

@@ -27,7 +27,6 @@ const MobileSettingPanel: React.FC = ()=> {
         const newProps = get(pageConfig, [selectedKey, 'props'], oldProps);
         const updateSelectInfo = { ...selectedInfo };
         updateSelectInfo.props = newProps;
-
         setNewSelectInfo(updateSelectInfo);
       }
     };

src/pages/pageCustomized/mobileSettingPanel/propsSettings/components/bannerClient/index.less

+@import "../../common.less";
+
+.banner {
+  &-box {
+    margin-bottom: 16px;
+
+    :global {
+      .ant-upload {
+        width: 100%;
+      }
+    }
+
+    &-label {
+      font-size: 12px;
+      color: #91959B;
+      margin-bottom: 8px;
+    }
+
+    &-icon {
+      height: 96px;
+      background-color: #FAFBFC;
+      border-radius: 4px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      position: relative;
+      overflow: hidden;
+
+      &>img {
+        width: 100%;
+      }
+
+      &-add {
+        font-size: 40px;
+      }
+
+      &:hover {
+        .banner-box-icon-cover {
+          display: block;
+        }
+      }
+
+      &-cover {
+        position: absolute;
+        height: 100%;
+        width: 100%;
+        background-color: rgba(0, 0, 0, .1);
+        display: none;
+        z-index: 1;
+
+        &-delete {
+          position: absolute;
+          right: 10px;
+          top: 10px;
+          font-size: 20px;
+          color: #fff;
+        }
+
+        &-bottom {
+          position: absolute;
+          height: 24px;
+          line-height: 24px;
+          text-align: center;
+          background-color: rgba(0, 0, 0, 0.24);
+          font-size: 12px;
+          color: #fff;
+          width: 100%;
+          bottom: 0;
+          left: 0;
+        }
+      }
+
+    }
+  }
+}

src/pages/pageCustomized/mobileSettingPanel/propsSettings/components/bannerClient/index.tsx

+import React, { useMemo } from 'react';
+import { Input, Select, Row, Col, Button } from 'antd';
+import { PlusCircleOutlined, DeleteOutlined } from '@ant-design/icons';
+import { changeProps } from '@lingxi-disign/core';
+
+import UploadImage from '@/components/UploadImage';
+
+import styles from './index.less';
+
+
+interface BannerClientProps {
+  // 名称
+  name?: string,
+  // 图片
+  img?: any,
+  // 跳转类型
+  type?: any,
+  // 跳转类型的id
+  id?: any,
+  // 当前选中组件的key
+  selectedKey?: any
+}
+
+const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) => {
+  const { name, img, id, type, selectedKey } = props;
+
+  const _isNull = useMemo(() => {
+    const _list = [name, img, type];
+    let _flag = true;
+    for (let key in _list) {
+      if (_list[key]) {
+        _flag = false
+      }
+    }
+    return _flag;
+  }, [name, img, type])
+
+  const _onChangeName = (e: any) => {
+    const _val = e.target.value;
+    changeProps({
+      title: _val || '',
+      props: Object.assign({ ...props }, { name: _val, isNull: _isNull })
+    });
+  }
+
+  const _onChangeType = (value: any) => {
+    changeProps({
+      props: Object.assign({ ...props }, { type: value, isNull: _isNull }, value === 5 ? { id: '' } : {})
+    });
+  }
+
+  const _onChangeImg = (url: any) => {
+    changeProps({
+      props: Object.assign({ ...props }, { img: url, isNull: _isNull })
+    });
+  }
+
+  return (
+    <div className={styles['banner']}>
+      <div className={styles['banner-box']}>
+        <div className={styles['banner-box-label']}>名称</div>
+        <Input key={`${selectedKey}-name`} defaultValue={name} onChange={_onChangeName} />
+      </div>
+      <div className={styles['banner-box']}>
+        <div className={styles['banner-box-label']}>图片</div>
+        {img ? (
+          <div className={styles['banner-box-icon']}>
+            <img src={img} />
+            <div className={styles['banner-box-icon-cover']}>
+              <UploadImage
+                onChange={(url) => { _onChangeImg(url) }}
+                listType="text"
+              >
+                <div className={styles['banner-box-icon-cover-bottom']}>
+                  添加图像
+                </div>
+              </UploadImage>
+              <DeleteOutlined className={styles['banner-box-icon-cover-delete']} onClick={() => { _onChangeImg('') }} />
+            </div>
+          </div>
+        ) : (
+          <UploadImage
+            onChange={(url) => { _onChangeImg(url) }}
+            listType="text"
+          >
+            <div className={styles['banner-box-icon']}>
+              <PlusCircleOutlined className={styles['banner-box-icon-add']} />
+              <div className={styles['banner-box-icon-cover']}>
+                <div className={styles['banner-box-icon-cover-bottom']}>
+                  添加图像
+                </div>
+              </div>
+            </div>
+          </UploadImage>
+        )}
+      </div>
+      <div className={styles['banner-box']}>
+        <div className={styles['banner-box-label']}>跳转链接</div>
+        <Row gutter={20}>
+          <Col span={18}>
+            <Select key={`${selectedKey}-type`} defaultValue={type} onChange={_onChangeType} style={{ width: '100%' }} />
+          </Col>
+          <Col span={6}>
+            <Button block>选择</Button>
+          </Col>
+        </Row>
+      </div>
+    </div>
+  )
+}
+
+export default BannerClient

src/pages/pageCustomized/mobileSettingPanel/propsSettings/components/bottomNavigationClient/index.less

+@import "../../common.less";
+
+.bottomNavigationClient {
+  &-box {
+    margin-bottom: 16px;
+
+    :global {
+      .ant-upload {
+        width: 100%;
+      }
+    }
+
+    &-label {
+      font-size: 12px;
+      color: #91959B;
+      margin-bottom: 8px;
+    }
+
+    &-icon {
+      height: 96px;
+      background-color: #FAFBFC;
+      border-radius: 4px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      position: relative;
+      overflow: hidden;
+
+      &>img {
+        width: 40px;
+        height: 40px;
+      }
+      &-add{
+        font-size: 40px;
+      }
+
+      &:hover {
+        .bottomNavigationClient-box-icon-cover {
+          display: block;
+        }
+      }
+
+      &-cover {
+        position: absolute;
+        height: 100%;
+        width: 100%;
+        background-color: rgba(0, 0, 0, .1);
+        display: none;
+        z-index: 1;
+
+        &-delete {
+          position: absolute;
+          right: 10px;
+          top: 10px;
+          font-size: 20px;
+          color: #fff;
+        }
+
+        &-bottom {
+          position: absolute;
+          height: 24px;
+          line-height: 24px;
+          text-align: center;
+          background-color: rgba(0, 0, 0, 0.24);
+          font-size: 12px;
+          color: #fff;
+          width: 100%;
+          bottom: 0;
+          left: 0;
+        }
+      }
+
+    }
+  }
+}

src/pages/pageCustomized/mobileSettingPanel/propsSettings/components/bottomNavigationClient/index.tsx

+import React, { useMemo } from 'react';
+import { Input, Select } from 'antd';
+import { PlusCircleOutlined, DeleteOutlined } from '@ant-design/icons';
+import { changeProps } from '@lingxi-disign/core';
+
+import UploadImage from '@/components/UploadImage';
+
+import styles from './index.less';
+
+
+interface BottomNavigationClientProps {
+  // 默认icon
+  defaultIcon?: any,
+  // 选中icon
+  selectIcon?: any,
+  // 导航标题
+  name?: any,
+  // 链接类型
+  type?: any,
+  // 当前选中组件的key
+  selectedKey?: any
+}
+
+const BottomNavigationClient: React.FC<BottomNavigationClientProps> = (props: BottomNavigationClientProps) => {
+  const { defaultIcon, selectIcon, name, type, selectedKey } = props;
+
+  const _isNull = useMemo(() => {
+    const _list = [defaultIcon, selectIcon, name, type];
+    let _flag = true;
+    for (let key in _list) {
+      if (_list[key]) {
+        _flag = false
+      }
+    }
+    return _flag;
+  }, [defaultIcon, selectIcon, name, type])
+
+  const _onChangeName = (e: any) => {
+    const _val = e.target.value;
+    changeProps({
+      title: _val || '',
+      props: Object.assign({ ...props }, { name: _val, isNull: _isNull })
+    });
+  }
+
+  const _onChangeType = (value: any) => {
+    changeProps({
+      props: Object.assign({ ...props }, { type: value, isNull: _isNull })
+    });
+  }
+
+  const _onChangeDefaultIcon = (url: any) => {
+    changeProps({
+      props: Object.assign({ ...props }, { defaultIcon: url, isNull: _isNull })
+    });
+  }
+
+  const _onChangeSelectIcon = (url: any) => {
+    changeProps({
+      props: Object.assign({ ...props }, { selectIcon: url, isNull: _isNull })
+    });
+  }
+
+  return (
+    <div className={styles['bottomNavigationClient']}>
+      <div className={styles['bottomNavigationClient-box']}>
+        <div className={styles['bottomNavigationClient-box-label']}>名称</div>
+        <Input key={`${selectedKey}-name`} defaultValue={name} onChange={_onChangeName} />
+      </div>
+      <div className={styles['bottomNavigationClient-box']}>
+        <div className={styles['bottomNavigationClient-box-label']}>链接</div>
+        <Select key={`${selectedKey}-type`} defaultValue={type} onChange={_onChangeType} style={{ width: '100%' }} />
+      </div>
+      <div className={styles['bottomNavigationClient-box']}>
+        <div className={styles['bottomNavigationClient-box-label']}>图标-默认</div>
+        {defaultIcon ? (
+          <div className={styles['bottomNavigationClient-box-icon']}>
+            <img src={defaultIcon} />
+            <div className={styles['bottomNavigationClient-box-icon-cover']}>
+              <UploadImage
+                onChange={(url) => { _onChangeDefaultIcon(url) }}
+                listType="text"
+              >
+                <div className={styles['bottomNavigationClient-box-icon-cover-bottom']}>
+                  添加图像
+                </div>
+                <DeleteOutlined className={styles['bottomNavigationClient-box-icon-cover-delete']} onClick={() => { _onChangeDefaultIcon('') }} />
+              </UploadImage>
+            </div>
+          </div>
+        ) : (
+          <UploadImage
+            onChange={(url) => { _onChangeDefaultIcon(url) }}
+            listType="text"
+          >
+            <div className={styles['bottomNavigationClient-box-icon']}>
+              <PlusCircleOutlined className={styles['bottomNavigationClient-box-icon-add']} />
+              <div className={styles['bottomNavigationClient-box-icon-cover']}>
+                <div className={styles['bottomNavigationClient-box-icon-cover-bottom']}>
+                  添加图像
+                </div>
+              </div>
+            </div>
+          </UploadImage>
+        )}
+      </div>
+      <div className={styles['bottomNavigationClient-box']}>
+        <div className={styles['bottomNavigationClient-box-label']}>图标-选中</div>
+        {selectIcon ? (
+          <div className={styles['bottomNavigationClient-box-icon']}>
+            <img src={selectIcon} />
+            <div className={styles['bottomNavigationClient-box-icon-cover']}>
+              <UploadImage
+                onChange={(url) => { _onChangeSelectIcon(url) }}
+                listType="text"
+              >
+                <div className={styles['bottomNavigationClient-box-icon-cover-bottom']}>
+                  添加图像
+                </div>
+                <DeleteOutlined className={styles['bottomNavigationClient-box-icon-cover-delete']} onClick={() => { _onChangeSelectIcon('') }} />
+              </UploadImage>
+            </div>
+          </div>
+        ) : (
+          <UploadImage
+            onChange={(url) => { _onChangeSelectIcon(url) }}
+            listType="text"
+          >
+            <div className={styles['bottomNavigationClient-box-icon']}>
+              <PlusCircleOutlined className={styles['bottomNavigationClient-box-icon-add']} />
+              <div className={styles['bottomNavigationClient-box-icon-cover']}>
+                <div className={styles['bottomNavigationClient-box-icon-cover-bottom']}>
+                  添加图像
+                </div>
+              </div>
+            </div>
+          </UploadImage>
+        )}
+      </div>
+    </div>
+  )
+}
+
+export default BottomNavigationClient

src/pages/pageCustomized/mobileSettingPanel/propsSettings/components/couponsModal/index.less

+@import "../../common.less";
+
+.couponsModal {
+  &-box {
+    margin-bottom: 16px;
+
+    &-label {
+      font-size: 12px;
+      color: #91959B;
+      margin-bottom: 8px;
+    }
+
+    &-icon {
+      height: 96px;
+      background-color: #FAFBFC;
+      border-radius: 4px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      &>img {
+        width: 40px;
+        height: 40px;
+      }
+    }
+  }
+}

src/pages/pageCustomized/mobileSettingPanel/propsSettings/components/couponsModal/index.tsx

+import React from 'react';
+import { Input } from 'antd';
+import { changeProps } from '@lingxi-disign/core';
+
+import styles from './index.less';
+
+interface CouponsModalProps {
+  // 自定title
+  title?: string
+  // 当前选中组件的key
+  selectedKey?: any
+}
+
+const CouponsModal: React.FC<CouponsModalProps> = (props: CouponsModalProps) => {
+  const { title, selectedKey } = props;
+  const _onChangeTitle = (e: any) => {
+    const _val = e.target.value;
+    changeProps({
+      props: Object.assign({ ...props }, { title: _val })
+    });
+  }
+  return (
+    <div className={styles['couponsModal']}>
+      <div className={styles['couponsModal-box']}>
+        <div className={styles['couponsModal-box-label']}>标题</div>
+        <Input key={`${selectedKey}-title`} defaultValue={title} onChange={_onChangeTitle} />
+      </div>
+    </div>
+  );
+}
+
+export default CouponsModal;

src/pages/pageCustomized/mobileSettingPanel/propsSettings/components/marketingCardHeader/index.less

@@ -4,6 +4,12 @@
   &-box {
     margin-bottom: 16px;
 
+    :global {
+      .ant-upload {
+        width: 100%;
+      }
+    }
+
     &-label {
       font-size: 12px;
       color: #91959B;
@@ -17,11 +23,53 @@
       display: flex;
       align-items: center;
       justify-content: center;
+      position: relative;
+      overflow: hidden;
 
       &>img {
         width: 40px;
         height: 40px;
       }
+
+      &-add {
+        font-size: 40px;
+      }
+
+      &:hover {
+        .marketingCardHeader-box-icon-cover {
+          display: block;
+        }
+      }
+
+      &-cover {
+        position: absolute;
+        height: 100%;
+        width: 100%;
+        background-color: rgba(0, 0, 0, .1);
+        display: none;
+        z-index: 1;
+
+        &-delete {
+          position: absolute;
+          right: 10px;
+          top: 10px;
+          font-size: 20px;
+          color: #fff;
+        }
+
+        &-bottom {
+          position: absolute;
+          height: 24px;
+          line-height: 24px;
+          text-align: center;
+          background-color: rgba(0, 0, 0, 0.24);
+          font-size: 12px;
+          color: #fff;
+          width: 100%;
+          bottom: 0;
+          left: 0;
+        }
+      }
     }
   }
 }

src/pages/pageCustomized/mobileSettingPanel/propsSettings/components/marketingCardHeader/index.tsx

 import React from 'react';
 import { Input } from 'antd';
+import { PlusCircleOutlined, DeleteOutlined } from '@ant-design/icons';
+import { changeProps } from '@lingxi-disign/core';
+
+import UploadImage from '@/components/UploadImage';
+
+
+import ICONS_CONFIG from '../../../../components/mobileClientEditLeft/iconsConfig';
 
 import styles from './index.less';
 
@@ -7,32 +14,80 @@ interface MarketingCardHeaderProps {
   // 活动类型
   type: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19,
   // 自定title
-  title?: React.ReactNode,
+  title?: string,
   // 自定info
-  explain?: React.ReactNode,
+  explain?: string,
   // 自定icon
   icon?: any,
   // 倒计时数组[时,分,秒]
-  countDown?: string[]
+  countDown?: string[],
+  selectedKey?: any
 }
 
 const MarketingCardHeader: React.FC<MarketingCardHeaderProps> = (props: MarketingCardHeaderProps) => {
-  const { title, explain, icon } = props;
+  const { type, title, explain, icon, selectedKey } = props;
+  const _defaultInfo = ICONS_CONFIG.filter((item) => item.type === type)[0]
+  const _onChangeTitle = (e: any) => {
+    const _val = e.target.value;
+    changeProps({
+      props: Object.assign({ ...props }, { title: _val })
+    });
+  }
+  const _onChangeExplain = (e: any) => {
+    const _val = e.target.value;
+    changeProps({
+      props: Object.assign({ ...props }, { explain: _val })
+    });
+  }
+
+  const _onChangeIcon = (url: any) => {
+    changeProps({
+      props: Object.assign({ ...props }, { icon: url })
+    });
+  }
+
   return (
     <div className={styles['marketingCardHeader']}>
       <div className={styles['marketingCardHeader-box']}>
         <div className={styles['marketingCardHeader-box-label']}>标题</div>
-        <Input />
+        <Input key={`${selectedKey}-title`} defaultValue={title || _defaultInfo?.title} onChange={_onChangeTitle} />
       </div>
       <div className={styles['marketingCardHeader-box']}>
         <div className={styles['marketingCardHeader-box-label']}>标题说明</div>
-        <Input />
+        <Input key={`${selectedKey}-explain`} defaultValue={explain || _defaultInfo?.explain} onChange={_onChangeExplain} />
       </div>
       <div className={styles['marketingCardHeader-box']}>
         <div className={styles['marketingCardHeader-box-label']}>图标</div>
-        <div className={styles['marketingCardHeader-box-icon']}>
-          <img src='' />
-        </div>
+        {icon ? (
+          <div className={styles['marketingCardHeader-box-icon']}>
+            <img src={icon} />
+            <div className={styles['marketingCardHeader-box-icon-cover']}>
+              <UploadImage
+                onChange={(url) => { _onChangeIcon(url) }}
+                listType="text"
+              >
+                <div className={styles['marketingCardHeader-box-icon-cover-bottom']}>
+                  添加图像
+                </div>
+              </UploadImage>
+              <DeleteOutlined className={styles['marketingCardHeader-box-icon-cover-delete']} onClick={() => { _onChangeIcon('') }} />
+            </div>
+          </div>
+        ) : (
+          <UploadImage
+            onChange={(url) => { _onChangeIcon(url) }}
+            listType="text"
+          >
+            <div className={styles['marketingCardHeader-box-icon']}>
+              <img src={_defaultInfo.icon} />
+              <div className={styles['marketingCardHeader-box-icon-cover']}>
+                <div className={styles['marketingCardHeader-box-icon-cover-bottom']}>
+                  添加图像
+                </div>
+              </div>
+            </div>
+          </UploadImage>
+        )}
       </div>
     </div>
   );

src/pages/pageCustomized/mobileSettingPanel/propsSettings/index.tsx

@@ -7,6 +7,11 @@ import ShowCase from './components/showCase';
 import Shops from './components/shops';
 import Quality from './components/quality';
 import BottomNavigation from './components/bottomNavigation';
+import MarketingCardHeader from './components/marketingCardHeader';
+import MarketingCardCoupon from './components/marketingCardCoupon';
+import BottomNavigationClient from './components/bottomNavigationClient';
+import CouponsModal from './components/couponsModal';
+import BannerClient from './components/bannerClient';
 import styles from './index.less';
 
 interface PropsSettingsPropsType {
@@ -18,24 +23,34 @@ const PropsSettings: React.FC<PropsSettingsPropsType> = (props) => {
 
   const renderSettingItem = () => {
     const { props: initProps, propsConfig } = selectedInfo || {};
+    const _props = { ...initProps, selectedKey: selectedInfo?.selectedKey }
     const componentType = propsConfig?.componentType;
-
     if (componentType) {
       switch (componentType.type) {
         case PROPS_SETTING_TYPES.mobileHeaderNav:
-          return <HeaderNav  {...initProps} />;
+          return <HeaderNav  {..._props} />;
         case PROPS_SETTING_TYPES.mobileBanner:
-          return <Banner {...initProps} />;
+          return <Banner {..._props} />;
         case PROPS_SETTING_TYPES.mobileQuickNav:
-          return <QuickNav {...initProps} />;
+          return <QuickNav {..._props} />;
         case PROPS_SETTING_TYPES.mobileShowCase:
-          return <ShowCase {...initProps} />;
+          return <ShowCase {..._props} />;
         case PROPS_SETTING_TYPES.mobileRecommentShops:
-          return <Shops {...initProps} />;
+          return <Shops {..._props} />;
         case PROPS_SETTING_TYPES.mobileQuality:
-          return <Quality {...initProps} />;
+          return <Quality {..._props} />;
         case PROPS_SETTING_TYPES.mobileBottomNavigation:
-          return <BottomNavigation {...initProps} />;
+          return <BottomNavigation {..._props} />;
+        case PROPS_SETTING_TYPES.marketingCardHeader:
+          return <MarketingCardHeader {..._props} />
+        case PROPS_SETTING_TYPES.marketingCardCoupon:
+          return <MarketingCardCoupon {..._props} />
+        case PROPS_SETTING_TYPES.bottomNavigationItems:
+          return <BottomNavigationClient {..._props} />
+        case PROPS_SETTING_TYPES.couponsModal:
+          return <CouponsModal {..._props} />
+        case PROPS_SETTING_TYPES.bannerItems:
+          return <BannerClient {..._props} />
         default:
           return null;
       }
@@ -45,7 +60,7 @@ const PropsSettings: React.FC<PropsSettingsPropsType> = (props) => {
   return (
     <div className={styles.propsSettingsWrapper}>
       <div className={styles.propsSettingsBody}>
-       {renderSettingItem()}
+        {renderSettingItem()}
       </div>
     </div>
   );

src/pages/returnManage/components/ReturnAnalysis/index.tsx

@@ -2,7 +2,7 @@
  * @Author: XieZhiXiong
  * @Date: 2020-11-05 15:18:15
  * @LastEditors: XieZhiXiong
- * @LastEditTime: 2021-04-19 17:12:35
+ * @LastEditTime: 2021-08-10 17:34:43
  * @Description: 退货收货统计、退货发货明细
  */
 import React from 'react';
@@ -61,9 +61,6 @@ const ReturnInfo: React.FC<ReturnInfoProps> = ({
   summary = [], 
   detailed = [], 
   isPurchaser = false, 
-  onConfirmReturnBack, 
-  onConfirmReturnDeliver, 
-  onConfirmReturnReceive, 
 }) => {
 
   const summaryColumns: EditableColumns[] = [
@@ -180,45 +177,6 @@ const ReturnInfo: React.FC<ReturnInfoProps> = ({
 
   };
 
-  const handleConfirmReturnDeliver = (id) => {
-    if (onConfirmReturnDeliver) {
-      confirm({
-        title: '提示',
-        icon: <ExclamationCircleOutlined />,
-        content: `是否确认退货发货？`,
-        onOk() {
-          return onConfirmReturnDeliver(id);
-        },
-      });
-    }
-  };
-  
-  const handleConfirmReturnReceive = (id) => {
-    if (onConfirmReturnReceive) {
-      confirm({
-        title: '提示',
-        icon: <ExclamationCircleOutlined />,
-        content: `是否确认退货收货？`,
-        onOk() {
-          return onConfirmReturnReceive(id);
-        },
-      });
-    }
-  };
-  
-  const handleConfirmReturnBack = (id) => {
-    if (onConfirmReturnBack) {
-      confirm({
-        title: '提示',
-        icon: <ExclamationCircleOutlined />,
-        content: `是否确认退货回单？`,
-        onOk() {
-          return onConfirmReturnBack(id);;
-        },
-      });
-    }
-  };
-
   return (
     <MellowCard>
       <Tabs defaultActiveKey="2">
@@ -277,41 +235,6 @@ const ReturnInfo: React.FC<ReturnInfoProps> = ({
                       <Descriptions.Item label="内部状态">
                         <Badge color={'#6C9CEB'} text={item.innerStatusName} />
                       </Descriptions.Item>
-                      <Descriptions.Item>
-                        {item.innerStatus === MAIL_INNER_STATUS_UNCONFIRMED_DELIVER && (
-                          <a 
-                            style={{ 
-                              textAlign: 'right',
-                              display: 'block',  
-                            }}
-                            onClick={() => handleConfirmReturnDeliver(item.deliveryId)}
-                          >
-                            确认退货发货
-                          </a>
-                        )}
-                        {item.innerStatus === MAIL_INNER_STATUS_CONFIRMED_DELIVER && (
-                          <a 
-                            style={{ 
-                              textAlign: 'right',
-                              display: 'block',  
-                            }}
-                            onClick={() => handleConfirmReturnReceive(item.deliveryId)}
-                          >
-                            确认退货收货
-                          </a>
-                        )}
-                        {item.innerStatus === MAIL_INNER_STATUS_CONFIRMED_RECEIVING && (
-                          <a 
-                            style={{ 
-                              textAlign: 'right',
-                              display: 'block',  
-                            }}
-                            onClick={() => handleConfirmReturnBack(item.deliveryId)}
-                          >
-                            确认退货回单
-                          </a>
-                        )}
-                      </Descriptions.Item>
                     </Descriptions>
                   </Col>
                 </Row>