付延余
2022-05-19 f6334332118fa7843432e9c069a454039d0b0831
src/pages/show/businessPolicy/BusinessPolicy.vue
@@ -1,4 +1,5 @@
<template>
  <!--  营商政策-->
  <div id="businessPolicy">
    <div class="upCentent">
      <!-- 主信息区 -->
@@ -10,7 +11,7 @@
          />
        </div>
        <div class="text">累计出台政策数量</div>
        <div class="numText"><span>280</span>条</div>
        <div class="numText"><span>{{ CountObj.totalPolicy }}</span>条</div>
      </div>
      <div class="upCentent_item">
        <div class="icon">
@@ -20,7 +21,7 @@
          />
        </div>
        <div class="text">惠及企业数量</div>
        <div class="numText"><span>70</span>万户</div>
        <div class="numText"><span>{{ CountObj.units }}</span>万户</div>
      </div>
      <div class="upCentent_item">
        <div class="icon">
@@ -30,7 +31,7 @@
          />
        </div>
        <div class="text">惠及个人数量</div>
        <div class="numText"><span>25.9</span>万人</div>
        <div class="numText"><span>{{ CountObj.persons }}</span>万人</div>
      </div>
      <div class="upCentent_item">
        <div class="icon">
@@ -40,7 +41,7 @@
          />
        </div>
        <div class="text">减免金额</div>
        <div class="numText"><span>1563</span>万元</div>
        <div class="numText"><span>{{ CountObj.amount }}</span>万元</div>
      </div>
      <div class="upCentent_item">
        <div class="icon">
@@ -50,7 +51,7 @@
          />
        </div>
        <div class="text">新闻报道数量</div>
        <div class="numText"><span>36500</span>条</div>
        <div class="numText"><span>{{ CountObj.news }}</span>条</div>
      </div>
    </div>
    <!-- 表格区 -->
@@ -59,41 +60,40 @@
        <div class="centent_title">
          <span>政策内容</span
          ><img
            src="../../../assets/images/businessPolicy/title_end@2x.png"
            alt=""
          />
          src="../../../assets/images/businessPolicy/title_end@2x.png"
          alt=""
        />
        </div>
        <div class="BusinessPolicyTable">
          <el-table
            stripe
            max-height="1005"
            :data="tableData"
            style="width: 100%"
            :max-height="tableHeight"
            :header-row-style="tableHeaderRow"
            :row-class-name="tableRowClassName"
            @row-click="tableRowClick"
          >
            <el-table-column prop="keshi" label="科室" min-width="10" fixed>
            <el-table-column prop="department" label="科室" min-width="10" fixed>
            </el-table-column>
            <el-table-column
              prop="zhengchemingcheng"
              prop="policyName"
              label="政策名称"
              min-width="30"
            >
            </el-table-column>
            <el-table-column
              prop="shengxiaoDate"
              prop="effecttimeStart"
              label="生效日期范围"
              min-width="30"
            >
            </el-table-column>
            <el-table-column
              prop="huijiqiyeNum"
              prop="unitNums"
              label="惠及企业数"
              min-width="15"
            >
            </el-table-column>
            <el-table-column prop="money" label="减免金额" min-width="15">
            <el-table-column prop="reductions" label="减免金额" min-width="15">
            </el-table-column>
          </el-table>
        </div>
@@ -102,30 +102,29 @@
        <div class="centent_title">
          <span>相关报道</span
          ><img
            src="../../../assets/images/businessPolicy/title_end@2x.png"
            alt=""
          />
          src="../../../assets/images/businessPolicy/title_end@2x.png"
          alt=""
        />
        </div>
        <div class="BusinessPolicyTable">
          <el-table
            stripe
            :data="tableData2"
            :data="tableData"
            style="width: 100%"
            :max-height="tableHeight"
            :header-row-style="tableHeaderRow"
            max-height="1005"
            :row-class-name="tableRowClassName"
          >
            <el-table-column
              prop="tableTitle"
              prop="policyName"
              label="标题"
              min-width="70"
              align="right"
            >
            </el-table-column>
            <el-table-column prop="laiyuan" label="来源" min-width="15">
            <el-table-column prop="resource" label="来源" min-width="15">
            </el-table-column>
            <el-table-column
              prop="dianjiliang"
              prop="unitNums"
              label="累计点击量"
              min-width="15"
            >
@@ -143,333 +142,74 @@
        min-height=" 112rem"
      >
        <div class="dislogCloseIcon" @click="tableDialogVisible = false"></div>
        <h1>失业保险稳岗返还政策</h1>
        <h1>{{detailForm.policyName}}</h1>
        <div class="fuTitle">
          <span>出台部门:人社局</span><span>出台时间:2021/3/1</span
          ><span>惠及企业:100家</span><span>减免金额:377万元</span>
          <span v-if="detailForm.makeDept">出台部门:{{detailForm.makeDept}}</span><span v-if="detailForm.makeTime">出台时间:{{detailForm.makeTime}}</span
        ><span v-if="detailForm.unitNums">惠及企业:{{detailForm.unitNums}}</span><span v-if="detailForm.reductions">减免金额:{{detailForm.reductions}}</span>
        </div>
        <div class="dialogText">
          <el-divider></el-divider>
          <span>
            通过加大扶持力度和精准落实困难企业稳岗返还政策,充分发挥失业保险“预防失业”功能,加大失业保险援企稳岗力度,支持企业稳定就业岗位和健康发展。<br />
            加大扶持力度,扩大政策受益面。放宽申领条件,中小微企业裁员率不高于2019年度全国城镇调查失业率控制目标5.5%,参保职工30人(含,以上年度月均参保人数为准)以下的参保企业裁员人数不超过参保职工总数20%的,可以申请企业稳岗返还。提高返还标准,对不裁员或少裁员的中小微企业,稳岗返还标准从企业及其职工上年度缴纳失业保险费的50%提高到100%。<br />
            加强困难帮扶,精准落实困难企业稳岗返还政策。确定了困难企业稳岗返还标准,100人(含)至500人(含)企业,返还标准按1个月的上年度全市月人均失业保险金和月均参保职工人数确定;501人至1000人(含)企业,返还标准按2个月的上年度全市月人均失业保险金和月均参保职工人数确定;1001人以上企业,按3个月的上年度全市月人均失业保险金和月均参保职工人数确定;对受疫情影响较大的餐饮、酒店、旅游、零售、冰雪等行业企业,在相应补贴标准基础上增加一个月。<br />
            申请稳岗补贴企业应同时具备以下条件:<br />
            生产经营活动符合国家及所在地产业结构调整和环保政策;<br />
            上年度未裁员或裁员率不超过全省城镇登记失业率控制目标4.5%;<br />
            上年度足额缴纳失业保险费满12个月且无历史欠缴;<br />
            2019年度经营情况亏损,或受疫情影响2020年以来营业收入同比下降幅度在50%(含)以上;<br />
            企业参加失业保险职工人数不低于100人;<br />
            与企业工会组织协商制定稳定就业岗位措施,并承诺1年内不裁员或者裁员率低于全省城镇登记失业率控制目标4.5%。<br />
            严重失信企业、被列入破产清算或注销名单的“僵尸企业”、申请稳岗返还时失业保险参保人数比上年度平均参保人数减少超过50%的企业不列入返还范围。</span
          >
          <span v-if="detailForm.policyContent" v-html="detailForm.policyContent"></span>
        </div>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import {getCount, getList, getDetail} from '@/api/businessPolicy'
export default {
  data() {
    return {
      tableData: [
        {
          id: 1,
          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万元"
        },
        {
          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万元"
        }
      ],
      tableData2: [
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        },
        {
          tableTitle:
            "大力优化营商环境丨市人社局:服务提速提能 让百姓享受改革红利",
          laiyuan: "石家庄新闻",
          dianjiliang: "15690"
        }
      ],
      CountObj:{},
      tableData: [],
      tableDialogVisible: false,
      tableHeight: window.innerHeight * 0.62
    };
  },
  mounted() {
    const that = this;
    window.onresize = () => {
      let height = window.innerHeight * 0.62;
      that.tableHieght = height;
      console.log(height);
    };
    // this.$nextTick(() => {
    //   this.tableHeight = window.innerHeight * 0.62;
    //   console.log(this.tableHeight);
    // });
    //
    // window.onresize = () =>
    //   (() => {
    //     window.screenWidth = document.body.clientWidth;
    //     that.screenWidth = window.screenWidth;
    //   })();
  },
  watch: {
    tableHeight(val) {
      // 为了避免频繁触发resize函数导致页面卡顿,使用定时器
      if (!this.timer) {
        // 一旦监听到的tableHeight值改变,就将其重新赋给data里的tableHeight
        this.tableHeight = val;
        this.timer = true;
        const that = this;
        setTimeout(function() {
          // that.sjcount(that.screenWidth); //窗口大小变化后执行的方法
          that.reload(); //窗口大小变化后执行的方法
          console.log(tableHeight);
          that.timer = false;
        }, 10);
      tableHeight: window.innerHeight * 0.62,
      detailForm:{
          policyName:'',  //政策名称/新闻标题
          makeDept:'',  //出台部门
          makeTime:'',   //出台时间
          unitNums:'',   //惠及企业数
          reductions:'',   //减免金额
          policyContent:'',  //政策内容
      }
    }
    };
  },
  mounted(){
    this.getCount()
    this.getZhengce()
    this.getBaodao()
  },
  methods: {
    tableHeaderRow({ rowIndex }) {
      if (rowIndex === 0) return { height: "8rem" };
    },
    tableRowClassName({ rowIndex }) {
   /*******查询营商政策和相关报道列表接口*******/
   getZhengce() {
       this.getList('1')
   },
   getBaodao() {
       this.getList('2')
   },
   getList(type) {
       getList({type:type}).then(res => {
           if(res.code == 1000) {
               this.tableData = res.list
           }
       })
   },
      /***39.查询营商政策详情接口***/
      getDetail(id) {
          getDetail({id:id}).then(res => {
              if(res.code == 1000) {
                this.detailForm.policyName = res.obj.policyName
                this.detailForm.makeDept = res.obj.makeDept
                this.detailForm.makeTime = res.obj.makeTime
                this.detailForm.policyContent = res.obj.policyContent
                this.detailForm.unitNums = res.obj.unitNums
                this.detailForm.reductions  = res.obj.reductions
              }
          })
      },
    tableRowClassName({rowIndex}) {
      if (rowIndex % 2 === 0) {
        return "warning-row";
      }
@@ -480,59 +220,79 @@
      console.log(row);
      console.log(row.__ob__.dep.id);
      console.log(row.id);
      this.getDetail(row.id)
    },
    reload() {
      this.isAlive = false;
      this.$nextTick(function() {
        this.isAlive = true;
      });
    // 37. 查询营商政策五个统计数量接口
    getCount(){
      getCount().then(res=>{
        // console.log(res);
        if(res.code === 1000){
          this.CountObj = res.obj
        }
      })
    }
  }
};
</script>
<style lang="scss">
@import "../../../assets/css/base";
@import "../../../assets/css/mixin.scss";
// 表格
.BusinessPolicyTable {
  height: 3.92578125rem;
  width: 4.5078rem;
  position: absolute;
  top: 0.2813rem;
  left: 0.1289rem;
  @include overflow-y();
  .el-table {
    background: transparent;
  }
  .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
    background: none;
  }
  // 去掉当前行高亮背景颜色
  .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
    background: none;
  }
  // 状态颜色
  .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 tr {
    background: transparent;
  }
  // 头部
  .el-table th.el-table__cell {
    background: transparent;
  }
  .el-table--striped,
    .el-table__body,
    tr.el-table__row--striped,
    td.el-table__cell {
  .el-table__body,
  tr.el-table__row--striped,
  td.el-table__cell {
    background: transparent;
  }
  .el-table thead {
    color: #111111;
  }
  .el-table .el-table__cell {
    padding: 2rem 0;
    padding: 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,
@@ -541,13 +301,13 @@
  .el-table__body tr.hover-row > td.el-table__cell {
    background: transparent;
  }
  .el-table .cell {
    font-weight: 300;
    font-size: 0.1016rem;
    //font-family: Source Han Sans CN, Source Han Sans CN-Light;
    text-align: center;
    color: #ffffff;
    line-height: 0.1016rem;
    line-height: 0.25rem;
  }
}
@@ -556,32 +316,38 @@
  .el-dialog__wrapper {
    background: rgba(0, 0, 0, 0.9);
  }
  .el-dialog {
    background: url(../../../assets/images/businessPolicy/dialog@2x.png)
      no-repeat center;
    background: url(../../../assets/images/businessPolicy/dialog@2x.png) no-repeat center;
    background-size: 100% 100%;
    height: 4.375rem;
  }
  // 清除默认关闭样式
  .el-icon-close:before {
    content: "";
  }
  .el-dialog__header {
    padding: 0;
    width: 0;
    height: 0;
  }
  .el-dialog__body {
    text-align: center;
    color: #eeeeee;
    h1 {
      margin-top: 0.4375rem;
      font-size: 0.1563rem;
    }
    span {
      font-size: 0.1094rem;
    }
  }
  .el-divider {
    margin: 0;
    background-color: #eeeeee;
@@ -589,43 +355,47 @@
}
</style>
<style lang="scss" scoped>
#businessPolicy {
}
// #businessPolicy {
// }
.upCentent {
  height: 0.8984rem;
  width: 9.6875rem;
  margin: 0.1172rem 0.1563rem 0 0.1563rem;
  display: flex;
  .upCentent_item {
    width: 1.8125rem;
    height: 0.8984rem;
    background: url(../../../assets/images/businessPolicy/bg_1@2x.png) no-repeat
      center;
    background: url(../../../assets/images/businessPolicy/bg_1@2x.png) no-repeat center;
    background-size: 100% 100%;
    flex: 1;
    margin-right: 0.1563rem;
    text-align: center;
    &:nth-child(5) {
      margin-right: 0;
    }
    .icon img {
      width: 0.3125rem;
      height: 0.3125rem;
      margin-top: 0.1211rem;
    }
    .text {
      height: 0.0938rem;
      font-size: 0.0938rem;
      //font-family: Source Han Sans CN, Source Han Sans CN-Light;
      font-weight: 300;
      text-align: center;
      color: #ffffff;
      line-height: 0.0938rem;
    }
    .numText {
      font-size: 0.0781rem;
      margin-top: 0.0977rem;
      color: #ffffff;
      span {
        font-size: 0.1875rem;
        //font-family: Source Han Sans CN, Source Han Sans CN-Light;
@@ -637,24 +407,27 @@
    }
  }
}
.downCentent {
  width: 9.6875rem;
  height: 4.4766rem;
  margin: 0.1406rem 0.1563rem 0.2422rem 40px;
  display: flex;
  .downCentent_item {
    width: 4.7656rem;
    height: 4.4766rem;
    background: url(../../../assets/images/businessPolicy/bg_big@2x.png)
      no-repeat center;
    background: url(../../../assets/images/businessPolicy/bg_big@2x.png) no-repeat center;
    background-size: 100% 100%;
    flex: 1;
    margin-right: 0.1563rem;
    padding: 0 0.1289rem 0 0.1289rem;
    position: relative;
    &:nth-child(2) {
      margin-right: 0;
    }
    .centent_title {
      position: absolute;
      top: 0.0313rem;
@@ -664,9 +437,15 @@
      // text-align: left;
      color: #51d2ff;
      line-height: 0.1016rem;
      span {
        margin-left: 0.1445rem;
        margin-right: 0.0781rem;
      }
      img {
        width: 0.5313rem;
        height: 0.0625rem;
      }
    }
  }
@@ -677,8 +456,7 @@
    display: inline-block;
    width: 0.1875rem;
    height: 0.1875rem;
    background: url(../../../assets/images/businessPolicy/dialogClose@2x.png)
      no-repeat center;
    background: url(../../../assets/images/businessPolicy/dialogClose@2x.png) no-repeat center;
    // background: 100% 100%;
    // background-color: red;
    margin: 0;
@@ -686,12 +464,15 @@
    top: 0.2734rem;
    left: 45%;
  }
  .fuTitle {
    margin-top: 0.2344rem;
    span {
      margin-right: 0.3125rem;
    }
  }
  .dialogText {
    width: 7.5rem;
    height: 2.3438rem;