Commit a81275cd by zhaopanyu

zpy

parent f6c045be
...@@ -27,31 +27,31 @@ ...@@ -27,31 +27,31 @@
<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;
......
...@@ -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: 208px" 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
...@@ -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>
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