fj-dc-ui/.svn/pristine/03/037ffa6050400911366a0723fd8fc1dbfae4bfbd.svn-base

<template>
  <transition name="el-fade-in-linear">
    <draggable :title="Title" initTop=100 initLeft=220 initWidth=790 initHeight=500 @closeDraggable='closeModal' style="z-index:999;">
      <div class="process_line">
        <!--<div class="item">-->
          <!--<span class="title">属性<i class="el-icon-d-arrow-right"></i></span>-->
        <!--</div>-->
        <div class="item content">
          <el-row :gutter="5" style="padding:5px;">
              <el-col :span="3" style="color:#409EFF;text-align:left;font-weight:normal;">项目名称：</el-col>
              <el-col :span="9" style="text-align:left;">{{curEventInfo.wtdstNm}}</el-col>
              <el-col :span="3" style="color:#409EFF;text-align:left;font-weight:normal;">项目位置：</el-col>
              <el-col :span="9" style="text-align:left;">{{curEventInfo.locNm}}</el-col>
          </el-row>
          <el-row :gutter="5" style="padding:5px;">
              <el-col :span="3" style="color:#409EFF;text-align:left;font-weight:normal;">计划完成：</el-col>
              <el-col :span="9" style="text-align:left;">{{curEventInfo.planRcvrTm==null?'-':curEventInfo.planRcvrTm}}</el-col>
              <el-col :span="3" style="color:#409EFF;text-align:left;font-weight:normal;">项目进度：</el-col>
              <el-col :span="9" style="text-align:left;">{{curEventInfo.wtdstState == '2' ? '待开工' : curEventInfo.wtdstState == '1' ? '正修复' : curEventInfo.wtdstState == '0' ? '已修复' : ''}}</el-col>
          </el-row>
          <el-row :gutter="5" style="padding:5px;">
              <el-col :span="3" style="color:#409EFF;text-align:left;font-weight:normal;">水毁情况：</el-col>
              <el-col :span="21" style="text-align:left;">{{curEventInfo.wtdstDtle}}</el-col>
          </el-row>
          <el-row :gutter="5" style="padding:5px;">
              <el-col :span="3" style="color:#409EFF;text-align:left;font-weight:normal;">建议措施：</el-col>
              <el-col :span="21" style="text-align:left;">{{curEventInfo.adNm}}</el-col>
          </el-row>
          <el-row :gutter="5" style="padding:5px;">
              <el-col :span="3" style="color:#409EFF;text-align:left;font-weight:normal;">备注：</el-col>
              <el-col :span="21" style="text-align:left;">{{curEventInfo.note}}</el-col>
          </el-row>
        </div>
        <!--<div class="item" style="margin-top:10px;">-->
          <!--<span class="title">问题<i class="el-icon-d-arrow-right"></i></span>-->
        <!--</div>-->
        <div class="item content">
            <el-table :data="wtqdData" height="200" highlight-current-row border stripe style="width: 100%">
              <el-table-column
                show-overflow-tooltip="true"
                prop="inspPblmsName"
                label="督查问题类别"
                min-width="100"
                align="center"
              ></el-table-column>
              <el-table-column
                header-align="center"
                align="center"
                show-overflow-tooltip="true"
                min-width="100"
                prop="inspPblmCate"
                label="问题严重程度"
              >
                <template slot-scope="scope">
                  <span
                    style="padding: 3px 10px;background:#27C19F;border-radius:15px;color:rgba(255,255,255,1)"
                    v-if="scope.row.inspPblmCate == 0"
                  >一般</span>
                  <span
                    style="padding: 3px 10px;background:#E6A23C;border-radius:15px;color:rgba(255,255,255,1)"
                    v-if="scope.row.inspPblmCate == 1"
                  >较重</span>
                  <span
                    style="padding: 3px 10px;background:#F56C6C;border-radius:15px;color:rgba(255,255,255,1)"
                    v-if="scope.row.inspPblmCate == 2"
                  >严重</span>
                </template>
              </el-table-column>
              <el-table-column
                header-align="center"
                align="center"
                min-width="80"
                prop="ifCasePblm"
                label="是否典型"
              >
                <template slot-scope="scope">
                  <span v-if="scope.row.ifCasePblm == 1">典型</span>
                  <span v-if="scope.row.ifCasePblm == 0">非典型</span>
                </template>
              </el-table-column>
              <el-table-column
                prop="collTime"
                label="上报时间"
                align="center"
                :formatter="timestampToTime"
                show-overflow-tooltip="true"
                min-width="120"
              ></el-table-column>
              <el-table-column
                prop="inspPblmDesc"
                label="描述"
                align="center"
                show-overflow-tooltip="true"
                min-width="170"
              ></el-table-column>
              <!-- <el-table-column fixed="right" label="操作" min-width="60">
                <template slot-scope="scope">
                  <el-button @click="showDetail(scope.row)" type="text" size="small">详情</el-button>
                </template>
              </el-table-column> -->
            </el-table>
            <el-footer id="dxdcFooter" style="height: 30px">
                <el-pagination background @current-change="handleCurrentChange" @size-change="handleSizeChange" :pager-count="5" :current-page.sync="pageNum"
                :page-size="pageSize" :page-sizes="[5,10, 20, 30, 40, 50]" layout="sizes, total, prev, pager, next" :total="total"></el-pagination>
            </el-footer>
        </div>

        <!--<div v-if="showMore_sh" class="item" style="margin-top:10px;">-->
        <!--<span class="title"><i class="el-icon-star-on"></i>问题详情</span>-->
        <!--</div>-->
        <transition name="el-fade-in-linear">
          <!--<div class="eventDetailClass">-->
          <draggable title="问题详情" @closeDraggable="closeDraggable_shxq" initTop=0 initLeft=300 initWidth=600
                     initHeight=325 v-if="showMore_sh">
            <template>
              <el-table :data="tableData2" height="300" highlight-current-row border stripe style="width: 100%">
                <el-table-column type="index" label="序号" align='center' width="80">
                </el-table-column>
                <el-table-column prop="inspPblmName" label="问题名称" align='center' width="150">
                </el-table-column>
                <el-table-column prop="inspPblmDesc" label="问题描述" align='center' width="120">
                </el-table-column>
                <el-table-column prop="inspAddDesc" label="问题地址" align='center' width="150">
                </el-table-column>
                <el-table-column prop="collTime" label="上报时间" align='center' width="130" :formatter="timestampToTime">
                </el-table-column>
                <el-table-column prop="pblmStat" label="处理状态" align='center' width="100" :formatter="processState">
                </el-table-column>
                <el-table-column prop="pblmLong" label="问题经度" align='center' width="100">
                </el-table-column>
                <el-table-column prop="pblmLat" label="问题纬度" align='center' width="100">
                </el-table-column>
                <el-table-column prop="reviOpin" label="复查意见" align='center' width="100">
                </el-table-column>
                <el-table-column prop="reviConc" label="复查结论" align='center' width="100">
                </el-table-column>
                <el-table-column prop="recPers" label="操作记录人员" align='center' min-width="300">
                </el-table-column>
              </el-table>
            </template>
          </draggable>
        </transition>
      </div>
    </draggable>
  </transition>
</template>

<script>
  import draggable from './draggable'
  import request from "../../../utils/gw_ajax_request.js";
  export default {
    name: "WaterloggingProject",
    components:{
      draggable,
    },
    props:['shInfoCon','Title'],
    data(){
      return {
        curEventInfo:this.shInfoCon,
        title:this.Title,
        wtqdData:[],
        showMore_sh:false,
        problemForm: {},
        pageNum: 1,
        pageSize: 5,
        total:0,
      }
    },
    computed: {
      persId() {
        return localStorage.getItem("userid")
          ? localStorage.getItem("userid")
          : "1098101939614724096";
      }
    },
    mounted(){
      this.getQusList();
    },
    watch:{
      shInfoCon(val){
        this.curEventInfo = val;
      }
    },
    methods:{
      getQusList() {
        this.problemForm.presId = this.persId;
        this.problemForm.objId = this.curEventInfo.objId;
        this.problemForm.objType = '3';
        this.problemForm.pageNum = this.pageNum;
        this.problemForm.pageSize = this.pageSize;
        request
          .post(`/dc/insp/pblm/list/${this.persId}`, this.problemForm)
          .then(res => {
            if (res.success) {
              this.wtqdData = res.data.list;
              this.total = res.data.total;
            }
          });
      },
      showDetail(obj){
        this.showMore_sh = true;
      },
      handleCurrentChange(val) {
        this.pageNum = val;
          this.getQusList()
      },
      handleSizeChange(val){
        this.pageSize = val
        this.getQusList()
      },
      //  关闭人员弹窗
      closeModal() {
        this.$emit('closeModal','shgc')
      },
      timestampToTime(row, column) {
        var date = new Date(row.collTime);
        var Y = date.getFullYear() + "-";
        var M =
          (date.getMonth() + 1 < 10
            ? "0" + (date.getMonth() + 1)
            : date.getMonth() + 1) + "-";
        var D =
          (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
        var h =
          (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":";
        var m =
          date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
        return Y + M + D + h + m;
      },
    }
  }
</script>

<style scoped>
  .item.content {
    padding: 20px;
    padding-bottom: 0px;
  }
  span.label {
    font-size: 17px;
    font-weight: bold;
  }
</style>