quick-platform 1.0.46

package/src/business/declare.d.ts

@@ -0,0 +1,39 @@
+export interface UserInfo {
+  rightList: string[];
+  staffInfo: {
+    email: string;
+    firstName: string;
+    id: string;
+    name: string;
+    role: string;
+    roleList: string[];
+    storeId: number;
+    userId: string;
+    [key: string]: any;
+  };
+  storeInfo: {
+    [key: string]: any;
+    city: string;
+    id: number;
+    platform: string;
+    productCategory: string;
+    storeName: string;
+    timezone: string;
+  };
+  storeLicenceInfo: {
+    storeId: number;
+    name: string;
+    enName: string;
+    expireTime: string;
+    daysToRemain: number;
+    remainExpire: boolean;
+    licenceId: number;
+    productCategory: string;
+    validInviteCode: any;
+    unLimitedLicence: boolean;
+    ultimate: boolean;
+    licenceType: string;
+    useBalance: number;
+  };
+  userId: string;
+}

package/src/business/index.ts

@@ -0,0 +1,130 @@
+import { getCurrentApp } from '../application/manage';
+import ls from '../utils/localstorage';
+import { UserInfo } from './declare';
+import {
+  isCredits,
+  isEnterprise,
+  isFree,
+  isPLG,
+  isProfessional,
+  isSLG,
+} from './version';
+
+interface Env {
+  AIBOT_URL: string;
+  APP_URL: string;
+  CHAT_URL: string;
+  MOPOWER: string;
+  MOPOWER_MICRO: string;
+  Shoplazza_URL: string;
+  Shopify_URL: string;
+  Shopline_URL: string;
+  Shopyy_URL: string;
+  PRODUCT_URL: string;
+  PRODUCT_TYPE_URL: string;
+  COLLECTION_URL: string;
+  appId: number;
+  isProd?: boolean;
+  isDev?: boolean;
+  isTest?: boolean;
+  socketUrl: string;
+}
+
+let GlobalUserInfo: UserInfo = {} as any;
+
+export const login = (userInfo: UserInfo) => {
+  const root = getCurrentApp()?.root;
+  if (!getCurrentApp()?.isRoot) {
+    console.warn(
+      'quick platform login warn:current App is not Root App. Invalid login！',
+      getCurrentApp()
+    );
+  }
+  GlobalUserInfo = userInfo;
+  if (root) {
+    root?.cache('userinfo', userInfo);
+  }
+};
+
+const buildSystemGetter = <T>(
+  fn: (data: UserInfo) => T
+): (() => Partial<T>) => {
+  return () => {
+    const root = getCurrentApp()?.root;
+    if (!root) {
+      console.warn('quick platform warn:root App not found!!!');
+    }
+    const userinfo = root?.cache('userinfo');
+    if (!userinfo?.userId) {
+      console.error('quick platform warn:root App not logged in yet');
+    }
+    return fn(userinfo || {});
+  };
+};
+
+const authFunction = buildSystemGetter(userInfo => {
+  return userInfo.rightList || [];
+});
+
+export const getUserInfo = buildSystemGetter(userInfo => {
+  return userInfo.statffInfo || {};
+});
+
+export const getStaffInfo = buildSystemGetter(userInfo => {
+  return userInfo.staffInfo || {};
+});
+
+export const getStoreInfo = buildSystemGetter(userInfo => {
+  return userInfo.storeInfo || {};
+});
+
+export const getStoreLicense = buildSystemGetter(
+  userInfo => userInfo.storeLicenceInfo || {}
+);
+
+export const hasAuth = (code: string) => {
+  return authFunction().includes(code);
+};
+
+export const getSystem = () => {
+  const oem = process.env.OEM_NAME;
+  const defaultLang = oem ? 'zh-CN' : 'en-US';
+  return {
+    oem: oem,
+    env: process.env.REACT_APP_ENVKEY,
+    lang: (ls.getData('qs_lang') || defaultLang) as
+      | 'zh-CN'
+      | 'en-US'
+      | 'ko'
+      | 'ja'
+      | 'zh-TW',
+    token: sessionStorage.getItem('quick-token') || '',
+    requestTokenKey: 'quick-token',
+    storeId: sessionStorage.getItem('quick-im-storeId') || '',
+  };
+};
+
+export const getOEMName = () => {
+  return (window as any).QUICK_CEP?.oem?.name;
+};
+
+const LicenseCreator = (
+  fn: (licence: Partial<UserInfo['storeLicenceInfo']>) => boolean
+) => {
+  return () => {
+    return fn(getStoreLicense());
+  };
+};
+
+export const License = {
+  isPLG: LicenseCreator(isPLG),
+  isSLG: LicenseCreator(isSLG),
+  isEnterprise: LicenseCreator(isEnterprise),
+  isFree: LicenseCreator(isFree),
+  isProfessional: LicenseCreator(isProfessional),
+  isCredits: LicenseCreator(isCredits),
+  getLicense: getStoreLicense,
+  isOEM() {
+    return !!getOEMName();
+  },
+};

package/src/business/version.ts

@@ -0,0 +1,58 @@
+import { UserInfo } from './declare';
+
+enum ReleaseMap {
+  'Trial' = 1,
+  'Free' = 2,
+  'Basic' = 3,
+  'Professional' = 4,
+  'Ultimate' = 5,
+  'FreeCode' = 13,
+  'Starter' = 14,
+  'Growth' = 15,
+  'Enterprise' = 6,
+}
+//@mark LicenseTypeMap对应storeInfo里面的licenceType
+// storeInfo 里的licenceType与licenceId没有对应关系，不能复用上文ReleaseMap的处理
+enum LicenseTypeMap {
+  Enterprise = 'ENTERPRISE', //企业版本
+  PLG = 'PLG', // (, "PLG版本"),
+}
+
+const PLGList: number[] = [
+  ReleaseMap.Free,
+  ReleaseMap.FreeCode,
+  ReleaseMap.Starter,
+  ReleaseMap.Growth,
+];
+
+export const isPLG = (licence: Partial<UserInfo['storeLicenceInfo']>) => {
+  if (typeof licence.licenceId === 'undefined') return false;
+  return PLGList.includes(licence.licenceId);
+};
+
+export const isSLG = (licence: Partial<UserInfo['storeLicenceInfo']>) => {
+  return !isPLG(licence);
+};
+
+export const isEnterprise = (
+  licence: Partial<UserInfo['storeLicenceInfo']>
+) => {
+  return ReleaseMap.Enterprise === licence.licenceId;
+};
+
+export const isFree = (licence: Partial<UserInfo['storeLicenceInfo']>) => {
+  return ReleaseMap.Free === licence.licenceId;
+};
+
+export const isProfessional = (
+  licence: Partial<UserInfo['storeLicenceInfo']>
+) => {
+  return ReleaseMap.Professional === licence.licenceId;
+};
+
+export const isCredits = (licence: Partial<UserInfo['storeLicenceInfo']>) => {
+  return !(
+    LicenseTypeMap.Enterprise === licence.licenceType &&
+    licence.useBalance === 1
+  );
+};

package/src/components/IconFont.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { createFromIconfontCN } from '@ant-design/icons';
+import { IconFontProps } from '@ant-design/icons/lib/components/IconFont';
+const hasInstalled = !!document.getElementById('_CD_ICON_1633');
+const IconFont: React.FC<IconFontProps> = createFromIconfontCN({
+  scriptUrl: hasInstalled
+    ? ''
+    : 'https://front-assets.obs.ap-southeast-3.myhuaweicloud.com/library/icon/icon.js', //https://front-assets.quickcep.com/library/icon/icon.js
+});
+
+export default IconFont;

package/src/components/LocalDebug.ts

@@ -0,0 +1,244 @@
+import React, { PropsWithChildren, useEffect, useState } from 'react';
+const URls = {
+  UserInfoUrl: '/store/user/getUserInfo',
+  Login: '/store/user/login',
+  StoreList: '/store/store/list',
+  ChangeStore: '/store/store/switch',
+};
+import * as Authentication from '../business';
+
+const useRequest = (
+  http: (...args: any[]) => Promise<any>,
+  url: string,
+  ...params: any[]
+) => {
+  const [data, setData] = useState<any>();
+  const [loading, setLoading] = useState(true);
+  const request = () => {
+    setLoading(true);
+    return http(url, ...params)
+      .then(user => {
+        setData(user);
+      })
+      .finally(() => {
+        setLoading(false);
+      });
+  };
+  useEffect(() => {
+    request();
+  }, []);
+
+  return {
+    data,
+    loading,
+    request,
+    setData,
+  };
+};
+
+const Spining = React.createElement(
+  'div',
+  {
+    style: {
+      width: '100%',
+      height: '100&',
+      textAlign: 'center',
+      fontSize: 40,
+    },
+  },
+  ['微应用本地调试模式初始化中...']
+);
+
+const valueById = (id: string) => (document.getElementById(id) as any)!.value;
+
+const Login: React.FC<{ onLogin(data: any): void }> = props => {
+  const login = () => {
+    props.onLogin({
+      email: valueById('local_debug_account'),
+      loginStatus: 2,
+      password: valueById('local_debug_password'),
+    });
+  };
+  return React.createElement(
+    'div',
+    {
+      style: {
+        fontSize: 20,
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        flexDirection: 'column',
+        height: '100%',
+      },
+    },
+    [
+      React.createElement('div', {}),
+      [
+        '请先登录:',
+        React.createElement('table', {}, [
+          React.createElement('tr', {}, [
+            React.createElement('td', {}, [
+              '帐号:',
+              React.createElement('input', {
+                id: 'local_debug_account',
+                style: { fontSize: 20, width: 400 },
+              }),
+            ]),
+          ]),
+          React.createElement('tr', {}, [
+            React.createElement('td', {}, [
+              '密码:',
+              React.createElement('input', {
+                id: 'local_debug_password',
+                type: 'password',
+                style: { fontSize: 20, width: 400 },
+              }),
+            ]),
+          ]),
+          React.createElement('tr', {}, [
+            React.createElement(
+              'td',
+              {
+                colSpan: 2,
+              },
+              [
+                React.createElement(
+                  'button',
+                  {
+                    style: { fontSize: 20, width: '100%' },
+                    onClickCapture: login,
+                  },
+                  ['登录']
+                ),
+              ]
+            ),
+          ]),
+        ]),
+      ],
+    ]
+  );
+};
+
+const Info: React.FC<{
+  onLogout(): void;
+  post(...args: any[]): Promise<any>;
+}> = ({ post, ...props }) => {
+  const store = Authentication.getStoreInfo();
+  const staff = Authentication.getStaffInfo();
+  const lang = window.localStorage.getItem('quick_local_debug_lang') || 'zh-CN';
+  const { data } = useRequest(post, URls.StoreList);
+  return React.createElement(
+    'div',
+    {
+      style: { position: 'fixed', right: 10, bottom: 10, zIndex: 10000 },
+    },
+    [
+      'quick-platform子应用调试工具：',
+      React.createElement('div', { key: 'store' }, [
+        React.createElement('span', { style: { float: 'left' } }, [
+          `当前店铺:`,
+        ]),
+        React.createElement(
+          'select',
+          {
+            style: { fontSize: 16 },
+            value: store.id,
+            onChange: (e: any) => {
+              post(URls.ChangeStore, { storeId: e.target.value })
+                .then(data => {
+                  sessionStorage.setItem('quick-storeId', data.storeId);
+                  sessionStorage.setItem('quick-token', data.jwt);
+                  sessionStorage.removeItem('quick-qyWechat');
+                  console.log(
+                    '%c [ halvee>]-133',
+                    'font-size:13px; background:pink; color:#bf2c9f;',
+                    data.jwt
+                  );
+                  window.location.reload();
+                })
+                .catch(() => {
+                  alert('切换店铺失败');
+                });
+            },
+          },
+          (data || []).map((item: any) => {
+            return React.createElement(
+              'option',
+              { value: item.id, key: item.id },
+              [item.storeName]
+            );
+          })
+        ),
+      ]),
+      React.createElement('div', {}, [
+        React.createElement('span', { style: { float: 'left' } }, [
+          `当前语言:`,
+        ]),
+        React.createElement(
+          'select',
+          {
+            style: { fontSize: 16 },
+            value: lang,
+            onChange(e: any) {
+              localStorage.setItem('quick_local_debug_lang', e.target.value);
+              window.location.reload();
+            },
+          },
+          ['zh-CN', 'en-US', 'ko', 'ja', 'zh-TW'].map(key => {
+            return React.createElement('option', { value: key, key: key }, [
+              key,
+            ]);
+          })
+        ),
+      ]),
+      React.createElement('div', { key: 'user' }, [`当前用户:${staff.email}`]),
+      React.createElement(
+        'button',
+        {
+          onClick() {
+            sessionStorage.clear();
+            props.onLogout();
+          },
+        },
+        ['退出登录']
+      ),
+    ]
+  );
+};
+
+const LocalDebug: React.FC<PropsWithChildren<{
+  hideInfo: boolean;
+  post(...args: any[]): Promise<any>;
+}>> = ({ post, ...props }) => {
+  const { loading, data, setData } = useRequest(post, URls.UserInfoUrl);
+  if (loading) return Spining;
+  if (!data)
+    return React.createElement(Login, {
+      onLogin: info => {
+        post(URls.Login, info)
+          .then(data => {
+            Authentication.login(data);
+            setData(data);
+          })
+          .catch(e => {
+            alert(e.data.message || '登录失败');
+          });
+      },
+    });
+  sessionStorage.setItem('quick-token', data.jwt);
+  Authentication.login(data);
+  if (props.hideInfo)
+    return React.createElement(React.Fragment, {}, props.children);
+  return React.createElement(React.Fragment, {}, [
+    React.createElement(Info, {
+      key: 'info-wrapper',
+      post,
+      onLogout() {
+        setData(null);
+      },
+    }),
+    props.children,
+  ]);
+};
+
+export default LocalDebug;

package/src/components/MicroApp.ts

@@ -0,0 +1,97 @@
+import React, { useEffect, useRef, useState } from 'react';
+import { getCurrentApp, loadApp } from '../application';
+import { assign } from '../utils/utils';
+import { getSystem } from '../business';
+import events from '../event';
+
+const MicroApp: React.FC<{
+  name: string;
+  extra?: any;
+  base?: string;
+  env?: string;
+  host?: string;
+  data?: any;
+  className?: string;
+  loading?: React.ReactNode;
+  entry?: string;
+  onMounted?(): void;
+}> = props => {
+  const app = useRef<any>();
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    return () => {
+      if (app.current) {
+        console.log(props.name, '应用卸载');
+        app.current.unmount();
+        console.log(props.name, '应用卸载完成');
+      }
+    };
+  }, []);
+  useState(() => {
+    if (props.data) {
+      getCurrentApp().cache(`${props.name}-data`, props.data);
+    }
+  });
+
+  useEffect(() => {
+    if (props.data) {
+      getCurrentApp().cache(`${props.name}-data`, props.data);
+      events.broadcast(`${props.name}-data-change`, props.data);
+    }
+  }, [props.data, props.name]);
+
+  return React.createElement(
+    'div',
+    {
+      style: {
+        width: '100%',
+        height: '100%',
+        position: 'relative',
+      },
+    },
+    [
+      React.createElement('div', {
+        style: { width: '100%', height: '100%' },
+        className: props.className,
+        ref(instance: any) {
+          if (!instance || app.current) return;
+          const system = getSystem();
+          app.current = loadApp(
+            props.name,
+            instance,
+            Object.assign(
+              {},
+              props.extra,
+              assign('base', props.base),
+              assign('host', props.host),
+              assign('env', props.env || system.env),
+              assign('entry', props.entry)
+            )
+          );
+          app.current.mountPromise.then(() => {
+            setLoading(false);
+            props.onMounted?.();
+          });
+        },
+      }),
+      loading
+        ? React.createElement(
+            'div',
+            {
+              style: {
+                width: '100%',
+                height: '100%',
+                position: 'absolute',
+                top: 0,
+                left: 0,
+              },
+            },
+            [props.loading]
+          )
+        : null,
+    ]
+  );
+};
+
+export default MicroApp;

package/src/components/Permission.ts

@@ -0,0 +1,13 @@
+import React, { PropsWithChildren } from 'react';
+
+import { hasAuth } from '../business';
+
+const Permission: React.FC<PropsWithChildren<{
+  code: string; // 权限码
+  auth?: () => boolean; // 自定义权限检验
+}>> = ({ auth = () => true, ...props }) => {
+  if (hasAuth(props.code) && auth()) return props.children as any;
+  return null;
+};
+
+export default Permission;

package/src/components/context.ts

@@ -0,0 +1,31 @@
+import React, { useMemo, useState, useEffect } from 'react';
+import { getCurrentApp } from '../application';
+import events from '../event';
+
+const AppContext = React.createContext({ data: null as any });
+
+export const useAppData = () => React.useContext(AppContext).data;
+
+export const App: React.FC<any> = props => {
+  const app = getCurrentApp();
+  const [data, setData] = useState(app.parent?.cache(`${app.name}-data`));
+  useEffect(() => {
+    const update = (data: any) => {
+      setData(data);
+    };
+    events.on(`${app.name}-data-change`, update);
+    return () => {
+      events.off(`${app.name}-data-change`, update);
+    };
+  }, [app.name]);
+  const value = useMemo(() => {
+    return { data };
+  }, [data]);
+  return React.createElement(
+    AppContext.Provider,
+    {
+      value,
+    },
+    [props.children]
+  );
+};

package/src/components/i18n.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+const I18nFC = (text: string, data?: Record<string, any>) => {
+  if (!data) return text;
+  const list: React.ReactNode[] = [];
+  let prev = 0;
+  text.replace(/\{[a-zA-Z_0-9]*\}/g, (match, index) => {
+    const prevText = text.slice(prev, index);
+    list.push(prevText);
+    list.push(data[match.slice(1, -1)]);
+    prev = index + match.length;
+    return '';
+  });
+  list.push(text.slice(prev, text.length));
+  return React.createElement(React.Fragment, {}, list as any);
+};
+
+export default I18nFC;

package/src/config.ts

@@ -0,0 +1,3 @@
+import { UnoConfig } from './theme/uno';
+
+export { UnoConfig };

package/src/event.ts

@@ -0,0 +1,24 @@
+import { getCurrentApp } from './application/manage';
+
+const events = {
+  /**
+   *向父级发送事件
+   */
+  trigger(name: string, data: any) {
+    getCurrentApp()?.trigger(name, data);
+  },
+  /**
+   *向子级发送事件
+   */
+  broadcast(name: string, data: any) {
+    getCurrentApp()?.broadcast(name, data);
+  },
+  on(name: string, handler: (...args: any[]) => void) {
+    getCurrentApp()?.on(name, handler);
+  },
+  off(name: string, handler: (...args: any[]) => void) {
+    getCurrentApp()?.off(name, handler);
+  },
+};
+
+export default events;