提交 8fb0c4b7 authored 作者: 王鹏飞's avatar 王鹏飞

Merge branch 'new' into dev

......@@ -3,7 +3,7 @@
<div class="foot-box">
<div class="foot-content">
<div class="left-content">
<div>
<div class="link">
<a href="http://jsj.moe.gov.cn" target="_blank">
{{ $t('foot.link1') }}
</a>
......@@ -14,12 +14,12 @@
<!-- <div>
合作大学官网
</div> -->
</div>
<div :class="$cookies.get('lang') == 'en-US' ? 'center-content f-size' : 'center-content'">
<div class="address" v-html="$t('foot.address')"></div>
<div class="phone" v-html="$t('foot.contact')"></div>
<div class="mail" v-html="$t('foot.email')"></div>
</div>
</div>
<div class="right-content">
<img src="https://webapp-pub.ezijing.com/project/marywood/ezijing-code.jpg" class="code" />
<div class="tips-txt">
......@@ -140,8 +140,8 @@ export default {
// height: 300px;
display: flex;
.left-content {
max-width: 228px;
div {
flex: 1;
.link {
opacity: 0.7;
font-size: 18px;
font-weight: 300;
......@@ -152,23 +152,19 @@ export default {
}
}
.center-content {
margin-top: 30px;
font-size: 18px;
line-height: 32px;
color: #ffffff;
letter-spacing: 4px;
opacity: 0.7;
margin-left: 38px;
.address {
max-width: 612px;
}
&.f-size {
font-size: 16px;
}
}
.right-content {
margin-left: auto;
padding-top: 20px;
margin-left: 30px;
.code {
width: 120px;
display: block;
......
......@@ -10,7 +10,8 @@
? 'https://webapp-pub.ezijing.com/www/pc/en-logo.png'
: 'https://zws-imgs-pub.ezijing.com/static/public/0411340f9306b908eda54b5d66668f50.png'
"
@click="goPage('/')" />
@click="goPage('/')"
/>
</div>
<template v-if="$route.path === '/roadmap'">
<client-only>
......@@ -29,7 +30,11 @@
</client-only>
</template>
<div class="language">
<span @click="switchLocale('zh-CN')" :class="isEn === false ? 'cn' : ''">中文</span>/<span :class="isEn === true ? 'cn' : ''" @click="switchLocale('en-US')">EN</span>
<span @click="switchLocale('zh-CN')" :class="isEn === false ? 'cn' : ''">中文</span>/<span
:class="isEn === true ? 'cn' : ''"
@click="switchLocale('en-US')"
>EN</span
>
</div>
</div>
</div>
......@@ -38,36 +43,41 @@
<template v-for="(item, index) in navData" :key="index">
<li>
<div :class="getNameActive(item)">
<template v-if="!item.path">
<template v-if="item.click">
<span @click="showEnroll" v-html="item.name"></span>
</template>
<template v-else v-html="item.name"> </template>
</template>
<template v-else>
<nuxt-link :to="item.path"> <div v-html="item.name"></div></nuxt-link>
</template>
<AppLink :to="item.path">{{ item.name }}</AppLink>
</div>
<div class="child-item" v-if="item.childern">
<div class="child-item" v-if="item.children">
<div class="one-level">
<template v-for="(level2Item, level2Index) in item.childern" :key="level2Index + 'level2'">
<div
:class="$route.path === level2Item.path || level2Item.isShow ? 'li active' : 'li'"
@mouseenter="levelShow(level2Item)"
@mouseleave="levelShow(level2Item, 'out')">
<div @click="goPage(level2Item.path, level2Item.pathType)" class="name" :class="isEn === true ? 'name1' : ''" v-html="level2Item.name"></div>
<div class="el-icon-arrow-right" v-if="level2Item.childern"></div>
@mouseleave="levelShow(level2Item, 'out')"
>
<div
@click="goPage(level2Item.path, level2Item.pathType)"
class="name"
:class="isEn === true ? 'name1' : ''"
v-html="level2Item.name"
></div>
<div class="el-icon-arrow-right" v-if="level2Item.children"></div>
</div>
</template>
</div>
<template v-for="(level2Item, level2Index) in item.childern">
<div class="two-level" :key="level2Index + 'two-level2'" v-if="level2Item.isShow" @mouseenter="level3Show" @mouseleave="level3Show(level2Item, 'out')">
<template v-for="(level2Item, level2Index) in item.children">
<div
class="two-level"
:key="level2Index + 'two-level2'"
v-if="level2Item.isShow"
@mouseenter="level3Show"
@mouseleave="level3Show(level2Item, 'out')"
>
<div
@click="goPage(level3Item.path, level3Item.pathType)"
:class="isEn === true ? 'name1' : 'name'"
v-for="(level3Item, level3Index) in level2Item.childern"
:key="level3Index + level3Item">
v-for="(level3Item, level3Index) in level2Item.children"
:key="level3Index + level3Item"
>
{{ level3Item.name }}
</div>
</div>
......@@ -80,14 +90,17 @@
</div>
</template>
<script>
import AppLink from '@/components/Link'
export default {
components: { AppLink },
data() {
return {
navData: [
{
name: this.$t('menu.about'),
path: '/about/introduce',
childern: [
children: [
{
name: this.$t('menu.aboutChild.about'),
isShow: false,
......@@ -118,56 +131,80 @@ export default {
},
{
name: '产教融合',
path: '/digital',
childern: [
path: '/digital/yx_1',
children: [
{
name: '院校',
isShow: false,
childern: [
children: [
{
name: '数字技能实训中心',
name: '数字技能实训平台',
path: '/digital/yx_1'
},
{
name: '国际数字人才现代产业学院',
path: '/digital/yx_2'
name: '数字经济实验室'
// path: '/digital/yx_2'
},
{
name: '专业数字化改造提升',
name: '专业数字化改造提升',
path: '/digital/yx_3'
}
]
},
{
name: '政府',
path: '/digital/zf_1'
name: '数字经济新商科产业学院',
path: '/digital/yx_2'
},
{
name: '企业',
isShow: false,
childern: [
{
name: '全球数字领导力学者博士项目',
path: 'https://dld.ezijing.com',
pathType: 1
name: '未来技术产业学院',
path: '/digital/yx_5'
},
{
name: '数字时代领航人才EMBA项目',
path: 'https://marywood.ezijing.com',
name: '1+X金融产品数字化营销',
path: 'https://x.ezijing.com',
pathType: 1
}
]
},
{
name: '企业人才定制化服务',
path: 'digital/qy_1'
name: '政府',
isShow: false,
children: [
{
name: '数字技能公共实训基地',
path: '/digital/zf_1'
}
]
},
{
name: '职业技能大赛',
path: '/digital/ds'
}
// {
// name: '企业',
// isShow: false,
// children: [
// {
// name: '全球数字领导力学者博士项目',
// path: 'https://dld.ezijing.com',
// pathType: 1
// },
// {
// name: '数字时代领航人才EMBA项目',
// path: 'https://marywood.ezijing.com',
// pathType: 1
// },
// {
// name: '企业人才定制化服务',
// path: ''
// }
// ]
// }
]
},
// {
// name: this.$t('menu.base'),
// path: '/practice',
// childern: [
// children: [
// {
// name: this.$t('menu.baseChild.industry'),
// path: '/practice/industry',
......@@ -178,7 +215,7 @@ export default {
// path: '/practice/laboratory',
// isShow: false,
// isShowChild: false,
// childern: [
// children: [
// {
// name: '商业数据分析实验室',
// path: '/practice/laboratory/analysis'
......@@ -194,7 +231,7 @@ export default {
// path: '/practice/skill',
// isShow: false,
// isShowChild: false,
// childern: [
// children: [
// {
// name: '1+X金融产品数字化营销职业技能等级证书',
// path: 'https://x.ezijing.com/index',
......@@ -233,7 +270,7 @@ export default {
// {
// name: this.$t('menu.industrial'),
// path: '/services',
// childern: [
// children: [
// {
// name: this.$t('menu.industrialChild.saas'),
// path: 'https://e-saas.ezijing.com/',
......@@ -251,7 +288,7 @@ export default {
// isShow: false,
// isShowChild: false,
// childern: [
// children: [
// {
// name: this.$t('menu.industrialCollegeChild.data'),
// path: '/practice/laboratory/analysis'
......@@ -287,11 +324,11 @@ export default {
{
name: this.$t('menu.degree'),
path: '/internationalDegree',
childern: [
children: [
{
name: this.$t('menu.degreeChild.master'),
isShow: false,
childern: [
children: [
{
name: this.$t('menu.degreeChild.masterChild.msf'),
path: 'https://kelley.ezijing.com',
......@@ -317,7 +354,7 @@ export default {
{
name: 'EMBA',
isShow: false,
childern: [
children: [
{
name: '领航数字时代EMBA',
path: 'http://marywood.ezijing.com/',
......@@ -328,7 +365,7 @@ export default {
{
name: this.$t('menu.degreeChild.mba'),
isShow: false,
childern: [
children: [
{
name: this.$t('menu.degreeChild.mbaChild.mba'),
path: 'http://marywood.ezijing.com/',
......@@ -350,7 +387,7 @@ export default {
{
name: '工商管理博士DBA',
isShow: false,
childern: [
children: [
{
name: '全球科技创新管理学者项目',
path: 'https://cbu-online.ezijing.com/',
......@@ -361,7 +398,7 @@ export default {
{
name: '企业家学者DBA',
isShow: false,
childern: [
children: [
{
name: '数字领导力企业家学者(DBA)',
path: 'https://dld.ezijing.com/',
......@@ -374,11 +411,11 @@ export default {
{
name: this.$t('menu.abroad'),
path: '/studyAbroad',
childern: [
children: [
{
name: this.$t('menu.degreeChild.master'),
isShow: false,
childern: [
children: [
{
name: this.$t('menu.degreeChild.masterChild.sbu'),
path: 'https://sbu-plus.ezijing.com/',
......@@ -390,21 +427,26 @@ export default {
pathType: 1
},
{
name: '德保罗大学金融学硕士保研项目',
name: '北京理工大学1+1硕士留学-德保罗大学金融学硕士项目',
path: 'https://depaul-plus.ezijing.com/',
pathType: 1
},
{
name: '迈阿密大学硕士保研项目',
path: 'https://umiami-plus.ezijing.com/',
name: '雪城大学硕士保研项目',
path: 'https://syracuse-plus.ezijing.com/',
pathType: 1
}
// {
// name: '迈阿密大学硕士保研项目',
// path: 'https://umiami-plus.ezijing.com/',
// pathType: 1
// }
]
},
{
name: this.$t('menu.degreeChild.doctor'),
isShow: false,
childern: [
children: [
{
name: this.$t('menu.degreeChild.doctorChild.cbu_plus'),
path: 'https://cbu-plus.ezijing.com/',
......@@ -419,6 +461,26 @@ export default {
}
]
},
{
name: '职业认证',
children: [
{
name: '1+X金融产品数字化营销',
path: 'https://x.ezijing.com',
pathType: 1
},
{
name: '私人财富风险管理(PRP)课程',
path: 'https://prp.ezijing.com',
pathType: 1
},
{
name: '金融保险(FI)系列课程',
path: 'https://paa.ezijing.com',
pathType: 1
}
]
},
{
name: this.$t('menu.story'),
path: '/alumnus/story',
......@@ -434,9 +496,9 @@ export default {
this.$store.dispatch('checkLogin')
if (this.isEn) {
this.navData.map(item => {
item?.childern?.map(it => {
item?.children?.map(it => {
if (it.isShowChild === false) {
it.childern = ''
it.children = ''
}
return it
})
......@@ -470,7 +532,7 @@ export default {
}
},
levelShow(item, isOut) {
if (item.childern) {
if (item.children) {
if (isOut) {
clearTimeout(this.time)
this.time = setTimeout(() => {
......@@ -493,8 +555,8 @@ export default {
},
navLeave() {
this.navData.map(item => {
if (item.childern) {
item.childern.map(cItem => {
if (item.children) {
item.children.map(cItem => {
cItem.isShow = false
})
}
......@@ -518,8 +580,8 @@ export default {
return 'name active'
} else {
let className = 'name'
if (item.childern) {
item.childern.map(cData => {
if (item.children) {
item.children.map(cData => {
cData.path === currentPath && (className = 'name active')
})
}
......
......@@ -20,7 +20,7 @@ export default {
},
computed: {
href() {
return this.data.href || this.data.uri || (this.to.includes('http') ? this.to : '')
return this.data.href || this.data.uri || (typeof this.to === 'string' && this.to.includes('http') ? this.to : '')
},
path() {
if (typeof this.to === 'function') {
......
......@@ -47,10 +47,15 @@ export default {
href: 'https://depaul-plus.ezijing.com/'
},
{
img: 'https://webapp-pub.ezijing.com/www/pc/home/umiami.png',
desc: '迈阿密大学<br/>技术管理MSMT<br/>软件工程MSSE<br/>保研项目',
href: 'https://umiami-plus.ezijing.com/'
img: 'https://webapp-pub.ezijing.com/www/pc/home/xc-94.png',
desc: '雪城大学<br/>电气工程MSEE<br/>计算机科学MSCS<br/>计算机工程MSCE<br/>保研项目',
href: 'https://syracuse-plus.ezijing.com/'
}
// {
// img: 'https://webapp-pub.ezijing.com/www/pc/home/umiami.png',
// desc: '迈阿密大学<br/>技术管理MSMT<br/>软件工程MSSE<br/>保研项目',
// href: 'https://umiami-plus.ezijing.com/'
// }
]
},
{
......
<template>
<AppCard titleAlign="center">
<template #title>
<nuxt-link to="/digital">产教融合</nuxt-link>
<nuxt-link to="/digital/yx_1">产教融合</nuxt-link>
</template>
<div class="row">
<div class="col" v-for="item in list" :key="item.title">
<div class="title">
<h2>{{ item.title }}</h2>
<p>{{ item.desc }}</p>
</div>
<ul>
<li class="item" v-for="item in item.children" :key="item.title" :style="item.style">
<AppLink :to="item.path">
<div class="item-inner">
<img :src="item.icon" class="img" />
<img :src="item.hoverIcon" class="hover-img" />
{{ item.title }}
</div>
</AppLink>
</li>
</ul>
</div>
</div>
<div class="col2">
<ul>
<li class="item is-hover" v-for="item in list2" :key="item.title" :style="item.style">
<AppLink :to="item.path">
<div class="item-inner">
<img :src="item.icon" class="img" />
<img :src="item.hoverIcon" class="hover-img" />
{{ item.title }}
</div>
</AppLink>
</li>
</ul>
</div>
</AppCard>
</template>
......@@ -29,62 +47,108 @@ export default {
list: [
{
title: '院校',
desc: '数字人才核心能力培养解决方案',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_hover.png',
title: '数字技能实训中心',
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_4.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_4_hover.png',
title: '数字技能实训平台',
path: 'digital/yx_1'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_2.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_2_hover.png',
title: '国际数字人才现代产业学院',
path: 'digital/yx_2'
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_7.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_7_hover.png',
title: '数字经济实验室',
path: ''
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_3.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_3_hover.png',
title: '专业数字化改造提升',
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_3.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_3_hover.png',
title: '专业数字化改造提升',
path: 'digital/yx_3'
}
]
},
{
title: '政府',
children: [
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_1_hover.png',
title: '数字经济新商科产业学院',
path: 'digital/yx_2'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/zf_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/zf_1_hover.png',
title: '数字技能公共实训基地',
path: 'digital/zf_1',
style: { minHeight: '120px' }
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_6.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_6_hover.png',
title: '未来技术产业学院',
path: 'digital/yx_5'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_5.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_5_hover.png',
title: '1+X金融产品数字化营销',
path: 'https://x.ezijing.com'
}
]
},
{
title: '企业',
title: '政府',
desc: '数字技能公共实训基地',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_1_hover.png',
title: '全球数字领导力学者DBA',
path: 'https://dld.ezijing.com'
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/zf_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/zf_1_hover.png',
title: '1个数字展区',
path: 'digital/zf_1'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_2.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_2_hover.png',
title: '数字时代领航人才EMBA',
path: 'https://marywood.ezijing.com'
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/zf_2.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/zf_2_hover.png',
title: '3个技能实训区',
path: 'digital/zf_1'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_3.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_3_hover.png',
title: '企业人才定制化服务',
path: 'digital/qy_1'
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/zf_3.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/zf_3_hover.png',
title: '8个实训中心',
path: 'digital/zf_1'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/zf_4.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/zf_4_hover.png',
title: '5个运营中心',
path: 'digital/zf_1'
}
]
}
// {
// title: '企业',
// children: [
// {
// icon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_1.png',
// hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_1_hover.png',
// title: '全球数字领导力学者DBA',
// path: 'https://dld.ezijing.com'
// },
// {
// icon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_2.png',
// hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_2_hover.png',
// title: '数字时代领航人才EMBA',
// path: 'https://marywood.ezijing.com'
// },
// {
// icon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_3.png',
// hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/qy_3_hover.png',
// title: '企业人才定制化服务',
// path: ''
// }
// ]
// }
],
list2: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_2.png',
hoverIcon: 'https://webapp-pub.ezijing.com/www/pc/digital/icon/yx_2_hover.png',
title: '职业技能大赛',
path: 'digital/ds'
}
]
}
}
......@@ -94,41 +158,91 @@ export default {
<style lang="scss" scoped>
.row {
display: flex;
column-gap: 60px;
column-gap: 30px;
}
.col {
flex: 1;
display: flex;
flex-direction: column;
height: 440px;
background-color: #fff;
&:first-child {
flex: 0 0 694px;
}
.title {
padding: 25px 0;
text-align: center;
background-color: var(--main-color);
h2 {
padding: 48px 0 40px;
font-size: 24px;
font-size: 26px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
font-weight: 500;
color: #333333;
text-align: center;
color: #ffffff;
}
p {
margin-top: 12px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 1;
color: #ffffff;
}
}
ul {
margin-bottom: 40px;
flex: 1;
margin: 42px 30px;
display: flex;
flex-wrap: wrap;
gap: 20px;
}
li {
border: 1px solid #d5d5d5;
width: 198px;
height: 128px;
font-size: 16px;
color: #666;
.hover-img {
display: none;
}
&:hover {
.img {
display: none;
}
.hover-img {
display: inline;
}
color: #fff;
background-color: var(--main-color);
border-color: var(--main-color);
}
}
.item-inner {
height: 128px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
img {
margin-bottom: 14px;
}
li {
}
}
.col2 {
margin-top: 30px;
background-color: #fff;
border-top: 5px solid #aa1941;
ul {
padding: 12px 0;
display: flex;
align-items: center;
margin: 0 30px;
padding: 15px 0 15px 20px;
border: 1px solid #d5d5d5;
min-height: 80px;
font-size: 18px;
justify-content: center;
gap: 20px;
}
li {
width: 198px;
height: 60px;
font-size: 16px;
color: #666;
.hover-img {
display: none;
}
&.is-hover,
&:hover {
.img {
display: none;
......@@ -138,11 +252,13 @@ export default {
}
color: #fff;
background-color: var(--main-color);
border-color: var(--main-color);
}
}
li + li {
margin-top: 20px;
.item-inner {
height: 60px;
display: flex;
align-items: center;
justify-content: center;
}
}
</style>
<!-- 引产入校 -->
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/ds/banner1.png" />
<div class="cover">
<div class="cover-inner">
<div class="h1">
<h1>150</h1>
<div class="j"></div>
<span>高校咨询参赛</span>
</div>
<h6>2023年全国大学生商业数据分析与应用大赛</h6>
<div class="text-list">
<div class="text-list_item">
<div class="list_item_t">
<div class="num">195</div>
<div class="d"></div>
</div>
<div class="list_item_b">学校报名</div>
</div>
<div class="text-list_item">
<div class="list_item_t">
<div class="num">52</div>
<div class="d"></div>
</div>
<div class="list_item_b">指导教师</div>
</div>
<div class="text-list_item">
<div class="list_item_t">
<div class="num">41</div>
<div class="d"></div>
</div>
<div class="list_item_b">参赛队伍</div>
</div>
<div class="text-list_item">
<div class="list_item_t">
<div class="num">16</div>
<div class="d"></div>
</div>
<div class="list_item_b">省市</div>
</div>
</div>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<h2 class="section-title">赛项名称</h2>
<div class="sx-list">
<div class="sx-list_item" v-for="item in nameList">
<img :src="item.logo" class="logo" />
<div class="bg-box">
<img :src="item.bg" />
<div class="text" v-html="item.text"></div>
</div>
</div>
</div>
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">赛项简介</h2>
<div class="intr-top">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/sx-bg.png" />
<div class="intr-top_r">
<p>面向泛管理类和财经商贸类专业</p>
<p>商业数据分析和数字营销两大类行业赛事群。</p>
<p>
赛项设计遵循《2023年全国职业院校技能大赛制度汇编》的总体指导思想及原则。
赛项平台贯穿模拟多个真实的商业级工作平台,利用大数据、人工智能技术,采用行业真实数据和案例集。竞赛内容设计适应数字经济国家战略对人才培养的需求,覆盖数字+金融、贸易、电商、服务、零售等数十个行业。通过大赛促进大数据应用融入管理类、财经商贸等专业大类,推进专业实践教学水平,加快专业教师大数据应用水平,培养学生大数据应用与数字营销技能。
</p>
</div>
</div>
<div class="intr-list">
<div class="intr-l_item" v-for="item in schoolList">{{ item }}</div>
</div>
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">选手风采</h2>
<div class="xs-list">
<div class="xs-items">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/fc-1.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/fc-2.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/fc-3.png" />
</div>
<div class="xs-items">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/fc-4.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/fc-5.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/fc-6.png" />
</div>
</div>
</div>
</section>
<!-- <section class="section">
<div class="section-inner">
<h2 class="section-title">交付案例</h2>
<ul class="al-list">
<li v-for="item in jfalList" :key="item"><img :src="item" /></li>
</ul>
</div>
</section> -->
</div>
</template>
<script>
export default {
data() {
return {
nameList: [
{
logo: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/name-logo.png',
bg: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/name-bg1.png',
text: '第一届<br />全国大学生商业数据分析与应用大赛'
},
{
logo: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/name-logo.png',
bg: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/name-bg2.png',
text: '第二届<br />全国大学生商业数据分析与应用大赛'
},
{
logo: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/name-logo.png',
bg: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/ds/name-bg3.png',
text: '第一届<br />全国大学生数字营销技能大赛'
}
],
schoolList: [
'安阳师范学院',
'北京财贸职业学院',
'常州工业职业技术学院',
'桂林理工大学南宁分校',
'河南财经政法大学',
'吉林工商学院',
'吉林农业大学',
'江西工商职业技术学院',
'黎明职业大学',
'南宁职业技术学院',
'内蒙古警察职业学院',
'清远职业技术学院',
'沈阳工业大学',
'石家庄邮电职业技术学院',
'四川财经职业学院',
'四川职业技术学院',
'天津滨海汽车工程职业学院',
'长春大学',
'长春金融高等专科学校',
'重庆工商大学派斯学院'
]
}
}
}
</script>
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
.h1 {
display: flex;
align-items: center;
margin-bottom: 18px;
h1 {
font-size: 56px;
font-weight: bold;
color: #ffffff;
line-height: 100%;
}
span {
font-size: 22px;
margin-left: 10px;
}
.j {
font-size: 40px;
font-weight: bold;
}
}
h6 {
font-size: 28px;
line-height: 100%;
}
.text-list {
display: flex;
margin-top: 88px;
margin-left: -40px;
.text-list_item {
width: 198px;
text-align: center;
border-right: 1px solid #fff;
&:last-child {
border: none;
}
.list_item_t {
display: flex;
justify-content: center;
align-items: flex-end;
.num {
font-size: 56px;
font-weight: bold;
color: #ffffff;
line-height: 100%;
}
.d {
font-size: 20px;
color: #ffffff;
line-height: 35px;
margin-left: 5px;
}
}
}
.list_item_b {
font-size: 16px;
color: #ffffff;
margin-top: 8px;
}
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(odd) {
background-color: #f9f8f8;
}
.section:nth-child(even) {
background-color: #fff;
}
.section-inner {
width: 1200px;
margin: 0 auto;
padding: 100px 0;
}
.section-title {
margin-bottom: 36px;
font-size: 30px;
font-family: Source Han Sans CN;
font-weight: bold;
line-height: 32px;
color: #333333;
text-align: center;
}
.sx-list {
display: flex;
justify-content: space-between;
.sx-list_item {
width: 370px;
border: 1px solid #dbdbdb;
padding: 19px 25px 25px;
box-sizing: border-box;
cursor: pointer;
&:hover {
.bg-box {
img {
transform: scale(1.1);
}
}
}
.logo {
width: 145px;
display: block;
}
.bg-box {
margin-top: 18px;
position: relative;
overflow: hidden;
img {
width: 320px;
display: block;
transition: all 0.2s;
}
.text {
position: absolute;
top: 0;
left: 0;
text-align: center;
justify-content: center;
width: 100%;
height: 100%;
font-size: 18px;
color: #ffffff;
line-height: 30px;
display: flex;
align-items: center;
background: rgba(0, 0, 0, 0.4039);
}
}
}
}
.intr-top {
display: flex;
img {
width: 576px;
height: fit-content;
}
.intr-top_r {
margin-left: 44px;
p {
font-size: 16px;
color: #333333;
line-height: 36px;
margin-bottom: 20px;
position: relative;
text-align: justify;
&::before {
content: '';
position: absolute;
top: 15px;
left: -15px;
width: 6px;
height: 6px;
background: #aa1941;
border-radius: 50%;
}
}
}
}
.intr-list {
display: flex;
flex-wrap: wrap;
padding-top: 30px;
margin-right: -20px;
.intr-l_item {
background-color: #fff;
width: 224px;
background: #ffffff;
border-radius: 5px 5px 5px 5px;
font-size: 16px;
color: #333333;
line-height: 47px;
text-align: center;
margin-right: 20px;
margin-bottom: 20px;
}
}
.xs-list {
.xs-items {
display: flex;
justify-content: space-between;
margin-bottom: 30px;
img {
width: 380px;
}
}
}
</style>
......@@ -2,24 +2,35 @@
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/banner.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_1/banner.png" />
<div class="cover">
<div class="cover-inner">
<h2>数字技能实训平台</h2>
<span></span>
<h6>新商科 · 新工科 · 工业级 · 案例集</h6>
<p>
围绕区域经济特色,夯实数字化建设专业岗位基础通用能力,强化基于岗位能力证书的岗位技能实训,打造集院校数字人才培养、全民数字技能提升、企业数字化赋能和产业数字化服务为一体的综合人才服务体系和人才基地。
</p>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<h2 class="section-title">数字技能实训中心</h2>
<p class="section-desc">
围绕区域经济特色产业链,构建符合数字经济人才培养定位的数字技能实训中心,重构基于数字经济底层核心能力实训体系,夯实学校信息化、数字化建设下专业岗位基础通用能力,强化基于岗位能力证书的岗位技能实训,提升学生及区域数字人才培养可持续发展能力,旨在打造集院校数字人才培养、全民数字技能提升、企业数字化赋能和产业数字化服务为一体的综合人才服务体系和人才基地。
</p>
<h2 class="section-title" style="margin-top: 100px">新商科</h2>
<h2 class="section-title">新商科</h2>
<p class="section-desc">
深入调研数字经济产业人才需求,契合地方经济产业数字化转型需要,深入推进学校专业数字化改造,以商业数分析、数字营销为核心技能贯穿商科底层逻辑,聚焦专业数字化改造与升级,切实培养地方经济真正需要的数字经济人才。
</p>
<div class="gk-list">
<div class="gk-item is-border" v-for="item in skList" :key="item.title">
<div class="gk-item__pic"><img :src="item.icon" /></div>
<div class="gk-item__content">
<div class="gk-item active is-border" v-for="item in skList" :key="item.title">
<div class="gk-item__pic p_icon">
<img :src="item.icon" />
</div>
<div class="gk-item__pic a_icon">
<img :src="item.iconActive" />
</div>
<div class="gk-item__content a_color">
<h2>{{ item.title }}</h2>
<p>{{ item.desc }}</p>
<p v-html="item.desc"></p>
<a :href="item.more" v-if="item.more">查看更多</a>
</div>
</div>
......@@ -29,13 +40,21 @@
<section class="section">
<div class="section-inner">
<h2 class="section-title">新工科</h2>
<p class="section-desc">基于国家信创发展大趋势,建设完全国产自主知识产权的先进信创人才实训区,从“特色软件人才培养”和“国产化信息系统运维”两个路径为国产化替换填补人才。</p>
<p class="section-desc">
基于国家信创发展大趋势,建设完全国产自主知识产权的先进信创人才实训区,从“特色软件人才培养”和“国产化信息系统运维”两个路径为国产化替换填补人才。
</p>
<div class="gk-list">
<div class="gk-item" v-for="item in gkList" :key="item.title">
<div class="gk-item__pic"><img :src="item.icon" /></div>
<div class="gk-item__content">
<div class="gk-item active" v-for="item in gkList" :key="item.title">
<div class="gk-item__pic p_icon" style="padding: 40px 0 30px;">
<img :src="item.icon" />
</div>
<div class="gk-item__pic a_icon" style="padding: 40px 0 30px;">
<img :src="item.iconActive" />
</div>
<!-- <div class="gk-item__pic" style="padding: 40px 0 30px;"><img :src="item.icon" /></div> -->
<div class="gk-item__content a_color">
<h2>{{ item.title }}</h2>
<p>{{ item.desc }}</p>
<p style="margin: 8px 0;" v-html="item.desc"></p>
<a :href="item.more" v-if="item.more">查看更多</a>
</div>
</div>
......@@ -60,49 +79,57 @@ export default {
skList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xsk_1.png',
title: '商业数据分析实践教学平台',
desc: '培养数字经济底层数据思维能力的工业级实践教学平台',
iconActive: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xsk_1a.png',
title: '商业数据分析实训平台',
desc: '培养数字经济底层思维能力的<br />工业级实训平台',
more: '/digital/yx_1_1'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xsk_2.png',
title: '数字营销实践教学平台',
desc: '培养企业数字化转型核心技能的工业级实践教学平台',
iconActive: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xsk_2a.png',
title: '数字营销实训平台',
desc: '培养企业数字化转型核心技能的<br />工业级实训平台',
more: '/digital/yx_1_2'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xsk_3.png',
iconActive: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xsk_3a.png',
title: '商业数据分析与应用大赛平台',
desc: '配套“商业数据分析与应用大赛”训练平台'
desc: '配套“商业数据分析与应用大赛”<br />训练平台'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xsk_4.png',
iconActive: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xsk_4a.png',
title: '金融产品数字化营销实训平台',
desc: '配套“金融产品数字化营销1+X证书”训练平台'
desc: '配套“金融产品数字化营销1+X证书”<br />训练平台'
}
],
gkList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xgk_1.png',
title: '大数据实践教学平台',
desc: '综合培养大数据基础知识及专业知识的一站式实践教学平台',
iconActive: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xgk_1a.png',
title: '大数据实训平台',
desc: '综合培养大数据<br />基础知识及专业知识的<br />一站式实训平台',
more: '/digital/yx_1_3'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xgk_2.png',
title: '人工智能实践教学平台',
desc: '重在人工智能基础知识及应用的一站式实践教学平台',
iconActive: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xgk_2a.png',
title: '人工智能实训平台',
desc: '重在人工智能<br />基础知识及应用的<br />一站式实训平台',
more: '/digital/yx_1_4'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xgk_3.png',
title: '信息安全实践教学平台',
desc: '一站式信创信息安全实践教学平台'
iconActive: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xgk_3a.png',
title: '信息安全实训平台',
desc: '一站式信创信息安全<br />实训平台'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xgk_4.png',
title: '物联网实践教学平台',
desc: '全面涵盖5G及边缘计算的新一代物联网实践教学平台'
iconActive: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1/xgk_4a.png',
title: '物联网实训平台',
desc: '全面涵盖5G及边缘计算的<br />新一代物联网<br />实训平台'
}
]
}
......@@ -113,9 +140,74 @@ export default {
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #fff;
......@@ -138,12 +230,11 @@ export default {
text-align: center;
}
.section-desc {
font-size: 18px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #666666;
text-align: center;
}
.section-pic {
text-align: center;
......@@ -167,15 +258,44 @@ export default {
transition: all 0.3s;
&:hover {
transform: scale(1.06);
&.active {
transform: scale(1);
background-color: #aa1941;
.p_icon {
display: none;
}
.a_icon {
display: block;
}
.a_color {
h2,
p,
a {
color: #fff;
}
}
}
}
.p_icon {
display: block;
}
.a_icon {
display: none;
}
}
.gk-item__pic {
padding: 46px 0 36px;
// .p_icon{
// display: block;
// }
// .a_icon{
// display: none;
// }
}
.gk-item__content {
padding: 0 12px;
h2 {
font-size: 18px;
font-size: 19px;
font-family: Source Han Sans CN;
font-weight: 500;
line-height: 24px;
......@@ -183,7 +303,7 @@ export default {
}
p {
margin: 12px 0;
font-size: 16px;
font-size: 14px;
color: #666;
}
a {
......
......@@ -2,25 +2,29 @@
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/banner.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/banner.png" />
<div class="cover">
<div class="cover-inner">
<h2>商业数据分析实践教学平台</h2>
<span></span>
<h6>真场景 · 真环境 · 真项目 · 真案例</h6>
<p>
实现“贯通”专业集群底层逻辑,融合商业数据分析服务能力,实现工作实践和教学场景的一体化无缝衔接,融合海量结构化数据集,多行业综合案例集,打造全国影响力的的数字经济核心能力实践教学平台。
</p>
<a href="https://saas-lab.ezijing.com" target="_blank">进入系统</a>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<h2 class="section-title">商业数据分析实践教学平台</h2>
<p class="section-desc">
数据分析、数字运营、数字营销是数字化人才的核心必备能力。在“数字化核心能力专业建设”和“数字+全行业专业建设”中,数据分析能力是数字化人才培养的核心基础能力!<br /><br />
2018年以来,清控紫荆教育通过调研600+数字化及数字化转型企业,举办100+场次以行企专家、高校学科带头人、学者为主的研讨会,分析近三年超过180万+数字经济从业岗位需求,对比分析200+数字经济相关专业人才培养方案,梳理出商业数据分析通用能力模型。
</p>
<h2 class="section-title" style="margin-top: 100px">核心模块</h2>
<h2 class="section-title">核心模块</h2>
<div class="mk-list">
<div class="mk-item" v-for="item in mkList" :key="item.title">
<div class="box">
<img :src="item.icon" />
<p>{{ item.title }}</p>
</div>
<h4>
<span>{{ item.subTitle }}</span>
</h4>
<ul>
<li v-for="item in item.children" :key="item.title">
<img :src="item.icon" />
......@@ -34,6 +38,7 @@
<section class="section">
<div class="section-inner">
<h2 class="section-title">商业数据分析实践教学平台案例资源介绍</h2>
<p class="section-info">以真实的行业案例为原型,辅之以大量的真实行业数据,按照国家级教材研发标准为参考开发的综合性企业真实场景的实战教学案例</p>
<div class="zy">
<table class="table">
<thead>
......@@ -43,25 +48,38 @@
</tr>
</thead>
<tbody>
<tr v-for="item in zyList" :key="item">
<tr v-for="item in zyList" :key="item.title">
<td>{{ item.title }}</td>
<td>{{ item.industry }}</td>
</tr>
</tbody>
</table>
<ul class="num">
<p>每个案例支撑16个学时实践教学</p>
<li v-for="item in numList" :key="item.desc">
<span>{{ item.num }}</span>
<em>{{ item.desc }}</em>
</li>
</ul>
</div>
<h3 class="section-subtitle">案例资源示例</h3>
<div class="tab">
<ul class="tab-header">
<li v-for="(item, index) in tabList" :class="{ 'is-active': index === tabActive }" :key="index" @mouseover="tabActive = index">{{ item.title }}</li>
</ul>
<ul class="tab-body" v-for="(item, index) in tabList" :key="index" v-if="index === tabActive">
<li v-for="item in item.children" :key="item"><img :src="item" /></li>
</ul>
</div>
<h2 class="section-title">产品配套服务</h2>
<h3 class="section-subtitle">标准服务</h3>
<ul class="bz-list">
<li v-for="item in bzfwList" :key="item.title">
<img :src="item.icon" />
<p>{{ item.title }}</p>
<div class="cover">
<h4>{{ item.title }}</h4>
<p v-html="item.desc"></p>
</div>
</li>
</ul>
<h3 class="section-subtitle">增值服务</h3>
......@@ -89,86 +107,67 @@ export default {
mkList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1.png',
title: '商业数据分析综合实践平台',
subTitle: '商业数据分析综合实践优势',
title: '综合实践教学平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_1.png',
title: '真实连接企业95%以上的数据源'
title: '来自于企业的真实商业数据分析产品'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_2.png',
title: '业务人员级别的可视化数据治理能力'
title: '实现学校训练和企业实操的无缝衔接'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_3.png',
title: '面向非技术人员的零代码人工智能应用'
title: '强大的企业级数据分析功能'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_4.png',
title: '企业真实的强大数据可视化组件'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_5.png',
title: '稳定且安全的后台管理能力'
title: '面向非技术人员的商业数据分析能力训练'
}
]
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2.png',
title: '商业数据分析教学管理平台',
subTitle: '商业数据分析教学管理优势',
title: '教学管理平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_1.png',
title: '全面管理理论与实践教学资源'
title: '一站式理论+实践学习平台'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_2.png',
title: '资源使用情况实时可见'
title: '结合配套教学资源实现开箱即用'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_3.png',
title: '“院校-学院-个人”三级课程管理'
title: '工业级产品与教学管理的完美适配'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_4.png',
title: '丰富且灵活的基础信息管理'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_5.png',
title: '丰富的教学业务支撑能力'
title: '全面支撑课程评价和专业建设数据要求'
}
]
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3.png',
title: '商业数据分析实验管理平台',
subTitle: '商业数据分析实验管理优势',
title: '实验管理平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_1.png',
title: '支持教学、大赛等多场景、多角色'
title: '灵活的实验配置实现丰富教学场景支撑'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_2.png',
title: '独立的操作指导书管理能力'
title: '实验成绩多维构成及综合评分制'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_3.png',
title: '独立的操作视频管理能力'
title: '实验报告在线灵活填写及自动评分'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_4.png',
title: '强大的过程数据记录和师生交互'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_5.png',
title: '灵活的实验配置'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_6.png',
title: '实验成绩多维度定义及实验报告在线填写'
title: '与大赛平台无缝衔接'
}
]
}
......@@ -194,23 +193,54 @@ export default {
{ num: 65, desc: '套教学PPT' },
{ num: 231, desc: '个教学视频。' }
],
tabActive: 0,
tabList: [
{
title: '案例原文',
children: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_1_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_1_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_1_3.png'
]
},
{
title: '案例指导书',
children: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_2_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_2_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_2_3.png'
]
},
{
title: '教学PPT',
children: ['https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_3_1.png', 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_3_2.png']
},
{
title: '操作视频',
children: ['https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_4_1.png', 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/alzy_4_2.png']
}
],
// 标准服务
bzfwList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_1.png',
title: '产品服务'
title: '产品服务',
desc: '产品安装服务<br/>产品配置调试服务<br/>产品免费升级服务<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_2.png',
title: '资源服务'
title: '资源服务',
desc: '配套课程资源<br/>课程资源免费更新服务<br/>行业案例免费升级服务<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_3.png',
title: '培训服务'
title: '培训服务',
desc: '产品使用培训<br/>产品维护培训<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_4.png',
title: '产品技术支持'
title: '产品技术支持',
desc: '产品功能与性能巡检<br/>产品使用分析与建议<br/>产品在线技术支持<br/>产品电话技术支持<br/>……'
}
],
// 增值服务
......@@ -231,9 +261,74 @@ export default {
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #fff;
......@@ -264,12 +359,22 @@ export default {
border-bottom: 1px solid var(--main-color);
}
.section-desc {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #666666;
}
.section-info {
margin: 40px 0 70px;
font-size: 18px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #666666;
text-align: center;
}
.section-pic {
text-align: center;
img {
......@@ -297,28 +402,13 @@ export default {
color: #ffffff;
}
}
h4 {
margin: 80px 0 36px;
text-align: center;
span {
display: inline-block;
font-size: 20px;
font-family: Source Han Sans CN-Normal, Source Han Sans CN;
font-weight: 400;
color: #424242;
line-height: 34px;
border-bottom: 1px solid var(--main-color);
}
}
ul {
height: 440px;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-top: 40px;
}
li {
margin-top: 25px;
img {
margin: 0 20px;
margin: 0 18px;
}
display: flex;
align-items: center;
......@@ -341,12 +431,16 @@ export default {
transform: scale(1.06);
}
}
p {
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(51, 51, 51, 0.6);
}
h4 {
padding: 64px 0 45px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
......@@ -354,7 +448,14 @@ export default {
display: flex;
align-items: center;
justify-content: center;
background: rgba(51, 51, 51, 0.6);
}
p {
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 40px;
text-align: center;
}
}
.zz-list {
......@@ -385,17 +486,25 @@ export default {
}
.zy {
display: flex;
margin-bottom: 100px;
.table {
flex: 1;
}
.num {
margin-left: 60px;
margin-left: 35px;
}
}
.num {
display: flex;
flex-direction: column;
justify-content: space-between;
p {
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
line-height: 30px;
}
li {
line-height: 70px;
span {
font-size: 30px;
font-weight: bold;
......@@ -442,4 +551,39 @@ export default {
}
}
}
.tab {
display: flex;
margin-bottom: 70px;
}
.tab-header {
margin-right: 38px;
li {
width: 270px;
height: 70px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 70px;
color: #333333;
background: #fff;
text-align: center;
border: 1px solid #d5d5d5;
cursor: pointer;
&.is-active {
color: #fff;
background-color: var(--main-color);
border: 1px solid var(--main-color);
}
& + li {
margin-top: 22px;
}
}
}
.tab-body {
flex: 1;
display: flex;
align-items: center;
justify-content: space-evenly;
background-color: var(--main-color);
}
</style>
......@@ -2,24 +2,28 @@
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/banner.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/banner.png" />
<div class="cover">
<div class="cover-inner">
<h2>数字营销实践教学平台</h2>
<span></span>
<h6>真连接 · 真触达 · 真营销 · 真案例</h6>
<p>
面向企业数字化转型核心基础能力培养,在成熟工业级数字营销系统基础上进行教育适配化改造,提供多个行业综合案例集及配套理论教学资源,打造高校学生数字化营销思维通识能力的一站式实践教学平台。
</p>
<a href="https://saas-dml-web.ezijing.com" target="_blank">进入系统</a>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<h2 class="section-title">数字营销实践教学平台</h2>
<p class="section-desc">
数字营销能力是数字经济10大核心能力之一<br />数字营销能力是数字经济时代下的十大核心能力之一<br />数字营销能力是数字经济时代下任何行业,任何企业,任何岗位都应当具备的底层核心能力
</p>
<h2 class="section-title" style="margin-top: 100px">核心模块</h2>
<h2 class="section-title">核心模块</h2>
<div class="mk-list">
<div class="mk-item" v-for="item in mkList" :key="item.title">
<div class="box">
<img :src="item.icon" />
<p>{{ item.title }}</p>
</div>
<h4>
<span>{{ item.subTitle }}</span>
</h4>
<ul>
<li v-for="item in item.children" :key="item.title">
<img :src="item.icon" />
......@@ -32,7 +36,8 @@
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">数字营销分析实践教学平台案例资源介绍</h2>
<h2 class="section-title">数字营销实践教学平台案例资源介绍</h2>
<p class="section-info">以真实的行业案例为原型,辅之以大量的真实行业数据,按照国家级教材研发标准为参考开发的综合性企业真实场景的实战教学案例</p>
<div class="zy">
<table class="table">
<thead>
......@@ -42,25 +47,38 @@
</tr>
</thead>
<tbody>
<tr v-for="item in zyList" :key="item">
<tr v-for="item in zyList" :key="item.title">
<td>{{ item.title }}</td>
<td>{{ item.industry }}</td>
</tr>
</tbody>
</table>
<ul class="num">
<p>每个案例支撑16个学时实践教学</p>
<li v-for="item in numList" :key="item.desc">
<span>{{ item.num }}</span>
<em>{{ item.desc }}</em>
</li>
</ul>
</div>
<h3 class="section-subtitle">案例资源示例</h3>
<div class="tab">
<ul class="tab-header">
<li v-for="(item, index) in tabList" :class="{ 'is-active': index === tabActive }" :key="index" @mouseover="tabActive = index">{{ item.title }}</li>
</ul>
<ul class="tab-body" v-for="(item, index) in tabList" :key="index" v-if="index === tabActive">
<li v-for="item in item.children" :key="item"><img :src="item" /></li>
</ul>
</div>
<h2 class="section-title">产品配套服务</h2>
<h3 class="section-subtitle">标准服务</h3>
<ul class="bz-list">
<li v-for="item in bzfwList" :key="item.title">
<img :src="item.icon" />
<p>{{ item.title }}</p>
<div class="cover">
<h4>{{ item.title }}</h4>
<p v-html="item.desc"></p>
</div>
</li>
</ul>
<h3 class="section-subtitle">增值服务</h3>
......@@ -88,140 +106,149 @@ export default {
mkList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1.png',
title: '数字营销分析综合实践平台',
subTitle: '数字营销分析综合实践优势',
title: '综合实践教学平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_1.png',
title: '真实连接企业95%以上的数据源'
title: '来自于企业的真实数字营销产品'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_2.png',
title: '业务人员级别的可视化数据治理能力'
title: '真实的用户触达与营销分析能力'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_3.png',
title: '面向非技术人员的零代码人工智能应用'
title: '实现学校训练和企业实操的无缝衔接'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_4.png',
title: '企业真实的强大数据可视化组件'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_5.png',
title: '稳定且安全的后台管理能力'
title: '强大的一站式自动化营销能力'
}
]
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2.png',
title: '数字营销分析教学管理平台',
subTitle: '数字营销分析教学管理优势',
title: '教学管理平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_1.png',
title: '全面管理理论与实践教学资源'
title: '一站式理论+实践学习平台'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_2.png',
title: '资源使用情况实时可见'
title: '结合配套教学资源实现开箱即用'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_3.png',
title: '“院校-学院-个人”三级课程管理'
title: '工业级产品与教学管理的完美适配'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_4.png',
title: '丰富且灵活的基础信息管理'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_5.png',
title: '丰富的教学业务支撑能力'
title: '全面支撑课程评价和专业建设数据要求'
}
]
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3.png',
title: '数字营销分析实验管理平台',
subTitle: '数字营销分析实验管理优势',
title: '实验管理平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_1.png',
title: '支持教学、大赛等多场景、多角色'
title: '灵活的实验配置实现丰富教学场景支撑'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_2.png',
title: '独立的操作指导书管理能力'
title: '实验成绩多维构成及综合评分制'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_3.png',
title: '独立的操作视频管理能力'
title: '实验报告在线灵活填写及自动评分'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_4.png',
title: '强大的过程数据记录和师生交互'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_5.png',
title: '灵活的实验配置'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_6.png',
title: '实验成绩多维度定义及实验报告在线填写'
title: '与大赛平台无缝衔接'
}
]
}
],
zyList: [
{ title: '案例1:电子商城数据分析', industry: '电商' },
{ title: '案例2:房屋价格的数据分析', industry: '房地产' },
{ title: '案例3:汽车金融企业业务分析', industry: '汽车服务' },
{ title: '案例4:互联网零售数据分析', industry: '互联网' },
{ title: '案例5:微博热门博主与话题模型分析', industry: '互联网' },
{ title: '案例6:商业银行专项财务指标分析', industry: '金融' },
{ title: '案例7:信用卡欺诈行为分析', industry: '金融' },
{ title: '案例8:金融量化投资分析', industry: '金融' },
{ title: '案例9:基于RFM模型进行用户分群运营分析', industry: '零售' },
{ title: '案例10:智慧交通综合分析', industry: '交通' }
{ title: '案例1:美联英语营销案例', industry: '教育' },
{ title: '案例2:叫叫阅读营销案例', industry: '教育' },
{ title: '案例3:海通证券精准营销案例', industry: '金融' },
{ title: '案例4:广发银行信用卡营销案例', industry: '金融' },
{ title: '案例5:全棉时代营销案例', industry: '零售' },
{ title: '案例6:Olay玉兰油营销案例', industry: '日化' },
{ title: '案例7:一汽丰田分渠道营销案例', industry: '汽车' },
{ title: '案例8:RIO微醺系列营销案例', industry: '零售' },
{ title: '案例9:某股份制银行投资理财产品营销案例', industry: '金融' },
{ title: '案例10:百草味夜伴小卤鸭脖抖音营销', industry: '零售' }
],
numList: [
{ num: 10, desc: '个案例' },
{ num: 10, desc: '篇案例原文' },
{ num: 13, desc: '个数据集' },
{ num: 31, desc: '份辅助资源' },
{ num: 65, desc: '份案例指导书' },
{ num: 65, desc: '套教学PPT' },
{ num: 231, desc: '个教学视频。' }
{ num: 34, desc: '个数据集' },
{ num: 54, desc: '份案例指导书' },
{ num: 54, desc: '套教学PPT' },
{ num: 158, desc: '个教学视频。' }
],
tabActive: 0,
tabList: [
{
title: '案例原文',
children: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_1_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_1_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_1_3.png'
]
},
{
title: '案例指导书',
children: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_2_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_2_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_2_3.png'
]
},
{
title: '教学PPT',
children: ['https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_3_1.png', 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_3_2.png']
},
{
title: '操作视频',
children: ['https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_4_1.png', 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/alzy_4_2.png']
}
],
// 标准服务
bzfwList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_1.png',
title: '产品服务'
title: '产品服务',
desc: '产品安装服务<br/>产品配置调试服务<br/>产品免费升级服务<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_2.png',
title: '资源服务'
title: '资源服务',
desc: '配套课程资源<br/>课程资源免费更新服务<br/>行业案例免费升级服务<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_3.png',
title: '培训服务'
title: '培训服务',
desc: '产品使用培训<br/>产品维护培训<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_4.png',
title: '产品技术支持'
title: '产品技术支持',
desc: '产品功能与性能巡检<br/>产品使用分析与建议<br/>产品在线技术支持<br/>产品电话技术支持<br/>……'
}
],
// 增值服务
zzfwList: ['顶层设计服务', '师资培训服务', '行业讲座服务', '科研服务', '教学服务'],
// 交付案例
jfalList: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_3.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_4.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_5.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_6.png'
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/jfal_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/jfal_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/jfal_3.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_2/jfal_4.png'
]
}
}
......@@ -230,9 +257,74 @@ export default {
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #fff;
......@@ -263,6 +355,14 @@ export default {
border-bottom: 1px solid var(--main-color);
}
.section-desc {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #666666;
}
.section-info {
margin: 40px 0 70px;
font-size: 18px;
font-family: Source Han Sans CN;
font-weight: 400;
......@@ -270,6 +370,7 @@ export default {
color: #666666;
text-align: center;
}
.section-pic {
text-align: center;
img {
......@@ -297,28 +398,13 @@ export default {
color: #ffffff;
}
}
h4 {
margin: 80px 0 36px;
text-align: center;
span {
display: inline-block;
font-size: 20px;
font-family: Source Han Sans CN-Normal, Source Han Sans CN;
font-weight: 400;
color: #424242;
line-height: 34px;
border-bottom: 1px solid var(--main-color);
}
}
ul {
height: 440px;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-top: 40px;
}
li {
margin-top: 25px;
img {
margin: 0 20px;
margin: 0 18px;
}
display: flex;
align-items: center;
......@@ -341,12 +427,16 @@ export default {
transform: scale(1.06);
}
}
p {
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(51, 51, 51, 0.6);
}
h4 {
padding: 64px 0 45px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
......@@ -354,7 +444,14 @@ export default {
display: flex;
align-items: center;
justify-content: center;
background: rgba(51, 51, 51, 0.6);
}
p {
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 40px;
text-align: center;
}
}
.zz-list {
......@@ -374,7 +471,7 @@ export default {
}
.al-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(2, 1fr);
gap: 30px;
li {
transition: all 0.3s;
......@@ -385,17 +482,25 @@ export default {
}
.zy {
display: flex;
margin-bottom: 100px;
.table {
flex: 1;
}
.num {
margin-left: 60px;
margin-left: 35px;
}
}
.num {
display: flex;
flex-direction: column;
justify-content: space-between;
p {
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
line-height: 30px;
}
li {
line-height: 70px;
span {
font-size: 30px;
font-weight: bold;
......@@ -442,4 +547,39 @@ export default {
}
}
}
.tab {
display: flex;
margin-bottom: 70px;
}
.tab-header {
margin-right: 38px;
li {
width: 270px;
height: 70px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 70px;
color: #333333;
background: #fff;
text-align: center;
border: 1px solid #d5d5d5;
cursor: pointer;
&.is-active {
color: #fff;
background-color: var(--main-color);
border: 1px solid var(--main-color);
}
& + li {
margin-top: 22px;
}
}
}
.tab-body {
flex: 1;
display: flex;
align-items: center;
justify-content: space-evenly;
background-color: var(--main-color);
}
</style>
......@@ -2,24 +2,27 @@
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/banner.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/banner.png" />
<div class="cover">
<div class="cover-inner">
<h2>大数据实践教学平台</h2>
<span></span>
<h6>开箱即用 · 内置课程 · 丰富案例 · 灵活教学</h6>
<p>
既能满足工科大数据通识能力的训练需求,又能满足商科等其他学科对于大数据基础实践教学的训练需求。提供竞赛等模块,满足高校对于大数据教学的多层次需求。打造高校学生大数据通识能力的一站式实践教学平台。
</p>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<h2 class="section-title">大数据实践教学平台</h2>
<p class="section-desc">
数据是数字经济时代的核心生产要素,围绕数字产业化和产业数字化的各个领域,在数据采集、传输、计算、分析、保护等方面的技术突破为数字经济的发展奠定基础,是数字经济时代的核心战略资源。大数据实验室一共包括大数据综合实训平台、完整闭环的教学管理能力、灵活智能的实验管理能力。
</p>
<h2 class="section-title" style="margin-top: 100px">核心模块</h2>
<h2 class="section-title">核心模块</h2>
<div class="mk-list">
<div class="mk-item" v-for="item in mkList" :key="item.title">
<div class="box">
<img :src="item.icon" />
<p>{{ item.title }}</p>
</div>
<h4>
<span>{{ item.subTitle }}</span>
</h4>
<ul>
<li v-for="item in item.children" :key="item.title">
<img :src="item.icon" />
......@@ -32,7 +35,8 @@
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">大数据分析实践教学平台案例资源介绍</h2>
<h2 class="section-title">大数据实践教学平台案例资源介绍</h2>
<p class="section-info">以真实的行业案例为原型,辅之以大量的真实行业数据,按照国家级教材研发标准为参考开发的综合性企业真实场景的实战教学案例</p>
<div class="zy">
<table class="table">
<thead>
......@@ -42,25 +46,38 @@
</tr>
</thead>
<tbody>
<tr v-for="item in zyList" :key="item">
<tr v-for="item in zyList" :key="item.title">
<td>{{ item.title }}</td>
<td>{{ item.industry }}</td>
</tr>
</tbody>
</table>
<ul class="num">
<p>每个案例支撑16个学时实践教学</p>
<li v-for="item in numList" :key="item.desc">
<span>{{ item.num }}</span>
<em>{{ item.desc }}</em>
</li>
</ul>
</div>
<h3 class="section-subtitle">案例资源示例</h3>
<div class="tab">
<ul class="tab-header">
<li v-for="(item, index) in tabList" :class="{ 'is-active': index === tabActive }" :key="index" @mouseover="tabActive = index">{{ item.title }}</li>
</ul>
<ul class="tab-body" v-for="(item, index) in tabList" :key="index" v-if="index === tabActive">
<li v-for="item in item.children" :key="item"><img :src="item" /></li>
</ul>
</div>
<h2 class="section-title">产品配套服务</h2>
<h3 class="section-subtitle">标准服务</h3>
<ul class="bz-list">
<li v-for="item in bzfwList" :key="item.title">
<img :src="item.icon" />
<p>{{ item.title }}</p>
<div class="cover">
<h4>{{ item.title }}</h4>
<p v-html="item.desc"></p>
</div>
</li>
</ul>
<h3 class="section-subtitle">增值服务</h3>
......@@ -69,14 +86,6 @@
</ul>
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">交付案例</h2>
<ul class="al-list">
<li v-for="item in jfalList" :key="item"><img :src="item" /></li>
</ul>
</div>
</section>
</div>
</template>
......@@ -88,141 +97,142 @@ export default {
mkList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1.png',
title: '大数据分析综合实践平台',
subTitle: '大数据分析综合实践优势',
title: '综合实践教学平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_1.png',
title: '真实连接企业95%以上的数据源'
title: '内置多个开箱即用教学环境'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_2.png',
title: '业务人员级别的可视化数据治理能力'
title: '内置多门大数据基础及提升课程资源'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_3.png',
title: '面向非技术人员的零代码人工智能应用'
title: '支持多种训练环境及教师远程辅助'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_4.png',
title: '企业真实的强大数据可视化组件'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_5.png',
title: '稳定且安全的后台管理能力'
title: '支持多种虚拟化技术及部署方式'
}
]
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2.png',
title: '大数据分析教学管理平台',
subTitle: '大数据分析教学管理优势',
title: '教学管理平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_1.png',
title: '全面管理理论与实践教学资源'
title: '一站式理论+实践学习平台'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_2.png',
title: '资源使用情况实时可见'
title: '结合配套教学资源实现开箱即用'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_3.png',
title: '“院校-学院-个人”三级课程管理'
title: '工业级产品与教学管理的完美适配'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_4.png',
title: '丰富且灵活的基础信息管理'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_5.png',
title: '丰富的教学业务支撑能力'
title: '全面支撑课程评价和专业建设数据要求'
}
]
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3.png',
title: '大数据分析实验管理平台',
subTitle: '大数据分析实验管理优势',
title: '实验管理平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_1.png',
title: '支持教学、大赛等多场景、多角色'
title: '灵活的实验配置实现丰富教学场景支撑'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_2.png',
title: '独立的操作指导书管理能力'
title: '实验成绩多维构成及综合评分制'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_3.png',
title: '独立的操作视频管理能力'
title: '实验报告在线灵活填写及自动评分'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_4.png',
title: '强大的过程数据记录和师生交互'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_5.png',
title: '灵活的实验配置'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_6.png',
title: '实验成绩多维度定义及实验报告在线填写'
title: '与大赛平台无缝衔接'
}
]
}
],
zyList: [
{ title: '案例1:电子商城数据分析', industry: '电商' },
{ title: '案例2:房屋价格的数据分析', industry: '房地产' },
{ title: '案例3:汽车金融企业业务分析', industry: '汽车服务' },
{ title: '案例4:互联网零售数据分析', industry: '互联网' },
{ title: '案例5:微博热门博主与话题模型分析', industry: '互联网' },
{ title: '案例6:商业银行专项财务指标分析', industry: '金融' },
{ title: '案例7:信用卡欺诈行为分析', industry: '金融' },
{ title: '案例8:金融量化投资分析', industry: '金融' },
{ title: '案例9:基于RFM模型进行用户分群运营分析', industry: '零售' },
{ title: '案例10:智慧交通综合分析', industry: '交通' }
{ title: '案例1:爬取51job的数据分析', industry: '互联网' },
{ title: '案例2:威士忌酒的评论数据分析', industry: '零售' },
{ title: '案例3:印度自杀率分析', industry: '政府' },
{ title: '案例4:新加坡旅游数据的数据洞察', industry: '旅游' },
{ title: '案例5:气候变化分析', industry: '旅游' },
{ title: '案例6:使用社交网络广告进行销售预测', industry: '互联网' },
{ title: '案例7:预测泰坦尼克号生存率', industry: '交通' },
{ title: '案例8:糖尿病预测分析', industry: '医疗' },
{ title: '案例9:房天下兰州二手房价预测', industry: '房地产' },
{ title: '案例10:信用卡客户违约预测', industry: '金融' }
],
numList: [
{ num: 10, desc: '个案例' },
{ num: 10, desc: '篇案例原文' },
{ num: 13, desc: '个数据集' },
{ num: 31, desc: '份辅助资源' },
{ num: 65, desc: '份案例指导书' },
{ num: 65, desc: '套教学PPT' },
{ num: 231, desc: '个教学视频。' }
{ num: 34, desc: '份案例指导书' },
{ num: 58, desc: '套教学PPT' },
{ num: 157, desc: '个教学视频。' }
],
tabActive: 0,
tabList: [
{
title: '案例原文',
children: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_1_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_1_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_1_3.png'
]
},
{
title: '案例指导书',
children: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_2_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_2_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_2_3.png'
]
},
{
title: '教学PPT',
children: ['https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_3_1.png', 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_3_2.png']
},
{
title: '操作视频',
children: ['https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_4_1.png', 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_3/alzy_4_2.png']
}
],
// 标准服务
bzfwList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_1.png',
title: '产品服务'
title: '产品服务',
desc: '产品安装服务<br/>产品配置调试服务<br/>产品免费升级服务<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_2.png',
title: '资源服务'
title: '资源服务',
desc: '配套课程资源<br/>课程资源免费更新服务<br/>行业案例免费升级服务<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_3.png',
title: '培训服务'
title: '培训服务',
desc: '产品使用培训<br/>产品维护培训<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_4.png',
title: '产品技术支持'
title: '产品技术支持',
desc: '产品功能与性能巡检<br/>产品使用分析与建议<br/>产品在线技术支持<br/>产品电话技术支持<br/>……'
}
],
// 增值服务
zzfwList: ['顶层设计服务', '师资培训服务', '行业讲座服务', '科研服务', '教学服务'],
// 交付案例
jfalList: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_3.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_4.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_5.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_6.png'
]
zzfwList: ['顶层设计服务', '师资培训服务', '行业讲座服务', '科研服务', '教学服务']
}
}
}
......@@ -230,9 +240,74 @@ export default {
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #fff;
......@@ -263,6 +338,14 @@ export default {
border-bottom: 1px solid var(--main-color);
}
.section-desc {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #666666;
}
.section-info {
margin: 40px 0 70px;
font-size: 18px;
font-family: Source Han Sans CN;
font-weight: 400;
......@@ -270,6 +353,7 @@ export default {
color: #666666;
text-align: center;
}
.section-pic {
text-align: center;
img {
......@@ -297,28 +381,13 @@ export default {
color: #ffffff;
}
}
h4 {
margin: 80px 0 36px;
text-align: center;
span {
display: inline-block;
font-size: 20px;
font-family: Source Han Sans CN-Normal, Source Han Sans CN;
font-weight: 400;
color: #424242;
line-height: 34px;
border-bottom: 1px solid var(--main-color);
}
}
ul {
height: 440px;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-top: 40px;
}
li {
margin-top: 25px;
img {
margin: 0 20px;
margin: 0 18px;
}
display: flex;
align-items: center;
......@@ -341,12 +410,16 @@ export default {
transform: scale(1.06);
}
}
p {
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(51, 51, 51, 0.6);
}
h4 {
padding: 64px 0 45px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
......@@ -354,7 +427,14 @@ export default {
display: flex;
align-items: center;
justify-content: center;
background: rgba(51, 51, 51, 0.6);
}
p {
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 40px;
text-align: center;
}
}
.zz-list {
......@@ -385,17 +465,25 @@ export default {
}
.zy {
display: flex;
margin-bottom: 100px;
.table {
flex: 1;
}
.num {
margin-left: 60px;
margin-left: 35px;
}
}
.num {
display: flex;
flex-direction: column;
justify-content: space-between;
p {
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
line-height: 30px;
}
li {
line-height: 70px;
span {
font-size: 30px;
font-weight: bold;
......@@ -442,4 +530,39 @@ export default {
}
}
}
.tab {
display: flex;
margin-bottom: 70px;
}
.tab-header {
margin-right: 38px;
li {
width: 270px;
height: 70px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 70px;
color: #333333;
background: #fff;
text-align: center;
border: 1px solid #d5d5d5;
cursor: pointer;
&.is-active {
color: #fff;
background-color: var(--main-color);
border: 1px solid var(--main-color);
}
& + li {
margin-top: 22px;
}
}
}
.tab-body {
flex: 1;
display: flex;
align-items: center;
justify-content: space-evenly;
background-color: var(--main-color);
}
</style>
......@@ -2,24 +2,27 @@
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/banner.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/banner.png" />
<div class="cover">
<div class="cover-inner">
<h2>人工智能实践教学平台</h2>
<span></span>
<h6>开箱即用 · 内置课程 · 丰富案例 · 灵活教学</h6>
<p>
既能满足工科人工智能通识能力和专业能力的训练需求,又能满足商科等其他学科对于人工智能基础实践教学的训练需求,满足高校对于人工智能教学的多层次需求。打造高校学生人工智能通识能力与专业能力的一站式实践教学平台。
</p>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<h2 class="section-title">人工智能实践教学平台</h2>
<p class="section-desc">
数智化实践教学平台采用B/S架构,集教学资源、实验环境和工具、应用实践和硬件资源为一体的专业化教学平台。为用户解决了缺少教学资源、没有实验环境工具、怎样体系化学习、如何进阶学习、提升实际场景的应用实践经验等核心问题。从而提高学生的学习效率和学习能力,增加自身的市场竞争力。
</p>
<h2 class="section-title" style="margin-top: 100px">核心模块</h2>
<h2 class="section-title">核心模块</h2>
<div class="mk-list">
<div class="mk-item" v-for="item in mkList" :key="item.title">
<div class="box">
<img :src="item.icon" />
<p>{{ item.title }}</p>
</div>
<h4>
<span>{{ item.subTitle }}</span>
</h4>
<ul>
<li v-for="item in item.children" :key="item.title">
<img :src="item.icon" />
......@@ -32,7 +35,8 @@
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">人工智能分析实践教学平台案例资源介绍</h2>
<h2 class="section-title">人工智能实践教学平台案例资源介绍</h2>
<p class="section-info">以真实的行业案例为原型,辅之以大量的真实行业数据,按照国家级教材研发标准为参考开发的综合性企业真实场景的实战教学案例</p>
<div class="zy">
<table class="table">
<thead>
......@@ -42,25 +46,38 @@
</tr>
</thead>
<tbody>
<tr v-for="item in zyList" :key="item">
<tr v-for="item in zyList" :key="item.title">
<td>{{ item.title }}</td>
<td>{{ item.industry }}</td>
</tr>
</tbody>
</table>
<ul class="num">
<p>每个案例支撑16个学时实践教学</p>
<li v-for="item in numList" :key="item.desc">
<span>{{ item.num }}</span>
<em>{{ item.desc }}</em>
</li>
</ul>
</div>
<h3 class="section-subtitle">案例资源示例</h3>
<div class="tab">
<ul class="tab-header">
<li v-for="(item, index) in tabList" :class="{ 'is-active': index === tabActive }" :key="index" @mouseover="tabActive = index">{{ item.title }}</li>
</ul>
<ul class="tab-body" v-for="(item, index) in tabList" :key="index" v-if="index === tabActive">
<li v-for="item in item.children" :key="item"><img :src="item" /></li>
</ul>
</div>
<h2 class="section-title">产品配套服务</h2>
<h3 class="section-subtitle">标准服务</h3>
<ul class="bz-list">
<li v-for="item in bzfwList" :key="item.title">
<img :src="item.icon" />
<p>{{ item.title }}</p>
<div class="cover">
<h4>{{ item.title }}</h4>
<p v-html="item.desc"></p>
</div>
</li>
</ul>
<h3 class="section-subtitle">增值服务</h3>
......@@ -69,14 +86,6 @@
</ul>
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">交付案例</h2>
<ul class="al-list">
<li v-for="item in jfalList" :key="item"><img :src="item" /></li>
</ul>
</div>
</section>
</div>
</template>
......@@ -88,141 +97,142 @@ export default {
mkList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1.png',
title: '人工智能分析综合实践平台',
subTitle: '人工智能分析综合实践优势',
title: '综合实践教学平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_1.png',
title: '真实连接企业95%以上的数据源'
title: '内置多个开箱即用教学环境'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_2.png',
title: '业务人员级别的可视化数据治理能力'
title: '内置多门人工智能基础及提升课程资源'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_3.png',
title: '面向非技术人员的零代码人工智能应用'
title: '支持多种训练环境及教师远程辅助'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_4.png',
title: '企业真实的强大数据可视化组件'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_1_5.png',
title: '稳定且安全的后台管理能力'
title: '支持多种虚拟化技术及部署方式'
}
]
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2.png',
title: '人工智能分析教学管理平台',
subTitle: '人工智能分析教学管理优势',
title: '教学管理平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_1.png',
title: '全面管理理论与实践教学资源'
title: '一站式理论+实践学习平台'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_2.png',
title: '资源使用情况实时可见'
title: '结合配套教学资源实现开箱即用'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_3.png',
title: '“院校-学院-个人”三级课程管理'
title: '工业级产品与教学管理的完美适配'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_4.png',
title: '丰富且灵活的基础信息管理'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_2_5.png',
title: '丰富的教学业务支撑能力'
title: '全面支撑课程评价和专业建设数据要求'
}
]
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3.png',
title: '人工智能分析实验管理平台',
subTitle: '人工智能分析实验管理优势',
title: '实验管理平台',
children: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_1.png',
title: '支持教学、大赛等多场景、多角色'
title: '灵活的实验配置实现丰富教学场景支撑'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_2.png',
title: '独立的操作指导书管理能力'
title: '实验成绩多维构成及综合评分制'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_3.png',
title: '独立的操作视频管理能力'
title: '实验报告在线灵活填写及自动评分'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_4.png',
title: '强大的过程数据记录和师生交互'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_5.png',
title: '灵活的实验配置'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/mk_3_6.png',
title: '实验成绩多维度定义及实验报告在线填写'
title: '与大赛平台无缝衔接'
}
]
}
],
zyList: [
{ title: '案例1:电子商城数据分析', industry: '电商' },
{ title: '案例2:房屋价格的数据分析', industry: '房地产' },
{ title: '案例3:汽车金融企业业务分析', industry: '汽车服务' },
{ title: '案例4:互联网零售数据分析', industry: '互联网' },
{ title: '案例5:微博热门博主与话题模型分析', industry: '互联网' },
{ title: '案例6:商业银行专项财务指标分析', industry: '金融' },
{ title: '案例7:信用卡欺诈行为分析', industry: '金融' },
{ title: '案例8:金融量化投资分析', industry: '金融' },
{ title: '案例9:基于RFM模型进行用户分群运营分析', industry: '零售' },
{ title: '案例10:智慧交通综合分析', industry: '交通' }
],
numList: [
{ num: 10, desc: '个案例' },
{ num: 10, desc: '篇案例原文' },
{ num: 13, desc: '个数据集' },
{ num: 31, desc: '份辅助资源' },
{ num: 65, desc: '份案例指导书' },
{ num: 65, desc: '套教学PPT' },
{ num: 231, desc: '个教学视频。' }
{ num: 28, desc: '份案例指导书' },
{ num: 54, desc: '套教学PPT' },
{ num: 150, desc: '个教学视频。' }
],
zyList: [
{ title: '案例1:线性回归应用', industry: '互联网' },
{ title: '案例2:数据分类', industry: '互联网' },
{ title: '案例3:语义角色标注', industry: '互联网' },
{ title: '案例4:图像分类', industry: '互联网' },
{ title: '案例5:人群口罩佩戴检测', industry: '医疗' },
{ title: '案例6:目标检测', industry: '金融' },
{ title: '案例7:人脸检测', industry: '互联网' },
{ title: '案例8:个性化推荐', industry: '金融' },
{ title: '案例9:情感分析', industry: '互联网' },
{ title: '案例10:机器翻译', industry: '互联网' }
],
tabActive: 0,
tabList: [
{
title: '案例原文',
children: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_1_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_1_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_1_3.png'
]
},
{
title: '案例指导书',
children: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_2_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_2_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_2_3.png'
]
},
{
title: '教学PPT',
children: ['https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_3_1.png', 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_3_2.png']
},
{
title: '操作视频',
children: ['https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_4_1.png', 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_4/alzy_4_2.png']
}
],
// 标准服务
bzfwList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_1.png',
title: '产品服务'
title: '产品服务',
desc: '产品安装服务<br/>产品配置调试服务<br/>产品免费升级服务<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_2.png',
title: '资源服务'
title: '资源服务',
desc: '配套课程资源<br/>课程资源免费更新服务<br/>行业案例免费升级服务<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_3.png',
title: '培训服务'
title: '培训服务',
desc: '产品使用培训<br/>产品维护培训<br/>……'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/bzfw_4.png',
title: '产品技术支持'
title: '产品技术支持',
desc: '产品功能与性能巡检<br/>产品使用分析与建议<br/>产品在线技术支持<br/>产品电话技术支持<br/>……'
}
],
// 增值服务
zzfwList: ['顶层设计服务', '师资培训服务', '行业讲座服务', '科研服务', '教学服务'],
// 交付案例
jfalList: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_3.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_4.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_5.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_1_1/jfal_6.png'
]
zzfwList: ['顶层设计服务', '师资培训服务', '行业讲座服务', '科研服务', '教学服务']
}
}
}
......@@ -230,9 +240,74 @@ export default {
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #fff;
......@@ -263,6 +338,14 @@ export default {
border-bottom: 1px solid var(--main-color);
}
.section-desc {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #666666;
}
.section-info {
margin: 40px 0 70px;
font-size: 18px;
font-family: Source Han Sans CN;
font-weight: 400;
......@@ -270,6 +353,7 @@ export default {
color: #666666;
text-align: center;
}
.section-pic {
text-align: center;
img {
......@@ -297,28 +381,13 @@ export default {
color: #ffffff;
}
}
h4 {
margin: 80px 0 36px;
text-align: center;
span {
display: inline-block;
font-size: 20px;
font-family: Source Han Sans CN-Normal, Source Han Sans CN;
font-weight: 400;
color: #424242;
line-height: 34px;
border-bottom: 1px solid var(--main-color);
}
}
ul {
height: 440px;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-top: 40px;
}
li {
margin-top: 25px;
img {
margin: 0 20px;
margin: 0 18px;
}
display: flex;
align-items: center;
......@@ -341,12 +410,16 @@ export default {
transform: scale(1.06);
}
}
p {
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(51, 51, 51, 0.6);
}
h4 {
padding: 64px 0 45px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
......@@ -354,7 +427,14 @@ export default {
display: flex;
align-items: center;
justify-content: center;
background: rgba(51, 51, 51, 0.6);
}
p {
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 40px;
text-align: center;
}
}
.zz-list {
......@@ -385,17 +465,25 @@ export default {
}
.zy {
display: flex;
margin-bottom: 100px;
.table {
flex: 1;
}
.num {
margin-left: 60px;
margin-left: 35px;
}
}
.num {
display: flex;
flex-direction: column;
justify-content: space-between;
p {
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
line-height: 30px;
}
li {
line-height: 70px;
span {
font-size: 30px;
font-weight: bold;
......@@ -442,4 +530,39 @@ export default {
}
}
}
.tab {
display: flex;
margin-bottom: 70px;
}
.tab-header {
margin-right: 38px;
li {
width: 270px;
height: 70px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 70px;
color: #333333;
background: #fff;
text-align: center;
border: 1px solid #d5d5d5;
cursor: pointer;
&.is-active {
color: #fff;
background-color: var(--main-color);
border: 1px solid var(--main-color);
}
& + li {
margin-top: 22px;
}
}
}
.tab-body {
flex: 1;
display: flex;
align-items: center;
justify-content: space-evenly;
background-color: var(--main-color);
}
</style>
......@@ -2,11 +2,28 @@
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/banner.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_2/banner.png" />
<div class="cover">
<div class="cover-inner">
<!-- <h3>数字经济产业学院 + ICT产业学院</h3> -->
<h2>数字经济新商科产业学院</h2>
<span></span>
<h6>专业共建 · 多维赋能 · 成果导向</h6>
<p>
以“专业与地区数字经济产业链精准对接”为核心思路,聚焦区域数字经济产业链为人才培养目标,围绕产业数字化和数字产业化,形成以数字化核心底层能力贯通所有专业,“数字+全行业”专业建设赋能专业数字化改造升级,人才培养与产业需求的高度融合
</p>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<h2 class="section-title">产业学院及专业方向</h2>
<h2 class="section-title">产业学院专业方向</h2>
<div class="section-pic">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_2/1_1new2.png" />
</div>
<!-- <div class="section-pic" style="margin-top: 50px">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_2/1_2.png" />
</div> -->
</div>
</section>
<section class="section">
......@@ -48,12 +65,12 @@ export default {
return {
// 交付案例
jfalList: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_3.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_4.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_5.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_6.png'
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_3.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_6.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_4.png'
]
}
}
......@@ -62,15 +79,80 @@ export default {
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #fff;
background-color: #f9f8f8;
}
.section:nth-child(odd) {
background-color: #f9f8f8;
background-color: #fff;
}
.section-inner {
width: 1200px;
......@@ -95,7 +177,7 @@ export default {
border-bottom: 1px solid var(--main-color);
}
.section-desc {
font-size: 18px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
......@@ -150,7 +232,7 @@ export default {
}
li {
img {
margin: 0 20px;
margin: 0 18px;
}
display: flex;
align-items: center;
......@@ -222,12 +304,14 @@ export default {
flex: 1;
}
.num {
margin-left: 60px;
margin-left: 35px;
}
}
.num {
display: flex;
flex-direction: column;
justify-content: space-between;
li {
line-height: 70px;
span {
font-size: 30px;
font-weight: bold;
......
......@@ -2,21 +2,39 @@
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/banner.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_3/banner.png" />
<div class="cover">
<div class="cover-inner">
<h2>专业数字化改造提升</h2>
<span></span>
<h6>新专业申请 · 旧专业升级 · 课程提供 · 师资提升</h6>
<p>
针对数字人才的底层通用基础能力:商业数据分析能力和数字营销能力,将其引入现有的专业体系中,对现有专业基础能力的培养进行数字化改造升级
</p>
</div>
<section class="section">
</div>
</div>
<!-- <section class="section">
<div class="section-inner">
<h2 class="section-title">专业人培方案数字化改造升级</h2>
<h2 class="section-title">数字人才技能解构-能力模型</h2>
<div class="section-pic">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_3/1.png" />
</div>
</div>
</section> -->
<section class="section">
<div class="section-inner">
<h2 class="section-title">专业数字化改造背景与现状</h2>
<div class="section-pic">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_3/2.png?v=1" />
</div>
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">数字人才实习实训实验室</h2>
<h2 class="section-title">专业数字化改造解决方案</h2>
<div class="section-pic">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_3/2.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_3/3.png" />
</div>
</div>
</section>
......@@ -26,14 +44,35 @@
<p class="section-desc">
紫荆教育通过数字经济实验平台(商业数据分析实验平台和数字营销实验平台)负责实施商业数据分析和数字营销两门课,共计96课时。紫荆教育数字经济实验室作为紫荆教育工业级产品,在多个行业有真实应用,为数字人才培养提供立体化教学实施平台,打造数字化教学模式。师资全部来自业务骨干,行业专家和学校专业教师团队组成混编师资团队,针对课程形成理论基础+行业数字化应用两个层次多个维度的分工合作,优势互补,相互促进,形成师资立方体,实现嵌入式融合创新实践。
</p>
<ul class="course-list">
<li v-for="item in courseList" :key="item.title" :class="{ 'has-arrow': item.arrow }">
<div class="pic">
<img :src="item.icon" />
</div>
<h3>{{ item.title }}</h3>
<p>{{ item.desc }}</p>
</li>
<li><h3>...</h3></li>
</ul>
<div class="course-box">
<h3>通识课程</h3>
<ul>
<li>商业数据分析</li>
<li>数字营销</li>
</ul>
</div>
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">长期培养数字技能授课师资</h2>
<p class="section-desc">
师资培养发扬自身特色和发挥资源优势,主要围绕数字素质技能与教学创新团队两个方面展开,着重加强数字化人才培养方面的培训,定期开展培训交流研讨,推动教师及专业数字化改造“双师”团队的建设。
<h2 class="section-title">教师数字素养与技能提升</h2>
<p class="section-desc" style="white-space: nowrap">
采用“引入国际顶尖师资、互派产业院校师资、系统化培训”
3重手段、16个子项目实现“教师的国际化水平、产业实战水平和岗课赛证融通水平” 3个水平的有效提升
</p>
<div class="section-pic" style="margin: 80px 0">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_3/4.png" />
</div>
<ul class="al-list">
<li v-for="item in jfalList" :key="item"><img :src="item" /></li>
</ul>
......@@ -46,11 +85,36 @@
export default {
data() {
return {
courseList: [
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/course_1.png',
title: '数字金融',
desc: '(校企联合开发)'
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/course_2.png',
title: '数字贸易',
desc: '(校企联合开发)',
arrow: true
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/course_3.png',
title: '数字农业',
desc: '(校企联合开发)',
arrow: true
},
{
icon: 'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/course_4.png',
title: '数字康养',
desc: '(校企联合开发)',
arrow: true
}
],
// 交付案例
jfalList: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/show_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/show_3.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/show_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/show_3.png'
'https://webapp-pub.ezijing.com/www/pc/digital/yx_3/show_1.png'
]
}
}
......@@ -59,15 +123,68 @@ export default {
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #f9f8f8;
background-color: #fff;
}
.section:nth-child(odd) {
background-color: #fff;
background-color: #f9f8f8;
}
.section-inner {
width: 1200px;
......@@ -92,7 +209,7 @@ export default {
border-bottom: 1px solid var(--main-color);
}
.section-desc {
font-size: 18px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
......@@ -115,4 +232,95 @@ export default {
}
}
}
.course-list {
margin: 80px 0 50px;
display: flex;
column-gap: 40px;
li {
position: relative;
height: 260px;
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border: 1px solid #d5d5d5;
&::after {
position: absolute;
content: '';
left: -1px;
right: -1px;
bottom: -1px;
height: 10px;
background-color: var(--main-color);
}
.pic {
margin-bottom: 20px;
display: flex;
align-items: center;
justify-content: center;
width: 90px;
height: 90px;
background-color: var(--main-color);
border-radius: 50%;
}
h3 {
font-size: 20px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
line-height: 34px;
}
p {
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #6c6c6c;
line-height: 34px;
}
&.has-arrow {
&::before {
position: absolute;
left: 50%;
bottom: -43px;
content: '';
background: url('https://webapp-pub.ezijing.com/www/pc/digital/yx_3/arrow.png');
width: 18px;
height: 33px;
transform: translateX(-50%);
}
}
}
}
.course-box {
padding: 30px 0;
border: 1px solid #dfdfdf;
h3 {
font-size: 24px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333;
line-height: 34px;
text-align: center;
}
ul {
margin-top: 38px;
display: flex;
align-items: center;
justify-content: center;
column-gap: 80px;
}
li {
width: 460px;
height: 60px;
background-color: var(--main-color);
border-radius: 30px;
font-size: 22px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #fff;
line-height: 60px;
text-align: center;
}
}
</style>
<!-- 引产入校 -->
<template>
<div style="background-color: #fff">
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_4/banner.png" />
<div class="cover">专业共建 · 多维赋能 · 成果导向</div>
</div>
<div class="main">
<ul class="tab">
<li :class="{ 'is-active': tabActive === item.prop }" v-for="item in tabs" @click="handleTabClick(item)">{{ item.name }}</li>
</ul>
<div class="list" v-if="!showArticle">
<div class="list-item" v-for="item in list" :key="item.id" @click="handleClick(item)">
<img :src="item.web_img_uri" class="list-item-pic" loading="lazy" />
<div class="list-item-content">
<div class="list-item-content__date">{{ formatDate(item.start_time) }}</div>
<div class="list-item-content__title">{{ item.title }}{{ item.remarks }}</div>
<div class="list-item-content__text">{{ item.abstract }}</div>
</div>
</div>
</div>
<article class="article" v-else>
<h1>{{ data.title }}</h1>
<h1>{{ data.remarks }}</h1>
<div class="article-text" v-html="data.content"></div>
</article>
</div>
</div>
</template>
<script>
import { getArticleList } from '@/api'
export default {
data() {
return {
tabs: [
{ name: '赛事动态', prop: 'event_dynamics' },
{ name: '往届回顾', prop: 'past_review' }
],
tabActive: 'event_dynamics',
list: [],
showArticle: false,
data: {}
}
},
watch: {
tabActive: {
immediate: true,
handler() {
this.fetchList()
}
}
},
methods: {
formatDate(value) {
const date = new Date(value * 1000)
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
},
fetchList() {
getArticleList({ project_id: process.env.projectId, type_tag: this.tabActive }).then(res => {
this.list = res.data.data
})
},
handleTabClick(data) {
this.tabActive = data.prop
this.showArticle = false
},
handleClick(data) {
if (data.uri) {
window.open(data.uri)
} else {
this.data = data
this.showArticle = true
}
}
}
}
</script>
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.main {
max-width: 1200px;
margin: 0 auto;
}
.tab {
position: relative;
margin-top: -50px;
display: flex;
column-gap: 40px;
li {
flex: 1;
height: 50px;
line-height: 50px;
text-align: center;
background-color: #fff;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
cursor: pointer;
&.is-active {
color: #fff;
background-color: var(--main-color);
}
}
}
.list {
padding: 64px 0;
}
.list-item {
display: flex;
padding: 36px 0;
cursor: pointer;
& + .list-item {
border-bottom: 1px solid #e6e6e6;
}
}
.list-item-pic {
width: 218px;
height: 120px;
// height: fit-content;
// height: 210px;
// object-fit: cover;
}
.list-item-content {
flex: 1;
overflow: hidden;
margin-left: 30px;
}
.list-item-content__date {
font-size: 16px;
font-weight: 300;
line-height: 100%;
color: #c6c6c6;
// padding-top: 13px;
}
.list-item-content__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: 1;
-webkit-box-orient: vertical;
}
.list-item-content__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: 4;
-webkit-box-orient: vertical;
}
.article {
padding: 100px 0;
h1 {
font-size: 30px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333333;
line-height: 46px;
text-align: center;
}
}
.article-text {
margin-top: 30px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
line-height: 32px;
}
</style>
<!-- 引产入校 -->
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_2/banner.png" />
<div class="cover">
<div class="cover-inner">
<!-- <h3>数字经济产业学院 + ICT产业学院</h3> -->
<h2>未来技术产业学院</h2>
<span></span>
<h6>专业共建 · 多维赋能 · 成果导向</h6>
<p>
面向区域新一代信息技术和未来技术产业链、技术链、人才链需求,依托高校专业特色与优势,联合行业生态伙伴,整合优势资源,创新产教融合机制,共建ICT生态体系人才数字化产教融合平台,全面提升人才培养质量,服务区域数字经济发展
</p>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<h2 class="section-title">产业学院专业方向</h2>
<div class="section-pic">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/digital/yx_2/y5_1_1.png" />
</div>
<!-- <div class="section-pic" style="margin-top: 50px">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_2/1_2.png" />
</div> -->
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">产业学院建设内容</h2>
<div class="section-pic">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_2/jsnr.png" />
</div>
<h2 class="section-title" style="margin-top: 100px">产业学院运营保障</h2>
<div class="section-pic">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_2/bz.png" />
</div>
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">产业学院输出成果</h2>
<div class="section-pic">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/yx_2/cg.png" />
</div>
</div>
</section>
<section class="section">
<div class="section-inner">
<h2 class="section-title">交付案例</h2>
<ul class="al-list">
<li v-for="item in jfalList" :key="item"><img :src="item" /></li>
</ul>
</div>
</section>
</div>
</template>
<script>
export default {
data() {
return {
// 交付案例
jfalList: [
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_5.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_3.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_6.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_2.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_1.png',
'https://webapp-pub.ezijing.com/www/pc/digital/yx_2/al_4.png'
]
}
}
}
</script>
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #f9f8f8;
}
.section:nth-child(odd) {
background-color: #fff;
}
.section-inner {
width: 1200px;
margin: 0 auto;
padding: 100px 0;
}
.section-title {
margin-bottom: 36px;
font-size: 30px;
font-family: Source Han Sans CN;
font-weight: bold;
line-height: 32px;
color: #333333;
text-align: center;
}
.section-subtitle {
display: inline-block;
margin: 36px 0;
font-size: 20px;
line-height: 32px;
color: #424242;
border-bottom: 1px solid var(--main-color);
}
.section-desc {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #666666;
text-align: center;
}
.section-pic {
text-align: center;
img {
max-width: 100%;
}
}
.mk-list {
display: flex;
gap: 60px;
.mk-item {
flex: 1;
}
.box {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 260px;
background-color: var(--main-color);
p {
margin-top: 48px;
font-size: 18px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #ffffff;
}
}
h4 {
margin: 80px 0 36px;
text-align: center;
span {
display: inline-block;
font-size: 20px;
font-family: Source Han Sans CN-Normal, Source Han Sans CN;
font-weight: 400;
color: #424242;
line-height: 34px;
border-bottom: 1px solid var(--main-color);
}
}
ul {
height: 440px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
li {
img {
margin: 0 18px;
}
display: flex;
align-items: center;
height: 60px;
background: #f2f2f2;
font-size: 15px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #424242;
}
}
.bz-list {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 38px;
li {
position: relative;
transition: all 0.3s;
&:hover {
transform: scale(1.06);
}
}
p {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
background: rgba(51, 51, 51, 0.6);
}
}
.zz-list {
display: flex;
gap: 25px;
li {
flex: 1;
font-size: 22px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
line-height: 80px;
text-align: center;
border: 1px solid var(--main-color);
border-left-width: 10px;
}
}
.al-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
li {
transition: all 0.3s;
&:hover {
transform: scale(1.06);
}
}
}
.zy {
display: flex;
margin-bottom: 100px;
.table {
flex: 1;
}
.num {
margin-left: 35px;
}
}
.num {
display: flex;
flex-direction: column;
justify-content: space-between;
li {
span {
font-size: 30px;
font-weight: bold;
font-family: SourceHanSansCN-Bold;
color: var(--main-color);
}
em {
font-size: 18px;
font-family: Source Han Sans CN;
}
}
}
.table {
thead {
th {
padding: 20px;
font-size: 18px;
font-family: Source Han Sans CN;
font-weight: bold;
line-height: 22px;
color: #fff;
background-color: #aa1941;
border: 1px solid #aa1941;
}
th:nth-child(2) {
background: #931638;
}
}
tbody {
td {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 1;
color: #262626;
padding: 14px;
border: 1px solid #8b8b8b;
}
td:nth-child(1) {
padding-left: 40px;
}
td:nth-child(2) {
text-align: center;
}
}
}
</style>
......@@ -2,24 +2,35 @@
<template>
<div>
<div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/digital/banner.png" />
<img src="https://webapp-pub.ezijing.com/www/pc/digital/zf_1/banner.png" />
<div class="cover">
<div class="cover-inner">
<h2>数字技能公共实训基地</h2>
<span></span>
<h6>1个数字展区 · 3个技能实训区 · 8个实训中心 · 5个运营中心</h6>
<p>
围绕区域经济发展目标,“政产学研用金”六位一体协同引领,以创新职业教育模式为特色,汇聚和引领优质教育和产业资源,多方共同打造“数字技能公共实训基地”,培养和集聚一批符合当地数字产业发展需要的创新型高技能人才,为区域产业发展提供人才支撑。
</p>
</div>
</div>
</div>
<section class="section">
<div class="section-inner">
<!-- <div class="section-inner">
<h2 class="section-title">数字技能公共实训基地</h2>
<p class="section-desc">
发展数字经济,人才是关键,也是产业园区招商引资的差异化竞争力和服务。紫荆教育为政府(产业园区)提供“数字人才技能实践基地”解决方案,建设”1385“核心内容等项目。紫荆教育的领先产品、丰富产业资源和强大运营能力和政府或者产业园区结合,将极大的提高政府数字人才培养的效率和产业竞争力
围绕区域经济发展目标,“政产学研用金”六位一体协同引领,以创新职业教育模式为特色,汇聚和引领优质教育和产业资源,多方共同打造“数字技能公共实训基地”,培养和集聚一批符合当地数字产业发展需要的创新型高技能人才,为区域产业发展提供人才支撑
</p>
</div>
<div class="section-pic" style="margin-bottom: 60px"><img src="https://webapp-pub.ezijing.com/www/pc/digital/zf_1/1.png" /></div>
</div> -->
<div class="section-pic"><img src="https://webapp-pub.ezijing.com/www/pc/digital/zf_1/1.png" class="img1" /></div>
</section>
<section class="section">
<div class="section-inner">
<div class="section-pic" style="margin-bottom: 60px"><img src="https://webapp-pub.ezijing.com/www/pc/digital/zf_1/2.png" /></div>
<h2 class="section-title">交付案例</h2>
<h2 class="section-title">实训基地建设示意图</h2>
<div class="section-pic"><img src="https://webapp-pub.ezijing.com/www/pc/digital/zf_1/2.png" /></div>
<!-- <h2 class="section-title">交付案例</h2>
<ul class="al-list">
<li v-for="item in jfalList" :key="item"><img :src="item" /></li>
</ul>
</ul> -->
</div>
</section>
</div>
......@@ -38,9 +49,74 @@ export default {
<style lang="scss" scoped>
.banner {
position: relative;
img {
width: 100%;
}
.cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4039);
line-height: 1;
color: #ffffff;
h2 {
font-size: 42px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
line-height: 1;
}
h3 {
margin-bottom: 20px;
font-size: 24px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 4px;
}
span {
margin: 24px 0;
width: 42px;
height: 3px;
background: #ffffff;
}
h6 {
margin-bottom: 24px;
font-size: 20px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
line-height: 1;
letter-spacing: 2px;
}
p {
max-width: 644px;
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
line-height: 26px;
}
a {
margin-top: 28px;
width: 112px;
height: 36px;
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: 36px;
background: #aa1941;
text-align: center;
}
}
.cover-inner {
height: 100%;
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
flex-direction: column;
}
}
.section:nth-child(even) {
background-color: #fff;
......@@ -71,12 +147,11 @@ export default {
border-bottom: 1px solid var(--main-color);
}
.section-desc {
font-size: 18px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #666666;
text-align: center;
}
.section-pic {
text-align: center;
......@@ -95,4 +170,9 @@ export default {
}
}
}
.img1 {
min-width: 1200px;
height: 759px;
object-fit: cover;
}
</style>
......@@ -35,12 +35,7 @@
</app-card> -->
<app-card :title="isEn ? 'Application' : '申请流程'" style="margin-top: 68px">
<div class="process">
<img
:src="
isEn
? 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/process_en.png'
: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/process.png'
" />
<img :src="isEn ? 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/process_en.png' : 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/process.png'" />
</div>
</app-card>
<app-card :title="isEn ? 'Application Guide' : '报考指南'" style="margin-top: 74px">
......@@ -208,7 +203,7 @@ export default {
qaList,
// 最新动态请求参数
newsParams: {
project_ids: ['25634964940156928', '25634688011239424', '6886139536666001408', '62110451281973248'],
project_ids: ['25634964940156928', '25634688011239424', '6886139536666001408', '62110451281973248', '78616692432879616', '147349767330201600'],
type_tag: 'article_news_hot',
page: 1,
limit: 4
......
......@@ -26,7 +26,7 @@ export default {
remote: {
httpRequest: getArticleList,
params: {
project_ids: ['25634964940156928', '25634688011239424', '6886139536666001408', '62110451281973248'],
project_ids: ['25634964940156928', '25634688011239424', '6886139536666001408', '62110451281973248', '78616692432879616', '147349767330201600'],
type_tag: 'article_news_hot'
}
},
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论