Skip to content

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

add web

parent b8172a1d
Hide whitespace changes
Inline Side-by-side
Showing with 1152 additions and 894 deletions
Backend/controllers/auth/index.js
View file @ 994792a7
const User = require("../../models/user");
const bcryptjs= require('bcryptjs');
const JWT = require('jsonwebtoken');
const config =require('../../config')
const bcryptjs = require("bcryptjs");
const JWT = require("jsonwebtoken");
const config = require("../../config");
exports.getUserById = async (req, res) => {
console.log("here");
try {
console.log("req.param", req.param);
const userId = req.params.id;
const user = await User.findOne({
where: { id: userId }
......@@ -43,3 +45,31 @@ exports.register = async (req, res) => {
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 db = require("../../db");
module.exports = db.sequelize.define("users", {
module.exports = db.sequelize.define("booking", {
bookingID: {
type: Sequelize.INTEGER,
primaryKey: true,
......
Backend/models/list/index.js
View file @ 994792a7
const Sequelize = require("sequelize");
const db = require("../../db");
module.exports = db.sequelize.define("users", {
module.exports = db.sequelize.define("list", {
listID: {
type: Sequelize.INTEGER,
primaryKey: true,
......
Backend/models/promotion/index.js
View file @ 994792a7
const Sequelize = require("sequelize");
const db = require("../../db");
module.exports = db.sequelize.define("users", {
module.exports = db.sequelize.define("promotion", {
promotionID: {
type: Sequelize.INTEGER,
primaryKey: true,
......
Backend/models/reviews/index.js
View file @ 994792a7
const Sequelize = require("sequelize");
const db = require("../../db");
module.exports = db.sequelize.define("users", {
module.exports = db.sequelize.define("reviwes", {
reviewsID: {
type: Sequelize.INTEGER,
primaryKey: true,
......
Backend/models/shop/index.js
View file @ 994792a7
const Sequelize = require("sequelize");
const db = require("../../db");
module.exports = db.sequelize.define("users", {
module.exports = db.sequelize.define("shop", {
shopID: {
type: Sequelize.INTEGER,
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 db = require("../../db");
module.exports = db.sequelize.define("users", {
module.exports = db.sequelize.define("usersShopOwner", {
userShopOwnerID: {
type: Sequelize.INTEGER,
primaryKey: true,
......@@ -19,5 +19,11 @@ module.exports = db.sequelize.define("users", {
},
userShopOwnerAddress: {
type: Sequelize.STRING
},
userShoppownerTel: {
type: Sequelize.STRING
},
userShopOwnerPic: {
type: Sequelize.STRING
}
});
Backend/models/userbeautician/index.js
View file @ 994792a7
const Sequelize = require("sequelize");
const db = require("../../db");
module.exports = db.sequelize.define("users", {
module.exports = db.sequelize.define("userbeautician", {
userbeauticianID: {
type: Sequelize.INTEGER,
primaryKey: true,
......@@ -20,7 +20,13 @@ module.exports = db.sequelize.define("users", {
userbeauticianAddres: {
type: Sequelize.STRING
},
userbeauticianTel: {
type: Sequelize.STRING
},
shopID: {
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 @@
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
</head>
<body>
<body bgcolor="EEEEEE">
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
......
b_beauty_project/src/views/BeauticianShopPage/Home/index.js
View file @ 994792a7
......@@ -114,7 +114,7 @@ class ResponsiveDrawer extends Component {
<ListItemIcon>
<InboxIcon />
</ListItemIcon>
<ListItemText primary="โปรไฟล์ร้าน" />
<ListItemText primary="โปรไฟล์" />
</ListItem>
<ListItem
......
b_beauty_project/src/views/BeauticianShopPage/Profile/index.js
View file @ 994792a7
import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import React, { Component } from "react";
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 InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment";
......@@ -18,158 +20,160 @@ import Fab from "@material-ui/core/Fab";
import EditIcon from "@material-ui/icons/Edit";
import Paper from "@material-ui/core/Paper";
import CardMedia from "@material-ui/core/CardMedia";
import PhotoCameraIcon from '@material-ui/icons/PhotoCamera';
import PhotoCameraIcon from "@material-ui/icons/PhotoCamera";
import Avatar from "react-avatar";
const useStyles = makeStyles(theme => ({
const styles = theme => ({
margin: {
margin: theme.spacing(1)
}
}));
});
export default function InputWithIcon() {
const classes = useStyles();
class Profile extends Component {
render() {
const { classes } = this.props;
return (
<div className="row center">
<div className="row mt-2 mb-2">
<h2>โปรไฟล์</h2>
</div>
<br />
<div className="row mt-2 mb-2">
<div className="col s12 m6 l4">
<div className="row center">
<br />
<Avatar
skypeId="sitebase"
src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQZeSPYraiTcEz6JxyXy8ITsaGldAqDjX6860m7eCpYhYeQDQkL"
size="200"
round={true}
/>
</div>
<div className="row center">
<Button variant="outlined" color="primary">
<PhotoCameraIcon />
แก้ไขรูปโปรไฟล์
</Button>
</div>
return (
<div className="row center">
<div className="row mt-2 mb-2">
<h2>โปรไฟล์</h2>
</div>
<div className="col s12 m6 l8">
<br />
<div ClassName="row">
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อร้าน"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="E_mail"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<MailOutlineIcon />
</InputAdornment>
)
}}
/>
<br />
<div className="row mt-2 mb-2">
<div className="col s12 m6 l4">
<div className="row center">
<br />
<Avatar
skypeId="sitebase"
src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQZeSPYraiTcEz6JxyXy8ITsaGldAqDjX6860m7eCpYhYeQDQkL"
size="200"
round={true}
/>
</div>
<div className="row center">
<Button variant="outlined" color="primary">
<PhotoCameraIcon />
แก้ไขรูปโปรไฟล์
</Button>
</div>
</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>
)
}}
/>
<div className="col s12 m6 l8">
<br />
<div ClassName="row">
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อร้าน"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-password-input"
label="ที่อยู่"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="เบอร์โทร"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<TextField
className={classes.margin}
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>
)
}}
/>
<div className="row">
<div className={classes.root}>
<Button variant="contained" color="secondary">
ยกเลิก
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button variant="contained" color="primary">
ตกลง
</Button>
&nbsp; &nbsp; &nbsp;
<Fab color="secondary" aria-label="edit">
<EditIcon />
</Fab>
<TextField
className={classes.margin}
id="outlined-password-input"
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-password-input"
label="ที่อยู่"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="เบอร์โทร"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div className="row">
<div className={classes.root}>
<Button variant="contained" color="secondary">
ยกเลิก
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button variant="contained" color="primary">
ตกลง
</Button>
&nbsp; &nbsp; &nbsp;
<Fab color="secondary" aria-label="edit">
<EditIcon />
</Fab>
</div>
</div>
</div>
</div>
</div>
</div>
);
);
}
}
export default compose(withStyles(styles), withRouter)(Profile);
b_beauty_project/src/views/BeauticianShopPage/Work/index.js
View file @ 994792a7
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 compose from "recompose/compose";
import { DatePicker } from "@material-ui/pickers";
import { injectIntl, FormattedRelativeTime } from "react-intl";
import { th } from "date-fns/locale";
import { format } from "date-fns";
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 {
MuiPickersUtilsProvider,
KeyboardTimePicker,
KeyboardDatePicker,
} from '@material-ui/pickers';
import MaterialTable from "material-table";
const styles = theme => ({
root: {
......@@ -23,41 +62,184 @@ const styles = theme => ({
"@media all and (-ms-high-contrast: 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 {
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()
};
handleChangeDate = newDate => {
console.log("newDate: ", newDate);
this.setState({
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() {
const { classes } = this.props;
// const tab = this.state.tab;
// หรือ
const { selectedDate } = this.state;
const { open, columns, data, selectedDate } = this.state;
return (
<div>
<div className="row center">
<KeyboardDatePicker
disableToolbar
variant="inline"
format="dd/MM/yyyy"
margin="normal"
id="date-picker-inline"
label="เลือกวันที่"
value={selectedDate}
onChange={this.handleDateChange}
KeyboardButtonProps={{
'aria-label': 'change date',
}}
/>
<KeyboardDatePicker
disableToolbar
variant="inline"
format="dd/MM/yyyy"
margin="normal"
id="date-picker-inline"
label="เลือกวันที่"
value={selectedDate}
onChange={this.handleDateChange}
KeyboardButtonProps={{
"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>
);
}
......
b_beauty_project/src/views/DataShopPage/Managequeue/index.js
View file @ 994792a7
......@@ -26,8 +26,7 @@ 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 DoneIcon from '@material-ui/icons/Done';
import Input from "@material-ui/core/Input";
import InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment";
......@@ -41,7 +40,15 @@ 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 {
MuiPickersUtilsProvider,
KeyboardTimePicker,
KeyboardDatePicker,
} from '@material-ui/pickers';
import MaterialTable from "material-table";
const styles = theme => ({
......@@ -67,76 +74,31 @@ const styles = theme => ({
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 Databeautician extends Component {
class Managequeue extends Component {
state = {
open: false,
columns: [
{ title: "ชื่อคนจอง", field: "name" },
{ title: "รายการจอง", field: "list" },
{ title: "วัน/เดือน/ปี ที่จอง", field: "dete" },
{ title: "เวลาที่จอง", field: "time" },
{ title: "ช่างที่จอง", field: "booking" }
],
data: [
{ name: "Mehmet", surname: "Baran", birthYear: 1987, birthCity: 63 },
{
name: "Zerya Betül",
surname: "Baran",
birthYear: 2017,
birthCity: 34
}
]
};
handleClickOpen = () => {
this.setState({
open: true
});
],
selectedDate : new Date()
};
handleClose = () => {
handleChangeDate = newDate => {
console.log("newDate: ", newDate);
this.setState({
open: false
date: newDate
});
};
handleCloseAndSave = () => {
//Save to db
......@@ -165,195 +127,75 @@ class Databeautician extends Component {
render() {
const { classes } = this.props;
const { open, columns, data } = this.state;
const { open, columns, data, selectedDate } = this.state;
return (
<div>
<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 className="row center">
<KeyboardDatePicker
disableToolbar
variant="inline"
format="dd/MM/yyyy"
margin="normal"
id="date-picker-inline"
label="เลือกวันที่"
value={selectedDate}
onChange={this.handleDateChange}
KeyboardButtonProps={{
"aria-label": "change date"
}}
/>
</div>
<div className="row">
<Fab
aria-label={"add"}
className={classes.fab}
color="primary"
onClick={this.handleClickOpen}
>
<AddIcon />
</Fab>
<Dialog
open={open}
onClose={this.handleClose}
aria-labelledby="alert-dialog-title"
aria-describedby="alert-dialog-description"
>
<DialogTitle id="alert-dialog-title">{"ลงทะเบียนช่าง"}</DialogTitle>
<DialogContent>
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อ-สกุล"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
<br /> <br />
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="E_mail"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<MailOutlineIcon />
</InputAdornment>
)
}}
/>
<br /> <br />
<TextField
className={classes.margin}
id="outlined-password-input"
label="Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
<br /> <br />
<TextField
className={classes.margin}
id="outlined-password-input"
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
<br /> <br />
<TextField
className={classes.margin}
id="outlined-password-input"
label="ที่อยู่"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<br /> <br />
<TextField
className={classes.margin}
id="outlined-password-input"
label="เบอร์โทร"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
<br /> <br />
<TextField
className={classes.margin}
id="outlined-file-input"
label="เพิ่มรูปภาพ"
type="file"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AddPhotoAlternateIcon />
</InputAdornment>
)
}}
/>
</DialogContent>
<DialogActions>
<Button onClick={this.handleClose} color="primary">
ยกเลิก
</Button>
<Button
onClick={this.handleCloseAndSave}
color="primary"
autoFocus
>
ยืนยัน
</Button>
</DialogActions>
</Dialog>
<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>
);
}
}
export default compose(withStyles(styles), withRouter)(Databeautician);
export default compose(withStyles(styles), withRouter)(Managequeue);
b_beauty_project/src/views/DataShopPage/Profile/index.js
View file @ 994792a7
import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import React, { Component } from "react";
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 InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment";
......@@ -19,157 +21,160 @@ import EditIcon from "@material-ui/icons/Edit";
import Paper from "@material-ui/core/Paper";
import CardMedia from "@material-ui/core/CardMedia";
import PhotoCameraIcon from '@material-ui/icons/PhotoCamera';
import PhotoCameraIcon from "@material-ui/icons/PhotoCamera";
import Avatar from "react-avatar";
const useStyles = makeStyles(theme => ({
const styles = theme => ({
margin: {
margin: theme.spacing(1)
}
}));
});
export default function InputWithIcon() {
const classes = useStyles();
class Profile extends Component {
render() {
const { classes } = this.props;
return (
<div className="row center">
<div className="row mt-2 mb-2">
<h2>โปรไฟล์ร้าน</h2>
</div>
<br />
<div className="row mt-2 mb-2">
<div className="col s12 m6 l4">
<div className="row center">
<br />
<Avatar
skypeId="sitebase"
src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQZeSPYraiTcEz6JxyXy8ITsaGldAqDjX6860m7eCpYhYeQDQkL"
size="200"
round={true}
/>
</div>
<div className="row center">
<Button variant="outlined" color="primary">
<PhotoCameraIcon />
แก้ไขรูปโปรไฟล์
</Button>
</div>
return (
<div className="row center">
<div className="row mt-2 mb-2">
<h2>โปรไฟล์ร้าน</h2>
</div>
<div className="col s12 m6 l8">
<br />
<div ClassName="row">
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อร้าน"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="E_mail"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<MailOutlineIcon />
</InputAdornment>
)
}}
/>
<br />
<div className="row mt-2 mb-2">
<div className="col s12 m6 l4">
<div className="row center">
<br />
<Avatar
skypeId="sitebase"
src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQZeSPYraiTcEz6JxyXy8ITsaGldAqDjX6860m7eCpYhYeQDQkL"
size="200"
round={true}
/>
</div>
<div className="row center">
<Button variant="outlined" color="primary">
<PhotoCameraIcon />
แก้ไขรูปโปรไฟล์
</Button>
</div>
</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>
)
}}
/>
<div className="col s12 m6 l8">
<br />
<div ClassName="row">
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อร้าน"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-password-input"
label="ที่อยู่"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="เบอร์โทร"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<TextField
className={classes.margin}
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>
)
}}
/>
<div className="row">
<div className={classes.root}>
<Button variant="contained" color="secondary">
ยกเลิก
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button variant="contained" color="primary">
ตกลง
</Button>
&nbsp; &nbsp; &nbsp;
<Fab color="secondary" aria-label="edit">
<EditIcon />
</Fab>
<TextField
className={classes.margin}
id="outlined-password-input"
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-password-input"
label="ที่อยู่"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="เบอร์โทร"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div className="row">
<div className={classes.root}>
<Button variant="contained" color="secondary">
ยกเลิก
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button variant="contained" color="primary">
ตกลง
</Button>
&nbsp; &nbsp; &nbsp;
<Fab color="secondary" aria-label="edit">
<EditIcon />
</Fab>
</div>
</div>
</div>
</div>
</div>
</div>
);
);
}
}
export default compose(withStyles(styles), withRouter)(Profile);
b_beauty_project/src/views/HomePage/index.js
View file @ 994792a7
......@@ -19,21 +19,15 @@ import { DatePicker } from "@material-ui/pickers";
import { injectIntl, FormattedRelativeTime } from "react-intl";
import { th } from "date-fns/locale";
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 SearchIcon from "@material-ui/icons/Search";
import DirectionsIcon from "@material-ui/icons/Directions";
import Rating from "@material-ui/lab/Rating";
const styles = theme => ({
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",
display: "flex",
alignItems: "center",
......@@ -62,7 +56,8 @@ class HomePage extends Component {
state = {
tab: 0,
date: new Date(),
open: false
open: false,
rating: 0
};
handleClickOpen = () => {
this.setState({
......@@ -130,59 +125,86 @@ class HomePage extends Component {
const { classes } = this.props;
// const tab = this.state.tab;
// หรือ
const { tab, date, open, value } = this.state;
const { tab, date, open, value, rating } = this.state;
return (
<div>
<AppBra tab={tab} handleChangeTab={this.handleChangeTab} />
<div className="row center">
<div className="row mt-2 mb-2">
<div>
<Paper component="form" className={classes.root}>
<IconButton className={classes.iconButton} aria-label="menu">
<br />
<div className="row ">
<div className="row mt-2 mb-2 ">
<div className="row ">
<center>
<Paper component="form" className={classes.root}>
{/* <IconButton className={classes.iconButton} aria-label="menu">
<MenuIcon />
</IconButton>
<InputBase
className={classes.input}
placeholder="Search Google Maps"
inputProps={{ "aria-label": "search google maps" }}
/>
<IconButton
type="submit"
className={classes.iconButton}
aria-label="search"
>
<SearchIcon />
</IconButton>
<Divider className={classes.divider} orientation="vertical" />
<IconButton
</IconButton> */}
<InputBase
className={classes.input}
inputProps={{ "aria-label": "ค้นหาร้าน" }}
/>
<IconButton
type="submit"
className={classes.iconButton}
aria-label="search"
>
<SearchIcon />
</IconButton>
{/* <Divider className={classes.divider} orientation="vertical" /> */}
{/* <IconButton
color="primary"
className={classes.iconButton}
aria-label="directions"
>
<DirectionsIcon />
</IconButton>
</Paper>
</IconButton> */}
</Paper>
</center>
</div>
</div>
<div className="row mt-2 mb-2">
<div className="col s12 m6 l6">
<div className="row mt-2 mb-2 center">
<div className="col s12 m16 l16">
<h3>ชื่อ</h3>
</div>
</div>
<div className="row mt-2 mb-2">
<div className="col s12 m6 l6">
<img
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"
width="70%"
></img>
<div className="row mt-2 mb-2 ">
<div className="col s12 m6 l8">
<div className="row center">
<img
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"
width="70%"
></img>
</div>
</div>
<div className="col s12 m6 l6">
<div className="col s12 m6 l4">
<div className="row">
<h4>ที่อยู่ร้าน</h4>
<h4>
ที่อยู่ : 85 Sathonlamak Rd, Mueang Si Khai, Warin Chamrap
District, Ubon Ratchathani 34190
</h4>
</div>
<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
variant="outlined"
color="primary"
......
b_beauty_project/src/views/LoginPage/index.js
View file @ 994792a7
import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import React, { Component } from "react";
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 InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment";
......@@ -12,65 +14,66 @@ import MailOutlineIcon from "@material-ui/icons/MailOutline";
import VpnKeyIcon from "@material-ui/icons/VpnKey";
import Button from "@material-ui/core/Button";
const useStyles = makeStyles(theme => ({
const styles = theme => ({
root: {
"& > *": {
margin: theme.spacing(1),
width: 200
}
}
}));
export default function BasicTextFields() {
const classes = useStyles();
});
class Login extends Component {
render() {
const {classes} = this.props;
return (
<div>
<div className="row center">
<h2>เข้าสู่ระบบ</h2>
<div>
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="E_mail"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<MailOutlineIcon />
</InputAdornment>
)
}}
/>
</div><br></br>
return (
<div>
<div className="row center">
<h2>เข้าสู่ระบบ</h2>
<div>
<TextField
className={classes.margin}
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>
)
}}
/>
</div><br></br>
<div>
<Button variant="contained" color="primary" disableElevation>
เข้าสู่ระบบ
</Button>
<h5>หรือ</h5>
<Button variant="contained" color="primary" disableElevation>
เข้าสู่ระบบด้วย Facebook
</Button>
<TextField
className={classes.margin}
id="outlined-password-input"
label="Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<Button variant="contained" color="primary" disableElevation>
เข้าสู่ระบบ
</Button>
</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 { makeStyles } from "@material-ui/core/styles";
import Input from "@material-ui/core/Input";
import InputLabel from "@material-ui/core/InputLabel";
import React, { Component } from "react";
import { withStyles } from "@material-ui/core/styles";
import { Input, InputLabel } from "@material-ui/core";
import InputAdornment from "@material-ui/core/InputAdornment";
import FormControl from "@material-ui/core/FormControl";
import TextField from "@material-ui/core/TextField";
......@@ -12,110 +11,184 @@ import MailOutlineIcon from "@material-ui/icons/MailOutline";
import VpnKeyIcon from "@material-ui/icons/VpnKey";
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: theme.spacing(1)
}
}));
});
export default function InputWithIcon() {
const classes = useStyles();
class RegisterPage extends Component {
state = {
name: "",
email: "",
password: "",
password2: "",
image: ""
};
return (
<div className="row center">
<h2>ลงทะเบียน</h2>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อ-สกุล"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
handleChange = event => {
console.log("name : ", event.target.name);
console.log("value : ", event.target.value);
<TextField
className={classes.margin}
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>
)
}}
/>
this.setState({
[event.target.name]: event.target.value
});
<TextField
className={classes.margin}
id="outlined-password-input"
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-file-input"
label="เพิ่มรูปภาพ"
type="file"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AddPhotoAlternateIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div className={classes.root}>
<Button variant="contained" color="secondary">
ยกเลิก
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button variant="contained" color="primary">
ลงทะเบียน
</Button>
// this.setState({
// name: name,
// email: email,
// password: password,
// password2: password2,
// image: image
// });
};
render() {
const { classes } = this.props;
// const { } = this.state;
const { name, email, password, password2, image } = this.state;
return (
<div className="row center">
<h2>ลงทะเบียน</h2>
<br></br>
<div>
<TextField
className={classes.margin}
id="name"
name="name"
value={name}
label="ชื่อ-สกุล"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
onChange={this.handleChange}
/>
<TextField
className={classes.margin}
id="email"
name="email"
value={email}
label="E_mail"
variant="outlined"
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>
);
);
}
}
export default compose(withStyles(styles), withRouter)(RegisterPage);
b_beauty_project/src/views/RigisterShopPage/index.js
View file @ 994792a7
import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import React, { Component } from "react";
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 InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment";
......@@ -15,141 +17,144 @@ import TextareaAutosize from "@material-ui/core/TextareaAutosize";
import ContactPhoneIcon from "@material-ui/icons/ContactPhone";
import BusinessIcon from "@material-ui/icons/Business";
const useStyles = makeStyles(theme => ({
const styles = theme => ({
margin: {
margin: theme.spacing(1)
}
}));
});
export default function InputWithIcon() {
const classes = useStyles();
class Registershop extends Component {
render() {
const { classes } = this.props;
return (
<div className="row center">
<h2>ลงทะเบียนธุรกิจ</h2>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อร้าน"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
return (
<div className="row center">
<h2>ลงทะเบียนธุรกิจ</h2>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-uncontrolled"
label="ชื่อร้าน"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
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
className={classes.margin}
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
className={classes.margin}
id="outlined-password-input"
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-password-input"
label="ที่อยู่"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="เบอร์โทร"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-file-input"
label="เพิ่มรูปภาพ"
type="file"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AddPhotoAlternateIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="Confirm-Password"
type="password"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<VpnKeyIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-password-input"
label="ที่อยู่"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="เบอร์โทร"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
</div>
<br></br>
<div>
<TextField
className={classes.margin}
id="outlined-file-input"
label="เพิ่มรูปภาพ"
type="file"
autoComplete="current-password"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AddPhotoAlternateIcon />
</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>
<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";
import Typography from "@material-ui/core/Typography";
import axios from "axios";
// const axios = require('axios');
const styles = theme => ({
root: {
minWidth: 275
......@@ -27,12 +30,48 @@ const styles = theme => ({
}
});
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() {
const { classes } = this.props;
const bull = <span className={classes.bullet}>•</span>;
const { name, email } = this.state;
return (
<div>
<AppBar />
<div className="row ">
<div className="row mt-2 mb-2">
<div className="col s12 m6 l6">
......@@ -62,7 +101,11 @@ class ShopPage extends Component {
<div className="col s12 m6 l4">
<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 className="row">
......@@ -84,15 +127,15 @@ class ShopPage extends Component {
<div className="row mt-2 mb-2">
<div className="col s12 m6 l7">
<div className="row center">
<Card className={classes.root} variant="outlined">
<h4>ผลงานช่าง นาย</h4>
<div className="col s12 m6 l4">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAaEt_unwBuDLyqCP_bW3PBawVHkjZrNq-F3u7mAKtSjmBTrHE"></img>
</div>
<div className="col s12 m6 l4">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAaEt_unwBuDLyqCP_bW3PBawVHkjZrNq-F3u7mAKtSjmBTrHE"></img>
</div>
</Card>
<Card className={classes.root} variant="outlined">
<h4>ผลงานช่าง นาย</h4>
<div className="col s12 m6 l4">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAaEt_unwBuDLyqCP_bW3PBawVHkjZrNq-F3u7mAKtSjmBTrHE"></img>
</div>
<div className="col s12 m6 l4">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAaEt_unwBuDLyqCP_bW3PBawVHkjZrNq-F3u7mAKtSjmBTrHE"></img>
</div>
</Card>
</div>
</div>
<div className="col s12 m6 l1"></div>
......@@ -135,7 +178,7 @@ class ShopPage extends Component {
color="textSecondary"
gutterBottom
>
รีวิว
รีวิว
</Typography>
<Typography variant="h5" component="h2">
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