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

Demo update for overlay panel

pull/1047/head
Cagatay Civici 2021-03-02 10:56:48 +03:00
parent 3748b2dcc7
commit 72148cbb73
2 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/overlaypanel/OverlayPanelDoc.vue
View File

@ -177,7 +177,7 @@ toggle(event) {
<pre v-code><code><template v-pre> <pre v-code><code><template v-pre>
&lt;Button type="button" icon="pi pi-search" :label="selectedProduct ? selectedProduct.name : 'Select a Product'" @click="toggle" aria:haspopup="true" aria-controls="overlay_panel" /&gt; &lt;Button type="button" icon="pi pi-search" :label="selectedProduct ? selectedProduct.name : 'Select a Product'" @click="toggle" aria:haspopup="true" aria-controls="overlay_panel" /&gt;
&lt;OverlayPanel ref="op" appendTo="body" :showCloseIcon="true" id="overlay_panel" style="width: 450px"&gt; &lt;OverlayPanel ref="op" appendTo="body" :showCloseIcon="true" id="overlay_panel" style="width: 450px" :breakpoints="{'960px': '75vw'}"&gt;
&lt;DataTable :value="products" v-model:selection="selectedProduct" selectionMode="single" :paginator="true" :rows="5" @row-select="onProductSelect" responsiveLayout="scroll"&gt; &lt;DataTable :value="products" v-model:selection="selectedProduct" selectionMode="single" :paginator="true" :rows="5" @row-select="onProductSelect" responsiveLayout="scroll"&gt;
&lt;Column field="name" header="Name" sortable style="width: 50%"&gt;&lt;/Column&gt; &lt;Column field="name" header="Name" sortable style="width: 50%"&gt;&lt;/Column&gt;
&lt;Column header="Image" style="width: 20%"&gt; &lt;Column header="Image" style="width: 20%"&gt;
@ -246,7 +246,7 @@ export default {
<div class="card"> <div class="card">
<Button type="button" icon="pi pi-search" :label="selectedProduct ? selectedProduct.name : 'Select a Product'" @click="toggle" aria:haspopup="true" aria-controls="overlay_panel" /> <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"> <OverlayPanel ref="op" appendTo="body" :showCloseIcon="true" id="overlay_panel" style="width: 450px" :breakpoints="{'960px': '75vw'}">
<DataTable :value="products" v-model:selection="selectedProduct" selectionMode="single" :paginator="true" :rows="5" @rowSelect="onProductSelect"> <DataTable :value="products" v-model:selection="selectedProduct" selectionMode="single" :paginator="true" :rows="5" @rowSelect="onProductSelect">
<Column field="name" header="Name" sortable style="width: 50%"></Column> <Column field="name" header="Name" sortable style="width: 50%"></Column>
<Column header="Image"style="width: 20%"> <Column header="Image"style="width: 20%">

4
src/views/responsive/ResponsiveDemo.vue
View File

@ -372,7 +372,7 @@
<div class="card p-fluid"> <div class="card p-fluid">
<h5>Overlay Panel</h5> <h5>Overlay Panel</h5>
<Button type="button" label="Choose" @click="toggle" icon="pi pi-search" /> <Button type="button" label="Choose" @click="toggle" icon="pi pi-search" />
<OverlayPanel ref="op" appendTo="body" :showCloseIcon="true" style="width: 450px"> <OverlayPanel ref="op" appendTo="body" :showCloseIcon="true" style="width: 450px" :breakpoints="{'960px':'75vw'}">
<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" @row-select="onProductSelect">
<Column field="name" header="Name" sortable></Column> <Column field="name" header="Name" sortable></Column>
<Column header="Image"> <Column header="Image">
@ -884,7 +884,7 @@
&lt;div class="card p-fluid"&gt; &lt;div class="card p-fluid"&gt;
&lt;h5&gt;Overlay Panel&lt;/h5&gt; &lt;h5&gt;Overlay Panel&lt;/h5&gt;
&lt;Button type="button" label="Choose" @click="toggle" icon="pi pi-search" /&gt; &lt;Button type="button" label="Choose" @click="toggle" icon="pi pi-search" /&gt;
&lt;OverlayPanel ref="op" appendTo="body" :showCloseIcon="true" style="width: 450px"&gt; &lt;OverlayPanel ref="op" appendTo="body" :showCloseIcon="true" style="width: 450px" :breakpoints="{'960px':'75vw'}"&gt;
&lt;DataTable :value="products" v-model:selection="selectedProduct" selectionMode="single" :paginator="true" :rows="5" @row-select="onProductSelect"&gt; &lt;DataTable :value="products" v-model:selection="selectedProduct" selectionMode="single" :paginator="true" :rows="5" @row-select="onProductSelect"&gt;
&lt;Column field="name" header="Name" sortable&gt;&lt;/Column&gt; &lt;Column field="name" header="Name" sortable&gt;&lt;/Column&gt;
&lt;Column header="Image"&gt; &lt;Column header="Image"&gt;