<template>
	<a-modal v-model:visible="showDepartmentModel" title="查看部门" @cancel="cancelModal" width="80%" :footer="null">
		<a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page"
			@page="getPage" :loading="loading">
		</a-c-table>
	</a-modal>
</template>

<script setup lang="ts">
	import { ref, onMounted, computed, defineProps, watch, defineEmits } from 'vue';
	import { GetCompanyDepartmentList } from '@/apis/models';
	import { useCommon } from '@/hooks/useCommon';
	import { cols } from '@/views/company/list/department/columns';
	let { store, commomParams } = useCommon();
	const emit = defineEmits();
	let props = defineProps(['department_record']);
	let loading = ref<Boolean>(true);

	let showDepartmentModel = computed(() => {
		return store.state.showDepartmentModel;
	})
	
	let department_record = ref<Object>({});
	watch(() => props.department_record, (newVal1) => {
		department_record.value = newVal1;
		commomParams.value.search.keyword = newVal1.full_name;
		getData()
	})

	const getData = async (val) => {
		try {
			loading.value = true;
			let res = await GetCompanyDepartmentList(commomParams.value.search);
			loading.value = false;
			commomParams.value.table.data = res.data.rows;
			commomParams.value.table.columns = cols;
			commomParams.value.page = {
				current: commomParams.value.search.page,
				pageSize: commomParams.value.search.pagesize,
				total: res.data.total,
				pageSizeOptions: ['10', '20', '30', '40'],
				hideOnSinglePage: false,
				showSizeChanger: true,
				full_name: department_record.value.full_name
			};
		} catch {
			loading.value = false;
		}
	}
	
	const getPage = (data:object) => {
		commomParams.value.search.page = data.current;
		commomParams.value.search.pagesize = data.pageSize;
		getData();
	}
	
	const cancelModal = () => {
		store.commit('getShowDepartmentModel', {
			showDepartmentModel: false
		})
	}

	
</script>

<style>
</style>