fj-dc-ui/.svn/pristine/de/dec6793a6e48e9943134ab16b4a26a4ccd79eac9.svn-base

<template>
  <el-container>
    <el-aside width="20%">
      <el-tree
        ref="trees"
        :data="nodeInfos"
        :props="defaultProps"
        node-key="id"
        @node-click="handleNodeClick">
      </el-tree>
    </el-aside>
    <el-row style="width:80%">
      <el-col :span="24">
        <el-card :body-style="{'padding-top':'10px'}">
          <div class="block">
            <span class="demonstration" style="margin-right: 5px">选择时间段</span>
            <el-date-picker
              v-model="findTime"
              type="daterange"
              value-format="yyyy-MM-dd"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期">
            </el-date-picker>
            <span class="demonstration" style="margin-right: 5px;margin-left: 7px">督查状态</span>
            <el-select v-model="dcType" clearable placeholder="督查状态">
              <el-option label="未督查" value="0"/>
              <el-option label="督查中" value="1"/>
              <el-option label="已督查" value="2"/>
            </el-select>
            <!-- <el-button
                    type="primary"
                    icon="el-icon-download"
                    style="float: right;margin:0 5px"
                    @click="exportExecl"
            >导出
            </el-button> -->
            <el-button
              type="primary"
              icon="el-icon-search"
              style="float: right;margin:0 5px"
              @click="searchExecl"
            >查询
            </el-button>
          </div>
        </el-card>
        <el-card :body-style="{'height':dxdcMainHeight + 'px','padding':'0'}">
          <el-main id="dxdcListMain" style="padding:5px 20px;">
            <div :style="{'width': '100%','height': iframeHeight + 'px'}">
              <iframe ref="frameMain" id="frameMain" name="frameMain" :src="tableSrc" frameborder="0" width="100%"
                      height="100%" style="overflow: auto"></iframe>
            </div>
          </el-main>
        </el-card>
      </el-col>
    </el-row>
  </el-container>
</template>

<script>
  import request from "../../../utils/gw_ajax_request.js";
  import {dateFormat, getFirstDayOfMonth} from '../../../utils/gw_date.js';
  import {getTrees} from "@util/gw_formatTree.js"
  import {getRyNodeProvincialNogroup} from '@api/reportApi.js'
  import {reportHosturl} from '@util/global_variable.js'

  export default {
    props: ['ids'],
    data() {
      return {
        iframeHeight: window.innerHeight - 300,
        // ids: [],
        nodeInfos: [],
        defaultProps: {
          children: 'children',
          label: 'pnm'
        },
        pid: "000",
        pidNodes: [],
        type: "001",
        dxdcMainHeight: window.innerHeight - 300,
        dxdcAsideHeight: window.innerHeight - 180,
        windowHeight: window.innerHeight - 200,
        windowWidth: window.innerWidth - 350,
        tableSrc: '',
        radioTable: 1,
        loading: true,
        leftCol: 4,
        searchObj: {
          "engScal": '2'
        },
        rightCol: 20,
        excelName: "附表2-督查小型水库名称及分布情况表",
        findTime: [getFirstDayOfMonth(new Date(), 'yyyy-MM-dd'), dateFormat(new Date(), 'yyyy-MM-dd')],
        sttm: getFirstDayOfMonth(new Date(), 'yyyy-MM-dd'),
        ettm: dateFormat(new Date(), 'yyyy-MM-dd'),
        treeWidth: 250,
        dcType: '2',
        gcId: '',
      };
    },
    mounted() {
      this.tableSrc = `${reportHosturl}/demo/reportJsp/showReport.jsp?rpx=gcjs_04.rpx&tdsourcetag=s_pctim_aiomsg`
      this.getLeftTreeData()
    },
    computed: {
      userId: function () {
        return localStorage.getItem("userid")
          ? localStorage.getItem("userid")
          : "1098101939614724096";
      }
    },
    methods: {
      getLeftTreeData() {
        let params = {
          userId: this.userId,
          orgType: '004',
        }
        request.get(`/dc/organization/base/getAllNode`, {params: params}).then(res => {
          if (res.success) {
            this.nodeInfos = getTrees(res.data)
          }
        })
      },
      handleNodeClick(data, node) {
        let paramObj = {
          type: "empwt",
          presId: this.userId,
          plnaId: data.id
        }
        Object.assign(this.searchObj, paramObj)
        this.loading = true;
        request
          .post(`/dc/insp/rsvrRgstr/list/tree`, this.searchObj)
          .then(res => {
            if (res.success) {
              if (res.data) {
                this.gcId = ''
                res.data.forEach(element => {
                  this.gcId += element['id'] + ','
                });
              }
              this.tableSrc = `${reportHosturl}/demo/reportJsp/showReport.jsp?rpx=gcjs_04.rpx&tdsourcetag=s_pctim_aiomsg&ids=${this.gcId}`
            }
            this.loading = false;
          });
      },
      // 获取Excel数据
      searchExecl() {
        this.loading = true;
        this.tableSrc = `${reportHosturl}/demo/reportJsp/showReport.jsp?rpx=gcjs_04.rpx&tdsourcetag=s_pctim_aiomsg&ids=${this.gcId}&sttm=${this.sttm}&ettm=${this.ettm}&state=${this.dcType}`
        this.loading = false;
      },
      // 导出Excel数据
      exportExecl() {
        v = window.frames["frameMain"];
        // 调用子页面的js方法
        // v.contentWindow.report1_saveAsExcel();
        v.report1_saveAsExcel();
      }
    },
    watch: {
      findTime(n, o) {
        if (!n) {
          this.sttm = "";
          this.ettm = "";
        } else {
          this.sttm = n[0];
          this.ettm = n[1];
        }
      },
    },
    activated() {

      this.searchExecl();
    }
  };
</script>

<style scoped>
</style>