<template>
    <Table
        url="/ranger/inspection/api/v1/place/page"
        rowKey="placeId"
        :selected.sync="selected"
        addBtn
        :buttons="buttons"
        ref="table"
    >
        <template #search="{ query }">
            <MoreItem label="地区">
                <UrlSelect
                    v-model="query.regionId"
                    url="/ranger/inspection/api/v1/region/list"
                    labelFiled="regionName"
                    valueFiled="regionId"
                    placeholder="选择地区"
                />
            </MoreItem>
            <MoreItem label="搜索">
                <a-input v-model="query.inputValue" placeholder="请输入地点名称/二维码/电子标签" />
            </MoreItem>
        </template>

        <template #operation>
            <a-button @click="download">导出</a-button>
        </template>

        <template #drawer="drawer">
            <AddAndEdit v-if="drawer.type !== 'exempt'" v-bind="drawer" />
            <Exempt v-else v-bind="drawer" />
        </template>

        <a-table-column title="地点名称" data-index="placeName" />
        <a-table-column title="所属地区" data-index="regionName" />
        <a-table-column title="二维码" data-index="qrCode" />
        <a-table-column title="电子标签" data-index="electronicTag" />
        <a-table-column title="修改人" data-index="editorName" />
        <a-table-column title="修改时间" data-index="editTime" />
    </Table>
</template>

<script>
import Table from '@/components/table/table.vue';
import UrlSelect from '@/components/MySelect/url_select.vue';
import MoreItem from '@/components/table/more_item.vue';
import { downloadFileByUrl } from '@/utils';
import AddAndEdit from './add_edit.vue';
import Exempt from './exempt.vue';

export default {
    components: { Table, UrlSelect, MoreItem, AddAndEdit, Exempt },
    data() {
        return {
            buttons: [
                { label: '编辑', click: this.edit },
                { label: '详情', click: this.view },
                { label: '免检', click: this.exempt },
                {
                    type: 'confirm',
                    url: (row) => `/ranger/inspection/api/v1/place/${row.placeId}`,
                    after: this.refresh,
                },
            ],
            selected: {},
        };
    },
    methods: {
        refresh() {
            this.$refs.table.getData();
        },
        edit(row) {
            this.$refs.table.show({ row, title: '编辑', type: 'edit' });
        },
        view(row) {
            this.$refs.table.show({ row, title: '查看', type: 'view' });
        },
        exempt(row) {
            this.$refs.table.show({ row, title: '免检', type: 'exempt' });
        },
        download() {
            if (!this.selected?.keys?.length) return this.$message.error('请选择需要导出的数据');
            downloadFileByUrl(
                `/ranger/inspection/api/v1/place/exportQrCodeData?placeIdList=${this.selected.keys.join(
                    ',',
                )}`,
            );
        },
    },
};
</script>
