gaosp
2024-01-06 dc5199737e9dbb5f8a0996a6ae5674bfb69e62ad
src/container/list/index.vue
@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-06 17:40:19
 * @LastEditors: Sneed
 * @LastEditTime: 2024-01-06 19:54:37
 * @LastEditTime: 2024-01-06 22:05:59
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/list/index.vue
-->
<template>
@@ -11,6 +11,7 @@
        </div>
        <div class="table">
            <el-table
            stripe
            :data="tableData"
            style="width: 100%">
                <slot name="columns"></slot>
@@ -46,7 +47,9 @@
    export default {
        data () {
            return {
                tableData: [{name:123},{name:123}]
                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},
            ]
            }
        },
@@ -58,10 +61,7 @@
        height: 100%;
        overflow: auto;
        .table {
            .el-table td, .el-table th.is-leaf {
                // border-bottom: 1px solid red;
                // padding: 20px ;
            }
            .el-table::before {
                background-color: transparent;
            }
@@ -69,7 +69,6 @@
                color: #E6E5E5;
                background-color: #182D54;
                border-bottom: none;
            }
            .el-table {
                color: #E6E5E5;
@@ -78,35 +77,39 @@
                border-bottom: none;
                padding: 0;
            }
            .el-table td{
            .el-table td, .el-table--striped .el-table__body tr.el-table__row--striped td,.el-table--enable-row-hover .el-table__body tr:hover>td{
                color: #E6E5E5;
                border-bottom: none;
                background: transparent;
                background-color: transparent!important;;
                background-color: transparent;
                // padding: 0;
            }
            .el-table tr{
                color: #E6E5E5;
                border-bottom: none;
                background: transparent;
                background-color: transparent!important;;
                border-bottom: none;
                padding: 0;
            }
            .el-table__header {
                color: #E6E5E5;
                background: transparent;
                background-color: transparent;
                border-bottom: none;
                padding: 0;
            }
            .el-table__body-wrapper {
                color: #E6E5E5;
                background: transparent;
                background-color: transparent;
                border-bottom: none;
                padding: 0;
            .el-table tr.el-table__row--striped {
                background-color: #182D54!important;
            }
            // .el-table__header {
            //     color: #E6E5E5;
            //     background: transparent;
            //     background-color: transparent;
            //     border-bottom: none;
            //     padding: 0;
            // }
            // .el-table__body-wrapper {
            //     color: #E6E5E5;
            //     background: transparent;
            //     background-color: transparent;
            //     border-bottom: none;
            //     padding: 0;
            // }
            .el-table__header-wrapper {
                border: none;
                border-bottom: none;
@@ -132,11 +135,11 @@
        
    }
    .search {
        margin: 20px 30px 0;
        padding: 20px 30px;
        margin: 20px 30px;
        padding: 30px 0px;
        display: flex;
        flex-wrap: wrap;
        background: url('./search.png') 100% 100% no-repeat;
        background: url('./search.png') center center  no-repeat;
        background-size: contain;
    }
    .table {
@@ -151,4 +154,23 @@
            right: 40px;
        }
    }
    .table::-webkit-scrollbar {
    width: 4px; /* Chrome/Safari */
    }
    /* 定义滑块(thumb)的样式 */
    .table::-webkit-scrollbar-thumb {
    background-color: #999; /* Chrome/Safari */
    }
    /* 当滑块被按下时的样式 */
    .table::-webkit-scrollbar-thumb:hover {
    background-color: #666; /* Chrome/Safari */
    }
    /* 定义两侧边界的样式 */
    .table::-webkit-scrollbar-track {
    background-color: #f5f5f5; /* Chrome/Safari */
    }
</style>