<template>
|
<div id="businessPolicy">
|
<div class="upCentent">
|
<!-- 主信息区 -->
|
<div class="upCentent_item">
|
<div class="icon">
|
<img
|
src="../../../assets/images/businessPolicy/icon1@2x.png"
|
alt=""
|
/>
|
</div>
|
<div class="text">累计出台政策数量</div>
|
<div class="numText"><span>280</span>条</div>
|
</div>
|
<div class="upCentent_item"></div>
|
<div class="upCentent_item"></div>
|
<div class="upCentent_item"></div>
|
<div class="upCentent_item"></div>
|
</div>
|
<!-- 主表格区 -->
|
<div class="downCentent">
|
<div class="downCentent_item">
|
<div class="downCentent_title">
|
<span>政策内容</span
|
><img
|
src="../../../assets/images/businessPolicy/title_end@2x.png"
|
alt=""
|
/>
|
</div>
|
<div class="tableLeft">
|
<el-table
|
stripe
|
:data="tableData"
|
style="width: 100%"
|
max-height="100.6rem"
|
:header-row-style="tableHeaderRow"
|
:row-class-name="tableRowClassName"
|
>
|
<el-table-column prop="keshi" label="科室" width="140">
|
</el-table-column>
|
<el-table-column
|
prop="zhengchemingcheng"
|
label="政策名称"
|
width="355"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="shengxiaoDate"
|
label="生效日期范围"
|
width="355"
|
>
|
</el-table-column>
|
<el-table-column prop="huijiqiyeNum" label="惠及企业数">
|
</el-table-column>
|
<el-table-column prop="money" label="减免金额"> </el-table-column>
|
</el-table>
|
</div>
|
</div>
|
<div class="downCentent_item"></div>
|
</div>
|
</div>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
tableData: [
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
},
|
{
|
keshi: "失业处",
|
zhengchemingcheng: "失业保险稳岗返还政策",
|
shengxiaoDate: "2021/3—2022/12",
|
huijiqiyeNum: "100家",
|
money: "277万元"
|
}
|
]
|
};
|
},
|
methods: {
|
tableHeaderRow({ rowIndex }) {
|
if (rowIndex === 0) return { height: "8rem" };
|
},
|
tableRowClassName({ rowIndex }) {
|
if (rowIndex % 2 === 0) {
|
return "warning-row";
|
}
|
return "";
|
}
|
}
|
};
|
</script>
|
<style lang="scss">
|
@import "../../../assets/css/base";
|
.tableLeft {
|
width: 115.4rem;
|
position: absolute;
|
top: 7.2rem;
|
left: 3.3rem;
|
|
// 状态颜色
|
.el-table .warning-row {
|
background-color: rgba(81, 210, 255, 0.1);
|
}
|
.el-table td.el-table__cell,
|
.el-table th.el-table__cell.is-leaf {
|
border: none;
|
}
|
// .el-table .success-row {
|
// background-color: rgba(81, 210, 255, 0.1);
|
// }
|
// .workStatistics-table {
|
.el-table tr {
|
background: transparent;
|
}
|
// 头部
|
.el-table th.el-table__cell {
|
background: transparent;
|
}
|
// .el-table__fixed,
|
// .el-table__fixed-right,
|
// .el-table__fixed-right::before,
|
// .el-table__fixed::before {
|
// background-color: #51d2ff;
|
// }
|
.el-table--striped
|
.el-table__body
|
tr.el-table__row--striped
|
td.el-table__cell {
|
// background-color: rgba(1, 68, 117, 1);
|
background: transparent;
|
}
|
.el-table thead {
|
color: #111111;
|
}
|
// .el-table td.el-table__cell,
|
// .el-table th.el-table__cell.is-leaf {
|
// border-bottom: 1px solid #8e8e8e;
|
// }
|
// .el-table--border .el-table__cell,
|
// .el-table__body-wrapper .el-table--border.is-scrolling-left ~ .el-table__fixed {
|
// border-right: 1px solid #8e8e8e;
|
// }
|
.el-table .el-table__cell {
|
padding: 2rem 0;
|
}
|
.el-table__body tr.hover-row.current-row > td.el-table__cell,
|
.el-table__body,
|
tr.hover-row.el-table__row--striped.current-row,
|
> td.el-table__cell,
|
.el-table__body tr.hover-row.el-table__row--striped > td.el-table__cell,
|
.el-table__body tr.hover-row > td.el-table__cell {
|
background: transparent;
|
}
|
.el-table .cell {
|
font-weight: 300;
|
font-size: 2.6rem;
|
//font-family: Source Han Sans CN, Source Han Sans CN-Light;
|
text-align: center;
|
color: #ffffff;
|
line-height: 2.6rem;
|
}
|
}
|
// }
|
</style>
|
<style lang="scss" scoped>
|
#businessPolicy {
|
}
|
.upCentent {
|
height: 23rem;
|
width: 248rem;
|
margin: 3rem 4rem 0 4rem;
|
display: flex;
|
.upCentent_item {
|
width: 46.4rem;
|
height: 23rem;
|
background: url(../../../assets/images/businessPolicy/bg_1@2x.png) no-repeat
|
center;
|
background-size: 100% 100%;
|
flex: 1;
|
margin-right: 4rem;
|
text-align: center;
|
&:nth-child(5) {
|
margin-right: 0;
|
}
|
.icon img {
|
width: 8rem;
|
height: 8rem;
|
margin-top: 3.1rem;
|
}
|
.text {
|
height: 2.4rem;
|
font-size: 2.4rem;
|
//font-family: Source Han Sans CN, Source Han Sans CN-Light;
|
font-weight: 300;
|
text-align: center;
|
color: #ffffff;
|
line-height: 2.4rem;
|
}
|
.numText {
|
font-size: 2rem;
|
margin-top: 2.5rem;
|
color: #ffffff;
|
span {
|
font-size: 4.8rem;
|
//font-family: Source Han Sans CN, Source Han Sans CN-Light;
|
font-weight: 300;
|
color: #51d2ff;
|
line-height: 2.4rem;
|
margin-right: 1.2rem;
|
}
|
}
|
}
|
}
|
.downCentent {
|
width: 248rem;
|
height: 114.6rem;
|
margin: 3.6rem 4rem 6.2rem 4rem;
|
display: flex;
|
.downCentent_item {
|
width: 122rem;
|
height: 114.6rem;
|
background: url(../../../assets/images/businessPolicy/bg_big@2x.png)
|
no-repeat center;
|
background-size: 100% 100%;
|
flex: 1;
|
margin-right: 4rem;
|
padding: 0 3.3rem 0 3.3rem;
|
position: relative;
|
&:nth-child(2) {
|
margin-right: 0;
|
}
|
.downCentent_title {
|
position: absolute;
|
top: 0.8rem;
|
font-size: 3.2rem;
|
//font-family: Source Han Sans CN, Source Han Sans CN-Regular;
|
font-weight: 400;
|
// text-align: left;
|
color: #51d2ff;
|
line-height: 2.6rem;
|
span {
|
margin-left: 3.7rem;
|
margin-right: 2rem;
|
}
|
}
|
}
|
}
|
.el-table {
|
background: transparent;
|
}
|
</style>
|
