<template>
  <q-dialog v-model="visable">
    <q-card>
      <q-card-section>
        <div class="text-h6">{{props.warnTitle}}</div>
      </q-card-section>

      <q-card-section class="q-pt-none">
        {{props.warnContent}}
      </q-card-section>

      <q-card-actions :align="'right'">
        <q-btn flat :label="props.confirmContent" color="primary" @click="confimClick" v-close-popup />
      </q-card-actions>
    </q-card>
  </q-dialog>
</template>
<script lang="ts" setup>
import { ref,PropType } from 'vue';

let visable = ref(false);
const props = defineProps({
  warnTitle: {
    type: String,
    default: '警告',
  },
  warnContent: {
    type: String,
    required: false,
  },
  confirmContent: {
    type: String,
    default: '我已了解',
  },
  warnClick:{
    type: (Function as PropType<(e: any) => void>) || undefined,
    required: false,
  }
});
const warnForm=()=>{
  console.log('触发');
  visable.value=!visable.value;
  
}
const confimClick=(e:any)=>{
  warnForm();
  if( props.warnClick)
  {props.warnClick(e)};
}
defineExpose({
  warnForm
})
</script>
