|
|
@@ -1,5 +1,8 @@
|
|
|
<template>
|
|
|
- <div class="app-container sop-temp-container">
|
|
|
+ <div class="app-container sop-temp-container"
|
|
|
+ v-loading="!form.id"
|
|
|
+ element-loading-text="页面加载中..."
|
|
|
+ element-loading-background="rgba(255, 255, 255, 0.95)">
|
|
|
<!-- 页面头部 -->
|
|
|
<!-- <div class="page-header">-->
|
|
|
<!-- <div class="header-title">-->
|
|
|
@@ -88,7 +91,7 @@
|
|
|
<el-badge slot="label" :is-dot="!item.id" class="item" style="display: inline-block">
|
|
|
<span>{{ '第' + item.dayNum + '天' }}</span>
|
|
|
</el-badge>
|
|
|
- <el-row v-loading="loading">
|
|
|
+ <el-row v-loading="loading" element-loading-text="加载中..." element-loading-background="rgba(255, 255, 255, 0.9)" class="tab-content-row">
|
|
|
<el-col :span="22">
|
|
|
<el-card shadow="never" class="day-content-card">
|
|
|
<el-form :model="item" label-width="100px" class="content-form">
|
|
|
@@ -1041,6 +1044,49 @@
|
|
|
border-color: #1890ff;
|
|
|
}
|
|
|
|
|
|
+/* 红点样式优化 - 未选中状态 */
|
|
|
+.rule-tabs ::v-deep .el-badge__content.is-dot {
|
|
|
+ width: 6px;
|
|
|
+ height: 6px;
|
|
|
+ top: -3px;
|
|
|
+ right: -8px;
|
|
|
+ background-color: #f56c6c;
|
|
|
+ border: none;
|
|
|
+ box-shadow: none;
|
|
|
+}
|
|
|
+
|
|
|
+/* 红点样式优化 - 选中状态 */
|
|
|
+.rule-tabs ::v-deep .el-tabs__item.is-active .el-badge__content.is-dot {
|
|
|
+ background-color: #faad14;
|
|
|
+ border: none;
|
|
|
+ box-shadow: none;
|
|
|
+}
|
|
|
+
|
|
|
+/* 标签内容区域 */
|
|
|
+.tab-content-row {
|
|
|
+ min-height: 300px;
|
|
|
+}
|
|
|
+
|
|
|
+/* 加载动画优化 */
|
|
|
+.tab-content-row ::v-deep .el-loading-mask {
|
|
|
+ border-radius: 6px;
|
|
|
+}
|
|
|
+
|
|
|
+.tab-content-row ::v-deep .el-loading-spinner {
|
|
|
+ top: 40%;
|
|
|
+}
|
|
|
+
|
|
|
+.tab-content-row ::v-deep .el-loading-spinner .circular {
|
|
|
+ width: 42px;
|
|
|
+ height: 42px;
|
|
|
+}
|
|
|
+
|
|
|
+.tab-content-row ::v-deep .el-loading-spinner .el-loading-text {
|
|
|
+ color: #1890ff;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
/* 天内容卡片 */
|
|
|
.day-content-card {
|
|
|
border: 1px solid #e8e8e8;
|
