From 2500843dbffc841eeab2e0a91d735c56cb6ea357 Mon Sep 17 00:00:00 2001
From: wupengfei <834520024@qq.com>
Date: 星期四, 22 五月 2025 17:03:46 +0800
Subject: [PATCH] feat: UI
---
packages/components/src/components/Result/Result.vue | 53 +++++++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 45 insertions(+), 8 deletions(-)
diff --git a/packages/components/src/components/Result/Result.vue b/packages/components/src/components/Result/Result.vue
index 479d443..d52da9c 100644
--- a/packages/components/src/components/Result/Result.vue
+++ b/packages/components/src/components/Result/Result.vue
@@ -1,29 +1,66 @@
<template>
- <div class="recharge-result-view">
- <div class="recharge-result-view-title">{{ title }}</div>
- <div class="recharge-result-view-subtitle">璁㈠崟鍙凤細{{ orderNo }}</div>
- <div class="recharge-result-view-remark">
- {{ refundCheckRemark }},濡傛湁鐤戦棶璇疯仈绯诲鏈� {{ servicePhone }}锛堝懆涓�鍒板懆浜� 9:00-17:30锛�
+ <div class="result-wrapper" v-bind="$attrs">
+ <div class="result-content">
+ <img class="result-content-icon" :src="icon" />
+ <div class="result-content-title">{{ title }}</div>
+ <div class="result-content-remark">
+ <slot name="remark"> </slot>
+ </div>
</div>
- <div class="recharge-result-view-btn-wrapper">
+ <div class="result-order-number">
+ <div class="result-order-number-label">璁㈠崟缂栧彿锛�</div>
+ <div class="result-order-number-value">{{ orderNo }}</div>
+ </div>
+ <div class="result-wrapper-tips">
+ <slot name="tips"> </slot>
+ </div>
+ <div class="result-wrapper-actions">
<slot name="actions">
- <div class="recharge-result-view-btn" @click="emit('goBackHome')">鍥為椤�</div>
+ <div class="chunk-form-actions">
+ <nut-button class="recharge-button" type="primary" @click="emit('goBackHome')">
+ <div class="recharge-button-inner">
+ <div class="recharge-button-text">杩斿洖棣栭〉</div>
+ </div>
+ </nut-button>
+ </div>
</slot>
</div>
</div>
</template>
<script setup lang="ts">
+import { computed } from 'vue';
+import { OssAssets } from '../../constants/img';
+import { Button as NutButton } from '@nutui/nutui-taro';
+
defineOptions({
name: 'Result',
});
type Props = {
title?: string;
+ type?: 'success' | 'fail';
orderNo?: string;
- refundCheckRemark?: string;
servicePhone?: string;
+ dangerTips?: string;
+ warningTips?: string;
+ customerServiceTips?: string;
};
const props = withDefaults(defineProps<Props>(), {});
+
+const emit = defineEmits<{
+ (e: 'goBackHome'): void;
+}>();
+
+const icon = computed(() => {
+ switch (props.type) {
+ case 'success':
+ return OssAssets.result.Success;
+ case 'fail':
+ return OssAssets.result.Fail;
+ default:
+ return OssAssets.result.Success;
+ }
+});
</script>
--
Gitblit v1.9.1