Commit a0a988c3 by wangjian

Merge remote-tracking branch 'origin/master'

parents 67cffe68 50bf5266
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryForm" ref="queryForm" size="small" :inline="true" label-width="68px"> <el-form :model="queryForm" ref="queryForm" size="small" :inline="true" label-width="92px">
<el-form-item label="获奖级别" prop="awardsLevel"> <el-form-item label="获奖级别" prop="awardsLevel">
<el-select v-model="queryForm.awardsLevel" placeholder="请选择" clearable style="width: 100%;"> <el-select v-model="queryForm.awardsLevel" placeholder="请选择" clearable style="width: 220px">
<el-option v-for="dict in dict.type.awards_level" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.awards_level" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="获奖类型"> <el-form-item label="获奖类型">
<el-select v-model="queryForm.awardsType" placeholder="请选择" clearable style="width: 100%;"> <el-select v-model="queryForm.awardsType" placeholder="请选择" clearable style="width: 220px">
<el-option v-for="dict in dict.type.awards_type" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.awards_type" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
...@@ -21,37 +21,37 @@ ...@@ -21,37 +21,37 @@
</el-form-item> </el-form-item>
<el-form-item label="主导部门"> <el-form-item label="主导部门">
<Treeselect v-model="queryForm.competentDeptId" :options="deptOptions" :show-count="true" <Treeselect v-model="queryForm.competentDeptId" :options="deptOptions" :show-count="true"
placeholder="请选择" :defaultExpandLevel=1 style="width: 208px" filterable /> placeholder="请选择" :defaultExpandLevel=1 style="width: 220px" filterable />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
<el-row :gutter="10" class="mb8">
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button> <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button> <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
</el-row> <el-button type="warning" icon="el-icon-upload2" size="mini" @click="handlePLdc">批量下载</el-button>
</el-form-item>
</el-form> </el-form>
<el-table :data="tableData" border style="width: 100%"> <el-table :data="tableData" border style="width: 100%" :cell-style="{ padding: '0px' }"
<el-table-column align="center" type="index" label="序号" width="55" /> :header-cell-style="tableHeaderStyle" :fit="true">
<el-table-column align="center" prop="competitionName" label="比赛名称" width="130" show-overflow-tooltip /> <el-table-column align="center" type="index" label="序号" width="50" />
<el-table-column align="center" prop="awardsName" label="获奖名称" /> <el-table-column align="center" prop="competitionName" label="比赛名称" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="competentDept" label="主导部门" /> <el-table-column align="center" prop="awardsName" label="获奖名称" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="awardsLevel" label="获奖级别"> <el-table-column align="center" prop="competentDept" label="主导部门" :min-width="screenWidth * 0.04" />
<el-table-column align="center" prop="awardsLevel" label="获奖级别" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.awards_level, row.awardsLevel) }}</div> <div>{{ selectDictLabel(dict.type.awards_level, row.awardsLevel) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="awardsType" label="获奖类型"> <el-table-column align="center" prop="awardsType" label="获奖类型" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.awards_type, row.awardsType) }}</div> <div>{{ selectDictLabel(dict.type.awards_type, row.awardsType) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="deptDirector" label="部门主任" width="90px" /> <el-table-column align="center" prop="deptDirector" label="部门主任" :min-width="screenWidth * 0.03" />
<el-table-column align="center" prop="organizer" label="主办单位" /> <el-table-column align="center" prop="organizer" label="主办单位" :min-width="screenWidth * 0.03" />
<el-table-column align="center" prop="awardsTime" label="获奖时间" width="100px" /> <el-table-column align="center" prop="awardsTime" label="获奖时间" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="证书图片" label="证书图片" width="120px"> <el-table-column align="center" prop="证书图片" label="证书图片" :min-width="screenWidth * 0.05">
<template slot-scope="scope"> <template slot-scope="scope">
<el-carousel :interval="4000" height="100px"> <el-carousel :interval="4000" height="100px">
<el-carousel-item v-for="(item, index) in scope.row.schoolAccessoryList" :key="index"> <el-carousel-item v-for="(item, index) in scope.row.schoolAccessoryList" :key="index">
...@@ -61,17 +61,17 @@ ...@@ -61,17 +61,17 @@
</el-carousel> </el-carousel>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="auditState" label="审核状态"> <el-table-column align="center" prop="auditState" label="审核状态" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.audit_state, row.auditState) }}</div> <div>{{ selectDictLabel(dict.type.audit_state, row.auditState) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="remark" label="公布形式" width="120" show-overflow-tooltip> <el-table-column align="center" prop="remark" label="公布形式" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.announcement, row.remark) }}</div> <div>{{ selectDictLabel(dict.type.announcement, row.remark) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="200"> <el-table-column align="center" label="操作" :min-width="screenWidth * 0.06">
<template slot-scope="scope"> <template slot-scope="scope">
<div> <div>
<div v-if="scope.row.auditState === '0' || scope.row.auditState === '3'"> <div v-if="scope.row.auditState === '0' || scope.row.auditState === '3'">
...@@ -79,9 +79,11 @@ ...@@ -79,9 +79,11 @@
<el-button @click="handleEdit(scope.row)" type="text" size="small">编辑</el-button> <el-button @click="handleEdit(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="handleLook(scope.row)" type="text" size="small">查看</el-button> <el-button @click="handleLook(scope.row)" type="text" size="small">查看</el-button>
<el-button @click="handleDelete(scope.row)" type="text" size="small">删除</el-button> <el-button @click="handleDelete(scope.row)" type="text" size="small">删除</el-button>
<el-button type="text" size="mini" @click="handlePLdcdg(scope.row)">下载</el-button>
</div> </div>
<div v-else> <div v-else>
<el-button @click="handleLook(scope.row)" type="text" size="small">查看</el-button> <el-button @click="handleLook(scope.row)" type="text" size="small">查看</el-button>
<el-button type="text" size="mini" @click="handlePLdcdg(scope.row)">下载</el-button>
</div> </div>
</div> </div>
...@@ -325,10 +327,28 @@ import '@riophae/vue-treeselect/dist/vue-treeselect.css' ...@@ -325,10 +327,28 @@ import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import picAvatar from '@/views/smartSchool/schoolManage/introduce/schoolInfo/profile/picAvatar' import picAvatar from '@/views/smartSchool/schoolManage/introduce/schoolInfo/profile/picAvatar'
export default { export default {
name: 'index', name: 'index',
components: { Treeselect, picAvatar }, components: {
Treeselect, picAvatar, // 添加表头样式计算属性
},
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
dicts: ['awards_type', 'awards_level', 'audit_state', 'announcement'], dicts: ['awards_type', 'awards_level', 'audit_state', 'announcement'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
isEdit: false, isEdit: false,
uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址 uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
queryForm: { queryForm: {
...@@ -409,7 +429,33 @@ export default { ...@@ -409,7 +429,33 @@ export default {
this.getDeptTree(); this.getDeptTree();
}, },
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
/** 导出按钮操作 */
handlePLdc() {
this.download('/school/awards/pldcfjtpGr', {
...this.queryForm
}, `获奖录入批量导出_${Date.now()}.zip`)
},
handlePLdcdg(row) {
console.log(row, 'row');
this.download('/school/awards/pldcfjtpGr', {
...this.queryForm,
id: row.id
}, `获奖录入导出_${Date.now()}.zip`);
},
handleAdd() { handleAdd() {
this.reset(); this.reset();
this.dialogTableVisible = true; this.dialogTableVisible = true;
...@@ -643,6 +689,17 @@ export default { ...@@ -643,6 +689,17 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.el-table th.el-table__cell>.cell {
padding-left: 4px;
padding-right: 4px;
}
::v-deep .el-table {
width: 100%;
height: 100%;
}
.mask { .mask {
position: fixed; position: fixed;
top: 0; top: 0;
......
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryForm" ref="queryForm" size="small" :inline="true" label-width="68px"> <el-form :model="queryForm" ref="queryForm" size="small" :inline="true" label-width="92px">
<el-form-item label="获奖级别" prop="awardsLevel"> <el-form-item label="获奖级别" prop="awardsLevel">
<el-select v-model="queryForm.awardsLevel" placeholder="请选择" clearable style="width: 100%;"> <el-select v-model="queryForm.awardsLevel" placeholder="请选择" clearable style="width: 220px">
<el-option v-for="dict in dict.type.awards_level" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.awards_level" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="获奖类型"> <el-form-item label="获奖类型">
<el-select v-model="queryForm.awardsType" placeholder="请选择" clearable style="width: 100%;"> <el-select v-model="queryForm.awardsType" placeholder="请选择" clearable style="width: 220px">
<el-option v-for="dict in dict.type.awards_type" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.awards_type" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
...@@ -20,8 +20,8 @@ ...@@ -20,8 +20,8 @@
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="主导部门"> <el-form-item label="主导部门">
<Treeselect v-model="queryForm.competentDeptId" :options="deptOptions" :show-count="true" placeholder="请选择" <Treeselect v-model="queryForm.competentDeptId" :options="deptOptions" :show-count="true"
:defaultExpandLevel=1 style="width: 208px" filterable /> placeholder="请选择" :defaultExpandLevel=1 style="width: 220px" filterable />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
...@@ -30,31 +30,30 @@ ...@@ -30,31 +30,30 @@
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:student:export']">导出 v-hasPermi="['system:student:export']">导出
</el-button> </el-button>
</el-form-item>
<el-row :gutter="10" class="mb8">
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button> <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
<el-button type="warning" icon="el-icon-upload2" size="mini" @click="handlePLdc">批量下载</el-button>
</el-row> </el-form-item>
</el-form> </el-form>
<el-table :data="tableData" border style="width: 100%"> <el-table :data="tableData" border style="width: 100%" :cell-style="{ padding: '0px' }"
<el-table-column align="center" type="index" label="序号" width="55" /> :header-cell-style="tableHeaderStyle" :fit="true">
<el-table-column align="center" prop="competitionName" label="比赛名称" width="130" show-overflow-tooltip /> <el-table-column align="center" type="index" label="序号" width="50" />
<el-table-column align="center" prop="awardsName" label="获奖名称" /> <el-table-column align="center" prop="competitionName" label="比赛名称" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="competentDept" label="主导部门" /> <el-table-column align="center" prop="awardsName" label="获奖名称" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="awardsLevel" label="获奖级别"> <el-table-column align="center" prop="competentDept" label="主导部门" :min-width="screenWidth * 0.04" />
<el-table-column align="center" prop="awardsLevel" label="获奖级别" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.awards_level, row.awardsLevel) }}</div> <div>{{ selectDictLabel(dict.type.awards_level, row.awardsLevel) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="awardsType" label="获奖类型"> <el-table-column align="center" prop="awardsType" label="获奖类型" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.awards_type, row.awardsType) }}</div> <div>{{ selectDictLabel(dict.type.awards_type, row.awardsType) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="deptDirector" label="部门主任" width="90px" /> <el-table-column align="center" prop="deptDirector" label="部门主任" :min-width="screenWidth * 0.03" />
<el-table-column align="center" prop="organizer" label="主办单位" /> <el-table-column align="center" prop="organizer" label="主办单位" :min-width="screenWidth * 0.03" />
<el-table-column align="center" prop="awardsTime" label="获奖时间" width="100px" /> <el-table-column align="center" prop="awardsTime" label="获奖时间" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="证书图片" label="证书图片" width="120px"> <el-table-column align="center" prop="证书图片" label="证书图片" :min-width="screenWidth * 0.05">
<template slot-scope="scope"> <template slot-scope="scope">
<el-carousel :interval="4000" height="100px"> <el-carousel :interval="4000" height="100px">
<el-carousel-item v-for="(item, index) in scope.row.schoolAccessoryList" :key="index"> <el-carousel-item v-for="(item, index) in scope.row.schoolAccessoryList" :key="index">
...@@ -64,31 +63,35 @@ ...@@ -64,31 +63,35 @@
</el-carousel> </el-carousel>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="auditState" label="审核状态"> <el-table-column align="center" prop="auditState" label="审核状态" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.audit_state, row.auditState) }}</div> <div>{{ selectDictLabel(dict.type.audit_state, row.auditState) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="remark" label="公布形式" width="120" show-overflow-tooltip> <el-table-column align="center" prop="remark" label="公布形式" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.announcement, row.remark) }}</div> <div>{{ selectDictLabel(dict.type.announcement, row.remark) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="150"> <el-table-column align="center" label="操作" :min-width="screenWidth * 0.05">
<template slot-scope="scope"> <template slot-scope="scope">
<div> <div>
<div> <div>
<el-button v-if="['1', '3'].includes(scope.row.auditState)" @click="handleExamine(scope.row)" <el-button v-if="['1', '3'].includes(scope.row.auditState)"
type="text" size="small">审核</el-button> @click="handleExamine(scope.row)" type="text" size="small">审核</el-button>
<el-button v-if="['1', '3'].includes(scope.row.auditState)" @click="handleEdit(scope.row)" <el-button v-if="['1', '3'].includes(scope.row.auditState)" @click="handleEdit(scope.row)"
type="text" size="small">编辑</el-button> type="text" size="small">编辑</el-button>
<el-button v-if="['1', '3'].includes(scope.row.auditState)" @click="handleDelete(scope.row)" <el-button v-if="['1', '3'].includes(scope.row.auditState)" @click="handleDelete(scope.row)"
type="text" size="small">删除</el-button> type="text" size="small">删除</el-button>
<el-button v-if="['1', '3'].includes(scope.row.auditState)" type="text" size="mini"
@click="handlePLdcdg(scope.row)">下载</el-button>
</div> </div>
<el-button v-if="scope.row.auditState === '2'" @click="handleEdit(scope.row)" type="text" <el-button v-if="scope.row.auditState === '2'" @click="handleEdit(scope.row)" type="text"
size="small">编辑</el-button> size="small">编辑</el-button>
<el-button v-if="scope.row.auditState === '2'" @click="handleDelete(scope.row)" type="text" <el-button v-if="scope.row.auditState === '2'" @click="handleDelete(scope.row)" type="text"
size="small">删除</el-button> size="small">删除</el-button>
<el-button v-if="scope.row.auditState === '2'" type="text" size="mini"
@click="handlePLdcdg(scope.row)">下载</el-button>
</div> </div>
...@@ -128,8 +131,8 @@ ...@@ -128,8 +131,8 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item label="主管部门" prop="competentDeptId"> <el-form-item label="主管部门" prop="competentDeptId">
<Treeselect v-model="form.competentDeptId" :options="deptOptions" :show-count="true" <Treeselect v-model="form.competentDeptId" :options="deptOptions" :show-count="true"
placeholder="请选择" :default-expand-level=1 :style="{ width: '100%' }" @select="deptIdAndName" placeholder="请选择" :default-expand-level=1 :style="{ width: '100%' }"
filterable /> @select="deptIdAndName" filterable />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -145,8 +148,8 @@ ...@@ -145,8 +148,8 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="获奖时间" prop="awardsTime"> <el-form-item label="获奖时间" prop="awardsTime">
<el-date-picker v-model="form.awardsTime" type="date" placeholder="选择" value-format="yyyy-MM-dd" <el-date-picker v-model="form.awardsTime" type="date" placeholder="选择"
:style="{ width: '100%' }"> value-format="yyyy-MM-dd" :style="{ width: '100%' }">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -182,9 +185,10 @@ ...@@ -182,9 +185,10 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="证书图片" prop="schoolAccessoryList"> <el-form-item label="证书图片" prop="schoolAccessoryList">
<el-upload v-loading="uploadLoading" class="avatar-uploader" multiple :action="uploadFileUrl" <el-upload v-loading="uploadLoading" class="avatar-uploader" multiple
accept="image/*" :show-file-list="false" :on-success="handleAvatarSuccess" :action="uploadFileUrl" accept="image/*" :show-file-list="false"
:before-upload="beforeAvatarUpload" :on-remove="handleRemove"> :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload"
:on-remove="handleRemove">
<div v-if="form.schoolAccessoryList.length === 0"> <div v-if="form.schoolAccessoryList.length === 0">
<i class="el-icon-plus avatar-uploader-icon"></i> <i class="el-icon-plus avatar-uploader-icon"></i>
</div> </div>
...@@ -233,8 +237,8 @@ ...@@ -233,8 +237,8 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item label="主管部门" prop="competentDeptId"> <el-form-item label="主管部门" prop="competentDeptId">
<Treeselect v-model="form.competentDeptId" :options="deptOptions" :show-count="true" <Treeselect v-model="form.competentDeptId" :options="deptOptions" :show-count="true"
placeholder="请选择" :default-expand-level=1 :style="{ width: '100%' }" @select="deptIdAndName" placeholder="请选择" :default-expand-level=1 :style="{ width: '100%' }"
:disabled="isEdit" filterable /> @select="deptIdAndName" :disabled="isEdit" filterable />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -249,8 +253,8 @@ ...@@ -249,8 +253,8 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="获奖时间" prop="awardsTime"> <el-form-item label="获奖时间" prop="awardsTime">
<el-date-picker v-model="form.awardsTime" type="date" placeholder="选择" value-format="yyyy-MM-dd" <el-date-picker v-model="form.awardsTime" type="date" placeholder="选择"
:style="{ width: '100%' }"> value-format="yyyy-MM-dd" :style="{ width: '100%' }">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -286,9 +290,10 @@ ...@@ -286,9 +290,10 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="证书图片" prop="schoolAccessoryList"> <el-form-item label="证书图片" prop="schoolAccessoryList">
<el-upload v-loading="uploadLoading" class="avatar-uploader" multiple :action="uploadFileUrl" <el-upload v-loading="uploadLoading" class="avatar-uploader" multiple
accept="image/*" :show-file-list="false" :on-success="handleAvatarSuccess" :action="uploadFileUrl" accept="image/*" :show-file-list="false"
:before-upload="beforeAvatarUpload" :on-remove="handleRemove"> :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload"
:on-remove="handleRemove">
<div v-if="form.schoolAccessoryList.length === 0"> <div v-if="form.schoolAccessoryList.length === 0">
<i class="el-icon-plus avatar-uploader-icon"></i> <i class="el-icon-plus avatar-uploader-icon"></i>
</div> </div>
...@@ -333,10 +338,27 @@ import '@riophae/vue-treeselect/dist/vue-treeselect.css' ...@@ -333,10 +338,27 @@ import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import picAvatar from '@/views/smartSchool/schoolManage/introduce/schoolInfo/profile/picAvatar' import picAvatar from '@/views/smartSchool/schoolManage/introduce/schoolInfo/profile/picAvatar'
export default { export default {
name: 'index', name: 'index',
components: { Treeselect, picAvatar }, components: {
Treeselect, picAvatar, // 添加表头样式计算属性
},
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
dicts: ['awards_type', 'awards_level', 'audit_state', 'announcement'], dicts: ['awards_type', 'awards_level', 'audit_state', 'announcement'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址 uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
queryForm: { queryForm: {
pageNum: 1, pageNum: 1,
...@@ -417,8 +439,19 @@ export default { ...@@ -417,8 +439,19 @@ export default {
this.getDeptTree(); this.getDeptTree();
}, },
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
handleAdd() { handleAdd() {
this.reset(); this.reset();
this.dialogTableVisible = true; this.dialogTableVisible = true;
...@@ -629,6 +662,20 @@ export default { ...@@ -629,6 +662,20 @@ export default {
}, `获奖管理_${Date.now()}.xlsx`) }, `获奖管理_${Date.now()}.xlsx`)
}, },
/** 导出按钮操作 */
handlePLdc() {
this.download('/school/awards/pldcfjtp', {
...this.queryForm
}, `获奖管理批量导出_${Date.now()}.zip`)
},
handlePLdcdg(row) {
console.log(row, 'row');
this.download('/school/awards/pldcfjtp', {
...this.queryForm,
id: row.id
}, `获奖管理导出_${Date.now()}.zip`);
},
//确定按钮 //确定按钮
submitForm: function () { submitForm: function () {
this.$refs['form'].validate(valid => { this.$refs['form'].validate(valid => {
...@@ -664,6 +711,18 @@ export default { ...@@ -664,6 +711,18 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.el-table th.el-table__cell>.cell {
padding-left: 4px;
padding-right: 4px;
}
::v-deep .el-table {
width: 100%;
height: 100%;
}
.mask { .mask {
position: fixed; position: fixed;
top: 0; top: 0;
......
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryForm" ref="queryForm" size="small" :inline="true" label-width="68px"> <el-form :model="queryForm" ref="queryForm" size="small" :inline="true" label-width="92px">
<el-form-item label="获奖级别" prop="awardsLevel"> <el-form-item label="获奖级别" prop="awardsLevel">
<el-select v-model="queryForm.awardsLevel" placeholder="请选择" clearable style="width: 100%;"> <el-select v-model="queryForm.awardsLevel" placeholder="请选择" clearable style="width: 220px">
<el-option v-for="dict in dict.type.awards_level" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.awards_level" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="获奖类型"> <el-form-item label="获奖类型">
<el-select v-model="queryForm.awardsType" placeholder="请选择" clearable style="width: 100%;"> <el-select v-model="queryForm.awardsType" placeholder="请选择" clearable style="width: 220px">
<el-option v-for="dict in dict.type.awards_type" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.awards_type" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
...@@ -20,35 +20,36 @@ ...@@ -20,35 +20,36 @@
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="主导部门"> <el-form-item label="主导部门">
<Treeselect v-model="queryForm.competentDeptId" :options="deptOptions" :show-count="true" placeholder="请选择" <Treeselect v-model="queryForm.competentDeptId" :options="deptOptions" :show-count="true"
:defaultExpandLevel=1 style="width: 208px" filterable /> placeholder="请选择" :defaultExpandLevel=1 style="width: 220px" filterable />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
<el-button type="warning" icon="el-icon-upload2" size="mini" @click="handlePLdc">批量下载</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-table :data="tableData" border style="width: 100%"> <el-table :data="tableData" border style="width: 100%" :cell-style="{ padding: '0px' }"
<el-table-column align="center" type="index" label="序号" width="55" /> :header-cell-style="tableHeaderStyle" :fit="true">
<el-table-column align="center" prop="competitionName" label="比赛名称" width="130" show-overflow-tooltip /> <el-table-column align="center" type="index" label="序号" width="50" />
<el-table-column align="center" prop="awardsName" label="获奖名称" /> <el-table-column align="center" prop="competitionName" label="比赛名称" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="competentDept" label="主导部门" /> <el-table-column align="center" prop="awardsName" label="获奖名称" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="awardsLevel" label="获奖级别"> <el-table-column align="center" prop="competentDept" label="主导部门" :min-width="screenWidth * 0.04" />
<el-table-column align="center" prop="awardsLevel" label="获奖级别" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.awards_level, row.awardsLevel) }}</div> <div>{{ selectDictLabel(dict.type.awards_level, row.awardsLevel) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="awardsType" label="获奖类型"> <el-table-column align="center" prop="awardsType" label="获奖类型" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.awards_type, row.awardsType) }}</div> <div>{{ selectDictLabel(dict.type.awards_type, row.awardsType) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="deptDirector" label="部门主任" width="90px" /> <el-table-column align="center" prop="deptDirector" label="部门主任" :min-width="screenWidth * 0.03" />
<el-table-column align="center" prop="organizer" label="主办单位" /> <el-table-column align="center" prop="organizer" label="主办单位" :min-width="screenWidth * 0.03" />
<el-table-column align="center" prop="awardsTime" label="获奖时间" width="100px" /> <el-table-column align="center" prop="awardsTime" label="获奖时间" :min-width="screenWidth * 0.05" />
<el-table-column align="center" prop="证书图片" label="证书图片" width="120px"> <el-table-column align="center" prop="证书图片" label="证书图片" :min-width="screenWidth * 0.05">
<template slot-scope="scope"> <template slot-scope="scope">
<el-carousel :interval="4000" height="100px"> <el-carousel :interval="4000" height="100px">
<el-carousel-item v-for="(item, index) in scope.row.schoolAccessoryList" :key="index"> <el-carousel-item v-for="(item, index) in scope.row.schoolAccessoryList" :key="index">
...@@ -58,20 +59,21 @@ ...@@ -58,20 +59,21 @@
</el-carousel> </el-carousel>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="auditState" label="审核状态"> <el-table-column align="center" prop="auditState" label="审核状态" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.audit_state, row.auditState) }}</div> <div>{{ selectDictLabel(dict.type.audit_state, row.auditState) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="remark" label="公布形式" width="120" show-overflow-tooltip> <el-table-column align="center" prop="remark" label="公布形式" :min-width="screenWidth * 0.03">
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.announcement, row.remark) }}</div> <div>{{ selectDictLabel(dict.type.announcement, row.remark) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="150"> <el-table-column align="center" label="操作" :min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<div> <div>
<el-button @click="handleEdit(scope.row)" type="text" size="small">查看</el-button> <el-button @click="handleEdit(scope.row)" type="text" size="small">查看</el-button>
<el-button type="text" size="mini" @click="handlePLdcdg(scope.row)">下载</el-button>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -108,8 +110,8 @@ ...@@ -108,8 +110,8 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item label="主管部门" prop="competentDeptId"> <el-form-item label="主管部门" prop="competentDeptId">
<Treeselect v-model="form.competentDeptId" :options="deptOptions" :show-count="true" <Treeselect v-model="form.competentDeptId" :options="deptOptions" :show-count="true"
placeholder="请选择" :default-expand-level=1 :style="{ width: '100%' }" @change="onOrgSelect" placeholder="请选择" :default-expand-level=1 :style="{ width: '100%' }"
:disabled="isEdit" /> @change="onOrgSelect" :disabled="isEdit" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -124,8 +126,8 @@ ...@@ -124,8 +126,8 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="获奖时间" prop="awardsTime"> <el-form-item label="获奖时间" prop="awardsTime">
<el-date-picker v-model="form.awardsTime" type="date" placeholder="选择" value-format="yyyy-MM-dd" <el-date-picker v-model="form.awardsTime" type="date" placeholder="选择"
:style="{ width: '100%' }"> value-format="yyyy-MM-dd" :style="{ width: '100%' }">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -205,10 +207,27 @@ import picAvatar from '@/views/smartSchool/schoolManage/introduce/schoolInfo/pro ...@@ -205,10 +207,27 @@ import picAvatar from '@/views/smartSchool/schoolManage/introduce/schoolInfo/pro
import { InsertDropdownListsHeaders } from '@alicloud/dingtalk/dist/doc_1_0/client' import { InsertDropdownListsHeaders } from '@alicloud/dingtalk/dist/doc_1_0/client'
export default { export default {
name: 'index', name: 'index',
components: { Treeselect, picAvatar }, components: {
Treeselect, picAvatar,
},
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
dicts: ['awards_type', 'awards_level', 'audit_state', 'announcement'], dicts: ['awards_type', 'awards_level', 'audit_state', 'announcement'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址 uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
queryForm: { queryForm: {
pageNum: 1, pageNum: 1,
...@@ -283,6 +302,15 @@ export default { ...@@ -283,6 +302,15 @@ export default {
total: 0, total: 0,
} }
}, },
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
this.getDeptTree(); this.getDeptTree();
...@@ -290,6 +318,24 @@ export default { ...@@ -290,6 +318,24 @@ export default {
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
/** 导出按钮操作 */
handlePLdc() {
this.download('/school/awards/pldcfjtpTg', {
...this.queryForm
}, `获奖查看批量导出_${Date.now()}.zip`)
},
handlePLdcdg(row) {
console.log(row, 'row');
this.download('/school/awards/pldcfjtpTg', {
...this.queryForm,
id: row.id
}, `获奖查看导出_${Date.now()}.zip`);
},
//查看 //查看
handleEdit(row) { handleEdit(row) {
console.log(row); console.log(row);
...@@ -417,6 +463,17 @@ export default { ...@@ -417,6 +463,17 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.el-table th.el-table__cell>.cell {
padding-left: 4px;
padding-right: 4px;
}
::v-deep .el-table {
width: 100%;
height: 100%;
}
.mask { .mask {
position: fixed; position: fixed;
top: 0; top: 0;
......
...@@ -104,25 +104,28 @@ ...@@ -104,25 +104,28 @@
</el-row> </el-row>
<el-table border :data="assessmentList" @selection-change="handleSelectionChange" @sort-change="sortChange" <el-table border :data="assessmentList" @selection-change="handleSelectionChange" @sort-change="sortChange"
:default-sort="{ prop: 'schoolYear', order: 'descending' }" :row-style="{ height: '1px' }" :default-sort="{ prop: 'schoolYear', order: 'descending' }" :row-style="{ height: '1px' }"
:cell-style="{ padding: '0px' }" :header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }"> :cell-style="{ padding: '0px' }" :header-cell-style="tableHeaderStyle" :fit="true">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="40" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="40" align="center" sortable fixed="left" />
<el-table-column label="学年" align="center" prop="schoolYear" sortable fixed="left" width="80px <el-table-column label="学年" align="center" prop="schoolYear" sortable :min-width="screenWidth * 0.04" " show-overflow-tooltip />
" show-overflow-tooltip /> <el-table-column label=" 学期" align="center" prop="semester" sortable :min-width="screenWidth * 0.04"
<el-table-column label="学期" align="center" prop="semester" sortable fixed="left" width="80px"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" /> <dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="届别" align="center" prop="year" sortable show-overflow-tooltip width="60px" /> <el-table-column label="届别" align="center" prop="year" sortable show-overflow-tooltip
<el-table-column label="年级" align="center" prop="grade" sortable show-overflow-tooltip width="60px"> :min-width="screenWidth * 0.04" />
<el-table-column label="年级" align="center" prop="grade" sortable show-overflow-tooltip
:min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.grade_da" :value="scope.row.grade" /> <dict-tag :options="dict.type.grade_da" :value="scope.row.grade" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="班级" align="center" prop="className" sortable show-overflow-tooltip width="60px" /> <el-table-column label="班级" align="center" prop="className" sortable show-overflow-tooltip
<el-table-column label="班级类型" align="center" prop="classType" sortable width="90px" show-overflow-tooltip> :min-width="screenWidth * 0.04" />
<el-table-column label="班级类型" align="center" prop="classType" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="getSelectedTypes(scope.row.classType).length > 0"> <span v-if="getSelectedTypes(scope.row.classType).length > 0">
<span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index"> <span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index">
...@@ -132,30 +135,33 @@ ...@@ -132,30 +135,33 @@
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="姓名" align="center" prop="teacherName" sortable show-overflow-tooltip width="70px" /> <el-table-column label="姓名" align="center" prop="teacherName" sortable show-overflow-tooltip
<el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip width="70px"> :min-width="screenWidth * 0.04" />
<el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip
:min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="德育考核成绩" align="center" prop="moralEduCheckAchievement" sortable width="60px" <el-table-column label="德育考核成绩" align="center" prop="moralEduCheckAchievement" sortable
show-overflow-tooltip /> :min-width="screenWidth * 0.05" show-overflow-tooltip />
<el-table-column label="智育考核成绩" align="center" prop="intellEduCheckAchievement" sortable width="60px" <el-table-column label="智育考核成绩" align="center" prop="intellEduCheckAchievement" sortable
show-overflow-tooltip /> :min-width="screenWidth * 0.05" show-overflow-tooltip />
<el-table-column label="考核结果" align="center" prop="assessmentResults" sortable width="80px"> <el-table-column label="考核结果" align="center" prop="assessmentResults" sortable
:min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.assessment_results" :value="scope.row.assessmentResults" /> <dict-tag :options="dict.type.assessment_results" :value="scope.row.assessmentResults" />
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column label="总考核成绩" align="center" prop="totalCheckAchievement" sortable fixed="right" <!-- <el-table-column label="总考核成绩" align="center" prop="totalCheckAchievement" sortable fixed="right"
width="130px" /> --> width="130px" /> -->
<el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip /> <el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" :min-width="screenWidth * 0.06" />
width="100px"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
:min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:assessment:edit']">查看</el-button> v-hasPermi="['system:assessment:edit']">查看</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -302,6 +308,7 @@ export default { ...@@ -302,6 +308,7 @@ export default {
dicts: ["teaching_subjects", 'semester_jsdzda', 'exam_typeda', 'grade_da', 'class_type', 'yearda', 'rankda', 'appointment_situation', 'appointment_positions', 'class_num', 'audit_states', 'assessment_results'], dicts: ["teaching_subjects", 'semester_jsdzda', 'exam_typeda', 'grade_da', 'class_type', 'yearda', 'rankda', 'appointment_situation', 'appointment_positions', 'class_num', 'audit_states', 'assessment_results'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
importing: false, importing: false,
uploadOpen: false, uploadOpen: false,
upload: { upload: {
...@@ -405,10 +412,36 @@ export default { ...@@ -405,10 +412,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -646,4 +679,71 @@ export default { ...@@ -646,4 +679,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
\ No newline at end of file
<template>
<div class="app-container">
<el-dialog title="查询" :visible.sync="query" width="50%" append-to-body>
<el-form ref="queryParams" :model="queryParams" label-width="170px" class="search">
<el-row>
<el-col :span="12">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="queryParams.teachingSubject" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="姓名" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入姓名" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="性别" prop="sex">
<el-select v-model="queryParams.sex" placeholder="请选择" clearable style="width: 100%">
<el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="出生年月" prop="birthDate">
<el-input v-model="queryParams.birthDate" clearable placeholder="请输入"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="queryParams.politicalLandscape" clearable placeholder="请选择政治面貌"
style="width: 100%">
<el-option v-for="dict in dict.type.politics_tatusls" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="queryParams.workingHours" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="queryParams.currentProfessionalTitle" placeholder="请输入现具备专技资格" clearable
@keyup.enter.native="handleQuery" />
<!-- <el-select v-model="queryParams.currentProfessionalTitle" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="queryParams.onDutySituation" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="毕业院校" prop="graduationInstitution1">
<el-input v-model="queryParams.graduationInstitution1" placeholder="请输入毕业院校" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="学历" prop="firstDegree">
<el-input v-model="queryParams.firstDegree" placeholder="请输入学历" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer"
style="display: flex; justify-content: center; align-items: center">
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</div>
</el-dialog>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-search" size="mini" @click="handleQuerycx">查询</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:student:add']">新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="single"
@click="handleDelete" v-hasPermi="['system:student:remove']">删除
</el-button>
</el-col>
<el-col :offset="1" :span="1.5">
<el-button type="success" plain icon="el-icon-upload" size="mini" @click="handleImport"
v-hasPermi="['system:student:import']">导入
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:student:export']">导出
</el-button>
</el-col>
<el-col :span="1.5">
<el-upload v-loading="uploadFileLoading" class="upload-demo" action="#" :show-file-list="false"
:before-upload="beforeFileUpload" :http-request="uploadFiles" accept=".zip">
<el-button size="mini" type="success" plain icon="el-icon-upload">照片导入</el-button>
</el-upload>
</el-col>
</el-row>
<el-table border :data="informationList" @selection-change="handleSelectionChange" @sort-change="sortChange"
:default-sort="{ prop: 'toSecondMiddleSchoolTime', order: 'descending' }" :row-style="{ height: '1px' }"
:cell-style="{ padding: '0px' }" :header-cell-style="{ height: '0px', fontSize: '12px', padding: '0 0' }">
<el-table-column type="selection" align="center" width="40" />
<el-table-column type="index" label="序号" width="30" align="center" fixed="left" />
<el-table-column label="姓名" align="center" prop="name" width="65" sortable fixed="left"
show-overflow-tooltip />
<el-table-column label="性别" width="52" align="center" prop="sex" sortable fixed="left"
show-overflow-tooltip>
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" />
</template>
</el-table-column>
<el-table-column label="年龄" width="50" align="center" prop="age" fixed="left" show-overflow-tooltip />
<el-table-column label="档案年龄" align="center" prop="fileAge" width="85" />
<el-table-column label="政治面貌" align="center" width="90" prop="politicalLandscape" sortable
show-overflow-tooltip>
<template slot-scope="scope">
<dict-tag :options="dict.type.politics_tatusls" :value="scope.row.politicalLandscape" />
</template>
</el-table-column>
<el-table-column label="档案生日" align="center" prop="fileBirthDate" sortable width="90" show-overflow-tooltip>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.fileBirthDate, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column>
<el-table-column label="到市二中工作时间" width="85" align="center" prop="toSecondMiddleSchoolTime" sortable
show-overflow-tooltip />
<el-table-column label="到市二中工作年限" width="70" align="center" prop="toSecondAge" show-overflow-tooltip />
<el-table-column label="现具备专技资格" width="110" align="center" prop="currentHiringProfessionalTitle" sortable
show-overflow-tooltip>
<!-- <template slot-scope="scope">
<dict-tag :options="dict.type.current_professional"
:value="scope.row.currentHiringProfessionalTitle" />
</template> -->
</el-table-column>
<el-table-column label="毕业院校" align="center" :formatter="formatGraduationInstitution" sortable
show-overflow-tooltip />
<el-table-column label="学历" width="75px" align="center" :formatter="formatDegree" sortable
show-overflow-tooltip />
<el-table-column label="在岗情况" align="center" prop="onDutySituation" sortable show-overflow-tooltip
width="80px">
<template slot-scope="scope">
<dict-tag :options="dict.type.duty_situation" :value="scope.row.onDutySituation" />
</template>
</el-table-column>
<!-- <el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip /> -->
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width"
width="108px">
<template slot-scope="scope">
<el-button v-hasPermi="['system:student:edit']" size="mini" type="text"
@click="handleUpdate(scope.row)">修改</el-button>
<el-button v-hasPermi="['system:student:look']" size="mini" type="text"
@click="handleLook(scope.row)">详情</el-button>
<el-button v-hasPermi="['system:student:remove']" size="mini" type="text"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 导入对话框 -->
<el-dialog :title="title" :visible.sync="uploadOpen" width="520px" append-to-body inline @close="cancel">
<el-form ref="uploadForm" :model="uploadForm" :rules="rules" label-width="70px">
<el-form-item prop="dataUrl">
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false"
drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将文件拖到此处,或<em>点击上传</em>
</div>
<div class="el-upload__tip text-center" slot="tip">
<span>仅允许导入xlsxlsx格式文件。</span>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
@click="importTemplate">下载模板
</el-link>
</div>
</el-upload>
</el-form-item>
</el-form>
<div class="mask" v-if="importing">
<div class="mask-content">
<i class="el-icon-loading"></i>
<span>正在导入,请稍候...</span>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="cancelFile"> </el-button>
</div>
</el-dialog>
<!-- 添加对话框 -->
<el-dialog class="addForm" :title="title" :visible.sync="open" width="80%">
<el-form ref="form" :model="form" :rules="rules" label-width="138px">
<el-row type="flex" justify="space-between">
<el-col :span="16">
<el-col :span="12" class="custom-margin">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入姓名" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" @blur="handleIdCardBlur" maxlength="18"
placeholder="请输入" clearable style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案出生日期" prop="fileBirthDate">
<!-- <el-date-picker v-model="form.fileBirthDate" placeholder="选择日期" style="width: 100%;"
clearable type="month" value-format="yyyy-MM"></el-date-picker> -->
<el-date-picker clearable value-format="yyyy-MM-dd" v-model="form.fileBirthDate"
type="date" style="width: 100%;" placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="籍贯" prop="hometown">
<el-input v-model="form.hometown" placeholder="请输入籍贯" clearable
style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span=" 12" class="custom-margin"> -->
<!-- <el-form-item label="出生年月" prop="birthDate">
<el-date-picker clearable v-model="form.birthDate" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item> -->
<!-- </el-col> -->
<el-col :span="12" class="custom-margin">
<el-form-item label="民族" prop="nation">
<el-input v-model="form.nation" placeholder="请输入民族" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="form.politicalLandscape" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.politics_tatusls" clearable :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="入党时间" prop="partyMembershipTime">
<el-date-picker clearable v-model="form.partyMembershipTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="form.teachingSubject" style="width: 190px;" placeholder="请选择"
clearable>
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="form.currentProfessionalTitle" placeholder="请输入现具备专技资格" clearable />
<!-- <el-select v-model="form.currentProfessionalTitle" style="width: 100%" placeholder="请选择"
clearable>
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col><el-col :span="12" class="custom-margin">
<el-form-item label="现具备专技资格时间" prop="currentProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
</el-col>
<el-col :span="6" class="custom-margin">
<el-card style="
height: 180px;
width: 200px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 10px;
">
<el-upload v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"
:show-file-list="false" :on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload" :http-request="uploadImage">
<img v-if="form.photoUrl" :src="baseUrl + form.photoUrl"
style="max-width: 100%; max-height: 100%" class="avatar" alt="" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-card>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格" prop="currentHiringProfessionalTitle">
<el-input v-model="form.currentHiringProfessionalTitle" placeholder="请输入"
style="width: 100%;" />
<!-- <el-select clearable v-model="form.currentHiringProfessionalTitle" style="width: 100%"
placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格时间" prop="currentHiringProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentHiringProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘岗位" prop="currentPosition">
<el-select v-model="form.currentPosition" style="width:100%;" placeholder="请选择" clearable>
<el-option v-for="dict in dict.type.current_position" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级" prop="currentJobLevel">
<el-select v-model="form.currentJobLevel" style="width: 190px;" placeholder="请选择" clearable>
<el-option v-for="level in filteredJobLevels" :key="level.value" :label="level.label"
:value="level.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级聘任时间" prop="currentJobLevelAppointmentTime">
<el-date-picker clearable v-model="form.currentJobLevelAppointmentTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="职务" prop="duties">
<el-input v-model="form.duties" clearable placeholder="请输入" style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格种类" prop="teacherQualificationType">
<el-input v-model="form.teacherQualificationType" clearable placeholder="请输入"
style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格证号码" prop="teacherQualificationCertificateNum">
<el-input v-model="form.teacherQualificationCertificateNum" clearable placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="form.workingHours" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="到二中工作时间" prop="toSecondMiddleSchoolTime">
<el-date-picker clearable v-model="form.toSecondMiddleSchoolTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教龄起算时间" prop="lengthOfTeacherTime">
<el-date-picker clearable v-model="form.lengthOfTeacherTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工龄起算时间" prop="lengthOfServiceTime">
<el-date-picker clearable v-model="form.lengthOfServiceTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="form.onDutySituation" clearable style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在编情况" prop="currentSituation">
<el-select v-model="form.currentSituation" clearable style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校1" prop="graduationInstitution1">
<el-input v-model="form.graduationInstitution1" clearable placeholder="请输入"
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业1" prop="major1">
<el-input v-model="form.major1" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间1" prop="graduationTime1">
<el-date-picker clearable v-model="form.graduationTime1" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校2" prop="graduationInstitution2">
<el-input v-model="form.graduationInstitution2" placeholder="请输入" clearable
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业2" prop="major2">
<el-input v-model="form.major2" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间2" prop="graduationTime2">
<el-date-picker clearable v-model="form.graduationTime2" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校3" prop="graduationInstitution3">
<el-input v-model="form.graduationInstitution3" placeholder="请输入" clearable
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业3" prop="major3">
<el-input v-model="form.major3" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间3" prop="graduationTime3">
<el-date-picker clearable v-model="form.graduationTime3" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="第一学历" prop="firstDegree">
<el-input v-model="form.firstDegree" placeholder="请输入" clearable style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="最后学历" prop="lastDegree">
<el-input v-model="form.lastDegree" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="学位" prop="degree">
<el-input v-model="form.degree" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工作经历" prop="workExperience">
<el-input v-model="form.workExperience" placeholder="请输入" clearable style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="钉钉手机号" prop="ddPhone">
<el-input v-model="form.ddPhone" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="24" class="custom-margin">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer custom-evenly">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<!-- 查看对话框 -->
<el-dialog class="editForm" title="详细信息" :visible.sync="look" width="80%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="138px">
<el-row type="flex" justify="space-between">
<el-col :span="16">
<el-col :span="12" class="custom-margin">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" @blur="handleIdCardBlur" maxlength="18"
placeholder="请输入" clearable style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="年龄" prop="age">
<el-input v-model="form.age" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="性别" prop="sex">
<el-select v-model="form.sex" placeholder="请选择" style="width: 190px;">
<el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value"
:label="dict.label" :value="dict.value"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案出生日期" prop="fileBirthDate">
<el-date-picker clearable value-format="yyyy-MM-dd" v-model="form.fileBirthDate"
type="date" style="width: 100%;" placeholder="选择日期"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案年龄" prop="fileAge">
<el-input v-model="form.fileAge" placeholder="请输入" style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="出生年月" prop="birthDate">
<el-date-picker clearable v-model="form.birthDate" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="籍贯" prop="hometown">
<el-input v-model="form.hometown" placeholder="请输入" style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="民族" prop="nation">
<el-input v-model="form.nation" placeholder="请输入"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="form.politicalLandscape" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.politics_tatusls" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="入党时间" prop="partyMembershipTime">
<el-date-picker clearable v-model="form.partyMembershipTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="form.teachingSubject" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-col>
<el-col :span="6">
<el-col :span="6" class="custom-margin">
<el-card
style="height: 200px;width: 220px; display: flex; align-items: center; justify-content: center; ">
<el-upload v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"
:show-file-list="false" :on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload" :http-request="uploadImage">
<img v-if="form.photoUrl" :src="baseUrl + form.photoUrl"
style="max-width: 100%; max-height: 100%" class="avatar" alt="" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-card>
</el-col>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="form.currentProfessionalTitle" placeholder="请输入" style="width: 100%;" />
<!-- <el-select v-model="form.currentProfessionalTitle" style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现具备专技资格时间" prop="currentProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格" prop="currentHiringProfessionalTitle">
<el-input v-model="form.currentHiringProfessionalTitle" placeholder="请输入"
style="width: 100%;" />
<!-- <el-select v-model="form.currentHiringProfessionalTitle" style="width: 100%"
placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格时间" prop="currentHiringProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentHiringProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘岗位" prop="currentPosition">
<el-select v-model="form.currentPosition" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.current_position" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级" prop="currentJobLevel">
<el-select v-model="form.currentJobLevel" style="width: 100%" placeholder="请选择">
<el-option v-for="level in filteredJobLevels" :key="level.value" :label="level.label"
:value="level.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级聘任时间" prop="currentJobLevelAppointmentTime">
<el-date-picker clearable v-model="form.currentJobLevelAppointmentTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="职务" prop="duties">
<el-input v-model="form.duties" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格种类" prop="teacherQualificationType">
<el-input v-model="form.teacherQualificationType" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格证号码" prop="teacherQualificationCertificateNum">
<el-input v-model="form.teacherQualificationCertificateNum" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="form.workingHours" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="工作年限" prop="seniority">
<el-input v-model="form.seniority" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="到二中工作时间" prop="toSecondMiddleSchoolTime">
<el-date-picker clearable v-model="form.toSecondMiddleSchoolTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="到市二中工作年限" prop="toSecondAge">
<el-input v-model="form.toSecondAge" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教龄起算时间" prop="lengthOfTeacherTime">
<el-date-picker clearable v-model="form.lengthOfTeacherTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工龄起算时间" prop="lengthOfServiceTime">
<el-date-picker clearable v-model="form.lengthOfServiceTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="form.onDutySituation" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在编情况" prop="currentSituation">
<el-select v-model="form.currentSituation" style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校1" prop="graduationInstitution1">
<el-input v-model="form.graduationInstitution1" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业1" prop="major1">
<el-input v-model="form.major1" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间1" prop="graduationTime1">
<el-date-picker clearable v-model="form.graduationTime1" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校2" prop="graduationInstitution2">
<el-input v-model="form.graduationInstitution2" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业2" prop="major2">
<el-input v-model="form.major2" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间2" prop="graduationTime2">
<el-date-picker clearable v-model="form.graduationTime2" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校3" prop="graduationInstitution3">
<el-input v-model="form.graduationInstitution3" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业3" prop="major3">
<el-input v-model="form.major3" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间3" prop="graduationTime3">
<el-date-picker clearable v-model="form.graduationTime3" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="第一学历" prop="firstDegree">
<el-input v-model="form.firstDegree" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="最后学历" prop="lastDegree">
<el-input v-model="form.lastDegree" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="学位" prop="degree">
<el-input v-model="form.degree" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工作经历" prop="workExperience">
<el-input v-model="form.workExperience" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="钉钉手机号" prop="ddPhone">
<el-input v-model="form.ddPhone" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer custom-evenly">
<el-button v-if="isEditing" type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
listInformation,
getInformation,
delInformation,
addInformation,
filesUpload,
updateInformation,
} from "@/api/smartSchool/electronicArchives/basicInformation";
import { uploadImage as commonUpload } from "@/api/common";
import { checkIdcard } from "@/utils/utilLibrary/validate";
import { getToken } from "@/utils/auth";
import { CustomCellStyle } from "@/enums/customStyle";
import { ExportType } from "@/enums/common";
import axios from "axios";
export default {
name: "Information",
dicts: [
"sys_user_sex",
"politics_tatusls",
"teaching_subjects",
"current_professional",
"current_position",
"current_joblevel",
"duty_situation",
"current_situation",
],
data() {
return {
importing: false,
isEditing: false, // 默认为查看模式
// 导出选项
exportOptions: {
title: "选择导出类别",
open: false,
},
uploadOpen: false,
upload: {
// 是否显示弹出层(用户导入)
open: false,
// 弹出层标题(用户导入)
title: "",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的用户数据
updateSupport: 0,
// 设置上传的请求头部
headers: { Authorization: "Bearer " + getToken() },
// 上传的地址
url:
process.env.VUE_APP_BASE_API + "/teacher/basiclnformation/importData",
},
uploadForm: {},
baseUrl: [process.env.VUE_APP_BASE_API],
uploadLoading: false,
uploadFileLoading: false,
// 遮罩层
loading: true,
// 选中数组
ids: [],
id: '',
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 教师基础信息表格数据
informationList: [],
// 弹出层标题
title: "",
// 图片上传遮罩层
uploadLoading: false,
// 是否显示弹出层
open: false,
query: false,
look: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
orderByColumn: "",
isAsc: "asc",
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
},
// 表单参数
form: {},
// 表单校验
rules: {
name: [{ required: true, trigger: "blur" }],
idCard: [{ required: true, validator: checkIdcard, trigger: "blur" }],
teachingSubject: [
{ required: true, trigger: "blur" },
],
toSecondMiddleSchoolTime: [
{
required: true,
trigger: "blur",
},
],
ddPhone: [
{ required: true, trigger: "blur" },
],
},
};
},
computed: {
//现岗位等级下拉框联动
filteredJobLevels() {
const position = this.form.currentPosition;
if (position === "1") {
// 专业技术岗
return this.dict.type.current_joblevel.filter(
(level, index) => index < 12
);
} else if (position === "2") {
// 管理岗
return this.dict.type.current_joblevel.filter(
(level, index) => index === 0 || (index >= 12 && index < 17)
);
} else if (position === "3") {
// 工勤岗
return this.dict.type.current_joblevel.filter(
(level, index) => index === 0 || (index >= 17 && index <= 20)
);
}
// 如果当前职位类型不是1、2、3中的任何一个,则返回全部选项
return this.dict.type.current_joblevel;
},
},
created() {
this.getList();
},
methods: {
formatGraduationInstitution(row) {
// 根据规则拼接毕业院校
let institutions = [];
if (row.graduationInstitution1) institutions.push(row.graduationInstitution1);
if (row.graduationInstitution2) institutions.push(row.graduationInstitution2);
if (row.graduationInstitution3) institutions.push(row.graduationInstitution3);
return institutions.join(' 、 ');
},
formatDegree(row) {
// 根据规则拼接学历
let degrees = [];
if (row.firstDegree) degrees.push(row.firstDegree);
if (row.lastDegree) degrees.push(row.lastDegree);
return degrees.join(' 、 ');
},
//排序列
sortChange(data) {
console.log(data, 'data');
const { prop, order } = data
//排序列
this.queryParams.orderByColumn = prop;
//排序顺序ascending或descending
// this.queryParams.isAsc = order;
if (order == "ascending") {
this.queryParams.isAsc = 'asc';
} else {
this.queryParams.isAsc = 'desc';
}
//返回第一页
this.queryParams.pageNum = 1;
this.getList();
},
//身份证校验
handleIdCardBlur() {
const idCard = this.form.idCard;
if (idCard && idCard.length === 18) {
// 身份证号码有效,提取性别
this.form.sex = this.getGenderFromIdCard(idCard);
// 提取并计算年龄
const birthYear = parseInt(idCard.substring(6, 10));
const birthMonth = parseInt(idCard.substring(10, 12));
const birthDate = parseInt(idCard.substring(12, 14));
// 设置出生年月日
this.form.birthDate = `${birthYear}-${birthMonth}-${birthDate}`;
} else {
// 身份证号码无效或为空,清空性别、年龄和生日字段
this.clearFormInfo();
}
},
clearFormInfo() {
this.form.sex = "";
this.form.birthDate = "";
},
getGenderFromIdCard(idCard) {
if (idCard && idCard.length === 18) {
const lastDigit = parseInt(idCard.charAt(idCard.length - 2)); // 获取倒数第二位数字
return lastDigit % 2 === 0 ? "女" : "男"; // 奇数表示男性,偶数表示女性
}
return ""; // 身份证号码无效或为空时返回空字符串
},
// 上传成功回调
handleAvatarSuccess(res, file) {
this.photoUrl = res.data.url;
this.commonUpload(file);
},
// 上传前格式和图片大小限制
beforeAvatarUpload(file) {
const type =
file.type === "image/jpeg" ||
"image/jpg" ||
"image/webp" ||
"image/png";
const isLt2M = file.size / 1024 / 1024 < 2;
if (!type) {
this.$message.error("图片格式不正确!(只能包含jpg,png,webp,JPEG)");
}
if (!isLt2M) {
this.$message.error("上传图片大小不能超过 2MB!");
}
return type && isLt2M;
},
// 上传图片
uploadImage(file) {
const fileData = file.file;
const formData = new FormData();
formData.append("file", fileData);
this.uploadLoading = true;
commonUpload(formData)
.then((response) => {
this.uploadLoading = false;
this.$modal.msgSuccess("上传成功");
this.photoUrl = this.pev + response.url;
this.form.photoUrl = response.url;
console.log(this.form.photoUr, 'this.form.photoUr');
console.log(response.url, 'response.url');
})
.catch((error) => {
this.uploadLoading = false;
});
},
/** 查询教师基础信息列表 */
getList() {
this.loading = true;
listInformation(this.queryParams).then((response) => {
this.informationList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 文件压缩包上传前格式限制
beforeFileUpload(file) {
const fileName = file.name;
const extension = fileName.substring(fileName.lastIndexOf('.') + 1).toLowerCase();
const allowedExtensions = ['zip']; // 允许的文件后缀列表
if (allowedExtensions.includes(extension)) {
// 文件类型正确,允许上传
return true;
} else {
// 文件类型不正确,给出错误提示并阻止上传
this.$message.error('文件格式不正确!只能上传zip文件');
return false;
}
},
// 上传照片压缩包文件
uploadFiles(file) {
const fileData = file.file;
const formData = new FormData();
formData.append("file", fileData);
this.uploadFileLoading = true;
filesUpload(formData)
.then((response) => {
this.uploadFileLoading = false;
this.$modal.msg(response.msg);
this.getList();
})
.catch((error) => {
this.uploadFileLoading = false;
});
},
handleLook(row) {
console.log(row);
this.look = true;
this.isEditing = false;
this.reset();
const id = row.id || this.ids;
getInformation(id).then((response) => {
this.form = response.data;
console.log(this.form, "this.form ");
this.title = "查看教师基础信息";
});
},
handleImport() {
this.reset();
this.title = "导入";
this.uploadOpen = true;
},
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
this.importing = true;
},
// 提交上传文件
submitFileForm() {
this.$refs.upload.submit();
},
cancelFile() {
this.uploadOpen = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
this.uploadOpen = false;
this.upload.isUploading = false;
this.importing = false;
this.$refs.upload.clearFiles();
this.$alert(
"<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
response.msg +
"</div>",
"导入结果",
{ dangerouslyUseHTMLString: true }
);
this.getList();
},
//下载模版
importTemplate() {
this.download(
"/teacher/basiclnformation/download",
{},
`教师基础信息_${Date.now()}.xlsx`
);
},
// 取消按钮
cancel() {
this.open = false;
this.look = false;
this.query = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
idCard: null,
sex: null,
fileBirthDate: null,
birthDate: null,
hometown: null,
nation: null,
politicalLandscape: null,
partyMembershipTime: null,
teachingSubject: null,
currentProfessionalTitle: null,
currentProfessionalTitleTime: null,
currentHiringProfessionalTitle: null,
currentHiringProfessionalTitleTime: null,
currentPosition: null,
currentJobLevel: null,
currentJobLevelAppointmentTime: null,
duties: null,
teacherQualificationType: null,
teacherQualificationCertificateNum: null,
workingHours: null,
toSecondMiddleSchoolTime: null,
lengthOfTeacherTime: null,
lengthOfServiceTime: null,
onDutySituation: null,
currentSituation: null,
graduationInstitution1: null,
major1: null,
graduationTime1: null,
graduationInstitution2: null,
major2: null,
graduationTime2: null,
graduationInstitution3: null,
major3: null,
graduationTime3: null,
firstDegree: null,
lastDegree: null,
degree: null,
workExperience: null,
remark: null,
photoName: null,
photoUrl: null,
ddPhone: null,
delFlag: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuerycx() {
this.query = true;
},
handleQuery() {
this.query = true;
this.getList();
this.query = false;
},
resetcx() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
};
},
/** 重置按钮操作 */
resetQuery() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
};
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.selection = selection;
this.ids = selection.map(item => item.id);
this.single = selection.length == 1;
this.multiple = selection.length > 1;
// 先定义 isMultiple 变量为 false
let isMultiple = false;
if (this.selection.length === 1) {
// 单选逻辑
this.id = this.selection[0].id;
// console.log('this.id', this.id);
} else if (this.selection.length > 1) {
// 多选逻辑
isMultiple = true;
const ids = this.selection.map((item) => item.id);
this.ids = ids;
// console.log('this.ids', this.ids);
}
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加教师基础信息";
},
/** 修改按钮操作 */
handleUpdate(row) {
console.log(row);
this.open = true;
this.isEditing = true;
this.reset();
const id = row.id || this.ids;
getInformation(id).then((response) => {
this.form = response.data;
console.log(this.form.photoUrl, 'this.form.photoUrl');
this.title = "修改教师基础信息";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateInformation(this.form).then((response) => {
console.log(this.form, 'this.form');
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addInformation(this.form).then((response) => {
console.log(this.form, 'this.form');
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal
.confirm('是否确认删除教师基础信息编号为"' + ids + '"的数据项?')
.then(function () {
return delInformation(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => { });
},
/** 导出按钮操作 */
handleExport() {
this.download('teacher/basiclnformation/export', {
...this.queryParams
}, `教师基础信息_${Date.now()}.xlsx`)
// this.exportOptions.open = true;
// this.download('/teacher/basiclnformation/export', {
// ...this.queryParams
// }, `information_${new Date().getTime()}.xlsx`)
},
/** 导出 */
exportFile(callback) {
// let exportId = ''
// if (this.multiple == true) {
// exportId = this.ids
// } else {
// exportId = this.id
// }
// console.log('exportId', exportId);
// const options = [
// {
// type: ExportType.TOTAL,
// path: "/teacher/basiclnformation/export",
// params: {},
// },
// {
// type: ExportType.SELECT,
// path: "/teacher/basiclnformation/export/",
// params: { exportId },
// },
// {
// type: ExportType.QUERY,
// path: "/teacher/basiclnformation/export",
// params: this.queryParams,
// },
// ];
// callback(options, `教师基础信息${Date.now()}.xlsx`);
},
},
};
</script>
<style lang="scss" scoped>
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 30px;
color: #8c939d;
width: 270px;
height: 280px;
line-height: 250px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
/*
.el-input {
margin-top: -5px;
margin-bottom: -8px;
}
.el-select {
margin-top: -2px;
margin-bottom: -5px;
} */
//.custom-margin {
// margin: -10px 0px;
//}
//.custom-evenly {
// margin-top: -40px !important;
// text-align: right !important;
//}
::v-deep .el-form-item {
margin-bottom: 0px;
}
::v-deep .el-input--medium .el-input__inner {
height: 26px;
line-height: 26px;
}
::v-deep .el-dialog__body {
padding: 10px 20px
}
::v-deep .el-dialog:not(.is-fullscreen) {
margin-top: 4vh !important;
}
.search ::v-deep .el-form-item__content {
width: 200px
}
.addForm ::v-deep .el-dialog__header,
.editForm ::v-deep .el-dialog__header {
padding-bottom: 0px;
padding-top: 10px;
}
.addForm ::v-deep .el-dialog__footer,
.editForm ::v-deep .el-dialog__footer {
padding-bottom: 10px;
}
.mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
}
.mask-content {
display: flex;
align-items: center;
justify-content: center;
color: #1a74be;
font-size: 15px;
}
::v-deep .el-table .el-table__cell {
padding: 0;
}
::v-deep .el-table .cell {
padding: 0;
}
::v-deep .el-table th.el-table__cell>.cell {
padding: 0 !important;
}
::v-deep.el-table--border .el-table__cell .cell {
padding-left: 0px !important;
}
</style>
<template>
<div class="app-container">
<el-dialog title="查询" :visible.sync="query" width="50%" append-to-body>
<el-form ref="queryParams" :model="queryParams" label-width="170px" class="search">
<el-row>
<el-col :span="12">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="queryParams.teachingSubject" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="姓名" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入姓名" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="性别" prop="sex">
<el-select v-model="queryParams.sex" placeholder="请选择" clearable style="width: 100%">
<el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="出生年月" prop="birthDate">
<el-input v-model="queryParams.birthDate" clearable placeholder="请输入"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="queryParams.politicalLandscape" clearable placeholder="请选择政治面貌"
style="width: 100%">
<el-option v-for="dict in dict.type.politics_tatusls" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="queryParams.workingHours" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="queryParams.currentProfessionalTitle" placeholder="请输入现具备专技资格" clearable
@keyup.enter.native="handleQuery" />
<!-- <el-select v-model="queryParams.currentProfessionalTitle" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="queryParams.onDutySituation" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="毕业院校" prop="graduationInstitution1">
<el-input v-model="queryParams.graduationInstitution1" placeholder="请输入毕业院校" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="学历" prop="firstDegree">
<el-input v-model="queryParams.firstDegree" placeholder="请输入学历" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer"
style="display: flex; justify-content: center; align-items: center">
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</div>
</el-dialog>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-search" size="mini" @click="handleQuerycx">查询</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:student:add']">新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="single"
@click="handleDelete" v-hasPermi="['system:student:remove']">删除
</el-button>
</el-col>
<el-col :offset="1" :span="1.5">
<el-button type="success" plain icon="el-icon-upload" size="mini" @click="handleImport"
v-hasPermi="['system:student:import']">导入
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:student:export']">导出
</el-button>
</el-col>
<el-col :span="1.5">
<el-upload v-loading="uploadFileLoading" class="upload-demo" action="#" :show-file-list="false"
:before-upload="beforeFileUpload" :http-request="uploadFiles" accept=".zip">
<el-button size="mini" type="success" plain icon="el-icon-upload">照片导入</el-button>
</el-upload>
</el-col>
</el-row>
<el-table border :data="informationList" @selection-change="handleSelectionChange" @sort-change="sortChange"
:default-sort="{ prop: 'toSecondMiddleSchoolTime', order: 'descending' }" :row-style="{ height: '1px' }"
:cell-style="{ padding: '0px' }" :header-cell-style="{ height: '0px', fontSize: '12px', padding: '0 0' }"
:fit="true"> <!-- 添加 fit 属性实现自适应 -->
<el-table-column type="selection" align="center" :width="40" />
<el-table-column type="index" label="序号" :width="40" align="center" />
<!-- 移除 fixed="left" -->
<el-table-column label="姓名" align="center" prop="name" :min-width="screenWidth * 0.04" sortable
show-overflow-tooltip />
<el-table-column label="性别" :min-width="screenWidth * 0.03" align="center" prop="sex" sortable
show-overflow-tooltip>
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" />
</template>
</el-table-column>
<el-table-column label="年龄" :min-width="screenWidth * 0.03" align="center" prop="age"
show-overflow-tooltip />
<el-table-column label="档案年龄" align="center" prop="fileAge" :min-width="screenWidth * 0.04" />
<el-table-column label="政治面貌" align="center" :min-width="screenWidth * 0.06" prop="politicalLandscape"
sortable show-overflow-tooltip>
<template slot-scope="scope">
<dict-tag :options="dict.type.politics_tatusls" :value="scope.row.politicalLandscape" />
</template>
</el-table-column>
<el-table-column label="档案生日" align="center" prop="fileBirthDate" sortable :min-width="screenWidth * 0.06"
show-overflow-tooltip>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.fileBirthDate, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column>
<el-table-column label="到市二中工作时间" :min-width="screenWidth * 0.06" align="center"
prop="toSecondMiddleSchoolTime" sortable show-overflow-tooltip />
<el-table-column label="到市二中工作年限" :min-width="screenWidth * 0.06" align="center" prop="toSecondAge"
show-overflow-tooltip />
<el-table-column label="现具备专技资格" :min-width="screenWidth * 0.06" align="center"
prop="currentHiringProfessionalTitle" sortable show-overflow-tooltip />
<el-table-column label="毕业院校" :min-width="screenWidth * 0.1" align="center"
:formatter="formatGraduationInstitution" sortable show-overflow-tooltip />
<el-table-column label="学历" width="75px" :min-width="screenWidth * 0.04" align="center"
:formatter="formatDegree" sortable show-overflow-tooltip />
<el-table-column label="在岗情况" align="center" prop="onDutySituation" sortable show-overflow-tooltip
:min-width="screenWidth * 0.05">
<template slot-scope="scope">
<dict-tag :options="dict.type.duty_situation" :value="scope.row.onDutySituation" />
</template>
</el-table-column>
<!-- 移除 fixed="right" -->
<el-table-column label="操作" align="center" class-name="small-padding" :min-width="screenWidth * 0.06">
<template slot-scope="scope">
<el-button v-hasPermi="['system:student:edit']" size="mini" type="text"
@click="handleUpdate(scope.row)">修改</el-button>
<el-button v-hasPermi="['system:student:look']" size="mini" type="text"
@click="handleLook(scope.row)">详情</el-button>
<el-button v-hasPermi="['system:student:remove']" size="mini" type="text"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 导入对话框 -->
<el-dialog :title="title" :visible.sync="uploadOpen" width="520px" append-to-body inline @close="cancel">
<el-form ref="uploadForm" :model="uploadForm" :rules="rules" label-width="70px">
<el-form-item prop="dataUrl">
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false"
drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将文件拖到此处,或<em>点击上传</em>
</div>
<div class="el-upload__tip text-center" slot="tip">
<span>仅允许导入xlsxlsx格式文件。</span>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
@click="importTemplate">下载模板
</el-link>
</div>
</el-upload>
</el-form-item>
</el-form>
<div class="mask" v-if="importing">
<div class="mask-content">
<i class="el-icon-loading"></i>
<span>正在导入,请稍候...</span>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="cancelFile"> </el-button>
</div>
</el-dialog>
<!-- 添加对话框 -->
<el-dialog class="addForm" :title="title" :visible.sync="open" width="80%">
<el-form ref="form" :model="form" :rules="rules" label-width="138px">
<el-row type="flex" justify="space-between">
<el-col :span="16">
<el-col :span="12" class="custom-margin">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入姓名" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" @blur="handleIdCardBlur" maxlength="18"
placeholder="请输入" clearable style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案出生日期" prop="fileBirthDate">
<!-- <el-date-picker v-model="form.fileBirthDate" placeholder="选择日期" style="width: 100%;"
clearable type="month" value-format="yyyy-MM"></el-date-picker> -->
<el-date-picker clearable value-format="yyyy-MM-dd" v-model="form.fileBirthDate"
type="date" style="width: 100%;" placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="籍贯" prop="hometown">
<el-input v-model="form.hometown" placeholder="请输入籍贯" clearable
style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span=" 12" class="custom-margin"> -->
<!-- <el-form-item label="出生年月" prop="birthDate">
<el-date-picker clearable v-model="form.birthDate" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item> -->
<!-- </el-col> -->
<el-col :span="12" class="custom-margin">
<el-form-item label="民族" prop="nation">
<el-input v-model="form.nation" placeholder="请输入民族" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="form.politicalLandscape" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.politics_tatusls" clearable :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="入党时间" prop="partyMembershipTime">
<el-date-picker clearable v-model="form.partyMembershipTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="form.teachingSubject" style="width: 190px;" placeholder="请选择"
clearable>
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="form.currentProfessionalTitle" placeholder="请输入现具备专技资格" clearable />
<!-- <el-select v-model="form.currentProfessionalTitle" style="width: 100%" placeholder="请选择"
clearable>
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col><el-col :span="12" class="custom-margin">
<el-form-item label="现具备专技资格时间" prop="currentProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
</el-col>
<el-col :span="6" class="custom-margin">
<el-card style="
height: 180px;
width: 200px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 10px;
">
<el-upload v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"
:show-file-list="false" :on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload" :http-request="uploadImage">
<img v-if="form.photoUrl" :src="baseUrl + form.photoUrl"
style="max-width: 100%; max-height: 100%" class="avatar" alt="" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-card>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格" prop="currentHiringProfessionalTitle">
<el-input v-model="form.currentHiringProfessionalTitle" placeholder="请输入"
style="width: 100%;" />
<!-- <el-select clearable v-model="form.currentHiringProfessionalTitle" style="width: 100%"
placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格时间" prop="currentHiringProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentHiringProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘岗位" prop="currentPosition">
<el-select v-model="form.currentPosition" style="width:100%;" placeholder="请选择" clearable>
<el-option v-for="dict in dict.type.current_position" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级" prop="currentJobLevel">
<el-select v-model="form.currentJobLevel" style="width: 190px;" placeholder="请选择" clearable>
<el-option v-for="level in filteredJobLevels" :key="level.value" :label="level.label"
:value="level.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级聘任时间" prop="currentJobLevelAppointmentTime">
<el-date-picker clearable v-model="form.currentJobLevelAppointmentTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="职务" prop="duties">
<el-input v-model="form.duties" clearable placeholder="请输入" style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格种类" prop="teacherQualificationType">
<el-input v-model="form.teacherQualificationType" clearable placeholder="请输入"
style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格证号码" prop="teacherQualificationCertificateNum">
<el-input v-model="form.teacherQualificationCertificateNum" clearable placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="form.workingHours" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="到二中工作时间" prop="toSecondMiddleSchoolTime">
<el-date-picker clearable v-model="form.toSecondMiddleSchoolTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教龄起算时间" prop="lengthOfTeacherTime">
<el-date-picker clearable v-model="form.lengthOfTeacherTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工龄起算时间" prop="lengthOfServiceTime">
<el-date-picker clearable v-model="form.lengthOfServiceTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="form.onDutySituation" clearable style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在编情况" prop="currentSituation">
<el-select v-model="form.currentSituation" clearable style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校1" prop="graduationInstitution1">
<el-input v-model="form.graduationInstitution1" clearable placeholder="请输入"
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业1" prop="major1">
<el-input v-model="form.major1" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间1" prop="graduationTime1">
<el-date-picker clearable v-model="form.graduationTime1" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校2" prop="graduationInstitution2">
<el-input v-model="form.graduationInstitution2" placeholder="请输入" clearable
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业2" prop="major2">
<el-input v-model="form.major2" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间2" prop="graduationTime2">
<el-date-picker clearable v-model="form.graduationTime2" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校3" prop="graduationInstitution3">
<el-input v-model="form.graduationInstitution3" placeholder="请输入" clearable
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业3" prop="major3">
<el-input v-model="form.major3" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间3" prop="graduationTime3">
<el-date-picker clearable v-model="form.graduationTime3" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="第一学历" prop="firstDegree">
<el-input v-model="form.firstDegree" placeholder="请输入" clearable style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="最后学历" prop="lastDegree">
<el-input v-model="form.lastDegree" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="学位" prop="degree">
<el-input v-model="form.degree" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工作经历" prop="workExperience">
<el-input v-model="form.workExperience" placeholder="请输入" clearable style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="钉钉手机号" prop="ddPhone">
<el-input v-model="form.ddPhone" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="24" class="custom-margin">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer custom-evenly">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<!-- 查看对话框 -->
<el-dialog class="editForm" title="详细信息" :visible.sync="look" width="80%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="138px">
<el-row type="flex" justify="space-between">
<el-col :span="16">
<el-col :span="12" class="custom-margin">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" @blur="handleIdCardBlur" maxlength="18"
placeholder="请输入" clearable style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="年龄" prop="age">
<el-input v-model="form.age" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="性别" prop="sex">
<el-select v-model="form.sex" placeholder="请选择" style="width: 190px;">
<el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value"
:label="dict.label" :value="dict.value"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案出生日期" prop="fileBirthDate">
<el-date-picker clearable value-format="yyyy-MM-dd" v-model="form.fileBirthDate"
type="date" style="width: 100%;" placeholder="选择日期"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案年龄" prop="fileAge">
<el-input v-model="form.fileAge" placeholder="请输入" style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="出生年月" prop="birthDate">
<el-date-picker clearable v-model="form.birthDate" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="籍贯" prop="hometown">
<el-input v-model="form.hometown" placeholder="请输入" style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="民族" prop="nation">
<el-input v-model="form.nation" placeholder="请输入"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="form.politicalLandscape" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.politics_tatusls" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="入党时间" prop="partyMembershipTime">
<el-date-picker clearable v-model="form.partyMembershipTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="form.teachingSubject" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-col>
<el-col :span="6">
<el-col :span="6" class="custom-margin">
<el-card
style="height: 200px;width: 220px; display: flex; align-items: center; justify-content: center; ">
<el-upload v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"
:show-file-list="false" :on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload" :http-request="uploadImage">
<img v-if="form.photoUrl" :src="baseUrl + form.photoUrl"
style="max-width: 100%; max-height: 100%" class="avatar" alt="" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-card>
</el-col>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="form.currentProfessionalTitle" placeholder="请输入" style="width: 100%;" />
<!-- <el-select v-model="form.currentProfessionalTitle" style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现具备专技资格时间" prop="currentProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格" prop="currentHiringProfessionalTitle">
<el-input v-model="form.currentHiringProfessionalTitle" placeholder="请输入"
style="width: 100%;" />
<!-- <el-select v-model="form.currentHiringProfessionalTitle" style="width: 100%"
placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格时间" prop="currentHiringProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentHiringProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘岗位" prop="currentPosition">
<el-select v-model="form.currentPosition" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.current_position" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级" prop="currentJobLevel">
<el-select v-model="form.currentJobLevel" style="width: 100%" placeholder="请选择">
<el-option v-for="level in filteredJobLevels" :key="level.value" :label="level.label"
:value="level.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级聘任时间" prop="currentJobLevelAppointmentTime">
<el-date-picker clearable v-model="form.currentJobLevelAppointmentTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="职务" prop="duties">
<el-input v-model="form.duties" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格种类" prop="teacherQualificationType">
<el-input v-model="form.teacherQualificationType" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格证号码" prop="teacherQualificationCertificateNum">
<el-input v-model="form.teacherQualificationCertificateNum" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="form.workingHours" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="工作年限" prop="seniority">
<el-input v-model="form.seniority" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="到二中工作时间" prop="toSecondMiddleSchoolTime">
<el-date-picker clearable v-model="form.toSecondMiddleSchoolTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="到市二中工作年限" prop="toSecondAge">
<el-input v-model="form.toSecondAge" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教龄起算时间" prop="lengthOfTeacherTime">
<el-date-picker clearable v-model="form.lengthOfTeacherTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工龄起算时间" prop="lengthOfServiceTime">
<el-date-picker clearable v-model="form.lengthOfServiceTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="form.onDutySituation" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在编情况" prop="currentSituation">
<el-select v-model="form.currentSituation" style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校1" prop="graduationInstitution1">
<el-input v-model="form.graduationInstitution1" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业1" prop="major1">
<el-input v-model="form.major1" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间1" prop="graduationTime1">
<el-date-picker clearable v-model="form.graduationTime1" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校2" prop="graduationInstitution2">
<el-input v-model="form.graduationInstitution2" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业2" prop="major2">
<el-input v-model="form.major2" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间2" prop="graduationTime2">
<el-date-picker clearable v-model="form.graduationTime2" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校3" prop="graduationInstitution3">
<el-input v-model="form.graduationInstitution3" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业3" prop="major3">
<el-input v-model="form.major3" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间3" prop="graduationTime3">
<el-date-picker clearable v-model="form.graduationTime3" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="第一学历" prop="firstDegree">
<el-input v-model="form.firstDegree" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="最后学历" prop="lastDegree">
<el-input v-model="form.lastDegree" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="学位" prop="degree">
<el-input v-model="form.degree" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工作经历" prop="workExperience">
<el-input v-model="form.workExperience" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="钉钉手机号" prop="ddPhone">
<el-input v-model="form.ddPhone" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer custom-evenly">
<el-button v-if="isEditing" type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
listInformation,
getInformation,
delInformation,
addInformation,
filesUpload,
updateInformation,
} from "@/api/smartSchool/electronicArchives/basicInformation";
import { uploadImage as commonUpload } from "@/api/common";
import { checkIdcard } from "@/utils/utilLibrary/validate";
import { getToken } from "@/utils/auth";
import { CustomCellStyle } from "@/enums/customStyle";
import { ExportType } from "@/enums/common";
import axios from "axios";
export default {
name: "Information",
dicts: [
"sys_user_sex",
"politics_tatusls",
"teaching_subjects",
"current_professional",
"current_position",
"current_joblevel",
"duty_situation",
"current_situation",
],
data() {
return {
screenWidth: document.documentElement.clientWidth,
importing: false,
isEditing: false, // 默认为查看模式
// 导出选项
exportOptions: {
title: "选择导出类别",
open: false,
},
uploadOpen: false,
upload: {
// 是否显示弹出层(用户导入)
open: false,
// 弹出层标题(用户导入)
title: "",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的用户数据
updateSupport: 0,
// 设置上传的请求头部
headers: { Authorization: "Bearer " + getToken() },
// 上传的地址
url:
process.env.VUE_APP_BASE_API + "/teacher/basiclnformation/importData",
},
uploadForm: {},
baseUrl: [process.env.VUE_APP_BASE_API],
uploadLoading: false,
uploadFileLoading: false,
// 遮罩层
loading: true,
// 选中数组
ids: [],
id: '',
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 教师基础信息表格数据
informationList: [],
// 弹出层标题
title: "",
// 图片上传遮罩层
uploadLoading: false,
// 是否显示弹出层
open: false,
query: false,
look: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
orderByColumn: "",
isAsc: "asc",
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
},
// 表单参数
form: {},
// 表单校验
rules: {
name: [{ required: true, trigger: "blur" }],
idCard: [{ required: true, validator: checkIdcard, trigger: "blur" }],
teachingSubject: [
{ required: true, trigger: "blur" },
],
toSecondMiddleSchoolTime: [
{
required: true,
trigger: "blur",
},
],
ddPhone: [
{ required: true, trigger: "blur" },
],
},
};
},
computed: {
//现岗位等级下拉框联动
filteredJobLevels() {
const position = this.form.currentPosition;
if (position === "1") {
// 专业技术岗
return this.dict.type.current_joblevel.filter(
(level, index) => index < 12
);
} else if (position === "2") {
// 管理岗
return this.dict.type.current_joblevel.filter(
(level, index) => index === 0 || (index >= 12 && index < 17)
);
} else if (position === "3") {
// 工勤岗
return this.dict.type.current_joblevel.filter(
(level, index) => index === 0 || (index >= 17 && index <= 20)
);
}
// 如果当前职位类型不是1、2、3中的任何一个,则返回全部选项
return this.dict.type.current_joblevel;
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() {
this.getList();
},
methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
formatGraduationInstitution(row) {
// 根据规则拼接毕业院校
let institutions = [];
if (row.graduationInstitution1) institutions.push(row.graduationInstitution1);
if (row.graduationInstitution2) institutions.push(row.graduationInstitution2);
if (row.graduationInstitution3) institutions.push(row.graduationInstitution3);
return institutions.join(' 、 ');
},
formatDegree(row) {
// 根据规则拼接学历
let degrees = [];
if (row.firstDegree) degrees.push(row.firstDegree);
if (row.lastDegree) degrees.push(row.lastDegree);
return degrees.join(' 、 ');
},
//排序列
sortChange(data) {
console.log(data, 'data');
const { prop, order } = data
//排序列
this.queryParams.orderByColumn = prop;
//排序顺序ascending或descending
// this.queryParams.isAsc = order;
if (order == "ascending") {
this.queryParams.isAsc = 'asc';
} else {
this.queryParams.isAsc = 'desc';
}
//返回第一页
this.queryParams.pageNum = 1;
this.getList();
},
//身份证校验
handleIdCardBlur() {
const idCard = this.form.idCard;
if (idCard && idCard.length === 18) {
// 身份证号码有效,提取性别
this.form.sex = this.getGenderFromIdCard(idCard);
// 提取并计算年龄
const birthYear = parseInt(idCard.substring(6, 10));
const birthMonth = parseInt(idCard.substring(10, 12));
const birthDate = parseInt(idCard.substring(12, 14));
// 设置出生年月日
this.form.birthDate = `${birthYear}-${birthMonth}-${birthDate}`;
} else {
// 身份证号码无效或为空,清空性别、年龄和生日字段
this.clearFormInfo();
}
},
clearFormInfo() {
this.form.sex = "";
this.form.birthDate = "";
},
getGenderFromIdCard(idCard) {
if (idCard && idCard.length === 18) {
const lastDigit = parseInt(idCard.charAt(idCard.length - 2)); // 获取倒数第二位数字
return lastDigit % 2 === 0 ? "女" : "男"; // 奇数表示男性,偶数表示女性
}
return ""; // 身份证号码无效或为空时返回空字符串
},
// 上传成功回调
handleAvatarSuccess(res, file) {
this.photoUrl = res.data.url;
this.commonUpload(file);
},
// 上传前格式和图片大小限制
beforeAvatarUpload(file) {
const type =
file.type === "image/jpeg" ||
"image/jpg" ||
"image/webp" ||
"image/png";
const isLt2M = file.size / 1024 / 1024 < 2;
if (!type) {
this.$message.error("图片格式不正确!(只能包含jpg,png,webp,JPEG)");
}
if (!isLt2M) {
this.$message.error("上传图片大小不能超过 2MB!");
}
return type && isLt2M;
},
// 上传图片
uploadImage(file) {
const fileData = file.file;
const formData = new FormData();
formData.append("file", fileData);
this.uploadLoading = true;
commonUpload(formData)
.then((response) => {
this.uploadLoading = false;
this.$modal.msgSuccess("上传成功");
this.photoUrl = this.pev + response.url;
this.form.photoUrl = response.url;
console.log(this.form.photoUr, 'this.form.photoUr');
console.log(response.url, 'response.url');
})
.catch((error) => {
this.uploadLoading = false;
});
},
/** 查询教师基础信息列表 */
getList() {
this.loading = true;
listInformation(this.queryParams).then((response) => {
this.informationList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 文件压缩包上传前格式限制
beforeFileUpload(file) {
const fileName = file.name;
const extension = fileName.substring(fileName.lastIndexOf('.') + 1).toLowerCase();
const allowedExtensions = ['zip']; // 允许的文件后缀列表
if (allowedExtensions.includes(extension)) {
// 文件类型正确,允许上传
return true;
} else {
// 文件类型不正确,给出错误提示并阻止上传
this.$message.error('文件格式不正确!只能上传zip文件');
return false;
}
},
// 上传照片压缩包文件
uploadFiles(file) {
const fileData = file.file;
const formData = new FormData();
formData.append("file", fileData);
this.uploadFileLoading = true;
filesUpload(formData)
.then((response) => {
this.uploadFileLoading = false;
this.$modal.msg(response.msg);
this.getList();
})
.catch((error) => {
this.uploadFileLoading = false;
});
},
handleLook(row) {
console.log(row);
this.look = true;
this.isEditing = false;
this.reset();
const id = row.id || this.ids;
getInformation(id).then((response) => {
this.form = response.data;
console.log(this.form, "this.form ");
this.title = "查看教师基础信息";
});
},
handleImport() {
this.reset();
this.title = "导入";
this.uploadOpen = true;
},
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
this.importing = true;
},
// 提交上传文件
submitFileForm() {
this.$refs.upload.submit();
},
cancelFile() {
this.uploadOpen = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
this.uploadOpen = false;
this.upload.isUploading = false;
this.importing = false;
this.$refs.upload.clearFiles();
this.$alert(
"<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
response.msg +
"</div>",
"导入结果",
{ dangerouslyUseHTMLString: true }
);
this.getList();
},
//下载模版
importTemplate() {
this.download(
"/teacher/basiclnformation/download",
{},
`教师基础信息_${Date.now()}.xlsx`
);
},
// 取消按钮
cancel() {
this.open = false;
this.look = false;
this.query = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
idCard: null,
sex: null,
fileBirthDate: null,
birthDate: null,
hometown: null,
nation: null,
politicalLandscape: null,
partyMembershipTime: null,
teachingSubject: null,
currentProfessionalTitle: null,
currentProfessionalTitleTime: null,
currentHiringProfessionalTitle: null,
currentHiringProfessionalTitleTime: null,
currentPosition: null,
currentJobLevel: null,
currentJobLevelAppointmentTime: null,
duties: null,
teacherQualificationType: null,
teacherQualificationCertificateNum: null,
workingHours: null,
toSecondMiddleSchoolTime: null,
lengthOfTeacherTime: null,
lengthOfServiceTime: null,
onDutySituation: null,
currentSituation: null,
graduationInstitution1: null,
major1: null,
graduationTime1: null,
graduationInstitution2: null,
major2: null,
graduationTime2: null,
graduationInstitution3: null,
major3: null,
graduationTime3: null,
firstDegree: null,
lastDegree: null,
degree: null,
workExperience: null,
remark: null,
photoName: null,
photoUrl: null,
ddPhone: null,
delFlag: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuerycx() {
this.query = true;
},
handleQuery() {
this.query = true;
this.getList();
this.query = false;
},
resetcx() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
};
},
/** 重置按钮操作 */
resetQuery() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
};
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.selection = selection;
this.ids = selection.map(item => item.id);
this.single = selection.length == 1;
this.multiple = selection.length > 1;
// 先定义 isMultiple 变量为 false
let isMultiple = false;
if (this.selection.length === 1) {
// 单选逻辑
this.id = this.selection[0].id;
// console.log('this.id', this.id);
} else if (this.selection.length > 1) {
// 多选逻辑
isMultiple = true;
const ids = this.selection.map((item) => item.id);
this.ids = ids;
// console.log('this.ids', this.ids);
}
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加教师基础信息";
},
/** 修改按钮操作 */
handleUpdate(row) {
console.log(row);
this.open = true;
this.isEditing = true;
this.reset();
const id = row.id || this.ids;
getInformation(id).then((response) => {
this.form = response.data;
console.log(this.form.photoUrl, 'this.form.photoUrl');
this.title = "修改教师基础信息";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateInformation(this.form).then((response) => {
console.log(this.form, 'this.form');
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addInformation(this.form).then((response) => {
console.log(this.form, 'this.form');
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal
.confirm('是否确认删除教师基础信息编号为"' + ids + '"的数据项?')
.then(function () {
return delInformation(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => { });
},
/** 导出按钮操作 */
handleExport() {
this.download('teacher/basiclnformation/export', {
...this.queryParams
}, `教师基础信息_${Date.now()}.xlsx`)
// this.exportOptions.open = true;
// this.download('/teacher/basiclnformation/export', {
// ...this.queryParams
// }, `information_${new Date().getTime()}.xlsx`)
},
/** 导出 */
exportFile(callback) {
// let exportId = ''
// if (this.multiple == true) {
// exportId = this.ids
// } else {
// exportId = this.id
// }
// console.log('exportId', exportId);
// const options = [
// {
// type: ExportType.TOTAL,
// path: "/teacher/basiclnformation/export",
// params: {},
// },
// {
// type: ExportType.SELECT,
// path: "/teacher/basiclnformation/export/",
// params: { exportId },
// },
// {
// type: ExportType.QUERY,
// path: "/teacher/basiclnformation/export",
// params: this.queryParams,
// },
// ];
// callback(options, `教师基础信息${Date.now()}.xlsx`);
},
},
};
</script>
<style lang="scss" scoped>
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 30px;
color: #8c939d;
width: 270px;
height: 280px;
line-height: 250px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
/*
.el-input {
margin-top: -5px;
margin-bottom: -8px;
}
.el-select {
margin-top: -2px;
margin-bottom: -5px;
} */
//.custom-margin {
// margin: -10px 0px;
//}
//.custom-evenly {
// margin-top: -40px !important;
// text-align: right !important;
//}
::v-deep .el-form-item {
margin-bottom: 0px;
}
::v-deep .el-input--medium .el-input__inner {
height: 26px;
line-height: 26px;
}
::v-deep .el-dialog__body {
padding: 10px 20px
}
::v-deep .el-dialog:not(.is-fullscreen) {
margin-top: 4vh !important;
}
.search ::v-deep .el-form-item__content {
width: 200px
}
.addForm ::v-deep .el-dialog__header,
.editForm ::v-deep .el-dialog__header {
padding-bottom: 0px;
padding-top: 10px;
}
.addForm ::v-deep .el-dialog__footer,
.editForm ::v-deep .el-dialog__footer {
padding-bottom: 10px;
}
.mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
}
.mask-content {
display: flex;
align-items: center;
justify-content: center;
color: #1a74be;
font-size: 15px;
}
::v-deep .el-table .el-table__cell {
padding: 0;
}
::v-deep .el-table .cell {
padding: 0;
}
::v-deep .el-table th.el-table__cell>.cell {
padding: 0 !important;
}
::v-deep.el-table--border .el-table__cell .cell {
padding-left: 0px !important;
}
::v-deep .el-table {
width: 100%;
height: 100%;
}
::v-deep .el-table__body-wrapper {
overflow-x: auto;
}
::v-deep .el-table .cell {
white-space: nowrap;
}
</style>
<template>
<div class="app-container">
<el-dialog title="查询" :visible.sync="query" width="50%" append-to-body>
<el-form ref="queryParams" :model="queryParams" label-width="170px" class="search">
<el-row>
<el-col :span="12">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="queryParams.teachingSubject" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="姓名" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入姓名" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="性别" prop="sex">
<el-select v-model="queryParams.sex" placeholder="请选择" clearable style="width: 100%">
<el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="出生年月" prop="birthDate">
<el-input v-model="queryParams.birthDate" clearable placeholder="请输入"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="queryParams.politicalLandscape" clearable placeholder="请选择政治面貌"
style="width: 100%">
<el-option v-for="dict in dict.type.politics_tatusls" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="queryParams.workingHours" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="queryParams.currentProfessionalTitle" placeholder="请输入现具备专技资格" clearable
@keyup.enter.native="handleQuery" />
<!-- <el-select v-model="queryParams.currentProfessionalTitle" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="queryParams.onDutySituation" clearable placeholder="请选择"
style="width: 100%">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="毕业院校" prop="graduationInstitution1">
<el-input v-model="queryParams.graduationInstitution1" placeholder="请输入毕业院校" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="学历" prop="firstDegree">
<el-input v-model="queryParams.firstDegree" placeholder="请输入学历" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer"
style="display: flex; justify-content: center; align-items: center">
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</div>
</el-dialog>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-search" size="mini" @click="handleQuerycx">查询</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:student:add']">新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="single"
@click="handleDelete" v-hasPermi="['system:student:remove']">删除
</el-button>
</el-col>
<el-col :offset="1" :span="1.5">
<el-button type="success" plain icon="el-icon-upload" size="mini" @click="handleImport"
v-hasPermi="['system:student:import']">导入
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:student:export']">导出
</el-button>
</el-col>
<el-col :span="1.5">
<el-upload v-loading="uploadFileLoading" class="upload-demo" action="#" :show-file-list="false"
:before-upload="beforeFileUpload" :http-request="uploadFiles" accept=".zip">
<el-button size="mini" type="success" plain icon="el-icon-upload">照片导入</el-button>
</el-upload>
</el-col>
</el-row>
<el-table border :data="informationList" @selection-change="handleSelectionChange" @sort-change="sortChange"
:default-sort="{ prop: 'toSecondMiddleSchoolTime', order: 'descending' }" :row-style="{ height: '1px' }"
:cell-style="{ padding: '0px' }" :header-cell-style="{ height: '0px', fontSize: '12px', padding: '0 0' }">
<el-table-column type="selection" align="center" width="40" />
<el-table-column type="index" label="序号" width="30" align="center" fixed="left" />
<el-table-column label="姓名" align="center" prop="name" width="65" sortable fixed="left"
show-overflow-tooltip />
<el-table-column label="性别" width="52" align="center" prop="sex" sortable fixed="left"
show-overflow-tooltip>
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" />
</template>
</el-table-column>
<el-table-column label="年龄" width="50" align="center" prop="age" fixed="left" show-overflow-tooltip />
<el-table-column label="档案年龄" align="center" prop="fileAge" width="85" />
<el-table-column label="政治面貌" align="center" width="90" prop="politicalLandscape" sortable
show-overflow-tooltip>
<template slot-scope="scope">
<dict-tag :options="dict.type.politics_tatusls" :value="scope.row.politicalLandscape" />
</template>
</el-table-column>
<el-table-column label="档案生日" align="center" prop="fileBirthDate" sortable width="90" show-overflow-tooltip>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.fileBirthDate, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column>
<el-table-column label="到市二中工作时间" width="85" align="center" prop="toSecondMiddleSchoolTime" sortable
show-overflow-tooltip />
<el-table-column label="到市二中工作年限" width="70" align="center" prop="toSecondAge" show-overflow-tooltip />
<el-table-column label="现具备专技资格" width="110" align="center" prop="currentHiringProfessionalTitle" sortable
show-overflow-tooltip>
<!-- <template slot-scope="scope">
<dict-tag :options="dict.type.current_professional"
:value="scope.row.currentHiringProfessionalTitle" />
</template> -->
</el-table-column>
<el-table-column label="毕业院校" align="center" :formatter="formatGraduationInstitution" sortable
show-overflow-tooltip />
<el-table-column label="学历" width="75px" align="center" :formatter="formatDegree" sortable
show-overflow-tooltip />
<el-table-column label="在岗情况" align="center" prop="onDutySituation" sortable show-overflow-tooltip
width="80px">
<template slot-scope="scope">
<dict-tag :options="dict.type.duty_situation" :value="scope.row.onDutySituation" />
</template>
</el-table-column>
<!-- <el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip /> -->
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width"
width="108px">
<template slot-scope="scope">
<el-button v-hasPermi="['system:student:edit']" size="mini" type="text"
@click="handleUpdate(scope.row)">修改</el-button>
<el-button v-hasPermi="['system:student:look']" size="mini" type="text"
@click="handleLook(scope.row)">详情</el-button>
<el-button v-hasPermi="['system:student:remove']" size="mini" type="text"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 导入对话框 -->
<el-dialog :title="title" :visible.sync="uploadOpen" width="520px" append-to-body inline @close="cancel">
<el-form ref="uploadForm" :model="uploadForm" :rules="rules" label-width="70px">
<el-form-item prop="dataUrl">
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false"
drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将文件拖到此处,或<em>点击上传</em>
</div>
<div class="el-upload__tip text-center" slot="tip">
<span>仅允许导入xlsxlsx格式文件。</span>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
@click="importTemplate">下载模板
</el-link>
</div>
</el-upload>
</el-form-item>
</el-form>
<div class="mask" v-if="importing">
<div class="mask-content">
<i class="el-icon-loading"></i>
<span>正在导入,请稍候...</span>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="cancelFile"> </el-button>
</div>
</el-dialog>
<!-- 添加对话框 -->
<el-dialog class="addForm" :title="title" :visible.sync="open" width="80%">
<el-form ref="form" :model="form" :rules="rules" label-width="138px">
<el-row type="flex" justify="space-between">
<el-col :span="16">
<el-col :span="12" class="custom-margin">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入姓名" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" @blur="handleIdCardBlur" maxlength="18"
placeholder="请输入" clearable style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案出生日期" prop="fileBirthDate">
<!-- <el-date-picker v-model="form.fileBirthDate" placeholder="选择日期" style="width: 100%;"
clearable type="month" value-format="yyyy-MM"></el-date-picker> -->
<el-date-picker clearable value-format="yyyy-MM-dd" v-model="form.fileBirthDate"
type="date" style="width: 100%;" placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="籍贯" prop="hometown">
<el-input v-model="form.hometown" placeholder="请输入籍贯" clearable
style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span=" 12" class="custom-margin"> -->
<!-- <el-form-item label="出生年月" prop="birthDate">
<el-date-picker clearable v-model="form.birthDate" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item> -->
<!-- </el-col> -->
<el-col :span="12" class="custom-margin">
<el-form-item label="民族" prop="nation">
<el-input v-model="form.nation" placeholder="请输入民族" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="form.politicalLandscape" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.politics_tatusls" clearable :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="入党时间" prop="partyMembershipTime">
<el-date-picker clearable v-model="form.partyMembershipTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="form.teachingSubject" style="width: 190px;" placeholder="请选择"
clearable>
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="form.currentProfessionalTitle" placeholder="请输入现具备专技资格" clearable />
<!-- <el-select v-model="form.currentProfessionalTitle" style="width: 100%" placeholder="请选择"
clearable>
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col><el-col :span="12" class="custom-margin">
<el-form-item label="现具备专技资格时间" prop="currentProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
</el-col>
<el-col :span="6" class="custom-margin">
<el-card style="
height: 180px;
width: 200px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 10px;
">
<el-upload v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"
:show-file-list="false" :on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload" :http-request="uploadImage">
<img v-if="form.photoUrl" :src="baseUrl + form.photoUrl"
style="max-width: 100%; max-height: 100%" class="avatar" alt="" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-card>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格" prop="currentHiringProfessionalTitle">
<el-input v-model="form.currentHiringProfessionalTitle" placeholder="请输入"
style="width: 100%;" />
<!-- <el-select clearable v-model="form.currentHiringProfessionalTitle" style="width: 100%"
placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格时间" prop="currentHiringProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentHiringProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘岗位" prop="currentPosition">
<el-select v-model="form.currentPosition" style="width:100%;" placeholder="请选择" clearable>
<el-option v-for="dict in dict.type.current_position" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级" prop="currentJobLevel">
<el-select v-model="form.currentJobLevel" style="width: 190px;" placeholder="请选择" clearable>
<el-option v-for="level in filteredJobLevels" :key="level.value" :label="level.label"
:value="level.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级聘任时间" prop="currentJobLevelAppointmentTime">
<el-date-picker clearable v-model="form.currentJobLevelAppointmentTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="职务" prop="duties">
<el-input v-model="form.duties" clearable placeholder="请输入" style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格种类" prop="teacherQualificationType">
<el-input v-model="form.teacherQualificationType" clearable placeholder="请输入"
style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格证号码" prop="teacherQualificationCertificateNum">
<el-input v-model="form.teacherQualificationCertificateNum" clearable placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="form.workingHours" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="到二中工作时间" prop="toSecondMiddleSchoolTime">
<el-date-picker clearable v-model="form.toSecondMiddleSchoolTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教龄起算时间" prop="lengthOfTeacherTime">
<el-date-picker clearable v-model="form.lengthOfTeacherTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工龄起算时间" prop="lengthOfServiceTime">
<el-date-picker clearable v-model="form.lengthOfServiceTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="form.onDutySituation" clearable style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在编情况" prop="currentSituation">
<el-select v-model="form.currentSituation" clearable style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校1" prop="graduationInstitution1">
<el-input v-model="form.graduationInstitution1" clearable placeholder="请输入"
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业1" prop="major1">
<el-input v-model="form.major1" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间1" prop="graduationTime1">
<el-date-picker clearable v-model="form.graduationTime1" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校2" prop="graduationInstitution2">
<el-input v-model="form.graduationInstitution2" placeholder="请输入" clearable
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业2" prop="major2">
<el-input v-model="form.major2" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间2" prop="graduationTime2">
<el-date-picker clearable v-model="form.graduationTime2" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校3" prop="graduationInstitution3">
<el-input v-model="form.graduationInstitution3" placeholder="请输入" clearable
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业3" prop="major3">
<el-input v-model="form.major3" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间3" prop="graduationTime3">
<el-date-picker clearable v-model="form.graduationTime3" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="第一学历" prop="firstDegree">
<el-input v-model="form.firstDegree" placeholder="请输入" clearable style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="最后学历" prop="lastDegree">
<el-input v-model="form.lastDegree" placeholder="请输入" clearable style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="学位" prop="degree">
<el-input v-model="form.degree" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工作经历" prop="workExperience">
<el-input v-model="form.workExperience" placeholder="请输入" clearable style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="钉钉手机号" prop="ddPhone">
<el-input v-model="form.ddPhone" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="24" class="custom-margin">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer custom-evenly">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<!-- 查看对话框 -->
<el-dialog class="editForm" title="详细信息" :visible.sync="look" width="80%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="138px">
<el-row type="flex" justify="space-between">
<el-col :span="16">
<el-col :span="12" class="custom-margin">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" @blur="handleIdCardBlur" maxlength="18"
placeholder="请输入" clearable style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="年龄" prop="age">
<el-input v-model="form.age" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="性别" prop="sex">
<el-select v-model="form.sex" placeholder="请选择" style="width: 190px;">
<el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value"
:label="dict.label" :value="dict.value"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案出生日期" prop="fileBirthDate">
<el-date-picker clearable value-format="yyyy-MM-dd" v-model="form.fileBirthDate"
type="date" style="width: 100%;" placeholder="选择日期"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="档案年龄" prop="fileAge">
<el-input v-model="form.fileAge" placeholder="请输入" style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="出生年月" prop="birthDate">
<el-date-picker clearable v-model="form.birthDate" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="籍贯" prop="hometown">
<el-input v-model="form.hometown" placeholder="请输入" style="width: 190px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="民族" prop="nation">
<el-input v-model="form.nation" placeholder="请输入"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="政治面貌" prop="politicalLandscape">
<el-select v-model="form.politicalLandscape" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.politics_tatusls" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="入党时间" prop="partyMembershipTime">
<el-date-picker clearable v-model="form.partyMembershipTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="custom-margin">
<el-form-item label="任教学科" prop="teachingSubject">
<el-select v-model="form.teachingSubject" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.teaching_subjects" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-col>
<el-col :span="6">
<el-col :span="6" class="custom-margin">
<el-card
style="height: 200px;width: 220px; display: flex; align-items: center; justify-content: center; ">
<el-upload v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"
:show-file-list="false" :on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload" :http-request="uploadImage">
<img v-if="form.photoUrl" :src="baseUrl + form.photoUrl"
style="max-width: 100%; max-height: 100%" class="avatar" alt="" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-card>
</el-col>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现具备专技资格" prop="currentProfessionalTitle">
<el-input v-model="form.currentProfessionalTitle" placeholder="请输入" style="width: 100%;" />
<!-- <el-select v-model="form.currentProfessionalTitle" style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现具备专技资格时间" prop="currentProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格" prop="currentHiringProfessionalTitle">
<el-input v-model="form.currentHiringProfessionalTitle" placeholder="请输入"
style="width: 100%;" />
<!-- <el-select v-model="form.currentHiringProfessionalTitle" style="width: 100%"
placeholder="请选择">
<el-option v-for="dict in dict.type.current_professional" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select> -->
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘专技资格时间" prop="currentHiringProfessionalTitleTime">
<el-date-picker clearable v-model="form.currentHiringProfessionalTitleTime" type="month"
value-format="yyyy-MM" placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现聘岗位" prop="currentPosition">
<el-select v-model="form.currentPosition" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.current_position" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级" prop="currentJobLevel">
<el-select v-model="form.currentJobLevel" style="width: 100%" placeholder="请选择">
<el-option v-for="level in filteredJobLevels" :key="level.value" :label="level.label"
:value="level.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="现岗位等级聘任时间" prop="currentJobLevelAppointmentTime">
<el-date-picker clearable v-model="form.currentJobLevelAppointmentTime" type="month"
value-format="yyyy-MM" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="职务" prop="duties">
<el-input v-model="form.duties" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格种类" prop="teacherQualificationType">
<el-input v-model="form.teacherQualificationType" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="6" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="教师资格证号码" prop="teacherQualificationCertificateNum">
<el-input v-model="form.teacherQualificationCertificateNum" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="参加工作时间" prop="workingHours">
<el-date-picker clearable v-model="form.workingHours" type="date" value-format="yyyy-MM-dd"
placeholder="请选择" style="width: 190px;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="工作年限" prop="seniority">
<el-input v-model="form.seniority" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="到二中工作时间" prop="toSecondMiddleSchoolTime">
<el-date-picker clearable v-model="form.toSecondMiddleSchoolTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="到市二中工作年限" prop="toSecondAge">
<el-input v-model="form.toSecondAge" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="教龄起算时间" prop="lengthOfTeacherTime">
<el-date-picker clearable v-model="form.lengthOfTeacherTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工龄起算时间" prop="lengthOfServiceTime">
<el-date-picker clearable v-model="form.lengthOfServiceTime" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" style="width: 100%;">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在岗情况" prop="onDutySituation">
<el-select v-model="form.onDutySituation" style="width: 190px;" placeholder="请选择">
<el-option v-for="dict in dict.type.duty_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="在编情况" prop="currentSituation">
<el-select v-model="form.currentSituation" style="width: 100%" placeholder="请选择">
<el-option v-for="dict in dict.type.current_situation" :key="dict.value"
:label="dict.label" :value="dict.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校1" prop="graduationInstitution1">
<el-input v-model="form.graduationInstitution1" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业1" prop="major1">
<el-input v-model="form.major1" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间1" prop="graduationTime1">
<el-date-picker clearable v-model="form.graduationTime1" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校2" prop="graduationInstitution2">
<el-input v-model="form.graduationInstitution2" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业2" prop="major2">
<el-input v-model="form.major2" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间2" prop="graduationTime2">
<el-date-picker clearable v-model="form.graduationTime2" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业院校3" prop="graduationInstitution3">
<el-input v-model="form.graduationInstitution3" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="专业3" prop="major3">
<el-input v-model="form.major3" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="毕业时间3" prop="graduationTime3">
<el-date-picker clearable v-model="form.graduationTime3" type="date"
value-format="yyyy-MM-dd" placeholder="请选择" :style="{ width: '100%' }">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="第一学历" prop="firstDegree">
<el-input v-model="form.firstDegree" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="最后学历" prop="lastDegree">
<el-input v-model="form.lastDegree" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="学位" prop="degree">
<el-input v-model="form.degree" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2" type="flex" justify="space-between">
<el-col :span="8" class="custom-margin">
<el-form-item label="工作经历" prop="workExperience">
<el-input v-model="form.workExperience" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入" style="width: 190px;" />
</el-form-item>
</el-col>
<el-col :span="8" class="custom-margin">
<el-form-item label="钉钉手机号" prop="ddPhone">
<el-input v-model="form.ddPhone" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer custom-evenly">
<el-button v-if="isEditing" type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
listInformation,
getInformation,
delInformation,
addInformation,
filesUpload,
updateInformation,
} from "@/api/smartSchool/electronicArchives/basicInformation";
import { uploadImage as commonUpload } from "@/api/common";
import { checkIdcard } from "@/utils/utilLibrary/validate";
import { getToken } from "@/utils/auth";
import { CustomCellStyle } from "@/enums/customStyle";
import { ExportType } from "@/enums/common";
import axios from "axios";
export default {
name: "Information",
dicts: [
"sys_user_sex",
"politics_tatusls",
"teaching_subjects",
"current_professional",
"current_position",
"current_joblevel",
"duty_situation",
"current_situation",
],
data() {
return {
importing: false,
isEditing: false, // 默认为查看模式
// 导出选项
exportOptions: {
title: "选择导出类别",
open: false,
},
uploadOpen: false,
upload: {
// 是否显示弹出层(用户导入)
open: false,
// 弹出层标题(用户导入)
title: "",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的用户数据
updateSupport: 0,
// 设置上传的请求头部
headers: { Authorization: "Bearer " + getToken() },
// 上传的地址
url:
process.env.VUE_APP_BASE_API + "/teacher/basiclnformation/importData",
},
uploadForm: {},
baseUrl: [process.env.VUE_APP_BASE_API],
uploadLoading: false,
uploadFileLoading: false,
// 遮罩层
loading: true,
// 选中数组
ids: [],
id: '',
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 教师基础信息表格数据
informationList: [],
// 弹出层标题
title: "",
// 图片上传遮罩层
uploadLoading: false,
// 是否显示弹出层
open: false,
query: false,
look: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
orderByColumn: "",
isAsc: "asc",
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
},
// 表单参数
form: {},
// 表单校验
rules: {
name: [{ required: true, trigger: "blur" }],
idCard: [{ required: true, validator: checkIdcard, trigger: "blur" }],
teachingSubject: [
{ required: true, trigger: "blur" },
],
toSecondMiddleSchoolTime: [
{
required: true,
trigger: "blur",
},
],
ddPhone: [
{ required: true, trigger: "blur" },
],
},
};
},
computed: {
//现岗位等级下拉框联动
filteredJobLevels() {
const position = this.form.currentPosition;
if (position === "1") {
// 专业技术岗
return this.dict.type.current_joblevel.filter(
(level, index) => index < 12
);
} else if (position === "2") {
// 管理岗
return this.dict.type.current_joblevel.filter(
(level, index) => index === 0 || (index >= 12 && index < 17)
);
} else if (position === "3") {
// 工勤岗
return this.dict.type.current_joblevel.filter(
(level, index) => index === 0 || (index >= 17 && index <= 20)
);
}
// 如果当前职位类型不是1、2、3中的任何一个,则返回全部选项
return this.dict.type.current_joblevel;
},
},
created() {
this.getList();
},
methods: {
formatGraduationInstitution(row) {
// 根据规则拼接毕业院校
let institutions = [];
if (row.graduationInstitution1) institutions.push(row.graduationInstitution1);
if (row.graduationInstitution2) institutions.push(row.graduationInstitution2);
if (row.graduationInstitution3) institutions.push(row.graduationInstitution3);
return institutions.join(' 、 ');
},
formatDegree(row) {
// 根据规则拼接学历
let degrees = [];
if (row.firstDegree) degrees.push(row.firstDegree);
if (row.lastDegree) degrees.push(row.lastDegree);
return degrees.join(' 、 ');
},
//排序列
sortChange(data) {
console.log(data, 'data');
const { prop, order } = data
//排序列
this.queryParams.orderByColumn = prop;
//排序顺序ascending或descending
// this.queryParams.isAsc = order;
if (order == "ascending") {
this.queryParams.isAsc = 'asc';
} else {
this.queryParams.isAsc = 'desc';
}
//返回第一页
this.queryParams.pageNum = 1;
this.getList();
},
//身份证校验
handleIdCardBlur() {
const idCard = this.form.idCard;
if (idCard && idCard.length === 18) {
// 身份证号码有效,提取性别
this.form.sex = this.getGenderFromIdCard(idCard);
// 提取并计算年龄
const birthYear = parseInt(idCard.substring(6, 10));
const birthMonth = parseInt(idCard.substring(10, 12));
const birthDate = parseInt(idCard.substring(12, 14));
// 设置出生年月日
this.form.birthDate = `${birthYear}-${birthMonth}-${birthDate}`;
} else {
// 身份证号码无效或为空,清空性别、年龄和生日字段
this.clearFormInfo();
}
},
clearFormInfo() {
this.form.sex = "";
this.form.birthDate = "";
},
getGenderFromIdCard(idCard) {
if (idCard && idCard.length === 18) {
const lastDigit = parseInt(idCard.charAt(idCard.length - 2)); // 获取倒数第二位数字
return lastDigit % 2 === 0 ? "女" : "男"; // 奇数表示男性,偶数表示女性
}
return ""; // 身份证号码无效或为空时返回空字符串
},
// 上传成功回调
handleAvatarSuccess(res, file) {
this.photoUrl = res.data.url;
this.commonUpload(file);
},
// 上传前格式和图片大小限制
beforeAvatarUpload(file) {
const type =
file.type === "image/jpeg" ||
"image/jpg" ||
"image/webp" ||
"image/png";
const isLt2M = file.size / 1024 / 1024 < 2;
if (!type) {
this.$message.error("图片格式不正确!(只能包含jpg,png,webp,JPEG)");
}
if (!isLt2M) {
this.$message.error("上传图片大小不能超过 2MB!");
}
return type && isLt2M;
},
// 上传图片
uploadImage(file) {
const fileData = file.file;
const formData = new FormData();
formData.append("file", fileData);
this.uploadLoading = true;
commonUpload(formData)
.then((response) => {
this.uploadLoading = false;
this.$modal.msgSuccess("上传成功");
this.photoUrl = this.pev + response.url;
this.form.photoUrl = response.url;
console.log(this.form.photoUr, 'this.form.photoUr');
console.log(response.url, 'response.url');
})
.catch((error) => {
this.uploadLoading = false;
});
},
/** 查询教师基础信息列表 */
getList() {
this.loading = true;
listInformation(this.queryParams).then((response) => {
this.informationList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 文件压缩包上传前格式限制
beforeFileUpload(file) {
const fileName = file.name;
const extension = fileName.substring(fileName.lastIndexOf('.') + 1).toLowerCase();
const allowedExtensions = ['zip']; // 允许的文件后缀列表
if (allowedExtensions.includes(extension)) {
// 文件类型正确,允许上传
return true;
} else {
// 文件类型不正确,给出错误提示并阻止上传
this.$message.error('文件格式不正确!只能上传zip文件');
return false;
}
},
// 上传照片压缩包文件
uploadFiles(file) {
const fileData = file.file;
const formData = new FormData();
formData.append("file", fileData);
this.uploadFileLoading = true;
filesUpload(formData)
.then((response) => {
this.uploadFileLoading = false;
this.$modal.msg(response.msg);
this.getList();
})
.catch((error) => {
this.uploadFileLoading = false;
});
},
handleLook(row) {
console.log(row);
this.look = true;
this.isEditing = false;
this.reset();
const id = row.id || this.ids;
getInformation(id).then((response) => {
this.form = response.data;
console.log(this.form, "this.form ");
this.title = "查看教师基础信息";
});
},
handleImport() {
this.reset();
this.title = "导入";
this.uploadOpen = true;
},
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
this.importing = true;
},
// 提交上传文件
submitFileForm() {
this.$refs.upload.submit();
},
cancelFile() {
this.uploadOpen = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
this.uploadOpen = false;
this.upload.isUploading = false;
this.importing = false;
this.$refs.upload.clearFiles();
this.$alert(
"<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
response.msg +
"</div>",
"导入结果",
{ dangerouslyUseHTMLString: true }
);
this.getList();
},
//下载模版
importTemplate() {
this.download(
"/teacher/basiclnformation/download",
{},
`教师基础信息_${Date.now()}.xlsx`
);
},
// 取消按钮
cancel() {
this.open = false;
this.look = false;
this.query = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
idCard: null,
sex: null,
fileBirthDate: null,
birthDate: null,
hometown: null,
nation: null,
politicalLandscape: null,
partyMembershipTime: null,
teachingSubject: null,
currentProfessionalTitle: null,
currentProfessionalTitleTime: null,
currentHiringProfessionalTitle: null,
currentHiringProfessionalTitleTime: null,
currentPosition: null,
currentJobLevel: null,
currentJobLevelAppointmentTime: null,
duties: null,
teacherQualificationType: null,
teacherQualificationCertificateNum: null,
workingHours: null,
toSecondMiddleSchoolTime: null,
lengthOfTeacherTime: null,
lengthOfServiceTime: null,
onDutySituation: null,
currentSituation: null,
graduationInstitution1: null,
major1: null,
graduationTime1: null,
graduationInstitution2: null,
major2: null,
graduationTime2: null,
graduationInstitution3: null,
major3: null,
graduationTime3: null,
firstDegree: null,
lastDegree: null,
degree: null,
workExperience: null,
remark: null,
photoName: null,
photoUrl: null,
ddPhone: null,
delFlag: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuerycx() {
this.query = true;
},
handleQuery() {
this.query = true;
this.getList();
this.query = false;
},
resetcx() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
};
},
/** 重置按钮操作 */
resetQuery() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
teachingSubject: "",
name: "",
sex: "",
birthDate: "",
politicalLandscape: "",
workingHours: "",
currentProfessionalTitle: "",
onDutySituation: "",
graduationInstitution1: "",
firstDegree: "",
};
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.selection = selection;
this.ids = selection.map(item => item.id);
this.single = selection.length == 1;
this.multiple = selection.length > 1;
// 先定义 isMultiple 变量为 false
let isMultiple = false;
if (this.selection.length === 1) {
// 单选逻辑
this.id = this.selection[0].id;
// console.log('this.id', this.id);
} else if (this.selection.length > 1) {
// 多选逻辑
isMultiple = true;
const ids = this.selection.map((item) => item.id);
this.ids = ids;
// console.log('this.ids', this.ids);
}
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加教师基础信息";
},
/** 修改按钮操作 */
handleUpdate(row) {
console.log(row);
this.open = true;
this.isEditing = true;
this.reset();
const id = row.id || this.ids;
getInformation(id).then((response) => {
this.form = response.data;
console.log(this.form.photoUrl, 'this.form.photoUrl');
this.title = "修改教师基础信息";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateInformation(this.form).then((response) => {
console.log(this.form, 'this.form');
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addInformation(this.form).then((response) => {
console.log(this.form, 'this.form');
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal
.confirm('是否确认删除教师基础信息编号为"' + ids + '"的数据项?')
.then(function () {
return delInformation(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => { });
},
/** 导出按钮操作 */
handleExport() {
this.download('teacher/basiclnformation/export', {
...this.queryParams
}, `教师基础信息_${Date.now()}.xlsx`)
// this.exportOptions.open = true;
// this.download('/teacher/basiclnformation/export', {
// ...this.queryParams
// }, `information_${new Date().getTime()}.xlsx`)
},
/** 导出 */
exportFile(callback) {
// let exportId = ''
// if (this.multiple == true) {
// exportId = this.ids
// } else {
// exportId = this.id
// }
// console.log('exportId', exportId);
// const options = [
// {
// type: ExportType.TOTAL,
// path: "/teacher/basiclnformation/export",
// params: {},
// },
// {
// type: ExportType.SELECT,
// path: "/teacher/basiclnformation/export/",
// params: { exportId },
// },
// {
// type: ExportType.QUERY,
// path: "/teacher/basiclnformation/export",
// params: this.queryParams,
// },
// ];
// callback(options, `教师基础信息${Date.now()}.xlsx`);
},
},
};
</script>
<style lang="scss" scoped>
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 30px;
color: #8c939d;
width: 270px;
height: 280px;
line-height: 250px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
/*
.el-input {
margin-top: -5px;
margin-bottom: -8px;
}
.el-select {
margin-top: -2px;
margin-bottom: -5px;
} */
//.custom-margin {
// margin: -10px 0px;
//}
//.custom-evenly {
// margin-top: -40px !important;
// text-align: right !important;
//}
::v-deep .el-form-item {
margin-bottom: 0px;
}
::v-deep .el-input--medium .el-input__inner {
height: 26px;
line-height: 26px;
}
::v-deep .el-dialog__body {
padding: 10px 20px
}
::v-deep .el-dialog:not(.is-fullscreen) {
margin-top: 4vh !important;
}
.search ::v-deep .el-form-item__content {
width: 200px
}
.addForm ::v-deep .el-dialog__header,
.editForm ::v-deep .el-dialog__header {
padding-bottom: 0px;
padding-top: 10px;
}
.addForm ::v-deep .el-dialog__footer,
.editForm ::v-deep .el-dialog__footer {
padding-bottom: 10px;
}
.mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
}
.mask-content {
display: flex;
align-items: center;
justify-content: center;
color: #1a74be;
font-size: 15px;
}
::v-deep .el-table .el-table__cell {
padding: 0;
}
::v-deep .el-table .cell {
padding: 0;
}
::v-deep .el-table th.el-table__cell>.cell {
padding: 0 !important;
}
::v-deep.el-table--border .el-table__cell .cell {
padding-left: 0px !important;
}
</style>
...@@ -132,64 +132,83 @@ ...@@ -132,64 +132,83 @@
</el-upload> </el-upload>
</el-col> </el-col>
</el-row> </el-row>
<el-table border :data="informationList" @selection-change="handleSelectionChange" @sort-change="sortChange" <el-table ref="table" border :data="informationList" @selection-change="handleSelectionChange"
:default-sort="{ prop: 'toSecondMiddleSchoolTime', order: 'descending' }" :row-style="{ height: '1px' }" @sort-change="sortChange" :default-sort="defaultSort" :row-style="{ height: '1px' }"
:cell-style="{ padding: '0px' }" :header-cell-style="{ height: '0px', fontSize: '12px', padding: '0 0' }"> :cell-style="{ padding: '0px' }" :header-cell-style="tableHeaderStyle" :fit="true">
<el-table-column type="selection" align="center" width="40" /> <!-- 添加 fit 属性实现自适应 -->
<el-table-column type="index" label="序号" width="30" align="center" fixed="left" /> <el-table-column type="selection" align="center" :width="40" />
<el-table-column label="姓名" align="center" prop="name" width="65" sortable fixed="left" <el-table-column type="index" label="序号" :width="40" align="center" />
<!-- 移除 fixed="left" -->
<el-table-column label="姓名" align="center" prop="name" :min-width="screenWidth * 0.04" sortable="custom"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="性别" width="52" align="center" prop="sex" sortable fixed="left" <el-table-column label="性别" :min-width="screenWidth * 0.03" align="center" prop="sex" sortable="custom"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" /> <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="年龄" width="50" align="center" prop="age" fixed="left" show-overflow-tooltip /> <el-table-column label="年龄" :min-width="screenWidth * 0.03" align="center" prop="age" sortable="custom"
<el-table-column label="档案年龄" align="center" prop="fileAge" width="85" /> show-overflow-tooltip />
<el-table-column label="政治面貌" align="center" width="90" prop="politicalLandscape" sortable <!-- <el-table-column label="出生日期" :min-width="screenWidth * 0.03" align="center" prop="birthDate"
show-overflow-tooltip> sortable="custom" show-overflow-tooltip /> -->
<el-table-column label="档案年龄" align="center" prop="fileAge" :min-width="screenWidth * 0.04"
sortable="custom" />
<el-table-column label="政治面貌" align="center" :min-width="screenWidth * 0.06" prop="politicalLandscape"
sortable="custom" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.politics_tatusls" :value="scope.row.politicalLandscape" /> <dict-tag :options="dict.type.politics_tatusls" :value="scope.row.politicalLandscape" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="档案生日" align="center" prop="fileBirthDate" sortable width="90" show-overflow-tooltip> <el-table-column label="档案生日" align="center" prop="fileBirthDate" sortable="custom"
:min-width="screenWidth * 0.06" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.fileBirthDate, "{y}-{m}-{d}") }}</span> <span>{{ parseTime(scope.row.fileBirthDate, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="到市二中工作时间" width="85" align="center" prop="toSecondMiddleSchoolTime" sortable <el-table-column :min-width="screenWidth * 0.05" align="center" prop="toSecondMiddleSchoolTime"
show-overflow-tooltip /> sortable="custom" show-overflow-tooltip>
<el-table-column label="到市二中工作年限" width="70" align="center" prop="toSecondAge" show-overflow-tooltip /> <template slot="header">
<el-table-column label="现具备专技资格" width="110" align="center" prop="currentHiringProfessionalTitle" sortable <span style="white-space: normal;">到市二中<br />工作时间</span>
</template>
</el-table-column>
<el-table-column :min-width="screenWidth * 0.05" align="center" prop="toSecondAge" sortable="custom"
show-overflow-tooltip> show-overflow-tooltip>
<!-- <template slot-scope="scope"> <template slot="header">
<dict-tag :options="dict.type.current_professional" <span style="white-space: normal;">到市二中<br />工作年限</span>
:value="scope.row.currentHiringProfessionalTitle" /> </template>
</template> -->
</el-table-column> </el-table-column>
<el-table-column label="毕业院校" align="center" prop="graduationInstitution3" sortable show-overflow-tooltip /> <el-table-column label="现具备专技资格" :min-width="screenWidth * 0.08" align="center"
<el-table-column label="学历" width="75px" align="center" prop="lastDegree" sortable show-overflow-tooltip /> prop="currentHiringProfessionalTitle" sortable="custom" show-overflow-tooltip />
<el-table-column label="在岗情况" align="center" prop="onDutySituation" sortable show-overflow-tooltip <!-- <el-table-column label="毕业院校" align="center" prop="graduationInstitution3" sortable="custom"
width="80px"> :min-width="screenWidth * 0.1" show-overflow-tooltip />
<el-table-column label="学历" :min-width="screenWidth * 0.04" align="center" prop="lastDegree" sortable="custom"
show-overflow-tooltip /> -->
<el-table-column label="毕业院校" align="center" :formatter="formatGraduationInstitution" sortable="custom"
:min-width="screenWidth * 0.1" show-overflow-tooltip />
<el-table-column label="学历" width="75px" align="center" :formatter="formatDegree" sortable="custom"
:min-width="screenWidth * 0.04" show-overflow-tooltip />
<el-table-column label="在岗情况" align="center" prop="onDutySituation" sortable="custom" show-overflow-tooltip
:min-width="screenWidth * 0.05">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.duty_situation" :value="scope.row.onDutySituation" /> <dict-tag :options="dict.type.duty_situation" :value="scope.row.onDutySituation" />
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip /> --> <!-- 移除 fixed="right" -->
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width" <el-table-column label="操作" align="center" class-name="small-padding operation-column"
width="108px"> :min-width="screenWidth * 0.08">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button v-hasPermi="['system:student:edit']" size="mini" type="text" <div class="operation-buttons">
@click="handleUpdate(scope.row)">修改</el-button> <el-button v-hasPermi="['system:student:edit']" size="mini" type="text"
<el-button v-hasPermi="['system:student:look']" size="mini" type="text" @click="handleUpdate(scope.row)">修改</el-button>
@click="handleLook(scope.row)">详情</el-button> <el-button v-hasPermi="['system:student:look']" size="mini" type="text"
<el-button v-hasPermi="['system:student:remove']" size="mini" type="text" @click="handleLook(scope.row)">详情</el-button>
@click="handleDelete(scope.row)">删除</el-button> <el-button v-hasPermi="['system:student:remove']" size="mini" type="text"
@click="handleDelete(scope.row)">删除</el-button>
</div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" /> :limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 导入对话框 --> <!-- 导入对话框 -->
...@@ -930,7 +949,8 @@ export default { ...@@ -930,7 +949,8 @@ export default {
data() { data() {
return { return {
defaultSort: { prop: 'toSecondMiddleSchoolTime', order: 'descending' },
screenWidth: document.documentElement.clientWidth,
importing: false, importing: false,
isEditing: false, // 默认为查看模式 isEditing: false, // 默认为查看模式
// 导出选项 // 导出选项
...@@ -1042,28 +1062,94 @@ export default { ...@@ -1042,28 +1062,94 @@ export default {
// 如果当前职位类型不是1、2、3中的任何一个,则返回全部选项 // 如果当前职位类型不是1、2、3中的任何一个,则返回全部选项
return this.dict.type.current_joblevel; return this.dict.type.current_joblevel;
}, },
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
}, },
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
formatGraduationInstitution(row) {
// 根据规则拼接毕业院校
let institutions = [];
if (row.graduationInstitution1) institutions.push(row.graduationInstitution1);
if (row.graduationInstitution2) institutions.push(row.graduationInstitution2);
if (row.graduationInstitution3) institutions.push(row.graduationInstitution3);
return institutions.join(' 、 ');
},
formatDegree(row) {
// 根据规则拼接学历
let degrees = [];
if (row.firstDegree) degrees.push(row.firstDegree);
if (row.lastDegree) degrees.push(row.lastDegree);
return degrees.join(' 、 ');
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
const { prop, order } = data const { prop, order } = data;
//排序列 let sortProp = prop;
this.queryParams.orderByColumn = prop;
//排序顺序ascending或descending if (prop === 'toSecondAge') {
// this.queryParams.isAsc = order; sortProp = 'toSecondMiddleSchoolTime';
if (order == "ascending") { }
console.log(sortProp, 'sortProp');
if (prop === 'age') {
sortProp = 'birthDate';
}
console.log(sortProp, 'sortProp');
if (prop === 'fileAge') {
sortProp = 'fileBirthDate';
}
// 直接使用处理后的 sortProp 设置排序列
this.queryParams.orderByColumn = sortProp;
if (order === "ascending") {
this.queryParams.isAsc = 'asc'; this.queryParams.isAsc = 'asc';
} else { } else {
this.queryParams.isAsc = 'desc'; this.queryParams.isAsc = 'desc';
} }
//返回第一页
// 返回第一页
this.queryParams.pageNum = 1; this.queryParams.pageNum = 1;
this.getList();
// 手动更新 defaultSort
this.defaultSort = {
prop: prop,
order: order
};
this.$nextTick(() => {
this.getList();
});
}, },
//身份证校验 //身份证校验
handleIdCardBlur() { handleIdCardBlur() {
const idCard = this.form.idCard; const idCard = this.form.idCard;
...@@ -1138,6 +1224,7 @@ export default { ...@@ -1138,6 +1224,7 @@ export default {
/** 查询教师基础信息列表 */ /** 查询教师基础信息列表 */
getList() { getList() {
this.loading = true; this.loading = true;
listInformation(this.queryParams).then((response) => { listInformation(this.queryParams).then((response) => {
this.informationList = response.rows; this.informationList = response.rows;
this.total = response.total; this.total = response.total;
...@@ -1570,4 +1657,94 @@ export default { ...@@ -1570,4 +1657,94 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
::v-deep .el-table {
width: 100%;
height: 100%;
}
::v-deep .el-table__body-wrapper {
overflow-x: auto;
}
::v-deep .el-table .cell {
white-space: nowrap;
}
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 如果是单独设置表头换行
.el-table th>.cell {
white-space: pre-wrap;
}
// 或者全局换行
.el-table.cell {
white-space: pre-wrap;
}
</style> </style>
...@@ -97,20 +97,24 @@ ...@@ -97,20 +97,24 @@
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" :data="achievementList" :header-cell-style="tableHeaderStyle" :fit="true" :data="achievementList"
@selection-change="handleSelectionChange" :default-sort="{ prop: 'year', order: 'descending' }"> @selection-change="handleSelectionChange" :default-sort="{ prop: 'year', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" sortable /> <el-table-column type="selection" width="30" align="center" sortable />
<el-table-column type="index" label="序号" width="30" align="center" sortable /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="届别" align="center" prop="year" sortable width="55" show-overflow-tooltip /> <el-table-column label="届别" align="center" prop="year" sortable :min-width="screenWidth * 0.03"
<el-table-column label="学科" align="center" prop="sub" sortable width="55" show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label="学科" align="center" prop="sub" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="教师姓名" align="center" prop="teacherName" sortable width="80" show-overflow-tooltip /> <el-table-column label="教师姓名" align="center" prop="teacherName" sortable :min-width="screenWidth * 0.04"
<el-table-column label="授课班级" align="center" prop="teachingClassName" sortable width="80"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="班级类型" align="center" prop="classType" sortable show-overflow-tooltip width="90"> <el-table-column label="授课班级" align="center" prop="teachingClassName" sortable
:min-width="screenWidth * 0.04" show-overflow-tooltip />
<el-table-column label="班级类型" align="center" prop="classType" sortable show-overflow-tooltip
:min-width="screenWidth * 0.04">
<!-- <template slot-scope="scope"> <!-- <template slot-scope="scope">
<span v-if="getSelectedTypes(scope.row.classType).length > 0"> <span v-if="getSelectedTypes(scope.row.classType).length > 0">
<span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index"> <span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index">
...@@ -120,24 +124,28 @@ ...@@ -120,24 +124,28 @@
</span> </span>
</template> --> </template> -->
</el-table-column> </el-table-column>
<el-table-column label="高考评优" align="center" prop="gkAppraising" sortable width="90" show-overflow-tooltip> <el-table-column label="高考评优" align="center" prop="gkAppraising" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.gk_appraising" :value="scope.row.gkAppraising" /> <dict-tag :options="dict.type.gk_appraising" :value="scope.row.gkAppraising" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="尖子生培养" align="center" prop="topStudentsCulture" sortable width="120" <el-table-column label="尖子生培养" align="center" prop="topStudentsCulture" sortable
show-overflow-tooltip /> :min-width="screenWidth * 0.04" show-overflow-tooltip />
<el-table-column label="增量情况" align="center" prop="incrementSituation" sortable width="75" <el-table-column label="增量情况" align="center" prop="incrementSituation" sortable
show-overflow-tooltip /> :min-width="screenWidth * 0.04" show-overflow-tooltip />
<el-table-column label="有效数情况" align="center" prop="effectiveNumSituation" sortable width="100" <el-table-column label="有效数情况" align="center" prop="effectiveNumSituation" sortable
:min-width="screenWidth * 0.04" show-overflow-tooltip />
<el-table-column label="其他情况" align="center" prop="other" :min-width="screenWidth * 0.04" sortable
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="其他情况" align="center" prop="other" sortable show-overflow-tooltip /> <el-table-column label="审核状态" align="center" prop="auditState" sortable :min-width="screenWidth * 0.04"
<el-table-column label="审核状态" align="center" prop="auditState" sortable width="75" fixed="right"> fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100" fixed="right"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
:min-width="screenWidth * 0.07" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" @click="handleUpdate(scope.row)"
v-hasPermi="['system:honors:edit']" v-hasPermi="['system:honors:edit']"
...@@ -381,6 +389,7 @@ export default { ...@@ -381,6 +389,7 @@ export default {
}, },
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
importing: false, importing: false,
uploadOpen: false, uploadOpen: false,
upload: { upload: {
...@@ -480,10 +489,36 @@ export default { ...@@ -480,10 +489,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -808,4 +843,71 @@ export default { ...@@ -808,4 +843,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
...@@ -102,52 +102,60 @@ ...@@ -102,52 +102,60 @@
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" :data="awardsList" :header-cell-style="tableHeaderStyle" :fit="true" :data="awardsList"
@selection-change="handleSelectionChange" :default-sort="{ prop: 'awardtime', order: 'descending' }"> @selection-change="handleSelectionChange" :default-sort="{ prop: 'awardtime', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="成长类型" align="center" fixed="left" width="90px" show-overflow-tooltip> <el-table-column label="成长类型" align="center" width="90px" show-overflow-tooltip>
<template> <template>
<span>辅导学生获奖</span> <span>辅导学生获奖</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="学科" align="center" prop="sub" sortable fixed="left" width="60px" <el-table-column label="学科" align="center" prop="sub" sortable :min-width="screenWidth * 0.02"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖类别" align="center" prop="awardtype" sortable width="85px" show-overflow-tooltip> <el-table-column label="获奖类别" align="center" prop="awardtype" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_type_fdxs" :value="scope.row.awardtype" /> <dict-tag :options="dict.type.award_type_fdxs" :value="scope.row.awardtype" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖等级" align="center" prop="awardlevel" sortable width="85px" show-overflow-tooltip> <el-table-column label="获奖等级" align="center" prop="awardlevel" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_rank" :value="scope.row.awardlevel" /> <dict-tag :options="dict.type.award_rank" :value="scope.row.awardlevel" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖级别" align="center" prop="awardrank" sortable width="85px" show-overflow-tooltip> <el-table-column label="获奖级别" align="center" prop="awardrank" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.awards_level" :value="scope.row.awardrank" /> <dict-tag :options="dict.type.awards_level" :value="scope.row.awardrank" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="比赛名称" align="center" prop="resultname" sortable show-overflow-tooltip /> <el-table-column label="比赛名称" align="center" prop="resultname" sortable show-overflow-tooltip
<el-table-column label="获奖人" align="center" prop="username" sortable width="80px" show-overflow-tooltip /> :min-width="screenWidth * 0.05" />
<el-table-column label="指导教师" align="center" prop="guidanceteacher" sortable width="80px" <el-table-column label="获奖人" align="center" prop="username" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip />
<el-table-column label="指导教师" align="center" prop="guidanceteacher" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable width="100px" show-overflow-tooltip /> <el-table-column label="获奖时间" align="center" prop="awardtime" sortable show-overflow-tooltip
<el-table-column label="获奖时间" align="center" prop="awardtime" sortable show-overflow-tooltip width="95px"> :min-width="screenWidth * 0.04">
<!-- <template slot-scope="scope"> <!-- <template slot-scope="scope">
<span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span>
</template> --> </template> -->
</el-table-column> </el-table-column>
<el-table-column label="审核状态" align="center" prop="auditstate" sortable width="74" fixed="right"> <el-table-column label="审核状态" align="center" prop="auditstate" sortable :min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditstate" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditstate" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100" fixed="right"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
:min-width="screenWidth * 0.05">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['school:fudaos:edit']" v-hasPermi="['school:fudaos:edit']"
...@@ -391,6 +399,7 @@ export default { ...@@ -391,6 +399,7 @@ export default {
}, },
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
// 选择对应处理人 // 选择对应处理人
selectHandles: { selectHandles: {
id: null, id: null,
...@@ -502,10 +511,36 @@ export default { ...@@ -502,10 +511,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -842,4 +877,71 @@ export default { ...@@ -842,4 +877,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
...@@ -94,49 +94,56 @@ ...@@ -94,49 +94,56 @@
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" :data="honorsList" :header-cell-style="tableHeaderStyle" :fit="true" :data="honorsList"
@selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }"> @selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="成长类型" align="center" prop="type" width="80px" fixed="left" show-overflow-tooltip> <el-table-column label="成长类型" align="center" prop="type" width="80px" show-overflow-tooltip>
<template> <template>
<span>综合荣誉</span> <span>综合荣誉</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="学科" align="center" prop="sub" sortable fixed="left" width="65px" <el-table-column label="学科" align="center" prop="sub" sortable :min-width="screenWidth * 0.02"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖类别" align="center" prop="awardType" sortable width="80px" show-overflow-tooltip /> <el-table-column label="获奖类别" align="center" prop="awardType" sortable :min-width="screenWidth * 0.04"
<el-table-column label="获奖等级" align="center" prop="awardLevel" sortable width="80px" show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label="获奖等级" align="center" prop="awardLevel" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" /> <dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖级别" align="center" prop="awardRank" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖级别" align="center" prop="awardRank" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" /> <dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="综合荣誉-成果名称" align="center" prop="resultName" sortable width="150px" <el-table-column label="综合荣誉-成果名称" align="center" prop="resultName" sortable :min-width="screenWidth * 0.06"
show-overflow-tooltip />
<el-table-column label="获奖人" align="center" prop="userName" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="获奖人" align="center" prop="userName" sortable width="80px" show-overflow-tooltip /> <el-table-column label="获奖时间" align="center" prop="awardTime" :min-width="screenWidth * 0.04" sortable
<el-table-column label="主办单位" align="center" prop="org" sortable width="110px" show-overflow-tooltip /> show-overflow-tooltip>
<el-table-column label="获奖时间" align="center" prop="awardTime" width="100px" sortable show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="审核状态" align="center" prop="auditState" sortable width="80" fixed="right"> <el-table-column label="审核状态" align="center" prop="auditState" sortable :min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip /> <el-table-column label="备注" align="center" prop="remark" :min-width="screenWidth * 0.04" sortable
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" show-overflow-tooltip />
width="160px"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
:min-width="screenWidth * 0.06">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:honors:edit']" v-hasPermi="['system:honors:edit']"
...@@ -361,6 +368,7 @@ export default { ...@@ -361,6 +368,7 @@ export default {
dicts: ["teaching_subjects", 'award_categories', 'awards_level', 'award_rank', 'audit_states'], dicts: ["teaching_subjects", 'award_categories', 'awards_level', 'award_rank', 'audit_states'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
// 选择对应处理人 // 选择对应处理人
selectHandles: { selectHandles: {
id: null, id: null,
...@@ -443,10 +451,36 @@ export default { ...@@ -443,10 +451,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -784,4 +818,71 @@ export default { ...@@ -784,4 +818,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
...@@ -94,51 +94,58 @@ ...@@ -94,51 +94,58 @@
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" :data="worksList" :header-cell-style="tableHeaderStyle" :fit="true" :data="worksList"
@selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }"> @selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="40" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="40" align="center" sortable />
<el-table-column label="成长类型" align="center" fixed="left" width="80px" show-overflow-tooltip> <el-table-column label="成长类型" align="center" :min-width="screenWidth * 0.03" show-overflow-tooltip>
<template> <template>
<span>论文论著</span> <span>论文论著</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="学科" align="center" prop="sub" sortable fixed="left" width="60px" <el-table-column label="学科" align="center" prop="sub" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖类别" align="center" prop="awardType" sortable width="120px" show-overflow-tooltip> <el-table-column label="获奖类别" align="center" prop="awardType" sortable :min-width="screenWidth * 0.05"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_categories" :value="scope.row.awardType" /> <dict-tag :options="dict.type.award_categories" :value="scope.row.awardType" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖等级" align="center" prop="awardLevel" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖等级" align="center" prop="awardLevel" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" /> <dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖级别" align="center" prop="awardRank" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖级别" align="center" prop="awardRank" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" /> <dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="论文论著-成果名称" align="center" prop="resultName" sortable show-overflow-tooltip /> <el-table-column label="论文论著-成果名称" align="center" prop="resultName" :min-width="screenWidth * 0.06" sortable
<el-table-column label="获奖人" align="center" prop="userName" sortable width="80px" show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable width="110px" show-overflow-tooltip /> <el-table-column label="获奖人" align="center" prop="userName" sortable :min-width="screenWidth * 0.04"
<el-table-column label="获奖时间" align="center" prop="awardTime" width="100px" sortable show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable :min-width="screenWidth * 0.05"
show-overflow-tooltip />
<el-table-column label="获奖时间" align="center" prop="awardTime" :min-width="screenWidth * 0.04" sortable
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="审核状态" align="center" prop="auditState" sortable width="80" fixed="right"> <el-table-column label="审核状态" align="center" prop="auditState" sortable :min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
width="150px"> :min-width="screenWidth * 0.07">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:honors:edit']" v-hasPermi="['system:honors:edit']"
...@@ -368,6 +375,7 @@ export default { ...@@ -368,6 +375,7 @@ export default {
dicts: ["teaching_subjects", 'award_categories', 'awards_level', 'award_rank', 'audit_states'], dicts: ["teaching_subjects", 'award_categories', 'awards_level', 'award_rank', 'audit_states'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
// 选择对应处理人 // 选择对应处理人
selectHandles: { selectHandles: {
id: null, id: null,
...@@ -462,10 +470,36 @@ export default { ...@@ -462,10 +470,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
/** 查询论文著作列表 */ /** 查询论文著作列表 */
getList() { getList() {
this.loading = true; this.loading = true;
...@@ -761,4 +795,71 @@ export default { ...@@ -761,4 +795,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
...@@ -94,51 +94,58 @@ ...@@ -94,51 +94,58 @@
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" :data="awardsList" :header-cell-style="tableHeaderStyle" :fit="true" :data="awardsList"
@selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }"> @selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="成长类型" align="center" fixed="left" width="80px" show-overflow-tooltip> <el-table-column label="成长类型" align="center" :min-width="screenWidth * 0.03" show-overflow-tooltip>
<template> <template>
<span>讲课获奖</span> <span>讲课获奖</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="学科" align="center" prop="sub" sortable fixed="left" show-overflow-tooltip <el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip
width="65px"> :min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖类别" align="center" prop="awardType" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖类别" align="center" prop="awardType" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_categoriesjk" :value="scope.row.awardType" /> <dict-tag :options="dict.type.award_categoriesjk" :value="scope.row.awardType" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖等级" align="center" prop="awardLevel" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖等级" align="center" prop="awardLevel" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" /> <dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖级别" align="center" prop="awardRank" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖级别" align="center" prop="awardRank" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" /> <dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="讲课获奖-成果名称" align="center" prop="resultName" sortable show-overflow-tooltip /> <el-table-column label="讲课获奖-成果名称" align="center" prop="resultName" sortable :min-width="screenWidth * 0.04"
<el-table-column label="获奖人" align="center" prop="userName" sortable width="80px" show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable width="110px" show-overflow-tooltip /> <el-table-column label="获奖人" align="center" prop="userName" sortable :min-width="screenWidth * 0.04"
<el-table-column label="获奖时间" align="center" prop="awardTime" width="100px" sortable show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip />
<el-table-column label="获奖时间" align="center" prop="awardTime" :min-width="screenWidth * 0.04" sortable
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="审核状态" align="center" prop="auditState" sortable width="80" fixed="right"> <el-table-column label="审核状态" align="center" prop="auditState" sortable :min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
width="160px"> :min-width="screenWidth * 0.07">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:honors:edit']" v-hasPermi="['system:honors:edit']"
...@@ -367,6 +374,7 @@ export default { ...@@ -367,6 +374,7 @@ export default {
dicts: ["teaching_subjects", 'award_categoriesjk', 'awards_level', 'award_rank', 'audit_states'], dicts: ["teaching_subjects", 'award_categoriesjk', 'awards_level', 'award_rank', 'audit_states'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
// 选择对应处理人 // 选择对应处理人
selectHandles: { selectHandles: {
id: null, id: null,
...@@ -461,11 +469,36 @@ export default { ...@@ -461,11 +469,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
/** 查询讲课获奖列表 */ /** 查询讲课获奖列表 */
getList() { getList() {
this.loading = true; this.loading = true;
...@@ -760,4 +793,71 @@ export default { ...@@ -760,4 +793,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
...@@ -93,51 +93,57 @@ ...@@ -93,51 +93,57 @@
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" :data="worksList" :header-cell-style="tableHeaderStyle" :fit="true" :data="worksList"
@selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }"> @selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="成长类型" align="center" fixed="left" width="80px" show-overflow-tooltip> <el-table-column label="成长类型" align="center" :min-width="screenWidth * 0.04" show-overflow-tooltip>
<span>课题研究</span> <span>课题研究</span>
</el-table-column> </el-table-column>
<el-table-column label="学科" align="center" prop="sub" sortable fixed="left" width="60px" <el-table-column label="学科" align="center" prop="sub" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖类别" align="center" prop="awardType" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖类别" align="center" prop="awardType" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.project_research" :value="scope.row.awardType" /> <dict-tag :options="dict.type.project_research" :value="scope.row.awardType" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖等级" align="center" prop="awardLevel" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖等级" align="center" prop="awardLevel" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" /> <dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖级别" align="center" prop="awardRank" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖级别" align="center" prop="awardRank" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" /> <dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="课题研究-成果名称" align="center" prop="resultName" sortable show-overflow-tooltip /> <el-table-column label="课题研究-成果名称" align="center" prop="resultName" sortable :min-width="screenWidth * 0.05"
<el-table-column label="获奖人" align="center" prop="userName" sortable width="80px" show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable width="110px" show-overflow-tooltip /> <el-table-column label="获奖人" align="center" prop="userName" sortable :min-width="screenWidth * 0.04"
<el-table-column label="获奖时间" align="center" prop="awardTime" sortable width="100px" show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip />
<el-table-column label="获奖时间" align="center" prop="awardTime" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="审核状态" align="center" prop="auditState" sortable width="80" fixed="right"> <el-table-column label="审核状态" align="center" prop="auditState" sortable :min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150px" <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
fixed="right"> :min-width="screenWidth * 0.07">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:research:edit']" v-hasPermi="['system:research:edit']"
...@@ -371,6 +377,7 @@ export default { ...@@ -371,6 +377,7 @@ export default {
dicts: ["teaching_subjects", 'project_research', 'awards_level', 'award_rank', 'audit_states'], dicts: ["teaching_subjects", 'project_research', 'awards_level', 'award_rank', 'audit_states'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
// 选择对应处理人 // 选择对应处理人
selectHandles: { selectHandles: {
id: null, id: null,
...@@ -468,10 +475,36 @@ export default { ...@@ -468,10 +475,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -784,4 +817,71 @@ export default { ...@@ -784,4 +817,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
...@@ -97,51 +97,58 @@ ...@@ -97,51 +97,58 @@
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" :data="awardsList" :header-cell-style="tableHeaderStyle" :fit="true" :data="awardsList"
@selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }"> @selection-change="handleSelectionChange" :default-sort="{ prop: 'awardTime', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="成长类型" align="center" fixed="left" width="80px" show-overflow-tooltip> <el-table-column label="成长类型" align="center" :min-width="screenWidth * 0.03" show-overflow-tooltip>
<template> <template>
<span>教学获奖</span> <span>教学获奖</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="学科" align="center" prop="sub" sortable fixed="left" show-overflow-tooltip <el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip
width="60px"> :min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖类别" align="center" prop="awardType" sortable width="100px" show-overflow-tooltip> <el-table-column label="获奖类别" align="center" prop="awardType" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_categoriesjs" :value="scope.row.awardType" /> <dict-tag :options="dict.type.award_categoriesjs" :value="scope.row.awardType" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖等级" align="center" prop="awardLevel" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖等级" align="center" prop="awardLevel" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" /> <dict-tag :options="dict.type.award_rank" :value="scope.row.awardLevel" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖级别" align="center" prop="awardRank" sortable width="80px" show-overflow-tooltip> <el-table-column label="获奖级别" align="center" prop="awardRank" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" /> <dict-tag :options="dict.type.awards_level" :value="scope.row.awardRank" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="教学获奖-成果名称" align="center" prop="resultName" sortable show-overflow-tooltip /> <el-table-column label="教学获奖-成果名称" align="center" prop="resultName" :min-width="screenWidth * 0.05" sortable
<el-table-column label="获奖人" align="center" prop="userName" sortable width="80px" show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable width="100px" show-overflow-tooltip /> <el-table-column label="获奖人" align="center" prop="userName" sortable :min-width="screenWidth * 0.04"
<el-table-column label="获奖时间" align="center" prop="awardTime" sortable width="100px" show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label="主办单位" align="center" prop="org" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip />
<el-table-column label="获奖时间" align="center" prop="awardTime" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="审核状态" align="center" prop="auditState" sortable width="80" fixed="right"> <el-table-column label="审核状态" align="center" prop="auditState" sortable :min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
width="160px"> :min-width="screenWidth * 0.06">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['school:teacherAwards:edit']" v-hasPermi="['school:teacherAwards:edit']"
...@@ -368,6 +375,7 @@ export default { ...@@ -368,6 +375,7 @@ export default {
dicts: ["teaching_subjects", 'award_categoriesjs', 'awards_level', 'award_rank', 'audit_states'], dicts: ["teaching_subjects", 'award_categoriesjs', 'awards_level', 'award_rank', 'audit_states'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
// 选择对应处理人 // 选择对应处理人
selectHandles: { selectHandles: {
id: null, id: null,
...@@ -460,10 +468,36 @@ export default { ...@@ -460,10 +468,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
/** 查询教师获奖列表 */ /** 查询教师获奖列表 */
getList() { getList() {
this.loading = true; this.loading = true;
...@@ -758,4 +792,71 @@ export default { ...@@ -758,4 +792,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
...@@ -146,42 +146,49 @@ ...@@ -146,42 +146,49 @@
<el-table border :data="achievementsList" @selection-change="handleSelectionChange" @sort-change="sortChange" <el-table border :data="achievementsList" @selection-change="handleSelectionChange" @sort-change="sortChange"
:default-sort="{ prop: 'examTime', order: 'descending' }" :row-style="{ height: '1px' }" :default-sort="{ prop: 'examTime', order: 'descending' }" :row-style="{ height: '1px' }"
:cell-style="{ padding: '0px' }" :header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }"> :cell-style="{ padding: '0px' }" :header-cell-style="tableHeaderStyle" :fit="true">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="学年" align="center" prop="schoolYear" sortable fixed="left" width="80px" <el-table-column label="学年" align="center" prop="schoolYear" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="学期" align="center" prop="semester" sortable fixed="left" width="80px" <el-table-column label="学期" align="center" prop="semester" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" /> <dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="考试时间" align="center" prop="examTime" width="85" sortable show-overflow-tooltip> <el-table-column label="考试时间" align="center" prop="examTime" :min-width="screenWidth * 0.05" sortable
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.examTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.examTime, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="考试类型" align="center" prop="examType" sortable width="80px" show-overflow-tooltip> <el-table-column label="考试类型" align="center" prop="examType" sortable :min-width="screenWidth * 0.05"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.exam_typeda" :value="scope.row.examType" /> <dict-tag :options="dict.type.exam_typeda" :value="scope.row.examType" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="届别" align="center" prop="year" sortable show-overflow-tooltip width="50px" /> <el-table-column label="届别" align="center" prop="year" sortable show-overflow-tooltip
<el-table-column label="年级" align="center" prop="grade" sortable show-overflow-tooltip width="50px"> :min-width="screenWidth * 0.03" />
<el-table-column label="年级" align="center" prop="grade" sortable show-overflow-tooltip
:min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.grade_da" :value="scope.row.grade" /> <dict-tag :options="dict.type.grade_da" :value="scope.row.grade" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="姓名" align="center" prop="userName" width="70px" sortable show-overflow-tooltip /> <el-table-column label="姓名" align="center" prop="userName" :min-width="screenWidth * 0.04" sortable
<el-table-column label="学科" align="center" prop="sub" width="50px" sortable show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label="学科" align="center" prop="sub" :min-width="screenWidth * 0.04" sortable
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="班级" align="center" width="60px" prop="className" sortable show-overflow-tooltip> <el-table-column label="班级" align="center" :min-width="screenWidth * 0.04" prop="className" sortable
show-overflow-tooltip>
</el-table-column> </el-table-column>
<el-table-column label="班级类型" align="center" sortable show-overflow-tooltip width="80px"> <el-table-column label="班级类型" align="center" sortable show-overflow-tooltip :min-width="screenWidth * 0.05">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="getSelectedTypes(scope.row.classType).length > 0"> <span v-if="getSelectedTypes(scope.row.classType).length > 0">
<span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index"> <span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index">
...@@ -192,13 +199,16 @@ ...@@ -192,13 +199,16 @@
</template> </template>
</el-table-column> </el-table-column>
<!-- 新加 优生增量和常规增量--> <!-- 新加 优生增量和常规增量-->
<el-table-column label="常规增量" align="center" prop="cgzl" sortable show-overflow-tooltip width="80px" /> <el-table-column label="常规增量" align="center" prop="cgzl" sortable show-overflow-tooltip
<el-table-column label="优生增量" align="center" prop="yszl" sortable show-overflow-tooltip width="80px" /> :min-width="screenWidth * 0.05" />
<el-table-column label="优生增量" align="center" prop="yszl" sortable show-overflow-tooltip
:min-width="screenWidth * 0.05" />
<el-table-column label="增量分" align="center" prop="assessmentScore" sortable show-overflow-tooltip <el-table-column label="增量分" align="center" prop="assessmentScore" sortable show-overflow-tooltip
width="70px" /> :min-width="screenWidth * 0.05" />
<el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip /> <el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100px" :min-width="screenWidth * 0.06" />
fixed="right"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
:min-width="screenWidth * 0.07">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:achievements:edit']">修改</el-button> v-hasPermi="['system:achievements:edit']">修改</el-button>
...@@ -378,6 +388,7 @@ export default { ...@@ -378,6 +388,7 @@ export default {
dicts: ["teaching_subjects", 'semester_jsdzda', 'exam_typeda', 'grade_da', 'class_type', 'yearda', 'rankda', 'audit_states'], dicts: ["teaching_subjects", 'semester_jsdzda', 'exam_typeda', 'grade_da', 'class_type', 'yearda', 'rankda', 'audit_states'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
importing: false, importing: false,
uploadOpen: false, uploadOpen: false,
upload: { upload: {
...@@ -483,10 +494,36 @@ export default { ...@@ -483,10 +494,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -740,4 +777,71 @@ export default { ...@@ -740,4 +777,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
\ No newline at end of file
...@@ -84,44 +84,49 @@ ...@@ -84,44 +84,49 @@
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" v-loading="loading" :header-cell-style="tableHeaderStyle" :fit="true" v-loading="loading" :data="awardList"
:data="awardList" @selection-change="handleSelectionChange" @selection-change="handleSelectionChange" :default-sort="{ prop: 'schoolYear', order: 'descending' }">
:default-sort="{ prop: 'schoolYear', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="学年" align="center" prop="schoolYear" sortable fixed="left" width="80px" <el-table-column label="学年" align="center" prop="schoolYear" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="学期" align="center" prop="semester" sortable fixed="left" width="80px" <el-table-column label="学期" align="center" prop="semester" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" /> <dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="届别" align="center" prop="year" sortable show-overflow-tooltip width="60px"> <el-table-column label="届别" align="center" prop="year" sortable show-overflow-tooltip
:min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.rankda" :value="scope.row.year" /> <dict-tag :options="dict.type.rankda" :value="scope.row.year" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="年级" align="center" prop="grade" sortable show-overflow-tooltip width="70px"> <el-table-column label="年级" align="center" prop="grade" sortable show-overflow-tooltip
:min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.grade_da" :value="scope.row.grade" /> <dict-tag :options="dict.type.grade_da" :value="scope.row.grade" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip width="70px"> <el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip
:min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖情况" align="center" prop="awardSituation" sortable show-overflow-tooltip /> <el-table-column label="获奖情况" align="center" prop="awardSituation" :min-width="screenWidth * 0.04" sortable
show-overflow-tooltip />
<el-table-column label="团队成员贡献情况" align="center" prop="teamMembersContribution" sortable <el-table-column label="团队成员贡献情况" align="center" prop="teamMembersContribution" sortable
:min-width="screenWidth * 0.05" show-overflow-tooltip />
<el-table-column label="备注" align="center" prop="remark" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="备注" align="center" prop="remark" sortable width="90" show-overflow-tooltip /> <el-table-column label="审核状态" align="center" prop="auditState" sortable :min-width="screenWidth * 0.03">
<el-table-column label="审核状态" align="center" prop="auditState" sortable width="80" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditState" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150" fixed="right"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
:min-width="screenWidth * 0.06">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" @click="handleUpdate(scope.row)"
v-hasPermi="['system:honors:edit']" v-hasPermi="['system:honors:edit']"
...@@ -303,6 +308,7 @@ export default { ...@@ -303,6 +308,7 @@ export default {
dicts: ["teaching_subjects", 'semester_jsdzda', 'exam_typeda', 'grade_da', 'class_type', 'yearda', 'rankda', 'audit_states'], dicts: ["teaching_subjects", 'semester_jsdzda', 'exam_typeda', 'grade_da', 'class_type', 'yearda', 'rankda', 'audit_states'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
// 遮罩层 // 遮罩层
loading: true, loading: true,
query: false, query: false,
...@@ -370,7 +376,33 @@ export default { ...@@ -370,7 +376,33 @@ export default {
created() { created() {
this.getList(); this.getList();
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -583,4 +615,71 @@ export default { ...@@ -583,4 +615,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
\ No newline at end of file
...@@ -113,59 +113,66 @@ ...@@ -113,59 +113,66 @@
</el-row> </el-row>
<el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange" <el-table border :row-style="{ height: '1px' }" :cell-style="{ padding: '0px' }" @sort-change="sortChange"
:header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }" :data="awardsList" :header-cell-style="tableHeaderStyle" :fit="true" :data="awardsList"
@selection-change="handleSelectionChange" :default-sort="{ prop: 'awardtime', order: 'descending' }"> @selection-change="handleSelectionChange" :default-sort="{ prop: 'awardtime', order: 'descending' }">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable />
<el-table-column label="成长类型" align="center" fixed="left" width="90px" show-overflow-tooltip> <el-table-column label="成长类型" align="center" :min-width="screenWidth * 0.04" show-overflow-tooltip>
<template> <template>
<span>辅导老师获奖</span> <span>辅导老师获奖</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="学科" align="center" prop="sub" sortable fixed="left" width="50px" <el-table-column label="学科" align="center" prop="sub" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖类别" align="center" prop="awardtype" sortable width="95px" show-overflow-tooltip> <el-table-column label="获奖类别" align="center" prop="awardtype" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_type_fdjs" :value="scope.row.awardtype" /> <dict-tag :options="dict.type.award_type_fdjs" :value="scope.row.awardtype" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖等级" align="center" prop="awardlevel" sortable width="95px" show-overflow-tooltip> <el-table-column label="获奖等级" align="center" prop="awardlevel" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.award_rank" :value="scope.row.awardlevel" /> <dict-tag :options="dict.type.award_rank" :value="scope.row.awardlevel" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="获奖级别" align="center" prop="awardrank" sortable width="95px" show-overflow-tooltip> <el-table-column label="获奖级别" align="center" prop="awardrank" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.awards_level" :value="scope.row.awardrank" /> <dict-tag :options="dict.type.awards_level" :value="scope.row.awardrank" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="比赛名称" align="center" prop="competitionname" sortable="competition_name" <el-table-column label="比赛名称" align="center" prop="competitionname" :min-width="screenWidth * 0.04"
sortable="competition_name" show-overflow-tooltip />
<el-table-column label="获奖人" align="center" prop="username" sortable :min-width="screenWidth * 0.03"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="获奖人" align="center" prop="username" sortable width="70px" show-overflow-tooltip /> <el-table-column label="指导教师" align="center" prop="guidanceteacher" sortable :min-width="screenWidth * 0.04"
<el-table-column label="指导教师" align="center" prop="guidanceteacher" sortable width="95px"
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="辅导职责" align="center" prop="coachingr" sortable width="90px" show-overflow-tooltip> <el-table-column label="辅导职责" align="center" prop="coachingr" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.coachingr" :value="scope.row.coachingr" /> <dict-tag :options="dict.type.coachingr" :value="scope.row.coachingr" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="主办单位" align="center" prop="org" sortable width="100px" show-overflow-tooltip /> <el-table-column label="主办单位" align="center" prop="org" sortable :min-width="screenWidth * 0.04"
<el-table-column label="获奖时间" align="center" prop="awardtime" width="100px" sortable show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label="获奖时间" align="center" prop="awardtime" :min-width="screenWidth * 0.04" sortable
show-overflow-tooltip>
<!-- <template slot-scope="scope"> <!-- <template slot-scope="scope">
<span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.awardTime, '{y}-{m}-{d}') }}</span>
</template> --> </template> -->
</el-table-column> </el-table-column>
<el-table-column label="审核状态" align="center" prop="auditstate" sortable width="50" fixed="right"> <el-table-column label="审核状态" align="center" prop="auditstate" sortable :min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.audit_states" :value="scope.row.auditstate" /> <dict-tag :options="dict.type.audit_states" :value="scope.row.auditstate" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160px" <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
fixed="right"> :min-width="screenWidth * 0.07">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['school:fudaot:edit']" v-hasPermi="['school:fudaot:edit']"
...@@ -429,6 +436,7 @@ export default { ...@@ -429,6 +436,7 @@ export default {
}, },
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
// 选择对应处理人 // 选择对应处理人
selectHandles: { selectHandles: {
id: null, id: null,
...@@ -540,10 +548,36 @@ export default { ...@@ -540,10 +548,36 @@ export default {
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -881,4 +915,71 @@ export default { ...@@ -881,4 +915,71 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
...@@ -125,25 +125,29 @@ ...@@ -125,25 +125,29 @@
</el-row> </el-row>
<el-table border :data="assessmentList" @selection-change="handleSelectionChange" @sort-change="sortChange" <el-table border :data="assessmentList" @selection-change="handleSelectionChange" @sort-change="sortChange"
:default-sort="{ prop: 'schoolYear', order: 'descending' }" :row-style="{ height: '1px' }" :default-sort="{ prop: 'schoolYear', order: 'descending' }" :row-style="{ height: '1px' }"
:cell-style="{ padding: '0px' }" :header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }"> :cell-style="{ padding: '0px' }" :header-cell-style="tableHeaderStyle" :fit="true">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" />
<el-table-column label="学年" align="center" prop="schoolYear" sortable fixed="left" width="80px <el-table-column label="学年" align="center" prop="schoolYear" sortable :min-width="screenWidth * 0.04"
" show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="学期" align="center" prop="semester" sortable fixed="left" width="80px" <el-table-column label="学期" align="center" prop="semester" sortable :min-width="screenWidth * 0.04"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" /> <dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="届别" align="center" prop="year" sortable show-overflow-tooltip width="60px" /> <el-table-column label="届别" align="center" prop="year" sortable show-overflow-tooltip
<el-table-column label="年级" align="center" prop="grade" sortable show-overflow-tooltip width="60px"> :min-width="screenWidth * 0.03" />
<el-table-column label="年级" align="center" prop="grade" sortable show-overflow-tooltip
:min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.grade_da" :value="scope.row.grade" /> <dict-tag :options="dict.type.grade_da" :value="scope.row.grade" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="班级" align="center" prop="className" sortable show-overflow-tooltip width="60px" /> <el-table-column label="班级" align="center" prop="className" sortable show-overflow-tooltip
<el-table-column label="班级类型" align="center" prop="classType" sortable width="90px" show-overflow-tooltip> :min-width="screenWidth * 0.03" />
<el-table-column label="班级类型" align="center" prop="classType" sortable :min-width="screenWidth * 0.05"
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="getSelectedTypes(scope.row.classType).length > 0"> <span v-if="getSelectedTypes(scope.row.classType).length > 0">
<span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index"> <span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index">
...@@ -153,26 +157,32 @@ ...@@ -153,26 +157,32 @@
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="姓名" align="center" prop="teacherName" sortable show-overflow-tooltip width="75px" /> <el-table-column label="姓名" align="center" prop="teacherName" sortable show-overflow-tooltip
<el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip width="70px"> :min-width="screenWidth * 0.04" />
<el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip
:min-width="screenWidth * 0.03">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="德育考核成绩" align="center" prop="moralEduCheckAchievement" sortable width="60px" <el-table-column label="德育考核成绩" align="center" prop="moralEduCheckAchievement" sortable
show-overflow-tooltip /> :min-width="screenWidth * 0.05" show-overflow-tooltip />
<el-table-column label="智育考核成绩" align="center" prop="intellEduCheckAchievement" sortable width="60px" <el-table-column label="智育考核成绩" align="center" prop="intellEduCheckAchievement" sortable
show-overflow-tooltip /> :min-width="screenWidth * 0.05" show-overflow-tooltip />
<el-table-column label="考核结果" align="center" prop="assessmentResults" sortable width="80px"> <!-- 2.17新加 jzmydpj-->
<el-table-column label="家长满意度评价" align="center" prop="jzmydpj" sortable :min-width="screenWidth * 0.05" />
<el-table-column label="考核结果" align="center" prop="assessmentResults" sortable
:min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.assessment_results" :value="scope.row.assessmentResults" /> <dict-tag :options="dict.type.assessment_results" :value="scope.row.assessmentResults" />
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column label="总考核成绩" align="center" prop="totalCheckAchievement" sortable fixed="right" <!-- <el-table-column label="总考核成绩" align="center" prop="totalCheckAchievement" sortable fixed="right"
width="130px" /> --> width="130px" /> -->
<el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip /> <el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" :min-width="screenWidth * 0.05" />
width="150px"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width"
:min-width="screenWidth * 0.055">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:assessment:edit']">修改</el-button> v-hasPermi="['system:assessment:edit']">修改</el-button>
...@@ -257,7 +267,6 @@ ...@@ -257,7 +267,6 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="智育考核成绩" prop="intellEduCheckAchievement"> <el-form-item label="智育考核成绩" prop="intellEduCheckAchievement">
...@@ -265,6 +274,16 @@ ...@@ -265,6 +274,16 @@
clearable /> clearable />
</el-form-item> </el-form-item>
</el-col> </el-col>
<!-- 2.17新加 jzmydpj-->
<el-col :span="12">
<el-form-item label="家长满意度评价" prop="jzmydpj">
<el-input v-model="form.jzmydpj" placeholder="请输入" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="考核结果" prop="assessmentResults"> <el-form-item label="考核结果" prop="assessmentResults">
<el-select v-model="form.assessmentResults" clearable placeholder="请选择" <el-select v-model="form.assessmentResults" clearable placeholder="请选择"
...@@ -278,9 +297,6 @@ ...@@ -278,9 +297,6 @@
<el-input v-model="form.totalCheckAchievement" type="number" placeholder="请输入" clearable /> <el-input v-model="form.totalCheckAchievement" type="number" placeholder="请输入" clearable />
</el-form-item> --> </el-form-item> -->
</el-col> </el-col>
</el-row>
<el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="班级类型" prop="classType"> <el-form-item label="班级类型" prop="classType">
<el-select v-model="form.classType" placeholder="请选择" clearable style="width: 100%"> <el-select v-model="form.classType" placeholder="请选择" clearable style="width: 100%">
...@@ -290,6 +306,9 @@ ...@@ -290,6 +306,9 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row>
<el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="学科" prop="sub"> <el-form-item label="学科" prop="sub">
<el-select v-model="form.sub" placeholder="请选择" clearable style="width: 100%"> <el-select v-model="form.sub" placeholder="请选择" clearable style="width: 100%">
...@@ -306,7 +325,6 @@ ...@@ -306,7 +325,6 @@
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button> <el-button type="primary" @click="submitForm">确 定</el-button>
...@@ -356,6 +374,7 @@ export default { ...@@ -356,6 +374,7 @@ export default {
dicts: ["teaching_subjects", 'semester_jsdzda', 'exam_typeda', 'grade_da', 'class_type', 'yearda', 'rankda', 'appointment_situation', 'appointment_positions', 'class_num', 'audit_states', 'assessment_results'], dicts: ["teaching_subjects", 'semester_jsdzda', 'exam_typeda', 'grade_da', 'class_type', 'yearda', 'rankda', 'appointment_situation', 'appointment_positions', 'class_num', 'audit_states', 'assessment_results'],
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
importing: false, importing: false,
uploadOpen: false, uploadOpen: false,
upload: { upload: {
...@@ -443,6 +462,9 @@ export default { ...@@ -443,6 +462,9 @@ export default {
intellEduCheckAchievement: [ intellEduCheckAchievement: [
{ required: true, message: "智育考核成绩不能为空", trigger: "blur" } { required: true, message: "智育考核成绩不能为空", trigger: "blur" }
], ],
assessmentResults: [
{ required: true, message: "考核结果不能为空", trigger: "blur" }
],
totalCheckAchievement: [ totalCheckAchievement: [
{ required: true, message: "总成绩考核不能为空", trigger: "blur" } { required: true, message: "总成绩考核不能为空", trigger: "blur" }
], ],
...@@ -452,17 +474,41 @@ export default { ...@@ -452,17 +474,41 @@ export default {
sub: [ sub: [
{ required: true, message: "学科不能为空", trigger: "blur" } { required: true, message: "学科不能为空", trigger: "blur" }
], ],
assessmentResults: [
{ required: true, message: "考核结果不能为空", trigger: "blur" }
],
} }
}; };
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -561,6 +607,7 @@ export default { ...@@ -561,6 +607,7 @@ export default {
classType: null, classType: null,
sub: null, sub: null,
remark: null, remark: null,
jzmydpj: null,
createBy: null, createBy: null,
createTime: null, createTime: null,
updateBy: null, updateBy: null,
...@@ -700,4 +747,84 @@ export default { ...@@ -700,4 +747,84 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
::v-deep .el-table {
width: 100%;
height: 100%;
}
::v-deep .el-table__body-wrapper {
overflow-x: auto;
}
::v-deep .el-table .cell {
white-space: nowrap;
}
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
\ No newline at end of file
...@@ -147,47 +147,50 @@ ...@@ -147,47 +147,50 @@
<el-table border :data="aworkloadList" @selection-change="handleSelectionChange" @sort-change="sortChange" <el-table border :data="aworkloadList" @selection-change="handleSelectionChange" @sort-change="sortChange"
:default-sort="{ prop: 'schoolYear', order: 'descending' }" :row-style="{ height: '1px' }" :default-sort="{ prop: 'schoolYear', order: 'descending' }" :row-style="{ height: '1px' }"
:cell-style="{ padding: '0px' }" :header-cell-style="{ height: '50px', fontSize: '12px', padding: '0 0' }"> :cell-style="{ padding: '0px' }" :header-cell-style="tableHeaderStyle" :fit="true">
<el-table-column type="selection" width="30" align="center" /> <el-table-column type="selection" width="30" align="center" />
<el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" /> <el-table-column type="index" label="序号" width="30" align="center" sortable fixed="left" />
<el-table-column label="学年" align="center" prop="schoolYear" width="75px" fixed="left" sortable <el-table-column label="学年" align="center" prop="schoolYear" :min-width="screenWidth * 0.05" fixed="left"
show-overflow-tooltip /> sortable show-overflow-tooltip />
<el-table-column label="学期" align="center" prop="semester" fixed="left" sortable width="75px" <el-table-column label="学期" align="center" prop="semester" sortable :min-width="screenWidth * 0.05"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" /> <dict-tag :options="dict.type.semester_jsdzda" :value="scope.row.semester" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="届别" align="center" prop="year" fixed="left" width="50px" sortable <el-table-column label="届别" align="center" prop="year" :min-width="screenWidth * 0.03" sortable
show-overflow-tooltip /> show-overflow-tooltip />
<el-table-column label="年级" align="center" prop="grade" fixed="left" width="50px" sortable <el-table-column label="年级" align="center" prop="grade" :min-width="screenWidth * 0.03" sortable
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.grade_da" :value="scope.row.grade" /> <dict-tag :options="dict.type.grade_da" :value="scope.row.grade" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="姓名" align="center" prop="name" sortable width="65px" show-overflow-tooltip /> <el-table-column label="姓名" align="center" prop="name" sortable :min-width="screenWidth * 0.04"
<el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip width="50px"> show-overflow-tooltip />
<el-table-column label="学科" align="center" prop="sub" sortable show-overflow-tooltip
:min-width="screenWidth * 0.04">
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" /> <dict-tag :options="dict.type.teaching_subjects" :value="scope.row.sub" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="聘任岗位" align="center" prop="appointmentPost" sortable width="80px" <el-table-column label="聘任岗位" align="center" prop="appointmentPost" sortable :min-width="screenWidth * 0.05"
show-overflow-tooltip> show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.appointment_positions" :value="scope.row.appointmentPost" /> <dict-tag :options="dict.type.appointment_positions" :value="scope.row.appointmentPost" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="聘任职务" align="center" prop="appointmentPosition" sortable width="80px" <el-table-column label="聘任职务" align="center" prop="appointmentPosition" sortable
show-overflow-tooltip /> :min-width="screenWidth * 0.04" show-overflow-tooltip />
<el-table-column label="聘任情况" align="center" prop="appointmentSituation" sortable width="80px" <el-table-column label="聘任情况" align="center" prop="appointmentSituation" sortable
show-overflow-tooltip> :min-width="screenWidth * 0.04" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.appointment_situation" :value="scope.row.appointmentSituation" /> <dict-tag :options="dict.type.appointment_situation" :value="scope.row.appointmentSituation" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="班级" align="center" prop="className" sortable width="50px" show-overflow-tooltip /> <el-table-column label="班级" align="center" prop="className" sortable :min-width="screenWidth * 0.03"
<el-table-column label=" 班级类型" align="center" width="105px" show-overflow-tooltip> show-overflow-tooltip />
<el-table-column label=" 班级类型" align="center" :min-width="screenWidth * 0.09" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="getSelectedTypes(scope.row.classType).length > 0"> <span v-if="getSelectedTypes(scope.row.classType).length > 0">
<span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index"> <span v-for="(option, index) in getSelectedTypes(scope.row.classType)" :key="index">
...@@ -201,12 +204,15 @@ ...@@ -201,12 +204,15 @@
<el-table-column label="正课" align="center" prop="requiredCourses" sortable width="60px" show-overflow-tooltip /> <el-table-column label="正课" align="center" prop="requiredCourses" sortable width="60px" show-overflow-tooltip />
<el-table-column label="晚自习" align="center" prop="eveningSelfStudy" sortable width="70px" <el-table-column label="晚自习" align="center" prop="eveningSelfStudy" sortable width="70px"
show-overflow-tooltip /> --> show-overflow-tooltip /> -->
<el-table-column label="周课时量" align="center" prop="weeklyClassHours" sortable width="80px" /> <el-table-column label="周课时量" align="center" prop="weeklyClassHours" :min-width="screenWidth * 0.03"
sortable width="80px" />
<!-- <el-table-column label="合计" align="center" prop="amountTo" sortable show-overflow-tooltip /> --> <!-- <el-table-column label="合计" align="center" prop="amountTo" sortable show-overflow-tooltip /> -->
<el-table-column label="证明人" align="center" prop="userName" width="70px" sortable show-overflow-tooltip /> <el-table-column label="证明人" :min-width="screenWidth * 0.04" align="center" prop="userName" width="70px"
<el-table-column label="备注" align="center" prop="remark" sortable show-overflow-tooltip /> sortable show-overflow-tooltip />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150px" <el-table-column label="备注" :min-width="screenWidth * 0.06" align="center" prop="remark" sortable
fixed="right"> show-overflow-tooltip />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"
:min-width="screenWidth * 0.08">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" @click="handleUpdate(scope.row)"
v-hasPermi="['system:aworkload:edit']">修改</el-button> v-hasPermi="['system:aworkload:edit']">修改</el-button>
...@@ -718,6 +724,7 @@ export default { ...@@ -718,6 +724,7 @@ export default {
data() { data() {
return { return {
screenWidth: document.documentElement.clientWidth,
importing: false, importing: false,
uploadOpen: false, uploadOpen: false,
upload: { upload: {
...@@ -825,10 +832,36 @@ export default { ...@@ -825,10 +832,36 @@ export default {
} }
}; };
}, },
mounted() {
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 组件销毁前移除监听
window.removeEventListener('resize', this.handleResize)
},
created() { created() {
this.getList(); this.getList();
}, },
computed: {
// 添加表头样式计算属性
tableHeaderStyle() {
return {
background: '#F5F7FA',
height: this.screenWidth < 1400 ? 'auto' : '0px', // 小屏时自适应高度
padding: '4px 0',
fontSize: '12px',
wordBreak: 'break-word', // 允许在任意字符间换行
whiteSpace: 'pre-wrap', // 保留空格和换行
lineHeight: '1.2', // 适当的行高
}
},
},
methods: { methods: {
handleResize() {
// 更新屏幕宽度
this.screenWidth = document.documentElement.clientWidth
},
//排序列 //排序列
sortChange(data) { sortChange(data) {
console.log(data, 'data'); console.log(data, 'data');
...@@ -1105,4 +1138,84 @@ export default { ...@@ -1105,4 +1138,84 @@ export default {
padding-left: 0px !important; padding-left: 0px !important;
} }
::v-deep .el-table {
width: 100%;
height: 100%;
}
::v-deep .el-table__body-wrapper {
overflow-x: auto;
}
::v-deep .el-table .cell {
white-space: nowrap;
}
// 修改表头样式
::v-deep .el-table th.el-table__cell {
.cell {
// 小屏时表头文字样式
@media screen and (max-width: 1400px) {
white-space: pre-wrap !important; // 强制换行
height: auto !important;
line-height: 1.2 !important;
padding: 4px !important;
}
}
}
// 调整表头换行后的样式
::v-deep .el-table__header-wrapper {
.el-table__cell {
.cell {
display: flex;
align-items: center;
justify-content: center;
min-height: 28px; // 设置最小高度
}
}
}
// 确保内容区域不换行并显示省略号
::v-deep .el-table__body-wrapper {
.el-table__cell {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
// 操作列样式覆盖
::v-deep .operation-column {
.cell {
white-space: nowrap !important; // 强制不换行
overflow: visible !important; // 允许内容溢出
text-overflow: clip !important; // 不显示省略号
padding: 0 4px !important; // 调整内边距
}
.operation-buttons {
display: flex;
justify-content: center;
align-items: center;
.el-button {
margin: 0 2px !important; // 调整按钮间距
padding: 0 4px !important; // 调整按钮内边距
}
}
}
// 确保内容区域不换行并显示省略号的样式不应用于操作列
::v-deep .el-table__body-wrapper {
.el-table__cell:not(.operation-column) {
.cell {
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment