Skip to content

P
project-www-pc
提交 911ed91b authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

新增模块，优化

上级 6b5a7128
隐藏空白字符变更
内嵌 并排
正在显示 包含 1596 行增加 和 33 行删除
.nuxt/router.js
浏览文件 @ 911ed91b
......@@ -10,6 +10,9 @@ const _10a7578c = () => interopDefault(import('../pages/about/culture.vue' /* we
const _23d2f0fd = () => interopDefault(import('../pages/about/introduce.vue' /* webpackChunkName: "pages/about/introduce" */))
const _7f16db65 = () => interopDefault(import('../pages/about/news.vue' /* webpackChunkName: "pages/about/news" */))
const _249d262e = () => interopDefault(import('../pages/about/news-detail.vue' /* webpackChunkName: "pages/about/news-detail" */))
const _12856c94 = () => interopDefault(import('../pages/services/college.vue' /* webpackChunkName: "pages/services/college" */))
const _3cf993c6 = () => interopDefault(import('../pages/services/employment.vue' /* webpackChunkName: "pages/services/employment" */))
const _5bfd9c5c = () => interopDefault(import('../pages/services/job.vue' /* webpackChunkName: "pages/services/job" */))
const _77495298 = () => interopDefault(import('../pages/services/major.vue' /* webpackChunkName: "pages/services/major" */))
const _4d95ac32 = () => interopDefault(import('../pages/index.vue' /* webpackChunkName: "pages/index" */))
......@@ -48,6 +51,18 @@ export const routerOptions = {
path: "/about/news-detail",
component: _249d262e,
name: "about-news-detail"
}, {
path: "/services/college",
component: _12856c94,
name: "services-college"
}, {
path: "/services/employment",
component: _3cf993c6,
name: "services-employment"
}, {
path: "/services/job",
component: _5bfd9c5c,
name: "services-job"
}, {
path: "/services/major",
component: _77495298,
......
.nuxt/routes.json
浏览文件 @ 911ed91b
......@@ -41,6 +41,27 @@
"chunkName": "pages/about/news-detail",
"_name": "_249d262e"
},
{
"name": "services-college",
"path": "/services/college",
"component": "/Users/lihui/Desktop/H/ezijing/guangwangAndXiangmuzhan/ezijing-www-pc/pages/services/college.vue",
"chunkName": "pages/services/college",
"_name": "_12856c94"
},
{
"name": "services-employment",
"path": "/services/employment",
"component": "/Users/lihui/Desktop/H/ezijing/guangwangAndXiangmuzhan/ezijing-www-pc/pages/services/employment.vue",
"chunkName": "pages/services/employment",
"_name": "_3cf993c6"
},
{
"name": "services-job",
"path": "/services/job",
"component": "/Users/lihui/Desktop/H/ezijing/guangwangAndXiangmuzhan/ezijing-www-pc/pages/services/job.vue",
"chunkName": "pages/services/job",
"_name": "_5bfd9c5c"
},
{
"name": "services-major",
"path": "/services/major",
......
components/Head.vue
浏览文件 @ 911ed91b
......@@ -192,22 +192,22 @@
{
name: '专业共建',
isShow: false,
pathType: 3
path: '/services/major'
},
{
name: '校企合作',
name: '新职业',
isShow: false,
pathType: 3
path: '/services/job'
},
{
name: '产业学院',
isShow: false,
pathType: 3
path: '/services/college'
},
{
name: '双高建设',
name: '高质量实习就业服务',
isShow: false,
pathType: 3
path: '/services/employment'
},
{
name: '在线教育解决方案',
......
components/about/contact.vue
浏览文件 @ 911ed91b
......@@ -5,7 +5,7 @@
<div class="con-mian">
<div class="tit">联系我们</div>
<div class="info">
地&nbsp;&nbsp;址：北京市海淀区中关村东路1号院7号楼5层<br />
地&nbsp;&nbsp;址：北京市海淀区中关村东路1号院清华科技园7号楼5层<br />
联系电话：010-62793299<br />
邮&nbsp;&nbsp;箱：service@ezijing.com
</div>
......@@ -60,6 +60,8 @@ export default {
</script>
<style lang="scss" scoped>
#allmap{
position: relative;
z-index: 0;
width: 1000px;
height: 320px;
}
......
components/about/culture.vue
浏览文件 @ 911ed91b
......@@ -2,7 +2,7 @@
<div class="culture-content-box">
<div class="video-box">
<video
src="https://zws-imgs-pub.ezijing.com/static/public/630810d0c5276d1195325d88d40a0034.mp4"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/%E7%B4%AB%E8%8D%86%E5%AE%A3%E4%BC%A0%E7%89%8720201224.mp4"
width=""
height=""
controls="controls"
......
components/about/introduce.vue
浏览文件 @ 911ed91b
......@@ -67,16 +67,16 @@
<span>50+</span>课程研发人员，<span>700+</span>师资团队，<span>4800+</span>总研发课时。
</div>
<div class="tab-con tab-con2" v-if="indexActive === 1">
源自清华 持续投入 <span>50+</span>技术研发团队，<span>1亿+</span>累计研发投入<br />
<span>500万+</span>总学习人次，<span>24</span>小时在线<br />
<span>1000+</span>次直播，<span>10000+</span>题库，<br />
大数据智能学习分析、作业评判、智能化营销数据分配<br />
源自清华，持续投入<span>50+</span>技术研发团队，<span>1亿+</span>累计研发投入 ;<br />
<span>500万+</span>总学习人次，<span>24</span>小时在线 ;<br />
<span>1000+</span>次直播，<span>10000+</span>题库 ;<br />
大数据智能学习分析、作业评判、智能化营销数据分配。<br />
</div>
<div class="tab-con tab-con3" v-if="indexActive === 2">
<span>WSCUC、AACSB、EQUIS…</span>认证<br />
<span>30</span>余位哈佛、清华、哥伦比亚等国际一流大学人才组成的国际化团队；<br />
<span>40%</span>员工有研究生学历<br />
<span>5</span>大洲<span>16</span>个国家/地区国际校友网络。覆盖全国<span>380+</span>省、市、自治区及行政特区
<span>WSCUC、AACSB、EQUIS…</span>认证 ;<br />
<span>30</span>余位哈佛、清华、哥伦比亚等国际一流大学人才组成的国际化团队 ;<br />
<span>40%</span>员工有研究生学历 ;<br />
<span>5</span>大洲<span>16</span>个国家/地区国际校友网络，覆盖全国<span>380+</span>省、市、自治区及行政特区。
</div>
</div>
</div>
......@@ -151,7 +151,7 @@ export default {
}
.n-txt{
font-size: 16px;
font-family: Source Han Sans CN;
font-family: auto;
line-height: 34px;
text-align: center;
color: #666666;
......@@ -210,11 +210,11 @@ export default {
}
.t2{
font-size: 20px;
font-weight: 300;
line-height: 100%;
color: #424242;
margin-top: 16px;
text-align: center;
font-family: auto;
}
}
}
......
components/about/news.vue
浏览文件 @ 911ed91b
......@@ -64,6 +64,7 @@ export default {
background: #fff;
li{
display: flex;
flex-wrap: wrap;
border-bottom: 1px solid #E6E6E6;
margin-bottom: 20px;
padding-bottom: 36px;
......@@ -81,6 +82,7 @@ export default {
display: block;
}
.right-con{
width: 550px;
margin-left: 30px;
.time{
font-size: 16px;
......@@ -110,7 +112,7 @@ export default {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
}
}
......
components/home/degreeEducation.vue
浏览文件 @ 911ed91b
......@@ -27,7 +27,7 @@
export default {
data() {
return {
indexActive: 0,
indexActive: 1,
data: [
{
name: '本科',
......
components/home/educationServices.vue
浏览文件 @ 911ed91b
......@@ -2,7 +2,7 @@
<div class="service-content max-width-center">
<div class="title">教育服务</div>
<ul class="nav-content">
<li v-for="(item, index) in data" :key="index" @click="goPage(item.path)">
<li v-for="(item, index) in data" :key="index" @click="goPage(item.path, item.pathType)">
<img :src="item.icon" alt="" class="icon">
<img :src="item.iconActive" alt="" class="icon-active">
<div class="text" v-html="item.text"></div>
......@@ -23,22 +23,22 @@ export default {
{
icon: 'https://zws-imgs-pub.ezijing.com/static/public/7bea5e01e4e4c92e104bb1d73d313500.png',
iconActive: 'https://zws-imgs-pub.ezijing.com/static/public/8b624145e8cd4a8c38f108dbd0efc3eb.png',
text: '专业共建', path: '', pathType: 0
text: '专业共建', path: '/services/major', pathType: 1
},
{
icon: 'https://zws-imgs-pub.ezijing.com/static/public/6db512b8b2b4501651e6f9bc520d7379.png',
iconActive: 'https://zws-imgs-pub.ezijing.com/static/public/bcbc44b065ea26146a68750e82aa058c.png',
text: '校企合作', path: '', pathType: 0
text: '新职业', path: '/services/job', pathType: 1
},
{
icon: 'https://zws-imgs-pub.ezijing.com/static/public/0e5522064d9070290b3d541a485d469f.png',
iconActive: 'https://zws-imgs-pub.ezijing.com/static/public/01d9b50bd0e2e2355a18f486181d710a.png',
text: '产业学院', path: '', pathType: 0
text: '产业学院', path: '/services/college', pathType: 1
},
{
icon: 'https://zws-imgs-pub.ezijing.com/static/public/0912f621abe188ccc84df6520a8fecf9.png',
iconActive: 'https://zws-imgs-pub.ezijing.com/static/public/759a550044932bcf0f1159d103361ed2.png',
text: '双高建设', path: '', pathType: 0
text: '高质量实习<br />就业服务', path: '/services/employment', pathType: 1
},
{
icon: 'https://zws-imgs-pub.ezijing.com/static/public/6cf5b6010dd7d35a80d4acc270db8a86.png',
......@@ -54,12 +54,13 @@ export default {
}
},
methods: {
goPage(path) {
goPage(path, type) {
if (path === '') {
this.$message('暂未开通，尽请期待。')
return
} else {
!type ? window.open(path) : this.$router.push({ path: path })
}
window.open(path)
}
}
}
......
components/home/serviceCase.vue
浏览文件 @ 911ed91b
......@@ -34,6 +34,7 @@ export default {
autoplay: true,
delay: 3000,
observer: true,
loop: true,
observerParent: true,
navigation: {
nextEl: '.next-button',
......
components/services/tab.vue
浏览文件 @ 911ed91b
......@@ -5,8 +5,8 @@
:class="indexActive === index && 'active'"
:key="index"
@click="tabChanges(index)"
v-html="item.name"
>
{{ item.name }}
</li>
</ul>
</template>
......@@ -27,7 +27,7 @@ export default {
methods: {
tabChanges(index) {
this.indexActive = index
this.$emit('tabIndex', index)
this.$emit('tabChangeIndex', index)
}
}
}
......@@ -35,7 +35,7 @@ export default {
<style lang="scss" scoped>
.tab-content{
width: 160px;
// height: 110px;
height: fit-content;
background: #fff;
padding-top: 35px;
padding-bottom: 43px;
......
pages/services/college.vue 0 → 100644
浏览文件 @ 911ed91b
<template>
<div class="college-content">
<div class="mian-title">产业学院</div>
<div class="mian">
<tab :data="tabList" @tabChangeIndex="tabChangeIndex"/>
<div class="college-content-mian">
<template v-if="showModule === 0">
<div class="module-1 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m1-banner.jpg" alt="" class="banner">
<div class="content-mian">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m1-i1.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m1-i2.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m1-i3.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m1-i4.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m1-i5.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m1-i6.png" alt="">
</div>
</div>
</template>
<template v-if="showModule === 1">
<div class="module-2 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-banner.jpg" alt="" class="banner">
<div class="content-mian">
<div class="con-img-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-i1.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-i2.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-i3.png" alt="">
</div>
<div class="ul-tit">目标岗位群</div>
<ul>
<li v-for="(item, index) in module2.list" :key="index">
<img :src="item.image" alt="">
<div class="pop-txt">{{ item.text }}</div>
</li>
</ul>
</div>
</div>
</template>
<template v-if="showModule === 2">
<div class="module-3 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-banner.jpg" alt="" class="banner">
<div class="content-mian">
<div class="con-img-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-i1.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-i2.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-i3.png" alt="">
</div>
<div class="ul-tit">目标岗位群</div>
<ul class="list1">
<li>
品牌管理方向
</li>
<li v-for="(item, index) in module3.list" :key="index">
<img :src="item.image" alt="">
<div class="pop-txt">{{ item.text }}</div>
</li>
</ul>
<ul class="list2">
<li>
全链路运营方向
</li>
<li v-for="(item, index) in module3.list2" :key="index">
<img :src="item.image" alt="">
<div class="pop-txt">{{ item.text }}</div>
</li>
</ul>
</div>
</div>
</template>
</div>
</div>
</div>
</template>
<script>
import tab from '../../components/services/tab'
export default {
components: {
tab
},
data() {
return {
module2: {
list: [
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb1.jpg', text: '数字化营销' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb2.jpg', text: '数字化运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb3.jpg', text: '智能投顾' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb4.jpg', text: '风险管理' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb5.jpg', text: '金融数据分析' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb6.jpg', text: '财务会计' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb7.jpg', text: '金融建模' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb8.jpg', text: '投资分析' }
]
},
module3: {
list: [
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb1.jpg', text: '数字化运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2.jpg', text: '广告策划' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb3.jpg', text: '媒体公共' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb4.jpg', text: '营销策划' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb5.jpg', text: '渠道管理' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb6.jpg', text: '品牌管理运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb7.jpg', text: '产品设计' }
],
list2: [
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-1.jpg', text: '互联网运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-2.jpg', text: '新媒体运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-3.jpg', text: '网站运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-4.jpg', text: '电商运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-5.jpg', text: '活动策划运营' }
]
},
tabList: [
{
name: '现代产业学院'
},
{
name: '数字金融'
},
{
name: '国际品牌管理<br />与新媒体运营'
}
],
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>
.college-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;
}
.college-content-mian{
width: 1000px;
.module-content-box{
background: #fff;
.banner{
width: 100%;
height: 320px;
display: block;
}
}
.module-1{
.content-mian{
padding: 60px 50px 65px;
img{
width: 100%;
display: block;
&:nth-child(1){
margin-bottom: 18px;
}
&:nth-child(2){
margin-bottom: 22px;
}
&:nth-child(3){
width: 874px;
margin-bottom: 54px;
}
&:nth-child(4){
margin-bottom: 12px;
}
&:nth-child(5){
width: 863px;
margin-bottom: 50px;
}
}
}
}
.module-2{
.content-mian{
padding: 60px 50px 65px;
.con-img-box{
img{
display: block;
&:nth-child(1){
width: 768px;
margin-bottom: 67px;
}
&:nth-child(2) {
width: 100%;
margin-bottom: 38px;
}
&:nth-child(3){
width: 864px;
margin-bottom: 78px;
}
}
}
.ul-tit{
font-size: 22px;
font-weight: 500;
line-height: 100%;
padding: 0 0 36px;
color: #424242;
}
ul{
display: flex;
flex-wrap: wrap;
li{
margin-right: 5px;
margin-bottom: 5px;
width: 220px;
height: 170px;
position: relative;
img{
width: 100%;
height: 100%;
display: block;
}
.pop-txt{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
font-size: 20px;
font-weight: 500;
line-height: 170px;
color: #FFFFFF;
background: rgba(0, 0, 0, 0);
text-align: center;
&:hover{
background: rgba(0, 0, 0, 0.3);
}
}
}
}
}
}
.module-3{
.content-mian{
padding: 60px 50px 65px;
.con-img-box{
img{
width: 100%;
display: block;
&:nth-child(1){
margin-bottom: 29px;
}
&:nth-child(2) {
margin-bottom: 75px;
}
}
}
.ul-tit{
font-size: 22px;
font-weight: 500;
line-height: 100%;
padding: 0 0 36px;
color: #424242;
}
.list1{
display: flex;
flex-wrap: wrap;
li{
margin-right: 5px;
margin-bottom: 5px;
width: 220px;
height: 170px;
position: relative;
&:nth-child(1){
background: #F9F8F8;
text-align: center;
line-height: 170px;
font-size: 22px;
color: #AA1941;
}
img{
width: 100%;
height: 100%;
display: block;
}
.pop-txt{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
font-size: 20px;
font-weight: 500;
line-height: 170px;
color: #FFFFFF;
background: rgba(0, 0, 0, 0);
text-align: center;
&:hover{
background: rgba(0, 0, 0, 0.3);
}
}
}
}
.list2{
padding-top: 36px;
display: flex;
flex-wrap: wrap;
li{
margin-right: 5px;
margin-bottom: 5px;
width: 295px;
height: 170px;
position: relative;
&:nth-child(1){
background: #F9F8F8;
text-align: center;
line-height: 170px;
font-size: 22px;
color: #AA1941;
}
img{
width: 100%;
height: 100%;
display: block;
}
.pop-txt{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
font-size: 20px;
font-weight: 500;
line-height: 170px;
color: #FFFFFF;
background: rgba(0, 0, 0, 0);
text-align: center;
&:hover{
background: rgba(0, 0, 0, 0.3);
}
}
}
}
}
}
}
}
</style>
pages/services/employment.vue 0 → 100644
浏览文件 @ 911ed91b
<template>
<div class="occupation-content">
<div class="mian-title">高质量实习就业服务</div>
<div class="mian">
<div class="occupation-content-mian">
<div class="module-1 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-banner.jpg" alt="" class="banner">
<div class="content-mian">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con1.png" alt="" class="img1">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con2.png" alt="" class="img2">
<ul>
<li v-for="(item, index) in list" :key="index">
<img :src="item.image" alt="">
<div class="pop-txt">{{ item.text }}</div>
</li>
</ul>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con3.png" alt="" class="img3">
<ul>
<li v-for="(item, index) in list2" :key="index">
<img :src="item.image" alt="">
<div class="pop-txt">{{ item.text }}</div>
</li>
</ul>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con4.png" alt="" class="img4">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con5.png" alt="" class="img5">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con6.png" alt="" class="img5">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con7.png" alt="" class="img9">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con8.png" alt="" class="img9">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-con9.png" alt="" class="img9">
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
components: {
},
data() {
return {
list: [
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx1.jpg', text: '职业思维篇' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx2.jpg', text: '职业形象篇' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx3.jpg', text: '职业效率篇' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx4.jpg', text: '职业提升篇' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx5.jpg', text: '菁英思维' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx6.jpg', text: '菁英技能' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx7.jpg', text: '菁英拓展' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx8.jpg', text: '菁英实战' }
],
list2: [
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx2-1.jpg', text: '行业分析' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx2-2.jpg', text: '人才测评' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx2-3.jpg', text: '自我认知' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/emp-gx2-4.jpg', text: '人岗匹配' }
]
}
},
methods: {
tabChangeIndex(n) {
this.showModule = n
}
},
computed: {
m1SetStyle() {
return (url) => {
return `background: url(${url});background-size: 100% 100%`
}
}
}
}
</script>
<style lang="scss" scoped>
.occupation-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;
}
.occupation-content-mian{
width: 1200px;
.module-content-box{
background: #fff;
.banner{
width: 100%;
height: 320px;
display: block;
}
}
.module-1{
.content-mian{
padding: 60px 50px 65px;
img{
width: 100%;
display: block;
}
.img1{
margin-bottom: 49px;
}
.img2{
width: 154px;
}
.img3{
width: 201px;
}
.img5{
margin-top: 53px;
}
.img9{
margin-top: 35px;
}
ul{
padding: 23px 0 39px 0;
display: flex;
flex-wrap: wrap;
li{
margin-right: 5px;
margin-bottom: 5px;
width: 265px;
height: 140px;
position: relative;
img{
width: 100%;
height: 100%;
display: block;
}
.pop-txt{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
font-size: 20px;
font-weight: 500;
line-height: 140px;
color: #FFFFFF;
background: rgba(0, 0, 0, 0);
text-align: center;
&:hover{
background: rgba(0, 0, 0, 0.3);
}
}
}
}
}
}
}
}
</style>
pages/services/job.vue 0 → 100644
浏览文件 @ 911ed91b
<template>
<div class="occupation-content">
<div class="mian-title">新职业</div>
<div class="mian">
<div class="occupation-content-mian">
<div class="module-1 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-banner.jpg" alt="" class="banner">
<div class="content-mian">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-i1.png" alt="" class="img1">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-i2.png" alt="" class="img2">
<div class="cont-hover">
<div class="top">
<div class="li">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-ly1.jpg" alt="">
<div class="pop">金融财经类</div>
</div>
<div class="li">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-ly2.png" alt="">
<div class="pop">数字化营销类</div>
</div>
</div>
<div class="bottom">
<div class="li">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-ly3.png" alt="">
<div class="pop">金融财经类</div>
</div>
<div class="li">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-ly4.png" alt="">
<div class="pop">数字化营销类</div>
</div>
<li class="li">……</li>
</div>
</div>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-i3.png" alt="" class="img3">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-i4.png" alt="" class="img4">
<!-- <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-i3.png" alt="" class="img5"> -->
<ul>
<li>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-zy1.jpg" alt="">
<div class="pop">金融产品数字化营销</div>
</li>
<li>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-zy2.jpg" alt="">
<div class="pop">互联网营销师</div>
</li>
<li>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-zy3.jpg" alt="">
<div class="pop">数字化营销师</div>
</li>
<li>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-zy4.jpg" alt="">
<div class="pop">全媒体运营师</div>
</li>
</ul>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/occ-i5.png" alt="" class="img5">
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
components: {
},
data() {
return {
module2: {
list: [
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb1.jpg', text: '数字化营销' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb2.jpg', text: '数字化运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb3.jpg', text: '智能投顾' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb4.jpg', text: '风险管理' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb5.jpg', text: '金融数据分析' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb6.jpg', text: '财务会计' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb7.jpg', text: '金融建模' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m2-mb8.jpg', text: '投资分析' }
]
},
module3: {
list: [
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb1.jpg', text: '数字化运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2.jpg', text: '广告策划' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb3.jpg', text: '媒体公共' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb4.jpg', text: '营销策划' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb5.jpg', text: '渠道管理' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb6.jpg', text: '品牌管理运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb7.jpg', text: '产品设计' }
],
list2: [
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-1.jpg', text: '互联网运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-2.jpg', text: '新媒体运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-3.jpg', text: '网站运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-4.jpg', text: '电商运营' },
{ image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/college-m3-mb2-5.jpg', text: '活动策划运营' }
]
},
tabList: [
{
name: '现代产业学院'
},
{
name: '数字金融'
},
{
name: '国际品牌管理<br />与新媒体运营'
}
],
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>
.occupation-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;
}
.occupation-content-mian{
width: 1200px;
.module-content-box{
background: #fff;
.banner{
width: 100%;
height: 320px;
display: block;
}
}
.module-1{
.content-mian{
padding: 60px 50px 65px;
.img1{
width: 100%;
display: block;
margin-bottom: 49px;
}
.img2{
width: 154px;
display: block;
}
.img3{
width: 100%;
display: block;
margin-top: 27px;
}
.img4{
width: 176px;
display: block;
margin-top: 27px;
}
.img5{
width: 342px;
display: block;
margin-top: 32px;
}
.cont-hover{
padding-top: 26px;
.top{
display: flex;
.li{
width: 723px;
height: 361px;
position: relative;
img{
width: 100%;
height: 100%;
display: block;
}
&:nth-child(2){
width: 360px;
}
.pop{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0);
color: #fff;
text-align: center;
line-height: 361px;
font-size: 26px;
&:hover{
background: rgba(0, 0, 0, 0.35);
}
}
}
}
.bottom{
display: flex;
.li{
width: 361px;
height: 361px;
position: relative;
&:nth-child(3){
width: 361px;
height: 361px;
background: #F9F8F8;
font-size: 26px;
font-weight: 500;
line-height: 361px;
text-align: center;
color: #777777;
}
img{
width: 100%;
height: 100%;
display: block;
}
.pop{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0);
color: #fff;
text-align: center;
line-height: 361px;
font-size: 26px;
&:hover{
background: rgba(0, 0, 0, 0.35);
}
}
}
}
}
ul{
display: flex;
padding-top: 14px;
li{
width: 270px;
height: 356px;
position: relative;
img{
width: 100%;
height: 100%;
display: block;
}
.pop{
width: 100%;
height: 100%;
color: #fff;
position: absolute;
top: 0;
left: 0;
text-align: center;
line-height: 356px;
font-size: 20px;
background: rgba(0, 0, 0, 0);
&:hover{
background: rgba(0, 0, 0, 0.39);
}
}
}
}
}
}
}
}
</style>
pages/services/major.vue
浏览文件 @ 911ed91b
<template>
<div class="major-content">
<tab :data="tabList"/>
<div class="mian-title">专业（群）建设</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.oss-cn-beijing.aliyuncs.com/www/pc/m1-banner.jpg" alt="" class="banner">
<div class="content-mian">
<div class="dec-txt">
依托紫荆教育技术与产业资源优势，协助院校应对行业变革、政策要求和办学新挑战，为院校提供产业化、国际化、数字化专业提升建设支持，优化人才培养方案，提升师资力量，共同开发精品课程资源，促进教学发展，整体提升专业建设水平，助力院校打造专业特色和优势。
</div>
<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 === 1">
<div class="module-2 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m2-banner.jpg" alt="" class="banner">
<div class="content-mian">
<img src="https://zws-imgs-pub.ezijing.com/static/public/8f73e25f5db8f97a992555c5a45b9dfe.png" alt="" class="img1">
<img src="https://zws-imgs-pub.ezijing.com/static/public/c3da614c7163af739b09e1029e2c6e77.png" alt="" class="img2">
<ul>
<li v-for="(item, index) in module2.list" :key="index">
<div class="block">0{{ index + 1 }}</div>
<div class="text">{{ item }}</div>
</li>
</ul>
<img src="https://webapp-pub.ezijing.com/www/pc/%E5%9F%BA%E5%9C%B0%E7%89%B9%E8%89%B2%402x%20(1).png" alt="" class="img3">
</div>
</div>
</template>
<template v-if="showModule === 2">
<div class="module-3 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m3-banner.jpg" alt="" class="banner">
<div class="content-mian">
<img src="https://webapp-pub.ezijing.com/www/pc/1.png" alt="" class="img1">
<img src="https://webapp-pub.ezijing.com/www/pc/2.png" alt="" class="img2">
<img src="https://webapp-pub.ezijing.com/www/pc/3.png" alt="" class="img3">
</div>
</div>
</template>
<template v-if="showModule === 3">
<div class="module-4 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m4-banner.jpg" alt="" class="banner">
<div class="content-mian">
<div class="txt1">紫荆教育以清北名师，业界专家为依托，结合专业方向的行业企业需求和课程改革方案，形成一整套专业链与产业链、课程内容与职业标准、教学与生产过程对接的综合改革项目课程教学资源。</div>
<div class="txt-con-box">
<div class="tit">课程录制团队及设施</div>
<div class="dec">
<div class="p">现有专职、兼职设计开发、课程编辑等专业人员50名，制作团队多从事于传媒行业转型互联网教育，拥有专业摄影棚（直播室、录播室、线上线下现场多媒体互动室）及专业摄影设备，可成为满足国内外各行业、各机构课程定制与开发的强有力保障。</div>
<div class="p">目前紫荆平台上已有超过300门课程，超过3000微课时的在线课程，注册学习人数超过3万名。</div>
</div>
</div>
<ul>
<li>
<div class="pop-box">
<div class="tit">线上课程研发</div>
<div class="ps">课程内容设置</div>
<div class="ps">课程师资匹配</div>
<div class="ps">课程制作方案</div>
</div>
<img src="https://webapp-pub.ezijing.com/www/pc/4.png" alt="">
</li>
<li>
<div class="pop-box">
<div class="tit">课程制作</div>
<div class="ps">课程录制&nbsp;&nbsp;&nbsp;&nbsp;课程剪辑</div>
<div class="ps">课程编辑&nbsp;&nbsp;&nbsp;&nbsp;课程成片</div>
<div class="tips">（课程录制，满足各种需求，不同形式拥有专属的场地）</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">线下课程开发</div>
<div class="ps">教学设计</div>
<div class="ps">教务计划</div>
<div class="ps">实施执行方案</div>
<div class="tips">（全国三大教学基地，10多间不同需求的教室与会议室）</div>
</div>
<img src="https://webapp-pub.ezijing.com/www/pc/6.png" alt="">
</li>
</ul>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/7.png" alt="" class="con-img">
</div>
</div>
</template>
<template v-if="showModule === 4">
<div class="module-5 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m5-banner.jpg" alt="" class="banner">
<div class="content-mian">
<div class="con-txt">
<div class="tit">背景理念</div>
<div class="dec">全面推进现代学徒制工作，深化“产教融合”、工学结合的育人机制，追求深度融合，协同创新，充分发挥企业和学校在产学融合中的作用，整合资源、共同培养高素质、高技能人才。</div>
</div>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/8.png" alt="" class="img1">
<div class="pro-tit">项目目标</div>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/9.png" alt="" class="img1">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/10.png" alt="" class="img1">
<ul>
<li>
<div class="num">01</div>
<div class="txt">学习与工作统一</div>
</li>
<li>
<div class="num">02</div>
<div class="txt">学生与员工统一</div>
</li>
<li>
<div class="num">03</div>
<div class="txt">教室与工厂统一</div>
</li>
<li>
<div class="num">04</div>
<div class="txt">作业与产品统一</div>
</li>
</ul>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m5-con.png" alt="" class="img1">
<div class="pro-tit">实施流程</div>
<div class="ul">
<div class="li">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/sslc1.png" alt="" class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/sslc1-1.png" alt="" class="icon-active">
<div class="tit">招募期</div>
<div class="p">宣讲报名选拔</div>
</div>
<div class="li">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/sslc2.png" alt="" class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/sslc1-2.png" alt="" class="icon-active">
<div class="tit">培训期</div>
<div class="p">职业素养<br />专业核心课程</div>
</div>
<div class="li">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/sslc3.png" alt="" class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/sslc1-3.png" alt="" class="icon-active">
<div class="tit">实施期</div>
<div class="p">项目实施过程<br />控制</div>
</div>
<div class="li">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/sslc4.png" alt="" class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/sslc1-4.png" alt="" class="icon-active">
<div class="tit">考核期</div>
<div class="p">项目质量考核<br />学生能力考核</div>
</div>
</div>
</div>
</div>
</template>
<template v-if="showModule === 5">
<div class="module-6 module-content-box">
<div class="new-txt">聚力师资培养，提升教育“软实力”</div>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m6-banner.jpg" alt="" class="banner">
<div class="content-mian">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/szpx-1.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.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.oss-cn-beijing.aliyuncs.com/www/pc/m7-banner.jpg" alt="" class="banner">
<div class="content-mian">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/cxcy-1.png" alt="">
<ul>
<li>
<div class="num">01</div>
<div class="p">学习创业基础</div>
<div class="p">激发创业意识和兴趣</div>
<div class="p">创新创业精神</div>
</li>
<li>
<div class="num">02</div>
<div class="p1">模拟创新创业实训和实践</div>
<div class="p1">掌握基本创业技能</div>
<div class="p1">培养创新创业思维</div>
</li>
<li>
<div class="num">03</div>
<div class="p">赛事分析</div>
<div class="p">项目孵化</div>
<div class="p">路演辅导</div>
<div class="p">模拟点评</div>
</li>
<li>
<div class="num">04</div>
<div class="p2">毕业实习</div>
<div class="p2">引产入校</div>
<div class="p2">创业运营</div>
<div class="p2">产业资源对接</div>
</li>
</ul>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/cxcy-2.png" alt="">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/cxcy-3.png" alt="" class="img-w726">
</div>
</div>
</template>
</div>
</div>
</div>
</template>
<script>
......@@ -11,6 +221,63 @@ export default {
},
data() {
return {
module1: {
list: [
{
title: '资源整合',
texts: ['技术及产业资源', '企业人才需求', '国家教育政策支持'],
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m1-zy1.jpg',
active: {
title: '资源整合',
text: '以国家教育政策为导向，聚焦技术及产业资源和企业岗位人才需求，促进产教融合、资源共享。构建高水平技术技能人才培养体系，打造技术技能创新服务平台，充分发挥集群效应，有机整合课程资源、教师资源与实训资源，实现资源整合和共享效益最大化，形成人才培养合力。'
}
},
{
title: '方案定制',
texts: ['专业顶层设计', '人才培养方案制定', '政策项目申报建设支持'],
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m1-zy2.jpg',
active: {
title: '方案定制',
text: '紫荆教育依托专业的调研团队、大庞的专家顾问团队、深厚的专业背景和丰富的专业建设经验，根据国家政策法规变化、产业及市场需求升级和人才培养模式变革，进行专业顶层设计、人才培养方案制定与优化、政府项目申报建设支持等。'
}
},
{
title: '条件保障',
texts: ['课程资源平台', '实训室建设', '数字化实训仿真模拟'],
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m1-zy3.jpg',
active: {
title: '条件保障',
text: '按照高标准化、国际化、开放式的实训实习原则，创新实习实训的运行机制，调整、优化实习实训平台及实验室的布局和结构，提高实习实训的管理和教学水平。借助现代化的新技术、新业态和新方式新建改建现有实训条件，加大信息技术和信息网络平台载体建设与智能化建设水平，创建数字化的下带服务教学工程，为专业建设提供有力保障。'
}
},
{
title: '建设内容',
texts: ['一流学科、一流专业建设', '双高建设', '师资培训', '课程与教材研发', '科研课题合作', '国际合作对接落地'],
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m1-zy4.jpg',
active: {
title: '建设内容',
text: '依托紫荆教育技术及产业整合优势，为学校优化人才培养方案，提升师资力量，共同开发精品课程资源，促进教学发展，整体提升学科建设水平，加强学生的专业水平和就业能力，推进相关领域学科专业建设，扩大人才培养规模。'
}
},
{
title: '建设成果',
texts: ['形成“特色专业（群）”或“品牌专业（群）”，准确定位，差异发展；', '专业（群）在区域范围乃至全国范围具备一定的影响力和辐射度；', '学生和用人企业无缝对接，实习就业有保障'],
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/m1-zy5.jpg',
active: {
title: '建设成果',
text: '打造战略性新兴学科专业（群），深化人才培养方案和课程体系改革，推动高校学科专业（群）结构的优化、人才培养模式的优化，在培养国家急需领域的创新应用型技术技能型人才的同时，实现产业、行业与专业的深度融合。'
}
}
]
},
module2: {
list: [
'课程教学需要的教学实训实习基地',
'专业教学需要的生产实训实习基地',
'引产入校实训实习基地',
'其他短期、分散的实训实习单位（点）'
]
},
tabList: [
{
name: '专业顶层设计'
......@@ -33,7 +300,20 @@ export default {
{
name: '专业+创新创业'
}
]
],
showModule: 0
}
},
methods: {
tabChangeIndex(n) {
this.showModule = n
}
},
computed: {
m1SetStyle() {
return (url) => {
return `background: url(${url});background-size: 100% 100%`
}
}
}
}
......@@ -42,6 +322,446 @@ export default {
.major-content{
width: 1200px;
margin: 0 auto;
display: flex;
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;
}
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 .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 .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: 20px;
line-height: 32px;
color: #424242;
margin-left: 15px;
}
}
}
}
}
.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: 503px;
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 .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: 20px;
color: #424242;
text-align: center;
}
&: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;
li{
width: 211px;
height: 275px;
background: #F9F8F8;
.num{
font-size: 40px;
font-weight: normal;
line-height: 100%;
color: #AA1941;
padding: 35px 0 42px 24px;
}
.p{
font-size: 18px;
line-height: 100%;
color: #424242;
margin-bottom: 17px;
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;
}
.p2{
margin: 0 auto;
width: 108px;
font-size: 18px;
line-height: 100%;
color: #424242;
margin-bottom: 17px;
text-align: left;
}
}
}
}
}
}
}
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论