| @@ -49,17 +49,34 @@ | |||||
| <div class="yyzrbtxt lr"> | <div class="yyzrbtxt lr"> | ||||
| <div class="txtcontent"> | <div class="txtcontent"> | ||||
| <img src="@/assets/rblogo.png" class="logo"> | <img src="@/assets/rblogo.png" class="logo"> | ||||
| <div class="title"> | |||||
| {{ daliay.title }} | |||||
| </div> | |||||
| <p class="content">{{ daliay.content }}</p> | |||||
| <el-carousel :interval="5000" arrow="always" height="470px"> | |||||
| <template v-for="(item, index) in daliay.left" > | |||||
| <el-carousel-item :key="index"> | |||||
| <!-- <img :src="item.img" alt=""> --> | |||||
| <div class="title"> | |||||
| {{ item.title }} | |||||
| </div> | |||||
| <p class="content"> | |||||
| <!-- <template ></template> --> | |||||
| <!-- {{ item.content }} --> | |||||
| </p> | |||||
| </el-carousel-item> | |||||
| </template> | |||||
| </el-carousel> | |||||
| </div> | </div> | ||||
| <div class="btn"> | <div class="btn"> | ||||
| <el-button plain class="more" size="small">MORE</el-button> | <el-button plain class="more" size="small">MORE</el-button> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="yyzrbimg lr" > | <div class="yyzrbimg lr" > | ||||
| <img :src="daliay.img" alt=""> | |||||
| <el-carousel :interval="5000" arrow="always" height="470px"> | |||||
| <template v-for="(item, index) in daliay.right" > | |||||
| <el-carousel-item :key="index"> | |||||
| <img :src="item.img" alt=""> | |||||
| </el-carousel-item> | |||||
| </template> | |||||
| </el-carousel> | |||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="bottom" :style="{ backgroundImage: `url(${gg2})` }"/> | <div class="bottom" :style="{ backgroundImage: `url(${gg2})` }"/> | ||||
| @@ -88,6 +105,8 @@ export default { | |||||
| gg2: '', | gg2: '', | ||||
| alink: '', | alink: '', | ||||
| daliay: { | daliay: { | ||||
| left: [], | |||||
| right: [], | |||||
| title: '', | title: '', | ||||
| content: '', | content: '', | ||||
| img: '' | img: '' | ||||
| @@ -151,9 +170,16 @@ export default { | |||||
| async getyuanyuzhouHotList () { | async getyuanyuzhouHotList () { | ||||
| const { data: { message, data: { list } } } = await yuanyuzhouHotList() | const { data: { message, data: { list } } } = await yuanyuzhouHotList() | ||||
| if (message === 'success') { | if (message === 'success') { | ||||
| this.daliay.title = list[0].news.title | |||||
| this.daliay.content = list[0].news.subTitle | |||||
| this.daliay.img = list[0].news.image | |||||
| for (const iter of list) { | |||||
| console.log(iter) | |||||
| this.daliay.left.push({ | |||||
| title: iter.news.title, | |||||
| content: iter.news.detail | |||||
| }) | |||||
| this.daliay.right.push({ | |||||
| img: iter.news.image | |||||
| }) | |||||
| } | |||||
| } | } | ||||
| }, | }, | ||||
| async gethotnewsConfig () { | async gethotnewsConfig () { | ||||
| @@ -268,7 +294,7 @@ export default { | |||||
| display: flex; | display: flex; | ||||
| align-items: center; | align-items: center; | ||||
| flex-direction: column; | flex-direction: column; | ||||
| width: 100%; | |||||
| width: 90%; | |||||
| padding: 0 40px; | padding: 0 40px; | ||||
| .txtcontent { | .txtcontent { | ||||
| height: 50% !important; | height: 50% !important; | ||||
| @@ -276,14 +302,17 @@ export default { | |||||
| .title { | .title { | ||||
| height: 26px; | height: 26px; | ||||
| font-size: 26px; | |||||
| font-size: 24px; | |||||
| font-weight: bold; | font-weight: bold; | ||||
| color: #FFFFFF; | color: #FFFFFF; | ||||
| width: 100%; | width: 100%; | ||||
| display: flex; | display: flex; | ||||
| align-items: center; | |||||
| text-align: left; | |||||
| img { | img { | ||||
| width: 60px; | |||||
| height: 28px; | |||||
| margin-right: 10px; | margin-right: 10px; | ||||
| vertical-align: middle; | |||||
| } | } | ||||
| } | } | ||||
| p { | p { | ||||
| @@ -361,7 +390,7 @@ export default { | |||||
| .btn { | .btn { | ||||
| width:100%; | width:100%; | ||||
| position: absolute; | position: absolute; | ||||
| bottom: 55px; | |||||
| // bottom: 55px; | |||||
| .more { | .more { | ||||
| position: absolute; | position: absolute; | ||||
| left: 0px; | left: 0px; | ||||