bulade-ui 1.0.0

package/miniprogram_dist/cell/index.js

@@ -0,0 +1,178 @@
+module.exports =
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 28);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 28:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Component({
+  externalClasses: ['custom-class'],
+
+  options: {
+    addGlobalClass: true
+  },
+
+  relations: {
+    '../cell-group/index': {
+      type: 'ancestor'
+    }
+  },
+
+  properties: {
+    icon: {
+      type: String,
+      value: ''
+    },
+
+    image: {
+      type: String,
+      value: ''
+    },
+
+    title: {
+      type: String,
+      value: ''
+    },
+
+    value: {
+      type: String,
+      value: ''
+    },
+
+    isMultiple: {
+      type: Boolean,
+      value: false
+    },
+
+    border: {
+      type: Boolean,
+      value: false
+    },
+
+    iconColor: {
+      type: String,
+      value: ''
+    },
+
+    // 链接类型，可选值为 navigateTo，redirectTo，switchTab
+    linkType: {
+      type: String,
+      value: 'navigateTo'
+    },
+
+    url: {
+      type: String,
+      value: ''
+    }
+  },
+
+  methods: {
+    updateCellBorder: function updateCellBorder(border) {
+      this.setData({
+        border: border
+      });
+    },
+    onClick: function onClick() {
+      this.triggerEvent('click');
+
+      var url = this.data.url;
+      if (!url) return;
+
+      wx[this.data.linkType].call(wx, {
+        url: url
+      });
+    }
+  }
+});
+
+/***/ })
+
+/******/ });

package/miniprogram_dist/cell/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "m-icon": "../icon/index"
+  }
+}

package/miniprogram_dist/cell/index.wxml

@@ -0,0 +1,25 @@
+<view 
+  bindtap="onClick"
+  class="m-cell custom-class {{ border ? 'm-cell__hairline':'' }}"
+  hover-class="{{ url ? 'm-cell--hover' : '' }}"  
+> 
+  <!-- 头部图标 -->
+  <view wx:if="{{ icon }}" class="m-cell__icon m-cell__header">
+    <m-icon name="{{ icon }}" size="36" color="{{ iconColor ? iconColor : '' }}" />
+  </view>
+
+  <!-- 自定义标题 -->
+  <view wx:if="{{ title }}" class="m-cell__title">{{ title }}</view>
+  <slot wx:else name="title" />
+
+  <!-- 描述内容 -->
+  <view wx:if="{{ value }}" class="m-cell__desc {{ isMultiple ? '':'is-ellipsis' }}">{{ value }}</view>
+
+  <!-- 自定义内容 -->
+  <view wx:else class="m-cell__slot">
+    <slot />
+  </view>
+
+  <!-- 右侧跳转箭头 -->
+  <m-icon wx:if="{{ url }}" class="m-cell__icon m-cell__footer" catchtap="navigateTo" name="arrow-right" size="32" color="#999" />
+</view>

package/miniprogram_dist/cell/index.wxss

@@ -0,0 +1,63 @@
+.m-cell {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  padding: 20rpx 32rpx;
+  line-height: 54rpx;
+  font-size: 28rpx;
+}
+.m-cell.m-cell__hairline::after {
+  position: absolute;
+  box-sizing: border-box;
+  content: " ";
+  pointer-events: none;
+  right: 32rpx;
+  bottom: 0;
+  left: 32rpx;
+  border-bottom: 1px solid var(--color-border, #dcdee2);
+  transform: scaleY(0.5);
+}
+.m-cell.m-cell--hover {
+  background-color: #f7f8f9;
+}
+.m-cell .m-cell__icon {
+  width: 38rpx;
+  text-align: center;
+}
+.m-cell .m-cell__header {
+  margin-right: 12rpx;
+  display: flex;
+  align-items: center;
+}
+.m-cell .m-cell__title {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  color: var(--color-text-primary, #303133);
+  vertical-align: middle;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.m-cell .m-cell__desc {
+  display: flex;
+  align-items: center;
+  margin-left: 20rpx;
+  max-width: 400rpx;
+  color: var(--color-text-secondary, #909399);
+  font-size: 28rpx;
+}
+.m-cell .m-cell__desc.is-ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.m-cell .m-cell__slot {
+  display: inline-flex;
+  align-items: center;
+}
+.m-cell .m-cell__footer {
+  text-align: right;
+  margin-left: 24rpx;
+}

package/miniprogram_dist/cell-group/index.js

@@ -0,0 +1,169 @@
+module.exports =
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 29);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 29:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Component({
+  externalClasses: ['custom-class'],
+
+  options: {
+    addGlobalClass: true,
+    multipleSlots: true
+  },
+
+  relations: {
+    '../cell/index': {
+      type: 'descendant',
+
+      linked: function linked() {
+        this._updateChildren();
+      },
+      linkChanged: function linkChanged() {
+        this._updateDataChange();
+      },
+      unlinked: function unlinked() {
+        this._updateChildren();
+      }
+    }
+  },
+
+  properties: {
+    title: {
+      type: String,
+      value: ''
+    },
+
+    card: {
+      type: Boolean,
+      value: false
+    },
+
+    border: {
+      type: Boolean,
+      value: false,
+      observer: function observer(val) {
+        this._updateChildren();
+      }
+    }
+  },
+
+  methods: {
+    _updateChildren: function _updateChildren() {
+      var _this = this;
+
+      // 防抖减少重复触发
+      if (this.timer) {
+        clearTimeout(this.timer);
+        this.timer = null;
+      }
+
+      this.timer = setTimeout(function () {
+
+        var cells = _this.getRelationNodes('../cell/index');
+        var len = cells.length;
+
+        if (len > 0) {
+          var lastIndex = len - 1;
+
+          cells.forEach(function (cell, index) {
+            cell.updateCellBorder(_this.data.border && index !== lastIndex);
+          });
+        }
+      }, 60);
+    }
+  }
+});
+
+/***/ })
+
+/******/ });

package/miniprogram_dist/cell-group/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

package/miniprogram_dist/cell-group/index.wxml

@@ -0,0 +1,10 @@
+<view class="custom-class m-cell-group {{ card ? 'm-cell-group--card':'' }}">
+	<view wx:if="{{ title }}" class="m-cell-group__header">
+    <view class="m-cell-group__title">{{ title }}</view>
+    <slot name="group-suffix" />
+  </view>
+
+  <view class="m-cell-group__list">
+    <slot />
+  </view>
+</view>

package/miniprogram_dist/cell-group/index.wxss

@@ -0,0 +1,29 @@
+.m-cell-group {
+  position: relative;
+  margin: 0;
+  background: #fff;
+  transition: margin 0.2s ease-in-out;
+}
+.m-cell-group.m-cell-group--card {
+  margin: 32rpx;
+  border-radius: 12rpx;
+  overflow: hidden;
+}
+.m-cell-group .m-cell-group__header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-shrink: 0;
+  position: relative;
+  padding: 0 32rpx;
+  height: 100rpx;
+  font-size: 32rpx;
+  color: var(--color-text-regular, #606266);
+  background-color: #fcfcfc;
+}
+.m-cell-group .m-cell-group__header .m-cell-group__title {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}

package/miniprogram_dist/grid/index.js

@@ -0,0 +1,167 @@
+module.exports =
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 30);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 30:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Component({
+
+  options: {
+    addGlobalClass: true
+  },
+
+  relations: {
+    '../grid-item/index': {
+      type: 'child',
+      linked: function linked() {
+        this._updateChildren();
+      },
+      unlinked: function unlinked() {
+        this._updateChildren();
+      }
+    }
+  },
+
+  properties: {
+    height: {
+      type: String,
+      value: 'auto',
+      observer: '_updateChildren'
+    },
+
+    columnCount: {
+      type: Number,
+      value: 4,
+      observer: '_updateChildren'
+    },
+
+    border: {
+      type: Boolean,
+      value: false,
+      observer: '_updateChildren'
+    }
+  },
+
+  methods: {
+    _updateChildren: function _updateChildren() {
+      var _this = this;
+
+      // 防抖减少重复触发
+      if (this.timer) {
+        clearTimeout(this.timer);
+        this.timer = null;
+      }
+
+      this.timer = setTimeout(function () {
+
+        var children = _this.getRelationNodes('../grid-item/index');
+        var len = children.length;
+
+        var width = 100 / _this.data.columnCount + '%';
+
+        if (len > 0) {
+          children.forEach(function (child, index) {
+            child.setData({
+              width: width,
+              height: _this.data.height,
+              border: _this.data.border
+            });
+          });
+        }
+      }, 60);
+    }
+  }
+});
+
+/***/ })
+
+/******/ });

package/miniprogram_dist/grid/index.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/miniprogram_dist/grid/index.wxml

@@ -0,0 +1,3 @@
+<view class="m-grid {{ border ? 'm-grid--border' : '' }}">
+  <slot />
+</view>

package/miniprogram_dist/grid/index.wxss

@@ -0,0 +1,20 @@
+.m-grid {
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+  overflow: hidden;
+}
+.m-grid.m-grid--border::after {
+  content: " ";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 200%;
+  height: 200%;
+  transform: scale(0.5);
+  transform-origin: 0 0;
+  box-sizing: border-box;
+  border: 1px solid transparent;
+  border-top-color: var(--color-border, #dcdee2);
+  border-left-color: var(--color-border, #dcdee2);
+}