<template>
  <a-modal v-model:visible="vdata.isShow" title="测试" @ok="handleOkFunc">
    <a-form ref="infoFormModel" :model="vdata.saveObject" :label-col="{span: 6}" :wrapper-col="{span: 15}" :rules="rules">
      <a-form-item label="金额：" name="amount">
        <a-input v-model:value="vdata.saveObject.amount" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>

<script lang="ts" setup>
import { $speakTest, $printTest }from '@/api/manage'
import { reactive, ref } from 'vue'

	const infoFormModel = ref()

	const vdata = reactive({
		loading: false, // 按钮上的loading
		isShow: false, // 是否显示弹层/抽屉
		saveObject: {} as any, // 数据对象
		recordId: null, // 更新对象ID	
    deviceType: 1 // 设备类型，1-云喇叭 2-云打印
  })

	const rules = {
    amount: [{ required: true, pattern: /^(([1-9]{1}\d{0,6})|(0{1}))(\.\d{1,2})?$/, message: '请输入正确的金额', trigger: 'blur' }]
  }

  defineExpose({show})

  function show (recordId, deviceType) { // 弹层打开事件

    if (infoFormModel.value !== undefined) {
       infoFormModel.value.resetFields()
    }
    vdata.isShow = true
    vdata.saveObject.amount = ''
    vdata.recordId = recordId
    vdata.deviceType = deviceType
  }
  function handleOkFunc () { // 点击【确认】按钮事件

    if(vdata.deviceType == 1) {
      infoFormModel.value.validate().then(valid =>{
        $speakTest(vdata.recordId, vdata.saveObject.amount)
      })
    } else if(vdata.deviceType == 2) {
      infoFormModel.value.validate().then(valid =>{
        $printTest(vdata.recordId, vdata.saveObject.amount)
      })
    }
  }
	// 点击遮罩层关闭抽屉
  function onClose () {
      vdata.isShow = false
  }

</script>
