fj-dc-ui/.svn/pristine/55/5598eff4e6fff3e7d26e712d6547b8357a394711.svn-base

<template>
    <el-dialog width="90%"
               :visible.sync="dialogVisible"
               title="组列表"
               @close="dialogClose">
        <div class="messageBox">
          <el-form :inline="true" size="mini" class="demo-form-inline" style="padding-left: 10px;">
            <el-form-item label="组名称:">
              <el-input
                resize="none"
                type="input"
                :rows="3"
                placeholder="请输入组名称"
                v-model.trim="params.groupNm"
                clearable
              ></el-input>
            </el-form-item>
            <el-form-item label="">
              <el-button
                style="color:rgba(255,255,255,1);"
                type="primary"
                icon="el-icon-search"
                @click="search"
              >&nbsp;查&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;询&nbsp;
              </el-button>
            </el-form-item>
          </el-form>
          <el-table
            v-loading="loading"
            border
            ref="table"
            :height="tableHeight"
            :data="tableData"
            tooltip-effect="dark"
            style="width: 100%"
          >
          <el-table-column align="center" type="index" label="序号"  width="60">
            <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="YEAR"
              label="年度"
              show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              header-align="center"
              align="center"
              min-width="100"
              prop="BATCH"
              label="批次"
              show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              header-align="center"
              align="center"
              min-width="100"
              prop="GROUP_NM"
              label="组名"
              show-overflow-tooltip>
            </el-table-column>
          </el-table>
          <el-pagination
            class="paginationCenter"
            background
            @size-change="handleSizeChange"
            @current-change="handlePageChange"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          ></el-pagination>
        </div>
    </el-dialog>
</template>
<script>
  import request from "@util/gw_ajax_request.js";
  export default {
    props: ['param'],
    components: {

    },
    data(){
      return{
        loading:false,
        dialogVisible:true,
        supervisionDetailsVisible:false,
        tableData:[],
        dateRange:[],
        problemId:"",
        tableHeight:450,
        total:0,
        pageNum:1,
        pageSize:10,
        isObjType:false,
        params:{
            name:"",
            mobilenumb:"",
            orgNm:"",
            objType:"",
            objTypeName:"",
            adCode:"",
            timeType:"",
        }

      }
    },
    computed:{
        roleTypeData(){
            return this.$store.state.jcState.roleTypeData;
        },
        groupTypeData(){
            return this.$store.state.jcState.groupTypeData;
        }
    },
    mounted(){

        console.log(this.$store.state.jcState.roleTypeData);
       this.getTableData();
    },
    methods:{
      groupType(row){
          if(row){
              this.groupTypeData.forEach(ele => {
                  if (ele.value == row) {
                      row = ele.label;
                  }
              });
              return row;
          }else{
              return '';
          }
      },
      roleType(row){
          if(row){
              this.roleTypeData.forEach(ele => {
                  if (ele.value == row) {
                      row = ele.label;
                  }
              });
              return row;
          }else{
              return '';
          }
      },
      search(){
          this.getTableData();
      },
      getTableData(){
          var _self = this;
          _self.loading = true;
          this.params.year = this.param.year;
          this.params.batch = this.param.batch;
          this.params.pageNum = this.pageNum;
          this.params.pageSize = this.pageSize;
          this.params.adCode = this.param.adCode;
          request.post('/index/total/getGroupList',this.params).then(res => {
            if (res.success) {
               _self.loading = false;
               _self.tableData = res.data.list;
               _self.total = res.data.total;
            }
        });
      },
      showDetails(id){
        this.problemId = id;
        this.supervisionDetailsVisible = true;
      },
      handleSizeChange(val){
        this.pageSize = val;
        this.getTableData();
      },
      handlePageChange(val){
        this.pageNum = val;
        this.getTableData();
      },
      dialogClose(){
        this.$emit('closeDialogGroup')
      },
      dialogCloseDetail(){
        this.supervisionDetailsVisible = false;
        this.problemId = "";
      },
      formatDate(row){
        if(!row.collTime){
           return "";
        }
        var date = new Date(row.collTime);
        return date.getFullYear()+":"+(date.getMonth()+1)+":"+date.getDate()+" "+date.getHours()+":"+date.getMinutes()+":"+date.getSeconds()

      }
    },
  }
</script>
<style scoped>
  .messageBox{
    color: #606266;
    height: 600px;
    overflow: auto;
  }
  .messT{
     width: 100%;
     height:40px;
     line-height: 40px;
     margin: 0;
     padding: 0;
     text-align: center;
     font-size: 16px;
     font-weight: bold;
  }
  .messTime{
    width: 100%;
    height:30px;
    line-height: 30px;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid grey;
  }
  .messC{
    width: 100%;
    height:calc(100%- 70px);
    margin: 0;
    padding: 0;
    line-height: 30px;
    overflow: auto;
  }
</style>