Skip to content

Commit

Permalink
Merge de725c3 into bad2984
Browse files Browse the repository at this point in the history
  • Loading branch information
CalamityC committed Oct 20, 2023
2 parents bad2984 + de725c3 commit acf4689
Show file tree
Hide file tree
Showing 6 changed files with 134 additions and 88 deletions.
27 changes: 15 additions & 12 deletions rdmo/management/assets/js/components/common/Links.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import isUndefined from 'lodash/isUndefined'
import Link from 'rdmo/core/assets/js/components/Link'
import LinkButton from 'rdmo/core/assets/js/components/LinkButton'

const NestedLink = ({ href, title, onClick, show=true }) => {
const NestedLink = ({ href, title, onClick, show = true }) => {
return show && <Link href={href} className="element-link fa fa-align-right flip" title={title} onClick={onClick} />
}

Expand Down Expand Up @@ -74,7 +74,7 @@ const AvailableLink = ({ available, locked, title, onClick, disabled }) => {
})

return <LinkButton className={className} title={locked ? gettext('Locked') : title}
disabled={locked || disabled} onClick={onClick} />
disabled={locked || disabled} onClick={onClick} />
}

AvailableLink.propTypes = {
Expand Down Expand Up @@ -120,7 +120,7 @@ ShowElementsLink.propTypes = {
onClick: PropTypes.func.isRequired
}

const ExportLink = ({ exportUrl, title, exportFormats, csv=false, full=false }) => {
const ExportLink = ({ exportUrl, title, exportFormats, csv = false, full = false }) => {
return (
<span className="dropdown">
<button className="element-btn-link btn-link fa fa-download" title={title} data-toggle="dropdown"></button>
Expand All @@ -144,8 +144,8 @@ const ExportLink = ({ exportUrl, title, exportFormats, csv=false, full=false })
{
exportFormats.map(([key, label], index) => <li key={index}>
<a href={`${exportUrl}${key}/`}
target={['pdf', 'html'].includes(key) ? '_blank' : '_self'}
rel="noreferrer">{label}</a>
target={['pdf', 'html'].includes(key) ? '_blank' : '_self'}
rel="noreferrer">{label}</a>
</li>)
}
</ul>
Expand All @@ -169,7 +169,7 @@ const ExtendLink = ({ extend, onClick }) => {
})

const title = extend ? gettext('Show less')
: gettext('Show more')
: gettext('Show more')

return <Link className={className} title={title} onClick={onClick} />
}
Expand All @@ -179,18 +179,19 @@ ExtendLink.propTypes = {
onClick: PropTypes.func.isRequired
}

const CodeLink = ({ className, uri, onClick }) => {
const CodeLink = ({ className, uri, onClick, order }) => {
return (
<Link onClick={onClick}>
<><Link onClick={onClick}>
<code className={className}>{uri}</code>
</Link>
</Link>{order !== undefined && order !== null ? <code className="code-order ng-binding">{order}</code> : null}</>
)
}

CodeLink.propTypes = {
className: PropTypes.string.isRequired,
uri: PropTypes.string.isRequired,
onClick: PropTypes.func.isRequired
onClick: PropTypes.func.isRequired,
order: PropTypes.number
}

const ErrorLink = ({ element, onClick }) => {
Expand Down Expand Up @@ -235,5 +236,7 @@ ShowLink.propTypes = {
onClick: PropTypes.func.isRequired
}

export { EditLink, CopyLink, AddLink, AvailableLink, LockedLink, ShowElementsLink,
NestedLink, ExportLink, ExtendLink, CodeLink, ErrorLink, WarningLink, ShowLink }
export {
EditLink, CopyLink, AddLink, AvailableLink, LockedLink, ShowElementsLink,
NestedLink, ExportLink, ExtendLink, CodeLink, ErrorLink, WarningLink, ShowLink
}
40 changes: 23 additions & 17 deletions rdmo/management/assets/js/components/element/Page.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,15 @@ import { buildPath } from '../../utils/location'
import QuestionSet from './QuestionSet'
import Question from './Question'
import { ElementErrors } from '../common/Errors'
import { EditLink, CopyLink, AddLink, LockedLink, NestedLink,
ExportLink, CodeLink, ShowElementsLink } from '../common/Links'
import {
EditLink, CopyLink, AddLink, LockedLink, NestedLink,
ExportLink, CodeLink, ShowElementsLink
} from '../common/Links'
import { ReadOnlyIcon } from '../common/Icons'
import { Drag, Drop } from '../common/DragAndDrop'

const Page = ({ config, page, configActions, elementActions, display='list', indent=0,
filter=false, filterEditors=false }) => {
const Page = ({ config, page, configActions, elementActions, display = 'list', indent = 0,
filter = false, filterEditors = false, order }) => {

const showElement = filterElement(config, filter, false, filterEditors, page)
const showElements = get(config, `display.elements.pages.${page.id}`, true)
Expand All @@ -27,15 +29,14 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
const fetchEdit = () => elementActions.fetchElement('pages', page.id)
const fetchCopy = () => elementActions.fetchElement('pages', page.id, 'copy')
const fetchNested = () => elementActions.fetchElement('pages', page.id, 'nested')
const toggleLocked = () => elementActions.storeElement('pages', {...page, locked: !page.locked })
const toggleLocked = () => elementActions.storeElement('pages', { ...page, locked: !page.locked })
const toggleElements = () => configActions.toggleElements(page)

const createQuestionSet = () => elementActions.createElement('questionsets', { page })
const createQuestion = () => elementActions.createElement('questions', { page })

const fetchAttribute = () => elementActions.fetchElement('attributes', page.attribute)
const fetchCondition = (index) => elementActions.fetchElement('conditions', page.conditions[index])

const elementNode = (
<div className="element">
<div className="pull-right">
Expand All @@ -45,11 +46,11 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
<EditLink title={gettext('Edit page')} href={editUrl} onClick={fetchEdit} />
<CopyLink title={gettext('Copy page')} href={copyUrl} onClick={fetchCopy} />
<AddLink title={gettext('Add question')} altTitle={gettext('Add question set')}
onClick={createQuestion} onAltClick={createQuestionSet} disabled={page.read_only} />
onClick={createQuestion} onAltClick={createQuestionSet} disabled={page.read_only} />
<LockedLink title={page.locked ? gettext('Unlock page') : gettext('Lock page')}
locked={page.locked} onClick={toggleLocked} disabled={page.read_only} />
locked={page.locked} onClick={toggleLocked} disabled={page.read_only} />
<ExportLink title={gettext('Export page')} exportUrl={exportUrl}
exportFormats={config.settings.export_formats} full={true} />
exportFormats={config.settings.export_formats} full={true} />
<Drag element={page} show={display == 'nested'} />
</div>
<div>
Expand All @@ -58,7 +59,7 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
</p>
{
get(config, 'display.uri.pages', true) && <p>
<CodeLink className="code-questions" uri={page.uri} onClick={() => fetchEdit()} />
<CodeLink className="code-questions" uri={page.uri} onClick={() => fetchEdit()} order={order} />
</p>
}
{
Expand All @@ -82,7 +83,7 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
case 'list':
return showElement && (
<li className="list-group-item">
{ elementNode }
{elementNode}
</li>
)
case 'nested':
Expand All @@ -93,7 +94,7 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
<Drop element={page} elementActions={elementActions}>
<div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
<div className="panel-heading">
{ elementNode }
{elementNode}
</div>
</div>
</Drop>
Expand All @@ -102,13 +103,17 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
{
showElements && page.elements.map((element, index) => {
if (element.model == 'questions.questionset') {
const questionSetInfo = page.questionsets.find(info => info.questionset === element.id)
const questionSetOrder = questionSetInfo ? questionSetInfo.order : undefined
return <QuestionSet key={index} config={config} questionset={element}
configActions={configActions} elementActions={elementActions}
display="nested" filter={filter} indent={indent + 1} />
configActions={configActions} elementActions={elementActions}
display="nested" filter={filter} indent={indent + 1} order={questionSetOrder} />
} else {
const questionInfo = page.questions.find(info => info.question === element.id)
const questionOrder = questionInfo ? questionInfo.order : undefined
return <Question key={index} config={config} question={element}
configActions={configActions} elementActions={elementActions}
display="nested" filter={filter} indent={indent + 1} />
configActions={configActions} elementActions={elementActions}
display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
}
})
}
Expand All @@ -128,7 +133,8 @@ Page.propTypes = {
display: PropTypes.string,
indent: PropTypes.number,
filter: PropTypes.string,
filterEditors: PropTypes.bool
filterEditors: PropTypes.bool,
order: PropTypes.number
}

export default Page
19 changes: 10 additions & 9 deletions rdmo/management/assets/js/components/element/Question.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ import { EditLink, CopyLink, LockedLink, ExportLink, CodeLink } from '../common/
import { ReadOnlyIcon } from '../common/Icons'
import { Drag, Drop } from '../common/DragAndDrop'

const Question = ({ config, question, elementActions, display='list', indent=0,
filter=false, filterEditors=false }) => {
const Question = ({ config, question, elementActions, display = 'list', indent = 0,
filter = false, filterEditors = false, order }) => {

const showElement = filterElement(config, filter, false, filterEditors, question)

Expand All @@ -21,7 +21,7 @@ const Question = ({ config, question, elementActions, display='list', indent=0,

const fetchEdit = () => elementActions.fetchElement('questions', question.id)
const fetchCopy = () => elementActions.fetchElement('questions', question.id, 'copy')
const toggleLocked = () => elementActions.storeElement('questions', {...question, locked: !question.locked })
const toggleLocked = () => elementActions.storeElement('questions', { ...question, locked: !question.locked })

const fetchAttribute = () => elementActions.fetchElement('attributes', question.attribute)
const fetchCondition = (index) => elementActions.fetchElement('conditions', question.conditions[index])
Expand All @@ -34,9 +34,9 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
<EditLink title={gettext('Edit question')} href={editUrl} onClick={fetchEdit} />
<CopyLink title={gettext('Copy question')} href={copyUrl} onClick={fetchCopy} />
<LockedLink title={question.locked ? gettext('Unlock question') : gettext('Lock question')}
locked={question.locked} onClick={toggleLocked} disabled={question.read_only} />
locked={question.locked} onClick={toggleLocked} disabled={question.read_only} />
<ExportLink title={gettext('Export question')} exportUrl={exportUrl}
exportFormats={config.settings.export_formats} full={true} />
exportFormats={config.settings.export_formats} full={true} />
<Drag element={question} show={display == 'nested'} />
</div>
<div>
Expand All @@ -46,7 +46,7 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
</p>
{
get(config, 'display.uri.questions', true) && <p>
<CodeLink className="code-questions" uri={question.uri} onClick={() => fetchEdit()} />
<CodeLink className="code-questions" uri={question.uri} onClick={() => fetchEdit()} order={order} />
</p>
}
{
Expand Down Expand Up @@ -77,7 +77,7 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
case 'list':
return showElement && (
<li className="list-group-item">
{ elementNode }
{elementNode}
</li>
)
case 'nested':
Expand All @@ -87,7 +87,7 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
showElement && (
<div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
<div className="panel-body">
{ elementNode }
{elementNode}
</div>
</div>
)
Expand All @@ -106,7 +106,8 @@ Question.propTypes = {
display: PropTypes.string,
indent: PropTypes.number,
filter: PropTypes.string,
filterEditors: PropTypes.bool
filterEditors: PropTypes.bool,
order: PropTypes.number
}

export default Question
41 changes: 24 additions & 17 deletions rdmo/management/assets/js/components/element/QuestionSet.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,15 @@ import { buildPath } from '../../utils/location'

import Question from './Question'
import { ElementErrors } from '../common/Errors'
import { EditLink, CopyLink, AddLink, LockedLink,
NestedLink, ExportLink, CodeLink, ShowElementsLink } from '../common/Links'
import {
EditLink, CopyLink, AddLink, LockedLink,
NestedLink, ExportLink, CodeLink, ShowElementsLink
} from '../common/Links'
import { ReadOnlyIcon } from '../common/Icons'
import { Drag, Drop } from '../common/DragAndDrop'

const QuestionSet = ({ config, questionset, configActions, elementActions, display='list', indent=0,
filter=false, filterEditors=false }) => {
const QuestionSet = ({ config, questionset, configActions, elementActions, display = 'list', indent = 0,
filter = false, filterEditors = false, order }) => {

const showElement = filterElement(config, filter, false, filterEditors, questionset)
const showElements = get(config, `display.elements.questionsets.${questionset.id}`, true)
Expand All @@ -26,7 +28,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
const fetchEdit = () => elementActions.fetchElement('questionsets', questionset.id)
const fetchCopy = () => elementActions.fetchElement('questionsets', questionset.id, 'copy')
const fetchNested = () => elementActions.fetchElement('questionsets', questionset.id, 'nested')
const toggleLocked = () => elementActions.storeElement('questionsets', {...questionset, locked: !questionset.locked })
const toggleLocked = () => elementActions.storeElement('questionsets', { ...questionset, locked: !questionset.locked })
const toggleElements = () => configActions.toggleElements(questionset)

const createQuestionSet = () => elementActions.createElement('questionsets', { questionset })
Expand All @@ -44,11 +46,11 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
<EditLink title={gettext('Edit question set')} href={editUrl} onClick={fetchEdit} />
<CopyLink title={gettext('Copy question set')} href={copyUrl} onClick={fetchCopy} />
<AddLink title={gettext('Add question')} altTitle={gettext('Add question set')}
onClick={createQuestion} onAltClick={createQuestionSet} disabled={questionset.read_only} />
onClick={createQuestion} onAltClick={createQuestionSet} disabled={questionset.read_only} />
<LockedLink title={questionset.locked ? gettext('Unlock question set') : gettext('Lock question set')}
locked={questionset.locked} onClick={toggleLocked} disabled={questionset.read_only} />
locked={questionset.locked} onClick={toggleLocked} disabled={questionset.read_only} />
<ExportLink title={gettext('Export question set')} exportUrl={exportUrl}
exportFormats={config.settings.export_formats} full={true} />
exportFormats={config.settings.export_formats} full={true} />
<Drag element={questionset} show={display == 'nested'} />
</div>
<div>
Expand All @@ -57,11 +59,11 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
</p>
{
get(config, 'display.uri.questionsets', true) && <p>
<CodeLink className="code-questions" uri={questionset.uri} onClick={() => fetchEdit()} />
<CodeLink className="code-questions" uri={questionset.uri} onClick={() => fetchEdit()} order={order} />
</p>
}
{
get(config, 'display.uri.attributes', true) && questionset.attribute_uri &&<p>
get(config, 'display.uri.attributes', true) && questionset.attribute_uri && <p>
<CodeLink className="code-domain" uri={questionset.attribute_uri} onClick={() => fetchAttribute()} />
</p>
}
Expand All @@ -81,7 +83,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
case 'list':
return showElement && (
<li className="list-group-item">
{ elementNode }
{elementNode}
</li>
)
case 'nested':
Expand All @@ -92,7 +94,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
<Drop element={questionset} elementActions={elementActions}>
<div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
<div className="panel-heading">
{ elementNode }
{elementNode}
</div>
</div>
</Drop>
Expand All @@ -101,13 +103,17 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
{
showElements && questionset.elements.map((element, index) => {
if (element.model == 'questions.questionset') {
const questionSetInfo = questionset.questionsets.find(info => info.questionset === element.id)
const questionSetOrder = questionSetInfo ? questionSetInfo.order : undefined
return <QuestionSet key={index} config={config} questionset={element}
configActions={configActions} elementActions={elementActions}
display="nested" filter={filter} indent={indent + 1} />
configActions={configActions} elementActions={elementActions}
display="nested" filter={filter} indent={indent + 1} order={questionSetOrder} />
} else {
const questionInfo = questionset.questions.find(info => info.question === element.id)
const questionOrder = questionInfo ? questionInfo.order : undefined
return <Question key={index} config={config} question={element}
configActions={configActions} elementActions={elementActions}
display="nested" filter={filter} indent={indent + 1} />
configActions={configActions} elementActions={elementActions}
display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
}
})
}
Expand All @@ -127,7 +133,8 @@ QuestionSet.propTypes = {
display: PropTypes.string,
indent: PropTypes.number,
filter: PropTypes.string,
filterEditors: PropTypes.bool
filterEditors: PropTypes.bool,
order: PropTypes.number
}

export default QuestionSet
Loading

0 comments on commit acf4689

Please sign in to comment.