Commit 938db756 authored by XieZhiXiong's avatar XieZhiXiong

feat: 添加是否显示解释相关

parent 05e4d7ba
......@@ -8,4 +8,40 @@
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
......@@ -27,37 +27,47 @@ const {
onFormInputChange$,
} = FormEffectHooks;
export type CommentsItem = {
/**
*
* 商品信息
*/
good: EtProductInfoType,
/**
* 笑脸
*/
smile: number,
/**
* 星星数
*/
star: number,
/**
* 评价
*/
comment?: string,
/**
* 图片
*/
picture?: FileData[],
/**
* 是否已评价0-否1-是
*/
commentStatus?: number,
/**
* 解释时间
*/
replyTime?: string,
/**
* 解释内容
*/
replyContent?: string,
}
export type EvaluationFormValue = {
/**
* 评价
*/
comments: {
/**
*
* 商品信息
*/
good: EtProductInfoType,
/**
* 笑脸
*/
smile: number,
/**
* 星星数
*/
star: number,
/**
* 评价
*/
comment?: string,
/**
* 图片
*/
picture?: FileData[],
/**
* 是否已评价0-否1-是
*/
commentStatus?: number,
}[],
comments: CommentsItem[],
}
interface EvaluationFormProps {
......@@ -73,6 +83,10 @@ interface EvaluationFormProps {
* 表单submit触发事件
*/
onSubmit?: (value: EvaluationFormValue) => void,
/**
* 是否显示解释,默认 false
*/
interpretation?: boolean,
}
export interface EvaluationFormRefHandle {
......@@ -123,6 +137,7 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
]
},
onSubmit,
interpretation = false,
} = props;
const [unsaved, setUnsaved] = useState(false);
......@@ -143,15 +158,15 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
const beforeUpload = file => {
if (file.size / 1024 / 1024 > 10) {
message.warning(intl.formatMessage({id: 'supplierEvaluation.tupiandaxiaochaoguo10M'}));
message.warning(intl.formatMessage({ id: 'supplierEvaluation.tupiandaxiaochaoguo10M' }));
return Upload.LIST_IGNORE;
}
return Promise.resolve();
return Promise.resolve();
};
const UploadTip = () => (
<div className={styles['evaluation-form-picture-tip']}>
{intl.formatMessage({id: 'supplierEvaluation.zhichiJPGPNGJPEG'})} <br />{intl.formatMessage({id: 'supplierEvaluation.meizhangzuidabuchaoguo'})} <br />{intl.formatMessage({id: 'supplierEvaluation.zuidashuliangxianzhi4'})}
{intl.formatMessage({ id: 'supplierEvaluation.zhichiJPGPNGJPEG' })} <br />{intl.formatMessage({ id: 'supplierEvaluation.meizhangzuidabuchaoguo' })} <br />{intl.formatMessage({ id: 'supplierEvaluation.zuidashuliangxianzhi4' })}
</div>
);
......@@ -193,7 +208,7 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
{({ state, mutators }) => {
return (
<div>
{state.value.map((item, index) => (
{state.value.map((item: CommentsItem, index) => (
<div key={index}>
<Row>
<Col flex={1}>
......@@ -203,16 +218,16 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
/>
</Col>
<Col>
<FormItem
name={`comments.${index}.smile`}
component={SmilingFace}
/>
<FormItem
name={`comments.${index}.smile`}
component={SmilingFace}
/>
</Col>
</Row>
<FormItem
name={`comments.${index}.star`}
component={Rating}
title={intl.formatMessage({id: 'purchaserEvaluation.manyichengdu'}, { default: '满意程度' })}
title={intl.formatMessage({ id: 'purchaserEvaluation.manyichengdu' }, { default: '满意程度' })}
rules={[
{
required: true,
......@@ -224,7 +239,7 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
<FormItem
name={`comments.${index}.comment`}
component={Input.TextArea}
title={intl.formatMessage({id: 'purchaserEvaluation.pingjia'}, { default: '评价' })}
title={intl.formatMessage({ id: 'purchaserEvaluation.pingjia' }, { default: '评价' })}
rules={[
{
max: 200,
......@@ -240,7 +255,7 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
<FormItem
name={`comments.${index}.picture`}
component={AntUpload}
title={intl.formatMessage({id: 'purchaserEvaluation.tupian'}, { default: '图片' })}
title={intl.formatMessage({ id: 'purchaserEvaluation.tupian' }, { default: '图片' })}
itemStyle={(
index === state.value.length - 1
? {
......@@ -251,7 +266,7 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
rules={[
{
max: 4,
message: intl.formatMessage({id: 'purchaserEvaluation.zuiduokeshangchuan4zhangtu'}),
message: intl.formatMessage({ id: 'purchaserEvaluation.zuiduokeshangchuan4zhangtu' }),
},
]}
listType="card"
......@@ -271,6 +286,19 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
</Col>
)}
</Row>
{interpretation ? (
<div className={styles['evaluation-form-interpretation']}>
<div className={styles['evaluation-form-interpretation-title']}>
{intl.formatMessage({id: 'purchaserEvaluation.shangjiajieshi'}, { default: '商家解释' })}
</div>
<div className={styles['evaluation-form-interpretation-content']}>
{item.replyContent}
</div>
<div className={styles['evaluation-form-interpretation-date']}>
{item.replyTime}
</div>
</div>
) : null}
</div>
))}
</div>
......@@ -280,7 +308,7 @@ const EvaluationForm: React.ForwardRefRenderFunction<EvaluationFormRefHandle, Ev
</MegaLayout>
</Form>
<Prompt when={unsaved} message={intl.formatMessage({id: 'supplierEvaluation.ninhaiyouweibaocunde'})} />
<Prompt when={unsaved} message={intl.formatMessage({ id: 'supplierEvaluation.ninhaiyouweibaocunde' })} />
</MellowCard>
);
};
......
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