Commit 260243d7 authored by XieZhiXiong's avatar XieZhiXiong
parents 5a6ecad0 5b911715
......@@ -185,9 +185,13 @@ const ChannelPreview: React.FC<ChannelPreviewPropsType> = (props) => {
// 二号位广告
serviceAdvertConfig[serviceAdvertConfig.key].props.advertList = await findSecondAdvertsByType()
//店铺信息
const channelInfo: any = await fetchShopInfo()
AboutUsConfig[AboutUsConfig.key].props.shopInfo = channelInfo
//店铺信息
AboutUsConfig[AboutUsConfig.key].props.shopInfo = await fetchShopInfo()
headerConfig[headerConfig.key].props.logoUrl = channelInfo.logo || ""
topBarConfig[topBarConfig.key].props.shopname = channelInfo.company || ""
// 行情资讯
InformationConfig[InformationConfig.key].props.newsList = await fetchLeadNews()
......
import React, { forwardRef, useState, useCallback } from 'react'
import { Button, Input } from 'antd'
import { Button, Input, Select } from 'antd'
import UploadImage from '@/components/UploadImage'
import { filterPropsFunction, getAdvertType } from '../../../../utils'
import SettingPanel from '../../../../components/SettingPanel'
......@@ -193,9 +193,17 @@ const AdvertSetting: React.FC<AdvertSettingPropsType> = forwardRef((props, ref)
return
}
setConfirmLoading(true)
saveAdvert(newProps).then(() => {
let newParam: any = JSON.parse(JSON.stringify(newProps))
newParam.advertList = newParam.advertList.map((item) => {
if (!item.link.startsWith('http://') && !item.link.startsWith('https://')) {
item.link = `http://${item.link}`
}
return item
})
saveAdvert(newParam).then(() => {
changeProps({
props: newProps
props: newParam
})
clearSelectedStatus()
setConfirmLoading(false)
......@@ -263,6 +271,13 @@ const AdvertSetting: React.FC<AdvertSettingPropsType> = forwardRef((props, ref)
}
const selectBefore = (
<Select defaultValue="http://" className="select-before">
<Select.Option value="http://">http://</Select.Option>
<Select.Option value="https://">https://</Select.Option>
</Select>
);
return (
<SettingPanel
confirmLoading={confirmLoading}
......@@ -304,7 +319,11 @@ const AdvertSetting: React.FC<AdvertSettingPropsType> = forwardRef((props, ref)
<div className={styles.advert_setting_line_addItem_line}>
<div className={styles.advert_setting_line_addItem_line_label}>链接</div>
<div className={styles.advert_setting_line_addItem_line_brief}>
<Input className={styles.advert_setting_line_addItem_input} value={item.link} onChange={(e) => handleKeyChange(e.target.value, item.sort, 'link')} />
<Input
className={styles.advert_setting_line_addItem_input}
value={item.link}
onChange={(e) => handleKeyChange(e.target.value, item.sort, 'link')}
/>
</div>
</div>
</div>
......
......@@ -29,6 +29,7 @@
justify-content: center;
font-size: 14px;
margin-bottom: 16px;
cursor: pointer;
}
.ask_image {
......
import React from 'react';
import AbilityContainer from './Container';
import { Row, Col } from 'antd';
import styles from './center.less'
import create_shop from '@/assets/imgs/create_shop.png';
interface Iprops {};
const SettlementAbility: React.FC<Iprops> = () => {
const data = [
{
id: 1,
list: [1,2,3,4]
},
{
id: 2,
list: [1,2,3,4]
},
{
id: 3,
list: [1,2,3,4,5]
},
]
return (
<AbilityContainer
title="售后中心"
tips="轻松完成订单售后在线换货、退货、维修环节"
extra={
<a>进入售后中心</a>
}
>
<div>
{
data.map((record) => {
return (
<Row key={record.id} className={styles.row}>
<Col span={4} className={styles.rowTitle}>平台代收账款结算</Col>
<Col span={20} className={styles.colRow}>
{
record.list.map((item) => {
return (
<Col span={4} key={item}>
<div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div>
</Col>
)
})
}
</Col>
</Row>
)
})
}
</div>
</AbilityContainer>
)
}
export default SettlementAbility
\ No newline at end of file
.container {
padding: 24px 24px 0 24px ;
background-color: #fff;
.header {
display: flex;
flex-direction: row;
justify-content: space-between;
.left {
.title {
font-size: 16px;
font-weight: 500;
color: #303133;
margin-bottom: 16px;
}
.tips {
font-size: 12px;
font-weight: 400;
color: #909399;
}
}
}
.body {
margin-top: 12px;
}
}
\ No newline at end of file
import React, { ReactNode } from 'react';
import styles from './Container.less';
interface Iprops {
title: string,
tips: string,
extra?: ReactNode
};
const AbilityContainer: React.FC<Iprops> = (props) => {
const { title = '', tips = '' } = props;
return (
<div className={styles.container}>
<div className={styles.header}>
<div className={styles.left}>
<div className={styles.title}>{title}</div>
<div className={styles.tips}>{tips}</div>
</div>
<div className={styles.extra}>
{props.extra}
</div>
</div>
<div className={styles.body}>
{props.children}
</div>
</div>
)
}
export default AbilityContainer;
\ No newline at end of file
import React from 'react';
import AbilityContainer from './Container';
import styles from './center.less'
import logistics from '@/assets/imgs/logistics.png';
import logistics_form from '@/assets/imgs/logistics_form.png';
import logistics_address from '@/assets/imgs/logistics_address.png';
import logistics_cost from '@/assets/imgs/logistics_cost.png';
interface Iprops {};
const LogisticsCenter: React.FC<Iprops> = () => {
const data = [
{
icon: logistics,
text: '物流派单'
},
{
icon: logistics_form,
text: '接单报价'
},
{
icon: logistics_address,
text: '收货地址管理'
},
{
icon: logistics_address,
text: '发货地址管理'
},
{
icon: logistics_cost,
text: '运费模板'
}
]
return (
<AbilityContainer
title="物流中心"
tips={"快速完成物流派单、接单、报价、物流信息对接"}
extra={
<a>进入物流中心</a>
}
>
<div className={styles.tags}>
{
data.map((item) => {
return (
<div className={styles.tagsItem} key={item.text}>
<div className={styles.icon}>
<img src={item.icon} />
</div>
<div className={styles.text}>{item.text}</div>
</div>
)
})
}
</div>
</AbilityContainer>
)
}
export default LogisticsCenter
\ No newline at end of file
import React from 'react';
import AbilityContainer from './Container';
import { Row, Col } from 'antd';
import styles from './center.less'
interface Iprops {};
const ProcessCenter: React.FC<Iprops> = () => {
const data = [
{
id: 1,
list: [1,2,3,4]
},
]
return (
<AbilityContainer
title="加工中心"
tips="提供外发生产、加工、装配全流程环节管控"
extra={
<a>进入加工中心</a>
}
>
{
data.map((record) => {
return (
<Row key={record.id} className={styles.row}>
<Col span={4} className={styles.rowTitle}>平台代收账款结算</Col>
<Col span={20} className={styles.colRow}>
{
record.list.map((item) => {
return (
<Col span={4} key={item}>
<div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div>
</Col>
)
})
}
</Col>
</Row>
)
})
}
</AbilityContainer>
)
}
export default ProcessCenter
\ No newline at end of file
import React from 'react';
import AbilityContainer from './Container';
import { Row, Col, Space } from 'antd';
import styles from './center.less'
interface Iprops {};
const ProductCenter: React.FC<Iprops> = () => {
const data = [
{
id: 1,
list: [1,2,3,4]
},
]
return (
<AbilityContainer
tips="快速完成品牌、商品创建、发布、提供灵活的商品库存管理"
title="商品中心"
extra={
<Space>
<a>设置库存</a>
<a>创建品牌</a>
<a>创建商品</a>
</Space>
}
>
{
data.map((record) => {
return (
<Row key={record.id} className={styles.row}>
<Col span={4} className={styles.rowTitle}>平台代收账款结算</Col>
<Col span={20} className={styles.colRow}>
{
record.list.map((item) => {
return (
<Col span={4} key={item}>
<div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div>
</Col>
)
})
}
</Col>
</Row>
)
})
}
</AbilityContainer>
)
}
export default ProductCenter
\ No newline at end of file
import React from 'react';
import AbilityContainer from './Container';
import { Row, Col } from 'antd';
import styles from './center.less'
import settlement_platformCollection from '@/assets/imgs/settlement_platformCollection.png';
import settlement_integrate from '@/assets/imgs/settlement_integrate.png';
import settlement_accountReceive from '@/assets/imgs/settlement_accountReceive.png';
import settlement_accountPayable from '@/assets/imgs/settlement_accountPayable.png';
import settlement_invoice from '@/assets/imgs/settlement_invoice.png';
interface Iprops {};
const SettlementCenter: React.FC<Iprops> = () => {
const data = [
{
id: 1,
list: [1,2,3,4]
},
{
id: 2,
list: [1,2,3,4]
},
{
id: 3,
list: [1,2,3,4,5]
},
]
const tagsList = [
{
icon: settlement_platformCollection,
text: '平台代收款结算'
},
{
icon: settlement_integrate,
text: '平台积分结算'
},
{
icon: settlement_accountReceive,
text: '应收账款结算'
},
{
icon: settlement_accountPayable,
text: '应付账款结算'
},
{
icon: settlement_invoice,
text: '开票管理'
}
]
return (
<AbilityContainer
title="结算中心"
tips="提供资资金结算、发票管理等功能"
extra={
<a>进入资金与结算中心</a>
}
>
<div>
<div className={styles.tags}>
{
tagsList.map((item) => {
return (
<div className={styles.tagsItem} key={item.text}>
<div className={styles.icon}>
<img src={item.icon} />
</div>
<div className={styles.text}>{item.text}</div>
</div>
)
})
}
</div>
<div>
{
data.map((record) => {
return (
<Row key={record.id} className={styles.row}>
<Col span={4} className={styles.rowTitle}>平台代收账款结算</Col>
<Col span={20} className={styles.colRow}>
{
record.list.map((item) => {
return (
<Col span={4} key={item}>
<div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div>
</Col>
)
})
}
</Col>
</Row>
)
})
}
</div>
</div>
</AbilityContainer>
)
}
export default SettlementCenter
\ No newline at end of file
import React from 'react';
import AbilityContainer from './Container';
import styles from './center.less'
import create_shop from '@/assets/imgs/create_shop.png';
import { BellOutlined } from '@ant-design/icons'
interface Iprops {}
const ShopCenter: React.FC<Iprops> = () => {
return (
<AbilityContainer
title="店铺中心"
tips="轻松完成店铺的创建、店铺风格选择、店铺个性化装修"
extra={
<div>
<a>进入店铺中心</a>
</div>
}
>
<div className={styles.tags}>
<div className={styles.tagsSpecial} >
<div className={styles.tagsItem}>
<div className={styles.icon}>
<img src={create_shop} />
</div>
<div className={styles.text}>创建店铺</div>
</div>
<div className={styles.ding_tips}>
<div className={styles.ding_icon}>
<BellOutlined />
</div>
<span>你还没有创建店铺,请先创建店铺</span>
</div>
</div>
<div className={styles.tagsItem} >
<div className={styles.icon}>
<img src={create_shop} />
</div>
<div className={styles.text}>店铺模板</div>
</div>
<div className={styles.tagsItem} >
<div className={styles.icon}>
<img src={create_shop} />
</div>
<div className={styles.text}>店铺装修</div>
</div>
</div>
</AbilityContainer>
)
}
export default ShopCenter
\ No newline at end of file
import React from 'react';
import AbilityContainer from './Container';
import { Row, Col } from 'antd';
import styles from './center.less'
interface Iprops {};
const TradeCenter: React.FC<Iprops> = () => {
const data = [
{
id: 1,
list: [1,2,3,4]
},
{
id: 2,
list: [1,2,3,4]
},
{
id: 3,
list: [1,2,3,4,5]
},
{
id: 4,
list: [1,2,3,4,5,6]
},
{
id: 5,
list: [1,2,3,4,5,6]
},
{
id: 6,
list: [1]
}
]
return (
<AbilityContainer
title="交易中心"
tips="提供在线发布需求,在线询价、在线报价、订单交易、签订电子合同等功能"
extra={
<div>
<a>进入交易中心</a>
</div>
}
>
{
data.map((record) => {
return (
<Row key={record.id} className={styles.row}>
<Col span={4} className={styles.rowTitle}>平台代收账款结算</Col>
<Col span={20} className={styles.colRow}>
{
record.list.map((item) => {
return (
<Col span={4} key={item}>
<div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div>
</Col>
)
})
}
</Col>
</Row>
)
})
}
</AbilityContainer>
)
}
export default TradeCenter
\ No newline at end of file
.row {
padding: 24px 0;
.rowTitle {
font-size: 14;
font-weight: 400;
color: #303133;
}
.colRow {
display: flex;
.colTitle {
font-size: 12px;
font-weight: 400;
color: #909399;;
}
.colValue {
font-weight: 500;
font-size: 24px;
margin-top: 16px;
color: #303133;
&:hover {
text-decoration: underline;
color: @main-color;
cursor: pointer;
}
}
}
}
.tags {
padding: 24px 0;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
.tagsItem {
display: flex;
flex-direction: row;
align-items: center;
padding: 8px 16px;
background: #FAFBFC;
width: 212px;
margin: 0 16px 16px 0;
cursor: pointer;
align-self: flex-start;
// position: relative;
.icon {
width: 32px;
height: 32px;
margin-right: 16px;
}
.text {
font-size: 14px;
font-weight: 400;
color: #303133;
}
}
.tagsSpecial {
display: flex;
flex-direction: column;
.ding_tips {
width: 212px;
color: @main-color;
background: rgba(0, 179, 122, 0.12);
padding: 10px;
display: flex;
flex-direction: row;
position: relative;
.ding_icon {
margin-right: 10px;
}
&:before {
content: '';
position: absolute;
top: -10px;
left: 20px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid rgba(0, 179, 122, 0.12);;
}
}
}
}
import TradeCenter from './TradeCenter';
import ShopCenter from './ShopCenter';
import ProductCenter from './ProductCenter';
import SettlementCenter from './SettlementCenter';
import AfterSoldCenter from './AfterSoldCenter'
import LogisticsCenter from './LogisticsCenter'
import ProcessCenter from './ProcessCenter';
export {
TradeCenter,
ShopCenter,
ProductCenter,
SettlementCenter,
AfterSoldCenter,
LogisticsCenter,
ProcessCenter
}
\ No newline at end of file
......@@ -65,10 +65,7 @@ const UseGuaid: React.FC<{}> = () => {
</Col>
</Row>
</Space>
<div className={styles.controller}>
<CompassFilled className={styles.icon} />
<span className={styles.text}>使用向导</span>
</div>
</div>
)
}
......
.userGuaid {
margin-bottom: 24px;
}
.main {
display: flex;
flex-direction: row;
......@@ -6,6 +10,10 @@
// flex-basis: 1206px;
margin-right: 23px;
flex: 1;
.ability {
margin-top: 24px;
}
}
.rightSide {
......@@ -17,5 +25,27 @@
.announce {
margin-top: 24px;
}
.controller {
background-color: @main-color;
width: 181px;
height: 48px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 8px;
color: #fff;
display: flex;
flex-direction: row;
margin-left: auto;
cursor: pointer;
.icon {
font-size: 24px;
}
.text {
margin-left: 8px;
}
}
}
}
\ No newline at end of file
......@@ -8,44 +8,77 @@ import LatestAnnounce from './components/LatestAnnounces';
import RecentVisit from './components/RecentVisit';
import AnyQuestion from './components/AnyQuestion';
import AdvertisementSpace from './components/AdvertisementSpace';
import { TradeCenter, ShopCenter, ProductCenter, SettlementCenter, AfterSoldCenter, LogisticsCenter, ProcessCenter } from './components/Centers';
import styles from './index.less'
import { CompassFilled } from '@ant-design/icons';
const Home: React.FC<{}> = () => {
const [visible, setVisible] = useState(false);
return (
<PageHeaderWrapper>
<div className={styles.main}>
<div className={styles.mainSide}>
<div>
<UserCenter />
</div>
<>
<div className={styles.userGuaid} style={{display: visible ? 'block': 'none'}}>
<UseGuaid/>
</div>
<div className={styles.rightSide}>
<Row gutter={24}>
<Col><CustomWorkBench /></Col>
<Col><CustomWorkBench /></Col>
</Row>
<div className={styles.announce}>
<LatestAnnounce />
</div>
<div className={styles.announce}>
<RecentVisit />
</div>
<div className={styles.announce}>
<AnyQuestion />
<div className={styles.main}>
<div className={styles.mainSide}>
<div>
<UserCenter />
</div>
<div className={styles.ability}>
<TradeCenter />
</div>
<div className={styles.ability}>
<ShopCenter />
</div>
<div className={styles.ability}>
<ProductCenter />
</div>
<div className={styles.ability}>
<SettlementCenter />
</div>
<div className={styles.ability}>
<AfterSoldCenter />
</div>
<div className={styles.ability}>
<LogisticsCenter />
</div>
<div className={styles.ability}>
<ProcessCenter />
</div>
</div>
<div className={styles.announce}>
<AdvertisementSpace title="方案中心" urlLink="" urlText="前往购买" tips="" />
</div>
<div className={styles.announce}>
<AdvertisementSpace title="方案中心" urlLink="" urlText="前往购买" tips="" />
</div>
<div className={styles.announce}>
<AdvertisementSpace title="方案中心" urlLink="" urlText="前往购买" tips="" />
<div className={styles.rightSide}>
<Row gutter={24}>
<Col><CustomWorkBench /></Col>
<Col>
<div className={styles.controller} onClick={() => setVisible((state) => !state)}>
<CompassFilled className={styles.icon} />
<span className={styles.text}>使用向导</span>
</div>
</Col>
</Row>
<div className={styles.announce}>
<LatestAnnounce />
</div>
<div className={styles.announce}>
<RecentVisit />
</div>
<div className={styles.announce}>
<AnyQuestion />
</div>
{
[1,2,3,4].map((item) => {
return (
<div className={styles.announce} key={item}>
<AdvertisementSpace title="方案中心" urlLink="" urlText="前往购买" tips="" />
</div>
)
})
}
</div>
</div>
</div>
</>
</PageHeaderWrapper>
)
}
......
......@@ -35,7 +35,7 @@
background-color: rgba(250, 250, 250, 1);
box-shadow: none;
&:focus {
&:focus, &:active, &:hover {
box-shadow: none;
}
}
......
......@@ -20,15 +20,15 @@ const BreadCrumbs: React.FC<BreadCrumbsPropsType> = (props) => {
const handlePreeEnter = (e) => {
const { value } = e.target
history.push(getLink('/infomation/search', `?keyword=${value}`))
history.push(getLink('/infomation/search', `&keyword=${value}`))
}
const getLink = (path, param?) => {
switch (layoutType) {
case LAYOUT_TYPE.channel:
return `${GlobalConfig.channelRootRoute}${path}${param ? param : ''}&channelId=${shopUrlParam}`
return `${GlobalConfig.channelRootRoute}${path}?channelId=${shopUrlParam}${param ? param : ''}`
case LAYOUT_TYPE.ichannel:
return `${GlobalConfig.ichannelRootRoute}${path}${param ? param : ''}&channelId=${shopUrlParam}`
return `${GlobalConfig.ichannelRootRoute}${path}?channelId=${shopUrlParam}${param ? param : ''}`
default:
return `${path}${param ? param : ''}`
}
......
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