|  | @@ -0,0 +1,130 @@
 | 
	
		
			
				|  |  | +<template>
 | 
	
		
			
				|  |  | +    <Dialog :title="dialogTitle" v-model="dialogVisible">
 | 
	
		
			
				|  |  | +        <el-form
 | 
	
		
			
				|  |  | +            ref="formRef"
 | 
	
		
			
				|  |  | +            :model="formData"
 | 
	
		
			
				|  |  | +            :rules="formRules"
 | 
	
		
			
				|  |  | +            label-width="130px"
 | 
	
		
			
				|  |  | +            v-loading="formLoading"
 | 
	
		
			
				|  |  | +        >
 | 
	
		
			
				|  |  | +            <el-form-item label="奖品类型" prop="type">
 | 
	
		
			
				|  |  | +                <el-select v-model="formData.type" placeholder="请选择奖品类型" clearable>
 | 
	
		
			
				|  |  | +                    <el-option v-for="dict in getIntDictOptions(DICT_TYPE.PROMOTION_LUCK_PRIZE_TYPE)" :key="dict.value" :label="dict.label" :value="dict.value.toString()" />
 | 
	
		
			
				|  |  | +                </el-select>
 | 
	
		
			
				|  |  | +            </el-form-item>
 | 
	
		
			
				|  |  | +            <el-form-item label="是否领取" prop="isReceive">
 | 
	
		
			
				|  |  | +                <el-switch v-model="formData.isReceive" />
 | 
	
		
			
				|  |  | +            </el-form-item>
 | 
	
		
			
				|  |  | +            <el-form-item label="领取时间" prop="receiveTime">
 | 
	
		
			
				|  |  | +                <el-date-picker v-model="formData.receiveTime" type="date" value-format="x" placeholder="选择领取时间" />
 | 
	
		
			
				|  |  | +            </el-form-item>
 | 
	
		
			
				|  |  | +            <el-form-item label="收获地址、备注等" prop="receiveInfo">
 | 
	
		
			
				|  |  | +                <el-input v-model="formData.receiveInfo" placeholder="请输入收获地址、备注等" />
 | 
	
		
			
				|  |  | +            </el-form-item>
 | 
	
		
			
				|  |  | +            <el-form-item label="是否发货" prop="isDeliver">
 | 
	
		
			
				|  |  | +                <el-switch v-model="formData.isDeliver" />
 | 
	
		
			
				|  |  | +            </el-form-item>
 | 
	
		
			
				|  |  | +            <el-form-item label="发货处理时间" prop="deliverTime">
 | 
	
		
			
				|  |  | +                <el-date-picker v-model="formData.deliverTime" type="date" value-format="x" placeholder="选择发货处理时间" />
 | 
	
		
			
				|  |  | +            </el-form-item>
 | 
	
		
			
				|  |  | +            <el-form-item label="发货单号、备注等" prop="deliverInfo">
 | 
	
		
			
				|  |  | +                <el-input v-model="formData.deliverInfo" placeholder="请输入发货单号、备注等" />
 | 
	
		
			
				|  |  | +            </el-form-item>
 | 
	
		
			
				|  |  | +        </el-form>
 | 
	
		
			
				|  |  | +        <template #footer>
 | 
	
		
			
				|  |  | +          <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
 | 
	
		
			
				|  |  | +          <el-button @click="dialogVisible = false">取 消</el-button>
 | 
	
		
			
				|  |  | +        </template>
 | 
	
		
			
				|  |  | +    </Dialog>
 | 
	
		
			
				|  |  | +</template>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +<script setup lang="ts">
 | 
	
		
			
				|  |  | +import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
 | 
	
		
			
				|  |  | +import { LuckLotteryRecordApi, LuckLotteryRecordVO } from '@/api/mall/promotion/lottery/record'
 | 
	
		
			
				|  |  | +          
 | 
	
		
			
				|  |  | +/** 幸运抽奖-抽奖记录 表单 */
 | 
	
		
			
				|  |  | +defineOptions({ name: 'LuckLotteryRecordForm' })
 | 
	
		
			
				|  |  | +const { t } = useI18n() // 国际化
 | 
	
		
			
				|  |  | +const message = useMessage() // 消息弹窗
 | 
	
		
			
				|  |  | +const dialogVisible = ref(false) // 弹窗的是否展示
 | 
	
		
			
				|  |  | +const dialogTitle = ref('') // 弹窗的标题
 | 
	
		
			
				|  |  | +const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
 | 
	
		
			
				|  |  | +const formType = ref('') // 表单的类型:create - 新增;update - 修改
 | 
	
		
			
				|  |  | +const formData = ref({
 | 
	
		
			
				|  |  | +    id: undefined,
 | 
	
		
			
				|  |  | +    userId: undefined,
 | 
	
		
			
				|  |  | +    lotteryId: undefined,
 | 
	
		
			
				|  |  | +    prizeId: undefined,
 | 
	
		
			
				|  |  | +    type: undefined,
 | 
	
		
			
				|  |  | +    isReceive: undefined,
 | 
	
		
			
				|  |  | +    receiveTime: undefined,
 | 
	
		
			
				|  |  | +    receiveInfo: undefined,
 | 
	
		
			
				|  |  | +    isDeliver: undefined,
 | 
	
		
			
				|  |  | +    deliverTime: undefined,
 | 
	
		
			
				|  |  | +    deliverInfo: undefined,
 | 
	
		
			
				|  |  | +})
 | 
	
		
			
				|  |  | +const formRules = reactive({
 | 
	
		
			
				|  |  | +    type: [{ required: true, message: '奖品类型不能为空', trigger: 'change' }],
 | 
	
		
			
				|  |  | +    isReceive: [{ required: true, message: '是否领取不能为空', trigger: 'change' }],
 | 
	
		
			
				|  |  | +    isDeliver: [{ required: true, message: '是否发货不能为空', trigger: 'change' }],
 | 
	
		
			
				|  |  | +})
 | 
	
		
			
				|  |  | +const formRef = ref() // 表单 Ref
 | 
	
		
			
				|  |  | +          
 | 
	
		
			
				|  |  | +/** 打开弹窗 */
 | 
	
		
			
				|  |  | +const open = async (type: string, id?: number) => {
 | 
	
		
			
				|  |  | +    dialogVisible.value = true
 | 
	
		
			
				|  |  | +    dialogTitle.value = t('action.' + type)
 | 
	
		
			
				|  |  | +    formType.value = type
 | 
	
		
			
				|  |  | +    resetForm()
 | 
	
		
			
				|  |  | +    // 修改时,设置数据
 | 
	
		
			
				|  |  | +    if (id) {
 | 
	
		
			
				|  |  | +        formLoading.value = true
 | 
	
		
			
				|  |  | +        try {
 | 
	
		
			
				|  |  | +            formData.value = await LuckLotteryRecordApi.getLuckLotteryRecord(id)
 | 
	
		
			
				|  |  | +        } finally {
 | 
	
		
			
				|  |  | +            formLoading.value = false
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +defineExpose({ open }) // 提供 open 方法,用于打开弹窗
 | 
	
		
			
				|  |  | +/** 提交表单 */
 | 
	
		
			
				|  |  | +const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
 | 
	
		
			
				|  |  | +const submitForm = async () => {
 | 
	
		
			
				|  |  | +    // 校验表单
 | 
	
		
			
				|  |  | +    await formRef.value.validate()
 | 
	
		
			
				|  |  | +    // 提交请求
 | 
	
		
			
				|  |  | +    formLoading.value = true
 | 
	
		
			
				|  |  | +    try {
 | 
	
		
			
				|  |  | +        const data = formData.value as unknown as LuckLotteryRecordVO
 | 
	
		
			
				|  |  | +        if (formType.value === 'create') {
 | 
	
		
			
				|  |  | +            await LuckLotteryRecordApi.createLuckLotteryRecord(data)
 | 
	
		
			
				|  |  | +            message.success(t('common.createSuccess'))
 | 
	
		
			
				|  |  | +        } else {
 | 
	
		
			
				|  |  | +            await LuckLotteryRecordApi.updateLuckLotteryRecord(data)
 | 
	
		
			
				|  |  | +            message.success(t('common.updateSuccess'))
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +        dialogVisible.value = false
 | 
	
		
			
				|  |  | +        // 发送操作成功的事件
 | 
	
		
			
				|  |  | +        emit('success')
 | 
	
		
			
				|  |  | +    } finally {
 | 
	
		
			
				|  |  | +        formLoading.value = false
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +/** 重置表单 */
 | 
	
		
			
				|  |  | +const resetForm = () => {
 | 
	
		
			
				|  |  | +    formData.value = {
 | 
	
		
			
				|  |  | +        id: undefined,
 | 
	
		
			
				|  |  | +        userId: undefined,
 | 
	
		
			
				|  |  | +        lotteryId: undefined,
 | 
	
		
			
				|  |  | +        prizeId: undefined,
 | 
	
		
			
				|  |  | +        type: undefined,
 | 
	
		
			
				|  |  | +        isReceive: undefined,
 | 
	
		
			
				|  |  | +        receiveTime: undefined,
 | 
	
		
			
				|  |  | +        receiveInfo: undefined,
 | 
	
		
			
				|  |  | +        isDeliver: undefined,
 | 
	
		
			
				|  |  | +        deliverTime: undefined,
 | 
	
		
			
				|  |  | +        deliverInfo: undefined,
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    formRef.value?.resetFields()
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +</script>
 |