jialong.yu
/
FE_IASF_server
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

粒子研究院中文站点标题改成富文本

Browse Source
master
yujialong 2 years ago
parent 7f80bfc473
commit 9aa6981d56
11 changed files with 756 additions and 640 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/components/modules/module.vue
  2. 44
      src/const/modules.js
  3. 2
      src/mixins/page/index.js
  4. 43
      src/pages/column/page/devHistory.vue
  5. 2
      src/pages/column/page/governance.vue
  6. 18
      src/pages/column/page/industrial.vue
  7. 7
      src/pages/column/page/mission.vue
  8. 10
      src/pages/column/page/overview.vue
  9. 7
      src/pages/column/page/scientific.vue
  10. 299
      src/pages/column/page/sfel.vue
  11. 6
      src/pages/column/page/speech.vue

2
src/components/modules/module.vue
Unescape View File

@ -490,7 +490,7 @@ export default {
// 递归处理栏目 // 递归处理栏目
handleColumn (data) { handleColumn (data) {
data.map(e => { data.map(e => {
if (e.typeId === 2 || e.typeId === 3) e.disabled = true // if (e.typeId === 2 || e.typeId === 3) e.disabled = true
e.children.length ? this.handleColumn(e.children) : (delete e.children) e.children.length ? this.handleColumn(e.children) : (delete e.children)
}) })
}, },

44
src/const/modules.js
Unescape View File

@ -6519,7 +6519,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -6835,7 +6835,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -6936,7 +6936,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -6947,7 +6947,7 @@ export default {
label: '链接' label: '链接'
}, },
{ {
type: 'textarea', type: 'editor',
prop: 'des', prop: 'des',
label: '描述' label: '描述'
} }
@ -6979,7 +6979,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7060,7 +7060,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7077,7 +7077,7 @@ export default {
label: '链接' label: '链接'
}, },
{ {
type: 'textarea', type: 'editor',
prop: 'des', prop: 'des',
label: '描述' label: '描述'
} }
@ -7232,7 +7232,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7402,7 +7402,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7450,7 +7450,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7493,7 +7493,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7639,7 +7639,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7682,7 +7682,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7719,7 +7719,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7801,7 +7801,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7844,7 +7844,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7867,7 +7867,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7894,7 +7894,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7937,7 +7937,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -7975,7 +7975,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -8252,7 +8252,7 @@ export default {
type: 'form', type: 'form',
forms: [ forms: [
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true
@ -8376,7 +8376,7 @@ export default {
required: true required: true
}, },
{ {
type: 'input', type: 'editor',
prop: 'title', prop: 'title',
label: '标题', label: '标题',
required: true required: true

2
src/mixins/page/index.js
Unescape View File

@ -74,6 +74,8 @@ export default {
this.originModules = str // 原始json，用以页面离开的时候判断是否需要提示保存 this.originModules = str // 原始json，用以页面离开的时候判断是否需要提示保存
list.map((e, i) => { list.map((e, i) => {
console.log("🚀 ~ file: index.js:77 ~ list.map ~ e:", e, this.modules[i])
if (this.modules[i].forms) e.forms = this.modules[i].forms
if (this.withOriginForm.includes(e.type) && !e.originForm) { if (this.withOriginForm.includes(e.type) && !e.originForm) {
e.originForm = modules[i].originForm e.originForm = modules[i].originForm
} }

43
src/pages/column/page/devHistory.vue
Unescape View File

@ -3,9 +3,11 @@
<div class="actions"> <div class="actions">
<p class="page-name">页面设置/关于IASF-发展历程</p> <p class="page-name">页面设置/关于IASF-发展历程</p>
<div> <div>
<el-button type="primary" @click="preview">预览</el-button> <el-button type="primary"
@click="preview">预览</el-button>
<el-button @click="save(0)">保存为草稿</el-button> <el-button @click="save(0)">保存为草稿</el-button>
<el-button type="primary" @click="save(1)">发布</el-button> <el-button type="primary"
@click="save(1)">发布</el-button>
<el-button @click="back">放弃编辑</el-button> <el-button @click="back">放弃编辑</el-button>
</div> </div>
</div> </div>
@ -13,34 +15,45 @@
<div class="modules"> <div class="modules">
<div class="relative"> <div class="relative">
<div class="single-banner"> <div class="single-banner">
<img class="banner-img" :src="modules[0].form.pic" alt="" /> <img class="banner-img"
:src="modules[0].form.pic"
alt="" />
<div class="texts"> <div class="texts">
<h6 class="banner-title">{{ modules[0].form.title }}</h6> <h6 class="banner-title">{{ modules[0].form.title }}</h6>
</div> </div>
</div> </div>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> <div class="cover"
@click="toSet(0)">点击更换banner与链接</div>
</div> </div>
<div class="block history"> <div class="block history">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h6>{{ modules[1].form.title }}</h6> <h6 v-html="modules[1].form.title"></h6>
<p class="en">{{ modules[1].form.subTitle }}</p> <p class="en">{{ modules[1].form.subTitle }}</p>
<div class="text" v-html="modules[1].form.des"></div> <div class="text"
<div class="cover" @click="toSet(1)">点击更换标题、小标题与概述</div> v-html="modules[1].form.des"></div>
<div class="cover"
@click="toSet(1)">点击更换标题、小标题与概述</div>
</div> </div>
<div class="c-wrap"> <div class="c-wrap">
<h6 style="font-size: 1.6rem">{{ modules[2].form.title }}</h6> <h6 style="font-size: 1.6rem">{{ modules[2].form.title }}</h6>
<p class="en" style="margin-top: -15px;font-size: 1.6rem">{{ modules[2].form.subTitle }}</p> <p class="en"
<div class="text" v-html="modules[2].form.des"></div> style="margin-top: -15px;font-size: 1.6rem">{{ modules[2].form.subTitle }}</p>
<div class="cover" @click="toSet(2)">点击更换标题、小标题与概述</div> <div class="text"
v-html="modules[2].form.des"></div>
<div class="cover"
@click="toSet(2)">点击更换标题、小标题与概述</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> <Module ref="module"
:data.sync="curData"
:visible.sync="diaVisible"
@moduleSubmit="moduleSubmit" />
</div> </div>
</template> </template>
@ -49,12 +62,12 @@ import mixins from '@/mixins/page'
import Modules from '@/const/modules' import Modules from '@/const/modules'
export default { export default {
mixins: [mixins], mixins: [mixins],
data() { data () {
return { return {
modules: Modules.devHistory modules: Modules.devHistory
} }
}, },
mounted() { mounted () {
this.$store.commit('user/setCrumbs', [ this.$store.commit('user/setCrumbs', [
{ {
name: '站点管理', name: '站点管理',
@ -80,7 +93,7 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "../../../styles/page/page.scss"; @import '../../../styles/page/page.scss';
.history { .history {
h6 { h6 {
position: relative; position: relative;
@ -94,7 +107,7 @@ export default {
font-size: 2.4rem; font-size: 2.4rem;
font-family: PingFangSC-Light, PingFang SC; font-family: PingFangSC-Light, PingFang SC;
font-weight: 300; font-weight: 300;
color: #E3E3E3; color: #e3e3e3;
} }
.text { .text {
max-width: 1200px; max-width: 1200px;

2
src/pages/column/page/governance.vue
Unescape View File

@ -30,7 +30,7 @@
<div class="inner"> <div class="inner">
<div class="texts c-wrap"> <div class="texts c-wrap">
<div class="left"> <div class="left">
<h2>{{ modules[1].form.title }}</h2> <h2 v-html="modules[1].form.title"></h2>
<div class="des" <div class="des"
v-html="modules[1].form.des"></div> v-html="modules[1].form.des"></div>
</div> </div>

18
src/pages/column/page/industrial.vue
Unescape View File

@ -29,7 +29,8 @@
<div class="block history gray"> <div class="block history gray">
<div class="inner c-wrap"> <div class="inner c-wrap">
<h2 class="wow fadeInLeft" <h2 class="wow fadeInLeft"
style="margin-left: 57px">{{ modules[1].form.title }}</h2> style="margin-left: 57px"
v-html="modules[1].form.title"></h2>
<div class="texts wow fadeInDown" <div class="texts wow fadeInDown"
data-wow-delay="0.5s"> data-wow-delay="0.5s">
<div class="left"> <div class="left">
@ -54,7 +55,7 @@
:src="modules[2].form.pic" :src="modules[2].form.pic"
alt=""> alt="">
<div class="right"> <div class="right">
<h6>{{ modules[2].form.title }}</h6> <h6 v-html="modules[2].form.title"></h6>
<div class="text" <div class="text"
v-html="modules[2].form.des"></div> v-html="modules[2].form.des"></div>
</div> </div>
@ -66,7 +67,8 @@
<div class="block gray"> <div class="block gray">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[3].form.title }}</h2> <h2 class="b-title"
v-html="modules[3].form.title"></h2>
<p class="intro" <p class="intro"
v-html="modules[3].form.des"></p> v-html="modules[3].form.des"></p>
<div class="cover" <div class="cover"
@ -75,7 +77,7 @@
<ul class="plan"> <ul class="plan">
<li> <li>
<div class="left"> <div class="left">
<h6>{{ modules[4].form.title }}</h6> <h6 v-html="modules[4].form.title"></h6>
<div class="text" <div class="text"
v-html="modules[4].form.des"></div> v-html="modules[4].form.des"></div>
<img src="@/assets/images/arrow.png" <img src="@/assets/images/arrow.png"
@ -89,7 +91,7 @@
</li> </li>
<li> <li>
<div class="left"> <div class="left">
<h6>{{ modules[5].form.title }}</h6> <h6 v-html="modules[5].form.title"></h6>
<div class="text" <div class="text"
v-html="modules[5].form.des"></div> v-html="modules[5].form.des"></div>
<img src="@/assets/images/arrow.png" <img src="@/assets/images/arrow.png"
@ -108,7 +110,8 @@
<div class="block"> <div class="block">
<div class="inner app-inner"> <div class="inner app-inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title wow fadeInUp">{{ modules[6].form.title }}</h2> <h2 class="b-title wow fadeInUp"
v-html="modules[6].form.title"></h2>
<p class="intro wow fadeInUp" <p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[6].form.des }}</p> data-wow-delay="0.5s">{{ modules[6].form.des }}</p>
<div class="cover" <div class="cover"
@ -136,7 +139,8 @@
<div class="block news-block"> <div class="block news-block">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[8].form.title }}</h2> <h2 class="b-title"
v-html="modules[8].form.title"></h2>
<p class="intro">{{ modules[8].form.des }}</p> <p class="intro">{{ modules[8].form.des }}</p>
<div class="cover" <div class="cover"
@click="toSet(8)">点击更换标题与描述</div> @click="toSet(8)">点击更换标题与描述</div>

7
src/pages/column/page/mission.vue
Unescape View File

@ -32,7 +32,7 @@
<img :src="modules[1].form.pic" <img :src="modules[1].form.pic"
alt="" /> alt="" />
<div class="texts"> <div class="texts">
<h6>{{ modules[1].form.title }}</h6> <h6 v-html="modules[1].form.title"></h6>
<div class="text" <div class="text"
v-html="modules[1].form.des"></div> v-html="modules[1].form.des"></div>
</div> </div>
@ -44,7 +44,7 @@
<img :src="modules[2].form.pic" <img :src="modules[2].form.pic"
alt="" /> alt="" />
<div class="texts rightText"> <div class="texts rightText">
<h6>{{ modules[2].form.title }}</h6> <h6 v-html="modules[2].form.title"></h6>
<div class="text" <div class="text"
v-html="modules[2].form.des"></div> v-html="modules[2].form.des"></div>
</div> </div>
@ -58,7 +58,8 @@
<div class="block mind gray"> <div class="block mind gray">
<div class="inner"> <div class="inner">
<div class="c-wrap"> <div class="c-wrap">
<h6 class="m-title">{{ modules[3].form.title }}</h6> <h6 class="m-title"
v-html="modules[3].form.title"></h6>
<div class="cover" <div class="cover"
@click="toSet(3)">点击更换标题</div> @click="toSet(3)">点击更换标题</div>
</div> </div>

10
src/pages/column/page/overview.vue
Unescape View File

@ -31,9 +31,10 @@
<div class="texts wow fadeInDown" <div class="texts wow fadeInDown"
data-wow-delay="0.5s"> data-wow-delay="0.5s">
<div class="left"> <div class="left">
<h2>{{ modules[1].form.title }}</h2> <h2 v-html="modules[1].form.title"></h2>
<div class="line"></div> <div class="line"></div>
<div class="des">{{ modules[1].form.des }}</div> <div class="des"
v-html="modules[1].form.des"></div>
</div> </div>
<img class="bg" <img class="bg"
width="562" width="562"
@ -80,7 +81,7 @@
<div class="block fac"> <div class="block fac">
<div class="inner"> <div class="inner">
<div class="event"> <div class="event">
<h6>{{ modules[4].form.title }}</h6> <h6 v-html="modules[4].form.title"></h6>
<p class="en">{{ modules[4].form.subTitle }}</p> <p class="en">{{ modules[4].form.subTitle }}</p>
<div class="text" <div class="text"
v-html="modules[4].form.des"></div> v-html="modules[4].form.des"></div>
@ -132,7 +133,8 @@
<div class="block scan gray"> <div class="block scan gray">
<div class="c-wrap"> <div class="c-wrap">
<h2 class="b-title">{{ modules[8].form.title }}</h2> <h2 class="b-title"
v-html="modules[8].form.title"></h2>
<p class="intro">{{ modules[8].form.des }}</p> <p class="intro">{{ modules[8].form.des }}</p>
<div class="cover" <div class="cover"
@click="toSet(8)">点击更换标题与描述</div> @click="toSet(8)">点击更换标题与描述</div>

7
src/pages/column/page/scientific.vue
Unescape View File

@ -35,7 +35,7 @@
:src="modules[1].form.pic" :src="modules[1].form.pic"
alt=""> alt="">
<div class="texts"> <div class="texts">
<h6>{{ modules[1].form.title }}</h6> <h6 v-html="modules[1].form.title"></h6>
<div class="text" <div class="text"
v-html="modules[1].form.des"></div> v-html="modules[1].form.des"></div>
<img class="icon" <img class="icon"
@ -50,7 +50,7 @@
:src="modules[2].form.pic" :src="modules[2].form.pic"
alt=""> alt="">
<div class="texts"> <div class="texts">
<h6>{{ modules[2].form.title }}</h6> <h6 v-html="modules[2].form.title"></h6>
<div class="text" <div class="text"
v-html="modules[2].form.des"></div> v-html="modules[2].form.des"></div>
<img class="icon" <img class="icon"
@ -68,7 +68,8 @@
<div class="inner"> <div class="inner">
<div class="texts"> <div class="texts">
<div class="title wow fadeInUp" <div class="title wow fadeInUp"
data-wow-delay="0.7s">{{ modules[3].form.title }}</div> data-wow-delay="0.7s"
v-html="modules[3].form.title"></div>
<div class="des wow fadeInDown" <div class="des wow fadeInDown"
data-wow-delay="1s" data-wow-delay="1s"
v-html="modules[3].form.des"></div> v-html="modules[3].form.des"></div>

299
src/pages/column/page/sfel.vue
Unescape View File

@ -3,23 +3,31 @@
<div class="actions"> <div class="actions">
<p class="page-name">页面设置/SFEL</p> <p class="page-name">页面设置/SFEL</p>
<div> <div>
<el-button type="primary" @click="preview">预览</el-button> <el-button type="primary"
@click="preview">预览</el-button>
<el-button @click="save(0)">保存为草稿</el-button> <el-button @click="save(0)">保存为草稿</el-button>
<el-button type="primary" @click="save(1)">发布</el-button> <el-button type="primary"
@click="save(1)">发布</el-button>
<el-button @click="back">放弃编辑</el-button> <el-button @click="back">放弃编辑</el-button>
</div> </div>
</div> </div>
<div class="modules"> <div class="modules">
<div class="relative"> <div class="relative">
<el-carousel height="480px" :indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'"> <el-carousel height="480px"
:indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
<template v-for="(item, i) in modules[0].list"> <template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i"> <el-carousel-item v-if="item.pic && item.isEnable"
<img width="100%" height="100%" :src="item.pic" alt=""> :key="i">
<img width="100%"
height="100%"
:src="item.pic"
alt="">
</el-carousel-item> </el-carousel-item>
</template> </template>
</el-carousel> </el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> <div class="cover"
@click="toSet(0)">点击更换banner与链接</div>
</div> </div>
<div class="block banner-block"> <div class="block banner-block">
@ -30,11 +38,15 @@
<span class="sub">{{ modules[1].form.subTitle }}</span> <span class="sub">{{ modules[1].form.subTitle }}</span>
</h5> </h5>
<span class="more">MORE</span> <span class="more">MORE</span>
<div class="cover" @click="toSet(1)">点击更换标题与小标题</div> <div class="cover"
@click="toSet(1)">点击更换标题与小标题</div>
</div> </div>
<div class="c-wrap"> <div class="c-wrap">
<div class="sfel-banner"> <div class="sfel-banner">
<img width="100%" height="480" src="http://10.10.11.7/images/about/5.png" alt=""> <img width="100%"
height="480"
src="http://10.10.11.7/images/about/5.png"
alt="">
<div class="right"> <div class="right">
<h6>IASF is driven to serve the Science and industry, and solve grand challenges through research and innovation. We are open and creative</h6> <h6>IASF is driven to serve the Science and industry, and solve grand challenges through research and innovation. We are open and creative</h6>
<div class="des">Innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan. And the Guangdong-Hong Kong-Macao Greater Bay </div> <div class="des">Innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan. And the Guangdong-Hong Kong-Macao Greater Bay </div>
@ -43,31 +55,44 @@
</div> </div>
<ul class="card"> <ul class="card">
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/9.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/9.png"
alt="">
<div class="texts"> <div class="texts">
<p class="meta">2022-09-09 | Research</p> <p class="meta">2022-09-09 | Research</p>
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div> <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
<img class="arrow" src="@/assets/images/arrow.png" alt=""> <img class="arrow"
src="@/assets/images/arrow.png"
alt="">
</div> </div>
</li> </li>
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/10.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/10.png"
alt="">
<div class="texts"> <div class="texts">
<p class="meta">2022-09-09 | Research</p> <p class="meta">2022-09-09 | Research</p>
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div> <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
<img class="arrow" src="@/assets/images/arrow.png" alt=""> <img class="arrow"
src="@/assets/images/arrow.png"
alt="">
</div> </div>
</li> </li>
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/11.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/11.png"
alt="">
<div class="texts"> <div class="texts">
<p class="meta">2022-09-09 | Research</p> <p class="meta">2022-09-09 | Research</p>
<div class="des">IASF is driven to serve the Science and industry, and solve grand </div> <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
<img class="arrow" src="@/assets/images/arrow.png" alt=""> <img class="arrow"
src="@/assets/images/arrow.png"
alt="">
</div> </div>
</li> </li>
</ul> </ul>
<div class="cover" @click="toSet(2)">关联栏目</div> <div class="cover"
@click="toSet(2)">关联栏目</div>
</div> </div>
</div> </div>
</div> </div>
@ -80,37 +105,44 @@
<span class="sub">{{ modules[3].form.subTitle }}</span> <span class="sub">{{ modules[3].form.subTitle }}</span>
</h5> </h5>
<span class="more">MORE</span> <span class="more">MORE</span>
<div class="cover" @click="toSet(3)">点击更换标题与小标题</div> <div class="cover"
@click="toSet(3)">点击更换标题与小标题</div>
</div> </div>
<div class="shop-shows c-wrap"> <div class="shop-shows c-wrap">
<div class="left wow fadeInLeft" data-wow-delay="0.5s"> <div class="left wow fadeInLeft"
data-wow-delay="0.5s">
<el-carousel height="432px"> <el-carousel height="432px">
<el-carousel-item> <el-carousel-item>
<div class="item"> <div class="item">
<img src="@/assets/images/survey3.png" alt=""> <img src="@/assets/images/survey3.png"
alt="">
<p class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</p> <p class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</p>
</div> </div>
</el-carousel-item> </el-carousel-item>
<el-carousel-item> <el-carousel-item>
<div class="item"> <div class="item">
<img src="@/assets/images/survey3.png" alt=""> <img src="@/assets/images/survey3.png"
alt="">
<p class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</p> <p class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</p>
</div> </div>
</el-carousel-item> </el-carousel-item>
<el-carousel-item> <el-carousel-item>
<div class="item"> <div class="item">
<img src="@/assets/images/survey3.png" alt=""> <img src="@/assets/images/survey3.png"
alt="">
<p class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</p> <p class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</p>
</div> </div>
</el-carousel-item> </el-carousel-item>
</el-carousel> </el-carousel>
<div class="cards" style="margin-top: 18px;"> <div class="cards"
style="margin-top: 18px;">
<h6>关于2021年度深圳综合粒子设施研究院采购意向公开表</h6> <h6>关于2021年度深圳综合粒子设施研究院采购意向公开表</h6>
<div class="sum">把一个基因切成两段，分别翻译成两段蛋白片段，还会有原来的功能吗？实多数蛋白片段会…</div> <div class="sum">把一个基因切成两段，分别翻译成两段蛋白片段，还会有原来的功能吗？实多数蛋白片段会…</div>
<p class="date">2022/02/26</p> <p class="date">2022/02/26</p>
</div> </div>
<div class="card-wrap"> <div class="card-wrap">
<div class="cards" style="margin-right: 18px"> <div class="cards"
style="margin-right: 18px">
<h6>关于2021年度深圳综合粒子设施研究院采购意向公开表</h6> <h6>关于2021年度深圳综合粒子设施研究院采购意向公开表</h6>
<p class="date">2022/02/26</p> <p class="date">2022/02/26</p>
</div> </div>
@ -120,24 +152,31 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right wow fadeInRight" data-wow-delay="0.5s"> <div class="right wow fadeInRight"
data-wow-delay="0.5s">
<ul class="card-list"> <ul class="card-list">
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/9.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/9.png"
alt="">
<div class="texts"> <div class="texts">
<h6>喜讯！储存环三次谐波腔的带束实验验证及超导高频频腔</h6> <h6>喜讯！储存环三次谐波腔的带束实验验证及超导高频频腔</h6>
<div class="des">1月20日上午，光明区总工会组织的“关爱职工·情暖光明”春节工会关爱活动走进深圳综合粒子设施研究院，为奋战在综合性…</div> <div class="des">1月20日上午，光明区总工会组织的“关爱职工·情暖光明”春节工会关爱活动走进深圳综合粒子设施研究院，为奋战在综合性…</div>
</div> </div>
</li> </li>
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/9.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/9.png"
alt="">
<div class="texts"> <div class="texts">
<h6>光明区总工会为一线科研人员送上新春祝福</h6> <h6>光明区总工会为一线科研人员送上新春祝福</h6>
<div class="des">1月11日上午，深圳综合粒子设施研究院与深圳大学签署战略合作框架协议。深圳大学党委书记、校长李清泉深圳综合粒子设施研究院与深圳大学党委…</div> <div class="des">1月11日上午，深圳综合粒子设施研究院与深圳大学签署战略合作框架协议。深圳大学党委书记、校长李清泉深圳综合粒子设施研究院与深圳大学党委…</div>
</div> </div>
</li> </li>
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/9.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/9.png"
alt="">
<div class="texts"> <div class="texts">
<h6>深圳综合粒子设施研究院与中国科学院</h6> <h6>深圳综合粒子设施研究院与中国科学院</h6>
<div class="des">1月20日上午，光明区总工会组织的“关爱职工·情暖光明”春节工会关爱活动走进深圳综合粒子设施研究院，为奋战在综合性…</div> <div class="des">1月20日上午，光明区总工会组织的“关爱职工·情暖光明”春节工会关爱活动走进深圳综合粒子设施研究院，为奋战在综合性…</div>
@ -145,11 +184,13 @@
</li> </li>
</ul> </ul>
<div class="slide"> <div class="slide">
<img src="@/assets/images/survey3.png" alt=""> <img src="@/assets/images/survey3.png"
alt="">
<p class="text">深圳综合粒子设施研究院与中国科学院</p> <p class="text">深圳综合粒子设施研究院与中国科学院</p>
</div> </div>
</div> </div>
<div class="cover" @click="toSet(4)">关联栏目</div> <div class="cover"
@click="toSet(4)">关联栏目</div>
</div> </div>
</div> </div>
</div> </div>
@ -162,73 +203,102 @@
<span class="sub">{{ modules[5].form.subTitle }}</span> <span class="sub">{{ modules[5].form.subTitle }}</span>
</h5> </h5>
<span class="more">MORE</span> <span class="more">MORE</span>
<div class="cover" @click="toSet(5)">点击更换标题与小标题</div> <div class="cover"
@click="toSet(5)">点击更换标题与小标题</div>
</div> </div>
<div class="shows c-wrap"> <div class="shows c-wrap">
<div class="left"> <div class="left">
<img width="100%" height="100%" src="http://10.10.11.7/images/about/9.png" alt=""> <img width="100%"
height="100%"
src="http://10.10.11.7/images/about/9.png"
alt="">
<div class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</div> <div class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</div>
</div> </div>
<ul class="card-list"> <ul class="card-list">
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/10.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/10.png"
alt="">
<div class="texts"> <div class="texts">
<h6>专业技术培训 | 自由电子激光装置中的结构</h6> <h6>专业技术培训 | 自由电子激光装置中的结构</h6>
<p class="sum">加速器总体-直线加速器总体-高重频电子枪组…</p> <p class="sum">加速器总体-直线加速器总体-高重频电子枪组…</p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/mine.png" alt=""> <img class="icon"
src="@/assets/images/mine.png"
alt="">
邵佳航 邵佳航
</p> </p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/time.png" alt=""> <img class="icon"
src="@/assets/images/time.png"
alt="">
会议时间: 2022年8月13日 14:30 会议时间: 2022年8月13日 14:30
</p> </p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/online.png" alt=""> <img class="icon"
src="@/assets/images/online.png"
alt="">
总部四楼大会议室 总部四楼大会议室
</p> </p>
</div> </div>
</li> </li>
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/10.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/10.png"
alt="">
<div class="texts"> <div class="texts">
<h6>专业技术培训 | 自由电子激光装置中的结构</h6> <h6>专业技术培训 | 自由电子激光装置中的结构</h6>
<p class="sum">加速器总体-直线加速器总体-高重频电子枪组…</p> <p class="sum">加速器总体-直线加速器总体-高重频电子枪组…</p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/mine.png" alt=""> <img class="icon"
src="@/assets/images/mine.png"
alt="">
邵佳航 邵佳航
</p> </p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/time.png" alt=""> <img class="icon"
src="@/assets/images/time.png"
alt="">
会议时间: 2022年8月13日 14:30 会议时间: 2022年8月13日 14:30
</p> </p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/online.png" alt=""> <img class="icon"
src="@/assets/images/online.png"
alt="">
总部四楼大会议室 总部四楼大会议室
</p> </p>
</div> </div>
</li> </li>
<li> <li>
<img class="pic" src="http://10.10.11.7/images/about/10.png" alt=""> <img class="pic"
src="http://10.10.11.7/images/about/10.png"
alt="">
<div class="texts"> <div class="texts">
<h6>专业技术培训 | 自由电子激光装置中的结构</h6> <h6>专业技术培训 | 自由电子激光装置中的结构</h6>
<p class="sum">加速器总体-直线加速器总体-高重频电子枪组…</p> <p class="sum">加速器总体-直线加速器总体-高重频电子枪组…</p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/mine.png" alt=""> <img class="icon"
src="@/assets/images/mine.png"
alt="">
邵佳航 邵佳航
</p> </p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/time.png" alt=""> <img class="icon"
src="@/assets/images/time.png"
alt="">
会议时间: 2022年8月13日 14:30 会议时间: 2022年8月13日 14:30
</p> </p>
<p class="text"> <p class="text">
<img class="icon" src="@/assets/images/online.png" alt=""> <img class="icon"
src="@/assets/images/online.png"
alt="">
总部四楼大会议室 总部四楼大会议室
</p> </p>
</div> </div>
</li> </li>
</ul> </ul>
<div class="cover" @click="toSet(6)">关联栏目</div> <div class="cover"
@click="toSet(6)">关联栏目</div>
</div> </div>
</div> </div>
</div> </div>
@ -241,17 +311,27 @@
<span class="sub">{{ modules[7].form.subTitle }}</span> <span class="sub">{{ modules[7].form.subTitle }}</span>
</h5> </h5>
<span class="more">MORE</span> <span class="more">MORE</span>
<div class="cover" @click="toSet(7)">点击更换标题与小标题</div> <div class="cover"
@click="toSet(7)">点击更换标题与小标题</div>
</div> </div>
<div class="media-wrap c-wrap"> <div class="media-wrap c-wrap">
<div class="left"> <div class="left">
<div class="slides"> <div class="slides">
<div class="item wow fadeInLeft" data-wow-delay="0.5s" style="margin-right: 20px"> <div class="item wow fadeInLeft"
<img width="100%" height="100%" src="http://10.10.11.7/images/about/9.png" alt=""> data-wow-delay="0.5s"
style="margin-right: 20px">
<img width="100%"
height="100%"
src="http://10.10.11.7/images/about/9.png"
alt="">
<div class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</div> <div class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</div>
</div> </div>
<div class="item wow fadeInLeft" data-wow-delay="0.5s"> <div class="item wow fadeInLeft"
<img width="100%" height="100%" src="http://10.10.11.7/images/about/9.png" alt=""> data-wow-delay="0.5s">
<img width="100%"
height="100%"
src="http://10.10.11.7/images/about/9.png"
alt="">
<div class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</div> <div class="text">关于2021年度深圳综合粒子设施研究院采购意向公开表</div>
</div> </div>
</div> </div>
@ -271,13 +351,15 @@
</ul> </ul>
</div> </div>
<div class="right"> <div class="right">
<img src="@/assets/images/survey3.png" alt=""> <img src="@/assets/images/survey3.png"
alt="">
<div class="texts"> <div class="texts">
<h6>关于2021年度深圳综合粒子设施研究院采购公开表</h6> <h6>关于2021年度深圳综合粒子设施研究院采购公开表</h6>
<div class="des">把一个基因切成两段，分别翻译成两段蛋白片段，还会有原来的功能吗？实多数蛋白片段会…</div> <div class="des">把一个基因切成两段，分别翻译成两段蛋白片段，还会有原来的功能吗？实多数蛋白片段会…</div>
</div> </div>
</div> </div>
<div class="cover" @click="toSet(8)">关联栏目</div> <div class="cover"
@click="toSet(8)">关联栏目</div>
</div> </div>
</div> </div>
</div> </div>
@ -290,16 +372,20 @@
<span class="sub">{{ modules[9].form.subTitle }}</span> <span class="sub">{{ modules[9].form.subTitle }}</span>
</h5> </h5>
<span class="more">MORE</span> <span class="more">MORE</span>
<div class="cover" @click="toSet(9)">点击更换标题与小标题</div> <div class="cover"
@click="toSet(9)">点击更换标题与小标题</div>
</div> </div>
<ul class="news"> <ul class="news">
<li v-for="(item, i) in modules[10].list" :key="i"> <li v-for="(item, i) in modules[10].list"
<img :src="item.pic" alt=""> :key="i">
<img :src="item.pic"
alt="">
<div class="texts"> <div class="texts">
<h6>{{ item.title }}</h6> <h6>{{ item.title }}</h6>
<div class="des">{{ item.des }}</div> <div class="des">{{ item.des }}</div>
</div> </div>
<div class="cover" @click="toSet(10, i)">点击更改图片、标题概述与链接</div> <div class="cover"
@click="toSet(10, i)">点击更改图片、标题概述与链接</div>
</li> </li>
</ul> </ul>
</div> </div>
@ -313,7 +399,8 @@
<span class="sub">{{ modules[11].form.subTitle }}</span> <span class="sub">{{ modules[11].form.subTitle }}</span>
</h5> </h5>
<span class="more">MORE</span> <span class="more">MORE</span>
<div class="cover" @click="toSet(11)">点击更换标题与小标题</div> <div class="cover"
@click="toSet(11)">点击更换标题与小标题</div>
</div> </div>
<div class="c-wrap"> <div class="c-wrap">
<div class="slide"> <div class="slide">
@ -322,7 +409,9 @@
<div class="des">X射线自由电子激光已经成为了化学、生物、物理等领域不可或缺的研究手段。对于绝大多数自由电子激研究院紧密围绕高水平建设综合性国家科学中心战略目标，面向国民经济主战场和世界科技前沿…</div> <div class="des">X射线自由电子激光已经成为了化学、生物、物理等领域不可或缺的研究手段。对于绝大多数自由电子激研究院紧密围绕高水平建设综合性国家科学中心战略目标，面向国民经济主战场和世界科技前沿…</div>
<div class="meta">发表日期：2022.01.10 &emsp;浏览量：备份</div> <div class="meta">发表日期：2022.01.10 &emsp;浏览量：备份</div>
</div> </div>
<img class="pic" src="@/assets/images/survey3.png" alt=""> <img class="pic"
src="@/assets/images/survey3.png"
alt="">
</div> </div>
<ul class="list"> <ul class="list">
<li> <li>
@ -338,13 +427,17 @@
<p class="date">2022.10.10</p> <p class="date">2022.10.10</p>
</li> </li>
</ul> </ul>
<div class="cover" @click="toSet(12)">关联栏目</div> <div class="cover"
@click="toSet(12)">关联栏目</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" /> <Module ref="module"
:data.sync="curData"
:visible.sync="diaVisible"
@moduleSubmit="moduleSubmit" />
</div> </div>
</template> </template>
@ -353,12 +446,12 @@ import mixins from '@/mixins/page'
import Modules from '@/const/modules' import Modules from '@/const/modules'
export default { export default {
mixins: [mixins], mixins: [mixins],
data() { data () {
return { return {
modules: Modules.sfel modules: Modules.sfel
} }
}, },
mounted() { mounted () {
this.$store.commit('user/setCrumbs', [ this.$store.commit('user/setCrumbs', [
{ {
name: '站点管理', name: '站点管理',
@ -384,7 +477,7 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "../../../styles/page/page.scss"; @import '../../../styles/page/page.scss';
.title { .title {
position: relative; position: relative;
display: flex; display: flex;
@ -400,13 +493,13 @@ export default {
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
line-height: 1; line-height: 1;
border-left: 6px solid #2B96EF; border-left: 6px solid #2b96ef;
} }
.sub { .sub {
font-size: 22px; font-size: 22px;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #AFB7BF; color: #afb7bf;
} }
.more { .more {
font-size: 14px; font-size: 14px;
@ -425,7 +518,7 @@ export default {
} }
} }
.banner-block { .banner-block {
background: url(../../../assets/images/sfel/2.png) 0 0/cover no-repeat; background: url(../../../assets/images/sfel/2.png) 0 0 / cover no-repeat;
} }
.sfel-banner { .sfel-banner {
display: flex; display: flex;
@ -438,11 +531,13 @@ export default {
position: relative; position: relative;
width: 50%; width: 50%;
padding: 50px 50px 30px; padding: 50px 50px 30px;
background: #1583FF; background: #1583ff;
color: #fff; color: #fff;
&:hover { &:hover {
background: #465f85; background: #465f85;
h6, .des, .meta { h6,
.des,
.meta {
color: #fff; color: #fff;
transform: translateY(15px); transform: translateY(15px);
} }
@ -457,29 +552,29 @@ export default {
width: 10px; width: 10px;
height: 10px; height: 10px;
margin-right: 12px; margin-right: 12px;
background: #FFFFFF; background: #ffffff;
border-radius: 50%; border-radius: 50%;
transition: .2s; transition: 0.2s;
&.active { &.active {
width: 30px; width: 30px;
background: rgba(255,255,255,0.3); background: rgba(255, 255, 255, 0.3);
border-radius: 5px; border-radius: 5px;
} }
} }
} }
h6 { h6 {
font-size: 24px; font-size: 24px;
transition: .3s; transition: 0.3s;
} }
.des { .des {
margin: 30px 0; margin: 30px 0;
font-size: 16px; font-size: 16px;
line-height: 24px; line-height: 24px;
transition: .3s; transition: 0.3s;
} }
.meta { .meta {
font-size: 16px; font-size: 16px;
transition: .3s; transition: 0.3s;
} }
} }
.card { .card {
@ -489,9 +584,9 @@ export default {
li { li {
width: calc((100% - 56px) / 3); width: calc((100% - 56px) / 3);
margin-right: 28px; margin-right: 28px;
box-shadow: 0px 0px 20px 0px rgba(176,176,176,0.21); box-shadow: 0px 0px 20px 0px rgba(176, 176, 176, 0.21);
border-radius: 6px; border-radius: 6px;
transition: .3s; transition: 0.3s;
&:hover { &:hover {
transform: scale(1.05); transform: scale(1.05);
} }
@ -524,7 +619,7 @@ export default {
} }
.notice { .notice {
background: url(../../../assets/images/sfel/3.png) 0 0/cover no-repeat; background: url(../../../assets/images/sfel/3.png) 0 0 / cover no-repeat;
} }
.shop-shows { .shop-shows {
display: flex; display: flex;
@ -560,16 +655,16 @@ export default {
h6 { h6 {
margin-bottom: 10px; margin-bottom: 10px;
font-size: 18px; font-size: 18px;
color: #48525E; color: #48525e;
} }
.sum { .sum {
font-size: 14px; font-size: 14px;
color: #6D7C8E; color: #6d7c8e;
} }
.date { .date {
margin-top: 24px; margin-top: 24px;
font-size: 14px; font-size: 14px;
color: #C4CCD7; color: #c4ccd7;
} }
} }
h6 { h6 {
@ -593,7 +688,7 @@ export default {
padding: 24px; padding: 24px;
margin-bottom: 18px; margin-bottom: 18px;
background-color: #fff; background-color: #fff;
transition: .3s; transition: 0.3s;
&:hover { &:hover {
transform: scale(1.05); transform: scale(1.05);
} }
@ -612,7 +707,7 @@ export default {
font-size: 18px; font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #1583FF; color: #1583ff;
} }
.des { .des {
font-size: 16px; font-size: 16px;
@ -638,13 +733,13 @@ export default {
font-size: 18px; font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #FFFFFF; color: #ffffff;
background-color: rgba(0, 0, 0, 0.57); background-color: rgba(0, 0, 0, 0.57);
} }
} }
} }
.conference { .conference {
background: url(../../../assets/images/sfel/4.png) 0 0/cover no-repeat; background: url(../../../assets/images/sfel/4.png) 0 0 / cover no-repeat;
.shows { .shows {
display: flex; display: flex;
} }
@ -664,7 +759,7 @@ export default {
font-size: 18px; font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #FFFFFF; color: #ffffff;
background-color: rgba(0, 0, 0, 0.57); background-color: rgba(0, 0, 0, 0.57);
} }
} }
@ -677,7 +772,7 @@ export default {
margin-bottom: 21px; margin-bottom: 21px;
background-color: #fff; background-color: #fff;
cursor: pointer; cursor: pointer;
transition: .3s; transition: 0.3s;
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
@ -738,7 +833,7 @@ export default {
padding: 0 27px; padding: 0 27px;
line-height: 48px; line-height: 48px;
font-size: 16px; font-size: 16px;
color: #FFFFFF; color: #ffffff;
@include ellipsis; @include ellipsis;
background-color: rgba(0, 0, 0, 0.49); background-color: rgba(0, 0, 0, 0.49);
} }
@ -746,7 +841,7 @@ export default {
.list { .list {
padding: 34px 36px; padding: 34px 36px;
background: #fff; background: #fff;
box-shadow: 0px 0px 30px 0px rgba(48,48,48,0.08); box-shadow: 0px 0px 30px 0px rgba(48, 48, 48, 0.08);
li { li {
margin-bottom: 41px; margin-bottom: 41px;
&:last-child { &:last-child {
@ -760,7 +855,7 @@ export default {
font-weight: 500; font-weight: 500;
color: #272727; color: #272727;
line-height: 20px; line-height: 20px;
text-shadow: 0px 0px 30px rgba(48,48,48,0.08); text-shadow: 0px 0px 30px rgba(48, 48, 48, 0.08);
} }
.des { .des {
font-size: 14px; font-size: 14px;
@ -770,7 +865,7 @@ export default {
} }
.right { .right {
width: 44%; width: 44%;
box-shadow: 0px 0px 30px 0px rgba(48,48,48,0.08); box-shadow: 0px 0px 30px 0px rgba(48, 48, 48, 0.08);
img { img {
width: 100%; width: 100%;
height: 422px; height: 422px;
@ -785,7 +880,7 @@ export default {
font-weight: 500; font-weight: 500;
color: #272727; color: #272727;
line-height: 39px; line-height: 39px;
text-shadow: 0px 0px 30px rgba(48,48,48,0.08); text-shadow: 0px 0px 30px rgba(48, 48, 48, 0.08);
} }
.des { .des {
margin-top: 16px; margin-top: 16px;
@ -795,8 +890,8 @@ export default {
} }
} }
.news { .news {
background: url(../../../assets/images/sfel/5.png) (0 504px)/auto no-repeat, background: url(../../../assets/images/sfel/5.png) (0 504px) / auto no-repeat,
url(../../../assets/images/sfel/6.png) (bottom right)/auto no-repeat; url(../../../assets/images/sfel/6.png) (bottom right) / auto no-repeat;
.inner { .inner {
width: 1400px; width: 1400px;
} }
@ -812,9 +907,9 @@ export default {
margin-right: 28px; margin-right: 28px;
color: #333; color: #333;
background-color: #fff; background-color: #fff;
box-shadow: 0px 5px 20px 0px rgba(98,117,163,0.08); box-shadow: 0px 5px 20px 0px rgba(98, 117, 163, 0.08);
border-radius: 10px; border-radius: 10px;
transition: .3s; transition: 0.3s;
&:hover { &:hover {
transform: translateY(20px); transform: translateY(20px);
} }
@ -823,7 +918,7 @@ export default {
} }
&:hover { &:hover {
color: #fff; color: #fff;
background-color: #0252D9; background-color: #0252d9;
} }
} }
img { img {
@ -852,7 +947,7 @@ export default {
.texts { .texts {
width: 51%; width: 51%;
padding: 56px; padding: 56px;
background: #FBFBFB; background: #fbfbfb;
h6 { h6 {
font-size: 24px; font-size: 24px;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
@ -880,7 +975,7 @@ export default {
width: calc((100% - 44px) / 3); width: calc((100% - 44px) / 3);
padding: 36px 22px; padding: 36px 22px;
margin-right: 14px; margin-right: 14px;
background: url(../../../assets/images/sfel/7.png) 0 0/cover no-repeat; background: url(../../../assets/images/sfel/7.png) 0 0 / cover no-repeat;
&:nth-child(2) { &:nth-child(2) {
background-image: url(../../../assets/images/sfel/8.png); background-image: url(../../../assets/images/sfel/8.png);
} }
@ -894,13 +989,13 @@ export default {
font-size: 18px; font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #FFFFFF; color: #ffffff;
line-height: 30px; line-height: 30px;
} }
.date { .date {
font-size: 16px; font-size: 16px;
font-family: LaoSangamMN; font-family: LaoSangamMN;
color: #FFFFFF; color: #ffffff;
} }
} }
} }
@ -912,8 +1007,8 @@ export default {
text-align: center; text-align: center;
.logo { .logo {
padding: 44px 0; padding: 44px 0;
background: #0C60BE; background: #0c60be;
box-shadow: 0px 0px 20px 0px rgba(184,191,200,0.3); box-shadow: 0px 0px 20px 0px rgba(184, 191, 200, 0.3);
} }
.nav { .nav {
li { li {
@ -921,11 +1016,11 @@ export default {
font-size: 24px; font-size: 24px;
line-height: 83px; line-height: 83px;
color: #fff; color: #fff;
background-color: #1D1D1D; background-color: #1d1d1d;
cursor: pointer; cursor: pointer;
@include ellipsis; @include ellipsis;
&.active { &.active {
background-color: #1583FF; background-color: #1583ff;
} }
} }
} }

6
src/pages/column/page/speech.vue
Unescape View File

@ -28,13 +28,12 @@
</div> </div>
<div class="block"> <div class="block">
<div class="inner"> <div class="inner c-wrap">
<div class="c-wrap">
<img :src="modules[1].form.pic" <img :src="modules[1].form.pic"
alt="" alt=""
class="pic"> class="pic">
<div class="texts"> <div class="texts">
<h6>{{ modules[1].form.title }}</h6> <h6 v-html="modules[1].form.title"></h6>
<p class="en">{{ modules[1].form.subTitle }}</p> <p class="en">{{ modules[1].form.subTitle }}</p>
<div class="text" <div class="text"
v-html="modules[1].form.des"></div> v-html="modules[1].form.des"></div>
@ -42,7 +41,6 @@
<div class="cover" <div class="cover"
@click="toSet(1)">点击更换图片、标题、小标题与概述</div> @click="toSet(1)">点击更换图片、标题、小标题与概述</div>
</div> </div>
</div>
<div class="sign c-wrap"> <div class="sign c-wrap">
签名： 签名：
<img :src="modules[2].form.pic" <img :src="modules[2].form.pic"

Write Preview
Loading…
Cancel
Save