|
|
|
@ -1,94 +1,50 @@
|
|
|
|
|
import React, { useEffect, useState } from 'react';
|
|
|
|
|
import { CardMedia, ImageList, ImageListItem } from '@mui/material';
|
|
|
|
|
import { useDropzone } from 'react-dropzone';
|
|
|
|
|
import { Image } from '@mui/icons-material';
|
|
|
|
|
import Box from '@mui/material/Box';
|
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
|
import { judgeFileDownload } from '../../../apis/judge';
|
|
|
|
|
import { CardMedia, Grid } from '@mui/material';
|
|
|
|
|
import { findImages } from '../../../apis/judge';
|
|
|
|
|
import _ from 'lodash';
|
|
|
|
|
|
|
|
|
|
const itemData = [
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1551963831-b3b1ca40c98e',
|
|
|
|
|
title: 'Breakfast'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1551782450-a2132b4ba21d',
|
|
|
|
|
title: 'Burger'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1522770179533-24471fcdba45',
|
|
|
|
|
title: 'Camera'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1444418776041-9c7e33cc5a9c',
|
|
|
|
|
title: 'Coffee'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1533827432537-70133748f5c8',
|
|
|
|
|
title: 'Hats'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1558642452-9d2a7deb7f62',
|
|
|
|
|
title: 'Honey'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1516802273409-68526ee1bdd6',
|
|
|
|
|
title: 'Basketball'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1518756131217-31eb79b20e8f',
|
|
|
|
|
title: 'Fern'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1597645587822-e99fa5d45d25',
|
|
|
|
|
title: 'Mushrooms'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1567306301408-9b74779a11af',
|
|
|
|
|
title: 'Tomato basil'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1471357674240-e1a485acb3e1',
|
|
|
|
|
title: 'Sea star'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
img: 'https://images.unsplash.com/photo-1589118949245-7d38baf380d6',
|
|
|
|
|
title: 'Bike'
|
|
|
|
|
}
|
|
|
|
|
];
|
|
|
|
|
const ProcessJudge = (props) => {
|
|
|
|
|
const { rowDatas, showAlert } = props;
|
|
|
|
|
const [picadImgs, setPicadImgs] = useState([]);
|
|
|
|
|
const [frecadImgs, setFrecadImgs] = useState([]);
|
|
|
|
|
const [contadImgs, setContadImgs] = useState([]);
|
|
|
|
|
|
|
|
|
|
const ProcessJudge = ({ rowDatas, showAlert }) => {
|
|
|
|
|
const [previewImage, setPreviewImage] = useState();
|
|
|
|
|
|
|
|
|
|
const { getRootProps, getInputProps } = useDropzone({
|
|
|
|
|
accept: 'image/*',
|
|
|
|
|
onDrop: (acceptedFiles) => {
|
|
|
|
|
setPreviewImage(URL.createObjectURL(itemData[0].img));
|
|
|
|
|
}
|
|
|
|
|
const getImgList = (row) => {
|
|
|
|
|
findImages(row, showAlert).then((res) => {
|
|
|
|
|
const { arrPicadImg, arrFrecadImg, arrContadImg } = res;
|
|
|
|
|
console.log(res);
|
|
|
|
|
// console.log(arrPicadImg, arrFrecadImg, arrContadImg);
|
|
|
|
|
setPicadImgs(arrPicadImg);
|
|
|
|
|
setFrecadImgs(arrFrecadImg);
|
|
|
|
|
setContadImgs(arrContadImg);
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const viewImg = (scDatagb, scCode, methodName) => {
|
|
|
|
|
judgeFileDownload(
|
|
|
|
|
{
|
|
|
|
|
scDatagb,
|
|
|
|
|
scCode,
|
|
|
|
|
methodName
|
|
|
|
|
},
|
|
|
|
|
showAlert
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// rowDatas[0]?[`scFrecad`];
|
|
|
|
|
// rowDatas[0]?[`scContad`];
|
|
|
|
|
// 1. 데이타 조회 - msMaincode로 gnRecallSc
|
|
|
|
|
// 2. 이미지 조회 - judgeFileDownload : data['scPicad1'] 가 있는 경우
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
rowDatas?.forEach((r) => _.range(1, 5, 1).forEach((idx) => viewImg(r.scDatagb, r.msMaincode, `scPicad${idx}`)));
|
|
|
|
|
getImgList(rowDatas[0]);
|
|
|
|
|
}, []);
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<Grid container spacing={1}>
|
|
|
|
|
{picadImgs?.map((img, idx) => (
|
|
|
|
|
<Grid item xs={3} key={idx} columnSpacing={1}>
|
|
|
|
|
<CardMedia
|
|
|
|
|
component="img"
|
|
|
|
|
sx={{
|
|
|
|
|
height: 233,
|
|
|
|
|
width: 350,
|
|
|
|
|
maxHeight: { xs: 233, md: 167 },
|
|
|
|
|
maxWidth: { xs: 350, md: 250 }
|
|
|
|
|
}}
|
|
|
|
|
src={img}
|
|
|
|
|
/>
|
|
|
|
|
</Grid>
|
|
|
|
|
))}
|
|
|
|
|
</Grid>
|
|
|
|
|
<Grid container spacing={1}>
|
|
|
|
|
{frecadImgs?.map((img, idx) => (
|
|
|
|
|
<Grid item xs={3} key={idx} columnSpacing={1}>
|
|
|
|
|
<CardMedia
|
|
|
|
|
component="img"
|
|
|
|
|
sx={{
|
|
|
|
@ -97,10 +53,15 @@ const ProcessJudge = ({ rowDatas, showAlert }) => {
|
|
|
|
|
maxHeight: { xs: 233, md: 167 },
|
|
|
|
|
maxWidth: { xs: 350, md: 250 }
|
|
|
|
|
}}
|
|
|
|
|
src={itemData[0].img}
|
|
|
|
|
// src={previewImage}
|
|
|
|
|
src={img}
|
|
|
|
|
/>
|
|
|
|
|
<Box
|
|
|
|
|
</Grid>
|
|
|
|
|
))}
|
|
|
|
|
</Grid>
|
|
|
|
|
<Grid container spacing={1}>
|
|
|
|
|
{contadImgs?.map((img, idx) => (
|
|
|
|
|
<Grid item xs={3} key={idx} columnSpacing={1}>
|
|
|
|
|
<CardMedia
|
|
|
|
|
component="img"
|
|
|
|
|
sx={{
|
|
|
|
|
height: 233,
|
|
|
|
@ -108,17 +69,18 @@ const ProcessJudge = ({ rowDatas, showAlert }) => {
|
|
|
|
|
maxHeight: { xs: 233, md: 167 },
|
|
|
|
|
maxWidth: { xs: 350, md: 250 }
|
|
|
|
|
}}
|
|
|
|
|
alt="The house from the offer."
|
|
|
|
|
src={itemData[0].img}
|
|
|
|
|
src={img}
|
|
|
|
|
/>
|
|
|
|
|
<Image src={itemData[0].img} />
|
|
|
|
|
</Grid>
|
|
|
|
|
))}
|
|
|
|
|
</Grid>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
ProcessJudge.propTypes = {
|
|
|
|
|
rowDatas: PropTypes.array.isRequired,
|
|
|
|
|
showAlert: PropTypes.object
|
|
|
|
|
};
|
|
|
|
|
// ProcessJudge.propTypes = {
|
|
|
|
|
// rowDatas: PropTypes.object.isRequired,
|
|
|
|
|
// showAlert: PropTypes.object
|
|
|
|
|
// };
|
|
|
|
|
|
|
|
|
|
export default ProcessJudge;
|
|
|
|
|