vue3-element-plus-app-chu 0.0.22 → 0.0.23

package/README.md

@@ -30,8 +30,8 @@ pnpm dev:backend  # 只启动后端（backend/ 目录，tsx watch）
 - 模块目录与授权页面保持一致：`api.ts` 只放接口定义，`utils.ts` 放日期、金额、表单校验等共用工具，`typs.ts` 类型，`runtime.ts` 默认交易日期，`index.vue` 为入口，`components/` 放页面外壳和列表、新增修改、详情页面。接口定义只维护在各自模块下，不再集中到 `src/api`。
 - 新增、修改、详情页面每行四列展示，窗口变窄后依次降为三列、两列、一列。
 
-本地后端的预报接口当前使用通用模拟响应，写入成功响应不代表真实持久化。
+本地后端已接入 MongoDB 业务模拟，预报增删改查、核销、注资余额、匡算历史和参数均可持久化。JSON 响应统一为 `{ code, data, message }`，TAM 的 `head/body` 位于 `data` 中，前端公共请求层自动解包。服务端导入协议尚未实现时明确返回 `501`。完整运行说明见 [后端 README](backend/README.md)。
 
 ## 城银清头寸参数接口
 
-新增、修改、删除、查询、详情五个接口的封装及类型位于 `src/view/dcps/city-clearing/parameters/`，本次仅提供接口层。城银清查询与详情使用 `moduleCode: '3'`。本地后端提供符合字段契约的模拟响应及参数校验，写操作不持久化；接口字段和示例见 [城银清头寸参数接口说明](docs/city-clearing-parameters-apis.md)，Scalar 文档入口为后端 `/docs`。
+参数管理接口已支持持久化增删改查、关键词筛选和分页。数币页面位于 `src/view/dcps/parameters/`，使用 `moduleCode: '5'`；页面详情直接取表格行数据，不再请求详情接口。同一后端也支持城银清模块 `'3'`。参数名称全局唯一，修改和删除按名称定位；接口字段和示例见 [城银清头寸参数接口说明](docs/city-clearing-parameters-apis.md)，Scalar 文档入口为后端 `/docs`。

package/package.json

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

package/src/utils/request.ts

@@ -30,13 +30,13 @@ export interface TamResponseHead {
   [field: string]: unknown
 }
 
-/** TAM 接口直接返回公共响应头和业务体，不再增加额外包装。 */
+/** 页面使用的 TAM 数据；请求层从统一响应的 data 中读取。 */
 export interface ApiResponse<T = unknown> {
   head: TamResponseHead
   body: T | null
 }
 
-/** 非 TAM 接口沿用原有响应格式。 */
+/** 后端统一的 JSON 外层响应格式。 */
 export interface StandardApiResponse<T = unknown> {
   code: number
   data: T | null
@@ -124,7 +124,7 @@ http.interceptors.response.use(
 
 type RequestConfig = Omit<HttpRequestConfig, 'url' | 'method'>
 
-// 泛型 T 表示完整响应结构；直接透传服务端 JSON，保留 head、body 和公共头字段。
+// TAM 接口将统一响应中的 data 解包，页面继续使用 head/body。
 export const request = async <T = ApiResponse>(
   config: HttpRequestConfig,
 ): Promise<T> => {
@@ -132,6 +132,12 @@ export const request = async <T = ApiResponse>(
     ...config,
     data: createTamEnvelope(config.data),
   })
+  const payload: unknown = response.data
+  if (/^\/TAM(?:\/|$)/i.test(config.url ?? '')
+    && isPlainObject(payload) && typeof payload.code === 'number') {
+    if (payload.code !== 0) throw new Error(typeof payload.message === 'string' ? payload.message : '请求失败')
+    return payload.data as T
+  }
   return response.data
 }
 

package/src/view/dcps/README.md

@@ -48,7 +48,7 @@
 - `forecast/index.vue` 顶部使用一个普通 `<script>` 块保存列表记录缓存，跳转修改或详情前暂存列表行，用于补齐详情接口未返回的字段。
 - 侧边菜单配置在 `src/router/menus.ts`，其中 `name` 必须与对应路由的 `name` 保持一致；分组菜单通过 `children` 配置二级页面，页面的 `meta.menu` 指向自己的菜单项。
 - “注资/预注资管理”对应 `funding` 分组，包含注资明细查询和账户行余额查询申请两个页面；访问子页面时自动展开父菜单。旧地址 `/injection`、`/balance` 保留为对应页面的别名。
-- 数字人民币参数管理为末尾的独立菜单，页面文件为 `parameters/index.vue`、`parameters/api.ts`、`parameters/typs.ts`，接口与类型均独立定义在该目录，不再依赖或保留 `city-clearing/` 目录。页面复用“城银清算头寸管理－头寸参数”的五个接口，`api.ts` 参照授权页面直接向 `@chic/http` 平铺传参，由 Axios 公共封装拆分为服务端所需的 `body`、`head` 等字段，不手动包装信封。页面查询调用只传 `keywords`、数字类型的 `pageIndex` 和 `pageSize`，`moduleCode: '5'` 由 API 内部固定添加，分页数字由封装层转换为字符串；详情只传参数名称，新增传六个字符串表单字段，两者的模块代码也由 API 固定添加。本次用户确认以 `paraName` 定位修改和删除：修改时锁定原参数名称、参数标志只读；删除向 API 传名称数组，由 API 转为平铺的 `sysParaList`。页面类型使用 `DigitalRmbParameter` 等独立类型，原始 Swagger 契约及 `docs/city-clearing-parameters*` 文档文件名保留。当前本地后端仍返回模拟结果，不保存参数。
+- 数字人民币参数管理为末尾的独立菜单，页面文件为 `parameters/index.vue`、`parameters/api.ts`、`parameters/typs.ts`，接口与类型均独立定义在该目录，不再依赖或保留 `city-clearing/` 目录。页面复用“城银清算头寸管理－头寸参数”的列表、新增、修改、删除四个接口，详情直接取表格行数据，不再请求详情接口；`api.ts` 参照授权页面直接向 `@chic/http` 平铺传参，由 Axios 公共封装拆分为服务端所需的 `body`、`head` 等字段，不手动包装信封。页面查询调用只传 `keywords`、数字类型的 `pageIndex` 和 `pageSize`，`moduleCode: '5'` 由 API 内部固定添加，分页数字由封装层转换为字符串；新增传六个字符串表单字段，模块代码也由 API 固定添加。本次用户确认以 `paraName` 定位修改和删除：修改时锁定原参数名称、参数标志只读；删除向 API 传名称数组，由 API 转为平铺的 `sysParaList`。页面类型使用 `DigitalRmbParameter` 等独立类型，原始 Swagger 契约及 `docs/city-clearing-parameters*` 文档文件名保留。当前本地后端仍返回模拟结果，不保存参数。
 - 数字人民币参数管理以数字人民币授权页面为布局参考，统一筛选区、填满剩余高度的表格以及包含摘要和分组字段的详情弹窗样式。
 - `src/layout/index.vue` 使用 `<KeepAlive include="DcpsForecastPage">` 缓存头寸预报页面；新增、修改、详情按路由 `key` 分别缓存，返回列表时自动重新查询。
 

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

@@ -615,6 +615,8 @@ onBeforeUnmount(() => {
 .dcps-page {
   box-sizing: border-box;
   display: flex;
+  width: 100%;
+  max-width: 100%;
   flex-direction: column;
   gap: 5px;
   height: calc(100vh - var(--dpcs-host-layout-height));

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

@@ -16,22 +16,23 @@ const tableSize = 'small'
 // 历史预计调拨金额接口（140503004）预填金额，允许手工调整后重新匡算。
 // 匡算结果（140503001）以合并单元格的头寸匡算表展示，样式与业务原型一致；
 // 「今日预计调拨金额」行的收入、支付单元格就是查询条件输入框，随历史记录预填；
-// 导出按钮暂未接线（下载协议待确认）；单击其余金额单元格按位置编码查询详情（140503003）。
+// 导出按钮暂未接线（下载协议待确认）；单击可查看明细的金额单元格按位置编码查询详情（140503003）。
 
 // 接口字段编码与图中报表位置的对应关系：
 // C3 城商行支付清算账户前一日余额；C6/D6 报备金额；C7/D7 未核销金额；
 // C8/D8 未核销业务流水；C11/D11 今日预计调拨金额（查询条件输入框，不查详情）；
-// B15 当日实时余额。轧差列由前端按「收入减支出」计算：结果行随查询结果更新，
+// B15 当日实时余额。C3、B15 仅展示余额，不提供明细弹窗。
+// 轧差列由前端按「收入减支出」计算：结果行随查询结果更新，
 // 调拨行随输入实时更新；日初可用资金、预留金额及两条空行暂无接口字段，先按原型占位留空。
+
+// 仅登记可查看明细的单元格；C3、B15 为余额展示，不参与详情查询。
 const cellLabels: Record<string, string> = {
-  C3: '城商行支付清算账户前一日余额',
   C6: '报备金额（收入）',
   D6: '报备金额（支付）',
   C7: '未核销金额（收入）',
   D7: '未核销金额（支付）',
   C8: '未核销业务流水（收入）',
   D8: '未核销业务流水（支付）',
-  B15: '当日实时余额',
 }
 
 // ---------- 页面内工具函数 ----------
@@ -380,10 +381,10 @@ onBeforeUnmount(() => {
               <tr>
                 <td colspan="2" class="report-label">城商行支付清算账户前一日余额</td>
                 <td colspan="2" class="report-data">
-                  <button type="button" class="report-value" @click="openDetail(cellOf('C3'))">
+                  <div class="report-value report-value--static">
                     <span class="report-amount">{{ amountText('C3') }}</span>
                     <span class="report-tag">C3</span>
-                  </button>
+                  </div>
                 </td>
                 <td class="report-label report-label--unit">单位：元</td>
               </tr>
@@ -498,10 +499,10 @@ onBeforeUnmount(() => {
               <tr>
                 <td colspan="2" class="report-label">当日实时余额</td>
                 <td colspan="3" class="report-data">
-                  <button type="button" class="report-value" @click="openDetail(cellOf('B15'))">
+                  <div class="report-value report-value--static">
                     <span class="report-amount">{{ amountText('B15') }}</span>
                     <span class="report-tag">B15</span>
-                  </button>
+                  </div>
                 </td>
               </tr>
             </tbody>
@@ -633,6 +634,8 @@ onBeforeUnmount(() => {
 .dcps-page {
   box-sizing: border-box;
   display: flex;
+  width: 100%;
+  max-width: 100%;
   flex-direction: column;
   gap: 5px;
   height: calc(100vh - var(--dpcs-host-layout-height));
@@ -737,6 +740,11 @@ td.report-data--input { padding: 5px 8px; }
 }
 .report-value:hover { background: var(--el-fill-color-light); }
 .report-value:focus-visible { outline: 2px solid var(--el-color-primary); outline-offset: -2px; }
+/* 无明细的余额单元格（C3、B15）：保留金额与位置标注的对齐，但不响应点击。 */
+.report-value--static,
+.report-table:not(.is-ready) .report-value--static { cursor: default; }
+.report-value--static:hover,
+.report-table:not(.is-ready) .report-value--static:hover { background: transparent; }
 .report-amount { color: var(--el-color-primary-dark-2); font-variant-numeric: tabular-nums; font-weight: 600; }
 .report-tag {
   flex: 0 0 auto;

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

@@ -889,6 +889,8 @@ onActivated(() => {
 .dcps-page {
   box-sizing: border-box;
   display: flex;
+  width: 100%;
+  max-width: 100%;
   flex-direction: column;
   gap: 5px;
   height: calc(100vh - var(--dpcs-host-layout-height));

package/src/view/dcps/funding/balance/index.vue

@@ -199,15 +199,14 @@ onBeforeUnmount(() => {
 
 <template>
   <main class="dcps-page">
-    <!-- 标题区：页面名称、最近查询时间、发起入口与查询按钮。 -->
+    <!-- 标题区：最近查询时间、发起入口与账户行余额查询按钮。 -->
     <el-card class="balance-header" shadow="never" :body-style="{ padding: '10px 14px' }">
       <div class="balance-heading">
-        <h1 class="balance-title">数字人民币账户行余额查询申请</h1>
-        <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" @click="query()">查询</el-button>
+          <el-button type="primary" :loading="loading" @click="query()">账户行余额查询</el-button>
         </span>
+        <span v-if="lastQueryTime" class="balance-updated">最近查询：{{ lastQueryTime }}</span>
       </div>
     </el-card>
 
@@ -297,6 +296,8 @@ onBeforeUnmount(() => {
 .dcps-page {
   box-sizing: border-box;
   display: flex;
+  width: 100%;
+  max-width: 100%;
   flex-direction: column;
   gap: 5px;
   height: calc(100vh - var(--dpcs-host-layout-height));
@@ -308,10 +309,9 @@ onBeforeUnmount(() => {
   background: var(--el-bg-color-page, #f7f8fa);
 }
 .balance-header { flex: 0 0 auto; }
-.balance-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; }
-.balance-title { margin: 0; color: var(--el-text-color-primary); font-size: 16px; font-weight: 600; line-height: 22px; }
+.balance-heading { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 6px 14px; }
 .balance-updated { color: var(--el-text-color-secondary); font-size: 12px; }
-.balance-actions { margin-left: auto; display: flex; }
+.balance-actions { display: flex; }
 .balance-actions :deep(.el-button + .el-button) { margin-left: 8px; }
 
 .balance-scroll { flex: 1; min-height: 0; min-width: 0; }

package/src/view/dcps/funding/injection/index.vue

@@ -424,6 +424,8 @@ onBeforeUnmount(() => {
 .dcps-page {
   box-sizing: border-box;
   display: flex;
+  width: 100%;
+  max-width: 100%;
   flex-direction: column;
   gap: 5px;
   height: calc(100vh - var(--dpcs-host-layout-height));

package/src/view/dcps/parameters/api.ts

@@ -17,9 +17,6 @@ export default {
       pageSize,
     }),
 
-  getDetailApi: (paraName: string) =>
-    baseHttpClient.post<any>('/TAM/0001/140305002', { moduleCode, paraName }),
-
   addApi: (values: ParameterFormValues) =>
     baseHttpClient.post<any>('/TAM/0001/120305002', { ...values, moduleCode }),
 

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

@@ -77,7 +77,6 @@ const pendingMutation = ref<Mutation>(null)
 const writing = computed(() => pendingMutation.value !== null)
 const listBusy = computed(() => listLoading.value || writing.value)
 let listRequestId = 0
-let detailRequestId = 0
 let disposed = false
 
 const textColumn = (prop: keyof DigitalRmbParameter, label: string, minWidth: number): ColumnOption<DigitalRmbParameter> => ({
@@ -166,56 +165,25 @@ const changePage = (current: number, size = pagination.size) => {
   void loadList()
 }
 
-// 新增、修改和详情共用弹窗；详情失败时禁用保存，避免提交未完整加载的数据。
+// 新增、修改和详情共用弹窗；详情直接使用表格行数据，不再单独请求。
 const dialogVisible = ref(false)
 const dialogMode = ref<DialogMode>('create')
-const dialogLoading = ref(false)
-const dialogReady = ref(false)
 const dialogError = ref('')
 const dialogSource = ref<DigitalRmbParameter | null>(null)
 const form = ref(createFormValues())
 const formNameError = ref('')
 const dialogTitle = computed(() => ({ create: '新增参数', edit: '修改参数', detail: '数字人民币参数详情' })[dialogMode.value])
-const dialogBusy = computed(() => dialogLoading.value || writing.value)
 
 const openCreateDialog = () => {
   if (listBusy.value) return
-  detailRequestId += 1
   dialogMode.value = 'create'
   dialogSource.value = null
   form.value = createFormValues()
   formNameError.value = ''
   dialogError.value = ''
-  dialogLoading.value = false
-  dialogReady.value = true
   dialogVisible.value = true
 }
 
-const loadDetail = async () => {
-  const source = dialogSource.value
-  if (!source || !hasName(source) || disposed || writing.value) return
-  const paraName = source.paraName!
-  const requestId = ++detailRequestId
-  dialogLoading.value = true
-  dialogReady.value = false
-  dialogError.value = ''
-  try {
-    const response = await API.getDetailApi(paraName)
-    if (disposed || requestId !== detailRequestId) return
-    const detail = readParameter(ensureSuccess(response, '读取参数详情失败'))
-    if (!Object.keys(detail).length) throw new Error('服务端未返回参数详情')
-    if (detail.paraName !== undefined && detail.paraName !== paraName) {
-      throw new Error('返回的参数名称与当前记录不一致')
-    }
-    form.value = createFormValues({ ...source, ...detail, paraName })
-    dialogReady.value = true
-  } catch (error) {
-    if (!disposed && requestId === detailRequestId) dialogError.value = errorMessage(error)
-  } finally {
-    if (!disposed && requestId === detailRequestId) dialogLoading.value = false
-  }
-}
-
 const openParameterDialog = (parameter: DigitalRmbParameter, mode: 'edit' | 'detail' = 'detail') => {
   if (listBusy.value || !hasName(parameter)) return
   dialogMode.value = mode
@@ -224,19 +192,11 @@ const openParameterDialog = (parameter: DigitalRmbParameter, mode: 'edit' | 'det
   formNameError.value = ''
   dialogError.value = ''
   dialogVisible.value = true
-  void loadDetail()
-}
-
-const closeParameterDialog = () => {
-  // 关闭后即使请求继续返回，也不能更新下一次打开的弹窗。
-  detailRequestId += 1
-  dialogLoading.value = false
-  dialogReady.value = false
 }
 
 const submitParameter = async () => {
   const mode = dialogMode.value
-  if (mode === 'detail' || dialogBusy.value || !dialogReady.value || !dialogVisible.value) return
+  if (mode === 'detail' || writing.value || !dialogVisible.value) return
   const values = { ...form.value }
   if (!values.paraName.trim()) {
     formNameError.value = '请填写参数名称'
@@ -303,7 +263,6 @@ onMounted(loadList)
 onBeforeUnmount(() => {
   disposed = true
   listRequestId += 1
-  detailRequestId += 1
 })
 </script>
 
@@ -319,7 +278,7 @@ onBeforeUnmount(() => {
           :disabled="listBusy"
           @submit.prevent="search()"
         >
-          <el-form-item label="关键字">
+          <el-form-item class="filter-keywords" label="关键字">
             <el-input v-model="keywords" placeholder="输入查询关键字" clearable />
           </el-form-item>
           <el-space class="filter-actions" :size="8">
@@ -388,12 +347,10 @@ onBeforeUnmount(() => {
         :show-close="!writing"
         :close-on-click-modal="false"
         :close-on-press-escape="!writing"
-        @close="closeParameterDialog"
       >
         <el-alert v-if="dialogError" class="dialog-error" :title="dialogError" type="error" show-icon :closable="false" />
         <el-scrollbar :class="{ 'detail-scrollbar': dialogMode === 'detail' }" :max-height="dialogMode === 'detail' ? undefined : 'min(62vh, 620px)'">
-          <div v-if="dialogLoading" class="detail-loading" role="status">正在读取参数详情…</div>
-          <div v-else-if="dialogMode === 'detail' && dialogReady" class="detail-content">
+          <div v-if="dialogMode === 'detail'" class="detail-content">
             <header class="detail-summary">
               <div class="detail-reference">
                 <span class="detail-label">参数名称</span>
@@ -419,12 +376,12 @@ onBeforeUnmount(() => {
             </section>
           </div>
           <el-form
-            v-else-if="dialogMode !== 'detail' && dialogReady"
+            v-else
             id="parameter-editor-form"
             class="parameter-form"
             label-position="top"
             :model="form"
-            :disabled="dialogBusy"
+            :disabled="writing"
             @submit.prevent="submitParameter()"
           >
             <el-form-item
@@ -447,13 +404,12 @@ onBeforeUnmount(() => {
           </el-form>
         </el-scrollbar>
         <template #footer>
-          <el-button v-if="dialogError && !dialogReady && dialogSource" :loading="dialogLoading" @click="loadDetail">重新读取</el-button>
           <el-button :disabled="writing" @click="dialogVisible = false">{{ dialogMode === 'detail' ? '关闭' : '取消' }}</el-button>
           <el-button
             v-if="dialogMode !== 'detail'"
             type="primary"
             :loading="pendingMutation === 'create' || pendingMutation === 'edit'"
-            :disabled="dialogLoading || !dialogReady || writing"
+            :disabled="writing"
             @click="submitParameter"
           >
             {{ dialogMode === 'create' ? '新增' : '保存' }}
@@ -489,6 +445,8 @@ onBeforeUnmount(() => {
 .dcps-page {
   box-sizing: border-box;
   display: flex;
+  width: 100%;
+  max-width: 100%;
   flex-direction: column;
   gap: 5px;
   height: calc(100vh - var(--dpcs-host-layout-height));
@@ -507,9 +465,10 @@ onBeforeUnmount(() => {
   overflow-y: auto;
 }
 .filter-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px; }
-.filter-form :deep(.el-form-item) { flex: 1 0 105px; min-width: 0; margin: 0; }
+.filter-form :deep(.el-form-item) { flex: 0 0 auto; min-width: 0; margin: 0; }
+.filter-form :deep(.filter-keywords) { flex: 0 1 240px; width: 240px; max-width: 100%; }
 .filter-form :deep(.el-form-item__label) { margin-bottom: 4px; }
-.filter-actions { flex-shrink: 0; margin-left: auto; }
+.filter-actions { flex-shrink: 0; margin-left: 0; }
 .parameter-table-region { flex: 1; min-width: 0; min-height: 0; }
 .table-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
 .table-actions :deep(.el-button + .el-button) { margin-left: 0; }
@@ -520,7 +479,6 @@ onBeforeUnmount(() => {
 .form-item--wide { grid-column: 1 / -1; }
 .parameter-form :deep(.el-input__inner[readonly]) { color: var(--el-text-color-secondary); }
 .dialog-error { margin-bottom: 14px; }
-.detail-loading { padding: 40px 0; color: var(--el-text-color-secondary); text-align: center; }
 .detail-scrollbar :deep(.el-scrollbar__wrap) {
   max-height: calc(100vh - 120px);
   max-height: calc(100dvh - 120px);
@@ -551,7 +509,7 @@ onBeforeUnmount(() => {
   .detail-reference { grid-column: auto; }
 }
 @media (max-width: 540px) {
-  .filter-form :deep(.el-form-item) { flex-basis: 100%; }
+  .filter-form :deep(.filter-keywords) { flex: 1 1 100%; width: auto; }
   .filter-actions { margin-left: 0; }
   .parameter-form { grid-template-columns: minmax(0, 1fr); }
   .selection-count { width: 100%; margin-left: 0; }

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

@@ -932,6 +932,8 @@ onBeforeUnmount(() => {
 .dcps-page {
   box-sizing: border-box;
   display: flex;
+  width: 100%;
+  max-width: 100%;
   flex-direction: column;
   gap: 5px;
   height: calc(100vh - var(--dpcs-host-layout-height));