mm_os/core/com/component/index.js

这是超级美眉服务端框架，用于快速构建应用程序。

const Index = require('mm_machine').Index;
const Drive = require('./drive');

/**
 * Component组件
 * @extends {Index}
 * @class
 */
class Component extends Index {
	/**
	 * 构造函数
	 * @param {Object} scope 作用域
	 * @param {String} title 标题
	 * @constructor
	 */
	constructor(scope, title) {
		super(scope, __dirname);
		this.Drive = Drive;
		this.type = "component";
		this.title = title;
		this.list = [];
		// 默认启用热更新
		this.mode = 3;
	}
}


/**
 * 加载列表
 * @param {Array} list 文件列表
 */
Component.prototype.load_list = 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_item(dir, o, file);
				}
			} else {
				await _this.load_item(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("component" + l, l);
					text = text.replaceAll('{0}', name);
					var app = file.between("app" + l, l);
					text = text.replaceAll('{1}', app);
					file.saveText(text);
				}
			}
		}
	}
};

/**
 * 排序
 */
Component.prototype.sort = function() {
	var _this = this;
	this.list.sort(function(o1, o2) {
		var p1 = o1.config[_this.sort_key];
		var p2 = o2.config[_this.sort_key];
		return p1 - p2;
	});
};

/**
 * 配置模型
 * @param {Object} option 配置
 * @param {Object} ctx 请求上下文
 * @param {Object} db 数据管理器,如: { next: async function{}, ret: {} }
 * @return {String} 返回html代码
 */
Component.prototype.option_model = function(block) {
	var id = block.id || block.name;
	var style = "";
	if (block.style) {
		var o = block.style.toJson();
		style += `#${id} {`;

		// 字体
		if (o.font_size) {
			style += `\n	font-size: ${o.font_size};`;
		}
		if (o.font_color) {
			style += `\n	color: ${o.font_color};`;
		}

		// 边框
		if (o.border_top_style !== 'none') {
			style +=
				`\n	border-top: ${o.border_top_size || 0} ${o.border_top_style || 'solid'} ${o.border_top_color || '#dbdbdb'};`;
		}
		if (o.border_right_style !== 'none') {
			style +=
				`\n	border-right: ${o.border_right_size || 0} ${o.border_right_style || 'solid'} ${o.border_right_color || '#dbdbdb'};`;
		}
		if (o.border_bottom_style !== 'none') {
			style +=
				`\n	border-bottom: ${o.border_bottom_size || 0} ${o.border_bottom_style || 'solid'} ${o.border_bottom_color || '#dbdbdb'};`;
		}
		if (o.border_left_style !== 'none') {
			style +=
				`\n	border-left: ${o.border_left_size || 0} ${o.border_left_style || 'solid'} ${o.border_left_color || '#dbdbdb'};`;
		}

		// 边距
		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};`;
		}

		// 填充
		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};`;
		}

		// 圆角
		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};`;
		}

		// 背景
		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 || ''};`;
		}
		style += `\n}`;

		// 设置A样式
		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}`;
		}
	} else {
		style = "";
	}

	var layout = "";
	if (block.layout) {
		var o = block.layout.toJson();
		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;
		}
		layout = layout.trim();
	}

	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 模块
 */
Component.prototype.render_block = async function(ctx, db, blocks) {
	var html = "";
	for (var i = 0; i < blocks.length; i++) {
		var block = blocks[i];
		var o = this.get(block.component);
		if (o) {
			var option = this.option_model(block);
			var ret = await o.exec('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 位置
 * @param {String} position position
 * @return {String} 返回html代码
 */
Component.prototype.render = async function(ctx, db, path, position) {
	var html = "";
	var list = this.list;
	for (var i = 0; i < list.length; i++) {
		var o = list[i];
		var cg = o.config;
		if (cg.state) {
			var obj = cg.location.getObj({
				path,
				position
			});
			if (obj && obj.available) {
				var ret = await o.exec('main', ctx, db);
				if (ret) {
					html += "\n" + ret;
				}
			}
		}
	}
	return html;
};

/* 导出指令 */
exports.Component = Component;

/**
 * Component组件池
 */
if (!$.pool.component) {
	$.pool.component = {};
}

/**
 * Component管理器，用于创建缓存
 * @param {String} scope 作用域
 * @param {string} title 标题
 * @return {Object} 返回一个缓存类
 */
function component_admin(scope, title) {
	if (!scope) {
		scope = $.val.scope + '';
	}
	var obj = $.pool.component[scope];
	if (!obj) {
		$.pool.component[scope] = new Component(scope, title);
		obj = $.pool.component[scope];
	}
	return obj;
}

/**
 * @module 导出Component管理器
 */
$.component_admin = component_admin;