fj-dc-ui/.svn/pristine/e0/e08d52f117d11afedf260c2ef0b2feeeac1ee590.svn-base

<template>
  <el-row style="width: 100%;height:100%;">
    <el-col :span="leftCol" style="height:100%;">
      <el-card :body-style="{'padding':'0'}" style="height:100%;">
        <el-tree
          class="el-treeWhite"
          :data="treeData"
          :props="treeProps"
          @node-click="nodeClick"
          node-key="id"
          style="max-height:100%;overflow:auto;"
        ></el-tree>
      </el-card>
    </el-col>
    <el-col :span="rightCol" style="height:100%;">
<!--      <el-card :body-style="{'padding-top':'10px'}">-->
<!--        <el-radio-group v-model="radioTable">-->
<!--          <el-radio :label="1">监督复核情况报告</el-radio>-->
<!--        </el-radio-group>-->
<!--        <div class="block">-->
<!--          <span class="demonstration">选择时间</span>-->
<!--          &lt;!&ndash;          <el-date-picker&ndash;&gt;-->
<!--          &lt;!&ndash;            v-model="dateValue"&ndash;&gt;-->
<!--          &lt;!&ndash;            type="month"&ndash;&gt;-->
<!--          &lt;!&ndash;            value-format="yyyy-MM"&ndash;&gt;-->
<!--          &lt;!&ndash;            placeholder="选择月">&ndash;&gt;-->
<!--          &lt;!&ndash;          </el-date-picker>&ndash;&gt;-->
<!--          <el-date-picker-->
<!--            v-model="date"-->
<!--            type="daterange"-->
<!--            format="yyyy-MM-dd"-->
<!--            range-separator="至"-->
<!--            start-placeholder="开始日期"-->
<!--            end-placeholder="结束日期">-->
<!--          </el-date-picker>-->
<!--          &lt;!&ndash;          <el-button type="primary" icon="el-icon-download"&ndash;&gt;-->
<!--          &lt;!&ndash;                     style="float: right;margin:0 5px"&ndash;&gt;-->
<!--          &lt;!&ndash;                     @click="exportExecl">导出&ndash;&gt;-->
<!--          &lt;!&ndash;          </el-button>&ndash;&gt;-->
<!--          <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'}" style="height:100%;">
        <div
          style="width: 100%;height: 100%;display:flex;flex-direction:row;justify-content:center;align-items:center;"
          v-loading="loading"
        >
          <i v-if="firstToShow" style="font-size:32px;" class="el-icon-warning-outline"></i>
          <p
            v-if="firstToShow"
            style="font-weight: bolder;color: #868686;font-size: larger;"
          >请点击左侧小组</p>
          <iframe
            v-show="!firstToShow"
            ref="myIframe"
            id="frameMain_sk7"
            src
            frameborder="0"
            width="100%"
            height="100%"
            style="overflow: auto"
          ></iframe>
        </div>
      </el-card>
    </el-col>
  </el-row>
</template>

<script>
  import {dateFormat} from '../../utils/gw_date.js'
  import request from '../../utils/gw_ajax_request.js';

  export default {
    data() {
      return {
        firstToShow: true,
        id: '',
        pid: '000',
        pidNodes: [],
        ptypes: '053,054,055,056,057',
        level: '1',
        dxdcMainHeight: window.innerHeight,
        dxdcAsideHeight: window.innerHeight - 90,
        windowHeight: window.innerHeight - 160,
        windowWidth: window.innerWidth - 250,
        reportSrc: '/pageofficePath/dc/pageoffice/report/show',
        // type: 'renyin',
        radioTable: 1,
        loading: false,
        leftCol: 4,
        rightCol: 20,
        excelName: '监督复核情况报告',
        dateValue: "",
        date: "",
        treeData: [],
        code: '45',
        tableDefaultExpandedKeys: ['001', '002', '003', '006'],
        treeProps: {
          label: "pnm",
          children: "childrens",
          disabled: false,
          expandOnClickNode: false,
          first: true,
        },
        checkedData: [],
        changedData: [],
        yearList: [],
      }
    },
    mounted() {
      this.getLeftTreeData();
    },
    computed: {
      userId: function () {
        return localStorage.getItem("userid")
          ? localStorage.getItem("userid")
          : "1098101939614724096"
      }
    },
    methods: {
      // 节点点击事件
      nodeClick: function (data, node) {
        const ids = data.code.split(",");
        if (ids !== ''){
          if (ids[0].length !== 12){
            return;
          }
        }
        this.id = data.code;
        this.searchExecl();
      },
      //根据用户id获取左侧树
      getLeftTreeData() {
        var _self = this;
        request.get('/dc/insp/all/listByName?ptypes=' + this.ptypes).then((res) => {
          let data = res.data;
          if (data != null && data.length > 0) {
            _self.treeData = data;
          }

          // 获取第一个节点给子页面带过去
          this.getFirstNode(data);
        })
      },
      getFirstNode(data) {
        let node = '';
        if (data != null && data != '') {
          if (data[0].id.length == 6) {
            node = data[0].id;
          } else if (data[0].id.length == 3) {
            node = data[0].childrens[0].id;
          }
        }
      },
      // 获取Excel数据
      searchExecl() {
        let _this = this;
        if (_this.id === '') {
          this.firstToShow = true
          return
        }
        let iframe = document.getElementById("frameMain_sk7")
        iframe.src = _this.reportSrc + "?dateValue=" + _this.dateValue + "&ids=" + _this.id + "&type=wrws";
        iframe.onload = function () {
          _this.firstToShow = false
        }
      },
      openMessage() {
        const h = this.$createElementnpm
        this.$notify({
          title: '提示',
          message: h('i', {style: 'color: teal'}, '点击查询才会生成工作报告')
        })
      },
      // 导出Excel数据
      exportExecl() {
        v = window.frames["frameMain_sk7"];
        v.contentWindow.report1_saveAsWord()
      },

    },
    watch: {
      date(n, o) {
        this.dateValue = "";
        if (n !== null) {
          for (const v in n) {
            let date = dateFormat(n[v], 'yyyy-MM-dd');
            this.dateValue = this.dateValue + date + ',';
          }
          this.dateValue = this.dateValue.substring(0, this.dateValue.length - 1);
        }
      }
    }

  }
</script>
<style scoped>
</style>