前端table表格展示

参考视频

自定义表格 项

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<template>
    <el-table v-loading="isLoading" border :data="list">
                    <el-table-column label="" width="55" align="center">
                        <template slot-scope="scope">
                            {{ scope.$index + 1 + ((page_no || 1) - 1) * pageSize }}
                        </template>
                    </el-table-column>
                    <el-table-column label="项目名称" prop="project_name" />
                    <el-table-column label="项目ID" prop="id" />
    </el-table>


</template> 

<script>
import { mapActions } from 'vuex';
import _ from 'lodash';
export default {
    name: 'project-manager',
    data() {
        return {
            list: [],
            isLoading: false,
        };
    },
     methods: {
        ...mapActions([
            'moduleGetProjectList',
            'moduleUpdateProject',
            'moduleListUser'
        ]),
        initData() {
            this.page_no = 1;
            this.getProjectList();
        },
        getProjectList() {
            let parms = {
                page_size: this.pageSize,
                sort_name: 'id',
                page_no: this.page_no,
                project_name: this.listQuery.name
            };
            this.isLoading = true;
            //这个是
            this.moduleGetProjectList(parms).then(resdata => {
                if (resdata === 'error') return;
                this.isLoading = false;
                this.list = resdata.data.list;
                this.total = resdata.data.total;
            });
        },
        getList({ page }) {
            this.page_no = page;
            this.getProjectList();
        },
     }

}
</script>