Commit 19e3ba65 authored by Kim, Subin's avatar Kim, Subin
Browse files

수빈

parent 40e9133a
......@@ -6736,6 +6736,11 @@
"to-regex-range": "^5.0.1"
}
},
"filter-obj": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/filter-obj/-/filter-obj-1.1.0.tgz",
"integrity": "sha1-mzERErxsYSehbgFsbF1/GeCAXFs="
},
"finalhandler": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz",
......@@ -10790,6 +10795,22 @@
"prepend-http": "^1.0.0",
"query-string": "^4.1.0",
"sort-keys": "^1.0.0"
},
"dependencies": {
"query-string": {
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz",
"integrity": "sha1-u7aTucqRXCMlFbIosaArYJBD2+s=",
"requires": {
"object-assign": "^4.1.0",
"strict-uri-encode": "^1.0.0"
}
},
"strict-uri-encode": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
"integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
}
}
},
"npm-run-path": {
......@@ -12645,12 +12666,14 @@
"integrity": "sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA=="
},
"query-string": {
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz",
"integrity": "sha1-u7aTucqRXCMlFbIosaArYJBD2+s=",
"version": "7.0.1",
"resolved": "https://registry.npmjs.org/query-string/-/query-string-7.0.1.tgz",
"integrity": "sha512-uIw3iRvHnk9to1blJCG3BTc+Ro56CBowJXKmNNAm3RulvPBzWLRqKSiiDk+IplJhsydwtuNMHi8UGQFcCLVfkA==",
"requires": {
"object-assign": "^4.1.0",
"strict-uri-encode": "^1.0.0"
"decode-uri-component": "^0.2.0",
"filter-obj": "^1.1.0",
"split-on-first": "^1.0.0",
"strict-uri-encode": "^2.0.0"
}
},
"querystring": {
......@@ -14441,6 +14464,11 @@
}
}
},
"split-on-first": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-1.1.0.tgz",
"integrity": "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw=="
},
"split-string": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",
......@@ -14571,9 +14599,9 @@
"integrity": "sha512-AiisoFqQ0vbGcZgQPY1cdP2I76glaVA/RauYR4G4thNFgkTqr90yXTo4LYX60Jl+sIlPNHHdGSwo01AvbKUSVQ=="
},
"strict-uri-encode": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
"integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz",
"integrity": "sha1-ucczDHBChi9rFC3CdLvMWGbONUY="
},
"string-length": {
"version": "4.0.2",
......
......@@ -10,6 +10,7 @@
"bootstrap": "^5.0.2",
"bootstrap-icons": "^1.5.0",
"node-sass": "^6.0.1",
"query-string": "^7.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.0",
......
......@@ -11,26 +11,28 @@ import TheaterPage from "./pages/TheaterPage";
import MyPage from "./pages/MyPage";
import AdminPage from "./pages/AdminPage/AdminPage";
import TicketingPage from "./pages/TicketingPage";
import SearchPage from "./pages/SearchPage";
function App() {
return (
<div className="" style={{ backgroundColor: "black" }}>
<SubNav />
<Header />
<MainNav />
<Router>
<Router style={{ backgroundColor: "black" }}>
<SubNav />
<Header />
<MainNav />
<Switch>
<Route exact path="/" component={HomePage} />
<Route path="/login" component={LoginPage} />
<Route path="/signup" component={SignupPage} />
<Route path="/movielist" component={MovieListPage} />
<Route path="/movie/:movieId" component={MoviePage}/>
<Route path="/ticket" component={TicketingPage}/>
<Route path="/admin" component={AdminPage}/>
<Route path="/movie/:movieId" component={MoviePage} />
<Route path="/ticket" component={TicketingPage} />
<Route path="/search" component={SearchPage} />
<Route path="/admin" component={AdminPage} />
</Switch>
</Router>
</div>
// </div>
);
}
......
......@@ -7,6 +7,7 @@ import catchErrors from "../../utils/catchErrors.js";
import styles from "./admin.module.scss";
const MovieEdit = () => {
const [search, setSearch] = useState({ kind: "", keyword: "" })
const [movieList, setMovieList] = useState([])
const [error, setError] = useState("")
......@@ -16,7 +17,7 @@ const MovieEdit = () => {
async function getMovieList() {
try {
setError("");
setError("")
const getMovieList = await movieApi.getUpcomingfromTM()
setMovieList(getMovieList)
} catch (error) {
......@@ -24,11 +25,19 @@ const MovieEdit = () => {
}
}
async function searchMovie() {
try {
setError("")
} catch (error) {
catchErrors(error, setError)
}
}
return (
<>
{console.log("List==",movieList)}
<div className="d-flex justify-content-end mb-3">
<Search type="admin" />
{console.log("search==",search)}
<div className="d-flex justify-content-md-end justify-content-center mb-3">
<Search type="admin" search={search} setSearch={setSearch} handleClick={searchMovie} />
</div>
<MovieTable movieList={movieList} />
<div className="d-flex flex-wrap">
......
@media screen and (max-width: 767px) {
@media screen and (max-width: 768px) {
.box {
margin-bottom: 100px;
......
......@@ -106,6 +106,7 @@ const KakaoMap = ({ keyword, cinemaInfo, setCinemaInfo }) => {
i;
for (i = 1; i <= pagination.last; i++) {
// let el = <a>{i}</a>
let el = document.createElement('a');
// el.href = "#";
el.innerHTML = i;
......
......@@ -6,7 +6,7 @@
word-break: keep-all;
}
@media screen and (max-width: 767px) {
@media screen and (max-width: 768px) {
.tableForm {
border-top: 2px solid;
......
import { useState } from "react";
import { useHistory } from "react-router";
import Search from "../Search";
const MainNav = () => {
const [search, setSearch] = useState({ keyword: "" })
const history = useHistory()
function searchMovie() {
history.push(`/search?title=${search.keyword}`)
}
return (
<nav class="nav justify-content-evenly border border-start-0 border-end-0 border-white border-2 py-1">
<a class="nav-link text-white" href="/movielist">영화</a>
<a class="nav-link text-white" href="/ticket">빠른예매</a>
<a class="nav-link text-white" href="#">극장</a>
<Search type="home" />
<Search type="home" search={search} setSearch={setSearch} handleClick={searchMovie} />
</nav>
)
}
......
import styles from "./search.module.scss";
const Search = ({ type }) => {
console.log("type==",type)
const Search = ({ type, search, setSearch, handleClick }) => {
function handleSearch(e) {
const { name, value } = e.target
setSearch({ ...search, [name]: value })
}
console.log("type==", type)
return (
<div className="d-flex">
<input className="form-control" type="text" id={type === "home" ? styles.searchWhite : styles.search} />
<i className={`bi bi-search align-self-center ${type === "home" ? "text-white" : "mx-2"} ${styles.icon}`} style={{ fontSize: "1.3rem" }}></i>
{type === "home" ? null :
<select className={`form-select ${styles.search}`} name="kind" aria-label="select search" onChange={handleSearch}>
<option selected value="title">제목</option>
<option value="director">감독명</option>
</select>
}
<input className={`form-control ${type === "home" ? styles.searchWhite : `${styles.search}`}`} name="keyword" type="text" onChange={handleSearch} />
<i className={`bi bi-search align-self-center ${type === "home" ? "text-white" : "mx-2"} ${styles.icon}`} onClick={handleClick} style={{ fontSize: "1.3rem" }}></i>
</div>
)
}
......
......@@ -2,7 +2,7 @@
cursor: pointer;
}
#searchWhite {
.searchWhite {
background: transparent;
border: none;
border-bottom: 2px solid #fff;
......@@ -21,8 +21,7 @@
}
}
#search {
background: transparent;
.search {
border: none;
border-bottom: 2px solid #000;
border-radius: 0;
......
import { useLocation } from 'react-router-dom';
import queryString from 'query-string';
import MovieChart from "./MovieChart/index.js";
const SearchResult = () => {
const { search } = useLocation()
const { title } = queryString.parse(search)
console.log("search==",search,"title==",title)
return (
<>
<h3 className="text-white text-center my-5">'{title}' 관한 검색 결과입니다.</h3>
<MovieChart />
</>
)
}
export default SearchResult
\ No newline at end of file
import SearchResult from "../components/SearchResult.js";
const SearchPage = () => {
return (
<SearchResult />
)
}
export default SearchPage
\ No newline at end of file
......@@ -41,7 +41,7 @@ $theme-colors: map-merge($theme-colors, $custom-colors);
font-style: normal;
}
@media (max-width: 767px) {
@media (max-width: 768px) {
// .carousel-inner .carousel-item > div {
// display: none;
// }
......
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