@cloudbase/lowcode-builder 0.1.26 → 1.0.0

package/template/src/handlers/utils/widgets.js

@@ -1,320 +0,0 @@
-import * as React from 'react';
-import { observable, autorun, untracked } from 'mobx';
-import { remove } from 'lodash';
-import { checkVisible } from '../../utils/index';
-
-export const WidgetsContext = React.createContext({ parent: null });
-
-export function isSlot(comp) {
-  return !comp['x-props'];
-}
-
-// 实现和小程序一致的 API，以兼容多端
-// widget.getDom({ rect: true })
-// https://developers.weixin.qq.com/miniprogram/dev/api/wxml/NodesRef.fields.html
-export function getDom(element, options) {
-  if (!element) {
-    console.warn('getDom 接口未传入有效的 element');
-    return Promise.resolve({});
-  }
-
-  let result = {};
-  if (options.id) result.id = element.id;
-  if (options.dataset) result.dataset = element.dataset;
-  if (options.rect) {
-    const rect = element.getBoundingClientRect();
-    Object.assign(result, {
-      left: rect.left,
-      right: rect.right,
-      top: rect.top,
-      bottom: rect.bottom,
-    });
-  }
-  if (options.size) {
-    const rect = element.getBoundingClientRect();
-    Object.assign(result, {
-      width: rect.width,
-      height: rect.height,
-    });
-  }
-  if (options.scrollOffset) {
-    Object.assign(result, {
-      scrollLeft: element.scrollLeft,
-      scrollTop: element.scrollTop,
-    });
-  }
-  if (options.properties && Array.isArray(options.properties)) {
-    options.properties.forEach((propName) => {
-      result[propName] = element.getAttribute(propName);
-    });
-  }
-  if (options.computedStyle && Array.isArray(options.computedStyle)) {
-    const computedStyle = window.getComputedStyle(element);
-    options.computedStyle.forEach((propName) => {
-      result[propName] = computedStyle[propName];
-    });
-  }
-
-  return Promise.resolve(result);
-}
-
-export function findWidgets(
-  widget,
-  parentType,
-  filterFn,
-  includeInvisibleDescendants
-) {
-  if (!widget) return [];
-
-  let { children = [] } = widget;
-  let matched = children.filter(filterFn);
-  if (!includeInvisibleDescendants) {
-    children = children.filter((item) => checkVisible(item));
-    matched = matched.filter((item) => checkVisible(item));
-  }
-  children.forEach((child) => {
-    // 如果递归过程中发现了自己，则停止递归
-    if (child.widgetType === parentType) return;
-    matched = matched.concat(findWidgets(child, parentType, filterFn));
-  });
-  return matched;
-}
-
-const retryQueue = [];
-// 递归执行
-export function retryDataBinds(tryTime = 10) {
-  const fn = retryQueue.shift();
-  if (!fn || tryTime <= 0) return;
-  try {
-    fn({ showLog: tryTime <= 1 });
-  } catch (e) {
-    console.error('retryDataBinds', e);
-  }
-  setTimeout(() => {
-    retryDataBinds(tryTime - 1);
-  }, 0);
-}
-export function createWidgets(widgetProps, dataBinds, scopeContext = {}) {
-  const nodeTree = createWidgetTree(widgetProps, dataBinds);
-  const widgets = runFor(nodeTree, {}, null, null, scopeContext);
-  return widgets;
-
-  /**
-   *
-   * @param {*} curForNode
-   * @param {*} forItems
-   * @param {*} parentLevelWidgets
-   * @param {*} parentWidget
-   * @param {*} scopeContext
-   * @returns top level widgets or for dispose
-   */
-  function runFor(
-    curForNode,
-    forItems,
-    parentLevelWidgets,
-    parentWidget,
-    scopeContext
-  ) {
-    const nodeId = curForNode.id;
-    if (!curForNode.value) {
-      return createSubTree(curForNode, {}, scopeContext);
-    }
-    const dispose = autorun(() => {
-      let forList = [];
-      try {
-        forList = dataBinds[nodeId]._waFor(forItems, undefined, scopeContext);
-      } catch (e) {
-        console.warn('waFor error', e);
-      }
-
-      if (!Array.isArray(forList)) {
-        forList = [];
-        console.warn(nodeId, 'For 循环绑定的数据并不是数组，请检查');
-      }
-
-      // 让 forList 进行监听
-      forList.forEach(() => {});
-      untracked(() => {
-        disposeWidgets(parentLevelWidgets[curForNode.id]);
-
-        // clean nodes of previouse for run
-        dfsTree(curForNode, (node) => {
-          const arr = parentLevelWidgets[node.id];
-          arr.splice(0, arr.length);
-          parentWidget &&
-            remove(parentWidget.children, ({ id }) => id === node.id);
-        });
-
-        forList.forEach((item, index) => {
-          const subForItems = { ...forItems, [nodeId]: item };
-          createSubTree(curForNode, subForItems, scopeContext);
-        });
-
-        // 非初始化时遇到需要重新构建 dataBinds
-        retryDataBinds();
-      });
-    });
-
-    return dispose;
-
-    function createSubTree(curForNode, subForItems, scopeContext) {
-      const widgets = {};
-
-      // traverse down the tree to set all widgets
-      dfsTree(curForNode, (node, parentNode) => {
-        if (node.forCount === curForNode.forCount) {
-          // Leaf node
-          const w = observable(widgetProps[node.id]);
-          w.id = node.id;
-          if (node === curForNode) {
-            w._disposers = [];
-          }
-          widgets[node.id] = w;
-          w.findWidgets = (type, includeInvisibleDescendants) =>
-            findWidgets(w, w.widgetType, type, includeInvisibleDescendants);
-          w.getWidgetsByType = (type, includeInvisibleDescendants) =>
-            w.findWidgets(
-              (currentWidget) => currentWidget.widgetType === type,
-              includeInvisibleDescendants
-            );
-          w.getOwnerWidget = () => null; // 寻找父widget，默认返回null， 后续会覆写
-          // 提供一个给 Node 挂载 API 的方式
-          untracked(() => {
-            w.extends = (name, fnOrData) =>
-              Object.defineProperty(w, name, {
-                value: fnOrData,
-                writable: true,
-              });
-          });
-          w.children = [];
-          const parent = parentNode ? widgets[parentNode.id] : parentWidget;
-          if (parent) {
-            w.parent = parent;
-            // 只有可显示 visible 的才存入 children 里
-            if (checkVisible(w)) {
-              parent.children.push(w);
-            }
-          }
-          parentLevelWidgets && parentLevelWidgets[node.id].push(w);
-
-          // Setup data binds
-          Object.keys(dataBinds[node.id] || {}).map((prop) => {
-            if (prop === '_waFor') {
-              return;
-            }
-            function getBindData(options = {}) {
-              let disposeError = false;
-              const dispose = autorun(() => {
-                try {
-                  // Computed data bind in the next tick since data bind may read widgets data
-                  w[prop] = dataBinds[node.id][prop](
-                    subForItems,
-                    undefined,
-                    scopeContext
-                  );
-                  disposeError = false;
-                } catch (e) {
-                  options.showLog && console.error(e);
-                  retryQueue.push(getBindData);
-                  disposeError = true;
-                }
-              });
-              if (!!disposeError && curForNode.id) {
-                widgets[curForNode.id]._disposers.push(dispose);
-              }
-            }
-            getBindData();
-          });
-        } else {
-          if (parentLevelWidgets) {
-            const len = parentLevelWidgets[node.id].push([]);
-            widgets[node.id] = parentLevelWidgets[node.id][len - 1];
-          } else {
-            widgets[node.id] = observable([]);
-          }
-        }
-      });
-
-      // run for of next level
-      dfsTree(curForNode, (node, parentNode) => {
-        if (
-          node.forCount === curForNode.forCount + 1 &&
-          dataBinds[node.id]?._waFor
-        ) {
-          widgets[node.id]._disposers = { dataBinds: [] };
-          const dispose = runFor(
-            node,
-            subForItems,
-            widgets,
-            node.parent && widgets[node.parent.id],
-            scopeContext
-          );
-          curForNode.id && widgets[curForNode.id]._disposers.push(dispose);
-        }
-      });
-
-      return widgets;
-    }
-  }
-}
-
-/**
- * Add parent, children to widget
- */
-function createWidgetTree(widgets, dataBinds) {
-  const virtualRoot = { children: [], forCount: 0 };
-  const nodes = Object.keys(widgets).reduce((result, id) => {
-    result[id] = {
-      id,
-      value: widgets[id],
-      children: [],
-      parent: null,
-      forCount: 0,
-    };
-    return result;
-  }, {});
-
-  // Create widgets tree API
-  Object.keys(nodes).map((id) => {
-    const curNode = nodes[id];
-    const parent = nodes[widgets[id]._parentId];
-    if (!parent) {
-      virtualRoot.children.push(curNode);
-      return;
-    }
-    curNode.parent = parent;
-    parent.children.push(curNode);
-  });
-
-  virtualRoot.children.map(addForCount);
-
-  // dfs, add forCount
-  function addForCount(node) {
-    if (node.parent) {
-      node.forCount = node.parent.forCount;
-    }
-    if (dataBinds[node.id] && dataBinds[node.id]._waFor) {
-      node.forCount++;
-    }
-    node.children.map(addForCount);
-  }
-
-  return virtualRoot;
-}
-
-function dfsTree(node, fn, parent) {
-  node.value && fn(node, parent);
-  node.children.map((e) => dfsTree(e, fn, node.value ? node : null));
-}
-
-// dispose autorun
-function disposeWidgets(widgets = []) {
-  widgets.forEach((widget) => {
-    const disposers = widget._disposers;
-    if (disposers) {
-      disposers.map((dispose) => dispose());
-      disposers.splice(0, disposers.length);
-    }
-    disposeWidgets(widget.children);
-  });
-}

package/template/src/index.jsx

@@ -1,142 +0,0 @@
-/**
- * 当本应用是乾坤子应用是，publicPath需要设置为子应用的相对路径
- * 这个变量时序重要需要先初始化
- */
-if (window.__POWERED_BY_QIANKUN__) {
-  __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
-}
-
-
-import * as React from 'react'
-import * as ReactDOM from 'react-dom'
-import { setConfig } from './datasources/index'
-import App from './router'
-import './utils/monitor-jssdk.min'
-import './index.less'
-// 引入数据源管理器并进行初始化
-import './datasources'
-import { initGlobalVar } from './handlers/initWebEnv'
-import '@babel/polyfill/noConflict'
-import attachFastClick from 'fastclick'
-attachFastClick && attachFastClick.attach && attachFastClick.attach(document.body)
-import { app } from './app/global-api'
-// app 中注册配置页面以及app的全局配置miniprogram.config，h5里分app以及web页分别处理，使用process.env.isApp 区分判断
-if (process.env.isApp) {
-  import { initWebConfig } from 'handlers/lifecycle'
-  const AppConfig = require('../webpack/miniprogram.config')
-  initWebConfig(app, AppConfig);
-}
-
-// 设置数据源请求的 loading 及 toast 处理
-setConfig({
-  beforeDSRequest: (cfg) => {
-    if (!cfg.options || !cfg.options.showLoading) return
-    app.showLoading()
-  },
-  afterDSRequest: (cfg, error, result) => {
-    if (!cfg.options) return
-    if (cfg.options.showLoading) app.hideLoading()
-    if (!cfg.options.showToast) return
-    const isSuccess = !error && result && !result.code
-    app.showToast({icon: isSuccess ? 'success' : 'error'})
-  }
-})
-// window.app.yyptReport = window.yyptReport
-
-if (yyptReport && typeof yyptReport.pgvMain == 'function') {
-  // report_url,appKey必填
-  yyptReport.pgvMain({
-    appKey: '<%= yyptAppKey %>', // 填入你申请的运营平台的应用key(必填)
-    report_url: '<%= reportUrl %><%= yyptAppKey %>', // 上报url（把后端上报接口需要先挂网关，该url填写网关地址）
-    autoReportPv: true, // 单页应用监听页面路径改变自动上报Pv，默认为false
-    stopReport: <%= stopReport %>, // 停止上报
-    // 其他参数说明
-    // customUserPrams: null, // 用户自定义的额外属性--对于小马的用户属性，比如用户的部门编码(customUserPrams: { deptno: 1100 })需要在小马系统事先配置好
-    //userKey: "user_id", // cookie里面用户的唯一标示
-    //autoWatchClick: true, // 默认开启自动监听hottag
-    //isWxEnv: false// 是否微信环境，微信环境会通过wx.getNetworkType获取网络环境
-    // 通过传入函数，可以让业务方写代码传入要上报的属性，比如返回自定义属性，这里主要也是自定义属性，让sdk获取并且进行上报，减少重复编码
-    //getCusParams: function () {
-    //  return {kv:{money:1}}; //kv:Key-Value,自定义事件Key-Value参数对	map	JSON格式，在报表页面的事件参数分析页和页面参数分析页中可以看到上报的kv值
-    //},
-  })
-}
-
-initGlobalVar()
-;(function() {
-  function flex() {
-    try {
-      let htmlDom = document.documentElement
-      let width = window.innerWidth || htmlDom.clientWidth
-      let fontSize = width / (375 / 14)
-      if (
-        !navigator.userAgent.match(
-          /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|IEMobile)/i
-        ) &&
-        fontSize > 14
-      ) {
-        htmlDom.style.fontSize = `14px`
-      } else {
-        htmlDom.style.fontSize = fontSize + `px`
-      }
-    } catch (e) {
-      console.error(e)
-    }
-  }
-
-  flex()
-  window.addEventListener('resize', flex)
-})()
-
-// 使用HMR
-if (process.env.NODE_ENV !== 'production') {
-  if (module.hot) {
-    module.hot.accept()
-  }
-}
-
-function render(props){
-    ReactDOM.render(
-      <App />,
-      props && props.container ? props.container.querySelector('#root') : document.getElementById('root')
-    )
-}
-
-// if (!process.env.isAdminPortal) {
-if (!window.__POWERED_BY_QIANKUN__) {
-  render()
-}
-
-/**
- * bootstrap 只会在微应用初始化的时候调用一次，下次微应用重新进入时会直接调用 mount 钩子，不会再重复触发 bootstrap。
- * 通常我们可以在这里做一些全局变量的初始化，比如不会在 unmount 阶段被销毁的应用级别的缓存等。
- */
-async function bootstrap() {
-  console.log('react app bootstraped')
-}
-
-/**
- * 应用每次进入都会调用 mount 方法，通常我们在这里触发应用的渲染方法
- */
-async function mount(props) {
-  render(props)
-}
-
-/**
- * 应用每次切出/卸载 会调用的方法，通常在这里我们会卸载微应用的应用实例
- */
-async function unmount(props) {
-  ReactDOM.unmountComponentAtNode(
-    props.container ? props.container.querySelector('#root') : document.getElementById('root')
-  )
-}
-
-<% if(adminPortalKey){ %>
-((global) => {
-  global['<%= adminPortalKey %>'] = {
-    bootstrap,
-    mount,
-    unmount,
-  };
-})(window);
-<% } %>

package/template/src/index.less

@@ -1,119 +0,0 @@
-// 针对小程序样式做适配
-// 请注意与weapps/src/pages/editor/components/Main/EditAndPreview/index.iframe.scss的一致性，以确保小程序端样式与
-body {
-  margin: 0;
-  padding: 0;
-}
-
-#weapp-scancode-video {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-}
-
-.weapp-scancode {
-  &-close-button {
-    background: white;
-    color: black;
-    display: flex;
-    position: absolute;
-    top: 14px;
-    left: 14px;
-    width: 24px;
-    height: 24px;
-    border-radius: 50%;
-    cursor: pointer;
-    justify-content: center;
-    align-items: center;
-    z-index: 500;
-  }
-  &-modal {
-    position: fixed;
-    background-color: black;
-    left: 0px;
-    right: 0px;
-    top: 0px;
-    bottom: 0px;
-    &-main {
-      height: 100%;
-      position: relative;
-    }
-  }
-  &-scan {
-    &-wrapper {
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      height: 100%;
-      width: 100%;
-      position: absolute;
-      top: 0;
-      left: 0;
-    }
-    &-square {
-      --square-size: 16rem;
-      width: var(--square-size);
-      height: var(--square-size);
-      position: relative;
-    }
-    &-bar {
-      position: absolute;
-      height: 10px;
-      width: 100%;
-      background: linear-gradient(90deg, transparent, #07c160 50%, transparent);
-      top: 0%;
-      border-top-left-radius: 50%;
-      border-top-right-radius: 50%;
-      animation: slideinout-top-down 2s;
-      animation-direction: normal;
-      animation-timing-function: linear;
-      animation-iteration-count: infinite;
-    }
-    &-tip {
-      margin-top: 10rem;
-      color: white;
-    }
-    &-not-found {
-      color: white;
-    }
-    &-not-found + p {
-      color: #999;
-    }
-  }
-
-  &-img-selector {
-    position: absolute;
-    bottom: 32px;
-    right: 32px;
-    z-index: 500;
-  }
-  &-img-picker {
-    z-index: 500;
-    padding: 5px;
-    display: block;
-    cursor: pointer;
-  }
-}
-
-@keyframes slideinout-top-down {
-  // use transform to prevent relayout
-  0% {
-    transform: translateY(0px);
-    opacity: 0;
-  }
-  50% {
-    transform: translateY(calc(var(--square-size) / 2));
-    opacity: 0.5;
-  }
-  100% {
-    transform: translateY(var(--square-size));
-    opacity: 0;
-  }
-}
-
-@media (min-width: 1024px) {
-  .weda-responsive_flex_flow {
-    flex-flow: row !important;
-  }
-}