<template><div class="self_table"><el-table:data="tableData"style="width: 100%"v-loading="loading"stripe@selection-change="handleSelectionChange":header-cell-style="{background: '#f0f7ff !important',color: '#000',fontSize: '12px',textAlign: 'center',}":cell-style="{textAlign: 'center',}"><template slot="empty"><div class="no_data_area"><div class="no_data"></div><div class="no_staff"><span>暂无相关数据</span></div></div></template><el-table-columntype="selection"width="55"v-if="type"></el-table-column><template v-for="(item, index) in columns"><el-table-column:key="'%' + index":show-overflow-tooltip="true":prop="item.prop":label="item.label":width="item.width":min-width="item.minWidth":sortable="item.sortable":fixed="item.fixed"align="center"><template slot-scope="scope"><template v-if="item.prop == 'cover'"><div style="width: 50px; height: 50px; margin: 0 auto"><img:src="scope.row[item.prop]"alt=""style="max-width: 100%"/></div></template><template v-if="item.prop == 'start_time'">{{ dateformat(scope.row["start_time"], "YYYY-MM-DD HH:mm:ss") }}</template><template v-else-if="item.prop == 'over_time'">{{ dateformat(scope.row["over_time"], "YYYY-MM-DD HH:mm:ss") }}</template><template v-else-if="item.prop == 'create_time'">{{ dateformat(scope.row["create_time"], "YYYY-MM-DD HH:mm:ss") }}</template><template v-else-if="item.prop == 'update_time'">{{ dateformat(scope.row["update_time"], "YYYY-MM-DD HH:mm:ss") }}</template><template v-else-if="item.prop == 'birthday'"><!-- {{ dateformat(scope.row["birthday"], "YYYY-MM-DD") }} -->{{ scope.row["birthday"] }}</template><template v-else-if="item.prop == 'gender'">{{scope.row["gender"] == 1? "男": scope.row["gender"] == 2? "女": "未知"}}</template><template v-else-if="item.prop == 'user_type'"><span>{{scope.row["user_type"] == "master"? "总部": scope.row["user_type"] == "sbu"? "总部": scope.row["user_type"] == "dealer"? "一级经销商": "门店"}}</span></template><template v-else-if="item.prop == 'status'">{{ scope.row["status"] }}</template><template v-else-if="item.prop == 'is_publish'"><span style="width: 50px; height: 50px; margin: 0 auto"><el-switch:value="scope.row['is_publish'] == '0' ? false : true"@change="tabrelease(scope.row)"></el-switch></span></template><template v-else>{{ scope.row[item.prop] != null ? scope.row[item.prop] : "" }}</template></template></el-table-column></template><el-table-column label="操作" :width="btnlong"v-if="showbtn"><template slot-scope="scope"><slot name="header" v-bind:date="scope.row"></slot></template></el-table-column></el-table><div class="com_page" v-if="pageObj && pageObj.total"><el-paginationlayout="total, prev, pager, next, jumper":page-size="pageObj.size":total="pageObj.total":current-page="pageObj.currentPage"@current-change="handleCurrentChange"background></el-pagination></div></div></template><script>import { fissiontype, codelist } from "@/api/until";export default {data() {return {// 状态fissiontype: fissiontype,// 组织性质codelist: codelist,value: "",};},props: {// 表头columns: {type: Array,default: () => [],},// 表格数据tableData: {type: Array,default: () => [],},// 加载展示loading: {type: Boolean,default: false,},// 高度height: {type: String,default: () => "70vh",},// 分页pageObj: {type: Object,default: function () {return {size: 10,total: 0,currentPage: 1,};},},// 是否多选type: {type: Boolean,default: () => false,},// 按钮长度btnlong: {type: String,default: "",},// 按钮是否显示showbtn: {type: Boolean,default: () => true,},},created() {},methods: {handleCurrentChange(val) {this.$emit("handleCurrentChange", val);},handleSelectionChange(val) {this.$emit("handleSelectionChange", val);},tabrelease(val) {this.$emit("switch", val);},},};</script><style lang='less' scoped>.self_table {padding: 20px 0;// /deep/.el-table {// // height: calc(100% - 45px) !important;// .el-table__header-wrapper {// background: #f0f7ff;// thead th {// background: #f0f7ff;// color: #333333;// font-weight: bold;// }// }// }}.com_page {margin-top: 10px;display: flex;justify-content: flex-end;}.btn_list {display: flex;// justify-content: flex-start;justify-content: center;flex-wrap: wrap;}.grey_color {color: #333;}/deep/::-webkit-scrollbar {display: block !important;height: 10px;width: 6px;background-color: #ddd;}</style>参数
<table-list:columns="tableColumns":tableData="group_list":pageObj="pageObj":loading="loading":type="true"@handleCurrentChange="handleCurrentChange"@handleSelectionChange="handleSelectionChange"@switch="release":btnlong="'200'"><template #header="slotProps"><el-button@click="edit(slotProps.date)"type="text"size="small"v-if="slotProps.date.is_publish == '0'">编辑</el-button><el-button@click="deleteInfo(slotProps.date)"type="text"size="small"v-if="slotProps.date.is_withdraw == '0'">删除</el-button></template></table-list>loading: false,group_list: [], //群体管理列表tableColumns: [{prop: "content",label: "常用语",},{prop: "update_time",label: "更新时间",},{prop: "use_times",label: "使用次数",},{prop: "is_publish",label: "是否发布",},],pageObj: {size: 10,currentPage: 1, //前往当前页total: 0,},展示效果
