You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

bar-item.vue 836 B

4 years ago
12345678910111213141516171819202122232425262728293031323334353637
  1. <template>
  2. <view v-if="type === 'default'" @click="click" class="action cu-bar-item">
  3. <slot>
  4. <l-icon :type="icon" :color="color" size="lg" class="cuIcon-cu-image" />
  5. <slot name="badge"></slot>
  6. <view :class="'text-' + color">
  7. <slot name="title">{{ title }}</slot>
  8. </view>
  9. </slot>
  10. </view>
  11. <view v-else-if="type === 'round'" class="action text-gray add-action cu-bar-item">
  12. <slot>
  13. <button :class="['bg-' + color, 'cuIcon-' + icon]" class="cu-btn shadow"></button>
  14. <slot name="title">{{ title }}</slot>
  15. </slot>
  16. </view>
  17. </template>
  18. <script>
  19. export default {
  20. name: 'l-bar-item',
  21. props: {
  22. type: { default: 'default' },
  23. title: {},
  24. icon: {},
  25. color: { default: 'gray' }
  26. },
  27. methods: {
  28. click(e) {
  29. this.$emit('click', e)
  30. }
  31. }
  32. }
  33. </script>