<template>
  <el-carousel height="600px" indicator-position="outside" trigger="click">
    <el-carousel-item v-for="item in images" :key="item" style="display: flex; align-items: center; justify-content: center">
      <el-image :src="item" fit="contain" width="100%" height="100%" loading="lazy" :preview-src-list="images" preview-teleported close-on-press-escape hide-on-click-modal></el-image>
    </el-carousel-item>
  </el-carousel>
  <view>
    <text v-if="remark" style="color: red; font-weight: bold; font-size: 18px; white-space: pre-line"> 预计发货时间:<br />{{ remark }}</text>
  </view>
</template>

<script setup>
import { ref, watch } from "vue";

const props = defineProps({
  images: {
    type: Array,
    required: true,
    default: () => [],
  },
  remark: {
    type: String,
    default: "",
  },
});
const localData = ref(props.modelValue);
</script>
