You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
95 lines
3.6 KiB
95 lines
3.6 KiB
<template>
|
|
<div>
|
|
<rotation />
|
|
<div class="inner content-box" style="margin-top: 50px; margin-bottom: 50px">
|
|
<div :key="index" v-for="(item, index) in list">
|
|
<div class="d-flex justify-space-between" v-if="index % 2 === 0">
|
|
<div class="introduce-box" style="width: 50% !important">
|
|
<p class="introduce-title">{{ item.title }}</p>
|
|
<p class="introduce-content">{{ item.content }}</p>
|
|
</div>
|
|
<img />
|
|
<video width="50%" :poster="item.imgUrl" controls>
|
|
<source src="https://www.sxwikionline.com/greenvalley/01.mp4" type="video/mp4" />
|
|
<source src="https://www.sxwikionline.com/greenvalley/01.mp4" type="video/ogg" />
|
|
</video>
|
|
</div>
|
|
<div class="d-flex justify-space-between" v-else>
|
|
<video width="50%" :poster="item.imgUrl" controls>
|
|
<source src="https://www.sxwikionline.com/greenvalley/02.mp4" type="video/mp4" />
|
|
<source src="https://www.sxwikionline.com/greenvalley/02.mp4" type="video/ogg" />
|
|
</video>
|
|
<div class="introduce-box" style="width: 50% !important">
|
|
<p class="introduce-title">{{ item.title }}</p>
|
|
<p class="introduce-content">{{ item.content }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<a-pagination
|
|
:current="current"
|
|
:page-size="pageSize"
|
|
:total="total"
|
|
@change="onShowSizeChange"
|
|
class="pagination"
|
|
show-less-items
|
|
show-quick-jumper
|
|
v-show="total > 2"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Rotation from 'components/Rotation/Rotation.vue';
|
|
export default {
|
|
name: 'Introduce',
|
|
components: { Rotation },
|
|
data() {
|
|
return {
|
|
title: '关于我们-公司介绍',
|
|
arr: [
|
|
{ name: '关于我们', url: '/About/Introduce' },
|
|
{ name: '公司介绍', url: '' },
|
|
],
|
|
list: [
|
|
{
|
|
title: '山西维基智汇科技有限公司',
|
|
content:
|
|
'研究院的介绍包含研究院，公司架构，和各中心的介绍。' +
|
|
'各中心介绍包含科创体系与科创能力咨询服务中心、知识产权与技术转移咨询服务中心、' +
|
|
'数字化转型咨询服务中心、科技信息咨询服务中心、科创战略协同研究中心、' +
|
|
'山西奥依工业设计咨询服务中心；研究院的介绍包含研究院，公司架构，和各中心的介绍。',
|
|
imgUrl: 'https://www.sxwikionline.com/gateway/greenvalley/uploads/upload/20210104/86d502b304944e0c849bff8dcf55ac08.jpg',
|
|
videoUr: 'https://www.sxwikionline.com/greenvalley/01.mp4',
|
|
},
|
|
{
|
|
title: '山西维基智汇科技有限公司',
|
|
content:
|
|
'各中心介绍包含科创体系与科创能力咨询服务中心、' +
|
|
'知识产权与技术转移咨询服务中心、数字化转型咨询服务中心、科技信息咨询服务中心、' +
|
|
'科创战略协同研究中心、山西奥依工业设计咨询服务中心',
|
|
imgUrl: 'https://www.sxwikionline.com/gateway/greenvalley/uploads/upload/20210104/4f9b898da25e48d3b73b47345ed14a9a.jpg',
|
|
videoUr: 'https://www.sxwikionline.com/greenvalley/02.mp4',
|
|
},
|
|
],
|
|
current: 1,
|
|
pageSize: 2,
|
|
total: 10,
|
|
};
|
|
},
|
|
|
|
methods: {
|
|
onShowSizeChange(current, size) {
|
|
console.log(current, size);
|
|
this.current = current;
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="stylus" scoped>
|
|
.pagination {
|
|
margin-top: 48px;
|
|
text-align: right;
|
|
}
|
|
</style>
|
|
|