1027 lines
26 KiB
Vue
1027 lines
26 KiB
Vue
<template>
|
|
<div class="container" style="background: #f6f6f6">
|
|
<div class="top-box">
|
|
<headers></headers>
|
|
|
|
<div class="ny-banner">
|
|
<img src="../../assets/gw/ny-banner.jpg" alt="">
|
|
</div>
|
|
</div>
|
|
<!-- new -->
|
|
<div class="navigation">
|
|
<div class="content">
|
|
<div class="left"> <img src="../../assets/gw/home.png" alt="">
|
|
<p><a href="/gw">首页</a><i class="el-icon-arrow-right"></i> <span href="">大赛风采</span></p>
|
|
</div>
|
|
<div class="right">
|
|
<div class="nav-item" v-for="(item, index) in nav" v-bind:class="[index === currentActive ? 'active' : '']"
|
|
@click="getCurrentActive(index)">
|
|
{{ item.categoryName }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="committee-cont">
|
|
<div class="tabber-box " v-if="currentActive == 6" >
|
|
<el-form ref="form" :model="ruleForm" label-width="120px" :rules="rules" class="demo-ruleForm">
|
|
<h1 class="tab_title">参赛报名表(本科组)</h1>
|
|
|
|
<!-- 基础信息-->
|
|
<div class="kuang">
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item label="所属赛区" prop="division">
|
|
<el-input v-model="ruleForm.division"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="学校及院系名称" prop="schoolName">
|
|
<el-input v-model="ruleForm.schoolName"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="参赛团队名称" prop="teamName">
|
|
<el-input v-model="ruleForm.teamName"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
<!-- 领队老师信息-->
|
|
<div class="kuang ">
|
|
<h2 class="tab_title tab_down_line">领队老师</h2>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item label="姓名" prop="teachers.0.teacherName">
|
|
<el-input v-model="ruleForm.teachers[0].teacherName"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="职务" prop="teachers.0.teacherJob">
|
|
<el-input v-model="ruleForm.teachers[0].teacherJob"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="手机号" prop="teachers.0.teacherNumber">
|
|
<el-input v-model="ruleForm.teachers[0].teacherNumber"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="E-mail" prop="teachers.0.teacherEmail">
|
|
<el-input v-model="ruleForm.teachers[0].teacherEmail"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="所在系及专业" prop="teachers.0.teacherSchool">
|
|
<el-input v-model="ruleForm.teachers[0].teacherSchool"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
|
|
<!-- 指导老师①信息-->
|
|
<div class="kuang ">
|
|
<h2 class="tab_title tab_down_line">指导老师①</h2>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item label="姓名" prop="teachers.1.teacherName">
|
|
<el-input v-model="ruleForm.teachers[1].teacherName"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="职务" prop="teachers.1.teacherJob">
|
|
<el-input v-model="ruleForm.teachers[1].teacherJob"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="手机号" prop="teachers.1.teacherNumber">
|
|
<el-input v-model="ruleForm.teachers[1].teacherNumber"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="E-mail" prop="teachers.1.teacherEmail">
|
|
<el-input v-model="ruleForm.teachers[1].teacherEmail"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="所在系及专业" prop="teachers.1.teacherSchool">
|
|
<el-input v-model="ruleForm.teachers[1].teacherSchool"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
|
|
<!-- 指导老师②信息-->
|
|
<div class="kuang ">
|
|
<h2 class="tab_title tab_down_line">指导老师②</h2>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item label="姓名" prop="teachers.2.teacherName">
|
|
<el-input v-model="ruleForm.teachers[2].teacherName"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="职务" prop="teachers.2.teacherJob">
|
|
<el-input v-model="ruleForm.teachers[2].teacherJob"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="手机号" prop="teachers.2.teacherNumber">
|
|
<el-input v-model="ruleForm.teachers[2].teacherNumber"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="E-mail" prop="teachers.2.teacherEmail">
|
|
<el-input v-model="ruleForm.teachers[2].teacherEmail"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="所在系及专业" prop="teachers.2.teacherSchool">
|
|
<el-input v-model="ruleForm.teachers[2].teacherSchool"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
|
|
<!-- 参赛人信息-->
|
|
<div class="kuang ">
|
|
<h2 class="tab_title tab_down_line">参赛人信息</h2>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item label="姓名" prop="stuName">
|
|
<el-input v-model="ruleForm.stuName"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="性别" prop="stuGender">
|
|
<el-select
|
|
v-model="ruleForm.stuGender"
|
|
placeholder="学生性别"
|
|
clearable
|
|
style="width: 125px">
|
|
<el-option
|
|
v-for="dict in dict.type.sys_user_sex"
|
|
:key="dict.value"
|
|
:label="dict.label"
|
|
:value="dict.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="专业" prop="stuMajor">
|
|
<el-input v-model="ruleForm.stuMajor"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="手机号" prop="stuNumber">
|
|
<el-input v-model="ruleForm.stuNumber"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
|
|
<!-- 盲样邮寄地址 -->
|
|
<div class="kuang">
|
|
<h2 class="tab_title tab_down_line">盲样邮寄地址</h2>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item label="收件人" prop="sampleConcat">
|
|
<el-input v-model="ruleForm.sampleConcat"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="联系电话" prop="sampleNumber">
|
|
<el-input v-model="ruleForm.sampleNumber"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="邮寄地址" prop="sampleAddress">
|
|
<el-input v-model="ruleForm.sampleAddress"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
|
|
<!-- 提交按钮 -->
|
|
<div style="text-align: center">
|
|
<el-form-item>
|
|
<el-button style="margin-left: -120px" type="primary" @click="submitForm">提交</el-button>
|
|
</el-form-item>
|
|
</div>
|
|
</el-form>
|
|
</div>
|
|
<!-- main -->
|
|
<div v-show="currentActive == 3" v-html="pageContext"></div>
|
|
<div v-for="(item, index) in nav " :key=index>
|
|
<div class="about-conts-item1" v-show="currentActive == index">
|
|
<div v-show="currentActive == 0 || currentActive == 1 " class="neirong" v-html="pageContext"></div>
|
|
</div>
|
|
</div>
|
|
<div v-show="currentActive == 2 " class="wrapbox">
|
|
<div class="rsr" v-for="(item,index) in otherList" @click="goDeatail(item)" >
|
|
<img :src=" imgurl + item.contentImg" style="width: 255px;height: 220px">
|
|
<div class="size-t">{{item.contentTitle}}</div>
|
|
</div>
|
|
</div>
|
|
<div v-show="currentActive == 4 " class="wrapbox">
|
|
<div class="newRsr" v-for="(item,index) in otherList" @click="goDeatail(item)" >
|
|
<img :src=" imgurl + item.contentImg" style="width: 255px;height: 220px">
|
|
<div class="size-t">{{item.contentTitle}}</div>
|
|
</div>
|
|
</div>
|
|
<div v-show="currentActive == 5 " class="wrapbox">
|
|
<div class="noticeRsr" v-for="(item,index) in noticeList" @click="goDeatail(item)" >
|
|
<div >{{item.contentTitle}}</div>
|
|
<div >{{item.publishDate}}</div>
|
|
</div>
|
|
</div>
|
|
<div v-show="currentActive == 2 || currentActive == 4 || currentActive === 5" >
|
|
<page-util :category-id="categoryId" @event-message="handleDataFromPage" />
|
|
</div>
|
|
<div class="anniu" v-show="registerStatus == 1 && currentActive == 0" @click="toRegister" >去报名</div>
|
|
</div>
|
|
|
|
<footers></footers>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { Swiper, SwiperSlide } from "vue-awesome-swiper";
|
|
import "swiper/css/swiper.min.css";
|
|
import { getPageData, getCategoryByParentId,getbaseInfo } from "@/api/officialWebsite/getPageData";
|
|
import footers from '@/views/officialWebsite/Components/footer.vue'
|
|
import headers from '@/views/officialWebsite/Components/header.vue'
|
|
import PageUtil from '@/views/officialWebsite/Components/page'
|
|
import {addTeacher, register} from '@/api/officialWebsite/registerStudent'
|
|
import {getTab, getbanner} from '@/api/gw/home'
|
|
export default {
|
|
components: {
|
|
headers,
|
|
footers,
|
|
Swiper,
|
|
SwiperSlide,
|
|
"page-util": PageUtil
|
|
},
|
|
dicts: ["sys_user_sex"],
|
|
name: 'HelloWorld',
|
|
props: {
|
|
msg: String
|
|
},
|
|
data() {
|
|
return {
|
|
registerStatus:0,
|
|
imgurl:process.env.VUE_APP_BASE_API,
|
|
ruleForm: {
|
|
division: null,
|
|
schoolName: null,
|
|
teamName: null,
|
|
teachers: [
|
|
{
|
|
teacherName: null,
|
|
teacherJob: null,
|
|
teacherNumber: null,
|
|
teacherEmail: null,
|
|
teacherSchool: null
|
|
},
|
|
{
|
|
teacherName: null,
|
|
teacherJob: null,
|
|
teacherNumber: null,
|
|
teacherEmail: null,
|
|
teacherSchool: null
|
|
},
|
|
{
|
|
teacherName: null,
|
|
teacherJob: null,
|
|
teacherNumber: null,
|
|
teacherEmail: null,
|
|
teacherSchool: null
|
|
}
|
|
],
|
|
stuName: null,
|
|
stuGender: null,
|
|
stuMajor: null,
|
|
stuNumber: null,
|
|
leaderIds: [],
|
|
guideIds: [],
|
|
sampleConcat: null,
|
|
sampleNumber: null,
|
|
sampleAddress: null
|
|
},
|
|
rules: {
|
|
stuName: [
|
|
{ required: true, message: "姓名不能为空", trigger: "blur" }
|
|
],
|
|
stuGender: [
|
|
{ required: true, message: "性别不能为空", trigger: "blur" }
|
|
],
|
|
stuMajor: [
|
|
{ required: true, message: "专业不能为空", trigger: "blur" }
|
|
],
|
|
stuNumber: [
|
|
{ required: true, message: "手机号不能为空", trigger: "blur" }
|
|
],
|
|
schoolName: [
|
|
{ required: true, message: "学校及院系名称不能为空", trigger: "blur" }
|
|
],
|
|
division: [
|
|
{ required: true, message: "所属赛区不能为空", trigger: "blur" }
|
|
],
|
|
teamName: [
|
|
{ required: true, message: "参赛团队名称不能为空", trigger: "blur" }
|
|
],
|
|
sampleConcat: [
|
|
{ required: true, message: "收件人不能为空", trigger: "blur" }
|
|
],
|
|
sampleNumber: [
|
|
{ required: true, message: "联系电话不能为空", trigger: "blur" }
|
|
],
|
|
sampleAddress: [
|
|
{ required: true, message: "邮寄地址不能为空", trigger: "blur" }
|
|
],
|
|
},
|
|
pageContext: '',
|
|
nav: [
|
|
],
|
|
currentActive: 0,
|
|
isMounted: false,
|
|
input4: "",
|
|
categoryId: "",
|
|
noticeList:[],
|
|
routeParam : {
|
|
"categoryId": this.$route.query.id,
|
|
"pageNum": 1,
|
|
"pageSize": 10
|
|
},
|
|
otherList:[],
|
|
}
|
|
},
|
|
mounted() {
|
|
// 页面加载完毕调用
|
|
this.initPageData();
|
|
},
|
|
computed: {
|
|
|
|
},
|
|
created() {
|
|
this.createRules()
|
|
},
|
|
methods: {
|
|
goDeatail(data){
|
|
// console.log(data)
|
|
if(data.linkType == 0){
|
|
this.$router.push({
|
|
name: 'details',
|
|
query:{ id: data.id }
|
|
});
|
|
}
|
|
if(data.linkType == 1){
|
|
window.open(data.link, '_blank');
|
|
}
|
|
},
|
|
createRules(){
|
|
for (let i = 0; i < 3; i++){
|
|
this.rules[`teachers.${i}.teacherName`] = [
|
|
{required: true, message: '姓名不能为空', trigger: "blur"}
|
|
]
|
|
this.rules[`teachers.${i}.teacherJob`] = [
|
|
{required: true, message: '职务不能为空', trigger: "blur"}
|
|
]
|
|
this.rules[`teachers.${i}.teacherNumber`] = [
|
|
{required: true, message: '电话不能为空', trigger: "blur"}
|
|
]
|
|
this.rules[`teachers.${i}.teacherEmail`] = [
|
|
{required: true, message: 'mail不能为空', trigger: "blur"}
|
|
]
|
|
this.rules[`teachers.${i}.teacherSchool`] = [
|
|
{required: true, message: '所在系及专业不能为空', trigger: "blur"}
|
|
]
|
|
}
|
|
},
|
|
// 触发导航
|
|
getCurrentActive(value) {
|
|
if (this.currentActive == value) {
|
|
return
|
|
}
|
|
|
|
this.currentActive = value
|
|
this.categoryId = ""
|
|
|
|
if (value === 5){
|
|
this.categoryId = this.getNoticeId()
|
|
}else if (value === 0 || value === 1 || value === 3) {
|
|
this.pageContext = ""
|
|
this.getContentDetail()
|
|
}else{
|
|
this.otherList = []
|
|
this.categoryId = this.nav[value].id;
|
|
}
|
|
},
|
|
initPageData() {
|
|
getbaseInfo().then(res=>{
|
|
this.registerStatus = res.data.registerStatus
|
|
})
|
|
this.categoryId = this.$route.query.id
|
|
getCategoryByParentId(this.routeParam.categoryId).then(res => {
|
|
this.nav = res.data
|
|
this.getContentDetail()
|
|
})
|
|
},
|
|
getContentDetail(){
|
|
this.routeParam.categoryId = this.nav[this.currentActive].id
|
|
getPageData(this.routeParam).then(response => {
|
|
this.pageContext = response.data.list[0].contentDetail
|
|
})
|
|
},
|
|
getNoticeId(){
|
|
getTab().then(res => {
|
|
const query = {
|
|
"categoryId": res.data[0].id,
|
|
"pageNum": 1,
|
|
"pageSize": 10
|
|
}
|
|
getCategoryByParentId(query.categoryId).then(res => {
|
|
this.categoryId = res.data[1].id
|
|
})
|
|
})
|
|
},
|
|
handleDataFromPage(data){
|
|
if (this.currentActive === 2 || this.currentActive == 4){
|
|
this.otherList = data
|
|
}
|
|
if (this.currentActive === 5){
|
|
this.noticeList = data
|
|
}
|
|
},
|
|
toRegister(){
|
|
if (this.registerStatus === '1') this.currentActive = 6;
|
|
},
|
|
submitForm(){
|
|
this.$refs["form"].validate(valid => {
|
|
if (valid){
|
|
const leader = this.ruleForm.teachers[0]
|
|
const guides = this.ruleForm.teachers.slice(1)
|
|
addTeacher(leader).then(res => {
|
|
this.ruleForm.leaderIds.push(res.data)
|
|
})
|
|
guides.forEach(item => {
|
|
addTeacher(item).then(res => {
|
|
this.ruleForm.guideIds.push(res.data)
|
|
})
|
|
})
|
|
register(this.ruleForm).then(res => {
|
|
if (res.code === 200){
|
|
this.reset();
|
|
this.$modal.msgSuccess("报名成功")
|
|
}else (
|
|
this.$modal.msgError("报名失败")
|
|
)
|
|
})
|
|
}else {
|
|
this.$modal.msgError("信息未填完整")
|
|
}
|
|
})
|
|
},
|
|
reset(){
|
|
this.ruleForm = {
|
|
division: null,
|
|
schoolName: null,
|
|
teamName: null,
|
|
teachers: [
|
|
{
|
|
teacherName: null,
|
|
teacherJob: null,
|
|
teacherNumber: null,
|
|
teacherEmail: null,
|
|
teacherSchool: null
|
|
},
|
|
{
|
|
teacherName: null,
|
|
teacherJob: null,
|
|
teacherNumber: null,
|
|
teacherEmail: null,
|
|
teacherSchool: null
|
|
},
|
|
{
|
|
teacherName: null,
|
|
teacherJob: null,
|
|
teacherNumber: null,
|
|
teacherEmail: null,
|
|
teacherSchool: null
|
|
}
|
|
],
|
|
stuName: null,
|
|
stuGender: null,
|
|
stuMajor: null,
|
|
stuNumber: null,
|
|
leaderIds: [],
|
|
guideIds: [],
|
|
sampleConcat: null,
|
|
sampleNumber: null,
|
|
sampleAddress: null
|
|
}
|
|
this.resetForm("form");
|
|
},
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.anniu{
|
|
width: 150px;
|
|
height: 50px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: #00A0E8;
|
|
color: #fff;
|
|
margin: 15px auto;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
}
|
|
/* .container {
|
|
background: #F5F5F5;
|
|
} */
|
|
.bj {
|
|
background: #F5F5F5;
|
|
}
|
|
|
|
::v-deep .team .el-input__inner {
|
|
width: 240px;
|
|
border-radius: 50px;
|
|
}
|
|
|
|
/* 圆形分页按钮样式 */
|
|
::v-deep .el-pagination .el-pager li:not(.disabled) {
|
|
border-radius: 100%;
|
|
/* 圆形 */
|
|
width: 50px;
|
|
height: 50px;
|
|
/* 按钮高度 */
|
|
line-height: 50px;
|
|
/* 文字垂直居中 */
|
|
text-align: center;
|
|
/* 文字水平居中 */
|
|
margin: 0 15px;
|
|
/* 按钮间距 */
|
|
border-radius: 50%;
|
|
width: 50px;
|
|
height: 50px;
|
|
background: #FFFFFF;
|
|
|
|
border: 1px solid #DDDDDD;
|
|
}
|
|
|
|
/* 选中的页码按钮样式 */
|
|
::v-deep .el-pagination .el-pager .active {
|
|
background-color: #005375;
|
|
;
|
|
/* 背景颜色 */
|
|
color: #fff;
|
|
/* 文字颜色 */
|
|
}
|
|
|
|
::v-deep .el-pagination.is-background .btn-next,
|
|
::v-deep .el-pagination.is-background .btn-prev {
|
|
|
|
background-color: #f4f4f5;
|
|
color: #333;
|
|
margin: 0 15px;
|
|
border-radius: 50%;
|
|
width: 50px;
|
|
height: 50px;
|
|
background: #FFFFFF;
|
|
|
|
border: 1px solid #DDDDDD;
|
|
}
|
|
|
|
::v-deep .el-pagination .btn-next .el-icon,
|
|
::v-deep .el-pagination .btn-prev .el-icon {
|
|
font-size: 18px;
|
|
}
|
|
|
|
.top-box {
|
|
width: 100%;
|
|
/* height: 1000px; */
|
|
/* background: url(''); */
|
|
/* background-size: cover; */
|
|
/* 背景图片铺满盒子 */
|
|
/* background-repeat: no-repeat; */
|
|
/* 禁止背景图片重复 */
|
|
position: relative;
|
|
}
|
|
|
|
.tab-box {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 20px 2%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
|
background-color: #005375;
|
|
font-weight: bold;
|
|
font-size: 18px;
|
|
color: #FFFFFF;
|
|
/* position: absolute; */
|
|
z-index: 3;
|
|
|
|
}
|
|
|
|
.d-s {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.logo-box {
|
|
width: 50px;
|
|
height: 50px;
|
|
background: #fff;
|
|
}
|
|
|
|
.logo-size {
|
|
font-weight: 800;
|
|
font-size: 24px;
|
|
color: #FFFFFF;
|
|
margin-left: 20px;
|
|
|
|
}
|
|
|
|
.x-x {
|
|
margin-right: 20px;
|
|
cursor: pointer;
|
|
}
|
|
.wrapbox{
|
|
width: 100%;
|
|
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
}
|
|
.rsr{
|
|
width: 20%;
|
|
}
|
|
.newRsr{
|
|
width: 25%;
|
|
text-align: center;
|
|
}
|
|
.ny-banner {
|
|
width: 100%;
|
|
}
|
|
|
|
.ny-banner img {
|
|
width: 100%;
|
|
}
|
|
|
|
.navigation {
|
|
width: 100%;
|
|
height: 60px;
|
|
background: #FFFFFF;
|
|
border-radius: 0px 0px 0px 0px;
|
|
border-bottom: 1px solid #EEEEEE;
|
|
}
|
|
|
|
.navigation .content {
|
|
width: 80%;
|
|
margin: 0 auto;
|
|
height: 60px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center
|
|
}
|
|
|
|
.navigation .content .left {
|
|
width: 30%;
|
|
display: flex;
|
|
|
|
align-items: center
|
|
}
|
|
|
|
.navigation img {
|
|
|
|
width: 15px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.navigation p {
|
|
|
|
/* margin-top: 5px; */
|
|
color: #999;
|
|
}
|
|
|
|
.navigation span {
|
|
|
|
color: #999;
|
|
}
|
|
|
|
.navigation span:last-child {
|
|
font-weight: 700;
|
|
color: #005375;
|
|
}
|
|
|
|
.navigation .content .right {
|
|
width: 70%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center
|
|
}
|
|
|
|
.navigation .content .right .nav-item {
|
|
width: 200px;
|
|
display: flex;
|
|
height: 60px;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-size: 20px;
|
|
cursor: pointer;
|
|
font-weight: 500;
|
|
border-bottom: 3px solid transparent;
|
|
}
|
|
|
|
.navigation .content .right .active {
|
|
border-bottom: 3px solid #005375;
|
|
color: #005375;
|
|
font-weight: bold;
|
|
}
|
|
.page-box{
|
|
width: 82%;
|
|
margin: 10px auto;
|
|
}
|
|
.committee-cont {
|
|
width: 80%;
|
|
margin: 40px auto;
|
|
background: #fff;
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
img{
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.committee-cont .news {
|
|
width: 80%;
|
|
margin: 0 auto;
|
|
margin-top: 30px;
|
|
}
|
|
|
|
.committee-cont .news .news-list .item {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding-bottom: 30px;
|
|
margin-bottom: 30px;
|
|
cursor: pointer;
|
|
border-bottom: 1px solid #EEEEEE;
|
|
}
|
|
|
|
.committee-cont .news .news-list .item .tts {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
width: 80%;
|
|
font-size: 20px;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.committee-cont .news .news-list .item .time {
|
|
color: #999999;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.committee-cont .team {
|
|
width: 80%;
|
|
margin: 0 auto;
|
|
margin-top: 30px;
|
|
}
|
|
|
|
.committee-cont .team .team-list {
|
|
border: 1px solid #EEEEEE;
|
|
margin-top: 30px;
|
|
}
|
|
|
|
.committee-cont .team .team-list .team-list-header {
|
|
display: flex;
|
|
height: 50px;
|
|
align-items: center;
|
|
background: #F2F3F5;
|
|
}
|
|
|
|
.committee-cont .team .team-list .team-list-header .div {
|
|
width: 20%;
|
|
height: 50px;
|
|
display: flex;
|
|
align-items: center;
|
|
padding-left: 2%;
|
|
border-right: 1px solid #EEEEEE;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.committee-cont .team .team-list .team-list-header .div:last-child {
|
|
width: 8%;
|
|
}
|
|
|
|
.committee-cont .team .team-list .item {
|
|
display: flex;
|
|
height: 50px;
|
|
align-items: center;
|
|
}
|
|
|
|
.committee-cont .team .team-list .item .div {
|
|
width: 20%;
|
|
height: 50px;
|
|
display: flex;
|
|
align-items: center;
|
|
padding-left: 2%;
|
|
border-right: 1px solid #EEEEEE;
|
|
font-size: 16px;
|
|
}
|
|
|
|
.committee-cont .team .team-list .item .div:last-child {
|
|
width: 8%;
|
|
color: #005375;
|
|
}
|
|
|
|
.index-footer {
|
|
background: #383838;
|
|
padding-top: 30px;
|
|
}
|
|
|
|
.index-footer .footer {
|
|
width: 80%;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.index-footer .footer .logo {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
/* align-items: center; */
|
|
}
|
|
|
|
.index-footer .footer .logo .footer-contact {}
|
|
|
|
.index-footer .footer .logo .footer-contact .p {
|
|
display: inline-block;
|
|
display: flex;
|
|
float: left;
|
|
margin-left: 50px;
|
|
align-items: center;
|
|
color: rgba(255, 255, 255, 0.7);
|
|
font-size: 16px;
|
|
/* justify-content: flex-end; */
|
|
}
|
|
|
|
.index-footer .footer .logo .footer-contact .p img {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.index-footer .footer .logo .footer-contact .p:nth-child(3) {
|
|
width: 100%;
|
|
clear: both;
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.index-footer .footer .footer-nav {
|
|
display: flex;
|
|
margin-top: 20px;
|
|
padding-top: 30px;
|
|
border-top: 1px solid rgba(255, 255, 255, 0.2);
|
|
}
|
|
|
|
.index-footer .footer .footer-nav .footer-nav-item {
|
|
width: 9%;
|
|
margin-right: 1%;
|
|
}
|
|
|
|
.index-footer .footer .footer-nav .footer-nav-item:last-child {
|
|
margin-right: 0;
|
|
}
|
|
|
|
.index-footer .footer .footer-nav .footer-nav-item .tt {
|
|
|
|
font-weight: 500;
|
|
font-size: 18px;
|
|
color: rgba(255, 255, 255, 0.7);
|
|
line-height: 18px;
|
|
position: relative;
|
|
padding-bottom: 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.index-footer .footer .footer-nav .footer-nav-item .tt::after {
|
|
content: "";
|
|
width: 20px;
|
|
height: 2px;
|
|
background: #005375;
|
|
border-radius: 0px 0px 0px 0px;
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.index-footer .footer .footer-nav .footer-nav-item a {
|
|
text-decoration: none;
|
|
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
color: rgba(255, 255, 255, 0.4);
|
|
line-height: 16px;
|
|
display: block;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.index-footer .footer .footer-nav .footer-nav-item a:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.index-footer .footer .web_icp {
|
|
display: flex;
|
|
margin-top: 50px;
|
|
height: 80px;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-top: 1px solid rgba(255, 255, 255, 0.2);
|
|
}
|
|
|
|
.index-footer .footer .web_icp a {
|
|
text-decoration: none;
|
|
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
color: rgba(255, 255, 255, 0.4);
|
|
line-height: 16px;
|
|
margin-right: 30px;
|
|
}
|
|
|
|
.index-footer .footer .web_icp .right {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end
|
|
}
|
|
|
|
.index-footer .footer .web_icp .right div {
|
|
margin-right: 25px;
|
|
|
|
font-weight: 500;
|
|
font-size: 18px;
|
|
color: rgba(255, 255, 255, 0.7);
|
|
line-height: 18px;
|
|
|
|
}
|
|
.tabber-box{
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
|
|
}
|
|
.titel_{
|
|
font-weight: bold;
|
|
font-size: 28px;
|
|
color: #333333;
|
|
text-align: center;
|
|
margin-bottom: 25px;
|
|
}
|
|
.kuang{
|
|
border: 1px solid #ccc;
|
|
border-radius: 8px;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
margin: 15px auto;
|
|
}
|
|
.size-t{
|
|
width: 100%;
|
|
height: 50px;
|
|
text-align: center;
|
|
}
|
|
.tab_title{
|
|
display: inline-block;
|
|
width: 100%;
|
|
text-align: center;
|
|
margin: 0 0 1rem 0;
|
|
padding: 0.5rem;
|
|
}
|
|
.tab_down_line{
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
.neirong{
|
|
width: 100%; /* 或者使用具体的像素值 */
|
|
height: 100%; /* 或者使用具体的像素值 */
|
|
}
|
|
.noticeRsr{
|
|
width: 100%;
|
|
padding: 1rem;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 20px;
|
|
}
|
|
.noticeRsr:hover{
|
|
color: #00A0E8;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|