fj-dc-ui/.svn/pristine/ca/cabf32dddf188e5fa59bbb6125ca82c25be3f7b5.svn-base

<template>
  <div id="rwtz" style="height:100%;width:100%">
    <el-container style="height:100%;width:100%">
      <el-main style="display: flex;justify-content: space-between;">
        <div class="leftPages" style="height:100%;width:100%">

          <el-card>
            <el-row type="flex" justify="space-between">
              <el-col :span="5">
                <h3 style="margin-bottom: 10px;">任务通知</h3>
              </el-col>
            </el-row>
            <div class="search" style="margin-top:10px;">
              <el-table
                v-loading="Loading"
                border
                ref="multipleTable"
                :height="tableHeight"
                :data="rwTzResult"
                tooltip-effect="dark"
                style="width: 100%"
              >
                <el-table-column align="center" type="index" label="序号" min-width="25">
                  <template slot-scope="scope">{{ (pageNum - 1) * pageSize + (scope.$index + 1) }}</template>
                </el-table-column>
                <el-table-column
                  header-align="center"
                  align="center"
                  min-width="100"
                  prop="planUnt"
                  label="发文单位"
                  show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                  header-align="center"
                  align="center"
                  min-width="150"
                  prop="plnNm"
                  label="计划名称"
                  show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                  header-align="center"
                  align="center"
                  min-width="80"
                  prop="inspType"
                  label="督查类型"
                  show-overflow-tooltip
                >
                  <template slot-scope="scope">
                    {{scope.row.inspType | dcTzType}}
                  </template>
                </el-table-column>
                <el-table-column
                  header-align="center"
                  align="center"
                  min-width="100"
                  prop="planNo"
                  label="公文号"
                  show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                  header-align="center"
                  align="center"
                  min-width="150"
                  prop="planCnt"
                  label="督查内容"
                  show-overflow-tooltip
                ></el-table-column>
                <!--<el-table-column-->
                  <!--header-align="center"-->
                  <!--align="center"-->
                  <!--min-width="100"-->
                  <!--prop="intm"-->
                  <!--label="发文时间"-->
                <!--&gt;-->
                  <!--<template slot-scope="scope">-->
                    <!--<span v-if="scope.row.intm">{{formatDate(scope.row.intm)}}</span>-->
                  <!--</template>-->
                <!--</el-table-column>-->
                <el-table-column
                  header-align="center"
                  align="center"
                  min-width="80"
                  prop="intm"
                  label="时间"
                  show-overflow-tooltip
                >
                  <template slot-scope="scope">
                    <span v-if="scope.row.intm">{{formatDate(scope.row.intm)}}</span>
                  </template>
                </el-table-column>
                <el-table-column label="任务分工" align="center">
                  <el-table-column
                    header-align="center"
                    align="center"
                    min-width="80"
                    prop="adName"
                    label="省"  v-if="isXj"
                  ></el-table-column>
                  <el-table-column
                    header-align="center"
                    align="center"
                    min-width="80"
                    prop="inspCount"
                    label="基础数据总数"
                  >
                  </el-table-column>
                  <el-table-column
                    header-align="center"
                    align="center"
                    min-width="80"
                    prop="inspNum"
                    label="督查对象总数"
                  ></el-table-column>
                  <el-table-column
                    header-align="center"
                    align="center"
                    min-width="80"
                    prop="inspScale"
                    label="督查对象占比"
                  >
                    <template slot-scope="scope">
                      <span v-if="scope.row.inspScale">{{scope.row.inspScale * 100 + '%'}}</span>
                      <span v-else>{{scope.row.inspScale}}</span>
                    </template>
                  </el-table-column>
                  <el-table-column
                    header-align="center"
                    align="center"
                    min-width="160"
                    prop="content"
                    label="分工内容"
                    show-overflow-tooltip
                  ></el-table-column>
                </el-table-column>
                <el-table-column
                  align="center"
                  min-width="220"
                  label="操作"
                  fixed="right"
                >
                  <template slot-scope="scope">
                      <el-button type="primary" size="mini" @click.stop="lookOver(scope.row)">查看</el-button>
                    <el-button type="warning" size="mini" @click.stop="drawPlan(scope.row)">制定计划</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-card>
        </div>
      </el-main>
    </el-container>
    <!--查看-->
    <el-dialog title="详情" :visible.sync="lookOverVisible" :close-on-click-modal="false" width="60%">
      <div class="lookTop">
        <h3>督查通知</h3>
        <el-main>
          <el-row :gutter="5" style="padding:8px;">
            <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">计划名称：</el-col>
            <el-col :span="18" style="text-align:left;">{{InspectorNotice.plnNm}}</el-col>
          </el-row>
          <el-row :gutter="5" style="padding:8px;">
            <el-col :span="12" style="text-align:left;">
              <el-row>
                <el-col :span="12" style="color:#409EFF;text-align:right;font-weight:bold;">发文单位：</el-col>
                <el-col :span="12">{{InspectorNotice.planUnt}}</el-col>
              </el-row>
            </el-col>
            <el-col :span="12" style="text-align:left;">
              <el-row>
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">督查类型：</el-col>
                <el-col :span="18">{{InspectorNotice.inspType | dcTzType}}</el-col>
              </el-row>
            </el-col>
          </el-row>
          <el-row :gutter="5" style="padding:8px;">
            <el-col :span="12" style="text-align:left;">
              <el-row>
                <el-col :span="12" style="color:#409EFF;text-align:right;font-weight:bold;">状态：</el-col>
                <el-col :span="12">{{InspectorNotice.sendState | dcState}}</el-col>
              </el-row>
            </el-col>
            <el-col :span="12" style="text-align:left;">
              <el-row>
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">发文时间：</el-col>
                <el-col :span="18">
                  <template>
                    <span v-if="InspectorNotice.intm">{{formatDate(InspectorNotice.intm)}}</span>
                  </template>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
          <el-row :gutter="5" style="padding:8px;">
            <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">督查内容：</el-col>
            <el-col :span="18" style="text-align:left;">
              <el-input type="textarea" v-model="InspectorNotice.planCnt" rows="4" readonly="readonly"></el-input>
            </el-col>
          </el-row>
          <el-row :gutter="5" style="padding:8px;">
            <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">附件：</el-col>
            <el-col :span="18" style="text-align:left;">
              <span style="display: inline-block;
    border-bottom: 1px solid blue;
    color: blue;cursor: pointer;" @click='showPdf(`${hostUrl}/${gwComFileList.filePath}`)'>{{gwComFileList.fileName}}</span>
            </el-col>
          </el-row>
        </el-main>
      </div>
      <div class="lookBottom">
        <h3>督查分工</h3>
        <el-main>
          <el-table
            border
            ref="multipleTable"
            height="calc(25vh)"
            :data="bisInspDvdwkList"
            tooltip-effect="dark"
            style="width: 100%"
          >
            <el-table-column align="center" type="index" label="序号" min-width="25">
              <template slot-scope="scope">{{ (pageNum - 1) * pageSize + (scope.$index + 1) }}</template>
            </el-table-column>
            <el-table-column
              header-align="center"
              align="center"
              min-width="80"
              prop="adName"
              label="省"  v-if="isXj"
            ></el-table-column>
            <el-table-column
              header-align="center"
              align="center"
              min-width="100"
              prop="orgName"
              label="机构"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column
              header-align="center"
              align="center"
              min-width="140"
              prop="content"
              label="分工"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column
              header-align="center"
              align="center"
              min-width="100"
              prop="dtype"
              label="类型"
              show-overflow-tooltip
            >
              <template slot-scope="scope">
                {{scope.row.dtype | dcType}}
              </template>
            </el-table-column>

            <el-table-column
              header-align="center"
              align="center"
              min-width="80"
              prop="inspCount"
              label="基础数据总数"
            >
            </el-table-column>
            <el-table-column
              header-align="center"
              align="center"
              min-width="80"
              prop="inspNum"
              label="督查对象总数"
            ></el-table-column>
            <el-table-column
              header-align="center"
              align="center"
              min-width="80"
              prop="inspScale"
              label="督查对象占比"
            >
              <template slot-scope="scope">
                <span v-if="scope.row.inspScale">{{scope.row.inspScale * 100 + '%'}}</span>
                <span v-else>{{scope.row.inspScale}}</span>
              </template>
            </el-table-column>
          </el-table>
        </el-main>
      </div>
    </el-dialog>

    <el-dialog title="附件详情" :visible.sync="fujianVisible" :close-on-click-modal="false" width="60%" class="fjxq">
      <iframe width="100%" height="100%" :src="pdfTitle" color="white"
              background-color="white" currentScaleValue="page-width">
      </iframe>
    </el-dialog>

    <el-dialog title="督查计划" :visible.sync="dcjhVisible" :close-on-click-modal="false" width="80%" class="dcjh">
      <InspectionPlan></InspectionPlan>
    </el-dialog>
  </div>

</template>

<script>
  import request from '../../utils/gw_ajax_request'
  import {dateFormat} from '../../utils/gw_date.js'
  import { hostUrl } from "@util/global_variable.js";
  import InspectionPlan from "./planManageOneNew.vue"
    export default {
        name: "taskInform",
        components: {
          InspectionPlan
        },
        data() {
            return {
              Loading: false,
              rwTzResult: [],
              pageNum: 1,
              pageSize: 20,
              lookOverVisible: false,
              InspectorNotice: {},
              bisInspDvdwkList: [],
              gwComFileList:{},
              fujianVisible: false,
              dcjhVisible: false,
              pdfTitle:"",
              tableHeight: 50
            }
        },
        computed:{
            hostUrl(){
                return hostUrl
            }
        },
        mounted() {
          this.getRwTzData();
          this.$nextTick(function () {
            this.tableHeight = window.innerHeight - 250;
            let self = this;
            window.onresize = function() {
              self.tableHeight = window.innerHeight - 250;
            }
          })
        },
        methods: {
          lookOver(row) {
            this.gwComFileList = {};
            console.log(row);
            request.get(`/bis/insp/ntfctn/queryNtfctnById?id=${row.id}`).then(res =>{
              if(res.success){
                this.InspectorNotice = res.data;
                if(res.data.gwComFileList){
                  this.gwComFileList = res.data.gwComFileList[res.data.gwComFileList.length - 1];
                }
                this.bisInspDvdwkList = res.data.bisInspDvdwkList;
                this.lookOverVisible = true;
              }
            })


          },
          drawPlan() {
            // this.$router.push({
            //   path:"/dcjh",
            //   name: "督查计划",
            //   // query:{//通过query 传递参数
            //   //
            //   // },
            //   // params:{
            //   //
            //   // }
            // });
            this.dcjhVisible = true;
          },
          getRwTzData(){
            this.Loading = true;
            request.post(`/bis/insp/ntfctn/queryNtfctnAndDvdwk`,{
              pageNum: 0,
              pageSize: 0
            }).then(res =>{
              this.Loading = false;
              if(res.success){
                this.rwTzResult = res.data.list;
              }
            })
          },
          formatDate(row){
            if(row){
              return (dateFormat(row,'yyyy-MM-dd'));
            }
          },
          showPdf(pdfUrl){
            this.fujianVisible = true;
            this.pdfTitle = pdfUrl;
          },
        },
        filters:{
          dcType(val){
            switch (val) {
              case '1':
                return '小水库';
                break;
              case '2':
                return '人饮';
                break;
              case '3':
                return '水毁';
                break;
              case '4':
                return '172';
                break;
              case '5':
                return '地下水';
                break;
              case '6':
                return '水闸';
                break;
              case '7':
                return '水利工程运行';
                break;
            }
          },
          dcState(val){
            switch (val) {
              case '0':
                return '未下发';
                break;
              case '1':
                return '已下发';
                break;
            }
          },
          dcTzType(val) {
            switch(val) {
              case '001':
                return '小水库';
                break;
              case '002':
                return '人饮';
                break;
              case '003':
                return '水毁';
                break;
              case '004':
                return '172';
                break;
              case '005':
                return '地下水';
                break;
              case '006':
                return '水闸';
                break;
              case '007':
                return '水利工程运行';
                break;
            }
          }
        },
    }
</script>

<style>
  #rwtz .fjxq .el-dialog__body{height: 70vh;}
  #rwtz .dcjh .el-dialog__body{height: 70vh;}
  .v-modal{z-index: 1999 !important;}

</style>