Skip to content

J
jinfa-platform
Commit 82bb9811 authored by XieZhiXiong's avatar XieZhiXiong
Browse files
Options

feat: 跟进UI调整布局

parent c4da5f68
Hide whitespace changes
Inline Side-by-side
Showing with 726 additions and 563 deletions
src/pages/transaction/purchaserEvaluation/common/schemas/evaluateSchema.tsx
View file @ 82bb9811
......@@ -19,96 +19,104 @@ export const evaluateSchema: ISchema = {
items: {
type: 'object',
properties: {
LEFT_RIGHT: {
MEGA_LADYOUT: {
type: 'object',
'x-component': 'LeftRightLayout',
'x-component': 'Mega-Layout',
'x-component-props': {
rightProps: {
span: 2,
offset: 4,
},
labelAlign: 'top',
},
properties: {
MEGA_LADYOUT: {
MEGA_LADYOUT_PRODUCT: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
labelCol: 6,
labelAlign: 'left',
position: 'left',
grid: true,
full: true,
},
properties: {
star: {
title: intl.formatMessage({id: 'purchaserEvaluation.manyichengdu'}),
'x-component': 'Rating',
'x-component-props': {
allowHalf: false,
allowClear: false,
},
},
comment: {
good: {
type: 'string',
title: intl.formatMessage({id: 'purchaserEvaluation.pingjia'}),
'x-component': 'TextArea',
'x-component-props': {
rows: 4,
},
'x-rules': {
max: 200,
'x-component': 'EtProductInfo',
'x-mega-props': {
span: 2,
},
},
MEGA_LADYOUT_1: {
type: 'object',
'x-component': 'Mega-Layout',
smile: {
type: 'string',
'x-component': 'SmilingFace',
'x-component-props': {
labelCol: 9,
labelAlign: 'left',
grid: true,
full: true,
autoRow: true,
},
properties: {
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',
},
'x-rules': [
{
max: 4,
message: intl.formatMessage({id: 'purchaserEvaluation.zuiduokeshangchuan4zhangtu'}),
},
],
},
UPLOAD_TIP: {
type: 'object',
'x-mega-props': {
span: 1,
grid: false,
},
'x-component': 'UploadTip',
style: {
flex: 1,
textAlign: 'right',
},
},
},
},
},
smile: {
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': 'SmilingFace',
'x-component': 'Mega-Layout',
'x-component-props': {
position: 'right',
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',
},
},
},
},
......
src/pages/transaction/purchaserEvaluation/common/schemas/receivedSchema.tsx
View file @ 82bb9811
......@@ -24,87 +24,97 @@ const createSchema = (showExplain = true): ISchema => ({
items: {
type: 'object',
properties: {
LEFT_RIGHT: {
MEGA_LADYOUT: {
type: 'object',
'x-component': 'LeftRightLayout',
'x-component': 'Mega-Layout',
'x-component-props': {
rightProps: {
span: 2,
offset: 4,
},
labelAlign: 'top',
},
properties: {
MEGA_LADYOUT: {
MEGA_LADYOUT_PRODUCT: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
labelCol: 6,
labelAlign: 'left',
position: 'left',
grid: true,
full: true,
},
properties: {
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: 4,
},
'x-rules': {
max: 200,
},
},
picture: {
good: {
type: 'string',
title: intl.formatMessage({id: 'purchaserEvaluation.tupian'}),
'x-component': 'FixUpload',
'x-component': 'EtProductInfo',
'x-mega-props': {
span: 2,
},
},
smile: {
type: 'string',
'x-component': 'SmilingFace',
'x-component-props': {
listType: 'card',
action: '/api/file/file/upload/prefix',
data: {
fileType: UPLOAD_TYPE,
prefix: '',
style: {
flex: 1,
textAlign: 'right',
},
beforeUpload: '{{beforeUpload}}',
accept: '.png, .jpg, .jpeg',
},
'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'}),
},
} : {}),
},
},
smile: {
type: 'object',
'x-component': 'SmilingFace',
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': {
position: 'right',
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'}),
},
} : {}),
},
},
},
......
src/pages/transaction/purchaserEvaluation/components/EtProductInfo/index.less 0 → 100644
View file @ 82bb9811
.et-product {
display: flex;
align-items: center;
line-height: 1.5715;
&-left {
flex-shrink: 0;
margin-right: 16px;
width: 48px;
height: 48px;
border-radius: 4px;
overflow: hidden;
> img {
width: 100%;
height: 100%;
object-fit: cover;
}
}
&-right {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
}
&-title {
line-height: 14px;
margin-bottom: 8px;
font-size: 14px;
font-weight: 400;
color: #303133;
}
&-desc {
line-height: 12px;
margin-left: 16px;
font-size: 12px;
font-weight: 400;
color: #909399;
}
&-price {
font-size: 14px;
font-weight: 500;
color: #303133;
}
}
\ No newline at end of file
src/pages/transaction/purchaserEvaluation/components/EtProductInfo/index.tsx 0 → 100644
View file @ 82bb9811
/**
* @Description 评价商品信息
*/
import React from 'react';
import styles from './index.less';
type EtProductInfoType = {
/**
* 订单商品记录id
*/
orderProductId: number,
/**
* 商品图片
*/
pic: string,
/**
* 价格
*/
price: number,
/**
* 商品id
*/
productId: number,
/**
* 商品名称
*/
productName: string,
/**
* 购买数量
*/
purchaseCount: number,
/**
* 总计
*/
totalPrice: number,
/**
* 单位
*/
unit: string,
}
interface EtProductInfoProps {
/**
* 值
*/
value: EtProductInfoType,
}
const EtProductInfo = (props: EtProductInfoProps) => {
const { value } = props;
return (
<div className={styles['et-product']}>
<div className={styles['et-product-left']}>
<img src={value.pic || ''} />
</div>
<div className={styles['et-product-right']}>
<div className={styles['et-product-title']}>{value.productName}</div>
<div className={styles['et-product-price']}>
{`¥ ${value.totalPrice}`}
<span className={styles['et-product-desc']}>
{`¥ ${value.price}/${value.unit || ''}，`}
共 {value.purchaseCount || ''}
{value.unit || ''}
</span>
</div>
</div>
</div>
);
};
EtProductInfo.isFieldComponent = true;
export default EtProductInfo;
\ No newline at end of file
src/pages/transaction/purchaserEvaluation/components/EvaluationForm/index.tsx 0 → 100644
View file @ 82bb9811
/**
* @Description 评价表单
*/
import React from 'react';
import { Row, Col, message } from 'antd';
import {
createFormActions,
Form,
FormEffectHooks,
FormItem,
ISchemaFormActions,
SchemaForm,
SchemaField,
SchemaMarkupField as Field,
FormSlot,
} from '@formily/antd';
import { Input, ArrayTable } from '@formily/antd-components';
import { ArrayList } from '@formily/react-shared-components';
import { toArr, isFn, FormPath } from '@formily/shared';
import MellowCard from '@/components/MellowCard';
import SmilingFace from '@/components/NiceForm/components/SmilingFace';
import EtProductInfo from '../EtProductInfo';
const ArrayComponents = {
CircleButton: () => null,
TextButton: () => null,
AdditionIcon: () => null,
RemoveIcon: () => null,
MoveDownIcon: () => null,
MoveUpIcon: () => null,
};
const ArrayCustom = props => {
console.log('props', props)
const {
value,
editable,
renderAddition,
renderRemove,
renderMoveDown,
renderMoveUp,
renderEmpty,
children,
} = props;
console.log('children', children)
return (
<ArrayList
value={value}
editable={editable}
components={ArrayComponents}
renders={{
renderAddition,
renderRemove,
renderMoveDown,
renderMoveUp,
renderEmpty // 允许开发者覆盖默认
}}
>
{toArr(value).map((item, index) => (
<div key={index}>
<FormItem name="username" x-component={Input} title="用户名" />
<FormItem name="age" x-component={Input} title="年龄" />
</div>
))}
</ArrayList>
)
};
ArrayCustom.isFieldComponent = true;
type EvaluationFormValue = {
}
interface EvaluationFormProps {
/**
* 是否可编辑
*/
ediabled: boolean,
/**
* 表单值
*/
value?: any,
}
const EvaluationForm: React.FC<EvaluationFormProps> = (props: EvaluationFormProps) => {
const { ediabled } = props;
return (
<MellowCard>
<Form
// components={{
// ArrayCustom,
// EtProductInfo,
// SmilingFace,
// Input,
// }}
value={{
userList: [
{
username:
'morally',
age: 20,
good: {
orderProductId: 5869,
pic: "https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/QQ截图20180529111140cde1d92dc3e847bbad66a2347619c809.png",
price: 20,
productId: 957,
productName: "副单位商品-有阶梯+无阶梯",
purchaseCount: 2,
totalPrice: 40,
unit: "台",
},
smile: 4,
},
{
username: 'joe',
age: 21,
good: {
orderProductId: 5869,
pic: "https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/QQ截图20180529111140cde1d92dc3e847bbad66a2347619c809.png",
price: 20,
productId: 957,
productName: "副单位商品-有阶梯+无阶梯",
purchaseCount: 2,
totalPrice: 40,
unit: "台",
},
smile: 3,
}
]
}}
>
<FormItem
type="array"
name="userList"
component={ArrayCustom}
children={(
<>
<FormItem name="username" x-component={Input} title="用户名" />
<FormItem name="age" x-component={Input} title="年龄" />
</>
)}
/>
{/* <Field
name="userList"
type="array"
default={[
{
username:
'morally',
age: 20,
good: {
orderProductId: 5869,
pic: "https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/QQ截图20180529111140cde1d92dc3e847bbad66a2347619c809.png",
price: 20,
productId: 957,
productName: "副单位商品-有阶梯+无阶梯",
purchaseCount: 2,
totalPrice: 40,
unit: "台",
},
smile: 4,
},
{
username: 'joe',
age: 21,
good: {
orderProductId: 5869,
pic: "https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/QQ截图20180529111140cde1d92dc3e847bbad66a2347619c809.png",
price: 20,
productId: 957,
productName: "副单位商品-有阶梯+无阶梯",
purchaseCount: 2,
totalPrice: 40,
unit: "台",
},
smile: 3,
}
]}
x-component="ArrayCustom"
>
<Field type="object">
<Row style={{ backgroundColor: 'red' }} gutter={24}>
<Col flex={1}>
<Field name="good" x-component="EtProductInfo" />
</Col>
<Col>
<Field name="smile" x-component="SmilingFace" />
</Col>
</Row>
<Field name="username" x-component="Input" title="用户名" />
<Field name="age" x-component="Input" title="年龄" />
</Field>
</Field> */}
</Form>
</MellowCard>
);
};
export default EvaluationForm;
src/pages/transaction/purchaserEvaluation/components/EvaluationList/index.tsx
View file @ 82bb9811
import React from 'react';
import {
Row,
Col,
Button,
} from 'antd';
import styled from 'styled-components';
import {
SchemaForm,
SchemaField,
SchemaMarkupField as Field
} from '@formily/antd';
import { ArrayList } from '@formily/react-shared-components';
import { toArr, isFn, FormPath } from '@formily/shared';
import SmilingFace from '@/components/NiceForm/components/SmilingFace';
import { toArr, FormPath } from '@formily/shared';
const ArrayComponents = {
CircleButton: props => <Button {...props} />,
TextButton: props => <Button text {...props} />,
AdditionIcon: () => <div>+Add</div>,
RemoveIcon: () => <div>Remove</div>,
MoveDownIcon: () => <div>Down</div>,
MoveUpIcon: () => <div>Up</div>
CircleButton: () => null,
TextButton: () => null,
AdditionIcon: () => null,
RemoveIcon: () => null,
MoveDownIcon: () => null,
MoveUpIcon: () => null,
};
const RowStyleLayout = styled(props => <div {...props} />)`
padding: 24px 64px 24px 24px;
background: #ffffff;
.ant-btn {
margin-right: 16px;
}
.ant-form-item {
display: flex;
margin-right: 16px;
margin-bottom: 16px;
}
> .ant-form-item {
margin-bottom: 0;
margin-right: 0;
}
.goodInfo {
display: flex;
align-items: align;
&-left {
flex-shrink: 0;
margin-right: 16px;
width: 100px;
height: 100px;
> img {
width: 100%;
height: 100%;
object-fit: cover;
}
}
&-right {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
}
&-title {
line-height: 14px;
margin-bottom: 18px;
font-size: 12px;
font-weight: 400;
color: #303133;
}
&-desc {
line-height: 12px;
margin-bottom: 16px;
font-size: 12px;
font-weight: 400;
color: #909399;
}
&-price {
line-height: 14px;
font-size: 12px;
font-weight: 500;
color: #303133;
}
}
.main {
position: relative;
padding-left: 24px;
> .ant-form-item {
margin-bottom: 0;
margin-right: 0;
}
::after {
content: ' ';
display: block;
position: absolute;
top: 6%;
left: 0;
bottom: 6%;
border-left: 1px dashed #EEF0F3;
}
}
`;
const EvaluationList = props => {
const { value, schema, className, editable, path, mutators } = props;
const {
......@@ -133,30 +36,7 @@ const EvaluationList = props => {
>
{toArr(value).map((item, index) => {
return (
<RowStyleLayout {...componentProps} key={index}>
<Row align="middle" gutter={24}>
<Col span={8}>
<div className="goodInfo">
<div className="goodInfo-left">
<img src={item.good ? item.good.pic : ''} />
</div>
<div className="goodInfo-right">
<div className="goodInfo-title">{item.good.productName}</div>
<div className="goodInfo-desc">
X {item.good.purchaseCount || ''}
{item.good.unit || ''}
</div>
<div className="goodInfo-price">{`¥ ${item.good.price}`}</div>
</div>
</div>
</Col>
<Col span={16}>
<div className="main">
<SchemaField path={FormPath.parse(path).concat(index)} />
</div>
</Col>
</Row>
</RowStyleLayout>
<SchemaField key={index} path={FormPath.parse(path).concat(index)} />
)
})}
</ArrayList>
......
src/pages/transaction/purchaserEvaluation/components/RecordList/index.less
View file @ 82bb9811
@import '../../../../../global/styles/utils.less';
.record {
padding: 0;
margin: 0;
&-header {
background: #FAFBFC;
}
&-item {
padding: 14px 16px;
line-height: 14px;
display: flex;
align-items: center;
// background: #FAFBFC;
color: #303133;
&-good {
&-name {
line-height: 14px;
margin-bottom: 13px;
font-size: 12px;
font-weight: 400;
}
&-price {
margin-right: 16px;
font-weight: 500;
}
&-desc {
line-height: 12px;
font-weight: 400;
color: #909399;
}
}
&-extra {
&-item {
display: flex;
align-items: center;
&-label {
flex: 0 0 60px;
line-height: 12px;
font-size: 12px;
font-weight: 400;
color: #909399;
}
&-control {
flex: 1;
}
&:not(:last-child) {
margin-bottom: 13px;
}
}
}
&-comment {
&-main {
margin-top: 6px;
line-height: 14px;
font-weight: 400;
color: #303133;
.textOverflow();
}
}
&-header {
background: #FAFBFC;
}
&-actions {
flex: 1;
text-align: center;
}
&:not(:last-child) {
// margin-bottom: 16px;
border-bottom: 1px solid #EDEEEF;
}
}
}
src/pages/transaction/purchaserEvaluation/components/RecordList/index.tsx
View file @ 82bb9811
......@@ -4,14 +4,12 @@ import { createFormActions, FormEffectHooks } from '@formily/antd';
import { getIntl } from 'umi';
import moment from 'moment';
import { QuestionCircleOutlined } from '@ant-design/icons';
import cx from 'classnames'
import { postMemberCommentSupplyReceiveShowEvaluationUpdate } from '@/services/MemberV2Api';
import { checkMore } from '@/utils';
import NiceForm from '@/components/NiceForm';
import PolymericTable from '@/components/PolymericTable';
import { EditableColumns } from '@/components/PolymericTable/interface';
import { searchSchema } from './schema';
import styles from './index.less';
const intl = getIntl();
......
src/pages/transaction/purchaserEvaluation/received/detail/index.tsx
View file @ 82bb9811
......@@ -12,11 +12,13 @@ import { createFormActions } from '@formily/antd';
import { usePageStatus } from '@/hooks/usePageStatus';
import { getMemberCommentConsumerReceiveTradeHistoryGet } from '@/services/MemberV2Api';
import { normalizeFiledata, FileData } from '@/utils';
import AvatarWrap from '@/components/AvatarWrap';
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';
const intl = getIntl();
const formActions = createFormActions();
......@@ -27,6 +29,7 @@ interface Unevaluated {
price: number,
purchaseCount: number,
unit: string,
totalPrice: number,
};
star: number;
comment: string;
......@@ -62,6 +65,7 @@ const ReceivedDetail: React.FC = () => {
price: res.data?.price,
purchaseCount: res.data?.purchaseCount,
unit: res.data?.unit,
totalPrice: res.data?.totalPrice,
},
star: res.data?.star,
comment: res.data?.comment,
......@@ -100,6 +104,7 @@ const ReceivedDetail: React.FC = () => {
const UploadTip = (
<span
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
......@@ -123,14 +128,7 @@ const ReceivedDetail: React.FC = () => {
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
aloneTxt: intl.formatMessage({id: 'purchaserEvaluation.dan'}),
name: orderInfo?.orderNo,
}}
/>
}
title={orderInfo?.orderNo}
extra={(
<>
......@@ -153,26 +151,33 @@ const ReceivedDetail: React.FC = () => {
</>
}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: [evaluationInfo],
}}
editable={false}
expressionScope={{
UploadTip: null,
beforeUpload,
}}
onSubmit={handleSubmit}
components={{
EvaluationList,
}}
effects={($, actions) => {
createEffects($, actions);
<MellowCard
bodyStyle={{
paddingBottom: 0,
}}
schema={createSchema(false)}
/>
>
<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>
</PageHeaderWrapper>
</Spin>
);
......
src/pages/transaction/purchaserEvaluation/sent/components/DetailInfo/index.tsx
View file @ 82bb9811
......@@ -13,11 +13,12 @@ import { getIntl, history } from 'umi';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { getMemberCommentConsumerSendTradeHistoryGet, postMemberCommentConsumerSendTradeHistoryUpdate } from '@/services/MemberV2Api';
import { normalizeFiledata, FileData } from '@/utils';
import AvatarWrap from '@/components/AvatarWrap';
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';
const formActions = createFormActions();
const {
......@@ -31,6 +32,7 @@ interface Unevaluated {
price: number,
purchaseCount: number,
unit: string,
totalPrice: number,
};
star: number;
comment: string;
......@@ -77,6 +79,7 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
price: res.data?.price,
purchaseCount: res.data?.purchaseCount,
unit: res.data?.unit,
totalPrice: res.data?.totalPrice,
},
star: res.data?.star,
comment: res.data?.comment,
......@@ -147,6 +150,7 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
const UploadTip = () => (
<div
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
......@@ -169,14 +173,7 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
aloneTxt: intl.formatMessage({id: 'purchaserEvaluation.dan'}),
name: orderInfo?.orderNo,
}}
/>
}
title={orderInfo?.orderNo}
extra={(
<>
{
......@@ -211,47 +208,54 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</>
}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: [evaluationInfo],
<MellowCard
bodyStyle={{
paddingBottom: 0,
}}
editable={isEdit}
expressionScope={{
beforeUpload,
}}
components={{
EvaluationList,
UploadTip,
}}
onSubmit={handleSubmit}
effects={($, actions) => {
createEffects($, actions);
>
<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}
/>
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>
</PageHeaderWrapper>
</Spin>
);
......
src/pages/transaction/purchaserEvaluation/unevaluated/evaluate/index.tsx
View file @ 82bb9811
......@@ -14,14 +14,17 @@ import moment from 'moment';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { usePageStatus } from '@/hooks/usePageStatus';
import { getMemberCommentConsumerOrderTradeDetail, GetMemberCommentConsumerOrderTradeDetailResponse, postMemberCommentConsumerOrderTradeSubmit } from '@/services/MemberV2Api';
import AvatarWrap from '@/components/AvatarWrap';
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';
const intl = getIntl();
const formActions = createFormActions();
const {
onFormInputChange$,
} = FormEffectHooks;
......@@ -129,6 +132,7 @@ const EvaluateOrder: React.FC = () => {
const UploadTip = () => (
<div
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
......@@ -151,14 +155,7 @@ const EvaluateOrder: React.FC = () => {
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
aloneTxt: intl.formatMessage({ id: 'purchaserEvaluation.dan' }),
name: orderInfo?.orderNo,
}}
/>
}
title={orderInfo?.orderNo}
extra={(
<>
<Button
......@@ -181,7 +178,7 @@ const EvaluateOrder: React.FC = () => {
}}
>
<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.xiadanshijian' })} span={2}>
{orderInfo?.createTime}
</Descriptions.Item>
</Descriptions>
......@@ -189,31 +186,38 @@ const EvaluateOrder: React.FC = () => {
</>
}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: orderInfo ? orderInfo.unevaluatedList : [],
}}
expressionScope={{
beforeUpload,
<MellowCard
bodyStyle={{
paddingBottom: 0,
}}
onSubmit={handleSubmit}
components={{
EvaluationList,
UploadTip,
}}
effects={($, actions) => {
createEffects($, actions);
>
<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}
/>
onFormInputChange$().subscribe(() => {
if (!unsaved) {
setUnsaved(true);
}
});
}}
schema={evaluateSchema}
/>
</MellowCard>
</PageHeaderWrapper>
<Prompt when={unsaved} message="您还有未保存的内容，是否确定要离开？" />
......
src/pages/transaction/supplierEvaluation/received/detail/index.tsx
View file @ 82bb9811
......@@ -12,11 +12,12 @@ import { createFormActions } from '@formily/antd';
import { usePageStatus } from '@/hooks/usePageStatus';
import { getMemberCommentSupplyReceiveTradeHistoryGet } from '@/services/MemberV2Api';
import { normalizeFiledata, FileData } from '@/utils';
import AvatarWrap from '@/components/AvatarWrap';
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';
const formActions = createFormActions();
const intl = getIntl();
......@@ -27,6 +28,7 @@ interface Unevaluated {
price: number,
purchaseCount: number,
unit: string,
totalPrice: number,
};
star: number;
comment: string;
......@@ -66,13 +68,14 @@ const ReceivedDetail: React.FC = () => {
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,
replyTime: res.data.replyTime as string,
});
setOrderInfo({
orderNo: res.data.orderNo,
......@@ -106,6 +109,7 @@ const ReceivedDetail: React.FC = () => {
const UploadTip = (
<span
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
......@@ -129,14 +133,7 @@ const ReceivedDetail: React.FC = () => {
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
aloneTxt: intl.formatMessage({id: 'supplierEvaluation.dan'}),
name: orderInfo?.orderNo,
}}
/>
}
title={orderInfo?.orderNo}
extra={(
<>
......@@ -159,26 +156,33 @@ const ReceivedDetail: React.FC = () => {
</>
}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: [evaluationInfo],
<MellowCard
bodyStyle={{
paddingBottom: 0,
}}
editable={false}
expressionScope={{
UploadTip: null,
beforeUpload,
}}
onSubmit={handleSubmit}
components={{
EvaluationList,
}}
effects={($, actions) => {
createEffects($, actions);
}}
schema={createSchema()}
/>
>
<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>
</PageHeaderWrapper>
</Spin>
);
......
src/pages/transaction/supplierEvaluation/sent/components/DetailInfo/index.tsx
View file @ 82bb9811
......@@ -13,11 +13,12 @@ import { getIntl, history } from 'umi';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { getMemberCommentSupplySendTradeHistoryGet, postMemberCommentSupplySendTradeHistoryUpdate } from '@/services/MemberV2Api';
import { normalizeFiledata, FileData } from '@/utils';
import AvatarWrap from '@/components/AvatarWrap';
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';
const formActions = createFormActions();
const {
......@@ -31,6 +32,7 @@ interface Unevaluated {
price: number,
purchaseCount: number,
unit: string,
totalPrice: number,
};
star: number;
comment: string;
......@@ -77,6 +79,7 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
price: res.data.price,
purchaseCount: res.data.purchaseCount,
unit: res.data.unit,
totalPrice: res.data.totalPrice,
},
star: res.data.star,
comment: res.data.comment,
......@@ -147,6 +150,7 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
const UploadTip = () => (
<div
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
......@@ -169,14 +173,7 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
aloneTxt: intl.formatMessage({id: 'supplierEvaluation.dan'}),
name: orderInfo?.orderNo,
}}
/>
}
title={orderInfo?.orderNo}
extra={(
<>
{
......@@ -213,47 +210,54 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
</>
}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: [evaluationInfo],
<MellowCard
bodyStyle={{
paddingBottom: 0,
}}
editable={isEdit}
expressionScope={{
beforeUpload,
}}
components={{
EvaluationList,
UploadTip,
}}
onSubmit={handleSubmit}
effects={($, actions) => {
createEffects($, actions);
>
<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}
/>
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>
</PageHeaderWrapper>
</Spin>
);
......
src/pages/transaction/supplierEvaluation/unevaluated/evaluate/index.tsx
View file @ 82bb9811
......@@ -14,12 +14,14 @@ import moment from 'moment';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { usePageStatus } from '@/hooks/usePageStatus';
import { getMemberCommentSupplyOrderTradeDetail, GetMemberCommentSupplyOrderTradeDetailResponse, postMemberCommentSupplyOrderTradeSubmit } from '@/services/MemberV2Api';
import AvatarWrap from '@/components/AvatarWrap';
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';
const formActions = createFormActions();
const {
......@@ -129,6 +131,7 @@ const EvaluateOrder: React.FC = () => {
const UploadTip = () => (
<div
style={{
marginTop: 14,
lineHeight: '24px',
color: '#909399',
fontWeight: 400,
......@@ -151,14 +154,7 @@ const EvaluateOrder: React.FC = () => {
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
aloneTxt: intl.formatMessage({id: 'supplierEvaluation.dan'}),
name: orderInfo?.orderNo,
}}
/>
}
title={orderInfo?.orderNo}
extra={(
<>
<Button
......@@ -189,31 +185,39 @@ const EvaluateOrder: React.FC = () => {
</>
}
>
<NiceForm
actions={formActions}
previewPlaceholder=" "
initialValues={{
comments: orderInfo ? orderInfo.unevaluatedList : [],
{/* <EvaluationForm ediabled /> */}
<MellowCard
bodyStyle={{
paddingBottom: 0,
}}
expressionScope={{
beforeUpload,
}}
onSubmit={handleSubmit}
components={{
EvaluationList,
UploadTip,
}}
effects={($, actions) => {
createEffects($, actions);
>
<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}
/>
onFormInputChange$().subscribe(() => {
if (!unsaved) {
setUnsaved(true);
}
});
}}
schema={evaluateSchema}
/>
</MellowCard>
</PageHeaderWrapper>
<Prompt when={unsaved} message={intl.formatMessage({id: 'supplierEvaluation.ninhaiyouweibaocunde'})} />
......
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