<template>
    <Wraper :hidden="hidden" noFooter>
        <Table
            :url="tableUrl"
            rowKey="taskId"
            noPadding
            :buttons="buttons"
            :scroll="scroll"
            :width="600"
            ref="table"
        >
            <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>
            </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
                        v-model="query.placeId"
                        :url="`/ranger/inspection/api/v1/place/regions/${row.regionId}/list`"
                        labelFiled="placeName"
                        valueFiled="placeId"
                    />
                </MoreItem>

                <MoreItem label="单元">
                    <UrlSelect
                        v-model="query.unitId"
                        :url="
                            query.placeId
                                ? `/ranger/inspection/api/v1/units/places/${query.placeId}/list`
                                : ''
                        "
                        labelFiled="unitName"
                        valueFiled="unitId"
                    />
                </MoreItem>

                <MoreItem label="项目">
                    <UrlSelect
                        v-model="query.itemId"
                        :url="
                            query.unitId ? `/ranger/inspection/api/v1/items/units/${query.unitId}/list` : ''
                        "
                        labelFiled="itemName"
                        valueFiled="itemId"
                    />
                </MoreItem>

                <MoreItem label="巡检状态">
                    <UrlSelect
                        v-model="query.inspectionState"
                        :url="zhuangTaiUrl"
                        labelFiled="paramName"
                        valueFiled="paramValue"
                    />
                </MoreItem>

                <MoreItem label="巡查结果">
                    <UrlSelect
                        :url="xunChaJieGuoUrl"
                        v-model="query.inspectionResultName"
                        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 #drawer="drawer">
                <ViewDetailCom v-bind="drawer" />
            </template>

            <a-table-column title="巡检项目" data-index="taskName" />
            <a-table-column title="参考值" data-index="referenceValue" width="150px" />
            <a-table-column title="采集数据" data-index="value" width="150px" />
            <a-table-column title="巡查结果" data-index="inspectionResultName" width="100px" />
            <a-table-column title="巡查时间" data-index="inspectionTime" width="200px" />
            <a-table-column title="巡检人" data-index="inspectionStaffName" width="100px" />
            <a-table-column title="状态" data-index="inspectionStateName" width="100px" />
        </Table>
    </Wraper>
</template>

<script>
import Table from '@/components/table/table.vue';
import Wraper from '@/components/table/wraper.vue';
import UrlSelect from '@/components/MySelect/url_select.vue';
import SearchSelect from '@/components/MySelect/search_select.vue';
import langUtils from '@/utils/langUtils';
import MoreItem from '@/components/table/more_item.vue';
import ViewDetailCom from './view_detail.vue';

export default {
    props: { hidden: Function, row: Object },
    components: { Table, Wraper, SearchSelect, UrlSelect, MoreItem, ViewDetailCom },

    data() {
        return {
            scroll: { x: 1200 },
            buttons: {
                title: '备注 & 附件',
                options: {
                    fixed: 'right',
                    width: 150,
                },
                data: [
                    {
                        label: '查看',
                        click: this.viewDetail,
                    },
                ],
            },
        };
    },
    computed: {
        tableUrl() {
            return `/ranger/inspection/api/v1/jobs/tasks?jobId=${this.row.jobId}`;
        },
        xunChaJieGuoUrl() {
            return `/api/v1/parameters/business/list?paramModule=rpis_task&paramCode=inspection_result&paramLocale=${langUtils.get()}`;
        },
        zhuangTaiUrl() {
            return `/api/v1/parameters/business/list?paramModule=rpis_route_schedule&paramCode=inspection_state&paramLocale=${langUtils.get()}`;
        },
    },
    methods: {
        viewDetail(row) {
            console.log(row);
            this.$refs.table.show({ row, title: '备注 & 附件' });
        },
    },
};
</script>
