Commit 8087c9bc authored by Kim, Subin's avatar Kim, Subin
Browse files

TicketEditForm UI 완성

parent 2c7fb054
......@@ -16,7 +16,7 @@ const INIT_TICKETFEE = {
defaultPrice: 5000
}
const TicketEditForm = ({ editFee }) => {
const TicketEditForm = ({ editFee, formRef }) => {
const [ticketFee, setTicketFee] = useState(INIT_TICKETFEE)
const [error, setError] = useState("")
......@@ -42,56 +42,56 @@ const TicketEditForm = ({ editFee }) => {
}
return (
<form onSubmit={handleSubmit}>
<div className="d-flex mb-3">
<label for="theaterType" className="col-form-label">상영관 종류</label>
<div className="">
<form ref={formRef} onSubmit={handleSubmit}>
<div className="d-flex row row-cols-2 mb-2 mb-md-3 gx-0 gy-2 gy-md-0">
<label for="theaterType" className="col-md-auto col-form-label text-center text-md-start">상영관 종류</label>
<div className="col-md-4 col-lg-3 mx-md-2">
<input className={`form-control ${styles.shadowNone}`} type="text" id="theaterType" name="theaterType" value={ticketFee.theaterType} onChange={handleChange} />
</div>
<label for="defaultPrice" className="col-form-label">기본 가격</label>
<div className="">
<label for="defaultPrice" className="col-md-auto col-form-label text-center text-md-start">기본 가격</label>
<div className="col-md-3 col-lg-2 mx-md-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="defaultPrice" name="defaultPrice" value={ticketFee.defaultPrice} onChange={handleChange} />
</div>
</div>
<div className="d-flex mb-3">
<label for="weekdays" className="col-form-label">주중</label>
<div className="">
<div className="d-flex row row-cols-2 mb-2 mb-md-3 gx-0 gy-2 gy-md-0">
<label for="weekdays" className="col-md-1 col-form-label text-center text-md-start">주중</label>
<div className="col-md-3 col-lg-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="weekdays" name="weekdays" value={ticketFee.weekdays} onChange={handleChange} />
</div>
<label for="weekend" className="col-form-label">주말</label>
<div className="">
<label for="weekend" className="col-md-1 col-form-label text-center">주말</label>
<div className="col-md-3 col-lg-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="weekend" name="weekend" value={ticketFee.weekend} onChange={handleChange} />
</div>
</div>
<div className="d-flex mb-3">
<label for="morning" className="col-form-label">조조</label>
<div className="">
<div className="d-flex row row-cols-2 mb-2 mb-md-3 gx-0 gy-2 gy-md-0">
<label for="morning" className="col-md-1 col-form-label text-center text-md-start">조조</label>
<div className="col-md-3 col-lg-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="morning" name="morning" value={ticketFee.morning} onChange={handleChange} />
</div>
<label for="day" className="col-form-label">일반</label>
<div className="">
<label for="day" className="col-md-1 col-form-label text-center">일반</label>
<div className="col-md-3 col-lg-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="day" name="day" value={ticketFee.day} onChange={handleChange} />
</div>
<label for="night" className="col-form-label">심야</label>
<div className="">
<label for="night" className="col-md-1 col-form-label text-center">심야</label>
<div className="col-md-3 col-lg-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="night" name="night" value={ticketFee.night} onChange={handleChange} />
</div>
</div>
<div className="d-flex mb-3">
<label for="youth" className="col-form-label">청소년</label>
<div className="">
<div className="d-flex row row-cols-2 flex-wrap flex-lg-nowrap mb-2 mb-md-3 gx-0 gy-2 gy-md-0">
<label for="youth" className="col-md-1 col-form-label text-center text-md-start">청소년</label>
<div className="col-md-3 col-lg-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="youth" name="youth" value={ticketFee.youth} onChange={handleChange} />
</div>
<label for="adult" className="col-form-label">일반</label>
<div className="">
<label for="adult" className="col-md-1 col-form-label text-center">일반</label>
<div className="col-md-3 col-lg-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="adult" name="adult" value={ticketFee.adult} onChange={handleChange} />
</div>
<label for="senior" className="col-form-label">경로</label>
<div className="">
<label for="senior" className="col-md-1 col-form-label text-center">경로</label>
<div className="col-md-3 col-lg-2">
<input className={`form-control ${styles.shadowNone}`} type="number" id="senior" name="senior" value={ticketFee.senior} onChange={handleChange} />
</div>
<div>
<button type="submit" className={`btn btn-dark ${styles.customBtn}`}>추가</button>
<div className="col-12 col-md-2 col-lg-1 ms-lg-auto mt-md-2 mt-lg-0">
<button type="submit" className={`btn btn-dark w-100 ${styles.customBtn}`}>추가</button>
</div>
</div>
</form>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment