Skip to content

Commit 7cfd072

Browse files
committed
incr: add collapsible sections
- table borders
1 parent 1db70df commit 7cfd072

File tree

6 files changed

+185
-140
lines changed

6 files changed

+185
-140
lines changed

schemas/app/Payment.json

Lines changed: 61 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -11,21 +11,34 @@
1111
"fieldname": "name",
1212
"fieldtype": "Data",
1313
"required": true,
14-
"readOnly": true
14+
"readOnly": true,
15+
"section": "Default"
16+
},
17+
{
18+
"fieldname": "numberSeries",
19+
"label": "Number Series",
20+
"fieldtype": "Link",
21+
"target": "NumberSeries",
22+
"create": true,
23+
"required": true,
24+
"default": "PAY-",
25+
"section": "Default"
1526
},
1627
{
1728
"fieldname": "party",
1829
"label": "Party",
1930
"fieldtype": "Link",
2031
"target": "Party",
2132
"create": true,
22-
"required": true
33+
"required": true,
34+
"section": "Default"
2335
},
2436
{
2537
"fieldname": "date",
2638
"label": "Posting Date",
2739
"fieldtype": "Date",
28-
"required": true
40+
"required": true,
41+
"section": "Default"
2942
},
3043
{
3144
"fieldname": "paymentType",
@@ -42,16 +55,27 @@
4255
"label": "Pay"
4356
}
4457
],
45-
"required": true
58+
"required": true,
59+
"section": "Default"
4660
},
4761
{
48-
"fieldname": "numberSeries",
49-
"label": "Number Series",
62+
"fieldname": "account",
63+
"label": "From Account",
5064
"fieldtype": "Link",
51-
"target": "NumberSeries",
65+
"target": "Account",
5266
"create": true,
5367
"required": true,
54-
"default": "PAY-"
68+
"section": "Details"
69+
},
70+
{
71+
"fieldname": "paymentAccount",
72+
"label": "To Account",
73+
"placeholder": "To Account",
74+
"fieldtype": "Link",
75+
"target": "Account",
76+
"create": true,
77+
"required": true,
78+
"section": "Details"
5579
},
5680
{
5781
"fieldname": "paymentMethod",
@@ -73,72 +97,64 @@
7397
}
7498
],
7599
"default": "Cash",
76-
"required": true
100+
"required": true,
101+
"section": "Details"
77102
},
78103
{
79-
"fieldname": "account",
80-
"label": "From Account",
81-
"fieldtype": "Link",
82-
"target": "Account",
83-
"create": true,
84-
"required": true
104+
"fieldname": "amount",
105+
"label": "Amount",
106+
"fieldtype": "Currency",
107+
"required": true,
108+
"section": "Amounts"
85109
},
86110
{
87-
"fieldname": "paymentAccount",
88-
"label": "To Account",
89-
"placeholder": "To Account",
90-
"fieldtype": "Link",
91-
"target": "Account",
92-
"create": true,
93-
"required": true
111+
"fieldname": "writeoff",
112+
"label": "Write Off",
113+
"fieldtype": "Currency",
114+
"section": "Amounts"
115+
},
116+
{
117+
"fieldname": "amountPaid",
118+
"label": "Amount Paid",
119+
"fieldtype": "Currency",
120+
"computed": true,
121+
"section": "Amounts"
94122
},
95123
{
96124
"fieldname": "referenceId",
97125
"label": "Ref. / Cheque No.",
98126
"placeholder": "Ref. / Cheque No.",
99-
"fieldtype": "Data"
127+
"fieldtype": "Data",
128+
"section": "References"
100129
},
101130
{
102131
"fieldname": "referenceDate",
103-
"label": "Ref. Date",
132+
"label": "Reference Date",
104133
"placeholder": "Ref. Date",
105-
"fieldtype": "Date"
134+
"fieldtype": "Date",
135+
"section": "References"
106136
},
107137
{
108138
"fieldname": "clearanceDate",
109139
"label": "Clearance Date",
110140
"placeholder": "Clearance Date",
111-
"fieldtype": "Date"
112-
},
113-
{
114-
"fieldname": "amount",
115-
"label": "Amount",
116-
"fieldtype": "Currency",
117-
"required": true
118-
},
119-
{
120-
"fieldname": "writeoff",
121-
"label": "Write Off",
122-
"fieldtype": "Currency"
123-
},
124-
{
125-
"fieldname": "amountPaid",
126-
"label": "Amount Paid",
127-
"fieldtype": "Currency",
128-
"computed": true
141+
"fieldtype": "Date",
142+
"section": "References"
129143
},
130144
{
131145
"fieldname": "for",
132146
"label": "Payment Reference",
133147
"fieldtype": "Table",
134148
"target": "PaymentFor",
135-
"required": false
149+
"required": false,
150+
"section": "References"
136151
},
137152
{
138153
"fieldname": "attachment",
139154
"placeholder": "Add attachment",
140155
"label": "Attachment",
141-
"fieldtype": "Attachment"
156+
"fieldtype": "Attachment",
157+
"section": "References"
142158
}
143159
],
144160
"quickEditFields": [

schemas/meta/base.json

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,28 +6,32 @@
66
"label": "Created By",
77
"fieldtype": "Data",
88
"required": true,
9-
"meta": true
9+
"meta": true,
10+
"section": "System"
1011
},
1112
{
1213
"fieldname": "modifiedBy",
1314
"label": "Modified By",
1415
"fieldtype": "Data",
1516
"required": true,
16-
"meta": true
17+
"meta": true,
18+
"section": "System"
1719
},
1820
{
1921
"fieldname": "created",
2022
"label": "Created",
2123
"fieldtype": "Datetime",
2224
"required": true,
23-
"meta": true
25+
"meta": true,
26+
"section": "System"
2427
},
2528
{
2629
"fieldname": "modified",
2730
"label": "Modified",
2831
"fieldtype": "Datetime",
2932
"required": true,
30-
"meta": true
33+
"meta": true,
34+
"section": "System"
3135
}
3236
]
3337
}

schemas/meta/submittable.json

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,16 @@
66
"label": "Submitted",
77
"fieldtype": "Check",
88
"required": true,
9-
"meta": true
9+
"meta": true,
10+
"section": "System"
1011
},
1112
{
1213
"fieldname": "cancelled",
1314
"label": "Cancelled",
1415
"fieldtype": "Check",
1516
"required": true,
16-
"meta": true
17+
"meta": true,
18+
"section": "System"
1719
}
1820
]
1921
}

src/components/Controls/Table.vue

Lines changed: 77 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -4,79 +4,84 @@
44
{{ df.label }}
55
</div>
66

7-
<!-- Title Row -->
8-
<Row
9-
:ratio="ratio"
10-
class="border-b px-2 text-gray-600 w-full flex items-center"
11-
>
12-
<div class="flex items-center ps-2">#</div>
7+
<div :class="border ? 'border rounded-md' : ''">
8+
<!-- Title Row -->
9+
<Row
10+
:ratio="ratio"
11+
class="border-b px-2 text-gray-600 w-full flex items-center"
12+
>
13+
<div class="flex items-center ps-2">#</div>
14+
<div
15+
class="items-center flex px-2 h-row-mid"
16+
:class="{
17+
'ms-auto': isNumeric(df),
18+
}"
19+
v-for="df in tableFields"
20+
:key="df.fieldname"
21+
:style="{
22+
height: ``,
23+
}"
24+
>
25+
{{ df.label }}
26+
</div>
27+
</Row>
28+
29+
<!-- Data Rows -->
1330
<div
14-
class="items-center flex px-2 h-row-mid"
15-
:class="{
16-
'ms-auto': isNumeric(df),
17-
}"
18-
v-for="df in tableFields"
19-
:key="df.fieldname"
20-
:style="{
21-
height: ``,
22-
}"
31+
class="overflow-auto"
32+
:style="{ 'max-height': maxHeight }"
33+
v-if="value"
2334
>
24-
{{ df.label }}
35+
<TableRow
36+
v-for="row in value"
37+
ref="table-row"
38+
:key="row.name"
39+
v-bind="{ row, tableFields, size, ratio, isNumeric }"
40+
:read-only="isReadOnly"
41+
@remove="removeRow(row)"
42+
:can-edit-row="canEditRow"
43+
/>
2544
</div>
26-
</Row>
2745

28-
<!-- Data Rows -->
29-
<div
30-
class="overflow-auto"
31-
:style="{ 'max-height': maxHeight }"
32-
v-if="value"
33-
>
34-
<TableRow
35-
v-for="row in value"
36-
ref="table-row"
37-
:key="row.name"
38-
v-bind="{ row, tableFields, size, ratio, isNumeric }"
39-
:read-only="isReadOnly"
40-
@remove="removeRow(row)"
41-
:can-edit-row="canEditRow"
42-
/>
43-
</div>
44-
45-
<!-- Add Row and Row Count -->
46-
<Row
47-
:ratio="ratio"
48-
class="
49-
text-gray-500
50-
cursor-pointer
51-
border-transparent
52-
px-2
53-
w-full
54-
h-row-mid
55-
flex
56-
items-center
57-
"
58-
v-if="!isReadOnly"
59-
@click="addRow"
60-
>
61-
<div class="flex items-center ps-1">
62-
<feather-icon name="plus" class="w-4 h-4 text-gray-500" />
63-
</div>
64-
<div class="flex justify-between px-2" :style="`grid-column: 2 / ${ratio.length + 1}`">
65-
<p>
66-
{{ t`Add Row` }}
67-
</p>
68-
<p
69-
class="text-end px-2"
70-
v-if="
71-
value &&
72-
maxRowsBeforeOverflow &&
73-
value.length > maxRowsBeforeOverflow
74-
"
46+
<!-- Add Row and Row Count -->
47+
<Row
48+
:ratio="ratio"
49+
class="
50+
text-gray-500
51+
cursor-pointer
52+
border-transparent
53+
px-2
54+
w-full
55+
h-row-mid
56+
flex
57+
items-center
58+
"
59+
v-if="!isReadOnly"
60+
@click="addRow"
61+
>
62+
<div class="flex items-center ps-1">
63+
<feather-icon name="plus" class="w-4 h-4 text-gray-500" />
64+
</div>
65+
<div
66+
class="flex justify-between px-2"
67+
:style="`grid-column: 2 / ${ratio.length + 1}`"
7568
>
76-
{{ t`${value.length} rows` }}
77-
</p>
78-
</div>
79-
</Row>
69+
<p>
70+
{{ t`Add Row` }}
71+
</p>
72+
<p
73+
class="text-end px-2"
74+
v-if="
75+
value &&
76+
maxRowsBeforeOverflow &&
77+
value.length > maxRowsBeforeOverflow
78+
"
79+
>
80+
{{ t`${value.length} rows` }}
81+
</p>
82+
</div>
83+
</Row>
84+
</div>
8085
</div>
8186
</template>
8287

@@ -101,6 +106,10 @@ export default {
101106
type: Number,
102107
default: 3,
103108
},
109+
border: {
110+
type: Boolean,
111+
default: false,
112+
},
104113
},
105114
components: {
106115
Row,

0 commit comments

Comments
 (0)