add web

b_beauty_project/package-lock.json

@@ -3297,6 +3297,11 @@
       "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.7.0.tgz",
       "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": {
       "version": "2.1.8",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.1.8.tgz",
@@ -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": {
       "version": "3.12.0",
       "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz",
@@ -7352,6 +7362,11 @@
       "resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.1.0.tgz",
       "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": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-root/-/is-root-2.1.0.tgz",
@@ -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": {
       "version": "1.3.5",
       "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -11507,6 +11532,16 @@
         "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": {
       "version": "11.0.3",
       "resolved": "https://registry.npmjs.org/react-beautiful-dnd/-/react-beautiful-dnd-11.0.3.tgz",

b_beauty_project/package.json

@@ -15,7 +15,9 @@
     "date-fns": "^2.9.0",
     "material-table": "^1.56.1",
     "mysql": "^2.18.1",
+    "prop-types": "^15.7.2",
     "react": "^16.12.0",
+    "react-avatar": "^3.9.0",
     "react-dom": "^16.12.0",
     "react-intl": "^3.11.0",
     "react-router-dom": "^5.1.2",

b_beauty_project/src/views/BeauticianShopPage/Profile/index.js

@@ -19,6 +19,9 @@ 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 Avatar from "react-avatar";
+
 const useStyles = makeStyles(theme => ({
   margin: {
     margin: theme.spacing(1)
@@ -31,13 +34,25 @@ export default function InputWithIcon() {
   return (
     <div className="row center">
       <div className="row mt-2 mb-2">
-         <h2>โปรไฟล์ร้าน</h2>
-       </div><br />
+        <h2>โปรไฟล์</h2>
+      </div>
+      <br />
       <div className="row mt-2 mb-2">
         <div className="col s12 m6 l4">
           <div className="row center">
             <br />
-            <img src="data:image/jpeg;base64,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" alt="flower"></img>
+            <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>
         <div className="col s12 m6 l8">

b_beauty_project/src/views/DataShopPage/Datashop/index.js

 import React, { Component } from "react";
 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 { 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 => ({
+  margin: {
+    margin: theme.spacing(1)
+  },
   root: {
-    height: 150
+    "& .MuiTextField-root": {
+      margin: theme.spacing(1),
+      width: 200
+    }
   }
 });
 
-class DataShop extends Component {
-  state = {};
+const currencies = [
+  {
+    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() {
     const { classes } = this.props;
+    const { currency } = this.state;
     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 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 id="standard-basic" label="Standard" />
-        <Button>login</Button>
+              <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>
     );
   }
 }
-
-export default compose(withStyles(styles), withRouter)(DataShop);
+export default compose(withStyles(styles), withRouter)(Datashop);

b_beauty_project/src/views/DataShopPage/Home/index.js

@@ -25,8 +25,13 @@ import compose from "recompose/compose";
 import Profile from "../Profile";
 import Lists from "../List";
 import Managequeue from "../Managequeue";
-
+import AccountBoxIcon from "@material-ui/icons/AccountBox";
+import StorageIcon from "@material-ui/icons/Storage";
 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;
 
@@ -115,7 +120,7 @@ class ResponsiveDrawer extends Component {
             selected={path == "profile" ? true : false}
           >
             <ListItemIcon>
-              <InboxIcon />
+              <AccountBoxIcon />
             </ListItemIcon>
             <ListItemText primary="โปรไฟล์ร้าน" />
           </ListItem>
@@ -128,7 +133,7 @@ class ResponsiveDrawer extends Component {
             selected={path == "datashop" ? true : false}
           >
             <ListItemIcon>
-              <MailIcon />
+              <StorageIcon />
             </ListItemIcon>
             <ListItemText primary="ข้อมูลร้าน" />
           </ListItem>
@@ -140,7 +145,7 @@ class ResponsiveDrawer extends Component {
             selected={path == "list" ? true : false}
           >
             <ListItemIcon>
-              <MailIcon />
+              <ListIcon />
             </ListItemIcon>
             <ListItemText primary="รายการ" />
           </ListItem>
@@ -152,7 +157,7 @@ class ResponsiveDrawer extends Component {
             selected={path == "databeautician" ? true : false}
           >
             <ListItemIcon>
-              <MailIcon />
+              <RecentActorsIcon />
             </ListItemIcon>
             <ListItemText primary="ข้อมูลช่าง" />
           </ListItem>
@@ -164,7 +169,7 @@ class ResponsiveDrawer extends Component {
             selected={path == "managequeue" ? true : false}
           >
             <ListItemIcon>
-              <MailIcon />
+              <QueryBuilderIcon />
             </ListItemIcon>
             <ListItemText primary="จัดการคิว" />
           </ListItem>
@@ -176,12 +181,10 @@ class ResponsiveDrawer extends Component {
             selected={path == "addimage" ? true : false}
           >
             <ListItemIcon>
-              <MailIcon />
+              <AddAPhotoIcon />
             </ListItemIcon>
             <ListItemText primary="เพิ่มรูปภาพ" />
           </ListItem>
-         
-         
         </List>
       </div>
     );
@@ -231,7 +234,6 @@ class ResponsiveDrawer extends Component {
           {path == "databeautician" ? <Databeautician /> : null}
           {path == "managequeue" ? <Managequeue /> : null}
           {path == "addimage" ? <Addimage /> : null}
-       
         </main>
       </div>
     );

b_beauty_project/src/views/DataShopPage/List/index.js

@@ -96,14 +96,13 @@ class Databeautician extends Component {
     open: false,
     columns: [
       { title: "Name", field: "name" },
+      { title: "Price", field: "price" },
       { title: "Time", field: "time" }
+      
     ],
     data: [
-      { name: "Mehmet", time: "Baran" },
-      {
-        name: "Zerya Betül",
-        time: "Baran"
-      }
+      { name: "Mehmet", price:"200", time: "Baran"},
+      
     ]
   };
   handleClickOpen = () => {

b_beauty_project/src/views/DataShopPage/Managequeue/index.js

@@ -110,14 +110,12 @@ class Databeautician extends Component {
   state = {
     open: false,
     columns: [
-      { title: "Name", field: "name" },
-      { title: "E-mail", field: "surname" },
-      { title: "Address", field: "birthYear", type: "numeric" },
-      {
-        title: "Phone number",
-        field: "birthCity",
-        lookup: { 34: "İstanbul", 63: "Şanlıurfa" }
-      }
+      { title: "ชื่อคนจอง", field: "name" },
+      { title: "รายการจอง", field: "list" },
+      { title: "วัน/เดือน/ปี ที่จอง", field: "dete" },
+      { title: "เวลาที่จอง", field: "time" },
+
+      { title: "ช่างที่จอง", field: "booking" }
     ],
     data: [
       { name: "Mehmet", surname: "Baran", birthYear: 1987, birthCity: 63 },
@@ -171,7 +169,7 @@ class Databeautician extends Component {
     return (
       <div>
         <MaterialTable
-          title="ข้อมูลช่าง"
+          title="จัดการคิว"
           columns={columns}
           data={data}
           options={{

b_beauty_project/src/views/DataShopPage/Profile/index.js

@@ -19,6 +19,9 @@ 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 Avatar from "react-avatar";
+
 const useStyles = makeStyles(theme => ({
   margin: {
     margin: theme.spacing(1)
@@ -32,12 +35,24 @@ export default function InputWithIcon() {
     <div className="row center">
       <div className="row mt-2 mb-2">
         <h2>โปรไฟล์ร้าน</h2>
-       </div><br />
+      </div>
+      <br />
       <div className="row mt-2 mb-2">
         <div className="col s12 m6 l4">
           <div className="row center">
             <br />
-            <img src="data:image/jpeg;base64,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" alt="flower"></img>
+            <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>
         <div className="col s12 m6 l8">

b_beauty_project/src/views/HomePage/index.js

@@ -21,7 +21,8 @@ import { th } from "date-fns/locale";
 import { format } from "date-fns";
 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";
 
 const styles = theme => ({
   root: {
@@ -32,7 +33,22 @@ const styles = theme => ({
     // Disable this demo to preserve the others.
     "@media all and (-ms-high-contrast: 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: {
     display: "flex",
@@ -119,6 +135,35 @@ class HomePage extends Component {
       <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">
+                  <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="col s12 m6 l6">
               <h3>ชื่อ</h3>
@@ -135,7 +180,6 @@ class HomePage extends Component {
             <div className="col s12 m6 l6">
               <div className="row">
                 <h4>ที่อยู่ร้าน</h4>
-               
               </div>
 
               <div className="row">

b_beauty_project/src/views/ShopPage/index.js

+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);