dungnh/Face_Classify_frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 'link auto login' (#12) from feature/TKA-29- into dev

Browse Source 
Reviewed-on: huyt/fsi_project#12
This commit is contained in:
Quynh Nguyen 2023-04-07 03:27:49 +00:00
commit b3bdabe398
26 changed files with 38880 additions and 7892 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
app/31 Normal file
View File

30627
app/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

17
app/src/App.css
View File

@ -37,6 +37,23 @@
} }
} }
.text-navbar {
/* font-family: inherit; */
font-family: 'Roboto Condensed', ;
font-weight: 400;
font-size: 23;
color: #fff;
}
.font-family-text {
font-family: 'Roboto Condensed', sans-serif;
}
.color {
color: black;
font-size: 17;
}
.modal-size { .modal-size {
min-width: 50% min-width: 50%
} }

8
app/src/App.js
View File

@ -15,7 +15,9 @@ import "./App.css";
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
import store from './store'; import store from './store';
import ReactRouter from './router/ReactRouter'; import ReactRouter from './router/ReactRouter';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; import { BrowserRouter as Router, Link, Route, Switch } from 'react-router-dom';
import AutoLogin from './components/AutoLogin/AutoLogin';
function App() { function App() {
@ -23,7 +25,9 @@ function App() {
<Provider store={store}> <Provider store={store}>
<Router> <Router>
<Switch> <Switch>
<Route path="/login" exact render={() => <Login />} /> {/* <Route path={"/login"} exact render={() => <Login />} /> */}
<Route path={"/login"} exact render={() => <Login />} />
<Route path={'/auth/:token?'} render={(props) => <AutoLogin {...props} />} />
<ReactRouter /> <ReactRouter />
</Switch> </Switch>
</Router> </Router>

58
app/src/components/AutoLogin/AutoLogin.js Normal file
View File

@ -0,0 +1,58 @@
import { login } from '../../actions/isLogin';
import React, { Component } from 'react';
import "react-datepicker/dist/react-datepicker.css";
import { HOST } from '../../config/index';
import Store from '../../store';
import { role } from '../../actions/role';
class AutoLogin extends Component {
constructor(props) {
super(props);
this.state = {
dataRole: Store.getState().role.role,
isLogin: Store.getState().isLogin.isLogin,
};
Store.subscribe(() => {
this.setState({
isLogin: Store.getState().isLogin.isLogin,
dataRole: Store.getState().role.role,
}, () => {
});
});
}
componentDidMount() {
if(this.props.match.params.token){
localStorage.setItem("access_token", "Bearer " + this.props.match.params.token);
Store.dispatch(login("Bearer " + this.props.match.params.token));
let data = fetch(`${HOST}/api/get_info`, {
method: 'GET',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'Authorization': "Bearer " + this.props.match.params.token,
// 'Authorization': token,
},
}).then((response) => {
return response.json()
}).then((data) => {
if(data.status === 10000){
localStorage.setItem("roles", JSON.stringify(data.roles));
Store.dispatch(role(data.roles));
window.location.href = "/";
}else{
alert('Sai token!!!');
window.location.href = "/login";
}
})
}
}
render() {
console.log('oke',Store.getState().role.role)
return(
<div></div>
)
}
}
export default AutoLogin;

29
app/src/components/ImportImg/ImportImage.js
View File

@ -59,6 +59,7 @@ class ImportImage extends Component {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
// 'Authorization': token // 'Authorization': token
}, },
data: { data: {
@ -129,6 +130,7 @@ class ImportImage extends Component {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
// 'Authorization': token // 'Authorization': token
}, },
body: JSON.stringify({ 'image_obj_id_list': [img._id] }) body: JSON.stringify({ 'image_obj_id_list': [img._id] })
@ -239,7 +241,7 @@ class ImportImage extends Component {
<div className="m-portlet__head"> <div className="m-portlet__head">
<div className="m-portlet__head-caption"> <div className="m-portlet__head-caption">
<div className="m-portlet__head-title"> <div className="m-portlet__head-title">
<h3 className="m-portlet__head-text"> <h3 className="font-family-text">
Kho ảnh Kho ảnh
</h3> </h3>
</div> </div>
@ -257,7 +259,7 @@ class ImportImage extends Component {
}) })
}} }}
value={this.state.dataSearch} value={this.state.dataSearch}
id="inputSearch" className="form-control m-input" id="inputSearch" className="form-control m-input font-family-text"
placeholder="Tên ảnh..." placeholder="Tên ảnh..."
data-col-index={0} data-col-index={0}
/> />
@ -265,6 +267,7 @@ class ImportImage extends Component {
<div className="form-group m-form__group col-xl-2"> <div className="form-group m-form__group col-xl-2">
{process.env.REACT_APP_SOURCE_IMG === "1" ? {process.env.REACT_APP_SOURCE_IMG === "1" ?
<Select <Select
className="font-family-text"
placeholder={'Loại ảnh'} placeholder={'Loại ảnh'}
value={this.state.valueSelected} value={this.state.valueSelected}
onChange={this.changeHandleFilter} onChange={this.changeHandleFilter}
@ -280,10 +283,10 @@ class ImportImage extends Component {
activePage: 1 activePage: 1
}) })
}} }}
className="btn btn-accent m-btn m-btn--icon" id="m_search"> className="btn btn-primary m-btn m-btn--icon" style={{backgroundColor: '#2673b4'}} id="m_search">
<span> <span>
<i className="la la-search" /> <i className="la la-search" />
<span>Tìm kiếm</span> <span className="font-family-text">Tìm kiếm</span>
</span> </span>
</button> </button>
</div> </div>
@ -295,7 +298,7 @@ class ImportImage extends Component {
className="btn btn-secondary m-btn m-btn--icon" id="m_reset"> className="btn btn-secondary m-btn m-btn--icon" id="m_reset">
<span> <span>
<i className="la la-rotate-left" /> <i className="la la-rotate-left" />
<span>Tải lại</span> <span className="font-family-text">Tải lại</span>
</span> </span>
</button> </button>
</div> </div>
@ -308,19 +311,21 @@ class ImportImage extends Component {
modalUploadShow: true, modalUploadShow: true,
}) })
}} }}
className="btn btn-accent m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air"> style={{backgroundColor: '#2673b4'}}
className="btn btn-primary m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air">
<span> <span>
<i className="la la-plus" /> <i className="la la-plus" />
<span>Tải ảnh lên</span> <span className="font-family-text">Tải ảnh lên</span>
</span> </span>
</button> </button>
</div> </div>
: "" } : "" }
</div> </div>
{/*begin: Datatable */} {/*begin: Datatable */}
<table className="table table-striped- table-bordered table-hover table-checkable" id="m_table_1"> <table className="table table-striped- table-bordered table-hover table-checkable font-family-text" id="m_table_1">
<thead>
<tr> <thead className='k-grid-header' role='rowgroup' style={{backgroundColor: '#2673b4'}}>
<tr className='font-family-text color' style={{color: 'white', fontWeight: 600, fontSize: 16,}}>
<th style={{width: "50px"}}>STT</th> <th style={{width: "50px"}}>STT</th>
<th>Ảnh</th> <th>Ảnh</th>
<th>Tên ảnh</th> <th>Tên ảnh</th>
@ -329,7 +334,7 @@ class ImportImage extends Component {
{this.state.dataRole?.indexOf('import:edit') === -1 && this.state.dataRole?.indexOf('import:delete') === -1 ? "" : <th>Thao tác</th>} {this.state.dataRole?.indexOf('import:edit') === -1 && this.state.dataRole?.indexOf('import:delete') === -1 ? "" : <th>Thao tác</th>}
</tr> </tr>
</thead> </thead>
<tbody>{bulletedListImg}</tbody> <tbody className="font-family-text">{bulletedListImg}</tbody>
</table> </table>
<Modalupload <Modalupload
show={this.state.modalUploadShow} show={this.state.modalUploadShow}
@ -359,7 +364,7 @@ class ImportImage extends Component {
pageRangeDisplayed={5} pageRangeDisplayed={5}
onChange={this.handlePageChange} onChange={this.handlePageChange}
/> />
<div>Tổng kết quả <strong>{this.state.totalLength}</strong></div> <div className="font-family-text">Tổng kết quả <strong>{this.state.totalLength}</strong></div>
</div> </div>
</div> </div>
) )

22
app/src/components/LabelImg/LabelImage.js
View File

@ -10,6 +10,7 @@ import { HOST } from '../../config/index';
import swal from 'sweetalert'; import swal from 'sweetalert';
import { useLocation } from 'react-router-dom'; import { useLocation } from 'react-router-dom';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
import Store from '../../store';
const initialDataPost = { const initialDataPost = {
index: 1, index: 1,
@ -76,6 +77,7 @@ export default function LabelImage() {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
// 'Authorization': token, // 'Authorization': token,
}, },
data: dataDel, data: dataDel,
@ -119,6 +121,7 @@ export default function LabelImage() {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
// 'Authorization': token // 'Authorization': token
}, },
data: data ? data : dataPost, data: data ? data : dataPost,
@ -234,7 +237,7 @@ export default function LabelImage() {
<div className="m-portlet__head"> <div className="m-portlet__head">
<div className="m-portlet__head-caption"> <div className="m-portlet__head-caption">
<div className="m-portlet__head-title"> <div className="m-portlet__head-title">
<h3 className="m-portlet__head-text"> <h3 className="font-family-text">
Gán nhãn Gán nhãn
</h3> </h3>
</div> </div>
@ -250,7 +253,7 @@ export default function LabelImage() {
setDataPost({ ...dataPost, search_data: e.target.value }) setDataPost({ ...dataPost, search_data: e.target.value })
}} }}
value={dataPost.search_data} value={dataPost.search_data}
id="inputSearch" className="form-control m-input" id="inputSearch" className="font-family-text form-control m-input"
placeholder="Họ tên..." placeholder="Họ tên..."
data-col-index={0} data-col-index={0}
/> />
@ -261,10 +264,10 @@ export default function LabelImage() {
setActivePage(1) setActivePage(1)
getData(dataPost) getData(dataPost)
}} }}
className="btn btn-accent m-btn m-btn--icon" id="m_search"> className="btn btn-primary m-btn m-btn--icon" id="m_search" style={{backgroundColor: '#2673b4'}}>
<span> <span>
<i className="la la-search" /> <i className="la la-search" />
<span>Tìm kiếm</span> <span className='font-family-text'>Tìm kiếm</span>
</span> </span>
</button> </button>
</div> </div>
@ -276,7 +279,7 @@ export default function LabelImage() {
className="btn btn-secondary m-btn m-btn--icon" id="m_reset"> className="btn btn-secondary m-btn m-btn--icon" id="m_reset">
<span> <span>
<i className="la la-rotate-left" /> <i className="la la-rotate-left" />
<span>Tải lại</span> <span className='font-family-text'>Tải lại</span>
</span> </span>
</button> </button>
</div> </div>
@ -297,7 +300,7 @@ export default function LabelImage() {
setDataEdit(dataEdit) setDataEdit(dataEdit)
setShowModal(true) setShowModal(true)
}} }}
className="btn btn-accent m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air"> className="btn btn-primary m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air" style={{backgroundColor: '#2673b4'}}>
<span> <span>
<i className="la la-plus" /> <i className="la la-plus" />
<span>Thêm mới</span> <span>Thêm mới</span>
@ -306,9 +309,10 @@ export default function LabelImage() {
</div> : "" } </div> : "" }
</div> </div>
{/*begin: Datatable */} {/*begin: Datatable */}
<table className="table table-striped- table-bordered table-hover table-checkable" id="m_table_1"> <table className="table table-striped- font-family-text color table-bordered table-hover table-checkable" id="m_table_1">
<thead>
<tr> <thead className='k-grid-header' role='rowgroup' style={{backgroundColor: '#2673b4'}}>
<tr className='font-family-text color' style={{color: 'white', fontWeight: 600, fontSize: 16,}}>
<th>Ảnh</th> <th>Ảnh</th>
<th>Họ tên</th> <th>Họ tên</th>
<th>FacebookID</th> <th>FacebookID</th>

24
app/src/components/List/ListItem.js
View File

@ -10,6 +10,7 @@ import { HOST } from '../../config/index';
import swal from 'sweetalert'; import swal from 'sweetalert';
import { useLocation } from 'react-router-dom'; import { useLocation } from 'react-router-dom';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
import Store from '../../store';
const initialDataPost = { const initialDataPost = {
index: 1, index: 1,
@ -74,6 +75,7 @@ export default function ListItem() {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token, // 'Authorization': token,
'Authorization': Store.getState().isLogin.access_token,
}, },
data: dataDel, data: dataDel,
}) })
@ -117,6 +119,7 @@ export default function ListItem() {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token // 'Authorization': token
'Authorization': Store.getState().isLogin.access_token,
}, },
data: data ? data : dataPost, data: data ? data : dataPost,
}) })
@ -228,7 +231,7 @@ export default function ListItem() {
<div className="m-portlet__head"> <div className="m-portlet__head">
<div className="m-portlet__head-caption"> <div className="m-portlet__head-caption">
<div className="m-portlet__head-title"> <div className="m-portlet__head-title">
<h3 className="m-portlet__head-text"> <h3 className="font-family-text">
Danh sách người nổi tiếng Danh sách người nổi tiếng
</h3> </h3>
</div> </div>
@ -255,10 +258,10 @@ export default function ListItem() {
setActivePage(1) setActivePage(1)
getData(dataPost) getData(dataPost)
}} }}
className="btn btn-accent m-btn m-btn--icon" id="m_search"> className="btn btn-primary m-btn m-btn--icon" id="m_search" style={{backgroundColor: '#2673b4'}}>
<span> <span>
<i className="la la-search" /> <i className="la la-search" />
<span>Tìm kiếm</span> <span className='font-family-text'>Tìm kiếm</span>
</span> </span>
</button> </button>
</div> </div>
@ -270,7 +273,7 @@ export default function ListItem() {
className="btn btn-secondary m-btn m-btn--icon" id="m_reset"> className="btn btn-secondary m-btn m-btn--icon" id="m_reset">
<span> <span>
<i className="la la-rotate-left" /> <i className="la la-rotate-left" />
<span>Tải lại</span> <span className='font-family-text'>Tải lại</span>
</span> </span>
</button> </button>
</div> </div>
@ -291,26 +294,27 @@ export default function ListItem() {
setDataEdit(dataEdit) setDataEdit(dataEdit)
setShowModal(true) setShowModal(true)
}} }}
className="btn btn-accent m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air"> style={{backgroundColor: '#2673b4'}}
className="btn btn-primary m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air">
<span> <span>
<i className="la la-plus" /> <i className="la la-plus" />
<span>Thêm mới</span> <span className='font-family-text'>Thêm mới</span>
</span> </span>
</button> </button>
</div> : "" } </div> : "" }
</div> </div>
{/*begin: Datatable */} {/*begin: Datatable */}
<table className="table table-striped- table-bordered table-hover table-checkable" id="m_table_1"> <table className="table table-striped- table-bordered table-hover table-checkable" id="m_table_1">
<thead> <thead className='k-grid-header' role='rowgroup' style={{backgroundColor: '#2673b4'}}>
<tr> <tr className='font-family-text color' style={{color: 'white', fontWeight: 600, fontSize: 16,}}>
<th>Ảnh</th> <th >Ảnh</th>
<th>Họ tên</th> <th>Họ tên</th>
<th>Giới tính</th> <th>Giới tính</th>
<th>Ngày sinh</th> <th>Ngày sinh</th>
{(dataRole?.indexOf('famous:delete') === -1 && dataRole?.indexOf('famous:edit') === -1) ? "" : <th>Thao tác</th>} {(dataRole?.indexOf('famous:delete') === -1 && dataRole?.indexOf('famous:edit') === -1) ? "" : <th>Thao tác</th>}
</tr> </tr>
</thead> </thead>
<tbody>{data && tableRows(data)}</tbody> <tbody className='font-family-text'>{data && tableRows(data)}</tbody>
</table> </table>
<PulseLoader <PulseLoader
// css={override} // css={override}

2
app/src/components/Login/Login.js
View File

@ -57,6 +57,7 @@ class Login extends Component {
} }
return response.json() return response.json()
}).then((data) => { }).then((data) => {
console.log('data', data);
if (data.status === 10000) { if (data.status === 10000) {
console.log(data) console.log(data)
console.log(data.data.roles) console.log(data.data.roles)
@ -115,6 +116,7 @@ class Login extends Component {
} }
render() { render() {
console.log('const',this.props.match);
return ( return (
<section className="login-block" style={{ 'width': '100%', 'height': '100vh' }}> <section className="login-block" style={{ 'width': '100%', 'height': '100vh' }}>
<div className="container col-md-6 col-lg-5 col-xl-3"> <div className="container col-md-6 col-lg-5 col-xl-3">

7
app/src/components/Modal/ModaEditLabel.js
View File

@ -9,6 +9,7 @@ import React, { useEffect, useRef, useState } from 'react';
import { Button, Modal } from 'react-bootstrap'; import { Button, Modal } from 'react-bootstrap';
import swal from 'sweetalert'; import swal from 'sweetalert';
import { HOST } from '../../config/index'; import { HOST } from '../../config/index';
import Store from '../../store';
@ -85,6 +86,8 @@ const ModalEditLabel = (props) => {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token, // 'Authorization': token,
'Authorization': Store.getState().isLogin.access_token,
}, },
data: dataPost, data: dataPost,
}) })
@ -232,6 +235,8 @@ const ModalEditLabel = (props) => {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token // 'Authorization': token
'Authorization': Store.getState().isLogin.access_token,
}, },
body: JSON.stringify(dataUploadImg) body: JSON.stringify(dataUploadImg)
}) })
@ -277,6 +282,8 @@ const ModalEditLabel = (props) => {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
// 'Authorization': token // 'Authorization': token
}, },
body: JSON.stringify({ body: JSON.stringify({

7
app/src/components/Modal/ModalEdit.js
View File

@ -9,6 +9,7 @@ import React, { useEffect, useRef, useState } from 'react';
import { Button, Modal } from 'react-bootstrap'; import { Button, Modal } from 'react-bootstrap';
import swal from 'sweetalert'; import swal from 'sweetalert';
import { HOST } from '../../config/index'; import { HOST } from '../../config/index';
import Store from '../../store';
@ -84,6 +85,8 @@ const Modaledit = (props) => {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
// 'Authorization': token, // 'Authorization': token,
}, },
data: dataPost, data: dataPost,
@ -229,6 +232,8 @@ const Modaledit = (props) => {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
// 'Authorization': token // 'Authorization': token
}, },
body: JSON.stringify(dataUploadImg) body: JSON.stringify(dataUploadImg)
@ -273,7 +278,7 @@ const Modaledit = (props) => {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token 'Authorization': Store.getState().isLogin.access_token,
}, },
body: JSON.stringify({ body: JSON.stringify({
person_obj_id: crrData._id ? crrData._id : "", person_obj_id: crrData._id ? crrData._id : "",

5
app/src/components/Modal/ModalEditImg.js
View File

@ -3,6 +3,7 @@ import moment from 'moment';
import 'moment/locale/vi'; import 'moment/locale/vi';
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Button, Modal } from 'react-bootstrap'; import { Button, Modal } from 'react-bootstrap';
import Store from '../../store';
import swal from 'sweetalert'; import swal from 'sweetalert';
import { HOST } from '../../config/index'; import { HOST } from '../../config/index';
@ -25,11 +26,11 @@ class ModalEditImg extends Component {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token 'Authorization': Store.getState().isLogin.access_token,
}, },
body: JSON.stringify({ body: JSON.stringify({
"origin_name": this.state.valueImg.origin_name, "origin_name": this.state.valueImg.origin_name,
"obj_id": this.state.valueImg._id "obj_id": this.state.valueImg._id,
}) })
}).then((response) => { }).then((response) => {
return ( return (

7
app/src/components/Modal/ModalPassword.js
View File

@ -5,6 +5,7 @@ import React from 'react';
import { Button, Modal } from 'react-bootstrap'; import { Button, Modal } from 'react-bootstrap';
import swal from 'sweetalert'; import swal from 'sweetalert';
import { HOST } from '../../config/index'; import { HOST } from '../../config/index';
import Store from '../../store';
const ModalPassword = (props) => { const ModalPassword = (props) => {
const { show, onHide, obj_id } = props; const { show, onHide, obj_id } = props;
@ -14,7 +15,11 @@ const ModalPassword = (props) => {
const click_handle = async () => { const click_handle = async () => {
let dataPost = {password: form.getFieldValue('password')} let dataPost = {password: form.getFieldValue('password')}
console.log(dataPost, obj_id) console.log(dataPost, obj_id)
const result = await axios.patch(`${HOST}/api/users/${obj_id}/password`, { password: form.getFieldValue('password') }) const headers = {
'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
}
const result = await axios.patch(`${HOST}/api/users/${obj_id}/password`,{headers} ,{ password: form.getFieldValue('password') })
if (result.data.status === 10000) { if (result.data.status === 10000) {
swal({ swal({
icon: 'success', icon: 'success',

10
app/src/components/Modal/ModalRole.js
View File

@ -5,6 +5,7 @@ import Switch from "react-switch";
import swal from 'sweetalert'; import swal from 'sweetalert';
import $ from 'jquery'; import $ from 'jquery';
import Select from "react-select"; import Select from "react-select";
import Store from '../../store';
import { HOST } from '../../config/index'; import { HOST } from '../../config/index';
class ModalRole extends Component { class ModalRole extends Component {
@ -61,6 +62,7 @@ class ModalRole extends Component {
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token // 'Authorization': token
'Authorization': Store.getState().isLogin.access_token,
}, },
body: JSON.stringify(dataPost) body: JSON.stringify(dataPost)
}).then((response) => { }).then((response) => {
@ -96,7 +98,7 @@ class ModalRole extends Component {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token 'Authorization': Store.getState().isLogin.access_token,
}, },
body: JSON.stringify(dataPost) body: JSON.stringify(dataPost)
}).then((response) => { }).then((response) => {
@ -178,6 +180,8 @@ class ModalRole extends Component {
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token // 'Authorization': token
'Authorization': Store.getState().isLogin.access_token,
}, },
}).then((response) => { }).then((response) => {
return response.json() return response.json()
@ -196,6 +200,8 @@ class ModalRole extends Component {
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token // 'Authorization': token
'Authorization': Store.getState().isLogin.access_token,
}, },
}).then((response) => { }).then((response) => {
return response.json() return response.json()
@ -358,7 +364,7 @@ class ModalRole extends Component {
<form id="formAddRole"> <form id="formAddRole">
<div className="col-xl-12"> <div className="col-xl-12">
<div className="m-widget14"> <div className="m-widget14">
<div className="form-group m-form__group"> <div className="form-group m-form__group font-family-text">
<label htmlFor="Name">Tên <span className="text-danger"> *</span></label> <label htmlFor="Name">Tên <span className="text-danger"> *</span></label>
<input className="form-control m-input" id="Name" name='name' value={this.state.crrRole.name === '' ? '' : this.state.crrRole.name} onKeyDown={(event) => this.handleEnter(event)} onChange={e => this.RoleHandle(e)} placeholder="Tên" required /> <input className="form-control m-input" id="Name" name='name' value={this.state.crrRole.name === '' ? '' : this.state.crrRole.name} onKeyDown={(event) => this.handleEnter(event)} onChange={e => this.RoleHandle(e)} placeholder="Tên" required />
</div> </div>

2
app/src/components/Modal/ModalUpload.js
View File

@ -9,6 +9,7 @@ import LoadingOverlay from 'react-loading-overlay';
import { PulseLoader } from 'react-spinners'; import { PulseLoader } from 'react-spinners';
import swal from 'sweetalert'; import swal from 'sweetalert';
import { HOST } from '../../config/index'; import { HOST } from '../../config/index';
import Store from '../../store';
const { Dragger } = Upload; const { Dragger } = Upload;
@ -40,6 +41,7 @@ const ModalUpload = (props) => {
headers: { headers: {
"X-Requested-With": "XMLHttpRequest", "X-Requested-With": "XMLHttpRequest",
"Content-Type": "application/x-www-form-urlencoded", "Content-Type": "application/x-www-form-urlencoded",
'Authorization': Store.getState().isLogin.access_token,
} }
}) })
) )

8
app/src/components/Modal/ModalUser.js
View File

@ -9,6 +9,7 @@ import React, { useEffect, useRef, useState } from 'react';
import { Button, Modal } from 'react-bootstrap'; import { Button, Modal } from 'react-bootstrap';
import swal from 'sweetalert'; import swal from 'sweetalert';
import { HOST } from '../../config/index'; import { HOST } from '../../config/index';
import Store from '../../store';
const { Option } = Select; const { Option } = Select;
@ -52,7 +53,11 @@ const ModalUser = (props) => {
const getLevel = async () => { const getLevel = async () => {
let result = await axios.get(`${HOST}/api/levels/company/1`) const headers = {
'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
}
let result = await axios.get(`${HOST}/api/levels/company/1`, {headers} )
if (result.data.status === 10000) { if (result.data.status === 10000) {
var listOptions = [] var listOptions = []
for (let i = 0; i < result.data.data.length; i++) { for (let i = 0; i < result.data.data.length; i++) {
@ -85,6 +90,7 @@ const ModalUser = (props) => {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token, // 'Authorization': token,
'Authorization': Store.getState().isLogin.access_token,
}, },
data: dataPost, data: dataPost,
}) })

14
app/src/components/Role/Role.js
View File

@ -51,6 +51,7 @@ class Role extends Component {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token // 'Authorization': token
'Authorization': Store.getState().isLogin.access_token,
}, },
}).then((response) => { }).then((response) => {
return response.json() return response.json()
@ -91,6 +92,7 @@ class Role extends Component {
method: 'DELETE', method: 'DELETE',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
// 'Authorization': token, // 'Authorization': token,
}, },
}).then((response) => { }).then((response) => {
@ -210,7 +212,7 @@ class Role extends Component {
<div className="m-portlet__head p-3"> <div className="m-portlet__head p-3">
<div className="m-portlet__head-caption pl-3"> <div className="m-portlet__head-caption pl-3">
<div className="m-portlet__head-title"> <div className="m-portlet__head-title">
<h3 className="m-portlet__head-text"> <h3 className="font-family-text">
Thiết lập quyền Thiết lập quyền
</h3> </h3>
</div> </div>
@ -231,10 +233,10 @@ class Role extends Component {
}, },
modalRole: true, modalRole: true,
}); });
}} className="btn btn-accent m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air"> }} className="btn btn-primary m-btn--custom m-btn--icon" style={{backgroundColor:'#2673b4'}}>
<span> <span>
<i className="la la-plus" /> <i className="la la-plus" />
<span>Thêm mới</span> <span className='font-family-text'>Thêm mới</span>
</span> </span>
</button> </button>
</li> </li>
@ -246,13 +248,13 @@ class Role extends Component {
<div className="col-xl-12"> <div className="col-xl-12">
<div className="m-widget1 col-xl-8 mx-auto"> <div className="m-widget1 col-xl-8 mx-auto">
<div className="table-responsive text-nowrap"> <div className="table-responsive text-nowrap">
<table className="table table-bordered table-hover table-checkable dataTable no-footer dtr-inline collapsed"> <table className="table table-bordered font-family-text color table-hover table-checkable dataTable no-footer dtr-inline collapsed">
<thead> <thead className='k-grid-header' role='rowgroup' style={{color: 'white', fontWeight: 600, fontSize: 16, backgroundColor: '#2673b4'}}>
<tr> <tr>
<th style={{ 'verticalAlign': 'middle', 'width': '100px' }}>STT</th> <th style={{ 'verticalAlign': 'middle', 'width': '100px' }}>STT</th>
<th style={{ 'verticalAlign': 'middle' }}>Tên</th> <th style={{ 'verticalAlign': 'middle' }}>Tên</th>
{/* <th style={{ 'verticalAlign': 'middle', 'width': '200px' }}>Trạng thái</th> */} {/* <th style={{ 'verticalAlign': 'middle', 'width': '200px' }}>Trạng thái</th> */}
{(this.state.dataRole?.indexOf('level:edit') === -1 && this.state.dataRole?.indexOf('level:delete') === -1) ? "" : <th style={{ 'verticalAlign': 'middle', 'width': '150px' }}>Thao tác</th>} {(this.state.dataRole?.indexOf('level:edit') === -1 && this.state.dataRole?.indexOf('level:delete') === -1) ? "" : <th style={{ 'verticalAlign': 'middle', 'width': '150px'}}>Thao tác</th>}
</tr> </tr>
</thead> </thead>
<tbody> <tbody>

16
app/src/components/SearchImg/SearchImage.js
View File

@ -135,7 +135,7 @@ class SearchImage extends Component {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': 'Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJyb2xlcyI6WyJjbGFzc2lmeS9sb2dpbiJdLCJleHAiOjE2NDE5NzQ5NjV9.2F2PAUKjpfjPJKzgvzgCDtyBuTXDRl86EnJJGdYgWTM' 'Authorization': Store.getState().isLogin.access_token,
}, },
body: JSON.stringify({ body: JSON.stringify({
encodings: this.state.selectedEncoding, encodings: this.state.selectedEncoding,
@ -205,6 +205,7 @@ class SearchImage extends Component {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
}, },
body: JSON.stringify({ body: JSON.stringify({
image: image_base64 image: image_base64
@ -395,20 +396,21 @@ class SearchImage extends Component {
> >
<p style={{wordWrap: "break-word", marginBottom: "0px"}}><strong>facebookID: </strong>{value.person_id}</p> <p style={{wordWrap: "break-word", marginBottom: "0px"}}><strong>facebookID: </strong>{value.person_id}</p>
<p style={{wordWrap: "break-word"}}><strong>ImageID: </strong>{value.image_id}</p> <p style={{wordWrap: "break-word"}}><strong>ImageID: </strong>{value.image_id}</p>
<p style={{wordWrap: "break-word"}}><strong>Độ chính xác: </strong>{parseFloat(value.confidence * 100).toFixed(2)}%</p>
</Card> </Card>
</div> </div>
) )
}); });
console.log('oke em', this.state.isLogin);
return ( return (
<div className="m-portlet m-portlet--mobile pb-3"> <div className="m-portlet m-portlet--mobile pb-3">
<div className="m-portlet__head"> <div className="m-portlet__head">
<div className="m-portlet__head-caption"> <div className="m-portlet__head-caption">
<div className="m-portlet__head-title"> <div className="m-portlet__head-title">
<h3 className="m-portlet__head-text"> <h3 className="font-family-text color">
Tìm kiếm ảnh Tìm kiếm ảnh
</h3> </h3>
</div> </div>
@ -446,7 +448,7 @@ class SearchImage extends Component {
</div> </div>
<div style={{ marginTop: '10px', textAlign: 'left' }}> <div style={{ marginTop: '10px', textAlign: 'left' }}>
<table> <table>
<tbody> <tbody className='font-family-text'>
<tr> <tr>
<td> <td>
<span>Số kết quả: </span> <span>Số kết quả: </span>
@ -480,10 +482,10 @@ class SearchImage extends Component {
this.getPerson(); this.getPerson();
}) })
}} }}
className="btn btn-accent m-btn m-btn--icon"> className="btn btn-sm btn-primary m-btn--icon" style={{backgroundColor: '#2673b4'}}>
<span> <span>
<i className="la la-search" /> <i className="la la-search" />
<span>Tìm kiếm</span> <span className='font-family-text'>Tìm kiếm</span>
</span> </span>
</button> </button>
</div> </div>
@ -507,7 +509,7 @@ class SearchImage extends Component {
/> />
</div> </div>
<div className="pull-right"> <div className="pull-right">
<div>Tổng kết quả <b>{this.state.totalLength}</b></div> <div className='font-family-text'>Tổng kết quả <b>{this.state.totalLength}</b></div>
</div> </div>
</div> </div>

6
app/src/components/Test/Test.js
View File

@ -45,7 +45,7 @@ export default function Test() {
<div className="m-portlet__head"> <div className="m-portlet__head">
<div className="m-portlet__head-caption"> <div className="m-portlet__head-caption">
<div className="m-portlet__head-title"> <div className="m-portlet__head-title">
<h3 className="m-portlet__head-text"> <h3 className="font-family-text color">
Độ chính xác Độ chính xác
</h3> </h3>
</div> </div>
@ -53,7 +53,7 @@ export default function Test() {
</div> </div>
<div className="m-portlet__body pt-2"> <div className="m-portlet__body pt-2">
<div className="pb-4 pt-4"> <div className="pb-4 pt-4">
<button type="button" onClick={() => test()} className="btn btn-success">Test</button> <button type="button" onClick={() => test()} className="btn font-family-text btn-primary" style={{backgroundColor: '#2673b4'}}>Test</button>
</div> </div>
<PulseLoader <PulseLoader
// css={override} // css={override}
@ -65,7 +65,7 @@ export default function Test() {
/> />
{text.length > 0 && text.map((item, index) => { {text.length > 0 && text.map((item, index) => {
return ( return (
<p>{item}</p> <p className='font-family-text color'>{item}</p>
) )
})} })}

23
app/src/components/User/User.js
View File

@ -12,6 +12,7 @@ import swal from 'sweetalert';
import { useLocation } from 'react-router-dom'; import { useLocation } from 'react-router-dom';
import Switch from "react-switch"; import Switch from "react-switch";
import Select from "react-select"; import Select from "react-select";
import Store from '../../store';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
const initialDataPost = { const initialDataPost = {
@ -86,7 +87,7 @@ export default function User() {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token, 'Authorization': Store.getState().isLogin.access_token,
}, },
}) })
if (result.data.status === 10000) { if (result.data.status === 10000) {
@ -137,7 +138,7 @@ export default function User() {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
// 'Authorization': token 'Authorization': Store.getState().isLogin.access_token,
}, },
data: data ? data : dataPost, data: data ? data : dataPost,
}) })
@ -283,7 +284,7 @@ export default function User() {
<div className="m-portlet__head p-3"> <div className="m-portlet__head p-3">
<div className="m-portlet__head-caption pl-3"> <div className="m-portlet__head-caption pl-3">
<div className="m-portlet__head-title"> <div className="m-portlet__head-title">
<h3 className="m-portlet__head-text"> <h3 className="font-family-text">
Quản lý người dùng Quản lý người dùng
</h3> </h3>
</div> </div>
@ -313,7 +314,7 @@ export default function User() {
className="btn btn-accent m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air"> className="btn btn-accent m-btn m-btn--custom m-btn--icon m-btn--pill m-btn--air">
<span> <span>
<i className="la la-plus" /> <i className="la la-plus" />
<span>Thêm</span> <span className='font-family-text'>Thêm</span>
</span> </span>
</button> </button>
{/* : {/* :
@ -336,7 +337,7 @@ export default function User() {
}} }}
value={dataPost.search_data} value={dataPost.search_data}
id="inputSearch" id="inputSearch"
className="form-control m-input" className="form-control m-input font-family-text"
placeholder="Tên đăng nhập/Họ tên..." placeholder="Tên đăng nhập/Họ tên..."
data-col-index={0} /> data-col-index={0} />
</div> </div>
@ -353,10 +354,10 @@ export default function User() {
setActivePage(1) setActivePage(1)
getData(dataPost) getData(dataPost)
}} }}
className="btn btn-accent m-btn m-btn--icon" id="m_search"> className="btn btn-primary m-btn m-btn--icon" style={{backgroundColor: '#2673b4'}} id="m_search">
<span> <span>
<i className="la la-search" /> <i className="la la-search" />
<span>Tìm kiếm</span> <span className='font-family-text'>Tìm kiếm</span>
</span> </span>
</button> </button>
</div> </div>
@ -368,16 +369,16 @@ export default function User() {
className="btn btn-secondary m-btn m-btn--icon" id="m_reset"> className="btn btn-secondary m-btn m-btn--icon" id="m_reset">
<span> <span>
<i className="la la-rotate-left" /> <i className="la la-rotate-left" />
<span>Tải lại</span> <span className='font-family-text'>Tải lại</span>
</span> </span>
</button> </button>
</div> </div>
</div> </div>
<div className="table-responsive text-nowrap"> <div className="table-responsive text-nowrap">
<table className="table table-bordered table-hover table-checkable dataTable no-footer dtr-inline collapsed"> <table className="table table-bordered font-family-text color table-hover table-checkable dataTable no-footer dtr-inline collapsed">
<thead> <thead className='k-grid-header' role='rowgroup' style={{backgroundColor: '#2673b4'}}>
<tr> <tr className='font-family-text color' style={{color: 'white', fontWeight: 600, fontSize: 16,}}>
<th style={{ 'verticalAlign': 'middle', 'width': '80px' }}>STT</th> <th style={{ 'verticalAlign': 'middle', 'width': '80px' }}>STT</th>
<th style={{ 'verticalAlign': 'middle', 'width': '240px' }}>Tên đăng nhập</th> <th style={{ 'verticalAlign': 'middle', 'width': '240px' }}>Tên đăng nhập</th>
<th style={{ 'verticalAlign': 'middle', 'width': '280px' }}>Họ tên</th> <th style={{ 'verticalAlign': 'middle', 'width': '280px' }}>Họ tên</th>

18
app/src/components/layouts/Header.js
View File

@ -13,6 +13,7 @@ class Header extends Component {
username : localStorage.getItem('username'), username : localStorage.getItem('username'),
obj_id : localStorage.getItem('obj_id'), obj_id : localStorage.getItem('obj_id'),
isLogin: Store.getState().isLogin.isLogin, isLogin: Store.getState().isLogin.isLogin,
role: JSON.parse(localStorage.getItem('roles')),
access_token: Store.getState().isLogin.access_token, access_token: Store.getState().isLogin.access_token,
full_name: "" full_name: ""
}; };
@ -29,6 +30,7 @@ class Header extends Component {
headers: { headers: {
'Accept': 'application/json', 'Accept': 'application/json',
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': Store.getState().isLogin.access_token,
}, },
}) })
.then(response => { .then(response => {
@ -36,8 +38,11 @@ class Header extends Component {
}).then(data => { }).then(data => {
if (data.status === 10000) { if (data.status === 10000) {
Store.dispatch(setbox(data.data.company_id)); Store.dispatch(setbox(data.data.company_id));
localStorage.setItem("roles", JSON.stringify(data.data.roles));
Store.dispatch(role(data.data.roles)); Store.dispatch(role(data.data.roles));
this.setState({ this.setState({
role: data.data.roles,
full_name: data.data.full_name full_name: data.data.full_name
}) })
} }
@ -129,6 +134,8 @@ class Header extends Component {
</div> </div>
</div> </div>
</li> </li>
{
this.state.role?.indexOf('avatar:hidden') === -1 ? (
<li className="m-nav__item m-dropdown m-dropdown--medium m-dropdown--arrow m-dropdown--align-right m-dropdown--mobile-full-width m-dropdown--skin-light icon_logout" m-dropdown-toggle="click"> <li className="m-nav__item m-dropdown m-dropdown--medium m-dropdown--arrow m-dropdown--align-right m-dropdown--mobile-full-width m-dropdown--skin-light icon_logout" m-dropdown-toggle="click">
<a href="#" className="m-nav__link m-dropdown__toggle"> <a href="#" className="m-nav__link m-dropdown__toggle">
<span className="m-topbar__userpic"> <span className="m-topbar__userpic">
@ -147,8 +154,8 @@ class Header extends Component {
<img src="/img/photo-placeholder.png" className="m--img-rounded m--marginless" alt="" /> <img src="/img/photo-placeholder.png" className="m--img-rounded m--marginless" alt="" />
</div> </div>
<div className="m-card-user__details"> <div className="m-card-user__details">
<span className="m-card-user__name m--font-weight-500">{this.state.username}</span> <span className="font-family-text m-card-user__name m--font-weight-500">{this.state.username}</span>
<div href="#/" className="m-card-user__email m--font-weight-300 m-link">{this.state.full_name}</div> <div href="#/" className="m-card-user__email m--font-weight-300 m-link"><span className='font-family-text'>{this.state.full_name}</span></div>
</div> </div>
</div> </div>
</div> </div>
@ -163,7 +170,10 @@ class Header extends Component {
localStorage.removeItem("access_token"); localStorage.removeItem("access_token");
window.location.href = "/login"; window.location.href = "/login";
}} }}
>Đăng Xuất</a> ><span className='font-family-text'>
Đăng Xuất
</span>
</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -171,6 +181,8 @@ class Header extends Component {
</div> </div>
</div> </div>
</li> </li>
) : null
}
</ul> </ul>
</div> </div>
</div> </div>

32
app/src/components/layouts/MenuBar.js
View File

@ -37,9 +37,9 @@ class MenuBar extends Component {
console.log(this.state.dataRole) console.log(this.state.dataRole)
return ( return (
<div id="m_aside_left" className="m-aside-left m-aside-left--skin-dark"> <div id="m_aside_left" className="m-aside-left m-aside-left--skin-dark" style={{backgroundColor: '#2673b4'}}>
{/* BEGIN: Aside Menu */} {/* BEGIN: Aside Menu */}
<div id="m_ver_menu" className="m-aside-menu m-aside-menu--skin-dark m-aside-menu--submenu-skin-dark " data-menu-vertical="true" m-menu-scrollable={1} m-menu-dropdown-timeout={500}> <div id="m_ver_menu" className="m-aside-menu" data-menu-vertical="true" m-menu-scrollable={1} m-menu-dropdown-timeout={500}>
<ul className="m-menu__nav m-menu__nav--dropdown-submenu-arrow "> <ul className="m-menu__nav m-menu__nav--dropdown-submenu-arrow ">
<li className="m-menu__section m-menu__section--first"> <li className="m-menu__section m-menu__section--first">
{/* <h4 className="m-menu__section-text">Departments</h4> */} {/* <h4 className="m-menu__section-text">Departments</h4> */}
@ -48,10 +48,10 @@ class MenuBar extends Component {
{this.state.dataRole?.indexOf('search:view') !== -1 ? {this.state.dataRole?.indexOf('search:view') !== -1 ?
<li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover"> <li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover">
<NavLink to="/search-image" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}> <NavLink to="/search-image" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}>
<i className="m-menu__link-icon flaticon-search-1" /> <i className="m-menu__link-icon fa fa-search" style={{color: 'white'}} />
<span className="m-menu__link-title"> <span className="m-menu__link-title">
<span className="m-menu__link-wrap"> <span className="m-menu__link-wrap">
<span className="m-menu__link-text">Tìm kiếm</span> <span className="text-navbar" style={{fontSize: 20, fontFamily: 'Roboto'}}>Tìm kiếm</span>
</span> </span>
</span> </span>
</NavLink> </NavLink>
@ -61,10 +61,10 @@ class MenuBar extends Component {
{this.state.dataRole?.indexOf('import:view') !== -1 ? {this.state.dataRole?.indexOf('import:view') !== -1 ?
<li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover"> <li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover">
<NavLink to="/import-image" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}> <NavLink to="/import-image" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}>
<i className="m-menu__link-icon flaticon-tabs" /> <i className="m-menu__link-icon fa fa-file-image" style={{color: 'white'}} />
<span className="m-menu__link-title"> <span className="m-menu__link-title">
<span className="m-menu__link-wrap"> <span className="m-menu__link-wrap">
<span className="m-menu__link-text">Kho ảnh</span> <span className="text-navbar" style={{fontSize: 20, fontFamily: 'Roboto'}}>Kho ảnh</span>
</span> </span>
</span> </span>
</NavLink> </NavLink>
@ -74,10 +74,10 @@ class MenuBar extends Component {
{this.state.dataRole?.indexOf('famous:view') !== -1 ? {this.state.dataRole?.indexOf('famous:view') !== -1 ?
<li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover"> <li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover">
<NavLink to="/list-famous" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}> <NavLink to="/list-famous" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}>
<i className="m-menu__link-icon flaticon-avatar" /> <i className="m-menu__link-icon fa fa-user-tie mr-2" style={{color: 'white'}} />
<span className="m-menu__link-title"> <span className="m-menu__link-title">
<span className="m-menu__link-wrap"> <span className="m-menu__link-wrap">
<span className="m-menu__link-text">Người nổi tiếng</span> <span className="text-navbar" style={{fontSize: 20, fontFamily: 'Roboto'}}>Người nổi tiếng</span>
</span> </span>
</span> </span>
</NavLink> </NavLink>
@ -87,10 +87,10 @@ class MenuBar extends Component {
{this.state.dataRole?.indexOf('person:view') !== -1 ? {this.state.dataRole?.indexOf('person:view') !== -1 ?
<li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover"> <li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover">
<NavLink to="/label-image" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}> <NavLink to="/label-image" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}>
<i className="m-menu__link-icon flaticon-delete" /> <i className="m-menu__link-icon fa fa-tags" style={{color: 'white'}} />
<span className="m-menu__link-title"> <span className="m-menu__link-title">
<span className="m-menu__link-wrap"> <span className="m-menu__link-wrap">
<span className="m-menu__link-text">Gán nhãn</span> <span className="text-navbar" style={{fontSize: 20, fontFamily: 'Roboto'}}>Gán nhãn</span>
</span> </span>
</span> </span>
</NavLink> </NavLink>
@ -100,10 +100,10 @@ class MenuBar extends Component {
{this.state.dataRole?.indexOf('user:view') !== -1 ? {this.state.dataRole?.indexOf('user:view') !== -1 ?
<li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover"> <li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover">
<NavLink to="/user" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}> <NavLink to="/user" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}>
<i className="m-menu__link-icon flaticon-users" /> <i className="m-menu__link-icon fas fa-user-cog mr-2" style={{color: 'white'}} />
<span className="m-menu__link-title"> <span className="m-menu__link-title">
<span className="m-menu__link-wrap"> <span className="m-menu__link-wrap">
<span className="m-menu__link-text">Quản lý người dùng</span> <span className="text-navbar" style={{fontSize: 20, fontFamily: 'Roboto'}}>Quản lý người dùng</span>
</span> </span>
</span> </span>
</NavLink> </NavLink>
@ -113,10 +113,10 @@ class MenuBar extends Component {
{this.state.dataRole?.indexOf('level:view') !== -1 ? {this.state.dataRole?.indexOf('level:view') !== -1 ?
<li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover"> <li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover">
<NavLink to="/role" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}> <NavLink to="/role" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}>
<i className="m-menu__link-icon flaticon-map" /> <i className="m-menu__link-icon fa fa-sitemap" style={{color: 'white'}} />
<span className="m-menu__link-title"> <span className="m-menu__link-title">
<span className="m-menu__link-wrap"> <span className="m-menu__link-wrap">
<span className="m-menu__link-text">Thiết lập quyền</span> <span className="text-navbar" style={{fontSize: 20, fontFamily: 'Roboto'}}>Thiết lập quyền</span>
</span> </span>
</span> </span>
</NavLink> </NavLink>
@ -126,10 +126,10 @@ class MenuBar extends Component {
{this.state.dataRole?.indexOf('level:view') !== -1 ? {this.state.dataRole?.indexOf('level:view') !== -1 ?
<li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover"> <li className="m-menu__item m-menu__item--submenu" aria-haspopup="true" m-menu-submenu-toggle="hover">
<NavLink to="/test" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}> <NavLink to="/test" className={"m-menu__link " + active} activeClassName="m-menu__item--active" onClick={() => this.onClickClose()}>
<i className="m-menu__link-icon flaticon-edit" /> <i className="m-menu__link-icon fa fa-user-check" style={{color: 'white'}} />
<span className="m-menu__link-title"> <span className="m-menu__link-title">
<span className="m-menu__link-wrap"> <span className="m-menu__link-wrap">
<span className="m-menu__link-text">Độ chính xác</span> <span className="text-navbar" style={{fontSize: 20, fontFamily: 'Roboto'}}>Độ chính xác</span>
</span> </span>
</span> </span>
</NavLink> </NavLink>

18
app/src/index.css
View File

@ -1,13 +1,17 @@
body { body {
margin: 0; margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', font-family: 'Roboto Condensed', sans-serif;
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', font-size: 15px;
sans-serif; line-height: 1.5;
-webkit-font-smoothing: antialiased; color: black;
-moz-osx-font-smoothing: grayscale; font-weight: 100;
} }
code { code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', margin: 0;
monospace; font-family: 'Roboto Condensed', sans-serif;
font-size: 15px;
line-height: 1.5;
color: black;
font-weight: 100;
} }

4
app/src/reducers/role/index.js
View File

@ -1,7 +1,9 @@
import {ROLE} from '../../actions/role'; import {ROLE} from '../../actions/role';
let roles = JSON.parse(localStorage.getItem('roles'));
const initialState = { const initialState = {
role: null role: roles
}; };
export default function role(state = initialState, action) { export default function role(state = initialState, action) {
switch(action.type){ switch(action.type){

1
app/src/router/ReactRouter.js
View File

@ -46,6 +46,7 @@ class ReactRouter extends Component {
: :
'' ''
} }
{ {
this.state.dataRole?.indexOf('search:view') !== -1 this.state.dataRole?.indexOf('search:view') !== -1
? ?

15529
app/yarn.lock
View File

File diff suppressed because it is too large Load Diff