Feature: Support options message type on widget and dashboard (#614)

This commit is contained in:
Nithin David Thomas 2020-03-16 12:08:40 +05:30 committed by GitHub
parent bb47b5f086
commit d8599c62dd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 165 additions and 7 deletions

View file

@ -0,0 +1,68 @@
<template>
<li class="option" :class="{ 'is-selected': isSelected }">
<button class="option-button button" @click="onClick">
<span v-if="isSelected" class="icon ion-checkmark-circled" />
<span v-else class="icon ion-android-radio-button-off" />
<span>{{ action.text }}</span>
</button>
</li>
</template>
<script>
export default {
components: {},
props: {
action: {
type: Object,
default: () => {},
},
isSelected: {
type: Boolean,
default: false,
},
},
methods: {
onClick() {
// Do postback here
},
},
};
</script>
<style scoped lang="scss">
@import '~dashboard/assets/scss/variables.scss';
@import '~dashboard/assets/scss/mixins.scss';
.option {
.option-button {
width: 100%;
padding: 0;
max-height: $space-larger;
border-radius: 0;
background: transparent;
color: $color-woot;
border: 0;
text-align: left;
cursor: pointer;
span {
display: inline-block;
vertical-align: middle;
}
> .icon {
margin-right: $space-smaller;
font-size: $font-size-medium;
}
}
+ .option .option-button {
@include border-normal-top;
}
&.is-selected {
.option-button {
color: $success-color;
}
}
}
</style>