Skip to content

P
project-www-pc
提交 05eb4791 authored 作者: pengxiaohui's avatar pengxiaohui
浏览文件
操作

修改

上级 90eec3ae
隐藏空白字符变更
内嵌 并排
正在显示 包含 450 行增加 和 1300 行删除
components/about/newList.vue 0 → 100644
浏览文件 @ 05eb4791
<template>
<div class="news-content-box">
<img
src="https://zws-imgs-pub.ezijing.com/static/public/a72ef577c9bae694c6bfc33e5bfc93af.png"
alt=""
class="banner"
/>
<ul class="list-content">
<template v-for="(item, index) in listData">
<li :key="index">
<app-link :item="{ news: { data: item, path: '/about/news' } }">
<img :src="item.web_img_uri" alt="" />
<div class="right-con">
<div class="time">{{ formatDate(item.start_time) }}</div>
<div class="title">{{ item.title }}</div>
<div class="text">{{ item.abstract }}</div>
</div>
</app-link>
</li>
</template>
</ul>
<div class="pages-box">
<el-pagination
layout="prev, pager, next"
@current-change="handleCurrentChange"
:page-size="limit"
:total="total"
>
</el-pagination>
</div>
</div>
</template>
<script>
import appLink from '@/components/Link'
export default {
props: {
type: {
type: String,
default: 'article_news'
}
},
components: { appLink },
data() {
return {
listData: [],
currentPaeg: 1,
total: 0,
limit: 10
}
},
async fetch() {
const params = {
project_id: process.env.projectId,
type_tag: this.type,
page: this.currentPaeg,
limit: 10
}
this.listData = await this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => {
this.total = res.data.total
return res.data.data
})
},
methods: {
handleCurrentChange(num) {
this.initData(num)
},
initData(num) {
const params = {
project_id: process.env.projectId,
type_tag: this.$route.query.type || 'article_news',
page: num,
limit: 10
}
this.listData = this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => {
this.total = parseInt(res.data.total)
this.listData = res.data.data
})
},
formatDate(value) {
const date = new Date(value * 1000)
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
}
}
}
</script>
<style lang="scss" scoped>
.news-content-box {
width: 1000px;
padding-bottom: 100px;
display: block;
.banner {
width: 100%;
display: block;
}
.list-content {
width: 1000px;
padding: 50px;
background: #fff;
li {
border-bottom: 1px solid #e6e6e6;
margin-bottom: 20px;
padding-bottom: 36px;
cursor: pointer;
::v-deep a {
display: flex;
flex-wrap: wrap;
height: fit-content;
}
&:hover {
.right-con {
background: rgba(241, 241, 241, 0.6);
.text {
color: #141414;
}
}
}
img {
width: 320px;
height: 100%;
display: block;
}
.right-con {
width: 550px;
margin-left: 15px;
padding-left: 15px;
.time {
font-size: 16px;
font-weight: 300;
line-height: 100%;
color: #aa1941;
// padding-top: 13px;
}
.title {
font-size: 22px;
font-weight: bold;
line-height: 32px;
color: #141414;
margin-top: 10px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.text {
font-size: 14px;
font-weight: 300;
line-height: 24px;
color: #666666;
margin-top: 15px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
}
}
}
.pages-box{
display: flex;
padding-bottom: 50px;
background: #fff;
justify-content: center;
}
}
</style>
components/home/serviceCase.vue
浏览文件 @ 05eb4791
...@@ -113,7 +113,7 @@ export default { ...@@ -113,7 +113,7 @@ export default {
position: relative; position: relative;
img { img {
width: 100%; width: 100%;
height:600px; height:500px;
display: block; display: block;
} }
.pop-txt-box { .pop-txt-box {
......
components/services/presence.vue
浏览文件 @ 05eb4791
...@@ -148,7 +148,7 @@ export default { ...@@ -148,7 +148,7 @@ export default {
font-size: 18px; font-size: 18px;
line-height: 32px; line-height: 32px;
color: #ffffff; color: #ffffff;
width: 281px; width: 260px;
background: #a9a9a9; background: #a9a9a9;
border-radius: 4px; border-radius: 4px;
text-align: center; text-align: center;
...@@ -157,6 +157,7 @@ export default { ...@@ -157,6 +157,7 @@ export default {
.tips{ .tips{
color:#a9a9a9; color:#a9a9a9;
line-height:30px; line-height:30px;
text-align:center;
} }
} }
} }
......
pages/about/news/index.vue
浏览文件 @ 05eb4791
<template> <template>
<div class="news-content"> <div class="news-content">
<tab /> <tab />
<div class="news-content-box"> <new-list :type="type"/>
<img
src="https://zws-imgs-pub.ezijing.com/static/public/a72ef577c9bae694c6bfc33e5bfc93af.png"
alt=""
class="banner"
/>
<ul class="list-content">
<template v-for="(item, index) in listData">
<li :key="index">
<app-link :item="{ news: { data: item, path: '/about/news' } }">
<img :src="item.web_img_uri" alt="" />
<div class="right-con">
<div class="time">{{ formatDate(item.start_time) }}</div>
<div class="title">{{ item.title }}</div>
<div class="text">{{ item.abstract }}</div>
</div>
</app-link>
</li>
</template>
</ul>
<div class="pages-box">
<el-pagination
layout="prev, pager, next"
@current-change="handleCurrentChange"
:page-size="limit"
:total="total"
>
</el-pagination>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import appLink from '@/components/Link'
import tab from '@/components/about/tabNav' import tab from '@/components/about/tabNav'
import newList from '@/components/about/newList'
export default { export default {
components: { tab, appLink }, components: { tab, newList },
data() { data() {
return { return {
listData: [], listData: [],
...@@ -46,38 +17,12 @@ export default { ...@@ -46,38 +17,12 @@ export default {
limit: 10 limit: 10
} }
}, },
async fetch() { computed: {
const params = { type() {
project_id: process.env.projectId, return this.$route.query.type
type_tag: this.$route.query.type || 'article_news',
page: this.currentPaeg,
limit: 10
} }
this.listData = await this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => {
this.total = res.data.total
return res.data.data
})
}, },
methods: { methods: {
handleCurrentChange(num) {
this.initData(num)
},
initData(num) {
const params = {
project_id: process.env.projectId,
type_tag: this.$route.query.type || 'article_news',
page: num,
limit: 10
}
this.listData = this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => {
this.total = parseInt(res.data.total)
this.listData = res.data.data
})
},
formatDate(value) {
const date = new Date(value * 1000)
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
}
} }
} }
</script> </script>
...@@ -95,78 +40,4 @@ export default { ...@@ -95,78 +40,4 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.news-content-box {
width: 1000px;
padding-bottom: 100px;
display: block;
.banner {
width: 100%;
display: block;
}
.list-content {
width: 1000px;
padding: 50px;
background: #fff;
li {
border-bottom: 1px solid #e6e6e6;
margin-bottom: 20px;
padding-bottom: 36px;
cursor: pointer;
::v-deep a {
display: flex;
flex-wrap: wrap;
height: fit-content;
}
&:hover {
.right-con {
background: rgba(241, 241, 241, 0.6);
.text {
color: #141414;
}
}
}
img {
width: 320px;
height: 100%;
display: block;
}
.right-con {
width: 550px;
margin-left: 15px;
padding-left: 15px;
.time {
font-size: 16px;
font-weight: 300;
line-height: 100%;
color: #aa1941;
// padding-top: 13px;
}
.title {
font-size: 22px;
font-weight: bold;
line-height: 32px;
color: #141414;
margin-top: 10px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.text {
font-size: 14px;
font-weight: 300;
line-height: 24px;
color: #666666;
margin-top: 15px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
}
}
}
}
</style> </style>
pages/about/news/index_old.vue 0 → 100644
浏览文件 @ 05eb4791
<template>
<div class="news-content">
<tab />
<div class="news-content-box">
<img
src="https://zws-imgs-pub.ezijing.com/static/public/a72ef577c9bae694c6bfc33e5bfc93af.png"
alt=""
class="banner"
/>
<ul class="list-content">
<template v-for="(item, index) in listData">
<li :key="index">
<app-link :item="{ news: { data: item, path: '/about/news' } }">
<img :src="item.web_img_uri" alt="" />
<div class="right-con">
<div class="time">{{ formatDate(item.start_time) }}</div>
<div class="title">{{ item.title }}</div>
<div class="text">{{ item.abstract }}</div>
</div>
</app-link>
</li>
</template>
</ul>
<div class="pages-box">
<el-pagination
layout="prev, pager, next"
@current-change="handleCurrentChange"
:page-size="limit"
:total="total"
>
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import appLink from '@/components/Link'
import tab from '@/components/about/tabNav'
export default {
components: { tab, appLink },
data() {
return {
listData: [],
currentPaeg: 1,
total: 0,
limit: 10
}
},
async fetch() {
const params = {
project_id: process.env.projectId,
type_tag: this.$route.query.type || 'article_news',
page: this.currentPaeg,
limit: 10
}
this.listData = await this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => {
this.total = res.data.total
return res.data.data
})
},
methods: {
handleCurrentChange(num) {
this.initData(num)
},
initData(num) {
const params = {
project_id: process.env.projectId,
type_tag: this.$route.query.type || 'article_news',
page: num,
limit: 10
}
this.listData = this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => {
this.total = parseInt(res.data.total)
this.listData = res.data.data
})
},
formatDate(value) {
const date = new Date(value * 1000)
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
}
}
}
</script>
<style lang="scss" scoped>
.pages-box{
display: flex;
padding-bottom: 50px;
background: #fff;
justify-content: center;
}
.news-content {
width: 1200px;
margin: 0 auto;
padding-top: 63px;
display: flex;
justify-content: space-between;
}
.news-content-box {
width: 1000px;
padding-bottom: 100px;
display: block;
.banner {
width: 100%;
display: block;
}
.list-content {
width: 1000px;
padding: 50px;
background: #fff;
li {
border-bottom: 1px solid #e6e6e6;
margin-bottom: 20px;
padding-bottom: 36px;
cursor: pointer;
::v-deep a {
display: flex;
flex-wrap: wrap;
height: fit-content;
}
&:hover {
.right-con {
background: rgba(241, 241, 241, 0.6);
.text {
color: #141414;
}
}
}
img {
width: 320px;
height: 100%;
display: block;
}
.right-con {
width: 550px;
margin-left: 15px;
padding-left: 15px;
.time {
font-size: 16px;
font-weight: 300;
line-height: 100%;
color: #aa1941;
// padding-top: 13px;
}
.title {
font-size: 22px;
font-weight: bold;
line-height: 32px;
color: #141414;
margin-top: 10px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.text {
font-size: 14px;
font-weight: 300;
line-height: 24px;
color: #666666;
margin-top: 15px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
}
}
}
}
</style>
pages/services/college.vue
浏览文件 @ 05eb4791
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="college-content"> <div class="college-content">
<div class="mian-title">{{ $t('menu.servicesChild.college') }}</div> <div class="mian-title">{{ $t('menu.servicesChild.college') }}</div>
<div class="mian"> <div class="mian">
<tab :data="tabList" @tabChangeIndex="tabChangeIndex" /> <tab :data="tabList" :defaultActive="defaultActive" @tabChangeIndex="tabChangeIndex" />
<div class="college-content-mian"> <div class="college-content-mian">
<template v-if="showModule === 0"> <template v-if="showModule === 0">
<div class="module-1 module-content-box"> <div class="module-1 module-content-box">
...@@ -36,10 +36,6 @@ ...@@ -36,10 +36,6 @@
数字经济产业学院共建目标 数字经济产业学院共建目标
</p> </p>
<img src="https://webapp-pub.ezijing.com/www/pc/services/college/power_01.png" alt="" /> <img src="https://webapp-pub.ezijing.com/www/pc/services/college/power_01.png" alt="" />
<img src="https://webapp-pub.ezijing.com/www/pc/industry/image41.png" alt="" v-if="tabActive === 0" />
<img src="https://webapp-pub.ezijing.com/www/pc/industry/image42.png" alt="" v-if="tabActive === 1" />
<img src="https://webapp-pub.ezijing.com/www/pc/industry/image43.png" alt="" v-if="tabActive === 2" />
<img src="https://webapp-pub.ezijing.com/www/pc/industry/image44.png" alt="" v-if="tabActive === 3" />
<ul> <ul>
<li <li
v-for="(item, index) in navList" v-for="(item, index) in navList"
...@@ -51,6 +47,12 @@ ...@@ -51,6 +47,12 @@
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
</li> </li>
</ul> </ul>
<div class="img-content">
<img src="https://webapp-pub.ezijing.com/www/pc/industry/image41.png" alt="" v-if="tabActive === 0" />
<img src="https://webapp-pub.ezijing.com/www/pc/industry/image42.png" alt="" v-if="tabActive === 1" />
<img src="https://webapp-pub.ezijing.com/www/pc/industry/image43.png" alt="" v-if="tabActive === 2" />
<img src="https://webapp-pub.ezijing.com/www/pc/industry/image44.png" alt="" v-if="tabActive === 3" />
</div>
<div v-if="tabActive === 0" class="part"> <div v-if="tabActive === 0" class="part">
<ul> <ul>
<li>数字经济人才国家战略</li> <li>数字经济人才国家战略</li>
...@@ -129,23 +131,25 @@ ...@@ -129,23 +131,25 @@
:key="index" :key="index"
class="li" class="li"
@click="tabsClick(item, index)" @click="tabsClick(item, index)"
:class="{ active: index === tabsActive }" @mouseenter="handleMsEnter(index)"
@mouseleave="handleMsLeave"
:class="{ active: index === tabsActive, isHover: index === hoverIndex }"
> >
<img :src="index === tabsActive ? item.activeImg : item.img" alt="" style="width:43px;height:43px" /> <img :src="index === tabsActive || index === hoverIndex ? item.activeImg : item.img" alt="" style="width:43px;height:43px" />
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
<p >{{ item.dec }}</p> <p >{{ item.dec }}</p>
</li> </li>
</ul> </ul>
<div class="content-mian"> <div class="content-mian" style="padding-top:10px;">
<div class="con-img-box" v-if="tabsActive === 0"> <div class="con-img-box" v-if="tabsActive === 0">
<img <!-- <img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/industry/image6.png' ? 'https://webapp-pub.ezijing.com/www/pc/industry/image6.png'
: 'https://webapp-pub.ezijing.com/www/pc/industry/image6.png' : 'https://webapp-pub.ezijing.com/www/pc/industry/image6.png'
" "
alt="" alt=""
/> /> -->
<div style="position:relative;width:900px;height:262px;margin-bottom:60px"> <div style="position:relative;width:900px;height:262px;margin-bottom:60px">
<img <img
:src=" :src="
...@@ -356,15 +360,20 @@ ...@@ -356,15 +360,20 @@
</div> </div>
</div> </div>
</template> </template>
<template v-if="showModule === 2">
<new-list type="service_case" />
</template>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import tab from '../../components/services/tab' import tab from '../../components/services/tab'
import newList from '../../components/about/newList'
export default { export default {
components: { components: {
tab tab,
newList
}, },
data() { data() {
return { return {
...@@ -444,13 +453,19 @@ export default { ...@@ -444,13 +453,19 @@ export default {
], ],
tabActive: 0, tabActive: 0,
tabsActive: 0, tabsActive: 0,
defaultActive: 0,
showModule: 0, showModule: 0,
count: 0 count: 0,
hoverIndex: -1
} }
}, },
created() { created() {
this.tabActive = 0 this.tabActive = 0
this.tabsActive = 0 this.tabsActive = 0
if (this.$route.query.type) {
this.defaultActive = parseInt(this.$route.query.type)
this.showModule = parseInt(this.$route.query.type)
}
// const type = this.$route.query.type // const type = this.$route.query.type
// this.showModule = type ? parseInt(type) : 0 // this.showModule = type ? parseInt(type) : 0
const timer = setInterval(() => { const timer = setInterval(() => {
...@@ -469,10 +484,16 @@ export default { ...@@ -469,10 +484,16 @@ export default {
this.tabsActive = index this.tabsActive = index
}, },
tabChangeIndex(n) { tabChangeIndex(n) {
if (n === 2) { // if (n === 2) {
this.$router.push({ path: '/about/news', query: { type: 'service_case' } }) // this.$router.push({ path: '/about/news', query: { type: 'service_case' } })
} // }
this.showModule = n this.showModule = n
},
handleMsEnter(index) {
this.hoverIndex = index
},
handleMsLeave() {
this.hoverIndex = -1
} }
}, },
computed: { computed: {
...@@ -517,7 +538,7 @@ export default { ...@@ -517,7 +538,7 @@ export default {
font-size: 14px; font-size: 14px;
font-weight: 300; font-weight: 300;
line-height: 28px; line-height: 28px;
color: #777777; color: #444;
opacity: 1; opacity: 1;
} }
...@@ -637,7 +658,7 @@ export default { ...@@ -637,7 +658,7 @@ export default {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
margin-bottom: 62px; margin-bottom: 32px;
// li { // li {
// // padding: 15px; // // padding: 15px;
// margin-left: 25px; // margin-left: 25px;
...@@ -669,7 +690,19 @@ export default { ...@@ -669,7 +690,19 @@ export default {
} }
} }
} }
.img-content{
height:280px;
position:relative;
overflow: hidden;
margin-bottom:30px;
img{
position:absolute;
left:0;
top:50%;
transform:translateY(-50%);
width:100%;
}
}
.part { .part {
li { li {
list-style-type: disc; list-style-type: disc;
...@@ -684,24 +717,28 @@ export default { ...@@ -684,24 +717,28 @@ export default {
.module-2 { .module-2 {
ul { ul {
display: flex; display: flex;
justify-content: center; justify-content: space-around;
align-items: center; align-items: center;
width:900px;
margin:0 auto;
.li { .li {
display: flex; display: flex;
align-items: center; align-items: center;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
width: 151px; width: 130px;
height: 156px; height: 132px;
background: #f4f4f4; background: #f4f4f4;
cursor:pointer; cursor:pointer;
border-radius:4px;
transition:0.3s;
.name{ .name{
font-size: 16px; font-size: 16px;
color: #424242; color: #424242;
font-weight: 400; font-weight: 400;
} }
} }
.active { .active, .isHover {
background: #a81840; background: #a81840;
border-top: 6px solid #a81840; border-top: 6px solid #a81840;
.name{ .name{
...@@ -711,6 +748,9 @@ export default { ...@@ -711,6 +748,9 @@ export default {
color:#fff; color:#fff;
} }
} }
.isHover{
transform: translateY(-10px);
}
} }
.content-mian { .content-mian {
......
pages/services/job.vue
浏览文件 @ 05eb4791
...@@ -162,8 +162,10 @@ ...@@ -162,8 +162,10 @@
? 'https://webapp-pub.ezijing.com/www/pc/services/job/future_manage_11.png' ? 'https://webapp-pub.ezijing.com/www/pc/services/job/future_manage_11.png'
: 'https://webapp-pub.ezijing.com/www/pc/services/job/future_manage_11.png' : 'https://webapp-pub.ezijing.com/www/pc/services/job/future_manage_11.png'
" "
style="margin-bottom:35px;" style="margin-bottom:20px;"
/> />
<div class="module-title" style="margin-bottom:15px;">{{isEn ? '注册报名' : '注册报名'}}</div>
<presence />
</div> </div>
</div> </div>
</template> </template>
......
pages/services/major.vue
浏览文件 @ 05eb4791
...@@ -502,25 +502,9 @@ ...@@ -502,25 +502,9 @@
/> />
<div class="module-title">{{isEn ? '专业分类' : '专业分类'}}</div> <div class="module-title">{{isEn ? '专业分类' : '专业分类'}}</div>
<div class="tabs"> <div class="tabs">
<div :class="{item: true, active: module6TabActive === 0}" @click="module6TabActive = 0"> <div :class="{item: true, active: module6TabActive === index, isHover: module6TabHoverIndex === index}" v-for="(item, index) in module6TabList" :key="index" @click="module6TabActive = index" @mouseenter="module6TabHoverIndex = index" @mouseleave="module6TabHoverIndex = -1">
<img v-show="module6TabActive !== 0" src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon1.png"> <img :src="module6TabActive === index || module6TabHoverIndex === index ? item.active_icon : item.icon">
<img v-show="module6TabActive === 0" src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon1_on.png"> <p>{{item.text}}</p>
<p>人工智能方向</p>
</div>
<div :class="{item: true, active: module6TabActive === 1}" @click="module6TabActive = 1">
<img v-show="module6TabActive !== 1" src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon2.png">
<img v-show="module6TabActive === 1" src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon2_on.png">
<p>数据技术方向</p>
</div>
<div :class="{item: true, active: module6TabActive === 2}" @click="module6TabActive = 2">
<img v-show="module6TabActive !== 2" src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon3.png">
<img v-show="module6TabActive === 2" src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon3_on.png">
<p>云计算方向</p>
</div>
<div :class="{item: true, active: module6TabActive === 3}" @click="module6TabActive = 3">
<img v-show="module6TabActive !== 3" src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon4.png">
<img v-show="module6TabActive === 3" src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon4_on.png">
<p>网络安全方向</p>
</div> </div>
</div> </div>
<div v-show="module6TabActive === 0"> <div v-show="module6TabActive === 0">
...@@ -1005,7 +989,30 @@ export default { ...@@ -1005,7 +989,30 @@ export default {
prevEl: '.swiper-button-prev', prevEl: '.swiper-button-prev',
} }
}, },
module6TabActive: 0 module6TabActive: 0,
module6TabHoverIndex: -1,
module6TabList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon1.png',
active_icon: 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon1_on.png',
text: '人工智能方向'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon2.png',
active_icon: 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon2_on.png',
text: '数据技术方向'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon3.png',
active_icon: 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon3_on.png',
text: '云计算方向'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon4.png',
active_icon: 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon4_on.png',
text: '网络安全方向'
}
]
} }
}, },
created() { created() {
...@@ -1231,13 +1238,16 @@ export default { ...@@ -1231,13 +1238,16 @@ export default {
.tabs{ .tabs{
display:flex; display:flex;
.item{ .item{
width:150px; width:130px;
height:150px; height:130px;
background: #F4F4F4; background: #F4F4F4;
text-align:center; text-align:center;
box-sizing:border-box; box-sizing:border-box;
padding-top:30px; padding-top:30px;
border-top:6px solid #f4f4f4; border-top:6px solid #f4f4f4;
border-radius: 4px;
margin-right:20px;
transition:0.3s;
cursor:pointer; cursor:pointer;
img{ img{
width:42px; width:42px;
...@@ -1246,11 +1256,14 @@ export default { ...@@ -1246,11 +1256,14 @@ export default {
margin-bottom:16px; margin-bottom:16px;
} }
} }
.item.active{ .item.active, .item.isHover{
border-color:#aa1941; border-color:#aa1941;
background:#aa1941; background:#aa1941;
color:#fff; color:#fff;
} }
.item.isHover{
transform: translateY(-10px);
}
} }
.img-text{ .img-text{
position:relative; position:relative;
......
pages/services/major_old.vue deleted 100644 → 0
浏览文件 @ 90eec3ae
<template>
<div class="major-content">
<div class="mian-title">{{ $t('home.service.program') }}</div>
<div class="mian">
<tab :data="tabList" @tabChangeIndex="tabChangeIndex" />
<div class="major-content-mian">
<!-- 专业顶层设计 -->
<template v-if="showModule === 0">
<div class="module-1 module-content-box">
<img src="https://webapp-pub.ezijing.com/www/pc/m1-banner-new.png" alt="" class="banner" />
<div class="content-mian">
<div class="dec-txt">
{{
$cookies.get('lang') == 'en-US'
? 'Zijing Education has abundant technology and industrial resources to assist institutions in responding to industrial transformation, policy requirements and new challenges. It would be supportive for the development of disciplines and majors in terms of industrialization, internationalization, and digitization. Moreover, Zijing Education is dedicating to optimizing education plan, expertise of faculty to jointly develop the globally focused curriculums for teaching and most distinctive design of programs.'
: '依托紫荆教育技术与产业资源优势，协助院校应对行业变革、政策要求和办学新挑战，为院校提供产业化、国际化、数字化专业提升建设支持，优化人才培养方案，提升师资力量，共同开发精品课程资源，促进教学发展，整体提升专业建设水平，助力院校打造专业特色和优势。'
}}
</div>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img1.png'
: 'https://webapp-pub.ezijing.com/www/pc/m1-i1-new.png'
"
alt=""
/>
<!-- <ul>
<li
v-for="(item, index) in module1.list"
:key="index"
:style="m1SetStyle(item.image)"
>
<div class="title">{{ item.title }}</div>
<div class="p" v-for="(text, tIndex) in item.texts" :key="'text' + tIndex">{{ text }}</div>
<div class="pop-con">
<div class="tit">{{ item.active.title }}</div>
<div class="text">{{ item.active.text }}</div>
</div>
</li>
</ul> -->
</div>
</div>
</template>
<!-- 实训基地建设 -->
<template v-if="showModule === 3">
<div class="module-2 module-content-box">
<img src="https://webapp-pub.ezijing.com/www/pc/m2-banner.jpg" alt="" class="banner" />
<div class="content-mian">
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img6.png'
: 'https://zws-imgs-pub.ezijing.com/static/public/8f73e25f5db8f97a992555c5a45b9dfe.png'
"
alt=""
class="img1"
/>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img7.png'
: 'https://zws-imgs-pub.ezijing.com/static/public/c3da614c7163af739b09e1029e2c6e77.png'
"
alt=""
class="img2"
/>
<ul>
<li>
<div class="block">01</div>
<div class="text">
{{
$cookies.get('lang') == 'en-US'
? 'The teaching practice and practice base that the course teaching needs'
: '课程教学需要的教学实训实习基地'
}}
</div>
</li>
<li>
<div class="block">02</div>
<div class="text">
{{
$cookies.get('lang') == 'en-US'
? 'Professional teaching needs of production training practice base'
: '专业教学需要的生产实训实习基地'
}}
</div>
</li>
<li>
<div class="block">03</div>
<div class="text">
{{
$cookies.get('lang') == 'en-US'
? 'Induction of labor into the school training practice base'
: '引产入校实训实习基地'
}}
</div>
</li>
<li>
<div class="block">04</div>
<div class="text">
{{
$cookies.get('lang') == 'en-US'
? 'Other short - term, scattered practical training and internship units (or points)'
: '其他短期、分散的实训实习单位（点）'
}}
</div>
</li>
</ul>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img8.png'
: 'https://webapp-pub.ezijing.com/www/pc/m2-i3-new1.png'
"
alt=""
class="img3"
/>
</div>
</div>
</template>
<!-- 实训平台建设 -->
<template v-if="showModule === 4">
<div class="module-3 module-content-box">
<img src="https://webapp-pub.ezijing.com/www/pc/m3-i1-new.png" alt="" class="banner" />
<div class="content-mian">
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img9.png'
: 'https://webapp-pub.ezijing.com/www/pc/1.png'
"
alt=""
class="img1"
/>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img10.png'
: 'https://webapp-pub.ezijing.com/www/pc/2.png'
"
alt=""
class="img2"
/>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img11.png'
: 'https://webapp-pub.ezijing.com/www/pc/3-new.png'
"
alt=""
class="img3"
/>
</div>
</div>
</template>
<!-- 课程资源建设 -->
<template v-if="showModule === 2">
<div class="module-4 module-content-box">
<img src="https://webapp-pub.ezijing.com/www/pc/m4-banner.jpg" alt="" class="banner" />
<div class="content-mian">
<div class="txt1">
{{
$cookies.get('lang') == 'en-US'
? 'With the support of famous teachers and industry experts in the north of the Qing Dynasty, and combined with the needs of enterprises in the professional direction and the curriculum reform plan, Bauhinia Education has formed a set of comprehensive reform project curriculum resources that connect the professional chain with the industrial chain, the curriculum content with the professional standard, and the teaching with the production process.'
: '紫荆教育以清北名师，业界专家为依托，结合专业方向的行业企业需求和课程改革方案，形成一整套专业链与产业链、课程内容与职业标准、教学与生产过程对接的综合改革项目课程教学资源。'
}}
</div>
<div class="txt-con-box">
<div class="tit">
{{ $cookies.get('lang') == 'en-US' ? 'Course recording team and facilities' : '课程录制团队及设施' }}
</div>
<div class="dec">
<div class="p">
{{
$cookies.get('lang') == 'en-US'
? 'Existing full-time and part-time design development, curriculum editing 50 professional personnel,production team more engaged in the Internet education media industry transformation, have professional studio (studio, recorded room, online interactive multimedia room) and professional photographic equipment, can meet various industries both at home and abroad, the agencies course customization and development of a strong guarantee.'
: '现有专职、兼职设计开发、课程编辑等专业人员50名，制作团队多从事于传媒行业转型互联网教育，拥有专业摄影棚（直播室、录播室、线上线下现场多媒体互动室）及专业摄影设备，可成为满足国内外各行业、各机构课程定制与开发的强有力保障。'
}}
</div>
<div class="p">
{{
$cookies.get('lang') == 'en-US'
? 'At present, there are more than 300 courses on the platform, more than 3,000 micro class hours online courses, and more than 30,000 registered students.'
: '目前紫荆平台上已有超过300门课程，超过3000微课时的在线课程，注册学习人数超过3万名。'
}}
</div>
</div>
</div>
<ul>
<li>
<div class="pop-box">
<div class="tit">
{{ $cookies.get('lang') == 'en-US' ? 'Online Course Development' : '线上课程研发' }}
</div>
<div class="ps">
{{ $cookies.get('lang') == 'en-US' ? 'Course Content Setting' : '课程内容设置' }}
</div>
<div class="ps">
{{ $cookies.get('lang') == 'en-US' ? 'Matching of Course Teachers' : '课程师资匹配' }}
</div>
<div class="ps">
{{ $cookies.get('lang') == 'en-US' ? 'Curriculum Production Scheme' : '课程制作方案' }}
</div>
</div>
<img src="https://webapp-pub.ezijing.com/www/pc/4.png" alt="" />
</li>
<li>
<div class="pop-box">
<div class="tit">
{{ $cookies.get('lang') == 'en-US' ? 'Course to make' : '课程制作' }}
</div>
<div class="ps">
{{ $cookies.get('lang') == 'en-US' ? 'Course record' : '课程录制' }}&nbsp;&nbsp;&nbsp;&nbsp;{{
$cookies.get('lang') == 'en-US' ? 'Course clips' : '课程剪辑'
}}
</div>
<div class="ps">
{{ $cookies.get('lang') == 'en-US' ? 'Course editor' : '课程编辑' }}&nbsp;&nbsp;&nbsp;&nbsp;{{
$cookies.get('lang') == 'en-US' ? 'Course into' : '课程成片'
}}
</div>
<div class="tips">
{{
$cookies.get('lang') == 'en-US'
? '(Course recording, to meet various needs, different forms have exclusive The site)'
: '（课程录制，满足各种需求，不同形式拥有专属的场地）'
}}
</div>
</div>
<img src="https://webapp-pub.ezijing.com/www/pc/5.png" alt="" />
</li>
<li>
<div class="pop-box">
<div class="tit p-t">
{{ $cookies.get('lang') == 'en-US' ? 'Offline Curriculum Development' : '线下课程开发' }}
</div>
<div class="ps">
{{ $cookies.get('lang') == 'en-US' ? 'The teaching design' : '教学设计' }}&nbsp;&nbsp;{{
$cookies.get('lang') == 'en-US' ? 'Educational plan' : '教务计划'
}}
</div>
<div class="ps">
{{
$cookies.get('lang') == 'en-US' ? 'Implement the implementation plan' : '实施执行方案'
}}&nbsp;&nbsp;&nbsp;&nbsp;
</div>
<div class="tips">
{{
$cookies.get('lang') == 'en-US'
? '(Three major teaching bases in China, more than 10 classrooms with different needs And conference room)'
: '（全国三大教学基地，10多间不同需求的教室与会议室）'
}}
</div>
</div>
<img src="https://webapp-pub.ezijing.com/www/pc/6.png" alt="" />
</li>
</ul>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img5.png'
: 'https://webapp-pub.ezijing.com/www/pc/7.png'
"
alt=""
class="con-img"
/>
</div>
</div>
</template>
<!-- 引产入校 -->
<template v-if="showModule === 5">
<div class="module-5 module-content-box">
<img src="https://webapp-pub.ezijing.com/www/pc/m5-banner-new.png" alt="" class="banner" />
<div class="content-mian">
<div class="con-txt">
<div class="tit">{{ $cookies.get('lang') == 'en-US' ? 'Background conce' : '背景理念' }}</div>
<div class="dec">
{{
$cookies.get('lang') == 'en-US'
? 'We will comprehensively promote the modern apprenticeship system, deepen the education mechanism of “integration of production and education” and combination of work and study, pursue deep integration and collaborative innovation, give full play to the role of enterprises and schools in the integration of production and education, integrate resources, and jointly cultivate high-quality and high-skilled talents.'
: '全面推进现代学徒制工作，深化“产教融合”、工学结合的育人机制，追求深度融合，协同创新，充分发挥企业和学校在产学融合中的作用，整合资源、共同培养高素质、高技能人才。'
}}
</div>
</div>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img12.png'
: 'https://webapp-pub.ezijing.com/www/pc/8-new.png'
"
alt=""
class="img1"
/>
<div class="pro-tit">{{ $cookies.get('lang') == 'en-US' ? 'Project objectives' : '项目目标' }}</div>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img13.png'
: 'https://webapp-pub.ezijing.com/www/pc/9-new.png'
"
alt=""
class="img1"
/>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img14.png'
: 'https://webapp-pub.ezijing.com/www/pc/10.png'
"
alt=""
class="img1"
/>
<ul>
<li>
<div class="num">01</div>
<div class="txt">
{{ $cookies.get('lang') == 'en-US' ? 'Unity of study and work' : '学习与工作统一' }}
</div>
</li>
<li>
<div class="num">02</div>
<div class="txt">
{{ $cookies.get('lang') == 'en-US' ? 'Students and staff are unified' : '学生与员工统一' }}
</div>
</li>
<li>
<div class="num">03</div>
<div class="txt">
{{
$cookies.get('lang') == 'en-US' ? 'The classrooms are unified with the factory' : '教室与工厂统一'
}}
</div>
</li>
<li>
<div class="num">04</div>
<div class="txt">
{{ $cookies.get('lang') == 'en-US' ? 'Operation and product unity' : '作业与产品统一' }}
</div>
</li>
</ul>
<img src="https://webapp-pub.ezijing.com/www/pc/m5-con-new.png" alt="" class="img1" />
<div class="pro-tit">
{{ $cookies.get('lang') == 'en-US' ? 'The implementation process' : '实施流程' }}
</div>
<div class="ul">
<div class="li">
<img src="https://webapp-pub.ezijing.com/www/pc/sslc1.png" alt="" class="icon" />
<img src="https://webapp-pub.ezijing.com/www/pc/sslc1-1.png" alt="" class="icon-active" />
<div class="tit">{{ $cookies.get('lang') == 'en-US' ? 'Recruitment period' : '招募期' }}</div>
<div class="p">
{{ $cookies.get('lang') == 'en-US' ? 'Preaching registration selection' : '宣讲报名选拔' }}
</div>
</div>
<div class="li">
<img src="https://webapp-pub.ezijing.com/www/pc/sslc2.png" alt="" class="icon" />
<img src="https://webapp-pub.ezijing.com/www/pc/sslc1-2.png" alt="" class="icon-active" />
<div class="tit">
{{ $cookies.get('lang') == 'en-US' ? 'During training' : '培训期' }}
</div>
<div class="p">
{{ $cookies.get('lang') == 'en-US' ? 'Professional quality' : '职业素养' }}<br />
{{ $cookies.get('lang') == 'en-US' ? 'Major Core Courses' : '专业核心课程' }}
</div>
</div>
<div class="li">
<img src="https://webapp-pub.ezijing.com/www/pc/sslc3.png" alt="" class="icon" />
<img src="https://webapp-pub.ezijing.com/www/pc/sslc1-3.png" alt="" class="icon-active" />
<div class="tit">{{ $cookies.get('lang') == 'en-US' ? 'Effective date' : '实施期' }}</div>
<div class="p">
{{ $cookies.get('lang') == 'en-US' ? 'Project Implementation ' : '项目实施过程' }}<br />{{
$cookies.get('lang') == 'en-US' ? 'Process control' : '控制'
}}
</div>
</div>
<div class="li">
<img src="https://webapp-pub.ezijing.com/www/pc/sslc4.png" alt="" class="icon" />
<img src="https://webapp-pub.ezijing.com/www/pc/sslc1-4.png" alt="" class="icon-active" />
<div class="tit">{{ $cookies.get('lang') == 'en-US' ? 'The inspection period' : '考核期' }}</div>
<div class="p">
{{ $cookies.get('lang') == 'en-US' ? 'Project quality assessment' : '项目质量考核' }}<br />{{
$cookies.get('lang') == 'en-US' ? 'Student ability assessment' : '学生能力考核'
}}
</div>
</div>
</div>
</div>
</div>
</template>
<!-- 师资培训 -->
<template v-if="showModule === 1">
<div class="module-6 module-content-box">
<!-- <div class="new-txt">聚力师资培养，提升教育“软实力”</div> -->
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img4.png'
: 'https://webapp-pub.ezijing.com/www/pc/m6-banner.png'
"
alt=""
class="banner"
/>
<div class="content-mian">
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img3.png'
: 'https://webapp-pub.ezijing.com/www/pc/szpx-1.png'
"
alt=""
/>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img2.png'
: 'https://webapp-pub.ezijing.com/www/pc/szpx-2.png'
"
alt=""
/>
</div>
</div>
</template>
<!-- 专业+创新创业 -->
<template v-if="showModule === 6">
<div class="module-7 module-content-box">
<img src="https://webapp-pub.ezijing.com/www/pc/m7-banner.jpg" alt="" class="banner" />
<div class="content-mian">
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img15.png'
: 'https://webapp-pub.ezijing.com/www/pc/cxcy-1.png'
"
alt=""
/>
<ul>
<li>
<div class="num">01</div>
<div class="p3">
{{ $cookies.get('lang') == 'en-US' ? 'Learn the basics of entre-preneurship' : '学习创业基础' }}
</div>
<div class="p3">
{{
$cookies.get('lang') == 'en-US'
? 'Stimulate entrepreneurial awareness and interest'
: '激发创业意识和兴趣'
}}
</div>
<div class="p3">
{{ $cookies.get('lang') == 'en-US' ? 'Innovation and entrepren-eurship' : '创新创业精神' }}
</div>
</li>
<li>
<div class="num">02</div>
<div class="p4">
{{
$cookies.get('lang') == 'en-US'
? 'Simulation innovation and entrepreneurship training and practice'
: '模拟创新创业实训和实践'
}}
</div>
<div class="p4">
{{ $cookies.get('lang') == 'en-US' ? 'Master basic entrepreneu-rial skills' : '掌握基本创业技能' }}
</div>
<div class="p4">
{{
$cookies.get('lang') == 'en-US'
? 'Cultivate innovative and entrepreneurial thinking'
: '培养创新创业思维'
}}
</div>
</li>
<li>
<div class="num">03</div>
<div class="p">{{ $cookies.get('lang') == 'en-US' ? 'Match analysis' : '赛事分析' }}</div>
<div class="p">{{ $cookies.get('lang') == 'en-US' ? 'incubation' : '项目孵化' }}</div>
<div class="p">{{ $cookies.get('lang') == 'en-US' ? 'Roadshow tutoring' : '路演辅导' }}</div>
<div class="p">{{ $cookies.get('lang') == 'en-US' ? 'Simulation of review' : '模拟点评' }}</div>
</li>
<li>
<div class="num">04</div>
<div class="p2">{{ $cookies.get('lang') == 'en-US' ? 'Graduation practice' : '毕业实习' }}</div>
<div class="p2">{{ $cookies.get('lang') == 'en-US' ? 'Induced labor enrolled' : '引产入校' }}</div>
<div class="p2">{{ $cookies.get('lang') == 'en-US' ? 'Business operations' : '创业运营' }}</div>
<div class="p2">
{{ $cookies.get('lang') == 'en-US' ? 'Connecting Industrial Resources' : '产业资源对接' }}
</div>
</li>
</ul>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img16.png'
: 'https://webapp-pub.ezijing.com/www/pc/cxcy-2.png'
"
alt=""
/>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/major/img17.png'
: 'https://webapp-pub.ezijing.com/www/pc/cxcy-3-new.png'
"
alt=""
class="img-w726"
/>
</div>
</div>
</template>
</div>
</div>
</div>
</template>
<script>
import tab from '../../components/services/tab'
export default {
components: {
tab
},
data() {
return {
module1: {
list: [
{
title: '资源整合',
texts: ['技术及产业资源', '企业人才需求', '国家教育政策支持'],
image: 'https://webapp-pub.ezijing.com/www/pc/m1-zy1.jpg',
active: {
title: '资源整合',
text:
'以国家教育政策为导向，聚焦技术及产业资源和企业岗位人才需求，促进产教融合、资源共享。构建高水平技术技能人才培养体系，打造技术技能创新服务平台，充分发挥集群效应，有机整合课程资源、教师资源与实训资源，实现资源整合和共享效益最大化，形成人才培养合力。'
}
},
{
title: '方案定制',
texts: ['专业顶层设计', '人才培养方案制定', '政策项目申报建设支持'],
image: 'https://webapp-pub.ezijing.com/www/pc/m1-zy2.jpg',
active: {
title: '方案定制',
text:
'紫荆教育依托专业的调研团队、大庞的专家顾问团队、深厚的专业背景和丰富的专业建设经验，根据国家政策法规变化、产业及市场需求升级和人才培养模式变革，进行专业顶层设计、人才培养方案制定与优化、政府项目申报建设支持等。'
}
},
{
title: '条件保障',
texts: ['课程资源平台', '实训室建设', '数字化实训仿真模拟'],
image: 'https://webapp-pub.ezijing.com/www/pc/m1-zy3.jpg',
active: {
title: '条件保障',
text:
'按照高标准化、国际化、开放式的实训实习原则，创新实习实训的运行机制，调整、优化实习实训平台及实验室的布局和结构，提高实习实训的管理和教学水平。借助现代化的新技术、新业态和新方式新建改建现有实训条件，加大信息技术和信息网络平台载体建设与智能化建设水平，创建数字化的下带服务教学工程，为专业建设提供有力保障。'
}
},
{
title: '建设内容',
texts: [
'一流学科、一流专业建设',
'双高建设',
'师资培训',
'课程与教材研发',
'科研课题合作',
'国际合作对接落地'
],
image: 'https://webapp-pub.ezijing.com/www/pc/m1-zy4.jpg',
active: {
title: '建设内容',
text:
'依托紫荆教育技术及产业整合优势，为学校优化人才培养方案，提升师资力量，共同开发精品课程资源，促进教学发展，整体提升学科建设水平，加强学生的专业水平和就业能力，推进相关领域学科专业建设，扩大人才培养规模。'
}
},
{
title: '建设成果',
texts: [
'形成“特色专业（群）”或“品牌专业（群）”，准确定位，差异发展；',
'专业（群）在区域范围乃至全国范围具备一定的影响力和辐射度；',
'学生和用人企业无缝对接，实习就业有保障'
],
image: 'https://webapp-pub.ezijing.com/www/pc/m1-zy5.jpg',
active: {
title: '建设成果',
text:
'打造战略性新兴学科专业（群），深化人才培养方案和课程体系改革，推动高校学科专业（群）结构的优化、人才培养模式的优化，在培养国家急需领域的创新应用型技术技能型人才的同时，实现产业、行业与专业的深度融合。'
}
}
]
},
module2: {
list: [
'课程教学需要的教学实训实习基地',
'专业教学需要的生产实训实习基地',
'引产入校实训实习基地',
'其他短期、分散的实训实习单位（点）'
]
},
tabList: [
{
name: this.$t('menu.cooperation.tit1')
},
{
name: this.$t('menu.cooperation.tit2')
},
{
name: this.$t('menu.cooperation.tit3')
},
{
name: this.$t('menu.cooperation.tit4')
},
{
name: this.$t('menu.cooperation.tit5')
},
{
name: this.$t('menu.cooperation.tit6')
},
{
name: this.$t('menu.cooperation.tit7')
}
],
showModule: 0
}
},
methods: {
tabChangeIndex(n) {
this.showModule = n
}
},
computed: {
m1SetStyle() {
return url => {
return `background: url(${url});background-size: 100% 100%`
}
}
}
}
</script>
<style lang="scss" scoped>
.major-content {
width: 1200px;
margin: 0 auto;
padding-bottom: 100px;
.mian {
display: flex;
justify-content: space-between;
}
.mian-title {
font-size: 28px;
font-weight: 500;
line-height: 100%;
color: #aa1941;
padding: 48px 0 31px;
}
.major-content-mian {
width: 1000px;
.module-content-box {
background: #fff;
.banner {
width: 100%;
height: 320px;
display: block;
}
}
.module-1 {
.content-mian {
padding: 60px 50px 65px;
.dec-txt {
font-size: 16px;
line-height: 32px;
color: rgba(66, 66, 66, 1);
margin-bottom: 37px;
}
img {
width: 100%;
display: block;
}
ul {
display: flex;
flex-wrap: wrap;
li {
position: relative;
cursor: pointer;
width: 440px;
height: 498px;
margin-right: 15px;
margin-bottom: 15px;
&:nth-child(even) {
margin-right: 0;
}
&:hover {
.pop-con {
opacity: 1;
}
}
.title {
padding: 55px 0 23px 56px;
font-size: 22px;
font-weight: bold;
line-height: 100%;
color: #ffffff;
}
.p {
padding: 0 56px 23px 56px;
font-size: 18px;
line-height: 100%;
color: #ffffff;
}
.pop-con {
transition: all 0.7s;
opacity: 0;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(170, 25, 65, 1);
.tit {
padding: 55px 0 28px 56px;
font-size: 22px;
font-weight: bold;
line-height: 100%;
color: #ffffff;
}
.text {
width: 325px;
font-size: 18px;
line-height: 32px;
color: #ffffff;
margin: 0 auto;
}
}
}
}
}
}
.module-2 {
.content-mian {
padding: 60px 50px 65px;
.img1 {
width: 100%;
margin: 0 auto;
display: block;
}
.img2 {
width: 100%;
margin: 50px auto;
display: block;
}
.img3 {
width: 100%;
margin: 50px auto;
display: block;
}
ul {
display: flex;
flex-wrap: wrap;
li {
cursor: pointer;
padding: 20px;
box-sizing: border-box;
width: 434px;
height: 110px;
background: #fbfbfb;
display: flex;
align-items: center;
transition: all 0.5s;
margin-right: 20px;
margin-bottom: 20px;
&:nth-child(even) {
margin-right: 0;
}
&:hover {
background: #ffffff;
box-shadow: 0px 1px 25px rgba(0, 0, 0, 0.06);
}
.block {
width: 70px;
height: 70px;
background: #aa1941;
text-align: center;
line-height: 70px;
font-size: 34px;
color: #fff;
}
.text {
width: 300px;
font-size: 18px;
// line-height: 32px;
color: #424242;
margin-left: 15px;
font-weight: 300;
}
}
}
}
}
.module-3 {
.content-mian {
padding: 60px 50px 65px;
.img1 {
width: 100%;
display: block;
margin: 0 auto;
}
.img2 {
width: 832px;
display: block;
margin: 15px 0 50px;
}
.img3 {
width: 491px;
display: block;
}
}
}
.module-4 {
.content-mian {
padding: 60px 50px 65px;
.txt1 {
font-size: 16px;
line-height: 32px;
color: #424242;
}
.txt-con-box {
margin-top: 40px;
.tit {
font-size: 22px;
font-weight: 500;
line-height: 24px;
color: #424242;
}
.dec {
margin-top: 10px;
.p {
font-size: 16px;
line-height: 32px;
color: #424242;
}
}
}
.con-img {
width: 100%;
margin-top: 50px;
display: block;
}
ul {
display: flex;
justify-content: space-between;
margin-top: 50px;
li {
width: 288px;
height: 184px;
position: relative;
&:hover {
.pop-box {
opacity: 1;
}
}
img {
width: 100%;
height: 100%;
display: block;
}
.pop-box {
opacity: 0;
transition: all 0.3s;
background: rgba(170, 25, 65, 0.8);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
.tit {
font-size: 20px;
// line-height: 32px;
color: #ffffff;
padding-top: 30px;
text-align: center;
&.p-t {
padding-top: 10px;
}
}
.ps {
font-size: 16px;
font-weight: 300;
line-height: 32px;
color: #ffffff;
text-align: center;
}
.tips {
width: 258px;
margin: 0 auto;
font-size: 12px;
line-height: 18px;
color: #ffffff;
}
}
}
}
}
}
.module-5 {
.content-mian {
padding: 60px 50px 65px;
.con-txt {
.tit {
font-size: 22px;
font-weight: 500;
line-height: 34px;
color: #424242;
}
.dec {
font-size: 16px;
line-height: 32px;
color: #424242;
margin-top: 10px;
}
}
.img1 {
width: 100%;
display: block;
margin-top: 50px;
}
.pro-tit {
font-size: 22px;
font-weight: 500;
line-height: 100%;
color: #424242;
margin: 30px 0;
}
ul {
padding-top: 50px;
display: flex;
justify-content: space-between;
li {
cursor: pointer;
width: 211px;
height: 130px;
background: #f9f8f8;
position: relative;
.num {
font-size: 34px;
font-weight: normal;
color: #aa1941;
text-align: center;
padding-top: 20px;
}
.txt {
padding-top: 5px;
font-size: 18px;
color: #424242;
text-align: center;
font-weight: 300;
}
&:hover {
box-shadow: 0px 1px 25px rgba(0, 0, 0, 0.06);
background: #fff;
&::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 8px;
background: rgba(170, 25, 65, 1);
}
}
}
}
.ul {
display: flex;
justify-content: center;
.li {
width: 192px;
img {
width: 100%;
height: 130px;
display: block;
}
.icon-active {
display: none;
}
&:hover {
.icon {
display: none;
}
.icon-active {
display: block;
}
}
.tit {
font-size: 20px;
font-weight: 500;
line-height: 34px;
color: #424242;
text-align: center;
margin-top: 10px;
}
.p {
font-size: 16px;
line-height: 24px;
color: #424242;
text-align: center;
}
}
}
}
}
.module-6 {
position: relative;
.new-txt {
position: absolute;
top: 135px;
left: 0;
width: 100%;
text-align: center;
font-size: 38px;
font-weight: 500;
color: #ffffff;
color: #fff;
}
.content-mian {
padding: 60px 50px 65px;
img {
width: 100%;
margin: 0 auto 50px;
display: block;
}
}
}
.module-7 {
.content-mian {
padding: 60px 50px 65px;
img {
width: 100%;
margin: 0 auto 50px;
display: block;
}
.img-w726 {
width: 726px;
margin: 0 auto;
}
ul {
display: flex;
justify-content: space-between;
margin-bottom: 21px;
li {
width: 216px;
height: 275px;
background: #f9f8f8;
&:hover {
background: #fff;
box-shadow: 0px 1px 25px rgba(0, 0, 0, 0.06);
}
.num {
font-size: 40px;
font-weight: normal;
line-height: 100%;
color: #aa1941;
padding: 35px 0 42px 24px;
}
.p {
font-size: 16px;
line-height: 100%;
color: #424242;
margin-bottom: 17px;
// margin-left: 25px;
// margin-right: 25px;
text-align: center;
font-weight: 300;
}
.p3 {
font-size: 16px;
line-height: 100%;
color: #424242;
margin-bottom: 17px;
margin-left: 20px;
margin-right: 20px;
font-weight: 300;
// text-align: center;
}
.p4 {
font-size: 16px;
line-height: 100%;
color: #424242;
margin-bottom: 17px;
margin-left: 10px;
font-weight: 300;
// margin-right: 20px;
// text-align: center;
}
.p1 {
margin: 0 auto;
width: 162px;
font-size: 18px;
line-height: 100%;
color: #424242;
margin-bottom: 12px;
text-align: left;
line-height: 25px;
font-weight: 300;
}
.p2 {
margin: 0 auto;
// width: 108px;
font-size: 16px;
line-height: 100%;
color: #424242;
margin-bottom: 17px;
text-align: center;
font-weight: 300;
}
}
}
}
}
}
}
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论