vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

DataTable pt demo added

pull/3950/head
Tuğçe Küçükoğlu 2023-05-09 18:05:27 +03:00
parent e1b1f40c9e
commit c7ffcaa08d
3 changed files with 160 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
api-generator/components/column.js
View File

@ -250,6 +250,12 @@ const ColumnProps = [
type: 'boolean', type: 'boolean',
default: 'false', default: 'false',
description: 'Whether the column is rendered.' description: 'Whether the column is rendered.'
},
{
name: 'pt',
type: 'any',
default: 'null',
description: 'Uses to pass attributes to DOM elements inside the component.'
} }
]; ];

172
doc/datatable/pt/PTDoc.vue
View File

@ -5,14 +5,45 @@
:value="products" :value="products"
sortMode="multiple" sortMode="multiple"
:pt="{ :pt="{
table: { style: { minWidth: '50rem' } }, table: { style: { minWidth: '50rem' } }
sortBadge: { class: 'bg-primary' }
}" }"
> >
<Column field="code" header="Code" sortable style="width: 25%"></Column> <Column
<Column field="name" header="Name" sortable style="width: 25%"></Column> field="code"
<Column field="category" header="Category" sortable style="width: 25%"></Column> header="Code"
<Column field="quantity" header="Quantity" sortable style="width: 25%"></Column> sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="name"
header="Name"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="category"
header="Category"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="quantity"
header="Quantity"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
</DataTable> </DataTable>
</div> </div>
<DocSectionCode :code="code" :service="['ProductService']" /> <DocSectionCode :code="code" :service="['ProductService']" />
@ -31,14 +62,45 @@ export default {
:value="products" :value="products"
sortMode="multiple" sortMode="multiple"
:pt="{ :pt="{
table: { style: { minWidth: '50rem' } }, table: { style: { minWidth: '50rem' } }
sortBadge: { class: 'bg-primary' }
}" }"
> >
<Column field="code" header="Code" sortable style="width: 25%"></Column> <Column
<Column field="name" header="Name" sortable style="width: 25%"></Column> field="code"
<Column field="category" header="Category" sortable style="width: 25%"></Column> header="Code"
<Column field="quantity" header="Quantity" sortable style="width: 25%"></Column> sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="name"
header="Name"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="category"
header="Category"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="quantity"
header="Quantity"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
</DataTable>`, </DataTable>`,
options: ` options: `
<template> <template>
@ -47,14 +109,45 @@ export default {
:value="products" :value="products"
sortMode="multiple" sortMode="multiple"
:pt="{ :pt="{
table: { style: { minWidth: '50rem' } }, table: { style: { minWidth: '50rem' } }
sortBadge: { class: 'bg-primary' }
}" }"
> >
<Column field="code" header="Code" sortable style="width: 25%"></Column> <Column
<Column field="name" header="Name" sortable style="width: 25%"></Column> field="code"
<Column field="category" header="Category" sortable style="width: 25%"></Column> header="Code"
<Column field="quantity" header="Quantity" sortable style="width: 25%"></Column> sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="name"
header="Name"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="category"
header="Category"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="quantity"
header="Quantity"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
</DataTable> </DataTable>
</div> </div>
</template> </template>
@ -80,14 +173,45 @@ export default {
:value="products" :value="products"
sortMode="multiple" sortMode="multiple"
:pt="{ :pt="{
table: { style: { minWidth: '50rem' } }, table: { style: { minWidth: '50rem' } }
sortBadge: { class: 'bg-primary' }
}" }"
> >
<Column field="code" header="Code" sortable style="width: 25%"></Column> <Column
<Column field="name" header="Name" sortable style="width: 25%"></Column> field="code"
<Column field="category" header="Category" sortable style="width: 25%"></Column> header="Code"
<Column field="quantity" header="Quantity" sortable style="width: 25%"></Column> sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="name"
header="Name"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="category"
header="Category"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
<Column
field="quantity"
header="Quantity"
sortable
:pt="{
sortBadge: { class: 'bg-primary' },
headerCell: { style: { width: '25%' } }
}"
/>
</DataTable> </DataTable>
</div> </div>
</template> </template>

6
doc/datatable/pt/index.vue
View File

@ -29,6 +29,12 @@ export default {
component: DocApiTable, component: DocApiTable,
data: getPTOption('DataTable') data: getPTOption('DataTable')
}, },
{
id: 'pt.doc.column',
label: 'Column PT Options',
component: DocApiTable,
data: getPTOption('Column')
},
{ {
id: 'pt.demo', id: 'pt.demo',
label: 'Demo', label: 'Demo',