Skip to content

D
dd_school
Commit a0a988c3 by wangjian
Options

Merge remote-tracking branch 'origin/master'

parents 67cffe68 50bf5266
Showing with 1500 additions and 215 deletions
ruoyi-ui/src/views/smartSchool/electronicArchives/assessmentView/index.vue
...@@ -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
ruoyi-ui/src/views/smartSchool/electronicArchives/examinationScore/index.vue
...@@ -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>
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/awardTutoringstu/index.vue
...@@ -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>
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/comprehensiveHonors/index.vue
...@@ -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>
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/essaysWritings/index.vue
...@@ -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>
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/lectureAwards/index.vue
...@@ -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>
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/projectResearch/index.vue
...@@ -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>
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/teacherAwards/index.vue
...@@ -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>
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/teachingAchievements/index.vue
...@@ -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
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/teamAward/index.vue
...@@ -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
ruoyi-ui/src/views/smartSchool/electronicArchives/professionalDevelopment/tutorAward/index.vue
...@@ -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