Skip to content

Commit 193a260

Browse files
mvorisekmvorisek
committed
working query builder
1 parent a241014 commit 193a260

Some content is hidden

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

55 files changed

+951
-6468
lines changed

‎docs/multiline.rst

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -150,8 +150,8 @@ Lets use the example of demos/multiline.php::
150150
parent::init();
151151

152152
$this->addField('item', ['required' => true, 'default' => 'item']);
153-
$this->addField('qty', ['type' => 'integer', 'caption' => 'Qty / Box', 'required' => true, 'ui' => ['multiline' => ['sui-table-cell' => ['width' => 2]]]]);
154-
$this->addField('box', ['type' => 'integer', 'caption' => '# of Boxes', 'required' => true, 'ui' => ['multiline' => ['sui-table-cell' => ['width' => 2]]]]);
153+
$this->addField('qty', ['type' => 'integer', 'caption' => 'Qty / Box', 'required' => true, 'ui' => ['multiline' => [Form\Control\Multiline::TABLE_CELL => ['width' => 2]]]]);
154+
$this->addField('box', ['type' => 'integer', 'caption' => '# of Boxes', 'required' => true, 'ui' => ['multiline' => [Form\Control\Multiline::TABLE_CELL => ['width' => 2]]]]);
155155
$this->addExpression('total', ['expr' => function (Model $row) {
156156
return $row->get('qty') * $row->get('box');
157157
}, 'type' => 'integer']);
@@ -203,7 +203,7 @@ Use the $componentProps property of Multiline in order to apply 'Props' to compo
203203

204204
.. php:attr:: componentProps
205205
206-
Example of changing all Dropdown(sui-dropdown) within Multiline::
206+
Example of changing all Dropdown(SuiDropdown) within Multiline::
207207

208208
$ml = $form->addControl('ml', [Multiline::class, 'compponentProps' => [Multiline::SELECT => ['floating' => true]]]);
209209

@@ -224,7 +224,7 @@ Specific field components Props may be applied using the 'ui' field property whe
224224
Note on Multiline control
225225
-------------------------
226226

227-
Each control inside Multiline is wrap within a table cell(sui-table-cell) component and this component can be customize as
227+
Each control inside Multiline is wrap within a table cell(SuiTableCell) component and this component can be customize as
228228
well using the 'ui' property of the model's field::
229229

230230
$this->addExpression('total', [
@@ -237,7 +237,7 @@ well using the 'ui' property of the model's field::
237237

238238
Table appearance within Multiline
239239
---------------------------------
240-
Table(sui-table) Props can be set using $tableProps property of Multiline::
240+
Table(SuiTable) Props can be set using $tableProps property of Multiline::
241241

242242
$ml = $form->addControl('ml', [Multiline::class, 'tableProps' => ['color' => 'blue']]);
243243

‎js/.eslintrc.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ module.exports = {
4343
balanced: true,
4444
},
4545
}],
46+
'vue/html-indent': ['error', 4],
4647
'jsdoc/require-param': 'off',
4748
'jsdoc/require-param-description': 'off',
4849
'jsdoc/require-returns': 'off',

‎js/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Agile Toolkit js package
1+
# Agile Toolkit JS package
22

33
The javascript package is necessary to run Agile Toolkit UI. It provide necessary
44
jQuery plugin needed for Atk4\Ui and also provide app wide services for Fomantic-UI module.

‎js/src/services/vue.service.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,12 +32,12 @@ class VueService {
3232

3333
_setupComponentAutoloader(app) {
3434
const atkLoadingComponent = {
35-
name: 'atk-vue-loader',
35+
name: 'AtkAutoloaderLoading',
3636
template: '<div><div class="ui active centered inline loader"></div></div>',
3737
};
3838

3939
const atkErrorComponent = {
40-
name: 'atk-vue-error',
40+
name: 'AtkAutoloaderError',
4141
template: '<div class="ui negative message"><p>Error: Unable to load Vue component</p></div>',
4242
};
4343

‎js/src/vue-components/inline-edit.component.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import $ from 'external/jquery';
1010
* value: array, array of value to send to server.
1111
*/
1212
export default {
13-
name: 'atk-inline-edit',
13+
name: 'AtkInlineEdit',
1414
template: `
1515
<div :class="[options.inputCss, hasError ? 'error' : '' ]">
1616
<input
@@ -22,7 +22,7 @@ export default {
2222
@focus="onFocus"
2323
@blur="onBlur"
2424
/>
25-
<i class="icon"></i>
25+
<i class="icon" />
2626
</div>`,
2727
props: {
2828
url: String,

‎js/src/vue-components/item-search.component.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import atk from 'atk';
1313
* reload: string, an Id selector for jQuery, '#' is append automatically.
1414
*/
1515
export default {
16-
name: 'atk-item-search',
16+
name: 'AtkItemSearch',
1717
template: `
1818
<div class="atk-item-search" :class="inputCss">
1919
<input
@@ -24,8 +24,8 @@ export default {
2424
@keyup.esc="onEscape"
2525
name="atk-vue-search"
2626
/>
27-
<i class="atk-search-icon" :class="classIcon"></i>
28-
<span style="width: 12px; cursor: pointer;" @click="onClear"></span>
27+
<i class="atk-search-icon" :class="classIcon" />
28+
<span style="width: 12px; cursor: pointer;" @click="onClear" />
2929
</div>`,
3030
props: {
3131
context: String,

‎js/src/vue-components/multiline/multiline-body.component.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,27 @@
11
import multilineRow from './multiline-row.component';
22

33
export default {
4-
name: 'atk-multiline-body',
4+
name: 'AtkMultilineBody',
55
template: `
6-
<sui-table-body>
7-
<atk-multiline-row
6+
<SuiTableBody>
7+
<AtkMultilineRow
88
:fields="fields"
99
v-for="(row, i) in rows" :key="row.__atkml"
1010
@onTabLastColumn="onTabLastColumn(i)"
1111
:rowId="row.__atkml"
1212
:isDeletable="isDeletableRow(row)"
1313
:rowValues="row"
1414
:error="getError(row.__atkml)"
15-
></atk-multiline-row>
16-
</sui-table-body>`,
15+
></AtkMultilineRow>
16+
</SuiTableBody>`,
1717
props: ['fieldDefs', 'rowData', 'deletables', 'errors'],
1818
data: function () {
1919
return { fields: this.fieldDefs };
2020
},
2121
created: function () {
2222
},
2323
components: {
24-
'atk-multiline-row': multilineRow,
24+
AtkMultilineRow: multilineRow,
2525
},
2626
computed: {
2727
rows: function () {

‎js/src/vue-components/multiline/multiline-cell.component.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import atkDatePicker from '../share/atk-date-picker';
44
import atkLookup from '../share/atk-lookup';
55

66
export default {
7-
name: 'atk-multiline-cell',
7+
name: 'AtkMultilineCell',
88
template: `
99
<component
1010
:is="getComponent()"
@@ -17,10 +17,10 @@ export default {
1717
:name="inputName"
1818
></component>`,
1919
components: {
20-
'atk-multiline-readonly': multilineReadonly,
21-
'atk-multiline-textarea': multilineTextarea,
22-
'atk-date-picker': atkDatePicker,
23-
'atk-lookup': atkLookup,
20+
AtkMultilineReadonly: multilineReadonly,
21+
AtkMultilineTextarea: multilineTextarea,
22+
AtkDatePicker: atkDatePicker,
23+
AtkLookup: atkLookup,
2424
},
2525
props: ['cellData', 'fieldValue'],
2626
data: function () {
@@ -37,7 +37,7 @@ export default {
3737
return this.cellData.definition.component;
3838
},
3939
getComponentProps: function () {
40-
if (this.getComponent() === 'atk-multiline-readonly') {
40+
if (this.getComponent() === 'AtkMultilineReadonly') {
4141
return { readOnlyValue: this.fieldValue };
4242
}
4343

‎js/src/vue-components/multiline/multiline-header.component.js

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,39 @@
11
import atk from 'atk';
22

33
export default {
4-
name: 'atk-multiline-header',
4+
name: 'AtkMultilineHeader',
55
template: `
6-
<sui-table-header>
7-
<sui-table-row v-if="hasError()">
8-
<sui-table-cell :style="{ background: 'none' }"></sui-table-cell>
9-
<sui-table-cell :style="{ background: 'none' }"
6+
<SuiTableHeader>
7+
<SuiTableRow v-if="hasError()">
8+
<SuiTableCell :style="{ background: 'none' }" />
9+
<SuiTableCell :style="{ background: 'none' }"
1010
state="error"
1111
v-for="column in columns"
1212
:textAlign="getTextAlign(column)"
1313
>
14-
<sui-icon v-if="getErrorMsg(column)" name="attention"></sui-icon>
14+
<SuiIcon v-if="getErrorMsg(column)" name="attention" />
1515
{{getErrorMsg(column)}}
16-
</sui-table-cell>
17-
</sui-table-row>
18-
<sui-table-row v-if="hasCaption()">
19-
<sui-table-header-cell :colspan="getVisibleColumns()">{{caption}}</sui-table-header-cell>
20-
</sui-table-row>
21-
<sui-table-row :verticalAlign="'top'">
22-
<sui-table-header-cell :width=1 textAlign="center">
16+
</SuiTableCell>
17+
</SuiTableRow>
18+
<SuiTableRow v-if="hasCaption()">
19+
<SuiTableHeaderCell :colspan="getVisibleColumns()">{{caption}}</SuiTableHeaderCell>
20+
</SuiTableRow>
21+
<SuiTableRow :verticalAlign="'top'">
22+
<SuiTableHeaderCell :width=1 textAlign="center">
2323
<input ref="check" type="checkbox" @input="onToggleDeleteAll" :checked="isChecked" :indeterminate="isIndeterminate" />
24-
</sui-table-header-cell>
25-
<sui-table-header-cell
24+
</SuiTableHeaderCell>
25+
<SuiTableHeaderCell
2626
v-for="column in columns"
2727
:width=column.cellProps.width
2828
:textAlign="getTextAlign(column)"
2929
>
3030
<div>{{column.caption}}</div>
3131
<div v-if="false" :style="{ position: 'absolute', top: '-22px' }">
32-
<sui-label v-if="getErrorMsg(column)" pointing="below" basic color="red">{{getErrorMsg(column)}}</sui-label>
32+
<SuiLabel v-if="getErrorMsg(column)" pointing="below" basic color="red">{{getErrorMsg(column)}}</SuiLabel>
3333
</div>
34-
</sui-table-header-cell>
35-
</sui-table-row>
36-
</sui-table-header>`,
34+
</SuiTableHeaderCell>
35+
</SuiTableRow>
36+
</SuiTableHeader>`,
3737
props: ['fields', 'state', 'errors', 'caption'],
3838
data: function () {
3939
return { columns: this.fields, isDeleteAll: false };

‎js/src/vue-components/multiline/multiline-readonly.component.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
* Simply display a readonly value.
33
*/
44
export default {
5-
name: 'atk-multiline-readonly',
5+
name: 'AtkMultilineReadonly',
66
template: '<div>{{readOnlyValue}}</div>',
77
props: ['readOnlyValue'],
88
};

‎js/src/vue-components/multiline/multiline-row.component.js

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -2,40 +2,40 @@ import atk from 'atk';
22
import multilineCell from './multiline-cell.component';
33

44
/**
5-
* This will create a table td element using sui-table-cell.
5+
* This will create a table td element using SuiTableCell.
66
* The td element is created only if column as set isVisible = true;
77
* The td element will add a multiline cell element.
88
* the multiline cell will set it's own template component depending on the fieldType.
99
* getValue
1010
*/
1111
export default {
12-
name: 'atk-multiline-row',
12+
name: 'AtkMultilineRow',
1313
template: `
14-
<sui-table-row :verticalAlign="'middle'">
15-
<sui-table-cell textAlign="center">
14+
<SuiTableRow :verticalAlign="'middle'">
15+
<SuiTableCell textAlign="center">
1616
<input type="checkbox" @input="onToggleDelete" v-model="toDelete" />
17-
</sui-table-cell>
18-
<sui-table-cell
17+
</SuiTableCell>
18+
<SuiTableCell
1919
v-for="(column, i) in columns"
2020
@keydown.tab="onTab(i)"
2121
v-bind="column.cellProps"
2222
:width=null
2323
:state="getErrorState(column)"
2424
:style="{ overflow: 'visible' }"
2525
>
26-
<atk-multiline-cell
26+
<AtkMultilineCell
2727
:cellData="column"
2828
@update-value="onUpdateValue"
2929
:fieldValue="getValue(column)"
30-
></atk-multiline-cell>
31-
</sui-table-cell>
32-
</sui-table-row>`,
30+
></AtkMultilineCell>
31+
</SuiTableCell>
32+
</SuiTableRow>`,
3333
props: ['fields', 'rowId', 'isDeletable', 'rowValues', 'error'],
3434
data: function () {
3535
return { columns: this.fields };
3636
},
3737
components: {
38-
'atk-multiline-cell': multilineCell,
38+
AtkMultilineCell: multilineCell,
3939
},
4040
computed: {
4141
/**

‎js/src/vue-components/multiline/multiline-textarea.component.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
export default {
2-
name: 'atk-multiline-textarea',
3-
template: '<textarea v-model="modelValue" @input="onInput"></textarea>',
2+
name: 'AtkMultilineTextarea',
3+
template: '<textarea v-model="modelValue" @input="onInput" />',
44
props: ['modelValue'],
55
emits: ['update:modelValue'],
66
methods: {

‎js/src/vue-components/multiline/multiline.component.js

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -4,39 +4,39 @@ import multilineBody from './multiline-body.component';
44
import multilineHeader from './multiline-header.component';
55

66
export default {
7-
name: 'atk-multiline',
7+
name: 'AtkMultiline',
88
template: `
99
<div>
10-
<sui-table v-bind="tableProp">
11-
<atk-multiline-header
10+
<SuiTable v-bind="tableProp">
11+
<AtkMultilineHeader
1212
:fields="fieldData"
1313
:state="getMainToggleState"
1414
:errors="errors"
1515
:caption="caption"
16-
></atk-multiline-header>
17-
<atk-multiline-body
16+
></AtkMultilineHeader>
17+
<AtkMultilineBody
1818
@onTabLastRow="onTabLastRow"
1919
:fieldDefs="fieldData"
2020
:rowData="rowData"
2121
:deletables="getDeletables"
2222
:errors="errors"
23-
></atk-multiline-body>
24-
<sui-table-footer>
25-
<sui-table-row>
26-
<sui-table-header-cell></sui-table-header-cell>
27-
<sui-table-header-cell :colspan="getSpan" textAlign="right">
28-
<div is="vue:sui-button-group">
29-
<sui-button ref="addBtn" size="small" @click.stop.prevent="onAdd" type="button" icon :disabled="isLimitReached">
30-
<sui-icon name="plus"></sui-icon>
31-
</sui-button>
32-
<sui-button size="small" @click.stop.prevent="onDelete" type="button" icon :disabled="isDeleteDisable">
33-
<sui-icon name="trash"></sui-icon>
34-
</sui-button>
35-
</div>
36-
</sui-table-header-cell>
37-
</sui-table-row>
38-
</sui-table-footer>
39-
</sui-table>
23+
></AtkMultilineBody>
24+
<SuiTableFooter>
25+
<SuiTableRow>
26+
<SuiTableHeaderCell />
27+
<SuiTableHeaderCell :colspan="getSpan" textAlign="right">
28+
<SuiButtonGroup>
29+
<SuiButton ref="addBtn" size="small" @click.stop.prevent="onAdd" type="button" icon :disabled="isLimitReached">
30+
<SuiIcon name="plus" />
31+
</SuiButton>
32+
<SuiButton size="small" @click.stop.prevent="onDelete" type="button" icon :disabled="isDeleteDisable">
33+
<SuiIcon name="trash" />
34+
</SuiButton>
35+
</SuiButtonGroup>
36+
</SuiTableHeaderCell>
37+
</SuiTableRow>
38+
</SuiTableFooter>
39+
</SuiTable>
4040
<div>
4141
<input ref="atkmlInput" :form="form" :name="name" type="hidden" :value="value" />
4242
</div>
@@ -68,8 +68,8 @@ export default {
6868
};
6969
},
7070
components: {
71-
'atk-multiline-body': multilineBody,
72-
'atk-multiline-header': multilineHeader,
71+
AtkMultilineHeader: multilineHeader,
72+
AtkMultilineBody: multilineBody,
7373
},
7474
mounted: function () {
7575
this.rowData = this.buildRowData(this.value ? this.value : '[]');

0 commit comments

Comments
 (0)