ibsp-fg-page 4.0.2

package/src/models/app/ComponentLib.ts

@@ -0,0 +1,189 @@
+import useEnv from '@hooks/useEnv';
+import { getCommonLib } from '@ibsp-component-lib'
+import { reactive } from 'vue';
+
+import { getAppComponentLibVersionApi } from '@/api/ibsp-bg-app';
+export interface ComponentLib{
+  id: string
+  idSysLibCpmt: string
+  compVersion: string
+  createTime: string
+  createPerson: string
+  updateTime: string
+  updatePerson: string
+  remark: string
+  status: string
+  defaultTag: string
+  files: ComponentLibFile[]
+  compCode: string
+  sysLibComp: string
+  name?: string
+}
+export interface ComponentLibFile{
+  id: string
+  idSysOssBucket: string
+  objectName: string
+  objectVirtualName: string
+  pid: string
+  maxSize: any
+  objectSize: number
+  objectToken: string
+  objectFullpath: string
+  objectType: string
+  objectSuffix: string
+  fileStoragePath: string
+  status: string
+  createPerson: string
+  createTime: string
+  updatePerson: string
+  updateTime: string
+  remark: any
+  idSysUser: string
+  idSysOrg: any
+  busSign: any
+}
+
+export interface ComponentLibData{
+    id: string
+    code: string
+    name: string
+  icon: string
+    children: any[]
+}
+
+let _createdCallBack: any = []
+export default class IbspComponentLib {
+
+  appId:string = ''
+  libs: ComponentLib[] = []
+  components:any = {}
+  componentData:ComponentLibData[] = reactive([])
+  IBSP_APP_OSS_WEB:string = ''
+
+  libraryMode:boolean = false
+
+  waitLibs:{
+    code:string,
+    file:()=>Promise<void>,
+    callbacks:Function[]
+  }[] = []
+  constructor(app:any) {
+    this.appId = app.appId
+    this.libraryMode = app?.libraryMode ?? false
+    this.IBSP_APP_OSS_WEB = useEnv('IBSP_APP_OSS_WEB')
+  }
+
+  async localComponentLibs(localLibs:any[]) {
+    if (!this.appId) return
+    const commonLib = await getCommonLib()
+    if (this.libraryMode) {
+      // @ts-ignore
+      this.libs = [{
+        compCode: 'common',
+        files: [],
+
+      }].concat(localLibs.map(item=>({
+        compCode: item.code,
+        files: [],
+        name: item.name,
+        id: item.code
+      })))
+      this.registerComponentLib(commonLib)
+      localLibs.forEach(lib =>{
+        this.registerComponentLib(lib)
+      })
+      return
+    }
+    const res = await getAppComponentLibVersionApi(this.appId)
+    // @ts-ignore
+    this.libs = [{
+      compCode: 'common',
+      files: []
+    }].concat((res?.data || []))
+    window.registerComponentLib = this.registerComponentLib
+
+
+    this.libs.forEach(lib=>{
+      if (lib.compCode === 'common') {
+        this.registerComponentLib(commonLib)
+        return
+      }
+      const file = lib.files?.[0]
+      if (file) {
+        this.waitLibs.push({
+          file: this.loadLib.bind(this, this.IBSP_APP_OSS_WEB + file.fileStoragePath),
+          code: lib.compCode,
+          callbacks: []
+        })
+      }
+    })
+    await Promise.all(this.waitLibs.map(item=>item.file()))
+  }
+
+  async loadLib(path:string) {
+    const script = document.createElement('script')
+    script.src = path
+    document.body.appendChild(script)
+  }
+
+  registerComponentLib = (lib:any) => {
+    const code = lib.code
+    if (!(this.libs.some(item => item.compCode === code)) && code !== 'common') {
+      throw new Error(`组件库${code}未注册`)
+    }
+    this.components[code] = {}
+    const modules = lib?.children
+
+    if (modules && Array.isArray(modules)) {
+      for (const item of modules) {
+        const components = item.components
+        const id = item.id || item.code
+        for (const component of components) {
+          component.type = component.type || id
+          component.source = {
+            lib: code,
+            type: id,
+            id: component.id
+          }
+          this.components[code][component.id] = component
+        }
+      }
+    }
+    const _components = this.components[code]
+    // 根据libs的位置，将组件库的数据放到componentData中
+    const index = this.libs.findIndex(item => item.compCode === code)
+    const libData = this.libs[index]
+
+    this.componentData.push({
+      ...lib,
+      name: libData.sysLibComp || libData.name,
+      code: libData.compCode,
+      id: libData.compCode,
+      order: index,
+    })
+    // 处理网络问题导致的组件库未加载完成
+    const waitLibIndex = this.waitLibs.findIndex(item=>item.code === code)
+    if (waitLibIndex >= 0) {
+      this.waitLibs[waitLibIndex]?.callbacks?.forEach?.(callback => callback(this.components))
+      this.waitLibs.splice(waitLibIndex, 1)
+      _createdCallBack.forEach((f:Function) => f({
+        lib,
+        components: _components,
+      }))
+    }
+  }
+
+  /**
+   *  注册组件库创建完成的回调
+   *  warn: 这里有问题，如果注册的时候已经完成了，那么回调就不会执行， 需要改造 ！！！
+   */
+  libCreatedSubscribe = (fun:(data:{
+    lib: ComponentLibData,
+    components: Record<string, any>
+  })=>void)=>{
+    if (_createdCallBack.includes(fun)) return
+    _createdCallBack.push(fun)
+  }
+
+
+}

package/src/models/app/IbspApp.ts

@@ -0,0 +1,362 @@
+
+import { provideService } from '@models/service';
+import { useIbspPage } from '@models';
+
+import ComponentLib from './ComponentLib';
+import { emitGlobalEvent } from '../useGlobalEvents';
+import { getUserInfo, getAppInfo, getPageVersionInfo, getEnvConfigData, getPageRuleCounterData } from './_utils'
+import { useUniAction } from './uni';
+import { usePlatformLibStore, usePlatformStore } from '@/stores';
+import { reactive } from 'vue';
+import {commonlyConfig} from '@ibsp-config'
+export type IbspAppOptions = Partial<{
+  appId: string;
+  mode: 'Design' | 'Preview';
+  sysResourceId: string;
+  mainPageId: string;
+  mainPageJson: any;
+  local: boolean;
+  libraryMode: boolean;
+  localLibs:[]
+}
+>
+
+export const _app = {
+  instance: null as IbspApp | null,
+  appResources: {} as Record<IbspApp['appId'], {
+    platformLibStore?: ReturnType<typeof usePlatformLibStore>,
+  }>,
+  _addResources(appId:string, key:string, value:unknown) {
+    if (!this.appResources[appId]) {
+      this.appResources[appId] = {}
+    }
+    // @ts-ignore
+    this.appResources[appId][key] = value;
+  }
+}
+
+export class IbspApp {
+
+  private mainPageId:string = '';
+  appId:string = '';
+  sysResourceId:string = '';
+  mode:'Design' | 'Preview' = 'Preview';
+  libraryMode:boolean = false;
+  readonly pages:Map<string, any> = new Map<string, any>();
+  private readonly forms:Map<string, any> = new Map<string, any>();
+  readonly appPlatDataValues:Map<string, any> = new Map<string, any>();
+  userInfo:UserInfo = {} as UserInfo;
+
+  private _appInfo:AppMainInfo = {} as AppMainInfo;
+  private _local:boolean = false;
+
+  private _options:IbspAppOptions = {};
+
+  componentLib:ComponentLib = {} as ComponentLib;
+
+  mobileParams = reactive({
+    top: 0,
+    bottom: 0
+  })
+
+  store:{
+    platformStore:ReturnType<typeof usePlatformStore>,
+    platformLibStore:ReturnType<typeof usePlatformLibStore>,
+  } = {} as {
+    platformStore:ReturnType<typeof usePlatformStore>,
+    platformLibStore:ReturnType<typeof usePlatformLibStore>,
+  };
+
+  envList:EnvData[] = []
+  counterData:RuleCounterData[] = []
+
+  _actions:Map<string, Function> = new Map<string, Function>();
+
+  platDataValues:Record<string, any> = reactive({})
+
+  private _createdCallBack:Function[] = []
+
+  _uni:any = {}
+
+  commonlyConfig = commonlyConfig
+
+
+  constructor(options?: IbspAppOptions) {
+    if (_app.instance) return _app.instance
+    _app.instance = this
+    this.appId = options?.appId ?? '';
+    this.sysResourceId = ''
+    this.mainPageId = options?.mainPageId ?? '';
+    this.libraryMode = options?.libraryMode ?? false;
+    this.mode = options?.mode ?? 'Preview';
+    this._options = options ?? {};
+    this._local = options?.local ?? false;
+    this._init().then(()=>{
+      this._createdCallBack.forEach((cb:Function)=>cb(this))
+      this._createdCallBack = []
+    })
+  }
+
+  async _init() {
+
+    const token = this.token
+    if (!token) {
+      return emitGlobalEvent('loginExpired')
+    }
+    this.userInfo = await getUserInfo(token)
+
+    if (this.mode === 'Design') {
+      await this.loadIbspService()
+      this.loadTheme()
+    }
+
+
+    if ((!this.appId || !this.sysResourceId) && !this._local && this.mainPageId) {
+      const res = await getAppInfo(this.mainPageId)
+      this.appId = res.appId
+      this.sysResourceId = res.idSysResource
+      this._appInfo = res
+      await this.loadEnv()
+    }
+    window.appId = this.appId
+
+
+    const componentLib = new ComponentLib(this)
+    this.componentLib = componentLib
+
+    const platformLibStore = usePlatformLibStore()
+    const platformStore = usePlatformStore()
+    this.store.platformStore = platformStore
+    this.store.platformLibStore = platformLibStore
+    await platformLibStore.refreshPlatformLibData({
+      types: ['script', 'var'],
+      refreshedCallback: (data:any, props_map:any)=>{
+        this.initPlatDataValue(data, props_map)
+      }
+    })
+    platformLibStore.refreshPlatformLibData({
+      types: ['material', 'method', 'const'],
+      refreshedCallback: (data:any, props_map:any)=>{
+        this.initPlatDataValue(data, props_map)
+      }
+    })
+    this.appPlatDataValues.set(this.appId, this.platDataValues)
+
+
+    _app._addResources(this.appId, 'platformLibStore', platformLibStore)
+
+    if (this.mode === 'Design') {
+      // @ts-ignore
+      platformStore.refreshPlatformData({
+        page: this
+      })
+    }
+
+    this.loadRuleCounter()
+    await this.localComponentLibs(this._options?.localLibs || [])
+
+    Object.assign(this._uni, useUniAction(this))
+    window._uni = this._uni
+  }
+
+  async createPage(params?:{
+    id?:string,
+    data?:any,
+    isMainPage?:boolean,
+    localMode?:boolean,
+    mode?:'Design' | 'Preview'
+  }) {
+    let _id = params?.id
+    let _data = params?.data
+    let _sysResourceId = this.sysResourceId
+    const _mode = params?.mode || 'Design'
+    const _localMode = params?.localMode
+    let pageVersionInfo = {} as PageVersionInfo
+    let name = ''
+    if (_localMode) {
+      if (!_data && _id) {
+        const res = await this.loadPage(_id)
+        _data = res.data
+        _sysResourceId = res.idSysResource
+        pageVersionInfo = res.pageVersionInfo
+        name = res.pageVersionInfo.pageName
+      }
+    } else {
+      if (!_data && !_id) {
+        const mainPageJson = this._appInfo?.verDto?.viewJson || '{}'
+        pageVersionInfo = this._appInfo?.verDto
+        try {
+          _data = JSON.parse(mainPageJson)
+        } catch (e) {
+          throw new Error('mainPageJson is not a valid json')
+        }
+        name = this._appInfo.pageName
+        _id = this.mainPageId
+      } else if (_id && typeof _id === 'string') {
+        if (params?.isMainPage) {
+          this.pages.delete(this.mainPageId)
+          this.mainPageId = _id
+        }
+        const res = await this.loadPage(_id)
+        console.log(res.pageVersionInfo, '===');
+
+        name = name || res.pageVersionInfo?.pageName
+        _data = res.data
+        _sysResourceId = res.pageVersionInfo.idSysResource
+        pageVersionInfo = res.pageVersionInfo
+      }
+
+    }
+    const page = useIbspPage({
+      appId: this.appId,
+      id: _id,
+      app: this,
+      mode: _mode,
+      ..._data,
+      name,
+      pageVersionInfo,
+      sysResourceId: _sysResourceId
+    })
+    this.addPage(page)
+    return page
+  }
+
+  async loadPage(id:string):Promise<any> {
+    const res = (await getPageVersionInfo(id)) as any
+    let data = res.verDto.viewJson
+    try {
+      data = JSON.parse(data)
+    } catch (e) {
+      throw new Error('page data is not a valid json')
+    }
+    return {
+      pageVersionInfo: {
+        ...res.verDto,
+        ...res
+      },
+      data
+    }
+  }
+
+  private async loadIbspService() {
+    const services:Record<string, any> = (import.meta as any).glob('@/views/designer/**/*.service.{ts,js}')
+    for (const [key, value] of Object.entries(services)) {
+      const service = (await value()).default
+      provideService(service, true, this)
+    }
+  }
+
+  private async loadEnv() {
+    this.envList = await getEnvConfigData(this.appId)
+  }
+  async loadRuleCounter() {
+    this.counterData = await getPageRuleCounterData(this.appId)
+  }
+
+
+  private loadTheme():void {
+    // 获取主题配置
+    let ibspTheme = {} as any
+    try {
+      ibspTheme = JSON.parse(localStorage.getItem('ibspTheme') ?? '{}')
+    } catch (e) {
+      ibspTheme = {}
+    }
+
+    // 获取主题颜色
+    let colors = ['#0066FF', '#f7f8fa']
+    if (ibspTheme?.selectThemeColor === 'custom') {
+      colors = ibspTheme?.customThemeColor || ['#0066FF', '#f7f8fa']
+    } else if (Array.isArray(ibspTheme.themeColor) && ibspTheme.themeColor?.length) {
+      colors = ibspTheme?.themeColor
+    }
+
+    // 设置主题颜色
+    document.documentElement.style.setProperty('--ibsp-theme-color', colors[0]);
+    document.documentElement.style.setProperty('--ibsp-theme-color2', colors[1]);
+    document.body.classList.add('designer-mode');
+
+    // 设置主题模式
+    const nextUITheme = JSON.parse(localStorage.getItem('IbspNextUITheme') || 'false')
+    ibspTheme.nextUITheme = nextUITheme
+
+    const mode = ibspTheme.mode || 'dark'
+    document.documentElement.className = `${mode === 'light' ? 'theme-light ibsp-next-ui-light' : 'dark ibsp-next-ui-dark'} ${nextUITheme ? 'ibsp-next-ui' : 'default-ui'}`
+
+  }
+
+  initPlatDataValue(data:any, props_map:any, res:typeof this.platDataValues = this.platDataValues) {
+
+    for (const key in data) {
+      const item = data[key]
+      const code = props_map[key].code
+      const value = props_map[key].value
+      res[key] = {
+        app: item.app.reduce((prv:any, acr:any)=>{
+          prv[acr[code]] = acr[value]
+          return prv
+        }, {}),
+        platform: item.platform.reduce((prv:any, acr:any)=>{
+          prv[acr[code]] = acr[value]
+          return prv
+        }, {})
+      }
+    }
+  }
+
+  getPage = (id?:string)=> {
+    if (!id) return this.pages.get(this.mainPageId)
+    return this.pages.get(id)
+  }
+
+  getForm = (id:string)=> {
+    return this.forms.get(id)
+  }
+
+  addPage = (page:any) => {
+    this.pages.set(page.id, page)
+  }
+
+  addForm = (form:any) => {
+    this.forms.set(form.id, form)
+  }
+
+  created = (fun:Function)=>{
+    if (typeof fun !== 'function') return
+    this._createdCallBack.push(fun)
+  }
+
+
+  async localComponentLibs(localLibs = []) {
+    await this.componentLib.localComponentLibs(localLibs)
+  }
+
+  get token():string {
+    const localToken = localStorage.getItem('ibsp_token') || localStorage.getItem('ibsp-token') || sessionStorage.getItem('ibsp_token')
+    return localToken || ''
+  }
+
+  get mainPage() {
+    return this.getPage(this.mainPageId)
+  }
+
+  get windowQuery() {
+    const _window = window;
+    const arr1 = decodeURI(_window.location.toString()).split('?');
+    const obj:Record<string, string> = {}
+    if (arr1.length > 1) {
+      const arr2 = arr1[1].split('&');
+      for (const element of arr2) {
+        const [key, value] = element.split('=') || [];
+        obj[key] = decodeURIComponent(value)
+      }
+    }
+    return obj
+  }
+
+}
+
+
+export const useIbspApp = (options?:IbspAppOptions)=>{
+  return new IbspApp(options)
+}

package/src/models/app/_utils.ts

@@ -0,0 +1,38 @@
+import useEnv from '@hooks/useEnv';
+
+import { validationLoginApi } from '@/api/ibsp-bg-auth';
+import { pageInfoByVersionIdApi, getPageVersionInfoApi } from '@/api/ibsp-bg-page';
+import { getEnvConfigApi } from '@/api/ibsp-bg-user';
+import { findRulePage } from '@/api/ibsp-bg-counter'
+export const getUserInfo = async (token:string):Promise<UserInfo>=> {
+  if (!token) return {} as UserInfo;
+  const res = await validationLoginApi(token)
+  return {
+    ...((res).data || []),
+    token
+  }
+}
+
+export const getAppInfo = async (configId:string):Promise<any> => {
+  return (await pageInfoByVersionIdApi(configId)).data || {}
+}
+
+export const getPageVersionInfo = async (versionId:string):Promise<PageVersionInfo> => {
+  return (await pageInfoByVersionIdApi(versionId)).data
+}
+
+export const getPageRuleCounterData = async (appId:string = window.appId):Promise<RuleCounterData[]> => {
+  return (await findRulePage({
+    pageNo: 1,
+    pageSize: 100,
+    appId
+  } as any))?.data?.records || []
+}
+
+
+export const getEnvConfigData = async (appId:string):Promise<EnvData[]>=>{
+  const envs = useEnv()
+  const env = (envs.IBSP_APP_MODE !== 'temp' ? envs.IBSP_APP_MODE : envs.env_mode) || 'dev';
+  const res = await getEnvConfigApi({ appId, env, pageNo: 1, pageSize: 100 });
+  return res?.data?.records ?? [];
+}

package/src/models/app/app.d.ts

@@ -0,0 +1,118 @@
+interface AppMainInfo{
+    id: string
+    idSysResource: string
+    pageType: string
+    coverId: string
+    coverUrl: string
+    base64Img: any
+    pageUrl: string
+    pageName: string
+    idPageVersion: string
+    appId: string
+    seqNum: number
+    remark: string
+    createPerson: string
+    createTime: string
+    updatePerson: string
+    updateTime: string
+    createMethod: string
+    createRelation: string
+    status: string
+    pagePid: string
+    designerVersion: string
+    resourceMap: any
+    verDto: PageVersionInfo
+}
+
+interface PageVersionInfo{
+    id: string
+    idPageConfig: string
+    versionIndex: string
+    viewJson: string
+    status: string
+    deployStatus: string
+    createPerson: string
+    createTime: string
+    updatePerson: string
+    updateTime: string
+    appId:string
+}
+
+
+interface EnvData {
+    id: string
+    configName: string
+    configCode: string
+    configValue: string
+    remark: string
+    status: string
+    appId: string
+    idSysConfigEnv: string
+    createTime: string
+    createPerson: string
+    updateTime: string
+    updatePerson: string
+}
+
+
+ interface UserInfo {
+    id: string
+    account: string
+    username: string
+    workCode: string
+    personImage: string
+    status: string
+    statusDesc: any
+    workEmail: string
+    phone: string
+    workTel: string
+    createTime: string
+    birthday: any
+    orgId: any
+    orgList: UserInfoOrgList[]
+    postId: any
+    identity: any
+    orgNames: string
+    adminStatus: boolean
+    token:string
+  }
+
+   interface UserInfoOrgList {
+    id: string
+    pid: string
+    pcode: any
+    orgName: string
+    shortName: string
+    orgCode: string
+    orgType: string
+    legal: string
+    creditCode: string
+    departProp: string
+    workAddress: string
+    workTel: string
+    status: string
+    sort: number
+    departManager: string
+    createTime: string
+    updateTime: any
+    remark: any
+  }
+
+interface RuleCounterData{
+    id: string
+    counterName: string
+    idSysResource: string
+    counterStyle: number
+    keyword: string
+    initialize: number
+    step: number
+    share: number
+    appId: string
+    expression: string
+    status: string
+    createPerson: string
+    createTime: string
+    updatePerson: any
+    updateTime: any
+    remark: any
+}

package/src/models/app/index.ts

@@ -0,0 +1,2 @@
+export * from './IbspApp'
+export * from './_utils'

package/src/models/app/uni/index.ts

@@ -0,0 +1 @@
+export {default as useUniAction} from './useUniAction'