Skip to content

Commit

Permalink
Merge pull request #863 from NUTFes/feat/kubosaka/862-organize-advert…
Browse files Browse the repository at this point in the history 
…isement

minioのディレクトリ整理&広告データが変更・削除された時minioのオブジェクトも削除
  • Loading branch information
@Kubosaka
Kubosaka authored Jul 28, 2024
2 parents e4dd3df + b97e543 commit 9c4f168
Show file tree
Hide file tree
Showing 5 changed files with 108 additions and 25 deletions.
3 changes: 3 additions & 0 deletions view/next-project/src/components/sponsoractivities/DetailModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,11 @@ interface ModalProps {
id: React.ReactNode;
sponsorActivitiesViewItem: SponsorActivityView;
isDelete: boolean;
year: string;
}

const DetailModal: FC<ModalProps> = (props) => {
const { year } = props;
const [isChange, setIsChange] = useState<boolean>(false);
const [sponsorActivitiesView, setSponsorActivitiesView] = useState<SponsorActivityView>(
props.sponsorActivitiesViewItem,
Expand Down Expand Up @@ -48,6 +50,7 @@ const DetailModal: FC<ModalProps> = (props) => {
setSponsorActivitiesView={setSponsorActivitiesView}
id={props.id}
setIsChange={setIsChange}
year={year}
/>
)}
</Modal>
Expand Down
34 changes: 29 additions & 5 deletions view/next-project/src/components/sponsoractivities/DetailPage2.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,16 +24,19 @@ interface ModalProps {
children?: React.ReactNode;
id: React.ReactNode;
sponsorActivitiesViewItem: SponsorActivityView;
year: string;
setIsChange: (isChange: boolean) => void;
setSponsorActivitiesView: (sponsorActivitiesView: SponsorActivityView) => void;
}

const DetailPage2: FC<ModalProps> = (props) => {
const { year } = props;
const toPage1 = () => {
props.setPageNum(1);
};
const [isOpen, setIsOpen] = useState<boolean>(false);
const [editActivityInformationId, setEditActivityInformationId] = useState<number>(0);
const [editActivityInformation, setEditActivityInformation] =
useState<SponsorActivityInformation>();
const [activityInformationData, setActivityInformationData] = useState<string>('');
const [isLoading, setIsLoading] = useState<boolean>(false);

Expand Down Expand Up @@ -68,7 +71,7 @@ const DetailPage2: FC<ModalProps> = (props) => {
sponsorActivityInformations.map((activityInformation) => {
const bucketName = activityInformation.bucketName;
const fileName = activityInformation.fileName;
return `${process.env.NEXT_PUBLIC_MINIO_ENDPONT}/${bucketName}/${fileName}`;
return `${process.env.NEXT_PUBLIC_MINIO_ENDPONT}/${bucketName}/${year}/advertisements/${fileName}`;
});

const download = async (url: string, fileName: string) => {
Expand All @@ -80,6 +83,11 @@ const DetailPage2: FC<ModalProps> = (props) => {
};

const handleDelete = async (id: number, activityInformation: SponsorActivityInformation) => {
//オブジェクト削除
const formData = new FormData();
formData.append('fileName', `${activityInformation.fileName}`);
formData.append('year', year);

const deleteSponsorActivityInformationUrl =
process.env.CSR_API_URI + '/activity_informations/' + String(id);
const newSponsorActivityInformations = sponsorActivityInformations.filter(
Expand All @@ -90,6 +98,21 @@ const DetailPage2: FC<ModalProps> = (props) => {
} else {
const confirm = window.confirm('本当に削除してよろしいですか？');
if (confirm) {
const response = await fetch('/api/advertisements', {
method: 'DELETE',
body: formData,
})
.then((response) => {
if (response.ok) {
return true;
} else {
alert('削除に失敗');
return false;
}
})
.catch((error) => {
console.error('Error:', error);
});
const res = await del(deleteSponsorActivityInformationUrl);
} else {
window.alert('キャンセルしました');
Expand Down Expand Up @@ -325,7 +348,7 @@ const DetailPage2: FC<ModalProps> = (props) => {
<OutlinePrimaryButton
className='p-1'
onClick={() => {
setEditActivityInformationId(index);
setEditActivityInformation(activityInformation);
setIsOpen(true);
}}
>
Expand All @@ -346,7 +369,7 @@ const DetailPage2: FC<ModalProps> = (props) => {
<OutlinePrimaryButton
className='mx-auto my-2'
onClick={() => {
setEditActivityInformationId(index);
setEditActivityInformation(activityInformation);
setIsOpen(true);
}}
>
Expand All @@ -373,10 +396,11 @@ const DetailPage2: FC<ModalProps> = (props) => {
<UplaodFileModal
setIsOpen={setIsOpen}
id={props.sponsorActivitiesViewItem.sponsorActivity.id || 0}
ActivityInformationId={editActivityInformationId}
activityInformation={editActivityInformation}
sponsorActivityInformations={sponsorActivityInformations}
setSponsorActivityInformations={setSponsorActivityInformations}
setIsChange={props.setIsChange}
year={year}
/>
)}
</>
Expand Down
68 changes: 49 additions & 19 deletions view/next-project/src/components/sponsoractivities/UploadFileModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@ interface ModalProps {
setIsOpen: (isOpen: boolean) => void;
children?: React.ReactNode;
id: number;
ActivityInformationId: number;
activityInformation?: SponsorActivityInformation;
year: string;
sponsorActivityInformations?: SponsorActivityInformation[];
setSponsorActivityInformations: (
sponsorActivityInformations: SponsorActivityInformation[],
Expand All @@ -19,20 +20,21 @@ interface ModalProps {
}

const UplaodFileModal: FC<ModalProps> = (props) => {
const { year, activityInformation } = props;
const fileInputRef = useRef<HTMLInputElement>(null);
const [imageFile, setImageFile] = useState<File | null>(null);
const [preview, setPreview] = useState({ uploadImageURL: '', type: '' });
const [activityInformation, setActivityInformation] = useState<SponsorActivityInformation>(
(props.sponsorActivityInformations &&
props.sponsorActivityInformations[props.ActivityInformationId]) || {
activityID: props.id,
bucketName: '',
fileName: '',
fileType: '',
designProgress: 1,
fileInformation: '',
},
);
const [registerActivityInformation, setRegisterActivityInformation] =
useState<SponsorActivityInformation>(
activityInformation || {
activityID: props.id,
bucketName: '',
fileName: '',
fileType: '',
designProgress: 1,
fileInformation: '',
},
);

const sponsorActivityInformations = props.sponsorActivityInformations || [];
// loadingの呼び出し
Expand All @@ -51,8 +53,8 @@ const UplaodFileModal: FC<ModalProps> = (props) => {
const fileName = targetFile.name;
const fileType = targetFile.type;

setActivityInformation({
...activityInformation,
setRegisterActivityInformation({
...registerActivityInformation,
bucketName: bucketName || '',
fileName: fileName,
fileType: fileType,
Expand All @@ -65,17 +67,45 @@ const UplaodFileModal: FC<ModalProps> = (props) => {
props.setIsOpen(false);
};

const objectDeleteHandle = async () => {
const formData = new FormData();
formData.append('fileName', `${activityInformation?.fileName}`);
formData.append('year', year);
const response = await fetch('/api/advertisements', {
method: 'DELETE',
body: formData,
})
.then((response) => {
if (response.ok) {
return true;
} else {
alert('削除に失敗');
return false;
}
})
.catch((error) => {
console.error('Error:', error);
});
};

const submit = async () => {
if (!imageFile) {
return;
}

//更新の場合削除
if (activityInformation?.fileName !== '') {
objectDeleteHandle();
}

setIsLoading(true);
const formData = new FormData();
formData.append('file', imageFile);
const fileName = imageFile?.name || '';
formData.append('fileName', fileName);
formData.append('year', year);

const response = await fetch('/api/minio', {
const response = await fetch('/api/advertisements', {
method: 'POST',
body: formData,
})
Expand All @@ -98,12 +128,12 @@ const UplaodFileModal: FC<ModalProps> = (props) => {
}

const sponsorActivitiesUrl =
process.env.CSR_API_URI + '/activity_informations/' + activityInformation.id;
const res = await put(sponsorActivitiesUrl, activityInformation);
process.env.CSR_API_URI + '/activity_informations/' + activityInformation?.id;
const res = await put(sponsorActivitiesUrl, registerActivityInformation);
const newSponsorActivityInformations = sponsorActivityInformations.map(
(sponsorActivityInformation) => {
if (sponsorActivityInformation.id === activityInformation.id) {
return activityInformation;
if (sponsorActivityInformation.id === registerActivityInformation.id) {
return registerActivityInformation;
}
return sponsorActivityInformation;
},
Expand Down
27 changes: 26 additions & 1 deletion view/next-project/src/pages/api/minio.tsx → ...-project/src/pages/api/advertisements.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,8 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
}

const bucketName = 'finansu';
const fileName = files.file[0].originalFilename;
const year = fields.year && fields.year[0];
const fileName = `${year}/advertisements/${files.file[0].originalFilename}`;
const file = files.file[0];
const mimetype = file.mimetype;
const metaData = {
Expand All @@ -57,6 +58,30 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
return res.status(200).json({ message: '成功' });
});
}

// 変更の場合の画像を削除する
if (req.method === 'DELETE') {
const form = formidable();

form.parse(req, async (err, fields, files: any) => {
if (err) {
throw new Error('Error parsing form');
}

const year = fields.year && fields.year[0];
const fileName = fields.fileName && fields.fileName;
const filePath = `${year}/advertisements/${fileName}`;

try {
await minioClient.removeObject(BUCKET_NAME, filePath);
console.log('Removed the object');
} catch (err) {
res.status(400).json({ message: '失敗' });
throw new Error('Error uploading file (' + err + ')');
}
return res.status(200).json({ message: '成功' });
});
}
}

// バケットがない時に作成する関数(環境構築時のみ)
Expand Down
1 change: 1 addition & 0 deletions view/next-project/src/pages/sponsoractivities/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -628,6 +628,7 @@ export default function SponsorActivities(props: Props) {
setIsOpen={setIsOpen}
sponsorActivitiesViewItem={sponsorActivitiesItem}
isDelete={false}
year={selectedYear}
/>
)}
</MainLayout>
Expand Down

0 comments on commit 9c4f168

Please sign in to comment.