117 lines
2.8 KiB
Vue
117 lines
2.8 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<!-- <Sidebar class="noneText" @activeIndex="activeIndexFn" /> -->
|
||
<div class="content ">
|
||
<!-- <div v-show="activeIndexA == 1">
|
||
<workbenches />
|
||
</div> -->
|
||
<div>
|
||
<hostsList />
|
||
</div>
|
||
<!-- <div style="position: absolute; bottom: 0; right: 0;">{{ version }}</div> -->
|
||
</div>
|
||
<div class="footer">
|
||
到期时间：{{ time }}
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, reactive, onMounted } from "vue";
|
||
// import Sidebar from '../components/Sidebar.vue';
|
||
import { RouterLink, RouterView } from 'vue-router'
|
||
import hostsList from '@/views/hosts/hostsList.vue'
|
||
import { ElMessage } from 'element-plus';
|
||
import { getUser } from "@/utils/storage";
|
||
// import workbenches from '@/views/hosts/workbenches.vue'
|
||
import { tokenStore,UserStore } from '@/stores/notice'
|
||
const userCache = UserStore()
|
||
const time = ref(formatTimestamp(userCache.user.brotherExpireTime))
|
||
// 时间格式化方法 - 将12位时间戳转为YYYY-MM-DD HH:mm:ss格式
|
||
function formatTimestamp(timestamp) {
|
||
try {
|
||
// 转换为数字
|
||
const ts = Number(timestamp);
|
||
if (isNaN(ts)) {
|
||
return '--';
|
||
}
|
||
// 处理13位时间戳（毫秒级）
|
||
const date = new Date(ts > 999999999999 ? ts : ts * 1000);
|
||
const year = date.getFullYear();
|
||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||
const day = String(date.getDate()).padStart(2, '0');
|
||
const hours = String(date.getHours()).padStart(2, '0');
|
||
const minutes = String(date.getMinutes()).padStart(2, '0');
|
||
const seconds = String(date.getSeconds()).padStart(2, '0');
|
||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
||
} catch (e) {
|
||
console.error('时间格式化错误:', e);
|
||
return '--';
|
||
}
|
||
}
|
||
|
||
|
||
</script>
|
||
|
||
<style lang="less">
|
||
body,
|
||
html {
|
||
margin: 0;
|
||
padding: 0;
|
||
height: 100%;
|
||
/* 页面无法选中 */
|
||
-webkit-user-select: none;
|
||
-moz-user-select: none;
|
||
-ms-user-select: none;
|
||
user-select: none;
|
||
}
|
||
|
||
.app-container {
|
||
display: flex;
|
||
width: 1600px;
|
||
height: 900px;
|
||
background-color: @bg-color;
|
||
position: relative;
|
||
|
||
|
||
}
|
||
|
||
.noneText {
|
||
/* 页面无法选中 */
|
||
-webkit-user-select: none;
|
||
-moz-user-select: none;
|
||
-ms-user-select: none;
|
||
user-select: none;
|
||
}
|
||
|
||
.sidebar {
|
||
width: 200px;
|
||
background-color: @bg-color;
|
||
padding: 20px;
|
||
/* box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1); */
|
||
}
|
||
|
||
.content {
|
||
// margin-left: 280px;
|
||
margin-left: 25px;
|
||
margin-right: 25px;
|
||
width: 1540px;
|
||
height: 848px;
|
||
background: #FFFFFF;
|
||
border-radius: 36px;
|
||
margin-top: 16px;
|
||
}
|
||
|
||
.center-justify {
|
||
display: flex;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
}
|
||
.footer{
|
||
position: absolute;
|
||
bottom: 10px;
|
||
left: calc(50% - 150px);
|
||
color: aqua;
|
||
font-size: 16px;
|
||
}
|
||
</style> |