befly-admin 3.4.5 → 3.4.7

package/src/views/internal/index/components/serviceStatus.vue

@@ -1,193 +0,0 @@
-<template>
-    <div class="section-block">
-        <div class="section-header">
-            <Icon name="Settings" :size="20" />
-            <h2>服务状态</h2>
-        </div>
-        <div class="section-content">
-            <div class="config-grid">
-                <div v-for="service in services" :key="service.name" class="config-card" :class="`config-${service.status}`">
-                    <div class="config-icon">
-                        <Icon :name="getServiceIcon(service.name)" :size="20" />
-                    </div>
-                    <div class="config-info">
-                        <div class="config-name">{{ service.name }}</div>
-                        <div class="config-status">
-                            {{ getStatusText(service.status) }}
-                            <span v-if="service.responseTime && service.responseTime !== '-'" class="latency">{{ service.responseTime }}</span>
-                        </div>
-                    </div>
-                    <div class="config-badge">
-                        <Icon :name="getStatusIcon(service.status)" :size="32" />
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script setup>
-// 组件内部数据
-const services = $ref([]);
-
-// 获取数据
-const fetchData = async () => {
-    try {
-        const { data } = await $Http('/addon/admin/dashboard/serviceStatus');
-        services.splice(0, services.length, ...data.services);
-    } catch (error) {
-        console.error('获取服务状态失败:', error);
-    }
-};
-
-fetchData();
-
-// 工具函数
-const getStatusColor = (status) => {
-    const colors = {
-        running: 'success',
-        stopped: 'error',
-        unconfigured: 'warning'
-    };
-    return colors[status] || 'default';
-};
-
-const getStatusText = (status) => {
-    const texts = {
-        running: '正常',
-        stopped: '停止',
-        unconfigured: '未配置'
-    };
-    return texts[status] || status;
-};
-
-const getServiceIcon = (name) => {
-    const icons = {
-        数据库: 'Database',
-        Redis: 'Zap',
-        文件系统: 'HardDrive',
-        邮件服务: 'Mail',
-        OSS存储: 'Cloud'
-    };
-    return icons[name] || 'Circle';
-};
-
-const getStatusIcon = (status) => {
-    const icons = {
-        running: 'CheckCircle',
-        stopped: 'XCircle',
-        unconfigured: 'AlertCircle'
-    };
-    return icons[status] || 'Circle';
-};
-</script>
-
-<style scoped lang="scss">
-.config-grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
-    gap: 10px;
-
-    .config-card {
-        background: rgba($primary-color, 0.02);
-        border: 1px solid $border-color;
-        border-radius: 6px;
-        padding: 12px;
-        display: flex;
-        align-items: center;
-        gap: 10px;
-        position: relative;
-        overflow: hidden;
-        transition: all 0.3s;
-
-        &:hover {
-            background: rgba($primary-color, 0.05);
-            border-color: $primary-color;
-            transform: translateY(-2px);
-            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-        }
-
-        .config-icon {
-            width: 40px;
-            height: 40px;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            border-radius: 6px;
-            flex-shrink: 0;
-        }
-
-        .config-info {
-            flex: 1;
-            min-width: 0;
-
-            .config-name {
-                font-size: 14px;
-                font-weight: 600;
-                margin-bottom: 2px;
-            }
-
-            .config-status {
-                font-size: 14px;
-                display: flex;
-                align-items: center;
-                gap: 4px;
-
-                .latency {
-                    margin-left: 4px;
-                    color: $text-placeholder;
-                }
-            }
-        }
-
-        .config-badge {
-            position: absolute;
-            top: 6px;
-            right: 6px;
-            opacity: 0.2;
-        }
-
-        &.config-running {
-            border-color: $success-color;
-            background: linear-gradient(135deg, rgba(82, 196, 26, 0.05), white);
-
-            .config-icon {
-                background: rgba(82, 196, 26, 0.1);
-                color: $success-color;
-            }
-
-            .config-name {
-                color: $success-color;
-            }
-        }
-
-        &.config-unconfigured {
-            border-color: $warning-color;
-            background: linear-gradient(135deg, rgba(250, 173, 20, 0.05), white);
-
-            .config-icon {
-                background: rgba(250, 173, 20, 0.1);
-                color: $warning-color;
-            }
-
-            .config-name {
-                color: $warning-color;
-            }
-        }
-
-        &.config-stopped {
-            border-color: $error-color;
-            background: linear-gradient(135deg, rgba(255, 77, 79, 0.05), white);
-
-            .config-icon {
-                background: rgba(255, 77, 79, 0.1);
-                color: $error-color;
-            }
-
-            .config-name {
-                color: $error-color;
-            }
-        }
-    }
-}
-</style>

package/src/views/internal/index/components/systemNotifications.vue

@@ -1,136 +0,0 @@
-<template>
-    <div class="section-block">
-        <div class="section-header">
-            <Icon name="Bell" :size="20" />
-            <h2>系统通知</h2>
-        </div>
-        <div class="section-content">
-            <div class="notification-compact-list">
-                <div v-for="notification in notifications" :key="notification.id" class="notification-compact-item">
-                    <div class="notification-icon" :class="`type-${notification.type}`">
-                        <Icon :name="getNotificationIcon(notification.type)" :size="16" />
-                    </div>
-                    <div class="notification-content">
-                        <span class="notification-title">{{ notification.title }}</span>
-                        <span class="notification-time">{{ formatTime(notification.createdAt) }}</span>
-                    </div>
-                    <tiny-tag v-if="!notification.isRead" type="primary" size="small">新</tiny-tag>
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script setup>
-// 组件内部数据
-const notifications = $ref([
-    { id: 1, type: 'warning', title: '系统更新提醒 - v1.1.0 版本已发布', isRead: false, createdAt: Date.now() - 3600000 },
-    { id: 2, type: 'info', title: '数据备份完成 - 今日凌晨自动备份成功', isRead: true, createdAt: Date.now() - 21600000 },
-    { id: 3, type: 'error', title: 'SSL证书即将过期 - 请及时更新证书', isRead: false, createdAt: Date.now() - 86400000 },
-    { id: 4, type: 'success', title: '性能优化完成 - 响应速度提升30%', isRead: true, createdAt: Date.now() - 172800000 }
-]);
-
-const getNotificationIcon = (type) => {
-    const iconMap = {
-        info: 'Info',
-        success: 'CheckCircle',
-        warning: 'AlertTriangle',
-        error: 'XCircle'
-    };
-    return iconMap[type] || 'Bell';
-};
-
-const formatTime = (timestamp) => {
-    const date = new Date(timestamp);
-    const now = Date.now();
-    const diff = now - timestamp;
-
-    if (diff < 3600000) {
-        return `${Math.floor(diff / 60000)}分钟前`;
-    } else if (diff < 86400000) {
-        return `${Math.floor(diff / 3600000)}小时前`;
-    } else {
-        const month = String(date.getMonth() + 1).padStart(2, '0');
-        const day = String(date.getDate()).padStart(2, '0');
-        return `${month}-${day}`;
-    }
-};
-</script>
-
-<style scoped lang="scss">
-.notification-compact-list {
-    display: flex;
-    flex-direction: column;
-    gap: $spacing-xs;
-
-    .notification-compact-item {
-        display: flex;
-        align-items: center;
-        gap: $spacing-sm;
-        padding: $spacing-sm $spacing-md;
-        background: rgba($primary-color, 0.02);
-        border-radius: $border-radius-small;
-        border: 1px solid $border-color;
-        transition: all 0.2s ease;
-
-        &:hover {
-            background: rgba($primary-color, 0.05);
-            border-color: $primary-color;
-        }
-
-        .notification-icon {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            width: 32px;
-            height: 32px;
-            border-radius: $border-radius-small;
-            flex-shrink: 0;
-
-            &.type-info {
-                background: rgba($primary-color, 0.1);
-                color: $primary-color;
-            }
-
-            &.type-success {
-                background: rgba($success-color, 0.1);
-                color: $success-color;
-            }
-
-            &.type-warning {
-                background: rgba($warning-color, 0.1);
-                color: $warning-color;
-            }
-
-            &.type-error {
-                background: rgba($error-color, 0.1);
-                color: $error-color;
-            }
-        }
-
-        .notification-content {
-            display: flex;
-            align-items: center;
-            gap: $spacing-sm;
-            flex: 1;
-            min-width: 0;
-
-            .notification-title {
-                font-size: 14px;
-                color: $text-primary;
-                font-weight: 500;
-                overflow: hidden;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-                flex: 1;
-            }
-
-            .notification-time {
-                font-size: 14px;
-                color: $text-placeholder;
-                flex-shrink: 0;
-            }
-        }
-    }
-}
-</style>

package/src/views/internal/index/components/systemOverview.vue

@@ -1,188 +0,0 @@
-<template>
-    <div class="section-block">
-        <div class="section-header">
-            <Icon name="Info" :size="20" />
-            <h2>系统概览</h2>
-        </div>
-        <div class="section-content">
-            <tiny-row :flex="true" :gap="12">
-                <tiny-col :xs="24" :sm="12" :md="12" :lg="12">
-                    <div class="info-block">
-                        <div class="stats-grid">
-                            <div class="stat-box stat-primary">
-                                <Icon name="Menu" :size="24" />
-                                <div class="stat-content">
-                                    <div class="stat-value">{{ permissionStats.menuCount }}</div>
-                                    <div class="stat-label">菜单总数</div>
-                                </div>
-                            </div>
-                            <div class="stat-box stat-success">
-                                <Icon name="Webhook" :size="24" />
-                                <div class="stat-content">
-                                    <div class="stat-value">{{ permissionStats.apiCount }}</div>
-                                    <div class="stat-label">接口总数</div>
-                                </div>
-                            </div>
-                            <div class="stat-box stat-warning">
-                                <Icon name="Users" :size="24" />
-                                <div class="stat-content">
-                                    <div class="stat-value">{{ permissionStats.roleCount }}</div>
-                                    <div class="stat-label">角色总数</div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </tiny-col>
-            </tiny-row>
-        </div>
-    </div>
-</template>
-
-<script setup>
-// 组件内部数据
-const permissionStats = $ref({
-    menuCount: 0,
-    apiCount: 0,
-    roleCount: 0
-});
-
-// 获取数据
-const fetchData = async () => {
-    try {
-        const { data } = await $Http('/addon/admin/dashboard/systemOverview');
-        Object.assign(permissionStats, data);
-    } catch (error) {
-        console.error('获取系统概览失败:', error);
-    }
-};
-
-fetchData();
-</script>
-
-<style scoped lang="scss">
-.info-block {
-    background: transparent;
-    border: none;
-    padding: 0;
-    height: 100%;
-
-    .info-header {
-        display: flex;
-        align-items: center;
-        gap: 6px;
-        padding-bottom: 8px;
-        margin-bottom: 12px;
-        border-bottom: 2px solid $primary-color;
-
-        .info-title {
-            font-size: 14px;
-            font-weight: 600;
-            color: $text-primary;
-        }
-    }
-
-    .info-grid-compact {
-        display: grid;
-        grid-template-columns: repeat(3, 1fr);
-        gap: 10px;
-
-        .info-grid-item {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            padding: 10px 12px;
-            background: rgba($primary-color, 0.02);
-            border-radius: $border-radius-small;
-            border: 1px solid $border-color;
-            transition: all 0.2s ease;
-
-            &:hover {
-                background: rgba($primary-color, 0.05);
-                border-color: $primary-color;
-            }
-
-            .label {
-                font-size: 14px;
-                color: $text-secondary;
-                font-weight: 500;
-            }
-
-            .value {
-                font-size: 14px;
-                color: $text-primary;
-                font-weight: 600;
-
-                &.highlight {
-                    color: $primary-color;
-                }
-            }
-        }
-    }
-}
-
-.stats-grid {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    gap: 10px;
-
-    .stat-box {
-        background: rgba($primary-color, 0.02);
-        border: 1px solid $border-color;
-        border-radius: 6px;
-        padding: 12px;
-        display: flex;
-        align-items: center;
-        gap: 10px;
-        transition: all 0.3s;
-
-        &:hover {
-            background: rgba($primary-color, 0.05);
-            border-color: $primary-color;
-            transform: translateY(-2px);
-            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-        }
-
-        .stat-content {
-            flex: 1;
-
-            .stat-value {
-                font-size: 20px;
-                font-weight: 700;
-                margin-bottom: 2px;
-            }
-
-            .stat-label {
-                font-size: 14px;
-                color: $text-secondary;
-            }
-        }
-
-        &.stat-primary {
-            border-color: $primary-color;
-            background: linear-gradient(135deg, rgba(0, 82, 217, 0.05), white);
-
-            .stat-value {
-                color: $primary-color;
-            }
-        }
-
-        &.stat-success {
-            border-color: $success-color;
-            background: linear-gradient(135deg, rgba(82, 196, 26, 0.05), white);
-
-            .stat-value {
-                color: $success-color;
-            }
-        }
-
-        &.stat-warning {
-            border-color: $warning-color;
-            background: linear-gradient(135deg, rgba(250, 173, 20, 0.05), white);
-
-            .stat-value {
-                color: $warning-color;
-            }
-        }
-    }
-}
-</style>

package/src/views/internal/index/components/systemResources.vue

@@ -1,104 +0,0 @@
-<template>
-    <div class="section-block">
-        <div class="section-header">
-            <Icon name="Activity" :size="20" />
-            <h2>系统资源</h2>
-        </div>
-        <div class="section-content">
-            <div class="resource-compact-list">
-                <div class="resource-compact-item">
-                    <div class="resource-compact-header">
-                        <Icon name="Cpu" :size="16" />
-                        <span class="resource-label">CPU</span>
-                        <span class="resource-value">{{ systemResources.cpu.usage }}%</span>
-                        <span class="resource-desc">{{ systemResources.cpu.cores }}核心</span>
-                    </div>
-                    <tiny-progress :percentage="systemResources.cpu.usage" :status="getProgressColor(systemResources.cpu.usage)" />
-                </div>
-                <div class="resource-compact-item">
-                    <div class="resource-compact-header">
-                        <Icon name="HardDrive" :size="16" />
-                        <span class="resource-label">内存</span>
-                        <span class="resource-value">{{ systemResources.memory.percentage }}%</span>
-                        <span class="resource-desc">{{ systemResources.memory.used }}GB / {{ systemResources.memory.total }}GB</span>
-                    </div>
-                    <tiny-progress :percentage="systemResources.memory.percentage" :status="getProgressColor(systemResources.memory.percentage)" />
-                </div>
-                <div class="resource-compact-item">
-                    <div class="resource-compact-header">
-                        <Icon name="Disc" :size="16" />
-                        <span class="resource-label">磁盘</span>
-                        <span class="resource-value">{{ systemResources.disk.percentage }}%</span>
-                        <span class="resource-desc">{{ systemResources.disk.used }}GB / {{ systemResources.disk.total }}GB</span>
-                    </div>
-                    <tiny-progress :percentage="systemResources.disk.percentage" :status="getProgressColor(systemResources.disk.percentage)" />
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script setup>
-// 组件内部数据
-const systemResources = $ref({
-    cpu: { usage: 0, cores: 0 },
-    memory: { used: 0, total: 0, percentage: 0 },
-    disk: { used: 0, total: 0, percentage: 0 }
-});
-
-// 获取数据
-const fetchData = async () => {
-    try {
-        const { data } = await $Http('/addon/admin/dashboard/systemResources');
-        Object.assign(systemResources, data);
-    } catch (error) {
-        console.error('获取系统资源失败:', error);
-    }
-};
-
-fetchData();
-
-// 工具函数
-const getProgressColor = (percentage) => {
-    if (percentage < 50) return 'success';
-    if (percentage < 80) return 'warning';
-    return 'danger';
-};
-</script>
-
-<style scoped lang="scss">
-.resource-compact-list {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    gap: $spacing-md;
-
-    .resource-compact-item {
-        .resource-compact-header {
-            display: flex;
-            align-items: center;
-            gap: 10px;
-            margin-bottom: 8px;
-
-            .resource-label {
-                font-size: 14px;
-                font-weight: 600;
-                color: $text-secondary;
-                min-width: 50px;
-            }
-
-            .resource-value {
-                font-size: 16px;
-                font-weight: 700;
-                color: $primary-color;
-                min-width: 60px;
-            }
-
-            .resource-desc {
-                font-size: 14px;
-                color: $text-placeholder;
-                flex: 1;
-            }
-        }
-    }
-}
-</style>