lg_frontend/components/smallCommon/CustomTable.vue

67 lines
2.1 KiB
Vue

<template>
<div class="custom-table visual_datepicker">
<Curd v-bind="$attrs" v-on="$listeners" ref="curd" dropdown-class-name="visual_dropdown_cls">
<template slot="search-button" slot-scope="{ search }">
<slot name="search-button" v-bind:search="search"></slot>
</template>
</Curd>
</div>
</template>
<script>
import Curd from "./Curd.vue";
export default {
name: "CustomTable",
components: {Curd},
methods : {
doSearch () {
this.$refs.curd.doSearch()
},
}
}
</script>
<style scoped lang="less">
.custom-table {
/deep/ .ant-form-item-label > label {
color: #fff !important;
}
/deep/ .ant-table-header {
background-color: transparent !important;
border-bottom: 0px ;
}
/deep/ .ant-table-fixed-header > .ant-table-content > .ant-table-scroll > .ant-table-body {
background-color: transparent !important;
}
/deep/ .ant-table-thead > tr > th {
background: linear-gradient(180deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%);
color: rgba(255, 255, 255, 1);
}
/deep/ .ant-table {
background: rgba(255, 255, 255, 0.01);
color: #FFFFFF;
}
/deep/ .ant-table-tbody > tr > td {
background-color: transparent;
border-bottom: 1px solid rgba(16, 40, 73, 0.3);
border-top: 1px solid rgba(16, 40, 73, 0.3);
}
/deep/ .ant-table-thead > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
/deep/ .ant-table-tbody > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
/deep/ .ant-table-thead > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
/deep/ .ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td {
background: rgba(255, 255, 255, 0.01);
color: #FFFFFF;
}
/deep/ .selected {
background: linear-gradient(90deg, rgba(16, 40, 73, 0) 0%, rgba(16, 40, 73, 1) 51.3%, rgba(16, 40, 73, 0) 100%);
border-bottom: 1px solid rgba(18, 45, 79, 0.8);
border-top: 1px solid rgba(18, 45, 79, 0.8);
}
}
</style>