forked from liweijie/education
Compare commits
2 Commits
c2cc535d80
...
b34efc847d
| Author | SHA1 | Date | |
|---|---|---|---|
 yangbin
|
b34efc847d | ||
|
yangbin
|
be7b91ac20 |
@@ -98,6 +98,15 @@
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
// 教学管理系统的列表字段统一居中，避免各业务页面单独声明后出现视觉错位。
|
||||
.el-table__cell,
|
||||
.el-table__cell.is-left,
|
||||
.el-table__cell.is-right,
|
||||
.el-table__cell.is-center,
|
||||
.el-table__cell > .cell {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.el-table__header-wrapper, .el-table__fixed-header-wrapper {
|
||||
th {
|
||||
word-break: break-word;
|
||||
@@ -129,6 +138,17 @@
|
||||
.el-table__fixed-body-wrapper.is-dragging {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
// 横向滚动条被隐藏后，Element UI 仍会为右侧固定列预留滚动条高度。
|
||||
// 仅在宽表格发生横向溢出时补齐该高度，保证“操作”列与普通数据行底部对齐。
|
||||
&.el-table--scrollable-x .el-table__fixed-right {
|
||||
height: 100% !important; // 组件通过行内样式写入高度，只能在此处覆盖。
|
||||
}
|
||||
|
||||
&.el-table--scrollable-x .el-table__fixed-right .el-table__fixed-body-wrapper {
|
||||
bottom: 0;
|
||||
height: auto !important; // 组件通过行内样式写入高度，只能在此处覆盖。
|
||||
}
|
||||
}
|
||||
|
||||
/* 表格横拖期间锁定整页光标与文本选中：
|
||||
|
||||
@@ -29,7 +29,6 @@
|
||||
size="small"
|
||||
filterable
|
||||
class="semester-select"
|
||||
popper-class="semester-select-popper"
|
||||
@change="handleSwitch"
|
||||
>
|
||||
<el-option
|
||||
@@ -224,10 +223,10 @@ export default {
|
||||
}
|
||||
|
||||
&__switch {
|
||||
background: rgba(255, 255, 255, 0.09);
|
||||
border: 1px solid rgba(255, 255, 255, 0.16);
|
||||
padding: 0 16px;
|
||||
border-radius: 7px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
height: 36px;
|
||||
|
||||
/* 用一层定高 flex 容器包裹 select，彻底隔离其默认行高外溢 */
|
||||
@@ -248,83 +247,40 @@ export default {
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
color: #fff !important;
|
||||
border-radius: 7px;
|
||||
height: 36px;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
caret-color: transparent;
|
||||
|
||||
&::placeholder {
|
||||
color: rgba(255, 255, 255, 0.7) !important;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner:hover {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
/* 去掉 focus 时的蓝色外光晕（Element 默认 box-shadow） */
|
||||
::v-deep .el-input__inner:focus,
|
||||
::v-deep .el-select .el-input__inner:focus,
|
||||
::v-deep .el-select .el-input.is-focus .el-input__inner {
|
||||
border-color: transparent !important;
|
||||
box-shadow: none !important;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
::v-deep .el-input__icon {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
/* 学期下拉浮层渲染在 body 下，scoped 无法命中，故用非 scoped 样式通过 popper-class 单独定制，
|
||||
使其与顶部深色栏视觉统一（仅作用于 SemesterBar 的下拉，不影响页面其他 select）。 */
|
||||
.semester-select-popper {
|
||||
background: #084c3f !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.14) !important;
|
||||
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35) !important;
|
||||
/* 顶部学期选择器使用导航栏色系，避免被全局白色表单控件样式覆盖。 */
|
||||
#app .semester-bar__switch .semester-select {
|
||||
.el-input__inner {
|
||||
height: 36px;
|
||||
padding: 0 34px 0 13px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.22);
|
||||
border-radius: 7px;
|
||||
color: #ffffff;
|
||||
background: rgba(255, 255, 255, 0.10);
|
||||
box-shadow: none;
|
||||
|
||||
.el-select-dropdown__list {
|
||||
padding: 4px;
|
||||
&::placeholder {
|
||||
color: rgba(255, 255, 255, 0.68);
|
||||
}
|
||||
|
||||
.el-select-dropdown__item {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
border-radius: 5px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
|
||||
&.hover,
|
||||
&:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
color: #fff;
|
||||
border-color: rgba(255, 255, 255, 0.38);
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
background: rgba(255, 255, 255, 0.16);
|
||||
}
|
||||
|
||||
/* 关键选项的选中图标保持可见 */
|
||||
.el-select-dropdown__item span {
|
||||
color: #fff;
|
||||
&:focus {
|
||||
border-color: rgba(255, 255, 255, 0.55);
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
}
|
||||
|
||||
.el-scrollbar__bar.is-vertical {
|
||||
> div {
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
.el-input__icon {
|
||||
color: rgba(255, 255, 255, 0.82);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -15,108 +15,117 @@
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleQuery">查询</el-button>
|
||||
<el-button type="primary" plain @click="handleAdd">新增{{ currentTitle }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 数据表格 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<div class="table-title">{{ currentTitle }}</div>
|
||||
<div class="list-toolbar">
|
||||
<el-button type="primary" plain size="small" @click="handleAdd">新增{{ currentTitle }}</el-button>
|
||||
</div>
|
||||
|
||||
<!-- 课时费方案 -->
|
||||
<el-table
|
||||
ref="tableRef"
|
||||
v-loading="currentState.loading"
|
||||
:data="currentState.list"
|
||||
v-if="activeTab === 'fee'"
|
||||
v-loading="feeState.loading"
|
||||
:data="feeState.list"
|
||||
border
|
||||
stripe
|
||||
class="plan-data-table"
|
||||
style="width: 100%"
|
||||
>
|
||||
<template v-if="activeTab === 'fee'">
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="bh" label="编号" width="150" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="mc" label="名称" min-width="130" show-overflow-tooltip />
|
||||
<el-table-column prop="mrbzksl" label="默认标准课时量" width="120" align="right" header-align="center">
|
||||
<el-table-column prop="mrbzksl" label="默认标准课时量" width="120" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mrbzksl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mrksfbz" label="默认课时费标准" width="120" align="right" header-align="center">
|
||||
<el-table-column prop="mrksfbz" label="默认课时费标准" width="120" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mrksfbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mrclksfbz" label="默认超量课时费标准" width="150" align="right" header-align="center">
|
||||
<el-table-column prop="mrclksfbz" label="默认超量课时费标准" width="150" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mrclksfbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="xgjxbzksfbz" label="相关教学补助课时费标准" width="180" align="right" header-align="center">
|
||||
<el-table-column prop="xgjxbzksfbz" label="相关教学补助课时费标准" width="180" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.xgjxbzksfbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxyxbz" label="绩效优秀补助" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="jxyxbz" label="绩效优秀补助" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxyxbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxlhbz" label="绩效良好补助" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="jxlhbz" label="绩效良好补助" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxlhbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxzdbz" label="绩效中等补助" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="jxzdbz" label="绩效中等补助" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxzdbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxjgbz" label="绩效及格补助" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="jxjgbz" label="绩效及格补助" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxjgbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxbjgbz" label="绩效不及格补助" width="120" align="right" header-align="center">
|
||||
<el-table-column prop="jxbjgbz" label="绩效不及格补助" width="120" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxbjgbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sm" label="说明" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="200" align="center" fixed="right" class-name="op-cell">
|
||||
<el-table-column label="操作" width="180" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<div class="table-actions">
|
||||
<el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
|
||||
<el-button type="text" size="small" @click="handleEdit(row)">修改</el-button>
|
||||
<el-button type="text" size="small" class="text-danger" @click="handleDelete(row)">删除</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
|
||||
<template v-else>
|
||||
<!-- 课时方案 -->
|
||||
<el-table
|
||||
v-else
|
||||
v-loading="coeffState.loading"
|
||||
:data="coeffState.list"
|
||||
border
|
||||
stripe
|
||||
class="plan-data-table"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="bh" label="编号" width="150" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="mc" label="名称" min-width="130" show-overflow-tooltip />
|
||||
<el-table-column prop="zjksxs" label="主讲课时系数" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="zjksxs" label="主讲课时系数" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.zjksxs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="fjksxs" label="辅讲课时系数" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="fjksxs" label="辅讲课时系数" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.fjksxs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mbxyrs" label="满班学员人数" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="mbxyrs" label="满班学员人数" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mbxyrs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="dz10xybjxs" label="递增10学员班级系数" width="150" align="right" header-align="center">
|
||||
<el-table-column prop="dz10xybjxs" label="递增10学员班级系数" width="150" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.dz10xybjxs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="bjxssx" label="班级系数上限" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="bjxssx" label="班级系数上限" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.bjxssx) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="d78jksl" label="第78节课时量" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="d78jksl" label="第78节课时量" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.d78jksl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="yjksl" label="夜间课时量" width="100" align="right" header-align="center">
|
||||
<el-table-column prop="yjksl" label="夜间课时量" width="100" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.yjksl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mrktjxffxs" label="默认课堂教法系数" width="130" align="right" header-align="center">
|
||||
<el-table-column prop="mrktjxffxs" label="默认课堂教法系数" width="130" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mrktjxffxs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="hbxszl" label="合班系数增量" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="hbxszl" label="合班系数增量" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.hbxszl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="hbxssx" label="合班系数上限" width="110" align="right" header-align="center">
|
||||
<el-table-column prop="hbxssx" label="合班系数上限" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.hbxssx) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sm" label="说明" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="120" align="center" fixed="right" class-name="op-cell">
|
||||
<el-table-column label="操作" width="140" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<div class="table-actions">
|
||||
<el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
|
||||
<el-button type="text" size="small" @click="handleEdit(row)">修改</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
@@ -475,9 +484,6 @@ export default {
|
||||
state.total = 0
|
||||
}).finally(() => {
|
||||
state.loading = false
|
||||
this.$nextTick(() => {
|
||||
this.$refs.tableRef && this.$refs.tableRef.doLayout()
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
@@ -648,6 +654,13 @@ export default {
|
||||
}
|
||||
|
||||
.plan-page {
|
||||
.list-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
// ==================== 1. 查询区域 ====================
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
@@ -661,37 +674,13 @@ export default {
|
||||
|
||||
// ==================== 2. 数据表格 ====================
|
||||
.table-card {
|
||||
.table-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.list-toolbar {
|
||||
.table-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
::v-deep .el-table .cell {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 修复操作栏 cell 底部错位:
|
||||
el-button--small 实际高度 30px, 但 .cell 默认 line-height:23px 装不下,
|
||||
按钮溢出 cell 顶部被 overflow:hidden 截掉, 导致按钮底部离行底比文字列小 12px。
|
||||
把 td 上下 padding 去掉、cell line-height 改成 30px, 让 cell 高度 = 按钮高度,
|
||||
并把 cell 顶端贴 td 顶端, 按钮底部就与文字列底部对齐(都离 td 底约 17px)。 */
|
||||
::v-deep .op-cell {
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
::v-deep .op-cell > .cell {
|
||||
line-height: 30px !important;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
Reference in New Issue
Block a user