调整部分页面样式布局
This commit is contained in:
@@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<view class="product-statistic-page">
|
||||
<!-- 商品概况头部 -->
|
||||
<view class="page-header-row">
|
||||
<view class="admin-page">
|
||||
<view class="admin-sections">
|
||||
<!-- 商品概况头部 -->
|
||||
<view class="admin-card page-header-row">
|
||||
<view class="title-wrap">
|
||||
<text class="page-title">商品概况</text>
|
||||
<view class="info-icon">?</view>
|
||||
@@ -18,7 +19,7 @@
|
||||
|
||||
<!-- 统计指标网格 (使用统一响应式网格) -->
|
||||
<view class="kpi-grid">
|
||||
<view v-for="(item, index) in statItems" :key="index" class="stat-card">
|
||||
<view v-for="(item, index) in statItems" :key="index" class="admin-card stat-card">
|
||||
<view class="stat-main">
|
||||
<view class="icon-box" :style="{ backgroundColor: item.bgColor }">
|
||||
<text class="stat-emoji">{{ item.emoji }}</text>
|
||||
@@ -41,7 +42,7 @@
|
||||
</view>
|
||||
|
||||
<!-- 图表卡片 -->
|
||||
<view class="chart-card">
|
||||
<view class="admin-card chart-card">
|
||||
<view class="chart-header">
|
||||
<view class="legend-wrap">
|
||||
<view class="legend-item"><view class="dot purple"></view><text>商品浏览量</text></view>
|
||||
@@ -59,7 +60,7 @@
|
||||
</view>
|
||||
|
||||
<!-- 商品排行 -->
|
||||
<view class="ranking-card">
|
||||
<view class="admin-card ranking-card">
|
||||
<view class="ranking-header">
|
||||
<text class="ranking-title">商品排行</text>
|
||||
<view class="ranking-filters">
|
||||
@@ -108,6 +109,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@@ -314,18 +316,11 @@ function initChart() {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.product-statistic-page {
|
||||
padding: 16px;
|
||||
background-color: #f0f2f5;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.page-header-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.title-wrap {
|
||||
@@ -369,9 +364,6 @@ function initChart() {
|
||||
|
||||
/* stat-grid 已废弃,由全局 kpi-grid 接管 */
|
||||
.stat-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
@@ -412,9 +404,6 @@ function initChart() {
|
||||
.arrow { font-size: 10px; margin-left: 2px; }
|
||||
|
||||
.chart-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.chart-header {
|
||||
|
||||
Reference in New Issue
Block a user