<template>
    <d2-container>
        <div class="d2-table-view-full">
            <div class="d2-table-view-header">
                <el-form size="small" :inline="true" :model="filter" @keyup.enter.native="handleList" class="demo-form-inline" labelPosition="right">

                    <el-form-item label="地区编码">
                        <el-input v-model ="filter.areaCode" placeholder="地区编码" clearable/>
                    </el-form-item>
                    <el-form-item>
                        <el-button   type="primary" @click="handleList('1')">查询</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <div class="d2-table-view-content">
                <div class="d2-table-view-handle">
                </div>
                <d2-crud
                        title="机构管理列表"
                        ref="d2Crud"
                        :options="tableOptions"
                        :loading="loading"
                        :columns="columns"
                        :data="data"
                        >
                </d2-crud>
            </div>
            <div class="d2-table-view-footer">
                <el-pagination
                        @current-change="handleCurrentChange"
                        @size-change="handleSizeChange"
                        :page-size="tableOptions.pageList[0]"
                        :page-sizes="tableOptions.pageList"
                        :current-page.sync="currentPage"
                        layout="total,sizes, prev, pager, next,jumper"
                        :total="pagination.total">
                </el-pagination>
            </div>
        </div>
    </d2-container>
</template>

<script>
  import {tableOptions} from '../../../assets/options'
  import {getAreaCodeList} from '../../../api/card/areaCode'
  import util from '../../../libs/util'
  export default {
    name: 'system-organization',
    data() {
      let checkPhone = (rule, value, callback) => {
        let reg = /^1[345789]\d{9}$/;
        if (!reg.test(value)) {
          return callback(new Error("请输入正确的手机号码"));
        } else {
          callback();
        }
      };
      return {
        options:[
          { value: 'jg001',label: '行政机构'},{value: 'jg002',label: '年级'},{value: 'jg003',label: '班级'}
        ],
        staLoading:false,
        operVisible: false,
        loading:false,
        isExpend:true,//是否收缩
        tableOptions,
        filter:{
          areaCode:"",
          pageSize:10,
          pageNum:1
        },
        currentPage:1,
        pagination:{ //分页参数
          total: 0
        },
        columns: [
          {
            title: '序号',
            key: 'index',
            minWidth: '50',
            formatter (row, column, cellValue, index) {
              return index+1
            }
          },
          {
            title: '地区代码',
            key: 'areaCode',
            minWidth: '150',
            showOverflowTooltip: true
          },
          {
            title: '地区名称',
            key: 'areaName',
            minWidth: '150',
            showOverflowTooltip: true
          },
          {
            title: '公司代码',
            key: 'company',
            minWidth: '150',
            showOverflowTooltip: true
          },
          {
            title: '创建日期',
            key: 'createDate',
            minWidth: '120',
            showOverflowTooltip: true
          }, {
            title: '备注',
            key: 'note',
            minWidth: '200',
            showOverflowTooltip: true
          }
        ],
        data:[],//列表数据
      }
    },
    methods: {
      //查询
      handleList(val) {
        if(val){
          this.filter.pageNum=1
          this.currentPage = 1
        }
        this.loading = true
        getAreaCodeList(this.filter).then(res=>{
          // console.log(res)
          this.loading = false
          this.data = res.page.list
          this.pagination.total = res.page.total
        }).catch(err=>{
          this.loading = false
        })
      },
      handleCurrentChange (val) {
        this.filter.pageNum = val
        this.handleList()
      },
      handleSizeChange (val) {
        this.filter.pageNum = 1
        this.filter.pageSize = val
        this.handleList()
      },
    },
    mounted () {
      this.handleList()
      this.filter.pageSize = this.tableOptions.pageList[0]
      this.tableOptions = this.$calcTableHeight(tableOptions,10)
    }
  }
</script>

<style>
</style>
