<template>
  <view 
    :class="[
      'home-title',
      titleLevel,
      showMore ? 'has-more' : '',
      inWing ? 'wing-l in-wing' : '',
    ]"
  >
    <slot>
      <text>{{ title }}</text>
    </slot>
    <text v-if="showMore" class="more" @click="$emit('clickMore')">
      {{moreText}}
      <text class="iconfont icon-arrow-right ml-2" />
    </text>
  </view>
</template>

<script setup lang="ts">
import type { PropType } from 'vue';

defineProps({	
  title: {
    type: String,
    default: '',
  },
  moreText: {
    type: String,
    default: '查看全部',
  },
  inWing: {
    type: Boolean,
    default: false,
  },
  showMore: {
    type: Boolean,
    default: false,
  },
  titleLevel: {
    type: String as PropType<'h1'|'h2'|'h3'>,
    default: 'h1',
  },
})
defineEmits(['clickMore'])
</script>