<template>
    <div>
        <el-form ref="archiveDataForm" class="form-header" :model="selectForm" label-width="auto" size="small"
            @submit.native.prevent>
            <el-row>
                <el-col :span="7">
                    <el-form-item label="操作时间">
                        <el-date-picker class="formItem" v-model="selectForm.dateList" type="daterange"
                            range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                            value-format="yyyy-MM-dd" clearable>
                        </el-date-picker>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <div class="ml20 mb20">
            <el-button type="primary" size="mini" icon="el-icon-search" :loading="loading" @click="selectLog(1)">查 询
            </el-button>
        </div>
        <Tables ref="archiveDataTables" ductName="archiveDataTables" :order="true" :border='true' :data="data"
            :headerData="tableHeader" tableAlign="center" :showOverflowTooltip="true" :height="tableHeight"
            :page="selectForm.page" :limitSize="selectForm.size" :pageSizes="[20]" :totalCount="total"
            :loading="loading" @currentChange="currentChange">
            <template v-slot:queryParameter="scope">
                <el-popover placement="top" width="350" trigger="hover">
                    <ul style="height:300px;overflow-y:scroll;"
                        v-if="scope.row.queryParameter != null && scope.row.queryParameter != ''">
                        <li v-for="(item, index) in JSON.stringify(JSON.parse(scope.row.queryParameter)).split(',')"
                            :key="index" style="border-bottom:1px solid #E4E7ED;margin-bottom:5px">{{ item }}</li>
                    </ul>
                    <el-button type="text" slot="reference">查 看</el-button>
                </el-popover>
            </template>
            <template v-slot:downloadPath="scope">
                <el-button v-if="scope.row.downloadPath != null && scope.row.status == 1" type="text" size="mini"
                    icon="el-icon-download" @click="download(scope.row)">下载
                </el-button>
                <span v-else>暂无下载</span>
            </template>
        </Tables>
    </div>
</template>

<script>
import { findArchiveCargoLog, isExistZip } from "@/api/system/logConfig.js";
import { downLoadZip } from "@/utils/zipdownload";

export default {
    data() {
        return {
            selectForm: {
                dateList: [],
                page: 1,
                size: 20
            },
            data: [],
            tableHeader: this.tableHeaders['archiveData'],
            tableHeight: null,
            total: 0,
            loading: false,
        }
    },
    created() {
      this.selectLog()
      // this.$nextTick(()=>{
      //   let height = window.innerHeight - this.$refs.archiveDataForm.$el.offsetHeight - 200;
      //   if(height < 300){
      //     this.tableHeight = 300;
      //   }else{
      //     this.tableHeight = height;
      //   }
      // })
    },
    mounted() {
        this.tableHeight = window.innerHeight - this.$refs.archiveDataForm.$el.offsetHeight - 200
    },
    methods: {
        selectLog(val) {
            this.loading = true
            if (val == 1) {
                this.selectForm.page = 1
            }
            let obj = {}
            if (this.selectForm.dateList && this.selectForm.dateList.length > 0) {
                obj.createTimeStart = this.selectForm.dateList[0]
                obj.createTimeEnd = this.selectForm.dateList[1]
            }
            obj.page = this.selectForm.page
            obj.size = this.selectForm.size
            findArchiveCargoLog(obj).then(res => {
                this.loading = false
                if (res.code === 200) {
                    this.data = res.data.list
                    this.total = res.data.total
                } else {
                    this.msgWarning(res.msg)
                }
            }).catch(err => {
                this.loading = true
                console.log(err)
            })
        },
        download(val) {
            isExistZip(val).then(res => {
                if (res.code === 200) {
                    setTimeout(() => {
                        let url = '/archiveCargoLog/downloadZip'
                        let filename = val.packageName
                        downLoadZip(url, val, filename)
                    }, 500);
                } else {
                    this.msgWarning(res.msg)
                }
            }).catch(err => {
                console.log(err)
            })
        },
        currentChange(val) {
            this.selectForm.page = val.page
            this.selectLog()
        }
    }
}
</script>

<style lang="scss" scoped>

</style>