我来帮您设计"出海通"服务平台的PC端和微信小程序端界面。根据接口文档分析,这是一个涉及三大功能模块的平台:
让我先生成设计灵感,然后为您创建完整的UI界面。
现在我开始构建出海通服务平台。首先更新主题样式,采用专业、国际化的蓝色调政务风格:
现在创建PC端首页和主要组件:
现在创建微信小程序端的界面展示页面(模拟小程序界面的响应式设计):
我已经根据中信保提供的接口文档,完成了出海通服务平台的PC端和微信小程序端界面设计。以下是完成的内容:
/) - 包含品牌展示、核心服务入口、数据统计、最新资讯等模块国别风险报告 (/risk-report) - 支持按洲际筛选、国家搜索,展示风险等级和报告列表
/risk-report/[countryCode]) - 展示政治/经济/营商风险指标和历史报告信保资讯 (/news) - 支持栏目分类、搜索筛选,展示文章列表
/news/[docId]) - 展示文章内容、附件下载、相关推荐/smeri) - 展示各国汇率风险指数排行,支持风险等级筛选小程序预览页 (/miniprogram) - 模拟iPhone设备框架,包含完整的底部导航和五个功能模块:
整体采用专业的蓝色调政务风格,支持响应式布局,并根据接口文档中的数据结构设计了相应的UI展示。
我看到了当前的资讯页面和小程序页面。根据接口文档,栏目是有树状结构的(columnList 包含子栏目,parentID 指向父栏目)。我来更新小程序端的资讯界面,将栏目分类改为树状结构:
同时也更新 PC 端资讯页面的栏目分类为树状结构:
现在需要添加 findColumnName 函数:
更新文章的 columnId 数据以匹配新的树状结构:
已完成移动端和PC端资讯界面栏目分类的树状结构改造。主要改动包括:
columnList 和 parentID 字段,构建了多层级的栏目树,包含"信保独家"、"其他资讯"、"贸易预警"等一级栏目及其子栏目