<template>
|
<div class="jiuyeQingkuang-wrap">
|
<h1>各县（市、区）2021年就业情况统计表</h1>
|
<el-tabs v-model="activeName">
|
<el-tab-pane label="城镇新增就业" name="first">
|
<chengzhenXinzengJiuye></chengzhenXinzengJiuye>
|
</el-tab-pane>
|
<el-tab-pane label="失业再就业" name="second">
|
<chengzhenXinzengJiuye></chengzhenXinzengJiuye>
|
</el-tab-pane>
|
<el-tab-pane label="就业困难人员再就业" name="third">
|
<chengzhenXinzengJiuye></chengzhenXinzengJiuye>
|
</el-tab-pane>
|
<el-tab-pane label="登记失业率" name="fourth">
|
<chengzhenXinzengJiuye></chengzhenXinzengJiuye>
|
</el-tab-pane>
|
</el-tabs>
|
</div>
|
</template>
|
|
<script>
|
import chengzhenXinzengJiuye from "../../../components/jiuyeQingkuang/chengzhenXinzengJiuye";
|
export default {
|
name: "jiuyeQingkuang",
|
components: {
|
chengzhenXinzengJiuye, //城镇新增就业
|
},
|
data() {
|
return {
|
activeName: 'first'
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
@import "../../../../assets/css/base";
|
.jiuyeQingkuang-wrap{
|
.el-tabs__nav-wrap::after{
|
background-color: transparent;
|
height: 0;
|
}
|
.el-tabs__nav-scroll{
|
display: flex;
|
justify-content: center;
|
}
|
.el-tabs__item{
|
width: 24rem;
|
height: 6.4rem;
|
background: rgba(81,210,255,0.08);
|
border: 1px solid #0097cc; /*no*/
|
color: #9CE6FF;
|
font-size: $fontSize-24;
|
margin: 0 2rem /* 10/10 */;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
.el-tabs__item.is-active{
|
width: 24rem;
|
height: 6.4rem;
|
background: #00a6e1;
|
border: 1px solid #51d2ff;
|
box-shadow: 0px 3px 10px 0px rgba(255,255,255,0.80) inset;
|
color: $color-white;
|
font-size: $fontSize-24;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
.el-tabs__nav{
|
width: 100%;
|
display: flex;
|
justify-content: center;
|
}
|
.el-tabs__active-bar{
|
height: 0;
|
}
|
}
|
</style>
|
<style lang="scss" scoped>
|
@import "../../../../assets/css/base";
|
.jiuyeQingkuang-wrap{
|
width: 100%;
|
height: 100%;
|
h1{
|
font-size: $fontSize-30;
|
color: $color-white;
|
text-align: center;
|
line-height: 2;
|
margin-bottom: 2rem;
|
}
|
}
|
</style>
|
