event fix for csb

pull/889/head
Tuğçe Küçükoğlu 2021-01-26 10:04:13 +03:00
parent 9b2e88c9c5
commit db0719c286
12 changed files with 15 additions and 16 deletions

View File

@ -114,7 +114,7 @@ export default {
<Toast />
<div class="content-section implementation">
<div class="card">
<DataTable :value="products" contextMenu v-model:contextMenuSelection="selectedProduct" @row-contextmenu="onRowContextMenu">
<DataTable :value="products" contextMenu v-model:contextMenuSelection="selectedProduct" @rowContextmenu="onRowContextMenu">
<Column field="code" header="Code"></Column>
<Column field="name" header="Name"></Column>
<Column field="category" header="Category"></Column>

View File

@ -72,7 +72,7 @@
</Column>
<Column field="inventoryStatus" header="Status">
<template #editor="slotProps">
<Dropdown v-model="slotProps.data['inventoryStatus']" :options="statuses" optionLabel="label" optionValue="value" laceholder="Select a Status">
<Dropdown v-model="slotProps.data['inventoryStatus']" :options="statuses" optionLabel="label" optionValue="value" placeholder="Select a Status">
<template #option="slotProps">
<span :class="'product-badge status-' + slotProps.option.value.toLowerCase()">{{slotProps.option.label}}</span>
</template>
@ -337,7 +337,7 @@ export default {
</Column>
<Column field="inventoryStatus" header="Status">
<template #editor="slotProps">
<Dropdown v-model="slotProps.data['inventoryStatus']" :options="statuses" optionLabel="label" optionValue="value" laceholder="Select a Status">
<Dropdown v-model="slotProps.data['inventoryStatus']" :options="statuses" optionLabel="label" optionValue="value" placeholder="Select a Status">
<template #option="slotProps">
<span :class="'product-badge status-' + slotProps.option.value.toLowerCase()">{{slotProps.option.label}}</span>
</template>
@ -358,7 +358,7 @@ export default {
<div class="card">
<h5>Advanced Cell Editing</h5>
<p>Custom implementation with validations, dynamic columns and reverting values with the escape key.</p>
<DataTable :value="products2" editMode="cell" @cell-edit-complete="onCellEditComplete" class="editable-cells-table" >
<DataTable :value="products2" editMode="cell" @cellEditComplete="onCellEditComplete" class="editable-cells-table" >
<Column v-for="col of columns" :field="col.field" :header="col.header" :key="col.field">
<template #editor="slotProps">
<InputText :modelValue="slotProps.data[slotProps.column.props.field]" @update:modelValue="onCellEdit($event, slotProps)" />
@ -370,7 +370,7 @@ export default {
<div class="card">
<h5>Row Editing</h5>
<DataTable :value="products3" editMode="row" dataKey="id" v-model:editingRows="editingRows"
@row-edit-init="onRowEditInit" @row-edit-cancel="onRowEditCancel">
@rowEditInit="onRowEditInit" @rowEditCancel="onRowEditCancel">
<Column field="code" header="Code">
<template #editor="slotProps">
<InputText v-model="slotProps.data[slotProps.column.props.field]" autofocus />

View File

@ -90,7 +90,7 @@ export default {
<Toast />
<div class="content-section implementation">
<div class="card">
<DataTable :value="products" :reorderableColumns="true" @column-reorder="onColReorder" @row-reorder="onRowReorder">
<DataTable :value="products" :reorderableColumns="true" @columnReorder="onColReorder" @rowReorder="onRowReorder">
<Column :rowReorder="true" headerStyle="width: 3rem" :reorderableColumn="false" />
<Column v-for="col of columns" :field="col.field" :header="col.header" :key="col.field"></Column>
</DataTable>

View File

@ -200,7 +200,7 @@ export default {
<div class="content-section implementation">
<div class="card">
<DataTable :value="products" v-model:expandedRows="expandedRows" dataKey="id"
@row-expand="onRowExpand" @row-collapse="onRowCollapse">
@rowExpand="onRowExpand" @rowCollapse="onRowCollapse">
<template #header>
<div class="table-header-container">
<Button icon="pi pi-plus" label="Expand All" @click="expandAll" class="p-mr-2" />

View File

@ -311,7 +311,7 @@ export default {
<DataTable :value="customers" rowGroupMode="subheader" groupRowsBy="representative.name"
sortMode="single" sortField="representative.name" :sortOrder="1"
:expandableRowGroups="true" v-model:expandedRowGroups="expandedRowGroups"
@rowgroup-expand="onRowGroupExpand" @rowgroup-collapse="onRowGroupCollapse">
@rowgroupExpand="onRowGroupExpand" @rowgroupCollapse="onRowGroupCollapse">
<Column field="representative.name" header="Representative"></Column>
<Column field="name" header="Name"></Column>
<Column field="country" header="Country">

View File

@ -263,7 +263,7 @@ export default {
<h5>Events</h5>
<p>row-select and row-unselects are available as selection events.</p>
<DataTable :value="products" v-model:selection="selectedProduct2" selectionMode="single" dataKey="id"
@row-select="onRowSelect($event)" @row-unselect="onRowUnselect($event)">
@rowSelect="onRowSelect($event)" @rowUnselect="onRowUnselect($event)">
<Column field="code" header="Code"></Column>
<Column field="name" header="Name"></Column>
<Column field="category" header="Category"></Column>
@ -342,7 +342,6 @@ export default {
},
methods: {
onRowSelect(event) {
console.log(event)
this.$toast.add({severity: 'info', summary: 'Product Selected', detail: 'Name: ' + event.data.name, life: 3000});
},
onRowUnselect(event) {

View File

@ -724,7 +724,7 @@ export default {
<div class="card">
<h5>Advanced</h5>
<OrganizationChart :value="data1" :collapsible="true" class="company" selectionMode="single" v-model:selectionKeys="selection"
@node-select="onNodeSelect" @node-unselect="onNodeUnselect" @node-collapse="onNodeCollapse" @node-expand="onNodeExpand">
@nodeSelect="onNodeSelect" @nodeUnselect="onNodeUnselect" @nodeCollapse="onNodeCollapse" @nodeExpand="onNodeExpand">
<template #person="slotProps">
<div class="node-header ui-corner-top">{{slotProps.node.data.label}}</div>
<div class="node-content">

View File

@ -236,7 +236,7 @@ export default {
<Button type="button" icon="pi pi-search" :label="selectedProduct ? selectedProduct.name : 'Select a Product'" @click="toggle" aria:haspopup="true" aria-controls="overlay_panel" />
<OverlayPanel ref="op" appendTo="body" :showCloseIcon="true" id="overlay_panel" style="width: 450px">
<DataTable :value="products" v-model:selection="selectedProduct" selectionMode="single" :paginator="true" :rows="5" @row-select="onProductSelect">
<DataTable :value="products" v-model:selection="selectedProduct" selectionMode="single" :paginator="true" :rows="5" @rowSelect="onProductSelect">
<Column field="name" header="Name" sortable></Column>
<Column header="Image">
<template #body="slotProps">

View File

@ -114,7 +114,7 @@ export default {
<div class="layout-content">
<div class="content-section implementation">
<div class="card">
<Tree :value="nodes" @node-expand="onNodeExpand" :loading="loading"></Tree>
<Tree :value="nodes" @nodeExpand="onNodeExpand" :loading="loading"></Tree>
</div>
</div>
</div>

View File

@ -126,7 +126,7 @@ export default {
<h5>Events</h5>
<Tree :value="nodes" selectionMode="single" v-model:selectionKeys="selectedKey2" :metaKeySelection="false"
@node-select="onNodeSelect" @node-unselect="onNodeUnselect"></Tree>
@nodeSelect="onNodeSelect" @nodeUnselect="onNodeUnselect"></Tree>
</div>
</div>
</div>

View File

@ -150,7 +150,7 @@ export default {
<div class="content-section implementation">
<div class="card">
<TreeTable :value="nodes" :lazy="true" :paginator="true" :rows="rows" :loading="loading"
@node-expand="onExpand" @page="onPage" :totalRecords="totalRecords">
@nodeExpand="onExpand" @page="onPage" :totalRecords="totalRecords">
<Column field="name" header="Name" :expander="true"></Column>
<Column field="size" header="Size"></Column>
<Column field="type" header="Type"></Column>

View File

@ -198,7 +198,7 @@ export default {
<div class="card">
<h5>Events</h5>
<TreeTable :value="nodes" selectionMode="single" v-model:selectionKeys="selectedKey2"
@node-select="onNodeSelect" @node-unselect="onNodeUnselect">
@nodeSelect="onNodeSelect" @nodeUnselect="onNodeUnselect">
<Column field="name" header="Name" :expander="true"></Column>
<Column field="size" header="Size"></Column>
<Column field="type" header="Type"></Column>