051f7d1134
Clean up style-related code across all components: - Replace deprecated color-* classes with text-[color]/text-white equivalents - Remove redundant border-box declarations and fix broken empty box-sizing rule - Correct invalid rounded corner class syntax - Standardize line-height to leading-[value] utilities - Uniform margin and padding notation to [xxpx] format
85 lines
2.1 KiB
Vue
85 lines
2.1 KiB
Vue
<template>
|
|
<uni-popup ref="popupRef" type="bottom" :safe-area="false" @maskClick="handleClose">
|
|
<div class="refund-popup bg-F5F7FA ">
|
|
<div class=" flex flex-items-center justify-between pt-12 pb-12 relative">
|
|
<div class="flex-full font-size-16 color-171717 line-height-24 text-center">
|
|
明细详情
|
|
</div>
|
|
<!-- 关闭按钮 -->
|
|
<uni-icons class="close absolute" type="close" size="20" color="#CACFD8" @click="handleClose" />
|
|
</div>
|
|
<!-- 内容区域 -->
|
|
<div class="rounded-[12px] bg-white ml-12 mr-12 mb-40">
|
|
<div class=" border-bottom flex flex-items-center flex-justify-between pt-12 pb-12 ml-12 mr-12">
|
|
<span class="font-size-16 font-500 color-171717">在线支付</span>
|
|
<span class="text-[14px] color-171717">239</span>
|
|
</div>
|
|
<div class=" flex flex-items-center flex-justify-between pt-12 pb-12 ml-12 mr-12">
|
|
<span class="font-size-16 font-500 color-171717">房费</span>
|
|
<span class="text-[14px] color-171717">239</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</uni-popup>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed, watch } from "vue";
|
|
|
|
// Props定义
|
|
const props = defineProps({
|
|
// 弹窗显示状态
|
|
modelValue: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
// 订单数据
|
|
orderData: {
|
|
type: Object,
|
|
default: () => { },
|
|
},
|
|
});
|
|
|
|
// Events定义
|
|
const emit = defineEmits(["update:modelValue"]);
|
|
|
|
// 弹窗引用
|
|
const popupRef = ref(null);
|
|
|
|
// 获取退款模板
|
|
const commodityPurchaseInstruction = computed(() => {
|
|
if (props.orderData.commodityPurchaseInstruction) {
|
|
return props.orderData.commodityPurchaseInstruction;
|
|
}
|
|
|
|
return {};
|
|
});
|
|
|
|
// 方法定义
|
|
const show = () => popupRef.value && popupRef.value.open();
|
|
|
|
const hide = () => popupRef.value && popupRef.value.close();
|
|
|
|
// 监听modelValue变化
|
|
watch(
|
|
() => props.modelValue,
|
|
(newVal) => {
|
|
if (newVal) {
|
|
show();
|
|
} else {
|
|
hide();
|
|
}
|
|
},
|
|
{ immediate: true },
|
|
);
|
|
|
|
const handleClose = () => {
|
|
emit("update:modelValue", false);
|
|
emit("close");
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "./styles/index.scss";
|
|
</style>
|