Skip to content
Projects
Groups
Snippets
Help
Loading...
Sign in / Register
Toggle navigation
5
59110440259
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Packages
Packages
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
senior-prj-62
59110440259
Commits
fd46c836
Commit
fd46c836
authored
Feb 05, 2020
by
Piyaphorn Arphornsri
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
add web
parent
facece9b
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
10 changed files
with
545 additions
and
46 deletions
+545
-46
package-lock.json
b_beauty_project/package-lock.json
+35
-0
package.json
b_beauty_project/package.json
+2
-0
index.js
...uty_project/src/views/BeauticianShopPage/Profile/index.js
+0
-0
index.js
b_beauty_project/src/views/DataShopPage/Datashop/index.js
+259
-10
index.js
b_beauty_project/src/views/DataShopPage/Home/index.js
+12
-10
index.js
b_beauty_project/src/views/DataShopPage/List/index.js
+4
-5
index.js
b_beauty_project/src/views/DataShopPage/Managequeue/index.js
+16
-18
index.js
b_beauty_project/src/views/DataShopPage/Profile/index.js
+0
-0
index.js
b_beauty_project/src/views/HomePage/index.js
+47
-3
index.js
b_beauty_project/src/views/ShopPage/index.js
+170
-0
No files found.
b_beauty_project/package-lock.json
View file @
fd46c836
...
...
@@ -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
View file @
fd46c836
...
...
@@ -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
View file @
fd46c836
This diff is collapsed.
Click to expand it.
b_beauty_project/src/views/DataShopPage/Datashop/index.js
View file @
fd46c836
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
>
<
TextField
id
=
"standard-basic"
label
=
"Standard"
/>
<
Button
>
login
<
/Button
>
<
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
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
View file @
fd46c836
...
...
@@ -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
>
<
Inb
oxIcon
/>
<
AccountB
oxIcon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"โปรไฟล์ร้าน"
/>
<
/ListItem
>
...
...
@@ -128,7 +133,7 @@ class ResponsiveDrawer extends Component {
selected
=
{
path
==
"datashop"
?
true
:
false
}
>
<
ListItemIcon
>
<
Mail
Icon
/>
<
Storage
Icon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"ข้อมูลร้าน"
/>
<
/ListItem
>
...
...
@@ -140,7 +145,7 @@ class ResponsiveDrawer extends Component {
selected
=
{
path
==
"list"
?
true
:
false
}
>
<
ListItemIcon
>
<
Mail
Icon
/>
<
List
Icon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"รายการ"
/>
<
/ListItem
>
...
...
@@ -152,7 +157,7 @@ class ResponsiveDrawer extends Component {
selected
=
{
path
==
"databeautician"
?
true
:
false
}
>
<
ListItemIcon
>
<
Mail
Icon
/>
<
RecentActors
Icon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"ข้อมูลช่าง"
/>
<
/ListItem
>
...
...
@@ -164,7 +169,7 @@ class ResponsiveDrawer extends Component {
selected
=
{
path
==
"managequeue"
?
true
:
false
}
>
<
ListItemIcon
>
<
Mail
Icon
/>
<
QueryBuilder
Icon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"จัดการคิว"
/>
<
/ListItem
>
...
...
@@ -176,12 +181,10 @@ class ResponsiveDrawer extends Component {
selected
=
{
path
==
"addimage"
?
true
:
false
}
>
<
ListItemIcon
>
<
Mail
Icon
/>
<
AddAPhoto
Icon
/>
<
/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
View file @
fd46c836
...
...
@@ -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
View file @
fd46c836
...
...
@@ -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,24 +169,24 @@ class Databeautician extends Component {
return
(
<
div
>
<
MaterialTable
title
=
"
ข้อมูลช่าง
"
title
=
"
จัดการคิว
"
columns
=
{
columns
}
data
=
{
data
}
options
=
{{
selection
:
false
}}
editable
=
{{
// onRowAdd: newData =>
// onRowAdd: newData =>
// new Promise(resolve => {
// setTimeout(() => {
// setTimeout(() => {
// resolve();
// this.setState(prevState => {
// const data = [...prevState.data];
// data.push(newData);
// return { ...prevState, data };
// });
// }, 600);
// }),
// this.setState(prevState => {
// const data = [...prevState.data];
// data.push(newData);
// return { ...prevState, data };
// });
// }, 600);
// }),
onRowUpdate
:
(
newData
,
oldData
)
=>
new
Promise
(
resolve
=>
{
setTimeout
(()
=>
{
...
...
b_beauty_project/src/views/DataShopPage/Profile/index.js
View file @
fd46c836
This diff is collapsed.
Click to expand it.
b_beauty_project/src/views/HomePage/index.js
View file @
fd46c836
...
...
@@ -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
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
>
เบอร์โทร
:
08
xxxxxx
<
/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
);
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment