Commit 4607f6f3 authored by 罗超's avatar 罗超 Committed by 罗超

1

parent a45ee0d4
...@@ -13,6 +13,7 @@ ...@@ -13,6 +13,7 @@
"@quasar/extras": "^1.0.0", "@quasar/extras": "^1.0.0",
"@riophae/vue-treeselect": "^0.4.0", "@riophae/vue-treeselect": "^0.4.0",
"ali-oss": "^6.12.0", "ali-oss": "^6.12.0",
"animate.css": "^4.1.1",
"axios": "^0.18.1", "axios": "^0.18.1",
"co": "^4.6.0", "co": "^4.6.0",
"core-js": "^3.6.5", "core-js": "^3.6.5",
...@@ -25,6 +26,8 @@ ...@@ -25,6 +26,8 @@
"quasar": "^1.0.0", "quasar": "^1.0.0",
"relation-graph": "^1.0.8", "relation-graph": "^1.0.8",
"v-viewer": "^1.5.1", "v-viewer": "^1.5.1",
"vue-animate-number": "^0.4.2",
"vue-easytable": "^2.4.1",
"vue-i18n": "^8.0.0", "vue-i18n": "^8.0.0",
"vue-inline-svg": "^2.0.0" "vue-inline-svg": "^2.0.0"
}, },
......
...@@ -23,4 +23,5 @@ body, ...@@ -23,4 +23,5 @@ body,
font-family: -apple-system,BlinkMacSystemFont,'pingfang','Microsoft YaHei',"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; font-family: -apple-system,BlinkMacSystemFont,'pingfang','Microsoft YaHei',"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
color: #3f4254; color: #3f4254;
} }
</style> </style>
...@@ -3,11 +3,15 @@ import ElementUI from 'element-ui' ...@@ -3,11 +3,15 @@ import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css' import 'element-ui/lib/theme-chalk/index.css'
import Erpindex from '../utils/erpindex' import Erpindex from '../utils/erpindex'
import axios from 'axios' import axios from 'axios'
import 'vue-easytable/libs/themes-base/index.css' // import 'vue-easytable/libs/themes-base/index.css'
import {VTable,VPagination} from 'vue-easytable' // import 'vue-easytable/libs/theme-default/index.css'
// import {VeTable,VePagination} from 'vue-easytable'
import 'viewerjs/dist/viewer.css' import 'viewerjs/dist/viewer.css'
import Viewer from 'v-viewer' //权限编码JS import Viewer from 'v-viewer' //权限编码JS
import animated from 'animate.css'
import VueAnimateNumber from 'vue-animate-number'
Vue.use(VueAnimateNumber)
Vue.http = Vue.prototype.$http = axios Vue.http = Vue.prototype.$http = axios
// 时间扩展格式化 // 时间扩展格式化
...@@ -30,7 +34,8 @@ Date.prototype.Format = function (fmt) { ...@@ -30,7 +34,8 @@ Date.prototype.Format = function (fmt) {
Vue.use(ElementUI) Vue.use(ElementUI)
Vue.use(Erpindex) Vue.use(Erpindex)
Vue.use(Viewer); Vue.use(Viewer);
Vue.component(VTable.name, VTable) Vue.use(animated)
Vue.component(VPagination.name, VPagination) // Vue.component(VTable.name, VTable)
// Vue.component(VPagination.name, VPagination)
Vue.prototype.$axios = axios Vue.prototype.$axios = axios
import Vue from 'vue' import Vue from 'vue'
import VueI18n from 'vue-i18n' import VueI18n from 'vue-i18n'
import messages from 'src/i18n' import messages from 'src/i18n'
import '../../public/static/UE/ueditor.config.js'
import '../../public/static/UE/ueditor.all.js'
import '../../public/static/UE/lang/zh-cn/zh-cn.js'
import '../../public/static/UE/ueditor.parse.min.js'
Vue.use(VueI18n) Vue.use(VueI18n)
const i18n = new VueI18n({ const i18n = new VueI18n({
......
...@@ -13,7 +13,8 @@ router.beforeEach((to, from, next) => { ...@@ -13,7 +13,8 @@ router.beforeEach((to, from, next) => {
localStorage.setItem("routerBefore", from.path); localStorage.setItem("routerBefore", from.path);
LoadingBar.start(); LoadingBar.start();
/** 请求头包含授权信息 并且 页面必须授权 直接进入 */ /** 请求头包含授权信息 并且 页面必须授权 直接进入 */
if (getAuth()) { // if (getAuth()) {
if (true) {
//debugger; //debugger;
// if (to.path === "/login" || to.path === "/") { // if (to.path === "/login" || to.path === "/") {
// next({ // next({
......
<template>
<div class="footer">
<!-- <div class="absolute-top-left subFooter"> -->
<q-img
src="../../assets/images/index/logo_bottom.png"
spinner-color="white"
class="class_icon6"
/>
<div class="link">
<span @click="jumpPage('')">留学服务</span> | <span @click="jumpPage()">就业服务</span> | <span @click="jumpPage()">甲鹤团队</span> | <span @click="jumpPage()">关于甲鹤</span> | <span @click="jumpPage()">联系我们</span>
</div>
<div class="copyright">
CopyRight © 2018 www.023.cn. All Rights Reserved
</div>
<!-- </div> -->
</div>
</template>
<script>
export default {
data(){
return{
}
},
methods:{
jumpPage(url){
this.$router.push(url)
}
}
}
</script>
<style lang="scss" scoped>
.footer {
width: 100%;
height: 22.916vw;
background-color: #ededed;
position: relative;
.class_icon6 {
width: calc(201 / 1920 * 100%);
height: auto;
position: absolute;
top: 3.697vw;
left: 50%;
transform: translateX(-50%);
}
.link {
font-size: 0.729vw;
color: #111111;
position: absolute;
top: 16.822vw;
left: 50%;
transform: translateX(-50%);
}
.link span {
cursor: pointer;
}
.copyright {
text-align: center;
font-size: 0.729vw;
font-family: "pingfang-b" !important;
color: #111111;
position: absolute;
top: 20.729vw;
left: 50%;
transform: translateX(-50%);
}
}
</style>
\ No newline at end of file
<template>
<div class="footer">
<q-img
src="../../assets/images/index/logo_bottom.png"
spinner-color="white"
class="jh_icon"
/>
<div class="link">
<span @click="jumpPage('')">留学服务</span> |
<span @click="jumpPage()">就业服务</span> |
<span @click="jumpPage()">甲鹤团队</span> |
<span @click="jumpPage()">关于甲鹤</span> |
<span @click="jumpPage()">联系我们</span>
</div>
<div class="copyright">
CopyRight © 2018 www.023.cn. All Rights Reserved
</div>
<q-img
src="../../assets/images/index/logo_bottom.png"
spinner-color="white"
class="ewm_icon"
/>
<q-img
src="../../assets/images/index/logo_bottom.png"
spinner-color="white"
class="mini_icon"
/>
</div>
</template>
<script>
export default {
data() {
return {};
},
methods: {
jumpPage(url) {
this.$router.push(url);
},
},
};
</script>
<style lang="scss" scoped>
.footer {
width: 100%;
height: 14.062vw;
background-color: #faf8f9;
position: relative;
.jh_icon {
width: 5.781vw;
height: auto;
position: absolute;
top: 4.01vw;
left: 18.75vw;
}
.link {
font-size: 0.729vw;
color: #111111;
position: absolute;
top: 5.26vw;
left: 26.562vw;
}
.link span {
cursor: pointer;
}
.copyright {
text-align: center;
font-size: 0.729vw;
font-family: "pingfang-b" !important;
color: #111111;
position: absolute;
top: 7.916vw;
left: 26.562vw;
}
.ewm_icon {
width: 5.781vw;
height: auto;
position: absolute;
top: 4.01vw;
left: 66.354vw;
}
.mini_icon {
width: 5.781vw;
height: auto;
position: absolute;
top: 4.01vw;
left: 75.572vw;
}
}
</style>
\ No newline at end of file
<template>
<div :style="{ opacity: scorllNum < 300 ? '1' : scorllNum/1080 }">
<div
id="dowebok"
class="animated bounceOutLeft animate__animated animate__fadeInDown"
:class="{
'header_absolute': scorllNum < 300,
'header_fixed': scorllNum >= 300,
}"
>
<div class="row items-center full-height">
<div class="col">
<img style="height: 61px" src="../../assets/images/logo.png" />
</div>
<div class="col">
<q-tabs
v-model="tab"
class="text-dark"
active-color="dark"
align="justify"
narrow-indicator
dense
>
<!-- <q-route-tab to="/index" name="home" label="首页" content-class="items-nav" /> -->
<q-tab name="home" label="甲鹤教育" content-class="items-nav" />
<q-tab name="japan" label="日语培训" content-class="items-nav" @click="JapaneseTrain"/>
<q-tab name="liuxue" label="留学服务" content-class="items-nav" />
<q-tab name="jiuye" label="就业服务" content-class="items-nav" />
<q-tab name="news" label="媒体中心" content-class="items-nav" />
<q-tab name="about" label="关于我们" content-class="items-nav" />
<q-tab name="join" label="加入我们" content-class="items-nav" />
</q-tabs>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
scorllNum: {
type: Number,
default: 0,
},
},
data() {
return {
tab: "home",
};
},
methods:{
JapaneseTrain(){
this.$router.push("/JapaneseTrain")
}
},
watch:{
}
};
</script>
<style lang="scss" scoped>
#dowebok {
// animation-duration:1s; //动画持续时间
// animation-delay:1s; //动画延迟时间
// animation-iteration-count: infinite; //动画执行次数
}
.header_absolute{
margin-top: 61px;
height: 61px;
z-index: 100;
left: 58px;
right: 58px;
position: absolute;
}
.header_fixed{
width: 100vw;
position: fixed;
top: 0;
left: 0;
z-index: 100;
padding: 0 3.124vw;
background-color:#f6f6f6;
}
.items-nav .q-tab__label {
font-size: 16px !important;
font-family: "pingfang-b" !important;
}
</style>
\ No newline at end of file
<template>
<div>
<div
id="dowebok"
class="animated bounceOutLeft animate__animated animate__fadeInDown header_absolute"
>
<div class="row items-center full-height">
<div class="col">
<img style="height: 61px" src="../../assets/images/logo.png" />
</div>
<div class="col">
<q-tabs
v-model="tab"
class="text-dark"
active-color="dark"
align="justify"
narrow-indicator
dense
>
<!-- <q-route-tab to="/index" name="home" label="首页" content-class="items-nav" /> -->
<q-tab name="home" label="甲鹤教育" content-class="items-nav" />
<q-tab name="japan" label="日语培训" content-class="items-nav" @click="JapaneseTrain"/>
<q-tab name="liuxue" label="留学服务" content-class="items-nav" />
<q-tab name="jiuye" label="就业服务" content-class="items-nav" />
<q-tab name="news" label="媒体中心" content-class="items-nav" />
<q-tab name="about" label="关于我们" content-class="items-nav" />
<q-tab name="join" label="加入我们" content-class="items-nav" />
</q-tabs>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
scorllNum: {
type: Number,
default: 0,
},
},
data() {
return {
tab: "home",
};
},
methods:{
JapaneseTrain(){
this.$router.push("/JapaneseTrain")
}
},
watch:{
}
};
</script>
<style lang="scss" scoped>
.header_absolute{
height: 61px;
// z-index: 100;
// position: absolute;
// top: 0;
// left: 0;
}
.items-nav .q-tab__label {
font-size: 16px !important;
font-family: "pingfang-b" !important;
}
</style>
\ No newline at end of file
import enUS from './en-us' import enUS from './en-us'
import zhCN from './zh-cn'
export default { export default {
'en-us': enUS 'en-us': zhCN
} }
<template>
<div class="jiahe">
<Header :scorllNum="pageScroll" />
<!-- 第一部分 -->
<div class="banner-box">
<q-carousel
v-model="slide"
swipeable
animated
navigation-position="right"
navigation
height="100%"
autoplay
infinite
control-type="outline"
>
<q-carousel-slide
name="first"
img-src="../assets/images/index/banner_bg.png"
>
<div class="conbox">
<div class="con1"><span class="jh">甲鹤-</span>特色教室</div>
<div class="con2">
这里给一点小文字介绍什么的最好,这里给一点小文字介绍什么的最好,这里给一点
小文字介绍什么的最好。
</div>
<div class="con3"></div>
<div class="btn">查看更多</div>
</div>
</q-carousel-slide>
<!-- <q-carousel-slide name="first3" img-src="https://cdn.quasar.dev/img/mountains.jpg"/> -->
</q-carousel>
<!-- </div> -->
<!-- <q-pagination
ref="pag"
v-model="current"
:max="5"
:direction-links="true"
icon-prev
>
</q-pagination>-->
</div>
<!-- 教育产品 -->
<div class="edu_con">
<div class="edu_name">教育产品</div>
<div class="edu_subname">副标题</div>
<div class="inputBox"></div>
<div class="eduConbox">
<div v-for="item in eduList" :key="item.id" class="itemBox">
<q-img :src="item.url" class="itemImg" />
<div class="infoBox">
<div class="courseName">{{ item.courseName }}</div>
<div class="desc">{{ item.desc }}</div>
</div>
</div>
</div>
<div class="seemore">查看更多</div>
</div>
<!-- 开班计划 -->
<div class="edu_con">
<div class="edu_name">开班计划</div>
<div class="edu_subname">副标题</div>
<div class="inputBox"></div>
<div class="classPlanBox">
<div v-for="item in classPlanList" :key="item.id" class="classPlanItemBox">
<div class="">
</div>
</div>
</div>
<div class="seemore">查看更多</div>
</div>
<!-- 底部 -->
<Footer />
</div>
</template>
<script>
import Header from "../components/header/headerType2";
import Footer from "../components/footer/footerType2";
// import { QPagination} from 'quasar'
export default {
name: "PageIndex",
components: {
Header,
Footer,
// QPagination
},
data() {
return {
slide: "first",
pageScroll: 1080,
current: 4,
eduList: [
{
id: 1,
url: "",
courseName: "什么什么课程",
desc: "对课程的一些二级文字介绍内容,这里放一排位置。多的省略号...",
},
{
id: 2,
url: "",
courseName: "什么什么课程",
desc: "",
},
{
id: 3,
url: "",
courseName: "什么什么课程",
desc: "",
},
{
id: 4,
url: "",
courseName: "什么什么课程",
desc: "",
},
{
id: 5,
url: "",
courseName: "什么什么课程",
desc: "",
},
{
id: 6,
url: "",
courseName: "什么什么课程",
desc: "",
},
],
classPlanList:[{
id:1,
className:"东野大木(五班)",
courseInfo:"日语 基础0-N3直通车课程系列",
course:"156课时",
joinStart:"2020年10月30日",
joinEnd:"2020年10月30日",
planNum:10,
surplusNum:1
},{
id:2,
className:"",
courseInfo:"",
courseHour:"",
joinStart:"",
joinEnd:"",
planNum:10,
surplusNum:10,
}]
};
},
methods: {
//滚动条高度
// handleScroll() {
// this.pageScroll =
// document.documentElement.scrollTop || document.body.scrollTop;
// console.log(this.pageScroll);
// },
// pag(){
// let dom= this.$refs.pag
// dom.set(1)
// console.log(dom)
// }
},
mounted() {
// window.addEventListener("scroll", this.handleScroll);
},
//销毁,否则跳到别的路由还是会出现
beforeDestroy() {
// window.removeEventListener("scroll", this.handleScroll);
// this.pageScroll = 0;
},
};
</script>
<style lang="scss" scoped>
.jiahe {
min-height: 100vh;
background-color: #f6f6f6;
}
.banner-box {
width: 100vw;
height: 38.02vw;
position: relative;
z-index: 5;
}
.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: calc(739 / 1920 * 100%);
// font-size: 20px !important;
font-size: 1.041vw;
color: #111111;
}
.con3 {
width: calc(596 / 1920 * 100%);
height: 1px;
background-color: #111111ff;
}
.btn {
width: calc(180 / 1920 * 100%);
height: calc(56 / 1080 * 100%);
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 {
width: 62.5vw;
margin: 5.516vw auto 0;
margin-bottom: 5.156vw;
.edu_name {
text-align: center;
font-size: 1.562vw;
// font-family: Microsoft YaHei;
// font-weight: bold;
font-family: "pingfang-b" !important;
color: #111111;
}
.edu_subname {
text-align: center;
font-size: 0.833vw;
// font-family: Microsoft YaHei;
// font-weight: 400;
color: #888888;
}
.inputBox {
width: 100%;
height: 2.916vw;
background-color: #e9e9e9;
margin: 2.083vw 0;
}
.eduConbox {
display: flex;
flex-wrap: wrap;
margin-bottom: 2.604vw;
.itemBox {
width: 20vw;
height: 18.437vw;
background-color: #ff0;
margin-right: 1.25vw;
margin-bottom: 1.562vw;
.itemImg {
width: 20vw;
height: 13.229vw;
background-color: rgb(99, 150, 104);
}
.infoBox {
padding: 1.406vw 0.937vw 0;
.courseName {
font-size: 0.833vw;
// font-family: Microsoft YaHei;
// font-weight: bold;
font-family: "pingfang-b" !important;
color: #000000;
margin-bottom: 0.989vw;
}
.desc {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 0.625vw;
// font-family: Microsoft YaHei;
// font-weight: 400;
color: #888888;
}
}
}
& .itemBox:nth-child(3n) {
margin-right: 0;
}
}
}
.seemore {
margin: 0 auto;
width: 12.5vw;
height: 2.916vw;
background: #45766d;
display: flex;
justify-content: center;
align-items: center;
font-size: 1.25vw;
// font-family: PingFang SC;
// font-weight: 500;
color: #ffffff;
}
.classPlanItemBox{
width: 100%;
height: 7.5vw;
background-color: #FFFFFF;
box-shadow: 0px 6px 10px 0px rgba(116, 116, 116, 0.1);
padding: 1.562vw 1.041vw;
margin-bottom: 2.604vw;
}
</style>
\ No newline at end of file
This diff is collapsed.
...@@ -2,9 +2,11 @@ ...@@ -2,9 +2,11 @@
const routes = [ const routes = [
{ {
path: '/', path: '/',
redirect: '/index',
component: () => import('layouts/MainLayout.vue'), component: () => import('layouts/MainLayout.vue'),
children: [ children: [
{ path: '', component: () => import('pages/Index.vue') } { path: '/index', component: () => import('pages/Index.vue') },
{ path: '/JapaneseTrain', component: () => import('src/pages/JapaneseTrain.vue') },
] ]
}, },
// Always leave this as last one, // Always leave this as last one,
......
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