Commit aead0649 authored by PDuarte's avatar PDuarte

project platforms layout

parent 330411df
......@@ -24,7 +24,7 @@
href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;1,400;1,500;1,600"
/>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css" crossorigin="" />
<title>Vuexy - React Admin Dashboard Template</title>
<title>cmsTV - React Admin Dashboard </title>
</head>
<body>
<div id="root"></div>
......
......@@ -17,19 +17,19 @@ export default [
title: 'platforms',
icon: <HardDrive />,
navLink: '/settings/platforms'
},
{
id: 'locationsDash',
title: 'locations',
icon: <Globe />,
navLink: '/settings/locations'
},
{
id: 'contriesDash',
title: 'Contries',
icon: <Flag />,
navLink: '/settings/contries'
}
// {
// id: 'locationsDash',
// title: 'locations',
// icon: <Globe />,
// navLink: '/settings/locations'
// },
// {
// id: 'contriesDash',
// title: 'Contries',
// icon: <Flag />,
// navLink: '/settings/contries'
// }
]
}
]
......@@ -13,7 +13,7 @@ import settings from './settings'
// ** Merge & Export
export default [
...dashboards,
// ...dashboards,
...settings
// ...apps,
// ...pages,
......
......@@ -17,19 +17,19 @@ export default [
title: 'platforms',
icon: <HardDrive />,
navLink: '/settings/platforms'
},
{
id: 'locationsDash',
title: 'locations',
icon: <Globe />,
navLink: '/settings/locations'
},
{
id: 'contriesDash',
title: 'Contries',
icon: <Flag />,
navLink: '/settings/contries'
}
// {
// id: 'locationsDash',
// title: 'locations',
// icon: <Globe />,
// navLink: '/settings/locations'
// },
// {
// id: 'contriesDash',
// title: 'Contries',
// icon: <Flag />,
// navLink: '/settings/contries'
// }
]
}
]
......@@ -3,8 +3,8 @@ import {Media, Button, Label, Form, FormGroup, Input, Table, CustomInput, Card,
import { Lock, Edit, Trash2 } from 'react-feather'
const ProjectPlatform = () => {
const ProjectPlatform = ({dataElement}) => {
console.log(dataElement)
return (
<div clssName='permissions border mt-1'>
<h6 className='py-1 mx-1 mb-0 font-medium-2'>
......@@ -15,7 +15,10 @@ return (
<thead className='thead-light'>
<tr>
<th>Platforms</th>
<th>Active</th>
<th>Locked</th>
<th>Menu start status</th>
<th>Min version</th>
<th>Menu orientation</th>
</tr>
</thead>
<tbody>
......
import {Media, Button, Label, Form, FormGroup, Input, Table, CustomInput, Card, CardBody, Row, Col, Nav, NavItem, NavLink, TabContent, TabPane, Alert } from 'reactstrap'
import { Fragment, useState, useEffect, memo } from 'react'
import {Media, Button, Label, Form, FormGroup, Input, Table, CustomInput, Card, CardBody, Row, Col, Nav, NavItem, NavLink, TabContent, TabPane, Alert, UncontrolledButtonDropdown } from 'reactstrap'
// ** Store & Actions
import { useDispatch } from 'react-redux'
// ** Store & Actions
import { getData_platforms } from '../../store/actions'
import { Lock, Edit, Trash2 } from 'react-feather'
import { useForm } from 'react-hook-form'
import classnames from 'classnames'
const ProjectPlatform = ({dataElement, store}) => {
const dispatch = useDispatch(),
{ register, errors, handleSubmit } = useForm()
const [plataforms, setPlataforms] = useState(null)
console.log(dataElement)
console.log(store)
// ** Function to get user on mount
useEffect(() => {
if (!store.allDataPlatforms || store.allDataPlatforms.length < 1) {
dispatch(getData_platforms({
start: 1,
length: 1000,
q: null
}))
}
}, [dispatch])
const ProjectPlatform = () => {
useEffect(() => {
setPlataforms(store.allDataPlatforms)
}, [store.allDataPlatforms])
return (
return !!dataElement ? (
<div clssName='permissions border mt-1'>
<h6 className='py-1 mx-1 mb-0 font-medium-2'>
<Lock size={18} className='mr-25' />
<span className='align-middle'>Platforms</span>
</h6>
<Table borderless striped responsive>
<thead className='thead-light'>
<tr>
<th>Platforms</th>
<th>Active</th>
<th>Locked</th>
<th>Menu start status</th>
<th>Min version</th>
<th>Menu orientation</th>
</tr>
</thead>
<tbody>
<tr>
<td>IOS</td>
<td>
<CustomInput type='checkbox' id='admin-1' label='' defaultChecked />
</td>
</tr>
<tr>
<td>Android</td>
<td>
<CustomInput type='checkbox' id='staff-1' label='' />
</td>
</tr>
<tr>
<td>Android Tv</td>
<td>
<CustomInput type='checkbox' id='author-1' label='' defaultChecked />
</td>
</tr>
<tr>
<td>Roku</td>
<td>
<CustomInput type='checkbox' id='contributor-1' label='' />
</td>
</tr>
<tr>
<td>STV</td>
<td>
<CustomInput type='checkbox' id='user-1' label='' />
</td>
</tr>
{
!!dataElement && !!dataElement.platforms && dataElement.platforms.map(platform => {
const plataformsOptions = platform.pivot,
locked = plataformsOptions.locked
return (
<tr key={platform.id}>
<td>{platform.name}</td>
<td>
<CustomInput type='checkbox' id='locked' label='' defaultChecked={locked ? 'true' : ''} />
</td>
<td>
<Input type='select' name='menu_orientation' id='menu_orientation' defaultValue={plataformsOptions && plataformsOptions.menu_orientation}>
<option value='default'>default</option>
<option value='left'>left</option>
<option value='right'>right</option>
<option value='top'>top</option>
<option value='bottom'>bottom</option>
</Input>
</td>
<td>
<Input
type='text'
name='min_version'
id='min_version'
innerRef={register({ required: true })}
placeholder='0'
defaultValue={plataformsOptions && plataformsOptions.min_version}
className={classnames({ 'is-invalid': errors['min_version'] })}
/>
</td>
<td>
<Input
type='text'
name='menu_start_status'
id='menu_start_status'
innerRef={register({ required: true })}
placeholder='0'
defaultValue={plataformsOptions && plataformsOptions.menu_start_status}
className={classnames({ 'is-invalid': errors['menu_start_status'] })}
/>
</td>
</tr>
)
})
}
</tbody>
</Table>
<Col md='12' sm='12'>
<br />
</Col>
<Row>
<Col md='4' sm='4'>
<FormGroup>
<Label for='addoption'>Add Platforms</Label>
<Input type='select' name='addoption' id='addoption' >
{!!plataforms && plataforms.map(option => {
return <option key={option.id} value='{option.name}'>{option.name}</option>
})}
</Input>
</FormGroup>
</Col>
<Col md='3' sm='4'>
<FormGroup>
<Label for='addoptionbutton'>&nbsp;</Label>
<Button.Ripple color='secondary' name="addoptionbutton" outline onClick={() => {}} >
add
</Button.Ripple>
</FormGroup>
</Col>
</Row>
</div>
) : (
<Fragment>
</Fragment>
)
}
export default ProjectPlatform
......@@ -163,8 +163,8 @@ return (
</FormGroup>
</Col> */}
<Col sm='6'>
<ProjectPlatform />
<Col sm='12'>
<ProjectPlatform dataElement={dataProject} store={store} />
</Col>
<Col className='d-flex flex-sm-row flex-column mt-2' sm='12'>
<Button.Ripple className='mb-1 mb-sm-0 mr-0 mr-sm-1' type='submit' color='primary'>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment