digital-medicine-front/src/views/cdt/models/EditOrderRemark.vue

<template>
    <vxe-modal v-model="dialogVisible" :title="title" show-zoom resize show-footer destroy-on-close transfer @hide="close" :width="width" :z-index="100">
        <template #default>
            <el-form ref="formRef" :model="form" label-width="auto">
                <el-form-item label="订单备注:" prop="remark">
                    <el-input v-model="form.remark" :rows="4" type="textarea" placeholder="请输入订单备注" clearable style="width: 100%" />
                </el-form-item>
            </el-form>
        </template>
        <template #footer>
            <el-button @click="close">取消</el-button>
            <el-button type="primary" @click="submitForm">确认添加</el-button>
        </template>
    </vxe-modal>
</template>

<script setup name="EditOrderRemark" lang="ts">
import { testOrderRemark } from '@/api/cdt/orders';
import { editValidityDate } from '@/api/dgtmedicine/member/index';
import { propTypes } from '@/utils/propTypes';
import { FormInstance } from 'element-plus';
const emit = defineEmits(['update:show', 'close', 'success']);
const props = defineProps({
    show: propTypes.bool.def(false),
    title: propTypes.string.def('添加备注'),
    width: propTypes.number.def(560),
    info: propTypes.any.def(null),
    dict: propTypes.object.def({}),
});
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const dialogVisible = ref(false);
const form = ref<any>({
    remark: ''
});
const formRef = ref<FormInstance>();
const close = () => {
    formRef.value?.resetFields();
    emit('update:show', false);
    emit('close', false);
};
const submitForm = async () => {
    try {
        await formRef.value?.validate();
        const res = await testOrderRemark({ ...form.value, orderId: props.info?.id });
        if (res) {
            close();
            emit('success', true);
        }
    } catch (error) {
        console.error(error);
    }
};

watch(
    () => props.show,
    (val) => {
        dialogVisible.value = val;
    },
    { immediate: true }
);
watch(
    () => props.info,
    (val) => {
        form.value = { remark: val?.remark };
    },
    { immediate: true }
);
</script>