户籍人口柱状图弹窗分页显示

guoshilong

2023-01-16 d16cbe73b69b39c3d6fa53ff80d9b349b4c82105

户籍人口柱状图弹窗分页显示

 src/styles/base/index.scss

@@ -255,7 +255,7 @@
        .el-dialog__body {
            flex: 1;
            display: flex;
            flex-direction: row;
            flex-direction: column;
            flex-wrap: wrap;
            justify-self: flex-start;
            align-content: flex-start;

 src/views/home/index.vue

@@ -96,10 +96,13 @@
          </el-table>

          <div class="pages" ref="tablePagination">

            <el-pagination background layout="prev, pager, next" :page-size="peoplePage.pageSize"
                           :page-count="peoplePage.count" :current-page="peoplePage.currentPage"
                           @current-change="handlePeopleCurrentChange"></el-pagination>
            <el-pagination
                background layout="prev, pager, next"
                :page-size="peoplePage.pageSize"
                :page-count="peoplePage.count"
                :current-page="peoplePage.currentPage"
                @current-change="handlePeopleCurrentChange"
            ></el-pagination>
          </div>

        </el-dialog>
@@ -449,7 +452,9 @@
            peopleVisible: false,
            peopleInfoList:[],
            peoplePage:{
              //页数
              count:0,
              total:0,
              pageSize:5,
              currentPage:1
            },
@@ -1174,15 +1179,15 @@
            this.peopleTitle = name
            this.peopleId = id
            this.getPeopleInfoList()
            this.peopleVisible = true
        },

        getPeopleInfoList(){
          getAreaPage(this.peoplePage.currentPage,this.peoplePage.pageSize,this.peopleId).then(res=>{
            if (res.data.code == 200){
              this.peopleInfoList = res.data.data.records

              this.peoplePage.count = res.data.total
              let data = res.data.data
              this.peopleInfoList = data.records
              this.peoplePage.count = data.pages
              this.peopleVisible = true
            }
          })
        },