<template>
    <div class="page-download">
        <block-header title="搜索" />
        <BaseSearch v-bind="form" ref="search" :config="searchConfig"></BaseSearch>
        <block-header title="法诉材料列表">
            <el-button size="small" @click="visible = true" type="primary">上传生成材料</el-button>
        </block-header>
        <BaseTable v-bind="table" ref="table" :columns="columns"></BaseTable>


        <!-- 上传并生成材料 弹框 -->
        <BaseDialog :visible.sync="visible" title="上传并生成材料" width="35%">
            <component is="CreateDownload" @callback="reload"></component>
        </BaseDialog>
    </div>
</template>

<script>
import _ from 'lodash'
import { FormTableMixin } from '@/mixins/form-table'
import CreateDownload from './components/create.vue'
import API from '@/server/api'

// 获取列表
const service = async (params) => {
    try {
        const { data = {} } = await API.GetCollectionDownLoad({ ...params })
        return {
            data: data.result?.data,
            total: data.result?.total
        }
    } catch {
        console.log('初始化法诉下载列表报错')
    }
}

export default {
    name: "CollectionDownload",
    mixins: [FormTableMixin(service)],
    components: { CreateDownload },
    data() {
        return {
            visible: false,
            searchConfig: [
                {
                    component: 'input',
                    prop: 'batchName',
                    label: '案件批次',
                    placeholder: '请输入案件批次'
                },
                {
                    component: 'select',
                    prop: 'riskType',
                    label: '状态',
                    placeholder: '请选择',
                    options: [
                        { label: '已创建', value: 'CREATED' },
                        { label: '生成中', value: 'NEEDZIP' },
                        { label: '已完成', value: 'FINISHED' }
                    ]
                }
            ],
            columns: [
                {
                    label: '案件批次',
                    prop: 'batchName',
                },
                {
                    label: '案件数',
                    prop: 'caseNumber',
                },
                {
                    label: '状态',
                    prop: 'caseStatusStr',
                    render: (_, text, row) => {
                        const { caseStatus } = row
                        switch (caseStatus) {
                            case 'CREATED':
                                return <el-tag>{text}</el-tag>
                            case 'NEEDZIP':
                                return <el-tag type="warning">{text}</el-tag>
                            case 'FINISHED':
                                return <el-tag type="success">{text}</el-tag>
                            default:
                                return ''
                        }
                    }
                },
                {
                    label: '创建时间',
                    prop: 'gmtCreatedStr',
                    width: '155px'
                },
                {
                    label: '更新时间',
                    prop: 'gmtModifiedStr',
                    width: '155px'
                },
                {
                    label: '备注',
                    prop: 'memo',
                },
                {
                    label: '操作人',
                    prop: 'creator'
                },
                {
                    label: '操作',
                    prop: 'zipPath',
                    render: (_, text, row) => {
                        if (row.caseStatus === 'FINISHED') return <a alt='' title='' target="_blank" href={text}>下载材料包</a>
                        else return ''
                    }
                }
            ],
        }
    },
    mounted() {

    },
    methods: {
        async init() {
            try {
                const res = await this.$$get('/protocol/selectProtocolEnumList')
                if (res.status === 200 && res.data.success) {
                    this.EnumList = res.data.result;
                } else {
                    this.$message.error(res.data.message);
                }
            } catch (err) {
                this.$message.error(res || '初始化协议枚举列表报错');
            }
        },
        async reload() {
            this.getList()
        }
    },
}
</script>

<style lang="less" scoped></style>