fix bugs

components/confirm-modal/confirm-modal.vue

@@ -0,0 +1,119 @@
+<template>
+  <view class="modal-mask" v-if="show" @click="handleMaskClick">
+    <view class="modal-container" @click.stop>
+      <view class="modal-title">{{ title }}</view>
+      <view class="modal-content">{{ content }}</view>
+      <view class="modal-footer">
+        <view class="modal-btn cancel-btn" @click="handleCancel">{{ cancelText }}</view>
+        <view class="modal-btn confirm-btn" @click="handleConfirm">{{ confirmText }}</view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'ConfirmModal',
+  props: {
+    show: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: '提示'
+    },
+    content: {
+      type: String,
+      default: ''
+    },
+    cancelText: {
+      type: String,
+      default: '取消'
+    },
+    confirmText: {
+      type: String,
+      default: '确定'
+    },
+    maskClose: {
+      type: Boolean,
+      default: false
+    }
+  },
+  methods: {
+    handleMaskClick() {
+      if (this.maskClose) {
+        this.$emit('cancel');
+      }
+    },
+    handleCancel() {
+      this.$emit('cancel');
+    },
+    handleConfirm() {
+      this.$emit('confirm');
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.modal-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 9999;
+}
+
+.modal-container {
+  width: 600rpx;
+  background-color: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+}
+
+.modal-title {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #333333;
+  text-align: center;
+  padding: 50rpx 30rpx 30rpx;
+}
+
+.modal-content {
+  font-size: 28rpx;
+  color: #666666;
+  text-align: center;
+  padding: 0 30rpx 50rpx;
+  line-height: 1.6;
+}
+
+.modal-footer {
+  display: flex;
+  border-top: 1rpx solid #eeeeee;
+}
+
+.modal-btn {
+  flex: 1;
+  height: 100rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 32rpx;
+}
+
+.cancel-btn {
+  color: #666666;
+  border-right: 1rpx solid #eeeeee;
+}
+
+.confirm-btn {
+  color: #C93639;
+  font-weight: bold;
+}
+</style>