yujialong 9 months ago
parent 780d32f779
commit 8ba50079cc
  1. 6
      src/const/modules.js
  2. 136
      src/pages/column/page/home.vue

@ -2698,15 +2698,9 @@ export default {
label: '标题',
required: true
},
{
type: 'textarea',
prop: 'des',
label: '概述'
}
],
form: {
title: 'IASF at a glance',
des: ''
}
},
{

@ -3,23 +3,31 @@
<div class="actions">
<p class="page-name">页面设置/HOME</p>
<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 type="primary" @click="save(1)">发布</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">
<el-carousel height="500px" :indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
<el-carousel height="500px"
:indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
<template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i">
<img width="100%" height="100%" :src="item.pic" alt="">
<el-carousel-item v-if="item.pic && item.isEnable"
:key="i">
<img width="100%"
height="100%"
:src="item.pic"
alt="">
</el-carousel-item>
</template>
</el-carousel>
<div class="cover" @click="toSet(0)">点击更换banner与链接</div>
<div class="cover"
@click="toSet(0)">点击更换banner与链接</div>
</div>
<div class="block">
@ -27,26 +35,37 @@
<div class="c-wrap">
<h2 class="b-title">{{ modules[1].form.title }}</h2>
<p class="intro">{{ modules[1].form.des }}</p>
<div class="cover" @click="toSet(1)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(1)">点击更换标题与描述</div>
</div>
<ul class="card">
<li>
<img width="100%" :src="modules[2].form.pic" alt="">
<img width="100%"
:src="modules[2].form.pic"
alt="">
<div class="texts">
<h6>{{ modules[2].form.title }}</h6>
<p class="des">{{ modules[2].form.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
<img class="arrow"
src="@/assets/images/arrow.png"
alt="">
</div>
<div class="cover" @click="toSet(2)">点击更改图片标题概述与链接</div>
<div class="cover"
@click="toSet(2)">点击更改图片标题概述与链接</div>
</li>
<li>
<img width="100%" :src="modules[3].form.pic" alt="">
<img width="100%"
:src="modules[3].form.pic"
alt="">
<div class="texts">
<h6>{{ modules[3].form.title }}</h6>
<p class="des">{{ modules[3].form.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
<img class="arrow"
src="@/assets/images/arrow.png"
alt="">
</div>
<div class="cover" @click="toSet(3)">点击更改图片标题概述与链接</div>
<div class="cover"
@click="toSet(3)">点击更改图片标题概述与链接</div>
</li>
</ul>
</div>
@ -57,11 +76,13 @@
<div class="c-wrap">
<h2 class="b-title">{{ modules[4].form.title }}</h2>
<p class="intro">{{ modules[4].form.des }}</p>
<div class="cover" @click="toSet(4)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(4)">点击更换标题与描述</div>
</div>
<ul class="news">
<li>
<img src="http://10.10.11.7/images/home/3.png" alt="">
<img src="http://10.10.11.7/images/home/3.png"
alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
@ -69,7 +90,8 @@
</div>
</li>
<li>
<img src="http://10.10.11.7/images/home/3.png" alt="">
<img src="http://10.10.11.7/images/home/3.png"
alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
@ -77,7 +99,8 @@
</div>
</li>
<li>
<img src="http://10.10.11.7/images/home/3.png" alt="">
<img src="http://10.10.11.7/images/home/3.png"
alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
@ -85,7 +108,8 @@
</div>
</li>
<li>
<img src="http://10.10.11.7/images/home/3.png" alt="">
<img src="http://10.10.11.7/images/home/3.png"
alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
@ -93,7 +117,8 @@
</div>
</li>
<li>
<img src="http://10.10.11.7/images/home/3.png" alt="">
<img src="http://10.10.11.7/images/home/3.png"
alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
@ -101,14 +126,16 @@
</div>
</li>
<li>
<img src="http://10.10.11.7/images/home/3.png" alt="">
<img src="http://10.10.11.7/images/home/3.png"
alt="">
<div class="texts">
<h6>2022 New Year Message from President Sun Dongbai</h6>
<p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)</p>
<span class="meta">2022.08.12</span>
</div>
</li>
<div class="cover" @click="toSet(5)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(5)">点击更换标题与描述</div>
</ul>
</div>
</div>
@ -118,77 +145,98 @@
<div class="c-wrap">
<h2 class="b-title">{{ modules[6].form.title }}</h2>
<p class="intro">{{ modules[6].form.des }}</p>
<div class="cover" @click="toSet(6)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(6)">点击更换标题与描述</div>
</div>
<ul class="people">
<template v-for="(item, i) in modules[7].list">
<li v-if="item.isEnable" :key="i">
<img class="pic" :src="item.pic" alt="">
<li v-if="item.isEnable"
:key="i">
<img class="pic"
:src="item.pic"
alt="">
<div class="texts">
<h6>{{ item.title }}</h6>
<p class="des">{{ item.des }}</p>
<img class="arrow" src="@/assets/images/arrow.png" alt="">
<img class="arrow"
src="@/assets/images/arrow.png"
alt="">
</div>
</li>
</template>
<div class="cover" @click="toSet(7)">点击更改图片标题概述与链接</div>
<div class="cover"
@click="toSet(7)">点击更改图片标题概述与链接</div>
</ul>
</div>
</div>
<div class="about">
<div class="inner">
<img src="@/assets/images/about.png" alt="">
<img src="@/assets/images/about.png"
alt="">
<div class="line"></div>
<div class="text">{{ modules[8].form.title }}</div>
<div class="des" v-html="modules[8].form.des"></div>
<div class="des"
v-html="modules[8].form.des"></div>
</div>
<div class="cover" @click="toSet(8)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(8)">点击更换标题与描述</div>
</div>
<div class="block" style="padding-bottom: 0">
<div class="block"
style="padding-bottom: 0">
<div class="inner">
<div class="c-wrap">
<h2 class="glance">{{ modules[9].form.title }}</h2>
<div class="cover" @click="toSet(9)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(9)">点击更换标题与描述</div>
</div>
<ul class="stat">
<li>
<p class="num">{{ modules[10].form.title }}</p>
<p class="text">{{ modules[10].form.des }}</p>
<div class="cover" @click="toSet(10)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(10)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[11].form.title }}</p>
<p class="text">{{ modules[11].form.des }}</p>
<div class="cover" @click="toSet(11)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(11)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[12].form.title }}</p>
<p class="text">{{ modules[12].form.des }}</p>
<div class="cover" @click="toSet(12)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(12)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[13].form.title }}</p>
<p class="text">{{ modules[13].form.des }}</p>
<div class="cover" @click="toSet(13)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(13)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[14].form.title }}</p>
<p class="text">{{ modules[14].form.des }}</p>
<div class="cover" @click="toSet(14)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(14)">点击更换标题与描述</div>
</li>
<li>
<p class="num">{{ modules[15].form.title }}</p>
<p class="text">{{ modules[15].form.des }}</p>
<div class="cover" @click="toSet(15)">点击更换标题与描述</div>
<div class="cover"
@click="toSet(15)">点击更换标题与描述</div>
</li>
</ul>
</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>
</template>
@ -228,7 +276,7 @@ export default {
</script>
<style lang="scss" scoped>
@import "../../../styles/page/page.scss";
@import '../../../styles/page/page.scss';
.block {
.card {
display: flex;
@ -240,7 +288,7 @@ export default {
.texts {
padding-left: 22px;
margin-top: 60px;
border-left: 2px solid #DFE4E9;
border-left: 2px solid #dfe4e9;
}
h6 {
margin-bottom: 25px;
@ -283,7 +331,7 @@ export default {
}
h6 {
font-size: 18px;
color: #0648A8;
color: #0648a8;
}
.des {
margin: 14px 0;
@ -331,7 +379,7 @@ export default {
font-weight: bold;
font-family: SFProDisplay-Bold, SFProDisplay;
text-align: center;
border-bottom: 1px solid #DEDEDE;
border-bottom: 1px solid #dedede;
}
.stat {
display: flex;
@ -347,7 +395,7 @@ export default {
margin-bottom: 10px;
font-size: 60px;
font-weight: 800;
color: #035CE1;
color: #035ce1;
line-height: 49px;
}
.text {
@ -383,7 +431,7 @@ export default {
color: #fff;
line-height: 42px;
text-align: center;
background: rgba(111, 69, 36, .56);
background: rgba(111, 69, 36, 0.56);
border-radius: 17px;
}
}

Loading…
Cancel
Save