Commit 35a9c063 authored by 前端-钟卫鹏's avatar 前端-钟卫鹏
parents f8caf3a4 0b925212
......@@ -4,14 +4,14 @@ import {
Coordinate,
Point,
Annotation,
registerShape,
} from 'bizcharts';
// import Point from 'bizcharts/lib/geometry/Point';
// import { Annotation } from 'bizcharts/lib';
import { registerShape } from '@antv/g2';
import React from 'react';
import autoHeight from '../autoHeight';
import { getIntl } from 'umi';
const intl = getIntl();
export interface GaugeProps {
title: React.ReactText;
color?: string;
......@@ -73,7 +73,7 @@ registerShape('point', 'pointer', {
attrs: {
x: center.x,
y: center.y,
r: 6,
r: 4,
stroke: cfg.color,
lineWidth: 3,
fill: '#fff',
......@@ -103,6 +103,7 @@ const Gauge: React.FC<GaugeProps> = (props) => {
nice: true,
},
};
const data = [{ value: percent / 10 }];
const textStyle: {
......
......@@ -166,7 +166,8 @@ export default {
"merchantCoupon.OrderUseTime": "Order (use) time",
"merchantCoupon.couponState": "Coupon State (All)",
"merchantCoupon.couponStartAndEndTime": "Start time for receiving (issuing) coupons','Deadline for receiving (issuing) coupons",
"merchantCoupon.useTimeStart": "Deadline for receiving (issuing) coupons",
"merchantCoupon.useTimeEnd": "수령권 종료 시간",
"merchantCoupon.CustomerID": "Customer ID",
"merchantCoupon.DeterminepassCoupon?": "Are you sure you want to pass the selected coupon",
"merchantCoupon.giveCouponStartTime": "Start time for receiving (issuing) coupons",
......
......@@ -25,6 +25,7 @@ export default {
'purchaserEvaluation.caigoushangpin':'Purchase goods',
'purchaserEvaluation.chengjiaoshuliang':'Number of transactions',
'purchaserEvaluation.jiaoyishijian':'Trading Hours',
'purchaserEvaluation.beizhu': 'Remark',
'purchaserEvaluation.shifouxianshishangpinpingjia':'Whether to display product evaluation',
'purchaserEvaluation.xianshizebiaoshishangpinping':
'Display means that the product evaluation is displayed to the buyer on the product detail page; hidden means that the product evaluation is hidden from the buyer on the product detail page, and the buyer can still evaluate the order. ',
......
......@@ -166,7 +166,8 @@ export default {
"merchantCoupon.OrderUseTime": '주문 (사용) 시간',
"merchantCoupon.couponState": '쿠폰 상태(모두)',
"merchantCoupon.couponStartAndEndTime": '수령권 시작 시간',
"merchantCoupon.useTimeStart": "주문 (사용) 시작 시간",
"merchantCoupon.useTimeEnd": "주문 (사용) 종료 시간",
"merchantCoupon.CustomerID": '고객 ID',
"merchantCoupon.DeterminepassCoupon?": '선택한 쿠폰을 통과하시겠습니까?',
"merchantCoupon.giveCouponStartTime": '상품권 수령 시작 시간',
......
......@@ -25,6 +25,7 @@ export default {
'purchaserEvaluation.caigoushangpin': '상품을 구매하다',
'purchaserEvaluation.chengjiaoshuliang': '거래량',
'purchaserEvaluation.jiaoyishijian': '거래 시간',
'purchaserEvaluation.beizhu': '비고',
'purchaserEvaluation.shifouxianshishangpinpingjia': '상품 평가 표시 여부',
'purchaserEvaluation.xianshizebiaoshishangpinping':
'표시는 상품 평가가 상품 상세 페이지에서 구매자에게 전시되는 것을 나타낸다.숨기는 것은 상품 평가가 상품 상세 페이지에서 바이어에게 숨겨지고 바이어는 여전히 주문서에 대해 평가할 수 있음을 나타낸다.',
......
......@@ -166,7 +166,8 @@ export default {
"merchantCoupon.OrderUseTime": "下单(使用)时间",
"merchantCoupon.couponState": "劵状态(所有)",
"merchantCoupon.couponStartAndEndTime": "领(发)劵起始时间', '领(发)劵截止时间",
"merchantCoupon.useTimeStart": "下单(使用)起始时间",
"merchantCoupon.useTimeEnd": "下单(使用)止时间",
"merchantCoupon.CustomerID": "客户ID",
"merchantCoupon.DeterminepassCoupon?": "确定要通过选中的优惠券吗",
"merchantCoupon.giveCouponStartTime": "领(发)劵起始时间",
......
......@@ -25,6 +25,7 @@ export default {
'purchaserEvaluation.caigoushangpin': '采购商品',
'purchaserEvaluation.chengjiaoshuliang': '成交数量',
'purchaserEvaluation.jiaoyishijian': '交易时间',
'purchaserEvaluation.beizhu': '备注',
'purchaserEvaluation.shifouxianshishangpinpingjia': '是否显示商品评价',
'purchaserEvaluation.xianshizebiaoshishangpinping':
'显示则表示商品评价在商品详情页对买家进行展示;隐藏则表示商品评价在商品详情页对买家进行隐藏,买家依然可对订单进行评价。',
......
......@@ -2,15 +2,17 @@
.evaluate {
.score {
position: absolute;
position: relative;
padding-right: 90px;
display: inline-block;
&-left {
padding-right: 90px;
display: inline-block;
}
&-right {
position: absolute;
top: -50%;
top: -76%;
right: 0;
width: 80px;
flex-shrink: 0;
......
......@@ -7,7 +7,7 @@
*/
import React from 'react';
import { useIntl } from 'umi';
import { Row, Col, Descriptions } from 'antd';
import { Row, Col, Form } from 'antd';
import MellowCard, { MellowCardProps } from '@/components/MellowCard';
import { Gauge } from '@/components/Charts';
import styles from './index.less';
......@@ -48,6 +48,11 @@ const Score: React.FC<ScoreProps> = ({
...rest
}) => {
const intl = useIntl();
const formItemLayout = {
labelCol: { span: 6 },
wrapperCol: { span: 18 },
};
return (
<MellowCard
......@@ -56,40 +61,40 @@ const Score: React.FC<ScoreProps> = ({
{...rest}
>
<Row gutter={40}>
<Col span={8}>
<div className={styles.score}>
<div className={styles['score-left']}>
<Descriptions column={1}>
<Descriptions.Item
label={intl.formatMessage({ id: 'afterService.components.Score.score' }, { default: '售后满意度' })}
>
<span className={styles['score-star']}>
{`${score}${intl.formatMessage({ id: 'afterService.components.Score.score.unit' }, { default: '分' })}`}
</span>
</Descriptions.Item>
</Descriptions>
</div>
<div className={styles['score-right']}>
<Gauge
title=""
height={90}
percent={+(score/FULL_SCORE * 100).toFixed(2)}
formatter={() => ''}
formatContent={() => ''}
color={COLOR_MAP[score]}
strokeWidth={5}
/>
<Col span={12}>
<Form.Item
label={intl.formatMessage({ id: 'afterService.components.Score.score' }, { default: '售后满意度' })}
labelAlign="left"
{...formItemLayout}
>
<div className={styles.score}>
<div className={styles['score-left']}>
<span className={styles['score-star']}>
{`${score}${intl.formatMessage({ id: 'afterService.components.Score.score.unit' }, { default: '分' })}`}
</span>
</div>
<div className={styles['score-right']}>
<Gauge
title=""
height={90}
percent={+(score/FULL_SCORE * 100).toFixed(2)}
formatter={() => ''}
formatContent={() => ''}
color={COLOR_MAP[score]}
strokeWidth={5}
/>
</div>
</div>
</div>
</Form.Item>
</Col>
<Col span={16}>
<Descriptions column={1}>
<Descriptions.Item
label={intl.formatMessage({ id: 'afterService.components.Score.content' }, { default: '售后评价' })}
>
{content}
</Descriptions.Item>
</Descriptions>
<Col span={12}>
<Form.Item
label={intl.formatMessage({ id: 'afterService.components.Score.content' }, { default: '售后评价' })}
labelAlign="left"
{...formItemLayout}
>
{content}
</Form.Item>
</Col>
</Row>
</MellowCard>
......
......@@ -21,11 +21,8 @@ export const schema: ISchema = {
},
properties: {
ctl: {
type: 'object',
'x-component': 'Children',
'x-component-props': {
children: '{{exportBtn}}',
},
type: "object",
"x-component": "exportBtn",
},
orderNo: {
type: 'string',
......
......@@ -17,6 +17,7 @@ const formActions = createFormActions();
interface Iprops {
visible: boolean,
onCancel: () => void,
onSubmitLoading?: boolean,
onSubmit?: (values: any) => void,
mode?: 'edit' | 'view',
invoiceInfoData: any
......@@ -30,7 +31,7 @@ type ProveListType = {
}
const InvoiceDrawerInfo: React.FC<Iprops> = (props: Iprops) => {
const { visible, onCancel, invoiceInfoData, onSubmit, mode } = props;
const { visible, onCancel, invoiceInfoData, onSubmit, mode, onSubmitLoading = false } = props;
const [initialValue, setInitialValue] = useState<{ [key: string]: ProveListType }>({});
const disabled = useMemo(() => mode === 'view', [mode])
......@@ -44,7 +45,7 @@ const InvoiceDrawerInfo: React.FC<Iprops> = (props: Iprops) => {
<Button onClick={handleCancel} style={{ marginRight: 8 }}>
{intl.formatMessage({ id: 'balance.components.invoiceCreate.invoiceDrawer.renderFooter.button.1' })}
</Button>
<Button onClick={() => formActions.submit()} type="primary">
<Button onClick={() => formActions.submit()} loading={onSubmitLoading} type="primary">
{intl.formatMessage({ id: 'balance.components.invoiceCreate.invoiceDrawer.renderFooter.button.2' })}
</Button>
</div>
......@@ -81,7 +82,7 @@ const InvoiceDrawerInfo: React.FC<Iprops> = (props: Iprops) => {
onSubmit={handleSubmit}
components={{ ArrayCustom: ArrayList, Input: Input, DatePicker, InvoiceInfo }}
actions={formActions}
// editable={mode === 'edit'}
// editable={mode === 'edit'}
>
{
invoiceInfoData?.map((_item, key) => {
......@@ -160,7 +161,7 @@ const InvoiceDrawerInfo: React.FC<Iprops> = (props: Iprops) => {
}}
x-rules={
[
{ required: true, message: intl.formatMessage({id: 'balance.qingtianxiekaipiaojine'}) }
{ required: true, message: intl.formatMessage({ id: 'balance.qingtianxiekaipiaojine' }) }
]
}
/>
......
......@@ -5,7 +5,6 @@ import React from 'react';
import { Button, message, Tag, Tooltip } from 'antd';
import moment from 'moment';
import { random } from 'lodash';
import { MERCHANT_COUPON_TYPE_VOUCHER } from '@/constants/marketing';
import { REQUEST_HEADER, TOP_DOMAIN } from '@/constants';
import { COUPON_STATE_UNUSED, COUPON_STATE_USED, COUPON_STATE_EXPIRED } from '../../utils';
import styles from './index.less';
......@@ -128,18 +127,7 @@ const CouponCard: React.FC<CouponCardProps> = (props: CouponCardProps) => {
return (
<div className={styles['coupon-card']}>
<div className={styles['coupon-card-left']}>
{data.type !== MERCHANT_COUPON_TYPE_VOUCHER ? (
<>
{data.belongType === 1 ? (
<Tag color="cyan" className={styles['coupon-card-belong']}>平台通用</Tag>
) : null}
{data.belongType === 2 ? (
<Tag color="red" className={styles['coupon-card-belong']}>商家优惠券</Tag>
) : null}
</>
) : (
<Tag color="gold" className={styles['coupon-card-belong']}>0元购买抵扣劵</Tag>
)}
<Tag color="red" className={styles['coupon-card-belong']}>{data.typeName}</Tag>
<Tooltip title={data.name}>
<div className={styles['coupon-card-name']}>
{data.name}
......
......@@ -44,7 +44,7 @@ export const querySchema: ISchema = {
default: undefined,
enum: [],
'x-component-props': {
placeholder: intl.formatMessage({ id: 'merchantCoupon.couponStartAndEndTime' }),
placeholder: intl.formatMessage({ id: 'merchantCoupon.couponState' }),
allowClear: true,
},
},
......@@ -52,7 +52,7 @@ export const querySchema: ISchema = {
type: 'string',
'x-component': 'RangePicker',
'x-component-props': {
placeholder: [intl.formatMessage({ id: 'merchantCoupon.giveCouponStartTime' }) + ',' + intl.formatMessage({ id: 'merchantCoupon.giveCouponEndTime' })],
placeholder: [intl.formatMessage({ id: 'merchantCoupon.giveCouponStartTime' }), intl.formatMessage({ id: 'merchantCoupon.giveCouponEndTime' })],
allowEmpty: [true, true],
},
},
......@@ -76,7 +76,7 @@ export const querySchema: ISchema = {
type: 'string',
'x-component': 'RangePicker',
'x-component-props': {
placeholder: [intl.formatMessage({ id: 'merchantCoupon.couponState' })],
placeholder: [intl.formatMessage({ id: 'merchantCoupon.useTimeStart' }), intl.formatMessage({ id: 'merchantCoupon.useTimeEnd' })],
showTime: true,
},
},
......
......@@ -189,6 +189,7 @@ const Analysis: React.FC<AnalysisProps> = ({
target: item.byMemberName,
orderId: item.orderId,
dealTime: item.dealTime,
orderNo: item.orderNo,
};
}),
totalCount,
......@@ -358,6 +359,7 @@ const Analysis: React.FC<AnalysisProps> = ({
paginationType="button"
searchable={false}
onCheck={handleJumpReceived}
remark
/>
</Shelves>
</TabPane>
......
/*
* @Author: XieZhiXiong
* @Date: 2021-07-16 16:53:17
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-08-09 18:40:47
* @Description: 评价 schema
*/
import { ISchema } from '@formily/antd';
import { UPLOAD_TYPE } from '@/constants';
import { getIntl } from 'umi';
const intl = getIntl();
export const evaluateSchema: ISchema = {
type: 'object',
properties: {
comments: {
type: 'array',
'x-component': 'EvaluationList',
default: [],
items: {
type: 'object',
properties: {
MEGA_LADYOUT: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
labelAlign: 'top',
},
properties: {
MEGA_LADYOUT_PRODUCT: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
grid: true,
full: true,
},
properties: {
good: {
type: 'string',
'x-component': 'EtProductInfo',
'x-mega-props': {
span: 2,
},
},
smile: {
type: 'string',
'x-component': 'SmilingFace',
'x-component-props': {
style: {
flex: 1,
textAlign: 'right',
},
},
},
},
},
star: {
title: intl.formatMessage({id: 'purchaserEvaluation.manyichengdu'}),
'x-component': 'Rating',
'x-component-props': {
allowHalf: false,
allowClear: false,
},
'x-rules': [
{
required: true,
},
],
},
comment: {
type: 'string',
title: intl.formatMessage({id: 'purchaserEvaluation.pingjia'}),
'x-component': 'TextArea',
'x-component-props': {
rows: 1,
style: {
width: '60%',
},
},
'x-rules': [
{
max: 200,
},
],
},
MEGA_LADYOUT_1: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
labelAlign: 'top',
inline: true,
},
properties: {
picture: {
type: 'string',
title: intl.formatMessage({id: 'purchaserEvaluation.tupian'}),
'x-component': 'FixUpload',
'x-component-props': {
listType: 'card',
action: '/api/file/file/upload/prefix',
data: {
fileType: UPLOAD_TYPE,
prefix: '',
},
beforeUpload: '{{beforeUpload}}',
accept: '.png, .jpg, .jpeg',
maxCount: 4,
},
'x-rules': [
{
max: 4,
message: intl.formatMessage({id: 'purchaserEvaluation.zuiduokeshangchuan4zhangtu'}),
},
],
},
UPLOAD_TIP: {
type: 'string',
title: ' ',
'x-component': 'UploadTip',
},
},
},
},
},
},
},
},
},
};
/*
* @Author: XieZhiXiong
* @Date: 2021-08-11 14:04:22
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-08-11 16:41:32
* @Description: 收到的评价详情 schema
*/
import { ISchema } from '@formily/antd';
import { UPLOAD_TYPE } from '@/constants';
import { getIntl } from 'umi';
const intl = getIntl();
/**
*
* @param showExplain 是否需要展示解释, 默认为 true
* @returns
*/
const createSchema = (showExplain = true): ISchema => ({
type: 'object',
properties: {
comments: {
type: 'array',
'x-component': 'EvaluationList',
default: [],
items: {
type: 'object',
properties: {
MEGA_LADYOUT: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
labelAlign: 'top',
},
properties: {
MEGA_LADYOUT_PRODUCT: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
grid: true,
full: true,
},
properties: {
good: {
type: 'string',
'x-component': 'EtProductInfo',
'x-mega-props': {
span: 2,
},
},
smile: {
type: 'string',
'x-component': 'SmilingFace',
'x-component-props': {
style: {
flex: 1,
textAlign: 'right',
},
},
},
},
},
star: {
title: intl.formatMessage({id: 'purchaserEvaluation.manyichengdu'}),
'x-component': 'Rating',
'x-component-props': {
allowHalf: false,
allowClear: false,
},
},
comment: {
type: 'string',
title: intl.formatMessage({id: 'purchaserEvaluation.pingjia'}),
'x-component': 'TextArea',
'x-component-props': {
rows: 1,
style: {
width: '60%',
},
},
'x-rules': {
max: 200,
},
},
picture: {
type: 'string',
title: intl.formatMessage({id: 'purchaserEvaluation.tupian'}),
'x-component': 'FixUpload',
'x-mega-props': {
span: 2,
},
'x-component-props': {
listType: 'card',
action: '/api/file/file/upload/prefix',
data: {
fileType: UPLOAD_TYPE,
prefix: '',
},
beforeUpload: '{{beforeUpload}}',
accept: '.png, .jpg, .jpeg',
maxCount: 4,
},
'x-rules': [
{
max: 4,
message: intl.formatMessage({id: 'purchaserEvaluation.zuiduokeshangchuan4zhangtu'}),
},
],
},
...(showExplain ? {
replyTime: {
type: 'string',
title: intl.formatMessage({id: 'purchaserEvaluation.jieshishijian'}),
},
replyContent: {
type: 'string',
title: intl.formatMessage({id: 'purchaserEvaluation.shangjiajieshi'}),
},
} : {}),
},
},
},
},
},
},
});
export default createSchema;
......@@ -4,11 +4,11 @@
import React from 'react';
import styles from './index.less';
type EtProductInfoType = {
export type EtProductInfoType = {
/**
* 订单商品记录id
*/
orderProductId: number,
orderProductId?: number,
/**
* 商品图片
*/
......@@ -20,7 +20,7 @@ type EtProductInfoType = {
/**
* 商品id
*/
productId: number,
productId?: number,
/**
* 商品名称
*/
......
/*
* @Author: XieZhiXiong
* @Date: 2021-07-16 17:13:23
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-07-16 17:13:24
* @Description:
*/
import { useBusinessEffects } from './useBusinessEffects';
export const createEffects = (context, actions) => {
useBusinessEffects(context, actions);
import { useBusinessEffects } from './useBusinessEffects';
export const createEffects = (context, actions) => {
useBusinessEffects(context, actions);
};
\ No newline at end of file
/*
* @Author: XieZhiXiong
* @Date: 2021-07-16 17:13:39
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-07-16 17:14:46
* @Description:
*/
import { FormEffectHooks, FormPath } from '@formily/antd';
const {
onFieldInputChange$,
onFieldValueChange$,
} = FormEffectHooks;
export const useBusinessEffects = (context, actions) => {
const {
setFieldState,
} = actions;
// 评论图片限制 4 张
onFieldInputChange$('comments.*.picture').subscribe(fieldState => {
const { name, value } = fieldState;
setFieldState(
FormPath.transform(name, /\d/, $1 => {
return `comments.${$1}.picture`
}),
state => {
// 禁用掉 或者 editable 设置成 false,删除按钮也会禁用掉的
// 所以目前先用过 rules 去限制最多可上传多少张
// state.props['x-component-props'].disabled = value.length >= 4;
}
);
});
// 评分联动
onFieldInputChange$('comments.*.star').subscribe(fieldState => {
const { name, value } = fieldState;
setFieldState(
FormPath.transform(name, /\d/, $1 => {
return `comments.${$1}.smile`
}),
state => {
state.value = value;
}
);
});
import { FormEffectHooks, FormPath } from '@formily/antd';
const {
onFieldInputChange$,
onFieldValueChange$,
} = FormEffectHooks;
export const useBusinessEffects = (context, actions) => {
const {
setFieldState,
} = actions;
// 评论图片限制 4 张
onFieldInputChange$('comments.*.picture').subscribe(fieldState => {
const { name, value } = fieldState;
setFieldState(
FormPath.transform(name, /\d/, $1 => {
return `comments.${$1}.picture`
}),
state => {
// 禁用掉 或者 editable 设置成 false,删除按钮也会禁用掉的
// 所以目前先用过 rules 去限制最多可上传多少张
// state.props['x-component-props'].disabled = value.length >= 4;
}
);
});
// 评分联动
onFieldInputChange$('comments.*.star').subscribe(fieldState => {
const { name, value } = fieldState;
setFieldState(
FormPath.transform(name, /\d/, $1 => {
return `comments.${$1}.smile`
}),
state => {
state.value = value;
}
);
});
}
\ No newline at end of file
@import '~antd/es/style/themes/default.less';
.evaluation-form {
&-picture-tip {
margin-top: @margin-md;
line-height: @line-height-base;
color: @text-color-secondary;
font-weight: 400;
word-break: break-all;
}
&-interpretation {
line-height: @line-height-base;
&-title {
position: relative;
padding-left: @padding-xs;
padding-top: @padding-md;
padding-bottom: @padding-md;
font-size: @font-size-sm;
border-top: 1px solid @background-color-base;
&::before {
content: ' ';
display: block;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 2px;
height: 12px;
background-color: @primary-color;
border-radius: 1px;
}
}
&-content {
font-size: @font-size-lg;
}
&-date {
margin-top: @margin-xs;
font-size: @font-size-sm;
color: @text-color-secondary;
}
}
}
\ No newline at end of file
......@@ -86,16 +86,19 @@ export interface RecordItem {
/**
* 是否已解释,被评价方回复 0-否 1-是
*/
replyStatus?: number,
replyStatus?: number
/**
* 交易时间
*/
dealTime: string;
dealTime: string
/**
* 状态 1显示 2隐藏
*/
status: number;
status?: number
/**
* 订单号
*/
orderNo?: string
};
export interface RecordRes {
......@@ -115,7 +118,7 @@ interface RecordListProps {
searchable?: boolean;
/**
* 是否是查看收到的评论
* 是否是查看收到的评论,默认 true
*/
opposite?: boolean;
......@@ -149,6 +152,11 @@ interface RecordListProps {
* 点击解释触发事件
*/
onExplain?: (record: RecordItem) => void;
/**
* 是否显示备注,默认 false
*/
remark?: boolean,
};
interface RecordListState {
......@@ -334,6 +342,7 @@ export default class RecordList extends React.Component<RecordListProps, RecordL
searchTip = intl.formatMessage({ id: 'purchaserEvaluation.pingjiafang' }, { default: '评价方' }),
explicable = false,
statusable = false,
remark = false,
} = this.props;
const { page, size, loading, receivedList, hasMore } = this.state;
......@@ -357,7 +366,7 @@ export default class RecordList extends React.Component<RecordListProps, RecordL
dataIndex: 'quantity',
},
{
title: intl.formatMessage({ id: 'purchaserEvaluation.pingjiafang' }, { default: '评价方' }),
title: opposite ? intl.formatMessage({ id: 'purchaserEvaluation.pingjiafang' }, { default: '评价方' }) : intl.formatMessage({ id: 'purchaserEvaluation.beipingjiafang' }, { default: '被评价方' }),
dataIndex: 'target',
},
{
......@@ -365,6 +374,11 @@ export default class RecordList extends React.Component<RecordListProps, RecordL
dataIndex: 'dealTime',
render: (text) => text ? moment(text).format('YYYY-MM-DD HH:mm:ss') : '',
},
remark ? {
title: intl.formatMessage({ id: 'purchaserEvaluation.beizhu' }, { default: '备注' }),
dataIndex: 'orderNo',
render: (text) => `${intl.formatMessage({ id: 'purchaserEvaluation.dingdanhao' }, { default: '订单号' })}${text}`,
} : null,
statusable ? {
title: (
<Tooltip title={intl.formatMessage({ id: 'purchaserEvaluation.xianshizebiaoshishangpinping' }, { default: '显示则表示商品评价在商品详情页对买家进行展示;隐藏则表示商品评价在商品详情页对买家进行隐藏,买家依然可对订单进行评价。' })}>
......
/**
* @Description 采购会员-收到的评价-详情组件
*/
import React, { useState, useEffect } from 'react';
import {
PageHeader,
Descriptions,
Spin,
message,
Upload,
} from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { getIntl, history } from 'umi';
import { createFormActions } from '@formily/antd';
import { usePageStatus } from '@/hooks/usePageStatus';
import { getMemberCommentConsumerReceiveTradeHistoryGet } from '@/services/MemberV2Api';
import { normalizeFiledata, FileData } from '@/utils';
import MellowCard from '@/components/MellowCard';
import NiceForm from '@/components/NiceForm';
import createSchema from '../../common/schemas/receivedSchema';
import { createEffects } from '../../common/effects';
import EvaluationList from '../../components/EvaluationList';
import EtProductInfo from '../../components/EtProductInfo';
import { normalizeFiledata } from '@/utils';
import { NormalizedEvaluateItem } from '../../utils';
import EvaluationForm from '../../components/EvaluationForm';
const intl = getIntl();
const formActions = createFormActions();
interface Unevaluated {
good: {
pic: string,
productName: string,
price: number,
purchaseCount: number,
unit: string,
totalPrice: number,
};
star: number;
comment: string;
picture: FileData[];
smile: number;
};
interface OrderInfo {
orderNo: string,
......@@ -46,7 +26,7 @@ interface OrderInfo {
const ReceivedDetail: React.FC = () => {
const { id } = usePageStatus();
const [orderInfo, setOrderInfo] = useState<OrderInfo>(null);
const [evaluationInfo, setEvaluationInfo] = useState<Unevaluated>(null);
const [evaluationInfo, setEvaluationInfo] = useState<NormalizedEvaluateItem[]>([]);
const [evaluationInfoLoading, setEvaluationInfoLoading] = useState(false);
const getEvaluationInfo = () => {
......@@ -58,20 +38,22 @@ const ReceivedDetail: React.FC = () => {
id,
}).then(res => {
if (res.code === 1000) {
setEvaluationInfo({
good: {
pic: res.data?.productImgUrl,
productName: res.data?.product,
price: res.data?.price,
purchaseCount: res.data?.purchaseCount,
unit: res.data?.unit,
totalPrice: res.data?.totalPrice,
},
star: res.data?.star,
comment: res.data?.comment,
picture: res.data?.pics ? res.data.pics.map(item => normalizeFiledata(item)) : [],
smile: res.data?.star,
});
setEvaluationInfo([
{
good: {
pic: res.data.productImgUrl,
productName: res.data.product,
unit: res.data.unit,
price: res.data.price,
purchaseCount: res.data.purchaseCount,
totalPrice: res.data.totalPrice,
},
star: res.data.star,
comment: res.data.comment,
picture: res.data.pics ? res.data.pics.map(item => normalizeFiledata(item)) : [],
smile: res.data.star,
}
]);
setOrderInfo({
orderNo: res.data?.orderNo,
dealTime: res.data?.dealTime as string,
......@@ -89,34 +71,6 @@ const ReceivedDetail: React.FC = () => {
getEvaluationInfo();
}, []);
const handleSubmit = values => {
};
const beforeUpload = file => {
if (file.size / 1024 / 1024 > 10) {
message.warning(intl.formatMessage({id: 'purchaserEvaluation.tupiandaxiaochaoguo10M'}));
return Upload.LIST_IGNORE;
}
return Promise.resolve();
};
const UploadTip = (
<span
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
wordBreak: 'break-all',
position: 'relative',
top: '34px',
}}
>
{intl.formatMessage({id: 'purchaserEvaluation.zhichiJPGPNGJPEG'})} <br />{intl.formatMessage({id: 'purchaserEvaluation.meizhangzuidabuchaoguo'})} <br />{intl.formatMessage({id: 'purchaserEvaluation.zuidashuliangxianzhi4'})}
</span>
);
return (
<Spin spinning={evaluationInfoLoading}>
<PageHeaderWrapper
......@@ -151,33 +105,12 @@ const ReceivedDetail: React.FC = () => {
</>
}
>
<MellowCard
bodyStyle={{
paddingBottom: 0,
<EvaluationForm
value={{
comments: evaluationInfo,
}}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: [evaluationInfo],
}}
editable={false}
expressionScope={{
UploadTip: null,
beforeUpload,
}}
onSubmit={handleSubmit}
components={{
EvaluationList,
EtProductInfo,
}}
effects={($, actions) => {
createEffects($, actions);
}}
schema={createSchema(false)}
/>
</MellowCard>
ediabled={false}
/>
</PageHeaderWrapper>
</Spin>
);
......
import React, { useState, useEffect } from 'react';
/**
* @Description 采购会员-发出的评价-详情组件
*/
import React, { useState, useEffect, useRef } from 'react';
import {
PageHeader,
Descriptions,
Spin,
Button,
message,
Upload,
} from 'antd';
import { FormOutlined } from '@ant-design/icons';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { getIntl, history } from 'umi';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { getMemberCommentConsumerSendTradeHistoryGet, postMemberCommentConsumerSendTradeHistoryUpdate } from '@/services/MemberV2Api';
import { normalizeFiledata, FileData } from '@/utils';
import MellowCard from '@/components/MellowCard';
import NiceForm from '@/components/NiceForm';
import { evaluateSchema } from '../../../common/schemas/evaluateSchema';
import { createEffects } from '../../../common/effects';
import EvaluationList from '../../../components/EvaluationList';
import EtProductInfo from '../../../components/EtProductInfo';
import { normalizeFiledata } from '@/utils';
import { NormalizedEvaluateItem } from '../../../utils';
import EvaluationForm, { EvaluationFormRefHandle, EvaluationFormValue } from '../../../components/EvaluationForm';
const formActions = createFormActions();
const {
onFormInit$,
} = FormEffectHooks;
interface Unevaluated {
good: {
pic: string,
productName: string,
price: number,
purchaseCount: number,
unit: string,
totalPrice: number,
};
star: number;
comment: string;
picture: FileData[];
smile: number;
};
const intl = getIntl();
interface OrderInfo {
orderNo: string,
......@@ -46,23 +24,29 @@ interface OrderInfo {
memberName: string,
};
interface DetailInfoProps {
orderId: string;
// 评论id
interface PurchaserEvaluationInfoProps {
/**
* 评论id
*/
id: string;
// 是否可编辑的
isEdit?: boolean;
/**
* 是否可编辑的
*/
ediabled?: boolean;
};
const intl = getIntl();
const DetailInfo: React.FC<DetailInfoProps> = ({
const PurchaserEvaluationInfo: React.FC<PurchaserEvaluationInfoProps> = ({
id,
isEdit = false,
ediabled = false,
}) => {
const [orderInfo, setOrderInfo] = useState<OrderInfo>(null);
const [evaluationInfo, setEvaluationInfo] = useState<Unevaluated>(null);
const [evaluationInfo, setEvaluationInfo] = useState<NormalizedEvaluateItem[]>([]);
const [evaluationInfoLoading, setEvaluationInfoLoading] = useState(false);
const [submitLoading, setSubmitLoading] = useState(false);
const EvaluationFormRef = useRef<EvaluationFormRefHandle | null>(null);
const getEvaluationInfo = () => {
if (!id) {
return;
......@@ -72,20 +56,22 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
id,
}).then(res => {
if (res.code === 1000) {
setEvaluationInfo({
good: {
pic: res.data?.productImgUrl,
productName: res.data?.product,
price: res.data?.price,
purchaseCount: res.data?.purchaseCount,
unit: res.data?.unit,
totalPrice: res.data?.totalPrice,
},
star: res.data?.star,
comment: res.data?.comment,
picture: res.data?.pics ? res.data.pics.map(item => normalizeFiledata(item)) : [],
smile: res.data?.star,
});
setEvaluationInfo([
{
good: {
pic: res.data.productImgUrl,
productName: res.data.product,
unit: res.data.unit,
price: res.data.price,
purchaseCount: res.data.purchaseCount,
totalPrice: res.data.totalPrice,
},
star: res.data.star,
comment: res.data.comment,
picture: res.data.pics ? res.data.pics.map(item => normalizeFiledata(item)) : [],
smile: res.data.star,
}
]);
setOrderInfo({
orderNo: res.data?.orderNo,
dealTime: res.data?.dealTime as string,
......@@ -103,9 +89,13 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
getEvaluationInfo();
}, []);
const handleSubmit = values => {
const handleRelease = () => {
EvaluationFormRef?.current.submit();
};
const handleSubmit = (value: EvaluationFormValue) => {
setSubmitLoading(true);
const payload = values.comments.map(item => {
const payload = value.comments.map(item => {
const {
comment,
picture,
......@@ -113,7 +103,7 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
} = item;
return {
id,
id: +id,
star,
comment,
pics: picture.map(item => item.status === 'done' && item.url).filter(Boolean),
......@@ -139,29 +129,6 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
});
};
const beforeUpload = file => {
if (file.size / 1024 / 1024 > 10) {
message.warning(intl.formatMessage({id: 'purchaserEvaluation.tupiandaxiaochaoguo10M'}));
return Upload.LIST_IGNORE;
}
return Promise.resolve();
};
const UploadTip = () => (
<div
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
wordBreak: 'break-all',
position: 'relative',
}}
>
{intl.formatMessage({id: 'purchaserEvaluation.zhichiJPGPNGJPEG'})} <br />{intl.formatMessage({id: 'purchaserEvaluation.meizhangzuidabuchaoguo'})} <br />{intl.formatMessage({id: 'purchaserEvaluation.zuidashuliangxianzhi4'})}
</div>
);
return (
<Spin spinning={evaluationInfoLoading}>
<PageHeaderWrapper
......@@ -177,15 +144,15 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
extra={(
<>
{
isEdit && (
ediabled && (
<Button
type="primary"
icon={<FormOutlined />}
disabled={!id}
loading={submitLoading}
onClick={() => formActions.submit()}
onClick={handleRelease}
>
{intl.formatMessage({id: 'purchaserEvaluation.xiugai'})}
{intl.formatMessage({ id: 'purchaserEvaluation.xiugai' })}
</Button>
)
}
......@@ -199,8 +166,8 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
padding: '0 32px',
}}
>
<Descriptions.Item label={intl.formatMessage({id: 'purchaserEvaluation.gongyinghuiyuan'})}>{orderInfo?.memberName}</Descriptions.Item>
<Descriptions.Item label={intl.formatMessage({id: 'purchaserEvaluation.xiadanshijian'})} span={2}>
<Descriptions.Item label={intl.formatMessage({ id: 'purchaserEvaluation.gongyinghuiyuan' })}>{orderInfo?.memberName}</Descriptions.Item>
<Descriptions.Item label={intl.formatMessage({ id: 'purchaserEvaluation.xiadanshijian' })} span={2}>
{orderInfo?.dealTime}
</Descriptions.Item>
</Descriptions>
......@@ -208,57 +175,17 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</>
}
>
<MellowCard
bodyStyle={{
paddingBottom: 0,
<EvaluationForm
value={{
comments: evaluationInfo,
}}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: [evaluationInfo],
}}
editable={isEdit}
expressionScope={{
beforeUpload,
}}
components={{
EvaluationList,
EtProductInfo,
UploadTip,
}}
onSubmit={handleSubmit}
effects={($, actions) => {
createEffects($, actions);
onFormInit$().subscribe(() => {
// 控制不同样式
if (!isEdit) {
// actions.setFieldState('comments.*.MEGA_LADYOUT_1', (fieldState) => {
// fieldState.props['x-component-props'] = {
// ...(fieldState.props['x-component-props'] || {}),
// labelCol: 6,
// };
// });
actions.setFieldState('comments.*.UPLOAD_TIP', (fieldState) => {
fieldState.visible = false;
});
// actions.setFieldState('comments.*.picture', (fieldState) => {
// fieldState.props['x-mega-props'] = {
// ...(fieldState.props['x-mega-props'] || {}),
// span: 3,
// };
// });
}
});
}}
schema={evaluateSchema}
/>
</MellowCard>
ref={EvaluationFormRef}
onSubmit={handleSubmit}
ediabled={ediabled}
/>
</PageHeaderWrapper>
</Spin>
);
};
export default DetailInfo;
export default PurchaserEvaluationInfo;
......@@ -2,15 +2,14 @@ import React from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import DetailInfo from './components/DetailInfo';
const SentDetail: React.FC = () => {
const { orderId, id } = usePageStatus();
const PurchaserEvaluationDetail: React.FC = () => {
const { id } = usePageStatus();
return (
<DetailInfo
orderId={orderId}
id={id}
/>
);
};
export default SentDetail;
\ No newline at end of file
export default PurchaserEvaluationDetail;
\ No newline at end of file
......@@ -2,16 +2,15 @@ import React from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import DetailInfo from './components/DetailInfo';
const SentEdit: React.FC = () => {
const { orderId, id } = usePageStatus();
const PurchaserEvaluationEdit: React.FC = () => {
const { id } = usePageStatus();
return (
<DetailInfo
orderId={orderId}
id={id}
isEdit
ediabled
/>
);
};
export default SentEdit;
\ No newline at end of file
export default PurchaserEvaluationEdit;
\ No newline at end of file
import React, { useState, useEffect } from 'react';
/**
* @Description 采购会员-待评价订单-评价
*/
import React, { useState, useEffect, useRef } from 'react';
import {
PageHeader,
Descriptions,
Spin,
Button,
message,
Upload,
} from 'antd';
import { FormOutlined } from '@ant-design/icons';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { getIntl, history, Prompt } from 'umi';
import moment from 'moment';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { usePageStatus } from '@/hooks/usePageStatus';
import { getMemberCommentConsumerOrderTradeDetail, GetMemberCommentConsumerOrderTradeDetailResponse, postMemberCommentConsumerOrderTradeSubmit } from '@/services/MemberV2Api';
import MellowCard from '@/components/MellowCard';
import NiceForm from '@/components/NiceForm';
import { normalizeUnevaluatedList } from '../../utils';
import { evaluateSchema } from '../../common/schemas/evaluateSchema';
import { createEffects } from '../../common/effects';
import EvaluationList from '../../components/EvaluationList';
import EtProductInfo from '../../components/EtProductInfo';
import { normalizeUnevaluatedList, NormalizedEvaluateItem } from '../../utils';
import EvaluationForm, { EvaluationFormRefHandle, EvaluationFormValue } from '../../components/EvaluationForm';
const intl = getIntl();
const formActions = createFormActions();
const {
onFormInputChange$,
} = FormEffectHooks;
interface Unevaluated {
good: {
pic: string,
name: string,
price: string,
desc: string,
};
star: number;
comment: string;
picture: string[];
smile: number;
};
interface OrderInfo extends GetMemberCommentConsumerOrderTradeDetailResponse {
unevaluatedList: Unevaluated[];
unevaluatedList: NormalizedEvaluateItem[];
};
const EvaluateOrder: React.FC = () => {
const PurchaserEvaluateOrder: React.FC = () => {
const { id } = usePageStatus();
const [orderInfo, setOrderInfo] = useState<OrderInfo>(null);
const [infoLoading, setInfoLoading] = useState(false);
const [submitLoading, setSubmitLoading] = useState(false);
const [unsaved, setUnsaved] = useState(false);
const EvaluationFormRef = useRef<EvaluationFormRefHandle | null>(null);
const getOrderInfo = () => {
if (!id) {
......@@ -68,13 +45,6 @@ const EvaluateOrder: React.FC = () => {
...res.data,
unevaluatedList,
});
unevaluatedList.forEach((item, index) => {
if (item.commentStatus) {
formActions.setFieldState(`comments.${index}.*`, (fieldState) => {
fieldState.editable = false;
});
}
});
}
}).finally(() => {
setInfoLoading(false);
......@@ -85,9 +55,13 @@ const EvaluateOrder: React.FC = () => {
getOrderInfo();
}, []);
const handleSubmit = values => {
const handleRelease = () => {
EvaluationFormRef?.current.submit();
};
const handleSubmit = (value: EvaluationFormValue) => {
setSubmitLoading(true);
const payload = values.comments.map(item => {
const payload = value.comments.map(item => {
const {
comment,
good,
......@@ -109,7 +83,6 @@ const EvaluateOrder: React.FC = () => {
commentSubmitDetailList: payload,
}).then(res => {
if (res.code === 1000) {
setUnsaved(false);
setTimeout(() => {
history.goBack();
}, 800);
......@@ -121,29 +94,6 @@ const EvaluateOrder: React.FC = () => {
});
};
const beforeUpload = file => {
if (file.size / 1024 / 1024 > 10) {
message.warning(intl.formatMessage({ id: 'purchaserEvaluation.tupiandaxiaochaoguo10M' }));
return Upload.LIST_IGNORE;
}
return Promise.resolve();
};
const UploadTip = () => (
<div
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
wordBreak: 'break-all',
position: 'relative',
}}
>
{intl.formatMessage({ id: 'purchaserEvaluation.tupiandaxiaochaoguo10M' })} <br />{intl.formatMessage({ id: 'purchaserEvaluation.meizhangzuidabuchaoguo' })} <br />{intl.formatMessage({ id: 'purchaserEvaluation.zuidashuliangxianzhi4' })}
</div>
);
return (
<Spin spinning={infoLoading}>
<PageHeaderWrapper
......@@ -163,7 +113,7 @@ const EvaluateOrder: React.FC = () => {
icon={<FormOutlined />}
disabled={!orderInfo}
loading={submitLoading}
onClick={() => formActions.submit()}
onClick={handleRelease}
>
{intl.formatMessage({ id: 'member.memberEvaluate.createEvaluate.index.release' })}
</Button>
......@@ -186,43 +136,17 @@ const EvaluateOrder: React.FC = () => {
</>
}
>
<MellowCard
bodyStyle={{
paddingBottom: 0,
<EvaluationForm
value={{
comments: orderInfo ? orderInfo.unevaluatedList : [],
}}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: orderInfo ? orderInfo.unevaluatedList : [],
}}
expressionScope={{
beforeUpload,
}}
onSubmit={handleSubmit}
components={{
EvaluationList,
EtProductInfo,
UploadTip,
}}
effects={($, actions) => {
createEffects($, actions);
onFormInputChange$().subscribe(() => {
if (!unsaved) {
setUnsaved(true);
}
});
}}
schema={evaluateSchema}
/>
</MellowCard>
ref={EvaluationFormRef}
onSubmit={handleSubmit}
ediabled
/>
</PageHeaderWrapper>
<Prompt when={unsaved} message="您还有未保存的内容,是否确定要离开?" />
</Spin>
);
};
export default EvaluateOrder;
export default PurchaserEvaluateOrder;
......@@ -5,10 +5,84 @@
* @LastEditTime: 2021-08-10 18:24:06
* @Description:
*/
import { normalizeFiledata } from '@/utils';
import { normalizeFiledata, FileData } from '@/utils';
import { EvaluationFormValue } from './components/EvaluationForm';
export type EvaluateItem = {
/**
* 订单商品明细id
*/
orderProductId: number
/**
* 商品Id(来自商品服务)
*/
productId: number
/**
* 商品skuId(来自商品服务)
*/
skuId: number
/**
* 商品(物料)编号
*/
productNo: string
/**
* 商品名称
*/
name: string
/**
* 商品品类
*/
category: string
/**
* 商品品牌
*/
brand: string
/**
* 报价商品规格
*/
spec: string
/**
* 计价单位
*/
unit: string
/**
* 商品Logo
*/
logo: string
/**
* 价格
*/
price: number
/**
* 采购数量
*/
quantity: number
/**
* 金额
*/
amount: number
/**
* 评价星级(1-5)
*/
star: number
/**
* 评价内容
*/
comment: string
/**
* 评价图片 ,String
*/
pics: string[]
/**
* 是否已评价0-否1-是
*/
commentStatus: number
}
export type NormalizedEvaluateItem = EvaluationFormValue['comments'][0] & {};
// 初始化待评价列表
export const normalizeUnevaluatedList = (arr: {[key: string]: any}[]) => {
export const normalizeUnevaluatedList = (arr: EvaluateItem[]): NormalizedEvaluateItem[] => {
const ret = [];
if (!Array.isArray(arr)) {
......@@ -18,18 +92,18 @@ export const normalizeUnevaluatedList = (arr: {[key: string]: any}[]) => {
// 未评价过的
const atom = {
good: {
pic: item.logo || '',
productId: item.productId,
productName: item.name,
unit: item.unit,
price: item.price,
pic: item.logo || '',
productId: item.productId,
productName: item.name,
unit: item.unit,
price: item.price,
purchaseCount: item.quantity, // 采购数量
totalPrice: item.amount,
orderProductId: item.orderProductId,
},
},
star: item.star || undefined, // 评分星星
comment: item.comment || undefined, // 评价
picture: item.pics ? item.pics.map((item) => normalizeFiledata(item)) : [],
picture: item.pics ? item.pics.map((item) => normalizeFiledata(item)) : [],
smile: item.star || undefined, // 笑脸
commentStatus: item.commentStatus,
};
......
......@@ -198,6 +198,7 @@ const Analysis: React.FC<AnalysisProps> = ({
target: item.byMemberName,
orderId: item.orderId,
dealTime: item.dealTime as string,
orderNo: item.orderNo,
};
}),
totalCount,
......@@ -404,6 +405,7 @@ const Analysis: React.FC<AnalysisProps> = ({
paginationType="button"
searchable={false}
onCheck={handleJumpReceived}
remark
/>
</Shelves>
</TabPane>
......
import React, { useState, useEffect } from 'react';
/**
* @Description 供应会员-收到的评价-详情组件
*/
import React, { useState, useEffect, useRef } from 'react';
import {
PageHeader,
Descriptions,
Spin,
message,
Upload,
} from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { getIntl, history } from 'umi';
import { createFormActions } from '@formily/antd';
import { usePageStatus } from '@/hooks/usePageStatus';
import { getMemberCommentSupplyReceiveTradeHistoryGet } from '@/services/MemberV2Api';
import { normalizeFiledata, FileData } from '@/utils';
import MellowCard from '@/components/MellowCard';
import NiceForm from '@/components/NiceForm';
import createSchema from '../../../purchaserEvaluation/common/schemas/receivedSchema';
import { createEffects } from '../../../purchaserEvaluation/common/effects';
import EvaluationList from '../../../purchaserEvaluation/components/EvaluationList';
import EtProductInfo from '../../../purchaserEvaluation/components/EtProductInfo';
import { normalizeFiledata } from '@/utils';
import { NormalizedEvaluateItem } from '../../../purchaserEvaluation/utils';
import EvaluationForm from '../../../purchaserEvaluation/components/EvaluationForm';
const formActions = createFormActions();
const intl = getIntl();
interface Unevaluated {
good: {
pic: string,
productName: string,
price: number,
purchaseCount: number,
unit: string,
totalPrice: number,
};
star: number;
comment: string;
picture: FileData[];
smile: number;
replyContent: string,
replyTime: string,
};
interface OrderInfo {
orderNo: string,
......@@ -44,10 +23,10 @@ interface OrderInfo {
memberName: string,
};
const ReceivedDetail: React.FC = () => {
const SupplierReceivedDetail: React.FC = () => {
const { id } = usePageStatus();
const [orderInfo, setOrderInfo] = useState<OrderInfo>(null);
const [evaluationInfo, setEvaluationInfo] = useState<Unevaluated>(null);
const [evaluationInfo, setEvaluationInfo] = useState<NormalizedEvaluateItem[]>([]);
const [evaluationInfoLoading, setEvaluationInfoLoading] = useState(false);
const getEvaluationInfo = () => {
......@@ -61,22 +40,24 @@ const ReceivedDetail: React.FC = () => {
if (res.code === 1000) {
const { product } = res.data;
setEvaluationInfo({
good: {
pic: res.data.productImgUrl,
productName: res.data.product,
price: res.data.price,
purchaseCount: res.data.purchaseCount,
unit: res.data.unit,
totalPrice: res.data.totalPrice,
},
star: res.data.star,
comment: res.data.comment,
picture: res.data.pics ? res.data.pics.map(item => normalizeFiledata(item)) : [],
smile: res.data.star,
replyContent: res.data.replyContent,
replyTime: res.data.replyTime as string,
});
setEvaluationInfo([
{
good: {
pic: res.data.productImgUrl,
productName: res.data.product,
unit: res.data.unit,
price: res.data.price,
purchaseCount: res.data.purchaseCount,
totalPrice: res.data.totalPrice,
},
star: res.data.star,
comment: res.data.comment,
picture: res.data.pics ? res.data.pics.map(item => normalizeFiledata(item)) : [],
smile: res.data.star,
replyContent: res.data.replyContent,
replyTime: res.data.replyTime as string,
}
]);
setOrderInfo({
orderNo: res.data.orderNo,
dealTime: res.data.dealTime as string,
......@@ -94,34 +75,6 @@ const ReceivedDetail: React.FC = () => {
getEvaluationInfo();
}, []);
const handleSubmit = values => {
};
const beforeUpload = file => {
if (file.size / 1024 / 1024 > 10) {
message.warning(intl.formatMessage({id: 'supplierEvaluation.tupiandaxiaochaoguo10M'}));
return Upload.LIST_IGNORE;
}
return Promise.resolve();
};
const UploadTip = (
<span
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
wordBreak: 'break-all',
position: 'relative',
top: '34px',
}}
>
{intl.formatMessage({id: 'supplierEvaluation.zhichiJPGPNGJPEG'})} <br />{intl.formatMessage({id: 'supplierEvaluation.meizhangzuidabuchaoguo'})} <br />{intl.formatMessage({id: 'supplierEvaluation.zuidashuliangxianzhi4'})}
</span>
);
return (
<Spin spinning={evaluationInfoLoading}>
<PageHeaderWrapper
......@@ -156,36 +109,16 @@ const ReceivedDetail: React.FC = () => {
</>
}
>
<MellowCard
bodyStyle={{
paddingBottom: 0,
<EvaluationForm
value={{
comments: evaluationInfo,
}}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: [evaluationInfo],
}}
editable={false}
expressionScope={{
UploadTip: null,
beforeUpload,
}}
onSubmit={handleSubmit}
components={{
EvaluationList,
EtProductInfo,
}}
effects={($, actions) => {
createEffects($, actions);
}}
schema={createSchema()}
/>
</MellowCard>
ediabled={false}
interpretation
/>
</PageHeaderWrapper>
</Spin>
);
};
export default ReceivedDetail;
export default SupplierReceivedDetail;
import React, { useState, useEffect } from 'react';
/**
* @Description 供应会员-发出的评价-详情组件
*/
import React, { useState, useEffect, useRef } from 'react';
import {
PageHeader,
Descriptions,
Spin,
Button,
message,
Upload,
} from 'antd';
import { FormOutlined } from '@ant-design/icons';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { getIntl, history } from 'umi';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { getMemberCommentSupplySendTradeHistoryGet, postMemberCommentSupplySendTradeHistoryUpdate } from '@/services/MemberV2Api';
import { normalizeFiledata, FileData } from '@/utils';
import MellowCard from '@/components/MellowCard';
import NiceForm from '@/components/NiceForm';
import { evaluateSchema } from '../../../../purchaserEvaluation/common/schemas/evaluateSchema';
import { createEffects } from '../../../../purchaserEvaluation/common/effects';
import EvaluationList from '../../../../purchaserEvaluation/components/EvaluationList';
import EtProductInfo from '../../../../purchaserEvaluation/components/EtProductInfo';
import { normalizeFiledata } from '@/utils';
import { NormalizedEvaluateItem } from '../../../../purchaserEvaluation/utils';
import EvaluationForm, { EvaluationFormRefHandle, EvaluationFormValue } from '../../../../purchaserEvaluation/components/EvaluationForm';
const formActions = createFormActions();
const {
onFormInit$,
} = FormEffectHooks;
const intl = getIntl();
interface Unevaluated {
good: {
pic: string,
productName: string,
price: number,
purchaseCount: number,
unit: string,
totalPrice: number,
};
star: number;
comment: string;
picture: FileData[];
smile: number;
};
interface OrderInfo {
orderNo: string,
dealTime: string,
memberName: string,
};
interface DetailInfoProps {
orderId: string;
// 评论id
interface SupplierEvaluationInfoProps {
/**
* 评论id
*/
id: string;
// 是否可编辑的
isEdit?: boolean;
/**
* 是否可编辑的
*/
ediabled?: boolean;
};
const DetailInfo: React.FC<DetailInfoProps> = ({
const SupplierEvaluationInfo: React.FC<SupplierEvaluationInfoProps> = ({
id,
isEdit = false,
ediabled = false,
}) => {
const [orderInfo, setOrderInfo] = useState<OrderInfo>(null);
const [evaluationInfo, setEvaluationInfo] = useState<Unevaluated>(null);
const [evaluationInfo, setEvaluationInfo] = useState<NormalizedEvaluateItem[]>([]);
const [evaluationInfoLoading, setEvaluationInfoLoading] = useState(false);
const [submitLoading, setSubmitLoading] = useState(false);
const EvaluationFormRef = useRef<EvaluationFormRefHandle | null>(null);
const getEvaluationInfo = () => {
if (!id) {
return;
......@@ -72,20 +54,22 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
id,
}).then(res => {
if (res.code === 1000) {
setEvaluationInfo({
good: {
pic: res.data.productImgUrl,
productName: res.data.product,
price: res.data.price,
purchaseCount: res.data.purchaseCount,
unit: res.data.unit,
totalPrice: res.data.totalPrice,
},
star: res.data.star,
comment: res.data.comment,
picture: res.data.pics ? res.data.pics.map(item => normalizeFiledata(item)) : [],
smile: res.data.star,
});
setEvaluationInfo([
{
good: {
pic: res.data.productImgUrl,
productName: res.data.product,
unit: res.data.unit,
price: res.data.price,
purchaseCount: res.data.purchaseCount,
totalPrice: res.data.totalPrice,
},
star: res.data.star,
comment: res.data.comment,
picture: res.data.pics ? res.data.pics.map(item => normalizeFiledata(item)) : [],
smile: res.data.star,
}
]);
setOrderInfo({
orderNo: res.data.orderNo,
dealTime: res.data.dealTime as string,
......@@ -103,9 +87,13 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
getEvaluationInfo();
}, []);
const handleSubmit = values => {
const handleRelease = () => {
EvaluationFormRef?.current.submit();
};
const handleSubmit = (value: EvaluationFormValue) => {
setSubmitLoading(true);
const payload = values.comments.map(item => {
const payload = value.comments.map(item => {
const {
comment,
picture,
......@@ -113,7 +101,7 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
} = item;
return {
id,
id: +id,
star,
comment,
pics: picture.map(item => item.status === 'done' && item.url).filter(Boolean),
......@@ -139,29 +127,6 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
});
};
const beforeUpload = file => {
if (file.size / 1024 / 1024 > 10) {
message.warning(intl.formatMessage({id: 'supplierEvaluation.tupiandaxiaochaoguo10M'}));
return Upload.LIST_IGNORE;
}
return Promise.resolve();
};
const UploadTip = () => (
<div
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
wordBreak: 'break-all',
position: 'relative',
}}
>
{intl.formatMessage({id: 'supplierEvaluation.zhichiJPGPNGJPEG'})} <br />{intl.formatMessage({id: 'supplierEvaluation.meizhangzuidabuchaoguo'})} <br />{intl.formatMessage({id: 'supplierEvaluation.zuidashuliangxianzhi4'})}
</div>
);
return (
<Spin spinning={evaluationInfoLoading}>
<PageHeaderWrapper
......@@ -177,13 +142,13 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
extra={(
<>
{
isEdit && (
ediabled && (
<Button
type="primary"
icon={<FormOutlined />}
disabled={!id}
loading={submitLoading}
onClick={() => formActions.submit()}
onClick={handleRelease}
>
{intl.formatMessage({id: 'supplierEvaluation.xiugai'})}
</Button>
......@@ -210,57 +175,17 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</>
}
>
<MellowCard
bodyStyle={{
paddingBottom: 0,
<EvaluationForm
value={{
comments: evaluationInfo,
}}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: [evaluationInfo],
}}
editable={isEdit}
expressionScope={{
beforeUpload,
}}
components={{
EvaluationList,
EtProductInfo,
UploadTip,
}}
onSubmit={handleSubmit}
effects={($, actions) => {
createEffects($, actions);
onFormInit$().subscribe(() => {
// 控制不同样式
if (!isEdit) {
// actions.setFieldState('comments.*.MEGA_LADYOUT_1', (fieldState) => {
// fieldState.props['x-component-props'] = {
// ...(fieldState.props['x-component-props'] || {}),
// labelCol: 6,
// };
// });
actions.setFieldState('comments.*.UPLOAD_TIP', (fieldState) => {
fieldState.visible = false;
});
// actions.setFieldState('comments.*.picture', (fieldState) => {
// fieldState.props['x-mega-props'] = {
// ...(fieldState.props['x-mega-props'] || {}),
// span: 3,
// };
// });
}
});
}}
schema={evaluateSchema}
/>
</MellowCard>
ref={EvaluationFormRef}
onSubmit={handleSubmit}
ediabled={ediabled}
/>
</PageHeaderWrapper>
</Spin>
);
};
export default DetailInfo;
export default SupplierEvaluationInfo;
/**
* @Description 供应会员-发出的评价-详情
*/
import React from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import DetailInfo from './components/DetailInfo';
const SentDetail: React.FC = () => {
const { orderId, id } = usePageStatus();
const SupplierEvaluationDetail: React.FC = () => {
const { id } = usePageStatus();
return (
<DetailInfo
orderId={orderId}
id={id}
/>
);
};
export default SentDetail;
\ No newline at end of file
export default SupplierEvaluationDetail;
\ No newline at end of file
/**
* @Description 供应会员-发出的评价-修改详情
*/
import React from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import DetailInfo from './components/DetailInfo';
const SentEdit: React.FC = () => {
const { orderId, id } = usePageStatus();
const SupplierEvaluationEdit: React.FC = () => {
const { id } = usePageStatus();
return (
<DetailInfo
orderId={orderId}
id={id}
isEdit
ediabled
/>
);
};
export default SentEdit;
\ No newline at end of file
export default SupplierEvaluationEdit;
\ No newline at end of file
import React, { useState, useEffect } from 'react';
/**
* @Description 供应会员-待评价订单-评价
*/
import React, { useState, useEffect, useRef } from 'react';
import {
PageHeader,
Descriptions,
Spin,
Button,
message,
Upload,
} from 'antd';
import { FormOutlined } from '@ant-design/icons';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { getIntl, history, Prompt } from 'umi';
import moment from 'moment';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { getIntl, history } from 'umi';
import { usePageStatus } from '@/hooks/usePageStatus';
import { getMemberCommentSupplyOrderTradeDetail, GetMemberCommentSupplyOrderTradeDetailResponse, postMemberCommentSupplyOrderTradeSubmit } from '@/services/MemberV2Api';
import MellowCard from '@/components/MellowCard';
import NiceForm from '@/components/NiceForm';
import { normalizeUnevaluatedList } from '../../../purchaserEvaluation/utils';
import { evaluateSchema } from '../../../purchaserEvaluation/common/schemas/evaluateSchema';
import { createEffects } from '../../../purchaserEvaluation/common/effects';
import EvaluationList from '../../../purchaserEvaluation/components/EvaluationList';
import EtProductInfo from '../../../purchaserEvaluation/components/EtProductInfo';
// import EvaluationForm from '../../../purchaserEvaluation/components/EvaluationForm';
import { normalizeUnevaluatedList, NormalizedEvaluateItem } from '../../../purchaserEvaluation/utils';
import EvaluationForm, { EvaluationFormRefHandle, EvaluationFormValue } from '../../../purchaserEvaluation/components/EvaluationForm';
const formActions = createFormActions();
const {
onFormInputChange$,
} = FormEffectHooks;
const intl = getIntl();
interface Unevaluated {
good: {
pic: string,
name: string,
price: string,
desc: string,
};
star: number;
comment: string;
picture: string[];
smile: number;
};
interface OrderInfo extends GetMemberCommentSupplyOrderTradeDetailResponse {
unevaluatedList: Unevaluated[];
unevaluatedList: NormalizedEvaluateItem[];
};
const EvaluateOrder: React.FC = () => {
const SupplierEvaluateOrder: React.FC = () => {
const { id } = usePageStatus();
const [orderInfo, setOrderInfo] = useState<OrderInfo>(null);
const [infoLoading, setInfoLoading] = useState(false);
const [submitLoading, setSubmitLoading] = useState(false);
const [unsaved, setUnsaved] = useState(false);
const EvaluationFormRef = useRef<EvaluationFormRefHandle | null>(null);
const getOrderInfo = () => {
if (!id) {
......@@ -67,13 +44,6 @@ const EvaluateOrder: React.FC = () => {
...res.data,
unevaluatedList,
});
unevaluatedList.forEach((item, index) => {
if (item.commentStatus) {
formActions.setFieldState(`comments.${index}.*`, (fieldState) => {
fieldState.editable = false;
});
}
});
}
}).finally(() => {
setInfoLoading(false);
......@@ -84,9 +54,13 @@ const EvaluateOrder: React.FC = () => {
getOrderInfo();
}, []);
const handleSubmit = values => {
const handleRelease = () => {
EvaluationFormRef?.current.submit();
};
const handleSubmit = (value: EvaluationFormValue) => {
setSubmitLoading(true);
const payload = values.comments.map(item => {
const payload = value.comments.map(item => {
const {
comment,
good,
......@@ -108,7 +82,6 @@ const EvaluateOrder: React.FC = () => {
commentSubmitDetailList: payload,
}).then(res => {
if (res.code === 1000) {
setUnsaved(false);
setTimeout(() => {
history.goBack();
}, 800);
......@@ -120,29 +93,6 @@ const EvaluateOrder: React.FC = () => {
});
};
const beforeUpload = file => {
if (file.size / 1024 / 1024 > 10) {
message.warning(intl.formatMessage({id: 'supplierEvaluation.tupiandaxiaochaoguo10M'}));
return Upload.LIST_IGNORE;
}
return Promise.resolve();
};
const UploadTip = () => (
<div
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
wordBreak: 'break-all',
position: 'relative',
}}
>
{intl.formatMessage({id: 'supplierEvaluation.zhichiJPGPNGJPEG'})} <br />{intl.formatMessage({id: 'supplierEvaluation.meizhangzuidabuchaoguo'})} <br />{intl.formatMessage({id: 'supplierEvaluation.zuidashuliangxianzhi4'})}
</div>
);
return (
<Spin spinning={infoLoading}>
<PageHeaderWrapper
......@@ -162,7 +112,7 @@ const EvaluateOrder: React.FC = () => {
icon={<FormOutlined />}
disabled={!orderInfo}
loading={submitLoading}
onClick={() => formActions.submit()}
onClick={handleRelease}
>
{intl.formatMessage({id: 'supplierEvaluation.fabu'})}
</Button>
......@@ -185,44 +135,17 @@ const EvaluateOrder: React.FC = () => {
</>
}
>
{/* <EvaluationForm ediabled /> */}
<MellowCard
bodyStyle={{
paddingBottom: 0,
<EvaluationForm
value={{
comments: orderInfo ? orderInfo.unevaluatedList : [],
}}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: orderInfo ? orderInfo.unevaluatedList : [],
}}
expressionScope={{
beforeUpload,
}}
onSubmit={handleSubmit}
components={{
EvaluationList,
EtProductInfo,
UploadTip,
}}
effects={($, actions) => {
createEffects($, actions);
onFormInputChange$().subscribe(() => {
if (!unsaved) {
setUnsaved(true);
}
});
}}
schema={evaluateSchema}
/>
</MellowCard>
ref={EvaluationFormRef}
onSubmit={handleSubmit}
ediabled
/>
</PageHeaderWrapper>
<Prompt when={unsaved} message={intl.formatMessage({id: 'supplierEvaluation.ninhaiyouweibaocunde'})} />
</Spin>
);
};
export default EvaluateOrder;
export default SupplierEvaluateOrder;
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