Skip to content

Commit a748236

Browse files
pro-odoopro-odoo
committed
[REF] gauge_chart_panel: inline templates
In an attemp to make templates clearer, we try to remove as much as possible templates used with `t-call`. Two possible stragegies: - inline template in the parent template - create a child component For gauge, inlining template is enough. The proof that it's usefull => 6 `t-set` were useless and have been removed Task: 6087887 Part-of: #8274 Signed-off-by: Lucas Lefèvre (lul) <lul@odoo.com>
1 parent 22e42c7 commit a748236

1 file changed

Lines changed: 82 additions & 79 deletions

File tree

‎src/components/side_panel/chart/gauge_chart_panel/gauge_chart_design_panel.xml‎

Lines changed: 82 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -35,89 +35,92 @@
3535
</Section>
3636

3737
<Section title.translate="Thresholds">
38-
<t t-call="o-spreadsheet-GaugeChartColorSectionTemplate">
39-
<t t-set="sectionRule" t-value="state.sectionRule"/>
40-
</t>
38+
<div class="o-gauge-color-set">
39+
<table>
40+
<tr>
41+
<th class="o-gauge-color-set-colorPicker"/>
42+
<th class="o-gauge-color-set-text"/>
43+
<th class="o-gauge-color-set-operator"/>
44+
<th class="o-gauge-color-set-value">Value</th>
45+
<th class="o-gauge-color-set-type">Type</th>
46+
</tr>
47+
48+
<tr>
49+
<td>
50+
<RoundColorPicker
51+
currentColor="state.sectionRule.colors.lowerColor"
52+
onColorPicked="(color) => this.updateSectionColor('lowerColor', color)"
53+
/>
54+
</td>
55+
<td>When value is</td>
56+
<td class="pe-2">
57+
<Select
58+
selectedValue="state.sectionRule['lowerInflectionPoint'].operator"
59+
name="'operatorType'"
60+
values="inflectionPointOperators"
61+
onChange.bind="(value) => this.updateSectionRuleOperator('lowerInflectionPoint', value)"
62+
/>
63+
</td>
64+
<td class="pe-2">
65+
<StandaloneComposer t-props="getGaugeInflectionComposerProps('lowerColor')"/>
66+
</td>
67+
<td>
68+
<Select
69+
selectedValue="state.sectionRule['lowerInflectionPoint'].type"
70+
name="'valueType'"
71+
values="inflectionPointTypes"
72+
onChange.bind="(value) => this.updateSectionRulePointType('lowerInflectionPoint', value)"
73+
/>
74+
</td>
75+
</tr>
76+
77+
<tr>
78+
<td>
79+
<RoundColorPicker
80+
currentColor="state.sectionRule.colors.middleColor"
81+
onColorPicked="(color) => this.updateSectionColor('middleColor', color)"
82+
/>
83+
</td>
84+
<td>When value is</td>
85+
<td class="pe-2">
86+
<Select
87+
selectedValue="state.sectionRule['upperInflectionPoint'].operator"
88+
name="'operatorType'"
89+
values="inflectionPointOperators"
90+
onChange.bind="(value) => this.updateSectionRuleOperator('upperInflectionPoint', value)"
91+
/>
92+
</td>
93+
<td class="pe-2">
94+
<StandaloneComposer t-props="getGaugeInflectionComposerProps('middleColor')"/>
95+
</td>
96+
<td>
97+
<Select
98+
selectedValue="state.sectionRule['upperInflectionPoint'].type"
99+
name="'valueType'"
100+
values="inflectionPointTypes"
101+
onChange.bind="(value) => this.updateSectionRulePointType('upperInflectionPoint', value)"
102+
/>
103+
</td>
104+
</tr>
105+
106+
<tr>
107+
<td>
108+
<RoundColorPicker
109+
currentColor="state.sectionRule.colors.upperColor"
110+
onColorPicked="(color) => this.updateSectionColor('upperColor', color)"
111+
/>
112+
</td>
113+
<td>Else</td>
114+
<td/>
115+
<td/>
116+
<td/>
117+
</tr>
118+
</table>
119+
</div>
41120
</Section>
42121

43122
<ChartErrorSection t-if="designErrorMessages.length" messages="designErrorMessages"/>
44123
</t>
45124
</SidePanelCollapsible>
46125
</t>
47-
48-
<t t-name="o-spreadsheet-GaugeChartColorSectionTemplate">
49-
<div class="o-gauge-color-set">
50-
<table>
51-
<tr>
52-
<th class="o-gauge-color-set-colorPicker"/>
53-
<th class="o-gauge-color-set-text"/>
54-
<th class="o-gauge-color-set-operator"/>
55-
<th class="o-gauge-color-set-value">Value</th>
56-
<th class="o-gauge-color-set-type">Type</th>
57-
</tr>
58-
59-
<t t-call="o-spreadsheet-GaugeChartColorSectionTemplateRow">
60-
<t t-set="sectionColor" t-value="sectionRule.colors.lowerColor"/>
61-
<t t-set="sectionType" t-value="'lowerColor'"/>
62-
<t t-set="inflectionPoint" t-value="'lowerInflectionPoint'"/>
63-
<t t-set="isInvalid" t-value="isLowerInflectionPointInvalid"/>
64-
<t t-set="inflectionPointName" t-value="'lowerInflectionPoint'"/>
65-
</t>
66-
67-
<t t-call="o-spreadsheet-GaugeChartColorSectionTemplateRow">
68-
<t t-set="sectionColor" t-value="sectionRule.colors.middleColor"/>
69-
<t t-set="sectionType" t-value="'middleColor'"/>
70-
<t t-set="inflectionPoint" t-value="'upperInflectionPoint'"/>
71-
<t t-set="isInvalid" t-value="isUpperInflectionPointInvalid"/>
72-
<t t-set="inflectionPointName" t-value="'upperInflectionPoint'"/>
73-
</t>
74-
75-
<tr>
76-
<td>
77-
<RoundColorPicker
78-
currentColor="sectionRule.colors.upperColor"
79-
onColorPicked="(color) => this.updateSectionColor('upperColor', color)"
80-
/>
81-
</td>
82-
<td>Else</td>
83-
<td/>
84-
<td/>
85-
<td/>
86-
</tr>
87-
</table>
88-
</div>
89-
</t>
90-
91-
<t t-name="o-spreadsheet-GaugeChartColorSectionTemplateRow">
92-
<tr>
93-
<td>
94-
<RoundColorPicker
95-
currentColor="sectionColor"
96-
onColorPicked="(color) => this.updateSectionColor(sectionType, color)"
97-
/>
98-
</td>
99-
<td>When value is</td>
100-
<td class="pe-2">
101-
<t t-set="below">below</t>
102-
<t t-set="belowOrEqualTo">below or equal to</t>
103-
<Select
104-
selectedValue="sectionRule[inflectionPoint].operator"
105-
name="'operatorType'"
106-
values="inflectionPointOperators"
107-
onChange.bind="(value) => this.updateSectionRuleOperator(inflectionPoint, value)"
108-
/>
109-
</td>
110-
<td class="pe-2">
111-
<StandaloneComposer t-props="getGaugeInflectionComposerProps(sectionType)"/>
112-
</td>
113-
<td>
114-
<Select
115-
selectedValue="sectionRule[inflectionPoint].type"
116-
name="'valueType'"
117-
values="inflectionPointTypes"
118-
onChange.bind="(value) => this.updateSectionRulePointType(inflectionPoint, value)"
119-
/>
120-
</td>
121-
</tr>
122-
</t>
123126
</templates>

0 commit comments

Comments
 (0)