<template>
    <div class="container">
        <header>
            <el-form :label-width="120">
                <el-row>
                    <el-col :span="6">
                        <el-form-item label="数据来源">
                            <el-select v-model="query.source" clearable>
                                <el-option value="公安部信访">公安部信访</el-option>
                                <el-option value="国家信访">国家信访</el-option>
                                <el-option value="案件核查">案件核查</el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="创建时间">
                            <date-time-range-picker-ext v-model="query.crtTime"/>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div class="flex end mb-20">
                <el-button type="primary" @click="getList">
                    <template #icon>
                        <icon name="el-icon-Search" />
                    </template>
                    查询</el-button
                >
                <el-button @click="reset">重置</el-button>
            </div>
        </header>
        <div class="table-container" v-loading="loading">
            <el-table :data="list">
                <el-table-column label="数据来源" prop="source" show-overflow-tooltip />
                <el-table-column
                    label="导入数量"
                    prop="importRow"
                    align="center"
                />
                <el-table-column label="操作时间" prop="crtTime" />
                <el-table-column label="操作人" prop="crtUser" />
                <el-table-column label="状态" prop="status">
                    <template #default="{ row }">
                        <el-tag type="success" v-if="row.status === '0'"
                            >导入成功</el-tag
                        >
                        <el-tag type="danger" v-else-if="row.status === '1'"
                            >导入失败</el-tag
                        >
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div class="flex end mt-8">
            <el-pagination
                @size-change="getList"
                @current-change="getList"
                :page-sizes="[10, 20, 50]"
                v-model:page-size="query.size"
                v-model:current-page="query.current"
                layout="total, sizes, prev, pager, next"
                :total="total"
            >
            </el-pagination>
        </div>
      <p>展示本人导入的线索台账，记录定期导入的数据来源及数据量</p>
    </div>
</template>
<script setup>
import { BASE_PATH } from "@/api/request";
import { listNegativeTask } from "@/api/work/negativeTask";

const list = ref([]);
const query = ref({
    size: 10,
    current: 1,
    category: '1'
});
const total = ref(0);

const loading = ref(true)
function getList() {
    loading.value = true
    listNegativeTask(query.value).then((data) => {
        list.value = data.records;
        total.value = data.total;
        loading.value = false
    });
}

function reset() {
    query.value = {
        size: 10,
        current: 1,
        category: '1'
    };
    getList();
}

onMounted(() => {
    getList();
});

function handleDownload(row) {
    if (row.status !== '1') {

    }
    fetch(`${BASE_PATH}/file/stream${row.filePath}`)
        .then((response) => {
            console.log(response);
            return response.blob();
        })
        .then((res) => {
            console.log(res);
            const blob = new Blob([res], {
                type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
            });
            const url = window.URL.createObjectURL(blob);
            const link = document.createElement("a");
            link.href = url;
            link.setAttribute("download", row.taskName + ".xlsx");
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
            window.URL.revokeObjectURL(url);
        });
}
</script>
<style lang="scss" scoped>
</style>