/** * form-platform-mixin.js * * 表单组件共用的平台检测 mixin * * 集中维护 3 个 computed: * - platform 当前运行平台 key(与后端 formConfig.terminal 键名对齐) * - platformAliases 后端键名 → 内部 platform 名 兼容层 * - platformConfigKeys 当前平台的有效配置键集合(用于从 formConfig.terminal 查找) * * 消费方: * - components/ns-form/ns-form.vue * - components/ns-newform/ns-newform.vue * - 任何需要按端读取 formConfig.terminal.{h5|weapp|harmony|app} 的表单组件 * * 设计原则: * 1. 单一真值:避免 ns-form / ns-newform 各自维护导致漂移 * 2. 纯 computed mixin:不依赖 props/data/methods,便于跨组件复用 * 3. 不依赖 util.js 等其它模块,避免循环依赖 * 4. 通过 mixins: [...] 引入,组件侧不再写平台判断代码 * * 用法: * import formPlatformMixin from '@/common/js/form-platform-mixin.js'; * export default { * mixins: [formPlatformMixin], * computed: { * config() { * const cur = this.platform; * const keys = this.platformConfigKeys; * // ... * } * } * }; */ export default { computed: { /** * 当前运行平台标识(与后端 formConfig.terminal 键名对齐) * 后端在 formConfig.terminal 下挂的差异化配置键:h5 / weapp / mp-harmony / app * 这里返回的 key 必须与后端设计器输出的 terminal 字段名一致 */ platform() { // #ifdef H5 return 'h5'; // #endif // #ifdef MP-WEIXIN return 'weapp'; // #endif // #ifdef MP-ALIPAY return 'mp-alipay'; // #endif // #ifdef MP-BAIDU return 'mp-baidu'; // #endif // #ifdef MP-TOUTIAO return 'mp-toutiao'; // #endif // #ifdef APP-PLUS return 'app'; // #endif // #ifdef MP-HARMONY return 'harmony'; // #endif // #ifdef QUICKAPP-WEBVIEW return 'quickapp'; // #endif return 'h5'; }, /** * 后端键名 → 内部 platform 名 兼容层 * 不同后端序列化路径可能用 mp-weixin / wechat / mp-harmony 等不同的 key, * 在这里统一映射到内部 platform 名,避免 config() 里到处写 if/else。 */ platformAliases() { return { 'h5': 'h5', 'weapp': 'weapp', 'mp-weixin': 'weapp', 'wechat': 'weapp', 'harmony': 'harmony', 'app': 'app', 'app-plus': 'app' }; }, /** * 当前平台的有效配置键集合 * 用于 config() 中查找 formConfig.terminal 下的平台差异化配置: * - 后端格式:formConfig.terminal = { h5: {...}, weapp: {...}, harmony: {...} } * - 旧式扁平:formConfig[platformKey] = { ... } * 返回所有映射到当前 platform 的后端键名,方便两种结构都能命中。 */ platformConfigKeys() { const cur = this.platform; const aliases = this.platformAliases; const keys = []; Object.keys(aliases).forEach(k => { if (aliases[k] === cur) keys.push(k); }); // 加入当前平台名(兼容 formConfig[platform] 这种扁平写法) if (keys.indexOf(cur) === -1) keys.push(cur); return keys; } } };