Skip to content

5
59110440259
Commit 994792a7 authored by Piyaphorn Arphornsri's avatar Piyaphorn Arphornsri
Browse files
Options

add web

parent b8172a1d
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 780 additions and 373 deletions
Backend/controllers/auth/index.js
View file @ 994792a7
const User = require("../../models/user"); const User = require("../../models/user");
const bcryptjs= require('bcryptjs'); const bcryptjs = require("bcryptjs");
const JWT = require('jsonwebtoken'); const JWT = require("jsonwebtoken");
const config =require('../../config') const config = require("../../config");
exports.getUserById = async (req, res) => { exports.getUserById = async (req, res) => {
console.log("here");
try { try {
console.log("req.param", req.param);
const userId = req.params.id; const userId = req.params.id;
const user = await User.findOne({ const user = await User.findOne({
where: { id: userId } where: { id: userId }
...@@ -43,3 +45,31 @@ exports.register = async (req, res) => { ...@@ -43,3 +45,31 @@ exports.register = async (req, res) => {
res.sendStatus(401); res.sendStatus(401);
} }
}; };
exports.login = async (req, res) => {
const loginData = req.body;
const user = await User.findOne({
where: { email: loginData.email }
});
if (!User) {
return res.status(400).json({ message: "รหัสผ่านไม่ถูกต้อง" });
} else {
const chkPassword = await bcryptjs.compare(
loginData.password,
user.dataValues.password
);
if (chkPassword === false) {
return res.status(400).json({ message: "รหัสผ่านไม่ถูกต้อง" });
}
const token = await createToken(user.dataValues.id);
res.status(200).json({success})
}
};
exports.currentUser = async (req, res) =>{
const token = req.headers.token;
const decode = await JWT.verify(token, config.JWT_SECRET)
const user = await User.findOne({
where: {
id: decode.id
}
})
}
\ No newline at end of file
Backend/models/booking/index.js
View file @ 994792a7
const Sequelize = require("sequelize"); const Sequelize = require("sequelize");
const db = require("../../db"); const db = require("../../db");
module.exports = db.sequelize.define("users", { module.exports = db.sequelize.define("booking", {
bookingID: { bookingID: {
type: Sequelize.INTEGER, type: Sequelize.INTEGER,
primaryKey: true, primaryKey: true,
......
Backend/models/list/index.js
View file @ 994792a7
const Sequelize = require("sequelize"); const Sequelize = require("sequelize");
const db = require("../../db"); const db = require("../../db");
module.exports = db.sequelize.define("users", { module.exports = db.sequelize.define("list", {
listID: { listID: {
type: Sequelize.INTEGER, type: Sequelize.INTEGER,
primaryKey: true, primaryKey: true,
......
Backend/models/promotion/index.js
View file @ 994792a7
const Sequelize = require("sequelize"); const Sequelize = require("sequelize");
const db = require("../../db"); const db = require("../../db");
module.exports = db.sequelize.define("users", { module.exports = db.sequelize.define("promotion", {
promotionID: { promotionID: {
type: Sequelize.INTEGER, type: Sequelize.INTEGER,
primaryKey: true, primaryKey: true,
......
Backend/models/reviews/index.js
View file @ 994792a7
const Sequelize = require("sequelize"); const Sequelize = require("sequelize");
const db = require("../../db"); const db = require("../../db");
module.exports = db.sequelize.define("users", { module.exports = db.sequelize.define("reviwes", {
reviewsID: { reviewsID: {
type: Sequelize.INTEGER, type: Sequelize.INTEGER,
primaryKey: true, primaryKey: true,
......
Backend/models/shop/index.js
View file @ 994792a7
const Sequelize = require("sequelize"); const Sequelize = require("sequelize");
const db = require("../../db"); const db = require("../../db");
module.exports = db.sequelize.define("users", { module.exports = db.sequelize.define("shop", {
shopID: { shopID: {
type: Sequelize.INTEGER, type: Sequelize.INTEGER,
primaryKey: true, primaryKey: true,
......
Backend/models/shopimage/index.js 0 → 100644
View file @ 994792a7
const Sequelize = require("sequelize");
const db = require("../../db");
module.exports = db.sequelize.define("shopimage", {
shopImageID: {
type: Sequelize.INTEGER,
primaryKey: true,
autoIncrement: true
},
shopImagePic: {
type: Sequelize.STRING
},
shopID: {
type: Sequelize.INTEGER
}
});
Backend/models/userShopOwner/index.js
View file @ 994792a7
const Sequelize = require("sequelize"); const Sequelize = require("sequelize");
const db = require("../../db"); const db = require("../../db");
module.exports = db.sequelize.define("users", { module.exports = db.sequelize.define("usersShopOwner", {
userShopOwnerID: { userShopOwnerID: {
type: Sequelize.INTEGER, type: Sequelize.INTEGER,
primaryKey: true, primaryKey: true,
...@@ -19,5 +19,11 @@ module.exports = db.sequelize.define("users", { ...@@ -19,5 +19,11 @@ module.exports = db.sequelize.define("users", {
}, },
userShopOwnerAddress: { userShopOwnerAddress: {
type: Sequelize.STRING type: Sequelize.STRING
},
userShoppownerTel: {
type: Sequelize.STRING
},
userShopOwnerPic: {
type: Sequelize.STRING
} }
}); });
Backend/models/userbeautician/index.js
View file @ 994792a7
const Sequelize = require("sequelize"); const Sequelize = require("sequelize");
const db = require("../../db"); const db = require("../../db");
module.exports = db.sequelize.define("users", { module.exports = db.sequelize.define("userbeautician", {
userbeauticianID: { userbeauticianID: {
type: Sequelize.INTEGER, type: Sequelize.INTEGER,
primaryKey: true, primaryKey: true,
...@@ -20,7 +20,13 @@ module.exports = db.sequelize.define("users", { ...@@ -20,7 +20,13 @@ module.exports = db.sequelize.define("users", {
userbeauticianAddres: { userbeauticianAddres: {
type: Sequelize.STRING type: Sequelize.STRING
}, },
userbeauticianTel: {
type: Sequelize.STRING
},
shopID: { shopID: {
type: Sequelize.STRING type: Sequelize.STRING
},
userbeauticianPic: {
type: Sequelize.STRING
} }
}); });
Backend/models/userbeauticianImg/index.js 0 → 100644
View file @ 994792a7
const Sequelize = require("sequelize");
const db = require("../../db");
module.exports = db.sequelize.define("beauticianImage", {
beauticianImgID: {
type: Sequelize.INTEGER,
primaryKey: true,
autoIncrement: true
},
beauticianImgPic: {
type: Sequelize.STRING
},
userbeauticianImgID: {
type: Sequelize.INTEGER
}
});
b_beauty_project/public/index.html
View file @ 994792a7
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" /> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
</head> </head>
<body> <body bgcolor="EEEEEE">
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div> <div id="root"></div>
</body> </body>
......
b_beauty_project/src/views/BeauticianShopPage/Home/index.js
View file @ 994792a7
...@@ -114,7 +114,7 @@ class ResponsiveDrawer extends Component { ...@@ -114,7 +114,7 @@ class ResponsiveDrawer extends Component {
<ListItemIcon> <ListItemIcon>
<InboxIcon /> <InboxIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText primary="โปรไฟล์ร้าน" /> <ListItemText primary="โปรไฟล์" />
</ListItem> </ListItem>
<ListItem <ListItem
......
b_beauty_project/src/views/BeauticianShopPage/Work/index.js
View file @ 994792a7
import React, { Component } from "react"; import React, { Component } from "react";
import { withStyles } from "@material-ui/core/styles"; import { withStyles, makeStyles } from "@material-ui/core/styles";
import {
Dialog,
Button,
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
Paper,
InputBase,
Divider,
IconButton
} from "@material-ui/core";
import AppBra from "../../../components/AppBra";
import { withRouter } from "react-router-dom"; import { withRouter } from "react-router-dom";
import compose from "recompose/compose"; import compose from "recompose/compose";
import { DatePicker } from "@material-ui/pickers";
import { injectIntl, FormattedRelativeTime } from "react-intl";
import { th } from "date-fns/locale"; import { th } from "date-fns/locale";
import { format } from "date-fns"; import { format } from "date-fns";
import { MenuIcon } from "@material-ui/icons/Menu"; import { MenuIcon } from "@material-ui/icons/Menu";
import Fab from "@material-ui/core/Fab";
import AddIcon from "@material-ui/icons/Add";
import Table from "@material-ui/core/Table";
import TableBody from "@material-ui/core/TableBody";
import TableCell from "@material-ui/core/TableCell";
import TableContainer from "@material-ui/core/TableContainer";
import TableHead from "@material-ui/core/TableHead";
import TableRow from "@material-ui/core/TableRow";
import DeleteIcon from "@material-ui/icons/Delete";
import EditIcon from "@material-ui/icons/Edit";
import Input from "@material-ui/core/Input";
import InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment";
import FormControl from "@material-ui/core/FormControl";
import TextField from "@material-ui/core/TextField";
import Grid from "@material-ui/core/Grid";
import AccountCircle from "@material-ui/icons/AccountCircle";
import AddPhotoAlternateIcon from "@material-ui/icons/AddPhotoAlternate";
import MailOutlineIcon from "@material-ui/icons/MailOutline";
import VpnKeyIcon from "@material-ui/icons/VpnKey";
import TextareaAutosize from "@material-ui/core/TextareaAutosize";
import ContactPhoneIcon from "@material-ui/icons/ContactPhone";
import BusinessIcon from "@material-ui/icons/Business";
import { DatePicker } from "@material-ui/pickers";
import { injectIntl, FormattedRelativeTime } from "react-intl";
import { import {
MuiPickersUtilsProvider, MuiPickersUtilsProvider,
KeyboardTimePicker, KeyboardTimePicker,
KeyboardDatePicker, KeyboardDatePicker,
} from '@material-ui/pickers'; } from '@material-ui/pickers';
import MaterialTable from "material-table";
const styles = theme => ({ const styles = theme => ({
root: { root: {
...@@ -23,41 +62,184 @@ const styles = theme => ({ ...@@ -23,41 +62,184 @@ const styles = theme => ({
"@media all and (-ms-high-contrast: none)": { "@media all and (-ms-high-contrast: none)": {
display: "none" display: "none"
} }
},
modal: {
display: "flex",
padding: theme.spacing(1),
alignItems: "center",
justifyContent: "center"
},
fab: {
position: "absolute",
bottom: theme.spacing(2),
right: theme.spacing(2)
}
});
const StyledTableCell = withStyles(theme => ({
head: {
backgroundColor: theme.palette.common.black,
color: theme.palette.common.white
},
body: {
fontSize: 14
}
}))(TableCell);
const StyledTableRow = withStyles(theme => ({
root: {
"&:nth-of-type(odd)": {
backgroundColor: theme.palette.background.default
}
}
}))(TableRow);
function createData(name, email, address, phonenumber, edit, action) {
return { name, email, address, phonenumber, edit, action };
}
const rows = [
createData(
"Frozen yoghurt",
"email@mmmj",
"ที่อยู่ 120/255 มหาวิทยาลัยุบลราชธานี ",
" 012455887",
<EditIcon />,
<DeleteIcon />
)
];
const useStyles = makeStyles({
table: {
minWidth: 700
} }
}); });
class Work extends Component { class Work extends Component {
state = { state = {
open: false,
columns: [
{ title: "ชื่อคนจอง", field: "name" },
{ title: "รายการจอง", field: "list" },
{ title: "เวลาที่จอง", field: "time" },
],
data: [
{ name: "Mehmet", surname: "Baran", birthYear: 1987, birthCity: 63 },
],
selectedDate : new Date() selectedDate : new Date()
}; };
handleChangeDate = newDate => { handleChangeDate = newDate => {
console.log("newDate: ", newDate); console.log("newDate: ", newDate);
this.setState({ this.setState({
date: newDate date: newDate
}); });
}; };
handleClickOpen = () => {
this.setState({
open: true
});
};
handleClose = () => {
this.setState({
open: false
});
};
handleCloseAndSave = () => {
//Save to db
this.setState(prevState => {
const data = [...prevState.data];
const newData = {
name: "Mehmet",
surname: "Baran",
birthYear: 1987,
birthCity: 63
};
data.push(newData);
return { ...prevState, data: data, open: false };
});
// this.setState({
// open: false
// });
};
componentDidMount = () => {
let { pathname } = this.props.location;
pathname = pathname.substring(1, pathname.length);
// console.log('pathname', pathname)
};
render() { render() {
const { classes } = this.props; const { classes } = this.props;
// const tab = this.state.tab;
// หรือ const { open, columns, data, selectedDate } = this.state;
const { selectedDate } = this.state;
return ( return (
<div>
<div className="row center"> <div className="row center">
<KeyboardDatePicker <KeyboardDatePicker
disableToolbar disableToolbar
variant="inline" variant="inline"
format="dd/MM/yyyy" format="dd/MM/yyyy"
margin="normal" margin="normal"
id="date-picker-inline" id="date-picker-inline"
label="เลือกวันที่" label="เลือกวันที่"
value={selectedDate} value={selectedDate}
onChange={this.handleDateChange} onChange={this.handleDateChange}
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', "aria-label": "change date"
}} }}
/> />
</div>
<div className="row">
<MaterialTable
title="ตารางงาน"
columns={columns}
data={data}
options={{
selection: false
}}
editable={{
// onRowAdd: newData =>
// new Promise(resolve => {
// setTimeout(() => {
// resolve();
// this.setState(prevState => {
// const data = [...prevState.data];
// data.push(newData);
// return { ...prevState, data };
// });
// }, 600);
// }),
// onRowUpdate: (newData, oldData) =>
// new Promise(resolve => {
// setTimeout(() => {
// resolve();
// if (oldData) {
// this.setState(prevState => {
// const data = [...prevState.data];
// data[data.indexOf(oldData)] = newData;
// return { ...prevState, data };
// });
// }
// }, 600);
// }),
// onRowDelete: oldData =>
// new Promise(resolve => {
// setTimeout(() => {
// resolve();
// this.setState(prevState => {
// const data = [...prevState.data];
// data.splice(data.indexOf(oldData), 1);
// return { ...prevState, data };
// });
// }, 600);
// })
}}
/>
</div>
</div> </div>
); );
} }
......
b_beauty_project/src/views/HomePage/index.js
View file @ 994792a7
...@@ -19,21 +19,15 @@ import { DatePicker } from "@material-ui/pickers"; ...@@ -19,21 +19,15 @@ import { DatePicker } from "@material-ui/pickers";
import { injectIntl, FormattedRelativeTime } from "react-intl"; import { injectIntl, FormattedRelativeTime } from "react-intl";
import { th } from "date-fns/locale"; import { th } from "date-fns/locale";
import { format } from "date-fns"; import { format } from "date-fns";
import { MenuIcon } from "@material-ui/icons/Menu"; import MenuIcon from "@material-ui/icons/Menu";
import TextField from "@material-ui/core/TextField"; import TextField from "@material-ui/core/TextField";
import SearchIcon from "@material-ui/icons/Search"; import SearchIcon from "@material-ui/icons/Search";
import DirectionsIcon from "@material-ui/icons/Directions"; import DirectionsIcon from "@material-ui/icons/Directions";
import Rating from "@material-ui/lab/Rating";
const styles = theme => ({ const styles = theme => ({
root: { root: {
height: 150,
flexGrow: 1,
transform: "translateZ(0)",
// The position fixed scoping doesn't work in IE 11.
// Disable this demo to preserve the others.
"@media all and (-ms-high-contrast: none)": {
display: "none"
},
padding: "2px 4px", padding: "2px 4px",
display: "flex", display: "flex",
alignItems: "center", alignItems: "center",
...@@ -62,7 +56,8 @@ class HomePage extends Component { ...@@ -62,7 +56,8 @@ class HomePage extends Component {
state = { state = {
tab: 0, tab: 0,
date: new Date(), date: new Date(),
open: false open: false,
rating: 0
}; };
handleClickOpen = () => { handleClickOpen = () => {
this.setState({ this.setState({
...@@ -130,59 +125,86 @@ class HomePage extends Component { ...@@ -130,59 +125,86 @@ class HomePage extends Component {
const { classes } = this.props; const { classes } = this.props;
// const tab = this.state.tab; // const tab = this.state.tab;
// หรือ // หรือ
const { tab, date, open, value } = this.state; const { tab, date, open, value, rating } = this.state;
return ( return (
<div> <div>
<AppBra tab={tab} handleChangeTab={this.handleChangeTab} /> <AppBra tab={tab} handleChangeTab={this.handleChangeTab} />
<div className="row center"> <br />
<div className="row mt-2 mb-2"> <div className="row ">
<div> <div className="row mt-2 mb-2 ">
<Paper component="form" className={classes.root}> <div className="row ">
<IconButton className={classes.iconButton} aria-label="menu"> <center>
<Paper component="form" className={classes.root}>
{/* <IconButton className={classes.iconButton} aria-label="menu">
<MenuIcon /> <MenuIcon />
</IconButton> </IconButton> */}
<InputBase <InputBase
className={classes.input} className={classes.input}
placeholder="Search Google Maps" inputProps={{ "aria-label": "ค้นหาร้าน" }}
inputProps={{ "aria-label": "search google maps" }} />
/> <IconButton
<IconButton type="submit"
type="submit" className={classes.iconButton}
className={classes.iconButton} aria-label="search"
aria-label="search" >
> <SearchIcon />
<SearchIcon /> </IconButton>
</IconButton> {/* <Divider className={classes.divider} orientation="vertical" /> */}
<Divider className={classes.divider} orientation="vertical" /> {/* <IconButton
<IconButton
color="primary" color="primary"
className={classes.iconButton} className={classes.iconButton}
aria-label="directions" aria-label="directions"
> >
<DirectionsIcon /> <DirectionsIcon />
</IconButton> </IconButton> */}
</Paper> </Paper>
</center>
</div> </div>
</div> </div>
<div className="row mt-2 mb-2"> <div className="row mt-2 mb-2 center">
<div className="col s12 m6 l6"> <div className="col s12 m16 l16">
<h3>ชื่อ</h3> <h3>ชื่อ</h3>
</div> </div>
</div> </div>
<div className="row mt-2 mb-2"> <div className="row mt-2 mb-2 ">
<div className="col s12 m6 l6"> <div className="col s12 m6 l8">
<img <div className="row center">
src="https://www.smeleader.com/wp-content/uploads/2018/05/%E0%B9%81%E0%B8%9F%E0%B8%A3%E0%B8%99%E0%B9%84%E0%B8%8A%E0%B8%AA%E0%B9%8C%E0%B8%A3%E0%B9%89%E0%B8%B2%E0%B8%99%E0%B9%80%E0%B8%AA%E0%B8%A3%E0%B8%B4%E0%B8%A1%E0%B8%AA%E0%B8%A7%E0%B8%A2-%E0%B8%A3%E0%B8%A7%E0%B8%A1%E0%B9%81%E0%B8%9A%E0%B8%A3%E0%B8%99%E0%B8%94%E0%B9%8C%E0%B8%A3%E0%B9%89%E0%B8%B2%E0%B8%99%E0%B8%8B%E0%B8%B2%E0%B8%A5%E0%B8%AD%E0%B8%99-%E0%B8%AA%E0%B8%B2%E0%B8%99%E0%B8%9D%E0%B8%B1%E0%B8%99%E0%B8%98%E0%B8%B8%E0%B8%A3%E0%B8%81%E0%B8%B4%E0%B8%88%E0%B8%97%E0%B8%A3%E0%B8%87%E0%B8%9C%E0%B8%A1.jpg" <img
width="70%" src="https://www.smeleader.com/wp-content/uploads/2018/05/%E0%B9%81%E0%B8%9F%E0%B8%A3%E0%B8%99%E0%B9%84%E0%B8%8A%E0%B8%AA%E0%B9%8C%E0%B8%A3%E0%B9%89%E0%B8%B2%E0%B8%99%E0%B9%80%E0%B8%AA%E0%B8%A3%E0%B8%B4%E0%B8%A1%E0%B8%AA%E0%B8%A7%E0%B8%A2-%E0%B8%A3%E0%B8%A7%E0%B8%A1%E0%B9%81%E0%B8%9A%E0%B8%A3%E0%B8%99%E0%B8%94%E0%B9%8C%E0%B8%A3%E0%B9%89%E0%B8%B2%E0%B8%99%E0%B8%8B%E0%B8%B2%E0%B8%A5%E0%B8%AD%E0%B8%99-%E0%B8%AA%E0%B8%B2%E0%B8%99%E0%B8%9D%E0%B8%B1%E0%B8%99%E0%B8%98%E0%B8%B8%E0%B8%A3%E0%B8%81%E0%B8%B4%E0%B8%88%E0%B8%97%E0%B8%A3%E0%B8%87%E0%B8%9C%E0%B8%A1.jpg"
></img> width="70%"
></img>
</div>
</div> </div>
<div className="col s12 m6 l6"> <div className="col s12 m6 l4">
<div className="row"> <div className="row">
<h4>ที่อยู่ร้าน</h4> <h4>
ที่อยู่ : 85 Sathonlamak Rd, Mueang Si Khai, Warin Chamrap
District, Ubon Ratchathani 34190
</h4>
</div> </div>
<div className="row"> <div className="row">
<h4>
โปรโมชั่น : จองคิวผ่าน B Beauty ลด 5 %
</h4>
</div>
<div className="row">
<Rating
name="simple-controlled"
value={rating}
size="large"
onChange={(event, newValue) => {
//change rating
this.setState({
rating: newValue
});
}}
/>
</div>
<div className="row center">
<Button <Button
variant="outlined" variant="outlined"
color="primary" color="primary"
......
b_beauty_project/src/views/LoginPage/index.js
View file @ 994792a7
import React from "react"; import React, { Component } from "react";
import { makeStyles } from "@material-ui/core/styles"; import { withStyles } from "@material-ui/core/styles";
import { withRouter } from "react-router-dom";
import compose from "recompose/compose";
import Input from "@material-ui/core/Input"; import Input from "@material-ui/core/Input";
import InputLabel from "@material-ui/core/InputLabel"; import InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment"; import InputAdornment from "@material-ui/core/InputAdornment";
...@@ -12,65 +14,66 @@ import MailOutlineIcon from "@material-ui/icons/MailOutline"; ...@@ -12,65 +14,66 @@ import MailOutlineIcon from "@material-ui/icons/MailOutline";
import VpnKeyIcon from "@material-ui/icons/VpnKey"; import VpnKeyIcon from "@material-ui/icons/VpnKey";
import Button from "@material-ui/core/Button"; import Button from "@material-ui/core/Button";
const useStyles = makeStyles(theme => ({
const styles = theme => ({
root: { root: {
"& > *": { "& > *": {
margin: theme.spacing(1), margin: theme.spacing(1),
width: 200 width: 200
} }
} }
})); });
class Login extends Component {
export default function BasicTextFields() { render() {
const classes = useStyles(); const {classes} = this.props;
return ( return (
<div> <div>
<div className="row center"> <div className="row center">
<h2>เข้าสู่ระบบ</h2> <h2>เข้าสู่ระบบ</h2>
<div> <div>
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-uncontrolled" id="outlined-uncontrolled"
label="E_mail" label="E_mail"
variant="outlined"
variant="outlined" InputProps={{
InputProps={{ startAdornment: (
startAdornment: ( <InputAdornment position="start">
<InputAdornment position="start"> <MailOutlineIcon />
<MailOutlineIcon /> </InputAdornment>
</InputAdornment> )
) }}
}} />
/> </div>
</div><br></br> <br></br>
<div> <div>
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-password-input" id="outlined-password-input"
label="Password" label="Password"
type="password" type="password"
autoComplete="current-password" autoComplete="current-password"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<VpnKeyIcon /> <VpnKeyIcon />
</InputAdornment> </InputAdornment>
) )
}} }}
/> />
</div><br></br> </div>
<div> <br></br>
<Button variant="contained" color="primary" disableElevation> <div>
เข้าสู่ระบบ <Button variant="contained" color="primary" disableElevation>
</Button> เข้าสู่ระบบ
<h5>หรือ</h5> </Button>
<Button variant="contained" color="primary" disableElevation>
เข้าสู่ระบบด้วย Facebook </div>
</Button>
</div> </div>
</div> </div>
</div> );
); }
} }
export default compose(withStyles(styles), withRouter)(Login);
b_beauty_project/src/views/RigisterPage/index.js
View file @ 994792a7
import React from "react"; import React, { Component } from "react";
import { makeStyles } from "@material-ui/core/styles"; import { withStyles } from "@material-ui/core/styles";
import Input from "@material-ui/core/Input"; import { Input, InputLabel } from "@material-ui/core";
import InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment"; import InputAdornment from "@material-ui/core/InputAdornment";
import FormControl from "@material-ui/core/FormControl"; import FormControl from "@material-ui/core/FormControl";
import TextField from "@material-ui/core/TextField"; import TextField from "@material-ui/core/TextField";
...@@ -12,110 +11,184 @@ import MailOutlineIcon from "@material-ui/icons/MailOutline"; ...@@ -12,110 +11,184 @@ import MailOutlineIcon from "@material-ui/icons/MailOutline";
import VpnKeyIcon from "@material-ui/icons/VpnKey"; import VpnKeyIcon from "@material-ui/icons/VpnKey";
import Button from "@material-ui/core/Button"; import Button from "@material-ui/core/Button";
const useStyles = makeStyles(theme => ({ import axios from "axios";
import { withRouter } from "react-router-dom";
import compose from "recompose/compose";
const styles = theme => ({
margin: { margin: {
margin: theme.spacing(1) margin: theme.spacing(1)
} }
})); });
export default function InputWithIcon() { class RegisterPage extends Component {
const classes = useStyles(); state = {
name: "",
email: "",
password: "",
password2: "",
image: ""
};
return ( handleChange = event => {
<div className="row center"> console.log("name : ", event.target.name);
<h2>ลงทะเบียน</h2> console.log("value : ", event.target.value);
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อ-สกุล"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
<TextField this.setState({
className={classes.margin} [event.target.name]: event.target.value
id="outlined-uncontrolled" });
label="E_mail"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<MailOutlineIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-password-input"
label="Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
<TextField // this.setState({
className={classes.margin} // name: name,
id="outlined-password-input" // email: email,
label="Confirm-Password" // password: password,
type="password" // password2: password2,
autoComplete="current-password" // image: image
variant="outlined" // });
InputProps={{ };
startAdornment: (
<InputAdornment position="start"> render() {
<VpnKeyIcon /> const { classes } = this.props;
</InputAdornment> // const { } = this.state;
) const { name, email, password, password2, image } = this.state;
}} return (
/> <div className="row center">
</div> <h2>ลงทะเบียน</h2>
<br></br> <br></br>
<div> <div>
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-file-input" id="name"
label="เพิ่มรูปภาพ" name="name"
type="file" value={name}
autoComplete="current-password" label="ชื่อ-สกุล"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<AddPhotoAlternateIcon /> <AccountCircle />
</InputAdornment> </InputAdornment>
) )
}} }}
/> onChange={this.handleChange}
</div> />
<br></br>
<div className={classes.root}> <TextField
<Button variant="contained" color="secondary"> className={classes.margin}
ยกเลิก id="email"
</Button>{" "} name="email"
&nbsp; &nbsp; &nbsp; value={email}
<Button variant="contained" color="primary"> label="E_mail"
ลงทะเบียน variant="outlined"
</Button> InputProps={{
startAdornment: (
<InputAdornment position="start">
<MailOutlineIcon />
</InputAdornment>
)
}}
onChange={this.handleChange}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="password"
name="password"
value={password}
label="Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
onChange={this.handleChange}
/>
<TextField
className={classes.margin}
id="password2"
name="password2"
value={password2}
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
onChange={this.handleChange}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="image"
name="image"
value={image}
label="เพิ่มรูปภาพ"
type="file"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AddPhotoAlternateIcon />
</InputAdornment>
)
}}
onChange={this.handleChange}
/>
</div>
<br></br>
<div className={classes.root}>
<Button variant="contained" color="secondary">
ยกเลิก
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button
variant="contained"
color="primary"
onClick={() => {
if (password === password2) {
axios
.post("http://localhost:9000/api/auth/register", {
email: email,
password: password,
name: name,
image: image
})
.then(response => {
console.log("สร้างผู้ใช้สำเร็จ", response);
window.location.href = "/";
})
.catch(error => {
console.log(error);
});
// alert("ลงทะเบียนสำเร็จ");
} else {
alert("password ไม่ตรงกันโว๊ยยยย");
}
}}
>
ลงทะเบียน
</Button>
</div>
</div> </div>
</div> );
); }
} }
export default compose(withStyles(styles), withRouter)(RegisterPage);
b_beauty_project/src/views/RigisterShopPage/index.js
View file @ 994792a7
import React from "react"; import React, { Component } from "react";
import { makeStyles } from "@material-ui/core/styles"; import { withStyles } from "@material-ui/core/styles";
import { withRouter } from "react-router-dom";
import compose from "recompose/compose";
import Input from "@material-ui/core/Input"; import Input from "@material-ui/core/Input";
import InputLabel from "@material-ui/core/InputLabel"; import InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment"; import InputAdornment from "@material-ui/core/InputAdornment";
...@@ -15,141 +17,144 @@ import TextareaAutosize from "@material-ui/core/TextareaAutosize"; ...@@ -15,141 +17,144 @@ import TextareaAutosize from "@material-ui/core/TextareaAutosize";
import ContactPhoneIcon from "@material-ui/icons/ContactPhone"; import ContactPhoneIcon from "@material-ui/icons/ContactPhone";
import BusinessIcon from "@material-ui/icons/Business"; import BusinessIcon from "@material-ui/icons/Business";
const useStyles = makeStyles(theme => ({ const styles = theme => ({
margin: { margin: {
margin: theme.spacing(1) margin: theme.spacing(1)
} }
})); });
export default function InputWithIcon() { class Registershop extends Component {
const classes = useStyles(); render() {
const { classes } = this.props;
return ( return (
<div className="row center"> <div className="row center">
<h2>ลงทะเบียนธุรกิจ</h2> <h2>ลงทะเบียนธุรกิจ</h2>
<br></br> <br></br>
<div> <div>
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-uncontrolled" id="outlined-uncontrolled"
label="ชื่อร้าน" label="ชื่อร้าน"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<AccountCircle /> <AccountCircle />
</InputAdornment> </InputAdornment>
) )
}} }}
/> />
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-uncontrolled" id="outlined-uncontrolled"
label="E_mail" label="E_mail"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<MailOutlineIcon /> <MailOutlineIcon />
</InputAdornment> </InputAdornment>
) )
}} }}
/> />
</div> </div>
<br></br> <br></br>
<div> <div>
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-password-input" id="outlined-password-input"
label="Password" label="Password"
type="password" type="password"
autoComplete="current-password" autoComplete="current-password"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<VpnKeyIcon /> <VpnKeyIcon />
</InputAdornment> </InputAdornment>
) )
}} }}
/> />
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-password-input" id="outlined-password-input"
label="Confirm-Password" label="Confirm-Password"
type="password" type="password"
autoComplete="current-password" autoComplete="current-password"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<VpnKeyIcon /> <VpnKeyIcon />
</InputAdornment> </InputAdornment>
) )
}} }}
/> />
</div> </div>
<br></br> <br></br>
<div> <div>
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-password-input" id="outlined-password-input"
label="ที่อยู่" label="ที่อยู่"
autoComplete="address" autoComplete="address"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<BusinessIcon /> <BusinessIcon />
</InputAdornment> </InputAdornment>
) )
}} }}
/> />
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-password-input" id="outlined-password-input"
label="เบอร์โทร" label="เบอร์โทร"
autoComplete="Phone number" autoComplete="Phone number"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<ContactPhoneIcon /> <ContactPhoneIcon />
</InputAdornment> </InputAdornment>
) )
}} }}
/> />
</div> </div>
<br></br> <br></br>
<div> <div>
<TextField <TextField
className={classes.margin} className={classes.margin}
id="outlined-file-input" id="outlined-file-input"
label="เพิ่มรูปภาพ" label="เพิ่มรูปภาพ"
type="file" type="file"
autoComplete="current-password" autoComplete="current-password"
variant="outlined" variant="outlined"
InputProps={{ InputProps={{
startAdornment: ( startAdornment: (
<InputAdornment position="start"> <InputAdornment position="start">
<AddPhotoAlternateIcon /> <AddPhotoAlternateIcon />
</InputAdornment> </InputAdornment>
) )
}} }}
/> />
</div>
<br></br>
<div className={classes.root}>
<Button variant="contained" color="secondary">
ยกเลิก
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button variant="contained" color="primary">
ลงทะเบียน
</Button>
</div>
</div> </div>
<br></br> );
<div className={classes.root}> }
<Button variant="contained" color="secondary">
ยกเลิก
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button variant="contained" color="primary">
ลงทะเบียน
</Button>
</div>
</div>
);
} }
export default compose(withStyles(styles), withRouter)(Registershop);
b_beauty_project/src/views/ShopPage/index.js
View file @ 994792a7
...@@ -10,6 +10,9 @@ import CardContent from "@material-ui/core/CardContent"; ...@@ -10,6 +10,9 @@ import CardContent from "@material-ui/core/CardContent";
import Typography from "@material-ui/core/Typography"; import Typography from "@material-ui/core/Typography";
import axios from "axios";
// const axios = require('axios');
const styles = theme => ({ const styles = theme => ({
root: { root: {
minWidth: 275 minWidth: 275
...@@ -27,12 +30,48 @@ const styles = theme => ({ ...@@ -27,12 +30,48 @@ const styles = theme => ({
} }
}); });
class ShopPage extends Component { class ShopPage extends Component {
state = {
name: "xxx",
email: "xyz.ggg.com"
};
componentDidMount = () => {
axios
.get("http://localhost:9000/api/auth/getUserById/7")
.then(function(response) {
// handle success
// console.log("response : ", response.data);
// const name = response.data.name;
// const email = response.data.email;
const { name, email } = response.data;
console.log("name : ", name);
console.log("email : ", email);
this.setState({
name: name,
email:email
});
})
.catch(function(error) {
// handle error
console.log(error);
});
console.log("here");
};
render() { render() {
const { classes } = this.props; const { classes } = this.props;
const bull = <span className={classes.bullet}>•</span>; const bull = <span className={classes.bullet}>•</span>;
const { name, email } = this.state;
return ( return (
<div> <div>
<AppBar /> <AppBar />
<div className="row "> <div className="row ">
<div className="row mt-2 mb-2"> <div className="row mt-2 mb-2">
<div className="col s12 m6 l6"> <div className="col s12 m6 l6">
...@@ -62,7 +101,11 @@ class ShopPage extends Component { ...@@ -62,7 +101,11 @@ class ShopPage extends Component {
<div className="col s12 m6 l4"> <div className="col s12 m6 l4">
<div className="row"> <div className="row">
<h4> ที่อยู่ : 85 Sathonlamak Rd, Mueang Si Khai, Warin Chamrap District, Ubon Ratchathani 34190</h4> <h4>
{" "}
ที่อยู่ : 85 Sathonlamak Rd, Mueang Si Khai, Warin Chamrap
District, Ubon Ratchathani 34190
</h4>
</div> </div>
<div className="row"> <div className="row">
...@@ -84,15 +127,15 @@ class ShopPage extends Component { ...@@ -84,15 +127,15 @@ class ShopPage extends Component {
<div className="row mt-2 mb-2"> <div className="row mt-2 mb-2">
<div className="col s12 m6 l7"> <div className="col s12 m6 l7">
<div className="row center"> <div className="row center">
<Card className={classes.root} variant="outlined"> <Card className={classes.root} variant="outlined">
<h4>ผลงานช่าง นาย</h4> <h4>ผลงานช่าง นาย</h4>
<div className="col s12 m6 l4"> <div className="col s12 m6 l4">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAaEt_unwBuDLyqCP_bW3PBawVHkjZrNq-F3u7mAKtSjmBTrHE"></img> <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAaEt_unwBuDLyqCP_bW3PBawVHkjZrNq-F3u7mAKtSjmBTrHE"></img>
</div> </div>
<div className="col s12 m6 l4"> <div className="col s12 m6 l4">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAaEt_unwBuDLyqCP_bW3PBawVHkjZrNq-F3u7mAKtSjmBTrHE"></img> <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAaEt_unwBuDLyqCP_bW3PBawVHkjZrNq-F3u7mAKtSjmBTrHE"></img>
</div> </div>
</Card> </Card>
</div> </div>
</div> </div>
<div className="col s12 m6 l1"></div> <div className="col s12 m6 l1"></div>
...@@ -135,7 +178,7 @@ class ShopPage extends Component { ...@@ -135,7 +178,7 @@ class ShopPage extends Component {
color="textSecondary" color="textSecondary"
gutterBottom gutterBottom
> >
รีวิว รีวิว
</Typography> </Typography>
<Typography variant="h5" component="h2"> <Typography variant="h5" component="h2">
be{bull}nev{bull}o{bull}lent be{bull}nev{bull}o{bull}lent
......
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