Hopiu/vue-material
1
0
Fork 0
mirror of https://github.com/Hopiu/vue-material.git synced 2026-05-12 01:03:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #733 from praneetloke/develop

Browse source 
Fix for #529. Updated docs with an example of disabled items in the Select component.
This commit is contained in:
Pablo Henrique 2017-05-21 20:03:47 -03:00 committed by GitHub
commit a9e2fc5826
4 changed files with 33 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
docs/src/pages/components/Select.vue
View file

@ -174,7 +174,7 @@
<md-option value="arial">Arial</md-option>
<md-option value="calibri">Calibri</md-option>
<md-option value="cambria">Cambria</md-option>
<md-option value="comic_sans">Comic Sans</md-option>
<md-option value="comic_sans" :disabled="true">Comic Sans</md-option>
<md-option value="consolas">Consolas</md-option>
<md-option value="courier">Courier</md-option>
<md-option value="droid_sans">Droid Sans</md-option>
@ -185,7 +185,7 @@
<md-option value="segoe_ui">Segoe UI</md-option>
<md-option value="times_new_roman">Times New Roman</md-option>
<md-option value="ubuntu">Ubuntu</md-option>
<md-option value="verdana">Verdana</md-option>
<md-option value="verdana" :disabled="isDisabled">Verdana</md-option>
</md-select>
</md-input-container>
@ -244,7 +244,7 @@
&lt;md-option value=&quot;arial&quot;&gt;Arial&lt;/md-option&gt;
&lt;md-option value=&quot;calibri&quot;&gt;Calibri&lt;/md-option&gt;
&lt;md-option value=&quot;cambria&quot;&gt;Cambria&lt;/md-option&gt;
&lt;md-option value=&quot;comic_sans&quot;&gt;Comic Sans&lt;/md-option&gt;
&lt;md-option value=&quot;comic_sans&quot; :disabled=&quot;true&quot;&gt;Comic Sans&lt;/md-option&gt;
&lt;md-option value=&quot;consolas&quot;&gt;Consolas&lt;/md-option&gt;
&lt;md-option value=&quot;courier&quot;&gt;Courier&lt;/md-option&gt;
&lt;md-option value=&quot;droid_sans&quot;&gt;Droid Sans&lt;/md-option&gt;
@ -255,7 +255,7 @@
&lt;md-option value=&quot;segoe_ui&quot;&gt;Segoe UI&lt;/md-option&gt;
&lt;md-option value=&quot;times_new_roman&quot;&gt;Times New Roman&lt;/md-option&gt;
&lt;md-option value=&quot;ubuntu&quot;&gt;Ubuntu&lt;/md-option&gt;
&lt;md-option value=&quot;verdana&quot;&gt;Verdana&lt;/md-option&gt;
&lt;md-option value=&quot;verdana&quot; :disabled=&quot;isDisabled&quot;&gt;Verdana&lt;/md-option&gt;
&lt;/md-select&gt;
&lt;/md-input-container&gt;
@ -289,6 +289,11 @@
country: '',
font: ''
}),
computed: {
isDisabled() {
return true;
}
},
methods: {
setPulpFiction() {
this.movie = 'pulp_fiction';
@ -447,6 +452,11 @@
],
items: []
}),
computed: {
isDisabled() {
return true;
}
},
methods: {
setPulpFiction() {
this.movie = 'pulp_fiction';

3
src/components/mdSelect/mdOption.vue
View file

@ -62,6 +62,9 @@
}
},
selectOption($event) {
if (this.disabled) {
return;
}
this.setParentOption();
this.$emit('selected', $event);
}

14
src/components/mdSelect/mdSelect.scss
View file

@ -2,6 +2,12 @@
$select-height: 32px;
@mixin disable-item {
pointer-events: none;
user-select: none;
user-drag: none;
}
.md-select {
width: 100%;
min-width: 128px;
@ -43,9 +49,7 @@ $select-height: 32px;
}
&.md-disabled {
pointer-events: none;
user-select: none;
user-drag: none;
@include disable-item;
}
select {
@ -94,6 +98,10 @@ $select-height: 32px;
margin-left: -16px;
}
.md-option[disabled] {
@include disable-item;
}
.md-menu-item .md-list-item-holder {
overflow: visible;
justify-content: flex-start;

10
src/components/mdTable/mdTablePagination.vue
View file

@ -46,7 +46,6 @@
},
data() {
return {
subTotal: 0,
totalItems: 0,
currentPage: 1,
currentSize: parseInt(this.mdSize, 10)
@ -72,14 +71,16 @@
},
shouldDisable() {
return this.currentSize * this.currentPage >= this.totalItems;
},
subTotal() {
const sub = this.currentPage * this.currentSize;
return sub > this.mdTotal ? this.mdTotal : sub;
}
},
methods: {
emitPaginationEvent() {
if (this.canFireEvents) {
const sub = this.currentPage * this.currentSize;
this.subTotal = sub > this.mdTotal ? this.mdTotal : sub;
this.$emit('pagination', {
size: this.currentSize,
page: this.currentPage
@ -109,7 +110,6 @@
},
mounted() {
this.$nextTick(() => {
this.subTotal = this.currentPage * this.currentSize;
this.mdPageOptions = this.mdPageOptions || [10, 25, 50, 100];
this.currentSize = this.mdPageOptions.includes(this.currentSize) ? this.currentSize : this.mdPageOptions[0];
this.canFireEvents = true;