Commit b9b82e16 authored by XieZhiXiong's avatar XieZhiXiong

fix: 描述组件内容不换行的问题、删除无用的文件

parent 17fd3009
.describeline_wrap {
display: flex;
align-items: center;
padding: 16px 24px;
background: #F7F8FA;
margin: 24px 0;
}
.describeline {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.describeline_item {
display: flex;
padding: 8px 0;
&_title {
width: 100px;
text-align: left;
color: #909399;
}
&_value {
flex: 1;
color: #303133;
label {
display: block;
margin-bottom: 12px;
}
p {
line-height: 20px;
margin-bottom: 8px;
}
}
}
\ No newline at end of file
import React from 'react'
import { Row, Col } from 'antd'
import styles from './index.less'
interface DescribeLineItemPropsType {
title: string;
titleWidth?: string,
}
interface DescribeLineType {
Item: typeof DescribeLineItem,
}
interface DescribeLinePropsType {
column?: number,
}
export const DescribeLineWrap: React.FC = (props) => {
const { children } = props
return <div className={styles.describeline_wrap}>
{children}
</div>
}
const DescribeLine: DescribeLineType & React.FC<DescribeLinePropsType> = (props) => {
const { column = 3, children } = props
const columnWidth = (100 / column) + '%'
return (
<div className={styles.describeline}>
{
React.Children.map(children, (child, index) => (
<div style={{ width: columnWidth }}>{child}</div>
))
}
</div>
)
}
const DescribeLineItem: React.FC<DescribeLineItemPropsType> = (props) => {
const { title, titleWidth = 'auto', children } = props
return (
<div className={styles.describeline_item}>
<div
className={styles.describeline_item_title}
style={{
width: titleWidth,
}}
>
{title}
</div>
<div className={styles.describeline_item_value}>{children}</div>
</div>
)
}
DescribeLine.Item = DescribeLineItem
export default DescribeLine
import React from 'react'
const DetailPreView: React.FC = () => {
return (
<div>
</div>
)
}
export default DetailPreView
\ No newline at end of file
.info_list {
position: relative;
&_line {
display: flex;
align-items: center;
margin-bottom: 24px;
&_label {
width: 176px;
color: #909399;
align-self: flex-start;
&>.required {
color: #FF4D4F;
margin-left: 2px;
}
}
&_value {
:global {
.ant-form-item {
margin-bottom: 0;
}
.ant-form-item-explain {
position: absolute;
top: 32px;
}
}
}
}
}
\ No newline at end of file
import React from 'react'
import { Form } from 'antd'
import { FormInstance } from 'antd/lib/form'
import cx from 'classnames'
import styles from './index.less'
interface dataListType {
label: string,
value: string | React.ReactNode,
labelClassName?: string,
required?: boolean
}
interface InfoListProps {
options: dataListType[],
form?: FormInstance,
}
const InfoList: React.FC<InfoListProps> = (props) => {
const { options = [], form } = props
return (
<div className={styles.info_list}>
{
options && options.map((item, index) => (
<div className={styles.info_list_line} key={`info_list_line_${index}`}>
<div className={cx(styles.info_list_line_label, item.labelClassName ? item.labelClassName : "")}>{item.label}{item.required && <i className={styles.required}>*</i>}</div>
<div className={styles.info_list_line_value}>{item.value}</div>
</div>
))
}
</div>
)
}
export default InfoList
.titleAvator {
width: 48px;
height: 48px;
background: rgba(135, 119, 217, 1);
border-radius: 4px;
border: 1px solid rgba(223, 225, 230, 1);
line-height: 48px;
text-align: center;
color: #fff;
font-size: 24px;
margin: 0 24px;
}
.titleAvatorText {
color: #303133;
font-size: 18px;
line-height: 20px;
}
.detailHeader {
background: #fff;
padding: 24px;
}
.detailCol {
display: flex;
margin-top: 20px;
color: #303133;
}
.colLabel {
color: #909399;
margin-right: 16px;
}
\ No newline at end of file
import React, { ReactNode } from 'react'
import { Row, Col } from 'antd'
import { history } from 'umi'
import { ArrowLeftOutlined } from '@ant-design/icons'
import style from './index.less'
export interface OrderDetailHeaderProps {
headerTitle: {
// 图标显示的文字
titleLabel: string,
titleValue: ReactNode,
picName?: string,
} | null,
extraRight?: ReactNode,
detailList?: { label: string, name: string, render?(text, record?), [key: string]: any }[],
detailData?: any
}
/**
* 订单详情头部
*/
const OrderDetailHeader: React.FC<OrderDetailHeaderProps> = ({ headerTitle, extraRight, detailList = [], detailData = {} }) => {
return (
<div className={style.detailHeader}>
<Row>
{
headerTitle &&
<Col>
<Row align='middle'>
<Col>
<ArrowLeftOutlined onClick={() => history.goBack()} />
</Col>
<Col className={style.titleAvator}>{headerTitle.picName}</Col>
</Row>
</Col>
}
<Col style={{ flex: 1 }}>
<Row justify='space-between' align='middle' style={{ paddingTop: 14 }}>
<Col style={{ flex: 1 }}>
<div className={style.titleAvatorText}>{headerTitle.titleLabel}{headerTitle.titleValue}</div>
<Row>
{detailList.map(v => {
const { label, render, name, ...colProps } = v
return <Col key={label} {...colProps} className={style.detailCol}>
<span className={style.colLabel}>{label}:</span>
{render ? render(detailData[name], detailData) : <span>{detailData[name]}</span>}
</Col>
})}
</Row>
</Col>
<Col>{extraRight}</Col>
</Row>
</Col>
</Row>
</div>
)
}
OrderDetailHeader.defaultProps = {}
export default OrderDetailHeader
\ No newline at end of file
.wrapper {
padding: 24px;
}
\ No newline at end of file
import React from 'react'
import style from './index.less'
export interface OrderDetailWrapperProps {}
const OrderDetailWrapper:React.FC<OrderDetailWrapperProps> = (props) => {
return (
<div className={style.wrapper}>{props.children}</div>
)
}
OrderDetailWrapper.defaultProps = {}
export default OrderDetailWrapper
\ No newline at end of file
...@@ -2,11 +2,11 @@ ...@@ -2,11 +2,11 @@
* @Author: XieZhiXiong * @Author: XieZhiXiong
* @Date: 2020-11-05 18:02:18 * @Date: 2020-11-05 18:02:18
* @LastEditors: XieZhiXiong * @LastEditors: XieZhiXiong
* @LastEditTime: 2020-12-10 16:40:48 * @LastEditTime: 2020-12-15 10:26:44
* @Description: 退款明细 * @Description: 退款明细
*/ */
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Row, Col, Modal, Button, Upload } from 'antd'; import { Row, Col, Modal, Button, Upload, Descriptions } from 'antd';
import { CaretRightOutlined, CaretDownOutlined, RightOutlined, ExclamationCircleOutlined } from '@ant-design/icons'; import { CaretRightOutlined, CaretDownOutlined, RightOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
import MellowCard from '@/components/MellowCard'; import MellowCard from '@/components/MellowCard';
import { EditableColumns } from '@/components/PolymericTable/interface'; import { EditableColumns } from '@/components/PolymericTable/interface';
...@@ -20,7 +20,6 @@ import { ...@@ -20,7 +20,6 @@ import {
PAY_CHANNEL_COD, PAY_CHANNEL_COD,
} from '@/constants'; } from '@/constants';
import Stamp from '../Stamp'; import Stamp from '../Stamp';
import DescribeLine from '../DescribeLine';
import CheckVoucherModal from '../CheckVoucherModal'; import CheckVoucherModal from '../CheckVoucherModal';
import RefundModal, { RefundModalProps } from '../RefundModal'; import RefundModal, { RefundModalProps } from '../RefundModal';
import { import {
...@@ -240,19 +239,19 @@ const ReturnDetailInfo: React.FC<ReturnDetailInfoProps> = ({ ...@@ -240,19 +239,19 @@ const ReturnDetailInfo: React.FC<ReturnDetailInfoProps> = ({
key={item.refundId} key={item.refundId}
> >
<Stamp> <Stamp>
<DescribeLine column={2}> <Descriptions column={2}>
<DescribeLine.Item title="支付次数">1</DescribeLine.Item> <Descriptions.Item label="支付次数">1</Descriptions.Item>
<DescribeLine.Item title="状态"> <Descriptions.Item label="状态">
<StatusTag type={REFUND_OUTER_STATUS_TAG_MAP[item.outerStatus]} title={item.outerStatusName} /> <StatusTag type={REFUND_OUTER_STATUS_TAG_MAP[item.outerStatus]} title={item.outerStatusName} />
</DescribeLine.Item> </Descriptions.Item>
<DescribeLine.Item title="支付环节">{item.payNode}</DescribeLine.Item> <Descriptions.Item label="支付环节">{item.payNode}</Descriptions.Item>
<DescribeLine.Item title="已支付金额(元)">{item.payAmount}</DescribeLine.Item> <Descriptions.Item label="已支付金额(元)">{item.payAmount}</Descriptions.Item>
<DescribeLine.Item title="支付比例">{item.payRatio}%</DescribeLine.Item> <Descriptions.Item label="支付比例">{item.payRatio}%</Descriptions.Item>
<DescribeLine.Item title="退款金额(元)">{item.refundAmount}</DescribeLine.Item> <Descriptions.Item label="退款金额(元)">{item.refundAmount}</Descriptions.Item>
<DescribeLine.Item title="支付方式">{item.payWayName}</DescribeLine.Item> <Descriptions.Item label="支付方式">{item.payWayName}</Descriptions.Item>
<DescribeLine.Item title="退款时间">{item.refundTime}</DescribeLine.Item> <Descriptions.Item label="退款时间">{item.refundTime}</Descriptions.Item>
<DescribeLine.Item title="支付渠道">{item.channelName}</DescribeLine.Item> <Descriptions.Item label="支付渠道">{item.channelName}</Descriptions.Item>
</DescribeLine> </Descriptions>
<div className={styles['deliver-item-actions']}> <div className={styles['deliver-item-actions']}>
{ {
......
.progress_wrap {
display: flex;
justify-content: center;
padding-top: 24px;
position: relative;
.progress_value {
position: absolute;
top: 145px;
&>.rate {
text-align: center;
font-size: 24px;
color: #303133;
line-height: 32px;
font-weight: 500;
}
&>.rate_text {
font-size: 12px;
color: #909399;
line-height: 20px;
}
}
.pointer_wrap {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
margin: auto;
width: 16px;
height: 16px;
z-index: 3;
.pointer_circle {
position: relative;
width: 16px;
height: 16px;
border: 3px solid #B3BAC5;
border-radius: 50%;
z-index: 2;
}
.pointer {
position: absolute;
left: 13px;
top: 6px;
width: 0;
height: 0;
border-left: 36px solid #DFE1E6;
border-top: 5px solid transparent;
z-index: 1;
}
}
}
\ No newline at end of file
import React, { useState, useEffect } from 'react'
import { Progress } from 'antd'
import styles from './index.less'
interface SatisfactionProgressPropsType {
value: number,
comment: string
}
const SatisfactionProgress: React.FC<SatisfactionProgressPropsType> = (props) => {
const { value = 5, comment = "" } = props
const [strokeColor, setStrokeColor] = useState<string>('#41CC9E')
const [percent, setPercent] = useState<number>(100)
useEffect(() => {
initProgress()
}, [value])
const initProgress = () => {
switch (value) {
case 1:
setStrokeColor('#EF6260')
setPercent(20)
break
case 2:
setStrokeColor('#FFC400')
setPercent(40)
break
case 3:
setStrokeColor('#6C9CEB')
setPercent(60)
break
case 4:
setStrokeColor('#41CC9E')
setPercent(80)
break
case 5:
setStrokeColor('#41CC9E')
setPercent(100)
break
default:
break
}
}
return (
<div className={styles.progress_wrap}>
<Progress
percent={percent}
// success={{ percent: 30 }}
trailColor="#F4F5F7"
strokeColor={strokeColor}
type="dashboard"
strokeWidth={9}
showInfo={false}
strokeLinecap="square"
gapDegree={100}
width={180}
/>
<div className={styles.pointer_wrap}>
<div className={styles.pointer_circle}></div>
<div className={styles.pointer}></div>
</div>
<div className={styles.progress_value}>
<div className={styles.rate}>{value}</div>
<div className={styles.rate_text}>{comment}</div>
</div>
</div>
)
}
export default SatisfactionProgress
import React, { useState, useEffect } from 'react'
import { EyeOutlined, CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons'
import { Row, Col, Space } from 'antd'
import styled from 'styled-components'
import cx from 'classnames'
interface SelectAddressPropsType {
checkedId: any,
dataSource: any,
onChange: Function
}
const SelectStyles = styled((props) => <div className='select-list' {...props}></div>)`
.select_style_border {
border: 1px solid #EEF0F3;
margin-bottom: 20px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 14px;
width: 572px;
cursor: pointer;
line-height: 28px;
position:relative;
}
.select_style_border.active {
border: 1px solid #00B382;
}
.select_style_border.active::after {
content: '';
position: absolute;
width: 0;
height: 0;
border-bottom: 12px solid #00B37A;
border-left: 12px solid transparent;
bottom: 0;
right: 0;
z-index: 5;
}
`
const SelectAddress: React.FC<SelectAddressPropsType> = (props) => {
const [showMore, setShowMore] = useState<boolean>(true)
const { checkedId, dataSource = [], onChange } = props
const showCount = 3
useEffect(() => {
if (dataSource && dataSource.length > 0) {
let initItem = dataSource[0] || {}
onChange && onChange(initItem)
}
}, [dataSource])
const showDataSource = showMore ? [...dataSource].splice(0, showCount) : dataSource
const handleCheck = (v) => {
if (v.id !== checkedId) {
onChange(v)
}
}
const toogleMore = () => {
setShowMore(!showMore)
}
return (
<div style={{ width: '100%' }}>
<SelectStyles>
{
showDataSource.map(v => <div key={v.id} onClick={() => handleCheck(v)} className={cx('select_style_border', checkedId === v.id ? 'active' : '')}>
<div>
<Row style={{ color: '#303133' }}>
<Col>{v.receiverName}</Col>
<Col> / </Col>
<Col>{v.phone}</Col>
</Row>
<div style={{ color: '#909399' }}>{v.fullAddress}</div>
</div>
</div>)
}
</SelectStyles>
{dataSource.length > showCount &&
<div onClick={toogleMore} style={{ textAlign: 'center', cursor: 'pointer' }}>
显示更多{showMore ? <CaretDownOutlined /> : <CaretUpOutlined />}
</div>
}
</div>
)
}
export default SelectAddress
import React from 'react'
import { Tag } from 'antd'
import { PurchaseOrderInsideWorkStateTexts, PurchaseOrderOutWorkStateTexts, PurchaseOrderInsideWorkState, PurchaseOrderOutWorkState, SaleOrderInsideWorkState, SaleOrderInsideWorkStateTexts } from '@/constants'
export interface IStatusColor {
[key: string]: {
value: string | number,
color: string
}
}
// 用于标签状态控制
export interface StatusColorsProps {
status: number,
type: 'out' | 'inside' | 'saleInside'
}
export enum ORDER_EXAMINE_ENUM {
/**
* 新增订单
*/
ADD_ORDER = 1,
/**
* 一级审核
*/
ONE_LEVEL_VALIDATE,
/**
* 二级审核
*/
TWO_LEVEL_VALIDATE,
/**
* 提交订单中
*/
SUBMIT_ORDER_PROCESS,
/**
* 提交订单成功
*/
SUBMIT_ORDER_SUCCESS,
/**
* 一级审核失败
*/
ONE_LEVEL_VALIDATE_ERROR,
/**
* 二级审核失败
*/
TWO_LEVEL_VALIDATE_ERROR
}
export const ORDER_EXAMINE_LIST = ['',
'新增订单',
'一级审核中',
'二级审核中',
'提交订单',
'提交成功',
'一级审核不通过',
'二级审核不通过'
]
// 状态颜色映射
export const StatusColorsMaps = {
ready: '#C0C4CC',
process: '#FFC400',
submit: '#6C9CEB',
success: '#41CC9E',
error: '#EF6260'
}
const matchStatusColor = (status: number): string => {
const maps = {
[ORDER_EXAMINE_ENUM.ADD_ORDER]: StatusColorsMaps.ready,
[ORDER_EXAMINE_ENUM.ONE_LEVEL_VALIDATE]: StatusColorsMaps.process,
[ORDER_EXAMINE_ENUM.TWO_LEVEL_VALIDATE]: StatusColorsMaps.process,
[ORDER_EXAMINE_ENUM.SUBMIT_ORDER_PROCESS]: StatusColorsMaps.submit,
[ORDER_EXAMINE_ENUM.SUBMIT_ORDER_SUCCESS]: StatusColorsMaps.success
}
const READY_LISTS = [
PurchaseOrderInsideWorkState.CANCEL_ORDER,
PurchaseOrderOutWorkState.CANCEL_ORDER
]
// 默认返回错误的状态颜色
return maps[status] || StatusColorsMaps.error
}
const typeMaps = {
'out': PurchaseOrderOutWorkStateTexts,
'inside': PurchaseOrderInsideWorkStateTexts,
'saleInside': SaleOrderInsideWorkStateTexts
}
// 订单内部状态显示
const StatusColors:React.FC<StatusColorsProps> = (props) => {
const { status, type } = props
const statusText = typeMaps[type]
const statusShowColor = matchStatusColor(status)
return (<Tag color={statusShowColor}>{statusText[status]}</Tag>)
}
StatusColors.defaultProps = {}
export default StatusColors
\ No newline at end of file
/*
* @Author: XieZhiXiong
* @Date: 2020-11-03 10:34:50
* @LastEditors: XieZhiXiong
* @LastEditTime: 2020-11-03 10:40:40
* @Description: 售后相关常量
*/
import React from 'react'
import { formatTimeString } from '@/utils'
import StatusColors from '../components/StatusColors'
import { ORDER_TYPE, PurchaseOrderOutWorkStateTexts } from '@/constants'
import EyePreview from '@/components/EyePreview'
/**
* 待提交换货申请单列表表头
*/
export const baseOrderListColumns: any[] = [
// {
// title: '申请单号',
// dataIndex: 'applyNo',
// key: 'applyNo',
// render: (text, record) => {
// // 查看订单, 需根据状态显示不同schema
// return <EyePreview url={`/`}>
// {text}
// </EyePreview>
// },
// ellipsis: true,
// },
{
title: '申请单摘要',
dataIndex: 'applyAbstract',
key: 'applyAbstract',
ellipsis: true,
},
{
title: '供应会员',
dataIndex: 'supplierName',
key: 'supplierName',
ellipsis: true,
},
{
title: '单据时间',
dataIndex: 'applyTime',
key: 'applyTime',
render: (text) => formatTimeString(text)
},
{
title: '外部状态',
dataIndex: 'outerStatus',
key: 'outerStatus',
render: text => <StatusColors status={text} type='out' />
},
{
title: '内部状态',
dataIndex: 'innerStatus',
key: 'innerStatus',
render: (text) => <StatusColors status={text} type='inside' />
},
]
/**
* 待新增退货发货单列表表头
*/
export const baseWaitAddReturnOrderColumns: any[] = [
// {
// title: '申请单号',
// dataIndex: 'applyNo',
// key: 'applyNo',
// render: (text, record) => {
// // 查看订单, 需根据状态显示不同schema
// return <EyePreview url={`/`}>
// {text}
// </EyePreview>
// },
// ellipsis: true,
// },
{
title: '申请单摘要',
dataIndex: 'applyAbstract',
key: 'applyAbstract',
ellipsis: true,
},
{
title: '供应会员',
dataIndex: 'supplierName',
key: 'supplierName',
ellipsis: true,
},
{
title: '单据时间',
dataIndex: 'applyTime',
key: 'applyTime',
render: (text) => formatTimeString(text)
},
{
title: '退货批次',
dataIndex: 'returnBatch',
key: 'returnBatch',
ellipsis: true,
},
{
title: '退货发货单号',
dataIndex: 'returnDeliveryNo',
key: 'returnDeliveryNo',
ellipsis: true,
},
{
title: '外部状态',
dataIndex: 'outerStatus',
key: 'outerStatus',
render: text => <StatusColors status={text} type='out' />,
filters: Object.entries(PurchaseOrderOutWorkStateTexts).map(([key, value]) => ({ text: value, value: Number(key) })),
onFilter: (value, record) => value === record.externalState,
},
{
title: '内部状态',
dataIndex: 'innerStatus',
key: 'innerStatus',
render: (text) => <StatusColors status={text} type='inside' />,
filters: Object.entries(PurchaseOrderOutWorkStateTexts).map(([key, value]) => ({ text: value, value: Number(key) })),
onFilter: (value, record) => value === record.externalState,
},
]
/**
* 待新增退货发货单列表表头
*/
export const baseWaitAddReplaceOrderColumns: any[] = [
{
title: '申请单号',
dataIndex: 'applyNo',
key: 'applyNo',
render: (text, record) => {
// 查看订单, 需根据状态显示不同schema
return <EyePreview url={`/`}>
{text}
</EyePreview>
},
ellipsis: true,
},
{
title: '申请单摘要',
dataIndex: 'applyAbstract',
key: 'applyAbstract',
ellipsis: true,
},
{
title: '供应会员',
dataIndex: 'supplierName',
key: 'supplierName',
ellipsis: true,
},
{
title: '单据时间',
dataIndex: 'applyTime',
key: 'applyTime',
render: (text) => formatTimeString(text)
},
{
title: '换货批次',
dataIndex: 'returnBatch',
key: 'returnBatch',
ellipsis: true,
},
{
title: '换货入库单号',
dataIndex: 'returnDeliveryNo',
key: 'returnDeliveryNo',
ellipsis: true,
},
{
title: '外部状态',
dataIndex: 'outerStatus',
key: 'outerStatus',
render: text => <StatusColors status={text} type='out' />
},
{
title: '内部状态',
dataIndex: 'innerStatus',
key: 'innerStatus',
render: (text) => <StatusColors status={text} type='inside' />
},
]
\ No newline at end of file
.detailInfo {
&-desc {
:global {
.ant-descriptions-item-content {
white-space: break-spaces;
}
}
}
}
\ No newline at end of file
...@@ -32,6 +32,7 @@ import { ...@@ -32,6 +32,7 @@ import {
EXCHANGE_OUTER_STATUS_TAG_MAP, EXCHANGE_OUTER_STATUS_TAG_MAP,
EXCHANGE_INNER_STATUS_BADGE_MAP, EXCHANGE_INNER_STATUS_BADGE_MAP,
} from '../../../constants'; } from '../../../constants';
import styles from './index.less';
const OuterCirculation = React.lazy(() => import('../../../components/OuterCirculation')); const OuterCirculation = React.lazy(() => import('../../../components/OuterCirculation'));
const ProductList = React.lazy(() => import('../../../components/ProductList')); const ProductList = React.lazy(() => import('../../../components/ProductList'));
...@@ -287,23 +288,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({ ...@@ -287,23 +288,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</> </>
)} )}
> >
<Descriptions <div className={styles['detailInfo-desc']}>
size="small" <Descriptions
column={3} size="small"
style={{ column={3}
padding: '0 32px', style={{
}} padding: '0 32px',
> }}
<Descriptions.Item label="申请单摘要">{detailInfo?.applyAbstract}</Descriptions.Item> >
<Descriptions.Item label="采购会员">{detailInfo?.consumerName}</Descriptions.Item> <Descriptions.Item label="申请单摘要">{detailInfo?.applyAbstract}</Descriptions.Item>
<Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item> <Descriptions.Item label="采购会员">{detailInfo?.consumerName}</Descriptions.Item>
<Descriptions.Item label="外部状态"> <Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item>
<StatusTag type={EXCHANGE_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} /> <Descriptions.Item label="外部状态">
</Descriptions.Item> <StatusTag type={EXCHANGE_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} />
<Descriptions.Item label="内部状态"> </Descriptions.Item>
<Badge color={EXCHANGE_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} /> <Descriptions.Item label="内部状态">
</Descriptions.Item> <Badge color={EXCHANGE_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} />
</Descriptions> </Descriptions.Item>
</Descriptions>
</div>
</PageHeader> </PageHeader>
</> </>
} }
......
...@@ -102,6 +102,10 @@ export const addBillSchema: ISchema = { ...@@ -102,6 +102,10 @@ export const addBillSchema: ISchema = {
required: true, required: true,
message: '请填写申请单摘要', message: '请填写申请单摘要',
}, },
{
limitByte: true, // 自定义校验规则
maxByte: 60,
}
], ],
}, },
// 这是用 Mega-Layout 设置独立作用域,不然会被 Form 的布局影响到弹窗的布局 // 这是用 Mega-Layout 设置独立作用域,不然会被 Form 的布局影响到弹窗的布局
......
.detailInfo {
&-desc {
:global {
.ant-descriptions-item-content {
white-space: break-spaces;
}
}
}
}
\ No newline at end of file
...@@ -33,7 +33,8 @@ import { OuterHistoryData, InnerHistoryData } from '../../../components/FlowReco ...@@ -33,7 +33,8 @@ import { OuterHistoryData, InnerHistoryData } from '../../../components/FlowReco
import { import {
EXCHANGE_OUTER_STATUS_TAG_MAP, EXCHANGE_OUTER_STATUS_TAG_MAP,
EXCHANGE_INNER_STATUS_BADGE_MAP, EXCHANGE_INNER_STATUS_BADGE_MAP,
} from '../../../constants'; } from '../../../constants';
import styles from './index.less';
const ProductList = React.lazy(() => import('../../../components/ProductList')); const ProductList = React.lazy(() => import('../../../components/ProductList'));
const ExchangeReceivedInfo = React.lazy(() => import('../../../components/ExchangeReceivedInfo')); const ExchangeReceivedInfo = React.lazy(() => import('../../../components/ExchangeReceivedInfo'));
...@@ -330,23 +331,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({ ...@@ -330,23 +331,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</> </>
)} )}
> >
<Descriptions <div className={styles['detailInfo-desc']}>
size="small" <Descriptions
column={3} size="small"
style={{ column={3}
padding: '0 32px', style={{
}} padding: '0 32px',
> }}
<Descriptions.Item label="申请单摘要">{detailInfo?.applyAbstract}</Descriptions.Item> >
<Descriptions.Item label="采购会员">{detailInfo?.consumerName}</Descriptions.Item> <Descriptions.Item label="申请单摘要">{detailInfo?.applyAbstract}</Descriptions.Item>
<Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item> <Descriptions.Item label="采购会员">{detailInfo?.consumerName}</Descriptions.Item>
<Descriptions.Item label="外部状态"> <Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item>
<StatusTag type={EXCHANGE_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} /> <Descriptions.Item label="外部状态">
</Descriptions.Item> <StatusTag type={EXCHANGE_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} />
<Descriptions.Item label="内部状态"> </Descriptions.Item>
<Badge color={EXCHANGE_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} /> <Descriptions.Item label="内部状态">
</Descriptions.Item> <Badge color={EXCHANGE_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} />
</Descriptions> </Descriptions.Item>
</Descriptions>
</div>
</PageHeader> </PageHeader>
</> </>
} }
......
.detailInfo {
&-desc {
:global {
.ant-descriptions-item-content {
white-space: break-spaces;
}
}
}
}
\ No newline at end of file
...@@ -25,6 +25,7 @@ import { ...@@ -25,6 +25,7 @@ import {
REPAIR_OUTER_STATUS_TAG_MAP, REPAIR_OUTER_STATUS_TAG_MAP,
REPAIR_INNER_STATUS_BADGE_MAP, REPAIR_INNER_STATUS_BADGE_MAP,
} from '../../../constants'; } from '../../../constants';
import styles from './index.less';
const OuterCirculation = React.lazy(() => import('../../../components/OuterCirculation')); const OuterCirculation = React.lazy(() => import('../../../components/OuterCirculation'));
const ProductList = React.lazy(() => import('../../../components/ProductList')); const ProductList = React.lazy(() => import('../../../components/ProductList'));
...@@ -196,23 +197,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({ ...@@ -196,23 +197,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</> </>
)} )}
> >
<Descriptions <div className={styles['detailInfo-desc']}>
size="small" <Descriptions
column={3} size="small"
style={{ column={3}
padding: '0 32px', style={{
}} padding: '0 32px',
> }}
<Descriptions.Item label="申请单摘要:">{detailInfo?.applyAbstract}</Descriptions.Item> >
<Descriptions.Item label="供应会员">{detailInfo?.supplierName}</Descriptions.Item> <Descriptions.Item label="申请单摘要:">{detailInfo?.applyAbstract}</Descriptions.Item>
<Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item> <Descriptions.Item label="供应会员">{detailInfo?.supplierName}</Descriptions.Item>
<Descriptions.Item label="外部状态"> <Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item>
<StatusTag type={REPAIR_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} /> <Descriptions.Item label="外部状态">
</Descriptions.Item> <StatusTag type={REPAIR_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} />
<Descriptions.Item label="内部状态"> </Descriptions.Item>
<Badge color={REPAIR_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} /> <Descriptions.Item label="内部状态">
</Descriptions.Item> <Badge color={REPAIR_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} />
</Descriptions> </Descriptions.Item>
</Descriptions>
</div>
</PageHeader> </PageHeader>
</> </>
} }
......
...@@ -102,6 +102,10 @@ export const addBillSchema: ISchema = { ...@@ -102,6 +102,10 @@ export const addBillSchema: ISchema = {
required: true, required: true,
message: '请填写申请单摘要', message: '请填写申请单摘要',
}, },
{
limitByte: true, // 自定义校验规则
maxByte: 60,
}
], ],
}, },
// 这是用 Mega-Layout 设置独立作用域,不然会被 Form 的布局影响到弹窗的布局 // 这是用 Mega-Layout 设置独立作用域,不然会被 Form 的布局影响到弹窗的布局
......
.detailInfo {
&-desc {
:global {
.ant-descriptions-item-content {
white-space: break-spaces;
}
}
}
}
\ No newline at end of file
...@@ -26,6 +26,7 @@ import { ...@@ -26,6 +26,7 @@ import {
REPAIR_OUTER_STATUS_TAG_MAP, REPAIR_OUTER_STATUS_TAG_MAP,
REPAIR_INNER_STATUS_BADGE_MAP, REPAIR_INNER_STATUS_BADGE_MAP,
} from '../../../constants'; } from '../../../constants';
import styles from './index.less';
const ProductList = React.lazy(() => import('../../../components/ProductList')); const ProductList = React.lazy(() => import('../../../components/ProductList'));
const FileList = React.lazy(() => import('../../../components/FileList')); const FileList = React.lazy(() => import('../../../components/FileList'));
...@@ -194,23 +195,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({ ...@@ -194,23 +195,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</> </>
)} )}
> >
<Descriptions <div className={styles['detailInfo-desc']}>
size="small" <Descriptions
column={3} size="small"
style={{ column={3}
padding: '0 32px', style={{
}} padding: '0 32px',
> }}
<Descriptions.Item label="申请单摘要:">{detailInfo?.applyAbstract}</Descriptions.Item> >
<Descriptions.Item label="供应会员">{detailInfo?.supplierName}</Descriptions.Item> <Descriptions.Item label="申请单摘要:">{detailInfo?.applyAbstract}</Descriptions.Item>
<Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item> <Descriptions.Item label="供应会员">{detailInfo?.supplierName}</Descriptions.Item>
<Descriptions.Item label="外部状态"> <Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item>
<StatusTag type={REPAIR_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} /> <Descriptions.Item label="外部状态">
</Descriptions.Item> <StatusTag type={REPAIR_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} />
<Descriptions.Item label="内部状态"> </Descriptions.Item>
<Badge color={REPAIR_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} /> <Descriptions.Item label="内部状态">
</Descriptions.Item> <Badge color={REPAIR_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} />
</Descriptions> </Descriptions.Item>
</Descriptions>
</div>
</PageHeader> </PageHeader>
</> </>
} }
......
.detailInfo {
&-desc {
:global {
.ant-descriptions-item-content {
white-space: break-spaces;
}
}
}
}
\ No newline at end of file
...@@ -35,7 +35,8 @@ import { OuterHistoryData, InnerHistoryData } from '../../../components/FlowReco ...@@ -35,7 +35,8 @@ import { OuterHistoryData, InnerHistoryData } from '../../../components/FlowReco
import { import {
RETURN_OUTER_STATUS_TAG_MAP, RETURN_OUTER_STATUS_TAG_MAP,
RETURN_INNER_STATUS_BADGE_MAP, RETURN_INNER_STATUS_BADGE_MAP,
} from '../../../constants'; } from '../../../constants';
import styles from './index.less';
const OuterCirculation = React.lazy(() => import('../../../components/OuterCirculation')); const OuterCirculation = React.lazy(() => import('../../../components/OuterCirculation'));
const ProductList = React.lazy(() => import('../../../components/ProductList')); const ProductList = React.lazy(() => import('../../../components/ProductList'));
...@@ -327,23 +328,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({ ...@@ -327,23 +328,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</> </>
)} )}
> >
<Descriptions <div className={styles['detailInfo-desc']}>
size="small" <Descriptions
column={3} size="small"
style={{ column={3}
padding: '0 32px', style={{
}} padding: '0 32px',
> }}
<Descriptions.Item label="申请单摘要">{detailInfo?.applyAbstract}</Descriptions.Item> >
<Descriptions.Item label="供应会员">{detailInfo?.supplierName}</Descriptions.Item> <Descriptions.Item label="申请单摘要">{detailInfo?.applyAbstract}</Descriptions.Item>
<Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item> <Descriptions.Item label="供应会员">{detailInfo?.supplierName}</Descriptions.Item>
<Descriptions.Item label="外部状态"> <Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item>
<StatusTag type={RETURN_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} /> <Descriptions.Item label="外部状态">
</Descriptions.Item> <StatusTag type={RETURN_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} />
<Descriptions.Item label="内部状态"> </Descriptions.Item>
<Badge color={RETURN_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} /> <Descriptions.Item label="内部状态">
</Descriptions.Item> <Badge color={RETURN_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} />
</Descriptions> </Descriptions.Item>
</Descriptions>
</div>
</PageHeader> </PageHeader>
</> </>
} }
......
...@@ -102,6 +102,10 @@ export const addBillSchema: ISchema = { ...@@ -102,6 +102,10 @@ export const addBillSchema: ISchema = {
required: true, required: true,
message: '请填写申请单摘要', message: '请填写申请单摘要',
}, },
{
limitByte: true, // 自定义校验规则
maxByte: 60,
}
], ],
}, },
// 这是用 Mega-Layout 设置独立作用域,不然会被 Form 的布局影响到弹窗的布局 // 这是用 Mega-Layout 设置独立作用域,不然会被 Form 的布局影响到弹窗的布局
......
.detailInfo {
&-desc {
:global {
.ant-descriptions-item-content {
white-space: break-spaces;
}
}
}
}
\ No newline at end of file
...@@ -39,7 +39,8 @@ import { OuterHistoryData, InnerHistoryData } from '../../../components/FlowReco ...@@ -39,7 +39,8 @@ import { OuterHistoryData, InnerHistoryData } from '../../../components/FlowReco
import { import {
RETURN_OUTER_STATUS_TAG_MAP, RETURN_OUTER_STATUS_TAG_MAP,
RETURN_INNER_STATUS_BADGE_MAP, RETURN_INNER_STATUS_BADGE_MAP,
} from '../../../constants'; } from '../../../constants';
import styles from './index.less';
const ProductList = React.lazy(() => import('../../../components/ProductList')); const ProductList = React.lazy(() => import('../../../components/ProductList'));
const ReturnAnalysis = React.lazy(() => import('../../../components/ReturnAnalysis')); const ReturnAnalysis = React.lazy(() => import('../../../components/ReturnAnalysis'));
...@@ -364,23 +365,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({ ...@@ -364,23 +365,25 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</> </>
)} )}
> >
<Descriptions <div className={styles['detailInfo-desc']}>
size="small" <Descriptions
column={3} size="small"
style={{ column={3}
padding: '0 32px', style={{
}} padding: '0 32px',
> }}
<Descriptions.Item label="申请单摘要">{detailInfo?.applyAbstract}</Descriptions.Item> >
<Descriptions.Item label="采购会员">{detailInfo?.consumerName}</Descriptions.Item> <Descriptions.Item label="申请单摘要">{detailInfo?.applyAbstract}</Descriptions.Item>
<Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item> <Descriptions.Item label="采购会员">{detailInfo?.consumerName}</Descriptions.Item>
<Descriptions.Item label="外部状态"> <Descriptions.Item label="单据时间">{detailInfo?.applyTime}</Descriptions.Item>
<StatusTag type={RETURN_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} /> <Descriptions.Item label="外部状态">
</Descriptions.Item> <StatusTag type={RETURN_OUTER_STATUS_TAG_MAP[detailInfo?.outerStatus]} title={detailInfo?.outerStatusName} />
<Descriptions.Item label="内部状态"> </Descriptions.Item>
<Badge color={RETURN_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} /> <Descriptions.Item label="内部状态">
</Descriptions.Item> <Badge color={RETURN_INNER_STATUS_BADGE_MAP[detailInfo?.innerStatus]} text={detailInfo?.innerStatusName} />
</Descriptions> </Descriptions.Item>
</Descriptions>
</div>
</PageHeader> </PageHeader>
</> </>
} }
......
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