epmet-work-pc-chengyang/src/views/modules/partymember/lookMember.vue

<template>
  <div>
    <div class="dialog-h-content scroll-h">
      <div>
        <div class="div_table">
          <el-table ref="ref_table"
                    :data="tableData"
                    border
                    v-loading="tableLoading"
                    :header-cell-style="{background:'#2195FE',color:'#FFFFFF'}"
                    style="width: 100%"
                    highlight-current-row>
            <el-table-column
              prop="name"
              label="姓名"
              align="center"
              width="100"
            />
            <el-table-column
              prop="idCard"
              label="身份证号"
              align="center"
              min-width="180"
            />
            <el-table-column
              prop="mobile"
              label="手机号"
              align="center"
              min-width="160"
            />
            <el-table-column
              prop="rdsj"
              label="入党时间"
              align="center"
              min-width="160"
            />
            <el-table-column
              prop="sszb"
              label="所属党组织"
              align="center"
              min-width="160"
            />
            <el-table-column
              prop="ldzh"
              label="流动党员证号"
              align="center"
              min-width="160"
            />
            <el-table-column
              prop="partyZw"
              label="职务"
              align="center"
              width="100"
            />
            <el-table-column
              prop="address"
              label="地址"
              align="center"
              show-overflow-tooltip
              min-width="180"
            />
            <el-table-column
              prop="isPay"
              label="是否缴费"
              align="center"
              width="100"
            />
            <el-table-column
              prop="payDate"
              label="最近一次缴费时间"
              align="center"
              min-width="160"
            />
            <el-table-column
              prop="culture"
              label="文化程度"
              align="center"
              width="100"
            />
            <el-table-column
              prop="point"
              label="量化积分"
              align="center"
              width="100"
            />
            <el-table-column
              prop="activityPoint"
              label="活跃积分"
              align="center"
              width="100"
            />
            <el-table-column
              prop="volunteerCategory"
              label="志愿者类别"
              align="center"
              width="100"
            />
            <el-table-column
              prop="remark"
              label="备注"
              align="center"
              min-width="180"
            />
          </el-table>
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page.sync="pageNo"
            :page-sizes="[20, 50, 100, 200]"
            :page-size="parseInt(pageSize)"
            layout="sizes, prev, pager, next, total"
            :total="total"
          >
          </el-pagination>
        </div>
      </div>
    </div>
    <div class="div_btn">
      <el-button size="small"
                 @click="handleCancle">取 消</el-button>
    </div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { requestPost } from "@/js/dai/request";
export default {
  data () {
    return {
      btnDisable: false,
      // 列表相关
      tableData: [],
      tableLoading: false,
      agencyId: '',
      partyOrgId: '',
      pageNo: 1,
      pageSize: 20,
      total: 1,
    }
  },
  props: {
  },
  computed: {
    ...mapGetters(['clientHeight', 'iframeHeight'])
  },
  components: {},
  methods: {
    initForm (agencyId, id) {
      this.agencyId = agencyId
      this.partyOrgId = id
      this.tableLoading = true
      this.loadTable()
    },
    // 取消
    handleCancle () {
      this.$emit('lookMemberCancle')
    },
    // 查询列表
    async loadTable () {
      let params = {
        agencyId: this.agencyId,
        partyOrgId: this.partyOrgId,
        pageNo: this.pageNo,
        pageSize: this.pageSize
      }
      const url = `/resi/partymember/icPartyMember/page`
      const { data, code, internalMsg, msg } = await requestPost(url, params)
      this.tableLoading = false
      if (code !== 0) {
        return this.$message.error(internalMsg ? internalMsg : msg ? msg : '查询失败')
      }
      if (code === 0) {
        this.tableData =  data.list ? data.list : []
        this.total = data.total || 0;
      }
    },
    handleSizeChange (val) {
        console.log(`每页 ${val} 条`)
        this.pageSize = val
        this.loadTable()
    },
    handleCurrentChange (val) {
      console.log(`当前页: ${val}`);
        this.pageNo = val;
        this.loadTable();
    },
  },
}
</script>
<style lang="scss" scoped >
@import "@/assets/scss/modules/visual/communityManage.scss";
</style>
<style  lang="scss" scoped>
.div_btn{
      display: flex;
      align-items: center;
      justify-content: center;
}
</style>