51 lines
2.5 KiB
Vue
51 lines
2.5 KiB
Vue
<!-- 页面编号：R-03；用途：亲友往来入口。列表 DTO 缺失时不展示 fixture 记录。 -->
|
||
<template>
|
||
<view class="gift-page">
|
||
<ModulePageBackground module="records" />
|
||
<view class="page-header"><PageHeader title="贺礼簿" :action="hasValidContext ? '新建' : ''" @action="createRelative" /></view>
|
||
<view class="page-content">
|
||
<view class="state-card">
|
||
<text>{{ stateCopy.title }}</text>
|
||
<text>{{ stateCopy.copy }}</text>
|
||
<AppButton block :label="stateCopy.action" @click="handleStateAction" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { computed, ref } from "vue";
|
||
import { onLoad } from "@dcloudio/uni-app";
|
||
import AppButton from "@/components/AppButton.vue";
|
||
import ModulePageBackground from "@/components/ModulePageBackground.vue";
|
||
import PageHeader from "@/components/PageHeader.vue";
|
||
import { goBack, openPage } from "@/utils/navigation.js";
|
||
|
||
const genealogyId = ref("");
|
||
const hasValidContext = ref(false);
|
||
const stateCopy = computed(() => hasValidContext.value
|
||
? { title: "贺礼簿待后端字段合同", copy: "往来列表没有声明记录 ID、关系、事项、时间、金额或备注字段；页面已停止展示本地记录。", action: "新建往来记录" }
|
||
: { title: "贺礼簿入口无效", copy: "没有取得有效家谱标识，页面不会展示其他家谱记录。", action: "返回上一页" },
|
||
);
|
||
onLoad((query) => {
|
||
genealogyId.value = String(query?.genealogyId || "");
|
||
hasValidContext.value = /^[1-9]\d*$/.test(genealogyId.value);
|
||
});
|
||
const createRelative = () => hasValidContext.value
|
||
? openPage("R04", { genealogyId: genealogyId.value, mode: "create" }, "R03")
|
||
: Promise.resolve(false);
|
||
const handleStateAction = () => hasValidContext.value ? createRelative() : goBack();
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
@use "../../styles/adaptive-frame-profiles.scss" as adaptive;
|
||
.gift-page { display: flex; min-height: 100vh; flex-direction: column; background: $paper; }
|
||
.page-header, .page-content { z-index: 1; }
|
||
.page-content { padding: 18rpx 24rpx 72rpx; }
|
||
.state-card { box-sizing: border-box; min-height: 340rpx; padding: 78rpx 52rpx 50rpx; text-align: center; @include adaptive.adaptive-records-content; }
|
||
.state-card > text { display: block; }
|
||
.state-card > text:first-child { color: $ink; font-size: 35rpx; font-weight: 700; }
|
||
.state-card > text:nth-child(2) { margin-top: 18rpx; color: $ink-muted; font-size: 24rpx; line-height: 1.65; }
|
||
.state-card .app-button { margin-top: 28rpx; }
|
||
</style>
|