<template>
  <a-modal
    v-model:visible="show"
    width="1000px"
    style="top: 50%; transform: translateY(-50%)"
    title="添加联系人"
    @ok="handleOk"
    @cancel="handleCancel">
    <div style="width: 100%; height: 100%">
      <p>Some contents...</p>
      <p>Some contents...</p>
      <p>Some contents...</p>
    </div>
  </a-modal>
</template>

<script lang="ts">
  import { ref } from 'vue';
  import { defineComponent } from 'vue';

  export default defineComponent({
    setup(props, { emit }) {
      const handleOk = () => {
        // 处理确定按钮的逻辑
        console.log('点击了确定按钮');
      };
      const getData = () => {
        show.value = true;
      };
      const show = ref(false);
      const handleCancel = () => {
        // 处理取消按钮的逻辑
        console.log('点击了取消按钮');
        emit('handleCancel', null);
        show.value = false;
      };
      return {
        handleOk,
        show,
        getData,
        handleCancel,
      };
    },
  });
</script>
