TelpoUserManageAdmin/src/views/message-manage/main/send-details/index.vue

<!--
 * @Date: 2022-08-08 10:09:50
 * @LastEditors: JinxChen
 * @LastEditTime: 2022-09-09 14:54:02
 * @FilePath: \TelpoUserManageAdmin\src\views\message-manage\main\send-details\index.vue
 * @description: 发送明细
-->

<template>
    <div class="home-container">
        <!-- 顶部内容 -->
        <!-- <div class="top-container">
            <el-input
                :placeholder="placeholder"
                v-model="searchParams.inputValue"
                class="search-input"
            />
            <el-button icon="el-icon-search" @click="onSearch" type="primary" class="search-btn">搜索</el-button>
        </div> -->
        <TTable :tableData="dataList" :columns="columns"></TTable>
        <!-- 分页 -->
        <pagination
            v-show="total > 0"
            ref="pages"
            :total="total"
            :page.sync="searchParams.page"
            :limit.sync="searchParams.limit"
        />
    </div>
</template>

<script>
import TTable from "@/components/TTable/TTable";
import Pagination from "@/components/Pagination";
export default {
    name: "send-details",
    components: { TTable, Pagination },
    data() {
        return {
            buttonList: [], // 头部按钮，例子：  {name: '添加', type: 'primary', icon: 'el-icon-circle-plus', click: () => { this.AddDialog();}}
            searchParams: {
                inputValue: "",
                page: 1,
                limit: 10
            },
            placeholder: "可输入消息主题",
            dataList: [
              { sendUser: '张三', sendStatus: '成功', sendTime: '2022.09.09 17:35' },
              { sendUser: '李四', sendStatus: '成功', sendTime: '2022.09.09 17:35' },
              { sendUser: '王五', sendStatus: '失败', sendTime: '2022.09.09 17:35' },
            ],
            columns: [
                { prop: "sendUser", title: "发送对象", fixed: "left" },
                { prop: "sendStatus", title: "发送状态" },
                { prop: "sendTime", title: "发送时间" },
            ],
            total: 1
        };
    },
    mounted() {},
    created() {},
    methods: {
        onSearch() {}
    }
};
</script>

<style scoped lang="scss">
.search-input {
    width: 350px;
    margin-left: 20px;
}
.search-btn {
    margin-left: 20px;
    width: 100px;
}
</style>