Merge remote-tracking branch 'origin/developer' into developer

This commit is contained in:
吴红兵
2026-02-28 11:25:53 +08:00
3 changed files with 501 additions and 476 deletions

View File

@@ -80,7 +80,6 @@
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.header-right {

View File

@@ -13,16 +13,21 @@
<el-form-item class="role-form-item">
<el-radio-group v-model="radio" class="role-radio-group" @change="handleChangeRole">
<template v-for="(roles, groupName) in allRoleGroups" :key="groupName">
<el-card class="role-group-card" shadow="hover">
<template #header>
<span class="group-name">{{ groupName }}</span>
</template>
<div class="role-group">
<el-divider>{{ groupName }}</el-divider>
<el-radio-button
v-for="item in roles"
:key="item.roleCode"
:label="item.roleCode"
size="small"
>
{{ item.roleName }}
</el-radio-button>
</div>
</el-card>
</template>
</el-radio-group>
</el-form-item>
@@ -121,31 +126,12 @@ defineExpose({
flex-wrap: wrap;
}
}
.role-group {
width: 100%;
flex: 0 0 100%;
margin-bottom: 12px;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px 12px;
&:last-child {
margin-bottom: 0;
}
}
.group-name {
font-size: 13px;
color: var(--el-text-color-secondary);
margin-bottom: 6px;
}
.role-radio-group {
display: flex;
flex-wrap: wrap;
gap: 8px;
align-items: flex-start;
flex-direction: column;
gap: 6px;
width: 100%;
/* 每个分组内按钮可换行,分组之间不重叠 */
:deep(.el-radio-button) {
margin: 0;
}
@@ -153,9 +139,35 @@ defineExpose({
border-radius: 6px !important;
border: 1px solid var(--el-border-color) !important;
margin-left: 0 !important;
line-height: 1.3;
}
:deep(.el-radio-button.is-active .el-radio-button__inner) {
border-color: var(--el-color-primary) !important;
}
}
.role-group-card {
width: 100%;
flex: 0 0 auto;
:deep(.el-card__header) {
padding: 6px 12px;
font-size: 14px;
font-weight: 600;
color: var(--el-text-color-primary);
}
:deep(.el-card__body) {
padding: 6px 12px 8px;
}
}
.role-group {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 4px 8px;
}
.group-name {
font-size: 14px;
font-weight: 600;
color: var(--el-text-color-primary);
}
</style>

View File

@@ -1,32 +1,77 @@
<template>
<div class="titlerelation-page">
<div class="page-cards">
<div class="page-wrapper">
<!-- 内容区最上搜索其次标题+按钮再下方表格 -->
<div class="content-block">
<!-- 最上搜索区 -->
<div v-show="showSearch" class="content-block__filter">
<search-form :model="search" ref="searchFormRef" @keyup-enter="handleFilter">
<!-- 筛选卡片 -->
<el-card v-show="showSearch" class="search-card" shadow="never">
<search-form
:model="search"
ref="searchFormRef"
:show-filter-title="false"
@keyup-enter="handleFilter"
>
<template #default="{ visible }">
<template v-if="visible">
<el-form-item label="姓名" prop="realName">
<el-input v-model="search.realName" clearable placeholder="请输入姓名" class="filter-input" />
<el-input
v-model="search.realName"
clearable
placeholder="请输入姓名"
class="filter-input"
/>
</el-form-item>
<el-form-item label="工号" prop="teacherNo">
<el-input v-model="search.teacherNo" clearable placeholder="请输入工号" class="filter-input" />
<el-input
v-model="search.teacherNo"
clearable
placeholder="请输入工号"
class="filter-input"
/>
</el-form-item>
<el-form-item label="审核状态" prop="state">
<el-select v-model="search.state" clearable placeholder="请选择审核状态" class="filter-select">
<el-option v-for="item in professionalState" :key="item.value" :label="item.label" :value="item.value" />
<el-select
v-model="search.state"
clearable
placeholder="请选择审核状态"
class="filter-select"
>
<el-option
v-for="item in professionalState"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="职称" prop="professionalTitleConfigId">
<el-select v-model="search.professionalTitleConfigId" clearable filterable placeholder="请选择职称" class="filter-select">
<el-option v-for="item in professionalTitleList" :key="item.id" :label="item.professionalTitle" :value="item.id" />
<el-select
v-model="search.professionalTitleConfigId"
clearable
filterable
placeholder="请选择职称"
class="filter-select"
>
<el-option
v-for="item in professionalTitleList"
:key="item.id"
:label="item.professionalTitle"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="专业技术职务" prop="majorStation">
<el-select v-model="search.majorStation" clearable filterable placeholder="请选择专业技术职务" class="filter-select">
<el-option v-for="item in majorStationList" :key="item.id" :label="item.majorStationName" :value="item.id" />
<el-select
v-model="search.majorStation"
clearable
filterable
placeholder="请选择专业技术职务"
class="filter-select"
>
<el-option
v-for="item in majorStationList"
:key="item.id"
:label="item.majorStationName"
:value="item.id"
/>
</el-select>
</el-form-item>
</template>
@@ -38,15 +83,24 @@
</el-form-item>
</template>
</search-form>
</div>
</el-card>
<!-- 其次左侧按钮右侧 RightToolbar -->
<div class="content-block__header">
<!-- 列表内容卡片 -->
<el-card class="content-card" shadow="never">
<template #header>
<div class="card-header">
<span class="card-title">
<el-icon class="title-icon"><Medal /></el-icon>
职称关系
</span>
<div class="header-actions">
<div class="action-group">
<el-button v-if="hasAuth('professional_professionaltitlerelation_add')" type="primary" icon="FolderAdd" @click="handleAdd"
>新增</el-button
>
<el-button
v-if="hasAuth('professional_professionaltitlerelation_add')"
type="primary"
icon="FolderAdd"
@click="handleAdd"
>新增</el-button>
<el-button
v-if="hasAuth('professional_teacherbase_export')"
type="warning"
@@ -54,25 +108,19 @@
icon="Download"
@click="handleDownLoadWord"
:loading="exportLoading"
>导出信息</el-button
>
<el-button
v-auth="'professional_teacherinfo_import'"
type="primary"
plain
icon="UploadFilled"
:loading="exportLoading"
@click="handleImportDialog"
>导入信息
</el-button>
>导出信息</el-button>
</div>
<div class="header-right">
<RightToolbar v-model:showSearch="showSearch" @queryTable="getDataList" />
<RightToolbar
v-model:showSearch="showSearch"
@queryTable="getDataList"
/>
</div>
</div>
</div>
</template>
<!-- 再下方表格 -->
<!-- 表格 -->
<el-table
ref="tableRef"
:data="state.dataList"
@@ -117,8 +165,7 @@
type="primary"
link
icon="Document"
@click="handlePreview(scope.row.srcList)"
>查看
@click="handlePreview(scope.row.srcList)">查看
</el-button>
<span v-else class="empty-text">-</span>
</template>
@@ -134,43 +181,42 @@
type="primary"
link
icon="edit-pen"
@click="handleEdit(scope.row)"
>修改
@click="handleEdit(scope.row)">修改
</el-button>
<el-button
v-if="hasAuth('professional_professionaltitlerelation_exam') && scope.row.canExam"
type="success"
link
icon="CircleCheck"
@click="changeState(scope.row, 1)"
>通过
@click="changeState(scope.row, 1)">通过
</el-button>
<el-button
v-if="hasAuth('professional_professionaltitlerelation_exam') && scope.row.canDeptExam"
type="success"
link
icon="CircleCheck"
@click="changeState(scope.row, 1)"
>部门通过
@click="changeState(scope.row, 1)">部门通过
</el-button>
<el-button
v-if="hasAuth('professional_professionaltitlerelation_exam') && scope.row.canBack"
type="danger"
link
icon="CircleClose"
@click="changeState(scope.row, -2)"
>驳回
@click="changeState(scope.row, -2)">驳回
</el-button>
<el-button
v-if="hasAuth('professional_professionaltitlerelation_exam') && scope.row.canDeptBack"
type="danger"
link
icon="CircleClose"
@click="changeState(scope.row, -2)"
>部门驳回
@click="changeState(scope.row, -2)">部门驳回
</el-button>
<el-button v-if="hasAuth('professional_professionaltitlerelation_del')" type="danger" link icon="delete" @click="handleDel(scope.row)"
>删除
<el-button
v-if="hasAuth('professional_professionaltitlerelation_del')"
type="danger"
link
icon="delete"
@click="handleDel(scope.row)">删除
</el-button>
</div>
</template>
@@ -178,61 +224,72 @@
</el-table>
<!-- 分页 -->
<pagination v-bind="state.pagination" @current-change="currentChangeHandle" @size-change="sizeChangeHandle" />
</div>
<pagination
v-bind="state.pagination"
@current-change="currentChangeHandle"
@size-change="sizeChangeHandle"
/>
</el-card>
</div>
<!-- 材料预览图片直接显示PDF 在组件内部 dialog 中显示 -->
<preview-file v-for="src in imgUrl" :key="src.title" :authSrc="src.url" dialog-title="职称材料" />
<preview-file
v-for="src in imgUrl"
:key="src.title"
:authSrc="src.url"
dialog-title="职称材料"
/>
<!-- 子组件 -->
<MultiDialog ref="multiDialogRef" @getList="getDataList" :page="state.pagination" :nowRow="null" />
<DataForm ref="dataFormRef" @refreshData="handleFilter" />
<ProfessionalBackResaon ref="backReasonRef" @refreshData="handleFilter" />
<import-teacher-other-info ref="importTeacherOtherInfoRef" @refreshData="handleFilter"></import-teacher-other-info>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted, nextTick } from 'vue';
import { BasicTableProps, useTable } from '/@/hooks/table';
import { useAuth } from '/@/hooks/auth';
import { useMessage } from '/@/hooks/message';
import { useMessageBox } from '/@/hooks/message';
import { useDict } from '/@/hooks/dict';
import { ref, reactive, onMounted, nextTick } from 'vue'
import { BasicTableProps, useTable } from '/@/hooks/table'
import { useAuth } from '/@/hooks/auth'
import { useMessage } from '/@/hooks/message'
import { useMessageBox } from '/@/hooks/message'
import { useDict } from '/@/hooks/dict'
// 接口
import { fetchList, examObj, delObj } from '/@/api/professional/professionaluser/professionaltitlerelation';
import { getProfessionalTitleList } from '/@/api/professional/rsbase/professionaltitlelevelconfig';
import { getMajorStationList } from '/@/api/professional/rsbase/professionalmajorstation';
import {
fetchList,
examObj,
delObj
} from '/@/api/professional/professionaluser/professionaltitlerelation'
import { getProfessionalTitleList } from '/@/api/professional/rsbase/professionaltitlelevelconfig'
import { getMajorStationList } from '/@/api/professional/rsbase/professionalmajorstation'
import { defineAsyncComponent } from 'vue'
import { Medal } from '@element-plus/icons-vue'
import { makeExportTeacherInfoByTypeTask } from '/@/api/professional/professionalfile';
import { defineAsyncComponent } from 'vue';
// 子组件
const TeacherNameNo = defineAsyncComponent(() => import('/@/components/TeacherNameNo/index.vue'));
const AuditState = defineAsyncComponent(() => import('/@/components/AuditState/index.vue'));
const MultiDialog = defineAsyncComponent(() => import('/@/views/professional/teacherbase/multiDialog.vue'));
const DataForm = defineAsyncComponent(() => import('./form.vue'));
const ProfessionalBackResaon = defineAsyncComponent(() => import('/@/views/professional/common/professional-back-resaon.vue'));
const previewFile = defineAsyncComponent(() => import('/@/components/tools/preview-file.vue'));
const ImportTeacherOtherInfo = defineAsyncComponent(() => import('/@/views/professional/common/import-teacher-other-info.vue'));
const TeacherNameNo = defineAsyncComponent(() => import('/@/components/TeacherNameNo/index.vue'))
const AuditState = defineAsyncComponent(() => import('/@/components/AuditState/index.vue'))
const MultiDialog = defineAsyncComponent(() => import('/@/views/professional/teacherbase/multiDialog.vue'))
const DataForm = defineAsyncComponent(() => import('./form.vue'))
const ProfessionalBackResaon = defineAsyncComponent(() => import('/@/views/professional/common/professional-back-resaon.vue'))
const previewFile = defineAsyncComponent(() => import('/@/components/tools/preview-file.vue'))
// 无权限即无节点:使用 useAuth + v-if
const { hasAuth } = useAuth();
const { hasAuth } = useAuth()
// 消息提示 hooks
const message = useMessage();
const messageBox = useMessageBox();
const message = useMessage()
const messageBox = useMessageBox()
// 字典数据
const { professional_state: professionalState } = useDict('professional_state');
const { professional_state: professionalState } = useDict('professional_state')
// 表格引用
const tableRef = ref();
const searchFormRef = ref();
const multiDialogRef = ref();
const dataFormRef = ref();
const backReasonRef = ref();
const showSearch = ref(true); // 方案 F默认收起筛选首屏仅一张大卡片
const tableRef = ref()
const searchFormRef = ref()
const multiDialogRef = ref()
const dataFormRef = ref()
const backReasonRef = ref()
const showSearch = ref(true) // 方案 F默认收起筛选首屏仅一张大卡片
// 搜索表单数据
const search = reactive({
@@ -240,85 +297,82 @@ const search = reactive({
teacherNo: '',
realName: '',
professionalTitleConfigId: '',
majorStation: '',
});
majorStation: ''
})
// 材料预览
const imgUrl = ref<Array<{ title: string; url: string }>>([]);
const imgUrl = ref<Array<{ title: string; url: string }>>([])
// 导出加载状态
const exportLoading = ref(false);
const exportLoading = ref(false)
// 职称和专业技术职务列表
const professionalTitleList = ref<any[]>([]);
const majorStationList = ref<any[]>([]);
const professionalTitleList = ref<any[]>([])
const majorStationList = ref<any[]>([])
// 配置 useTable
const state: BasicTableProps = reactive<BasicTableProps>({
pageList: async (params: any) => {
const response = await fetchList(params);
const records = response.data.records || [];
const response = await fetchList(params)
const records = response.data.records || []
// 处理证明材料列表
records.forEach((v: any) => {
if (v.evidence != null) {
v.srcList = [v.evidence];
v.srcList = [v.evidence]
} else {
v.srcList = [];
v.srcList = []
}
});
})
return {
data: {
records,
total: response.data.total || 0,
total: response.data.total || 0
}
}
},
};
},
queryForm: search,
});
queryForm: search
})
const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state);
const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state)
// 预览材料
const handlePreview = (list: string[]) => {
imgUrl.value = [];
imgUrl.value = []
nextTick(() => {
list.forEach((v) => {
list.forEach(v => {
imgUrl.value.push({
title: '',
url: v,
});
});
});
};
url: v
})
})
})
}
// 审核状态变更
const changeState = (row: any, val: number) => {
if (val === 1) {
const str = '通过';
messageBox
.confirm(`是否确认${str}${row.realName}的申请`)
.then(async () => {
const str = '通过'
messageBox.confirm(`是否确认${str}${row.realName}的申请`).then(async () => {
try {
await examObj({
id: row.id,
state: val,
});
message.success('操作成功');
getDataList();
state: val
})
message.success('操作成功')
getDataList()
} catch (error: any) {
// 处理业务错误
}
})
.catch(() => {});
}).catch(() => {})
} else if (val === -2) {
backReasonRef.value?.init(row, 'title');
backReasonRef.value?.init(row, 'title')
}
};
}
// 查询
const handleFilter = () => {
getDataList();
};
getDataList()
}
// 重置查询
const resetQuery = () => {
@@ -327,41 +381,38 @@ const resetQuery = () => {
teacherNo: '',
realName: '',
professionalTitleConfigId: '',
majorStation: '',
});
getDataList();
};
majorStation: ''
})
getDataList()
}
// 打开新增窗口
const handleAdd = () => {
dataFormRef.value?.openDialog();
};
dataFormRef.value?.openDialog()
}
// 打开编辑窗口
const handleEdit = (row: any) => {
dataFormRef.value?.openDialog(row);
};
dataFormRef.value?.openDialog(row)
}
// 删除
const handleDel = (row: any) => {
messageBox
.confirm('是否确认删除该条记录')
.then(async () => {
messageBox.confirm('是否确认删除该条记录').then(async () => {
try {
await delObj(row.id);
message.success('删除成功');
await delObj(row.id)
message.success('删除成功')
// 如果当前页只剩一条数据,且不是第一页,则跳转到上一页
if (state.pagination && state.dataList && state.dataList.length === 1 && state.pagination.current && state.pagination.current > 1) {
state.pagination.current = state.pagination.current - 1;
state.pagination.current = state.pagination.current - 1
}
getDataList();
getDataList()
} catch (error: any) {
// 处理业务错误
message.error(error.msg);
message.error(error.msg)
}
})
.catch(() => {});
};
}).catch(() => {})
}
// 导出
const handleDownLoadWord = async () => {
@@ -373,62 +424,47 @@ const handleDownLoadWord = async () => {
setTimeout(() => {
exportLoading.value = false;
}, 3000); // 5分钟后自动关闭
};
}
// 获取职称名称
const getProfessionalTitleName = (id: string | number) => {
const item = professionalTitleList.value.find((item: any) => item.id === id);
return item ? item.professionalTitle : '-';
};
const item = professionalTitleList.value.find((item: any) => item.id === id)
return item ? item.professionalTitle : '-'
}
// 获取专业技术职务名称
const getMajorStationName = (id: string | number) => {
const item = majorStationList.value.find((item: any) => item.id === id);
return item ? item.majorStationName : '-';
};
const item = majorStationList.value.find((item: any) => item.id === id)
return item ? item.majorStationName : '-'
}
// 加载字典数据
const loadDictData = async () => {
try {
// 加载职称列表
const titleRes = await getProfessionalTitleList();
const titleRes = await getProfessionalTitleList()
if (titleRes && titleRes.data) {
professionalTitleList.value = titleRes.data;
professionalTitleList.value = titleRes.data
}
// 加载专业技术职务列表
const majorRes = await getMajorStationList();
const majorRes = await getMajorStationList()
if (majorRes && majorRes.data) {
majorStationList.value = majorRes.data;
majorStationList.value = majorRes.data
}
} catch (error) {
// Failed to load dict data
}
};
const importTeacherOtherInfoRef = ref();
const handleImportDialog = () => {
importTeacherOtherInfoRef.value?.init('titleRelation');
};
}
// 初始化:仅加载下拉字典,表格数据由 useTable 在 createdIsNeed: true 时自动请求
onMounted(async () => {
await loadDictData();
});
await loadDictData()
})
</script>
<style lang="scss" scoped>
.titlerelation-page {
padding: 12px;
min-height: 100%;
background: var(--el-bg-color-page, #f5f6f8);
}
.page-wrapper {
display: flex;
flex-direction: column;
gap: 0;
}
@import '/@/assets/styles/page-cards.scss';
/* 筛选:内容区最上方,无上外边距;与下方标题栏间距用 margin-bottom */
.content-block__filter {
@@ -476,29 +512,7 @@ onMounted(async () => {
}
}
.header-actions {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 12px;
width: 100%;
}
/* 按钮间距按规范 10px与 RightToolbar 区隔 */
.action-group {
display: flex;
align-items: center;
flex-wrap: wrap;
}
.header-right {
display: flex;
align-items: center;
gap: 8px;
padding-left: 12px;
// border-left: 1px solid var(--el-border-color-lighter);
}
/* header-actions / action-group / header-right 的基础布局来自 page-cards.scss */
/* 表格 */
.titlerelation-table {