重新构建路由和配置样式文件
This commit is contained in:
@@ -0,0 +1,144 @@
|
||||
/**
|
||||
* 首页特定样式
|
||||
*/
|
||||
|
||||
/* 仪表盘容器 */
|
||||
.dashboard-container {
|
||||
@apply p-5;
|
||||
}
|
||||
|
||||
/* 统计卡片 */
|
||||
.stat-grid {
|
||||
@apply grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 p-4;
|
||||
}
|
||||
|
||||
.stat-card {
|
||||
@apply bg-white rounded-lg p-4 shadow transition-all duration-200 relative;
|
||||
}
|
||||
|
||||
.stat-card:hover {
|
||||
@apply transform -translate-y-[3px] shadow-[0_4px_15px_rgba(0,0,0,0.1)];
|
||||
}
|
||||
|
||||
.stat-title {
|
||||
@apply text-sm text-gray-600 mb-2.5;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
@apply text-2xl font-semibold text-gray-900 mb-2.5;
|
||||
}
|
||||
|
||||
.stat-trend {
|
||||
@apply flex items-center text-xs;
|
||||
}
|
||||
|
||||
.stat-trend.trend-up {
|
||||
@apply text-[#52c41a];
|
||||
}
|
||||
|
||||
.stat-trend.trend-down {
|
||||
@apply text-[#f5222d];
|
||||
}
|
||||
|
||||
.stat-icon {
|
||||
@apply absolute right-4 top-4 text-2xl text-[#00684a] opacity-20;
|
||||
}
|
||||
|
||||
/* 快捷访问网格 */
|
||||
.shortcut-grid {
|
||||
@apply grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-8 gap-4 p-4;
|
||||
}
|
||||
|
||||
.shortcut-item {
|
||||
@apply flex flex-col items-center justify-center p-4 bg-white rounded-lg shadow
|
||||
transition-all duration-200 cursor-pointer text-gray-900 h-24;
|
||||
}
|
||||
|
||||
.shortcut-item:hover {
|
||||
@apply transform -translate-y-[3px] shadow-[0_4px_12px_rgba(0,0,0,0.1)]
|
||||
bg-[rgba(0,104,74,0.05)] text-[#00684a];
|
||||
}
|
||||
|
||||
.shortcut-icon {
|
||||
@apply text-2xl text-[#00684a] mb-2.5;
|
||||
}
|
||||
|
||||
.shortcut-label {
|
||||
@apply text-sm text-center;
|
||||
}
|
||||
|
||||
/* 文档列表 */
|
||||
.doc-list {
|
||||
@apply space-y-3 p-4;
|
||||
}
|
||||
|
||||
.doc-item {
|
||||
@apply flex justify-between items-center p-3 border border-gray-100 rounded-lg hover:bg-gray-50 transition-colors duration-200;
|
||||
}
|
||||
|
||||
.doc-info {
|
||||
@apply flex items-center;
|
||||
}
|
||||
|
||||
.doc-icon {
|
||||
@apply text-2xl mr-3 text-primary;
|
||||
}
|
||||
|
||||
.doc-name {
|
||||
@apply text-sm font-medium text-gray-800 mb-1;
|
||||
}
|
||||
|
||||
.doc-meta {
|
||||
@apply text-xs text-gray-500;
|
||||
}
|
||||
|
||||
.doc-status {
|
||||
@apply flex items-center;
|
||||
}
|
||||
|
||||
/* 状态标签 */
|
||||
.status-badge {
|
||||
@apply inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium;
|
||||
}
|
||||
|
||||
.status-badge.status-success {
|
||||
@apply bg-[rgba(0,104,74,0.1)] text-[#00684a];
|
||||
}
|
||||
|
||||
.status-badge.status-warning {
|
||||
@apply bg-[rgba(250,173,20,0.1)] text-[#faad14];
|
||||
}
|
||||
|
||||
.status-badge.status-error {
|
||||
@apply bg-[rgba(245,34,45,0.1)] text-[#f5222d];
|
||||
}
|
||||
|
||||
/* 卡片样式 */
|
||||
.dashboard-card {
|
||||
@apply bg-white rounded-lg shadow p-5 mb-5 transition-all duration-200;
|
||||
}
|
||||
|
||||
.dashboard-card:hover {
|
||||
@apply transform -translate-y-[3px] shadow-[0_4px_15px_rgba(0,0,0,0.1)];
|
||||
}
|
||||
|
||||
.card-title {
|
||||
@apply text-base font-semibold mb-4 flex items-center text-gray-900;
|
||||
}
|
||||
|
||||
.card-title i {
|
||||
@apply text-xl text-[#00684a] mr-2;
|
||||
}
|
||||
|
||||
/* 响应式调整 */
|
||||
@screen md {
|
||||
.stat-grid {
|
||||
@apply grid-cols-2;
|
||||
}
|
||||
}
|
||||
|
||||
@screen lg {
|
||||
.stat-grid {
|
||||
@apply grid-cols-4;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
/**
|
||||
* 页面样式索引文件
|
||||
* 集中导入所有页面特定样式
|
||||
*/
|
||||
|
||||
/* 首页 */
|
||||
@import "./home.css";
|
||||
|
||||
/* 评查点列表 */
|
||||
@import "./rules_index.css";
|
||||
|
||||
/* 评查点分组 */
|
||||
@import "./rule-groups.css";
|
||||
|
||||
/* 其他页面 - 待创建 */
|
||||
/*
|
||||
@import "./files.css";
|
||||
@import "./rules.css";
|
||||
@import "./reviews.css";
|
||||
@import "./settings.css";
|
||||
*/
|
||||
|
||||
/**
|
||||
* 注意：如果上述导入的文件不存在，将会在构建时报错
|
||||
* 请确保先创建这些文件，或者先注释掉不存在的文件
|
||||
*/
|
||||
@@ -0,0 +1,76 @@
|
||||
/* 评查点分组管理页面样式 */
|
||||
|
||||
/* 树形结构样式 */
|
||||
.tree-table .group-row {
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.tree-table .group-row:hover {
|
||||
background-color: rgba(0, 104, 74, 0.05);
|
||||
}
|
||||
|
||||
.tree-table .parent-row {
|
||||
background-color: #f9f9f9;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.tree-table .child-row {
|
||||
border-left: 3px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.expand-icon {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border-radius: 4px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.expand-icon:hover {
|
||||
background-color: rgba(0, 104, 74, 0.1);
|
||||
}
|
||||
|
||||
.group-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 2px 8px;
|
||||
border-radius: 12px;
|
||||
font-size: 12px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.parent-badge {
|
||||
background-color: rgba(0, 104, 74, 0.1);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.child-badge {
|
||||
background-color: rgba(0, 104, 74, 0.05);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 2px 8px;
|
||||
border-radius: 12px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* 按钮文本样式，不与其他冲突 */
|
||||
.btn-text {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color: var(--color-gray-800);
|
||||
padding: 4px 8px;
|
||||
}
|
||||
|
||||
/* 小尺寸按钮 */
|
||||
.btn-sm {
|
||||
padding: 4px 8px;
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -0,0 +1,80 @@
|
||||
/* 评查点列表页面样式 */
|
||||
|
||||
/* 筛选区域 */
|
||||
.filter-card {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* 搜索框样式 */
|
||||
.search-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.search-box .form-input {
|
||||
flex: 1;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.search-box .ant-btn {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
/* 表格样式 */
|
||||
.rules-table {
|
||||
width: 100%;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
/* 表格操作列样式 */
|
||||
.operations-cell {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 状态点样式 */
|
||||
.status-dot {
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.status-dot-success {
|
||||
background-color: #52c41a;
|
||||
}
|
||||
|
||||
.status-dot-default {
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
|
||||
/* 标签自定义样式 */
|
||||
.rule-tag {
|
||||
padding: 2px 8px;
|
||||
font-size: 12px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/* 表格行悬停效果 */
|
||||
.ant-table tbody tr:hover {
|
||||
background-color: rgba(0, 0, 0, 0.02);
|
||||
}
|
||||
|
||||
/* 页面标题区域 */
|
||||
.page-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* 卡片内容间距 */
|
||||
.content-card {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.content-card .ant-card-body {
|
||||
padding: 0;
|
||||
}
|
||||
Reference in New Issue
Block a user