Skip to content

C
campSite
Commit c0d40e50 authored by wuwangwolihui's avatar wuwangwolihui
Browse files
Options

样式调整-lh

parent 529b0202
Hide whitespace changes
Inline Side-by-side
Showing with 676 additions and 942 deletions
src/App.vue
View file @ c0d40e50
<template> <template>
<div id="app"> <div id="app">
<router-view /> <router-view/>
</div> </div>
</template> </template>
<script> <script>
/* eslint-disable */
export default { export default {
name: "recruit", name: "recruit",
data() { data() {
return {}; return {};
}, },
created() { created() {
// window.localStorage.setItem( },
// "index-identity", methods: {
// "c59086fdb37848e7a10765812d1da349" },
// ); };
// this.getCam();
},
methods: {
// getCam() {
// getCam({}).then((res) => {
// console.log(res, "getCam");
// let root = document.querySelector(":root");
// root.style.setProperty("--color", res.data.system_color);
// root.style.setProperty("--bk_pic", res.data.background_picture); //当前营地的背景图
// //当前营地logo
// window.localStorage.setItem("system_logo", res.data.system_logo);
// window.localStorage.setItem(
// "doubt_code",
// res.data.fill_individual_Invitationcode
// ); //是否填写邀请码
// window.localStorage.setItem(
// "doubt_info",
// res.data.fill_individual_information
// ); //是否填写个人资料
// window.localStorage.setItem(
// "doubt_check",
// res.data.audit_individual_information
// ); //是否审核个人资料
// });
// },
},
};
</script> </script>
<style scoped lang="scss"> <style lang="scss">
// @import "~a/css/base.css"; @import "a/scss/index";
#app { // @import "~a/css/base.css";
font-family: Avenir, Helvetica, Arial, sans-serif; #app {
-webkit-font-smoothing: antialiased; font-family: Avenir, Helvetica, Arial, sans-serif;
-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;
position: relative; -moz-osx-font-smoothing: grayscale;
height: 100%; position: relative;
background: #fff; height: 100vh;
} background: #fff;
background: #f8f8f8;
}
//滚动条的宽度
::-webkit-scrollbar {
width: 12px;
height: 12px;
}
//滚动条的滑块
::-webkit-scrollbar-thumb {
background-color: #cccccc;
border-radius: 4px;
}
.el-dropdown-menu {
.el-dropdown-menu__item {
padding: 0 26px !important;
&:hover {
color: #ffffff !important;
background-color: var(--color) !important;
}
}
}
.el-message-box {
width: 360px !important;
.el-message-box__header {
.el-message-box__title {
color: red;
}
.el-message-box__close{
&:hover{
color: var(--color);
}
}
}
.el-button{
&:nth-child(1):hover{
color: #fff;
background-color: var(--color);
border-color: var(--color);
opacity: 0.6;
}
&:nth-child(2) {
color: #fff;
background-color: var(--color);
border-color: var(--color);
&:hover {
color: #fff;
background-color: var(--color);
border-color: var(--color);
opacity: 0.9;
}
}
}
}
</style> </style>
src/assets/scss/common.scss 0 → 100644
View file @ c0d40e50
.com-container{
width: 60%;
max-width: 1160px;
min-width: 1024px;
//min-width: 960px;
padding: 0 40px;
margin: 0 auto;
}
\ No newline at end of file
src/components/index/Footer.vue
View file @ c0d40e50
...@@ -2,37 +2,31 @@ ...@@ -2,37 +2,31 @@
<template> <template>
<!--底部--> <!--底部-->
<div class="footer"> <div class="footer">
<div class="content flex"> <div class="com-container content">
<div class="cc flex"> <ul class="contact_list">
<div class="info"> <li>
<ul class="contact_list flex"> <i class="el-icon-message"></i>
<li> <span>考务邮箱</span>service@thussat.com
<i class="el-icon-message"></i </li>
><span>考务邮箱</span>service@thussat.com <li>
</li> <i class="el-icon-phone-outline"></i>
<li> <span>联系电话</span>010-56218127
<i class="el-icon-phone-outline"></i </li>
><span>联系电话</span>010-56218127; <li>
</li> <i class="el-icon-aim"></i>
<li> <span>工作时间</span>周一至周五 09:00 - 12:00，14:00 - 18:00
<i class="el-icon-aim"></i><span>工作时间</span>周一至周五 09:00 - </li>
12:00, 14:00 - 18:00 </ul>
</li> <div class="line"></div>
</ul> <div class="copyRight">
</div> <div>
<div class="line"></div> <a href="">Copyright © 2021 营地系统 版权所有</a>
<div class="copyRight"> <a target="_blank" href="https://beian.miit.gov.cn"
<div> >京ICP备19058825号-3</a>
<a href="">Copyright © 2021 营地系统 版权所有</a> <a
<a target="_blank" href="https://beian.miit.gov.cn" target="_blank"
>京ICP备19058825号-3</a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802034612"
><a >京公网安备 11010802034612号</a>
target="_blank"
href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802034612"
>
京公网安备 11010802034612号</a
>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -40,95 +34,75 @@ ...@@ -40,95 +34,75 @@
</template> </template>
<script> <script>
/* eslint-disable */ export default {
export default { name: "Footer",
name: "Footer", };
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.flex { @import "a/scss/common";
display: flex; .footer {
} font-family: PingFang SC;
.footer { font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC; height: 169px;
font-size: 14px; background: #000000;
height: 170px; opacity: 0.9;
background: #000000; line-height: 60px;
opacity: 0.9; border-top: 1px solid #ccc;
line-height: 60px;
// text-align: center; .content {
border-top: 1px solid #ccc; .contact_list {
.content { display: flex;
justify-content: center; flex-flow: row;
.cc { align-items: center;
width: 85%; height: 88px;
justify-content: space-around; margin: 0;
align-items: center; padding: 0;
flex-direction: column; li{
} font-size: 12px;
} height: 14px;
.info { line-height: 14px;
font-weight: 500; font-family: PingFang SC;
color: #ffffff; font-weight: 500;
line-height: 14px; color: #FFFFFF;
margin-top: 35px; list-style: none;
width: 100%; margin-right: 40px;
.contact_list { span{
padding: 0 !important; margin: 0 15px 0 7px;
// width: 61%; }
// justify-content: flex-start; &:last-child{
// justify-content: space-between; margin-right: 0;
li { }
margin-bottom: 30px;
height: 18px;
line-height: 18px;
font-size: 14px;
color: #e5e5e5;
font-weight: 500;
font-family: PingFangSC-Medium, PingFang SC;
list-style-type: none;
list-style-type: none;
margin-right: 20px;
&:last-child {
margin-bottom: 0;
}
i {
opacity: 0.8;
font-size: 18px;
vertical-align: top;
font-weight: bold;
} }
span { }
margin: 0 5px 0 5px; .line {
line-height: 18px; width: 100%;
height: 1px;
background: #ffffff;
opacity: 0.2;
}
.copyRight {
display: flex;
flex-flow: row;
align-items: center;
height: 62px;
margin: 0;
padding: 0;
a {
font-size: 12px;
font-weight: 400;
margin-right: 20px;
color: #333333;
text-decoration: none;
img {
width: 15px;
margin-top: -3px;
}
&:hover {
text-decoration: underline;
}
} }
} }
} }
} }
}
.line {
width: 100%;
height: 1px;
background: #ffffff;
opacity: 0.2;
// margin-top: 50px;
}
a {
font-weight: 400;
margin-right: 20px;
color: #333333;
text-decoration: none;
img {
width: 15px;
margin-top: -3px;
}
&:hover {
text-decoration: underline;
}
}
.copyRight {
width: 100%;
}
</style> </style>
src/components/index/Header.vue
View file @ c0d40e50
<template> <template>
<div class="Header"> <div class="Header">
<div class="H_content flex"> <div class="H_content com-container">
<div class="cc flex">
<div class="image"> <div class="image">
<img :src="system_logo" alt="" /> <img :src="system_logo" alt="" />
</div> </div>
<div class="right"> <div class="right">
<span @click="toLogin">登录</span> <span @mouseenter="onMouserEnter(false)" :class="isHover?'':'is-hover'" @click="toLogin">登录</span>
<span @click="toRegister">注册</span> <span @mouseenter="onMouserEnter(true)" :class="isHover?'is-hover':''" @click="toRegister">注册</span>
</div> </div>
</div>
</div> </div>
</div> </div>
</template> </template>
...@@ -19,6 +17,7 @@ export default { ...@@ -19,6 +17,7 @@ export default {
name: "Header", name: "Header",
data() { data() {
return { return {
isHover: true,
system_logo: window.localStorage.getItem("system_logo"), system_logo: window.localStorage.getItem("system_logo"),
}; };
}, },
...@@ -30,49 +29,47 @@ export default { ...@@ -30,49 +29,47 @@ export default {
toRegister() { toRegister() {
this.$router.replace({ name: "index-register" }); this.$router.replace({ name: "index-register" });
}, },
onMouserEnter(val){
this.isHover = val;
},
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.flex { @import "a/scss/common";
display: flex; .Header {
} font-family: PingFang SC;
.Header { height: 80px;
font-family: PingFangSC-Medium, PingFang SC; box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.12);
height: 80px; .H_content {
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.12); height: 100%;
.H_content { display: flex;
justify-content: center; flex-flow: row;
.cc {
width: 100%;
justify-content: space-around;
align-items: center; align-items: center;
div { justify-content: space-between;
flex-direction: column; .image img {
width: 318px;
height: 62px;
}
.right {
span {
font-size: 15px;
font-weight: 500;
color: #666666;
line-height: 21px;
padding: 10px 36px;
border-radius: 4px;
border: 2px solid transparent;
&:last-child {
margin-left: 10px;
}
&.is-hover{
cursor: pointer;
color: var(--color);
border-color: var(--color);
}
}
} }
} }
} }
.image img {
width: 318px;
height: 62px;
}
.right {
span {
font-size: 15px;
font-weight: 500;
color: #666666;
line-height: 21px;
}
:last-child {
font-weight: 500;
color: var(--color);
line-height: 21px;
padding: 10px 36px;
border-radius: 4px;
border: 2px solid var(--color);
margin-left: 50px;
}
}
}
</style> </style>
src/components/index/SignUp/Header.vue
View file @ c0d40e50
<template> <template>
<div class="Header"> <div class="Header">
<div class="H_content flex"> <div class="H_content com-container">
<div class="cc flex"> <div class="image" @click="toRecruit">
<div class="image" @click="toRecruit"> <img :src="system_logo" alt=""/>
<img :src="system_logo" alt="" /> </div>
</div> <div class="right">
<div class="right"> <el-dropdown @command="handleCommand" trigger="click">
<el-dropdown @command="handleCommand" trigger="click"> <div class="el-dropdown-link">
<div class="el-dropdown-link flex"> <img src="@/assets/img/default.svg" class="img_user"/>
<div> <span class="phone">{{ phone }}</span>
<img src="@/assets/img/default.svg" class="img_user" /> <i class="el-icon-arrow-down el-icon--right"></i>
</div> </div>
<el-dropdown-menu slot="dropdown">
<div style="line-height: 64px"> <el-dropdown-item command="1">退出</el-dropdown-item>
<span class="phone">{{ phone }}</span> </el-dropdown-menu>
<i class="el-icon-arrow-down el-icon--right"></i> </el-dropdown>
</div>
</div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="1">退出</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
/* eslint-disable */ /* eslint-disable */
import { logout } from "r/index/login"; import {logout} from "r/index/login";
export default {
name: "Header",
data() {
return {
phone: window.localStorage.getItem("phone"),
system_logo: window.localStorage.getItem("system_logo"),
};
},
methods: {
handleCommand(command) {
if (command == 1) {
this.logout();
}
},
// 退出
async logout() {
const confirmResult = await this.$confirm(`确认退出登录？`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
closeOnClickModal: false,
type: "warning",
}).catch((err) => err);
if (confirmResult !== "confirm")
return this.$message.info("您取消了退出");
await logout({}); export default {
// if (res.code !== 200) return this.$message.error(res.message); name: "Header",
// 清除本地的 token data() {
window.localStorage.clear(); return {
this.$store.state.token = ""; phone: window.localStorage.getItem("phone"),
// 使用编程式导航跳转到登录页面 system_logo: window.localStorage.getItem("system_logo"),
this.$router.replace({ name: "recruit" }); };
}, },
// 点击图片跳转到招生简章页面 methods: {
toRecruit() { handleCommand(command) {
// 清除本地的 token if (command == 1) {
window.localStorage.clear(); this.logout();
this.$store.state.token = ""; }
this.$router.replace({ name: "recruit" }); },
// 退出
async logout() {
const confirmResult = await this.$confirm(`确认退出登录？`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
closeOnClickModal: false,
type: "warning",
}).catch((err) => err);
if (confirmResult !== "confirm")
return this.$message.info("您取消了退出");
await logout({});
// if (res.code !== 200) return this.$message.error(res.message);
// 清除本地的 token
window.localStorage.clear();
this.$store.state.token = "";
// 使用编程式导航跳转到登录页面
this.$router.replace({name: "recruit"});
},
// 点击图片跳转到招生简章页面
toRecruit() {
// 清除本地的 token
window.localStorage.clear();
this.$store.state.token = "";
this.$router.replace({name: "recruit"});
},
}, },
}, };
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.flex { @import "a/scss/common";
display: flex;
}
.Header {
font-family: PingFangSC-Medium, PingFang SC;
height: 80px;
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.12);
.H_content {
justify-content: center;
.cc {
width: 100%;
justify-content: space-around;
}
}
.image img { .Header {
width: 318px; font-family: PingFang SC;
height: 62px; height: 80px;
cursor: pointer; box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.12);
}
.right { .H_content {
.el-dropdown { height: 100%;
float: right; display: flex;
&:hover { flex-flow: row;
cursor: pointer; align-items: center;
} justify-content: space-between;
.img_user {
width: 34px; .image img {
height: 34px; width: 318px;
background-color: #d8d8d8; height: 62px;
border-radius: 50%;
float: left;
margin: 15px 0 0 0;
}
.phone {
margin: 0 10px 0 12px;
} }
}
}
::v-deep .el-dropdown-menu__item {
padding: 0 26 px !important;
}
::v-deep .el-dropdown-item { .right {
display: inline-block; height: 80px;
}
::v-deep .el-dropdown-menu__item:hover { ::v-deep .el-dropdown {
color: #ffffff; height: 80px;
background-color: var(--color);
}
::v-deep .el-message-box { .el-dropdown-link {
width: 1000px !important; height: 80px;
.el-message-box__header { display: flex;
.el-message-box__title { flex-flow: row;
color: red !important; align-items: center;
.img_user {
width: 34px;
height: 34px;
background-color: #d8d8d8;
border-radius: 50%;
}
.phone {
margin: 0 10px 0 12px;
}
}
&:hover {
cursor: pointer;
}
}
} }
}
.el-button--primary {
color: #fff;
background-color: var(--color);
border-color: var(--color);
} }
} }
}
</style> </style>
src/router/index.js
View file @ c0d40e50
...@@ -39,8 +39,8 @@ const routes = [{ ...@@ -39,8 +39,8 @@ const routes = [{
import('v/index/camp/Index.vue'), import('v/index/camp/Index.vue'),
children: [...indexCamp] children: [...indexCamp]
} }
] ]
const originalPush = VueRouter.prototype.push const originalPush = VueRouter.prototype.push
...@@ -62,6 +62,11 @@ router.onError((error) => { ...@@ -62,6 +62,11 @@ router.onError((error) => {
router.replace(targetPath) router.replace(targetPath)
} }
}) })
// 页面跳转之后页面回滚到顶部
router.afterEach((to, from, next) => {
window.scrollTo(0, 0)
});
// router.beforeEach((to, from, next) => { // router.beforeEach((to, from, next) => {
// // 记录上一页 // // 记录上一页
// if (from) { // if (from) {
......
src/views/index/Index.vue
View file @ c0d40e50
...@@ -26,10 +26,10 @@ export default { ...@@ -26,10 +26,10 @@ export default {
}, },
created() { created() {
console.log('created') console.log('created')
}, },
methods: { methods: {
}, },
}; };
</script> </script>
......
src/views/index/camp/Index.vue
View file @ c0d40e50
<template> <template>
<div class="camp-index"> <div class="camp-index">
<Header> </Header> <el-header height="104px">
<div class="content flex"> <Header></Header>
<div class="cc flex"> <div class="bg-top"></div>
</el-header>
<div class="com-container">
<div class="index-container">
<div class="camp_left"> <div class="camp_left">
<ul class="camp_left_box"> <ul class="camp_left_box" ref="leftBox" :class="{
'is-fixed':isPosition==1,
'is-absolute':isPosition==2,
}">
<li @click="ToSignUp" :class="type == 1 ? 'active' : ''"> <li @click="ToSignUp" :class="type == 1 ? 'active' : ''">
<img src="@/assets/img/signUp/icon-bm.png" />营地报名 <img src="@/assets/img/signUp/icon-bm.png"/>营地报名
</li> </li>
<li @click="ToHomework" :class="type == 2 ? 'active' : ''"> <li @click="ToHomework" :class="type == 2 ? 'active' : ''">
<img src="@/assets/img/signUp/icon-zs.png" />营地作业 <img src="@/assets/img/signUp/icon-zs.png"/>营地作业
</li> </li>
<li @click="ToCertificate" :class="type == 3 ? 'active' : ''"> <li @click="ToCertificate" :class="type == 3 ? 'active' : ''">
<img src="@/assets/img/signUp/icon-zy.png" />营地证书 <img src="@/assets/img/signUp/icon-zy.png"/>营地证书
</li> </li>
</ul> </ul>
</div> </div>
<div class="camp_right"> <div class="camp_right" ref="rightBox">
<router-view /> <router-view/>
</div> </div>
</div> </div>
</div> </div>
<Footer></Footer>
<Footer> </Footer>
</div> </div>
</template> </template>
<script> <script>
/* eslint-disable */ import Header from "@/components/index/SignUp/Header.vue";
import Header from "@/components/index/SignUp/Header.vue"; import Footer from "@/components/index/Footer.vue";
import Footer from "@/components/index/Footer.vue";
export default { export default {
name: "campIndex", name: "campIndex",
components: { components: {
Header, Header,
Footer, Footer,
}, },
data() { data() {
return { return {
type: 1, type: 1,
}; isPosition: 0,// 左侧box是否浮动
}, pageYOffset: 0,// 左侧box浮动时，滚动的高度
methods: { scorllHeight: 0,// 最大滚动高度
ToSignUp() { };
this.$router.replace({ name: "index-signUp" }); },
this.type = 1; mounted() {
window.addEventListener('scroll', this.handleScrollX, true);
}, },
ToHomework() { beforeDestroy() {
this.$router.replace({ name: "index-homework" }); window.removeEventListener('scroll', this.handleScrollX, true);
this.type = 2;
}, },
ToCertificate() { methods: {
this.$router.replace({ name: "index-certificate" }); // 页面滚动事件
this.type = 3; handleScrollX() {
let top = document.documentElement.scrollTop || document.body.scrollTop;
let refLeft = this.$refs['leftBox'];
let refRight = this.$refs['rightBox'];
if (top > 0) {
if (this.isPosition == 0) {
this.scorllHeight = refRight.offsetHeight - refLeft.offsetHeight;
}
this.isPosition = 1;
}else{
if(this.isPosition = 1){
this.isPosition = 0;
}
}
if (top >= this.scorllHeight) {
if (this.isPosition == 1) {
this.isPosition = 2;
}
}else if(top < this.scorllHeight) {
if (this.isPosition == 2) {
this.isPosition = 1;
}
}
},
ToSignUp() {
this.$router.replace({name: "index-signUp"});
this.type = 1;
},
ToHomework() {
this.$router.replace({name: "index-homework"});
this.type = 2;
},
ToCertificate() {
this.$router.replace({name: "index-certificate"});
this.type = 3;
},
}, },
}, };
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.camp-index { @import "a/scss/common";
background: #f8f8f8;
.content {
justify-content: center;
.cc {
width: 60%;
justify-content: space-around;
// align-items: center;
margin: 30px 0 50px 0;
}
}
.tab {
width: 280px;
height: 320px;
background: #ffffff;
position: relative;
top: 0;
// position: relative;
// top: -544px;
li {
height: 52px;
background: #f8f8f8;
}
}
.camp_left { .camp-index {
position: relative; background: #f8f8f8;
width: 24%;
max-width: 280px; .el-header {
min-width: 240px; position: fixed;
/*height: 340px;*/ width: 100%;
border-radius: 8px; padding: 0;
margin-right: 30px;
.camp_left_box {
max-width: 280px;
min-width: 240px;
height: 300px;
background-color: #ffffff; background-color: #ffffff;
border-radius: 8px; z-index: 10000;
padding: 20px 0;
margin: 0; .bg-top {
&.is-fixed { height: 24px;
position: fixed; background-color: #f8f8f8;
top: 92px;
width: 24%;
max-width: 280px;
min-width: 240px;
}
&.is-absolute {
position: absolute;
bottom: 0;
width: 100%;
} }
li { }
.index-container {
padding: 104px 0 70px 0;
display: flex;
flex-flow: row;
.camp_left {
position: relative; position: relative;
padding: 0 23px; width: 24%;
height: 44px; max-width: 280px;
line-height: 44px; min-width: 200px;
margin: 10px 0; border-radius: 8px;
font-size: 15px; margin-right: 24px;
list-style: none;
img { .camp_left_box {
vertical-align: middle; max-width: 280px;
margin: -3px 8px 0 0; min-width: 200px;
width: 20px; height: 300px;
} background-color: #ffffff;
border-radius: 8px;
padding: 20px 0;
margin: 0;
&.active, &.is-fixed {
&:hover { position: fixed;
cursor: pointer; top: 104px;
background-color: #F8F8F8; width: 14.4%;
// border-right: 4px solid #3c0664; max-width: 280px;
min-width: 216px;
}
&.is-absolute {
position: absolute;
bottom: 0;
width: 100%;
}
li {
position: relative;
padding: 0 23px;
height: 44px;
line-height: 44px;
margin: 10px 0;
font-size: 15px;
list-style: none;
img {
vertical-align: middle;
margin: -3px 8px 0 0;
width: 20px;
}
&.active,
&:hover {
cursor: pointer;
background-color: #F8F8F8;
}
}
} }
} }
.camp_right {
flex: 1;
border-radius: 8px;
background-color: #ffffff;
}
} }
} }
}
</style> </style>
src/views/index/camp/SignUp.vue
View file @ c0d40e50
...@@ -146,8 +146,8 @@ export default { ...@@ -146,8 +146,8 @@ export default {
} }
.signUp { .signUp {
background: #ffffff; /*background: #ffffff;*/
width: 856px; /*width: 856px;*/
.signUp_titile { .signUp_titile {
font-size: 24px; font-size: 24px;
font-weight: 500; font-weight: 500;
......
src/views/index/login/Index.vue
View file @ c0d40e50
<template> <template>
<div class="login-index"> <div class="login-index">
<div class="ConDivContent_bg"> <div class="big-img">
<router-view /> <img :src="bigImg" />
</div>
<div class="big-right">
<div class="info-box">
<router-view />
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
/* eslint-disable */
export default { export default {
name: "loginIndex", name: "loginIndex",
data() { data() {
return { return {
bigImg: window.localStorage.getItem('bk_pic')
}; };
}, },
created() { created() {
this.$emit("getStatus", false); let bk_pic = window.localStorage.getItem('bk_pic');
if(bk_pic){
this.bigImg = bk_pic;
}
}, this.$emit("getStatus", false);
methods: {
}, },
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.login-index { .login-index {
// height: 1080px; position: relative;
min-width: 1104px;
background: #f8f8f8; background: #f8f8f8;
.ConDivContent_bg { display: flex;
height: 1080px; flex-flow: row;
background: url("../../../assets/img/login/left@2x.png") no-repeat; .big-img{
background-size: 100% 100%; width: (500/1920*100%);
width: 30%; min-width: 350px;
/*height: 100%;*/
img{
width: 100%;
/*height: 100%;*/
}
}
.big-right{
flex: 1;
position: relative;
.info-box{
width: 520px;
height: auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
} }
// @media screen and (max-width: 1600px) {
// .ConDivContent_bg {
// max-height: 600px;
// }
// }
} }
</style> </style>
src/views/index/login/Login.vue
View file @ c0d40e50
<template> <template>
<div>
<div style="border: none">
<div class="container"> <div class="container">
<div class="title">账号密码登录</div> <div class="title">账号密码登录</div>
<div class="line"></div> <div class="line"></div>
...@@ -59,12 +57,9 @@ ...@@ -59,12 +57,9 @@
</div> </div>
</el-form> </el-form>
</div> </div>
</div>
</div>
</template> </template>
<script> <script>
/* eslint-disable */
import { login } from "r/index/login"; import { login } from "r/index/login";
import { mobileCheck } from "@/common/utils.js"; import { mobileCheck } from "@/common/utils.js";
...@@ -128,9 +123,9 @@ export default { ...@@ -128,9 +123,9 @@ export default {
}, },
], ],
}, },
}; };
}, },
created() { created() {
...@@ -175,7 +170,7 @@ export default { ...@@ -175,7 +170,7 @@ export default {
); );
// 跳转到报名 // 跳转到报名
this.$router.push({ path: "/signUp/examInfo" }); this.$router.push({ path: "/signUp/examInfo" });
}); });
}); });
}, },
...@@ -184,109 +179,12 @@ export default { ...@@ -184,109 +179,12 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
// 内容区域
.box_content {
.content {
max-width: 1150px;
margin: 40px auto;
padding: 0 50px;
overflow: auto;
.floatL {
float: left;
width: 670px;
h3 {
font-size: 20px;
color: #4c4c4c;
font-weight: inherit;
padding-bottom: 15px;
margin-bottom: 23px;
border-bottom: 4px solid #e0823d;
}
ul {
li {
height: 40px;
line-height: 40px;
border-bottom: 1px solid #ddd;
a {
display: inline-block;
width: 100%;
font-size: 16px;
color: #34538b;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
}
.ContentLReg {
height: 60px;
color: #333333;
font-size: 14px;
span {
cursor: pointer;
color: #563279;
font-weight: bold;
&:hover {
text-decoration: underline;
}
}
}
.img_box {
width: 100%;
height: 156px;
text-align: center;
img {
&:nth-child(1) {
margin-right: 40px;
}
}
}
}
.floatR {
float: right;
width: 374px;
ul {
margin-top: 36px;
margin-left: 87px;
li {
font-size: 16px;
width: 100%;
height: 45px;
line-height: 45px;
padding-left: 70px;
margin-bottom: 35px;
// &:nth-child(1) {
// background: url("../../../assets/images/weidu.png") no-repeat 0px
// center;
// }
// &:nth-child(2) {
// background: url("../../../assets/images/fangshi.png") no-repeat 0px
// center;
// }
// &:nth-child(3) {
// background: url("../../../assets/images/xingtai.png") no-repeat 0px
// center;
// }
}
}
}
}
}
.container { .container {
width: 440px;
// height: 640px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 1px 18px 0px rgba(0, 0, 0, 0.06); box-shadow: 0px 1px 18px 0px rgba(0, 0, 0, 0.06);
border-radius: 8px; border-radius: 8px;
position: absolute; padding: 40px 60px;
top: 50%;
right: 18%;
// left: 10%;
transform: translate(0, -50%);
padding: 60px;
margin-top: 0; margin-top: 0;
// background: url("../../../assets/images/loginbgp.png") no-repeat 0 center;
overflow: hidden; overflow: hidden;
.title { .title {
margin: 19px 0 6px 0; margin: 19px 0 6px 0;
...@@ -385,19 +283,4 @@ export default { ...@@ -385,19 +283,4 @@ export default {
} }
} }
} }
@media screen and (max-width: 1601px) {
.container {
right: 18%;
}
}
@media screen and (max-width: 1501px) {
.container {
right: 16%;
}
}
@media screen and (max-width: 1401px) {
.container {
right: 14%;
}
}
</style> </style>
src/views/index/login/Register.vue
View file @ c0d40e50
...@@ -276,121 +276,13 @@ export default { ...@@ -276,121 +276,13 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
// 内容区域
.box_content {
.content {
max-width: 1150px;
margin: 40px auto;
padding: 0 50px;
overflow: auto;
.floatL {
float: left;
width: 670px;
h3 {
font-size: 20px;
color: #4c4c4c;
font-weight: inherit;
padding-bottom: 15px;
margin-bottom: 23px;
border-bottom: 4px solid #e0823d;
}
ul {
li {
height: 40px;
line-height: 40px;
border-bottom: 1px solid #ddd;
a {
display: inline-block;
width: 100%;
font-size: 16px;
color: #34538b;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
}
.ContentLReg {
height: 60px;
color: #333333;
font-size: 14px;
span {
cursor: pointer;
color: #563279;
font-weight: bold;
&:hover {
text-decoration: underline;
}
}
}
.img_box {
width: 100%;
height: 156px;
text-align: center;
img {
&:nth-child(1) {
margin-right: 40px;
}
}
}
}
.floatR {
float: right;
width: 374px;
ul {
margin-top: 36px;
margin-left: 87px;
li {
font-size: 16px;
width: 100%;
height: 45px;
line-height: 45px;
padding-left: 70px;
margin-bottom: 35px;
// &:nth-child(1) {
// background: url("../../../assets/images/weidu.png") no-repeat 0px
// center;
// }
// &:nth-child(2) {
// background: url("../../../assets/images/fangshi.png") no-repeat 0px
// center;
// }
// &:nth-child(3) {
// background: url("../../../assets/images/xingtai.png") no-repeat 0px
// center;
// }
}
}
}
}
}
// 注册输入 // 注册输入
.container { .container {
width: 440px;
// height: 640px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 1px 18px 0px rgba(0, 0, 0, 0.06); box-shadow: 0px 1px 18px 0px rgba(0, 0, 0, 0.06);
border-radius: 8px; border-radius: 8px;
position: absolute; padding: 40px 60px;
top: 50%;
right: 18%;
transform: translate(0, -50%);
padding: 60px;
margin-top: 0; margin-top: 0;
overflow: hidden; overflow: hidden;
......
src/views/index/login/Reset.vue
View file @ c0d40e50
...@@ -268,121 +268,13 @@ export default { ...@@ -268,121 +268,13 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
// 内容区域
.box_content {
.content {
max-width: 1150px;
margin: 40px auto;
padding: 0 50px;
overflow: auto;
.floatL {
float: left;
width: 670px;
h3 {
font-size: 20px;
color: #4c4c4c;
font-weight: inherit;
padding-bottom: 15px;
margin-bottom: 23px;
border-bottom: 4px solid #e0823d;
}
ul {
li {
height: 40px;
line-height: 40px;
border-bottom: 1px solid #ddd;
a {
display: inline-block;
width: 100%;
font-size: 16px;
color: #34538b;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
}
.ContentLReg {
height: 60px;
color: #333333;
font-size: 14px;
span {
cursor: pointer;
color: #563279;
font-weight: bold;
&:hover {
text-decoration: underline;
}
}
}
.img_box {
width: 100%;
height: 156px;
text-align: center;
img {
&:nth-child(1) {
margin-right: 40px;
}
}
}
}
.floatR {
float: right;
width: 374px;
ul {
margin-top: 36px;
margin-left: 87px;
li {
font-size: 16px;
width: 100%;
height: 45px;
line-height: 45px;
padding-left: 70px;
margin-bottom: 35px;
// &:nth-child(1) {
// background: url("../../../assets/images/weidu.png") no-repeat 0px
// center;
// }
// &:nth-child(2) {
// background: url("../../../assets/images/fangshi.png") no-repeat 0px
// center;
// }
// &:nth-child(3) {
// background: url("../../../assets/images/xingtai.png") no-repeat 0px
// center;
// }
}
}
}
}
}
// 注册输入 // 注册输入
.container { .container {
width: 440px;
// height: 640px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 1px 18px 0px rgba(0, 0, 0, 0.06); box-shadow: 0px 1px 18px 0px rgba(0, 0, 0, 0.06);
border-radius: 8px; border-radius: 8px;
position: absolute; padding: 40px 60px;
top: 50%;
right: 18%;
transform: translate(0, -50%);
padding: 60px;
margin-top: 0; margin-top: 0;
overflow: hidden; overflow: hidden;
......
src/views/index/recruit/Index.vue
View file @ c0d40e50
<template> <template>
<div class="recruit"> <div class="recruit">
<div> <el-header height="104px">
<Header></Header> <Header></Header>
</div> <div class="bg-top"></div>
<div class="content flex"> </el-header>
<div class="cc flex"> <div class="com-container content">
<div class="title">2021年南开大学历史学科暑假营招生简章</div> <div class="title">2021年南开大学历史学科暑假营招生简章</div>
<div class="time">发布时间：2021-12-28</div> <div class="time">发布时间：2021-12-28</div>
<div class="part"> <div class="part">
<span>第一部分</span> <span>第一部分</span>
<p> <p>
南开大学是教育部直属重点综合性大学，是敬爱的周恩来总理的母校。新中国成立以来，学校发展始终得到党和国家的亲切关怀。毛泽东主席题写校名、亲临视察；周恩来总理三回母校指导；邓小平同志会见数学大师陈省身，批示成立南开数学研究所；江泽民同志、胡锦涛同志先后视察南开。特别是党的十八大以来，习近平总书记多次对南开的发展给予肯定，并对相关工作回信和勉励，更在百年校庆之际亲临南开视察。 南开大学是教育部直属重点综合性大学，是敬爱的周恩来总理的母校。新中国成立以来，学校发展始终得到党和国家的亲切关怀。毛泽东主席题写校名、亲临视察；周恩来总理三回母校指导；邓小平同志会见数学大师陈省身，批示成立南开数学研究所；江泽民同志、胡锦涛同志先后视察南开。特别是党的十八大以来，习近平总书记多次对南开的发展给予肯定，并对相关工作回信和勉励，更在百年校庆之际亲临南开视察。
</p> </p>
</div> </div>
<div class="part"> <div class="part">
<span>第二部分</span> <span>第二部分</span>
<p> <p>
南开大学由严修、张伯苓秉承教育救国理念创办，肇始于1904年，成立于1919年。1937年校园遭侵华日军炸毁，学校南迁。1938年与北京大学、清华大学合组西南联合大学，被誉为“学府北辰”。1946年回津复校并改为国立。 南开大学由严修、张伯苓秉承教育救国理念创办，肇始于1904年，成立于1919年。1937年校园遭侵华日军炸毁，学校南迁。1938年与北京大学、清华大学合组西南联合大学，被誉为“学府北辰”。1946年回津复校并改为国立。
</p> </p>
<p> <p>
新中国成立后，经历高等教育院系调整，成为文理并重的全国重点大学。改革开放以来，天津对外贸易学院、中国旅游管理干部学院相继并入，经教育部与天津市共建支持，学校发展成为国家“211工程”和“985工程”重点建设的综合性研究型大学。2015年9月，新校区建成启用后，初步形成了八里台校区、津南校区、泰达学院“一校三区”办学格局。2017年9月，入选国家42所世界一流大学建设高校，且为36所A类高校之一。 新中国成立后，经历高等教育院系调整，成为文理并重的全国重点大学。改革开放以来，天津对外贸易学院、中国旅游管理干部学院相继并入，经教育部与天津市共建支持，学校发展成为国家“211工程”和“985工程”重点建设的综合性研究型大学。2015年9月，新校区建成启用后，初步形成了八里台校区、津南校区、泰达学院“一校三区”办学格局。2017年9月，入选国家42所世界一流大学建设高校，且为36所A类高校之一。
</p> </p>
</div> </div>
<div class="paper"> <div class="paper">
<img src="../../../assets/img/recruit.png" alt="" /> <img src="../../../assets/img/recruit.png" alt=""/>
</div> </div>
<div class="part"> <div class="part">
<span>第三部分</span> <span>第三部分</span>
<p> <p>
南开大学坚持“允公允能，日新月异”的校训，弘扬“爱国、敬业、创新、乐群”的传统和“文以治国、理以强国、商以富国”的理念，以“知中国，服务中国”为宗旨，以杰出校友周恩来为楷模，作育英才，繁荣学术，强国兴邦，传承文明，努力建设世界一流大学。 南开大学坚持“允公允能，日新月异”的校训，弘扬“爱国、敬业、创新、乐群”的传统和“文以治国、理以强国、商以富国”的理念，以“知中国，服务中国”为宗旨，以杰出校友周恩来为楷模，作育英才，繁荣学术，强国兴邦，传承文明，努力建设世界一流大学。
</p> </p>
<p> <p>
南开大学占地443.12万平方米，其中八里台校区占地121.60万平方米，津南校区占地245.89万平方米，泰达学院占地6.72万平方米。校舍建筑总面积195.19万平方米。按照“独立办学、紧密合作”的原则，与天津大学全面合作办学。 南开大学占地443.12万平方米，其中八里台校区占地121.60万平方米，津南校区占地245.89万平方米，泰达学院占地6.72万平方米。校舍建筑总面积195.19万平方米。按照“独立办学、紧密合作”的原则，与天津大学全面合作办学。
</p> </p>
</div> </div>
<div class="btn">
<el-button @click="toLogin()">立即报名</el-button>
</div> </div>
</div> </div>
<div class="btn"> <Footer></Footer>
<el-button @click="toLogin()">立即报名 </el-button>
</div>
<div>
<Footer></Footer>
</div>
</div> </div>
</template> </template>
<script> <script>
/* eslint-disable */
import Header from "@/components/index/Header.vue";
import Footer from "@/components/index/Footer.vue";
import { getCam } from "r/index/login";
export default { import Header from "@/components/index/Header.vue";
name: "recruit", import Footer from "@/components/index/Footer.vue";
data() { import {getCam} from "r/index/login";
return {};
}, export default {
created(){ name: "recruit",
window.localStorage.setItem( data() {
"index-identity", return {};
"c59086fdb37848e7a10765812d1da349" },
); created() {
this.getCam(); window.localStorage.setItem(
}, "index-identity",
methods: { "c59086fdb37848e7a10765812d1da349"
toLogin() { );
this.$router.replace({ name: "index-login" }); this.getCam();
},
methods: {
toLogin() {
this.$router.replace({name: "index-login"});
},
getCam() {
getCam({}).then((res) => {
console.log(res, "getCam");
let root = document.querySelector(":root");
root.style.setProperty("--color", res.data.system_color);
root.style.setProperty("--bk_pic", res.data.background_picture); //当前营地的背景图
window.localStorage.setItem('bk_pic',res.data.background_picture)
//当前营地logo
window.localStorage.setItem("system_logo", res.data.system_logo);
window.localStorage.setItem(
"doubt_code",
res.data.fill_individual_Invitationcode
); //是否填写邀请码
window.localStorage.setItem(
"doubt_info",
res.data.fill_individual_information
); //是否填写个人资料
window.localStorage.setItem(
"doubt_check",
res.data.audit_individual_information
); //是否审核个人资料
});
},
}, },
getCam() { components: {
getCam({}).then((res) => { Header,
console.log(res, "getCam"); Footer,
let root = document.querySelector(":root");
root.style.setProperty("--color", res.data.system_color);
root.style.setProperty("--bk_pic", res.data.background_picture); //当前营地的背景图
//当前营地logo
window.localStorage.setItem("system_logo", res.data.system_logo);
window.localStorage.setItem(
"doubt_code",
res.data.fill_individual_Invitationcode
); //是否填写邀请码
window.localStorage.setItem(
"doubt_info",
res.data.fill_individual_information
); //是否填写个人资料
window.localStorage.setItem(
"doubt_check",
res.data.audit_individual_information
); //是否审核个人资料
});
}, },
}, };
components: {
Header,
Footer,
},
};
</script> </script>
<style lang="scss" > <style lang="scss">
.flex { @import "a/scss/common";
display: flex;
}
.recruit {
font-family: PingFangSC-Medium, PingFang SC;
flex-direction: column; .recruit {
.content { font-family: PingFang SC;
justify-content: center; .el-header {
.cc { position: fixed;
width: 60%; width: 100%;
justify-content: space-around; padding: 0;
align-items: center; background-color: #ffffff;
flex-direction: column; z-index: 10000;
}
.title { .bg-top {
margin: 90px 0 20px 0; height: 24px;
font-size: 34px; background-color: #f8f8f8;
text-align: center; }
}
.time {
font-size: 12px;
font-weight: 500;
color: #828282;
text-align: center;
}
.paper img {
width: 654px;
height: 368px;
} }
.part { .content {
span { .title {
font-size: 16px; padding: 170px 0 20px 0;
font-weight: 600; font-size: 34px;
color: #333333; text-align: center;
} }
p {
font-size: 16px; .time {
font-size: 12px;
font-weight: 500; font-weight: 500;
color: #666666; color: #828282;
line-height: 32px; text-align: center;
}
.paper{
text-align: center;
margin: 8px 0 24px 0;
img {
width: 654px;
height: 368px;
}
}
.part {
span {
font-size: 16px;
font-weight: 600;
color: #333333;
}
p {
font-size: 16px;
font-weight: 500;
color: #666666;
line-height: 32px;
}
}
.btn {
text-align: center;
padding-bottom: 104px;
.el-button {
width: 200px;
height: 50px;
background: var(--color);
border-radius: 4px;
opacity: 0.8;
line-height: 50px;
text-align: center;
color: #fff;
font-size: 16px;
padding: 0;
margin: 30px 0 0 0;
}
} }
} }
} }
.btn {
text-align: center;
padding-bottom: 104px;
.el-button {
width: 200px;
height: 50px;
background:var(--color);
border-radius: 4px;
opacity: 0.8;
line-height: 50px;
text-align: center;
color: #fff;
font-size: 16px;
padding: 0;
margin: 30px 0 0 0;
}
}
}
</style> </style>
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