vue3-element-plus-app-chu 0.0.16 → 0.0.18

package/README.md

@@ -16,7 +16,7 @@ pnpm dev:backend  # 只启动后端（backend/ 目录，tsx watch）
 
 应用外壳位于 `src/layout/index.vue`，由 `App.vue` 通过 `RouterView` 挂载，统一承载侧边导航、折叠状态和业务页面内容。菜单配置在 `src/router/menus.ts`，路由表在 `src/router/index.ts`，新增业务页面时两处各追加一项即可。业务地址、浏览器前进后退和刷新都由 vue-router 驱动；头寸预报列表页由 `KeepAlive` 缓存，返回时保留筛选和分页状态。
 
-“注资/预注资管理”为一级分组菜单，下设“数字人民币注资明细查询”和“数字人民币账户行余额查询申请”。页面目录统一放在 `src/view/dcps/injection-management/` 下，路由分别为 `/injection-management/injection` 和 `/injection-management/balance`；旧地址 `/injection`、`/balance` 继续可用。
+“注资/预注资管理”为一级分组菜单，下设“数字人民币注资明细查询”和“数字人民币账户行余额查询申请”。页面目录统一放在 `src/view/dcps/funding/` 下，路由分别为 `/funding/injection` 和 `/funding/balance`；旧地址 `/injection`、`/balance` 继续可用。
 
 ## 数字人民币头寸预报
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue3-element-plus-app-chu",
-  "version": "0.0.16",
+  "version": "0.0.18",
   "private": false,
   "type": "module",
   "files": [

package/src/router/index.ts

@@ -1,9 +1,9 @@
 import { createRouter, createWebHistory, type RouteRecordRaw } from 'vue-router'
 import AppLayout from '@/layout/index.vue'
 import DigitalRmbAuthorization from '@/view/dcps/auth/index.vue'
-import DigitalRmbAccountBalance from '@/view/dcps/injection-management/balance/index.vue'
+import DigitalRmbAccountBalance from '@/view/dcps/funding/balance/index.vue'
 import DigitalRmbForecast from '@/view/dcps/forecast/index.vue'
-import DigitalRmbInjection from '@/view/dcps/injection-management/injection/index.vue'
+import DigitalRmbInjection from '@/view/dcps/funding/injection/index.vue'
 import DigitalRmbWriteOff from '@/view/dcps/write-off/index.vue'
 import DigitalRmbPositionEstimation from '@/view/dcps/estimation/index.vue'
 
@@ -65,8 +65,8 @@ const routes: RouteRecordRaw[] = [
         meta: { menu: 'estimation', title: '数字人民币头寸匡算' },
       },
       {
-        path: 'injection-management',
-        name: 'injection-management',
+        path: 'funding',
+        name: 'funding',
         redirect: { name: 'injection' },
         meta: { title: '注资/预注资管理' },
         children: [

package/src/router/menus.ts

@@ -15,7 +15,7 @@ export const layoutMenus: LayoutMenu[] = [
   { name: 'forecast', title: '数字人民币头寸预报', compactTitle: '头寸预报' },
   { name: 'estimation', title: '数字人民币头寸匡算', compactTitle: '匡算' },
   {
-    name: 'injection-management',
+    name: 'funding',
     title: '注资/预注资管理',
     compactTitle: '注资管理',
     children: [

package/src/view/dcps/README.md

@@ -1,8 +1,10 @@
 # DCPS 页面文件结构
 
-`src/view/dcps` 下每个业务页面统一保持三个文件，不再拆分子组件、工具文件或运行时配置：
+`src/view/dcps` 下每个业务页面统一保持三个文件，不再拆分子组件、工具文件：
 
-一级菜单为分组时，页面放在该分组目录下。例如“注资/预注资管理”的两个页面分别位于 `injection-management/injection/` 和 `injection-management/balance/`，各自保留下面三个文件。
+跨页面共用的运行时配置（默认查询日期、审批人等）和公共日期工具统一放在 `src/view/dcps/runtime.ts`，页面按需通过 `../runtime`（分组子页面为 `../../runtime`）引入；各页面不再内联重复定义。
+
+一级菜单为分组时，页面放在该分组目录下。例如“注资/预注资管理”的两个页面分别位于 `funding/injection/` 和 `funding/balance/`，各自保留下面三个文件。
 
 | 文件 | 用途 |
 | --- | --- |
@@ -30,9 +32,9 @@
 | `/forecast/:predRefNo/edit` | `forecast-edit` | `forecast/index.vue` | 修改（`mode: 'edit'`） | 修改数字人民币头寸预报 |
 | `/forecast/:predRefNo` | `forecast-detail` | `forecast/index.vue` | 详情（`mode: 'detail'`） | 数字人民币头寸预报详情 |
 | `/estimation` | `estimation` | `estimation/index.vue` | 页面 | 数字人民币头寸匡算 |
-| `/injection-management` | `injection-management` | — | 重定向到 `injection` | 注资/预注资管理 |
-| `/injection-management/injection` | `injection` | `injection-management/injection/index.vue` | 页面 | 数字人民币注资明细查询 |
-| `/injection-management/balance` | `balance` | `injection-management/balance/index.vue` | 页面 | 数字人民币账户行余额查询申请 |
+| `/funding` | `funding` | — | 重定向到 `injection` | 注资/预注资管理 |
+| `/funding/injection` | `injection` | `funding/injection/index.vue` | 页面 | 数字人民币注资明细查询 |
+| `/funding/balance` | `balance` | `funding/balance/index.vue` | 页面 | 数字人民币账户行余额查询申请 |
 | `/auth` | `auth` | `auth/index.vue` | 页面 | 数字人民币授权 |
 | `/write-off` | `write-off` | `write-off/index.vue` | 页面 | 数字人民币核销 |
 | `/` | — | 重定向到 `forecast` | — | — |
@@ -43,13 +45,13 @@
 - 头寸预报的列表、新增、修改、详情共用 `forecast/index.vue`，通过路由 `props.mode` 切换页面形态；修改和详情通过 `props.predRefNo` 接收路由参数。
 - `forecast/index.vue` 顶部使用一个普通 `<script>` 块保存列表记录缓存，跳转修改或详情前暂存列表行，用于补齐详情接口未返回的字段。
 - 侧边菜单配置在 `src/router/menus.ts`，其中 `name` 必须与对应路由的 `name` 保持一致；分组菜单通过 `children` 配置二级页面，页面的 `meta.menu` 指向自己的菜单项。
-- “注资/预注资管理”对应 `injection-management` 分组，包含注资明细查询和账户行余额查询申请两个页面；访问子页面时自动展开父菜单。旧地址 `/injection`、`/balance` 保留为对应页面的别名。
+- “注资/预注资管理”对应 `funding` 分组，包含注资明细查询和账户行余额查询申请两个页面；访问子页面时自动展开父菜单。旧地址 `/injection`、`/balance` 保留为对应页面的别名。
 - `src/layout/index.vue` 使用 `<KeepAlive include="DcpsForecastPage">` 缓存头寸预报页面；新增、修改、详情按路由 `key` 分别缓存，返回列表时自动重新查询。
 
 ## 新增页面检查清单
 
 1. 在 `src/view/dcps/<模块>/` 下新建 `index.vue`；如归属某个分组，放在 `src/view/dcps/<分组>/<模块>/` 下，并添加 `defineOptions({ name: 'Dcps<模块>Page' })`。
-2. 同目录补充 `api.ts`、`typs.ts`；不要再创建 `components/`、`utils.ts`、`runtime.ts` 等额外文件。
+2. 同目录补充 `api.ts`、`typs.ts`；不要再创建 `components/`、`utils.ts` 等额外文件。默认日期、审批人等运行时默认值统一加入根目录 `runtime.ts`，不要在页面里重复定义。
 3. 弹窗、子表格、表单直接写在 `index.vue` 中；工具函数写在 `index.vue` 的 `<script setup>` 内。
 4. 在 `src/router/index.ts` 中新增路由；分组页面添加到对应分组路由的 `children` 下，配置 `path`、`name`、`component`、`meta.menu`、`meta.title`。
 5. 如需出现在侧边菜单，在 `src/router/menus.ts` 中追加菜单项或添加到分组的 `children` 中，`name` 与对应路由名一致。

package/src/view/dcps/auth/index.vue

@@ -3,19 +3,12 @@ import { computed, onBeforeUnmount, onMounted, reactive, ref } from 'vue'
 import { ElMessage } from 'element-plus'
 import { ArtDataTable, type ColumnOption, type PaginationOptions, type TableSettings } from '@/components/table'
 import API from './api'
+import { authRuntime } from '../runtime'
 import type { AuthorizationFilters, AuthorizationQueryParams, AuthorizationTask } from './typs'
 
 defineOptions({ name: 'DcpsAuthPage' })
 
 type Decision = 'approve' | 'reject'
-
-// 授权页面的审批人和默认创建日期；日期格式为 YYYYMMDD。
-const authorizationRuntime = {
-  approverId: '10092', // 审批人工号。
-  approverName: '王干事', // 审批人姓名。
-  createTmBegin: '20261012', // 默认创建开始日期。
-  createTmEnd: '20261012', // 默认创建结束日期。
-}
 type AmountSortOrder = 'ascending' | 'descending' | null
 
 // 初始查询条件；空字符串表示不限制该条件，重置时恢复此配置。
@@ -28,8 +21,8 @@ const defaultFilters: AuthorizationFilters = {
 }
 // 默认创建日期范围：[开始日期, 结束日期]，格式为 YYYYMMDD，查询重置时使用。
 const defaultDates: [string, string] = [
-  authorizationRuntime.createTmBegin,
-  authorizationRuntime.createTmEnd,
+  authRuntime.createTmBegin,
+  authRuntime.createTmEnd,
 ]
 
 // 重复输入项共用一份配置，依次为字段、名称和长度限制。
@@ -277,8 +270,8 @@ const getQueryFilters = () => ({
   payeeName: filters.value.payeeName.trim(), // 收款人名称。
   platfSeqNo: filters.value.platfSeqNo.trim(), // 平台流水号。
   taskSts: filters.value.taskSts, // 任务状态，空值表示全部。
-  createTmBegin: dateRange.value?.[0] || authorizationRuntime.createTmBegin, // 创建开始日期，格式为 YYYYMMDD，未选择时取默认值。
-  createTmEnd: dateRange.value?.[1] || dateRange.value?.[0] || authorizationRuntime.createTmEnd, // 创建结束日期，格式为 YYYYMMDD，缺失时回退到开始日期或默认值。
+  createTmBegin: dateRange.value?.[0] || authRuntime.createTmBegin, // 创建开始日期，格式为 YYYYMMDD，未选择时取默认值。
+  createTmEnd: dateRange.value?.[1] || dateRange.value?.[0] || authRuntime.createTmEnd, // 创建结束日期，格式为 YYYYMMDD，缺失时回退到开始日期或默认值。
 })
 // 仅查询、重置时更新；翻页和刷新沿用这份条件。
 let appliedQuery = getQueryFilters()
@@ -362,8 +355,8 @@ const openDecisionDialog = (task: any) => {
 const submitDecision = async (decision: Decision) => {
   const platfSeqNo = selectedTask.value?.platfSeqNo?.trim() // 本次审批任务的平台流水号，用于唯一定位任务。
   if (!canApprove(selectedTask.value) || !platfSeqNo || pendingDecision.value || loading.value) return
-  const approverId = authorizationRuntime.approverId.trim() // 本次提交的审批人工号，同时作为公共用户标识。
-  const approverName = authorizationRuntime.approverName.trim() // 本次提交的审批人姓名。
+  const approverId = authRuntime.approverId.trim() // 本次提交的审批人工号，同时作为公共用户标识。
+  const approverName = authRuntime.approverName.trim() // 本次提交的审批人姓名。
   const remarkText = remark.value.trim() // 去除首尾空白后的备注或拒绝原因。
   if (!approverId || !approverName) {
     ElMessage.warning('审批人信息未设置')
@@ -578,12 +571,12 @@ onBeforeUnmount(() => {
         <el-row :gutter="14">
           <el-col :xs="24" :sm="12">
             <el-form-item label="审批人工号">
-              <el-input :model-value="authorizationRuntime.approverId" disabled />
+              <el-input :model-value="authRuntime.approverId" disabled />
             </el-form-item>
           </el-col>
           <el-col :xs="24" :sm="12">
             <el-form-item label="审批人姓名">
-              <el-input :model-value="authorizationRuntime.approverName" readonly />
+              <el-input :model-value="authRuntime.approverName" readonly />
             </el-form-item>
           </el-col>
         </el-row>

package/src/view/dcps/estimation/index.vue

@@ -2,6 +2,7 @@
 import { computed, onBeforeUnmount, onMounted, reactive, ref } from 'vue'
 import { ElMessage } from 'element-plus'
 import API from './api'
+import { getToday } from '../runtime'
 import type {
   EstimationAmounts, EstimationCell, EstimationPredRow, EstimationQueryParams, EstimationTranRow,
 } from './typs'
@@ -40,15 +41,6 @@ const getErrorMessage = (error: unknown): string => {
   return '操作失败，请稍后重试'
 }
 
-/** 业务日期始终按上海时区生成，不依赖浏览器所在时区，格式为 YYYYMMDD。 */
-const getToday = (): string => {
-  const parts = new Intl.DateTimeFormat('en-CA', {
-    timeZone: 'Asia/Shanghai', year: 'numeric', month: '2-digit', day: '2-digit',
-  }).formatToParts(new Date())
-  const read = (type: Intl.DateTimeFormatPartTypes) => parts.find((part) => part.type === type)?.value || ''
-  return read('year') + read('month') + read('day')
-}
-
 /** 判断是否为合法的 YYYYMMDD 日期。 */
 const isValidDate = (value: string): boolean => {
   if (!/^\d{8}$/.test(value)) return false

package/src/view/dcps/forecast/index.vue

@@ -24,6 +24,7 @@ import { computed, onActivated, onBeforeUnmount, reactive, ref, watch } from 'vu
 import { useRouter } from 'vue-router'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import API from './api'
+import { forecastRuntime, getToday } from '../runtime'
 import { ArtDataTable, type ColumnOption, type PaginationOptions, type TableSettings } from '@/components/table'
 import type {
   ApiResponse,
@@ -78,15 +79,6 @@ const getErrorMessage = (error: unknown): string => {
   return '操作失败，请稍后重试'
 }
 
-/** 业务日期始终按上海时区生成，不依赖浏览器所在时区，格式为 YYYYMMDD。 */
-const getToday = (): string => {
-  const parts = new Intl.DateTimeFormat('en-CA', {
-    timeZone: 'Asia/Shanghai', year: 'numeric', month: '2-digit', day: '2-digit',
-  }).formatToParts(new Date())
-  const read = (type: Intl.DateTimeFormatPartTypes) => parts.find((part) => part.type === type)?.value || ''
-  return read('year') + read('month') + read('day')
-}
-
 /** 判断是否为合法的 YYYYMMDD 日期。 */
 const isValidDate = (value: string): boolean => {
   if (!/^\d{8}$/.test(value)) return false
@@ -225,7 +217,7 @@ onBeforeUnmount(() => { disposed = true })
 
 type ListMutation = 'delete' | null
 const createFilters = (): ForecastFilters => ({
-  tranDate: getToday(), clientName: '', competName: '', payDirec: '', busiType: '', payChannel: '',
+  tranDate: forecastRuntime.tranDate, clientName: '', competName: '', payDirec: '', busiType: '', payChannel: '',
   groundBranch: '', predStatus: '', verifyStatus: '', startTransAmt: '', endTransAmt: '', sortRule: '',
 })
 const listFilters = ref(createFilters())

package/src/view/dcps/{injection-management → funding}/balance/index.vue

@@ -245,7 +245,7 @@ onBeforeUnmount(() => {
         <span v-if="lastQueryTime" class="balance-updated">最近查询：{{ lastQueryTime }}</span>
         <span class="balance-actions">
           <el-button @click="openCreateDialog">注资/预注资发起</el-button>
-          <el-button type="primary" :loading="loading">查询</el-button>
+          <el-button type="primary" :loading="loading" @click="query()">查询</el-button>
         </span>
       </div>
     </el-card>

package/src/view/dcps/runtime.ts

@@ -0,0 +1,35 @@
+/**
+ * dcps 各页面共用的运行时配置；默认日期、审批人等全局默认值统一维护在本文件，
+ * 页面通过 `../runtime`（或分组子页面的 `../../runtime`）按需引入。
+ */
+
+/**
+ * 业务日期始终按上海时区生成，不依赖浏览器所在时区，格式为 YYYYMMDD。
+ * 供各页面的默认查询日期和新增表单初始值使用。
+ */
+export const getToday = (): string => {
+  const parts = new Intl.DateTimeFormat('en-CA', {
+    timeZone: 'Asia/Shanghai', year: 'numeric', month: '2-digit', day: '2-digit',
+  }).formatToParts(new Date())
+  const read = (type: Intl.DateTimeFormatPartTypes) => parts.find((part) => part.type === type)?.value || ''
+  return read('year') + read('month') + read('day')
+}
+
+/** 预报页面的默认查询日期；日期格式为 YYYYMMDD。 */
+export const forecastRuntime = {
+  tranDate: getToday(), // 默认交易日期，查询和重置时使用。
+}
+
+/** 授权页面的审批人和默认创建日期；日期格式为 YYYYMMDD，当前使用固定日期。 */
+export const authRuntime = {
+  approverId: '10092', // 审批人工号。
+  approverName: '王干事', // 审批人姓名。
+  createTmBegin: '20261012', // 默认创建开始日期。
+  createTmEnd: '20261012', // 默认创建结束日期。
+}
+
+/** 按模块名聚合的运行时配置；也可从本文件直接引入单个模块的配置。 */
+export default {
+  forecast: forecastRuntime,
+  auth: authRuntime,
+}

package/src/view/dcps/write-off/index.vue

@@ -2,6 +2,7 @@
 import { computed, onBeforeUnmount, onMounted, reactive, ref } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import API from './api'
+import { getToday } from '../runtime'
 import { ArtDataTable, type ColumnOption, type PaginationOptions, type TableSettings } from '@/components/table'
 import type {
   CancelWriteOffPredItem, EditVerifyFormValues, FlowRow, ForecastRow, WriteOffFlowInput, WriteOffForecastItem, WriteOffItemInput,
@@ -51,15 +52,6 @@ const getErrorMessage = (error: unknown): string => {
   return '操作失败，请稍后重试'
 }
 
-/** 业务日期始终按上海时区生成，不依赖浏览器所在时区，格式为 YYYYMMDD。 */
-const getToday = (): string => {
-  const parts = new Intl.DateTimeFormat('en-CA', {
-    timeZone: 'Asia/Shanghai', year: 'numeric', month: '2-digit', day: '2-digit',
-  }).formatToParts(new Date())
-  const read = (type: Intl.DateTimeFormatPartTypes) => parts.find((part) => part.type === type)?.value || ''
-  return read('year') + read('month') + read('day')
-}
-
 /** 判断是否为合法的 YYYYMMDD 日期。 */
 const isValidDate = (value: string): boolean => {
   if (!/^\d{8}$/.test(value)) return false