jufubao-base 1.0.340 → 1.0.341-beta1

package/.trae/documents//350/201/232/347/246/217/345/256/235/344/270/232/345/212/241/347/273/204/344/273/266/345/237/272/347/241/200/346/217/222/344/273/266/345/214/205/351/241/271/347/233/256/346/236/266/346/236/204/346/226/207/346/241/243.md

@@ -0,0 +1,58 @@
+# Attr 面板属性管理重构计划
+
+## 任务目标
+
+将 Attr 面板属性管理重构为 content, style, advanced 三个部分，并将这些文件统一放在组件库根目录的 cusAttr 文件夹中。
+
+## 实施步骤
+
+### 1. 创建组件库根目录 cusAttr 文件夹
+
+- 在 `src/` 目录下创建 `cusAttr` 文件夹
+- 结构如下：
+  ```
+  src/
+  └── cusAttr/
+      ├── content/
+      ├── style/
+      └── advanced/
+  ```
+
+### 2. 整理现有属性管理文件
+
+- 将现有的 `Attr.js` 文件内容拆分为 content, style, advanced 三个部分
+- 将拆分后的文件放入对应的目录中
+- 确保文件命名规范一致
+
+### 3. 修改组件引用方式
+
+- 更新所有组件的 Attr 引用方式
+- 从原来的 `import Attr from "./Attr"` 改为从根目录 cusAttr 导入
+- 确保所有组件都使用新的引用方式
+
+### 4. 统一属性管理结构
+
+- 为每个组件创建对应的属性管理文件
+- 确保文件结构一致：content.js, style.js, advanced.js
+- 统一属性定义的格式和规范
+
+### 5. 测试验证
+
+- 确保所有组件的 Attr 面板正常显示
+- 验证属性修改是否生效
+- 确保构建过程正常完成
+
+## 技术要点
+
+1. **文件结构规范**：严格按照 content, style, advanced 分类管理属性
+2. **引用路径统一**：所有组件从根目录 cusAttr 导入属性管理文件
+3. **向后兼容**：确保重构过程中不影响现有功能
+4. **代码质量**：保持代码风格一致，添加必要的注释
+
+## 预期成果
+
+- 组件库根目录下创建了统一的 cusAttr 文件夹
+- 所有组件的属性管理文件按照 content, style, advanced 分类
+- 组件引用方式统一，代码结构清晰
+- Attr 面板功能正常，属性修改生效
+- 构建过程无错误

package/ARCHITECTURE.md

@@ -0,0 +1,171 @@
+# 聚福宝业务组件基础插件包（jufubao-base）项目架构文档
+
+## 1. 项目概览
+
+**jufubao-base** 是一个基于 **uni-app** 框架的业务组件基础插件包，主要用于构建聚福宝生态下的跨平台应用，支持 H5、微信小程序、App 等多个平台。
+
+- **项目类型**：uni-app 跨平台组件库
+- **技术栈**：Vue 2.6.10 + Vuex 3.2.0 + uni-app
+- **核心功能**：提供丰富的业务组件和通用功能模块
+- **应用场景**：聚福宝生态下的各类业务应用开发
+
+## 2. 目录结构
+
+项目采用清晰的模块化结构，主要包含以下核心目录：
+
+| 目录/文件 | 主要功能 | 说明 |
+|---------|---------|------|
+| **src/components/** | 业务组件库 | 包含大量可复用的业务组件，如登录、支付、卡片等 |
+| **src/common/** | 通用工具和服务 | 包含网络请求、存储、日志等通用功能 |
+| **src/api/** | API接口定义 | 定义与后端交互的接口 |
+| **build/** | 构建配置和脚本 | 包含构建、部署、代码生成等脚本 |
+| **commands/** | 命令行工具 | 包含组件创建、更新等命令 |
+| **settings.*.js** | 环境配置文件 | 不同环境的配置信息 |
+
+## 3. 核心功能模块
+
+### 3.1 业务组件库
+
+项目提供了丰富的业务组件，覆盖了聚福宝生态的核心业务场景：
+
+- **认证登录**：JfbBaseLogin、JfbBasePhoneLogin 等
+- **支付相关**：JfbBasePay、JfbBaseCardPay 等
+- **卡片管理**：JfbBaseCard、JfbBaseCardDetail 等
+- **地址管理**：JfbBaseAddress、JfbBaseCity 等
+- **订单管理**：JfbBaseOrderList、JfbBaseOrderDetail 等
+- **UI组件**：JfbBaseHeader、JfbBaseFooter、JfbBaseNotice 等
+
+每个组件都包含完整的配置选项、API 定义和 Mock 数据，方便开发者快速集成和测试。
+
+### 3.2 跨平台支持
+
+项目基于 uni-app 框架，实现了一次开发多端运行：
+
+- **H5 端**：支持浏览器访问
+- **微信小程序**：支持微信生态
+- **App 端**：支持 iOS 和 Android
+
+### 3.3 构建与部署
+
+项目提供了完整的构建和部署流程：
+
+- **开发环境**：支持热更新和 Mock 数据
+- **构建流程**：自动处理多平台构建
+- **部署**：集成 OSS 上传功能，支持不同环境的部署
+
+### 3.4 工具链
+
+项目集成了丰富的开发工具：
+
+- **代码生成**：通过 `coder` 命令自动生成 API、页面等代码
+- **组件管理**：支持组件的创建、更新和预览
+- **日志系统**：集成 xdLog 日志上报功能
+- **Mock 数据**：方便开发和测试
+
+## 4. 技术架构
+
+### 4.1 技术栈
+
+| 技术/框架 | 版本 | 用途 |
+|---------|------|------|
+| Vue | ^2.6.10 | 前端框架 |
+| Vuex | ^3.2.0 | 状态管理 |
+| uni-app | 2.0.1 | 跨平台框架 |
+| flyio | ^0.6.2 | 网络请求 |
+| less | ^3.12.2 | 样式预处理 |
+| sass | ^1.29.0 | 样式预处理 |
+| webpack | 4.44.2 | 构建工具 |
+
+### 4.2 核心架构
+
+项目采用分层架构设计：
+
+1. **组件层**：业务组件和通用组件
+2. **服务层**：API 调用、数据处理
+3. **工具层**：通用工具函数
+4. **配置层**：环境配置、项目设置
+
+### 4.3 数据流
+
+- **前端组件** → **Vuex 状态管理** → **API 服务** → **后端接口**
+- **后端响应** → **API 服务** → **Vuex 状态更新** → **前端组件更新**
+
+## 5. 核心 API/类/函数
+
+### 5.1 全局配置
+
+- **settings**：环境配置，包含 API 地址、项目信息等
+- **projectJson**：项目配置信息，包含 xsiteid、template_id 等
+
+### 5.2 通用服务
+
+- **storage**：本地存储服务
+- **cookie**：Cookie 操作（H5 端）
+- **request**：网络请求服务
+- **xdLog**：日志上报服务
+
+### 5.3 核心方法
+
+- **checkLoginStatus**：检查用户登录状态
+- **getUserInfo**：获取用户信息
+- **saveLogs**：上报日志
+
+### 5.4 组件配置
+
+每个组件都通过统一的配置文件定义属性和行为，示例：
+
+```javascript
+{
+  ele: 'title',
+  label: '基础',
+  size: 'small',
+  groupKey: 'content'
+}
+```
+
+## 6. 开发与部署
+
+### 6.1 开发命令
+
+| 命令 | 功能 | 说明 |
+|-----|------|------|
+| `npm run dev` | 启动开发服务器 | 开发环境运行 |
+| `npm run build` | 构建生产版本 | 生产环境构建 |
+| `npm run coder` | 代码生成 | 自动生成API、页面等代码 |
+| `npm run create` | 创建组件 | 快速创建新组件 |
+| `npm run update` | 更新组件 | 更新现有组件 |
+
+### 6.2 部署流程
+
+1. **构建**：`npm run build` 生成生产版本
+2. **部署**：通过 `npm run oss` 命令上传到 OSS
+3. **环境切换**：支持不同环境的部署配置
+
+## 7. 技术特点
+
+1. **模块化设计**：组件高度模块化，易于复用和维护
+2. **配置化开发**：通过配置文件管理不同环境的设置
+3. **完善的工具链**：提供丰富的命令行工具，提高开发效率
+4. **多平台适配**：基于 uni-app 实现跨平台兼容
+5. **完整的业务覆盖**：涵盖聚福宝生态的核心业务场景
+
+## 8. 项目价值
+
+- **提高开发效率**：通过复用组件和工具，减少重复开发工作
+- **保证代码质量**：统一的代码规范和架构设计
+- **加速业务迭代**：快速集成和部署新功能
+- **降低维护成本**：模块化设计和完善的文档
+
+## 9. 未来规划
+
+1. **组件库扩展**：持续增加新的业务组件
+2. **性能优化**：提升组件性能和加载速度
+3. **文档完善**：提供更详细的使用文档和示例
+4. **生态集成**：与更多聚福宝生态产品集成
+5. **技术升级**：考虑升级到 Vue 3 和 uni-app X
+
+## 10. 总结
+
+jufubao-base 是一个功能完善、设计合理的业务组件基础插件包，为聚福宝生态下的应用开发提供了强大的支持。通过统一的组件库和工具链，开发者可以快速构建高质量的跨平台应用，专注于业务逻辑的实现，而无需关心底层的技术细节。
+
+项目的模块化设计和完善的工具链，不仅提高了开发效率，也保证了代码的可维护性和可扩展性，为聚福宝生态的持续发展提供了坚实的技术基础。

package/PRODUCTION_DOCUMENT.md

@@ -0,0 +1,419 @@
+# 聚福宝业务组件基础插件包（jufubao-base）生产文档
+
+## 1. 组件编程思想分析
+
+通过对 `src/components/JfbBasexxx` 系列组件的深入分析，我们发现该项目采用了一套完整、规范的组件化开发思想，具体体现在以下几个方面：
+
+### 1.1 模块化设计
+
+**核心思想**：将业务功能拆分为独立、可复用的模块，每个模块负责特定的业务场景。
+
+**实现方式**：
+- 每个组件都有独立的目录结构，包含完整的功能实现
+- 组件间通过明确的接口进行通信，减少耦合
+- 使用 Vue 的组件化机制，支持组件的嵌套和组合
+
+**示例**：
+```javascript
+// JfbBaseCard 组件负责卡片管理相关功能
+// JfbBaseLogin 组件负责用户登录相关功能
+```
+
+### 1.2 配置化开发
+
+**核心思想**：通过配置文件定义组件的属性和行为，支持可视化编辑和动态调整。
+
+**实现方式**：
+- 每个组件都有对应的 `Attr.js` 文件，定义可编辑的属性
+- 通过 `gCPVal` 函数获取配置值（`getContainerPropsValue` 的简化别名）
+- 支持默认值设置，确保配置缺失时的稳定性
+
+**示例**：
+```javascript
+// 从容器配置中获取值，如果不存在则使用默认值
+this.cardLayout = gCPVal(container, "cardLayout", "1");
+```
+
+### 1.3 混入机制
+
+**核心思想**：通过 Vue 的 mixins 实现代码复用，提取公共逻辑。
+
+**实现方式**：
+- 每个组件都有对应的 Mixin.js 文件
+- 提取公共功能到通用 mixins 中，如 `componentsMixins`、`extsMixins`
+- 支持多层混入，实现功能的组合
+
+**示例**：
+```javascript
+mixins: [componentsMixins, extsMixins, JfbBaseCardMixin, openDebuggerMixins, colorCardMixins]
+```
+
+### 1.4 跨平台适配
+
+**核心思想**：使用 uni-app 的条件编译，实现一次开发多端运行。
+
+**实现方式**：
+- 使用 `// #ifdef` 和 `// #endif` 语法进行平台判断
+- 为不同平台提供适配的实现
+- 统一平台差异，提供一致的开发体验
+
+**示例**：
+```javascript
+// #ifdef H5
+// H5 平台特定实现
+// #endif
+
+// #ifdef MP-WEIXIN
+// 微信小程序特定实现
+// #endif
+```
+
+### 1.5 事件驱动
+
+**核心思想**：通过事件系统处理组件间通信，实现松耦合的架构。
+
+**实现方式**：
+- 使用 `jfbRootExec` 统一调用后端 API
+- 通过自定义事件实现组件内部通信
+- 支持事件冒泡和捕获，实现复杂的交互逻辑
+
+**示例**：
+```javascript
+// 调用后端 API
+jfbRootExec("loginCardBind", {
+  vm: this,
+  data: { card_number: item["card_number"] },
+})
+.then((res) => {
+  // 处理响应
+});
+```
+
+### 1.6 状态管理
+
+**核心思想**：使用 Vuex 管理全局状态，实现状态的集中控制。
+
+**实现方式**：
+- 通过 `mapState` 映射全局状态到组件
+- 使用 mutations 和 actions 处理状态变更
+- 支持模块化的状态管理，按业务领域划分
+
+**示例**：
+```javascript
+computed: {
+  ...mapState(["jfbAuthorize", "siteInfo", "loginParams"]),
+  // 其他计算属性
+}
+```
+
+### 1.7 错误处理
+
+**核心思想**：完善的错误捕获和日志上报机制，提高系统的稳定性和可维护性。
+
+**实现方式**：
+- 使用 try-catch 捕获异常
+- 通过 `$xdLog` 上报错误信息
+- 提供统一的错误处理函数
+
+**示例**：
+```javascript
+try {
+  // 可能出错的代码
+} catch (err) {
+  this.$xdLog.setARMSError(err);
+}
+```
+
+### 1.8 预览模式
+
+**核心思想**：支持体验码模式，方便开发和测试。
+
+**实现方式**：
+- 提供预览模式开关
+- 支持体验码登录
+- 模拟真实环境，方便功能验证
+
+**示例**：
+```javascript
+// 体验码登录
+loginPreview(experience_code) {
+  return new Promise((resolve, reject) => {
+    jfbRootExec("loginExperience", {
+      vm: this,
+      data: { experience_code },
+    })
+    .then(res => resolve(res))
+    .catch(err => reject(err));
+  });
+}
+```
+
+## 2. 组件结构规范
+
+### 2.1 目录结构
+
+每个 JfbBase 组件都遵循统一的目录结构：
+
+```
+JfbBaseXXX/
+├── Api.js           // API 接口定义（根据业务需要选择性生产该文件）
+├── Mock.js          // 模拟数据 （根据业务需要选择性生产该文件）
+├── JfbBaseXXX.vue   // 组件主体
+├── JfbBaseXXXLess.less  // 组件样式
+├── JfbBaseXXXMixin.js   // 组件混入
+├── cusAttr/         // 组件级属性管理目录
+│   ├── content.js    // 内容相关属性
+│   ├── style.js      // 样式相关属性
+│   └── advanced.js   // 高级设置属性
+└── [其他辅助文件]    // 如子组件、工具函数等
+```
+
+### 2.2 文件命名规范
+
+- 组件目录：`JfbBase` + 功能名称（首字母大写）
+- 组件文件：`JfbBase` + 功能名称 + `.vue`
+- 样式文件：`JfbBase` + 功能名称 + `Less.less`
+- 混入文件：`JfbBase` + 功能名称 + `Mixin.js`
+
+### 2.3 组件注册规范
+
+- 使用全局注册和局部注册相结合的方式
+- 遵循 Vue 组件注册规范
+- 支持按需引入，减少打包体积
+
+### 2.4 Attr 面板属性管理
+
+**核心思想**：将 Attr 面板属性分为 content, style, advanced 三个部分，统一管理组件的编辑属性。
+
+**实现方式**：
+- 在组件库根目录创建 `cusAttr` 文件夹
+- 每个组件的属性管理文件放在对应的 `cusAttr` 目录中
+- 属性文件分为 content.js, style.js, advanced.js 三个部分
+
+**目录结构**：
+```
+jufubao-base/
+└── src/components
+              └── cusAttr/          # 组件库根目录的属性管理目录
+               ├── content/       # 内容相关属性
+              ├── style/         # 样式相关属性
+              └── advanced/      # 高级设置属性
+```
+
+**使用方式**：
+```javascript
+// 从组件库根目录的 cusAttr 导入属性管理文件
+import contentAttr from "@/cusAttr/content/JfbBaseCard";
+import styleAttr from "@/cusAttr/style/JfbBaseCard";
+import advancedAttr from "@/cusAttr/advanced/JfbBaseCard";
+```
+
+## 3. 核心功能模块
+
+### 3.1 卡片管理
+
+**功能说明**：处理卡片的绑定、登录、查看详情等操作。
+
+**核心组件**：`JfbBaseCard`、`JfbBaseCardDetail`、`JfbBaseCardBind`
+
+**主要功能**：
+- 卡片绑定（扫码绑定、链接绑定）
+- 卡片登录
+- 卡片列表展示
+- 卡片详情查看
+- 可转换卡片管理
+
+### 3.2 登录系统
+
+**功能说明**：处理用户登录相关操作，支持多种登录方式。
+
+**核心组件**：`JfbBaseLogin`、`JfbBaseLoginForgetPwd`、`JfbBaseLoginSetPwd`
+
+**主要功能**：
+- 快捷登录（微信、钉钉等）
+- 账号密码登录
+- 验证码登录
+- 忘记密码
+- 静默登录
+
+### 3.3 地址管理
+
+**功能说明**：处理用户地址相关操作。
+
+**核心组件**：`JfbBaseAddress`、`JfbBaseCity`
+
+**主要功能**：
+- 地址列表
+- 地址选择
+- 地址编辑
+- 城市选择
+
+### 3.4 订单管理
+
+**功能说明**：处理订单相关操作。
+
+**核心组件**：`JfbBaseOrderList`、`JfbBaseOrderDetail`、`JfbBaseAfterSales`
+
+**主要功能**：
+- 订单列表
+- 订单详情
+- 售后服务
+- 物流查询
+
+### 3.5 UI 组件
+
+**功能说明**：提供通用的 UI 组件。
+
+**核心组件**：`JfbBaseHeader`、`JfbBaseFooter`、`JfbBaseNotice`
+
+**主要功能**：
+- 头部导航
+- 底部导航
+- 通知栏
+- 背景设置
+
+## 4. 技术栈与依赖
+
+### 4.1 核心技术栈
+
+| 技术/框架 | 版本 | 用途 |
+|---------|------|------|
+| Vue | ^2.6.10 | 前端框架 |
+| Vuex | ^3.2.0 | 状态管理 |
+| uni-app | 2.0.1 | 跨平台框架 |
+| less | ^3.12.2 | 样式预处理 |
+| flyio | ^0.6.2 | 网络请求 |
+
+### 4.2 关键依赖
+
+| 依赖 | 版本 | 用途 |
+|------|------|------|
+| gxd-uni-library-editx | 1.0.17-beta2 | 编辑组件库 |
+| js-base64 | ^2.6.4 | Base64 编码解码 |
+| color | ^3.1.3 | 颜色处理 |
+| vconsole | ^3.15.0 | 调试工具 |
+
+## 5. 开发与部署流程
+
+### 5.1 开发流程
+
+1. **环境搭建**：安装依赖，配置开发环境
+2. **组件创建**：使用 `npm run create` 创建新组件
+3. **组件开发**：实现组件功能，编写样式和逻辑
+4. **组件测试**：使用体验码模式进行测试
+5. **组件更新**：使用 `npm run update` 更新组件
+
+### 5.2 部署流程
+
+1. **构建**：使用 `npm run build` 构建生产版本
+2. **上传**：使用 `npm run oss` 上传到 OSS
+3. **发布**：使用 `npm run release` 发布组件
+
+## 6. 性能优化策略
+
+### 6.1 代码优化
+
+- **按需加载**：使用动态导入，减少初始加载体积
+- **代码分割**：按业务模块分割代码，提高加载速度
+- **缓存策略**：合理使用缓存，减少重复请求
+
+### 6.2 渲染优化
+
+- **虚拟列表**：处理长列表，减少 DOM 节点
+- **懒加载**：图片和组件的懒加载
+- **防抖节流**：优化高频操作
+
+### 6.3 网络优化
+
+- **请求合并**：合并多个请求，减少网络开销
+- **请求缓存**：缓存重复请求的结果
+- **压缩传输**：使用 Gzip 压缩传输数据
+
+## 7. 最佳实践
+
+### 7.1 组件开发
+
+1. **遵循规范**：严格遵循项目的命名规范和目录结构
+2. **功能单一**：每个组件负责单一的业务功能
+3. **配置化**：通过配置文件定义组件属性，支持可视化编辑
+4. **跨平台**：考虑不同平台的兼容性
+5. **错误处理**：完善的错误捕获和日志上报
+
+### 7.2 代码风格
+
+1. **命名规范**：使用语义化的命名
+2. **代码缩进**：使用 2 空格缩进
+3. **注释完善**：为关键代码添加注释
+4. **代码简洁**：避免冗余代码，保持代码简洁
+
+### 7.3 调试技巧
+
+1. **体验码模式**：使用体验码进行功能测试
+2. **日志调试**：使用 `console.log` 和 `$xdLog` 进行调试
+3. **断点调试**：使用浏览器或 IDE 的断点功能
+4. **网络调试**：使用浏览器的网络面板查看请求
+
+## 8. 常见问题与解决方案
+
+### 8.1 跨平台兼容性问题
+
+**问题**：不同平台的 API 差异导致功能异常
+
+**解决方案**：
+- 使用条件编译，为不同平台提供适配的实现
+- 统一 API 调用方式，封装平台差异
+- 充分测试，确保在所有目标平台上正常运行
+
+### 8.2 性能问题
+
+**问题**：组件加载缓慢，运行卡顿
+
+**解决方案**：
+- 优化代码结构，减少不必要的计算
+- 使用虚拟列表处理长列表
+- 合理使用缓存，减少重复请求
+- 优化图片资源，使用适当的尺寸和格式
+
+### 8.3 配置问题
+
+**问题**：组件配置不生效或配置错误
+
+**解决方案**：
+- 检查配置路径是否正确
+- 确保配置值的类型正确
+- 使用默认值，确保配置缺失时的稳定性
+- 查看控制台日志，定位配置错误
+
+## 9. 未来发展方向
+
+### 9.1 技术升级
+
+- **Vue 3**：考虑升级到 Vue 3，使用 Composition API
+- **uni-app X**：跟进 uni-app 的最新版本
+- **TypeScript**：引入 TypeScript，提高代码类型安全性
+
+### 9.2 功能扩展
+
+- **组件库丰富**：增加更多业务组件，覆盖更多场景
+- **功能增强**：为现有组件增加更多功能
+- **国际化**：支持多语言
+
+### 9.3 工具链完善
+
+- **脚手架**：提供更完善的组件创建脚手架
+- **文档**：完善组件文档，提供更多示例
+- **测试**：增加自动化测试，提高代码质量
+
+## 10. 总结
+
+聚福宝业务组件基础插件包（jufubao-base）采用了一套完整、规范的组件化开发思想，通过模块化设计、配置化开发、混入机制、跨平台适配等技术手段，实现了高效、可维护的组件库。
+
+该项目的编程思想和技术实践，为我们提供了宝贵的参考：
+
+1. **模块化设计**：提高代码复用性和可维护性
+2. **配置化开发**：支持可视化编辑，提高开发效率
+3. **跨平台适配**：实现一次开发多端运行
+4. **统一的代码规范**：保证代码质量和一致性
+5. **完善的工具链**：提高开发和部署效率
+
+通过学习和借鉴这些编程思想，我们可以在未来的项目中构建更加高效、可维护的前端应用。

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jufubao-base",
-  "version": "1.0.340",
+  "version": "1.0.341-beta1",
   "private": false,
   "description": "聚福宝业务组件基础插件包",
   "main": "index.js",

package/src/components/JfbBaseCardInfo/Attr.js

@@ -8,7 +8,7 @@ export default {
       label: '票券绑定成功回跳票券列表地址:',
       ele: 'xd-select-pages-path',
       valueKey: 'back_url',
-      groupKey:'advanced',
+      groupKey: 'advanced',
       placeholder: '请选择票券绑定成功回跳票券列表地址',
       value: null,
       setting: {
@@ -20,7 +20,7 @@ export default {
       label: '票券绑定成功回跳票券详情地址:',
       ele: 'xd-select-pages-path',
       valueKey: 'back_detail_url',
-      groupKey:'advanced',
+      groupKey: 'advanced',
       placeholder: '请选择票券绑定成功回跳票券详情地址',
       value: null,
       setting: {
@@ -32,7 +32,7 @@ export default {
       label: '我的票券跳转地址:',
       ele: 'xd-select-pages-path',
       valueKey: 'my_card_url',
-      groupKey:'advanced',
+      groupKey: 'advanced',
       placeholder: '请选择我的票券跳转地址',
       value: null,
       setting: {
@@ -44,20 +44,31 @@ export default {
       label: "票券过期是否展示余额",
       ele: "xd-radio",
       valueKey: "is_show_balance",
-      groupKey:'content',
+      groupKey: 'content',
       value: "N",
       list: [
-        {label: "是", value: "Y"},
-        {label: "否", value: "N"},
+        { label: "是", value: "Y" },
+        { label: "否", value: "N" },
       ]
     },
+    {
+      label: "配置套餐描述是否默认展开:",
+      ele: "xd-radio",
+      valueKey: "isExpandDesc",
+      value: "N",
+      list: [
+        { label: "展示", value: "Y" },
+        { label: "隐藏", value: "N" }
+      ],
+      groupKey: "content",
+    },
     {
       label: '券号框自定义文案:',
       ele: 'el-input',
       type: 'text',
       valueKey: 'card_num_placeholder',
       value: '',
-      groupKey:'content',
+      groupKey: 'content',
       placeholder: '请输入券号框自定义文案',
       className: 'input80'
     },
@@ -65,12 +76,11 @@ export default {
       label: '密码框自定义文案:',
       ele: 'el-input',
       type: 'text',
-      groupKey:'content',
+      groupKey: 'content',
       valueKey: 'card_pwd_placeholder',
       value: '',
       placeholder: '请输入密码框自定义文案',
       className: 'input80'
     },
-
   ],
 };

package/src/components/JfbBaseCardInfo/JfbBaseCardInfo.vue

@@ -154,7 +154,13 @@
                 
                 <!-- 底部业务线描述 -->
                 <view class="jfb-base-card-info__body-type-choose-item-business">
-                  功能说明: {{ item.multiple_desc}}
+                  <view :class="{ 'expanded': isItemExpanded === item.multiple_id }">
+                    功能说明: {{ item.multiple_desc}}
+                  </view>
+                  <view :style="{color:mainColor}" v-if="isExpandDesc === 'Y'" class="jfb-base-card-info__body-type-choose-item-business-expand" @click="toggleExpand(item.multiple_id)">
+                    {{ isItemExpanded === item.multiple_id ? '收起描述' : '展开描述' }}
+                    <XdFontIcon style="margin-left:20rpx" size="26" :icon="isItemExpanded === item.multiple_id?'iconshang_up':'iconxia_down'"></XdFontIcon>
+                  </view>
                 </view>
               </view>
               
@@ -249,6 +255,8 @@ export default {
       ], // 票券类型列表
       multiple_id: '', // 多场景ID
       multiple_scene: '', // 多场景场景
+      isExpandDesc: "N", // 配置套餐描述是否默认展开
+      isItemExpanded: null, // 当前展开的项目ID
     };
   },
   computed: {
@@ -395,6 +403,8 @@ export default {
       this.card_pwd_placeholder = getContainerPropsValue(container, "content.card_pwd_placeholder", "请输入密码");
       this.is_show_balance = getContainerPropsValue(container, 'content.is_show_balance', "N");
       this.my_card_url = getContainerPropsValue(container, 'content.my_card_url', { value: "" }).value;
+      this.isExpandDesc = getContainerPropsValue(container,'content.isExpandDesc',"N")
+      this.isExpandDesc = "Y"
     },
     onJfbLoad(options) {
       this.qrcode = options.qrcode || options.pa;
@@ -551,6 +561,9 @@ export default {
       this.multiple_id = item.multiple_id;
       this.multiple_scene = item.multiple_scene;
       this.handleToLink()
+    },
+    toggleExpand(multipleId) {
+      this.isItemExpanded = this.isItemExpanded === multipleId ? null : multipleId;
     }
   },
 };
@@ -769,7 +782,30 @@ export default {
         &-business {
           font-size: unit(24, rpx);
           color: #999;
-          line-height: unit(36, rpx);
+          line-height: unit(36, rpx);          
+          & > view:first-child {
+            display: -webkit-box;
+            -webkit-line-clamp: 1;
+            -webkit-box-orient: vertical;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            margin-bottom: unit(10, rpx);
+            
+            &.expanded {
+              -webkit-line-clamp: 9999;
+              overflow: visible;
+              text-overflow: clip;
+            }
+          }
+          
+          &-expand {
+            font-size: unit(26, rpx);
+            text-align: center;
+            margin-top: unit(20, rpx);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          }
         }
 
         &-btn-wrap {

package/src/components/JfbBaseCardInfo/Mock.js

@@ -15,6 +15,19 @@ module.exports = {
     "request_id": "741c41d86c5ae0cf",
     "main_business_code_name": "蛋糕(勿改)",
     "other_card_point": 4073,
+    "multiple_info": {
+      is_support_multiple: "Y",
+      multiple_list: [
+        {
+          card_type_name: '多余额卡',
+          end_time: "2024-10-31 23:59:59",
+          card_number: "101001000005195",
+          card_point: 500,
+          "multiple_desc": "蛋糕、电影、礼包、在线选座、电影选座、在线选座(3D)、电影选座(3D)、提货商城、提货商城(3D)、蛋糕商城",
+          multiple_id: 1
+        }
+      ]
+    }
   },
   pwdCardBind: { "id": 20, "request_id": "91f76bd11d5889be" },
   qrcodeCardBind: {},

package/src/components/JfbBaseCardInfoEntry/Attr.js

@@ -57,6 +57,17 @@ export default {
         {label: "否", value: "N"},
       ]
     },
+    {
+      label: "配置套餐描述是否默认展开:",
+      ele: "xd-radio",
+      valueKey: "isExpandDesc",
+      value: "N",
+      list: [
+        { label: "展示", value: "Y" },
+        { label: "隐藏", value: "N" }
+      ],
+      groupKey: "content",
+    },
     {
       label: "是否展示主业务线",
       ele: "xd-radio",

package/src/components/JfbBaseCardInfoEntry/JfbBaseCardInfoEntry.vue

@@ -174,7 +174,13 @@
                 
                 <!-- 底部业务线描述 -->
                 <view class="jfb-base-card-info-entry__body-type-choose-item-business">
-                  功能说明: {{ item.multiple_desc}}
+                  <view :class="{ 'expanded': isItemExpanded === item.multiple_id }">
+                    功能说明: {{ item.multiple_desc}}
+                  </view>
+                  <view v-if="isExpandDesc === 'Y'" :style="{color:mainColor}" class="jfb-base-card-info-entry__body-type-choose-item-business-expand" @click="toggleExpand(item.multiple_id)">
+                    {{ isItemExpanded === item.multiple_id ? '收起描述' : '展开描述' }}
+                    <xd-font-icon style="margin-left:20rpx" size="26" :icon="isItemExpanded === item.multiple_id?'iconshang_up':'iconxia_down'"></xd-font-icon>
+                  </view>
                 </view>
               </view>
               
@@ -254,6 +260,8 @@ export default {
       cardTypeList: [], // 票券类型列表
       multiple_id: '', // 多场景ID
       multiple_scene: '', // 多场景场景
+      isExpandDesc: "N", // 配置套餐描述是否默认展开
+      isItemExpanded: null, // 当前展开的项目ID
     };
   },
   watch: {
@@ -410,7 +418,8 @@ export default {
       this.card_pwd_placeholder = getContainerPropsValue(container, "content.card_pwd_placeholder", "请输入密码");
       this.my_card_url = getContainerPropsValue(container, 'content.my_card_url', { value: "" }).value;
       this.is_show_balance = getContainerPropsValue(container, 'content.is_show_balance', "N");
-      this.isShowBuss = getContainerPropsValue(container, 'content.isShowBuss', 'N')
+      this.isShowBuss = getContainerPropsValue(container, 'content.isShowBuss', 'N');
+      this.isExpandDesc = getContainerPropsValue(container, 'content.isExpandDesc', "N");
       //'wechat_mini_program|default'
       this.entryGroupId = getContainerPropsValue(container,"content.entryGroupId","default");
     },
@@ -588,6 +597,9 @@ export default {
         this.hasCon = data;
       }
       console.log('onJfbCustomEvent',action, data);
+    },
+    toggleExpand(multipleId) {
+      this.isItemExpanded = this.isItemExpanded === multipleId ? null : multipleId;
     }
   },
 };
@@ -1097,6 +1109,30 @@ export default {
           font-size: unit(24, rpx);
           color: #999;
           line-height: unit(36, rpx);
+          
+          & > view:first-child {
+            display: -webkit-box;
+            -webkit-line-clamp: 1;
+            -webkit-box-orient: vertical;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            margin-bottom: unit(10, rpx);
+            
+            &.expanded {
+              -webkit-line-clamp: 9999;
+              overflow: visible;
+              text-overflow: clip;
+            }
+          }
+          
+          &-expand {
+            font-size: unit(26, rpx);
+            text-align: center;
+            margin-top: unit(20, rpx);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          }
         }
 
         &-btn-wrap {

package/src/components/JfbBaseCardSweepInfo/Attr.js

@@ -38,6 +38,17 @@ export default {
         {label: "是", value: "Y"},
         {label: "否", value: "N"},
       ]
-    }
+    },
+    {
+      label: "配置套餐描述是否默认展开:",
+      ele: "xd-radio",
+      valueKey: "isExpandDesc",
+      value: "N",
+      list: [
+        { label: "展示", value: "Y" },
+        { label: "隐藏", value: "N" }
+      ],
+      groupKey: "content",
+    },
   ],
 };

package/src/components/JfbBaseCardSweepInfo/JfbBaseCardSweepInfo.vue

@@ -109,7 +109,13 @@
                 
                 <!-- 底部业务线描述 -->
                 <view class="jfb-base-card-sweep-info__body-type-choose-item-business">
-                  功能说明: {{ item.multiple_desc}}
+                  <view :class="{ 'expanded': isItemExpanded === item.multiple_id }">
+                    功能说明: {{ item.multiple_desc}}
+                  </view>
+                  <view v-if="isExpandDesc === 'Y'" :style="{color:mainColor}" class="jfb-base-card-sweep-info__body-type-choose-item-business-expand" @click="toggleExpand(item.multiple_id)">
+                    {{ isItemExpanded === item.multiple_id ? '收起描述' : '展开描述' }}
+                    <xd-font-icon style="margin-left:20rpx" size="26" :icon="isItemExpanded === item.multiple_id?'iconshang_up':'iconxia_down'"></xd-font-icon>
+                  </view>
                 </view>
               </view>
               
@@ -193,6 +199,8 @@ export default {
       ], // 票券类型列表
       multiple_id: '', // 多场景ID
       multiple_scene: '', // 多场景场景
+      isExpandDesc: "N", // 配置套餐描述是否默认展开
+      isItemExpanded: null, // 当前展开的项目ID
     };
   },
   watch: {
@@ -312,6 +320,7 @@ export default {
       this.backUrl = getContainerPropsValue( this.container, "content.back_url", { value: "" }).value;
       this.back_detail_url = getContainerPropsValue( this.container, "content.back_detail_url", { value: "" }).value;
       this.is_show_balance = getContainerPropsValue(this.container, 'content.is_show_balance', "N");
+      this.isExpandDesc = getContainerPropsValue(this.container, 'content.isExpandDesc', "N");
     },
      handleConfirmBind(item) {
       if (!item) {
@@ -406,6 +415,9 @@ export default {
         this.hasCon = data;
       }
       console.log('onJfbCustomEvent',action, data);
+    },
+    toggleExpand(multipleId) {
+      this.isItemExpanded = this.isItemExpanded === multipleId ? null : multipleId;
     }
   },
 };
@@ -612,6 +624,30 @@ export default {
           font-size: unit(24, rpx);
           color: #999;
           line-height: unit(36, rpx);
+          
+          & > view:first-child {
+            display: -webkit-box;
+            -webkit-line-clamp: 1;
+            -webkit-box-orient: vertical;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            margin-bottom: unit(10, rpx);
+            
+            &.expanded {
+              -webkit-line-clamp: 9999;
+              overflow: visible;
+              text-overflow: clip;
+            }
+          }
+          
+          &-expand {
+            font-size: unit(26, rpx);
+            text-align: center;
+            margin-top: unit(20, rpx);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          }
         }
 
         &-btn-wrap {