-
-
-
-
-
-
{{ card.value }}
-
{{ card.label }}
-
+
+
+
+
+
+ 类目分布
+
+
+ 共 {{ categoryBars.length }} 个类目
+
+
+
暂无数据
+
+
+
{{ bar.name }}
+
+
{{ bar.count }}
+
{{ bar.ratio }}%
+
-
-
-
-
- 类目分布
-
-
- 共 {{ categoryBars.length }} 个类目
-
-
-
暂无数据
-
-
-
{{ bar.name }}
-
-
{{ bar.count }}
-
{{ bar.ratio }}%
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
@@ -293,14 +370,67 @@ onMounted(() => {
margin-bottom: 16px;
}
-.overview__search {
+/* 概览统计(Statistic 卡片) */
+.overview__stats {
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+ gap: 16px;
+ margin-bottom: 28px;
+}
+
+.overview__stat-card {
background: #fff;
border: 1px solid #f0f0f0;
border-radius: 8px;
- padding: 16px;
+ box-shadow: 0 1px 2px rgba(0, 21, 41, 0.04);
+}
+
+.overview__stat-card:hover {
+ box-shadow: 0 4px 12px rgba(0, 21, 41, 0.08);
+ transform: translateY(-2px);
+}
+
+/* 检索区(居中放大) */
+.overview__search-well {
+ background: linear-gradient(135deg, #f0f7ff 0%, #eef2ff 100%);
+ border: 1px solid #e0e7ff;
+ border-radius: 12px;
+ padding: 36px 24px;
+ text-align: center;
margin-bottom: 24px;
}
+.overview__search-bar {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 12px;
+ max-width: 760px;
+ margin: 0 auto;
+}
+
+.overview__search-form {
+ flex: 1;
+ min-width: 0;
+}
+
+.overview__search-form-item {
+ margin-bottom: 0;
+}
+
+.overview__search-input {
+ font-size: 16px;
+}
+
+.overview__search-params {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 12px;
+ margin-top: 12px;
+ font-size: 13px;
+}
+
.overview__result {
margin-top: 16px;
}
@@ -359,63 +489,6 @@ onMounted(() => {
color: #1f2937;
}
-.overview__cards {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
- gap: 16px;
- margin-bottom: 24px;
-}
-
-.overview__card {
- background: #fff;
- border: 1px solid #f0f0f0;
- border-radius: 8px;
- padding: 16px 18px;
- transition: all 0.2s;
- box-shadow: 0 1px 2px rgba(0, 21, 41, 0.04);
-}
-
-.overview__card:hover {
- box-shadow: 0 4px 12px rgba(0, 21, 41, 0.08);
- transform: translateY(-2px);
-}
-
-.overview__card-body {
- display: flex;
- align-items: center;
- gap: 14px;
-}
-
-.overview__card-icon {
- display: inline-flex;
- align-items: center;
- justify-content: center;
- width: 44px;
- height: 44px;
- border-radius: 8px;
- font-size: 22px;
- flex: 0 0 auto;
-}
-
-.overview__card-info {
- display: flex;
- flex-direction: column;
- gap: 2px;
- min-width: 0;
-}
-
-.overview__card-num {
- font-size: 26px;
- font-weight: 700;
- color: #1f2937;
- line-height: 1.1;
-}
-
-.overview__card-label {
- font-size: 12px;
- color: #6b7280;
-}
-
.overview__section {
margin-top: 8px;
}
@@ -504,5 +577,8 @@ onMounted(() => {
.overview__bar-name {
width: 120px;
}
+ .overview__search-bar {
+ flex-direction: column;
+ }
}
\ No newline at end of file