// ImageFormItems.vue - Form items specific to the h5-image component
<template>
  <div>
    <el-form-item label="图片">
      <image-upload v-model="config.url" :file-type='["png", "jpg", "jpeg", "gif"]' :limit="1"/>
    </el-form-item>
    <div class="image-tips">
      <p>建议尺寸：宽750px，高不限；</p>
      <p>支持格式：png/jpeg/gif，不大于1M尺寸。</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'ImageFormItems',
  props: {
    config: {
      type: Object,
      required: true
    }
  }
}
</script>

<style scoped>
.image-tips {
  margin-top: 12px;
  padding: 12px;
  background-color: #fef0e6;
  border-left: 3px solid #ff9800;
  border-radius: 4px;
}

.image-tips p {
  margin: 4px 0;
  color: #ff9800;
  font-size: 12px;
  line-height: 1.6;
}

.image-tips p:first-child {
  margin-top: 0;
}

.image-tips p:last-child {
  margin-bottom: 0;
}
</style>