91 lines
1.9 KiB
Vue
91 lines
1.9 KiB
Vue
<template>
|
|
<u-popup
|
|
v-model:show="popupVisible"
|
|
mode="center"
|
|
round="20"
|
|
:safe-area-inset-bottom="false"
|
|
@close="handlePopupClose"
|
|
>
|
|
<HazardFormPanel
|
|
ref="panelRef"
|
|
v-bind="panelProps"
|
|
:show="popupVisible"
|
|
@update:show="popupVisible = $event"
|
|
@success="(payload) => emit('success', payload)"
|
|
@confirm="(payload) => emit('confirm', payload)"
|
|
@clear-draft="emit('clear-draft')"
|
|
@close="popupVisible = false"
|
|
/>
|
|
</u-popup>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, ref } from 'vue';
|
|
import HazardFormPanel from './HazardFormPanel.vue';
|
|
|
|
const props = defineProps({
|
|
show: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
title: {
|
|
type: String,
|
|
default: '填写隐患信息'
|
|
},
|
|
mode: {
|
|
type: String,
|
|
default: 'collect'
|
|
},
|
|
modelValue: {
|
|
type: Object,
|
|
default: null
|
|
},
|
|
extraParams: {
|
|
type: Object,
|
|
default: () => ({})
|
|
},
|
|
showDraftBanner: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
bodyHeight: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
canvasId: {
|
|
type: String,
|
|
default: 'hazardFormWatermarkCanvas'
|
|
}
|
|
});
|
|
|
|
const emit = defineEmits(['update:show', 'update:modelValue', 'success', 'confirm', 'clear-draft']);
|
|
|
|
const popupVisible = computed({
|
|
get: () => props.show,
|
|
set: (value) => emit('update:show', value)
|
|
});
|
|
|
|
const panelProps = computed(() => ({
|
|
title: props.title,
|
|
mode: props.mode,
|
|
modelValue: props.modelValue,
|
|
extraParams: props.extraParams,
|
|
showDraftBanner: props.showDraftBanner,
|
|
bodyHeight: props.bodyHeight,
|
|
canvasId: props.canvasId
|
|
}));
|
|
|
|
const handlePopupClose = () => {
|
|
popupVisible.value = false;
|
|
};
|
|
|
|
const panelRef = ref(null);
|
|
|
|
defineExpose({
|
|
getPayload: (...args) => panelRef.value?.getPayload?.(...args),
|
|
applyPayload: (...args) => panelRef.value?.applyPayload?.(...args),
|
|
resetForm: (...args) => panelRef.value?.resetForm?.(...args),
|
|
validateForm: (...args) => panelRef.value?.validateForm?.(...args)
|
|
});
|
|
</script>
|