riku
2025-07-16 c23ac06446a9a1edc41cc13723e5d0b8eabdfd63
src/components/CardDialog.vue
@@ -1,9 +1,12 @@
<template>
  <el-dialog
    :model-value="modelValue"
    @update-modelvalue="handleChange"
    :show-close="false"
    align-center
    :destroy-on-close="true"
    :width="width"
    :draggable="draggable"
    :modal="modal"
    :close-on-click-modal="modal"
    :modal-class="modal ? 'p-events-auto' : ''"
  >
    <template #header="{ close, titleId, titleClass }">
      <BaseCard direction="top-left" borderless="t">
@@ -22,9 +25,12 @@
        </template>
      </BaseCard>
    </template>
    <BaseCard size="medium">
    <BaseCard v-bind="$attrs">
      <template #content>
        <slot></slot>
      </template>
      <template #footer>
        <slot name="footer"></slot>
      </template>
    </BaseCard>
  </el-dialog>
@@ -32,14 +38,30 @@
<script>
export default {
  props: {
    // 显隐控制
    // modelValue: Boolean,
    // 标题
    title: String,
    modelValue: Boolean
    // 宽度
    width: {
      type: [String, Number],
      default: '50%'
    },
    // 可拖拽
    draggable: Boolean,
    // 遮罩层
    modal: {
      type: Boolean,
      default: true
    },
  },
  emits: ['update:modelValue'],
  // emits: ['update:modelValue', 'changed'],
  methods: {
    handleChange(value) {
      this.$emit('update:modelValue', value);
    }
    // handleChange(value) {
    //   this.$emit('update:modelValue', value);
    //   this.$emit('changed', value);
    // }
  }
};
</script>
<style></style>