Skip to content

Commit 9c9341f

Browse files
jochenklarjochenklar
authored
Merge pull request #770 from rdmorganiser/refactor_options
Refactor options
2 parents 5e63c75 + f3444f1 commit 9c9341f

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+638
-237
lines changed

‎rdmo/core/static/core/css/base.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,10 @@ a {
7575
color: #a94442;
7676
}
7777
}
78+
79+
&.disabled {
80+
cursor: not-allowed;
81+
}
7882
}
7983

8084
code {

‎rdmo/core/static/core/css/utils.scss

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,92 @@
1+
.flip {
2+
transform: rotate(180deg) scaleX(-1);
3+
}
4+
5+
.w-100 {
6+
width: 100%;
7+
}
8+
.mt-0 {
9+
margin-top: 0;
10+
}
11+
.mt-5 {
12+
margin-top: 5px;
13+
}
14+
.mt-10 {
15+
margin-top: 10px;
16+
}
17+
.mt-20 {
18+
margin-top: 20px;
19+
}
20+
.mr-0 {
21+
margin-right: 0;
22+
}
23+
.mr-5 {
24+
margin-right: 5px;
25+
}
26+
.mr-10 {
27+
margin-right: 10px;
28+
}
29+
.mr-20 {
30+
margin-right: 20px;
31+
}
132
.mb-0 {
233
margin-bottom: 0;
334
}
35+
.mb-5 {
36+
margin-bottom: 5px;
37+
}
38+
.mb-10 {
39+
margin-bottom: 10px;
40+
}
441
.mb-20 {
542
margin-bottom: 20px;
643
}
44+
.ml-0 {
45+
margin-left: 0;
46+
}
47+
.ml-5 {
48+
margin-left: 5px;
49+
}
50+
.ml-10 {
51+
margin-left: 10px;
52+
}
53+
.ml-20 {
54+
margin-left: 20px;
55+
}
56+
57+
.pt-0 {
58+
padding-top: 0;
59+
}
60+
.pt-10 {
61+
padding-top: 10px;
62+
}
63+
.pt-20 {
64+
padding-top: 20px;
65+
}
66+
.pr-0 {
67+
padding-right: 0;
68+
}
69+
.pr-10 {
70+
padding-right: 10px;
71+
}
72+
.pr-20 {
73+
padding-right: 20px;
74+
}
75+
.pb-0 {
76+
padding-bottom: 0;
77+
}
78+
.pb-10 {
79+
padding-bottom: 10px;
80+
}
81+
.pb-20 {
82+
padding-bottom: 20px;
83+
}
84+
.pl-0 {
85+
padding-left: 0;
86+
}
87+
.pl-10 {
88+
padding-left: 10px;
89+
}
90+
.pl-20 {
91+
padding-left: 20px;
92+
}

‎rdmo/core/xml.py

Lines changed: 22 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import re
33

44
import defusedxml.ElementTree as ET
5+
from packaging.version import parse
56

67
log = logging.getLogger(__name__)
78

@@ -117,12 +118,15 @@ def strip_ns(tag, ns_map):
117118

118119

119120
def convert_elements(elements, version):
120-
# in future versions, this method can be extended
121-
# using packaging.version.parse
122-
if version is None:
123-
return convert_legacy_elements(elements)
124-
else:
125-
return elements
121+
parsed_version = parse('1.11.0') if version is None else parse(version)
122+
123+
if parsed_version < parse('2.0.0'):
124+
elements = convert_legacy_elements(elements)
125+
126+
if parsed_version < parse('2.1.0'):
127+
elements = convert_additional_input(elements)
128+
129+
return elements
126130

127131

128132
def convert_legacy_elements(elements):
@@ -211,6 +215,18 @@ def convert_legacy_elements(elements):
211215
return elements
212216

213217

218+
def convert_additional_input(elements):
219+
for uri, element in elements.items():
220+
if element['model'] == 'options.option':
221+
additional_input = element.get('additional_input')
222+
if additional_input == 'True':
223+
element['additional_input'] = 'text'
224+
else:
225+
element['additional_input'] = ''
226+
227+
return elements
228+
229+
214230
def order_elements(elements):
215231
ordered_elements = {}
216232
for uri, element in elements.items():

‎rdmo/management/assets/js/actions/configActions.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,13 @@ export function fetchConfig() {
1717
CoreApi.fetchSettings(),
1818
CoreApi.fetchSites(),
1919
ManagementApi.fetchMeta(),
20+
OptionsApi.fetchAdditionalInputs(),
2021
OptionsApi.fetchProviders(),
2122
QuestionsApi.fetchValueTypes(),
2223
QuestionsApi.fetchWidgetTypes()
23-
]).then(([relations, groups, settings, sites, meta, providers,
24+
]).then(([relations, groups, settings, sites, meta, additionalInputs, providers,
2425
valueTypes, widgetTypes]) => dispatch(fetchConfigSuccess({
25-
relations, groups, settings, sites, meta, providers, valueTypes, widgetTypes
26+
relations, groups, settings, sites, meta, additionalInputs, providers, valueTypes, widgetTypes
2627
})))
2728
}
2829

‎rdmo/management/assets/js/api/OptionsApi.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,10 @@ class OptionsApi extends BaseApi {
5151
return this.delete(`/api/v1/options/options/${option.id}/`)
5252
}
5353

54+
static fetchAdditionalInputs() {
55+
return this.get('/api/v1/options/additionalinputs/')
56+
}
57+
5458
static fetchProviders() {
5559
return this.get('/api/v1/options/providers/')
5660
}

‎rdmo/management/assets/js/components/edit/EditOption.js

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { Tabs, Tab } from 'react-bootstrap'
44
import get from 'lodash/get'
55

66
import Checkbox from './common/Checkbox'
7+
import Radio from './common/Radio'
78
import Select from './common/Select'
89
import Text from './common/Text'
910
import Textarea from './common/Textarea'
@@ -19,7 +20,7 @@ import useDeleteModal from '../../hooks/useDeleteModal'
1920

2021
const EditOption = ({ config, option, elements, elementActions }) => {
2122

22-
const { sites } = config
23+
const { additionalInputs, sites } = config
2324
const { elementAction, parent } = elements
2425

2526
const updateOption = (key, value) => elementActions.updateElement(option, {[key]: value})
@@ -81,10 +82,6 @@ const EditOption = ({ config, option, elements, elementActions }) => {
8182
<Checkbox config={config} element={option} field="locked"
8283
onChange={updateOption} />
8384
</div>
84-
<div className="col-sm-6">
85-
<Checkbox config={config} element={option} field="additional_input"
86-
onChange={updateOption} />
87-
</div>
8885
</div>
8986

9087
<Tabs id="#option-tabs" defaultActiveKey={0} animation={false}>
@@ -95,13 +92,20 @@ const EditOption = ({ config, option, elements, elementActions }) => {
9592
<div className="col-sm-12">
9693
<Text config={config} element={option} field={`text_${lang_code }`}
9794
onChange={updateOption} />
95+
<Textarea config={config} element={option} field={`help_${lang_code }`}
96+
onChange={updateOption} />
97+
<Textarea config={config} element={option} field={`view_text_${lang_code }`}
98+
onChange={updateOption} />
9899
</div>
99100
</div>
100101
</Tab>
101102
))
102103
}
103104
</Tabs>
104105

106+
<Radio config={config} element={option} field="additional_input"
107+
options={additionalInputs} onChange={updateOption} />
108+
105109
{get(config, 'settings.multisite') && <Select config={config} element={option} field="editors"
106110
options={sites} onChange={updateOption} isMulti />}
107111
</div>

‎rdmo/management/assets/js/components/edit/common/Radio.js

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
import React from 'react'
2+
import PropTypes from 'prop-types'
3+
import classNames from 'classnames'
4+
import isEmpty from 'lodash/isEmpty'
5+
import isNil from 'lodash/isNil'
6+
import get from 'lodash/get'
7+
8+
import { getId, getLabel, getHelp } from 'rdmo/management/assets/js/utils/forms'
9+
10+
const Radio = ({ config, element, field, options, onChange }) => {
11+
const id = getId(element, field),
12+
label = getLabel(config, element, field),
13+
help = getHelp(config, element, field),
14+
warnings = get(element, ['warnings', field]),
15+
errors = get(element, ['errors', field])
16+
17+
const className = classNames({
18+
'form-group': true,
19+
'has-warning': !isEmpty(warnings),
20+
'has-error': !isEmpty(errors)
21+
})
22+
23+
const value = isNil(element[field]) ? '' : element[field]
24+
25+
return (
26+
<div className={className}>
27+
<label className="control-label" htmlFor={id}>{label}</label>
28+
29+
<div>
30+
{
31+
options.map((option, index) => (
32+
<label key={index} className="radio-inline">
33+
<input type="radio" name="inlineRadioOptions" disabled={element.read_only}
34+
checked={value === option.id}
35+
value={option.id} onChange={event => onChange(field, event.target.value)}/>
36+
<span>{option.text}</span>
37+
</label>
38+
))
39+
}
40+
</div>
41+
42+
{help && <p className="help-block">{help}</p>}
43+
44+
{errors && <ul className="help-block list-unstyled">
45+
{errors.map((error, index) => <li key={index}>{error}</li>)}
46+
</ul>}
47+
</div>
48+
)
49+
}
50+
51+
Radio.propTypes = {
52+
config: PropTypes.object,
53+
element: PropTypes.object,
54+
field: PropTypes.string,
55+
options: PropTypes.array,
56+
onChange: PropTypes.func
57+
}
58+
59+
export default Radio

‎rdmo/management/assets/scss/management.scss

Lines changed: 0 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -3,103 +3,6 @@ $icon-font-path: "bootstrap-sass/assets/fonts/bootstrap/";
33
@import '~font-awesome/css/font-awesome.css';
44
@import 'rdmo/core/assets/scss/variables';
55

6-
a.disabled {
7-
cursor: not-allowed;
8-
}
9-
10-
.flip {
11-
transform: rotate(180deg) scaleX(-1);
12-
}
13-
14-
.w-100 {
15-
width: 100%;
16-
}
17-
.mt-0 {
18-
margin-top: 0;
19-
}
20-
.mt-5 {
21-
margin-top: 5px;
22-
}
23-
.mt-10 {
24-
margin-top: 10px;
25-
}
26-
.mt-20 {
27-
margin-top: 20px;
28-
}
29-
.mr-0 {
30-
margin-right: 0;
31-
}
32-
.mr-5 {
33-
margin-right: 5px;
34-
}
35-
.mr-10 {
36-
margin-right: 10px;
37-
}
38-
.mr-20 {
39-
margin-right: 20px;
40-
}
41-
.mb-0 {
42-
margin-bottom: 0;
43-
}
44-
.mb-5 {
45-
margin-bottom: 5px;
46-
}
47-
.mb-10 {
48-
margin-bottom: 10px;
49-
}
50-
.mb-20 {
51-
margin-bottom: 20px;
52-
}
53-
.ml-0 {
54-
margin-left: 0;
55-
}
56-
.ml-5 {
57-
margin-left: 5px;
58-
}
59-
.ml-10 {
60-
margin-left: 10px;
61-
}
62-
.ml-20 {
63-
margin-left: 20px;
64-
}
65-
66-
.pt-0 {
67-
padding-top: 0;
68-
}
69-
.pt-10 {
70-
padding-top: 10px;
71-
}
72-
.pt-20 {
73-
padding-top: 20px;
74-
}
75-
.pr-0 {
76-
padding-right: 0;
77-
}
78-
.pr-10 {
79-
padding-right: 10px;
80-
}
81-
.pr-20 {
82-
padding-right: 20px;
83-
}
84-
.pb-0 {
85-
padding-bottom: 0;
86-
}
87-
.pb-10 {
88-
padding-bottom: 10px;
89-
}
90-
.pb-20 {
91-
padding-bottom: 20px;
92-
}
93-
.pl-0 {
94-
padding-left: 0;
95-
}
96-
.pl-10 {
97-
padding-left: 10px;
98-
}
99-
.pl-20 {
100-
padding-left: 20px;
101-
}
102-
1036
.form-group {
1047
.react-select__control {
1058
min-height: 34px;

0 commit comments

Comments
 (0)