653 lines
21 KiB
Vue
653 lines
21 KiB
Vue
<script lang="ts" setup>
|
||
import {ref, getCurrentInstance, ComponentInternalInstance, reactive} from 'vue'
|
||
import {ElMessage} from 'element-plus'
|
||
//图片
|
||
import image1 from '@/assets/images/gk/2023/sxznps.jpg';
|
||
import image2 from '@/assets/images/gk/2023/ddps.jpg';
|
||
import image3 from '@/assets/images/gk/2023/gzdz1200.jpg';
|
||
|
||
//=============
|
||
import {Swiper, SwiperSlide} from "swiper/vue";
|
||
import {Navigation, Pagination, Scrollbar, A11y, Autoplay} from 'swiper';
|
||
import "swiper/css";
|
||
import {SchoolEntity} from "@/types";
|
||
import ApiConstant from "@/utils/ApiConstant";
|
||
|
||
//轮播图组件参数
|
||
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
|
||
const modules = [Navigation, Pagination, Scrollbar, A11y, Autoplay];
|
||
const onSwiper = (swiper: any) => {
|
||
console.log(swiper);
|
||
};
|
||
const navigation = ref({
|
||
nextEl: '.button-next',
|
||
prevEl: '.button-prev',
|
||
})
|
||
const prevEl = () => {
|
||
// console.log('上一张' + index + item)
|
||
}
|
||
const nextEl = () => {
|
||
// console.log('下一张')
|
||
}
|
||
|
||
//主数据对象
|
||
const state = reactive({
|
||
hotSchoolList: [] as Array<SchoolEntity>,
|
||
hotTabActive: 1
|
||
})
|
||
const hotSchoolList = reactive({
|
||
nowProvinceBenSchoolList: [],//本省，本科
|
||
nowProvinceZhuanSchoolList: [],//本省，专科
|
||
otherProvinceBenSchoolList: [],//外省，本科
|
||
otherProvinceZhuanSchoolList: []//外省，专科
|
||
})
|
||
|
||
getHotSchoolList()
|
||
|
||
//获取热门院校
|
||
function getHotSchoolList() {
|
||
proxy?.$axios({
|
||
url: ApiConstant.School.hotSchoolList,
|
||
method: 'get',
|
||
params: {},
|
||
showLoading: false,//是否显示加载图标
|
||
}).then((response) => {
|
||
return response.data
|
||
}).then((data) => {
|
||
console.log(data)
|
||
//有数据情况下
|
||
hotSchoolList.nowProvinceBenSchoolList = data.result.nowProvinceBenSchoolList
|
||
hotSchoolList.nowProvinceZhuanSchoolList = data.result.nowProvinceZhuanSchoolList
|
||
hotSchoolList.otherProvinceBenSchoolList = data.result.otherProvinceBenSchoolList
|
||
hotSchoolList.otherProvinceZhuanSchoolList = data.result.otherProvinceZhuanSchoolList
|
||
if (state.hotTabActive == 1) {
|
||
state.hotSchoolList = hotSchoolList.nowProvinceBenSchoolList
|
||
}
|
||
}).catch((error: any) => {
|
||
console.log(error);
|
||
}).finally(() => {
|
||
});
|
||
}
|
||
|
||
function copyText(textToCopy) {
|
||
const textField = document.createElement('textarea');
|
||
textField.innerText = textToCopy;
|
||
document.body.appendChild(textField);
|
||
textField.select();
|
||
document.execCommand('copy');
|
||
textField.remove();
|
||
ElMessage({
|
||
message: '已复制.',
|
||
type: 'success',
|
||
})
|
||
}
|
||
|
||
//切换 热门学院
|
||
function switchHotTab(index: number) {
|
||
state.hotTabActive = index
|
||
//切换数据
|
||
if (index == 1) {
|
||
state.hotSchoolList = hotSchoolList.nowProvinceBenSchoolList
|
||
} else if (index == 2) {
|
||
state.hotSchoolList = hotSchoolList.nowProvinceZhuanSchoolList
|
||
} else if (index == 3) {
|
||
state.hotSchoolList = hotSchoolList.otherProvinceBenSchoolList
|
||
} else if (index == 4) {
|
||
state.hotSchoolList = hotSchoolList.otherProvinceZhuanSchoolList
|
||
}
|
||
}
|
||
|
||
</script>
|
||
|
||
<template>
|
||
<div class="margin-5"></div>
|
||
<div class="main-container wrap main-fullScreen">
|
||
<el-row :gutter="20">
|
||
<!-- 轮播图-->
|
||
<el-col :span="18">
|
||
<div class="header_swiper">
|
||
<Swiper
|
||
:modules="modules"
|
||
:pagination="true"
|
||
:mousewheel="true"
|
||
:keyboard="true"
|
||
@swiper="onSwiper"
|
||
:navigation="navigation"
|
||
:autoplay="{ delay: 3000, disableOnInteraction: false }"
|
||
:loop="true"
|
||
>
|
||
<swiper-slide style="width: 1200px">
|
||
<img :src="image1" alt="Image"/>
|
||
</swiper-slide>
|
||
<swiper-slide style="width: 1200px">
|
||
<img :src="image2" alt="Image"/>
|
||
</swiper-slide>
|
||
<swiper-slide style="width: 1200px">
|
||
<img :src="image3" alt="Image"/>
|
||
</swiper-slide>
|
||
</Swiper>
|
||
</div>
|
||
<div class="swiper-scrollbar"></div>
|
||
<div class='button-prev' @click.stop='prevEl'><img
|
||
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAwCAYAAAAPfWqeAAADpUlEQVRYR73YX2gcRRwH8N9v7vyDIiJSqtJaFEVRLBSs+CAotNogRZTs7s2sUEgFhQr1QR/aBxVsH3xRWvtQqf9Q4TZOdtOeOUOjbc4HoYpBQfClD75JIzHV9BrTO2/zlc3NJmtzyf3bu31clt9nfjO/mZ0Zph49ANjzRg4x0xDAR7kXDgAxPDxyAqAXovjM9HvqUIR4nv8JEfbESTDzgVQhrXUmDPlzACqBHFbKfj01qFQqZaen/8wDsGNECHpTSuetpe5LY4ympqauOX/+N01EzyaQg1I6by9n1i00Pj5+3dzcvA9g90osfs117XeSsbvKqFQqXT89PXMSoIGVMRGvKGW9d3UCHUNjY2M3lMsLBSLaWS9hBjNeltI53qiXOoImJiZuvHjxUhHAEyboohD8kpT2h2sNRdtQoVC4aX6+Mk5Ej8UIkdjrutan6413W5DW+uYwpNMAPWpmfEhEe5Ry8s2KqmWoWCzeUi7/MwHQdjMmNYCfd10rKuumT0vQ6OjorZVK+A2AbSbiv8yUU8o52VQwHzSFtNYbwpDPANhqMqkIwXYuZ421ijRdGfL5wkaiyiQRPWCCXiGi51zXOd0Osi7keYU7gCXkPjPwC0JknsnlBs+0i6wJBUGwqVoNSwDdY4LOM/NupexvO0EaQkEQbDHIXfWgXM5m8bTjON91iqyCgiC4u1JZnCTCFhP0UjZLA47jnOsG+R/k+/691SoiZJPJ5G8hxFNSDv7YLbIM+b5/v0FuN8isQX5KA1mC8nn/QebFswBtNNU1A4idrmv9khZiIP0DET1ikD8AscN1rV/TRPoN9anrorQaFQMzP6mU9XNaXbi8qK4ub/pLiMyuVMs7bnU0Yc2qcKcpjjnmzICUg993m9mq30RflqC41Z53ajNRdbKni+oK1offRIxprW+r1ehsT398CWyDwR6qFwhXmMmS0i62UyBN9wxRsL5sTuJW17dbC18DeNhkVmMmV0p7pJXMWsoo0Y2930DGWKMtsRA8JKX92XqZtZVRHCja5M/Ozn1FRI+bd4vM9KJSzkdrYR1BUbDo2HL58pUvAewwYwYi3qeU9X4jrGMoChYdxC5cmDlFRLtWgvN+17WPXY11BUXBGh0thaBXpXTeTWJdQ1EwrfW1tRp90dPDctzq+vF/xgPIit8x8xtK2YeWxrCVydbqN3250EhM6kytxh8nr2iEoIOpZhRj9Usn/wMAe+ul34NLpwTGw8P+YYCGiOjIf5yH1rQHeb5wAAAAAElFTkSuQmCC"
|
||
alt="">
|
||
</div>
|
||
<div class='button-next' @click.stop='nextEl'><img
|
||
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAwCAYAAAAPfWqeAAADa0lEQVRYR9XYX4hUVRwH8O9v7zTjto5buy6N9OaDL0FQrJBQ0IzW2jbb6M7sae+CiSRhD/2hIHrQQHvopR4KCgp0Qejeu/fOmoTFmgoFPYQFgYIUiWIuqUREhKI1c74x3jPuqOvuzu6Zge7rDL8P5/x+55zfOeJ50RsifIXEuOuO7BIRogWf+H44TeL+WmwR7B0dHXlBRLRtS4IgfFNrvDMTWPa7bmmbbUxqgO9Hb5PcWcdExHccblFKVW2N7DpU+4IgfEtr7G7Aokxm5Vg2m63YwG5ABrtlGnFwzZrVqr+//9+lYjdBtWCeF70O8N2GkR3q7u4qDQ4OXlsKdhsU56z8Mqnfn8Ewlcn0bc5ms1cXi80KmWl8kZQPSdb/czSd7iwMDQ1dWQx2RyjGou1a82MAHfE6k697elbkBwYGLjeLzQnFOStvBfS+Ogbg266u1GChUPi7GWxeKM5ZOAZgPwnH7CDfOQ42KqX+Wii2IMiMTInwU5IJg32fTt89kM/n/1wItmDIjGwziQkAd5mc/ZhKOU8MDw//MR/WFFQLNjFRHtKaEcmUwU44DjcopX6fC2saMtX4lNY8AGCZCX4KSOXGxgqX7oQtCopHNrlB6+rnJDpN8J9FUjnXLfw2G7ZoKM5Z9DjJQwC6TIGcTiadbLFYnL4VWxJksMdIfAEwbbCzBjvXiC0ZqgULw3BdpYIpACvi4HIulerIFYvFM3XMChQXyORarfVXAO8x2HQyKblSqfTLdXq++m/m9yCYfJisHiHRY7ALBvvJKmR2kAdF9FESfSZnl8iO9dYhgz0goo+RuM/MyPH/L+R55dZPne+XHyJ5BGBvy4ohLu/qYQD3tqy8g2DyEbI6RaLbVNqvZnewt2DDMHy0UpEvW7oFzbapAsmc6246b21Tbcsx4XnhRgCfNR58iQTWK6UuWjv4giDKkyjXj3IAJw1i7yj3/bD1zUkQRCMkvJl2S35IpzuftNputaWBDILoOa053tKW2PfD50l80oB809vb/bTVJt/3yzsAflS/tojIseXLlz1j9driedFLAD9oWBOHV63q22T1IhYE4Wta470b3YuI/avl7W8OOJhI4Fml1D/NNClzdqq+H+0iuWdmJChnMn2u1et/Wx402vZE07ZHp9ozGoBXRTA+Olra2apntP8AQCOqBFQ0cxQAAAAASUVORK5CYII="
|
||
alt="">
|
||
</div>
|
||
</el-col>
|
||
<!-- 表单-->
|
||
<el-col :span="6" style="z-index: 5">
|
||
<div class="" style="background-color: #ffffff;height:420px ">待补充</div>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="20">
|
||
<el-col :span="24">
|
||
<div class="hot_school" v-if="state.hotSchoolList && state.hotSchoolList.length>0">
|
||
<div class="l_title clearfix">
|
||
<div class="left_title">热门院校</div>
|
||
<div class="right_tab clearfix">
|
||
<div class="hot_school_tab am_l set_hoverl" :class="{'active':1==state.hotTabActive}"
|
||
@click="switchHotTab(1)">河南本科院校
|
||
</div>
|
||
<div class="hot_school_tab am_l set_hoverl" :class="{'active':2==state.hotTabActive}"
|
||
@click="switchHotTab(2)">河南专科院校
|
||
</div>
|
||
<div class="hot_school_tab am_l set_hoverl" :class="{'active':3==state.hotTabActive}"
|
||
@click="switchHotTab(3)">省外本科院校
|
||
</div>
|
||
<div class="hot_school_tab am_l set_hoverl" :class="{'active':4==state.hotTabActive}"
|
||
@click="switchHotTab(4)">省外专科院校
|
||
</div>
|
||
<!-- <div class="change_group">换一换<i></i></div>-->
|
||
</div>
|
||
</div>
|
||
<div class="hot_school_box clearfix">
|
||
<div class="left" style="background: rgb(255, 141, 66);">
|
||
<a :href="'/school/'+state.hotSchoolList[0].schoolCode" target="_blank">
|
||
<h3>{{ state.hotSchoolList[0].schoolName }}</h3>
|
||
<p class="tag">
|
||
<span v-for="item in state.hotSchoolList[0].tagsList">{{ item }}</span>
|
||
</p>
|
||
<div class="tuijian" v-if="state.hotSchoolList[0].schoolIcon">
|
||
<div class="school_tuijian">
|
||
<div class="school_img"><img :src="state.hotSchoolList[0].schoolIcon" alt=""></div>
|
||
</div>
|
||
</div>
|
||
</a></div>
|
||
<div class="right">
|
||
<div v-for="(item,index) in state.hotSchoolList">
|
||
<div class="school_item" data-growing-container="" v-if="index>0">
|
||
<a :href="'/school/'+item.schoolCode" target="_blank">
|
||
<img :src="item.schoolIcon" alt="">
|
||
<div class="school_msg"><h3>{{ item.schoolName }}</h3>
|
||
<div class="clearfix check_btn">
|
||
<span class="school_class">{{ item.institutionType + '类' }}</span>
|
||
<span>查看院校<i></i></span>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="20" class="margin-top-5">
|
||
<el-col :span="14">
|
||
<div class="school-footer_footerBox">
|
||
<div class="school-footer_leftIntroduce">
|
||
<div class="school-footer_useIntro"><h3>系统使用说明</h3>
|
||
</div>
|
||
<p>1、本查询系统的信息仅供参考，具体数据请以学校官网或考试院公布为准。</p>
|
||
<p>2、本站数据未经授权严禁转载，违者将依法追究责任。</p>
|
||
<p>3、如有任何疑问，可发送邮件至：<a @click="copyText('yitisheng@163.com')" class="a-button hover_style"
|
||
style="color:var(--el-color-primary);">yitisheng@163.com</a></p>
|
||
<p>4、志愿填报服务客服专线：xxx-xxxx-xxx，高校合作或其他商务客服电话：xxx-xxxx-xxx。</p>
|
||
<p class="school-footer_friendChain"><span>友情链接：</span><a href="https://www.eol.cn/"
|
||
target="_blank">中国教育在线</a><a
|
||
href="https://gaokao.eol.cn/" target="_blank">高考频道</a><a href="https://www.kaoyan.cn/"
|
||
target="_blank">掌上考研</a><a
|
||
href="https://kaoyan.eol.cn/" target="_blank">考研频道</a><a href="https://www.zhijiao.cn/"
|
||
target="_blank">职教网</a><a
|
||
href="https://www.gaokao.cn/px/" target="_blank">掌上培训</a><a href="https://www.jiuyeqiao.cn/"
|
||
target="_blank">就业桥</a><a
|
||
href="https://yun.eol.cn/" target="_blank">数智云服</a></p></div>
|
||
<!-- <div class="school-footer_rightCode__3VuW7 clearfix">
|
||
<div class="school-footer_codeItem__1Spmk"><img src="/static/media/gzh.ab190311.jpg">
|
||
<p>掌上高考公众号</p></div>
|
||
<div class="school-footer_codeItem__1Spmk"><img src="/static/media/app.289cbf0b.png">
|
||
<p>掌上高考APP</p></div>
|
||
</div>-->
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="2"></el-col>
|
||
<el-col :span="8">
|
||
<div class="qrcode">
|
||
<div class="qrcode-item">
|
||
<img src="@/assets/images/qrcode/wx_gh_cbefbadc1f1f_344.jpg" alt="" width="135">
|
||
<div class="qrcode-text" style="">微信小程序</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
<el-backtop :bottom="100" :visibility-height="100">
|
||
<el-icon color="#409efc" class="no-inherit">
|
||
<Share/>
|
||
</el-icon>
|
||
</el-backtop>
|
||
<div class="margin-5"></div>
|
||
</template>
|
||
|
||
<style scoped lang="scss">
|
||
root {
|
||
width: 100%;
|
||
}
|
||
|
||
/*轮播图 start*/
|
||
.header_swiper {
|
||
z-index: -1;
|
||
width: 1200px !important;
|
||
height: 420px !important;
|
||
}
|
||
|
||
.swiper {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.swiper-wrapper {
|
||
position: relative;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 1;
|
||
display: -webkit-flex;
|
||
display: -ms-flexbox;
|
||
display: flex;
|
||
-webkit-transition-property: -webkit-transform;
|
||
transition-property: -webkit-transform;
|
||
-o-transition-property: transform;
|
||
transition-property: transform;
|
||
transition-property: transform, -webkit-transform;
|
||
-webkit-box-sizing: content-box;
|
||
box-sizing: content-box;
|
||
}
|
||
|
||
.swiper-slide {
|
||
text-align: center;
|
||
font-size: 18px;
|
||
background: #fff;
|
||
/* Center slide text vertically */
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 1200px;
|
||
height: 420px !important;
|
||
}
|
||
|
||
.swiper-slide img {
|
||
-webkit-flex-shrink: 0;
|
||
flex-shrink: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
position: relative;
|
||
-webkit-transition-property: -webkit-transform;
|
||
transition-property: -webkit-transform;
|
||
-o-transition-property: transform;
|
||
transition-property: transform;
|
||
transition-property: transform, -webkit-transform;
|
||
}
|
||
|
||
swiper-slide img {
|
||
display: block;
|
||
margin: 0 auto;
|
||
position: absolute;
|
||
top: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
}
|
||
|
||
.button-prev {
|
||
position: absolute;
|
||
top: 185px;
|
||
left: 10px;
|
||
z-index: 99;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.button-next {
|
||
position: absolute;
|
||
top: 185px;
|
||
right: 300px;
|
||
z-index: 99;
|
||
cursor: pointer;
|
||
}
|
||
|
||
/*轮播图 end*/
|
||
|
||
|
||
//热门院校
|
||
.hot_school {
|
||
margin-bottom: 40px;
|
||
/*padding: 0 20px;*/
|
||
.l_title {
|
||
height: 44px;
|
||
line-height: 44px;
|
||
border-bottom: 2px solid var(--el-color-primary);
|
||
width: 100%;
|
||
|
||
.left_title {
|
||
font-size: 20px;
|
||
color: #000;
|
||
position: relative;
|
||
padding-left: 12px;
|
||
width: 330px;
|
||
float: left;
|
||
font-weight: 700;
|
||
|
||
.right_tab {
|
||
margin-left: 10px;
|
||
float: left;
|
||
width: 820px;
|
||
}
|
||
}
|
||
|
||
.right_tab .hot_school_tab.active {
|
||
color: var(--el-color-primary);
|
||
}
|
||
|
||
|
||
.right_tab .hot_school_tab {
|
||
float: left;
|
||
font-size: 18px;
|
||
color: #000;
|
||
margin-right: 32px;
|
||
cursor: pointer;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.right_tab .hot_school_tab:hover {
|
||
color: var(--el-color-primary);
|
||
}
|
||
|
||
.am_l {
|
||
transition: all .4s;
|
||
}
|
||
|
||
.change_group {
|
||
float: right;
|
||
color: #f60;
|
||
font-size: 14px;
|
||
text-align: right;
|
||
cursor: pointer;
|
||
width: 68px;
|
||
height: 44px;
|
||
position: relative;
|
||
-webkit-user-select: none;
|
||
-ms-user-select: none;
|
||
user-select: none;
|
||
}
|
||
}
|
||
|
||
.hot_school_box {
|
||
.left {
|
||
float: left;
|
||
width: 330px;
|
||
height: 332px;
|
||
background: #ffeaea;
|
||
text-align: center;
|
||
padding-top: 28px;
|
||
cursor: pointer;
|
||
|
||
h3 {
|
||
font-size: 24px;
|
||
color: #fff;
|
||
margin-bottom: 20px;
|
||
overflow: hidden;
|
||
/*text-overflow: ellipsis;*/
|
||
white-space: nowrap;
|
||
transition: all .4s;
|
||
padding: 0 10px;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.tag {
|
||
margin-bottom: 54px;
|
||
|
||
span {
|
||
display: inline-block;
|
||
padding: 4px 5px;
|
||
margin-right: 10px;
|
||
border-radius: 4px;
|
||
border: 1px solid hsla(0, 0%, 100%, .4);
|
||
color: #fff;
|
||
}
|
||
|
||
span:last-child {
|
||
margin: 0;
|
||
}
|
||
}
|
||
|
||
.tuijian {
|
||
width: 195px;
|
||
height: 159px;
|
||
position: relative;
|
||
margin: 0 auto;
|
||
|
||
.school_tuijian {
|
||
width: 170px;
|
||
height: 187px;
|
||
background: #fff;
|
||
position: absolute;
|
||
top: 50%;
|
||
left: 50%;
|
||
-webkit-transform: translate(-50%, -50%);
|
||
transform: translate(-50%, -50%);
|
||
}
|
||
}
|
||
|
||
.school_img {
|
||
height: 100%;
|
||
position: relative;
|
||
|
||
img {
|
||
width: 128px;
|
||
height: 128px;
|
||
position: absolute;
|
||
top: 50%;
|
||
left: 50%;
|
||
-webkit-transform: translate(-50%, -50%);
|
||
transform: translate(-50%, -50%);
|
||
}
|
||
}
|
||
}
|
||
|
||
.right {
|
||
float: right;
|
||
width: 820px;
|
||
height: 350px;
|
||
margin: 10px 0 0 10px;
|
||
|
||
.school_item:hover {
|
||
top: -2px;
|
||
box-shadow: 0 10px 20px rgb(0 0 0 / 10%);
|
||
}
|
||
|
||
.school_item:hover .school_msg h3 {
|
||
color: var(--el-color-primary);
|
||
}
|
||
|
||
.school_item {
|
||
cursor: pointer;
|
||
float: left;
|
||
height: 110px;
|
||
width: 263px;
|
||
overflow: hidden;
|
||
margin-right: 10px;
|
||
margin-bottom: 10px;
|
||
position: relative;
|
||
transition: all .2s linear;
|
||
top: 0;
|
||
box-shadow: 0 0 15px #e6e6e6;
|
||
background-color: white;
|
||
|
||
img {
|
||
width: 65px;
|
||
height: 65px;
|
||
position: absolute;
|
||
left: 15px;
|
||
top: 50%;
|
||
-webkit-transform: translateY(-50%);
|
||
transform: translateY(-50%);
|
||
border: 0;
|
||
vertical-align: top;
|
||
}
|
||
|
||
.school_msg {
|
||
margin-left: 100px;
|
||
margin-top: 21px;
|
||
padding-right: 16px;
|
||
|
||
h3 {
|
||
color: #000;
|
||
font-size: 16px;
|
||
margin-bottom: 23px;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
transition: all .4s;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.check_btn {
|
||
.school_class {
|
||
display: inline-block;
|
||
padding: 0 6px;
|
||
border: 1px solid #eee;
|
||
}
|
||
|
||
span {
|
||
float: left;
|
||
font-size: 12px;
|
||
color: #999;
|
||
}
|
||
|
||
span + span {
|
||
margin-right: 12px;
|
||
float: right;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
span + span i {
|
||
display: inline-block;
|
||
width: 5px;
|
||
height: 9px;
|
||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAASCAYAAABit09LAAAAoklEQVQoU43SsQ0CMQwFUPsaZqOlp4wLdDRQMAUVXBEzABWiSwkbMEX2+OgiOOlIHOL6+cuyPlPj8OhU9UpEDxG5WHsJeu9vRLTquq53zg0lnGAIYRFjvANYWjjBFjzBf3gGaziDFi7CAl6b8PPfAcCGiA4mVNUTgJ6ZzyKyLcJfNKZnsIQyaKEZrKEJquoRwO57uFkK7/2LmZ8isq/WrKW7b6OXhYE4bznBAAAAAElFTkSuQmCC);
|
||
background-size: cover;
|
||
margin: 0 0 0 5px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
}
|
||
|
||
.l_title .change_group i {
|
||
display: inline-block;
|
||
width: 16px;
|
||
height: 13px;
|
||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAaCAYAAADWm14/AAADS0lEQVRIS73WXYjUZRTH8c8ZV8ylV8J8IagwCqOiqKTwppIogjIMC40oQmdmV0zWCgyKll4IwcwybeeP0U0k1UUpRV70Kt3ZC3RRhGhZmVEWdtFW6848Mf9mZXVndnYd6H875/k93/Ob85xzwiS+1ONqNcsk84VzcJrksPCz5DMFO9W8G5nBicpGu8DUr+CgxVgjueaY+FCTFI7TOCRscIrnY70/2+mPC5BWOdWQbZKbc6HwHQaE3abYa4Yf/KLbsLOFa7FYckMj9hthaQz4YjyIlgCp1/mG7cA87FfQ53o74g7V8QRT2eWSTZIFwj+4LSp2tjrTFCCtMsOQLyWzhA8kd0bmUDs7R35Pr5vifU9IHsbfwo1RsavZ+eYAJTsktwhvWmhJu6xbgaWix9AvHDDdxbHR4eNjxwCksnvVvJzb3u2yZocm6kQ9Lo0kw9bIrGgP0K/LQbfi+6j4dDKXNYtNq830l32YquC8GHBgdFzbZ9gpQO5C0XO4X3gyKh79/wF6XKGau7k7MvNbAuTV+5ELYouvO8089TgDl+Y6Sb1lvYNpprgJR1RVI/PJ0b8gv/w9r+F2YW1UrOsEIpXdp+allhphWDg3B2i021ckS48eCA9FxfqOIEqekawZo1G/PFkWmTci1e0p5c/unjGBBWtiwLMdQmyUrB6lURXuikrutkhFW9AzjlXLozKOlROgSyUvSFbmlZDcHZlXR47VAdYJsxrFsgBzRd4264On/u3qGOA/lx/Ensi81foVlJXUDODFyPROILmOQ45pRKnsLDU/YtBUc2Oz3zq+oY3A2FlQslnKs69EptwpQD6eT/Jtq5kyFqBoNr7C6eiLzMYThUi9rlL1sSTpcmWzBtdqHC+S8mKpl8+KEynC1Guear5L1Av8qcg80iyR1htR0QNY33g6j5vj6eg3NBE3UklRyvtHt/C22RZFv9qkAPIOWbRc5G94mrAHGyTbIvPH8WKpz3SDlqB8dHmtL6fJ2sgcaQXedhynkouwddRGXN8JP8de4XfJzHpPx4WSkxsX/ST0RsX2do61BRgRSEXXYSUWNgp0jAnCh8IWs2yPfsPtLs9b8USCRsc0RvYlquYIZ0p+1WWfgv2xKd+CJ/X9Czm9FazO5CrrAAAAAElFTkSuQmCC);
|
||
position: absolute;
|
||
right: 0;
|
||
top: 36%;
|
||
margin-top: -6 px;
|
||
transition: all .4s;
|
||
-webkit-transform-origin: center;
|
||
transform-origin: center;
|
||
background-size: cover;
|
||
}
|
||
|
||
|
||
//系统使用说明
|
||
.school-footer_footerBox {
|
||
width: 1200px;
|
||
/*margin: 0 auto;*/
|
||
background: hsla(0, 0%, 98%, .96);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.school-footer_leftIntroduce {
|
||
padding: 18px;
|
||
|
||
h3 {
|
||
font-size: 20px;
|
||
color: #000;
|
||
margin: 0 20px 0 0;
|
||
}
|
||
|
||
a {
|
||
color: #666;
|
||
text-decoration: none !important;
|
||
}
|
||
|
||
.school-footer_useIntro {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
.school-footer_friendChain a {
|
||
margin-right: 15px;
|
||
transition: all .3s;
|
||
}
|
||
|
||
.school-footer_friendChain a:hover {
|
||
color: var(--el-color-primary);
|
||
}
|
||
|
||
p {
|
||
font-size: 14px;
|
||
color: #000;
|
||
margin-bottom: 15px;
|
||
word-break: break-all;
|
||
|
||
a {
|
||
font-size: 14px;
|
||
color: #000;
|
||
}
|
||
}
|
||
|
||
p:last-child {
|
||
margin: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
//二维码 start
|
||
.qrcode {
|
||
margin: 50px 0;
|
||
}
|
||
|
||
.qrcode .qrcode-item {
|
||
width: 135px;
|
||
text-align: center;
|
||
}
|
||
|
||
.qrcode .qrcode-item .qrcode-text {
|
||
font-weight: bold;
|
||
color: #000000;
|
||
}
|
||
|
||
//二维码 end
|
||
</style>
|