<template>
  <view
    :style="{
      borderTop: props.borderTop ? borderStyle : '',
      padding: props?.padding || paddingStyle
    }"
  >
    <view class="title">{{ props?.title || '标题' }}<text v-if="required"> * </text></view>
    <view class="subTitle"> 最多上传 {{ props?.maxCount || 1 }} 张图片，支持jpg、png格式 </view>
    <view>
      <slot></slot>
    </view>
  </view>
</template>
<script setup lang="ts">
const borderStyle = '1rpx solid #eee'
const paddingStyle = '10rpx 0'
import { defineProps, defineEmits } from 'vue'
const props = defineProps(['title', 'borderTop', 'required', 'padding', 'placeholder', 'maxCount'])
const emit = defineEmits(['click', 'onGetPhoneNumber'])
</script>
<style lang="scss" scoped>
.title {
  color: #1d2129;
  font-size: 30rpx;
  padding: 20rpx 0 10rpx 0;
  text {
    color: #f00;
  }
}
.subTitle {
  color: #ccc;
  font-size: 23rpx;
}
</style>
