完成代码路径重构
This commit is contained in:
236
pages/mall/admin/maintain/security/online-upgrade/index.uvue
Normal file
236
pages/mall/admin/maintain/security/online-upgrade/index.uvue
Normal file
@@ -0,0 +1,236 @@
|
||||
<template>
|
||||
<view class="admin-page">
|
||||
<view class="admin-sections">
|
||||
<!-- 提示栏 -->
|
||||
<view class="alert-info">
|
||||
<text class="alert-text">温馨提示：检查更新需要授权码，请先授权后再检查更新！</text>
|
||||
</view>
|
||||
|
||||
<!-- 选项卡 -->
|
||||
<view class="admin-tabs">
|
||||
<view
|
||||
v-for="tab in tabs"
|
||||
:key="tab.value"
|
||||
:class="['tab-item', activeTab === tab.value ? 'active' : '']"
|
||||
@click="activeTab = tab.value"
|
||||
>
|
||||
<text class="tab-label">{{ tab.label }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 升级内容 -->
|
||||
<view v-if="activeTab === 'upgrade'" class="admin-card">
|
||||
<view class="upgrade-status">
|
||||
<view class="status-item">
|
||||
<text class="label">当前版本：</text>
|
||||
<text class="value version-tag">v3.1.2</text>
|
||||
</view>
|
||||
<view class="status-item">
|
||||
<text class="label">授权状态：</text>
|
||||
<text class="value unauthorized">未授权</text>
|
||||
</view>
|
||||
<view class="status-item">
|
||||
<button class="btn primary" @click="checkUpdates">检查更新</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 升级日志内容 -->
|
||||
<view v-if="activeTab === 'log'" class="admin-card">
|
||||
<view class="table-container list-table">
|
||||
<view class="table-header">
|
||||
<view class="col col-id"><text>ID</text></view>
|
||||
<view class="col col-version"><text>版本号</text></view>
|
||||
<view class="col col-content"><text>更新内容</text></view>
|
||||
<view class="col col-time"><text>升级时间</text></view>
|
||||
</view>
|
||||
|
||||
<view class="table-body">
|
||||
<view v-for="item in logList" :key="item.id" class="table-row">
|
||||
<view class="col col-id"><text>{{ item.id }}</text></view>
|
||||
<view class="col col-version"><text>{{ item.version }}</text></view>
|
||||
<view class="col col-content"><text>{{ item.content }}</text></view>
|
||||
<view class="col col-time"><text>{{ item.time }}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref } from 'vue'
|
||||
|
||||
const activeTab = ref('upgrade')
|
||||
const tabs = [
|
||||
{ label: '系统升级', value: 'upgrade' },
|
||||
{ label: '升级日志', value: 'log' }
|
||||
]
|
||||
|
||||
const logList = ref([
|
||||
{ id: 1, version: 'v3.1.2', content: '优化核心库性能，修复已知Bug', time: '2026-02-10 10:00' },
|
||||
{ id: 2, version: 'v3.1.1', content: '修复支付接口异常，增加权限校验', time: '2026-01-25 15:30' },
|
||||
{ id: 3, version: 'v3.1.0', content: '大版本发布，优化UI界面，支持多级路由', time: '2026-01-10 09:20' }
|
||||
])
|
||||
|
||||
function checkUpdates() {
|
||||
uni.showLoading({ title: '检查中...' })
|
||||
setTimeout(() => {
|
||||
uni.hideLoading()
|
||||
uni.showToast({ title: '您已是最新版本', icon: 'success' })
|
||||
}, 1500)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.admin-page {
|
||||
/* 使用 Layout 的背景和内边距 */
|
||||
padding: 0;
|
||||
background-color: transparent;
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
background-color: #fffbe6;
|
||||
border: 1px solid #ffe58f;
|
||||
padding: 12px 16px;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
color: #856404;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.admin-tabs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
padding: 12px 24px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tab-item.active {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.tab-item.active::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 2px;
|
||||
background-color: #1890ff;
|
||||
}
|
||||
|
||||
.tab-label {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.tab-item.active .tab-label {
|
||||
color: #1890ff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.admin-card {
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
.upgrade-status {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.status-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.value {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.version-tag {
|
||||
background-color: #e6f7ff;
|
||||
color: #1890ff;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.unauthorized {
|
||||
color: #ff4d4f;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.btn {
|
||||
height: 38px;
|
||||
padding: 0 30px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
border: 1px solid #d9d9d9;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.btn.primary {
|
||||
background-color: #1890ff;
|
||||
border-color: #1890ff;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.table-container {
|
||||
width: 100%;
|
||||
border: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.table-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
background-color: #fafafa;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.table-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.col {
|
||||
padding: 12px 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.col-id { width: 80px; }
|
||||
.col-version { width: 150px; }
|
||||
.col-content { flex: 1; }
|
||||
.col-time { width: 200px; }
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user