<template>
    <Table
        url="/ranger/inspection/api/v1/jobs"
        :buttons="buttons"
        rowKey="jobId"
        :addBtn="addBtn"
        :selected.sync="selected"
        ref="table"
        :drawerWidth="800"
    >
        <template #search="{ query }">
            <MoreItem label="开始时间">
                <a-date-picker
                    class="tw-w-full"
                    show-time
                    v-model="query.startTime"
                    valueFormat="YYYY-MM-DD HH:mm:ss"
                />
            </MoreItem>

            <MoreItem label="结束时间">
                <a-date-picker
                    class="tw-w-full"
                    show-time
                    v-model="query.endTime"
                    valueFormat="YYYY-MM-DD HH:mm:ss"
                />
            </MoreItem>
            <MoreItem label="地区">
                <UrlSelect
                    url="/ranger/inspection/api/v1/region/list"
                    v-model="query.regionId"
                    labelFiled="regionName"
                    valueFiled="regionId"
                />
            </MoreItem>
        </template>

        <template #moreSearch="{ query }">
            <MoreItem label="开始时间">
                <a-date-picker
                    class="tw-w-full"
                    show-time
                    v-model="query.startTime"
                    valueFormat="YYYY-MM-DD HH:mm:ss"
                />
            </MoreItem>
            <MoreItem label="结束时间">
                <a-date-picker
                    class="tw-w-full"
                    show-time
                    v-model="query.endTime"
                    valueFormat="YYYY-MM-DD HH:mm:ss"
                />
            </MoreItem>
            <MoreItem label="地区">
                <UrlSelect
                    url="/ranger/inspection/api/v1/region/list"
                    v-model="query.regionId"
                    labelFiled="regionName"
                    valueFiled="regionId"
                />
            </MoreItem>
            <MoreItem label="专业">
                <UrlSelect
                    :url="
                        query.regionId
                            ? `/ranger/inspection/api/v1/specialities/valid/regions/${query.regionId}/list`
                            : ''
                    "
                    v-model="query.specialityId"
                    labelFiled="specialityName"
                    valueFiled="specialityId"
                />
            </MoreItem>
            <MoreItem label="线路">
                <UrlSelect
                    :url="
                        query.regionId
                            ? `/ranger/inspection/api/v1/routes/regions/${query.regionId}/list`
                            : ''
                    "
                    labelFiled="routeName"
                    valueFiled="routeId"
                    v-model="query.routeId"
                />
            </MoreItem>
            <MoreItem label="班组">
                <RequestSelect
                    :request="getBanZuListApi"
                    v-model="query.shiftType"
                    labelFiled="paramName"
                    valueFiled="paramValue"
                />
            </MoreItem>
            <MoreItem label="巡检状态">
                <RequestSelect
                    :request="getBusinessListApi"
                    v-model="query.inspectionState"
                    labelFiled="paramName"
                    valueFiled="paramValue"
                />
            </MoreItem>
            <MoreItem label="任务类型">
                <RequestSelect
                    :request="getTaskTypeApi"
                    v-model="query.jobType"
                    labelFiled="paramName"
                    valueFiled="paramValue"
                />
            </MoreItem>
            <MoreItem label="巡检人">
                <SearchSelect
                    url="/api/v1/users/searching"
                    searchField="userName"
                    v-model="query.lastInspectionStaffId"
                    labelFiled="userName"
                    valueFiled="userId"
                />
            </MoreItem>
        </template>

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

        <template #drawer="{ hidden, refresh, type, row }">
            <Form :hidden="hidden" :refresh="refresh" v-if="type === null" />
            <Progress v-if="type === 'progress'" :hidden="hidden" :row="row" />
            <Detail v-if="type === 'detail'" :hidden="hidden" :row="row" />
        </template>

        <a-table-column title="线路名称" data-index="routeName" />
        <a-table-column title="专业" data-index="specialityName" />
        <a-table-column title="地区" data-index="regionName" />
        <a-table-column title="班组" data-index="shiftTypeName" />
        <a-table-column title="任务时间" data-index="jobTime" />
        <a-table-column title="巡检状态" data-index="inspectionStateName" />
        <a-table-column title="任务类型" data-index="jobTypeName" />
        <a-table-column title="巡检开始时间" data-index="inspectionStartTime" />
        <a-table-column title="巡检结束时间" data-index="inspectionEndTime" />
        <a-table-column title="巡检人" data-index="lastInspectionStaffName" />
    </Table>
</template>

<script>
import Table from '@/components/table/table.vue';
import Form from './form.vue';
import UrlSelect from '@/components/MySelect/url_select.vue';
import { getXunJianDownloadUrlApi } from '@/api';
import { downloadFileByUrl } from '@/utils';
import RequestSelect from '@/components/MySelect/RequestSelect.vue';
import SearchSelect from '@/components/MySelect/search_select.vue';
import { getStaticDataByTwoParamsApi } from '@/api';
import Progress from './progress.vue';
import Detail from './detail.vue';
import MoreItem from '@/components/table/more_item.vue';

export default {
    components: {
        Table,
        Form,
        RequestSelect,
        UrlSelect,
        SearchSelect,
        Progress,
        Detail,
        MoreItem,
    },
    data() {
        return {
            getBusinessListApi: () => getStaticDataByTwoParamsApi('rpis_route_schedule', 'inspection_state'),
            getBanZuListApi: () => getStaticDataByTwoParamsApi('rpis_route_schedule', 'shift_type'),
            getTaskTypeApi: () => getStaticDataByTwoParamsApi('rpis_route_schedule', 'job_type'),
            addBtn: {
                title: '新建临时任务',
            },
            buttons: [
                {
                    label: '详情',
                    click: this.viewDetail,
                },
                { label: '进度', click: this.viewProgress },
                {
                    type: 'confirm',
                    url: (row) => `/ranger/inspection/api/v1/jobs/${row.jobId}`,
                    after: this.refresh,
                },
            ],
            selected: {},
        };
    },
    methods: {
        async download() {
            if (!this.selected?.keys?.length) return this.$message.error('请选择需要导出的数据');
            const url = await getXunJianDownloadUrlApi(this.selected.keys);
            downloadFileByUrl(`${this.$fileUrl}${url}`);
        },
        refresh() {
            this.$refs['table'].getData();
        },
        viewProgress(row) {
            this.$refs.table.show({ title: '任务进度', type: 'progress', row });
        },
        viewDetail(row) {
            this.$refs.table.show({ title: '任务明细', type: 'detail', row });
        },
    },
};
</script>
