diff --git a/packages/ui-vue/components/message-box/src/message-box.component.tsx b/packages/ui-vue/components/message-box/src/message-box.component.tsx index a77adc1dd4b725bd77b163e8d351900346641762..45ec0795971771950db61dfc23116aed348c5006 100644 --- a/packages/ui-vue/components/message-box/src/message-box.component.tsx +++ b/packages/ui-vue/components/message-box/src/message-box.component.tsx @@ -6,7 +6,7 @@ import { ModalButton } from "../../modal"; export interface ExceptionInfo { date: string; message: string; - copyButton: ModalButton; + detail: string; } export default defineComponent({ @@ -17,7 +17,7 @@ export default defineComponent({ const messageType = ref(props.type); const messageTitle = ref(props.title); const messageDetail = ref(props.detail); - const exception = ref({} as ExceptionInfo); + const exception = ref(props.exceptionInfo); const happend = ref(''); const promptInputType = ref(''); const promptFontSize = ref(14); @@ -34,8 +34,9 @@ export default defineComponent({ const showCancelButton = ref(true); const showOkButton = ref(true); - const showLines = ref(''); - const exceptionMessageMaxHeight = ref(0); + const copyButtonText = ref('复制详细信息'); + const showLines = ref(3); + const exceptionMessageMaxHeight = ref(480); const messageBoxContainerClass = computed(() => { const classObject = { @@ -52,6 +53,8 @@ export default defineComponent({ const styleObject = {} as Record; if (messageType.value === 'prompt') { styleObject.padding = '0.5rem 0.5rem 1rem 1.5rem'; + } else if (messageType.value === 'error') { + styleObject.padding = '0.5rem 1.5rem 1rem 1.5rem'; } return styleObject; }); @@ -85,11 +88,11 @@ export default defineComponent({ const exceptionDateMessage = computed(() => { const exceptionDate = exception.value && exception.value.date || ''; - return `${happend.value} : ${exceptionDate}`; + return `发生时间 : ${exceptionDate}`; }); const shouldShowExceptionMessage = computed(() => { - return !!exception.value && !!exception.value.message; + return !!exception.value && !!exception.value.detail; }); const exceptionMessageStyle = computed(() => { @@ -110,7 +113,7 @@ export default defineComponent({ }); const safeExceptionMessage = computed(() => { - const safeMessage = exception.value && exception.value.message || ''; + const safeMessage = exception.value && exception.value.detail || ''; return safeMessage; }); @@ -118,21 +121,21 @@ export default defineComponent({ return true; }); + const expandExceptionMessage = ref(false); + const expandText = ref('展开'); + const collapseText = ref('收起'); const expandHandleStyle = computed(() => { const styleObject = { 'display': 'block', - 'text-align': 'right' as TextAlignProperty, 'color': '#2A87FF' - }; + } as Record; + styleObject['text-align'] = expandExceptionMessage.value ? '' : 'right'; return styleObject; }); - const expandExceptionMessage = ref(false); - const expandText = ref(''); - const collapseText = ref(''); - function toggalExceptionMessage(expand: boolean, $event: Event) { - + expandExceptionMessage.value = !expandExceptionMessage.value; + showLines.value = expandExceptionMessage.value ? 20 : 3; } function onClickExpand(payload: MouseEvent) { @@ -201,7 +204,7 @@ export default defineComponent({ }); const shouldShowCopyButton = computed(() => { - return exception.value && exception.value.copyButton && exception.value.copyButton.text; + return exception.value && exception.value.date && exception.value.message && exception.value.detail; }); function onClickCopyButton($event: MouseEvent) { @@ -353,7 +356,7 @@ export default defineComponent({ { shouldShowCopyButton.value && - {exception.value.copyButton.text} + {copyButtonText.value} } @@ -408,7 +411,7 @@ export default defineComponent({ {shouldShowExceptionDate.value &&
{exceptionDateMessage.value}
} {shouldShowExceptionMessage.value &&
- {exceptionMessageDetail.value}: + 详细信息 :
} { @@ -417,13 +420,13 @@ export default defineComponent({ { expandExceptionMessage.value && - {expandText.value} + {collapseText.value} } { !expandExceptionMessage.value && - {collapseText.value} + {expandText.value} } @@ -452,6 +455,12 @@ export default defineComponent({ { shouldShowOkCancelButtons.value &&