@epxing/utils 0.0.0-stage → 5.3.0-beta.2

package/src/locale.js

@@ -0,0 +1,104 @@
+import storage from '@epxing/utils/src/storage'
+
+const STANDARD_SEGMENT = /^[A-Za-z0-9_]+$/
+const LEGACY_LOCALES = {
+  '010': 'zh-CN',
+  '011': 'en-US'
+}
+
+// 导出：调用 setCurrentLanguage/CHANGE_LOCALE 前，凡是从 clientConfig.LANGUAGES 原始拆分
+// 拿到候选 id（可能仍是 '010'/'011' 这类旧三位码）的调用点，都要先过这一层再传下去——
+// CHANGE_LOCALE 只认 configuredLocales() 吐出来的归一化形式，两边不归一化会静默/报错不匹配
+// （已在 AppNav.vue switchLanguage 实测复现：传 '010' 时 supportedLocales 里是 'zh-CN'，
+// find 不到，throw '当前客户未启用语言：010'）。
+export function normalizeLocale (locale) {
+  return LEGACY_LOCALES[locale] || locale
+}
+
+export function languagePreferenceKey (clientCode) {
+  return `${clientCode || ''}-language`
+}
+
+export function configuredLocales (clientConfig = {}) {
+  const languages = String(clientConfig.LANGUAGES || '')
+    .split(',')
+    .map(value => normalizeLocale(value.trim()))
+    .filter(Boolean)
+  const defaultLocale = normalizeLocale(clientConfig.LANGUAGE_DEFAULT || 'zh-CN')
+  const supportedLocales = languages.length > 0 ? languages : [defaultLocale]
+  return {
+    enabled: clientConfig.LANGUAGE_FLAG === '1',
+    defaultLocale,
+    supportedLocales
+  }
+}
+
+export function resolveCurrentLocale (clientConfig = {}, userInfo = {}) {
+  const clientCode = clientConfig.CODE || ''
+  const configuration = configuredLocales(clientConfig)
+  if (!configuration.enabled) return configuration.defaultLocale
+
+  const preferred = normalizeLocale(storage.get(languagePreferenceKey(clientCode)) || userInfo.LANGUAGE)
+  const matched = configuration.supportedLocales.find(locale => locale.toLowerCase() === String(preferred || '').toLowerCase())
+  return matched || configuration.defaultLocale
+}
+
+function utf8Hex (value) {
+  return Array.from(new TextEncoder().encode(value))
+    .map(byte => byte.toString(16).padStart(2, '0'))
+    .join('')
+}
+
+function resourceSegment (value) {
+  const normalized = String(value || '').trim()
+  if (!normalized) throw new Error('国际化消息名称不能为空')
+  return STANDARD_SEGMENT.test(normalized) ? normalized.toLowerCase() : `x_${utf8Hex(normalized)}`
+}
+
+export function uiMessageResourceKey (messageName, systemId) {
+  const raw = String(messageName || '').trim().split('.')
+  // 与后端 Java String.split("\\.") 保持一致：丢弃末尾空段，但保留中间空段供合法性校验。
+  while (raw.length > 0 && raw[raw.length - 1] === '') raw.pop()
+  const start = raw[0] && raw[0].toLowerCase() === 'frame' ? 1 : 0
+  const segments = raw.slice(start).map(resourceSegment)
+  if (segments.length === 1) segments.unshift(resourceSegment(systemId))
+  if (segments.length < 2) throw new Error(`国际化消息名称缺少有效语义段：${messageName}`)
+  return `page.${segments.join('.')}`
+}
+
+export function createUiMessageCatalog (rows = [], systemId) {
+  const fallbackMessages = {}
+  const aliases = {}
+  rows.forEach(row => {
+    const name = String(row.NAME || '').trim()
+    if (!name) return
+    const resourceKey = uiMessageResourceKey(name, systemId)
+    fallbackMessages[name] = row.CONTENT
+    fallbackMessages[resourceKey] = row.CONTENT
+    const keys = aliases[resourceKey] || (aliases[resourceKey] = [])
+    keys.push(name)
+    // 组件里内置的默认文案（如按钮「保存」）直接以默认语言原文调 $t，
+    // 这里按原文再登记一个别名，让它们复用已有消息的译文，不必改写成消息编码。
+    // 同一原文对应多条消息时以先登记的为准，都是同义文案，取哪条都成立。
+    const source = String(row.CONTENT || '').trim()
+    if (source && source !== name && !Object.prototype.hasOwnProperty.call(fallbackMessages, source)) {
+      fallbackMessages[source] = row.CONTENT
+      keys.push(source)
+    }
+  })
+  return { fallbackMessages, aliases }
+}
+
+export function createRuntimeMessages (publishedMessages = {}, catalog = {}) {
+  const messages = { ...publishedMessages }
+  const aliases = catalog.aliases || {}
+  Object.keys(aliases).forEach(resourceKey => {
+    if (!Object.prototype.hasOwnProperty.call(publishedMessages, resourceKey)) return
+    aliases[resourceKey].forEach(key => {
+      if (!Object.prototype.hasOwnProperty.call(messages, key)) {
+        messages[key] = publishedMessages[resourceKey]
+      }
+    })
+  })
+  return messages
+}

package/src/menu-open.js

@@ -0,0 +1,72 @@
+/**
+ * 菜单「外部打开」类打开方式的统一处理
+ *
+ * 背景：菜单打开方式（FM_MODULE.OPEN_TYPE）里有两种不进内部页面栈、直接开新窗口的：
+ * 「链接」(6) 跳手填地址，「打开应用」(7) 跳指定应用。二者点击语义完全相同
+ * （开新窗 + 不产生页签 + 不参与菜单高亮），差别只在目标 URL 从哪来，故收在本模块，
+ * 避免各菜单组件（AppNav / ModuleIndexPage / ModuleTabsPage / ConfigModuleIndex …）
+ * 各写一份 OPEN_TYPE 分支。
+ *
+ * 为什么 7 要现查：拼应用地址需要「应用编码 + 所属系统编码 + 客户编码」三级值，
+ * 而菜单树接口（getUserMenuTreeData → ModuleNode）只逐字段透传 FM_MODULE 本表列，
+ * 带不出关联应用的这三个编码，故点击时才按 REFERENCE_APP 查一次。
+ * 又因浏览器会拦截非用户手势的 window.open，先在点击的同步阶段占一个空白新窗，
+ * 取到地址后再回写它的 location。
+ */
+
+// 开新窗、不产生页签的打开方式：6=链接、7=打开应用
+const EXTERNAL_OPEN_TYPES = ['6', '7']
+
+/**
+ * 是否为「开新窗」类菜单（点击后不产生页签，也不需要 MAIN_PAGE）
+ */
+export function isExternalMenu (module) {
+  return !!module && EXTERNAL_OPEN_TYPES.indexOf(module.OPEN_TYPE) > -1
+}
+
+/**
+ * 打开「开新窗」类菜单。返回是否已由本模块接管（true 时调用方应直接 return，不要再走建页面逻辑）
+ * @param {Object} module 菜单节点（菜单树接口返回的 ModuleNode）
+ * @param {Object} vm 调用方组件实例，用其 $http / $util / $message
+ */
+export function openExternalMenu (module, vm) {
+  if (!isExternalMenu(module)) return false
+  if (module.OPEN_TYPE === '6') {
+    if (module.LINK_URL) window.open(module.LINK_URL)
+    return true
+  }
+  // 打开方式=7（打开应用）：没配目标应用时按「已接管」处理，避免退化成打开空白页面
+  if (!module.REFERENCE_APP) {
+    vm.$message.error('该菜单未配置目标应用')
+    return true
+  }
+  // 先同步占窗，规避异步回调里 window.open 被浏览器拦截
+  const win = window.open('', '_blank')
+  // link 取到所属系统及其客户的编码，三段一起用于拼应用地址
+  vm.$http.get({
+    entityId: 'FM_SERVICE',
+    id: module.REFERENCE_APP,
+    link: 'system,system|client'
+  })
+    .then(res => {
+      const app = (res && res.data) || {}
+      const clientCode = app['SYSTEM|CLIENT|CODE']
+      const systemCode = app['SYSTEM|CODE']
+      if (!app.CODE || !systemCode || !clientCode) {
+        if (win) win.close()
+        vm.$message.error('没有找到该应用')
+        return
+      }
+      const url = `${vm.$util.getRootPath()}/app/${clientCode}/${systemCode}/${app.CODE}`
+      if (win) {
+        win.location = url
+      } else {
+        // 占窗被拦截时退化为当前窗口打开，保证功能可用
+        window.open(url)
+      }
+    })
+    .catch(() => {
+      if (win) win.close()
+    })
+  return true
+}

package/src/mermaid.js

@@ -0,0 +1,115 @@
+/**
+ * Markdown 正文里的 mermaid 图渲染。
+ *
+ * Wiki 的设计文档、流程说明大量用 mermaid 写图（Beaver 侧还有 MermaidLintTool 专门校验它），
+ * 不渲染的话读者看到的是一坨 `flowchart LR ...` 源码——那正是这份文档想省掉的东西。
+ *
+ * **懒加载**：mermaid 打出来两三兆，而绝大多数页面根本没有图。所以按需 import，
+ * 一个进程只加载一次；没有图的页面完全不碰它。
+ *
+ * 站点正文与问答的引用抽屉共用这一份：同一段 md 在两处必须画出同一张图，
+ * 各写一份迟早会分叉。
+ */
+
+let loading = null
+
+/** 每张图要一个全局唯一 id，mermaid 用它建临时 DOM。 */
+let seq = 0
+
+/**
+ * 加载 mermaid 并初始化。
+ *
+ * `startOnLoad: false`——我们自己控制渲染时机；让它自动扫全文档的话，
+ * 抽屉这种动态插入的内容它根本扫不到。
+ */
+function load () {
+  if (!loading) {
+    loading = import(/* webpackChunkName: "mermaid" */ 'mermaid')
+      .then(mod => {
+        const mermaid = mod.default || mod
+        mermaid.initialize({
+          startOnLoad: false,
+          // 图里的标签可能来自 Wiki 正文，正文不是可信输入——securityLevel 保持严格，
+          // 让 mermaid 转义标签内容，别给它注入 HTML 的机会
+          securityLevel: 'strict',
+          // Mermaid 默认会在语法错误时把一张“Syntax error”错误图挂到 document.body。
+          // Wiki 正文捕获异常后本来就会在代码块旁显示错误说明，因此关闭 Mermaid 自带
+          // 错误图，避免它逃出正文容器并把整个应用页面撑高。
+          suppressErrorRendering: true,
+          theme: 'default',
+          fontFamily: 'inherit',
+          flowchart: { htmlLabels: false, useMaxWidth: true },
+          sequence: { useMaxWidth: true },
+          er: { useMaxWidth: true }
+        })
+        return mermaid
+      })
+      .catch(err => {
+        // 加载失败不能连累正文：图出不来是遗憾，整页白屏是事故
+        loading = null
+        throw err
+      })
+  }
+  return loading
+}
+
+/**
+ * 把容器里的 mermaid 代码块画成图。
+ *
+ * markdown-it 把 ```mermaid 渲染成 `<pre><code class="language-mermaid">`，
+ * 这里找出这些块，逐个交给 mermaid，用 `<div class="mermaid-figure">` 换掉。
+ *
+ * @param {HTMLElement} root 正文容器
+ * @returns {Promise<number>} 画出来几张
+ */
+export async function renderMermaid (root) {
+  if (!root) return 0
+  const blocks = Array.from(root.querySelectorAll('pre > code.language-mermaid, pre > code.mermaid'))
+  if (!blocks.length) return 0
+
+  let mermaid
+  try {
+    mermaid = await load()
+  } catch (e) {
+    blocks.forEach(block => fallback(block, '图表组件加载失败，下面是原始定义'))
+    return 0
+  }
+
+  let done = 0
+  for (const block of blocks) {
+    const code = block.textContent || ''
+    const pre = block.parentElement
+    if (!code.trim() || !pre) continue
+    try {
+      const { svg } = await mermaid.render('wiki-mermaid-' + (++seq), code)
+      const figure = document.createElement('div')
+      figure.className = 'mermaid-figure'
+      figure.innerHTML = svg
+      pre.replaceWith(figure)
+      done++
+    } catch (e) {
+      // 图画不出来通常是语法写错了。保留原始定义并说明原因——
+      // 直接吞掉的话，作者只会看到「我的图没了」，无从判断是自己写错还是平台不支持
+      fallback(block, '这张图没画出来：' + shortMessage(e))
+    }
+  }
+  return done
+}
+
+/** 渲染不了时保留源码，并在上面写清为什么。 */
+function fallback (block, reason) {
+  const pre = block.parentElement
+  if (!pre || pre.previousElementSibling?.classList?.contains('mermaid-figure__error')) return
+  const tip = document.createElement('div')
+  tip.className = 'mermaid-figure__error'
+  tip.textContent = reason
+  pre.parentNode.insertBefore(tip, pre)
+}
+
+/** mermaid 的报错常常带一大段解析器状态，取第一行够定位了。 */
+function shortMessage (e) {
+  const msg = (e && (e.message || e.str)) || '语法有误'
+  return String(msg).split('\n')[0].slice(0, 120)
+}
+
+export default renderMermaid

package/src/meta.js

@@ -0,0 +1,2 @@
+// 兼容旧路径；新代码从 @epxing/core 导入。
+export { default } from '@epxing/core/src/runtime-utils/meta'

package/src/mobile-chart-appearance.js

@@ -0,0 +1,147 @@
+import { getChartType } from './chart-registry'
+
+// 移动端只允许覆盖展示属性，不能通过该配置改变数据、指标或事件。
+export const MOBILE_APPEARANCE_FIELDS = [
+  { key: 'showTitle', label: '显示标题', options: [{ label: '显示', value: true }, { label: '隐藏', value: false }] },
+  { key: 'titleFontSize', label: '标题字号', min: 10, max: 40, defaultValue: 14 },
+  { key: 'legendPosition', label: '图例位置', options: ['top', 'bottom', 'left', 'right', 'hidden'].map((value, i) => ({ value, label: ['顶部', '底部', '左侧', '右侧', '隐藏'][i] })) },
+  { key: 'legendFontSize', label: '图例字号', min: 8, max: 32, defaultValue: 12 },
+  { key: 'axisFontSize', label: '坐标轴字号', min: 8, max: 32, defaultValue: 12 },
+  { key: 'axisLabelRotate', label: '横轴文字角度', min: -90, max: 90, defaultValue: 0 },
+  ...['Top', 'Bottom', 'Left', 'Right'].map((side, i) => ({ key: `grid${side}`, label: `绘图区${['上', '下', '左', '右'][i]}留白`, min: 0, max: 200, defaultValue: 24 })),
+  { key: 'showLabel', label: '显示数据标签', options: [{ label: '显示', value: true }, { label: '隐藏', value: false }] },
+  { key: 'labelFontSize', label: '数据标签字号', min: 8, max: 32, defaultValue: 12 },
+  { key: 'pieRadius', label: '饼图外半径（%）', min: 10, max: 95, defaultValue: 65 }
+]
+
+export function getMobileAppearanceFields (type) {
+  const cartesian = getChartType(type)?.coordinate === 'cartesian2d'
+  const pie = ['pie', 'circularPie'].includes(type)
+  if (!cartesian && !pie && !['funnel', 'radar', 'map', 'wordcloud', 'gauge', 'treemap'].includes(type)) return []
+  return MOBILE_APPEARANCE_FIELDS.filter(field => {
+    if (field.key.startsWith('axis') || field.key.startsWith('grid')) return cartesian
+    if (field.key === 'pieRadius') return pie
+    if (field.key.startsWith('legend')) return !['map', 'wordcloud'].includes(type)
+    if (['showLabel', 'labelFontSize'].includes(field.key)) return type !== 'wordcloud'
+    return true
+  })
+}
+
+export function normalizeMobileAppearance (value = {}) {
+  const result = {}
+  for (const field of MOBILE_APPEARANCE_FIELDS) {
+    const v = value?.[field.key]
+    if (field.options) {
+      if (field.options.some(o => o.value === v)) result[field.key] = v
+    } else if (typeof v === 'number' && Number.isFinite(v) && v >= field.min && v <= field.max) {
+      result[field.key] = v
+    }
+  }
+  return result
+}
+
+// 只复制将修改的对象；保留 formatter 等函数以及完整系列数据。
+export function applyMobileChartAppearance (option, appearance) {
+  const a = normalizeMobileAppearance(appearance)
+  if (!option || !Object.keys(a).length) return option
+  const result = { ...option }
+  const mapPart = (key, update) => {
+    if (Array.isArray(option[key])) result[key] = option[key].map(part => update({ ...part }))
+    else result[key] = update({ ...(option[key] || {}) })
+  }
+  if (a.legendPosition !== undefined || a.legendFontSize !== undefined) {
+    mapPart('legend', legend => {
+      if (a.legendPosition !== undefined) {
+        const pos = a.legendPosition
+        legend.show = pos !== 'hidden'
+        if (pos !== 'hidden') {
+          Object.assign(legend, { top: 'auto', bottom: 'auto', left: 'auto', right: 'auto', orient: ['left', 'right'].includes(pos) ? 'vertical' : 'horizontal' })
+          legend[pos] = 8
+          if (legend.orient === 'horizontal') legend.left = 'center'
+          else legend.top = 'center'
+        }
+      }
+      if (a.legendFontSize !== undefined) legend.textStyle = { ...legend.textStyle, fontSize: a.legendFontSize }
+      return legend
+    })
+  }
+  for (const key of ['xAxis', 'yAxis']) {
+    if (!option[key] || (a.axisFontSize === undefined && (key !== 'xAxis' || a.axisLabelRotate === undefined))) continue
+    mapPart(key, axis => {
+      axis.axisLabel = { ...axis.axisLabel }
+      if (a.axisFontSize !== undefined) axis.axisLabel.fontSize = a.axisFontSize
+      if (key === 'xAxis' && a.axisLabelRotate !== undefined) axis.axisLabel.rotate = a.axisLabelRotate
+      return axis
+    })
+  }
+  if (['Top', 'Bottom', 'Left', 'Right'].some(s => a[`grid${s}`] !== undefined)) {
+    mapPart('grid', grid => {
+      for (const s of ['Top', 'Bottom', 'Left', 'Right']) {
+        if (a[`grid${s}`] !== undefined) grid[s.toLowerCase()] = a[`grid${s}`]
+      }
+      return grid
+    })
+  }
+  if (Array.isArray(option.series)) {
+    result.series = option.series.map(series => {
+      const next = { ...series }
+      if (a.showLabel !== undefined || a.labelFontSize !== undefined) {
+        if (series.type === 'gauge') {
+          next.detail = { ...series.detail }
+          if (a.showLabel !== undefined) next.detail.show = a.showLabel
+          if (a.labelFontSize !== undefined) next.detail.fontSize = a.labelFontSize
+        }
+        next.label = { ...series.label }
+        if (a.showLabel !== undefined) next.label.show = a.showLabel
+        if (a.labelFontSize !== undefined) next.label.fontSize = a.labelFontSize
+      }
+      if (series.type === 'pie' && a.pieRadius !== undefined) {
+        const outer = `${a.pieRadius}%`
+        next.radius = Array.isArray(series.radius) ? [`${Math.min(parseFloat(series.radius[0]) || 0, a.pieRadius)}%`, outer] : outer
+      }
+      return next
+    })
+  }
+  return result
+}
+
+export const mobileChartAppearanceMixin = {
+  props: { mobileAppearance: { type: Object, default: () => ({}) } },
+  inject: {
+    epxMobilePreview: { default: false },
+    registerMobileChartLabel: { default: null },
+    getMobileDashboard: { default: () => () => false }
+  },
+  watch: {
+    mobileChartLabel: {
+      immediate: true,
+      handler (label) {
+        if (this.epxMobilePreview && label && this.registerMobileChartLabel) this.registerMobileChartLabel(this.compId, label, this.chartType)
+      }
+    },
+    chartType: {
+      immediate: true,
+      handler (type) {
+        if (this.epxMobilePreview && type && this.registerMobileChartLabel) this.registerMobileChartLabel(this.compId, this.mobileChartLabel, type)
+      }
+    },
+    activeMobileAppearance: {
+      deep: true,
+      handler () {
+        if (this.myChart && this.chartOption) this.createChart()
+      }
+    }
+  },
+  computed: {
+    mobileChartLabel () {
+      return this.titleText || (typeof this.title === 'string' ? this.title : '')
+    },
+    activeMobileAppearance () {
+      return this.$isMobile || this.epxMobilePreview || this.getMobileDashboard() ? normalizeMobileAppearance(this.mobileAppearance) : {}
+    },
+    mobileTitleFontStyle () {
+      const size = this.activeMobileAppearance.titleFontSize
+      return size === undefined ? {} : { fontSize: `${size}px` }
+    }
+  }
+}

package/src/moment-compat.d.ts

@@ -0,0 +1,91 @@
+import type { Dayjs } from 'dayjs'
+import type { Duration } from 'dayjs/plugin/duration'
+
+/** 对应 moment-compat.js 的 READ_METHODS / WRITE_METHODS，保留可变链式语义。 */
+export interface MomentLike {
+  format(format?: string): string
+  valueOf(): number
+  unix(): number
+  toDate(): Date
+  toISOString(): string | null
+  toJSON(): string | null
+  toString(): string
+  toArray(): number[]
+  toObject(): Record<string, number>
+  isValid(): boolean
+  clone(): MomentLike
+  diff(input?: unknown, unit?: string, precise?: boolean): number
+  isBefore(input?: unknown, unit?: string): boolean
+  isAfter(input?: unknown, unit?: string): boolean
+  isSame(input?: unknown, unit?: string): boolean
+  isSameOrBefore(input?: unknown, unit?: string): boolean
+  isSameOrAfter(input?: unknown, unit?: string): boolean
+  isBetween(start: unknown, end: unknown, unit?: string | null, inclusivity?: string): boolean
+  isLeapYear(): boolean
+  daysInMonth(): number
+  get(unit: string): number
+  from(input: unknown, withoutSuffix?: boolean): string
+  to(input: unknown, withoutSuffix?: boolean): string
+  fromNow(withoutSuffix?: boolean): string
+  toNow(withoutSuffix?: boolean): string
+  calendar(reference?: unknown, formats?: Record<string, string | ((...args: any[]) => string)>): string
+  utcOffset(): number
+  utcOffset(offset: number | string, keepLocalTime?: boolean): MomentLike
+  weekday(): number
+  weekday(value: number): MomentLike
+  isoWeekday(): number
+  isoWeekday(value: number): MomentLike
+  add(amount: number | Duration, unit?: string): this
+  subtract(amount: number | Duration, unit?: string): this
+  startOf(unit: string): this
+  endOf(unit: string): this
+  set(unit: string, value: number): this
+  set(values: Record<string, number>): this
+  local(): this
+  utc(keepLocalTime?: boolean): this
+  locale(): string
+  locale(name: string): this
+  year(): number
+  year(value: number): this
+  month(): number
+  month(value: number): this
+  date(): number
+  date(value: number): this
+  day(): number
+  day(value: number): this
+  hour(): number
+  hour(value: number): this
+  minute(): number
+  minute(value: number): this
+  second(): number
+  second(value: number): this
+  millisecond(): number
+  millisecond(value: number): this
+  quarter(): number
+  quarter(value: number): this
+  week(): number
+  week(value: number): this
+  isoWeek(): number
+  isoWeek(value: number): this
+  dayOfYear(): number
+  dayOfYear(value: number): this
+}
+export interface MomentFactory {
+  (input?: unknown, ...formatAndOptions: any[]): MomentLike
+  duration(input?: unknown, ...unit: any[]): Duration
+  locale(name?: string): string
+  isMoment(value: unknown): value is MomentLike
+  unix(seconds: number): MomentLike
+  utc(input?: unknown, ...formatAndOptions: any[]): MomentLike
+  max(...dates: (MomentLike | Dayjs | (MomentLike | Dayjs)[])[]): MomentLike
+  min(...dates: (MomentLike | Dayjs | (MomentLike | Dayjs)[])[]): MomentLike
+}
+declare const moment: MomentFactory
+export { moment as createMoment }
+export default moment
+export declare function preprocessFormat(format: string, milliseconds?: number, year?: number): string
+export declare const READ_METHODS: string[]
+export declare const WRITE_METHODS: string[]
+export declare const DUAL_METHODS: Set<string>
+export declare const PASSTHROUGH: Set<string>
+export declare const UNSUPPORTED_FORMAT_TOKENS: string[]