Skip to content

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

add web

parent facece9b
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 545 additions and 46 deletions
b_beauty_project/package-lock.json
View file @ fd46c836
...@@ -3297,6 +3297,11 @@ ...@@ -3297,6 +3297,11 @@
"resolved": "https://registry.npmjs.org/chardet/-/chardet-0.7.0.tgz", "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.7.0.tgz",
"integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==" "integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA=="
}, },
"charenc": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
"integrity": "sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc="
},
"chokidar": { "chokidar": {
"version": "2.1.8", "version": "2.1.8",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.1.8.tgz", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.1.8.tgz",
...@@ -4314,6 +4319,11 @@ ...@@ -4314,6 +4319,11 @@
} }
} }
}, },
"crypt": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
"integrity": "sha1-iNf/fsDfuG9xPch7u0LQRNPmxBs="
},
"crypto-browserify": { "crypto-browserify": {
"version": "3.12.0", "version": "3.12.0",
"resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz", "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz",
...@@ -7352,6 +7362,11 @@ ...@@ -7352,6 +7362,11 @@
"resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.1.0.tgz", "resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.1.0.tgz",
"integrity": "sha512-qgDYXFSR5WvEfuS5dMj6oTMEbrrSaM0CrFk2Yiq/gXnBvD9pMa2jGXxyhGLfvhZpuMZe18CJpFxAt3CRs42NMg==" "integrity": "sha512-qgDYXFSR5WvEfuS5dMj6oTMEbrrSaM0CrFk2Yiq/gXnBvD9pMa2jGXxyhGLfvhZpuMZe18CJpFxAt3CRs42NMg=="
}, },
"is-retina": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/is-retina/-/is-retina-1.0.3.tgz",
"integrity": "sha1-10AbKGvqKuN/Ykd1iN5QTQuGR+M="
},
"is-root": { "is-root": {
"version": "2.1.0", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/is-root/-/is-root-2.1.0.tgz", "resolved": "https://registry.npmjs.org/is-root/-/is-root-2.1.0.tgz",
...@@ -9023,6 +9038,16 @@ ...@@ -9023,6 +9038,16 @@
} }
} }
}, },
"md5": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz",
"integrity": "sha1-U6s41f48iJG6RlMp6iP6wFQBJvk=",
"requires": {
"charenc": "~0.0.1",
"crypt": "~0.0.1",
"is-buffer": "~1.1.1"
}
},
"md5.js": { "md5.js": {
"version": "1.3.5", "version": "1.3.5",
"resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz", "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
...@@ -11507,6 +11532,16 @@ ...@@ -11507,6 +11532,16 @@
"whatwg-fetch": "^3.0.0" "whatwg-fetch": "^3.0.0"
} }
}, },
"react-avatar": {
"version": "3.9.0",
"resolved": "https://registry.npmjs.org/react-avatar/-/react-avatar-3.9.0.tgz",
"integrity": "sha512-i9UR3z/Y4JhAb6WH0yaAr6noLwLVgUyp7kOMu48Plc9ch6OQ3k4aDqp+m0TrCbHAn8YfRv2BevK9gA0nIqwVbA==",
"requires": {
"core-js": "^3.6.1",
"is-retina": "^1.0.3",
"md5": "^2.0.0"
}
},
"react-beautiful-dnd": { "react-beautiful-dnd": {
"version": "11.0.3", "version": "11.0.3",
"resolved": "https://registry.npmjs.org/react-beautiful-dnd/-/react-beautiful-dnd-11.0.3.tgz", "resolved": "https://registry.npmjs.org/react-beautiful-dnd/-/react-beautiful-dnd-11.0.3.tgz",
......
b_beauty_project/package.json
View file @ fd46c836
...@@ -15,7 +15,9 @@ ...@@ -15,7 +15,9 @@
"date-fns": "^2.9.0", "date-fns": "^2.9.0",
"material-table": "^1.56.1", "material-table": "^1.56.1",
"mysql": "^2.18.1", "mysql": "^2.18.1",
"prop-types": "^15.7.2",
"react": "^16.12.0", "react": "^16.12.0",
"react-avatar": "^3.9.0",
"react-dom": "^16.12.0", "react-dom": "^16.12.0",
"react-intl": "^3.11.0", "react-intl": "^3.11.0",
"react-router-dom": "^5.1.2", "react-router-dom": "^5.1.2",
......
b_beauty_project/src/views/DataShopPage/Datashop/index.js
View file @ fd46c836
import React, { Component } from "react"; import React, { Component } from "react";
import { withStyles } from "@material-ui/core/styles"; import { withStyles } from "@material-ui/core/styles";
import { Button, TextField } from "@material-ui/core";
import { withRouter } from "react-router-dom";
import compose from "recompose/compose"; import compose from "recompose/compose";
import { withRouter } from "react-router-dom";
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 Button from "@material-ui/core/Button";
import TextareaAutosize from "@material-ui/core/TextareaAutosize";
import ContactPhoneIcon from "@material-ui/icons/ContactPhone";
import BusinessIcon from "@material-ui/icons/Business";
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 MenuItem from "@material-ui/core/MenuItem";
import PhotoCameraIcon from "@material-ui/icons/PhotoCamera";
import Avatar from "react-avatar";
const styles = theme => ({ const styles = theme => ({
margin: {
margin: theme.spacing(1)
},
root: { root: {
height: 150 "& .MuiTextField-root": {
margin: theme.spacing(1),
width: 200
}
} }
}); });
class DataShop extends Component { const currencies = [
state = {}; {
value: "1",
label: " กรุณาเลือกประเภท "
},
{
value: "2",
label: "สปาและนวด"
},
{
value: "3",
label: "ผิวหน้า"
},
{
value: "4",
label: "ขนตาและคิ้ว"
},
{
value: "5",
label: "ทำเล็บ"
},
{
value: "6",
label: "ชาลอน"
},
{
value: "7",
label: "แต่งหน้าทำผม"
}
];
class Datashop extends Component {
state = {
currency: "1"
};
handleChange = event => {
this.setState({
currency: event.target.value
});
};
render() { render() {
const { classes } = this.props; const { classes } = this.props;
const { currency } = this.state;
return ( return (
<div> <div className="row center">
<TextField id="standard-basic" label="Standard" /> <div className="row mt-2 mb-2">
<Button>login</Button> <h2>ข้อมูลร้าน</h2>
</div>
<br />
<div className="row mt-2 mb-2">
<div className="col s12 m6 l12">
<div className="row center">
<h4>ข้อมูทั่วไป</h4>
</div>
<div className="row center">
<br />
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRGzUPvW-KAdZI6KiIyh-HHSKtqKRGSWcP3vDqHUd2Sn2F3SHwr" />
</div>
<div className="row center">
<Button variant="outlined" color="primary">
<PhotoCameraIcon />
แก้ไขรูปภาพร้าน
</Button>
</div>
</div>
<div className="col s12 m6 l12">
<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="เวลาเปิดร้าน"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="เวลาปิดร้าน"
autoComplete="Phone number"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<ContactPhoneIcon />
</InputAdornment>
)
}}
/>
</div>
<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>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="รายละเอียดร้าน"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
</div>
<br />
<div>
<TextField
className={classes.margin}
id="outlined-password-input"
label="GoogleMap"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
label="Facebook"
autoComplete="address"
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
/>
<TextField
className={classes.margin}
id="outlined-password-input"
select
label="ประเภทของร้าน"
value={currency}
onChange={this.handleChange}
SelectProps={{
native: true
}}
variant="outlined"
InputProps={{
startAdornment: (
<InputAdornment position="start">
<BusinessIcon />
</InputAdornment>
)
}}
>{currencies.map(option => (
<option key={option.value} value={option.value}>
{option.label}
</option>
))}</TextField>
</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)(Datashop);
export default compose(withStyles(styles), withRouter)(DataShop);
b_beauty_project/src/views/DataShopPage/Home/index.js
View file @ fd46c836
...@@ -25,8 +25,13 @@ import compose from "recompose/compose"; ...@@ -25,8 +25,13 @@ import compose from "recompose/compose";
import Profile from "../Profile"; import Profile from "../Profile";
import Lists from "../List"; import Lists from "../List";
import Managequeue from "../Managequeue"; import Managequeue from "../Managequeue";
import AccountBoxIcon from "@material-ui/icons/AccountBox";
import StorageIcon from "@material-ui/icons/Storage";
import Addimage from "../Addimage"; import Addimage from "../Addimage";
import ListIcon from "@material-ui/icons/List";
import RecentActorsIcon from "@material-ui/icons/RecentActors";
import QueryBuilderIcon from "@material-ui/icons/QueryBuilder";
import AddAPhotoIcon from "@material-ui/icons/AddAPhoto";
const drawerWidth = 240; const drawerWidth = 240;
...@@ -115,7 +120,7 @@ class ResponsiveDrawer extends Component { ...@@ -115,7 +120,7 @@ class ResponsiveDrawer extends Component {
selected={path == "profile" ? true : false} selected={path == "profile" ? true : false}
> >
<ListItemIcon> <ListItemIcon>
<InboxIcon /> <AccountBoxIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText primary="โปรไฟล์ร้าน" /> <ListItemText primary="โปรไฟล์ร้าน" />
</ListItem> </ListItem>
...@@ -128,7 +133,7 @@ class ResponsiveDrawer extends Component { ...@@ -128,7 +133,7 @@ class ResponsiveDrawer extends Component {
selected={path == "datashop" ? true : false} selected={path == "datashop" ? true : false}
> >
<ListItemIcon> <ListItemIcon>
<MailIcon /> <StorageIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText primary="ข้อมูลร้าน" /> <ListItemText primary="ข้อมูลร้าน" />
</ListItem> </ListItem>
...@@ -140,7 +145,7 @@ class ResponsiveDrawer extends Component { ...@@ -140,7 +145,7 @@ class ResponsiveDrawer extends Component {
selected={path == "list" ? true : false} selected={path == "list" ? true : false}
> >
<ListItemIcon> <ListItemIcon>
<MailIcon /> <ListIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText primary="รายการ" /> <ListItemText primary="รายการ" />
</ListItem> </ListItem>
...@@ -152,7 +157,7 @@ class ResponsiveDrawer extends Component { ...@@ -152,7 +157,7 @@ class ResponsiveDrawer extends Component {
selected={path == "databeautician" ? true : false} selected={path == "databeautician" ? true : false}
> >
<ListItemIcon> <ListItemIcon>
<MailIcon /> <RecentActorsIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText primary="ข้อมูลช่าง" /> <ListItemText primary="ข้อมูลช่าง" />
</ListItem> </ListItem>
...@@ -164,7 +169,7 @@ class ResponsiveDrawer extends Component { ...@@ -164,7 +169,7 @@ class ResponsiveDrawer extends Component {
selected={path == "managequeue" ? true : false} selected={path == "managequeue" ? true : false}
> >
<ListItemIcon> <ListItemIcon>
<MailIcon /> <QueryBuilderIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText primary="จัดการคิว" /> <ListItemText primary="จัดการคิว" />
</ListItem> </ListItem>
...@@ -176,12 +181,10 @@ class ResponsiveDrawer extends Component { ...@@ -176,12 +181,10 @@ class ResponsiveDrawer extends Component {
selected={path == "addimage" ? true : false} selected={path == "addimage" ? true : false}
> >
<ListItemIcon> <ListItemIcon>
<MailIcon /> <AddAPhotoIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText primary="เพิ่มรูปภาพ" /> <ListItemText primary="เพิ่มรูปภาพ" />
</ListItem> </ListItem>
</List> </List>
</div> </div>
); );
...@@ -231,7 +234,6 @@ class ResponsiveDrawer extends Component { ...@@ -231,7 +234,6 @@ class ResponsiveDrawer extends Component {
{path == "databeautician" ? <Databeautician /> : null} {path == "databeautician" ? <Databeautician /> : null}
{path == "managequeue" ? <Managequeue /> : null} {path == "managequeue" ? <Managequeue /> : null}
{path == "addimage" ? <Addimage /> : null} {path == "addimage" ? <Addimage /> : null}
</main> </main>
</div> </div>
); );
......
b_beauty_project/src/views/DataShopPage/List/index.js
View file @ fd46c836
...@@ -96,14 +96,13 @@ class Databeautician extends Component { ...@@ -96,14 +96,13 @@ class Databeautician extends Component {
open: false, open: false,
columns: [ columns: [
{ title: "Name", field: "name" }, { title: "Name", field: "name" },
{ title: "Price", field: "price" },
{ title: "Time", field: "time" } { title: "Time", field: "time" }
], ],
data: [ data: [
{ name: "Mehmet", time: "Baran" }, { name: "Mehmet", price:"200", time: "Baran"},
{
name: "Zerya Betül",
time: "Baran"
}
] ]
}; };
handleClickOpen = () => { handleClickOpen = () => {
......
b_beauty_project/src/views/DataShopPage/Managequeue/index.js
View file @ fd46c836
...@@ -110,14 +110,12 @@ class Databeautician extends Component { ...@@ -110,14 +110,12 @@ class Databeautician extends Component {
state = { state = {
open: false, open: false,
columns: [ columns: [
{ title: "Name", field: "name" }, { title: "ชื่อคนจอง", field: "name" },
{ title: "E-mail", field: "surname" }, { title: "รายการจอง", field: "list" },
{ title: "Address", field: "birthYear", type: "numeric" }, { title: "วัน/เดือน/ปี ที่จอง", field: "dete" },
{ { title: "เวลาที่จอง", field: "time" },
title: "Phone number",
field: "birthCity", { title: "ช่างที่จอง", field: "booking" }
lookup: { 34: "İstanbul", 63: "Şanlıurfa" }
}
], ],
data: [ data: [
{ name: "Mehmet", surname: "Baran", birthYear: 1987, birthCity: 63 }, { name: "Mehmet", surname: "Baran", birthYear: 1987, birthCity: 63 },
...@@ -171,24 +169,24 @@ class Databeautician extends Component { ...@@ -171,24 +169,24 @@ class Databeautician extends Component {
return ( return (
<div> <div>
<MaterialTable <MaterialTable
title="ข้อมูลช่าง" title="จัดการคิว"
columns={columns} columns={columns}
data={data} data={data}
options={{ options={{
selection: false selection: false
}} }}
editable={{ editable={{
// onRowAdd: newData => // onRowAdd: newData =>
// new Promise(resolve => { // new Promise(resolve => {
// setTimeout(() => { // setTimeout(() => {
// resolve(); // resolve();
// this.setState(prevState => { // this.setState(prevState => {
// const data = [...prevState.data]; // const data = [...prevState.data];
// data.push(newData); // data.push(newData);
// return { ...prevState, data }; // return { ...prevState, data };
// }); // });
// }, 600); // }, 600);
// }), // }),
onRowUpdate: (newData, oldData) => onRowUpdate: (newData, oldData) =>
new Promise(resolve => { new Promise(resolve => {
setTimeout(() => { setTimeout(() => {
......
b_beauty_project/src/views/HomePage/index.js
View file @ fd46c836
...@@ -21,7 +21,8 @@ import { th } from "date-fns/locale"; ...@@ -21,7 +21,8 @@ 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 DirectionsIcon from "@material-ui/icons/Directions";
const styles = theme => ({ const styles = theme => ({
root: { root: {
...@@ -32,7 +33,22 @@ const styles = theme => ({ ...@@ -32,7 +33,22 @@ const styles = theme => ({
// Disable this demo to preserve the others. // Disable this demo to preserve the others.
"@media all and (-ms-high-contrast: none)": { "@media all and (-ms-high-contrast: none)": {
display: "none" display: "none"
} },
padding: "2px 4px",
display: "flex",
alignItems: "center",
width: 400
},
input: {
marginLeft: theme.spacing(1),
flex: 1
},
iconButton: {
padding: 10
},
divider: {
height: 28,
margin: 4
}, },
modal: { modal: {
display: "flex", display: "flex",
...@@ -119,6 +135,35 @@ class HomePage extends Component { ...@@ -119,6 +135,35 @@ class HomePage extends Component {
<div> <div>
<AppBra tab={tab} handleChangeTab={this.handleChangeTab} /> <AppBra tab={tab} handleChangeTab={this.handleChangeTab} />
<div className="row center"> <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">
<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
color="primary"
className={classes.iconButton}
aria-label="directions"
>
<DirectionsIcon />
</IconButton>
</Paper>
</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 l6">
<h3>ชื่อ</h3> <h3>ชื่อ</h3>
...@@ -135,7 +180,6 @@ class HomePage extends Component { ...@@ -135,7 +180,6 @@ class HomePage extends Component {
<div className="col s12 m6 l6"> <div className="col s12 m6 l6">
<div className="row"> <div className="row">
<h4>ที่อยู่ร้าน</h4> <h4>ที่อยู่ร้าน</h4>
</div> </div>
<div className="row"> <div className="row">
......
b_beauty_project/src/views/ShopPage/index.js
View file @ fd46c836
import React, { Component } from "react";
import { withStyles } from "@material-ui/core/styles";
import compose from "recompose/compose";
import { withRouter } from "react-router-dom";
import AppBar from "../../components/AppBra";
import Button from "@material-ui/core/Button";
import Card from "@material-ui/core/Card";
import CardActions from "@material-ui/core/CardActions";
import CardContent from "@material-ui/core/CardContent";
import Typography from "@material-ui/core/Typography";
const styles = theme => ({
root: {
minWidth: 275
},
bullet: {
display: "inline-block",
margin: "0 2px",
transform: "scale(0.8)"
},
title: {
fontSize: 14
},
pos: {
marginBottom: 12
}
});
class ShopPage extends Component {
render() {
const { classes } = this.props;
const bull = <span className={classes.bullet}>•</span>;
return (
<div>
<AppBar />
<div className="row ">
<div className="row mt-2 mb-2">
<div className="col s12 m6 l6">
<center>
<h3>ชื่อ</h3>
</center>
</div>
</div>
<div className="row mt-2 mb-2">
<div className="col s12 m6 l8">
<div>
<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="90%"
></img>
</div>
<div className="row center">
<Button variant="contained" color="secondary">
รายการ
</Button>{" "}
&nbsp; &nbsp; &nbsp;
<Button variant="contained" color="primary">
จองคิว
</Button>
</div>
</div>
<div className="col s12 m6 l4">
<div className="row">
<h4> ที่อยู่ : 85 Sathonlamak Rd, Mueang Si Khai, Warin Chamrap District, Ubon Ratchathani 34190</h4>
</div>
<div className="row">
<center>
<img
src="https://lh3.googleusercontent.com/proxy/wF4hP1ITvhgYYaNaiAVTwuKzkAESOzL-PBNcSqC8xoR-cg2m2ztZVOc8B0gvjhF-3b0AXlJ2a_hV1X_XjNHqBGCKR-I-RdzGiMRSw0wVv-uv88ELTATaE4jBpyNILc20PSsLxpgQSpS-etDENw"
width="70%"
></img>
</center>
</div>
<div className="row">
<h4>เบอร์โทร :08xxxxxx</h4>
<h4>เวลาเปิด : 08:00 น.</h4>
<h4>เวลาปิด : 18:00 น.</h4>
</div>
</div>
</div>
<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>
</div>
</div>
<div className="col s12 m6 l1"></div>
<div className="col s12 m6 l4">
<div className="row">
<center></center>
</div>
<div className="row">
<Card className={classes.root} variant="outlined">
<CardContent>
<Typography
className={classes.title}
color="textSecondary"
gutterBottom
>
โปรโมชั่น
</Typography>
<Typography variant="h5" component="h2">
be{bull}nev{bull}o{bull}lent
</Typography>
<Typography className={classes.pos} color="textSecondary">
adjective
</Typography>
<Typography variant="body2" component="p">
well meaning and kindly.
<br />
{'"a benevolent smile"'}
</Typography>
</CardContent>
<CardActions>
<Button size="small">Learn More</Button>
</CardActions>
</Card>
</div>
<div className="row">
<Card className={classes.root} variant="outlined">
<CardContent>
<Typography
className={classes.title}
color="textSecondary"
gutterBottom
>
รีวิว
</Typography>
<Typography variant="h5" component="h2">
be{bull}nev{bull}o{bull}lent
</Typography>
<Typography className={classes.pos} color="textSecondary">
adjective
</Typography>
<Typography variant="body2" component="p">
well meaning and kindly.
<br />
{'"a benevolent smile"'}
</Typography>
</CardContent>
<CardActions>
<Button size="small">Learn More</Button>
</CardActions>
</Card>
</div>
<div className="row right">
<Button variant="contained" color="primary">
เขียนรีวิว
</Button>
</div>
</div>
</div>
</div>
</div>
);
}
}
export default compose(withStyles(styles), withRouter)(ShopPage);
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