Replace SCSS variable usages with explicit pixel/hex values for consistent styling across all components Fix broken template syntax including missing class spaces and incorrect closing tags Migrate constant and API imports to centralized @/constants and @/api modules Add new utility classes: IdUtils, CallbackUtils, and TimerUtils Add new chat conversation API endpoints for recent conversations and message lists Add new Discovery page components (FindTabs, QuickQuestions, CardSwiper) and their styles Update app store config to use environment variables for base API and WebSocket URLs Add new selected tab icon assets
106 lines
2.6 KiB
Vue
106 lines
2.6 KiB
Vue
<template>
|
|
<uni-popup ref="popupRef" type="bottom" :safe-area="false" @maskClick="handleClose">
|
|
<div class="refund-popup bg-F5F7FA border-box">
|
|
<div class="border-box 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="border-box rounded-12 bg-white p-12 ml-12 mr-12 mb-40">
|
|
<div class="flex flex-items-center mb-8">
|
|
<uni-icons fontFamily="znicons" size="20" color="#333">
|
|
{{ zniconsMap["zn-refund"] }}
|
|
</uni-icons>
|
|
<span class="font-size-14 font-600 color-171717 ml-8">
|
|
{{ refundTitle }}
|
|
</span>
|
|
</div>
|
|
<div class="font-size-14 color-525866 line-height-16 mb-4" v-for="(item, index) in commodityPurchaseInstruction"
|
|
:key="index">
|
|
{{ item }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</uni-popup>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed, watch } from "vue";
|
|
import { zniconsMap } from "@/static/fonts/znicons";
|
|
|
|
// Props定义
|
|
const props = defineProps({
|
|
// 弹窗显示状态
|
|
modelValue: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
// 订单数据
|
|
orderData: {
|
|
type: Object,
|
|
default: () => { },
|
|
},
|
|
});
|
|
|
|
// Events定义
|
|
const emit = defineEmits(["update:modelValue"]);
|
|
|
|
// 弹窗引用
|
|
const popupRef = ref(null);
|
|
|
|
// 获取退款模板
|
|
const refundTitle = computed(() => {
|
|
if (props.orderData.commodityPurchaseInstruction) {
|
|
return (
|
|
props.orderData.commodityPurchaseInstruction.refundTitle || "退订规则"
|
|
);
|
|
}
|
|
|
|
return "退订规则";
|
|
});
|
|
|
|
const commodityPurchaseInstruction = computed(() => {
|
|
if (
|
|
props.orderData.commodityPurchaseInstruction &&
|
|
props.orderData.commodityPurchaseInstruction.refundContent
|
|
) {
|
|
// 以换行符为分隔符,将字符串转换为数组
|
|
return props.orderData.commodityPurchaseInstruction.refundContent.split(
|
|
"\n",
|
|
);
|
|
}
|
|
|
|
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>
|