diff --git a/components/AnswerList/messageBoard.vue b/components/AnswerList/messageBoard.vue
index 3869214..e286c37 100644
--- a/components/AnswerList/messageBoard.vue
+++ b/components/AnswerList/messageBoard.vue
@@ -2,16 +2,19 @@
-
+
handleSwipeChange(e, index)"
+ @change="handleSwipeChange($event, index)"
>
-
-
+
+
-
+
+
+
+
+ 提示
+ {{ content }}
+
+
+
@@ -134,8 +159,16 @@ export default {
data() {
return {
AvatarDefault, // 默认头像
+ currentItem: {}, // 当前操作的item
+ currentIndex: 0, // 当前操作的item索引
openedItems: {}, // 记录每个项目的滑动状态
isWebMode: false, // 是否是web模式
+
+ // 模态弹窗
+ modalShow: false,
+ content: "确定要撤回该留言吗?",
+ modalOpenTime: 0,
+ preventCloseOnce: false, // 添加防误触标记
};
},
mounted() {
@@ -147,9 +180,20 @@ export default {
console.log("isWebMode", this.isWebMode);
},
methods: {
+ // 监听滑动状态变化
+ handleSwipeChange(e, index) {
+ // 使用Vue的响应式更新方法来更新对象
+ this.$set(this.openedItems, index, e);
+ // console.log("滑动状态", this.openedItems);
+ },
// 处理左滑按钮点击
- handleSwipeClick(item, index, e) {
- console.log("按钮点击", item, index, e);
+ handleSwipeClick(item, index) {
+ // console.log("swipeClick", item, index);
+ // console.log("swipeActionRef", this.$refs.swipeActionRef);
+ this.currentItem = item;
+ this.currentIndex = index;
+ this.modalShow = true;
+ this.modalOpenTime = Date.now(); // 记录模态框打开时间
},
// 处理web模式点击
@@ -157,11 +201,38 @@ export default {
console.log("web模式点击", item);
},
- // 监听滑动状态变化
- handleSwipeChange(isOpened, index) {
- // 使用Vue的响应式更新方法来更新对象
- this.$set(this.openedItems, index, isOpened);
- console.log("滑动状态", this.openedItems);
+ // 处理回复按钮点击
+ handleReplyClick(item) {
+ if (item.isReply) {
+ return;
+ }
+
+ this.$emit("reply", item);
+ },
+
+ // 处理取消按钮点击
+ handleCancel() {
+ this.modalShow = false;
+ },
+
+ // 处理确认按钮点击
+ handleConfirm() {
+ // 检查是否是快速点击(防止误触)
+ if (this.modalOpenTime && Date.now() - this.modalOpenTime < 300) {
+ console.log("防止误触,请重新点击");
+ return;
+ }
+
+ // 发送删除事件,并传递回调函数
+ this.$emit("delete", this.currentItem, (success) => {
+ // 只有当操作成功时才关闭模态框
+ console.log("callback success", success);
+
+ if (success) {
+ this.$refs.swipeActionRef[this.currentIndex].closeAll();
+ this.modalShow = false;
+ }
+ });
},
},
};
@@ -180,6 +251,7 @@ export default {
align-items: center;
justify-content: center;
border-radius: 0 16rpx 16rpx 0;
+ border: 1px solid #fff; /* 防止初始状态下出现红线 */
margin-bottom: 32rpx;
.right-btn {
width: 32rpx;
@@ -302,6 +374,10 @@ export default {
width: 100%;
margin-top: 28rpx;
+ .uni-btn-reset::after {
+ border: none !important;
+ }
+
.reply-btn {
display: flex;
align-items: center;
@@ -320,6 +396,10 @@ export default {
margin-right: 12rpx;
}
}
+
+ .disabled-reply {
+ background: #cccccc;
+ }
}
}
@@ -343,4 +423,51 @@ export default {
height: 32rpx;
margin-right: 8rpx;
}
+
+.custom-modal {
+ background-color: #fff;
+ overflow: hidden;
+
+ .modal-title {
+ font-size: 32rpx;
+ font-weight: 500;
+ text-align: center;
+ padding: 30rpx 0;
+ color: #333;
+ }
+
+ .modal-content {
+ padding: 30rpx;
+ font-size: 28rpx;
+ color: #666;
+ text-align: center;
+ min-height: 80rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .modal-footer {
+ display: flex;
+ border-top: 1px solid #eee;
+
+ .modal-btn {
+ flex: 1;
+ height: 90rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 30rpx;
+
+ &.cancel {
+ color: #666;
+ border-right: 1px solid #eee;
+ }
+
+ &.confirm {
+ color: #4f6aff;
+ }
+ }
+ }
+}
diff --git a/pages/home/messageBoard/index.vue b/pages/home/messageBoard/index.vue
index d71377a..8820a9b 100644
--- a/pages/home/messageBoard/index.vue
+++ b/pages/home/messageBoard/index.vue
@@ -21,8 +21,14 @@
-
+
+
+
+
@@ -91,6 +97,17 @@ export default {
// 根据索引设置activeTab值
this.activeTab = index === 0 ? "unread" : "replied";
},
+ handleDelete(item, callback) {
+ console.log("handleDelete", item);
+
+ setTimeout(() => {
+ this.$refs.uToast.show({
+ title: "撤回成功",
+ type: "success",
+ });
+ callback(true);
+ }, 1500);
+ },
},
};