<template>
    <Wraper :hidden="hidden" noFooter>
        <Table
            :url="tableUrl"
            rowKey="staffId"
            noPadding
            :addBtn="addBtn"
            :buttons="buttons"
            :width="400"
            ref="table"
        >
            <template #drawer="drawer">
                <AddMember v-bind="drawer" :specialityId="row.specialityId" />
            </template>

            <a-table-column title="部门" data-index="orgName" />
            <a-table-column title="用户姓名" data-index="staffName" />
        </Table>
    </Wraper>
</template>

<script>
import Wraper from '@/components/table/wraper.vue';
import Table from '@/components/table/table.vue';
import AddMember from './add_member.vue';

export default {
    components: { Wraper, Table, AddMember },
    props: {
        hidden: Function,
        row: Object,
    },
    data() {
        return {
            addBtn: {
                text: '添加',
                title: '添加',
            },
            buttons: [
                {
                    type: 'confirm',
                    url: (row) => ({
                        url: `/ranger/inspection/api/v1/specialities/staffs`,
                        method: 'del',
                        data: { staffBindIds: [row.staffBindId] },
                    }),
                    after: this.refreshTable,
                },
            ],
        };
    },
    computed: {
        tableUrl() {
            return `/ranger/inspection/api/v1/specialities/staffs?specialityId=${this.row.specialityId}`;
        },
    },
    methods: {
        refreshTable() {
            this.$refs['table'].getData();
        },
    },
};
</script>
