mm_os 3.3.1 → 4.0.0

package/{core/com/component → com/pendant}/config.tpl.json

@@ -1,30 +1,32 @@
 {
 	// 应用于，根据应用而判断使用
-	"app": "{1}",
+	"app": "${app || 'admin'}",
 	// 名称, 用于动态增删改配置
-	"name": "{0}",
+	"name": "${name}",
 	// 标题, 用于查询时
-	"title": "示例组件（挂件）",
+	"title": "${title || '挂件管理器'}",
 	// 描述, 用于介绍该组件的作用
-	"description": "暂无描述",
+	"description": "${description || '描述挂件使用方法'}",
 	// 执行顺序, 数值越小的越优先显示
 	"sort": 100,
 	// 分组, 可以将特有的分一个组, 方便用户查询
-	"group": "default",
+	"group": "${group || 'default'}",
 	// 分类, 例如: 查询生活类、监测类、便民类
-	"type": "默认",
+	"type": "${type || '默认'}",
 	// 脚本文件, 非必传，可和渲染文件二选一传
-	"func_file": "./component.js",
+	"main": "./pendant.js",
 	// 渲染, 非必传，可和脚本文件二选一传
-	"template": "./component.html",
+	"template": "./pendant.html",
 	// 状态, 0为未开启 1为开启
 	"state": 1,
 	// 配置
 	"options": [],
 	// 定位 由后台指定的展示位置
-	"location": [{
-		"path": "/{1}/index",
-		"position": "main",
-		"available": 1
-	}]
+	"location": [
+		{
+			"path": "/${app}/index",
+			"position": "main",
+			"available": 1
+		}
+	]
 }

package/com/pendant/drive.js

@@ -0,0 +1,204 @@
+const compressing = require('compressing');
+const Item = require('mm_machine').Drive;
+
+/**
+ * 挂件驱动类
+ * @augments {Item}
+ * @class
+ */
+class Drive extends Item {
+  static config = {
+    // 应用于，根据应用而判断使用
+    'app': 'home',
+    // 分组, 可以将特有的分一个组, 方便用户查询
+    'group': 'default',
+    // 分类, 例如: 查询生活类、监测类、便民类
+    'type': '默认',
+    // 脚本文件
+    'main': './pendant.js',
+    // 渲染
+    'template': './pendant.html',
+    // 配置
+    'options': [],
+    // 定位 由后台指定的展示位置
+    'location': []
+  };
+
+  /**
+   * 构造函数
+   * @param {object} config 配置参数
+   * @param {object} parent 父对象
+   * @class
+   */
+  constructor(config, parent) {
+    super({ ...Drive.config, ...config }, parent);
+    // 默认启用热更新
+    this.mode = 3;
+  }
+};
+
+/**
+ * 创建一个参数模型
+ * @returns {object} 返回一个参数模型
+ */
+Drive.prototype.model = function () {
+  return {
+    // 应用于，根据应用而判断使用
+    'app': 'home',
+    // 名称, 用于动态增删改配置
+    'name': 'demo',
+    // 标题, 用于查询时
+    'title': '示例组件',
+    // 描述, 用于介绍该组件的作用
+    'description': '暂无描述',
+    // 执行顺序, 数值越小的越优先显示
+    'sort': 100,
+    // 分组, 可以将特有的分一个组, 方便用户查询
+    'group': 'default',
+    // 分类, 例如: 查询生活类、监测类、便民类
+    'type': '监测',
+    // 脚本文件, 非必传，可和渲染文件二选一传
+    'main': './pendant.js',
+    // 渲染, 非必传，可和脚本文件二选一传
+    'template': './pendant.html',
+    // 状态, 0为未开启 1为开启
+    'state': 1,
+    // 配置
+    'options': [],
+    // 定位 由后台指定的展示位置
+    'location': [{
+      'path': '/admin/index',
+      'position': 'main',
+      'available': 1
+    }]
+  };
+};
+
+/**
+ * 新建配置文件
+ * @param {string} file 文件
+ */
+Drive.prototype.newConfig = function (file) {
+  var fl = __dirname + '/config.tpl.json';
+  if (fl.hasFile()) {
+    var text = fl.loadText();
+    if (text) {
+      var l = $.slash;
+      var arr = file.split(l);
+      arr = arr.slice(arr.indexOf('app'));
+      var app = arr[1];
+      var name = file.dirname();
+      text = text.replaceAll('{0}', name);
+      text = text.replaceAll('{1}', app);
+      file.saveText(text);
+    }
+  }
+};
+
+/**
+ * 新建脚本
+ * @param {string} file 文件
+ */
+Drive.prototype.newScript = function (file) {
+  var fl = __dirname + '/script.tpl.js';
+  if (fl.hasFile()) {
+    var text = fl.loadText();
+    if (text) {
+      var l = $.slash;
+      var arr = file.split(l);
+      var name = arr[arr.length - 2];
+      text = text.replaceAll('{0}', name);
+      file.saveText(text);
+    }
+  }
+
+  var file_html = './pendant.html'.fullname(file.dirname());
+  if (!file_html.hasFile()) {
+    var flh = __dirname + '/pendant.html';
+    if (flh.hasFile()) {
+      var html = flh.loadText();
+      file_html.saveText(html);
+    }
+  }
+};
+
+/**
+ * 获取配置参数
+ * @param {object} body 设置配置
+ */
+Drive.prototype.designOption = function (body) {
+  var cg = this.config;
+  if (Array.isArray(body)) {
+    cg.options = body;
+  } else {
+    var options = cg.options || [];
+    var option = options.getObj({
+      name: body.name
+    });
+    if (option) {
+      Object.assign(option, body);
+    } else {
+      options.push(body);
+    }
+    cg.options = options;
+  }
+};
+
+/**
+ * 挂件模板
+ * @param {object} ctx 请求上下文
+ * @param {object} db 数据管理器,如: { next: async function{}, ret: {} }
+ * @returns {object} 执行结果
+ */
+Drive.prototype.tpl = async function (ctx, db) {
+  var html_file = this.config.template || './pendant.html';
+  return html_file.fullname(this._getDir()).loadText();
+};
+
+/**
+ * 组件主函数
+ * @param {object} ctx 请求上下文
+ * @param {object} db 数据管理器,如: { next: async function{}, ret: {} }
+ * @returns {object} 执行结果
+ */
+Drive.prototype.main = async function (ctx, db) {
+  var model = {};
+  var html_file = this.config.template || './pendant.html';
+  return db.tpl.view(html_file.fullname(this._getDir()), model);
+};
+
+/**
+ * 压缩主题模板
+ * @param {string} zip_dir 要压缩的目录
+ * @returns {string} 打包成功返回压缩包文件地址
+ */
+Drive.prototype.zip = async function (zip_dir = '/static/file/zip/') {
+  var dir = this._getDir();
+  var file = ('./' + this.config.name + '.zip').fullname(zip_dir);
+  file.addDir();
+  await compressing.zip.compressDir(dir, file);
+  if (file.hasFile()) {
+    return file;
+  }
+  return null;
+};
+
+/**
+ * 获取模型
+ * @param {string} type 模型类型
+ * @returns {object} 返回获取到的模型
+ */
+Drive.prototype.getModel = function (type) {
+  let model = { ...this.config };
+  let dir = this._getDir();
+  let l = $.slash;
+  let app_name = dir.between('app' + l, l);
+  let plugin_name = dir.between('plugin' + l, l);
+  let name = dir.basename();
+  model.app = app_name;
+  model.plugin = plugin_name;
+  model.name = model.name || app_name + '_' + name;
+  return model;
+};
+
+module.exports = Drive;

package/com/pendant/index.js

@@ -0,0 +1,441 @@
+const Manager = require('mm_machine').Manager;
+const Drive = require('./drive');
+
+/**
+ * Pendant 挂件类
+ * @augments {Manager}
+ * @class
+ */
+class Pendant extends Manager {
+  /**
+   * 配置参数
+   * @type {object}
+   */
+  static config = {
+    /**
+     * 名称
+     * @type {string}
+     */
+    name: '',
+    /**
+     * 标题
+     * @type {string}
+     */
+    title: '数据库管理',
+    /**
+     * 描述
+     * @type {string}
+     */
+    description: '这是数据库管理器',
+    /**
+     * 检索文件名
+     * @type {string}
+     */
+    filename: 'pendant.json',
+    /**
+     * 模板目录
+     * @type {string}
+     */
+    tpl_dir: __dirname,
+    /**
+     * 基础目录
+     * @type {string}
+     */
+    base_dir: '../common/pendant'.fullname(__dirname),
+    /**
+     * 自定义目录，加载项目自定义资源
+     * @type {string}
+     */
+    dir: './app'.fullname(),
+    /**
+     * 搜索模式 dir按目录搜索 | file按文件名搜索
+     * @type {string}
+     */
+    search_way: 'file',
+    /**
+     * 是否懒加载
+     * @type {boolean}
+     */
+    lazy_load: true,
+    /**
+     * 模式
+     * 1.生产模式，改变文件不会重新加载
+     * 2.热更新模式，改变配置文件会重新加载配置，不重新加载脚本
+     * 3.热重载模式，改变配置文件都会加载配置和脚本
+     * 4.重载模式，执行完后重新加载脚本，避免变量污染
+     * 5.热更新+重载模式，改变配置文件重新加载配置和脚本，执行完后重新加载脚本
+     * @type {number}
+     */
+    mode: 3
+  };
+
+  /**
+   * 构造函数
+   * @param {object} config 配置参数
+   * @param {object} parent 父级模块
+   */
+  constructor(config, parent) {
+    super({ ...Pendant.config, ...config }, parent);
+  }
+}
+
+/**
+ * 挂件驱动类
+ * @type {Drive}
+ */
+Pendant.prototype.Drive = Drive;
+
+/**
+ * 加载列表
+ * @param {Array} list 文件列表
+ */
+Pendant.prototype.loadList = async function (list) {
+  var _this = this;
+
+  // 遍历文件路径
+  for (var i = 0; i < list.length; i++) {
+    var file = list[i];
+    var dir = file.dirname();
+    // 载入文件
+    var obj = file.loadJson(dir);
+    if (obj) {
+      if (obj.constructor == Array) {
+        for (var n = 0; n < obj.length; n++) {
+          var o = obj[n];
+          // 实例化一个驱动
+          await _this.load(dir, o, file);
+        }
+      } else {
+        await _this.load(dir, obj, file);
+      }
+    } else {
+      var fl = _this.dir_base + '/config.tpl.json';
+      if (fl.hasFile()) {
+        var text = fl.loadText();
+        if (text) {
+          var l = $.slash;
+          var name = file.between('Pendant' + l, l);
+          text = text.replaceAll('{0}', name);
+          var app = file.between('app' + l, l);
+          text = text.replaceAll('{1}', app);
+          file.saveText(text);
+        }
+      }
+    }
+  }
+};
+
+/**
+ * 生成字体样式
+ * @param {object} o 样式对象
+ * @returns {string} 字体样式
+ */
+Pendant.prototype._generateFontStyle = function (o) {
+  var style = '';
+  if (o.font_size) {
+    style += `\n  font-size: ${o.font_size};`;
+  }
+  if (o.font_color) {
+    style += `\n  color: ${o.font_color};`;
+  }
+  return style;
+};
+
+/**
+ * 生成边框样式
+ * @param {object} o 样式对象
+ * @returns {string} 边框样式
+ */
+Pendant.prototype._generateBorderStyle = function (o) {
+  var borders = [
+    { pos: 'top', style: o.border_top_style, size: o.border_top_size, color: o.border_top_color },
+    { pos: 'right', style: o.border_right_style, size: o.border_right_size, color: o.border_right_color },
+    { pos: 'bottom', style: o.border_bottom_style, size: o.border_bottom_size, color: o.border_bottom_color },
+    { pos: 'left', style: o.border_left_style, size: o.border_left_size, color: o.border_left_color }
+  ];
+  var style = '';
+  for (var i = 0; i < borders.length; i++) {
+    var b = borders[i];
+    if (b.style !== 'none') {
+      style += `\n  border-${b.pos}: ${b.size || 0} ${b.style || 'solid'} ${b.color || '#dbdbdb'};`;
+    }
+  }
+  return style;
+};
+
+/**
+ * 生成边距样式
+ * @param {object} o 样式对象
+ * @returns {string} 边距样式
+ */
+Pendant.prototype._generateMarginStyle = function (o) {
+  var style = '';
+  if (o.margin_top) {
+    style += `\n  margin-top: ${o.margin_top};`;
+  }
+  if (o.margin_right) {
+    style += `\n  margin-right: ${o.margin_right};`;
+  }
+  if (o.margin_bottom) {
+    style += `\n  margin-bottom: ${o.margin_bottom};`;
+  }
+  if (o.margin_left) {
+    style += `\n  margin-left: ${o.margin_left};`;
+  }
+  return style;
+};
+
+/**
+ * 生成填充样式
+ * @param {object} o 样式对象
+ * @returns {string} 填充样式
+ */
+Pendant.prototype._generatePaddingStyle = function (o) {
+  var style = '';
+  if (o.padding_top) {
+    style += `\n  padding-top: ${o.padding_top};`;
+  }
+  if (o.padding_right) {
+    style += `\n  padding-right: ${o.padding_right};`;
+  }
+  if (o.padding_bottom) {
+    style += `\n  padding-bottom: ${o.padding_bottom};`;
+  }
+  if (o.padding_left) {
+    style += `\n  padding-left: ${o.padding_left};`;
+  }
+  return style;
+};
+
+/**
+ * 生成圆角样式
+ * @param {object} o 样式对象
+ * @returns {string} 圆角样式
+ */
+Pendant.prototype._generateRadiusStyle = function (o) {
+  var style = '';
+  if (o.radius_top_right) {
+    style += `\n  border-top-right-radius: ${o.radius_top_right};`;
+  }
+  if (o.radius_top_left) {
+    style += `\n  border-top-left-radius: ${o.radius_top_left};`;
+  }
+  if (o.radius_bottom_right) {
+    style += `\n  border-bottom-right-radius: ${o.radius_bottom_right};`;
+  }
+  if (o.radius_bottom_left) {
+    style += `\n  border-bottom-left-radius: ${o.radius_bottom_left};`;
+  }
+  return style;
+};
+
+/**
+ * 生成背景样式
+ * @param {object} o 样式对象
+ * @returns {string} 背景样式
+ */
+Pendant.prototype._generateBgStyle = function (o) {
+  var style = '';
+  if (o.bg_url) {
+    style += `\n  background-image: url(${o.bg_url});`;
+    style += `\n  background-size: 100% auto;`;
+    style += `\n  background-repeat: ${o.bg_repeat || 'no-repeat'};`;
+  }
+  if (o.bg_color) {
+    style += `\n  background-color: ${o.bg_color || ''};`;
+  }
+  return style;
+};
+
+/**
+ * 生成链接样式
+ * @param {string} id 元素ID
+ * @param {object} o 样式对象
+ * @returns {string} 链接样式
+ */
+Pendant.prototype._generateLinkStyle = function (id, o) {
+  var style = '';
+  if (o.a_size || o.a_color) {
+    style += `\n#${id} a {`;
+    if (o.a_size) {
+      style += `\n  font-size: ${o.a_size};`;
+    }
+    if (o.a_color) {
+      style += `\n  color: ${o.a_color};`;
+    }
+    style += `\n}`;
+  }
+  return style;
+};
+
+/**
+ * 生成样式
+ * @param {string} id 元素ID
+ * @param {object} o 样式对象
+ * @returns {string} 样式
+ */
+Pendant.prototype._generateStyle = function (id, o) {
+  var style = `#${id} {`;
+  style += this._generateFontStyle(o);
+  style += this._generateBorderStyle(o);
+  style += this._generateMarginStyle(o);
+  style += this._generatePaddingStyle(o);
+  style += this._generateRadiusStyle(o);
+  style += this._generateBgStyle(o);
+  style += `\n}`;
+  style += this._generateLinkStyle(id, o);
+  return style;
+};
+
+/**
+ * 生成分类样式
+ * @param {object} o 布局对象
+ * @returns {string} 分类样式
+ */
+Pendant.prototype._generateLayout = function (o) {
+  var layout = '';
+  if (o.default) {
+    layout += ' col-' + o.default;
+  }
+  if (o.pc) {
+    layout += ' col-xxl-' + o.pc;
+  }
+  if (o.note) {
+    layout += ' col-xl-' + o.note;
+  }
+  if (o.pad) {
+    layout += ' col-lg-' + o.pad;
+  }
+  if (o.pad_mini) {
+    layout += ' col-sm-' + o.pad_mini;
+  }
+  if (o.phone) {
+    layout += ' col-xs-' + o.phone;
+  }
+  return layout.trim();
+};
+
+/**
+ * 配置模型
+ * @param {object} block 配置块
+ * @returns {string} 返回html代码
+ */
+Pendant.prototype.optionModel = function (block) {
+  var id = block.id || block.name;
+  var style = '';
+  if (block.style) {
+    var o = block.style.toJson();
+    style = this._generateStyle(id, o);
+  }
+
+  var layout = '';
+  if (block.layout) {
+    var o = block.layout.toJson();
+    layout = this._generateLayout(o);
+  }
+
+  var data = (block.data || '[]').toJson();
+  var attr = (block.attr || '{}').toJson();
+  var options = (block.options || '{}').toJson();
+
+  return {
+    id,
+    class: block.class,
+    style,
+    data,
+    attr,
+    layout,
+    options
+  };
+};
+
+/**
+ * 渲染模块
+ * @param {object} ctx 请求上下文
+ * @param {object} db 数据管理器,如: { next: async function{}, ret: {} }
+ * @param {Array} blocks 模块数组
+ * @returns {string} 返回html代码
+ */
+Pendant.prototype.renderBlock = async function (ctx, db, blocks) {
+  var html = '';
+  for (var i = 0; i < blocks.length; i++) {
+    var block = blocks[i];
+    var o = this.get(block.Pendant);
+    if (o) {
+      var option = this.optionModel(block);
+      var ret = await o.call('main', ctx, db, option);
+      if (ret) {
+        html += '\n' + ret;
+      }
+    }
+  }
+  return html;
+};
+
+/**
+ * 执行渲染
+ * @param {object} ctx 请求上下文
+ * @param {object} db 数据管理器,如: { next: async function{}, ret: {} }
+ * @param {string} path 页面
+ * @param {string} position 位置
+ * @returns {string} 返回html代码
+ */
+Pendant.prototype.render = async function (ctx, db, path, position) {
+  var html = '';
+  var infos = this.getInfos();
+  for (var k in infos) {
+    var info = infos[k];
+    if (info.state) {
+      let mod = this.getMod(info.name);
+      if (mod) {
+        var obj = mod.config.location.getObj({
+          path,
+          position
+        });
+        if (obj && obj.available) {
+          var ret = await mod.call('main', ctx, db);
+          if (ret) {
+            html += '\n' + ret;
+          }
+        }
+      }
+    }
+  }
+  return html;
+};
+
+/* 导出指令 */
+exports.Pendant = Pendant;
+
+/**
+ * Pendant组件池
+ */
+if (!$.pool.pendant) {
+  $.pool.pendant = {};
+}
+
+/**
+ * Pendant管理器，用于创建缓存
+ * @param {string} scope 作用域
+ * @param {string} title 标题
+ * @returns {object} 返回一个缓存类
+ */
+function pendantAdmin(scope, title) {
+  var sc = scope || $.val.scope + '';
+  var obj = $.pool.pendant[sc];
+  if (!obj) {
+    $.pool.pendant[sc] = new Pendant({
+      name: sc,
+      title: title
+    });
+    obj = $.pool.pendant[sc];
+  }
+  return obj;
+}
+
+/**
+ * @module 导出Pendant管理器
+ */
+if ($.admin) {
+  $.admin.pendant = pendantAdmin;
+}

package/com/pendant/pendant.html

@@ -0,0 +1,16 @@
+<div class="mm_col ${' ' + config.layout}">
+  <div id="${config.id}" class="pendant_demo ${' ' + config.class}">
+    <div class="title">${@config.options.xxx}</div>
+    <div class="description">示例组件描述</div>
+  </div>
+</div>
+
+<style scoped>
+  /*[config.style]*/
+
+  .pendant_demo {}
+
+  .pendant_demo .title {}
+
+  .pendant_demo .description {}
+</style>