Skip to content

M
ministers
Commit 067eb726 authored by 罗超's avatar 罗超
Browse files
Options

1

parent 69e39a7c
Hide whitespace changes
Inline Side-by-side
Showing with 668 additions and 262 deletions
quasar.conf.js
View file @ 067eb726
...@@ -48,8 +48,8 @@ module.exports = function (ctx) { ...@@ -48,8 +48,8 @@ module.exports = function (ctx) {
build: { build: {
vueRouterMode: 'hash', // available values: 'hash', 'history' vueRouterMode: 'hash', // available values: 'hash', 'history'
env: ctx.dev ? { env: ctx.dev ? {
// API: 'http://192.168.1.36:8300/api' API: 'http://192.168.1.36:8300/api'
API:'http://192.168.1.13:8085/api' // API:'http://192.168.1.13:8085/api'
} : { } : {
API: 'http://eduapi.oytour.com/api' API: 'http://eduapi.oytour.com/api'
}, },
......
src/components/footer/footer.vue
View file @ 067eb726
<template> <template>
<div class="footer"> <div class="footer">
<!-- <div class="absolute-top-left subFooter"> --> <!-- <div class="absolute-top-left subFooter"> -->
<q-img <q-img
src="../../assets/images/index/logo_bottom.png" src="../../assets/images/index/logo_bottom.png"
spinner-color="white" spinner-color="white"
class="class_icon6" class="class_icon6"
/> />
<div class="link"> <div class="link">
<span @click="jumpPage('')">留学服务</span> | <span @click="jumpPage()">就业服务</span> | <span @click="jumpPage()">甲鹤团队</span> | <span @click="jumpPage()">关于甲鹤</span> | <span @click="jumpPage()">联系我们</span> <span @click="jumpPage('')">留学服务</span> |
</div> <span @click="jumpPage()">就业服务</span> |
<div class="copyright"> <span @click="jumpPage()">甲鹤团队</span> |
CopyRight © 2018 www.023.cn. All Rights Reserved <span @click="jumpPage()">关于甲鹤</span> |
</div> <span @click="jumpPage()">联系我们</span>
<!-- </div> --> </div>
<div class="copyright">
CopyRight © 2021 甲鹤教育集团. All Rights Reserved 蜀ICP备2021008812号
</div>
<!-- </div> -->
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data(){ data() {
return{ return {};
}
}, },
methods:{ methods: {
jumpPage(url){ jumpPage(url) {
this.$router.push(url) this.$router.push(url);
} },
} },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.footer { .footer {
...@@ -63,6 +65,7 @@ export default { ...@@ -63,6 +65,7 @@ export default {
top: 20.729vw; top: 20.729vw;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
opacity: 0.6;
} }
} }
</style> </style>
\ No newline at end of file
src/components/footer/footerType2.vue
View file @ 067eb726
<template> <template>
<div class="footer"> <div class="footer">
<q-img <q-img
src="../../assets/images/index/logo_bottom.png" src="../../assets/images/index/logo_bottom.png"
spinner-color="white" spinner-color="white"
class="jh_icon" class="jh_icon"
/> />
<div class="link"> <div class="link">
<span @click="jumpPage('')">留学服务</span> | <span @click="jumpPage('')">留学服务</span> |
<span @click="jumpPage()">就业服务</span> | <span @click="jumpPage()">就业服务</span> |
<span @click="jumpPage()">甲鹤团队</span> | <span @click="jumpPage()">甲鹤团队</span> |
<span @click="jumpPage()">关于甲鹤</span> | <span @click="jumpPage()">关于甲鹤</span> |
<span @click="jumpPage()">联系我们</span> <span @click="jumpPage()">联系我们</span>
</div> </div>
<div class="copyright"> <div class="copyright">
CopyRight © 2018 www.023.cn. All Rights Reserved CopyRight © 2021 甲鹤教育集团. All Rights Reserved 蜀ICP备2021008812号
</div> </div>
<q-img <q-img
src="../../assets/images/index/logo_bottom.png" src="../../assets/images/index/logo_bottom.png"
spinner-color="white" spinner-color="white"
class="ewm_icon" class="ewm_icon"
/> />
<q-img <q-img
src="../../assets/images/index/logo_bottom.png" src="../../assets/images/index/logo_bottom.png"
spinner-color="white" spinner-color="white"
class="mini_icon" class="mini_icon"
/> />
</div> </div>
</template> </template>
<script> <script>
...@@ -43,7 +43,7 @@ export default { ...@@ -43,7 +43,7 @@ export default {
.footer { .footer {
width: 100%; width: 100%;
height: 14.062vw; height: 14.062vw;
background-color: #EDEDED; background-color: #ededed;
position: relative; position: relative;
.jh_icon { .jh_icon {
...@@ -71,6 +71,7 @@ export default { ...@@ -71,6 +71,7 @@ export default {
position: absolute; position: absolute;
top: 7.916vw; top: 7.916vw;
left: 26.562vw; left: 26.562vw;
opacity: 0.6;
} }
.ewm_icon { .ewm_icon {
width: 5.781vw; width: 5.781vw;
......
src/components/header/header.vue
View file @ 067eb726
...@@ -10,7 +10,6 @@ ...@@ -10,7 +10,6 @@
:class="{ :class="{
header_absolute: scorllNum < 300, header_absolute: scorllNum < 300,
header_fixed: scorllNum >= 300, header_fixed: scorllNum >= 300,
}" }"
> >
<div class="row items-center full-height"> <div class="row items-center full-height">
...@@ -40,18 +39,14 @@ ...@@ -40,18 +39,14 @@
</div> </div>
</div> </div>
<div <div class="type2 " v-if="type == 2">
class="type2" <div class="row items-center full-height navImg" >
v-if="type == 2"
>
<div class="row items-center full-height" >
<div class="col navImg"> <div class="col navImg">
<img style="height: 61px" src="../../assets/images/logo.png" /> <img style="height: 50px" src="../../assets/images/logo.png" />
</div> </div>
<div class="col"> <div class="col">
<q-tabs <q-tabs
v-model="tab" v-model="tab"
class="text-dark"
active-color="dark" active-color="dark"
align="justify" align="justify"
narrow-indicator narrow-indicator
...@@ -82,9 +77,9 @@ export default { ...@@ -82,9 +77,9 @@ export default {
typeof: Array, typeof: Array,
default: [], default: [],
}, },
curMenu:{ curMenu: {
typeof:String, typeof: String,
default:"首页" default: "首页",
}, },
type: { type: {
typeof: Number, typeof: Number,
...@@ -93,13 +88,13 @@ export default { ...@@ -93,13 +88,13 @@ export default {
}, },
data() { data() {
return { return {
tab:this.curMenu tab: this.curMenu,
}; };
}, },
watch:{ watch: {
curMenu(val){ curMenu(val) {
this.tab=val this.tab = val;
} },
}, },
methods: { methods: {
jumpPage(url) { jumpPage(url) {
...@@ -138,15 +133,18 @@ export default { ...@@ -138,15 +133,18 @@ export default {
font-family: "pingfang-b" !important; font-family: "pingfang-b" !important;
} }
} }
.type2{ .type2 {
background-color: #fff;
.items-nav .q-tab__label { .items-nav .q-tab__label {
font-size: 16px !important; font-size: 16px !important;
font-family: "pingfang-b" !important; font-family: "pingfang-b" !important;
} }
} }
.navImg{ .navImg {
margin-left:3.125vw; height: 60px;
margin-left: 3.125vw;
display: flex; display: flex;
align-items: center; align-items: center;
background-color: #fff;
} }
</style> </style>
\ No newline at end of file
src/components/teacherTeam/teacherTeam.vue
View file @ 067eb726
...@@ -133,7 +133,7 @@ export default { ...@@ -133,7 +133,7 @@ export default {
width: 13.541vw !important; width: 13.541vw !important;
height: 18.333vw; height: 18.333vw;
// border: 1px solid #eee; // border: 1px solid #eee;
box-shadow: 0px 6px 10px 0px rgba(116, 116, 116, 0.1); box-shadow: 0px 6px 10px 0px rgba(116, 116, 116, 0.1) inset;
background-color: #ffffff; background-color: #ffffff;
padding: 2.86vw 1.458vw; padding: 2.86vw 1.458vw;
display: flex; display: flex;
......
src/pages/JapaneseTrain/JapaneseTrain.vue
View file @ 067eb726
...@@ -2,7 +2,23 @@ ...@@ -2,7 +2,23 @@
<div class="jiahe"> <div class="jiahe">
<Header :menuList="menuList" :curMenu="menuList[1].Name" :type="2" /> <Header :menuList="menuList" :curMenu="menuList[1].Name" :type="2" />
<!-- bannner部分 --> <!-- bannner部分 -->
<Banner :swiperList="swiperData" /> <div
class="JapaneseTrainBannerBox"
:style="{ backgroundImage: 'url(' + swiperData[0].BgImg + ')' }"
>
<div class="conbox">
<div class="con1">
<span class="jh">甲鹤</span>-{{ swiperData[0].NavTitle }}
</div>
<div class="con2">
{{ swiperData[0].SubTitle }}
<!-- 这里给一点小文字介绍什么的最好，这里给一点小文字介绍什么的最好，这里给一点
小文字介绍什么的最好。 -->
</div>
<div class="con3"></div>
<div class="btn" @click="seeMore(swiperData[0].LinkUrl)">查看更多</div>
</div>
</div>
<!-- 教育产品 --> <!-- 教育产品 -->
<div class="edu_con"> <div class="edu_con">
<div class="edu_name">教育产品</div> <div class="edu_name">教育产品</div>
...@@ -56,7 +72,7 @@ ...@@ -56,7 +72,7 @@
> >
查看更多 查看更多
</div> </div>
<NoData v-if="courseList.length==0"></NoData> <NoData v-if="courseList.length == 0"></NoData>
</div> </div>
<!-- 开班计划 --> <!-- 开班计划 -->
<div class="edu_con"> <div class="edu_con">
...@@ -80,7 +96,7 @@ ...@@ -80,7 +96,7 @@
<!-- 根据系列选课程 --> <!-- 根据系列选课程 -->
<div class="inputBorder2"> <div class="inputBorder2">
<q-select <q-select
label="可查询课程名称" label="可查询班级名称"
outlined outlined
v-model="classSelectCourseName" v-model="classSelectCourseName"
:options="courseNameOption" :options="courseNameOption"
...@@ -149,65 +165,78 @@ ...@@ -149,65 +165,78 @@
</div> </div>
<div class="infoBox4"> <div class="infoBox4">
<div class="title">咨询客服</div> <div class="title">咨询客服</div>
<div class="consultBtn" @click="show(item.ClassId)">去咨询</div> <div class="consultBtn" @click="show(item.ClassId)">
<img
src="../../assets/images/JapaneseTrain/kefu_icon.png"
style="width: 0.833vw; height: auto"
alt=""
/>
去咨询
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="seemore" v-if="classPlanList.length > 0" @click="seeMore('/classPlanList')">查看更多</div> <div
<NoData v-if="classPlanList.length==0"></NoData> class="seemore"
v-if="classPlanList.length > 0"
@click="seeMore('/classPlanList')"
>
查看更多
</div>
<NoData v-if="classPlanList.length == 0"></NoData>
</div> </div>
<template> <template>
<q-dialog ref="dialog" @hide="onDialogHide"> <q-dialog ref="dialog" @hide="onDialogHide">
<q-card class="q-dialog-plugin"> <q-card class="q-dialog-plugin">
<div class="q-pa-md" style="max-width: 400px"> <div class="q-pa-md" style="max-width: 400px">
<q-form @submit="onSubmit" @reset="onReset" class="q-gutter-md"> <q-form @submit="onSubmit" @reset="onReset" class="q-gutter-md">
<q-input
filled
ref="name"
v-model="advisorymsg.LinkMan"
label="联系人"
lazy-rules
:rules="[(val) => (val && val.length > 0) || '请输入联系人']"
/>
<q-input
filled
ref="phone"
v-model="advisorymsg.LinkTel"
label="联系电话"
mask="###########"
lazy-rules
:rules="[
(val) => (val && val.length === 11) || '请输入11位联系电话',
]"
/>
<div style="max-width: 400px">
<q-input <q-input
label="备注"
v-model="advisorymsg.Remark"
filled filled
ref="name" type="textarea"
v-model="advisorymsg.LinkMan"
label="联系人"
lazy-rules
:rules="[(val) => (val && val.length > 0) || '请输入联系人']"
/> />
<q-input </div>
filled <div>
ref="phone" <q-btn label="提交" type="Submit" color="primary" />
v-model="advisorymsg.LinkTel" <q-btn
label="联系电话" label="重置"
mask="###########" type="reset"
lazy-rules color="primary"
:rules="[ flat
(val) => (val && val.length === 11) || '请输入11位联系电话', class="q-ml-sm"
]"
/> />
<div style="max-width: 400px"> </div>
<q-input </q-form>
label="备注" </div>
v-model="advisorymsg.Remark" <!-- 按钮示例 -->
filled <q-card-actions align="right">
type="textarea" <!-- <q-btn color="primary" label="OK" @click="onOKClick" />-->
/> <q-btn color="primary" label="关闭" @click="onCancelClick" />
</div> </q-card-actions>
<div> </q-card>
<q-btn label="提交" type="Submit" color="primary" /> </q-dialog>
<q-btn </template>
label="重置"
type="reset"
color="primary"
flat
class="q-ml-sm"
/>
</div>
</q-form>
</div>
<!-- 按钮示例 -->
<q-card-actions align="right">
<!-- <q-btn color="primary" label="OK" @click="onOKClick" />-->
<q-btn color="primary" label="关闭" @click="onCancelClick" />
</q-card-actions>
</q-card>
</q-dialog>
</template>
<!-- 教师团队 --> <!-- 教师团队 -->
<TeacherTeam :viewNum="4" :teacherList="teacherList" /> <TeacherTeam :viewNum="4" :teacherList="teacherList" />
<!-- 底部 --> <!-- 底部 -->
...@@ -217,7 +246,7 @@ ...@@ -217,7 +246,7 @@
<script> <script>
import Header from "../../components/header/header"; import Header from "../../components/header/header";
import Footer from "../../components/footer/footerType2"; import Footer from "../../components/footer/footerType2";
import Banner from "../../components/banner/banner"; // import Banner from "../../components/banner/banner";
import TeacherTeam from "../../components/teacherTeam/teacherTeam"; import TeacherTeam from "../../components/teacherTeam/teacherTeam";
import NoData from "../../components/noData/noData"; import NoData from "../../components/noData/noData";
import { getWebNavList } from "../../api/indexApi.js"; import { getWebNavList } from "../../api/indexApi.js";
...@@ -227,15 +256,15 @@ import { ...@@ -227,15 +256,15 @@ import {
getClassPlan, getClassPlan,
getCourseList, getCourseList,
getWebTeacherList, getWebTeacherList,
addWebAdvisory addWebAdvisory,
} from "../../api/JapaneseTrainApi"; } from "../../api/JapaneseTrainApi";
export default { export default {
components: { components: {
Header, Header,
Footer, Footer,
Banner, // Banner,
TeacherTeam, TeacherTeam,
NoData NoData,
}, },
data() { data() {
return { return {
...@@ -245,7 +274,7 @@ export default { ...@@ -245,7 +274,7 @@ export default {
Name: "", Name: "",
}, },
], ],
swiperData: [], swiperData: [{ BgImg: "", NavTitle: "", SubTitle: "",LinkUrl:"" }],
selectCourseText: "", //课程系列选择框 selectCourseText: "", //课程系列选择框
classSelectSeries: "", classSelectSeries: "",
classSelectCourseName: "", classSelectCourseName: "",
...@@ -359,7 +388,7 @@ export default { ...@@ -359,7 +388,7 @@ export default {
let res = await getWebTeacherList(1); let res = await getWebTeacherList(1);
this.teacherList = res.Data.map((item) => { this.teacherList = res.Data.map((item) => {
item.showDetail = false; item.showDetail = false;
return item return item;
}); });
}, },
//对话框 //对话框
...@@ -410,7 +439,7 @@ export default { ...@@ -410,7 +439,7 @@ export default {
color: "positive", color: "positive",
message: res.Message, message: res.Message,
}); });
this.hide() this.hide();
} }
}, },
}, },
...@@ -430,7 +459,56 @@ export default { ...@@ -430,7 +459,56 @@ export default {
height: 100%; height: 100%;
background-color: #f6f6f6; background-color: #f6f6f6;
} }
.JapaneseTrainBannerBox {
width: 100%;
height: 39.0625vw;
// background-image: url("../../assets/images/aboutUs/aboutUsBanner.png");
background-repeat: no-repeat;
background-size: contain;
position: relative;
.conbox {
position: absolute;
top: 9.635vw;
left: 10.208vw;
}
.con1 {
width: calc(845 / 1920 * 100%);
white-space: nowrap;
// font-size: 100px;
font-size: 5.208vw;
color: #111111;
margin-bottom: 3.125vw;
.jh {
font-family: "pingfang-b" !important;
}
}
.con2 {
width: 38.489vw;
font-size: 20px !important;
font-size: 1.041vw;
color: #111111;
padding-bottom: 3.593vw;
}
.con3 {
width: 31.041vw;
height: 1px;
background-color: #111111;
margin-bottom: 4.01vw;
}
.btn {
width: 9.375vw;
height: 2.916vw;
background-color: #45766dff;
// font-size: 24px !important;
font-size: 1.249vw;
color: #ffffff;
display: flex;
justify-content: center;
align-items: center;
white-space: nowrap;
cursor: pointer;
}
}
.edu_con { .edu_con {
width: 62.5vw; width: 62.5vw;
margin: 5.516vw auto 0; margin: 5.516vw auto 0;
...@@ -519,9 +597,10 @@ export default { ...@@ -519,9 +597,10 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
font-size: 1.25vw; font-size: 1.25vw;
// font-family: PingFang SC; font-family: PingFang SC;
// font-weight: 500; font-weight: 500;
color: #ffffff; color: #ffffff;
cursor: pointer;
} }
.classPlanItemBox { .classPlanItemBox {
width: 100%; width: 100%;
...@@ -597,6 +676,7 @@ export default { ...@@ -597,6 +676,7 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin-top: 0.52vw; margin-top: 0.52vw;
cursor: pointer;
} }
} }
} }
......
src/pages/JapaneseTrain/classPlanList.vue
View file @ 067eb726
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
<!-- 根据系列选课程 --> <!-- 根据系列选课程 -->
<div class="inputBorder2"> <div class="inputBorder2">
<q-select <q-select
label="可查询课程名称" label="可查询班级名称"
outlined outlined
v-model="classSelectCourseName" v-model="classSelectCourseName"
:options="courseNameOption" :options="courseNameOption"
...@@ -93,7 +93,9 @@ ...@@ -93,7 +93,9 @@
</div> </div>
<div class="infoBox4"> <div class="infoBox4">
<div class="title">咨询客服</div> <div class="title">咨询客服</div>
<div class="consultBtn" @click="show(item.ClassId)">去咨询</div> <div class="consultBtn" @click="show(item.ClassId)">
<img src="../../assets/images/JapaneseTrain/kefu_icon.png" style="width:0.833vw;height:auto " alt="">
去咨询</div>
</div> </div>
</div> </div>
</div> </div>
......
src/pages/JapaneseTrain/eduProductDetail.vue
View file @ 067eb726
...@@ -11,7 +11,9 @@ ...@@ -11,7 +11,9 @@
<div class="name">{{ courseDetail.CourseName }}</div> <div class="name">{{ courseDetail.CourseName }}</div>
<div class="line"></div> <div class="line"></div>
<div class="desc" v-html="courseDetail.CourseIntro"></div> <div class="desc" v-html="courseDetail.CourseIntro"></div>
<div class="consult" @click="show">立即咨询</div> <div class="consult" @click="show">
<img src="../../assets/images/JapaneseTrain/kefu_icon.png" style="width:1.458vw;height:auto;marginRight:0.5vw" alt="">
立即咨询</div>
</div> </div>
</div> </div>
<!-- 对话框 --> <!-- 对话框 -->
......
src/pages/aboutUs/aboutUs.vue
View file @ 067eb726
...@@ -2,8 +2,23 @@ ...@@ -2,8 +2,23 @@
<div class="jiahe"> <div class="jiahe">
<Header :menuList="menuList" :curMenu="menuList[5].Name" :type="2" /> <Header :menuList="menuList" :curMenu="menuList[5].Name" :type="2" />
<!-- bannner部分 --> <!-- bannner部分 -->
<Banner :swiperList="swiperData" /> <!-- <Banner :swiperList="swiperData" /> -->
<div
class="aboutUsBannerBox"
:style="{ backgroundImage: 'url(' + swiperData[0].BgImg + ')' }"
>
<div class="banner_title">
<span class="jh">甲鹤</span>-{{ swiperData[0].NavTitle }}
</div>
<div class="line"></div>
<div class="aboutUs_desc">
<!-- 甲鹤外国语培训学校地处四川省成都市中心区，与四川大学，四川音乐学院比隣。拥有来自北京外国语大学、四川大学、四川外国语大学、日本东京工业大学、筑波大学、日本早稻田大学等国内外知名高校的一流教师团队。
学校与日本朝日大学、宇都宫共和大学、东京福祉大学、樱美林大学等日本高校建立了合作关系。本校学生日语达N2便可以直接推荐保送进入上述各大学就读本科专业。想要选择日本其他国、公、私立大学的学员，学校亦可推荐一流的日本语学校以及私塾。
学校凭借10年累积，不仅与日本知名大学长期合作；并且向日本IT企业和日本旅行社输送各类人才。与日本政界、学界、商界均保持良好合作关系。
学校依托日本丰富的教学资源优势，致力于国内高品质的教学，为甲鹤学生提供日语培训、日本留学、日企就业的一站式人生规划方案。我们以一流的师资团队，优雅的教学环境以及雄厚的留学就业资源将甲鹤日语打造成中国最专业的日语培训一流品牌。 -->
{{ swiperData[0].SubTitle }}
</div>
</div>
<div class="main"> <div class="main">
<!-- 董事长 --> <!-- 董事长 -->
<div class="imgBox"></div> <div class="imgBox"></div>
...@@ -58,14 +73,15 @@ export default { ...@@ -58,14 +73,15 @@ export default {
Name: "", Name: "",
}, },
], ],
swiperData: [], swiperData: [{ BgImg: "", NavTitle: "", SubTitle: "" }],
}; };
}, },
methods: { methods: {
//获取网站导航列表（swiper） //获取网站导航列表
async getWebNavList() { async getWebNavList() {
let res = await getWebNavList(6); let res = await getWebNavList(6);
this.swiperData = res.Data; this.swiperData = res.Data;
console.log(this.swiperData);
}, },
initMap() { initMap() {
let map = new BMap.Map("mapcontainer"); // 创建Map实例 let map = new BMap.Map("mapcontainer"); // 创建Map实例
...@@ -87,6 +103,40 @@ export default { ...@@ -87,6 +103,40 @@ export default {
.jiahe { .jiahe {
background-color: #f6f6f6; background-color: #f6f6f6;
} }
.aboutUsBannerBox {
width: 100%;
height: 52.08vw;
// background-image: url("../../assets/images/aboutUs/aboutUsBanner.png");
background-repeat: no-repeat;
background-size: contain;
// display: flex;
// align-items: center;
padding-left: 10.208vw;
.banner_title {
padding-top: 9.635vw;
font-size: 5.208vw;
color: #111111;
.jh {
font-family: "pingfang-b" !important;
}
}
.line {
margin-top: 2vw;
margin-bottom: 2vw;
width: 31vw;
height: 1px;
background-color: #111111;
}
.aboutUs_desc {
width: 42.708vw;
max-height: 20vw;
overflow: hidden;
font-size: 1.041vw;
font-family: PingFang SC;
// font-weight: 500;
color: #111111;
}
}
.main { .main {
width: 62.5vw; width: 62.5vw;
height: 41.817vw; height: 41.817vw;
...@@ -96,7 +146,10 @@ export default { ...@@ -96,7 +146,10 @@ export default {
.imgBox { .imgBox {
width: 33.854vw; width: 33.854vw;
height: 41.817vw; height: 41.817vw;
background-color: #000; // background-color: #000;
background-image: url("../../assets/images/index/chairman_img.png");
background-repeat: no-repeat;
background-size: contain;
} }
.descBox { .descBox {
padding-top: 7.187vw; padding-top: 7.187vw;
...@@ -162,7 +215,7 @@ export default { ...@@ -162,7 +215,7 @@ export default {
color: #111111; color: #111111;
margin-bottom: 0.2vw; margin-bottom: 0.2vw;
} }
.contactUs_con{ .contactUs_con {
font-size: 0.625vw; font-size: 0.625vw;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
color: #666666; color: #666666;
......
src/pages/index.vue
View file @ 067eb726
...@@ -25,13 +25,13 @@ ...@@ -25,13 +25,13 @@
:name="item.NavTypeName" :name="item.NavTypeName"
:img-src="item.BgImg" :img-src="item.BgImg"
> >
<div class="con1"> <div class="con1">
<span class="jh">{{ item.NavTitle }}</span><!--您身边的日语--> <span class="jh">{{ item.NavTitle }}</span
</div> ><!--您身边的日语-->
<div class="con2">{{ item.SubTitle }} </div>
</div> <div class="con2">{{ item.SubTitle }}</div>
<div class="con3"></div> <div class="con3"></div>
<div class="btn" @click="goDetail(item.LinkUrl)">查看详情</div> <div class="btn" @click="goDetail(item.LinkUrl)">查看详情</div>
<q-img <q-img
src="../assets/images/index/female.png" src="../assets/images/index/female.png"
spinner-color="white" spinner-color="white"
...@@ -42,9 +42,8 @@ ...@@ -42,9 +42,8 @@
</q-carousel> </q-carousel>
</div> </div>
</div> </div>
<!-- 第二部分 日语培训--> <!-- 日语培训-->
<div class="secondbox"> <div class="secondbox">
<div class="absolute-top-left subSecondbox">
<q-img <q-img
src="../assets/images/index/class_icon.png" src="../assets/images/index/class_icon.png"
spinner-color="white" spinner-color="white"
...@@ -59,8 +58,9 @@ ...@@ -59,8 +58,9 @@
/> />
<div class="class_title">日标基础课</div> <div class="class_title">日标基础课</div>
<div class="class_dec"> <div class="class_dec">
要是能有一些日标基础课程的小讲解就很好 要是能有一些日标基础课程的小讲解就很好<br/>
了，能丰富我们的页面要是能有一些 日标基础课程的小讲解就 了，能丰富我们的页面要是能有一些<br/>
日标基础课程的小讲解就
</div> </div>
<q-img <q-img
src="../assets/images/index/class_icon6.png" src="../assets/images/index/class_icon6.png"
...@@ -76,8 +76,8 @@ ...@@ -76,8 +76,8 @@
/> />
<div class="class_title">日语口语课</div> <div class="class_title">日语口语课</div>
<div class="class_dec"> <div class="class_dec">
要是能有一些日标基础课程的小讲解就很好 要是能有一些日标基础课程的小讲解就很好<br/>
了，能丰富我们的页面要是能有一些 日标基础课程的小讲解就 了，能丰富我们的页面要是能有一些<br/> 日标基础课程的小讲解就
</div> </div>
<q-img <q-img
src="../assets/images/index/class_icon7.png" src="../assets/images/index/class_icon7.png"
...@@ -93,8 +93,8 @@ ...@@ -93,8 +93,8 @@
/> />
<div class="class_title">留学日语课</div> <div class="class_title">留学日语课</div>
<div class="class_dec"> <div class="class_dec">
要是能有一些日标基础课程的小讲解就很好 要是能有一些日标基础课程的小讲解就很好<br/>
了，能丰富我们的页面要是能有一些 日标基础课程的小讲解就 了，能丰富我们的页面要是能有一些<br/> 日标基础课程的小讲解就
</div> </div>
<q-img <q-img
src="../assets/images/index/class_icon8.png" src="../assets/images/index/class_icon8.png"
...@@ -110,8 +110,8 @@ ...@@ -110,8 +110,8 @@
/> />
<div class="class_title">企业日语课</div> <div class="class_title">企业日语课</div>
<div class="class_dec"> <div class="class_dec">
要是能有一些日标基础课程的小讲解就很好 要是能有一些日标基础课程的小讲解就很好<br/>
了，能丰富我们的页面要是能有一些 日标基础课程的小讲解就 了，能丰富我们的页面要是能有一些<br/> 日标基础课程的小讲解就
</div> </div>
<q-img <q-img
src="../assets/images/index/class_icon9.png" src="../assets/images/index/class_icon9.png"
...@@ -127,8 +127,8 @@ ...@@ -127,8 +127,8 @@
/> />
<div class="class_title">同声传译</div> <div class="class_title">同声传译</div>
<div class="class_dec"> <div class="class_dec">
要是能有一些日标基础课程的小讲解就很好 要是能有一些日标基础课程的小讲解就很好<br/>
了，能丰富我们的页面要是能有一些 日标基础课程的小讲解就 了，能丰富我们的页面要是能有一些<br/> 日标基础课程的小讲解就
</div> </div>
<q-img <q-img
src="../assets/images/index/class_icon10.png" src="../assets/images/index/class_icon10.png"
...@@ -137,10 +137,9 @@ ...@@ -137,10 +137,9 @@
/> />
</div> </div>
</div> </div>
</div>
</div> </div>
<!-- 第三部分 留学服务--> <!-- 留学服务-->
<div class="threebox" @mouseleave="movemask(0)"> <div class="threebox" @mouseleave="movemask(0)" ref="studyServe">
<div class="absolute-top-left subThreeBox"> <div class="absolute-top-left subThreeBox">
<q-img <q-img
src="../assets/images/index/study_serve.png" src="../assets/images/index/study_serve.png"
...@@ -148,7 +147,7 @@ ...@@ -148,7 +147,7 @@
class="class_icon3" class="class_icon3"
/> />
<div <div
class="threeItem" class="threeItem threeItem1"
style="position: relative" style="position: relative"
@mouseenter="movemask(1)" @mouseenter="movemask(1)"
> >
...@@ -159,6 +158,7 @@ ...@@ -159,6 +158,7 @@
:to="schoolResource" :to="schoolResource"
duration="2000" duration="2000"
easing="easeOutQuad" easing="easeOutQuad"
ref="myNum1"
></animate-number> ></animate-number>
+ +
</div> </div>
...@@ -170,12 +170,12 @@ ...@@ -170,12 +170,12 @@
></div> ></div>
</div> </div>
<div <div
class="threeItem" class="threeItem threeItem2"
style="position: relative" style="position: relative"
@mouseenter="movemask(2)" @mouseenter="movemask(2)"
> >
<div class="itemIconBox"> <div class="itemIconBox">
<div v-for="item in schoolIconList" :key="item.id"> <!-- <div v-for="item in schoolIconList" :key="item.id">
<img <img
:src="item.url" :src="item.url"
class="schoolIcon1" class="schoolIcon1"
...@@ -200,15 +200,28 @@ ...@@ -200,15 +200,28 @@
:style="{ top: item.top + 'vw', left: item.left + 'vw' }" :style="{ top: item.top + 'vw', left: item.left + 'vw' }"
v-if="item.type == 4" v-if="item.type == 4"
/> />
</div> -->
<div class="outside">
<div class="inner">
<animate-number
from="1"
:to="masterSchoolResource"
duration="2000"
easing="easeOutQuad"
ref="myNum2"
></animate-number>
+
</div> </div>
</div> </div>
<div class="itemName">硕士院校资源</div>
</div>
<div <div
class="mask" class="mask"
:class="{ removeMask: currentMaskIndex == 2 }" :class="{ removeMask: currentMaskIndex == 2 }"
></div> ></div>
</div> </div>
<div <div
class="threeItem" class="threeItem threeItem3"
style="position: relative" style="position: relative"
@mouseenter="movemask(3)" @mouseenter="movemask(3)"
> >
...@@ -219,7 +232,7 @@ ...@@ -219,7 +232,7 @@
:to="major" :to="major"
duration="2000" duration="2000"
easing="easeOutQuad" easing="easeOutQuad"
ref="myNum" ref="myNum3"
></animate-number> ></animate-number>
+ +
</div> </div>
...@@ -231,7 +244,7 @@ ...@@ -231,7 +244,7 @@
></div> ></div>
</div> </div>
<div <div
class="threeItem" class="threeItem threeItem4"
style="position: relative" style="position: relative"
@mouseenter="movemask(4)" @mouseenter="movemask(4)"
> >
...@@ -242,6 +255,7 @@ ...@@ -242,6 +255,7 @@
:to="servePeopleNum" :to="servePeopleNum"
duration="2000" duration="2000"
easing="easeOutQuad" easing="easeOutQuad"
ref="myNum4"
></animate-number> ></animate-number>
+ +
</div> </div>
...@@ -254,7 +268,7 @@ ...@@ -254,7 +268,7 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 第四部分 就业服务--> <!-- 就业服务-->
<div class="fourbox"> <div class="fourbox">
<div class="absolute-top-left subFourBox"> <div class="absolute-top-left subFourBox">
<q-img <q-img
...@@ -268,34 +282,63 @@ ...@@ -268,34 +282,63 @@
class="class_icon4 class_icon4_2" class="class_icon4 class_icon4_2"
/> />
<div class="workItemBox workItemBox_1"> <div class="workItemBox workItemBox_1">
<q-img src="" class="class_icon4_all" /> <q-img
src="../assets/images/index/work_bg1.png"
class="class_icon4_all"
/>
<div class="workType">酒店</div> <div class="workType">酒店</div>
</div> </div>
<div class="workItemBox workItemBox_2"> <div class="workItemBox workItemBox_2">
<q-img src="" class="class_icon4_all" /> <q-img
src="../assets/images/index/work_bg2.png"
class="class_icon4_all"
/>
<div class="workType">餐厅</div> <div class="workType">餐厅</div>
</div> </div>
<div class="workItemBox workItemBox_3"> <div class="workItemBox workItemBox_3">
<q-img src="" class="class_icon4_all" /> <q-img
src="../assets/images/index/work_bg3.png"
class="class_icon4_all"
/>
<div class="workType">IT</div> <div class="workType">IT</div>
</div> </div>
<div class="workItemBox workItemBox_4"> <div class="workItemBox workItemBox_4">
<q-img src="" class="class_icon4_all" /> <q-img
src="../assets/images/index/work_bg4.png"
class="class_icon4_all"
/>
<div class="workType">康养</div> <div class="workType">康养</div>
</div> </div>
</div> </div>
</div> </div>
<!-- 第五部分 董事长--> <!-- 董事长-->
<div class="fivebox"> <div class="fivebox">
<div class="absolute-top-left subFiveBox"> <!-- <div class="absolute-top-left subFiveBox"> -->
<q-img <q-img
src="../assets/images/index/chairman.png" src="../assets/images/index/chairman.png"
spinner-color="white" spinner-color="white"
class="class_icon5" class="class_icon5"
/> />
<div class="chairman_img"></div> <q-img
<div class="chairman_des"></div> src="../assets/images/index/chairman_img.png"
</div> spinner-color="white"
class="chairman_img"
/>
<div class="chairman_desc">
<div class="chairman_desc1">
致力于培养具有国际视野，胸怀祖国人民。热爱世界和平，精通语言专业知识。拥有跨文化交际能力的国际型人才
</div>
<div class="chairman_desc2">
甲鹤外国语培训学校地处四川省成都市中心区与四川大学，四川音乐学院比隣。<br />
拥有来自北京外国语大学、四川大学、东京工业大学、筑波大学、早稻田大学等国内外知名高校的一流教师团队
学校凭借20年累积,已经与日本朝日大学、宇都宫共和大学、东京福祉大学、樱美林大学等日本高校建立了合作关系<br/>
学校不仅与日本知名大学长期合作；并且向日本和中国IT企业、酒店、旅行社等行业输送各类我校培养的人才
与日本政界、学界、商界均保持良好合作关系。学校依托日本丰富的教学资源优势，致力于国内高品质的教学
为甲鹤学生提供日语培训、日本留学、日企就业的一站式人生规划方案<br />
我们以一流的师资团队，优雅的教学环境以及雄厚的留学就业资源将甲鹤日语打造成中国最专业的日语培训一流品牌
</div>
</div>
<!-- </div> -->
</div> </div>
<!-- 底部 --> <!-- 底部 -->
<Footer /> <Footer />
...@@ -318,8 +361,9 @@ export default { ...@@ -318,8 +361,9 @@ export default {
pageScroll: 0, pageScroll: 0,
activeIdx: 1, activeIdx: 1,
schoolResource: 100, //本科院校资源 schoolResource: 100, //本科院校资源
masterSchoolResource:100,//硕士院校资源
major: 300, //可选专业 major: 300, //可选专业
servePeopleNum: 300, //服务人数 servePeopleNum: 900, //服务人数
schoolIconList: [ schoolIconList: [
// 第一排 // 第一排
{ {
...@@ -616,14 +660,22 @@ export default { ...@@ -616,14 +660,22 @@ export default {
}, },
methods: { methods: {
// 滚动条高度 // 监听滚动条高度
handleScroll() { handleScroll() {
this.pageScroll = this.pageScroll =
document.documentElement.scrollTop || document.body.scrollTop; document.documentElement.scrollTop || document.body.scrollTop;
let elTop = this.$refs.studyServe.getBoundingClientRect().top;
if (elTop < 660 && elTop > 550) {
this.startAnimate();
}
}, },
//第三部分递增效果 //留学服务数字滚动效果
startAnimate() { startAnimate() {
// this.$refs.myNum.start() this.$refs.myNum1.start();
this.$refs.myNum2.start();
this.$refs.myNum3.start();
this.$refs.myNum4.start();
return;
}, },
movemask(i) { movemask(i) {
this.currentMaskIndex = i; this.currentMaskIndex = i;
...@@ -730,12 +782,11 @@ export default { ...@@ -730,12 +782,11 @@ export default {
} }
.secondbox { .secondbox {
width: 100%; width: 100%;
padding-top: calc(1080 / 1920 * 100%); height: 56.25vw;
position: relative; position: relative;
.subSecondbox {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding-top: calc(101 / 1920 * 100%); padding-top: 5.26vw;
.class_icon { .class_icon {
width: calc(740 / 1920 * 100%); width: calc(740 / 1920 * 100%);
// height: calc(302 / 1080 * 100%); // height: calc(302 / 1080 * 100%);
...@@ -744,7 +795,6 @@ export default { ...@@ -744,7 +795,6 @@ export default {
} }
.classiconBox { .classiconBox {
width: 100%; width: 100%;
// height: calc(361 / 1080 * 100%);
padding: 0 calc(160 / 1920 * 100%); padding: 0 calc(160 / 1920 * 100%);
margin-top: calc(123 / 1920 * 100%); margin-top: calc(123 / 1920 * 100%);
display: flex; display: flex;
...@@ -754,9 +804,8 @@ export default { ...@@ -754,9 +804,8 @@ export default {
overflow-y: hidden; overflow-y: hidden;
box-sizing: border-box; box-sizing: border-box;
.classItem { .classItem {
width: calc(266 / 1920 * 100%); width: 13.854vw;
height: 100%; height: 100%;
// background-color: #000;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
...@@ -779,13 +828,14 @@ export default { ...@@ -779,13 +828,14 @@ export default {
height: 3.645vw; height: 3.645vw;
overflow: hidden; overflow: hidden;
text-align: center; text-align: center;
font-weight: 500;
font-size: 0.729vw; font-size: 0.729vw;
color: #999999; color: #999999;
margin-bottom: 2.083vw; margin-bottom: 2.083vw;
} }
} }
} }
}
} }
.threebox { .threebox {
width: 100%; width: 100%;
...@@ -807,7 +857,6 @@ export default { ...@@ -807,7 +857,6 @@ export default {
.threeItem { .threeItem {
width: 25vw; width: 25vw;
height: 56.25vw; height: 56.25vw;
// background-color: #eee;
background-color: #333; background-color: #333;
color: #000; color: #000;
flex-grow: 5; flex-grow: 5;
...@@ -848,33 +897,55 @@ export default { ...@@ -848,33 +897,55 @@ export default {
position: relative; position: relative;
} }
} }
.threeItem1 {
background-image: url("../assets/images/index/study_bg1.png");
background-repeat: no-repeat;
background-size: cover;
}
.threeItem2 {
background-image: url("../assets/images/index/study_bg2.png");
background-repeat: no-repeat;
background-size: cover;
}
.threeItem3 {
background-image: url("../assets/images/index/study_bg3.png");
background-repeat: no-repeat;
background-size: cover;
}
.threeItem4 {
background-image: url("../assets/images/index/study_bg4.png");
background-repeat: no-repeat;
background-size: cover;
}
} }
.mask { .mask {
width: 25vw; width: 100%;
height: 56.25vw; height: 56.25vw;
background-color: #ffffff; background-color: #ffffff;
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0vw;
z-index: 10; z-index: 10;
} }
} }
.removeMask { .removeMask {
transform: translateX(25vw); transform: translateX(100%);
transition: all 0.5s; transition: all 0.5s;
z-index: 0; z-index: 0;
} }
.fourbox { .fourbox {
width: 100%; width: 100%;
padding-top: calc(2377 / 1920 * 100%); padding-top: calc(2377 / 1920 * 100%);
position: relative; position: relative;
.subFourBox { .subFourBox {
width: 100vw; width: 100vw;
height: 100%; height: 100%;
background-image: url("../assets/images/index/work_serve_bg.png"); background-image: url("../assets/images/index/work_serve_bg.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover;
.class_icon4 { .class_icon4 {
width: calc(675 / 1920 * 100%); width: calc(675 / 1920 * 100%);
height: auto; height: auto;
...@@ -934,14 +1005,15 @@ export default { ...@@ -934,14 +1005,15 @@ export default {
} }
} }
.fivebox { .fivebox {
width: 100%; width: 100vw;
padding-top: calc(1080 / 1920 * 100%); height: 56.25vw;
position: relative; position: relative;
.subFiveBox {
width: 100%; width: 100%;
height: 100%; height: 100%;
background-image: url("../assets/images/index/chairman_bg.png"); background-image: url("../assets/images/index/chairman_bg.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover;
display: flex;
.class_icon5 { .class_icon5 {
width: calc(350 / 1920 * 100%); width: calc(350 / 1920 * 100%);
height: auto; height: auto;
...@@ -954,7 +1026,24 @@ export default { ...@@ -954,7 +1026,24 @@ export default {
height: 100%; height: 100%;
background-color: #eee; background-color: #eee;
} }
} .chairman_desc {
width: 63.541vw;
box-sizing: border-box;
padding-left: 4.89vw;
padding-top: 22vw;
padding-right: 8.489vw;
.chairman_desc1 {
font-size: 1.02vw;
font-family: "pingfang-b" !important;
color: #111111;
margin-bottom: 2.5vw;
}
.chairman_desc2 {
// font-size: 0.833vw;
font-size: 1.02vw;
color: #333333;
}
}
} }
// 隐藏滚动条 // 隐藏滚动条
// ::-webkit-scrollbar { // ::-webkit-scrollbar {
...@@ -1007,6 +1096,7 @@ export default { ...@@ -1007,6 +1096,7 @@ export default {
.schoolIcon4:hover { .schoolIcon4:hover {
background-color: #fff; background-color: #fff;
} }
// 修改轮播图导航样式 // 修改轮播图导航样式
.activeBtn { .activeBtn {
width: 0.729vw; width: 0.729vw;
......
src/pages/joinUs/joinUs.vue
View file @ 067eb726
<template> <template>
<div class="jiahe"> <div class="jiahe">
<Header :menuList="menuList" :curMenu="menuList[6].Name" :type="2" /> <Header :menuList="menuList" :curMenu="menuList[6].Name" :type="2" />
<div class="bannerBox"> <div class="bannerBox" :style="{ backgroundImage: 'url(' + swiperData[0].BgImg + ')' }">
<div class="banner_title"><span class="jh">甲鹤</span>-加入我们</div> <div class="banner_title"><span class="jh">甲鹤</span>-{{swiperData[0].NavTitle}}</div>
</div> </div>
<div class="join_main"> <div class="join_main">
<div class="joinUs_imgBox"> <div class="joinUs_imgBox">
...@@ -112,6 +112,7 @@ import { ...@@ -112,6 +112,7 @@ import {
getWebRecruitment, getWebRecruitment,
addWebJobApply, addWebJobApply,
} from "../../api/joinUsApi.js"; } from "../../api/joinUsApi.js";
import { getWebNavList } from "../../api/indexApi.js";
export default { export default {
components: { components: {
Header, Header,
...@@ -120,6 +121,7 @@ export default { ...@@ -120,6 +121,7 @@ export default {
}, },
data() { data() {
return { return {
swiperData: [{BgImg:"",NavTitle:""}],
currentPage: 1, currentPage: 1,
pageCount: 1, pageCount: 1,
menuList: [ menuList: [
...@@ -150,6 +152,11 @@ export default { ...@@ -150,6 +152,11 @@ export default {
}; };
}, },
methods: { methods: {
// 获取网站导航列表
async getWebNavList() {
let res = await getWebNavList(7);
this.swiperData = res.Data;
},
//翻页 //翻页
changePage(val) { changePage(val) {
this.currentPage = val; this.currentPage = val;
...@@ -231,6 +238,7 @@ export default { ...@@ -231,6 +238,7 @@ export default {
this.menuList = JSON.parse(localStorage.getItem("menuList")); this.menuList = JSON.parse(localStorage.getItem("menuList"));
this.getWebRecruitmentTypeList(); this.getWebRecruitmentTypeList();
this.getWebRecruitmentPage(); this.getWebRecruitmentPage();
this.getWebNavList()
}, },
}; };
</script> </script>
...@@ -241,7 +249,7 @@ export default { ...@@ -241,7 +249,7 @@ export default {
.bannerBox { .bannerBox {
width: 100%; width: 100%;
height: 16.666vw; height: 16.666vw;
background-image: url("../../assets/images/joinUs/joinUsBanner.png"); // background-image: url("../../assets/images/joinUs/joinUsBanner.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
display: flex; display: flex;
...@@ -313,11 +321,11 @@ export default { ...@@ -313,11 +321,11 @@ export default {
font-size: 0.729vw; font-size: 0.729vw;
font-family: "pingfang-b" !important; font-family: "pingfang-b" !important;
color: #111111; color: #111111;
// white-space: nowrap;
} }
.job_other { .job_other {
font-size: 0.729vw; font-size: 0.729vw;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
// font-weight: 400;
color: #999999; color: #999999;
} }
} }
......
src/pages/mediaCenter/mediaCenter.vue
View file @ 067eb726
<template> <template>
<div class="jiahe"> <div class="jiahe">
<Header :menuList="menuList" :curMenu="menuList[4].Name" :type="2" /> <Header :menuList="menuList" :curMenu="menuList[4].Name" :type="2" />
<div class="bannerBox"> <div
class="mediaCebterBannerBox"
:style="{ backgroundImage: 'url(' + swiperData[0].BgImg + ')' }"
>
<div class="banner_title"><span class="jh">甲鹤</span>-媒体中心</div> <div class="banner_title"><span class="jh">甲鹤</span>-媒体中心</div>
</div> </div>
<div class="meadia_main"> <div class="meadia_main">
...@@ -18,7 +21,9 @@ ...@@ -18,7 +21,9 @@
{{ newsList[0].Content }} {{ newsList[0].Content }}
</div> </div>
<div class="time">{{ newsList[0].CreateTime }}</div> <div class="time">{{ newsList[0].CreateTime }}</div>
<div class="more" @click="jumpNewsDetail(newsList[0].Id)">查看详情</div> <div class="more" @click="jumpNewsDetail(newsList[0].Id)">
查看详情
</div>
</div> </div>
</div> </div>
<div class="inputBox"> <div class="inputBox">
...@@ -48,12 +53,17 @@ ...@@ -48,12 +53,17 @@
</q-select> </q-select>
</div> </div>
<div class="newsLsitBox" v-if="newsList.length > 0"> <div class="newsLsitBox" v-if="newsList.length > 0">
<div v-for="item in newsList" :key="item.Id" class="newsLsitItem" @click="jumpNewsDetail(item.Id)"> <div
v-for="item in newsList"
:key="item.Id"
class="newsLsitItem"
@click="jumpNewsDetail(item.Id)"
>
<div class="itemTime">{{ item.CreateTime }}</div> <div class="itemTime">{{ item.CreateTime }}</div>
<div class="itemTitle">{{ item.Title }}</div> <div class="itemTitle">{{ item.Title }}</div>
</div> </div>
</div> </div>
<NoData v-if="newsList.length==0"></NoData> <NoData v-if="newsList.length == 0"></NoData>
<div class="pageBox" v-if="pageCount > 1"> <div class="pageBox" v-if="pageCount > 1">
<q-pagination <q-pagination
v-model="currentPage" v-model="currentPage"
...@@ -72,30 +82,76 @@ ...@@ -72,30 +82,76 @@
<div class="cartoonBox_title">品牌漫画</div> <div class="cartoonBox_title">品牌漫画</div>
<div class="cartoonBox_con"> <div class="cartoonBox_con">
<div class="listCon" v-if="cartoonList.length > 0"> <div class="listCon" v-if="cartoonList.length > 0">
<div v-for="item in cartoonList" :key="item.Id" class="listConItem"> <div v-for="item in cartoonList" :key="item.Id" class="listConItem" @click="cartoonDetail(item.LinkUrl)">
<div class="itemTime">{{ item.CreateDate }}</div> <div class="itemTime">{{ item.CreateDate }}</div>
<div class="itemTitle">{{ item.Name }}</div> <div class="itemTitle">{{ item.Name }}</div>
</div> </div>
</div> </div>
<div class="listCon" v-if="cartoonList.length==0"> <div class="listCon" v-if="cartoonList.length == 0">
<NoData></NoData> <NoData></NoData>
</div> </div>
<div class="cartoonCon"> <div class="cartoonCon">
<img src="" alt="" class="cartoon_img"/> <div class="cartoon_imgBox">
<img src="" alt="" class="cartoon_img"/> <img
<img src="" alt="" class="cartoon_img"/> src="../../assets/images/mediaCenter/cartoon_img1.png"
alt=""
class="cartoon_img"
v-if="showimg1"
@mouseleave="showimg1 = false"
/>
<img
src="../../assets/images/mediaCenter/cartoon_img4.png"
alt=""
class="cartoon_img"
v-if="!showimg1"
@mouseenter="showimg1 = true"
/>
</div>
<div class="cartoon_imgBox">
<img
src="../../assets/images/mediaCenter/cartoon_img2.png"
alt=""
class="cartoon_img"
v-if="showimg2"
@mouseleave="showimg2 = false"
/>
<img
src="../../assets/images/mediaCenter/cartoon_img5.png"
alt=""
class="cartoon_img"
v-if="!showimg2"
@mouseenter="showimg2 = true"
/>
</div>
<div class="cartoon_imgBox">
<img
src="../../assets/images/mediaCenter/cartoon_img3.png"
alt=""
class="cartoon_img"
v-if="showimg3"
@mouseleave="showimg3 = false"
/>
<img
src="../../assets/images/mediaCenter/cartoon_img6.png"
alt=""
class="cartoon_img"
v-if="!showimg3"
@mouseenter="showimg3 = true"
/>
</div>
</div> </div>
</div> </div>
<div class="pageBox2"> <div class="pageBox2">
<q-pagination <q-pagination
v-model="currentPage_cartoon" v-model="currentPage_cartoon"
color="light-green-10" color="light-green-10"
:max="pageCount_cartoon" :max="pageCount_cartoon"
:max-pages="6" :max-pages="6"
size="2vw"
:boundary-numbers="true" :boundary-numbers="true"
@input="changePage_cartoon" @input="changePage_cartoon"
v-if="cartoonList.length > 0" v-if="pageCount_cartoon > 1"
> >
</q-pagination> </q-pagination>
</div> </div>
...@@ -105,8 +161,20 @@ ...@@ -105,8 +161,20 @@
<div class="weeklyBox"> <div class="weeklyBox">
<div class="weekly_title">品牌周刊</div> <div class="weekly_title">品牌周刊</div>
<div class="iconBox"> <div class="iconBox">
<div class="iconItem" @click="prePage_weekly" style="marginRight:1.56vw" :class="{activeColor:slide>1&&slide<=max_page}"><i class="fas fa-chevron-left"></i></div> <div
<div class="iconItem" @click="nextPage_weekly"><i class="fas fa-chevron-right" :class="{activeColor:slide>=1&&slide<max_page}"></i></div> class="iconItem"
@click="prePage_weekly"
style="marginRight: 1vw"
:class="{ activeColor: slide > 1 && slide <= max_page }"
>
<i class="fas fa-chevron-left"></i>
</div>
<div class="iconItem" @click="nextPage_weekly">
<i
class="fas fa-chevron-right"
:class="{ activeColor: slide >= 1 && slide < max_page }"
></i>
</div>
</div> </div>
<div> <div>
<q-carousel <q-carousel
...@@ -117,7 +185,7 @@ ...@@ -117,7 +185,7 @@
navigation navigation
arrows arrows
height="auto" height="auto"
class="bg-grey-1 shadow-2 rounded-borders" style="background-color: #f6f6f6"
> >
<q-carousel-slide <q-carousel-slide
v-for="(item, index) in max_page" v-for="(item, index) in max_page"
...@@ -156,11 +224,12 @@ import { ...@@ -156,11 +224,12 @@ import {
getWebCartoonPage, getWebCartoonPage,
getWebMonthlyPage, getWebMonthlyPage,
} from "../../api/mediaCenterApi"; } from "../../api/mediaCenterApi";
import { getWebNavList } from "../../api/indexApi.js";
export default { export default {
components: { components: {
Header, Header,
Footer, Footer,
NoData NoData,
}, },
data() { data() {
return { return {
...@@ -174,23 +243,26 @@ export default { ...@@ -174,23 +243,26 @@ export default {
}, },
], ],
currentPage: 1, currentPage: 1,
pageCount: 0, pageCount: 10,
msg: { msg: {
pageIndex: 1, pageIndex: 1,
pageSize: 5, pageSize: 5,
Title: "", Title: "",
TypeId: "", TypeId: "",
}, },
swiperData: [], swiperData: [{ BgImg: "" }],
searchText: "", searchText: "",
selectText: "", selectText: "",
options: [], options: [],
newsList: [], newsList: [],
currentPage_cartoon: 1, currentPage_cartoon: 1,
pageCount_cartoon: 0, pageCount_cartoon: 1,
// 品牌周刊 // 品牌周刊
swiperList: [], swiperList: [],
// 漫画 // 漫画
showimg1: false,
showimg2: false,
showimg3: false,
cartoonmsg: { cartoonmsg: {
pageIndex: 1, pageIndex: 1,
pageSize: 5, pageSize: 5,
...@@ -208,8 +280,8 @@ export default { ...@@ -208,8 +280,8 @@ export default {
}, },
watch: { watch: {
selectText(val) { selectText(val) {
this.currentPage=1 this.currentPage = 1;
this.msg.pageIndex=1 this.msg.pageIndex = 1;
if (val == null) { if (val == null) {
this.msg.TypeId = ""; this.msg.TypeId = "";
} else { } else {
...@@ -219,6 +291,11 @@ export default { ...@@ -219,6 +291,11 @@ export default {
}, },
}, },
methods: { methods: {
//获取网站导航列表
async getWebNavList() {
let res = await getWebNavList(5);
this.swiperData = res.Data;
},
// 搜索框 // 搜索框
changeSearchText() { changeSearchText() {
this.getNewsList(); this.getNewsList();
...@@ -241,8 +318,8 @@ export default { ...@@ -241,8 +318,8 @@ export default {
this.getWebCartoonPage(); this.getWebCartoonPage();
}, },
//跳转新闻详情页、 //跳转新闻详情页、
jumpNewsDetail(id){ jumpNewsDetail(id) {
this.$router.push({path:"/mediaCenterDetail",query:{id:id}}) this.$router.push({ path: "/mediaCenterDetail", query: { id: id } });
}, },
//获取新闻类型列表 //获取新闻类型列表
async getWebNewsTypeList() { async getWebNewsTypeList() {
...@@ -286,8 +363,13 @@ export default { ...@@ -286,8 +363,13 @@ export default {
//获取品牌动漫分页列表 //获取品牌动漫分页列表
async getWebCartoonPage() { async getWebCartoonPage() {
let res = await getWebCartoonPage(this.cartoonmsg); let res = await getWebCartoonPage(this.cartoonmsg);
this.pageCount_cartoon = res.Data.PageCount;
this.cartoonList = res.Data.PageData; this.cartoonList = res.Data.PageData;
}, },
// 动漫详情
cartoonDetail(url){
window.open(url)
},
//获取品牌月刊(周刊)分页列表 //获取品牌月刊(周刊)分页列表
async getWebMonthlyPage() { async getWebMonthlyPage() {
let res = await getWebMonthlyPage(this.monthlymsg); let res = await getWebMonthlyPage(this.monthlymsg);
...@@ -311,6 +393,7 @@ export default { ...@@ -311,6 +393,7 @@ export default {
}, },
mounted() { mounted() {
this.menuList = JSON.parse(localStorage.getItem("menuList")); this.menuList = JSON.parse(localStorage.getItem("menuList"));
this.getWebNavList();
this.getWebNewsTypeList(); this.getWebNewsTypeList();
this.getNewsList(); this.getNewsList();
this.getWebCartoonPage(); this.getWebCartoonPage();
...@@ -322,10 +405,10 @@ export default { ...@@ -322,10 +405,10 @@ export default {
.jiahe { .jiahe {
background-color: #f6f6f6; background-color: #f6f6f6;
} }
.bannerBox { .mediaCebterBannerBox {
width: 100%; width: 100%;
height: 16.666vw; height: 16.666vw;
background-image: url("../../assets/images/mediaCenter/mediaCenterBanner.png"); // background-image: url("../../assets/images/mediaCenter/mediaCenterBanner.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
display: flex; display: flex;
...@@ -398,6 +481,7 @@ export default { ...@@ -398,6 +481,7 @@ export default {
font-family: PingFang SC; font-family: PingFang SC;
font-weight: 500; font-weight: 500;
color: #ffffff; color: #ffffff;
cursor: pointer;
} }
} }
} }
...@@ -422,6 +506,7 @@ export default { ...@@ -422,6 +506,7 @@ export default {
.itemTime { .itemTime {
font-size: 0.937vw; font-size: 0.937vw;
color: #666666; color: #666666;
white-space: nowrap;
} }
.itemTitle { .itemTitle {
font-size: 1.041vw; font-size: 1.041vw;
...@@ -430,6 +515,7 @@ export default { ...@@ -430,6 +515,7 @@ export default {
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
cursor: pointer;
} }
} }
} }
...@@ -437,12 +523,13 @@ export default { ...@@ -437,12 +523,13 @@ export default {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin-top: 30125vw; margin-top: 3.0125vw;
} }
.cartoonbgBox { .cartoonbgBox {
height: 39.0625vw; height: 39.0625vw;
background-image: url("../../assets/images/mediaCenter/cartoon_bg.png"); background-image: url("../../assets/images/mediaCenter/cartoon_bg.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% auto;
.cartoonBox { .cartoonBox {
width: 62.5vw; width: 62.5vw;
height: 100%; height: 100%;
...@@ -469,22 +556,25 @@ export default { ...@@ -469,22 +556,25 @@ export default {
border-bottom: 1px solid #cccccc; border-bottom: 1px solid #cccccc;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-start;
font-family: "pingfang-b" !important; font-family: "pingfang-b" !important;
.itemTime { .itemTime {
min-width: 5.2vw; width: 7vw;
font-size: 0.729vw; font-size: 0.729vw;
color: #666666; color: #666666;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
cursor: pointer;
} }
.itemTitle { .itemTitle {
width: 20.083vw;
font-size: 0.9375vw; font-size: 0.9375vw;
color: #666666; color: #666666;
margin-left: 1vw;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
cursor: pointer;
} }
} }
} }
...@@ -494,13 +584,22 @@ export default { ...@@ -494,13 +584,22 @@ export default {
transform: translateY(-50%); transform: translateY(-50%);
right: 0; right: 0;
display: flex; display: flex;
.cartoon_img{ .cartoon_imgBox{
width: 10.572vw; width: 10.572vw;
height: 21.458vw; height: 21.458vw;
background-color: #000;
margin-left: 0.781vw; margin-left: 0.781vw;
border-radius: 1vw; border-radius: 1vw;
overflow: hidden; overflow: hidden;
background-image: url('../../assets/images/mediaCenter/phone.png');
background-repeat: no-repeat;
background-size: 100% auto;
display: flex;
justify-content: center;
align-items: center;
.cartoon_img{
width: 9.166vw;
height: 16.4vw;
}
} }
} }
} }
...@@ -530,9 +629,8 @@ export default { ...@@ -530,9 +629,8 @@ export default {
height: 2.604vw; height: 2.604vw;
border: 1px solid #d2d7dd; border: 1px solid #d2d7dd;
font-size: 1.2vw; font-size: 1.2vw;
// color: #CCCCCC; color: #CCCCCC;
color: #333; border: 1px solid #D2D7DD;
background-color: #D2D7DD;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
......
src/pages/studyServe/studyServe.vue
View file @ 067eb726
<template> <template>
<div class="jiahe"> <div class="jiahe">
<Header :menuList="menuList" :curMenu="menuList[2].Name" :type="2" /> <Header :menuList="menuList" :curMenu="menuList[2].Name" :type="2" />
<Banner :swiperList="swiperData" /> <!-- <Banner :swiperList="swiperData" /> -->
<!-- bannner部分 -->
<div
class="studyServeBannerBox"
:style="{ backgroundImage: 'url(' + swiperData[0].BgImg + ')' }"
>
<div class="conbox">
<div class="con1">
<span class="jh">甲鹤</span>-{{ swiperData[0].NavTitle }}
</div>
<div class="con2">
{{ swiperData[0].SubTitle }}
<!-- 这里给一点小文字介绍什么的最好，这里给一点小文字介绍什么的最好，这里给一点
小文字介绍什么的最好。 -->
</div>
<div class="con3"></div>
<div class="btn" @click="seeMore(swiperData[0].LinkUrl)">查看更多</div>
</div>
</div>
<!-- 留学产品 --> <!-- 留学产品 -->
<div class="studyProduct"> <div class="studyProduct">
<div class="title">留学产品</div> <div class="title">留学产品</div>
...@@ -49,7 +67,7 @@ ...@@ -49,7 +67,7 @@
</template> </template>
<script> <script>
import Header from "../../components/header/header"; import Header from "../../components/header/header";
import Banner from "../../components/banner/banner"; // import Banner from "../../components/banner/banner";
import TeacherTeam from "../../components/teacherTeam/teacherTeam"; import TeacherTeam from "../../components/teacherTeam/teacherTeam";
import Footer from "../../components/footer/footerType2"; import Footer from "../../components/footer/footerType2";
import { getWebNavList } from "../../api/indexApi.js"; import { getWebNavList } from "../../api/indexApi.js";
...@@ -57,7 +75,7 @@ import { getStudyAbroadList } from "../../api/studyServeApi.js"; ...@@ -57,7 +75,7 @@ import { getStudyAbroadList } from "../../api/studyServeApi.js";
import { getWebTeacherList } from "../../api/JapaneseTrainApi"; import { getWebTeacherList } from "../../api/JapaneseTrainApi";
export default { export default {
components: { components: {
Banner, // Banner,
Header, Header,
TeacherTeam, TeacherTeam,
Footer, Footer,
...@@ -71,12 +89,16 @@ export default { ...@@ -71,12 +89,16 @@ export default {
Name: "", Name: "",
}, },
], ],
swiperData: [], swiperData: [{ BgImg: "", NavTitle: "", SubTitle: "",LinkUrl:"" }],
studyProductList: [], studyProductList: [],
teacherList:[] teacherList:[]
}; };
}, },
methods: { methods: {
//（banner）查看更多
seeMore(url){
this.$router.push(url)
},
//获取网站导航列表 //获取网站导航列表
async getWebNavList() { async getWebNavList() {
let res = await getWebNavList(3); let res = await getWebNavList(3);
...@@ -107,6 +129,56 @@ export default { ...@@ -107,6 +129,56 @@ export default {
.jiahe { .jiahe {
background-color: #f6f6f6; background-color: #f6f6f6;
} }
.studyServeBannerBox {
width: 100%;
height: 39.0625vw;
// background-image: url("../../assets/images/aboutUs/aboutUsBanner.png");
background-repeat: no-repeat;
background-size: contain;
position: relative;
.conbox {
position: absolute;
top: 9.635vw;
left: 10.208vw;
}
.con1 {
width: calc(845 / 1920 * 100%);
white-space: nowrap;
// font-size: 100px;
font-size: 5.208vw;
color: #111111;
margin-bottom: 3.125vw;
.jh {
font-family: "pingfang-b" !important;
}
}
.con2 {
width: 38.489vw;
font-size: 20px !important;
font-size: 1.041vw;
color: #111111;
padding-bottom: 3.593vw;
}
.con3 {
width: 31.041vw;
height: 1px;
background-color: #111111;
margin-bottom: 4.01vw;
}
.btn {
width: 9.375vw;
height: 2.916vw;
background-color: #45766dff;
// font-size: 24px !important;
font-size: 1.249vw;
color: #ffffff;
display: flex;
justify-content: center;
align-items: center;
white-space: nowrap;
cursor: pointer;
}
}
.studyProduct { .studyProduct {
width: 62.5vw; width: 62.5vw;
margin: 0 auto; margin: 0 auto;
......
src/pages/workServe/workServe.vue
View file @ 067eb726
...@@ -2,8 +2,11 @@ ...@@ -2,8 +2,11 @@
<div class="jiahe"> <div class="jiahe">
<Header :menuList="menuList" :curMenu="menuList[3].Name" :type="2" /> <Header :menuList="menuList" :curMenu="menuList[3].Name" :type="2" />
<!-- <Banner :swiperList="swiperData" /> --> <!-- <Banner :swiperList="swiperData" /> -->
<div class="bannerBox"> <div
<div class="banner_title"><span class="jh">甲鹤</span>-就业服务</div> class="bannerBox"
:style="{ backgroundImage: 'url(' + swiperData[0].BgImg + ')' }"
>
<div class="banner_title"><span class="jh">甲鹤</span>-{{swiperData[0].NavTitle}}</div>
</div> </div>
<!-- 留学产品 --> <!-- 留学产品 -->
<div class="studyProduct"> <div class="studyProduct">
...@@ -52,16 +55,12 @@ ...@@ -52,16 +55,12 @@
</template> </template>
<script> <script>
import Header from "../../components/header/header"; import Header from "../../components/header/header";
import Banner from "../../components/banner/banner";
import TeacherTeam from "../../components/teacherTeam/teacherTeam";
import Footer from "../../components/footer/footerType2"; import Footer from "../../components/footer/footerType2";
// import { getWebNavList } from "../../api/indexApi.js"; import { getWebNavList } from "../../api/indexApi.js";
import { getStudyAbroadList } from "../../api/studyServeApi.js"; import { getStudyAbroadList } from "../../api/studyServeApi.js";
export default { export default {
components: { components: {
Banner,
Header, Header,
TeacherTeam,
Footer, Footer,
}, },
data() { data() {
...@@ -74,16 +73,16 @@ export default { ...@@ -74,16 +73,16 @@ export default {
Name: "", Name: "",
}, },
], ],
// swiperData: [], swiperData: [{BgImg:"",NavTitle:""}],
workProductList: [], workProductList: [],
}; };
}, },
methods: { methods: {
//获取网站导航列表 // 获取网站导航列表
// async getWebNavList() { async getWebNavList() {
// let res = await getWebNavList(3); let res = await getWebNavList(4);
// this.swiperData = res.Data; this.swiperData = res.Data;
// }, },
async getStudyAbroadList() { async getStudyAbroadList() {
let res = await getStudyAbroadList(2); let res = await getStudyAbroadList(2);
this.workProductList = res.Data; this.workProductList = res.Data;
...@@ -91,7 +90,7 @@ export default { ...@@ -91,7 +90,7 @@ export default {
}, },
mounted() { mounted() {
this.menuList = JSON.parse(localStorage.getItem("menuList")); this.menuList = JSON.parse(localStorage.getItem("menuList"));
// this.getWebNavList(); this.getWebNavList();
this.getStudyAbroadList(); this.getStudyAbroadList();
}, },
}; };
...@@ -168,11 +167,11 @@ export default { ...@@ -168,11 +167,11 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
.banner_title { .banner_title {
margin-left: 10.208vw; margin-left: 10.208vw;
font-size: 5.208vw; font-size: 5.208vw;
color: #111111; color: #111111;
.jh{ .jh {
font-family: "pingfang-b" !important; font-family: "pingfang-b" !important;
} }
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment