feat(tender): 忘记密码与修改密码页（10 套模板通用）

密码找回（材料审核制，见 ADR 0008） - app/pages/forgot-password.vue：两个页签——「提交申请」（企业名称 + 纳税人识别号 + 新密码 + 确认 + 授权委托书，复用 POST /api/tender/upload，并照 HjcEnterpriseForm 做 5M 校验）与「查询进度」（双要素查询，展示状态与时间、驳回原因）。提交后自动把条件带到查询页签。文案纪律：「已通过」≠「已重置」。修改密码（登录态，双因子） - app/pages/change-password.vue：旧密码 + 短信验证码（60s 倒计时，照 register.vue）+ 新密码 + 确认；成功后清本机凭据并显示「去登录」面板。 BFF 与封装 - server/api/tender/password/{apply.post,status.get,sms.post,change.put}.ts：四条都照 register.post.ts 的透传范式（modulesApiBase + TenantId（header 与 query 都带）+ 原样返回 ApiResult，HTTP 恒 200）。前两条**匿名**（与 sms/upload 一致，不读 cookie）；后两条需登录态，从 cookie hjc_token 或 Authorization 头取 token 拼 Bearer。 - app/composables/useHjcPassword.ts：四条请求单独成一支，不塞进 useHjcAuth——找回的两条是匿名的、不做 401 跳转；修改密码的两条经 handleAuthCode 处理登录态。接线 - app/pages/login.vue：加「忘记密码？」入口。 - app/components/HjcUserBar.vue：已登录菜单加「修改密码」。落点说明：新页面直接放 app/pages/*.vue——静态段路由优先于 app/pages/[slug].vue 的动态段，故不必动 useTemplate.ts / templates/index.ts，与 login.vue、register.vue 完全同款做法，10 套模板自动可用。验证：针对本次文件 npx eslint 0 error；pnpm run build 成功且四条新 BFF 都出现在产物里。未验：未起 mp-java 做端到端（见 .scratch/hjc-password/issues/06）。
2026-09-17 02:35:45 +08:00
parent 5b6e1b67bc
commit 81ef9317c7
9 changed files with 664 additions and 0 deletions
@@ -0,0 +1,259 @@
+<template>
+  <div class="flex min-h-[60vh] items-center justify-center px-4 py-10">
+    <div class="w-full max-w-2xl rounded-lg border border-gray-200 p-8">
+      <h1 class="text-center text-2xl font-bold text-gray-900">忘记密码</h1>
+      <p class="mt-2 text-center text-sm text-gray-500">
+        提交企业材料后由平台人工审核，审核通过后重置密码
+      </p>
+
+      <div class="mt-6 flex rounded-md border border-gray-200 text-sm">
+        <button
+          type="button"
+          class="flex-1 py-2"
+          :class="tab === 'apply' ? 'bg-blue-50 font-medium text-blue-600' : 'text-gray-600'"
+          @click="tab = 'apply'"
+        >
+          提交申请
+        </button>
+        <button
+          type="button"
+          class="flex-1 py-2"
+          :class="tab === 'query' ? 'bg-blue-50 font-medium text-blue-600' : 'text-gray-600'"
+          @click="tab = 'query'"
+        >
+          查询进度
+        </button>
+      </div>
+
+      <!-- ============ 提交申请 ============ -->
+      <form v-if="tab === 'apply'" class="mt-6 space-y-4" @submit.prevent="submitApply">
+        <div class="rounded-md bg-amber-50 px-3 py-2 text-xs leading-relaxed text-amber-700">
+          忘记密码走材料审核，不是自助改密：平台审核通过后仍需在核心实例侧执行重置，
+          届时状态会从「已通过，等待平台执行重置」变为「已重置」，请以「查询进度」的结果为准。
+        </div>
+
+        <div>
+          <label class="text-sm text-gray-600">企业名称（登录账号）</label>
+          <input v-model="applyForm.enterpriseName" class="mt-1 w-full rounded-md border border-gray-300 px-4 py-2 text-sm" placeholder="请输入企业名称" />
+        </div>
+        <div>
+          <label class="text-sm text-gray-600">纳税人识别号</label>
+          <input v-model="applyForm.creditCode" class="mt-1 w-full rounded-md border border-gray-300 px-4 py-2 text-sm" placeholder="请输入统一社会信用代码" />
+        </div>
+        <div>
+          <label class="text-sm text-gray-600">新密码</label>
+          <input v-model="applyForm.newPassword" type="password" class="mt-1 w-full rounded-md border border-gray-300 px-4 py-2 text-sm" placeholder="至少 8 位，且包含字母和数字" />
+        </div>
+        <div>
+          <label class="text-sm text-gray-600">确认新密码</label>
+          <input v-model="applyForm.confirmPassword" type="password" class="mt-1 w-full rounded-md border border-gray-300 px-4 py-2 text-sm" placeholder="请再次输入新密码" />
+        </div>
+
+        <div>
+          <label class="block text-sm text-gray-600">授权委托书（本次重新签署，单张不超过 5M）</label>
+          <div class="mt-1 flex items-center gap-2">
+            <input ref="fileInput" type="file" accept="image/*" class="hidden" @change="onPickHandbook" />
+            <button
+              type="button"
+              class="rounded-md border border-gray-300 px-4 py-2 text-sm text-gray-600 hover:bg-gray-50"
+              @click="fileInput?.click()"
+            >
+              {{ handbookUrl ? '重新选择' : '选择图片' }}
+            </button>
+            <img v-if="handbookUrl" :src="handbookUrl" alt="授权委托书" class="h-10 w-16 rounded border border-gray-200 object-cover" />
+            <span v-if="handbookUrl" class="text-xs text-green-600">已上传</span>
+          </div>
+          <p class="mt-1 text-xs text-gray-400">
+            请上传本次新签署的授权委托书；平台会与资质档案中留存的那份一并核对。
+          </p>
+        </div>
+
+        <button
+          type="submit"
+          class="w-full rounded-md bg-blue-600 py-3 font-medium text-white hover:bg-blue-700 disabled:opacity-50"
+          :disabled="loading"
+        >
+          {{ loading ? '提交中...' : '提交申请' }}
+        </button>
+        <p v-if="error" class="text-center text-sm text-red-500">{{ error }}</p>
+        <p v-if="submitted" class="text-center text-sm text-green-600">{{ submittedMessage }}</p>
+      </form>
+
+      <!-- ============ 查询进度 ============ -->
+      <form v-else class="mt-6 space-y-4" @submit.prevent="submitQuery">
+        <div>
+          <label class="text-sm text-gray-600">企业名称</label>
+          <input v-model="queryForm.enterpriseName" class="mt-1 w-full rounded-md border border-gray-300 px-4 py-2 text-sm" placeholder="请输入企业名称" />
+        </div>
+        <div>
+          <label class="text-sm text-gray-600">纳税人识别号</label>
+          <input v-model="queryForm.creditCode" class="mt-1 w-full rounded-md border border-gray-300 px-4 py-2 text-sm" placeholder="请输入统一社会信用代码" />
+        </div>
+        <button
+          type="submit"
+          class="w-full rounded-md bg-blue-600 py-3 font-medium text-white hover:bg-blue-700 disabled:opacity-50"
+          :disabled="loading"
+        >
+          {{ loading ? '查询中...' : '查询进度' }}
+        </button>
+        <p v-if="error" class="text-center text-sm text-red-500">{{ error }}</p>
+
+        <div v-if="queried" class="rounded-md border border-gray-200 p-4 text-sm">
+          <p v-if="!status" class="text-gray-500">
+            未查询到申请记录，请核对企业名称与纳税人识别号是否与营业执照一致。
+          </p>
+          <dl v-else class="space-y-2">
+            <div class="flex">
+              <dt class="w-24 shrink-0 text-gray-500">当前状态</dt>
+              <dd class="font-medium text-gray-900">{{ status.statusText }}</dd>
+            </div>
+            <div class="flex">
+              <dt class="w-24 shrink-0 text-gray-500">申请时间</dt>
+              <dd class="text-gray-700">{{ status.applyTime || '-' }}</dd>
+            </div>
+            <div v-if="status.auditTime" class="flex">
+              <dt class="w-24 shrink-0 text-gray-500">审核时间</dt>
+              <dd class="text-gray-700">{{ status.auditTime }}</dd>
+            </div>
+            <div v-if="status.resetTime" class="flex">
+              <dt class="w-24 shrink-0 text-gray-500">重置时间</dt>
+              <dd class="text-gray-700">{{ status.resetTime }}</dd>
+            </div>
+            <div v-if="status.rejectReason" class="flex">
+              <dt class="w-24 shrink-0 text-gray-500">驳回原因</dt>
+              <dd class="text-gray-700">{{ status.rejectReason }}</dd>
+            </div>
+          </dl>
+          <p v-if="status && status.status === 1" class="mt-3 rounded-md bg-amber-50 px-3 py-2 text-xs leading-relaxed text-amber-700">
+            审核已通过，平台正在执行密码重置。重置完成后状态会变为「已重置」，届时可用新密码登录。
+          </p>
+        </div>
+      </form>
+
+      <p class="mt-4 text-center text-sm text-gray-500">
+        <NuxtLink to="/login" class="text-blue-600 hover:underline">返回登录</NuxtLink>
+      </p>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { HjcPasswordApplyStatus } from '~/composables/useHjcPassword'
+
+const { applyPasswordReset, fetchApplyStatus } = useHjcPassword()
+
+/** 密码强度：与后端（核心实例）一致，先在前端挡一道，免得提交后才被拒 */
+const PASSWORD_PATTERN = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d@$!%*#?&]{8,}$/
+const MAX_UPLOAD_SIZE = 5 * 1024 * 1024
+
+const tab = ref<'apply' | 'query'>('apply')
+const loading = ref(false)
+const error = ref('')
+const submitted = ref(false)
+const submittedMessage = ref('')
+
+const applyForm = ref({
+  enterpriseName: '',
+  creditCode: '',
+  newPassword: '',
+  confirmPassword: ''
+})
+const handbookUrl = ref('')
+const fileInput = ref<HTMLInputElement | null>(null)
+
+const queryForm = ref({ enterpriseName: '', creditCode: '' })
+const queried = ref(false)
+const status = ref<HjcPasswordApplyStatus | null>(null)
+
+/** 上传授权委托书：复用注册/资质页的匿名上传接口，单张 5M 上限与它们一致 */
+async function onPickHandbook(e: Event) {
+  const input = e.target as HTMLInputElement
+  const file = input.files?.[0]
+  input.value = ''
+  if (!file) return
+  if (file.size > MAX_UPLOAD_SIZE) {
+    error.value = '单张图片不超过 5M'
+    return
+  }
+  error.value = ''
+  try {
+    const fd = new FormData()
+    fd.append('file', file)
+    const res: any = await $fetch('/api/tender/upload', { method: 'POST', body: fd })
+    handbookUrl.value = res?.url || ''
+    if (!handbookUrl.value) error.value = '上传失败，请重试'
+  } catch (e: any) {
+    error.value = e?.data?.statusMessage || e?.data?.message || '上传失败，请重试'
+  }
+}
+
+async function submitApply() {
+  error.value = ''
+  submitted.value = false
+  const f = applyForm.value
+  if (!f.enterpriseName.trim() || !f.creditCode.trim()) {
+    error.value = '请输入企业名称和纳税人识别号'
+    return
+  }
+  if (!f.newPassword || !f.confirmPassword) {
+    error.value = '请输入新密码并再次确认'
+    return
+  }
+  if (f.newPassword !== f.confirmPassword) {
+    error.value = '两次输入的新密码不一致'
+    return
+  }
+  if (!PASSWORD_PATTERN.test(f.newPassword)) {
+    error.value = '密码至少 8 位，且包含字母和数字'
+    return
+  }
+  if (!handbookUrl.value) {
+    error.value = '请上传授权委托书'
+    return
+  }
+  loading.value = true
+  try {
+    const res = await applyPasswordReset({
+      enterpriseName: f.enterpriseName.trim(),
+      creditCode: f.creditCode.trim(),
+      newPassword: f.newPassword,
+      confirmPassword: f.confirmPassword,
+      handbookUrl: handbookUrl.value
+    })
+    if (!res.ok) {
+      error.value = res.message || '提交失败'
+      return
+    }
+    submitted.value = true
+    submittedMessage.value =
+      res.message ||
+      '申请已提交，请等待平台审核。审核期间可在「查询进度」查看结果；若长时间无进展，请核对所填信息是否与营业执照一致。'
+    // 提交后把条件带到查询页签，省掉用户再输一遍
+    queryForm.value.enterpriseName = f.enterpriseName.trim()
+    queryForm.value.creditCode = f.creditCode.trim()
+  } finally {
+    loading.value = false
+  }
+}
+
+async function submitQuery() {
+  error.value = ''
+  const f = queryForm.value
+  if (!f.enterpriseName.trim() || !f.creditCode.trim()) {
+    error.value = '请输入企业名称和纳税人识别号'
+    return
+  }
+  loading.value = true
+  try {
+    const res = await fetchApplyStatus(f.enterpriseName.trim(), f.creditCode.trim())
+    if (!res.ok) {
+      error.value = res.message || '查询失败'
+      return
+    }
+    status.value = res.data
+    queried.value = true
+  } finally {
+    loading.value = false
+  }
+}
+</script>