rain/jiapuapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成50%

Browse Source
This commit is contained in:
rain
2026-07-23 08:23:59 +08:00
parent 9b0ad62df4
commit f1edc6b533
218 changed files with 24318 additions and 5514 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/genealogy/g08-join-application.vue
+148 -64
View File
@@ -2,9 +2,9 @@
<template>
<view class="join-page">
<GenealogyPageBackground />
<view class="join-page__header"
><PageHeader :title="sourceContract.headerTitle"
/></view>
<view class="join-page__header">
<PageHeader :title="sourceContract.headerTitle" custom-back @back="requestBack" />
</view>
<view
class="join-panel"
@@ -12,6 +12,7 @@
'join-state--form': joinState === 'form',
'join-state--success': joinState === 'success',
'join-state--error': joinState === 'error',
'join-state--ineligible': joinState === 'ineligible',
}"
>
<view v-if="joinState === 'form'" class="join-form">
@@ -20,10 +21,6 @@
>{{ sourceContract.formTitle }} {{ genealogyName }}</text
>
<text class="join-form__copy">{{ sourceContract.formCopy }}</text>
<text v-if="previousNotice" class="join-form__previous">{{
previousNotice
}}</text>
<view class="join-field">
<text>真实姓名</text
><input
@@ -76,74 +73,113 @@
<text class="join-result__eyebrow">{{
joinState === "success"
? sourceContract.successEyebrow
: joinState === "ineligible"
? "当前不可申请"
: sourceContract.errorEyebrow
}}</text>
<text class="join-result__title">{{
joinState === "success"
? sourceContract.successTitle
: joinState === "ineligible"
? ineligibleTitle
: sourceContract.errorTitle
}}</text>
<text class="join-result__copy">{{ resultCopy }}</text>
<view
class="join-action"
@click="joinState === 'success' ? completeFlow() : retryForm()"
@click="
joinState === 'success'
? completeFlow()
: joinState === 'ineligible'
? handleIneligibleAction()
: retryForm()
"
>
<text>{{
joinState === "success" ? sourceContract.nextLabel : "重新填写"
joinState === "success"
? sourceContract.nextLabel
: joinState === "ineligible"
? ineligibleActionLabel
: "重新填写"
}}</text>
</view>
</view>
</view>
<AppDialog
:visible="discardVisible"
title="放弃填写？"
message="当前身份关系尚未保存，确认返回后将清空。"
confirm-text="放弃并返回"
cancel-text="继续填写"
show-cancel
compact-actions
:close-on-mask="false"
@confirm="confirmDiscard"
@cancel="cancelDiscard"
/>
</view>
</template>
<script setup>
import { computed, reactive, ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import { onBackPress, onLoad, onUnload } from "@dcloudio/uni-app";
import AppDialog from "@/components/AppDialog.vue";
import GenealogyPageBackground from "@/components/GenealogyPageBackground.vue";
import PageHeader from "@/components/PageHeader.vue";
import {
findGenealogyFixture,
getGenealogyFixtureAccess,
} from "@/data/mock.js";
import { createDiscardConfirmation } from "@/utils/discard-confirmation.js";
import {
goBack,
goRoot,
handleBackPress,
openPage,
returnTo,
runBackGuard,
} from "@/utils/navigation.js";
const genealogyId = ref("");
const source = ref("search");
const previousRelation = ref("");
const genealogyName = ref("这部家谱");
const genealogyPreview = {
1001: "汤氏家谱",
1002: "汝南汤氏家谱",
};
const joinState = ref("form");
const isSubmitting = ref(false);
const errorMessage = ref("");
const ineligibleRelation = ref("unknown");
const discardVisible = ref(false);
const form = reactive({ realName: "", relation: "", message: "" });
const fieldErrors = reactive({ realName: "", relation: "" });
const previousNotice = computed(() =>
previousRelation.value === "rejected"
? "上次申请未通过，请补充更准确的长辈姓名、祖居地或支系信息。"
: previousRelation.value === "removed"
? "你曾退出或被移出这部家谱，请重新确认身份关系后申请。"
: previousRelation.value === "withdrawn"
? "上次申请已撤回；如仍希望加入，请重新确认关系并提交。"
: "",
let submitTimer = null;
const isDirty = computed(() =>
Boolean(form.realName || form.relation || form.message),
);
const discardConfirmation = createDiscardConfirmation((visible) => {
discardVisible.value = visible;
});
const requestDiscardConfirmation = discardConfirmation.request;
const confirmDiscard = discardConfirmation.confirm;
const cancelDiscard = discardConfirmation.cancel;
const sourceContract = computed(() =>
source.value === "invite"
? {
headerTitle: "确认关系并加入",
eyebrow: "邀请码直接加入",
formTitle: "确认加入",
headerTitle: "确认身份关系",
eyebrow: "邀请码定位预览",
formTitle: "核对家谱",
formCopy:
"请填写真实身份和亲属关系；提交后直接加入，无需等待管理员审核。",
"请填写真实身份和亲属关系；当前仅验证页面流程，不会变更成员身份。",
thirdFieldLabel: "补充信息",
thirdFieldPlaceholder: "选填：补充祖居地、长辈姓名等信息",
note: "邀请码来源提交后直接加入，无需等待审核。",
submitLabel: "确认加入",
submittingLabel: "正在加入…",
successEyebrow: "已加入家谱",
successTitle: "关系信息已提交",
errorEyebrow: "加入未完成",
errorTitle: "暂时无法加入家谱",
note: "后端尚未提供邀请码验证与直接入谱接口。",
submitLabel: "完成本地校验",
submittingLabel: "正在校验…",
successEyebrow: "本地校验完成",
successTitle: "信息尚未提交服务器",
errorEyebrow: "校验未完成",
errorTitle: "暂时无法完成校验",
nextLabel: "返回我的家谱",
successCopy: `已直接加入“${genealogyName.value}”，无需等待审核；返回后将刷新并选中这部家谱。`,
successCopy: `本地流程预览已完成“${genealogyName.value}”的身份填写；返回后不会选中或加入这部家谱。`,
}
: {
headerTitle: "申请加入家谱",
@@ -152,42 +188,84 @@ const sourceContract = computed(() =>
formCopy: "请填写真实身份和亲属关系，管理员审核后会通过消息告知结果。",
thirdFieldLabel: "申请说明",
thirdFieldPlaceholder: "补充祖居地、长辈姓名等核验信息",
note: "提交后可在“我的申请”中查看审核进度。",
submitLabel: "提交申请",
submittingLabel: "正在提交…",
successEyebrow: "申请已送达",
successTitle: "等待管理员核实亲属关系",
note: "当前仅验证页面流程，后端申请接口接入后才能正式提交。",
submitLabel: "完成本地校验",
submittingLabel: "正在校验…",
successEyebrow: "本地校验完成",
successTitle: "申请尚未提交服务器",
errorEyebrow: "申请未提交",
errorTitle: "暂时无法提交申请",
errorTitle: "暂时无法完成校验",
nextLabel: "查看我的申请",
successCopy: `“${genealogyName.value}”的管理员会在核实后给出结果，请留意消息中心。`,
successCopy: `本地流程预览已完成“${genealogyName.value}”的申请填写，当前不会新增审核记录。`,
},
);
const resultCopy = computed(() =>
joinState.value === "success"
? sourceContract.value.successCopy
: joinState.value === "ineligible"
? ({
owned: "这是你创建的家谱，无需重复提交加入申请。",
joined: "你已经是这部家谱的成员，无需重复申请。",
pending: "这部家谱已有待审核申请，请先查看申请进度。",
})[ineligibleRelation.value] ||
"当前家谱不存在、未公开或不可申请，请返回后重新选择。"
: errorMessage.value ||
"请检查网络后重新填写；未成功提交的内容不会进入审核列表。",
);
const ineligibleTitle = computed(
() =>
({
owned: "你已拥有这部家谱",
joined: "你已加入这部家谱",
pending: "申请正在审核中",
})[ineligibleRelation.value] || "无法打开申请表",
);
const ineligibleActionLabel = computed(
() =>
ineligibleRelation.value === "pending"
? "查看申请进度"
: ["owned", "joined"].includes(ineligibleRelation.value)
? "返回我的家谱"
: "返回上一页",
);
onLoad((query) => {
genealogyId.value = query.genealogyId || "";
genealogyId.value = String(query.genealogyId || "");
source.value = query.source === "invite" ? "invite" : "search";
previousRelation.value = ["rejected", "removed", "withdrawn"].includes(query.previous)
? query.previous
: "";
if (query.state === "success") {
joinState.value = "success";
return;
}
if (!genealogyId.value) {
errorMessage.value = "没有找到要申请加入的家谱，请先返回公开家谱检索。";
joinState.value = "error";
ineligibleRelation.value = "unknown";
joinState.value = "ineligible";
return;
}
genealogyName.value = query.genealogyName
? decodeURIComponent(query.genealogyName)
: genealogyPreview[genealogyId.value] || "这部家谱";
const fixture = findGenealogyFixture(genealogyId.value);
genealogyName.value = fixture?.name || "这部家谱";
const access = getGenealogyFixtureAccess(genealogyId.value);
if (!fixture || !access.canApply) {
ineligibleRelation.value = access.relation;
joinState.value = "ineligible";
return;
}
if (query.state === "success") joinState.value = "success";
});
const requestBack = () => {
if (joinState.value === "success") return completeFlow();
return runBackGuard({
transientOpen: discardVisible.value,
dirty: isDirty.value,
submitting: isSubmitting.value,
"close-transient": cancelDiscard,
"block-submitting": () => true,
"confirm-discard": requestDiscardConfirmation,
});
};
onBackPress((event) => handleBackPress(event, requestBack));
onUnload(() => {
const timer = submitTimer;
submitTimer = null;
if (timer) clearTimeout(timer);
discardConfirmation.dispose();
});
const submitJoin = () => {
@@ -195,9 +273,13 @@ const submitJoin = () => {
fieldErrors.realName = form.realName.trim() ? "" : "请填写真实姓名";
fieldErrors.relation = form.relation.trim() ? "" : "请填写与家谱的关系";
if (fieldErrors.realName || fieldErrors.relation) return;
const submitSnapshot = Object.freeze({ ...form });
isSubmitting.value = true;
setTimeout(() => {
joinState.value = form.realName.trim() === "失败" ? "error" : "success";
const timer = setTimeout(() => {
if (submitTimer !== timer) return;
submitTimer = null;
joinState.value =
submitSnapshot.realName.trim() === "失败" ? "error" : "success";
if (joinState.value === "error")
errorMessage.value =
source.value === "invite"
@@ -205,6 +287,7 @@ const submitJoin = () => {
: "申请暂未提交，请稍后重试。";
isSubmitting.value = false;
}, 280);
submitTimer = timer;
};
const clearFieldError = (field) => {
fieldErrors[field] = "";
@@ -213,14 +296,15 @@ const retryForm = () => {
joinState.value = "form";
errorMessage.value = "";
};
const toMyApplications = () =>
uni.redirectTo({ url: "/pages/genealogy/g09-my-applications" });
const toMyGenealogies = () =>
uni.reLaunch({
url: `/pages/genealogy/g01-my-genealogies?genealogyId=${genealogyId.value}`,
});
const handleIneligibleAction = () => {
if (ineligibleRelation.value === "pending")
return openPage("G09", { status: "pending" }, "G08");
if (["owned", "joined"].includes(ineligibleRelation.value))
return goRoot("G01", { genealogyId: genealogyId.value });
return goBack();
};
const completeFlow = () =>
source.value === "invite" ? toMyGenealogies() : toMyApplications();
source.value === "invite" ? returnTo("G01", {}) : returnTo("G09", {});
</script>
<style scoped lang="scss">