<template>
  <section class="RTContainerznzs">
    <!-- <div class="znzs" @click='appliNewsBannerlink(0)'>
           <img src="~@/assets/images/RTImgs/bannericon1.png" class="icon1">
        </div>
       <div class="sfxm" @click='appliNewsBannerlink(1)'>
           <img src="~@/assets/images/RTImgs/bannericon3.png" class="icon3">
        </div> -->
    <div class="znzs" @click='appliNewsBannerlink(0)'>
      <h2>智能指数榜</h2>
      <h4>七大指数评分标准</h4>
      <span class="imgbottom"><img src="~@/assets/images/RTImgs/zn1.png"></span>
    </div>

    <div class="sfxm" @click='appliNewsBannerlink(1)'>
      <h2>示范项目</h2>
      <h4>优秀项目展示</h4>
      <span class="imgbottom"><img src="~@/assets/images/RTImgs/sf1.png"></span>
    </div>

    <!-- 弹窗 -->
    <el-dialog title="" :visible.sync="DialogVisible" :close-on-click-modal="false" width="95%" class="dialogpicznzs"
      center>
      <span class="dialogContent">
        <section class="projectDocumentWork">
          <iframe :src="url" frameborder="0" border="0" ref="iframeRef" name="ifraname" v-if="DialogVisible"></iframe>
        </section>
      </span>
    </el-dialog>
  </section>
</template>
<script>
export default {
  data() {
    return {
      DialogVisible: false,
      src: "",
      url:''
    };
  },
  methods: {
    appliNewsBannerlink(index) {
      if (index == 1) {
        let url = `/static/signon/news/index.html?v=${Date.now()}#/DynamicPage4?id=w50Bfs68e3npVlrTDF1--__j0Bcl6YXcZ24REitb00`; //示范试点项目
        let title = "示范试点项目";
        this.$parent.$parent.$parent.$parent.navtopmenuclick(
          6,
          "news",
          url,
          title
        );
      } else if (index == 0) {
        this.DialogVisible = true;
        this.$nextTick(() => {
          this.url=`/static/portal/vue/index.html?v=${Date.now()}#/view_blank?id=__jnb24wZC9CSgxc5H7d4&name=智能指数榜&appId=__m4WrVzBEjqYFrQFZD2h&linkType=01&actionContent=__1KReX3FcDRoob9Y7PeF&paramKey=&paramValue=&opentarget=target`
        })
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.RTContainerznzs {
  .znzs {
    height: 169px;
    background: #ffffff;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 16px;
    cursor: pointer;
    h2 {
      font-size: 24px;
      font-weight: 400;
      color: #0f71ff;
      // flex: 1;
      margin-top: 36px;
      margin-bottom: 10px;
    }
    h4 {
      font-size: 14px;
      font-weight: 400;
      color: #82adfe;
      margin-bottom: 10px;
    }
    .imgbottom {
    }
  }

  .sfxm {
    height: 169px;
    background: #ffffff;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 16px;
    cursor: pointer;
    h2 {
      font-size: 24px;
      font-weight: 400;
      color: #0f71ff;
      // flex: 1;
      margin-bottom: 10px;
      margin-top: 36px;
    }
    h4 {
      font-size: 14px;
      font-weight: 400;
      color: #82adfe;
      margin-bottom: 10px;
    }
    .imgbottom {
    }
  }
}
</style>
<style lang="scss">
//  .dialogpic .el-dialog--center .el-dialog__body{
//      height:700px; overflow: auto;
//     .dialogImg{
//         img{width: 100%;}
//     }
//  }
.dialogpicznzs {
  .el-dialog--center .el-dialog__body {
    height: 96%;
    overflow: auto;
  }
  .el-dialog {
    width: 95% !important;
    height: 95vh !important;
    margin-top: 2vh !important;
  }
  .dialogImg {
    img {
      width: 100%;
    }
  }
}
</style>
<style lang="scss">
.projectDocumentWork {
  iframe {
    display: block; /* iframes are inline by default */
    background: none;
    border: none; /* Reset default border */
    width: 100%;
    height: 82vh;
    padding-bottom: 0px;
  }
}
.dialogpicwork {
  .el-dialog {
    width: 95% !important;
    height: 95vh !important;
    margin-top: 2vh !important;
  }
}
</style>