
<template>
  <HcCard>
    <template #extra>
            <HcUploadFile
            :options="UploadFileOptions"
            @progress="HcUploadFileProgress"
            @success="HcUploadFileSuccess"
            @change="HcUploadFileChange"
        >
            <el-button hc-btn type="primary">上传新制度</el-button>
        </HcUploadFile>
    </template>
    <HcTable :column="tableColumn" :datas="tableData" >
            <template #name="{row}">
                        <div class="text-link text-blue"  @click="viewPdf(row)">{{row?.name}}</div>
            </template>
            <template #action="{row, index}">
                <HcUploadFile
                  :options="UploadFileOptions"
                  @progress="HcUploadFileProgress"
                  @success="HcUploadFileSuccess"
                  @change="HcUploadFileChange"
              >
                  <el-button hc-btn type="primary" size="small">重新上传</el-button>
              </HcUploadFile>
            </template>
      </HcTable>
      <template #action>
            <HcPages :pages="searchForm" @change="pageChange"></HcPages>
      </template>
  </HcCard>
</template>

<script setup>
import {ref, watch} from  'vue'
import {getTokenHeader} from "~src/api/request/header";

const tableColumn = [
    {key: 'name', name: '制度名称'},
    {key: 'action', name: '操作', width: 120}

]
const tableData = ref([
    {name: '名称1',},
    {name: '名称2', },
    {name: '名称3', }
])
const searchForm = ref({
    name: '',
    current: 1, size: 20, total: 0
})
//分页被点击
const pageChange = ({current, size}) => {
    searchForm.value.current = current
    searchForm.value.size = size
}


//上传配置
const UploadFileOptions = {
    // 此处设置header
    headers: getTokenHeader(),
}

// 文件上传进度
const HcUploadFileProgress = (res) => {
    console.log('文件上传进度', res)
}
// 文件上传成功的回调
const HcUploadFileSuccess = (res) => {
    console.log('文件上传成功', res)
}

// 文件全部上传成功
const HcUploadFileChange = () => {
    console.log('文件全部上传成功')
}
//查看pdf
 const viewPdf=()=>{
    window.open('http://bladex-chongqing-info.oss-cn-hangzhou.aliyuncs.com//upload/20230606/c339aec388bab8c36d3272fe93bae350.pdf', '_blank')
 }
</script>
<style lang='scss' scoped>
</style>