tannedcung/sbt-idp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[yagin] change style form review2

Browse Source
This commit is contained in:
yagin 2024-12-05 14:44:49 +07:00
parent e51994958e
commit 7841a775b7
3 changed files with 121 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
cope2n-fe/src/pages/reviews2/DocumentCompareInfo.tsx Normal file
View File

@ -0,0 +1,69 @@
import React from 'react';
import { Button, Descriptions, Input } from 'antd';
import type { DescriptionsProps } from 'antd';
import { CopyOutlined } from '@ant-design/icons';
import { FEEDBACK_RESULT, PREDICTED_RESULT, REVIEWED_RESULT } from './const';
const DocumentCompareInfo = ({ key, data, selectedFileDataSource, updateRevisedByFeedback, handleUpdateFileInField, shouldRevised, disabledInput }) => {
const items: DescriptionsProps['items'] = [
{
key: selectedFileDataSource[data]?.[FEEDBACK_RESULT] || '1',
label: 'Feedback',
children: selectedFileDataSource[data]?.[FEEDBACK_RESULT],
labelStyle: { color: '#333', padding: '4px 16px' },
contentStyle: { padding: '4px 16px' },
span: 3
},
{
key: selectedFileDataSource[data]?.[PREDICTED_RESULT] || '2',
label: 'Predicted',
children: selectedFileDataSource[data]?.[PREDICTED_RESULT],
labelStyle: { color: '#333', padding: '4px 16px' },
contentStyle: { padding: '4px 16px' },
span: 3
},
{
key: selectedFileDataSource[data]?.[REVIEWED_RESULT] || '3',
label: 'Revised',
children: <Input
style={{ background: shouldRevised ? 'yellow' : '' }}
value={selectedFileDataSource[data]?.[REVIEWED_RESULT]}
size='small'
onChange={(e) =>
handleUpdateFileInField(data, e.target.value)
}
variant="borderless"
disabled={disabledInput === undefined || disabledInput === 0}
/>,
labelStyle: { color: '#333', padding: '4px 16px' },
contentStyle: { padding: '4px 16px' },
span: 3
},
];
return (
<div style={{ margin: '0 0 8px' }} className='file-input-group' key={key}>
<div
style={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
margin: '0 0 4px',
}}
>
<p style={{ fontWeight: 'bold', margin: 0 }}>{data}</p>
<Button
shape='round'
type='primary'
ghost
icon={<CopyOutlined />}
size='small'
onClick={() => updateRevisedByFeedback(data)}
disabled={disabledInput === undefined || disabledInput === 0}
/>
</div>
<Descriptions bordered items={items} layout="horizontal" size='small' contentStyle={{ height: '13px' }} />
</div>
)
}
export default DocumentCompareInfo;

39
cope2n-fe/src/pages/reviews2/DocumentHeadInfo.tsx Normal file
View File

@ -0,0 +1,39 @@
import React from 'react';
import { Descriptions } from 'antd';
import type { DescriptionsProps } from 'antd';
const DocumentHeadInfo = ({ currentRequest }) => {
const items: DescriptionsProps['items'] = [
{
key: '1',
label: 'Request ID',
children: currentRequest?.RequestID,
span: 2,
labelStyle: { color: '#333', width: '200px' }
},
{
key: '2',
label: 'Redemption ID',
children: currentRequest?.RedemptionID,
labelStyle: { color: '#333', width: '200px' }
},
{
key: '3',
label: 'Raw accuracy',
children: currentRequest?.raw_accuracy,
span: 2,
labelStyle: { color: '#333', width: '200px' }
},
{
key: '4',
label: 'Processing time',
children: currentRequest?.['Server Processing Time (ms)'],
labelStyle: { color: '#333', width: '200px' }
}
];
return (
<Descriptions bordered items={items} size="small" />
)
}
export default DocumentHeadInfo;

90
cope2n-fe/src/pages/reviews2/index.tsx
View File

@ -3,7 +3,6 @@ import {
ArrowRightOutlined,
CheckCircleOutlined,
ClockCircleFilled,
CopyOutlined,
FullscreenExitOutlined,
FullscreenOutlined,
} from '@ant-design/icons';
@ -55,6 +54,8 @@ import {
import FileCard from './FileCard';
import RecentRequest from './RecentRequest';
import './style.css';
import DocumentHeadInfo from './DocumentHeadInfo';
import DocumentCompareInfo from './DocumentCompareInfo';
const ReviewPage = () => {
const [loading, setLoading] = useState(false);
@ -500,42 +501,10 @@ const ReviewPage = () => {
>
{fullscreen ? <FullscreenExitOutlined /> : <FullscreenOutlined />}
</Button>
{totalRequests && (
<div
style={{
flexGrow: 1,
display: 'grid',
gridTemplateColumns: '1fr 1fr 1fr',
marginLeft: '16px',
}}
>
<div style={{ gridColumn: 'span 2 / span 2' }}>
<b>Request ID: &nbsp;</b>
{currentRequest?.RequestID}
</div>{' '}
<div>
<b>Created at: &nbsp;</b>
{currentRequest?.created_at}
</div>{' '}
<div>
<b>Request time: &nbsp;</b>
{currentRequest?.['Client Request Time (ms)']}
</div>{' '}
<div style={{ gridColumn: 'span 2 / span 2' }}>
<b>Redemption ID: &nbsp;</b>
{currentRequest?.RedemptionID}
</div>{' '}
<div>
<b>Raw accuracy: &nbsp;</b>
{currentRequest?.raw_accuracy}
</div>{' '}
<div style={{ gridColumn: 'span 2 / span 2' }}>
<b>Processing time: &nbsp;</b>
{currentRequest?.['Server Processing Time (ms)']}
</div>{' '}
</div>
)}
</div>
{totalRequests && (
<DocumentHeadInfo currentRequest={currentRequest} />
)}
{totalRequests > 0 && (
<div
style={{
@ -796,47 +765,14 @@ const ReviewPage = () => {
}
} catch (error) { }
return (
<div style={{ margin: '0 0 8px' }} className='file-input-group' key={data}>
<div
style={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
margin: '0 0 4px',
}}
>
<p style={{ fontWeight: 'bold', margin: 0 }}>{data}</p>
<Button
shape='round'
type='primary'
ghost
icon={<CopyOutlined />}
size='small'
onClick={() => updateRevisedByFeedback(data)}
/>
</div>
<Input
addonBefore='Feedback'
size='small'
readOnly
value={selectedFileDataSource[data]?.[FEEDBACK_RESULT]}
/>
<Input
addonBefore='Predicted'
readOnly
size='small'
value={selectedFileDataSource[data]?.[PREDICTED_RESULT]}
/>
<Input
addonBefore='Revised'
style={{ background: shouldRevised ? 'yellow' : '' }}
size='small'
value={selectedFileDataSource[data]?.[REVIEWED_RESULT]}
onChange={(e) =>
handleUpdateFileInField(data, e.target.value)
}
/>
</div>
<DocumentCompareInfo key={data}
data={data}
selectedFileDataSource={selectedFileDataSource}
updateRevisedByFeedback={updateRevisedByFeedback}
handleUpdateFileInField={handleUpdateFileInField}
shouldRevised={shouldRevised}
disabledInput = {currentRequest?.Files?.length}
/>
);
})}
<b>{t`Bad image reason:`}</b>