<!--
  -    Copyright (c) 2018-2025, cyweb All rights reserved.
  -
  - Redistribution and use in source and binary forms, with or without
  - modification, are permitted provided that the following conditions are met:
  -
  - Redistributions of source code must retain the above copyright notice,
  - this list of conditions and the following disclaimer.
  - Redistributions in binary form must reproduce the above copyright
  - notice, this list of conditions and the following disclaimer in the
  - documentation and/or other materials provided with the distribution.
  - Neither the name of the pig4cloud.com developer nor the names of its
  - contributors may be used to endorse or promote products derived from
  - this software without specific prior written permission.
  -
  -->

<template>
	<div class="layout-padding">
		<div class="layout-padding-auto layout-padding-view">
			<!-- 搜索表单 -->
			<el-form :model="queryForm" inline ref="searchFormRef">
				<el-form-item label="招生计划" prop="groupId">
					<el-select v-model="queryForm.groupId" filterable clearable placeholder="请选择招生计划">
						<el-option v-for="item in planList" :key="item.id" :label="item.groupName" :value="item.id" />
					</el-select>
				</el-form-item>
				<el-form-item label="学院" prop="deptCode">
					<el-select v-model="queryForm.deptCode" filterable clearable placeholder="请选择">
						<el-option v-for="item in deptList" :key="item.deptCode" :label="item.deptName" :value="item.deptCode" />
					</el-select>
				</el-form-item>
				<el-form-item label="专业序号" prop="majorCode">
					<el-input v-model="queryForm.majorCode" placeholder="专业序号" />
				</el-form-item>
				<el-form-item label="专业名称" prop="majorName">
					<el-input v-model="queryForm.majorName" placeholder="专业名称" />
				</el-form-item>
				<el-form-item label="学制" prop="learnYear">
					<el-input v-model="queryForm.learnYear" placeholder="学制" />
				</el-form-item>
				<el-form-item>
					<el-button type="primary" icon="Search" @click="getDataList">查询</el-button>
					<el-button plain icon="Refresh" class="ml10" @click="resetQuery">重置</el-button>
				</el-form-item>
			</el-form>

			<!-- 操作按钮 -->
			<div class="mb15">
				<el-button v-if="hasAuth('recruit_recruitplanmajor_add')" type="primary" icon="FolderAdd" @click="addOrUpdateHandle"> 新 增 </el-button>

				<el-button
					v-auth="'recruit_major_import'"
					type="primary"
					plain
					icon="UploadFilled"
					:loading="exportLoading"
					@click="handleImportDialog"
					>导入信息
				</el-button>
			</div>

			<!-- 表格 -->
			<el-table
				ref="tableRef"
				:data="state.dataList"
				v-loading="state.loading"
				border
				stripe
				row-key="id"
				:cell-style="tableStyle.cellStyle"
				:header-cell-style="tableStyle.headerCellStyle"
			>
				<el-table-column type="index" label="序号" width="60" align="center" />
				<el-table-column prop="groupId" label="招生计划名称" align="center" min-width="140" show-overflow-tooltip>
					<template #default="scope">
						{{ getPlanName(scope.row.groupId) }}
					</template>
				</el-table-column>
				<el-table-column prop="majorCode" label="专业序号" align="center" show-overflow-tooltip />
				<el-table-column prop="majorName" label="专业名称" align="center" show-overflow-tooltip />
				<el-table-column prop="majorName" label="规范专业名称" align="center" show-overflow-tooltip >
          <template #default="scope">
            <span v-if="scope.row.standardMajorName">
                  {{ scope.row.standardMajorName+"-"+scope.row.standardMajorTwoName }}
            </span>
            <span v-else>
            </span>
          </template>
        </el-table-column>
				<el-table-column prop="deptCode" label="学院" align="center" show-overflow-tooltip>
					<template #default="scope">
						{{ getDeptName(scope.row.deptCode) }}
					</template>
				</el-table-column>
				<el-table-column prop="learnYear" label="学制" align="center" width="80" show-overflow-tooltip />
				<el-table-column prop="majorLevel" label="层次" align="center" show-overflow-tooltip />
				<el-table-column prop="isOrder" label="订单班｜中德班｜联院班" align="center" width="180" show-overflow-tooltip>
					<template #default="scope">
						{{ getYesNoLabel(scope.row.isOrder) }}｜{{ getYesNoLabel(scope.row.isZd) }}｜{{ getYesNoLabel(scope.row.isUnion) }}
					</template>
				</el-table-column>

				<el-table-column prop="sm" label="色盲不可录" align="center" width="120">
					<template #default="scope">
						<el-switch v-model="scope.row.sm" active-text="是" inactive-text="否" active-value="1" inactive-value="0" @change="changeSm(scope.row)" />
					</template>
				</el-table-column>
				<el-table-column prop="stuworkMajorCode" label="正式专业代码" align="center" show-overflow-tooltip>
					<template #default="scope">
						{{ getMajorCodeName(scope.row.stuworkMajorCode) }}
					</template>
				</el-table-column>
				<!-- <el-table-column prop="cityPlanId" label="市平台招生计划" align="center" show-overflow-tooltip>
          <template #default="scope">
            {{ scope.row.cityPlanName != undefined ? (scope.row.cityPlanName + '|' + scope.row.cityPlanYear) : '' }}
          </template>
        </el-table-column> -->
				<!-- <el-table-column prop="sort" label="排序" align="center" show-overflow-tooltip /> -->
				<el-table-column label="操作" width="150" align="center" fixed="right">
					<template #default="scope">
						<el-button type="primary" link icon="EditPen" @click="addOrUpdateHandle(scope.row)"> 修改 </el-button>
						<el-button v-if="hasAuth('recruit_recruitplanmajor_del')" type="danger" link icon="Delete" @click="deleteHandle(scope.row.id)">
							删除
						</el-button>
					</template>
				</el-table-column>
			</el-table>

			<!-- 分页 -->
			<pagination v-bind="state.pagination" @current-change="currentChangeHandle" @size-change="sizeChangeHandle" />

			<!-- 弹窗, 新增 / 修改 -->
			<table-form ref="addOrUpdateRef" @refreshDataList="getDataList" />

      <import-recruit-info ref="ImportRecruitInfoRef"  @refreshDataList="getDataList"></import-recruit-info>
		</div>
	</div>
</template>

<script setup lang="ts" name="recruitplanmajor">
import { ref, reactive, onMounted, nextTick, defineAsyncComponent } from 'vue';
import { useAuth } from '/@/hooks/auth';
import { BasicTableProps, useTable } from '/@/hooks/table';
import { useMessage, useMessageBox } from '/@/hooks/message';
import { useDict } from '/@/hooks/dict';
import { getList } from '/@/api/recruit/recruitstudentplangroup';
import { fetchList, delObj, editQuickField } from '/@/api/recruit/recruitstudentplan';
import { getDeptList } from '/@/api/basic/basicclass';
import { getMajorNameList } from '/@/api/basic/major';

const TableForm = defineAsyncComponent(() => import('./detaiform.vue'));
const ImportRecruitInfo = defineAsyncComponent(() => import('/@/views/recruit/common/import-recruit-info.vue'));
const ImportRecruitInfoRef=ref<any>();
const { hasAuth } = useAuth();
// 消息提示 hooks
const message = useMessage();
const messageBox = useMessageBox();

// 表格引用
const tableRef = ref();
const searchFormRef = ref();
const addOrUpdateRef = ref();

// 字典数据
const { yes_no_type } = useDict('yes_no_type');

// 数据
const planList = ref<any[]>([]);
const deptList = ref<any[]>([]);
const offcialZydmList = ref<any[]>([]);

// 查询表单
const queryForm = reactive({
	groupId: '',
	deptCode: '',
	majorCode: '',
	majorName: '',
	learnYear: '',
});

// 获取计划名称
const getPlanName = (groupId: string) => {
	const item = planList.value.find((item) => item.id === groupId);
	return item ? item.groupName : '';
};

// 获取学院名称
const getDeptName = (deptCode: string) => {
	const item = deptList.value.find((item) => item.deptCode === deptCode);
	return item ? item.deptName : '';
};

// 获取是/否标签
const getYesNoLabel = (value: string) => {
	const item = yes_no_type.value.find((item: any) => item.value === value);
	return item ? item.label : '';
};

// 获取专业代码名称
const getMajorCodeName = (majorCode: string) => {
	const item = offcialZydmList.value.find((item) => item.majorCode === majorCode);
	return item ? item.majorCodeAndName : '';
};

// 表格状态
const state: BasicTableProps = reactive<BasicTableProps>({
	queryForm: queryForm,
	pageList: async (params: any) => {
		const response = await fetchList(params);
		return {
			data: {
				records: response.data.records,
				total: response.data.total,
			},
		};
	},
	createdIsNeed: false,
});

// 使用 table hook
const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state);

// 初始化
const init = async () => {
	try {
		// 查询二级学院信息
		const deptData = await getDeptList();
		deptList.value = deptData.data || [];

		// 获取招生计划列表
		const planData = await getList();
		planList.value = planData.data || [];
		if (planList.value.length > 0) {
			queryForm.groupId = planList.value[0].id;
		}

		// 获取专业名称列表
		const majorData = await getMajorNameList();
		offcialZydmList.value = majorData.data || [];

		getDataList();
	} catch (error) {
		console.log(error);
	}
};

// 修改开关
const changeSm = async (row: any) => {
	try {
		let parmas = { id: row.id, sm: row.sm };
		await editQuickField(parmas);
		message.success('修改成功');
	} catch (error: any) {
		console.log(error);
	}
};

// 新增 / 修改
const addOrUpdateHandle = (row?: any) => {
	nextTick(() => {
		addOrUpdateRef.value?.init(row.id || null);
	});
};

// 删除
const deleteHandle = async (id: string) => {
	try {
		await messageBox.confirm('是否确认删除本条数据？请谨慎操作');
		await delObj(id);
		message.success('删除成功');
		getDataList();
	} catch {
		// 用户取消
	}
};

// 重置查询
const resetQuery = () => {
	searchFormRef.value?.resetFields();
	queryForm.groupId = '';
	queryForm.deptCode = '';
	queryForm.majorCode = '';
	queryForm.majorName = '';
	queryForm.learnYear = '';
	if (planList.value.length > 0) {
		queryForm.groupId = planList.value[0].id;
	}
	getDataList();
};

const exportLoading = ref(false);

const handleImportDialog = () => {
  ImportRecruitInfoRef.value?.init("R10001");
};

onMounted(() => {
	init();
});
</script>

<style lang="scss" scoped></style>
