<template>
	<el-dialog title="履历详情" v-model="visible" :close-on-click-modal="false" draggable width="1200px">
		<el-table
			:data="detailList"
			v-loading="loading"
			border
			:cell-style="{ textAlign: 'center' }"
			:header-cell-style="{ textAlign: 'center', background: 'var(--el-table-row-hover-bg-color)' }"
		>
			<el-table-column type="index" label="序号" width="60" align="center" />
			<el-table-column prop="teacherNoVal" label="教师工号" show-overflow-tooltip />
			<el-table-column prop="telPhone" label="联系方式" show-overflow-tooltip />
			<el-table-column prop="className" label="班级名称" show-overflow-tooltip />
			<el-table-column prop="beginTime" label="开始时间" show-overflow-tooltip width="120" />
			<el-table-column prop="endTime" label="结束时间" show-overflow-tooltip width="120" />
			<el-table-column prop="resumeRemark" label="履历" show-overflow-tooltip />
			<el-table-column prop="remarks" label="备注" show-overflow-tooltip />
			<el-table-column label="操作" width="150" align="center" fixed="right">
				<template #default="scope">
					<el-button icon="Edit" text type="primary" @click="handleEdit(scope.row)"> 编辑 </el-button>
					<el-button icon="Delete" text type="danger" @click="handleDelete(scope.row)"> 删除 </el-button>
				</template>
			</el-table-column>
		</el-table>
		<template #footer>
			<span class="dialog-footer">
				<el-button type="primary" icon="Plus" @click="handleAdd">新 增</el-button>
				<el-button @click="visible = false">关 闭</el-button>
			</span>
		</template>
	</el-dialog>

	<!-- 编辑表单对话框 -->
	<FormDialog ref="formDialogRef" @refresh="handleRefresh" />
</template>

<script setup lang="ts" name="ClassMasterResumeDetail">
import { ref, defineAsyncComponent } from 'vue';
import { fetchDetailList, delObjs } from '/@/api/stuwork/classmasterresume';
import { useMessage, useMessageBox } from '/@/hooks/message';

// 引入编辑表单组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));

// 定义变量内容
const visible = ref(false);
const loading = ref(false);
const detailList = ref([]);
const teacherNo = ref('');
const formDialogRef = ref();

// 打开弹窗
const openDialog = (teacherNoValue: string) => {
	visible.value = true;
	teacherNo.value = teacherNoValue;
	getDetailList();
};

// 获取详情列表
const getDetailList = () => {
	loading.value = true;
	fetchDetailList({
		teacherNo: teacherNo.value,
		current: 1,
		size: 9999,
	})
		.then((res: any) => {
			if (res.data && res.data.records) {
				detailList.value = res.data.records;
			} else if (Array.isArray(res.data)) {
				detailList.value = res.data;
			} else {
				detailList.value = [];
			}
		})
		.catch((err: any) => {
			detailList.value = [];
		})
		.finally(() => {
			loading.value = false;
		});
};

// 编辑
const handleEdit = (row: any) => {
	if (row && row.id) {
		// 直接使用表格行数据，不需要再次调用接口
		formDialogRef.value?.openDialog(row);
	}
};

// 删除
const handleDelete = async (row: any) => {
	if (!row.id) {
		useMessage().error('缺少记录ID');
		return;
	}

	try {
		await useMessageBox().confirm('确定要删除这条履历记录吗？', '提示', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			type: 'warning',
		});
	} catch {
		return;
	}

	try {
		loading.value = true;
		await delObjs([row.id]);
		useMessage().success('删除成功');
		getDetailList(); // 刷新列表
	} catch (err: any) {
		useMessage().error(err.msg || '删除失败');
	} finally {
		loading.value = false;
	}
};

// 新增
const handleAdd = () => {
	// 打开新增表单，预填充教师工号
	if (teacherNo.value) {
		formDialogRef.value?.openDialog({
			teacherNo: teacherNo.value,
		});
	} else {
		useMessage().error('缺少教师工号');
	}
};

// 刷新列表（编辑后）
const handleRefresh = () => {
	getDetailList();
};

// 暴露变量
defineExpose({
	openDialog,
});
</script>
