diff --git a/src/components/MainLayout/FashionListBox.tsx b/src/components/MainLayout/FashionListBox.tsx
index bedc1aa..73bb988 100644
--- a/src/components/MainLayout/FashionListBox.tsx
+++ b/src/components/MainLayout/FashionListBox.tsx
@@ -144,6 +144,53 @@ export default function FashionListBox() {
}
};
+ const getSkyStatusIcon = (skyStatus: string, rainfallType: string) => {
+ if (
+ (skyStatus === 'CLEAR' || skyStatus === 'SUNNY') &&
+ rainfallType === 'CLEAR'
+ ) {
+ return '☀️';
+ } else if (
+ (skyStatus === 'OVERCAST' || skyStatus === 'CLOUDY') &&
+ rainfallType === 'CLEAR'
+ ) {
+ return '☁️';
+ } else if (
+ rainfallType === 'RAINY' ||
+ rainfallType === 'RAIN_SNOW' ||
+ rainfallType === 'RAINDROP' ||
+ rainfallType === 'RAINDROP_FLUFFY'
+ ) {
+ return '🌧️';
+ } else if (
+ rainfallType === 'SNOWY' ||
+ rainfallType === 'RAIN_SNOW' ||
+ rainfallType === 'RAINDROP_FLUFFY' ||
+ rainfallType === 'FLUFFY'
+ ) {
+ return '❄️';
+ } else {
+ return '';
+ }
+ };
+
+ const getReviewColor = (review: string) => {
+ switch (review) {
+ case 'COLD':
+ return '#107DFD';
+ case 'CHILLY':
+ return '#8FC0FA';
+ case 'MILD':
+ return '#EED921';
+ case 'WARM':
+ return '#EE8181';
+ case 'HOT':
+ return '#CE4040';
+ default:
+ return '#FF6767'; // Default color
+ }
+ };
+
const FashionList = () => {
let fashion: WeatherPostType[] = [];
const array = [];
@@ -184,6 +231,57 @@ export default function FashionListBox() {
height="260px"
image={fashion[index].image}
/>
+
+ {/* 날씨 아이콘*/}
+
+
+ {getSkyStatusIcon(
+ fashion[index].skyStatus,
+ fashion[index].rainfallType
+ )}
+
+
+
+ {/* 온도 아이콘*/}
+
+
+ {' '}
+ {fashion[index].temperature}°C
+
+
+
{fashion[index].title}
+
+ {/* 리뷰 아이콘 */}
+
+
+ {fashion[index].review}
+
+
diff --git a/src/utils/types.ts b/src/utils/types.ts
index 3a3a780..8c8ecfc 100644
--- a/src/utils/types.ts
+++ b/src/utils/types.ts
@@ -1,65 +1,69 @@
export type SinglePostType = {
- id: string;
- username: string;
- title: string;
- image: string;
- review: string;
- skyStatus: string;
- rainfallType: string;
- windChill: number;
- createdAt: string;
- updatedAt: string;
- deletedAt: string;
-}
+ id: string;
+ username: string;
+ title: string;
+ image: string;
+ review: string;
+ skyStatus: string;
+ rainfallType: string;
+ windChill: number;
+ createdAt: string;
+ updatedAt: string;
+ deletedAt: string;
+};
export type WeatherType = {
- sky: string;
- temperature: number;
- hourRainfall: number;
- humidity: number;
- rainfallType: string;
- windSpeed: number;
- windChill: number;
-}
+ sky: string;
+ temperature: number;
+ hourRainfall: number;
+ humidity: number;
+ rainfallType: string;
+ windSpeed: number;
+ windChill: number;
+};
export type LocationType = {
- fullAddress: string;
- region1depth: string;
- region2depth: string;
- region3depth: string;
-}
+ fullAddress: string;
+ region1depth: string;
+ region2depth: string;
+ region3depth: string;
+};
export type WeatherPostType = {
- id: string;
- title: string;
- image: string;
+ id: string;
+ title: string;
+ image: string;
+ skyStatus: string;
+ temperature: number;
+ review: string;
+ rainfallType: string;
};
export type LookBookListType = {
- id: string;
- title: string;
- image: string;
- userId: string;
+ id: string;
+ title: string;
+ image: string;
+ userId: string;
};
export type LookBookBoxType = {
- id: string;
- title: string;
- image: string;
- userId: string;
- createdAt: string;
- updatedAt: string;
- deletedAt: string;
+ id: string;
+ title: string;
+ image: string;
+ userId: string;
+ createdAt: string;
+ updatedAt: string;
+ deletedAt: string;
};
export type UserPostListType = {
- id: string;
- userId: string;
- title: string;
- image: string;
- review: string;
- skyStatus: number;
- rainfallType: number;
- windChill: number;
- createdAt: string;
- updatedAt: string;
- deletedAt: string;
-}
\ No newline at end of file
+ id: string;
+ userId: string;
+ title: string;
+ image: string;
+ review: string;
+ skyStatus: number;
+ rainfallType: number;
+ windChill: number;
+ createdAt: string;
+ updatedAt: string;
+ deletedAt: string;
+};