<template>
    <Wraper :hidden="hidden" noFooter>
        <Table
            url="/ranger/inspection/api/v1/route/assembles"
            rowKey="assembleId"
            :formatData="formatData"
            addBtn
            ref="assembleTable"
            :scroll="{ x: true }"
            :otherQuery="getDefaultQuery()"
            @expand="expand"
            :buttons="buttons"
        >
            <template #drawer="drawer">
                <Add v-bind="drawer" :data="row" />
            </template>
            <a-table-column title="名称" data-index="assembleObjectName" />
            <a-table-column title="顺序">
                <template #default="row">
                    <span v-if="row.assembleObjectType === 'PLACE'">{{ row.assembleOrder }}</span>
                    <span v-else>-</span>
                </template>
            </a-table-column>
            <a-table-column title="类型">
                <template #default="row">
                    <span v-if="row.assembleObjectType === 'PLACE'">地点</span>
                    <span v-if="row.assembleObjectType === 'UNIT'">单元</span>
                    <span v-if="row.assembleObjectType === 'ITEM'">项目</span>
                </template>
            </a-table-column>
            <a-table-column title="免检">
                <template #default="row">
                    <span :style="{ color: '#2db7f5' }" v-if="row.exemptionState === 'YES'">是</span>
                    <span :style="{ color: '#f5222d' }" v-if="row.exemptionState === 'NO'">否</span>
                </template>
            </a-table-column>
            <a-table-column title="状态">
                <template #default="row">
                    <span :style="{ color: '#2db7f5' }" v-if="row.assembleState === 'VALID'">有效</span>
                    <span :style="{ color: '#f5222d' }" v-if="row.assembleState === 'INVALID'">无效</span>
                </template>
            </a-table-column>
            <a-table-column title="描述" data-index="assembleDesc" />
        </Table>
    </Wraper>
</template>

<script>
import Table from '@/components/table/table.vue';
import Wraper from '@/components/table/wraper.vue';
import { getRouteAssemblesListApi } from '@/api';
import Add from './add.vue';

export default {
    components: { Wraper, Table, Add },
    props: { hidden: Function, row: Object },
    data() {
        return {
            buttons: [
                { label: '新增', click: () => {} },
                { label: '失效', click: () => {} },
                { label: '生效', click: () => {} },
                { label: '置顶', click: () => {} },
                { label: '排序', click: () => {} },
                {
                    type: 'confirm',
                    url: (row) => `/ranger/inspection/api/v1/routes/${row.routeId}`,
                    after: this.refresh,
                },
            ],
        };
    },
    mounted() {},
    methods: {
        getDefaultQuery() {
            const { routeId, regionId } = this.row;
            return {
                parentAssembleObjectType: 'REGION',
                parentAssembleObjectId: regionId,
                routeId,
            };
        },
        formatData(list) {
            return list.records.map((i) => {
                return {
                    ...i,
                    children: [],
                };
            });
        },
        async expand(expanded, record) {
            const { routeId, assembleObjectType, assembleObjectId, assembleState, exemptionState } = record;
            const params = {
                routeId,
                parentAssembleObjectType: assembleObjectType,
                parentAssembleObjectId: assembleObjectId,
                assembleObjectType: assembleObjectType === 'PLACE' ? 'UNIT' : 'ITEM',
            };
            const resp = await getRouteAssemblesListApi(params);
            const newData = resp.map((i) => {
                return {
                    ...i,
                    children: assembleObjectType === 'PLACE' ? [] : undefined,
                    assembleState: assembleState === 'INVALID' ? assembleState : i.assembleState,
                    exemptionState: exemptionState === 'NO' ? exemptionState : i.exemptionState,
                };
            });
            record.children = newData;
            this.$refs.assembleTable?.refreshView();
        },
    },
};
</script>
