|
|
@@ -43,7 +43,7 @@
|
|
|
<el-col :span="10" class="center animate__animated animate__fadeInUp">
|
|
|
<el-col :span="24" class="top">
|
|
|
<el-col :span="20" class="topTitle">
|
|
|
- <span>测试标题</span>
|
|
|
+ <span>通知公告</span>
|
|
|
</el-col>
|
|
|
<el-col :span="4" class="topLink">
|
|
|
<el-link :underline="false">MORE</el-link>
|
|
|
@@ -63,7 +63,7 @@
|
|
|
<el-col :span="6" class="right animate__animated animate__fadeInUp">
|
|
|
<el-col :span="24" class="top">
|
|
|
<el-col :span="20" class="topTitle">
|
|
|
- <span>测试标题</span>
|
|
|
+ <span>通知公告</span>
|
|
|
</el-col>
|
|
|
<el-col :span="4" class="topLink">
|
|
|
<el-link :underline="false">MORE</el-link>
|
|
|
@@ -78,10 +78,80 @@
|
|
|
</el-col>
|
|
|
</el-col>
|
|
|
</el-col>
|
|
|
+ <el-col :span="24" class="mainTwo">
|
|
|
+ <el-col :span="8" class="left animate__animated animate__fadeInDown">
|
|
|
+ <el-col :span="24" class="top">
|
|
|
+ <el-col :span="20" class="topTitle">
|
|
|
+ <span>就业动态</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" class="topLink">
|
|
|
+ <el-link :underline="false">MORE</el-link>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="info">
|
|
|
+ <el-col :span="24" class="infoList" v-for="(item, index) in jobsList" :key="index">
|
|
|
+ <el-col :span="19" class="title textOver">
|
|
|
+ {{ item.title }}
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" class="date">
|
|
|
+ {{ item.date }}
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="10" class="center animate__animated animate__fadeInDown">
|
|
|
+ <el-col :span="24" class="top">
|
|
|
+ <el-col :span="20" class="topTitle">
|
|
|
+ <span>高校动态</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" class="topLink">
|
|
|
+ <el-link :underline="false">MORE</el-link>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="info">
|
|
|
+ <el-col :span="24" class="infoList" v-for="(item, index) in schoolList" :key="index">
|
|
|
+ <el-col :span="19" class="title textOver">
|
|
|
+ {{ item.title }}
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" class="date">
|
|
|
+ {{ item.date }}
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6" class="right animate__animated animate__fadeInDown">
|
|
|
+ <el-col :span="24" class="top">
|
|
|
+ <el-col :span="20" class="topTitle">
|
|
|
+ <span>快速导航</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" class="topLink">
|
|
|
+ <el-link :underline="false">MORE</el-link>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="info">快速导航</el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="mainThree">
|
|
|
+ 1
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="mainThree">
|
|
|
+ 1
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="mainThree">
|
|
|
+ 1
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="mainThree">
|
|
|
+ 1
|
|
|
+ </el-col>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :span="24" class="foot">
|
|
|
- 底部
|
|
|
+ <div class="w_1200">
|
|
|
+ <el-col :span="24" class="content">
|
|
|
+ {{ footInfo.content }}
|
|
|
+ </el-col>
|
|
|
+ <el-image :src="footInfo.sydw"></el-image>
|
|
|
+ </div>
|
|
|
</el-col>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
@@ -145,54 +215,63 @@ export default {
|
|
|
},
|
|
|
],
|
|
|
// eslint-disable-next-line vue/no-dupe-keys
|
|
|
- noticeList1: [
|
|
|
+ newsList: [
|
|
|
{
|
|
|
- title: '55555555测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
- date: '2020-10-10',
|
|
|
+ title: '哈哈测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
},
|
|
|
{
|
|
|
- title: '55555555测试标题',
|
|
|
- date: '2020-10-10',
|
|
|
+ title: '哈哈测试标题',
|
|
|
},
|
|
|
{
|
|
|
- title: '55555555测试标题',
|
|
|
- date: '2020-10-10',
|
|
|
+ title: '哈哈测试标题',
|
|
|
},
|
|
|
{
|
|
|
- title: '55555555测试标题',
|
|
|
- date: '2020-10-10',
|
|
|
+ title: '测试标题',
|
|
|
},
|
|
|
],
|
|
|
- // eslint-disable-next-line vue/no-dupe-keys
|
|
|
- newsList: [
|
|
|
+ // 就业动态
|
|
|
+ jobsList: [
|
|
|
{
|
|
|
- title: '哈哈测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
+ title: '8888888测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
},
|
|
|
{
|
|
|
- title: '哈哈测试标题',
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
},
|
|
|
{
|
|
|
- title: '哈哈测试标题',
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
},
|
|
|
{
|
|
|
- title: '测试标题',
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
},
|
|
|
],
|
|
|
- // eslint-disable-next-line vue/no-dupe-keys
|
|
|
- newsList1: [
|
|
|
+ // 高校动态
|
|
|
+ schoolList: [
|
|
|
{
|
|
|
- title: '添加标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
+ title: '8888888测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
},
|
|
|
{
|
|
|
- title: '添加测试标题',
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
},
|
|
|
{
|
|
|
- title: '添加测试标题',
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
},
|
|
|
{
|
|
|
- title: '添加测试标题',
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
},
|
|
|
],
|
|
|
+ // 底部信息
|
|
|
+ footInfo: {
|
|
|
+ content: '办公地址：长春市经济技术开发区金川街151号，吉林省高等学校毕业生就业指导中心2楼一站式办公大厅，邮编：130033。',
|
|
|
+ sydw: require('@a/sydw.png'),
|
|
|
+ },
|
|
|
};
|
|
|
},
|
|
|
created() {},
|
|
|
@@ -226,7 +305,6 @@ export default {
|
|
|
}
|
|
|
.main {
|
|
|
margin: 10px 0 0 0;
|
|
|
- border-bottom: 1px solid red;
|
|
|
.mainOne {
|
|
|
margin: 0 0 10px 0;
|
|
|
height: 300px;
|
|
|
@@ -339,9 +417,152 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .mainTwo {
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ height: 400px;
|
|
|
+ border-bottom: 1px solid red;
|
|
|
+ .left {
|
|
|
+ height: 400px;
|
|
|
+ background-color: #fff;
|
|
|
+ .top {
|
|
|
+ height: 39px;
|
|
|
+ line-height: 39px;
|
|
|
+ border-bottom: 1px solid #176ebb;
|
|
|
+ .topTitle {
|
|
|
+ span {
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ width: 110px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+ background-color: #176ebb;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .topLink {
|
|
|
+ .el-link {
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .info {
|
|
|
+ padding: 0 10px;
|
|
|
+ .infoList {
|
|
|
+ height: 43px;
|
|
|
+ line-height: 43px;
|
|
|
+ .title {
|
|
|
+ font-size: 16px;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+ .date {
|
|
|
+ font-size: 16px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .infoList:hover {
|
|
|
+ cursor: pointer;
|
|
|
+ .title {
|
|
|
+ color: #176ebb;
|
|
|
+ }
|
|
|
+ .date {
|
|
|
+ color: #176ebb;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .center {
|
|
|
+ height: 400px;
|
|
|
+ background-color: #fff;
|
|
|
+ .top {
|
|
|
+ height: 39px;
|
|
|
+ line-height: 39px;
|
|
|
+ border-bottom: 1px solid #176ebb;
|
|
|
+ .topTitle {
|
|
|
+ span {
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ width: 110px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+ background-color: #176ebb;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .topLink {
|
|
|
+ .el-link {
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .info {
|
|
|
+ padding: 0 10px;
|
|
|
+ .infoList {
|
|
|
+ height: 43px;
|
|
|
+ line-height: 43px;
|
|
|
+ .title {
|
|
|
+ font-size: 16px;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+ .date {
|
|
|
+ font-size: 16px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .infoList:hover {
|
|
|
+ cursor: pointer;
|
|
|
+ .title {
|
|
|
+ color: #176ebb;
|
|
|
+ }
|
|
|
+ .date {
|
|
|
+ color: #176ebb;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .right {
|
|
|
+ height: 400px;
|
|
|
+ background-color: #fff;
|
|
|
+ .top {
|
|
|
+ height: 39px;
|
|
|
+ line-height: 39px;
|
|
|
+ border-bottom: 1px solid #176ebb;
|
|
|
+ .topTitle {
|
|
|
+ span {
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ width: 110px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+ background-color: #176ebb;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .topLink {
|
|
|
+ .el-link {
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .info {
|
|
|
+ padding: 0 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .mainThree {
|
|
|
+ height: 300px;
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
}
|
|
|
.foot {
|
|
|
- border-bottom: 1px solid red;
|
|
|
+ min-height: 120px;
|
|
|
+ background: rgb(4, 87, 199);
|
|
|
+ text-align: center;
|
|
|
+ .content {
|
|
|
+ color: #fff;
|
|
|
+ font-size: 14px;
|
|
|
+ padding: 15px 0;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
/deep/.el-menu--horizontal > .el-menu-item.is-active {
|
