dnet45/modules/uoa-repository-dashboard-gui/trunk/src/public/js/core/form-custom.js @ 46812
| 1 |
import { Class } from '../mixin/index'; |
|---|---|
| 2 |
import { query } from '../util/index'; |
| 3 |
|
| 4 |
export default function (UIkit) { |
| 5 |
|
| 6 |
UIkit.component('form-custom', { |
| 7 |
|
| 8 |
mixins: [Class], |
| 9 |
|
| 10 |
args: 'target', |
| 11 |
|
| 12 |
props: { |
| 13 |
target: Boolean |
| 14 |
},
|
| 15 |
|
| 16 |
defaults: { |
| 17 |
target: false |
| 18 |
},
|
| 19 |
|
| 20 |
computed: { |
| 21 |
|
| 22 |
input() { |
| 23 |
return this.$el.find(':input:first'); |
| 24 |
},
|
| 25 |
|
| 26 |
state() { |
| 27 |
return this.input.next(); |
| 28 |
},
|
| 29 |
|
| 30 |
target() { |
| 31 |
return this.$props.target && query(this.$props.target === true ? '> :input:first + :first' : this.$props.target, this.$el) |
| 32 |
}
|
| 33 |
|
| 34 |
},
|
| 35 |
|
| 36 |
connected() { |
| 37 |
this.input.trigger('change'); |
| 38 |
},
|
| 39 |
|
| 40 |
events: [ |
| 41 |
|
| 42 |
{
|
| 43 |
|
| 44 |
name: 'focus blur mouseenter mouseleave', |
| 45 |
|
| 46 |
delegate: ':input:first', |
| 47 |
|
| 48 |
handler({type}) { |
| 49 |
this.state.toggleClass(`uk-${~['focus', 'blur'].indexOf(type) ? 'focus' : 'hover'}`, ~['focus', 'mouseenter'].indexOf(type)); |
| 50 |
}
|
| 51 |
|
| 52 |
},
|
| 53 |
|
| 54 |
{
|
| 55 |
|
| 56 |
name: 'change', |
| 57 |
|
| 58 |
handler() { |
| 59 |
this.target && this.target[this.target.is(':input') ? 'val' : 'text']( |
| 60 |
this.input[0].files && this.input[0].files[0] |
| 61 |
? this.input[0].files[0].name |
| 62 |
: this.input.is('select') |
| 63 |
? this.input.find('option:selected').text() |
| 64 |
: this.input.val() |
| 65 |
);
|
| 66 |
}
|
| 67 |
|
| 68 |
}
|
| 69 |
|
| 70 |
]
|
| 71 |
|
| 72 |
});
|
| 73 |
|
| 74 |
}
|