<template>
  <div>
    <el-dialog
      title="选择企业"
      :visible.sync="dialogVisible"
      width="60%"
    >
      <el-form ref="form" :model="form" label-width="140px">
        <el-row :gutter="10">
          <el-col :span="8">
            <el-form-item label="市场主体名称">
              <el-input v-model="form.marketEntityName" placeholder="请输入市场主体名称" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="统一社会信用代码">
              <el-input v-model="form.marketEntityName" placeholder="请输入统一社会信用代码" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="">
              <el-button type="primary">查询</el-button>
              <el-button type="default">重置</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-row>
        <el-table
          v-loading="loading"
          :data="tableData"
          tooltip-effect="dark"
          :fit="true"
          :row-class-name="tableRowClassName"
          :header-cell-style="{background:'#8cc3fb',color:'#fff'}"
          @selection-change="handleSelectionChange"
        >
          <el-table-column
            type="selection"
            width="55"
          />
          <el-table-column prop="index" label="序号" min-width="50" align="center" />
          <el-table-column prop="entName" label="市场主体名称" min-width="120" align="left" />
          <el-table-column prop="uscc" :show-overflow-tooltip="true" label="统一社会信用代码" min-width="100" align="left" />
          <el-table-column prop="lerepName" :show-overflow-tooltip="true" label="法定代表人" min-width="180" align="left" />
          <el-table-column prop="address" :show-overflow-tooltip="true" label="住所（经营场所）" align="left" />
        </el-table>
      </el-row>
      <el-row style="margin-top: 16px;text-align:right">
        <el-pagination
          :disabled="loading"
          :page-size="pageParam.size"
          :total="pageParam.total"
          :page-sizes="[10, 20, 30]"
          layout="slot,total, sizes, prev, pager, next, jumper"
          :current-page="pageParam.current"
          @size-change="pageSizeChange"
          @current-change="pageIndexChange"
        >
          <span>
            第 {{ pageParam.current }} 页/共 {{ (pageParam.total !== 0 ? parseInt((pageParam.total + pageParam.size - 1) / pageParam.size) : 1) }} 页
          </span>
        </el-pagination>
      </el-row>
      <div style="text-align:right; margin-top: 16px">
        <el-button type="primary" :disabled="multipleSelection.length === 0" @click="confirmSelect">确定</el-button>
        <el-button @click="dialogVisible = false">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { expelledResultList } from '@/api/除名公告'

export default {
  data() {
    return {
      form: {},
      pageParam: {
        current: 1,
        size: 10,
        total: 0
      },
      tableData: [],
      loading: false,
      dialogVisible: false,
      multipleSelection: [],
      noticeNo: ''
    }
  },
  created() {

  },
  mounted() {
    // this.loadPage()
  },
  methods: {
    tableRowClassName({ row, rowIndex }) {
      if (rowIndex % 2 === 1) {
        return 'warning-row'
      }
    },
    openDiaolog(noticeNo) {
      this.dialogVisible = true
      this.loadPage(noticeNo)
    },
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    // 当前分页改变
    pageIndexChange(curPage) {
      this.pageParam.current = curPage
      this.loadPage()
    },
    // 分页大小改变
    pageSizeChange(pageSize) {
      this.pageParam.size = pageSize
      this.loadPage()
    },
    // 加载分页
    loadPage(id) {
      this.loading = true
      this.id = id
      expelledResultList({
        current: this.pageParam.current,
        size: this.pageParam.size,
        entity: {
          ...this.form,
          bizId: id
        }
      }).then(res => {
        const list = []
        let i = 1
        const pageStart = (this.pageParam.current - 1) * this.pageParam.size
        res.data.records.forEach(each => {
          each.index = pageStart + i++
          list.push(each)
        })
        this.tableData = list
        this.pageParam.total = res.data.total
      }).finally(() => {
        this.loading = false
      })
    },
    confirmSelect() {
      this.$emit('comfirmSelectEnt', {
        list: this.multipleSelection,
        id: this.id
      })
      this.dialogVisible = false
    }
  }
}
</script>

<style scoped lang="expelled/notice/list">

</style>
