<template>
  <BackgroundImageButton 
    backgroundImage="https://xy.wenlvti.net/app_static/images/village/ButtonPrimary.png"
    :backgroundCutBorder="20"
    :backgroundCutBorderSize="20"
    :padding="[22, 40]"
    :width="block ? undefined : width"
    :flex="block ? '1 0 100%' : undefined"
    :innerStyle="{
      ...innerStyle,
      flexShrink: 0,
    }"
    center
    @click="emit('click')"
  >
    <ActivityIndicator v-if="loading" :size="36" color="text.content" />
    <Text :text="text" fontFamily="SongtiSCBlack" color="text.content" />
  </BackgroundImageButton>
</template>

<script setup lang="ts">
import ActivityIndicator from '@/components/basic/ActivityIndicator.vue';
import BackgroundImageButton from '@/components/basic/BackgroundImageButton.vue';
import Text from '@/components/basic/Text.vue';

const props = withDefaults(defineProps<{
  text: string;
  width?: string|number;
  innerStyle?: object;
  loading?: boolean;
  block?: boolean;
}>(), {
  text: '去发布',
}); 

const emit = defineEmits(['click']);

defineOptions({
  options: {
    virtualHost: true,
  },
})
</script>