<!--  -->
<template>
  <div class="">
    <a-button type="primary" @click="showEvent">批量下载 </a-button>
    <!-- :config="previewShowConfig.config"
    :url="previewShowConfig.url"
    :name="previewShowConfig.name" -->
    <p-PreviewShow
      :event="closePreview"
      :showHelp="false"
      v-bind="previewShowConfig"
    ></p-PreviewShow>

    <p-ImgGroup :value="imageArr"></p-ImgGroup>
  </div>
</template>

<script>
export default {
  // import引入的组件需要注入到对象中才能使用
  name: 'PreviewShow',
  components: {},
  props: {
    // handA: {
    //   type: String,
    //   required: true,
    //   default: '100'
    // }
  },
  data() {
    // 这里存放数据
    return {
        imageArr:[],
       previewShowConfig: {
        config: {
          title: "dddd5.xlsx",
          visible: false,
          loading: false,
          width: "50vw",
          height: "60vh",
        },
        // url1: "http://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/user/license/1688461333251_%E6%96%B0%E5%BB%BA%20Microsoft%20Excel%20%E5%B7%A5%E4%BD%9C%E8%A1%A8.xlsx",
        // name1: "dddd5.xlsx",
        url: [
          "http://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/qsb/invoice/1733301710906_11057461_%E4%B8%AD%E9%9B%84%EF%BC%88%E6%AD%A6%E6%B1%89%EF%BC%89%E4%BF%A1%E6%81%AF%E7%A7%91%E6%8A%80%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8_4.43.ofd",
          "https://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/user/license/1665366376389_44145877a3e156f07eeab276e8d4ba1(1).jpg",
          "https://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/user/license/1665366376389_44145877a3e156f07eeab276e8d4ba1(1).jpg",
          "http://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/user/license/1688461328187_TASK101027941-2.pdf",
          "http://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/user/license/1688461333251_%E6%96%B0%E5%BB%BA%20Microsoft%20Excel%20%E5%B7%A5%E4%BD%9C%E8%A1%A8.xlsx",
        ],
        name: [
          "dddd1.jpg",
          "dddd2.jpg",
          "dddd3.jpg",
          "dddd4.pdf",
          "dddd5.xlsx",
        ],
        isShowWatermark:true,
        isBatchDownload:true,
        vhas:'sss',
        // suffix: "jpg",
      },
    };
  },
  // 监听属性 类似于data概念
  computed: {},
  // 监控data中的数据变化
  watch: {},
  // 生命周期 - 创建完成（可以访问当前this实例）
  created() {},
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {
    // console.log(this);
    const tt = 'https://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/user/license/1665366376389_44145877a3e156f07eeab276e8d4ba1(1).jpg'
    this.imageArr.push(tt)
    this.imageArr.push('http://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/user/card/1725324981264_%E5%8F%91%E7%A5%A8.pdf')
    this.imageArr.push('http://zxcloud-test.oss-cn-hangzhou.aliyuncs.com/qsb/invoice/1733301710906_11057461_%E4%B8%AD%E9%9B%84%EF%BC%88%E6%AD%A6%E6%B1%89%EF%BC%89%E4%BF%A1%E6%81%AF%E7%A7%91%E6%8A%80%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8_4.43.ofd')
    // this.$addWatermark(tt,this,{title:'ceshi', subtitle:'中雄机密文件禁止外传'}).then(res=>{
    //   console.log('#################', res);
    //   this.imageArr.push(res)
    // })
  },
  // 方法集合
  methods: {
    closePreview() {
      this.previewShowConfig.config.visible = false;
    },
    showEvent(){
        this.previewShowConfig.config.visible = true;
    },
  },
  }
</script>
<style lang='less' scoped>
</style>