Commit d81e3870 authored by 前端-钟卫鹏's avatar 前端-钟卫鹏

Merge branch 'dev' into test

parents 37febd41 5698ef51
......@@ -38,8 +38,8 @@ const memberCenterRoute = {
name: 'home',
icon: 'smile',
key: 'home',
component: '@/pages/index',
// component: '@/pages/home',
// component: '@/pages/index',
component: '@/pages/home',
},
...routes,
{
......
......@@ -63,7 +63,7 @@ const Detail: React.FC<{}> = () => {
}
>
<Card bodyStyle={{padding: '5px 24px 15px 24px'}}>
<Circulation innerStatus={info?.innerStatus} outerStatus={info?.outerStatus} innerTaskList={info?.innerTaskList} outerTaskList={info?.outerTaskList}/>
<Circulation innerTaskList={info?.innerTaskList} outerTaskList={info?.outerTaskList}/>
</Card>
<div style={{marginTop: '20px'}}>
......@@ -77,10 +77,10 @@ const Detail: React.FC<{}> = () => {
<Card bodyStyle={{padding: '10px 24px 24px 24px'}}>
<Tabs>
<TabPane tab="收发货统计" key="1">
<WrapTable />
<WrapTable dataSource={[]} />
</TabPane>
<TabPane tab="收发货明细" key="2">
<WrapTable />
<WrapTable dataSource={[]} />
</TabPane>
</Tabs>
</Card>
......
import React, { useState, useEffect } from 'react';
import { Tabs, Steps, Popover } from 'antd';
import React from 'react';
import { Tabs, Steps } from 'antd';
const TabPane = Tabs.TabPane;
const { Step } = Steps;
......@@ -10,50 +10,28 @@ const customDot = (dot, { status, index }) => (
</span>
);
interface Istatus {
isExecute: number,
roleName: string,
step: number,
taskName: string
}
interface Iprops {
innerTaskList: any[],
outerTaskList: any[],
innerStatus: number,
outerStatus: number
innerTaskList: Istatus[],
outerTaskList: Istatus[],
}
const Circulation: React.FC<Iprops> = (props) => {
const { innerTaskList = [], outerTaskList = [] } = props;
const [innerStatus, setInnerStatus] = useState(0);
const [outerStatus, setOuterStatus] = useState(0);
// const innerStatus = innerTaskList.map(())
useEffect(() => {
const length = innerTaskList.length;
if(length > 0) {
for(let i = length - 1; i >= 0; i--) {
if(innerTaskList[i].isExecute == 1) {
setInnerStatus(i);
break;
}
}
}
}, [innerTaskList])
useEffect(() => {
const length = outerTaskList.length;
if(length > 0) {
for(let i = length - 1; i >= 0; i--) {
if(outerTaskList[i].isExecute == 1) {
setOuterStatus(i);
break;
}
}
}
}, [innerTaskList])
return (
<Tabs defaultActiveKey="1" >
<TabPane tab="外部流转" key="1">
<Steps current={innerStatus} progressDot={customDot} style={{marginTop: '20px'}}>
<Steps progressDot={customDot} style={{marginTop: '20px'}}>
{
outerTaskList.map((item) => {
outerTaskList.map((item: Istatus) => {
return (
<Step title={item.taskName} description={item.roleName} key={item.step} />
<Step title={item.taskName} status={item.isExecute == 1 ? 'finish' : 'wait'} description={item.roleName} key={item.step} />
)
})
}
......@@ -61,11 +39,11 @@ const Circulation: React.FC<Iprops> = (props) => {
</Steps>
</TabPane>
<TabPane tab="内部流转" key="2">
<Steps current={outerStatus} progressDot={customDot} style={{marginTop: '20px'}}>
<Steps progressDot={customDot} style={{marginTop: '20px'}}>
{
innerTaskList.map((item) => {
innerTaskList.map((item: Istatus) => {
return (
<Step title={item.taskName} description={item.roleName} key={item.step} />
<Step title={item.taskName} status={item.isExecute == 1 ? 'finish' : 'wait'} description={item.roleName} key={item.step} />
)
})
}
......
@color: #303133;
.advertisementSpace {
padding: 24px;
color: @color;
background-color: #fff;
border-radius: 8px;
.header {
margin-bottom: 24px;
.title {
font-size: 18px;
}
}
.body {
.tips {
font-size: 12px;
}
}
.footer {
margin-top: 10px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
.link {
align-self: flex-end;
}
}
}
import React from 'react';
import styles from './index.less';
import factory from '@/assets/imgs/factory.png';
interface Iprops {
title: string,
urlLink: string,
urlText: string,
tips: string,
}
const AdvertisementSpace: React.FC<Iprops> = () => {
return (
<div className={styles.advertisementSpace}>
<div className={styles.header}>
<div className={styles.title}>方案中心</div>
</div>
<div className={styles.body}>
<div className={styles.tips}>
提供品类丰富,功能强大和配置灵活的产品智能化开发方案,可一键获取和采用,轻松实现您的智能化梦想。
</div>
</div>
<div className={styles.footer}>
<div className={styles.link}>
<a>前往购买</a>
</div>
<div className={styles.img}>
<img src={factory} />
</div>
</div>
</div>
)
}
export default AdvertisementSpace
\ No newline at end of file
.anyQuestion {
background: #6790F3;
color: #fff;
border-radius: 8px;
padding: 24px;
position: relative;
.title {
font-size: 16px;
margin-bottom: 24px;
}
.body {
margin-top: 12px;
.tips {
font-size: 14px;
font-weight: 400;
}
}
.ask {
width: 128px;
height: 32px;
background: rgba(255, 255, 255, 0.2);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
font-size: 14px;
margin-bottom: 16px;
}
.ask_image {
position: absolute;
bottom: 5px;
right: 5px;
}
}
\ No newline at end of file
import React from 'react';
import styles from './index.less';
import ask from '@/assets/imgs/ask.png';
interface Iprops {}
const AnyQuestion: React.FC<Iprops> = () => {
return (
<div className={styles.anyQuestion}>
<div className={styles.title}>平台使用中遇到问题</div>
<div className={styles.body}>
<p className={styles.tips}>您的专属服务团队</p>
<p className={styles.tips}>客户经理、项目经理、技术专家为你解答平台使用过程中遇到任何问题</p>
</div>
<div className={styles.ask}>
我要提问
</div>
<div className={styles.ask_image}>
<img src={ask} />
</div>
</div>
)
}
export default AnyQuestion
\ No newline at end of file
.customWorkBench {
.btn {
width: 181px;
height: 48px;
background-color: #fff;
display: flex;
justify-content: center;
align-items: center;
font-size: 12px;
font-weight: 400;
color: #303133;
border-radius: 8px;
cursor: pointer;
}
}
.modalContainer {
.header {
background: #FAFBFC;
height: 88px;
padding: 24px;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #EEF0F3;
.left {
.title {
font-size: 16px;
font-weight: 400;
color: #303133;
}
.tips {
font-size: 12px;
font-weight: 400;
color: #909399;
margin-top: 16px;
}
}
.close {
color: #909399;
cursor: pointer;
}
}
.content {
padding: 24px 24px 0 24px;
height: 522px;
display: flex;
flex-direction: column;
flex-wrap: wrap;
.item {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
border: 1px solid #EEF0F3;
width: 352px;
padding: 14px 16px;
margin-bottom: 12px;
}
}
.footer {
padding: 0 24px 24px 24px;
.sortTips {
width: 352px;
text-align: center;
font-size: 12px;
color: #C0C4CC;
}
}
}
\ No newline at end of file
import React, { useState} from 'react';
import { Modal, Button, Checkbox } from 'antd';
import { AppstoreOutlined } from '@ant-design/icons';
import styles from './index.less';
import { CloseOutlined } from '@ant-design/icons';
interface Iprops {}
const CustomWorkBench: React.FC<Iprops> = () => {
const [visible, setVisible] = useState(false);
const handleVisible = () => {
setVisible(true)
}
const handleCancel = () => {
setVisible(false)
}
return (
<div className={styles.customWorkBench}>
<div className={styles.btn} onClick={handleVisible}>
{/* <span></span> */}
自定义工作台
</div>
<Modal
width={800}
visible={visible}
onCancel={handleCancel}
closable={false}
bodyStyle={{padding: 0}}
>
<div className={styles.modalContainer}>
<div className={styles.header}>
<div className={styles.left}>
<div className={styles.title}>产品模块自定义</div>
<div className={styles.tips}>在此你可根据业务形态自定义展示后期可在“自定义工作台”中随时调整</div>
</div>
<div className={styles.close} onClick={handleCancel}>
<CloseOutlined />
</div>
</div>
<div className={styles.content}>
{
[1,2,3,4,5,6,7,8,9,10].map((item) => {
return (
<div className={styles.item} key={item}>
<div className={styles.name}>交易能力</div>
<div><Checkbox /></div>
</div>
)
})
}
</div>
<div className={styles.footer}>
<div className={styles.sortTips}>
(可拖动排序)
</div>
</div>
</div>
</Modal>
</div>
)
}
export default CustomWorkBench
\ No newline at end of file
.announces {
padding: 24px;
background-color: #fff;
border-radius: 8px;
.header {
display: flex;
flex-direction: row;
justify-content: space-between;
.title {
color: #303133;
font-size: 16px;
}
.nextOrPreview {
.prev {
margin-right: 8px;
}
}
}
.body {
margin-top: 12px;
.item {
margin-bottom: 16px;
display: flex;
flex-direction: row;
align-items: center;
.date {
margin-right: 16px;
padding: 2px 6px;
display: flex;
flex-direction: column;
text-align: center;
.month {
background: #F7F8FA;
width: 36px;
margin-bottom: 1px;
}
.day {
background: #F7F8FA;
}
}
}
}
}
\ No newline at end of file
import React from 'react';
import styles from './index.less';
import { LeftOutlined, RightOutlined } from '@ant-design/icons';
import { Button } from 'antd';
import { keyBy } from 'lodash';
interface Iprops {}
const LatestAnnouces: React.FC = () => {
return (
<div className={styles.announces}>
<div className={styles.header}>
<div className={styles.title}>最新公告</div>
<div className={styles.nextOrPreview}>
<Button icon={<LeftOutlined />} className={styles.prev}></Button>
<Button icon={<RightOutlined />}></Button>
</div>
</div>
<div className={styles.body}>
{
[1,2,3,4].map((item) => {
return (
<div className={styles.item} key={item}>
<div className={styles.date}>
<div className={styles.month}>09月</div>
<div className={styles.day}>17</div>
</div>
<div className={styles.content}>
最新交易板块上线,全新体验,更多交易模式,更多好玩等你发现
</div>
</div>
)
})
}
</div>
</div>
)
}
export default LatestAnnouces
\ No newline at end of file
.recentVisit {
background-color: #fff;
padding: 24px;
border-radius: 8px;
.header {
.title {
font-size: 16px;
color: #303133;
}
}
.body {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 24px;
justify-content: space-between;
.item {
background: #F7F8FA;
width: 157px;
text-align: center;
color: #303133;
padding: 6px;
margin-bottom: 16px;
}
}
}
\ No newline at end of file
import React from 'react';
import styles from './index.less'
interface Iprops {}
const RecentVisit: React.FC<Iprops> = () => {
return (
<div className={styles.recentVisit}>
<div className={styles.header}>
<div className={styles.title}>最近访问</div>
</div>
<div className={styles.body}>
{
["新增商品", "快捷修改商品单价", "新增仓位库存"].map((item) => {
return (
<div className={styles.item} key={item}>
{item}
</div>
)
})
}
</div>
</div>
)
}
export default RecentVisit
\ No newline at end of file
.homeGuide{
background-color: @main-color;
border-radius: 8px;
display: flex;
justify-content: center;
align-items: center;
height: 90px;
color: white;
position: relative;
.gridStyle{
display: flex;
flex: 1;
justify-content: space-between;
align-items: center;
border-right: 1px solid rgba(255, 255, 255, 0.2);
height: 90px;
p{
font-size: 12px;
font-weight: 400;
margin-left: 24px;
margin-bottom: 0;
padding: 0 0 8px 0;
line-height: 1;
vertical-align: middle;
}
.firstp{
height: 24px;
line-height: 24px;
}
.guideTitle{
font-size: 14px;
font-weight: 400;
}
.guideIcon{
font-size: 14px;
margin-right: 27px;
}
.guideIconFirst{
font-size: 24px;
vertical-align: bottom;
}
}
.gridStyleFirst{
flex: 0 0 16%;
}
.guideClose{
width: 56px;
height: 20px;
background: rgba(0, 0, 0, 0.2);
border-radius: 0px 8px 0px 8px;
position: absolute;
right: 0;
top: 0;
cursor: pointer;
text-align: center;
}
&::after {
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #6B778C;
content: "";
position: absolute;
right: 18px;
bottom: -7px;
}
}
.giudeMenuBox{
border-radius: 5px;
padding: 16px;
background-color: #fff;
flex: 0 0 16%;
//重写步骤条
:global{
.ant-steps-vertical.ant-steps-dot .ant-steps-item .ant-steps-icon-dot{
border: 1px solid #DFE1E6;
background-color: #fff;
}
.ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail::after{
background-color: #fff;
border-right: 1px dashed #DFE1E6;
}
}
}
.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-top: 24px;
margin-left: auto;
cursor: pointer;
.icon {
font-size: 24px;
}
.text {
margin-left: 8px;
}
}
\ No newline at end of file
import { render } from '@/app';
import React from 'react';
import { Button, Space, Row, Col, Dropdown, Steps} from 'antd';
import { CompassOutlined, CompassFilled, UpOutlined } from '@ant-design/icons';
import styles from './index.less';
import cx from 'classnames';
const { Step } = Steps;
const UseGuaid: React.FC<{}> = () => {
const menu = (
<div className={styles.giudeMenuBox}>
<Steps progressDot current={1000} direction="vertical">
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
</Steps>
</div>
);
return (
<div>
<Space direction="vertical" style={{width:'100%'}}>
<Row>
<Col span={24}>
<div className={styles.homeGuide}>
<div className={cx(styles.gridStyle, styles.gridStyleFirst)}>
<p className={styles.firstp}>
<CompassFilled className={styles.guideIconFirst} />
<span>&nbsp;使用向导</span>
</p>
</div>
<Dropdown overlay={menu}>
<div className={styles.gridStyle}>
<div>
<p className={styles.guideTitle}>1.新建商品</p>
<p className={styles.guideDesc}>三分钟智能化,完成商品创建</p>
</div>
<UpOutlined className={styles.guideIcon} />
</div>
</Dropdown>
<Dropdown overlay={menu}>
<div className={styles.gridStyle}>
<div>
<p className={styles.guideTitle}>1.新建商品</p>
<p className={styles.guideDesc}>三分钟智能化,完成商品创建</p>
</div>
<UpOutlined className={styles.guideIcon} />
</div>
</Dropdown>
<Dropdown overlay={menu}>
<div className={cx(styles.gridStyle, styles.gridStyleLast)}>
<div>
<p className={styles.guideTitle}>1.新建商品</p>
<p className={styles.guideDesc}>三分钟智能化,完成商品创建</p>
</div>
<UpOutlined className={styles.guideIcon} />
</div>
</Dropdown>
<div className={styles.guideClose}>
<p>关闭</p>
</div>
</div>
</Col>
</Row>
</Space>
<div className={styles.controller}>
<CompassFilled className={styles.icon} />
<span className={styles.text}>使用向导</span>
</div>
</div>
)
}
export default UseGuaid;
\ No newline at end of file
@container-color: #26B599;
.container {
// width: 1206px;
.header {
padding: 0 24px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
background: @container-color;
height: 140px;
border-radius: 8px 8px 0px 0px;
.infos {
color: #fff;
.hi {
font-size: 20px;
font-weight: 500;
margin-bottom: 16px;
letter-spacing: 1px;
}
.date {
font-size: 14px;
font-weight: 400;
}
}
.images {
width: 216px;
height: 100%;
margin-right: 26px;
display: flex;
align-items: center;
}
}
.content {
height: 104px;
border-radius: 0px 0px 8px 8px;
background-color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
.row {
display: flex;
flex-direction: row;
align-items: center;
.user {
padding: 0 0 0 24px;
display: flex;
flex-direction: row;
align-items: center;
.pic {
width: 56px;
height: 56px;
margin-right: 12px;
border-radius: 50%;
background-color: red;
}
.wrapper {
display: flex;
flex-direction: column;
.company {
display: flex;
flex-direction: row;
align-items: center;
.tags {
margin-left: 16px;
}
}
}
.status {
margin-top: 12px;
}
}
.level {
height: 16px;
}
}
}
}
import React from 'react';
import styles from './index.less';
import moment from 'moment';
import { Row, Col, Tag, Badge } from 'antd';
import level2 from '@/assets/imgs/level2.png';
import home_user from '@/assets/imgs/home_user.png';
interface Iprops {}
const WEEKDAYS = ["天", "一","二", "三", "四", "五","六"]
const UserCenter: React.FC<Iprops> = () => {
const today = moment();
return (
<div className={styles.container}>
<div className={styles.header}>
<div className={styles.infos}>
<div className={styles.hi}>
{"Hi, Zzb! 欢迎来到数商云瓴犀业务中台能力中心"}
</div>
<div className={styles.date}>
{today.format('YYYY年MM月DD日')} 星期{WEEKDAYS[today.day()]}
</div>
</div>
<div className={styles.images}>
<img src={home_user} />
</div>
</div>
<div className={styles.content}>
<Row className={styles.row}>
<Col span={11} className={styles.user}>
<div className={styles.pic}></div>
<div className={styles.wrapper}>
<div className={styles.company}>
<span>温州市隆昌皮业有限公司</span>
<div className={styles.tags}>
<Tag>采购商</Tag>
<Tag>采购商</Tag>
</div>
</div>
<div className={styles.status}>
<Badge status={"error"} text={"审核不通过"}></Badge>
</div>
</div>
</Col>
<Col span={3}>
<a>修改会员信息</a>
</Col>
<Col span={4}>
<span>会员等级: </span>
<img src={level2} className={styles.level} />
</Col>
<Col span={3}>平台积分: <strong>10,000</strong></Col>
<Col span={3}>
<a>进入会员中心</a>
</Col>
</Row>
</div>
</div>
)
}
export default UserCenter
\ No newline at end of file
.homeGuide{
background-color: @main-color;
border-radius: 8px;
.main {
display: flex;
justify-content: center;
align-items: center;
height: 90px;
color: white;
position: relative;
.gridStyle{
display: flex;
flex-direction: row;
.mainSide {
// flex-basis: 1206px;
margin-right: 23px;
flex: 1;
justify-content: space-between;
align-items: center;
border-right: 1px solid rgba(255, 255, 255, 0.2);
height: 90px;
p{
font-size: 12px;
font-weight: 400;
margin-left: 24px;
margin-bottom: 0;
padding: 0 0 8px 0;
line-height: 1;
vertical-align: middle;
}
.firstp{
height: 24px;
line-height: 24px;
}
.guideTitle{
font-size: 14px;
font-weight: 400;
}
.guideIcon{
font-size: 14px;
margin-right: 27px;
}
.guideIconFirst{
font-size: 24px;
vertical-align: bottom;
}
}
.gridStyleFirst{
flex: 0 0 16%;
}
.guideClose{
width: 56px;
height: 20px;
background: rgba(0, 0, 0, 0.2);
border-radius: 0px 8px 0px 8px;
position: absolute;
right: 0;
top: 0;
cursor: pointer;
text-align: center;
}
&::after {
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #6B778C;
content: "";
position: absolute;
right: 18px;
bottom: -7px;
}
}
.giudeMenuBox{
border-radius: 5px;
padding: 16px;
background-color: #fff;
flex: 0 0 16%;
//重写步骤条
:global{
.ant-steps-vertical.ant-steps-dot .ant-steps-item .ant-steps-icon-dot{
border: 1px solid #DFE1E6;
background-color: #fff;
.rightSide {
width: 386px;
.actions {
display: flex;
}
.ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail::after{
background-color: #fff;
border-right: 1px dashed #DFE1E6;
.announce {
margin-top: 24px;
}
}
}
\ No newline at end of file
import React, { useState, useEffect } from 'react'
import { Button, Card, Space, Steps, Dropdown, Radio, Row, Col, Table, Tabs, Tag, Avatar, Image, List, Badge, Menu } from 'antd'
import cx from 'classnames'
import styles from './index.less'
import StatusTag from '@/components/StatusTag'
import { CaretUpOutlined, CompassFilled, CompassOutlined, RightCircleFilled, RightOutlined, UpOutlined } from '@ant-design/icons'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
const { Step } = Steps;
import { Row, Col } from 'antd';
import UseGuaid from './components/UseGuaid';
import UserCenter from './components/UserCenter';
import CustomWorkBench from './components/CustomWorkBench';
import LatestAnnounce from './components/LatestAnnounces';
import RecentVisit from './components/RecentVisit';
import AnyQuestion from './components/AnyQuestion';
import AdvertisementSpace from './components/AdvertisementSpace';
import styles from './index.less'
const Home: React.FC<{}> = () => {
const menu = (
<div className={styles.giudeMenuBox}>
<Steps progressDot current={1000} direction="vertical">
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
<Step title="定义产品功能" description={<><p>开发第一步,标准功能、自定义功能及云功能编辑</p><a href="">如何定义</a></>} />
</Steps>
</div>
);
return (
<PageHeaderWrapper>
<Space direction="vertical" style={{width:'100%'}}>
<Row>
<Col span={24}>
<div className={styles.homeGuide}>
<div className={cx(styles.gridStyle, styles.gridStyleFirst)}>
<p className={styles.firstp}>
<CompassFilled className={styles.guideIconFirst} />
<span>&nbsp;使用向导</span>
</p>
</div>
<Dropdown overlay={menu}>
<div className={styles.gridStyle}>
<div>
<p className={styles.guideTitle}>1.新建商品</p>
<p className={styles.guideDesc}>三分钟智能化,完成商品创建</p>
</div>
<UpOutlined className={styles.guideIcon} />
</div>
</Dropdown>
<Dropdown overlay={menu}>
<div className={styles.gridStyle}>
<div>
<p className={styles.guideTitle}>1.新建商品</p>
<p className={styles.guideDesc}>三分钟智能化,完成商品创建</p>
</div>
<UpOutlined className={styles.guideIcon} />
</div>
</Dropdown>
<Dropdown overlay={menu}>
<div className={cx(styles.gridStyle, styles.gridStyleLast)}>
<div>
<p className={styles.guideTitle}>1.新建商品</p>
<p className={styles.guideDesc}>三分钟智能化,完成商品创建</p>
</div>
<UpOutlined className={styles.guideIcon} />
</div>
</Dropdown>
<div className={styles.guideClose}>
<p>关闭</p>
</div>
</div>
</Col>
</Row>
</Space>
<div className={styles.main}>
<div className={styles.mainSide}>
<div>
<UserCenter />
</div>
</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>
<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>
</div>
</div>
</PageHeaderWrapper>
)
}
......
......@@ -124,22 +124,28 @@ const Commodity: React.FC<CommodityPropsType> = (props) => {
getFn = PublicApi.postSearchShopEnterpriseGetCommodityList
break
case LAYOUT_TYPE.shop:
param.storeId = shopId
getFn = PublicApi.postSearchShopStoreGetCommodityList
if (shopId) {
param.storeId = shopId
getFn = PublicApi.postSearchShopStoreGetCommodityList
}
break
case LAYOUT_TYPE.channel:
param.channelMemberId = memberId
headers = {
type: 3
if (memberId) {
param.channelMemberId = memberId
headers = {
type: 3
}
getFn = PublicApi.postSearchShopChannelGetCommodityList
}
getFn = PublicApi.postSearchShopChannelGetCommodityList
break
case LAYOUT_TYPE.ichannel:
param.channelMemberId = memberId
headers = {
type: 4
if (memberId) {
param.channelMemberId = memberId
headers = {
type: 4
}
getFn = PublicApi.postSearchShopChannelGetCommodityList
}
getFn = PublicApi.postSearchShopChannelGetCommodityList
break
}
......
......@@ -57,7 +57,7 @@ const integralPayWay = [
const CommodityDetail = (props) => {
const { query: { id } } = props.location
const { shopInfo = {}, layoutType, memberId, shopUrlParam } = props
const { shopInfo = {}, shopId, layoutType, memberId, shopUrlParam } = props
const OrderStore = useLocalStore(() => store.OrderStore)
const { updateOrderInfo } = OrderStore
const [addSuccessVisible, setAddSuccessVisible] = useState<boolean>(false)
......@@ -98,6 +98,7 @@ const CommodityDetail = (props) => {
case LAYOUT_TYPE.shop:
switch (priceType) {
case COMMODITY_TYPE.prompt:
param.storeId = shopId
getListFn = PublicApi.postSearchShopStoreGetCommodityList
break
case COMMODITY_TYPE.inquiry:
......@@ -526,7 +527,7 @@ const CommodityDetail = (props) => {
<Button className={cx(styles.product_info_btn_item, styles.buy)} >暂无库存</Button>
)
case COMMODITY_TYPE.inquiry:
return <div className={cx(styles.product_info_btn_item, styles.buy)} onClick={() => handleInquiry()}>立即询价</div>
return stockCount > 0 ? <div className={cx(styles.product_info_btn_item, styles.buy)} onClick={() => handleInquiry()}>立即询价</div> : <Button className={cx(styles.product_info_btn_item, styles.buy)} >暂无库存</Button>
case COMMODITY_TYPE.integral:
return stockCount > 0 ? <div className={cx(styles.product_info_btn_item, styles.buy)} onClick={() => handleToBuy(COMMODITY_TYPE.integral)}>立即兑换</div> : <Button className={cx(styles.product_info_btn_item, styles.buy)} >暂无库存</Button>
}
......@@ -955,7 +956,7 @@ const CommodityDetail = (props) => {
<div className={cx(styles.product_info_line, styles.mar_top_10)}>
<div className={styles.product_info_line_label}>配送方式</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{Logistics_Type[commodityDetail?.logistics.carriageType]}</span>
<span className={styles.text}>{Logistics_Type[commodityDetail?.logistics.deliveryType]}</span>
</div>
</div>
</div>
......
......@@ -4,10 +4,11 @@ import styles from './index.less'
interface NoResultPropsType {
search?: string,
type?: number
}
const SearchShopResult: React.FC<NoResultPropsType> = (props) => {
const { search } = props
const { search, type = 1 } = props
return (
<div className={styles.no_result_container}>
<div className={styles.no_result}>
......@@ -21,11 +22,11 @@ const SearchShopResult: React.FC<NoResultPropsType> = (props) => {
<>
抱歉,没有找到与“
<span className={styles.no_result_tip_search}>{search}</span>
”相关的店铺
”相关的{type === 1 ? '店铺' : '渠道商城'}
</>
) : (
<>
抱歉,没有找到相关的店铺
抱歉,没有找到相关的{type === 1 ?'店铺' : '渠道商城'}
</>
)
}
......@@ -34,8 +35,8 @@ const SearchShopResult: React.FC<NoResultPropsType> = (props) => {
<div className={styles.no_result_suggest}>
<ul className={styles.no_result_suggest_list}>
<li>出现的可能原因:</li>
<li>1、管理员冻结了该店铺</li>
<li>2、店铺链接出现错误</li>
<li>1、管理员冻结了该{type === 1 ? '店铺' : '渠道商城'}</li>
<li>2、{type === 1 ? '店铺' : '渠道商城'}链接出现错误</li>
</ul>
</div>
</div>
......
......@@ -10,6 +10,7 @@ import { inject, observer } from 'mobx-react'
import TopBar from '../components/TopBar'
import { PublicApi } from '@/services/api'
import { GetTemplateChannelFindChannelResponse } from '@/services/TemplateApi'
import SearchShopResult from '../components/SearchShopResult'
import ChannelHeader from '../components/ChannelHeader'
import MainNav from '../components/MainNav'
import SideNav from '../components/SideNav'
......@@ -31,6 +32,7 @@ const LXChannelLayout: React.FC<LXChannelLayoutPropsType> = (props) => {
const { channelId } = location.query
const [shopInfo, setShopInfo] = useState<GetTemplateChannelFindChannelResponse>()
const [query, setQuery] = useState<any>({})
const [loading, setLoading] = useState<boolean>(true)
const getMenuRouter = (routes: any, pathname: any) => {
let list = routes.filter((item: any) => pathname.indexOf(item.key) > -1)
......@@ -48,7 +50,7 @@ const LXChannelLayout: React.FC<LXChannelLayoutPropsType> = (props) => {
queryParam = queryParam ? JSON.parse(queryParam) : {}
setQuery(queryParam)
} catch (error) {
setLoading(false)
}
}, [])
......@@ -64,6 +66,9 @@ const LXChannelLayout: React.FC<LXChannelLayoutPropsType> = (props) => {
if (res.code === 1000) {
setShopInfo(res.data)
}
setLoading(false)
}).catch(() => {
setLoading(false)
})
}
......@@ -95,7 +100,7 @@ const LXChannelLayout: React.FC<LXChannelLayoutPropsType> = (props) => {
)
}
{
children && React.Children.map(children, (child: any) => {
!loading ? shopInfo ? children && React.Children.map(children, (child: any) => {
return React.cloneElement(child,
{
layoutType: LAYOUT_TYPE.channel,
......@@ -105,7 +110,7 @@ const LXChannelLayout: React.FC<LXChannelLayoutPropsType> = (props) => {
shopInfo
},
);
})
}) : <SearchShopResult type={2} /> : null
}
</div>
<Footer />
......
......@@ -10,6 +10,7 @@ import { inject, observer } from 'mobx-react'
import TopBar from '../components/TopBar'
import { PublicApi } from '@/services/api'
import { GetTemplateChannelFindChannelResponse } from '@/services/TemplateApi'
import SearchShopResult from '../components/SearchShopResult'
import ChannelHeader from '../components/ChannelHeader'
import MainNav from '../components/MainNav'
import SideNav from '../components/SideNav'
......@@ -31,6 +32,7 @@ const LXIChannelLayout: React.FC<LXIChannelLayoutPropsType> = (props) => {
const { channelId } = location.query
const [shopInfo, setShopInfo] = useState<GetTemplateChannelFindChannelResponse>()
const [query, setQuery] = useState<any>({})
const [loading, setLoading] = useState<boolean>(true)
const getMenuRouter = (routes: any, pathname: any) => {
let list = routes.filter((item: any) => pathname.indexOf(item.key) > -1)
......@@ -47,7 +49,7 @@ const LXIChannelLayout: React.FC<LXIChannelLayoutPropsType> = (props) => {
queryParam = queryParam ? JSON.parse(queryParam) : {}
setQuery(queryParam)
} catch (error) {
setLoading(false)
}
}, [])
......@@ -64,6 +66,9 @@ const LXIChannelLayout: React.FC<LXIChannelLayoutPropsType> = (props) => {
if (res.code === 1000) {
setShopInfo(res.data)
}
setLoading(false)
}).catch(() => {
setLoading(false)
})
}
......@@ -89,7 +94,7 @@ const LXIChannelLayout: React.FC<LXIChannelLayoutPropsType> = (props) => {
)
}
{
children && React.Children.map(children, (child: any) => {
!loading ? shopInfo ? children && React.Children.map(children, (child: any) => {
return React.cloneElement(child,
{
layoutType: LAYOUT_TYPE.ichannel,
......@@ -99,7 +104,7 @@ const LXIChannelLayout: React.FC<LXIChannelLayoutPropsType> = (props) => {
shopInfo
},
);
})
}) : <SearchShopResult type={2} /> : null
}
</div>
<Footer />
......
......@@ -48,6 +48,7 @@ const Order: React.FC<OrderPropsType> = (props) => {
const [contractInfo, setContractInfo] = useState<any>()
const [electronicContractId, setElectronicContractId] = useState<number>()
const [agreeSingLoading, setAgreeSignLoading] = useState<boolean>(false)
const [btnDisabled, setBtnDisable] = useState<boolean>(false)
useEffect(() => {
if (!userInfo) {
......@@ -100,8 +101,8 @@ const Order: React.FC<OrderPropsType> = (props) => {
// 是否选用电子合同
if (data.isElectronicContract) {
setElectronicContractId(data.electronicContractId)
if (!!sessionStorage.getItem("contractInfo")) {
setContractInfo(JSON.parse(sessionStorage.getItem("contractInfo")))
if (!!sessionStorage.getItem(`contract${spam_id}`)) {
setContractInfo(JSON.parse(sessionStorage.getItem(`contract${spam_id}`)))
setIsElectronicContract(true)
} else {
// 根据电子合同模板id获取生成电子合同
......@@ -116,7 +117,7 @@ const Order: React.FC<OrderPropsType> = (props) => {
if (signRes.code === 1000) {
message.destroy()
setContractInfo(signData)
sessionStorage.setItem("contractInfo", JSON.stringify(signData))
sessionStorage.setItem(`contract${spam_id}`, JSON.stringify(signData))
setIsElectronicContract(true)
}
}
......@@ -505,7 +506,7 @@ const Order: React.FC<OrderPropsType> = (props) => {
Number(type) !== COMMODITY_TYPE.integral && <span>RMB</span>
}
</div>
<Button loading={confirmLoading} className={styles.settlement_box_item_btn} onClick={() => checkOrder()}>{Number(type) === COMMODITY_TYPE.integral ? '提交积分订单' : '提交订单'}</Button>
<Button disabled={btnDisabled} loading={confirmLoading} className={styles.settlement_box_item_btn} onClick={() => checkOrder()}>{Number(type) === COMMODITY_TYPE.integral ? '提交积分订单' : '提交订单'}</Button>
</div>
</div>
</div>
......
......@@ -110,24 +110,24 @@ const Details: React.FC<parmas> = (props) => {
render: (text: any, record: any) => <EyePreview>{text}</EyePreview>
}, {
title: '品类',
key: 'inquiryListNo',
dataIndex: 'inquiryListNo',
key: 'category',
dataIndex: 'category',
}, {
title: '品牌',
key: 'brand',
dataIndex: 'brand',
}, {
title: '单位',
key: 'nuit',
dataIndex: 'nuit',
key: 'unit',
dataIndex: 'unit',
}, {
title: '采购数量',
key: 'purchaseQuantity',
dataIndex: 'purchaseQuantity',
key: 'purchaseCount',
dataIndex: 'purchaseCount',
}, {
title: '报价单价',
key: 'pric',
dataIndex: 'pric',
key: 'price',
dataIndex: 'price',
}, {
title: '金额',
key: 'money',
......
......@@ -98,8 +98,8 @@ const FlowRecord: React.FC<parmas> = (props) => {
return (
<div className={styles.revise_style}>
<Radio.Group defaultValue="outer" buttonStyle="solid" onChange={onChange}>
<Radio.Button value="outer">外部单据(0)</Radio.Button>
<Radio.Button value="inside">内部单据(0)</Radio.Button>
<Radio.Button value="outer">外部单据</Radio.Button>
<Radio.Button value="inside">内部单据</Radio.Button>
</Radio.Group>
{radio === 'outer' ?
<PolymericTable
......
......@@ -97,8 +97,8 @@ const FlowRecord: React.FC<parmas> = (props) => {
return (
<div className={styles.revise_style}>
<Radio.Group defaultValue="outer" buttonStyle="solid" onChange={onChange}>
<Radio.Button value="outer">外部单据(0)</Radio.Button>
<Radio.Button value="inside">内部单据(0)</Radio.Button>
<Radio.Button value="outer">外部单据</Radio.Button>
<Radio.Button value="inside">内部单据</Radio.Button>
</Radio.Group>
{radio === 'outer' ?
<PolymericTable
......
import React, { useState, useEffect, ReactNode } from 'react';
import React, { useState, useEffect, ReactNode, useRef } from 'react';
import style from './index.less'
import { history } from 'umi';
import { Button, Card, Tabs, Steps, Table } from 'antd';
import { ColumnType } from 'antd/lib/table/interface';
import { StopOutlined, CheckSquareOutlined, LinkOutlined } from '@ant-design/icons'
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { StandardTable } from 'god';
import { quoteOrderInternalState, inquiryQuoteOuterState } from '../../common/tableStatusList';
import AuditModal from '../components/auditModel';
import moment from 'moment';
......@@ -33,6 +34,7 @@ const Details: React.FC<parmas> = (props) => {
//page_type: 1.待提交报价单,2.待审核报价单1级,3.待审核报价单2级,4.询价单查询,5.报价单查询,6.待新增报价单
//view: 1.询价单号,2.报价单号
const { id, page_type } = props;
const ref = useRef<any>({});
const [headerWrapperData, setheaderWrapperData] = useState<Array<any>>([]);
// 拿到pathname,通过判断来显示询价单号或报价单号
const { pathname } = history.location;
......@@ -138,20 +140,20 @@ const Details: React.FC<parmas> = (props) => {
dataIndex: 'productName',
}, {
title: '品类',
key: 'inquiryListNo',
dataIndex: 'inquiryListNo',
key: 'category',
dataIndex: 'category',
}, {
title: '品牌',
key: 'brand',
dataIndex: 'brand',
}, {
title: '单位',
key: 'nuit',
dataIndex: 'nuit',
key: 'unit',
dataIndex: 'unit',
}, {
title: '采购数量',
key: 'purchaseQuantity',
dataIndex: 'purchaseQuantity',
key: 'purchaseCount',
dataIndex: 'purchaseCount',
}]
// 条件交易&其他报价说明
const infoTem = {
......@@ -285,6 +287,14 @@ const Details: React.FC<parmas> = (props) => {
}
}, [])
const fetchData = (params:any) => {
return new Promise(resolve => {
PublicApi.getOrderInquiryDetails({...params,id}).then(res => {
console.log(res, 10086)
resolve(res.data)
})
})
}
useEffect(() => {
if (Object.keys(data).length > 0) {
......@@ -456,7 +466,15 @@ const Details: React.FC<parmas> = (props) => {
</Card>
<Card className={style.item_wrap}>
<div className={style.mainCol_title}>询价商品</div>
<Table columns={inquiryGoods} pagination={false} rowKey='id' dataSource={data.inquiryListProductRequests} />
{view === 1 && <Table columns={inquiryGoods} pagination={false} rowKey='id' dataSource={data.inquiryListProductRequests} />}
{view === 2 &&
<StandardTable
currentRef={ref}
columns={inquiryGoods}
tableProps={{ rowKew: 'id' }}
fetchTableData={(params: any) => fetchData(params)}
/>
}
</Card>
<Card className={style.item_wrap}>
<div className={style.mainCol_title}>{infoTem[(Number(page_type) === 1 || Number(page_type) === 5) ? 'freight' : 'base'].title}</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