Commit c5e23fa7 authored by GuanHua's avatar GuanHua

Merge branch 'dev' into test

parents 8f232b02 4a87a3ae
...@@ -100,6 +100,24 @@ const ChannelRoute = { ...@@ -100,6 +100,24 @@ const ChannelRoute = {
component: '@/pages/lxMall/order', component: '@/pages/lxMall/order',
}, },
{ {
// 渠道订单支付页面
path: `${rootRoute}/pay`,
name: 'pay',
key: 'pay',
hide: true,
hideHeader: true,
component: '@/pages/lxMall/pay',
},
{
// 支付结果页面
path: `${rootRoute}/pay/result`,
name: 'payResult',
key: 'payResult',
hide: true,
hideHeader: true,
component: '@/pages/lxMall/payResult',
},
{
path: '/noAuth', path: '/noAuth',
component: '@/pages/403', component: '@/pages/403',
}, },
......
...@@ -100,6 +100,24 @@ const selfChannelRoute = { ...@@ -100,6 +100,24 @@ const selfChannelRoute = {
component: '@/pages/lxMall/order', component: '@/pages/lxMall/order',
}, },
{ {
// 渠道订单支付页面
path: `${rootRoute}/pay`,
name: 'pay',
key: 'pay',
hide: true,
hideHeader: true,
component: '@/pages/lxMall/pay',
},
{
// 支付结果页面
path: `${rootRoute}/pay/result`,
name: 'payResult',
key: 'payResult',
hide: true,
hideHeader: true,
component: '@/pages/lxMall/payResult',
},
{
path: '/noAuth', path: '/noAuth',
component: '@/pages/403', component: '@/pages/403',
}, },
......
...@@ -45,6 +45,7 @@ ...@@ -45,6 +45,7 @@
"bizcharts": "^4.0.14", "bizcharts": "^4.0.14",
"copy-to-clipboard": "^3.3.1", "copy-to-clipboard": "^3.3.1",
"god": "0.2.1", "god": "0.2.1",
"immutability-helper": "^3.1.1",
"lingxi-design": "^1.0.8", "lingxi-design": "^1.0.8",
"lingxi-design-ui": "^1.1.10", "lingxi-design-ui": "^1.1.10",
"lingxi-editor-core": "^1.0.6", "lingxi-editor-core": "^1.0.6",
...@@ -59,6 +60,8 @@ ...@@ -59,6 +60,8 @@
"qrcode": "^1.4.4", "qrcode": "^1.4.4",
"query-string": "^6.13.1", "query-string": "^6.13.1",
"react": "^16.12.0", "react": "^16.12.0",
"react-dnd": "^11.1.3",
"react-dnd-html5-backend": "^11.1.3",
"react-dom": "^16.12.0", "react-dom": "^16.12.0",
"react-fontawesome": "^1.7.1", "react-fontawesome": "^1.7.1",
"react-image-crop": "^8.6.4", "react-image-crop": "^8.6.4",
......
...@@ -65,6 +65,8 @@ const mallLists = [ ...@@ -65,6 +65,8 @@ const mallLists = [
`${channelRootRoute}/about`, `${channelRootRoute}/about`,
`${channelRootRoute}/purchaseOrder`, `${channelRootRoute}/purchaseOrder`,
`${channelRootRoute}/order`, `${channelRootRoute}/order`,
`${channelRootRoute}/pay`,
`${channelRootRoute}/pay/result`,
`${ichannelRootRoute}`, `${ichannelRootRoute}`,
`${ichannelRootRoute}/commodity`, `${ichannelRootRoute}/commodity`,
`${ichannelRootRoute}/commodity/search`, `${ichannelRootRoute}/commodity/search`,
...@@ -76,6 +78,8 @@ const mallLists = [ ...@@ -76,6 +78,8 @@ const mallLists = [
`${ichannelRootRoute}/about`, `${ichannelRootRoute}/about`,
`${ichannelRootRoute}/purchaseOrder`, `${ichannelRootRoute}/purchaseOrder`,
`${ichannelRootRoute}/order`, `${ichannelRootRoute}/order`,
`${ichannelRootRoute}/pay`,
`${ichannelRootRoute}/pay/result`,
] ]
// let routeAuthUrls: any[] = [] // let routeAuthUrls: any[] = []
......
...@@ -67,7 +67,7 @@ const InputNumber: React.FC<InputNumberPropsType> = (props) => { ...@@ -67,7 +67,7 @@ const InputNumber: React.FC<InputNumberPropsType> = (props) => {
return ( return (
<div className={styles.input_number}> <div className={styles.input_number}>
<div className={cx(styles.input_number_item, styles.reduce, value <= minCount ? styles.disable : '')} onClick={handleReduce}><MinusOutlined /></div> <div className={cx(styles.input_number_item, styles.reduce, value <= minCount ? styles.disable : '')} onClick={handleReduce}><MinusOutlined /></div>
<input disabled={disabled} className={styles.input_number_input} value={value} onChange={handleChange} onBlur={handleBlur} /> <input disabled={disabled} maxLength={8} className={styles.input_number_input} value={value} onChange={handleChange} onBlur={handleBlur} />
<div className={cx(styles.input_number_item, styles.add, value >= maxCount ? styles.disable : '')} onClick={handleAdd}><PlusOutlined /></div> <div className={cx(styles.input_number_item, styles.add, value >= maxCount ? styles.disable : '')} onClick={handleAdd}><PlusOutlined /></div>
</div> </div>
) )
......
...@@ -225,6 +225,7 @@ const ChannelPreview: React.FC<ChannelPreviewPropsType> = (props) => { ...@@ -225,6 +225,7 @@ const ChannelPreview: React.FC<ChannelPreviewPropsType> = (props) => {
"props": { "props": {
categoryAdvertPicUrl: categoryDetail.categoryAdvertPicUrl, categoryAdvertPicUrl: categoryDetail.categoryAdvertPicUrl,
categoryid: item.id, categoryid: item.id,
linkdisable: true,
categoryList: categoryDetail.categoryBOList categoryList: categoryDetail.categoryBOList
}, },
}, },
......
...@@ -5,7 +5,8 @@ ...@@ -5,7 +5,8 @@
&_item { &_item {
position: relative; position: relative;
width: 380px; // width: 380px;
flex: 0 0 48.6%;
height: 136px; height: 136px;
border: 1px solid #ffffff; border: 1px solid #ffffff;
margin: 8px 4px; margin: 8px 4px;
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
} }
&_info { &_info {
flex: 1; flex-grow: 1;
width: 0; width: 0;
margin-left: 12px; margin-left: 12px;
......
...@@ -39,7 +39,7 @@ const SettlementAbility: React.FC<Iprops> = () => { ...@@ -39,7 +39,7 @@ const SettlementAbility: React.FC<Iprops> = () => {
{ {
record.list.map((item) => { record.list.map((item) => {
return ( return (
<Col span={4} key={item}> <Col span={4} key={item} className={styles.col}>
<div className={styles.colTitle}>待提交审核咨询单</div> <div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div> <div className={styles.colValue}>5</div>
</Col> </Col>
......
...@@ -29,7 +29,7 @@ const ProcessCenter: React.FC<Iprops> = () => { ...@@ -29,7 +29,7 @@ const ProcessCenter: React.FC<Iprops> = () => {
{ {
record.list.map((item) => { record.list.map((item) => {
return ( return (
<Col span={4} key={item}> <Col span={4} key={item} className={styles.col}>
<div className={styles.colTitle}>待提交审核咨询单</div> <div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div> <div className={styles.colValue}>5</div>
</Col> </Col>
......
...@@ -33,7 +33,7 @@ const ProductCenter: React.FC<Iprops> = () => { ...@@ -33,7 +33,7 @@ const ProductCenter: React.FC<Iprops> = () => {
{ {
record.list.map((item) => { record.list.map((item) => {
return ( return (
<Col span={4} key={item}> <Col span={4} key={item} className={styles.col}>
<div className={styles.colTitle}>待提交审核咨询单</div> <div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div> <div className={styles.colValue}>5</div>
</Col> </Col>
......
...@@ -81,7 +81,7 @@ const SettlementCenter: React.FC<Iprops> = () => { ...@@ -81,7 +81,7 @@ const SettlementCenter: React.FC<Iprops> = () => {
{ {
record.list.map((item) => { record.list.map((item) => {
return ( return (
<Col span={4} key={item}> <Col span={4} key={item} className={styles.col}>
<div className={styles.colTitle}>待提交审核咨询单</div> <div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div> <div className={styles.colValue}>5</div>
</Col> </Col>
......
...@@ -21,7 +21,7 @@ const TradeCenter: React.FC<Iprops> = () => { ...@@ -21,7 +21,7 @@ const TradeCenter: React.FC<Iprops> = () => {
}, },
{ {
id: 4, id: 4,
list: [1,2,3,4,5,6] list: [1,2,3,4,5,6,7,8,9,10]
}, },
{ {
id: 5, id: 5,
...@@ -51,7 +51,7 @@ const TradeCenter: React.FC<Iprops> = () => { ...@@ -51,7 +51,7 @@ const TradeCenter: React.FC<Iprops> = () => {
{ {
record.list.map((item) => { record.list.map((item) => {
return ( return (
<Col span={4} key={item}> <Col span={4} key={item} className={styles.col}>
<div className={styles.colTitle}>待提交审核咨询单</div> <div className={styles.colTitle}>待提交审核咨询单</div>
<div className={styles.colValue}>5</div> <div className={styles.colValue}>5</div>
</Col> </Col>
......
.row { .row {
padding: 24px 0; padding: 0px 0px 12px 0;
.rowTitle { .rowTitle {
font-size: 14; font-size: 14;
font-weight: 400; font-weight: 400;
color: #303133; color: #303133;
margin-top: 24px;
} }
.colRow { .colRow {
display: flex; display: flex;
flex-wrap: wrap;
.col {
margin-top: 24px;
}
.colTitle { .colTitle {
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
......
import React, { useRef } from 'react'
import { useDrag, useDrop, DropTargetMonitor } from 'react-dnd'
// import { ItemTypes } from './ItemTypes'
import { XYCoord } from 'dnd-core'
import { Checkbox } from 'antd'
const style = {
width: '352px',
height: '40px',
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
border: '1px solid #EEF0F3',
padding: '14px 16px',
marginBottom: '12px',
backgroundColor: 'white',
cursor: 'move',
}
const ItemTypes = {
CARD: 'card'
}
export interface CardProps {
id: any
text: string
index: number
moveCard: (dragIndex: number, hoverIndex: number) => void
}
interface DragItem {
index: number
id: string
type: string
}
export const Card: React.FC<CardProps> = ({ id, text, index, moveCard }) => {
const ref = useRef<HTMLDivElement>(null)
const [, drop] = useDrop({
accept: ItemTypes.CARD,
hover(item: DragItem, monitor: DropTargetMonitor) {
if (!ref.current) {
return
}
const dragIndex = item.index
const hoverIndex = index
if (dragIndex === hoverIndex) {
return
}
const hoverBoundingRect = ref.current?.getBoundingClientRect()
const hoverMiddleY =
(hoverBoundingRect.bottom - hoverBoundingRect.top) / 2
const clientOffset = monitor.getClientOffset()
const hoverClientY = (clientOffset as XYCoord).y - hoverBoundingRect.top
if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {
return
}
if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {
return
}
moveCard(dragIndex, hoverIndex)
item.index = hoverIndex
},
})
const [{ isDragging }, drag] = useDrag({
item: { type: ItemTypes.CARD, id, index },
collect: (monitor: any) => ({
isDragging: monitor.isDragging(),
}),
})
const opacity = isDragging ? 0 : 1
drag(drop(ref))
return (
<div ref={ref} style={{ ...style, opacity }}>
<span>
{text}
</span>
<Checkbox />
</div>
)
}
import React, { useState, useCallback, useEffect } from 'react'
import { Card } from './Card'
import update from 'immutability-helper'
const style = {
height: "500px",
display: "flex",
flexDirection: "column",
flexWrap: "wrap",
}
export interface Item {
id: number
text: string
}
export interface ContainerState {
cards: Item[]
}
interface Iprops {
cards: any[],
moveCard: (dragIndex: number, hoverIndex: number) => void
}
const Container: React.FC<Iprops> = (props) => {
const { cards } = props;
const renderCard = (card: { id: number; text: string }, index: number) => {
return (
<Card
key={card.id}
index={index}
id={card.id}
text={card.text}
moveCard={props.moveCard}
/>
)
}
return (
<>
<div style={style}>{cards.map((card, i) => renderCard(card, i))}</div>
</>
)
}
export default Container
import React, {useState, useCallback, useMemo, useEffect} from 'react';
const POSITION = {x: 0, y: 0};
const Draggable = ({children, id, onDrag, onDragEnd}) => {
const [state, setState] = useState({
isDragging: false,
origin: POSITION,
translation: POSITION
});
const handleMouseDown = useCallback(({clientX, clientY}) => {
setState(state => ({
...state,
isDragging: true,
origin: {x: clientX, y: clientY}
}));
}, []);
const handleMouseMove = useCallback(({clientX, clientY}) => {
const translation = {x: clientX - state.origin.x, y: clientY - state.origin.y};
setState(state => ({
...state,
translation
}));
onDrag({translation, id});
}, [state.origin, onDrag, id]);
const handleMouseUp = useCallback(() => {
setState(state => ({
...state,
isDragging: false
}));
onDragEnd();
}, [onDragEnd]);
useEffect(() => {
if (state.isDragging) {
window.addEventListener('mousemove', handleMouseMove);
window.addEventListener('mouseup', handleMouseUp);
} else {
window.removeEventListener('mousemove', handleMouseMove);
window.removeEventListener('mouseup', handleMouseUp);
setState(state => ({...state, translation: {x: 0, y: 0}}));
}
}, [state.isDragging, handleMouseMove, handleMouseUp]);
const styles = useMemo(() => ({
cursor: state.isDragging ? '-webkit-grabbing' : '-webkit-grab',
transform: `translate(${state.translation.x}px, ${state.translation.y}px)`,
transition: state.isDragging ? 'none' : 'transform 500ms',
zIndex: state.isDragging ? 2 : 1,
position: state.isDragging ? 'absolute' : 'static'
}), [state.isDragging, state.translation]);
return (
<div style={styles} onMouseDown={handleMouseDown}>
{children}
</div>
);
};
export default Draggable;
\ No newline at end of file
import React, {useState, useCallback} from 'react';
import styled from 'styled-components';
import {range, inRange} from 'lodash';
import Draggable from './Draggable';
import { Checkbox } from 'antd';
const MAX = 11;
const HEIGHT = 40;
const SortedList = () => {
const items = range(MAX);
const [state, setState] = useState({
order: items,
dragOrder: items,
draggedIndex: null
});
const handleDrag = useCallback(({translation, id}) => {
const delta = Math.round(translation.y / HEIGHT);
const index = state.order.indexOf(id);
const dragOrder = state.order.filter(index => index !== id);
if (!inRange(index + delta, 0, items.length)) {
return;
}
dragOrder.splice(index + delta, 0, id);
setState(state => ({
...state,
draggedIndex: id,
dragOrder
}));
}, [state.order, items.length]);
const handleDragEnd = useCallback(() => {
setState(state => ({
...state,
order: state.dragOrder,
draggedIndex: null
}));
}, []);
return (
<Container>
{items.map(index => {
const isDragging = state.draggedIndex === index;
const top = state.dragOrder.indexOf(index) * (HEIGHT + 10);
const draggedTop = state.order.indexOf(index) * (HEIGHT + 10);
return (
<Draggable
key={index}
id={index}
onDrag={handleDrag}
onDragEnd={handleDragEnd}
>
<Rect
isDragging={isDragging}
top={isDragging ? draggedTop : top}
>
<div>交易能力-{`${index}`}</div>
<div><Checkbox /></div>
</Rect>
</Draggable>
);
})}
</Container>
);
};
export default SortedList;
const Container = styled.div`
display: flex;
flex-direction: column;
flex-wrap: wrap;
position: relative;
height: 522px;
`;
const Rect = styled.div.attrs(props => ({
style: {
transition: props.isDragging ? 'none' : 'all 500ms'
}
}))`
width: 352px;
user-select: none;
height: ${HEIGHT}px;
display: flex;
align-items: center;
justify-content: space-between;
border: 1px solid #EEF0F3;
padding: 14px 16px;
margin-bottom: 12px;
background: #fff;
position: absolute;
top: ${({top}) => top}px;
left: 0
`;
\ No newline at end of file
import React, { useState} from 'react'; import React, { useState, useEffect, useCallback } from 'react';
import { Modal, Button, Checkbox } from 'antd'; import { Modal } from 'antd';
import { AppstoreOutlined } from '@ant-design/icons';
import styles from './index.less'; import styles from './index.less';
import { CloseOutlined } from '@ant-design/icons'; import { CloseOutlined } from '@ant-design/icons';
import SortedList from './SortedList'; import { DndProvider } from 'react-dnd'
import { HTML5Backend } from 'react-dnd-html5-backend';
import DragSortList from './DragSortList';
import update from 'immutability-helper'
interface Iprops {} interface Iprops {
centerOrder: any,
handleChangeOrder: (list: any[]) => void
}
const CustomWorkBench: React.FC<Iprops> = () => { const TEXT = {
const [visible, setVisible] = useState(false); ["shop"]: '店铺中心',
["trade"]: '交易中心',
["process"]: '加工中心',
["settlement"]: '资金与结算中心',
["afterSold"]: "售后中心",
["logistics"]: '物流中心',
["product"]: '商品中心'
}
const CustomWorkBench: React.FC<Iprops> = (props) => {
const { centerOrder } = props;
const [ cards, setCards ] = useState([]);
const [visible, setVisible] = useState<boolean>(false);
const handleVisible = () => { const handleVisible = () => {
setVisible(true) setVisible(true)
} }
...@@ -18,6 +34,36 @@ const CustomWorkBench: React.FC<Iprops> = () => { ...@@ -18,6 +34,36 @@ const CustomWorkBench: React.FC<Iprops> = () => {
setVisible(false) setVisible(false)
} }
useEffect(() => {
const data = Object.keys(centerOrder).map((item) => ({
id: centerOrder[item],
key: item,
text: TEXT[item]
}))
setCards(data)
}, [centerOrder])
const moveCard = useCallback(
(dragIndex: number, hoverIndex: number) => {
const dragCard = cards[dragIndex]
setCards(
update(cards, {
$splice: [
[dragIndex, 1],
[hoverIndex, 0, dragCard],
],
}),
)
},
[cards],
)
const handleOk = () => {
props.handleChangeOrder && props.handleChangeOrder(cards);
setVisible(false);
}
return ( return (
<div className={styles.customWorkBench}> <div className={styles.customWorkBench}>
<div className={styles.btn} onClick={handleVisible}> <div className={styles.btn} onClick={handleVisible}>
...@@ -30,6 +76,7 @@ const CustomWorkBench: React.FC<Iprops> = () => { ...@@ -30,6 +76,7 @@ const CustomWorkBench: React.FC<Iprops> = () => {
onCancel={handleCancel} onCancel={handleCancel}
closable={false} closable={false}
bodyStyle={{padding: 0}} bodyStyle={{padding: 0}}
onOk={handleOk}
> >
<div className={styles.modalContainer}> <div className={styles.modalContainer}>
<div className={styles.header}> <div className={styles.header}>
...@@ -42,7 +89,9 @@ const CustomWorkBench: React.FC<Iprops> = () => { ...@@ -42,7 +89,9 @@ const CustomWorkBench: React.FC<Iprops> = () => {
</div> </div>
</div> </div>
<div className={styles.content}> <div className={styles.content}>
<SortedList /> <DndProvider backend={HTML5Backend}>
<DragSortList cards={cards} moveCard={moveCard} />
</DndProvider>
</div> </div>
<div className={styles.footer}> <div className={styles.footer}>
<div className={styles.sortTips}> <div className={styles.sortTips}>
......
...@@ -10,6 +10,8 @@ ...@@ -10,6 +10,8 @@
// flex-basis: 1206px; // flex-basis: 1206px;
margin-right: 23px; margin-right: 23px;
flex: 1; flex: 1;
display: flex;
flex-direction: column;
.ability { .ability {
margin-top: 24px; margin-top: 24px;
......
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import { PageHeaderWrapper } from '@ant-design/pro-layout' import { PageHeaderWrapper } from '@ant-design/pro-layout'
import { Row, Col } from 'antd'; import { Row, Col, Button } from 'antd';
import UseGuaid from './components/UseGuaid'; import UseGuaid from './components/UseGuaid';
import UserCenter from './components/UserCenter'; import UserCenter from './components/UserCenter';
import CustomWorkBench from './components/CustomWorkBench'; import CustomWorkBench from './components/CustomWorkBench';
...@@ -13,7 +13,27 @@ import styles from './index.less' ...@@ -13,7 +13,27 @@ import styles from './index.less'
import { CompassFilled } from '@ant-design/icons'; import { CompassFilled } from '@ant-design/icons';
const Home: React.FC<{}> = () => { const Home: React.FC<{}> = () => {
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState<boolean>(false);
const [centerOrder, setCenterOrder] = useState<any>({
trade: 1,
shop: 2,
product: 3,
settlement: 4,
afterSold: 5,
logistics: 6,
process: 7
})
const handleChangeOrder = (list) => {
console.log(list);
let res = {}
list.forEach((item, index) => {
res[item.key] = index + 1
})
console.log(res);
setCenterOrder(res);
}
return ( return (
<PageHeaderWrapper> <PageHeaderWrapper>
<> <>
...@@ -25,31 +45,31 @@ const Home: React.FC<{}> = () => { ...@@ -25,31 +45,31 @@ const Home: React.FC<{}> = () => {
<div> <div>
<UserCenter /> <UserCenter />
</div> </div>
<div className={styles.ability}> <div className={styles.ability} style={{order: centerOrder["trade"]}}>
<TradeCenter /> <TradeCenter />
</div> </div>
<div className={styles.ability}> <div className={styles.ability} style={{order: centerOrder["shop"]}}>
<ShopCenter /> <ShopCenter />
</div> </div>
<div className={styles.ability}> <div className={styles.ability} style={{order: centerOrder["product"]}}>
<ProductCenter /> <ProductCenter />
</div> </div>
<div className={styles.ability}> <div className={styles.ability} style={{order: centerOrder["settlement"]}}>
<SettlementCenter /> <SettlementCenter />
</div> </div>
<div className={styles.ability}> <div className={styles.ability} style={{order: centerOrder["afterSold"]}}>
<AfterSoldCenter /> <AfterSoldCenter />
</div> </div>
<div className={styles.ability}> <div className={styles.ability} style={{order: centerOrder["logistics"]}}>
<LogisticsCenter /> <LogisticsCenter />
</div> </div>
<div className={styles.ability}> <div className={styles.ability} style={{order: centerOrder["process"]}}>
<ProcessCenter /> <ProcessCenter />
</div> </div>
</div> </div>
<div className={styles.rightSide}> <div className={styles.rightSide}>
<Row gutter={24}> <Row gutter={24}>
<Col><CustomWorkBench /></Col> <Col><CustomWorkBench centerOrder={centerOrder} handleChangeOrder={handleChangeOrder} /></Col>
<Col> <Col>
<div className={styles.controller} onClick={() => setVisible((state) => !state)}> <div className={styles.controller} onClick={() => setVisible((state) => !state)}>
<CompassFilled className={styles.icon} /> <CompassFilled className={styles.icon} />
......
...@@ -151,7 +151,7 @@ const ChannelIndex: React.FC<ChannelIndexPropsType> = (props) => { ...@@ -151,7 +151,7 @@ const ChannelIndex: React.FC<ChannelIndexPropsType> = (props) => {
useMemo(() => <Advert visible={firstAdvertList.length > 0} type="banner" advertList={firstAdvertList} hasQuickNav={false} />, [firstAdvertList]) useMemo(() => <Advert visible={firstAdvertList.length > 0} type="banner" advertList={firstAdvertList} hasQuickNav={false} />, [firstAdvertList])
} }
</div> </div>
<FloorAnchor anchorList={categoryList} type="shop" /> <FloorAnchor anchorList={categoryList} type={LAYOUT_TYPE.channel} />
<CommonTitle title="热销商品" type="primary" /> <CommonTitle title="热销商品" type="primary" />
{ {
categoryComponents ? categoryComponents : loading ? <FloorSkeleton type={LAYOUT_TYPE.shop} /> : null categoryComponents ? categoryComponents : loading ? <FloorSkeleton type={LAYOUT_TYPE.shop} /> : null
......
...@@ -451,6 +451,13 @@ const CommodityDetail = (props) => { ...@@ -451,6 +451,13 @@ const CommodityDetail = (props) => {
message.info("请选择商品属性") message.info("请选择商品属性")
return return
} }
if (stockCount < commodityDetail.minOrder) {
message.destroy()
message.info("库存不足")
return
}
if (clickFlag) { if (clickFlag) {
clickFlag = false clickFlag = false
......
...@@ -73,9 +73,9 @@ const Category: React.FC<CategoryPropsType> = (props) => { ...@@ -73,9 +73,9 @@ const Category: React.FC<CategoryPropsType> = (props) => {
case LAYOUT_TYPE.shop: case LAYOUT_TYPE.shop:
return `/shop/commodity?categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.title))}&shopId=${shopUrlParam}` return `/shop/commodity?categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.title))}&shopId=${shopUrlParam}`
case LAYOUT_TYPE.channel: case LAYOUT_TYPE.channel:
return `${GlobalConfig.channelRootRoute}/commodity?categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.title))}&id=${shopUrlParam}` return `${GlobalConfig.channelRootRoute}/commodity?categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.title))}&channelId=${shopUrlParam}`
case LAYOUT_TYPE.ichannel: case LAYOUT_TYPE.ichannel:
return `${GlobalConfig.ichannelRootRoute}/commodity?categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.title))}&id=${shopUrlParam}` return `${GlobalConfig.ichannelRootRoute}/commodity?categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.title))}&channelId=${shopUrlParam}`
default: default:
return `/commodity?categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.title))}` return `/commodity?categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.title))}`
} }
...@@ -86,9 +86,9 @@ const Category: React.FC<CategoryPropsType> = (props) => { ...@@ -86,9 +86,9 @@ const Category: React.FC<CategoryPropsType> = (props) => {
case LAYOUT_TYPE.shop: case LAYOUT_TYPE.shop:
return `/shop/commodity?brandId=${item.brandId}&brandName=${btoa(encodeURIComponent(item.brandName))}&shopId=${shopUrlParam}` return `/shop/commodity?brandId=${item.brandId}&brandName=${btoa(encodeURIComponent(item.brandName))}&shopId=${shopUrlParam}`
case LAYOUT_TYPE.channel: case LAYOUT_TYPE.channel:
return `${GlobalConfig.channelRootRoute}/commodity?brandId=${item.brandId}&brandName=${btoa(encodeURIComponent(item.brandName))}&id=${shopUrlParam}` return `${GlobalConfig.channelRootRoute}/commodity?brandId=${item.brandId}&brandName=${btoa(encodeURIComponent(item.brandName))}&channelId=${shopUrlParam}`
case LAYOUT_TYPE.ichannel: case LAYOUT_TYPE.ichannel:
return `${GlobalConfig.ichannelRootRoute}/commodity?brandId=${item.brandId}&brandName=${btoa(encodeURIComponent(item.brandName))}&id=${shopUrlParam}` return `${GlobalConfig.ichannelRootRoute}/commodity?brandId=${item.brandId}&brandName=${btoa(encodeURIComponent(item.brandName))}&channelId=${shopUrlParam}`
default: default:
return `/commodity?brandId=${item.brandId}&brandName=${btoa(encodeURIComponent(item.brandName))}` return `/commodity?brandId=${item.brandId}&brandName=${btoa(encodeURIComponent(item.brandName))}`
} }
......
import React from 'react' import React from 'react'
import { ToTopOutlined } from '@ant-design/icons' import { ToTopOutlined } from '@ant-design/icons'
import { Anchor, BackTop } from 'antd' import { Anchor, BackTop } from 'antd'
import qrcodeImg from '@/assets/imgs/erweima.png' import { LAYOUT_TYPE } from '@/constants'
import './index.less' import './index.less'
interface FloorAnchorPropsType { interface FloorAnchorPropsType {
...@@ -17,7 +17,7 @@ const FloorAnchor: React.FC<FloorAnchorPropsType> = (props) => { ...@@ -17,7 +17,7 @@ const FloorAnchor: React.FC<FloorAnchorPropsType> = (props) => {
<div className="anchor_wrap"> <div className="anchor_wrap">
<Anchor className="anchor" offsetTop={120} > <Anchor className="anchor" offsetTop={120} >
{ {
type === 'shop' && <Anchor.Link href={`#about_us`} title="关于我们" /> type === LAYOUT_TYPE.shop && <Anchor.Link href={`#about_us`} title="关于我们" />
} }
{ {
anchorList.map(item => ( anchorList.map(item => (
...@@ -27,6 +27,9 @@ const FloorAnchor: React.FC<FloorAnchorPropsType> = (props) => { ...@@ -27,6 +27,9 @@ const FloorAnchor: React.FC<FloorAnchorPropsType> = (props) => {
{ {
type === 'mall' && <Anchor.Link href={`#find_more`} title="发现更多" /> type === 'mall' && <Anchor.Link href={`#find_more`} title="发现更多" />
} }
{
(type === LAYOUT_TYPE.channel || type === LAYOUT_TYPE.ichannel) && <Anchor.Link href={`#about_us`} title="关于我们" />
}
<BackTop> <BackTop>
<ToTopOutlined /> <ToTopOutlined />
<span className="text">顶部</span> <span className="text">顶部</span>
......
...@@ -13,11 +13,12 @@ import styles from './index.less' ...@@ -13,11 +13,12 @@ import styles from './index.less'
interface MallIndexPropsType { interface MallIndexPropsType {
SiteStore?: any; SiteStore?: any;
mallInfo: any mallInfo: any;
layoutType: LAYOUT_TYPE
} }
const MallIndex: React.FC<MallIndexPropsType> = (props) => { const MallIndex: React.FC<MallIndexPropsType> = (props) => {
const { mallInfo } = props const { mallInfo, layoutType } = props
const [categoryList, setCategoryList] = useState<GetTemplatePlatformFindAllFirstCategoryResponse>([]) const [categoryList, setCategoryList] = useState<GetTemplatePlatformFindAllFirstCategoryResponse>([])
const { mallTemplateId } = props.SiteStore const { mallTemplateId } = props.SiteStore
const [firstAdvertList, setFirstAdvertList] = useState([]) const [firstAdvertList, setFirstAdvertList] = useState([])
...@@ -145,7 +146,7 @@ const MallIndex: React.FC<MallIndexPropsType> = (props) => { ...@@ -145,7 +146,7 @@ const MallIndex: React.FC<MallIndexPropsType> = (props) => {
{ {
useMemo(() => <Advert type="banner" advertList={firstAdvertList} hasQuickNav={true} ><QuickNav name={mallInfo.name} /></Advert>, [firstAdvertList]) useMemo(() => <Advert type="banner" advertList={firstAdvertList} hasQuickNav={true} ><QuickNav name={mallInfo.name} /></Advert>, [firstAdvertList])
} }
<FloorAnchor anchorList={categoryList} type="mall" /> <FloorAnchor anchorList={categoryList} type={LAYOUT_TYPE.mall} />
{ {
secondAdvertList ? useMemo(() => { secondAdvertList ? useMemo(() => {
if (secondAdvertList.length > 0) { if (secondAdvertList.length > 0) {
......
...@@ -15,6 +15,7 @@ import styles from './index.less' ...@@ -15,6 +15,7 @@ import styles from './index.less'
import { PublicApi } from '@/services/api' import { PublicApi } from '@/services/api'
import SignModal from '@/components/SignModal' import SignModal from '@/components/SignModal'
import { isEmpty } from 'lodash' import { isEmpty } from 'lodash'
import { GlobalConfig } from '@/global/config'
import { getAuth } from '@/utils/auth' import { getAuth } from '@/utils/auth'
import { LAYOUT_TYPE, OrderModalType, COMMODITY_TYPE } from '@/constants' import { LAYOUT_TYPE, OrderModalType, COMMODITY_TYPE } from '@/constants'
...@@ -23,12 +24,13 @@ interface OrderPropsType { ...@@ -23,12 +24,13 @@ interface OrderPropsType {
shopInfo: any; shopInfo: any;
mallInfo: any; mallInfo: any;
layoutType: LAYOUT_TYPE; layoutType: LAYOUT_TYPE;
shopUrlParam: string;
} }
const Order: React.FC<OrderPropsType> = (props) => { const Order: React.FC<OrderPropsType> = (props) => {
let checkoutCount = 0 let checkoutCount = 0
const userInfo = getAuth() const userInfo = getAuth()
const { shopInfo, mallInfo, layoutType, } = props const { shopInfo, mallInfo, layoutType, shopUrlParam } = props
const { query: { type = COMMODITY_TYPE.prompt } } = props.location const { query: { type = COMMODITY_TYPE.prompt } } = props.location
const [signModalVisible, setSignModalVisible] = useState<boolean>(false) const [signModalVisible, setSignModalVisible] = useState<boolean>(false)
const { spam_id } = props.location.query const { spam_id } = props.location.query
...@@ -310,9 +312,9 @@ const Order: React.FC<OrderPropsType> = (props) => { ...@@ -310,9 +312,9 @@ const Order: React.FC<OrderPropsType> = (props) => {
if (res.code === 1000) { if (res.code === 1000) {
const data = res.data const data = res.data
if (selectPayWay.payType === 4) { if (selectPayWay.payType === 4) {
history.replace(`/pay/result?orderId=${data.orderId}`) linkToUrl(`/pay/result?orderId=${data.orderId}`)
} else { } else {
history.replace(`/pay?orderId=${data.orderId}&spam_id=${spam_id}`) linkToUrl(`/pay?orderId=${data.orderId}&spam_id=${spam_id}`)
} }
} }
setConfirmLoading(false) setConfirmLoading(false)
...@@ -321,6 +323,21 @@ const Order: React.FC<OrderPropsType> = (props) => { ...@@ -321,6 +323,21 @@ const Order: React.FC<OrderPropsType> = (props) => {
}) })
} }
const linkToUrl = (path: string) => {
switch(layoutType) {
case LAYOUT_TYPE.channel:
history.replace(`${GlobalConfig.channelRootRoute}${path}?channelId=${shopUrlParam}`)
break
case LAYOUT_TYPE.ichannel:
history.replace(`${GlobalConfig.ichannelRootRoute}${path}?channelId=${shopUrlParam}`)
break
default:
history.replace(`${path}?channelId=${shopUrlParam}`)
break
}
}
const checkOrder = () => { const checkOrder = () => {
message.destroy() message.destroy()
if (orderInfo.logistics.deliveryType === 1 && !selectAddressInfo) { if (orderInfo.logistics.deliveryType === 1 && !selectAddressInfo) {
......
...@@ -48,6 +48,7 @@ ...@@ -48,6 +48,7 @@
.pay_btn { .pay_btn {
display: block;
width: 160px; width: 160px;
text-align: center; text-align: center;
color: #FFF; color: #FFF;
......
...@@ -7,6 +7,8 @@ import { GetMemberSecurityGetResponse } from '@/services/MemberApi' ...@@ -7,6 +7,8 @@ import { GetMemberSecurityGetResponse } from '@/services/MemberApi'
import { history } from 'umi' import { history } from 'umi'
import PasswordInput from '../passwordInput' import PasswordInput from '../passwordInput'
import { numFormat } from '@/utils/numberFomat' import { numFormat } from '@/utils/numberFomat'
import { linkToUrl } from '../../utils'
import { LAYOUT_TYPE } from '@/constants'
import styles from './index.less' import styles from './index.less'
import { message, Button, Spin } from 'antd' import { message, Button, Spin } from 'antd'
...@@ -14,11 +16,13 @@ interface CreditPayWayPropsType { ...@@ -14,11 +16,13 @@ interface CreditPayWayPropsType {
payInfo: GetOrderOrderPayDetailsResponse, payInfo: GetOrderOrderPayDetailsResponse,
orderInfo: any, orderInfo: any,
orderId: number, orderId: number,
onChange: Function onChange: Function,
layoutType?: LAYOUT_TYPE,
shopUrlParam?: string
} }
const CreditPayWay: React.FC<CreditPayWayPropsType> = (props) => { const CreditPayWay: React.FC<CreditPayWayPropsType> = (props) => {
const { payInfo, orderId, orderInfo } = props const { payInfo, orderId, orderInfo, layoutType, shopUrlParam } = props
const [payPassword, setPayPassword] = useState<string>('') const [payPassword, setPayPassword] = useState<string>('')
const [type, setType] = useState<string>('normal') // normal: 普通;member:会员 const [type, setType] = useState<string>('normal') // normal: 普通;member:会员
const [creditInfo, setCreditInfo] = useState<GetPayCreditGetCreditResponse>() const [creditInfo, setCreditInfo] = useState<GetPayCreditGetCreditResponse>()
...@@ -84,6 +88,7 @@ const CreditPayWay: React.FC<CreditPayWayPropsType> = (props) => { ...@@ -84,6 +88,7 @@ const CreditPayWay: React.FC<CreditPayWayPropsType> = (props) => {
if (res.code === 1000) { if (res.code === 1000) {
message.destroy() message.destroy()
message.success("支付成功") message.success("支付成功")
linkToUrl(`/pay/result?orderId=${orderId}`, layoutType, shopUrlParam )
history.replace(`/pay/result?orderId=${orderId}`) history.replace(`/pay/result?orderId=${orderId}`)
} else { } else {
setConfirmLoading(false) setConfirmLoading(false)
......
...@@ -6,7 +6,8 @@ import { history } from 'umi' ...@@ -6,7 +6,8 @@ import { history } from 'umi'
import { GetOrderOrderPayDetailsResponse } from '@/services/OrderApi' import { GetOrderOrderPayDetailsResponse } from '@/services/OrderApi'
import { UploadFile, UploadChangeParam } from 'antd/lib/upload/interface' import { UploadFile, UploadChangeParam } from 'antd/lib/upload/interface'
import { priceFormat } from '@/utils/numberFomat' import { priceFormat } from '@/utils/numberFomat'
import { UPLOAD_TYPE } from '@/constants' import { UPLOAD_TYPE, LAYOUT_TYPE } from '@/constants'
import { linkToUrl } from '../../utils'
import styles from './index.less' import styles from './index.less'
const { Dragger } = Upload const { Dragger } = Upload
...@@ -14,11 +15,13 @@ const { Dragger } = Upload ...@@ -14,11 +15,13 @@ const { Dragger } = Upload
interface TransferPayWayPropsType { interface TransferPayWayPropsType {
payInfo: GetOrderOrderPayDetailsResponse payInfo: GetOrderOrderPayDetailsResponse
orderId: number, orderId: number,
onChange: Function onChange: Function,
layoutType?: LAYOUT_TYPE,
shopUrlParam?: string
} }
const TransferPayWay: React.FC<TransferPayWayPropsType> = (props) => { const TransferPayWay: React.FC<TransferPayWayPropsType> = (props) => {
const { payInfo, orderId, onChange } = props const { payInfo, orderId, onChange, layoutType, shopUrlParam } = props
const [loading, setLoading] = useState<boolean>(false) const [loading, setLoading] = useState<boolean>(false)
const [payOrderUrl, setPayOrderUrls] = useState<string>() const [payOrderUrl, setPayOrderUrls] = useState<string>()
const [confirmLoading, setConfirmLoading] = useState<boolean>(false) const [confirmLoading, setConfirmLoading] = useState<boolean>(false)
...@@ -77,7 +80,7 @@ const TransferPayWay: React.FC<TransferPayWayPropsType> = (props) => { ...@@ -77,7 +80,7 @@ const TransferPayWay: React.FC<TransferPayWayPropsType> = (props) => {
if (res.code === 1000) { if (res.code === 1000) {
message.destroy() message.destroy()
message.success("支付成功") message.success("支付成功")
history.push(`/pay/result?orderId=${orderId}`) linkToUrl(`/pay/result?orderId=${orderId}`, layoutType, shopUrlParam)
} else { } else {
setConfirmLoading(false) setConfirmLoading(false)
onChange(false) onChange(false)
......
...@@ -49,7 +49,7 @@ const getPayTypeTitle = (type) => { ...@@ -49,7 +49,7 @@ const getPayTypeTitle = (type) => {
} }
const PayPage: React.FC<PayPagePropsType> = (props) => { const PayPage: React.FC<PayPagePropsType> = (props) => {
const { shopInfo, mallInfo, layoutType, } = props const { shopInfo, mallInfo, layoutType } = props
const [payState, setPayState] = useState<boolean>(false) const [payState, setPayState] = useState<boolean>(false)
const { orderId, spam_id } = props.location.query const { orderId, spam_id } = props.location.query
const [pageTitle, setPageTitle] = useState<string>() const [pageTitle, setPageTitle] = useState<string>()
...@@ -105,17 +105,18 @@ const PayPage: React.FC<PayPagePropsType> = (props) => { ...@@ -105,17 +105,18 @@ const PayPage: React.FC<PayPagePropsType> = (props) => {
case PayWayType.balance: case PayWayType.balance:
return <BablancePayWay /> return <BablancePayWay />
case PayWayType.credit: case PayWayType.credit:
return <CreditPayWay payInfo={payInfo} orderInfo={orderInfo} orderId={orderId} onChange={(state) => handlePayChangge(state)} /> return <CreditPayWay payInfo={payInfo} orderInfo={orderInfo} orderId={orderId} onChange={(state) => handlePayChangge(state)} {...props} />
case PayWayType.wechat: case PayWayType.wechat:
return <WechatPayWay /> return <WechatPayWay />
case PayWayType.bank: case PayWayType.bank:
return <BankPayWay /> return <BankPayWay />
case PayWayType.transfer: case PayWayType.transfer:
return <TransferPayWay payInfo={payInfo} orderId={orderId} onChange={(state) => handlePayChangge(state)} /> return <TransferPayWay payInfo={payInfo} orderId={orderId} onChange={(state) => handlePayChangge(state)} {...props} />
default: default:
return null return null
} }
} }
const backHome = () => { const backHome = () => {
window.location.href = '/' window.location.href = '/'
} }
......
import { GlobalConfig } from '@/global/config'
import { history } from 'umi'
import { LAYOUT_TYPE } from '@/constants'
export const linkToUrl = (path: string, layoutType, shopUrlParam) => {
switch (layoutType) {
case LAYOUT_TYPE.channel:
history.replace(`${GlobalConfig.channelRootRoute}${path}?channelId=${shopUrlParam}`)
break
case LAYOUT_TYPE.ichannel:
history.replace(`${GlobalConfig.ichannelRootRoute}${path}?channelId=${shopUrlParam}`)
break
default:
history.replace(`${path}?channelId=${shopUrlParam}`)
break
}
}
\ No newline at end of file
...@@ -138,7 +138,7 @@ const ShopIndex: React.FC<ChannelIndexPropsType> = (props) => { ...@@ -138,7 +138,7 @@ const ShopIndex: React.FC<ChannelIndexPropsType> = (props) => {
useMemo(() => <Advert type="banner" visible={firstAdvertList.length > 0} advertList={firstAdvertList} hasQuickNav={false} />, [firstAdvertList]) useMemo(() => <Advert type="banner" visible={firstAdvertList.length > 0} advertList={firstAdvertList} hasQuickNav={false} />, [firstAdvertList])
} }
</div> </div>
<FloorAnchor anchorList={categoryList} type="shop" /> <FloorAnchor anchorList={categoryList} type={LAYOUT_TYPE.shop} />
<CommonTitle title="关于我们" type="primary" /> <CommonTitle title="关于我们" type="primary" />
<AboutUs shopInfo={shopInfo} shopUrlParam={shopUrlParam} type={LAYOUT_TYPE.shop} /> <AboutUs shopInfo={shopInfo} shopUrlParam={shopUrlParam} type={LAYOUT_TYPE.shop} />
<CommonTitle title="热销商品" type="primary" /> <CommonTitle title="热销商品" type="primary" />
...@@ -146,7 +146,6 @@ const ShopIndex: React.FC<ChannelIndexPropsType> = (props) => { ...@@ -146,7 +146,6 @@ const ShopIndex: React.FC<ChannelIndexPropsType> = (props) => {
categoryComponents ? categoryComponents : loading ? <FloorSkeleton type={LAYOUT_TYPE.shop} /> : null categoryComponents ? categoryComponents : loading ? <FloorSkeleton type={LAYOUT_TYPE.shop} /> : null
} }
<Advert visible={secondAdvertList.length > 0} type="service" advertList={secondAdvertList} /> <Advert visible={secondAdvertList.length > 0} type="service" advertList={secondAdvertList} />
{/* <Information /> */}
</div > </div >
) )
} }
......
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