<script setup lang="ts">
import { reactive, ref } from "vue";
import { message } from "@/utils/message";
import * as $api from "@/api/order/index";
import type { FormInstance } from "element-plus";
import { cloneDeep } from "@pureadmin/utils";

const title = "";
defineOptions({ name: "templateEdit1" });
const isDetail = ref(false);
const formRef = ref<FormInstance>();
// 初始化数据
const initData = {
    imageBase64: undefined,
    qrCode: undefined
};

// 表单校验规则
const formRules = {};

// 页面数据
const pageData: any = reactive({
  dialogVisible: false,
  title: "",
  formLoading: false,
  mode: "add",
  isUpdate: false,
  // 表单数据
  formData: initData,
  formRules: formRules
});
// 暴露给父级调用
const emits = defineEmits(["ok", "close"]);
const src = ref();
const qrCode = ref();
// 打开弹窗
const open = (data: any, qrCode: any, mode: string) => {
    pageData.formData =  data;

  pageData.dialogVisible = true;
};
defineExpose({ open });
</script>

<template>
  <el-dialog v-model="pageData.dialogVisible" title="扫码支付" destroy-on-close :width="500">
    <a :href="pageData.formData.qrCode" target="_blank">{{ pageData.formData.qrCode }}</a>
    <img :src="pageData.formData.imageBase64" alt="pageData.formData.qrCode"/>
    <el-text>请使用支付宝"扫一扫"进行支付</el-text>
  </el-dialog>
</template>
