feat

- 增加 群发列表功能

README.md

@@ -1,7 +1,7 @@
 <!--
  * @Date: 2021-11-29 11:14:13
  * @LastEditors: JinxChen
- * @LastEditTime: 2022-09-08 16:17:40
+ * @LastEditTime: 2022-09-09 15:05:35
  * @FilePath: \TelpoUserManageAdmin\README.md
  * @description:
 -->
@@ -71,4 +71,10 @@ feat
 ## v1.0.1
 `2022.9.8`
 feat
-- 增加 流量统计功能
+- 增加 流量统计功能
+
+
+## v1.0.2
+`2022.9.9`
+feat
+- 增加 群发列表功能

src/router/index.js

@@ -235,6 +235,16 @@ export const constantRoutes = [{
           icon: 'el-icon-document'
         }
       },
+      {
+        path: '/send-details',
+        name: 'send-details',
+        component: () => import('@/views/message-manage/main/send-details/index'),
+        meta: {
+          title: '发送明细',
+          icon: 'el-icon-document'
+        },
+        hidden: true
+      },
 
       {
         path: '/unsubscribe-list',

src/styles/index.scss

@@ -64,6 +64,7 @@ div:focus {
 // main-container global css
 .home-container {
   height: 600px;
+  width: 100%;
   position: relative;
   margin: 60px 20px 0 20px;
   padding: 10px 10px;
@@ -71,7 +72,7 @@ div:focus {
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04);
   .top-container {
     display: inline-block;
-    padding: 0 20px 0 20px;
+    padding: 0 20px 0 0;
     span {
       font-size: 14px;
     }

src/utils/model.js

@@ -1,8 +1,8 @@
 /*
  * @Date: 2021-11-30 15:09:25
  * @LastEditors: JinxChen
- * @LastEditTime: 2022-09-08 16:18:13
+ * @LastEditTime: 2022-09-09 15:05:38
  * @FilePath: \TelpoUserManageAdmin\src\utils\model.js
  * @description: 版本号
  */
-export const VersionModel = '1.0.1';
+export const VersionModel = '1.0.2';

src/views/message-manage/main/mass-list/index.vue

@@ -1,38 +1,157 @@
 <!--
  * @Date: 2022-08-08 10:09:50
  * @LastEditors: JinxChen
- * @LastEditTime: 2022-08-08 16:08:15
+ * @LastEditTime: 2022-09-09 15:03:34
  * @FilePath: \TelpoUserManageAdmin\src\views\message-manage\main\mass-list\index.vue
  * @description: 群发列表
 -->
 
 <template>
-    <div class="app-container">
-      <!-- 顶部内容 -->
-      <div class="top-container">
-        <TopMenu :buttonList="buttonList"/>
-      </div>
+    <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" @details="onDetails" @delete="onDelete" @update="onUpdate"></TTable>
+        <!-- 分页 -->
+        <pagination
+            v-show="total > 0"
+            ref="pages"
+            :total="total"
+            :page.sync="searchParams.page"
+            :limit.sync="searchParams.limit"
+        />
+        <el-dialog
+          title="发送明细"
+          :visible.sync="isDetailsShow"
+          center
+          top="5vh"
+        >
+        <TTable :tableData="detailsDataList" :columns="detailsColumns"></TTable>
+        <!-- 分页 -->
+        <pagination
+            v-show="detailsTotal > 0"
+            ref="pages"
+            :total="detailsTotal"
+            :page.sync="detailsParams.page"
+            :limit.sync="detailsParams.limit"
+        />
+        </el-dialog>
     </div>
 </template>
 
 <script>
-import TopMenu from "@/components/TopMenu/index";
+import TTable from "@/components/TTable/TTable";
+import Pagination from "@/components/Pagination";
 export default {
-  name: 'mass-list',
-  components: { TopMenu },
-  data(){
-   return {
-     buttonList: [], // 头部按钮，例子：  {name: '添加', type: 'primary', icon: 'el-icon-circle-plus', click: () => { this.AddDialog();}}
-   }
-  },
-  mounted() {},
-  created() {},
-  methods: {
+    name: "mass-list",
+    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: [
+              { messageThem: '财商学习更新通知', messageContent: '家长您好...', massGroup: '活跃粉丝组', createTime: '2022.09.09 17:35' },
+              { messageThem: '财商学习更新通知', messageContent: '家长您好...', massGroup: '活跃粉丝组', createTime: '2022.09.09 17:35' },
+              { messageThem: '财商学习更新通知', messageContent: '家长您好...', massGroup: '活跃粉丝组', createTime: '2022.09.09 17:35' },
+            ],
+            detailsDataList: [
+              { sendUser: '张三', sendStatus: '成功', sendTime: '2022.09.09 17:35' },
+              { sendUser: '李四', sendStatus: '成功', sendTime: '2022.09.09 17:35' },
+              { sendUser: '王五', sendStatus: '失败', sendTime: '2022.09.09 17:35' },
+            ],
+            detailsColumns: [
+                { prop: "sendUser", title: "发送对象", fixed: "left" },
+                { prop: "sendStatus", title: "发送状态" },
+                { prop: "sendTime", title: "发送时间" },
+            ],
+            columns: [
+                { prop: "messageThem", title: "消息主题", fixed: "left" },
+                { prop: "messageContent", title: "内容摘要(链接详情)" },
+                { prop: "massGroup", title: "发送分组" },
+                { prop: "createTime", title: "创建时间" },
+                {
+                    action: true,
+                    title: "操作",
+                    fixed: "right",
+                    actions: [
+                        {
+                            fnName: "update",
+                            title: "修改",
+                            type: "primary",
+                            icon: "el-icon-edit",
+                            size: "small"
+                        },
+                        {
+                            fnName: "delete",
+                            title: "删除",
+                            type: "danger",
+                            icon: "el-icon-delete",
+                            size: "small"
+                        },
+                        {
+                            fnName: "details",
+                            title: "发送明细",
+                            type: "success",
+                            icon: "el-icon-tickets",
+                            size: "small"
+                        }
+                        /* { fnName: "delete", title: "删除", type: "danger" , icon: 'el-icon-delete', size: 'small'}, */
+                    ]
+                }
+            ],
+            total: 1,
+            isDetailsShow: false,
+            detailsTotal: 1,
+            detailsParams: {
+              page: 1,
+              limit: 10
+            }
 
-  }
-}
+        };
+    },
+    mounted() {},
+    created() {},
+    methods: {
+        onSearch() {},
+        onUpdate() {
+
+        },
+        onDelete() {
+          this.$confirm("是否删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+          }).then(() => {
+              // todo 删除
+          }).catch(() => {})
+        },
+        onDetails() {
+          //this.$router.push({name: 'send-details'});
+          this.isDetailsShow = true;
+        }
+    }
+};
 </script>
 
 <style scoped lang="scss">
-
+.search-input {
+    width: 350px;
+    margin-left: 20px;
+}
+.search-btn {
+    margin-left: 20px;
+    width: 100px;
+}
 </style>

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

@@ -0,0 +1,77 @@
+<!--
+ * @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>