fj-dc-ui/.svn/pristine/db/dbddbc80362745ea1d70c623fa78929558ff11f2.svn-base

<template>
  <el-container>
    <el-main id="dxdcListMain" style="padding:5px 20px 0px;">
      <h3 style="position: relative">
        <div class="searchC">
          <span>行政区划:</span>
          <div>
            <addvSearch
              v-model="adCode"
              :maxHeight='300'
              :maxWidth='200'
              :rootAddCode='"000000000000"'
              :level='"1"'
              :nameOrCode="'name'"
            ></addvSearch>
          </div>
          &nbsp;
          <span>督查状态:</span>
          <el-select v-model="stateList" multiple  collapse-tags placeholder="请选择"  style="width: 150px;">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
           &nbsp;&nbsp;
           <span>年度:</span>
           <el-date-picker
             v-model="year"
             type="year"
             style="width: 150px;"
             format="yyyy"
             value-format="yyyy"
             placeholder="选择年">
            </el-date-picker>
        </div>
        <span>市各县（市、区）小型水库整改情况排名表</span>
      </h3>
      <div :style="{'width': '100%','margin-top':'10px','height': iframeHeight + 'px'}" v-loading="loading">
        <iframe ref="frameMain" id="frameMain" name="frameMain" :src="tableSrc" frameborder="0" width="100%" height="100%" style="overflow: auto"></iframe>
      </div>
    </el-main>
  </el-container>
</template>

<script>
    import request from "@util/gw_ajax_request.js";
    import addvSearch from "@widget/addvSearchCity.vue"
    import {reportHosturl} from '@util/global_variable.js'
    export default {
        components: {
            addvSearch
        },
        props: [],
        data() {
            return {
                stateList:['2'],
                loading:false,
                adCode:"",
                iframeHeight: window.innerHeight - 160,
                year:new Date().getFullYear().toString(),
                options:[
                    {label:'未督查',value:"0"},
                    {label:'督查中',value:"1"},
                    {label:'已督查',value:"2"}
                ],
            };
        },
        computed: {
            persId() {
                return localStorage.getItem("userid")
                    ? localStorage.getItem("userid")
                    : "1098101939614724096";
            },
            tableSrc(){
                return `${reportHosturl}/demo/reportJsp/showReport.jsp?rpx=sk04_fujian&persId=${this.persId}&yearnum=${this.year}&state=${this.stateList.join(",")}&sheng=${this.adCode}&scroll=yes`
            },
            organCode() {
                return localStorage.getItem('currentRlcode') ? localStorage.getItem('currentRlcode') : ''
            },
        },
        mounted() {
            var _this = this
            this.loading = true;
            const iframe = document.querySelector('#frameMain')
            // 处理兼容行问题
            if (iframe.attachEvent) {
                iframe.attachEvent('onload', function () {
                    _this.loading = false;
                })
            } else {
                iframe.onload = function () {
                    _this.loading = false;
                }
            }

        },
        watch:{
            stateList(val){
              this.stateList = val;
            },
            year(val){
              this.year = val;
            }
        },
        methods: {

        }
    };
</script>

<style scoped>
  h3{
    margin: 5px 0;
    text-align: center;
  }
  .searchC{
     position: absolute;
     z-index: 100;
     top:-3px;
     left:20px;
     display: flex;
     align-items: center;
  }
  .searchC span{
     font-size: 14px;
     color: #606266;
  }
</style>