|
|
|
@ -3,34 +3,27 @@ |
|
|
|
<div class="title-value"> |
|
|
|
<div class="word">大事记</div> |
|
|
|
</div> |
|
|
|
<div :style="{ width: '92%', height: '92%',margin: '8% 5% auto 3%' }" id="memorabilia"> |
|
|
|
<div class="content"> |
|
|
|
<div class="firewall"> |
|
|
|
<div class="firewall1">防火墙</div> |
|
|
|
<div class="firewall2">2021-04-08</div> |
|
|
|
</div> |
|
|
|
<div class="firewall3"> |
|
|
|
<p>有助于提高计算机的安全性。Windows防火墙能够限制从其他计算机送到用户计算机上的信息...</p> |
|
|
|
</div> |
|
|
|
<div :style="{ width: '92%', height: '78%',margin: '8% 5% auto 3%' }" style="overflow:hidden"> |
|
|
|
<div class="matter" id="memorabilia"> |
|
|
|
<div :key="index" class="content" v-for="(detail,index) in details"> |
|
|
|
<div class="firewall"> |
|
|
|
<div class="firewall1">{{detail.title}}</div> |
|
|
|
<div class="firewall2">{{detail.time}}</div> |
|
|
|
</div> |
|
|
|
<div class="firewall3"> |
|
|
|
<p>{{detail.describe}}</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="content"> |
|
|
|
<div class="firewall"> |
|
|
|
<div class="firewall1">防火墙</div> |
|
|
|
<div class="firewall2">2021-04-08</div> |
|
|
|
</div> |
|
|
|
<div class="firewall3"> |
|
|
|
<p>有助于提高计算机的安全性。Windows防火墙能够限制从其他计算机送到用户计算机上的信息...</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="content"> |
|
|
|
<div class="firewall"> |
|
|
|
<div class="firewall1">防火墙</div> |
|
|
|
<div class="firewall2">2021-04-08</div> |
|
|
|
</div> |
|
|
|
<div class="firewall3"> |
|
|
|
<p>有助于提高计算机的安全性。Windows防火墙能够限制从其他计算机送到用户计算机上的信息...</p> |
|
|
|
</div> |
|
|
|
<div :key="index" class="content" v-for="(detail,index) in details"> |
|
|
|
<div class="firewall"> |
|
|
|
<div class="firewall1">{{detail.title}}</div> |
|
|
|
<div class="firewall2">{{detail.time}}</div> |
|
|
|
</div> |
|
|
|
<div class="firewall3"> |
|
|
|
<p>{{detail.describe}}</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- <div :style="{ width: '92%', height: '92%',margin: 'auto 3% auto 5%' }" id="temperature"></div> --> |
|
|
|
</div> |
|
|
|
@ -38,18 +31,47 @@ |
|
|
|
|
|
|
|
<script lang="ts"> |
|
|
|
import { defineComponent } from 'vue' |
|
|
|
import * as echarts from 'echarts' |
|
|
|
import { getTeamAndHumidity } from 'api/api' |
|
|
|
|
|
|
|
export default defineComponent({ |
|
|
|
name: 'memorabilia', |
|
|
|
data() { |
|
|
|
return { |
|
|
|
myCharts: {}, |
|
|
|
temps: [], |
|
|
|
details: [ |
|
|
|
{ |
|
|
|
title: '防火墙', |
|
|
|
time: '2021-04-08', |
|
|
|
describe: |
|
|
|
'有助于提高计算机的安全性。Windows防火墙能够限制从其他计算机送到用户计算机上的信息,这使得用户可以更好的控制', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '代理服务器', |
|
|
|
time: '2021-04-08', |
|
|
|
describe: |
|
|
|
'代理服务器代表内部客户端与外部的服务器通信,代理服务器这个术语通常是指一个应用级的网关,虽然电路级网关也可作为代理服务器的一种', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '包过滤', |
|
|
|
time: '2021-04-08', |
|
|
|
describe: |
|
|
|
'包过滤是处理网络上基于packet-by-packet流量的设备,包过滤设备允许或阻止包,典型的实施方法是通过标准的路由器,包过滤是几种不同防火墙的类型之一.', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '电路级网关', |
|
|
|
time: '2021-04-08', |
|
|
|
describe: |
|
|
|
'电路级网关用来监控受信任的客户或服务器与不受信任的主机间的TCP握手信息,这样来决定这个会话是否悠哉游哉,电路级网关是在OSI模型中会话层上来过滤数据包', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '代理服务器', |
|
|
|
time: '2021-04-08', |
|
|
|
describe: |
|
|
|
'代理服务器代表内部客户端与外部的服务器通信,代理服务器这个术语通常是指一个应用级的网关,虽然电路级网关也可作为代理服务器的一种.', |
|
|
|
}, |
|
|
|
], |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
methods: {}, |
|
|
|
}) |
|
|
|
</script> |
|
|
|
|
|
|
|
@ -59,4 +81,18 @@ export default defineComponent({ |
|
|
|
width: 1440rem; |
|
|
|
height: 1110rem; |
|
|
|
} |
|
|
|
.matter { |
|
|
|
animation: myMove 20s linear infinite; |
|
|
|
animation-fill-mode: forwards; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
/*文字无缝滚动*/ |
|
|
|
@keyframes myMove { |
|
|
|
0% { |
|
|
|
transform: translateY(0); |
|
|
|
} |
|
|
|
100% { |
|
|
|
transform: translateY(-392rem); |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
