* { margin: 0; padding: 0; box-sizing: border-box; } ul, li { list-style: none; margin: 0; padding: 0; } //页面最高层级 统一最底层背景色 #F0F4FB .layout { position: relative; min-height: 100%; margin: 0 auto; padding-bottom: 30px; overflow-y: hidden; background-color: #f0f4fb; } .layoutMain { width: 1200px; margin: 0 auto; margin-top: 60px; min-height: 100%; margin-left: 0; margin-right: 0; } #app > div { height: 100%; } html, body { width: 100%; height: 100%; overflow: hidden; font-family: Inter, -apple-system, BlinkMacSystemFont, PingFang SC, Hiragino Sans GB, noto sans, Helvetica Neue, Helvetica, Arial, sans-serif; } // .module_content { // padding: 16px; // margin-bottom: 20px; // border-radius: 10px; // background: #fff; // .module_title { // display: flex; // justify-content: space-between; // margin-bottom: 16px; // .title_left, .title_right { // display: flex; // gap: 10px; // } // } // } .el-select .el-select__wrapper, .el-input .el-input__wrapper, .el-date-editor.el-input, .el-button { height: 36px; } .el-button:focus { outline: none; } .el-input-group__append { width: 36px; } .el-button.is-text { padding: 0 5px; font-weight: 400; } .el-button.is-text:not(.is-disabled):active, .el-button.is-text:not(.is-disabled):hover { background: none; } .el-button.button_background { background: #2E64FA; border: 1px solid #2E64FA; color: #fff; &:hover { background: #2E64FA; } &.actiive { border: none; } } .el-button.button_border { background: #fff; border: 1px solid #2E64FA; color: #2E64FA; &:hover { background: none; } } .el-button.button_border_gray { background: #fff; border: 1px solid #BBBBBB; color: #BBBBBB; &:hover { background: none; } &.cancel { color: #606266; } } .el-checkbox__input.is-indeterminate .el-checkbox__inner, .el-checkbox__input.is-checked .el-checkbox__inner { background: #2E64FA; border-color: #2E64FA; } .el-radio__input.is-checked .el-radio__inner { background: #2E64FA; border-color: #2E64FA; } .el-radio__input.is-checked+.el-radio__label { color: #2E64FA; } .el-select-dropdown__item.is-selected { color: #2E64FA; } .el-dropdown-menu__item:not(.is-disabled):focus, .el-dropdown-menu__item:not(.is-disabled):hover { color: #2E64FA; } // 全局滚动条样式修改 /* 滚动条轨道区域样式 */ ::-webkit-scrollbar { width: 8px; height: 8px; /* 设置滚动条宽度为8像素 */ background-color: transparent; } /* 滑块样式 */ ::-webkit-scrollbar-thumb { background-color: #b8b8b8; /* 设置滑块颜色为深灰色 */ border-radius: 4px; max-height: 150px;//设置手柄最大高度 /* 设置滑块边角半径为4像素 */ } /* 滚动条轨道内部空白区域样式 */ ::-webkit-scrollbar-track { background-color: #f0f0f0; /* 设置轨道背景色为浅灰色 */ } /* 滚动条两端按钮样式 */ ::-webkit-scrollbar-button { display: none; /* 不显示按钮 */ } /* 交叉点处的区域样式 */ ::-webkit-scrollbar-corner { background-color: transparent; /* 设置交叉点处的背景色为透明 */ } /* 调整大小手柄样式 */ ::-webkit-resizer { display: none; /* 不显示调整大小手柄 */ } .vxe-table { font-family: revert; /* 不设置 font-family,浏览器使用默认字体 */ } .page_tree { width: 100%; border: 1px solid rgb(238, 238, 238); overflow-y: auto; border-radius: 6px; .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content { background: #e3eeff !important; color: #2e64fa !important; border-radius: 4px; padding: 5px 4px; .el-icon-caret-right { color: #2e64fa !important; } } .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content { background-color: red; } .el-tree-node .el-tree-node__content:hover { background-color: #f0f2f5; /* 悬浮时的背景色 */ border-radius: 4px; padding: 5px 4px; } .el-tree-node .el-tree-node__content { padding: 5px 4px; } } .page_jg_10 { width: 100%; height: 10px; } //通用间隔 .page_jg { clear: both; height: 12px; width: 100%; } //通用间隔20px .page_jg_20 { clear: both; height: 20px; width: 100%; } //通用间隔18px .page_jg_18 { clear: both; height: 18px; width: 100%; } //通用间隔16px .page_jg_16 { clear: both; height: 16px; width: 100%; } //通用间隔10px .page_jg_10 { clear: both; height: 10px; width: 100%; } //页面表格公共样式 .page_table { //表格竖着的边框线样式 th.el-table__cell { border-right: 1px solid #ebeef5; } th.el-table__cell:nth-last-child(2) { border-right: none; // 去掉最后一个单元格的右侧边框 最右边还有个滚动条的 所以要去掉倒数第二个 } .el-table { border-radius: 8px; border: 1px solid #f0f2f5; border-bottom: 0px solid #f0f2f5; .el-table__body-wrapper { table { tr { td { border-right: 1px solid #ebeef5; } td:last-child, th:last-child { border-right: 0px solid green; } } } } .el-table__empty-block { min-height: 120px; background-image: url("../assets/bg/table_no_data.png"); background-size: 64px 72px; background-position: 50% 50%; background-repeat: no-repeat; .el-table__empty-text { display: none; } } } //表格加载动画字体 .el-loading-spinner .el-loading-text { font-size: 14px; } .el-loading-spinner i { font-size: 20px; color:#2E64FA; } //表格里的输入框 选择框样式覆盖 .el-input__inner { height: 36px !important; line-height: 36px !important; } // 下拉选择框 中间箭头上下居中 .el-select .el-input .el-select__caret { height: 36px; } // 下拉选择框 中间箭头上下居中 .el-input__icon { line-height: 36px; } //去掉滚动条后的表格整体宽度 .el-table__body { width: 100% !important; } .el-table { border-radius: 8px; } //标题栏背景色 .el-table tr th.el-table__cell { background-color: #f4f6f8 !important; font-size: 16px; color: #333; font-weight: 600; } .el-table .cell { padding: 0 5px !important; } .el-table thead { color: #333 !important; font-weight: 500; font-size: 14px; height: 52px; .is-left { padding-left: 10px; //靠左的标题加10边距 } } .el-table .el-table__cell { padding: 0; height: 52px; color:#666; } // 列表行名称 .page_table_row_name { width: 100%; display: flex; justify-content: flex-start; align-items: center; display: block; overflow: hidden; /* 隐藏超出容器的内容 */ white-space: nowrap; /* 保持文本在一行内 */ text-overflow: ellipsis; /* 超出部分显示省略号 */ cursor: pointer; padding-right: 5px; padding-left: 5px; } //表格扫描列表状态 .table_row_scan_state { display: flex; justify-content: center; align-items: center; // 未扫描 .state_no_scan { width: 5px; height: 5px; background-color: #999999; border-radius: 50%; margin-right: 3px; } // 已上传 .state_success_upload { width: 5px; height: 5px; background-color: #2bc644; border-radius: 50%; margin-right: 3px; } // 缺考 .state_success_upload { width: 5px; height: 5px; background-color: #e49334; border-radius: 50%; margin-right: 3px; } } //表格 标签样式层 .tag_content { text-align: center; display: flex; justify-content:center; flex-wrap: wrap; padding:8px; gap: 8px; .content_teacher { min-width: 90px; height: 34px; font-weight: 400; font-size: 14px; color: #2E64FA ; text-align: center; line-height: 34px; background: rgba(46,100,250,0.1); border-radius: 4px; display: flex; justify-content: space-between; align-items: center; padding:0 8px; i { cursor: pointer; margin-left: 10px; } i:hover { color:red; } } .content_teacher:last-child { margin-bottom: 0; } .content_item { width: 90px; height: 34px; font-weight: 400; font-size: 14px; color: #CCCCCC; text-align: center; line-height: 34px; background-color: #f3f3f3; border-radius: 4px; cursor: pointer; } .content_text { width: 90px; height: 34px; font-weight: 400; font-size: 14px; color: #666666; text-align: center; line-height: 34px; background-color: #f3f3f3; border-radius: 4px; cursor: pointer; } img { width: 12px; height: 12px; cursor: pointer; } } //表格 教学班样式 .tag_teacher_content { display: flex; justify-content:space-between; img { width: 12px; height: 12px; cursor: pointer; } .content_title { width: auto; padding-left: 10px; display: flex; align-items: center; //内容超出加省略号 overflow: hidden; text-emphasis: ellipsis; white-space: nowrap; } .content_value { width: calc(100% - 80px); display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 5px; padding: 5px; .content_teacher { min-width: 90px; max-width: 100px; height: 34px; font-weight: 400; font-size: 14px; color: #2E64FA ; text-align: center; line-height: 34px; background: rgba(46,100,250,0.1); border-radius: 4px; display: flex; justify-content:space-between; align-items: center; padding:0 8px; i { cursor: pointer; margin-left: 10px; } } .content_teacher:last-child { margin-bottom: 0; } .content_item { width: 90px; height: 34px; font-weight: 400; font-size: 14px; color: #CCCCCC; text-align: center; line-height: 34px; background-color: #f3f3f3; border-radius: 4px; cursor: pointer; } .content_text { width: 90px; height: 34px; font-weight: 400; font-size: 14px; color: #666666; text-align: center; line-height: 34px; background-color: #f3f3f3; border-radius: 4px; cursor: pointer; } } } .table_header { width: calc(100% - 20px); margin: auto; position: relative; display: flex; justify-content: center; align-items: center; gap: 10px; .group_name { width: calc(100% - 20px); height: 32px !important; background-color: #ffffff; border-radius: 4px 4px 4px 4px; // border:1px solid #E4E7ED; margin-right: 2px; } .el-input__inner { padding: 0px 5px !important; height: 32px !important; text-align: center; } .el-icon-circle-close { cursor: pointer; } } .table_input { width: calc(100% - 20px); margin: auto; .el-input__inner { padding: 0px 5px !important; height: 36px !important; text-align: center; } } .add_icon { width: 20px; height: 20px; border-radius: 50%; text-align: center; line-height: 20px; color:black; display: inline-block; background-color: rgba(255,255,255,1); cursor: pointer; } .add_icon_disable { width: 20px; height: 20px; border-radius: 100%; text-align: center; line-height: 20px; color:#eeeeee; display: inline-block; background-color: gray; cursor: not-allowed; } //表格内容样式 居中 .table_row_content { // span // { // margin-right: 10px; // } } //表格扫描列表答案 .table_row_answer { width: 100%; cursor: pointer; display: block; overflow: hidden; /* 隐藏超出容器的内容 */ white-space: nowrap; /* 保持文本在一行内 单行显示 */ text-overflow: ellipsis; /* 超出部分显示省略号 */ span { margin-left: 2px; } } //系统设置输入框 .rank_input { width: 100%; height: auto; display: flex; justify-content: center; align-items: center; gap: 5px; .el-input__inner { padding: 0px 0px; text-align: center; } .input_number { width: 100px; display: flex; align-items: center; justify-content: space-around; font-size: 16px; color:#333; .el-input__inner { width: 64px; text-align: center; } } .input_symbol { width: 100px; } .input_text { padding: 0 5px; } .input_numbers { width: 159px; .el-input__inner { width: 159px; padding: 0px 5px !important; height: 36px !important; text-align: center; } } } .rate_input { position: relative; font-size: 16px; color:#333333; font-weight: 400; .el-select { .el-input__inner { padding: 0px 15px; text-align: left; // padding-bottom: 5px; } } .el-input__inner { padding: 0px 10px; text-align: center; } .error_message { position: absolute; bottom: 0px; right: 20%; color: red; font-size: 12px; } .input_error { .el-input__inner { border: 1px solid red; } } .symbol_rate { margin-left: 5px; } } .input_name { .el-input__inner { text-align: left; } } } .table_no_bg { .el-table__empty-block { // background-color: red; // min-height: 120px; min-height: auto !important; background-image: none !important; background-size: 64px 72px; background-position: 50% 50%; background-repeat: no-repeat; .el-table__empty-text { display: block !important; } } } //42行高 .table_row_42 { .el-table thead { color: #333 !important; font-weight: 500; font-size: 14px; height: 42px !important; } .el-table .el-table__cell { padding: 0; height: 42px !important; } } //状态 .table_row_status { font-weight: 400; font-size: 14px; color: #666666; display: flex; align-items: center; justify-content: center; gap: 5px; //不计入 灰色 .not_included_icon { margin-left: 5px; width: 6px; height: 6px; border-radius: 50%; background: #C0C4CC; } //异常的 红色 .abnormal_icon { margin-left: 5px; width: 6px; height: 6px; border-radius: 50%; background: #fa3a2e; } //正常的 绿色的 .normal_icon { margin-left: 5px; width: 6px; height: 6px; background: #2bc644; border-radius: 50%; } //分析管理 已发布 .yes_release_icon { margin-left: 5px; width: 6px; height: 6px; background: #2bc644; border-radius: 50%; } //分析管理 未发布 缺考 .no_release_icon { margin-left: 5px; width: 6px; height: 6px; background: #fb9f34; border-radius: 50%; } //分析管理 已关闭 违纪 .ready_close_icon { margin-left: 5px; width: 6px; height: 6px; background: #f56c6c; border-radius: 50%; } //分析管理 需汇总 .need_summary_icon { margin-left: 5px; width: 6px; height: 6px; background: #2e64fa; border-radius: 50%; } //分析管理 成绩中 .score_look_icon { margin-left: 5px; width: 6px; height: 6px; background: #995FB3; border-radius: 50%; } } //考试列表页面样式 .page_exam_list { width: 100%; height: calc(100% - 150px); //我的考试列表页 .list_card { margin-bottom: 20px; border-radius: 6px; border: 1px solid #ebeef5; .card_head { padding: 10px; font-size: 14px; display: flex; justify-content: space-between; align-items: center; background-color: rgba(46, 100, 250, 0.03); // border: 1px solid #DCDFE6; // border-bottom: 0px solid #DCDFE6; .exam_type { width: 46px; height: 48px; line-height: 48px; text-align: center; background: #2e64fa; color: #fff; border-radius: 5px; font-size: 16px; } .head_info { width: calc(100% - 56px); .info_title { display: flex; justify-content: space-between; align-items: center; height: 25px; line-height: 25px; .title_left { display: flex; justify-content: flex-start; align-items: center; gap: 10px; } .title_span { font-weight: 600; font-size: 18px; color: #666; line-height: 23px; text-align: left; font-style: normal; text-transform: none; } .title_score { width: 32px; height: 20px; background-color:#2BC64420; color:#2BC644; font-size: 12px; text-align: center; line-height: 20px; border-radius: 4px; } .title_button { font-weight: 400; font-size: 16px; color: #2e64fa; text-align: left; font-style: normal; text-transform: none; margin-left: 20px; } .title_icon { width: 50px; height: 100%; float: right; text-align: right; } } .info_other { display: flex; justify-content: space-between; height: 20px; line-height: 20px; .other_message { font-size: 14px; color: #909399; font-weight: 500; span { margin-right: 16px; } .span_tooltip { cursor: pointer; } .span_score { font-weight: 500; font-size: 16px; color: #f56c6c; } } .other_button { background-attachment: red; .el-button--text { padding: 0 !important; font-size: 14px; } .editor_btn { color: #2e64fa; } .delete_btn { color: #f56c6c; } } } } } .card_table { // width:calc(100% - 2px); margin: auto; border-top: 1px solid #ebeef5; th.el-table__cell { border-right: 1px solid #ebeef5; } th.el-table__cell:nth-last-child(2) { border-right: none; // 去掉最后一个单元格的右侧边框 最右边还有个滚动条的 所以要去掉倒数第二个 } .el-table { // border: none !important; // 移除表格边框 // border-bottom: none !important; // 移除表格底部边框 border-radius: 6px; .el-table__body-wrapper { // border: none !important; // 移除表格主体边框 table { tr { td { border-right: 1px solid #ebeef5; } td:last-child, th:last-child { border-right: 0px solid green; } } } } } .el-table .cell { padding: 0 5px !important; // display: flex; // justify-content: center; // align-items: center; } .el-table .el-table__cell { padding: 0 !important; height: 42px; } //标题栏背景色 .el-table tr th.el-table__cell { background-color: transparent !important; } .el-table th.el-table__cell > .cell { padding: 0 !important; } .el-table thead { width: 100%; height: 42px !important; background-color: #f0f2f5 !important; color:#333; } .el-table .el-table__body tr { height: 42px; font-size: 14px; } .table_row_title { width: 100%; display: inline-block; // display: block; overflow: hidden; /* 隐藏超出容器的内容 */ white-space: nowrap; /* 保持文本在一行内 */ text-overflow: ellipsis; /* 超出部分显示省略号 */ cursor: pointer; padding-left: 5px; padding-right: 3px; } //进度显示 .table_row_progress { display: flex; justify-content: flex-start; // background-color: red; width: 100%; .progress_percentage { width: 15%; font-weight: 400; font-size: 14px; color: #666666; } .progress_bar { width: 65%; } .progress_state { width: 20%; .span_number { font-weight: 400; font-size: 14px; color: #666666; margin-left: 10px; } } } .table_row_exam { text-align: center; font-size: 14px; } .table_row_state { width: 100%; height: 42px; line-height: 42px; text-indent: 20px; // background-image: url('../assets/icon/exam_state_icon_muban.png'); background-size: 16px 16px; background-position: 5px 50%; background-repeat: no-repeat; } .exam_state_item { width: 100%; height: 42px; line-height: 42px; } //各个状态 模板中 .exam_state_1 { background-image: url("../assets/icon/exam_state_icon_muban.png"); color: #ff5d5e; } //扫描中 .exam_state_2 { background-image: url("../assets/icon/exam_state_icon_saomiao.png"); color: #ffbe4e; } //阅卷中 .exam_state_3 { background-image: url("../assets/icon/exam_state_icon_yuejuan.png"); color: #5f8cfe; } //成绩中 .exam_state_4 { background-image: url("../assets/icon/exam_state_icon_chengji.png"); color: #08c2b3; } .step_content { width: 100%; height: 92px; display: flex; align-items: center; padding: 20px; .el-steps--horizontal { width: 100%; //完成后的样式 .el-step__head.is-success { color: #15bc83; border-color: #15bc83; } .el-step__title.is-success { color: #15bc83; font-size: 16px; } //进行中的样式 .el-step__head.is-process { color: #2e64fa; border-color: #2e64fa; } .el-step__title.is-process { color: #2e64fa; font-size: 16px; } //等待中的样式 .el-step__head.is-wait { color: #909399; border-color: #909399; } .el-step__title.is-wait { color: #909399; font-size: 16px; } } } } } } // 分页公共样式 .page_pagination { width: 100%; height: 30px; margin-top: 18px; margin-bottom: 2px; display: flex; justify-content: flex-end; align-items: center; .el-pagination { padding: 0 !important; display: flex; align-items: center; } .el-input--mini .el-input__inner { height: 30px !important; line-height: 30 !important; } // 上一页 .el-pagination .btn-prev { width: 30px !important; height: 30px; padding: 0 !important; background: #f3f3f3; border-radius: 4px 4px 4px 4px; } // 下一页 .el-pagination .btn-next { width: 30px !important; height: 30px; padding: 0 !important; background: #f3f3f3; border-radius: 4px 4px 4px 4px; margin-left: 8px; } .el-pagination span:not([class*="suffix"]), .el-pagination button { min-width: 30px; } .el-pager li { min-width: 30px; height: 30px; width: 30px; line-height: 30px; background: #f3f3f3; border-radius: 4px 4px 4px 4px; padding: 0 !important; margin-left: 8px; font-weight: 400; font-size: 14px; color: #666; } .el-pager li.active { background: #2f51ff; font-weight: 400; font-size: 14px; color: #ffffff; } } //页面公共样式 .page_item { width: 100%; background: #fff; border-radius: 10px; padding: 20px; // box-sizing: border-box; } .page_tag { width: calc(100% - 20px); height: 100%; border-radius: 0px 4px 4px 0px; .el-radio-button__inner { padding: 0 20px; height: 36px; line-height: 36px; color: #666666; } .el-radio-button.is-active .el-radio-button__original-radio:not(:disabled)+.el-radio-button__inner { background: #2E64FA; } .el-radio-button__orig-radio:checked + .el-radio-button__inner { color: #fff !important; } .tab_item { font-weight: 400; font-size: 14px; color:#999999; } .tag_item { max-width: 100px; white-space: nowrap; /* 禁止换行 */ overflow: hidden; /* 隐藏溢出内容 */ text-overflow: ellipsis; /* 溢出部分显示省略号 */ } } //个人中心页面公共样式 .page_user { width: calc(100% - 40px) !important; margin: auto; .user_title { font-size: 16px; font-weight: 600; color:#000000; margin-bottom: 20px; display: flex; justify-content: space-between; } .user_module { width: 100%; height: 120px; border:1px solid #E4E7ED; border-radius: 8px; display: flex; justify-content: flex-start; align-items: center; .user_img { width: 80px; height: 80px; margin-left: 20px; margin-right: 28px; } .user_info { width: calc(100% - 100px); font-size: 16px; color:#666666; display: flex; justify-content: flex-start; flex-wrap: wrap; gap:17px; line-height: 20px; .info_item { width: 32%; } } } .is-active { color:#2e64fa !important; } .el-tabs__item{ font-size:16px; font-weight: 600; color:#666; } .el-tabs__header { margin: 0 0 16px } .el-tabs__nav-wrap::after { height: 1px !important; } .el-tabs { height: 100%; } } //页面筛选公共样式 .page_search { width: 100%; .search_content { width: 100%; display: flex; justify-content: space-between; align-items: center; .el_button_item { width: auto; height: 36px !important; line-height: 36px; padding: 0 10px; margin-left: 20px; font-size: 14px !important; } .el-select { width: 120px; } .el-input { width: 230px; } .content_left { display: flex; gap: 10px; width: auto; font-weight: 400; font-size: 14px; color: #666666; .tab_button { width: auto; height: 36px !important; line-height: 36px; padding: 0 10px; // margin-right: 20px; font-size: 14px !important; } .select_cur { background:#2E64FA; color:#fff; border:1px solid #2E64FA; } .left_title { width: 42px; font-weight: 600; font-size: 14px; color: #333333; margin-right: 8px; } .grade_title { font-weight: 600; font-size: 16px; color: #333333; margin-right: 10px; } // 通用select .select_width { width: 120px; margin-right: 10px; } //通用input // .input_width // { // width: 230px; // } //学年 .select_year { width: 160px; margin-right: 10px; } .search_item { display: inline-block; margin-right: 10px; text-align: left; color:#333; .el-button { margin-left: 0px; min-width: 72px; height: 36px; line-height: 34px; padding: 0 10px; span { display: inline-flex; align-items: center; padding:0; } img { width: 16px; height: 16px; margin-right: 4px; vertical-align: middle; /* 使图标垂直居中 */ } } } } .content_right { width: auto; display: flex; justify-content: flex-end; gap: 10px; // .el-button // { // height: 36px !important; // line-height: 36px; // padding: 0 10px; // font-size: 14px !important; // margin: 0 !important; // } .el-button { margin-left: 0px; min-width: 96px; height: 36px; line-height: 36px; padding: 0 10px; span { display: inline-flex; align-items: center; padding:0; } img { width: 16px; height: 16px; margin-right: 4px; vertical-align: middle; /* 使图标垂直居中 */ } } .el-button--default { color: #666; font-weight: 400; } .el-button--primary.is-plain:hover { color: #2e64fa; background-color: #c0d1fe; font-size: 14px; } .button_border { } .add_button { border:1px solid #2e64fa; background-color: #fff; color: #2e64fa; } .add_button:hover { color: #2e64fa; background-color: #c0d1fe; } .el_bttton_72 { width: 72px; height: 36px; } } } .is-active { color:#2e64fa !important; } .el-tabs__item{ font-size:16px; font-weight: 600; color:#666; } .el-tabs__header { margin: 0 0 16px } .el-tabs__nav-wrap::after { height: 1px !important; } } .dialog_warning { .el-dialog__header { // background-color: red !important; background-image: url("../assets/icon/warning_icon.png"); background-size: 20px 20px; background-position: 20px 50%; background-repeat: no-repeat; text-indent: 50px !important; } .center_align { text-align: center; } .warning_footer { width: calc(100% - 30px); margin: auto; display: flex; justify-content: flex-end; align-items: center; // background-color: red; height: 100%; } } //弹窗公共样式 .page_dialog { border-radius: 8px; //饿了么样式覆盖 .el-dialog { padding: 0; } .el-dialog__header { width: 100%; height: 48px; line-height: 48px; text-indent: 20px; background-color: #f5f7fa; border-bottom: 1px solid #f5f7fa; border-top-right-radius: 8px; border-top-left-radius: 8px; padding: 0 !important; text-align: left; .el-dialog__title { font-weight: 600; font-size: 16px; color: #303133; } button:focus, button:focus-visible { outline: none; } .el-dialog__headerbtn { // display: none; // width: 100px; // height: 24px; // margin-top: -8px; // background-image: url("../assets/icon/close-line.png"); // background-position: 100% 50%; // background-repeat: no-repeat; // background-size: 24px 24px; // // background-color: red; // cursor: pointer; // i { // display: none; // } } } //饿了么内容样式覆盖 .el-dialog__body { font-weight: 400; font-size: 14px; color: #666666; padding: 20px; width: 100%; margin: auto; // min-height: 99px; // display: flex; // justify-content: flex-start; // align-items: center; .el-date-editor.el-input, .el-date-editor.el-input__wrapper { width: 140px; } } .max_height_540 { margin: 20px 0; max-height: 540px; overflow-y: auto; } .max_height_650 { overflow-y: auto; /* 小屏幕笔记本的样式 常见分辨率:1366x768 */ @media (max-height: 768px) { max-height: 480px; } /* 中等屏幕笔记本的样式(14-15英寸) 常见分辨率:1600x900, 1920x1080*/ @media (min-height: 767px) { max-height: 650px; } } .padding_20 { // width: calc(100% - 40px); padding: 20px 20px; } //个人中心 年级科目弹窗 .content_course_tree { width: calc(100% - 40px); margin: auto; display: flex; justify-content:space-around; .tree_item { width: 30%; height: auto; .header_title { font-weight: 600; font-size: 16px; color: #333333; line-height: 30px; } .item_content { margin-top: 10px; width: 100%; height: 350px; border-radius: 6px; border: 1px solid #eeeeee; .check_all { width:100%; margin: auto; height: 34px; border-bottom: 1px solid #eeeeee; line-height: 34px; text-indent: 4px; } .check_content { width: 100%; height: 350px; overflow: auto; .el-checkbox-group { margin-top: 10px; .el-checkbox { width: 80%; text-indent: 6px; margin-bottom: 10px; } } } .page_tree { border: none !important; margin-top: 0px !important; } .select_item { width: calc(100% - 40px); margin: auto; line-height: 20px; display: flex; justify-content: space-between; margin-top: 10px; align-items: center; i{ font-size: 18px; cursor: pointer; } } } } } //通用内容区域 .dialog_center { width: calc(100% - 40px); margin: auto; .center_header { width: 100%; height: auto; display: flex; justify-content: space-between; .header_left { display: flex; justify-content: flex-start; align-items: center; .left_name { width: 120px; font-size: 16px; color:#666; font-weight: 400; } .el-input__inner { width: 216px; height: 36px; line-height: 36px; } } .left_center { align-items: center; } .left_count { color:#333; font-size: 16px; font-weight: 600; } .header_right { display: flex; justify-content: flex-end; } } //弹窗 check选择框公共样式 .select_check_content { width: calc(100% - 40px); margin: auto; height: auto; // align-items: center; .el-checkbox-group { display: flex; flex-wrap: wrap; height: auto; } .el-checkbox { width:20%; box-sizing: border-box; /* 确保 padding 和 border 不影响宽度 */ // padding: 5px; /* 可选:添加一些内边距 */ margin-bottom: 23px; margin-right: 0px; font-size: 16px; color:#333333; } .el-checkbox__label { font-weight: 400; font-size: 16px; color:#333; } } .center_message_title { text-indent: 20px; font-size: 16px; font-weight: 600; color: #000000; } .center_message_content { width: calc(100% - 40px); margin: auto; display: flex; justify-content: space-between; .content_lable { width: 70px; font-weight: 400; font-size: 14px; color: #666666; line-height: 16px; text-align: right; padding-top: 20px; } .content_radio { width: calc(100% - 70px); padding-top: 20px; .radio_item { width: 100%; height: auto; display: flex; justify-content: flex-start; margin-bottom: 15px; .item_radio { } .item_right { .right_title { font-weight: 500; font-size: 16px; color: #666666; } .right_message { font-weight: 400; font-size: 14px; color: #999999; margin-top: 10px; .input_number { width: 80px; height: 32px; margin-left: 5px; margin-right: 5px; } } } } } } .center_message_tishi { width: calc(100% - 40px); margin: auto; margin-top: 20px; font-weight: 500; font-size: 16px; line-height: 25px; color: #333333; } //导入文件 提示信息 .import_message { font-size: 12px; color:#999; line-height: 20px; margin-top: 10px; } .center_message_input { width: calc(100% - 40px); margin: auto; margin-top: 20px; margin-bottom: 20px; font-weight: 400; font-size: 16px; color: #666666; display: flex; justify-content: flex-end; align-items: center; .el-icon-view { margin-top: 4px; cursor: pointer; } .el-input--small .el-input__icon { height: 36px; line-height: 36px; } .el-input--small .el-input__inner { width: 244px; height: 36px; line-height: 36px; } .el-input__suffix { top: 8px; } } .center_message { font-size: 16px; color: #333; padding: 15px 0; font-weight: 400; font-size: 14px; color: #666666; line-height: 20px; text-align: left; } .score_input { width: 74px !important; margin-left: 8px; .el-input__inner { width: 48px !important; height: 36px !important; line-height: 36px !important; font-size: 14px; padding: 0 5px; text-align: center; } } .select_width_160 { .el-input { width: 160px !important; } .el-input__inner { width: 160px !important; } } .span_center { margin-left: 5px; margin-right: 5px; } .input_91 { width: 91px !important; .el-input__inner { width: 91px !important; height: 36px !important; line-height: 36px !important; font-size: 14px; padding: 0 0px; text-align: center; } } .list_content { display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 16px; .select_item { width: auto; display: flex; justify-content: flex-start; .el-checkbox__label { padding: 0 0 0 5px; } .el-input { width: 120px; margin-left: 5px; } .el-input__inner { width: 120px; padding:0 0 0 8px !important; } } } .tab_item { // min-width:80px; padding:0 10px; height: 34px; border:1px solid #DCDFE6; line-height: 34px; text-align: center; border-radius: 4px; font-size: 14px; color:#666; margin-right: 10px; cursor: pointer; } .tab_active { background-color: #2E64FA; color:#fff; } .table_info { font-weight: 600; font-size: 16px; color: #303133; line-height: 24px; margin-bottom: 10px; display: flex; justify-content: space-between; } .el-form { width: 100% !important; .el-form-item { margin-bottom: 20px; } } //弹窗 el-from-item__content .el-form-item__content { display: flex; align-items: center; font-size: 16px; min-height: 40px; .upload_file_name { margin-left: 10px; line-height: 20px; } .el-input.is-disabled .el-input__inner { color:#333; } .score { padding-left: 5px; } // 下拉选择框 中间箭头上下居中 .el-select .el-input .el-select__caret { height: 36px; } // 下拉选择框 中间箭头上下居中 .el-input__icon { line-height: 36px; } .el-button--small { height: 36px !important; font-size: 14px; } .el-input { width: 240px; } .check_select { .el-input { width: 87px !important; } } .el-input__inner { width: 240px; height: 36px; line-height: 36px; font-size: 14px; } .el-input--mini { width: 240px; } .el-input-number { width: 240px; } // 数字输入框 .el-input-number--mini { line-height: 34px; } // 开关 .el-switch { height: 40px; } .radio_box { width: 180px; height: 40px; } .radio_number_horizontal { background-image: url("../assets/icon/question_number_horizontal.png"); background-size: 78px 30px; background-repeat: no-repeat; background-position: 60px 50%; } .radio_number_vertical { background-image: url("../assets/icon/question_number_vertical.png"); background-size: 40px 40px; background-repeat: no-repeat; background-position: 60px 50%; } .radio_answer_horizontal { background-image: url("../assets/icon/answer_direction_horizontal.png"); background-size: 78px 30px; background-repeat: no-repeat; background-position: 60px 50%; } .radio_answer_vertical { background-image: url("../assets/icon/answer_direction_vertical.png"); background-size: 40px 40px; background-repeat: no-repeat; background-position: 60px 50%; } // 组 .el-radio-group { font-size: 14px; min-height: 40px; line-height: 40px; // display: flex; // align-items: center; .radio_question_number_horizontal { width: auto; height: 40px; line-height: 40px; // background-image: url('../assets/icon/question_number_horizontal.png'); // background-size: 100% 100%; // background-repeat: no-repeat; // background-position: 0 0; img { width: 78px; height: 30px; } } .el-radio__label { padding-left: 5px !important; font-size: 16px !important; } .el-radio { margin-right: 20px !important; } } .group_item { line-height: 40px; } .el-input-group__append { width: 26px !important; } .el-checkbox__label { line-height: 36px; } } .el-form-item { // margin-bottom: 15px !important; min-height: 40px; .el-form-item__label { font-size: 16px !important; padding: 0 !important; color:#666666; } .el-checkbox__label { color:#666; font-size: 16px; } } .label_left { margin-left: 20px; } .dialog_search { width: 100%; height: auto; .search_title_info { font-weight: 600; font-size: 14px; color: #303133; span { margin-right: 20px; } } .search_input { .el-input-group { width: auto !important; } } .search_filter { margin-top: 8px; margin-bottom: 8px; } } .dialog_table { width: 100%; .el-table--group, .el-table--border { border-radius: 4px; } //表格顶部标题栏 .el-table tr th.el-table__cell { background-color: #f4f6f8; font-size: 14px; color: #333; font-weight: 600; } .el-table__empty-block { // background-color: red; background-image: url("../assets/bg/table_no_data.png"); background-size: 64px 72px; background-position: 50% 50%; background-repeat: no-repeat; .el-table__empty-text { display: none; } } .el-table__body .el-table__cell { padding: 0 !important; //去掉弹窗表格的padding height: 42px; border-right: 1px solid #e9e9e9; .el-input--mini .el-input__inner { width: 100%; } .el-input-number__decrease { height: 16px !important; line-height: 16px; border-bottom: 1px solid #dcdfe6; } .el-input-number__increase { height: 16px !important; line-height: 16px; border-top: 1px solid #dcdfe6; } .el-input-number { width: 100%; height: 38px; } .el-input__inner { width: 100%; } } .table_row_select { position: relative; .select_state { position: absolute; width: 10px; height: 10px; left: 45px; top:12px; z-index: 999; } //表格里的输入框 选择框样式覆盖 .el-input__inner { height: 30px !important; line-height: 30px !important; padding-left: 30px; } // 下拉选择框 中间箭头上下居中 .el-select .el-input .el-select__caret { height: 30px; } // 下拉选择框 中间箭头上下居中 .el-input__icon { line-height: 30px; } } .table_row_name { overflow: hidden; /* 隐藏超出容器的内容 */ white-space: nowrap; /* 保持文本在一行内 */ text-overflow: ellipsis; /* 超出部分显示省略号 */ } //进度显示 .table_row_progress { display: flex; justify-content: flex-start; width: 100%; .progress_percentage { width: 15%; font-weight: 400; font-size: 14px; color: #666666; } .progress_bar { width: 65%; } .progress_state { width: 20%; .span_number { font-weight: 400; font-size: 14px; color: #666666; margin-left: 10px; } } } } .el-table__header, .el-table__body, .el-table__foote { width: 100%; } .el_table { box-shadow: 1px 1px 1px #e4e7ed; border-radius: 4px; } // .el-table--border .el-table__cell { // border-bottom: 1px solid #ebeef5; // border-right: 0px solid #ebeef5; // } .student_detail_info { width: 100%; display: flex; justify-content: center; align-items: center; font-weight: 400; font-size: 16px; color: #303133; margin-bottom: 30px; margin-top: 30px; .info_title { width: 40%; text-align: right; font-weight: 400; font-size: 16px; color: #303133; } .info_message { width: 50%; text-align: left; padding-left: 2px; font-weight: 500; font-size: 14px; color: #666666; } } //弹窗通用搜索区域 .center_search { width: 100%; margin: auto; padding: 0 0 15px 0; } //扫描的图片 .dialog_scan_image { width: calc(100% - 40px); height: 497px; background: #f0f4f8; padding: 20px; display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 20px; .scan_image_item { width: calc(25% - 15px); height: 139px; .image_item_title { display: flex; justify-content: space-between; line-height: 25px; .title_left { font-weight: 500; font-size: 14px; color: #303133; } .title_right { font-weight: 400; font-size: 14px; color: #666666; } } img { width: 100%; height: 100%; } } } .default_pass { font-size: 12px; color:#666; } .dialog_example_img { width: 100%; height: 178px; background-image: url("../assets/bg/score_add_example.webp"); background-size: 561px 178px; background-repeat: no-repeat; background-position: 0% 50%; } } //消息提醒内容区 .dialog_message { display: flex; justify-content: center; align-items: center; width: 100%; min-height: 99px; span { padding: 20px; line-height: 20px; } } //饿了么底部按钮样式覆盖 .el-dialog__footer { padding: 0 20px; text-align: right; border-top: 1px solid #e6e6e6; height: 66px; line-height: 66px; border-radius: 0 0 8px 8px; .dialog_footer { padding: 0 !important; margin: auto; height: 64px; display: flex; justify-content: space-between; .footer_left { width: auto; height: 64px; } .footer_right { width: auto; height: 64px; display: flex; justify-content: flex-end; align-items: center; } } .el-button { width: 68px; height: 36px; padding: 0 !important; font-size: 14px; } //饿了么按钮样式覆盖 .el-button--primary { width: 68px; height: 36px; margin-left: 15px; } .el-button--default { width: 68px; height: 36px; } // 自定义特殊按钮样式 .no_save_button { width: 82px; height: 36px; background: #ffffff; border-radius: 4px 4px 4px 4px; border: 1px solid #dcdfe6; } .save_button { width: 68px; height: 36px; margin-left: 20px; } .cancel_button { width: 68px; height: 36px; background: #ffffff; border-radius: 4px 4px 4px 4px; border: 1px solid #dcdfe6; margin-left: 20px; } } //消息提醒弹窗 .el-message-box__header { padding: 0 !important; height: 48px; line-height: 48px; background-color: #f5f7fa; .el-message-box__title { height: 48px; line-height: 48px; font-weight: 500; font-size: 16px; color: #333; text-indent: 50px; background-image: url("../assets/icon/warning_icon.png"); background-size: 20px 20px; background-position: 20px 50%; background-repeat: no-repeat; } .el-message-box__headerbtn { width: 36px; height: 36px; margin-top: -8px; background-image: url("../assets/icon/close-line.png"); background-position: 100% 50%; background-repeat: no-repeat; background-size: 24px 24px; .el-icon-close { display: none; } } } .el-message-box__content { min-height: 55px; padding: 0px 0px !important; display: flex; justify-content: left; align-items: center; .el-message-box__message { padding: 20px 10px 20px 20px !important; font-weight: 400; font-size: 14px; color: #666666; line-height: 25px; max-height: 250px; overflow-y: auto; white-space: normal; word-break: break-all; } } .el-message-box__status { display: none !important; } .el-message-box__btns { padding: 13px 20px 4px 20px; border-top: 1px solid #e4e7ed; .el-button { width: 68px; height: 36px; border-radius: 4px 4px 4px 4px; border: 1px solid #dcdfe6; font-size: 14px; } } //给分规则 .dialog_group { width:100%; margin: auto; padding-left: 6px; .radio_title { font-weight: 400; font-size: 16px; color: #666666; } .el-radio__label { font-size: 16px; font-weight: 400; } .radio_group_socre { width: 100%; height: auto; line-height: 50px; font-weight: 400; font-size: 16px; color: #666666; .el-input { width: 52px !important; height: 30px !important; padding: 0px !important; // margin-left: 5px; margin-right: 5px; } .el-input__inner { width: 52px !important; height: 30px !important; padding: 0px !important; text-align: center; } .el-radio__input.is-checked + .el-radio__label { font-weight: 400; font-size: 16px; color: #666; } } .radio_group_long_input { line-height: 50px; color: #666; .el-input { width: 200px !important; height: 36px !important; padding: 0px !important; // margin-left: 5px; margin-right: 5px; } .el-input__inner { width: 200px !important; height: 36px !important; padding: 0px !important; text-align: center; } } } .el-upload-list { display: none; } } //弹窗全屏 .page_full_dialog { //饿了么样式覆盖 .el-dialog__header { display: none; } .el-dialog { border-radius: 0; } //饿了么内容样式覆盖 .el-dialog__body { font-weight: 400; font-size: 14px; color: #666666; padding: 0 !important; width: 100%; height: 100%; margin: auto; // min-height: 99px; // display: flex; // justify-content: flex-start; // align-items: center; } } .el-popover { border-radius: 4px; } //悬浮层公共样式 成绩单表头设置使用 .page_popover { width: 100%; height: auto; .popover_content { width: auto; height:calc(100% - 46px) ; .vertical_checkbox_group { width:auto; display: flex; flex-direction:column; flex-wrap: wrap; // overflow-y: auto; height: 300px; .el-checkbox { width:auto; // box-sizing: border-box; /* 确保 padding 和 border 不影响宽度 */ // padding: 5px 0px; /* 可选:添加一些内边距 */ margin-bottom: 10px; // margin-right: 20px; font-weight: 400; font-size: 14px; color:#666; } } .el-checkbox__input.is-disabled + span.el-checkbox__label { color:#666; } } .popover_button { width: 100%; height: 36px; display: flex; justify-content: flex-end; align-items: center; gap: 10px; .el-button { margin-left: 0px; min-width: 68px; height: 36px; padding: 0; font-weight: 500; font-size: 14px; color: #666666; } .el-button--primary { color:#ffffff; } } } .el-time-panel { width: 130px !important; } //抽屉弹窗公共样式 .page_drawer { //日期选择弹窗组件样式覆盖 .el-date-picker { background-color: red; width: 200px !important; .el-picker-panel__body { width: 200px !important; } .el-time-panel { width: 130px !important; } } .el-drawer__header { display: none; } .drawer_content { width: 100%; .set_search_title { width: 100%; height: 56px; line-height: 56px; text-indent: 20px; font-weight: 600; font-size: 16px; color: #303133; } } .drawer_footer { width: 360px; position: fixed; bottom: 0; right: 0; } .drawer_title { font-size: 16px; color: #fff; width: 100%; height: 48px; line-height: 48px; text-indent: 20px; font-weight: 600; font-size: 16px; color: #303133; border-bottom: 1px solid #14191f25; border-radius: 0px 0px 0px 0px; // background-image: url("@/assets/markDetailScore/close_drawer.png"); // background-repeat: no-repeat; // background-size: 24px 24px; // background-position: calc(100% - 20px) 50%; cursor: pointer; } .sel_item { width: calc(100% - 40px); margin: auto; margin-bottom: 16px; .selItem_title { line-height: 28px; font-weight: 400; font-size: 16px; color: #303133; } .selValItem_line { margin: 0 9px; } } .button_content { width: 100%; height: auto; text-align: center; margin-top: 20px; margin-bottom: 20px; } .drawer_button { width: calc(100% - 40px); margin: auto; font-weight: 600; font-size: 14px; color: #ffffff; height: 36px; } .end_content { width: 100%; height: 64px; display: flex; align-items: center; justify-content: center; border-top: 1px solid rgba(25, 31, 37, 0.08); .end_button { width: calc(100% - 40px); height: 36px; border-radius: 4px 4px 4px 4px; border: 1px solid #f56c6c; font-weight: 500; font-size: 14px; color: #f56c6c; } } .w173 { width: 231px; } } /* 小屏幕笔记本的样式 常见分辨率:1366x768 */ @media (max-width: 1366px) { .exam_aside { width: 206px; } } /* 中等屏幕笔记本的样式(14-15英寸) 常见分辨率:1600x900, 1920x1080*/ @media (min-width: 1367px) and (max-width: 1920px) { .exam_aside { width: 15%; } } /* 大屏幕笔记本的样式(17-20英寸) 常见分辨率:2560x1440*/ @media screen and (min-width: 1920px) { .exam_aside { width: 19%; } } /* 高分辨率设备的样式 */ @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { } // 应用滚动条样式到三个类下的 .el-table__body-wrapper .page_table, .dialog_table, .area_table, .right_table, .card_table { .el-table__body-wrapper { // 滚动条样式修改 /* 滚动条轨道区域样式 */ &::-webkit-scrollbar { width: 8px; /* 设置滚动条宽度为8像素 */ height: 8px; /* 设置滚动条高度为8像素 */ background-color: transparent; } /* 滑块样式 */ &::-webkit-scrollbar-thumb { background-color: #b8b8b8; /* 设置滑块颜色为深灰色 */ border-radius: 4px; /* 设置滑块边角半径为4像素 */ min-height: 60px;//设置手柄最小高度 } /* 滚动条轨道内部空白区域样式 */ &::-webkit-scrollbar-track { background-color: #f0f0f0; /* 设置轨道背景色为浅灰色 */ } /* 滚动条两端按钮样式 */ &::-webkit-scrollbar-button { display: none; /* 不显示按钮 */ } /* 交叉点处的区域样式 */ &::-webkit-scrollbar-corner { background-color: transparent; /* 设置交叉点处的背景色为透明 */ } /* 调整大小手柄样式 */ &::-webkit-resizer { display: none; /* 不显示调整大小手柄 */ } } // 表格列表标题栏滚动条 .el-table th.gutter { // display: none !important; width: 8px !important; } // 表格滚动条列宽 .el-table colgroup col[name="gutter"] { // display: ; width: 8px; } } .el-message-box__btns { .el-button + .el-button { margin-left: 10px!important; } .el-button { &:hover { background: none; color: #606266; } &.active { background: none; color: #606266; } .el-button:focus-visible { background: inherit; border: none; } &.fouce { background: inherit; border: none; } } .el-button--primary { background: #2E64FA; &:hover { background: #2E64FA; color: #fff; } &.active { background: #2E64FA; color: #fff; } } } //列表行操作 .table_row_option { width: 100%; text-align: center; display: flex; justify-content: center; align-items: center; gap: 10px; .move_icon { width: 36px; height: 36px; background-image: url("../assets/icon/move_icon_hover.png"); background-size: 20px 20px; background-repeat: no-repeat; background-position: 0% 50%; cursor: move; } .sort_move { width: 36px; height: 36px; background-image: url("../assets/icon/sort_move.webp"); background-size: 20px 21px; background-repeat: no-repeat; background-position: 50% 50%; cursor: move; } .editor_icon { width: 36px; height: 36px; background-image: url("../assets/icon/editor_icon_hover.png"); background-size: 20px 20px; background-repeat: no-repeat; background-position: 0% 50%; cursor: pointer; } .delete_icon { width: 36px; height: 36px; background-image: url("../assets/icon/delete_icon.png"); background-size: 20px 20px; background-repeat: no-repeat; background-position: 0% 50%; cursor: pointer; } .el_button_editor { width: 30px; height: 36px !important; line-height: 36px; font-size: 14px; color: #2e64fa; cursor: pointer; } .option_button_editor { width: auto; height: 36px !important; line-height: 36px; font-size: 14px; color: #2e64fa; cursor: pointer; } .editor_disable { color: #bbbbbb !important; cursor: not-allowed !important; } .el_button_delete { width: 30px; height: 36px !important; line-height: 36px; font-size: 14px; color: #F56C6C; cursor: pointer; } .button_editor { width: auto; height: 36px; line-height: 36px; margin-right: 5px; font-size: 14px; color: #2e64fa; cursor: pointer; } .button_delete { width: auto; height: 36px; line-height: 36px; font-size: 14px; color: #F56C6C; cursor: pointer; } .option_delete { color: #f56c6c; font-size: 14px; font-weight: 400; cursor: pointer; } .option_editor { color: #2e64fa; font-size: 14px; font-weight: 400; cursor: pointer; } .option_add { font-weight: 400; font-size: 14px; color: #f56c6c; cursor: pointer; } .option_disabled { font-weight: 400; font-size: 14px; color: #C0C4CC; } } // 表格滚动条样式通用 .el-table__body-wrapper { // 滚动条样式修改 /* 滚动条轨道区域样式 */ &::-webkit-scrollbar { width: 10px; /* 设置滚动条宽度为8像素 */ background-color: transparent; } /* 滑块样式 */ &::-webkit-scrollbar-thumb { background-color: #b8b8b8; /* 设置滑块颜色为深灰色 */ border-radius: 4px; /* 设置滑块边角半径为4像素 */ min-height: 60px;//设置手柄最小高度 } /* 滚动条轨道内部空白区域样式 */ &::-webkit-scrollbar-track { background-color: #f0f0f0; /* 设置轨道背景色为浅灰色 */ } /* 滚动条两端按钮样式 */ &::-webkit-scrollbar-button { display: none; /* 不显示按钮 */ } /* 交叉点处的区域样式 */ &::-webkit-scrollbar-corner { background-color: transparent; /* 设置交叉点处的背景色为透明 */ } /* 调整大小手柄样式 */ &::-webkit-resizer { display: none; /* 不显示调整大小手柄 */ } } // 表格列表标题栏滚动条 .el-table th.gutter { // display: none !important; width: 8px !important; } // 表格滚动条列宽 .el-table colgroup col[name="gutter"] { display: none; width: 8px; } // 使用element-ui按钮后的 公共按钮样式 导入 导出 其他等等可追加 .el_button { .el-button .is-disabled { background-color: #f5f7fa; border-color: #dcdfe6; color: #c0c4cc; cursor: not-allowed; background-color: red !important; } .el-button { min-width: 72px; width: auto; height: 36px; padding: 0 !important; } //导出 .export_btn { width: auto; height: 36px !important; font-weight: 400; font-size: 14px; color: #666666; text-indent: 20px; background-image: url("../assets/icon/exam_exports.png"); background-repeat: no-repeat; background-size: 16px 16px; background-position: 12px 50%; cursor: pointer; } .export_btn:hover { color: #2e64fa; background-image: url("../assets/icon/exam_export.png"); } //导入 .import_btn { width: auto; height: 36px !important; line-height: 36px; font-weight: 400; font-size: 14px; color: #666666; margin-left: 10px; text-indent: 20px; background-image: url("../assets/icon/exam_imports.png"); background-repeat: no-repeat; background-size: 16px 16px; background-position: 12px 50%; cursor: pointer; } .import_btn:hover { color: #2e64fa; background-image: url("../assets/icon/exam_import.png"); } //返回扫描 .back_scan_button { width: 120px; height: 36px !important; font-weight: 400; font-size: 14px; color: #666666; text-indent: 20px; background-image: url("../assets/icon/exam_back.png"); background-repeat: no-repeat; background-size: 20px 20px; background-position: 17px 50%; cursor: pointer; } //刷新 .refresh_btn { width: 68px; height: 36px !important; font-weight: 400; font-size: 14px; color: #666666; text-indent: 20px; background-image: url("../assets/icon/refresh_default.png"); background-repeat: no-repeat; background-size: 16px 16px; background-position: 10px 50%; cursor: pointer; } //适合屏幕 .fit_screen_btn { width: 96px; height: 36px; font-weight: 400; font-size: 14px; color: #666666; text-align: center; background-image: url("../assets/icon/fit_screen_default.png"); background-size: 16px 16px; background-position: 8px 50%; background-repeat: no-repeat; text-indent: 20px; margin-left: 10px; margin-right: 0px; } // 删除 .delete_btn { width: 96px; height: 36px !important; font-weight: 400; font-size: 14px; color: #f56c6c; text-align: center; border: 1px solid #f56c6c; cursor: pointer; margin-left: 20px; } // 编辑 .editor_btn { width: 96px; height: 36px !important; font-weight: 400; font-size: 14px; color: #2E64FA; text-align: center; border: 1px solid #2E64FA; cursor: pointer; margin-left: 20px; } //标记为正常 .marke_normal_btn { width: 96px; height: 36px !important; font-weight: 400; font-size: 14px; color: #2e64fa; text-align: center; border: 1px solid #2e64fa; cursor: pointer; margin-left: 20px; } //标记为正常 禁用 .marke_normal_btn_disable { width: 110px; height: 36px !important; font-weight: 400; font-size: 14px; color: #c0c4cc; cursor: not-allowed; background-image: none; background-color: #ffffff; border-color: #ebeef5; margin-left: 20px; } // 标记为缺考 .marke_miss_exam_btn { width: 110px; height: 36px !important; font-weight: 400; font-size: 14px; color: #2e64fa; text-align: center; border: 1px solid #2e64fa; cursor: pointer; margin-left: 20px; } //重新切割 .re_cut_btn { width: calc(50% - 10px); height: 36px !important; font-weight: 400; font-size: 14px; color: #2e64fa; text-align: center; border: 1px solid #2e64fa; cursor: pointer; } //灰色按钮 .abnormal_other_btn { width: calc(50% - 10px); height: 36px !important; font-weight: 400; font-size: 14px; color: #666666; text-align: center; border: 1px solid #e9e9e9; cursor: pointer; } //删除试卷 .delete_paper_btn { width: calc(50% - 10px); height: 36px !important; font-weight: 400; font-size: 14px; color: #f56c6c; text-align: center; border: 1px solid #f56c6c; cursor: pointer; } // 回收站 .recycle_bin_btn { width: calc(100% - 40px); margin: auto; height: 36px !important; font-weight: 400; font-size: 14px; color: #dcdfe6; text-align: center; border: 1px solid #dcdfe6; cursor: pointer; margin-left: 20px; } //结束批阅 .end_review { width: 96px; height: 36px; background: #f56c6c; border-radius: 4px 4px 4px 4px; border: 0px solid #f56c6c; font-size: 14px; font-weight: 500; color: #fff; } //处理异常卷 .review_abnormal { width: 110px !important; height: 36px; background: #ffffff; border-radius: 4px 4px 4px 4px; border: 1px solid #f56c6c; font-weight: 400; font-size: 14px; color: #f56c6c; } .other_button_review { width: 68px; height: 36px; background: #ffffff; border-radius: 4px 4px 4px 4px; border: 1px solid #dcdfe6; font-weight: 400; font-size: 14px; color: #666666; } //重新导入名单 .other_btn { width: 120px !important; height: 36px !important; border-radius: 4px 4px 4px 4px; border: 1px solid #dcdfe6; font-weight: 400; font-size: 14px; color: #666666; } //通用蓝色无背景编辑按钮 .editor_item { width: 96px; height: 36px !important; font-weight: 400; font-size: 14px; color: #2E64FA; text-align: center; border: 1px solid #2E64FA; cursor: pointer; } .editor_item:hover { background: rgba(46,100,250,0.1); color: #2E64FA; border: 1px solid #2E64FA; } // 通用红色无背景删除 .delete_item { width: 96px; height: 36px !important; font-weight: 400; font-size: 14px; color: #f56c6c; text-align: center; border: 1px solid #f56c6c; cursor: pointer; } .delete_item:hover { background: rgba(245,108,108,0.1); color: #f56c6c; border: 1px solid #f56c6c; } } .pic_item_list { width: 100%; padding-top: 10px; // overflow-x: auto; // height: 160px; display: flex; justify-content: flex-start; .draggable_move { display: flex; span { display: flex; justify-content: flex-start; align-items: center; } } .pic_item_img_detail { width: 181px; height: auto; position: relative; margin-right: 10px; .pic_item_img_title { font-weight: 500; font-size: 14px; color: #303133; margin-bottom: 5px; display: flex; justify-content: space-between; .title_left { font-weight: 500; font-size: 14px; color: #303133; } .title_right { font-weight: 400; font-size: 14px; color: #666666; } } .pic_item_img_content { width: 181px; height: 128px; // background-color: red; img { width: 100%; height: 100%; cursor: pointer; border-radius: 5px; object-fit: contain; } } .button_group { position: absolute; display: flex; display: none; width: 181px; height: 128px; z-index: 10; top: 20px; left: 0; background: rgba(0, 0, 0, 0.4); align-items: center; justify-content: center; gap: 16px; .pic_button_view { width: 68px; height: 34px; text-align: center; line-height: 34px; cursor: pointer; background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(220, 223, 230, 1); border-radius: 4px; color: #666666; text-indent: 15px; background-image: url("../assets/icon/pic_show_view.png"); background-size: 16px 16px; background-position: 10px 50%; background-repeat: no-repeat; font-size: 14px; } .pic_button_delete { width: 68px; height: 34px; text-align: center; line-height: 34px; cursor: pointer; background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(220, 223, 230, 1); border-radius: 4px; text-indent: 10px; background-image: url("../assets/icon/pic_show_delete.png"); background-size: 16px 16px; background-position: 10px 50%; background-repeat: no-repeat; color: #f56c6c; font-size: 14px; } } } .pic_item_img_detail:hover .button_group { display: flex; } } // 42行高表格公共样式 .table_42 { width: 100%; padding-bottom: 10px; .el-table { width: 100%; border-left: 1px solid #e9e9e9; border-right: 1px solid #e9e9e9; border-radius: 4px; } .el-table--border .no-border { border-right: none !important; // 移除右边框 } .el-table--border .no-border + .el-table__cell { border-left: none !important; // 移除左边框 } .el-table .cell { padding: 0 !important; display: flex; justify-content: center; align-items: center; } .el-table .el-table__cell { padding: 0 !important; height: 42px; } .el-table tr th.el-table__cell { background-color: #f0f2f5 !important; } .el-table th.el-table__cell > .cell { padding: 0 !important; } .el-table thead { width: 100%; height: 42px !important; background-color: #f0f2f5 !important; } .el-table .el-table__body tr { height: 42px; font-size: 14px; } .table_row_title { width: 100%; display: inline-block; // display: block; overflow: hidden; /* 隐藏超出容器的内容 */ white-space: nowrap; /* 保持文本在一行内 */ text-overflow: ellipsis; /* 超出部分显示省略号 */ cursor: pointer; } } //无数据显示 .no_content_data { background-image: url("../assets/bg/no_content_bg.png"); background-repeat: no-repeat; background-size:360px auto; background-position: 50% 30%; color: #999999; justify-content: center; display: flex; align-items: center; }