- Remove `executionDateTime` from the preview modal and update the display to show `nextExecutionDate` and `nextExecutionTime`. - Adjust the API response structure for `next-execution` to align with the new fields. - Implement loading indicators for the preview button and modal during data fetching. - Update related documentation in `IMPACT_ANALYSIS.md` and `TASK_SUMMARY.md` for clarity on changes.
12 KiB
12 KiB
TASK_SUMMARY
任务基本信息
- 任务名称:实现定期投资页面(对齐 V5 demo)
- 相关项目:schedule_invest_plan
- 改动类型:功能新增
改动说明
- 首页改为定期投资:我的计划列表、创建表单(资产晶片搜索、开始日期、金额、间隔、结束日期/期数)、注意事项、确认弹窗、终止计划。
- 行为对齐 demo:必填校验、确认后再写入列表、新建状态为「已建立」、终止后状态为「已终止」。
- 三语文案(zh-TW / zh-CN / en-US);语言与主题仍仅通过 URL
lang/theme控制。 - 视觉令牌对齐 demo 青绿主色与涨跌语义色;移动端计划列表使用卡片。
影响与风险
- 参见
IMPACT_ANALYSIS.md;无破坏性变更,风险低。 - 计划数据仅存 Pinia 内存,刷新页面恢复为示例一条。
测试与验证
npm run build:通过。- 浏览器:创建/重设/确认/终止、校验失败提示、深浅色与语言切换。
后续事项
- 对接真实计划查询/创建/终止 API(经
src/api/http.ts)。 - 资产搜索已对接
getSimpleStockPage(交易所 →exchangeCodes);创建计划 API 待接。
补充:getSimpleStockPage 资产搜索
- 交易所下拉选中后请求标的;
exchangeCodes: [exchangeCode]。 - 晶片搜索框防抖调用同一接口并传
searchName。 - 映射字段含
productKey、productCodeUnique等,便于后续创建计划入参。
补充:交易所与资产同一行
- 创建表单在
md+将交易所与资产晶片各占 12 列并排;xs仍上下堆叠。
补充(顶栏与表单控件样式)
- 顶栏
AppHeader(含标题「投資計劃排期」)已从壳层移除。 - Element Plus 日期、下拉框 hover/focus 边框与背景对齐项目主色与
--color-control-*(见src/styles/element-plus-theme.scss)。
补充:Token、代理与服务端多语言
- URL 参数
token写入请求头token(参考 Order-H5);路由跳转保留 query(含 token)。 - 开发代理:
/base/*→getAllList等;/trade/*→schedule-investment/exchanges等(目标192.168.3.233,可改.env.development)。 - 有 token 时启动加载
getSystemI18nAllList;组件内用useServiceI18n().si18n('I18N_ID')解析服务端文案。 getScheduleInvestmentExchanges()已封装,待业务页面对接。npm run build通过。
补充:创建表单交易所下拉
- 在「資產」上方增加必填「交易所」下拉,接口
POST /api/admin/exchange/getSelectItemList;选项文案优先nameI18nId+useServiceI18n。 - 未选择交易所时资产晶片选择器禁用;切换交易所清空已选资产。
- 开发环境新增 Vite 代理
/api。 - 详见
IMPACT_ANALYSIS.md本节补充。
补充:URL accountId / clientId
- 入口 URL 需携带
clientId、accountId(与token、lang、theme同级 query)。 - 示例:
?token=xxx&clientId=2016410736418492416&accountId=2016410907965526016&lang=tw&theme=dark(详见README.md) - 值仅存于 Pinia(来自 URL,不写 localStorage);
useRouteWithPreferences().linkTo会保留 query。 src/api/http.ts对 POST 请求体自动合并clientId、accountId(与 Order-H5 交易接口一致)。
补充:资产晶片单选与样式
AssetChipPicker限制为单资产;高度、边框、占位色与交易所等el-select/el-input一致。- 未选交易所时禁用态显示
recurring.pleaseSelect,避免 disabled input 占位符发灰不一致。
补充:定期投资页文字加大
- 区块标题
16px、表格表头与表单标签13px、结束方式(日期/期数)按钮15px。 - 详见
IMPACT_ANALYSIS.md本节补充。
补充:创建表单对齐接口字段
- 新增投资类型(AMOUNT/QUANTITY)、订单价格类型、定投周期与执行日、交易时间偏移(0–240 分钟);提交时组装
ScheduleInvestmentCreateBody并调用createScheduleInvestmentPlan。 exchangeCode、资产productCode、startDate、结束日期/期数与既有表单项对应;clientId/accountId由 HTTP 拦截器注入。- 详见
IMPACT_ANALYSIS.md本节补充。
补充:创建表单控件宽度统一
- 平板及以上(
≥768px)表单项控件宽度统一为列宽的 70%;移动端保持 100%。 - 移除原
340px上限,使el-select、el-input、AssetChipPicker、日期与结束方式切换条一致。 - 详见
IMPACT_ANALYSIS.md「创建表单控件宽度统一」补充。
补充:创建定投 API 路径
createScheduleInvestmentPlan使用POST /trade/schedule-investment/plan/create。- 请求体仍由
buildScheduleInvestmentCreateBody生成;clientId/accountId由 HTTP 拦截器合并。
补充:交易所下拉接口
- 使用
POST /trade/schedule-investment/exchanges,字段exchangeCode/nameI18nId/tradeDate。 - 已移除
src/api/exchange.ts(原getAllExchanges)。
补充:计划列表 plan/page
POST /trade/schedule-investment/plan/page,请求仅使用current: 1、size: 50,其余筛选字段为空。- 列表字段映射
productCode、金额/数量、周期、状态ACTIVE等;创建成功后loadPlans刷新。 - 终止计划仍为前端演示(待接终止接口)。
补充:限价 limitPrice
- 订单价格类型为「限价」时展示限价输入,校验大于 0,创建请求携带
limitPrice;市价不传。
补充:创建计划产品名称
- 选股时保留
engName/localName,创建 body 传productEngName、productLocalName。
补充:资产选择展示 productCodeUnique
- 下拉与晶片展示
1.HK(productCodeUnique),名称 trim 全角空格;去重键使用productKey。
补充:投资类型与金额/数量合一控件
- 移除独立「投资类型」切换行;左侧小下拉(按金额/按数量)与右侧输入同一输入框样式一行展示。
补充:结束类型合一控件
- 「特定日期 / 期數」与结束日期或期数输入合并为
field-combo;日期模式下保留「无结束日期」勾选。
补充:计划详情弹窗(2026-10-09)
- 我的计划表格与移动卡片「操作」增加「详情」;请求
POST /trade/schedule-investment/plan/detail(planNo)。 - 弹窗展示计划编号、交易所、产品、每次投资、订单价格、周期、偏移、起止、下次执行、进度、状态、创建时间、渠道;下方为最近执行记录表或空态。
- 三语文案见
recurring.planDetail.*;详见IMPACT_ANALYSIS.md本节补充。 - 详情弹窗隐藏渠道;交易所名称与创建表单下拉同源反显(
exchangeSelectOptions)。 - 产品名称按
lang在productLocalName/productEngName间切换(详情与计划列表一致)。 - 终止计划:
el-dialog确认 + 选填原因,接口plan/terminate;成功提示并刷新列表(recurring.terminate*/cancelConfirm*)。
补充:预览下次执行(2026-10-09)
- 创建表单「重设 / 繼續」之间增加「预览下次执行」;请求
POST /trade/schedule-investment/plan/next-execution(exchangeCode、frequencyType、frequencyDay、ctOffsetMinutes、可选startDate)。 - 弹窗展示周期日期、执行日期、执行时间、是否顺延、CT 偏移;文案见
recurring.previewNextExecution*。 - 校验范围小于「继续」:不要求标的与金额;详见
IMPACT_ANALYSIS.md本节补充。
补充:计划列表金额/数量展示(2026-10-09)
- 移动计划卡片:
investmentType === 'QUANTITY'时 meta 标签为「数量」,否则为「金额」;数值逻辑不变。 - 桌面计划列表表头
recurring.colAmount改为「金额/数量」(三语与详情执行记录表头一致)。 - 详见
IMPACT_ANALYSIS.md本节补充。
补充:计划列表资产列省略与 Tooltip(2026-10-09)
- 桌面计划表资产列固定约 220px,超出省略;
el-tooltip展示完整代码与名称。 - 详见
IMPACT_ANALYSIS.md本节补充。
补充:移动计划卡片操作按钮样式(2026-10-09)
- 移动卡片「详情 / 终止」复用
detail-link、cancel-link,无边框纯文字;字号 15px、紧凑内边距(与桌面表操作一致)。 - 详见
IMPACT_ANALYSIS.md本节补充。
补充:清理脚手架示例(2026-10-09)
- 删除:
SampleChart.vue、HomeView.vue、AboutView.vue、investAssets.ts、默认assets/*.svg。 - 路由仅保留
/(定期投资);移除echarts与图表相关 CSS/i18n。 - 金额输入 placeholder 国际化为
recurring.amountPlaceholder。 - 验证:
npm run build。
补充:README 与 URL lang 短码(2026-10-10)
- 目标:完善
README.md;lang查询参数文档与写入统一为zh/tw/en(缺省tw)。 - 代码:
resolveLocaleFromLangParam/localeToUrlLang;兼容读取zh-CN、zh-TW、en-US。 - 验证:
npm run build;参见IMPACT_ANALYSIS.md本节补充。
补充:Vite 可局域网访问(2026-10-10)
vite.config.ts:server/preview增加host: true、allowedHosts: true。README.md开发节补充 Network 访问说明。
补充:CT 时间偏移下拉(2026-10-10)
- 创建表单在选定交易所与资产后请求
POST /trade/schedule-investment/options/ct-time(productCode与创建计划一致:productCodeUnique或code)。 - 偏移字段改为
el-select(displayName/offsetMinutes);未选资产时禁用并提示先选交易所与资产。 - 详见
IMPACT_ANALYSIS.md本节补充;验证:npm run build。
补充:frequencyDay 回显归一化(2026-10-10)
- 新增
src/utils/frequencyDay.ts,将接口1/MONDAY/MON等 weekly 值与带前导零的 monthly 值规范后用于列表与详情展示。 - 创建/预览提交:
WEEKLY为1–7,MONTHLY为1–31;DAILY不传frequencyDay。界面仍显示星期中文名。 - 验证:
npm run build;参见IMPACT_ANALYSIS.md对应补充。
补充:VITE_BASE_URL 子路径(2026-10-10)
vite.config.ts将VITE_BASE_URL映射为 Vitebase;新增.env.production。- 开发/预览入口:
/recurring-investment/。 - 验证:
npm run build。
补充:HTTP 不再全局注入 clientId / accountId(2026-10-10)
- 移除
src/api/http.ts对全部 POST 请求体的自动合并;仅POST /trade/schedule-investment/plan/create在buildScheduleInvestmentCreateBody中携带 URL 的clientId、accountId。 - 验证:
npm run build;参见IMPACT_ANALYSIS.md对应补充。
补充:资产下拉滚动分页(2026-10-10)
getSimpleStockPage每页 50 条;下拉触底loadMore追加,搜索仍防抖并重置页码。- 验证:
npm run build;参见IMPACT_ANALYSIS.md对应补充。
补充:下次执行预览去掉执行时间(2026-10-10)
- 预览弹窗移除
previewExecutionDateTime/executionDateTime展示行。 - 参见
IMPACT_ANALYSIS.md对应补充。
补充:下次执行预览新接口字段与 loading(2026-10-12)
next-execution响应改为nextExecutionDate、nextExecutionTime;弹窗仅展示「下次执行日」「执行时间」。- 请求期间仅按钮
:loading;数据返回后再打开弹窗。 - 参见
IMPACT_ANALYSIS.md对应补充。