Skip to content

Commit

Permalink
Merge pull request #1 from phpzm/master
Browse files Browse the repository at this point in the history
update upstream
  • Loading branch information
gilvaju authored Dec 20, 2017
2 parents 060e221 + aac589c commit 9fd6b10
Showing 1 changed file with 16 additions and 8 deletions.
24 changes: 16 additions & 8 deletions components/fields/components/color.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@
<field :class="classNames" v-bind="{id, inline, problems, label, validate, title, tooltip, editable, visible}">
<div slot="component">
<div v-show="editable" class="color-wrapper grid" :class="{'has-error': problems.length}">
<div class="color" :style="{'background': model.hex}"></div>
<div class="color" :style="{'background': hex}"></div>
<q-btn color="primary" class="color-button">
<q-icon name="search"></q-icon>
<q-popover ref="popover">
<sketch :value="model" @input="updateValue"></sketch>
<sketch :value="hex" @input="updateValue"></sketch>
</q-popover>
</q-btn>
</div>
Expand All @@ -29,20 +29,28 @@
},
name: 'field-color',
data: () => ({
model: {
hex: '#ffffff'
}
hex: ''
}),
props: {
color: {
type: String,
default: '#FFFFFF'
}
},
methods: {
updateValue (color) {
this.model.hex = color.hex
this.$emit('input', color.hex)
this.hex = color
this.$emit('input', color)
}
},
watch: {
value (color) {
this.model.hex = color
this.hex = color
}
},
created () {
this.hex = this.color
this.updateValue(this.color)
}
}
</script>
Expand Down

0 comments on commit 9fd6b10

Please # to comment.