Commit e3841e40 authored by 卢均锐's avatar 卢均锐

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

* 'v2' of http://10.0.0.22:3000/lingxi/lingxi-business-system: feat: B端APP商城装修开发
parents 68141770 a6a51f0c
......@@ -71,7 +71,7 @@
"core-js": "^3.6.5",
"crypto-js": "^4.0.0",
"god": "^0.2.9",
"lingxi-design-ui": "^2.0.16",
"lingxi-design-ui": "^2.0.19",
"lint-staged": "^10.0.7",
"mobx": "^5.15.4",
"mobx-react": "^6.2.2",
......
import React from 'react';
import React, { useEffect } from 'react';
import { PageConfigType } from '@lingxi-disign/core';
import { BrickDesign, useSelector } from '@lingxi-disign/react';
......@@ -10,8 +10,7 @@ interface DesignPanelPropsType {
}
const DesignPanel: React.FC<DesignPanelPropsType> = (props) => {
const { theme, pageName = 'index', onlyEidt } = props;
const { pageConfig } = useSelector(['pageConfig']);
const { pageConfig, theme, pageName = 'index', onlyEidt } = props;
return <BrickDesign
pageName={pageName}
......
import React, { useEffect } from 'react';
import { PageConfigType } from '@lingxi-disign/core';
import { BrickDesign, useSelector } from '@lingxi-disign/react';
interface DesignPanelPropsType {
pageConfig?: PageConfigType,
theme: string,
onlyEidt?: boolean,
pageName?: string
}
const DesignPanel: React.FC<DesignPanelPropsType> = (props) => {
const { theme, pageName = 'index', onlyEidt } = props;
const { pageConfig } = useSelector(['pageConfig']);
useEffect(() => {
console.log(pageConfig, 'pageConfig')
}, [pageConfig])
return <BrickDesign
pageName={pageName}
initState={{ pageConfig }}
themeName={theme}
onlyEidt={onlyEidt}
/>;
};
export default DesignPanel;
import React from 'react';
import { PageConfigType } from '@lingxi-disign/core';
// import MobileUIDemo from './mobileUIDemo'
import DesignPanel from './DesignPanel';
import DesignPreview from './DesignPreview';
import DesignPanel from './MobileDesign';
import DesignPreview from './MobilePreview';
import styles from './index.less';
import { useSelector } from '@lingxi-disign/react';
interface MobileDesignPanelPropsType {
......
import React from 'react';
import { PageConfigType } from '@lingxi-disign/core';
import { BrickPreview } from '@lingxi-disign/react';
interface DesignPanelPropsType {
pageConfig?: PageConfigType,
theme: string,
onlyEidt?: boolean,
pageName?: string
}
const DesignPanel: React.FC<DesignPanelPropsType> = (props) => {
const { pageConfig, theme, pageName = 'index', onlyEidt } = props;
return <BrickPreview
pageName={pageName}
initState={{ pageConfig }}
themeName={theme}
onlyEidt={onlyEidt}
/>;
};
export default DesignPanel;
......@@ -542,6 +542,7 @@ export const paramsBusiness = (
const { propsConfig } = getComponentConfig(configItem.componentName);
if (propsConfig.componentType) {
let tempProps: any = undefined
switch (propsConfig.componentType.type) {
case PROPS_SETTING_TYPES.mobileHeaderNavAction:
_params.adornContent['headerNav'] = contactList(
......@@ -550,20 +551,34 @@ export const paramsBusiness = (
);
break;
case PROPS_SETTING_TYPES.bannerItems:
break;
tempProps = configItem.props
_params.adornContent['banner'] = contactList(_params.adornContent['banner'], {
id: tempProps.id,
name: tempProps.name,
type: tempProps.type,
img: tempProps.img,
})
break
case PROPS_SETTING_TYPES.mobileNavCardNavItem:
const data: any = configItem.props;
_params.adornContent['navList'] = contactList(
_params.adornContent['navList'],
{
id: data.id,
name: data.name,
type: data.type,
url: data.url,
icon: data.icon,
},
);
break;
tempProps = configItem.props
_params.adornContent['navList'] = contactList(_params.adornContent['navList'], {
id: tempProps.id,
name: tempProps.name,
type: tempProps.type,
url: tempProps.url,
icon: tempProps.icon,
})
break
case PROPS_SETTING_TYPES.mobileShowCase:
tempProps = configItem.props
_params.adornContent['showCase'] = contactList(_params.adornContent['showCase'], {
idList: tempProps.idList || [],
name: tempProps.name,
type: tempProps.type,
banner: tempProps.banner,
inner: tempProps.inner,
})
break
}
}
});
......
import { ComponentSchemaType, PROPS_TYPES, PROPS_SETTING_TYPES } from '@lingxi-disign/core';
const ShowCaseBanner: ComponentSchemaType = {
propsConfig: {
children: {
label: '内容',
type: PROPS_TYPES.string,
},
styleType: {
label: "样式",
type: PROPS_TYPES.number,
},
},
};
const Item: ComponentSchemaType = {
fatherNodesRule: ['ShowCaseBanner.children'],
propsConfig: {
children: {
label: '内容',
type: PROPS_TYPES.string,
},
componentType: {
label: '内容',
type: PROPS_SETTING_TYPES.mobileShowCase,
},
},
};
export default {
ShowCaseBanner,
'ShowCaseBanner.Item': Item,
};
......@@ -25,6 +25,7 @@ import MobileQuality from './MobileQuality';
import MobileQuickNav from './MobileQuickNav';
import MobileRecommendShops from './MobileRecommendShops';
import MobileShowCase from './MobileShowCase';
import ShowCaseBanner from './ShowCaseBanner';
import Category from './Category';
import PlatformQuickNav from './PlatformQuickNav';
import PlatformAdvert from './PlatformAdvert';
......@@ -78,6 +79,7 @@ export default {
MobileQuickNav,
MobileRecommendShops,
MobileShowCase,
...ShowCaseBanner,
Category,
PlatformQuickNav,
PlatformAdvert,
......
import React, { useEffect, useState } from 'react';
import { BrickProvider } from '@lingxi-disign/react';
import { updatePageConfig } from '@lingxi-disign/core'
import { Prompt } from 'umi';
import { message } from 'antd';
import { GlobalConfig } from '@/global/config';
......@@ -322,6 +323,7 @@ const MallEdit: React.FC<MallEditPropsType> = (props) => {
};
setComponentConfigs(config);
setLoading(false);
updatePageConfig(config)
};
return !loading ? (
......@@ -333,7 +335,7 @@ const MallEdit: React.FC<MallEditPropsType> = (props) => {
>
<Prompt message="你确定要离开么?" />
<div className={styles['wrapper']}>
<ToolBar />
<ToolBar templateId={id} />
<div className={styles['content']}>
<div className={styles['canvas-container']}>
<DesignPanel onlyEidt theme={theme} pageConfig={componentConfigs} />
......
......@@ -3,10 +3,7 @@ import { resolveMappingPageConfig } from '@lingxi-disign/react'
import styleThemeImgDefault from './imgs/style_theme_default.png'
import styleThemeImgScience from './imgs/style_theme_science.png'
import categoryNavTemplateDefault from './imgs/category_template_default.png'
import mineIcon from './imgs/mine_icon.png'
import orderIcon from './imgs/order_icon.png'
import kefuIcon from './imgs/kefu_icon.png'
import showCaseTemplateDefault from './imgs/showcase_template_default.jpg'
export const defaultHeaderNavData = [
{
......@@ -48,7 +45,7 @@ export const defaultConfig: PageConfigType = {
position: 'relative',
},
},
childNodes: ['1', '3', '5']
childNodes: ['1', '3', '5', '7']
},
'1': {
title: '头部导航栏',
......@@ -87,18 +84,22 @@ export const defaultConfig: PageConfigType = {
margin: '8px',
},
},
childNodes: [],
childNodes: ['4'],
childComponentName: 'Banner.Items',
addBtnText: '添加广告',
},
// '4': {
// loop: '${navList}',
// title: '广告图',
// componentName: 'Banner.Items',
// props: {
// },
// },
'4': {
loop: '${banner}',
title: '${item.name}',
componentName: 'Banner.Items',
props: {
id: '${item.name}',
type: '${item.type}',
img: '${item.img}',
name: '${item.name}',
isNull: false,
},
},
'5': {
title: '分类导航',
componentName: 'MobileNavCard',
......@@ -132,6 +133,35 @@ export const defaultConfig: PageConfigType = {
empty: false,
},
},
'7': {
title: '橱窗广告',
componentName: 'ShowCaseBanner',
childComponentName: 'ShowCaseBanner.Item',
props: {
stylesthemelist: [
{
key: 0,
width: 152,
height: 105,
img: showCaseTemplateDefault,
},
]
},
addBtnText: '添加橱窗',
childNodes: ['8'],
},
'8': {
loop: '${showCase}',
title: '${item.name}',
componentName: 'ShowCaseBanner.Item',
props: {
name: '${item.name}',
banner: '${item.banner}',
inner: '${item.inner}',
type: '${item.type}',
idList: '${item.idList}',
},
},
}
// const allState = { headerNav: defaultHeaderNavData }
......
......@@ -202,8 +202,10 @@ const appMallEdit: React.FC<ShopPreviewPropsType> = (props) => {
const appConfig: any = await getAppEnterpriseConfig();
const allState = {
headerNav: appConfig?.headerNav ? appConfig.headerNav : defaultHeaderNavData,
banner: appConfig?.banner ? appConfig?.banner : [],
categoryList: await getFirstCategoryList(),
navList: appConfig?.navList ? appConfig?.navList : []
navList: appConfig?.navList ? appConfig?.navList : [],
showCase: appConfig?.showCase ? appConfig?.showCase : [],
}
const finalConfig = resolveMappingPageConfig(defaultConfig, allState)
console.log(finalConfig, 'finalConfig')
......
@import "../../../../../../global//styles/utils.less";
@import "../../common.less";
.selectBtn {
display: block;
.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: 1px dashed #D8DDE6;
}
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
.uploadPreview {
border: 1px solid #EBECF0;
}
&>img {
width: 100%;
}
&-add {
width: 24px;
height: 24px;
}
&: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;
}
}
}
}
&-record {
&-shop {
height: 56px;
border: 1px solid #EDEEEF;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0 8px;
img {
width: 40px;
height: 40px;
margin-right: 8px;
}
span {
flex: 1;
color: #303133;
font-size: 12px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
&-integral {
height: 56px;
border: 1px solid #EDEEEF;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0 8px;
img {
width: 40px;
height: 40px;
margin-right: 8px;
}
&-right {
flex: 1;
display: flex;
flex-direction: column;
&-top {
flex: 1;
color: #303133;
font-size: 12px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
&-bottom {
flex: 1;
color: #EA8000;
font-size: 12px;
}
}
}
&-activity {
height: 56px;
border: 1px solid #EDEEEF;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0 8px;
position: relative;
img {
width: 40px;
height: 40px;
border-radius: 4px;
margin-right: 8px;
}
&-right {
flex: 1;
display: flex;
flex-direction: column;
font-size: 12px;
&-top {
flex: 1;
color: #303133;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
&-bottom {
flex: 1;
color: #91959B;
}
}
&-tag{
position: absolute;
right: 0;
top: -3px;
}
}
}
}
/* eslint-disable no-case-declarations */
import React, { useEffect, useState } from 'react';
import { BrickProvider } from '@lingxi-disign/react';
import { PROPS_SETTING_TYPES } from '@lingxi-disign/core';
import { PROPS_SETTING_TYPES, updatePageConfig } from '@lingxi-disign/core';
import { Prompt } from 'umi';
import { message } from 'antd';
import { GlobalConfig } from '@/global/config';
......@@ -701,6 +701,8 @@ const getInformationByIds = (idList: number[]) => {
setComponentConfigs(config);
setLoading(false);
updatePageConfig(config)
}
};
......@@ -718,7 +720,7 @@ const getInformationByIds = (idList: number[]) => {
</div>
<div className={styles['content']}>
<div className={styles['canvas-container']}>
<DesignPanel onlyEidt theme={theme} pageConfig={componentConfigs} />
<DesignPanel onlyEidt theme={theme} />
</div>
</div>
</div>
......
declare module '*.css';
declare module '*.less';
declare module "*.png";
declare module "*.jpg";
declare module '*.svg' {
export function ReactComponent(props: React.SVGProps<SVGSVGElement>): React.ReactElement
const url: string
......
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