Skip to content

P
project-www-pc
提交 641c2bab authored 作者: matian's avatar matian
浏览文件
操作

数字经济产业学院修改

上级 1f93cc08
显示空白字符变更
内嵌 并排
正在显示 包含 373 行增加 和 222 行删除
pages/services/college.vue
浏览文件 @ 641c2bab
...@@ -11,113 +11,157 @@ ...@@ -11,113 +11,157 @@
<img <img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img1.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image2.png'
: ' https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img1.png' : ' https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image2.png'
" "
/><img />
<p style="font-size: 18px;font-weight: 400;color: #A81840;margin-bottom:33px">
数字经济人才需求-能力模型
</p>
<img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img2.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image3.png'
: ' https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img2.png' : ' https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image3.png'
" "
/> />
<div>
<!-- <img src="https://webapp-pub.ezijing.com/www/pc/college-m1-i2-new.png" alt="" /> <p style="font-size: 18px;font-weight: 400;color: #000000;margin-bottom:20px">
<img src="https://webapp-pub.ezijing.com/www/pc/college-m1-i3-new.png" alt="" /> --> 紫荆数字经济产业学院有一下主要特点
<!-- <div class="m1-new-item"> </p>
<div class="title">
{{
$cookies.get('lang') == 'en-US'
? 'Zijing Education - Unique Three-stage Talent Training'
: '紫荆教育特有三阶段人才培养'
}}
</div>
<div class="item-box">
<div class="left-box">
<img src="https://webapp-pub.ezijing.com/www/pc/college-m1-dom1.png" alt="" class="bg" />
<img <img
v-if="$cookies.get('lang') == 'en-US'" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image41.png"
src=" https://webapp-pub.ezijing.com/www/pc/college/img41.png" alt=""
class="txt img11" v-if="tabActive === 0"
/> />
<img v-else src="https://webapp-pub.ezijing.com/www/pc/college-m1-dom1-txt.png" class="txt img1" />
</div>
<div class="right-box">
<div class="items">
<img src="https://webapp-pub.ezijing.com/www/pc/college-m1-dom2.png" alt="" class="bg" />
<img <img
v-if="$cookies.get('lang') == 'en-US'" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image42.png"
src=" https://webapp-pub.ezijing.com/www/pc/college/img51.png" alt=""
class="txt t11" v-if="tabActive === 1"
/> />
<img v-else src="https://webapp-pub.ezijing.com/www/pc/college-m1-dom1-txt.png" class="txt t1" />
</div>
<div class="items">
<img src="https://webapp-pub.ezijing.com/www/pc/college-m1-dom3.png" alt="" class="bg" />
<img <img
v-if="$cookies.get('lang') == 'en-US'" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image43.png"
src=" https://webapp-pub.ezijing.com/www/pc/college/img61.png" alt=""
class="txt t22" v-if="tabActive === 2"
/> />
<img v-else src="https://webapp-pub.ezijing.com/www/pc/college-m1-dom1-txt.png" class="txt t2" /> <img
</div> src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image44.png"
alt=""
v-if="tabActive === 3"
/>
<ul>
<li
v-for="(item, index) in navList"
:key="index"
class="li"
@click="navActive(item, index)"
:class="{ active: index === tabActive }"
>
<img :src="item.img" alt="" style="width:43px;height:43px" />
<div style="color: #424242;font-size:16px;font-weight:400">{{ item.name }}</div>
</li>
</ul>
<div v-if="tabActive === 0">
<ul>
<li>数字经济人才国家战略</li>
<li>企业人才需求强劲</li>
</ul>
<p class="desc">
“加快数字化发展，建设数字中国”
国家推进数字化转型的认识和决心不断强化，不断出台支持政策，数字化转型的发展化境不断优化。
<br />
<br />
预计2035年中国整体数字经济规模将近16万亿，总就业容量达到4.15亿人，从目前存量看，中国国高技能人才仅占整体劳动力市场的4%，数字经济类人才缺口巨大。
</p>
</div> </div>
<div v-if="tabActive === 1">
<ul>
<li>专业能力提升</li>
<li>解决实习就业</li>
<li>提升院校专业影响力</li>
</ul>
<p class="desc">
依据数字经济岗位胜任力模型，有针对性的制定人才培养计划，全面提升人才的数字专项技能。引产入校，充分解决学生实习就业的问题，做好学员从学生到职业人的角色转化工作。产学研的融合，进一步提升院校的专业影响力。
</p>
</div> </div>
<div class="tips" style="" v-if="$cookies.get('lang') == 'en-US'"> <div v-if="tabActive === 2">
Integration of Theoretical and Political Education and Curriculum Development<br />Penetration of <ul>
Co-Operation with Enterprises and Training for Professional Elite<br /> <li>学生：学-用-就业</li>
A wide range of head industry resources are well organized to meet the needs of high quality <li>学校：招生-教学-师资-实习-就业</li>
employment by introduction<br /> <li>企业：人才培养-岗位培训-实习-招聘</li>
of the career evaluation system for the comprehensive evaluation of career development; escorting by </ul>
career planning for<br /> <p class="desc">
industry giants; one-stop connection between associate/undergraduate and international degree 学生，学以致用，从学习技能到实际使用技能为企业创造价值，得到社会企业的认可，达到就业的目的。<br /><br />
education. 学校，以产业发展为方向，以科研为先导，以选拔招生为前提，以教学为根本，以实习为抓手，以学生就业为目的，使学校全栈得到综合提升。<br /><br />
企业，从企业发展的角度，对人才进行前置性储备，建立人才培养体系，引进实习实训，发现人才、培养人才、留住人才，形成企业的核心竞争力。
</p>
</div> </div>
<div class="tips" v-else> <div v-if="tabActive === 3">
思政建设与课程建设相融合<br /> <ul>
引产入校与职业菁英训练贯穿整个期间<br /> <li>贯穿整个教学周期</li>
引入职业评价系统为职业发展全面测评；行业大咖职业规划保驾护航；专科本科与国际学位教育一站式衔接；广泛的头部行业资源，满足高质量就业需求。 <li>服务院校长期专业发展目标</li>
<li>多种产品提供给学校、学生</li>
</ul>
<p class="desc">
从人才培养方案咨询、课程体系建设、教师培训、线上线下授课、落地实习实训、指导学生就业，全方位贯彻整个教学周期。<br /><br />
以省市乃至国家一流产业学院为目标，服务院校长期专业发展。<br /><br />
从国内外，从线上线下，从产学研，从校师生，多个层面提供服务。<br /><br />
</p>
</div> </div>
</div> </div>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/college/img7.png'
: 'https://webapp-pub.ezijing.com/www/pc/college-m1-i5-new.png'
"
alt=""
/><img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.ezijing.com/www/pc/college/img8.png'
: 'https://webapp-pub.ezijing.com/www/pc/college-m1-i6-new.png'
"
alt=""
/> -->
</div> </div>
</div> </div>
</template> </template>
<template v-if="showModule === 1"> <template v-if="showModule === 1">
<div class="module-2 module-content-box"> <div class="module-2 module-content-box">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img5.png" alt="" class="banner" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img5.png" alt="" class="banner" />
<p style="color: #424242;font-size:16px;font-weight: 400;padding-left:50px;margin-top:30px;">
数字经济产业学院服务项目
</p>
<p
style="color: #424242;font-size:14px;margin-top:20px;font-weight: 300;padding-left:50px;margin-bottom:17px"
>
为学校、学生和企业提供长期的闭环服务
</p>
<ul>
<li
v-for="(item, index) in tabsList"
:key="index"
class="li"
@click="tabsClick(item, index)"
:class="{ active: index === tabsActive }"
>
<img :src="item.img" alt="" style="width:43px;height:43px" />
<div>{{ item.name }}</div>
<div>{{ item.dec }}</div>
</li>
</ul>
<div class="content-mian"> <div class="content-mian">
<div class="con-img-box"> <div class="con-img-box" v-if="tabsActive === 0">
<img <img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img3.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image6.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img3.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image6.png'
" "
alt="" alt=""
/> />
<div style="position:relative;width:900px;height:262px;margin-bottom:60px">
<img <img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img4.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image7.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img4.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image7.png'
" "
alt="" alt=""
style="width: 100%;;height:100%"
/> />
<p class="desc">
面向产业转型发展和区域经济社会需求，清控紫荆教育与地方院校进行专业共建。以深化产教深度融合，创新人才培养方案、课程体系、方式方法、保障机制等。促成课程内容与技术发展衔接、教学过程与生产过程对接、人才培养与产业需求融合。达到共同建设省市乃至国家级的一流学科。
</p>
</div>
<p style="font-size:16px;color:#424242;margin-bottom:21px">三大专业范畴，10余个特色专业方向。</p>
<div class="parts"> <div class="parts">
<div class="part"> <div class="part">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img16.png" alt="" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img16.png" alt="" />
...@@ -137,71 +181,175 @@ ...@@ -137,71 +181,175 @@
<img <img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img6.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image9.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img6.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image9.png'
" "
alt="" alt=""
/><img />
</div>
<div class="con-img-box" v-if="tabsActive === 1">
<div style="position:relative;width:900px;height:262px;margin-bottom:60px">
<img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img7.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image10.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img7.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image10.png'
" "
alt="" alt=""
/><img style="width: 100%;height:100%"
/>
<p class="desc">
紫荆教育数字经济产业学院SAAS平台（以下简称“ZJSAAS平台”）是由紫荆教育经过6年时间的教育科技实践，专门为与高校合作建立
数字经济产业学院而研发，以提高教学质量为目的，以数据科技为基础，
以学生为核心，100+功能模块涵盖信息宣传、学生管理、教师管理、教学内容管理、教学过程实施、课程实训以及实习就业等工作。
</p>
</div>
<img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img8.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image11.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img8.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image11.png'
" "
alt="" alt=""
/><img />
</div>
<div class="con-img-box" v-if="tabsActive === 2">
<div style="position:relative;width:900px;height:262px;margin-bottom:60px">
<img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img9.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image12.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img9.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image12.png'
" "
alt="" alt=""
/><img style="width: 100%;;height:100%"
/>
<p class="desc">
清控紫荆教育针对数字经济岗位要求，以培养学生综合职业能力为导向，结合学校数字经济专业实训条件，
提出了“引产入校、以产促教”的工学结合一体化人才培养思路，实施“边教、边做、边生产、边学习”。引
进企业产品生产任务，将一体化课程项目教学与实际产品生产相结合，灵活调整专业教学内容，安排学生参
与产品生产加工、市场推广运营、经营管理等环节。通过各种不同项目的教学和真实产品的生产经营，使学
生掌握各种岗位的技能与能力，了解企业经营生产组织方式、工艺流程、产品加工技术要求、市场推广、运
营管理等，形成必备的职业核心技能和素养。<br />清控紫荆教育追求深度融合，协同创新，充分发挥企业和学校在
产学融合中的作用，整合资源、优化结构，充分实现产学协同发展，培养高素质、高技能人才，并且形成独有的特色。
</p>
</div>
<img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img10.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image13.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img10.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image13.png'
" "
alt="" alt=""
/><img />
</div>
<div class="con-img-box" v-if="tabsActive === 3">
<div style="position:relative;width:900px;height:262px;margin-bottom:60px">
<img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img11.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image14.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img11.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image14.png'
" "
alt="" alt=""
/><img style="width: 100%;;height:100%"
/>
<p class="desc">
清控紫荆教育实习就业服务以专业课程导入为前提，分为实训、就业指导与实习上岗三个层次。完成学生和用人企业的无缝对接，达成“学位即岗位”的目标。
</p>
</div>
<p style="font-size:18px;font-weight:400;color:#000000;margin-bottom:20px">
企业人力资源用人模式的改变
</p>
<img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img12.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image15.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img12.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image15.png'
"
alt=""
/>
<p style="color: #777777;font-weight: 300;font-size: 14px;margin-bottom:40px">
清控紫荆教育的产业、企业、学校联动的方式，在降低企业人力资源成本的同时提升了学生在实战项目中的应用技能，最终达到产业人才培养的目的。
</p>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image16.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image16.png'
"
alt=""
/>
</div>
<div class="con-img-box" v-if="tabsActive === 4">
<div style="position:relative;width:900px;height:262px;margin-bottom:60px">
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image17.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image17.png'
"
alt=""
style="width: 100%;;height:100%"
/>
<p class="desc">
以新兴技术为基础，聚焦数字经济领域，清控紫荆教育汇集顶尖数字理论和应用研究专家，整合先进技术资源，通过产学研紧密
合作，建设成具有引领作用的创新型数字经济实验室，以案例作为实验室的核心要素，旨在创新技术研发、企业培育、校企合作培养专
业人才等方面发挥重要作用，为数字经济人才提供学习提升的平台与机会，强化产学研协作培养顶尖数字人才，助推国家人才发展战略。
</p>
</div>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image18.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image18.png'
"
alt=""
/>
</div>
<div class="con-img-box" v-if="tabsActive === 5">
<div style="position:relative;width:900px;height:262px;margin-bottom:60px">
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image19.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image19.png'
"
alt=""
style="width: 100%;;height:100%"
/>
<p class="desc">
以新兴技术为基础，聚焦数字经济领域，清控紫荆教育汇集顶尖数字理论和应用研究专家，整合先进技术资源，通过产学研紧密
合作，建设成具有引领作用的创新型数字经济实验室，以案例作为实验室的核心要素，旨在创新技术研发、企业培育、校企合作培养专
业人才等方面发挥重要作用，为数字经济人才提供学习提升的平台与机会，强化产学研协作培养顶尖数字人才，助推国家人才发展战略。
</p>
</div>
<img
:src="
$cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image20.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image20.png'
" "
alt="" alt=""
/><img /><img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img19.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image21.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img19.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image21.png'
" "
alt="" alt=""
/><img /><img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img20.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image22.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img20.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image22.png'
" "
alt="" alt=""
/><img /><img
:src=" :src="
$cookies.get('lang') == 'en-US' $cookies.get('lang') == 'en-US'
? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img15.png' ? 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image23.png'
: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/img15.png' : 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image23.png'
" "
alt="" alt=""
/> />
...@@ -231,10 +379,72 @@ export default { ...@@ -231,10 +379,72 @@ export default {
// name: '数字金融' // name: '数字金融'
} }
], ],
navList: [
{
name: '需求强劲',
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image51.png'
},
{
name: '瞄准痛点',
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image52.png'
},
{
name: '闭环服务',
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image53.png'
},
{
name: '长期共赢',
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image54.png'
}
],
tabsList: [
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image81.png',
name: '专业共建',
dec: '专业提升'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image82.png',
name: 'SAAS软件平台',
dec: '教学管理'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image83.png',
name: '引产入校',
dec: '实训基地'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image84.png',
name: '实习就业',
dec: '企业人力资源服务'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image85.png',
name: '数字经济实验室',
dec: '前沿案例'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/industry/image86.png',
name: '培训证书',
dec: '专业补充'
}
],
tabActive: 0,
tabsActive: 0,
showModule: 0 showModule: 0
} }
}, },
created() {
this.tabActive = 0
this.tabsActive = 0
},
methods: { methods: {
navActive(item, index) {
this.tabActive = index
},
tabsClick(item, index) {
this.tabsActive = index
},
tabChangeIndex(n) { tabChangeIndex(n) {
this.showModule = n this.showModule = n
} }
...@@ -277,6 +487,13 @@ export default { ...@@ -277,6 +487,13 @@ export default {
.module-1 { .module-1 {
.content-mian { .content-mian {
padding: 60px 50px 65px; padding: 60px 50px 65px;
.desc {
font-size: 14px;
font-weight: 300;
line-height: 28px;
color: #777777;
opacity: 1;
}
.m1-new-item { .m1-new-item {
.title { .title {
font-size: 22px; font-size: 22px;
...@@ -388,12 +605,69 @@ export default { ...@@ -388,12 +605,69 @@ export default {
margin-bottom: 50px; margin-bottom: 50px;
} }
} }
ul {
display: flex;
justify-content: flex-start;
align-items: center;
li {
list-style-type: disc;
padding: 15px;
margin-left: 25px;
color: #333;
font-size: 18px;
}
.li {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
width: 146px;
height: 146px;
opacity: 1;
background: #f4f4f4;
}
}
.active {
background: #ffffff;
border-top: 6px solid #a81840;
}
} }
} }
.module-2 { .module-2 {
ul {
display: flex;
justify-content: center;
align-items: center;
.li {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
width: 151px;
height: 156px;
background: #f4f4f4;
}
}
.active {
background: #ffffff;
border-top: 6px solid #a81840;
}
.content-mian { .content-mian {
padding: 60px 50px 65px; padding: 60px 50px 65px;
.con-img-box { .con-img-box {
.desc {
position: absolute;
top: 50%;
left: 98px;
right: 56px;
margin-top: -50px;
color: #fff;
line-height: 26px;
font-size: 14px;
font-weight: 300;
}
img { img {
display: block; display: block;
&:nth-child(1) { &:nth-child(1) {
...@@ -406,7 +680,7 @@ export default { ...@@ -406,7 +680,7 @@ export default {
} }
&:nth-child(3) { &:nth-child(3) {
width: 864px; width: 864px;
margin-bottom: 78px; // margin-bottom: 78px;
} }
} }
.parts { .parts {
...@@ -495,129 +769,6 @@ export default { ...@@ -495,129 +769,6 @@ export default {
} }
} }
} }
.module-3 {
.content-mian {
padding: 60px 50px 65px;
.con-img-box {
img {
width: 100%;
display: block;
&:nth-child(1) {
margin-bottom: 29px;
}
&:nth-child(2) {
margin-bottom: 75px;
}
}
}
.ul-tit {
font-size: 22px;
font-weight: 500;
line-height: 100%;
padding: 0 0 36px;
color: #424242;
}
.list1 {
display: flex;
flex-wrap: wrap;
li {
margin-right: 5px;
margin-bottom: 5px;
width: 220px;
height: 170px;
position: relative;
overflow: hidden;
&:hover {
img {
transform: scale(1.1);
}
}
&:nth-child(1) {
background: #f9f8f8;
text-align: center;
color: #aa1941;
div {
// width: 196px;
font-size: 22px;
font-weight: 400;
line-height: 28px;
margin-top: 58px;
margin-left: 12px;
}
}
img {
width: 100%;
height: 100%;
display: block;
transition: all 0.3s;
}
.pop-txt {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.3);
.name {
position: absolute;
bottom: 20px;
left: 20px;
font-size: 16px;
font-weight: 300;
color: #ffffff;
}
}
}
}
.list2 {
padding-top: 36px;
display: flex;
flex-wrap: wrap;
li {
margin-right: 5px;
margin-bottom: 5px;
width: 295px;
height: 170px;
position: relative;
overflow: hidden;
&:hover {
img {
transform: scale(1.1);
}
}
&:nth-child(1) {
background: #f9f8f8;
text-align: center;
line-height: 170px;
font-size: 22px;
color: #aa1941;
}
img {
width: 100%;
height: 100%;
display: block;
transition: all 0.3s;
}
.pop-txt {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.3);
.name {
position: absolute;
bottom: 20px;
left: 20px;
font-size: 16px;
font-weight: 300;
color: #ffffff;
}
}
}
}
}
}
} }
} }
</style> </style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论