个人消息

pages/myself/notify/index.js

@@ -3,9 +3,31 @@ Page({
         messageList : [
             {"taskId":"2022","isRead":true,"title":"今天是任务的需要的","content":"任务【测试...】已延期","date":"2022-12-14"},
             {"taskId":"2022","isRead":false,"title":"任务延期","content":"点哦电脑玩i回家欧帝啊我你的破请问你的我i拿到钱哦i我你懂屁请问你oi","date":"2022-12-14"},
-            {"taskId":"2022","isRead":true,"title":"任务【测试3213...】已延期","content":"点哦电脑玩i回家欧帝啊我你的破请问你的我i拿到钱哦i我你懂屁请问你oi","date":"2022-12-14"},
+            {"taskId":"2022","isRead":true,"title":"任务【测试3213...】已延期","content":"","date":"2022-12-14"},
             {"taskId":"2022","isRead":false,"title":"任务【测试412312...】已延期","content":"任务【测试...】已延期","date":"2022-12-14"}
         ],
+        dialogKey: '',
+        clearConfirm : false,
+        checkConfirm : false
+    },
+    showDialog(e) {
+        const { key } = e.currentTarget.dataset;
+        this.setData({ [key]: true, dialogKey: key });
     },
 
+    closeDialog() {
+        const { dialogKey } = this.data;
+        this.setData({ [dialogKey]: false });
+    },
+
+    clearMessage() {
+        console.log("清除消息成功！")
+        this.closeDialog();
+    },
+
+    allRead() {
+        console.log("全部已读成功！")
+        this.closeDialog();
+    }
+
 });

pages/myself/notify/index.json

@@ -1,5 +1,6 @@
 {
   "usingComponents": {
-    "t-badge": "/components/badge/badge"
+    "t-badge": "/components/badge/badge",
+    "t-dialog": "/components/dialog/dialog"
   }
 }

pages/myself/notify/index.wxml

@@ -1,9 +1,8 @@
 <view class="msgTitle">
-    <view class="clear"></view>
-    <view class="clear"><t-icon name="app"></t-icon></view>
-    <view class="read"><t-icon name="app"/></view>
+    <view class="clear"><t-icon name="clear" data-key="clearConfirm" bind:tap="showDialog" /></view>
+    <view class="read"><t-icon name="check" data-key="checkConfirm" bind:tap="showDialog"/></view>
 </view>
-<view wx:for="{{messageList}}">
+<view class="msgContent" wx:for="{{messageList}}">
     <t-cell title="{{item.title}}" description="{{item.content}}" wx:key="index">
         <view slot="description">
             {{item.date}}
@@ -13,3 +12,21 @@
         </view>
     </t-cell>
 </view>
+<t-dialog
+        visible="{{clearConfirm}}"
+        title="确认清除所有消息？"
+        t-class-confirm="custom-confirm-btn"
+        confirm-btn="清除"
+        cancel-btn="取消"
+        bind:confirm="clearMessage"
+        bind:cancel="closeDialog"
+/>
+<t-dialog
+        visible="{{checkConfirm}}"
+        title="全部标记已读"
+        t-class-confirm="custom-confirm-btn"
+        confirm-btn="确定"
+        cancel-btn="取消"
+        bind:confirm="allRead"
+        bind:cancel="closeDialog"
+/>

pages/myself/notify/index.wxss

@@ -3,6 +3,13 @@
     justify-content: space-between;
     padding: 20rpx 50rpx;
 }
+.msgContent {
+    padding: 0;
+    margin: 0;
+}
 .sendDate {
     padding-left: 20rpx;
 }
+.custom-confirm-btn {
+    color: #ff4646 !important;
+}