<template>
    <q-dialog v-model="visible">
        <q-card class="shadow-24" style="max-width: 825px">
            <q-card-section class="no-padding">
                <q-card-actions class="bg-light-blue-10 text-white">
                    <q-card-actions class="text-h6">配置规则</q-card-actions>
                    <q-space />
                    <q-btn dense flat round icon="close" @click="visible = false">
                        <q-tooltip content-class="bg-amber text-black shadow-4">关闭</q-tooltip>
                    </q-btn>
                </q-card-actions>
            </q-card-section>
            <q-card-section style="max-width: 825px" class="scroll">
                <q-img src="icons/tips.png" width="790px" height="635px"></q-img>
            </q-card-section>
            <q-separator />
            <q-card-actions align="right">
                <q-btn color="white" text-color="black" @click="visible = false">关闭</q-btn>
            </q-card-actions>
        </q-card>
    </q-dialog>
</template>
<script lang="ts" setup>
import { ref } from 'vue'

const visible = ref(false);

const clickForm = () => {
    visible.value = true;
};

defineExpose({
    clickForm,
});
</script>