parent
23b785bcbe
commit
82d0683446
18 changed files with 569 additions and 28 deletions
|
After Width: | Height: | Size: 688 KiB |
|
After Width: | Height: | Size: 769 KiB |
|
After Width: | Height: | Size: 324 KiB |
|
After Width: | Height: | Size: 332 KiB |
@ -0,0 +1,232 @@ |
|||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="actions"> |
||||||
|
<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="$router.back()">放弃编辑</el-button> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="modules"> |
||||||
|
<p class="page-name mb">页面设置/NEWS&EVENTS-PROCUREMENT</p> |
||||||
|
<div class="relative"> |
||||||
|
<el-carousel height="480px"> |
||||||
|
<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> |
||||||
|
</template> |
||||||
|
</el-carousel> |
||||||
|
<div class="cover" @click="toSet(0)">点击更换banner与链接</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="block"> |
||||||
|
<div class="inner c-wrap"> |
||||||
|
<ul class="list"> |
||||||
|
<li v-for="(item, i) in modules[1].list" :key="i"> |
||||||
|
<img class="pic" :src="item.pic" alt=""> |
||||||
|
<div class="texts"> |
||||||
|
<h6>{{ item.title }}</h6> |
||||||
|
<p class="sub">{{ item.subTitle }}</p> |
||||||
|
<div class="des">{{ item.des }}</div> |
||||||
|
<img src="@/assets/images/arrow.png" alt=""> |
||||||
|
</div> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
<div class="cover" @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' |
||||||
|
export default { |
||||||
|
mixins: [mixins], |
||||||
|
data() { |
||||||
|
return { |
||||||
|
modules: [ |
||||||
|
{ |
||||||
|
type: 'banner', |
||||||
|
list: [ |
||||||
|
{ |
||||||
|
pic: require('@/assets/images/news/1.png'), |
||||||
|
link: { |
||||||
|
linkName: '无', |
||||||
|
connectionType: 1, |
||||||
|
columnId: [], |
||||||
|
articleId: '', |
||||||
|
linkAddress : '', |
||||||
|
site: '', |
||||||
|
otherColumnId: [], |
||||||
|
otherArticleId: '', |
||||||
|
isOpen: 1 |
||||||
|
}, |
||||||
|
isEnable: 1 |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'introduce', |
||||||
|
forms: [ |
||||||
|
{ |
||||||
|
type: 'upload', |
||||||
|
prop: 'pic', |
||||||
|
label: '图片', |
||||||
|
required: true |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'input', |
||||||
|
prop: 'title', |
||||||
|
label: '标题', |
||||||
|
required: true |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'textarea', |
||||||
|
prop: 'subTitle', |
||||||
|
label: '小标题' |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'link', |
||||||
|
prop: 'link', |
||||||
|
label: '链接' |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'textarea', |
||||||
|
prop: 'des', |
||||||
|
label: '描述' |
||||||
|
} |
||||||
|
], |
||||||
|
form: { |
||||||
|
pic: '', |
||||||
|
title: '', |
||||||
|
subTitle: '', |
||||||
|
link: { |
||||||
|
linkName: '无', |
||||||
|
connectionType: 1, |
||||||
|
columnId: [], |
||||||
|
articleId: '', |
||||||
|
linkAddress : '', |
||||||
|
site: '', |
||||||
|
otherColumnId: [], |
||||||
|
otherArticleId: '', |
||||||
|
isOpen: 1 |
||||||
|
}, |
||||||
|
des: '' |
||||||
|
}, |
||||||
|
list: [ |
||||||
|
{ |
||||||
|
pic: require('@/assets/images/newsProcurement/1.png'), |
||||||
|
title: 'Project ', |
||||||
|
subTitle: 'IASF is driven to serve the Science and industry, and solve grand challenges.', |
||||||
|
link: { |
||||||
|
linkName: '无', |
||||||
|
connectionType: 1, |
||||||
|
columnId: [], |
||||||
|
articleId: '', |
||||||
|
linkAddress : '', |
||||||
|
site: '', |
||||||
|
otherColumnId: [], |
||||||
|
otherArticleId: '', |
||||||
|
isOpen: 1 |
||||||
|
}, |
||||||
|
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 …', |
||||||
|
isEnable: 1 |
||||||
|
}, |
||||||
|
{ |
||||||
|
pic: require('@/assets/images/newsProcurement/2.png'), |
||||||
|
title: 'Goods', |
||||||
|
subTitle: 'IASF is driven to serve the Science and industry, and solve grand challenges.', |
||||||
|
link: { |
||||||
|
linkName: '无', |
||||||
|
connectionType: 1, |
||||||
|
columnId: [], |
||||||
|
articleId: '', |
||||||
|
linkAddress : '', |
||||||
|
site: '', |
||||||
|
otherColumnId: [], |
||||||
|
otherArticleId: '', |
||||||
|
isOpen: 1 |
||||||
|
}, |
||||||
|
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 …', |
||||||
|
isEnable: 1 |
||||||
|
}, |
||||||
|
{ |
||||||
|
pic: require('@/assets/images/newsProcurement/3.png'), |
||||||
|
title: 'Service', |
||||||
|
subTitle: 'IASF is driven to serve the Science and industry, and solve grand challenges.', |
||||||
|
link: { |
||||||
|
linkName: '无', |
||||||
|
connectionType: 1, |
||||||
|
columnId: [], |
||||||
|
articleId: '', |
||||||
|
linkAddress : '', |
||||||
|
site: '', |
||||||
|
otherColumnId: [], |
||||||
|
otherArticleId: '', |
||||||
|
isOpen: 1 |
||||||
|
}, |
||||||
|
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 …', |
||||||
|
isEnable: 1 |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
], |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
|
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
@import "../../../styles/page/page.scss"; |
||||||
|
.list { |
||||||
|
li { |
||||||
|
position: relative; |
||||||
|
&:nth-child(even) { |
||||||
|
text-align: right; |
||||||
|
.texts { |
||||||
|
left: 0; |
||||||
|
text-align: left; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.pic { |
||||||
|
width: 650px; |
||||||
|
height: 730px; |
||||||
|
} |
||||||
|
.texts { |
||||||
|
position: absolute; |
||||||
|
top: 120px; |
||||||
|
left: 610px; |
||||||
|
width: 850px; |
||||||
|
height: 440px; |
||||||
|
padding: 60px 30px 30px 100px; |
||||||
|
background: rgba(247, 247, 247, .72); |
||||||
|
} |
||||||
|
h6 { |
||||||
|
font-size: 40px; |
||||||
|
color: #3C3C3C; |
||||||
|
} |
||||||
|
.sub { |
||||||
|
margin: 20px 0; |
||||||
|
font-size: 24px; |
||||||
|
color: #1C1C1C; |
||||||
|
line-height: 33px; |
||||||
|
} |
||||||
|
.des { |
||||||
|
margin-bottom: 20px; |
||||||
|
font-size: 20px; |
||||||
|
color: #3C3C3C; |
||||||
|
line-height: 32px; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue