Skip to content

C
cms
Commit 98f489d0 authored by PDuarte's avatar PDuarte
Browse files
Options

asset textual read

parent befd5801
Show whitespace changes
Inline Side-by-side
Showing with 129 additions and 176 deletions
src/views/assets/projectassets/card/index.js
View file @ 98f489d0
......@@ -11,12 +11,6 @@ import { isObjEmpty } from '@utils'
import { Bell, Check, X, AlertTriangle, Info } from 'react-feather'
import ManageAssets from './manageassets'
// import TabLayoutPlaylist from './tablayoutplaylists'
// ** Store & Actions
import {resetResults} from '../../store/actions'
import { getData_pagetypes } from '../../../settings/store/actions'
......@@ -29,6 +23,8 @@ import classnames from 'classnames'
import Swal from 'sweetalert2'
import withReactContent from 'sweetalert2-react-content'
import TextualBlock from './textual'
// ** Styles
import '@styles/react/apps/app-users.scss'
......@@ -251,11 +247,34 @@ return (
</Col>
</Row>
{/* <Row className='app-user-edit'>
<Row className='app-user-edit'>
<Col sm='12'>
<ManageAssets dataElement={dataElement && dataElement.assets} />
/</Col>
</Row> */}
<Card>
<CardBody className='pt-2'>
<Nav pills>
<NavItem>
<NavLink
active={true}
onClick={() => toggle(0)}
>
<span className='align-middle d-none d-sm-block'>Textual</span>
</NavLink>
</NavItem>
</Nav>
<TabContent
activeTab={activeTab}
>
<TabPane tabId={0}>
<TextualBlock dataElement={dataElement && dataElement.textual}/>
</TabPane>
</TabContent>
</CardBody>
</Card>
</Col>
</Row>
<Row className='app-user-edit'>
<Col className='d-flex flex-sm-row flex-column mt-2' sm='12'>
......
src/views/assets/projectassets/card/manageassets.js deleted 100644 → 0
View file @ befd5801
import { useState, useEffect } from 'react'
import { useSelector, useDispatch } from 'react-redux'
// ** Third Party Components
import { Row, Col, FormGroup, Label, Input, Button } from 'reactstrap'
import { useForm } from 'react-hook-form'
import classnames from 'classnames'
import { getData_menupagesplaylists } from '../../store/actions'
import DataTableServerSide from '@components/datatable'
import { element } from 'prop-types'
// ** Table Server Side Column
const serverSideColumns = [
{
name: 'ID',
selector: 'id',
sortable: true,
minWidth: '25px'
},
{
name: 'Title',
selector: 'title',
sortable: true,
minWidth: '225px'
}
]
const ManageAssets = ({dataElement}) => {
const store = useSelector(state => state.playlists),
[avaliableAssets, setavaliableAssets] = useState([]),
[selectedAssets, setSelectedAssets] = useState([]),
dispatch = useDispatch()
const handleAdd = (value) => {
const newValue = selectedAssets.concat(value)
setSelectedAssets(newValue)
}
const handleRemove = (value) => {
const newValue = selectedAssets.filter(element => element.id !== value.id)
setSelectedAssets(newValue)
}
const getData_selectedAssets = (params) => {
return (dispatch) => {
if (params.q === '') {
if (dataElement === null) return
setSelectedAssets(dataElement)
return
}
const newValue = dataElement.filter(element => element.title.includes(params.q))
setSelectedAssets(newValue)
}
}
const serverSideColumnsLeft = [
...serverSideColumns,
{
name: 'Action',
selector: 'Action',
sortable: true,
minWidth: '25px',
cell: row => (
<div className='d-flex justify-content-left align-items-center'>
<div className='d-flex flex-column'>
<Button className='user-name text-truncate mb-0'
onClick={() => { handleRemove(row) }}
>
<span className='font-weight-bold'>Remove</span>
</Button>
</div>
</div>
)
}
]
const serverSideColumnsRight = [
...serverSideColumns,
{
name: 'Action',
selector: 'Action',
sortable: true,
minWidth: '25px',
cell: row => (
<div className='d-flex justify-content-left align-items-center'>
<div className='d-flex flex-column'>
<Button className='user-name text-truncate mb-0'
onClick={() => { handleAdd(row) }}
>
<span className='font-weight-bold'>Add</span>
</Button>
</div>
</div>
)
}
]
const getData_avaliableAssets = (params) => {
return (dispatch) => {
if (selectedAssets === null) return
const Ids = selectedAssets.map(elem => elem.id),
// tabAssets = store.allDataAssets.filter(element => !Ids.includes(element.id))
tabAssets = []
if (params.q === null || params.q === '') {
setavaliableAssets(tabAssets)
return
}
const newValue = tabAssets.filter(element => element.title.includes(params.q))
setavaliableAssets(newValue)
}
}
useEffect(() => {
const Ids = selectedAssets.map(elem => elem.id)
const filtered = store.allDataPlaylists.filter(element => !Ids.includes(element.id))
setavaliableAssets(filtered)
}, [store.allDataPlaylists])
useEffect(() => {
const Ids = selectedAssets.map(elem => elem.id)
const filtered = store.allDataPlaylists.filter(element => !Ids.includes(element.id))
setavaliableAssets(filtered)
}, [selectedAssets])
useEffect(() => {
if (dataElement !== null) {
setSelectedAssets(dataElement)
}
}, [dataElement])
return <div className="card">
<div className="card-header">
<h4 className="card-title">Assets</h4>
</div>
<div className="card-body">
<Row>
<Col sm='6'>
<DataTableServerSide
cardTitle='Content'
allData={selectedAssets}
getData={getData_selectedAssets}
serverSideColumns={serverSideColumnsLeft}
// linkAddButton={`/add`}
total={selectedAssets.length}
/>
</Col>
<Col sm='6'>
<DataTableServerSide
cardTitle='List to add'
allData={avaliableAssets}
getData={getData_avaliableAssets}
serverSideColumns={serverSideColumnsRight}
// linkAddButton={`/add`}
total={store.totalMenuPages}
/>
</Col>
</Row>
</div>
</div>
}
export default ManageAssets
\ No newline at end of file
src/views/assets/projectassets/card/textual.js 0 → 100644
View file @ 98f489d0
import { Fragment, useEffect } from 'react'
import { useSelector, useDispatch } from 'react-redux'
import {getProject} from '../../../settings/store/actions'
import { Card, CardBody, Row, Col, CardHeader, CardTitle, Label, Input, FormGroup, CardText } from 'reactstrap'
import { languages } from 'prismjs'
const PlanLang = ({language, dataElement}) => {
return <Fragment>
<CardTitle tag="h5">{language.name} Textual </CardTitle>
<Col md='12' sm='12'>
<FormGroup>
<Label for='title'>Titlle</Label>
<Input
type='text'
name='title'
id='title'
// innerRef={register({ required: true })}
placeholder='title'
defaultValue={dataElement && dataElement.title}
// className={classnames({ 'is-invalid': errors['title'] })}
/>
</FormGroup>
</Col>
<Col md='12' sm='12'>
<FormGroup>
<Label for='longdescription'>Long description</Label>
<Input
type='textarea'
name='longdescription'
id='longdescription'
// innerRef={register({ required: true })}
placeholder='longdescription'
defaultValue={dataElement && dataElement.longdescription}
// className={classnames({ 'is-invalid': errors['shortdescriptions'] })}
/>
</FormGroup>
</Col>
<Col md='12' sm='12'>
<FormGroup>
<Label for='shortdescriptions'>Short description</Label>
<Input
type='textarea'
name='shortdescriptions'
id='shortdescriptions'
// innerRef={register({ required: true })}
placeholder='shortdescriptions'
defaultValue={dataElement && dataElement.shortdescriptions}
// className={classnames({ 'is-invalid': errors['shortdescriptions'] })}
/>
</FormGroup>
</Col>
</Fragment>
}
const TextualBlock = ({dataElement}) => {
const store = useSelector(state => state.projectsettings),
dispatch = useDispatch()
// populate layout menus
useEffect(() => {
if (!store.selectedProject || store.selectedProject.length < 1) {
dispatch(getProject(2))
}
}, [dispatch])
return <Row>
<Col sm='12'>
<Card>
<CardBody className='pt-2'>
{ store.selectedProject !== null
&& dataElement
&& store.selectedProject.languages.map(language => {
let textuals = dataElement.filter(e => e.langcode === language.langcode)
if (textuals.length < 1) {
textuals = [
{
id: '<genrated>',
idassets: '<assetid>',
langcode: language.langcode,
longdescription: '',
shortdescriptions: '',
title: ''
}
]
console.log(textuals)
}
return <PlanLang key={language.id} language={language} dataElement={textuals[0]} />
}
)}
</CardBody>
</Card>
</Col>
</Row>
}
export default TextualBlock
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