From a7718e6f5d9a4e6c4e56393f770e3acb24c02fc8 Mon Sep 17 00:00:00 2001 From: byein Date: Sat, 21 Jan 2023 05:33:14 +0900 Subject: [PATCH] chore/fix: progressing modify recruit/fix create new recruit error - #1, #15, #39 --- .../atoms/CreateRecruit/CategorySelect.tsx | 29 +-- .../atoms/CreateRecruit/MenuItem.tsx | 3 +- .../components/atoms/CreateRecruit/Tags.tsx | 11 +- .../molecules/CreateRecruit/MenuList.tsx | 1 - .../pages/CreateRecuit/CategorySelect.tsx | 24 ++- .../pages/CreateRecuit/PlaceSearch.tsx | 2 +- .../components/pages/CreateRecuit/first.tsx | 193 +++++------------- .../components/pages/CreateRecuit/fourth.tsx | 32 ++- .../components/pages/CreateRecuit/second.tsx | 108 +++++++--- .../components/pages/CreateRecuit/third.tsx | 7 +- .../src/components/utils/api/Recruit.ts | 4 +- 11 files changed, 184 insertions(+), 230 deletions(-) diff --git a/baedalmate/src/components/atoms/CreateRecruit/CategorySelect.tsx b/baedalmate/src/components/atoms/CreateRecruit/CategorySelect.tsx index 7a7d7e1..809b709 100644 --- a/baedalmate/src/components/atoms/CreateRecruit/CategorySelect.tsx +++ b/baedalmate/src/components/atoms/CreateRecruit/CategorySelect.tsx @@ -1,24 +1,8 @@ import React from 'react'; -import { - Image, - NativeModules, - StyleSheet, - Text, - TextInput, - TouchableOpacity, - View, -} from 'react-native'; +import {Image, NativeModules, Text, TouchableOpacity, View} from 'react-native'; -import {TextKRReg} from 'themes/text'; -import {Fonts} from 'assets/Fonts'; -import { - BLACK_COLOR, - DARK_GRAY_COLOR, - PRIMARY_COLOR, - WHITE_COLOR, -} from 'themes/theme'; +import {BLACK_COLOR, WHITE_COLOR} from 'themes/theme'; import {useNavigation} from '@react-navigation/native'; -import {useController} from 'react-hook-form'; export interface RecruitItemProps { createDate: string; @@ -39,7 +23,6 @@ export interface RecruitItemProps { } const {StatusBarManager} = NativeModules; -type endStandardType = 'people' | 'price' | 'time'; export interface deliveryFeeProps { i: number; cnt: number; @@ -51,7 +34,13 @@ export interface CategoryProps { categoryName: string; categoryImg: any; } -const SelectCategoryItem = ({item}: {item: CategoryProps}) => { +const SelectCategoryItem = ({ + item, +}: { + item: CategoryProps; + defaultItem?; + type?; +}) => { const navigation = useNavigation(); return ( { {props.menu} - {props.cnt}개 · {props.price}원{' '} + {props.cnt}개 · {formPrice(props.price)}원{' '} diff --git a/baedalmate/src/components/atoms/CreateRecruit/Tags.tsx b/baedalmate/src/components/atoms/CreateRecruit/Tags.tsx index b49c1d1..fc842cd 100644 --- a/baedalmate/src/components/atoms/CreateRecruit/Tags.tsx +++ b/baedalmate/src/components/atoms/CreateRecruit/Tags.tsx @@ -1,14 +1,7 @@ -import {BoardListProps} from 'components/molecules/BoardList/BoardList'; import React from 'react'; import {StyleSheet, View} from 'react-native'; -import {TextKRBold, TextKRReg} from 'themes/text'; -import { - LINE_GRAY_COLOR, - LINE_ORANGE_COLOR, - MAIN_GRAY_COLOR, - PRIMARY_COLOR, - WHITE_COLOR, -} from 'themes/theme'; +import {TextKRReg} from 'themes/text'; +import {LINE_GRAY_COLOR, PRIMARY_COLOR, WHITE_COLOR} from 'themes/theme'; const RecruitTag = ({text}: {text: string}) => { return ( diff --git a/baedalmate/src/components/molecules/CreateRecruit/MenuList.tsx b/baedalmate/src/components/molecules/CreateRecruit/MenuList.tsx index 9321192..90293f7 100644 --- a/baedalmate/src/components/molecules/CreateRecruit/MenuList.tsx +++ b/baedalmate/src/components/molecules/CreateRecruit/MenuList.tsx @@ -12,7 +12,6 @@ import {useForm} from 'react-hook-form'; import { KeyboardAvoidingView, Modal, - NativeModules, Platform, StyleSheet, TouchableOpacity, diff --git a/baedalmate/src/components/pages/CreateRecuit/CategorySelect.tsx b/baedalmate/src/components/pages/CreateRecuit/CategorySelect.tsx index 0b4198c..58491cf 100644 --- a/baedalmate/src/components/pages/CreateRecuit/CategorySelect.tsx +++ b/baedalmate/src/components/pages/CreateRecuit/CategorySelect.tsx @@ -1,9 +1,7 @@ import React from 'react'; -import {NativeModules, ScrollView, StyleSheet, View} from 'react-native'; +import {ScrollView, View} from 'react-native'; -import {Fonts} from 'assets/Fonts'; -import {DARK_GRAY_COLOR, PRIMARY_COLOR, WHITE_COLOR} from 'themes/theme'; -import {useForm} from 'react-hook-form'; +import {WHITE_COLOR} from 'themes/theme'; import {categoryData} from 'components/molecules/Main/Category'; import SelectCategoryItem from 'components/atoms/CreateRecruit/CategorySelect'; @@ -31,7 +29,13 @@ export interface deliveryFeeProps { setCnt: (cnt: number) => void; } -const SelectCategoryPage = () => { +const SelectCategoryPage = props => { + console.log(props); + const defaultItem = props.route.params + ? props.route.params.defaultItem + : null; + const type = props.route.params ? props.route.params.type : 'CREATE'; + console.log(defaultItem, type); return ( { alignItems: 'center', }}> {categoryData.map( - (v, i) => i !== 0 && , + (v, i) => + i !== 0 && ( + + ), )} diff --git a/baedalmate/src/components/pages/CreateRecuit/PlaceSearch.tsx b/baedalmate/src/components/pages/CreateRecuit/PlaceSearch.tsx index 5f18249..387c017 100644 --- a/baedalmate/src/components/pages/CreateRecuit/PlaceSearch.tsx +++ b/baedalmate/src/components/pages/CreateRecuit/PlaceSearch.tsx @@ -243,7 +243,7 @@ const PlaceSearch = props => { locationList.documents[i].road_address_name, x: locationList.documents[i].x, y: locationList.documents[i].y, - data: props.route.params, + data: props.route.params.data, }); }}> 선택 diff --git a/baedalmate/src/components/pages/CreateRecuit/first.tsx b/baedalmate/src/components/pages/CreateRecuit/first.tsx index 8501866..ae359f5 100644 --- a/baedalmate/src/components/pages/CreateRecuit/first.tsx +++ b/baedalmate/src/components/pages/CreateRecuit/first.tsx @@ -30,7 +30,8 @@ import { CntInput, PriceInput, } from 'components/atoms/CreateRecruit/Input'; -import RNDateTimePicker from '@react-native-community/datetimepicker'; +import {formDigitTwo} from 'components/utils/api/Recruit'; +import DateTimePickerModal from 'react-native-modal-datetime-picker'; export interface RecruitItemProps { createDate: string; @@ -53,16 +54,24 @@ export interface RecruitItemProps { const {StatusBarManager} = NativeModules; const CreateRecruit1 = props => { + console.log(props); + + const defaultItem = props.route.params.defaultItem; const [timePicker, setTimePicker] = useState(false); - const [time, setTime] = useState(new Date(Date.now())); + const [time, setTime] = useState(new Date()); + useEffect(() => { + defaultItem && setTime(new Date(defaultItem.deadlineDate)); + }, [defaultItem]); const showTimePicker = () => { setTimePicker(true); }; - const onTimeSelected = (event, value) => { - setTime(value); + const hideTimePicker = () => { setTimePicker(false); }; - + const handleConfirm = data => { + setTime(data); + hideTimePicker(); + }; const { control, handleSubmit, @@ -71,12 +80,12 @@ const CreateRecruit1 = props => { formState: {errors}, } = useForm({ defaultValues: { - minPeople: 1, - minPrice: '', - orderHour: '', - orderMinute: '', - criteria: 'NUMBER', - freeShipping: true, + minPeople: + defaultItem && defaultItem.minPeople ? defaultItem.minPeople : 1, + minPrice: defaultItem && defaultItem.minPrice ? defaultItem.minPrice : '', + criteria: + defaultItem && defaultItem.criteria ? defaultItem.criteria : 'NUMBER', + freeShipping: defaultItem && defaultItem.shippingFee === 0 ? true : false, shippingFeeRange: [{name: ``, value: ''}], shippingFee: [{name: '', value: ''}], }, @@ -102,6 +111,14 @@ const CreateRecruit1 = props => { validate: {}, }, }); + useEffect(() => { + if (defaultItem) { + for (let i = 0; i < defaultItem.shippingFeeDetail.length; i++) { + shippingFeeAppend(defaultItem.shippingFeeDetail[i].shippingFee); + shippingFeeRangeAppend(defaultItem.shippingFeeDetail[i].upperPrice); + } + } + }, [defaultItem]); const onSubmit = data => { console.log(data); const deadline = time; @@ -156,16 +173,6 @@ const CreateRecruit1 = props => { style={{ backgroundColor: WHITE_COLOR, }}> - {/* {timePicker && ( - - )} */} { isLast={true} /> - {/* - - 금액 - - ( - - 원 - - )} - /> - {errors.minPrice && 최소 주문 금액을 입력해주세요} - */} { { justifyContent: 'center', }} onPress={showTimePicker}> - {/* 00시 00분 */} - + + + {formDigitTwo(time.getHours())} + {' '} + 시{' '} + + {formDigitTwo(time.getMinutes())} + {' '} + 분 + - {/* {show && ( - - )} */} - {/* - - 뒤 주문 */} { }}> setChecked('true')} color={PRIMARY_COLOR} uncheckedColor={MAIN_GRAY_COLOR} /> @@ -517,8 +459,6 @@ const CreateRecruit1 = props => { }}> setChecked('false')} color={PRIMARY_COLOR} uncheckedColor={MAIN_GRAY_COLOR} /> @@ -590,8 +530,6 @@ const CreateRecruit1 = props => { } /> - {/* ))} - {shippingFeeFields.map((data, index) => ( */} { { console.log(shippingFeeRangeFields, shippingFeeFields); - // setCurrentShippingFeeRange( - // Number( - // shippingFeeRangeFields[ - // shippingFeeRangeFields.length - 1 - // ].name, - // ), - // ); - // setLastShippingFeeRange(currentShippingFeeRange); - // if ( - // shippingFeeRangeFields[shippingFeeFields.length - 1] - // .name && - // shippingFeeFields[shippingFeeRangeFields.length - 1] - // .name - // ) - const values = getValues([ `shippingFee`, `shippingFeeRange`, @@ -718,18 +641,7 @@ const CreateRecruit1 = props => { marginHorizontal: 15, }}> props.navigation.navigate('상세 설정2') - // ) - } - // () => { - // // handleSubmit(onSubmit); - // props.navigation.navigate('상세 설정2'); - // } - + onPress={handleSubmit(onSubmit)} text={'다음으로'} id={1} /> @@ -793,12 +705,13 @@ const styles = StyleSheet.create({ // flex: 1, }, datePicker: { - display: 'flex', flex: 1, justifyContent: 'center', alignItems: 'center', - // width: 320, - // height: 260, + alignSelf: 'center', + color: PRIMARY_COLOR, + textDecorationColor: PRIMARY_COLOR, + backgroundColor: WHITE_COLOR, }, }); diff --git a/baedalmate/src/components/pages/CreateRecuit/fourth.tsx b/baedalmate/src/components/pages/CreateRecuit/fourth.tsx index 28e3c63..c8e526f 100644 --- a/baedalmate/src/components/pages/CreateRecuit/fourth.tsx +++ b/baedalmate/src/components/pages/CreateRecuit/fourth.tsx @@ -1,11 +1,5 @@ import React, {useEffect, useState} from 'react'; -import { - KeyboardAvoidingView, - Platform, - ScrollView, - StyleSheet, - View, -} from 'react-native'; +import {ScrollView, StyleSheet, View} from 'react-native'; import {TextKRBold, TextKRReg} from 'themes/text'; import {Fonts} from 'assets/Fonts'; @@ -18,6 +12,7 @@ import { import BtnCreateFloating from 'components/atoms/Button/BtnCreateFloating'; import MenuList from 'components/molecules/CreateRecruit/MenuList'; import { + formPrice, menuI, postRecruitAPI, postRecruitI, @@ -63,6 +58,7 @@ const CreateRecruit4 = props => { const [deliveryFee, setDeliveryFee] = useState( props.route.params.shippingFee, ); + const [shippingFee, setShippingFee] = useState(0); const [couponPrice, setCouponPrice] = useState( props.route.params.data.coupon, ); @@ -74,19 +70,21 @@ const CreateRecruit4 = props => { price += v.price * v.quantity; }); setMemuTotalPrice(price); - + // setShippingFee( + // props.route.params.shippingFee[props.route.params.shippingFee - 1] + // .shippingFee, + // ); props.route.params.shippingFee?.map((v, i) => { if ( (v.upperPrice > price && price >= v.lowerPrice) || (v.upperPrice === 0 && price >= v.lowerPrice) ) { - setShippingFee(v.shippingFee); + setShippingFee(Number(v.shippingFee)); } }); setCouponPrice(props.route.params.data.coupon); }, [menuList, deliveryFee]); console.log(menuList); - const [shippingFee, setShippingFee] = useState(0); useEffect(() => { props.route.params.shippingFee?.sort((a, b) => { @@ -177,7 +175,7 @@ const CreateRecruit4 = props => { lineHeight: 19, fontStyle: 'normal', }}> - {menuTotalPrice} 원 + {formPrice(menuTotalPrice)} 원 { display: 'flex', alignItems: 'center', }}> - {shippingFee} 원 + {formPrice(shippingFee)} 원 { lineHeight: 19, fontStyle: 'normal', }}> - {menuTotalPrice + shippingFee} 원 + {formPrice(menuTotalPrice + shippingFee)} 원 @@ -250,7 +248,7 @@ const CreateRecruit4 = props => { display: 'flex', alignItems: 'center', }}> - {couponPrice} 원 + {formPrice(couponPrice)} 원 { lineHeight: 19, fontStyle: 'normal', }}> - {menuTotalPrice + shippingFee - couponPrice} 원 + {formPrice(menuTotalPrice + shippingFee - couponPrice)} 원 @@ -295,7 +293,7 @@ const CreateRecruit4 = props => { fontSize: 24, lineHeight: 29, }}> - {menuTotalPrice + shippingFee - couponPrice} + {formPrice(menuTotalPrice + shippingFee - couponPrice)} 원 @@ -326,7 +324,7 @@ const CreateRecruit4 = props => { let data: postRecruitI = { categoryId: props.route.params.categoryId, criteria: props.route.params.criteria, - coupon: props.route.params.data.coupon, + coupon: Number(props.route.params.data.coupon), dormitory: dorm, deadlineDate: props.route.params.deadlineDate, description: props.route.params.description, diff --git a/baedalmate/src/components/pages/CreateRecuit/second.tsx b/baedalmate/src/components/pages/CreateRecuit/second.tsx index 9b62d3c..bcb848b 100644 --- a/baedalmate/src/components/pages/CreateRecuit/second.tsx +++ b/baedalmate/src/components/pages/CreateRecuit/second.tsx @@ -61,46 +61,87 @@ export const dormitoryList = [ '수림학사', ]; const CreateRecruit2 = props => { + const defaultItem = props.route.params.defaultItem; const [platform, setPlatform] = useState('BAEMIN'); const { control, handleSubmit, + reset, setValue, formState: {errors}, } = useForm({ defaultValues: { - dormitory: '누리학사', - description: '', - platform: 'BAEMIN', - coupon: 0, + dormitory: + defaultItem && defaultItem.dormitory + ? defaultItem.dormitory + : '누리학사', + description: + defaultItem && defaultItem.description ? defaultItem.description : '', + platform: + defaultItem && defaultItem.platform ? defaultItem.platform : 'BAEMIN', + coupon: defaultItem && defaultItem.coupon ? defaultItem.coupon : 0, place: { - name: '', - addressName: '', - roadAddressName: '', - x: 0, - y: 0, + name: + defaultItem && defaultItem.place.name ? defaultItem.place.name : '', + addressName: + defaultItem && defaultItem.place.addressName + ? defaultItem && defaultItem.place.addressName + : '', + roadAddressName: + defaultItem && defaultItem.place.roadAddressName + ? defaultItem && defaultItem.place.roadAddressName + : '', + x: defaultItem && defaultItem.place.x ? defaultItem.place.x : 0, + y: defaultItem && defaultItem.place.y ? defaultItem.place.y : 0, }, }, mode: 'onSubmit', shouldUnregister: false, }); + console.log(props.route.params.data); const onSubmit = data => { console.log(data); console.log(props.route.params.data); - props.navigation.navigate('상세 설정3', { - data, - categoryId: props.route.params.data.data.categoryId, - criteria: props.route.params.data.data.data.criteria, - freeShipping: props.route.params.data.data.data.freeShipping, - minPeople: props.route.params.data.data.data.minPeople, - minPrice: Number(props.route.params.data.data.data.minPrice), - deadlineDate: props.route.params.data.data.deadlineDate, - shippingFee: props.route.params.data.data.shippingFee, - }); + defaultItem + ? props.navigation.navigate('상세 설정3', { + data, + name: defaultItem.place.name ? defaultItem.place.name : '', + addressName: defaultItem.place.addressName + ? defaultItem.place.addressName + : '', + roadAddressName: defaultItem.place.roadAddressName + ? defaultItem.place.roadAddressName + : '', + x: defaultItem.place.x ? defaultItem.place.x : 0, + y: defaultItem.place.y ? defaultItem.place.y : 0, + categoryId: props.route.params.categoryId, + criteria: props.route.params.data.criteria, + freeShipping: props.route.params.data.freeShipping, + minPeople: props.route.params.data.minPeople, + minPrice: Number(props.route.params.data.minPrice), + deadlineDate: props.route.params.deadlineDate, + shippingFee: props.route.params.shippingFee, + }) + : props.navigation.navigate('상세 설정3', { + data, + categoryId: props.route.params.data.categoryId, + criteria: props.route.params.data.data.criteria, + freeShipping: props.route.params.data.data.freeShipping, + minPeople: props.route.params.data.data.minPeople, + minPrice: Number(props.route.params.data.data.minPrice), + deadlineDate: props.route.params.data.deadlineDate, + shippingFee: props.route.params.data.shippingFee, + }); }; - + // useEffect(() => { + // setValue('place.name', defaultItem.place.name); + // setValue('place.addressName', defaultItem.place.addressName); + // setValue('place.roadAddressName', defaultItem.place.roadAddressName); + // setValue('place.x', defaultItem.place.x); + // setValue('place.y', defaultItem.place.y); + // }, [defaultItem]); // const getPlace = async () => { // // const place_name = await AsyncStorage.getItem('place_name'); // // const address_name = await AsyncStorage.getItem('address_name'); @@ -282,7 +323,8 @@ const CreateRecruit2 = props => { name="place.name" control={control} rules={{ - required: true, + required: + defaultItem && defaultItem.place.name ? false : true, }} defaultValue={''} render={() => { @@ -310,23 +352,25 @@ const CreateRecruit2 = props => { value={ props.route.params.name ? props.route.params.name + : defaultItem && defaultItem.place.name + ? defaultItem.place.name : '' } onTouchStart={() => { props.navigation.navigate('배달 가게 선택', { data: props.route.params, }); - setValue('place.name', props.route.params.name); - setValue( - 'place.addressName', - props.route.params.addressName, - ); - setValue( - 'place.roadAddressName', - props.route.params.roadAddressName, - ); - setValue('place.x', Number(props.route.params.x)); - setValue('place.y', Number(props.route.params.y)); + // setValue('place.name', props.route.params.name); + // setValue( + // 'place.addressName', + // props.route.params.addressName, + // ); + // setValue( + // 'place.roadAddressName', + // props.route.params.roadAddressName, + // ); + // setValue('place.x', Number(props.route.params.x)); + // setValue('place.y', Number(props.route.params.y)); }} /> diff --git a/baedalmate/src/components/pages/CreateRecuit/third.tsx b/baedalmate/src/components/pages/CreateRecuit/third.tsx index 9f8a393..074d874 100644 --- a/baedalmate/src/components/pages/CreateRecuit/third.tsx +++ b/baedalmate/src/components/pages/CreateRecuit/third.tsx @@ -36,6 +36,8 @@ export interface RecruitItemProps { } const CreateRecruit3 = props => { + const defaultItem = props.route.params.defaultItem; + const { control, handleSubmit, @@ -43,8 +45,9 @@ const CreateRecruit3 = props => { formState: {errors}, } = useForm({ defaultValues: { - title: '', - description: '', + title: defaultItem && defaultItem.title ? defaultItem.title : '', + description: + defaultItem && defaultItem.description ? defaultItem.description : '', tags: [{tagname: ''}], }, }); diff --git a/baedalmate/src/components/utils/api/Recruit.ts b/baedalmate/src/components/utils/api/Recruit.ts index 8fb3ad5..d26e126 100644 --- a/baedalmate/src/components/utils/api/Recruit.ts +++ b/baedalmate/src/components/utils/api/Recruit.ts @@ -26,7 +26,9 @@ export const getJWTRefreshToken = async () => { export const formPrice = (text: number | undefined) => { return text?.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ','); }; - +export const formDigitTwo = (text: number | undefined) => { + return text?.toString().padStart(2, '0'); +}; export interface userMenuI { menu: menuI[]; userId: number;