parent
0e329753a9
commit
16eece1b01
30 changed files with 687 additions and 89 deletions
|
After Width: | Height: | Size: 443 KiB |
|
After Width: | Height: | Size: 791 KiB |
|
After Width: | Height: | Size: 92 KiB |
|
After Width: | Height: | Size: 44 KiB |
|
After Width: | Height: | Size: 904 KiB |
|
After Width: | Height: | Size: 857 KiB |
|
After Width: | Height: | Size: 1.0 MiB |
|
After Width: | Height: | Size: 501 KiB |
|
After Width: | Height: | Size: 30 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 1.2 MiB |
|
After Width: | Height: | Size: 569 KiB |
|
After Width: | Height: | Size: 225 KiB |
|
After Width: | Height: | Size: 37 KiB |
|
After Width: | Height: | Size: 474 KiB |
@ -0,0 +1,136 @@ |
||||
<template> |
||||
<div class="wrap"> |
||||
<div class="banner">装置介绍</div> |
||||
|
||||
<div class="block share"> |
||||
<div class="inner"> |
||||
<h6>光束线</h6> |
||||
<p class="en">The beam line</p> |
||||
<div class="sum">S³FEL光束线覆盖的波段范围为1~30 nm，包含前端区、光学传输系统和诊断系统，是连接自由电子激光光源和后端科学实验站的桥梁。</div> |
||||
<div class="flex"> |
||||
<div class="left"> |
||||
<div class="des">光束线的作用是将光源发出的超快、全相干、高亮度的激光高效地传输到实验站样品处，并在传输过程中对FEL脉冲进行频谱诊断、脉冲能量诊断、光斑位置诊断、光斑横向分布诊断、脉冲到达时间诊断、波前诊断、偏振诊断等。同时根据后端实验站的不同科学需求，可进一步对FEL脉冲进行单色化、脉冲能量衰减、横向光斑微聚焦等。</div> |
||||
</div> |
||||
<img class="pic" src="@/assets/images/device/1.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="intro"> |
||||
<img class="pic" src="@/assets/images/device/2.png" alt=""> |
||||
<div class="des">波荡器是S³FEL光束线的关键部件，由一系列N极和S极交替排列的磁铁阵列构成，是一种能够产生空间周期性分布磁场的电磁装置。被超导直线加速器加速的高能电子束经过波荡器时，将扭摆状波荡前行。通过合理选择电子束和波荡器的参数，可使电子束在每个波动周期内与波荡器发出的同步辐射相互干涉，以获得超高亮度、强相干、高重频的X射线自由电子激光。</div> |
||||
</div> |
||||
|
||||
<div class="unit"> |
||||
<h6>波荡器性能指标</h6> |
||||
<img class="pic" src="@/assets/images/device/3.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import mixins from '@/mixins/page' |
||||
export default { |
||||
mixins: [mixins], |
||||
data() { |
||||
return { |
||||
|
||||
} |
||||
}, |
||||
mounted() { |
||||
|
||||
}, |
||||
methods: { |
||||
|
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
@import "../../../styles/page/page.scss"; |
||||
.wrap { |
||||
background: url(../../../assets/images/device/4.png) (100% 1363px)/auto no-repeat; |
||||
} |
||||
.banner { |
||||
background: url(../../../assets/images/device/13.png) 0 0/100% 100% no-repeat; |
||||
} |
||||
.share { |
||||
position: relative; |
||||
.inner { |
||||
width: 1323px; |
||||
} |
||||
.left { |
||||
width: 547px; |
||||
margin-right: 66px; |
||||
} |
||||
h6 { |
||||
position: relative; |
||||
font-size: 48px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #333333; |
||||
} |
||||
.en { |
||||
margin-top: -35px; |
||||
font-size: 48px; |
||||
font-family: PingFangSC-Light, PingFang SC; |
||||
font-weight: 300; |
||||
color: #E3E3E3; |
||||
} |
||||
.sum { |
||||
margin-top: 60px; |
||||
font-size: 28px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #333333; |
||||
line-height: 44px; |
||||
} |
||||
.des { |
||||
margin-top: 25px; |
||||
font-size: 18px; |
||||
color: #333; |
||||
line-height: 37px; |
||||
overflow: visible; |
||||
} |
||||
.pic { |
||||
width: 710px; |
||||
height: 509px; |
||||
margin-top: -30px; |
||||
border-top-left-radius: 20px; |
||||
} |
||||
} |
||||
.intro { |
||||
display: flex; |
||||
align-items: center; |
||||
max-width: 1490px; |
||||
width: 90%; |
||||
height: 393px; |
||||
margin-bottom: 67px; |
||||
.pic { |
||||
width: 60%; |
||||
height: 100%; |
||||
} |
||||
.des { |
||||
height: 100%; |
||||
padding: 57px 60px 20px 60px; |
||||
font-size: 22px; |
||||
color: #fff; |
||||
line-height: 40px; |
||||
background: #2E4984; |
||||
} |
||||
} |
||||
.unit { |
||||
width: 986px; |
||||
padding-bottom: 60px; |
||||
margin: 0 auto; |
||||
h6 { |
||||
padding-left: 15px; |
||||
margin-bottom: 15px; |
||||
font-size: 20px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #2A2A2A; |
||||
border-left: 4px solid #1583FF; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,141 @@ |
||||
<template> |
||||
<div class="wrap"> |
||||
<div class="banner">装置介绍</div> |
||||
|
||||
<div class="block share"> |
||||
<div class="inner"> |
||||
<h6>整体布局</h6> |
||||
<p class="en">The overall layout</p> |
||||
<div class="card">S³FEL装置主要包括一台超导直线加速器（电子束能量为2.5 GeV、重复频率为1 MHz）、4条波荡器线及首批14个实验线站。根据具体的功能可以分为注入器、主加速器、自由电子激光放大器（波荡器线）、光束线和实验站，还有包括束流诊断、控制、激光、同步、数据采集与处理等在内的公共子系统，以及低温、公用设施等配套系统和设施。</div> |
||||
<div class="flex" style="margin-top: 290px"> |
||||
<div class="left"> |
||||
<div class="des"> S³FEL首批拟建设4条波荡器线，分别是2条外种子（EEHG）线和2条自放大自发辐射（SASE）线，以同时满足首批实验站的不同研究需求。按照能区划分，FEL-1、FEL-2工作在自放大自发辐射模式（SASE），并且为将来升级为self-seeding模式预留空间。FEL-1出光波段为1-3 nm（调整电子束能量时可覆盖1-6 nm），FEL-2输出光波长为2.3-15 nm，作为光刻研究专用光束线。FEL-3和4基于回声型谐波产生原理（EEHG），FEL-3输出波长为2.3-15 nm，涵盖水窗波段，FEL-4输出波长为5-30 nm的极紫外FEL脉冲。通过快速束流分配技术，波荡器束线可同时工作。各条波荡器线产生的FEL光，通过光束线系统实现FEL光学参数的实时诊断，包括光强、光谱、光斑位置，光斑尺寸以及相干性等，并通过传输与聚焦系统传输至后端的实验站，以满足各个实验站对光源的不同需求。首批建设实验站共涉及6个前沿科技领域，分别为极紫外光刻、量子材料、能源催化、生物医药、大气与星际科学以及原子分子科学。</div> |
||||
</div> |
||||
<img class="pic" src="@/assets/images/device/6.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="intro"> |
||||
<img class="bg" src="@/assets/images/device/7.png" alt=""> |
||||
<img class="pic" src="@/assets/images/device/8.png" alt=""> |
||||
</div> |
||||
|
||||
<div class="unit"> |
||||
<h6>S³FEL性能指标</h6> |
||||
<img class="pic" src="@/assets/images/device/9.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import mixins from '@/mixins/page' |
||||
import Breadcrumb from '@/components/breadcrumb' |
||||
export default { |
||||
mixins: [mixins], |
||||
data() { |
||||
return { |
||||
routes: [] |
||||
} |
||||
}, |
||||
components: { |
||||
Breadcrumb |
||||
}, |
||||
mounted() { |
||||
|
||||
}, |
||||
methods: { |
||||
|
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
@import "../../../styles/page/page.scss"; |
||||
.wrap { |
||||
background: url(../../../assets/images/device/4.png) bottom right/auto no-repeat; |
||||
} |
||||
.banner { |
||||
background: url(../../../assets/images/device/14.png) 0 0/100% 100% no-repeat; |
||||
} |
||||
.share { |
||||
position: relative; |
||||
.inner { |
||||
width: 90%; |
||||
max-width: 1323px; |
||||
} |
||||
.left { |
||||
width: 547px; |
||||
margin-right: 66px; |
||||
} |
||||
h6 { |
||||
position: relative; |
||||
font-size: 48px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #333333; |
||||
} |
||||
.en { |
||||
margin: -35px 0 40px; |
||||
font-size: 48px; |
||||
font-family: PingFangSC-Light, PingFang SC; |
||||
font-weight: 300; |
||||
color: #E3E3E3; |
||||
} |
||||
.card { |
||||
position: absolute; |
||||
left: 0; |
||||
max-width: 1671px; |
||||
width: 90%; |
||||
padding: 32px 52px 25px 16%; |
||||
font-size: 24px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
line-height: 38px; |
||||
background: url(../../../assets/images/device/5.png) 0 0/cover no-repeat; |
||||
} |
||||
.des { |
||||
margin-top: 25px; |
||||
font-size: 18px; |
||||
color: #333; |
||||
line-height: 37px; |
||||
overflow: visible; |
||||
} |
||||
.pic { |
||||
width: 710px; |
||||
height: 509px; |
||||
border-top-left-radius: 20px; |
||||
} |
||||
} |
||||
.intro { |
||||
position: relative; |
||||
height: 794px; |
||||
margin-bottom: 37px; |
||||
.bg { |
||||
position: absolute; |
||||
top: 0; |
||||
left: 0; |
||||
} |
||||
.pic { |
||||
position: absolute; |
||||
top: 67px; |
||||
left: 15%; |
||||
width: 74%; |
||||
} |
||||
} |
||||
.unit { |
||||
width: 986px; |
||||
padding-bottom: 60px; |
||||
margin: 0 auto; |
||||
h6 { |
||||
padding-left: 15px; |
||||
margin-bottom: 15px; |
||||
font-size: 20px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #2A2A2A; |
||||
border-left: 4px solid #1583FF; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,153 @@ |
||||
<template> |
||||
<div class="wrap"> |
||||
<div class="banner">装置介绍</div> |
||||
|
||||
<div class="block history gray"> |
||||
<div class="inner"> |
||||
<h2 class="wow fadeInLeft">超导直线加速器-1</h2> |
||||
<p class="en">Superconducting linac -1</p> |
||||
<div class="texts wow fadeInDown" data-wow-delay="0.5s"> |
||||
<div class="left"> |
||||
<h6>S³FEL的光阴极注入器/电子枪利用光电效应产生高亮度电子束团，并将其加速到90 MeV。</h6> |
||||
<div class="line"></div> |
||||
<div class="des">主加速器基于超导连续波工作模式，采用三级加速、两级压缩的结构，将电子束团能量提高到2.5 GeV；同时在保持横向发射度不变的情况下，将电子束长度从几皮秒压缩到几十飞秒，峰值流强提升到800 A以上。相比基于常温加速技术的高增益FEL，超导直线加速器技术可以有效提高电子束流的重复频率，实现最高每秒106脉冲输出（常温加速技术为~102脉冲/秒），进而大幅度提高FEL激光的平均功率。</div> |
||||
</div> |
||||
<img class="bg" src="@/assets/images/device/10.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="block intro"> |
||||
<div class="inner"> |
||||
<div class="left"> |
||||
<h5>S³FEL超导直线加速器示意图</h5> |
||||
<img src="@/assets/images/device/11.png" alt=""> |
||||
</div> |
||||
<div class="right"> |
||||
<h6>S³FEL超导直线加速器性能指标</h6> |
||||
<img src="@/assets/images/device/12.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import mixins from '@/mixins/page' |
||||
export default { |
||||
mixins: [mixins], |
||||
data() { |
||||
return { |
||||
|
||||
} |
||||
}, |
||||
mounted() { |
||||
|
||||
}, |
||||
methods: { |
||||
|
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
@import "../../../styles/page/page.scss"; |
||||
.banner { |
||||
background: url(../../../assets/images/device/15.png) 0 0/100% 100% no-repeat; |
||||
} |
||||
.history { |
||||
.inner { |
||||
width: 90%; |
||||
max-width: 1504px; |
||||
} |
||||
h2 { |
||||
position: relative; |
||||
font-size: 48px; |
||||
font-family: PingFangSC-Semibold, PingFang SC; |
||||
font-weight: 600; |
||||
color: #1C1C1C; |
||||
} |
||||
.en { |
||||
margin: -35px 0 40px; |
||||
font-size: 48px; |
||||
font-family: PingFangSC-Light, PingFang SC; |
||||
font-weight: 300; |
||||
color: #E3E3E3; |
||||
} |
||||
.texts { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
padding: 82px 0 30px 38px; |
||||
margin-top: 20px; |
||||
background: #1583FF; |
||||
border-radius: 65px 100px 0px 0px; |
||||
transition: .3s; |
||||
&:hover { |
||||
transform: scale(1.05); |
||||
} |
||||
} |
||||
.left { |
||||
width: 50%; |
||||
} |
||||
h6 { |
||||
font-size: 28px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
} |
||||
.line { |
||||
width: 214px; |
||||
height: 5px; |
||||
margin: 54px 0 44px; |
||||
background: #FFFFFF; |
||||
opacity: 0.52; |
||||
} |
||||
.des { |
||||
font-size: 22px; |
||||
font-family: PingFangSC-Regular, PingFang SC; |
||||
font-weight: 400; |
||||
color: #FFFFFF; |
||||
line-height: 44px; |
||||
overflow: visible; |
||||
} |
||||
.bg { |
||||
width: 50%; |
||||
margin: -142px -50px 0 0; |
||||
border-top-left-radius: 30px; |
||||
} |
||||
} |
||||
.intro { |
||||
.inner { |
||||
display: flex; |
||||
width: 90%; |
||||
max-width: 1504px; |
||||
} |
||||
.left { |
||||
width: 30%; |
||||
} |
||||
.right { |
||||
width: 68%; |
||||
margin-left: 2%; |
||||
} |
||||
h5 { |
||||
margin-bottom: 15px; |
||||
font-size: 20px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #2A2A2A; |
||||
} |
||||
h6 { |
||||
padding-left: 15px; |
||||
margin-bottom: 15px; |
||||
font-size: 20px; |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
font-weight: 500; |
||||
color: #2A2A2A; |
||||
border-left: 4px solid #1583FF; |
||||
} |
||||
img { |
||||
width: 100%; |
||||
height: 85%; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,120 @@ |
||||
<template> |
||||
<div class="wrap"> |
||||
<div class="actions"> |
||||
<p class="page-name">页面设置/概况</p> |
||||
<div> |
||||
<el-button type="primary" @click="preview">预览</el-button> |
||||
<el-button @click="save(0)">保存为草稿</el-button> |
||||
<el-button type="primary" @click="save(1)">发布</el-button> |
||||
<el-button @click="back">放弃编辑</el-button> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="modules"> |
||||
<div class="relative"> |
||||
<div class="single-banner single-banner-overview"> |
||||
<img class="banner-img" :src="modules[0].form.pic" alt=""> |
||||
<div class="texts"> |
||||
<h6 class="banner-title">{{ modules[0].form.title }}</h6> |
||||
</div> |
||||
</div> |
||||
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> |
||||
</div> |
||||
|
||||
<ul class="tabs wow fadeInLeft"> |
||||
<template v-for="(item, i) in tabs"> |
||||
<li :class="{active: i == active}" :key="i" @click="tabChange(i)">{{ item }}</li> |
||||
</template> |
||||
</ul> |
||||
|
||||
<div class="tab-content"> |
||||
<div class="c-wrap"> |
||||
<div v-html="modules[1].form.des"></div> |
||||
<div class="cover" style="min-height: 300px;" @click="toSet(1)">点击更换描述</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import mixins from '@/mixins/page' |
||||
import Modules from '@/const/modules' |
||||
export default { |
||||
mixins: [mixins], |
||||
data() { |
||||
return { |
||||
modules: Modules.overviewLocation, |
||||
active: 2, |
||||
tabs: ['S³FEL介绍', '发展历程', 'S³FEL宣传片', '地理位置', '机构设置'] |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.$store.commit('user/setCrumbs', [ |
||||
{ |
||||
name: '站点管理', |
||||
route: '/site' |
||||
}, |
||||
{ |
||||
name: '内容管理', |
||||
route: '/column' |
||||
}, |
||||
{ |
||||
name: '栏目管理', |
||||
route: '/column' |
||||
}, |
||||
{ |
||||
name: '概况-地理位置' |
||||
} |
||||
]) |
||||
}, |
||||
methods: { |
||||
// tab回调 |
||||
tabChange(i) { |
||||
this.active = i |
||||
}, |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
@import "../../../styles/page/page.scss"; |
||||
.wrap { |
||||
background: url(../../../assets/images/survey1.png) (0 559px)/auto no-repeat, |
||||
url(../../../assets/images/survey2.png) (bottom right)/auto no-repeat; |
||||
} |
||||
.tabs { |
||||
display: flex; |
||||
justify-content: center; |
||||
box-shadow: 0px 2px 10px 0px rgba(223,223,223,0.28); |
||||
li { |
||||
padding: 25px 19px; |
||||
margin: 0 10px; |
||||
font-size: 22px; |
||||
color: #333; |
||||
border-bottom: 4px solid transparent; |
||||
text-shadow: 0px 2px 14px rgba(167,167,167,0.26); |
||||
cursor: pointer; |
||||
&.active { |
||||
color: #1583FF; |
||||
border-bottom-color: #1583FF; |
||||
} |
||||
} |
||||
} |
||||
.tab-content { |
||||
width: 1000px; |
||||
padding: 77px 0; |
||||
margin: 0 auto; |
||||
} |
||||
.video { |
||||
width: 100%; |
||||
margin-bottom: 55px; |
||||
} |
||||
.text { |
||||
font-size: 18px; |
||||
color: #020202; |
||||
line-height: 32px; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue