You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

81 lines
3.1 KiB

<script setup>
const servers = [
{
name: "泰国",
ip: "43.133.103.128",
domain: "https://ag-th.jiagutech.com",
userpass: "13951707395 / w12345678",
config: "main-th",
app: "—",
containerized: "否",
server: "2台8G",
sync: "是",
deployTime: "23.04",
services: "user, drone, oper, tftz, route, udp, canal, sms, framework"
},
{
name: "印度1",
ip: "—",
domain: "http://ag.xagrotortek.com",
userpass: "1234512345 / Magicmoment19",
config: "india",
app: "india",
containerized: "是",
server: "1台",
sync: "否",
deployTime: "23.07",
services: "user, drone, oper, sms, encrypt, udp, framework"
},
// 更多服务器数据...
]
</script>
<style scoped>
.server-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
gap: 1rem;
margin-top: 1.5rem;
}
.server-card {
border: 1px solid var(--vp-c-divider);
border-radius: 8px;
padding: 1rem;
background-color: var(--vp-c-bg-soft);
color: var(--vp-c-text-1);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
transition: background-color 0.3s ease, color 0.3s ease;
}
.server-card h3 {
margin-top: 0;
margin-bottom: 0.5rem;
font-size: 1.1rem;
color: var(--vp-c-brand-1);
}
.server-card .label {
font-weight: bold;
color: var(--vp-c-text-2);
}
.server-card .value {
margin-bottom: 0.3rem;
word-break: break-word;
}
</style>
<template>
<div class="server-grid">
<div v-for="server in servers" :key="server.name" class="server-card">
<h3>{{ server.name }}</h3>
<div class="value"><span class="label">公网 IP:</span>{{ server.ip }}</div>
<div class="value"><span class="label">域名:</span><a :href="server.domain" target="_blank">{{ server.domain.replace(/^https?:\/\//, '') }}</a></div>
<div class="value"><span class="label">用户名/密码:</span>{{ server.userpass }}</div>
<div class="value"><span class="label">配置:</span>{{ server.config }}</div>
<div class="value"><span class="label">App:</span>{{ server.app }}</div>
<div class="value"><span class="label">容器化:</span>{{ server.containerized }}</div>
<div class="value"><span class="label">服务器:</span>{{ server.server }}</div>
<div class="value"><span class="label">同步:</span>{{ server.sync }}</div>
<div class="value"><span class="label">部署时间:</span>{{ server.deployTime }}</div>
<div class="value"><span class="label">服务</span>{{ server.services }}</div>
</div>
</div>
</template>