1
gaosp
2024-01-12 70a87a18cca12dd0e43360f91a5be9754dc4cb37
src/container/list/index.vue
@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-06 17:40:19
 * @LastEditors: Sneed
 * @LastEditTime: 2024-01-06 22:05:59
 * @LastEditTime: 2024-01-10 21:46:29
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/list/index.vue
-->
<template>
@@ -10,10 +10,12 @@
            <slot name="search"></slot>
        </div>
        <div class="table">
            <slot name="table-tool"></slot>
            <el-table
            stripe
            :data="tableData"
            style="width: 100%">
            v-loading="loading"
            style="width: 100%;margin-top: 20px;">
                <slot name="columns"></slot>
                <!-- <el-table-column
                    prop="date"
@@ -30,13 +32,13 @@
                    label="地址">
                </el-table-column> -->
            </el-table>
            <div class="pagination">
            <div v-if="total" class="pagination">
                <el-pagination
                style="background: transparent;"
                :page-size="20"
                :pager-count="11"
                :page-size="pageSize"
                :pager-count="current"
                layout="prev, pager, next"
                :total="1000">
                :total="total">
                </el-pagination>
            </div>
            
@@ -45,14 +47,39 @@
</template>
<script>
    export default {
        data () {
            return {
                tableData: [{name:123},{name:123},
                {name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},{name:123},
            ]
        props: {
            url: {
                type: String
            }
        },
        data () {
            return {
                tableData: [],
                pageSize: 10,
                current: 1,
                total: 0,
                loading: false
            }
        },
        created () {
            this.pageQuery()
        },
        methods: {
            pageQuery(params) {
                this.loading = true
                this.$http.postJson(this.url,{
                    pageSize: this.pageSize,
                    current: this.current,
                    ...params
                }).then(res => {
                    console.log(res)
                    this.tableData = res.data.records || []
                    this.total = res.data.total
                }).finally(() => {
                    this.loading = false
                })
            }
        },
    }
</script>
<style lang="scss">
@@ -137,10 +164,11 @@
    .search {
        margin: 20px 30px;
        padding: 30px 0px;
        min-height: 160px;
        display: flex;
        flex-wrap: wrap;
        background: url('./search.png') center center  no-repeat;
        background-size: contain;
        background-size: cover;
    }
    .table {
        margin-top: 20px;