This commit is contained in:
Leo
2026-01-17 18:22:15 +08:00
parent dc66a9cf53
commit 1639a650cf

View File

@@ -1,39 +1,25 @@
<template>
<div class="mobile-container">
<div class="mobile-card">
<div class="mobile-header">
<h3>评论生成公开</h3>
<div class="header-info">
<span class="ip-info">
<i class="el-icon-monitor"></i>
IP: {{ currentIP || '获取中...' }}
</span>
</div>
</div>
<div class="mobile-form">
<!-- 使用统计区域 -->
<!-- 访问统计区域 -->
<div class="form-section usage-statistics-section">
<div class="form-label">
<i class="el-icon-data-line"></i>
使用统计
</div>
<div class="usage-stats-grid">
<div class="usage-stats-row">
<div class="usage-stat-item">
<div class="usage-stat-number">{{ usageStatistics.today || 0 }}</div>
<div class="usage-stat-label">今天</div>
<div class="usage-stat-number">{{ usageStatistics.today || 0 }}</div>
</div>
<div class="usage-stat-item">
<div class="usage-stat-number">{{ usageStatistics.last7Days || 0 }}</div>
<div class="usage-stat-label">近7天</div>
<div class="usage-stat-number">{{ usageStatistics.last7Days || 0 }}</div>
</div>
<div class="usage-stat-item">
<div class="usage-stat-number">{{ usageStatistics.last30Days || 0 }}</div>
<div class="usage-stat-label">近30天</div>
<div class="usage-stat-number">{{ usageStatistics.last30Days || 0 }}</div>
</div>
<div class="usage-stat-item">
<div class="usage-stat-number">{{ usageStatistics.total || 0 }}</div>
<div class="usage-stat-label">累计</div>
<div class="usage-stat-number">{{ usageStatistics.total || 0 }}</div>
</div>
</div>
</div>
@@ -553,46 +539,14 @@ export default {
overflow: hidden;
}
/* 头部样式 */
.mobile-header {
background: linear-gradient(135deg, #409EFF 0%, #67C23A 100%);
color: #fff;
padding: 20px 16px;
text-align: center;
}
.mobile-header h3 {
margin: 0 0 12px 0;
font-size: 18px;
font-weight: 600;
}
.header-info {
margin-top: 8px;
}
.ip-info {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
opacity: 0.9;
background: rgba(255, 255, 255, 0.2);
padding: 4px 12px;
border-radius: 12px;
}
.ip-info i {
font-size: 14px;
}
/* 表单样式 */
.mobile-form {
padding: 20px 16px;
padding: 12px 16px;
}
.form-section {
margin-bottom: 24px;
margin-bottom: 16px;
}
.form-label {
@@ -852,10 +806,6 @@ export default {
height: 80px;
}
.mobile-header h3 {
font-size: 16px;
}
.generate-btn {
height: 44px;
font-size: 15px;
@@ -1144,45 +1094,48 @@ export default {
}
}
/* 使用统计样式 */
/* 访问统计样式 */
.usage-statistics-section {
background: linear-gradient(135deg, #f8f9ff 0%, #f0f4ff 100%);
border: 1px solid #e1e8ff;
border-radius: 10px;
padding: 12px;
margin-bottom: 20px;
border-radius: 8px;
padding: 8px 10px;
margin-bottom: 16px;
}
.usage-statistics-section .form-label {
font-size: 13px;
margin-bottom: 8px;
}
.usage-stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 8px;
.usage-stats-row {
display: flex;
justify-content: space-around;
align-items: center;
gap: 4px;
}
.usage-stat-item {
flex: 1;
text-align: center;
background: #fff;
padding: 8px 6px;
border-radius: 6px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}
.usage-stat-number {
font-size: 18px;
font-weight: 700;
color: #409eff;
margin-bottom: 2px;
padding: 6px 4px;
border-radius: 4px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.usage-stat-label {
font-size: 11px;
font-size: 10px;
color: #909399;
font-weight: 500;
margin-bottom: 2px;
line-height: 1.2;
}
.usage-stat-number {
font-size: 16px;
font-weight: 700;
color: #409eff;
line-height: 1.2;
}
/* 历史记录样式 */
@@ -1263,30 +1216,24 @@ export default {
/* 响应式适配 */
@media (max-width: 480px) {
.usage-statistics-section {
padding: 10px;
margin-bottom: 16px;
padding: 6px 8px;
margin-bottom: 12px;
}
.usage-statistics-section .form-label {
font-size: 12px;
margin-bottom: 6px;
}
.usage-stats-grid {
grid-template-columns: repeat(2, 1fr);
gap: 6px;
.usage-stats-row {
gap: 3px;
}
.usage-stat-item {
padding: 8px 4px;
padding: 5px 3px;
}
.usage-stat-number {
font-size: 16px;
font-size: 14px;
}
.usage-stat-label {
font-size: 10px;
font-size: 9px;
}
.history-item-header {
@@ -1294,11 +1241,6 @@ export default {
align-items: flex-start;
gap: 4px;
}
.ip-info {
font-size: 12px;
padding: 3px 10px;
}
}
</style>