aaa-ui-test 1.0.1

package/lib/dialog/index.js

@@ -0,0 +1,204 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _vue = _interopRequireDefault(require("vue"));
+
+var _dialog = _interopRequireDefault(require("./src/dialog"));
+
+var _utils = require("../utils/utils");
+
+require("./index.css");
+
+/* 注册 */
+//Dialog.install = function(Vue) {
+// Vue.component(Dialog.name, Dialog)
+// 创建组件构造器
+_dialog.default.install = function (Vue) {};
+
+var dialogObj = _vue.default.extend(_dialog.default);
+
+_dialog.default.$confirm = _dialog.default.$alert = _vue.default.prototype.$confirm = _vue.default.prototype.$alert = function install(options) {
+  var alertComponent; //debugger
+
+  var existDom = document.getElementById('jdd-dialog-box');
+
+  if (existDom) {
+    document.body.removeChild(existDom);
+  }
+
+  alertComponent = new dialogObj({
+    el: document.createElement('div')
+  });
+  var dialogType = options.dialogType,
+      title = options.title,
+      content = options.content,
+      unClickBg = options.unClickBg,
+      okShowStage = options.okShowStage,
+      okBtnTxt = options.okBtnTxt,
+      okBtnClass = options.okBtnClass,
+      okCbFun = options.okCbFun,
+      cancelShowStage = options.cancelShowStage,
+      cancelBtnTxt = options.cancelBtnTxt,
+      cancelBtnClass = options.cancelBtnClass,
+      cancelCbFun = options.cancelCbFun,
+      btns = options.btns;
+  /* dialog类型 alert (默认)、confirm、vertical*/
+
+  if (dialogType) {
+    alertComponent.dialogType = dialogType;
+    /* 如果是confirm、vertical非自定义按钮回填初始化值 */
+
+    if (dialogType !== 'alert' && !btns) {
+      if (dialogType === 'confirm') {
+        alertComponent.btns.unshift({
+          btnClass: 'jdd-cancel-btn',
+          showStage: false,
+          type: 'cancel',
+          text: '取消'
+        });
+      } else {
+        alertComponent.btns.push({
+          btnClass: 'jdd-cancel-btn',
+          showStage: false,
+          type: 'cancel',
+          text: '取消'
+        });
+      }
+    }
+  }
+  /* 标题 */
+
+
+  if (title) {
+    alertComponent.title = title;
+  }
+  /* 内容 */
+
+
+  if (content) {
+    alertComponent.content = content;
+  }
+  /* 是否开启背景点击 */
+
+
+  if (_utils.Type.isBoolean(unClickBg) && !unClickBg) {
+    alertComponent.unClickBg = unClickBg;
+  }
+  /* 按钮单独配置 */
+
+
+  if (!btns) {
+    //for (const item of alertComponent.btns) {
+    alertComponent.btns.forEach(function (item) {
+      var type = item.type;
+
+      if (type && type === 'ok') {
+        if (okCbFun && _utils.Type.isFunction(okCbFun)) {
+          item.cbFun = okCbFun;
+        }
+
+        if (okBtnTxt) {
+          item.text = String(okBtnTxt);
+        }
+
+        if (okShowStage) {
+          item.showStage = okShowStage;
+        }
+
+        if (okBtnClass) {
+          item.btnClass = okBtnClass;
+        }
+      } else if (type && type === 'cancel') {
+        if (cancelCbFun && _utils.Type.isFunction(cancelCbFun)) {
+          item.cbFun = cancelCbFun;
+        }
+
+        if (cancelBtnTxt) {
+          item.text = String(cancelBtnTxt);
+        }
+
+        if (cancelShowStage) {
+          item.showStage = cancelShowStage;
+        }
+
+        if (cancelBtnClass) {
+          item.btnClass = cancelBtnClass;
+        }
+      }
+    }); // console.warn('item', item)
+    //}
+  }
+  /* 自定义按钮配置 */
+
+
+  if (dialogType === 'vertical' && btns && btns.length > 2 && btns.length <= 4) {
+    alertComponent.btns = btns;
+  }
+
+  _dialog.default.$close = _vue.default.prototype.$close = function () {
+    alertComponent._clearWin();
+  }; // 回调函数
+
+
+  alertComponent.callback = function () {
+    var action = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    if (action.cbFun) {
+      action.cbFun();
+    }
+  }; // 把alertHonor加入body中
+  // console.warn('alertComponent', alertComponent.$el)
+
+
+  document.body.appendChild(alertComponent.$el);
+  return alertComponent;
+};
+
+_dialog.default.$activity = _vue.default.prototype.$activity = function (options) {
+  var alertComponentAc = {};
+  var imgSrc = options.imgSrc,
+      backgroundColor = options.backgroundColor,
+      okCbFun = options.okCbFun;
+  var existDom = document.getElementById('jdd-dialog-box');
+
+  if (existDom) {
+    document.body.removeChild(existDom);
+  }
+
+  alertComponentAc = new dialogObj({
+    el: document.createElement('div'),
+    data: function data() {
+      return {
+        activity: true,
+        imgSrc: imgSrc,
+        backgroundColor: backgroundColor,
+        okCbFun: okCbFun
+      };
+    }
+  });
+
+  _dialog.default.$close = _vue.default.prototype.$close = function () {
+    alertComponentAc._clearWin();
+  }; // 回调函数
+
+
+  alertComponentAc.callback = function () {
+    var action = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    okCbFun();
+  }; // 把alertHonor加入body中
+  // console.warn('alertComponent', alertComponent.$el)
+
+
+  document.body.appendChild(alertComponentAc.$el);
+  return alertComponentAc;
+}; //}
+
+
+var _default = _dialog.default;
+exports.default = _default;

package/lib/dialog/src/dialog.js

@@ -0,0 +1,258 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _mask = _interopRequireDefault(require("../../mask"));
+
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+var setTO = "";
+var __script__ = {
+  name: "JddDialog",
+  props: {
+    unClickBg: {
+      type: Boolean,
+      default: true
+    },
+
+    /* dialog */
+    dialogType: {
+      type: String,
+      default: "alert"
+    },
+    title: {
+      type: String,
+      default: ""
+    },
+    content: {
+      type: String,
+      default: ""
+    },
+    iconCloseClass: {
+      type: String,
+      default: "hide"
+    },
+    iconClosePro: {
+      type: Boolean,
+      default: false
+    },
+    callback: {
+      type: Function
+    }
+  },
+  data: function data() {
+    /* dialog 模版参数说明
+      *  showAlert: Boolean | 是否展示dialog模版弹窗判断
+      *  dialogType: String | alert、confirm、vertical
+      *  title: String | dialog时，标题
+      *  content:  String | 内容文字 
+      *  callback: Function | 公共回调方法
+      *  btns: Array  |  可自定义
+      *    btnClass: String | jdd-ok-btn
+            showStage: Boolean | default false, true时不关闭弹窗
+            type: String |  confirm、cancel
+            text: String  | 按钮文案
+      */
+    return {
+      showAlert: true,
+      activity: false,
+      btns: [{
+        btnClass: "jdd-primary-btn",
+        showStage: false,
+        type: "ok",
+        text: "确定"
+      }]
+    };
+  },
+  computed: {
+    contentClass: function contentClass() {
+      /* 计算回填类名 */
+      return [this.dialogType !== "alert" ? "dialogContent" : ""];
+    }
+  },
+  methods: {
+    // _timeout: function(ms){
+    //   return new Promise((resolve, reject) => {
+    //     if(setTO) clearTimeout(setTO)
+    //     if(typeof ms === 'number') {
+    //       setTO = setTimeout(resolve, ms, 'done')
+    //     } else {
+    //       reject('no Number');
+    //     }
+    //   })
+    // },
+    _removeSelfDom: function _removeSelfDom(showStage) {
+      !showStage && this._clearWin();
+    },
+    //关闭整个窗口
+    _clearWin: function _clearWin() {
+      //if(setTO) clearTimeout(setTO)
+      this.showAlert = false;
+    },
+    activeJump: function activeJump() {
+      this.callback(this.btns);
+    },
+    btnsArg: function btnsArg(keys) {
+      if (keys.showStage) {
+        this._removeSelfDom(true);
+      } else {
+        this._removeSelfDom();
+      }
+
+      this.handleActions(keys);
+    },
+    shadowBoxClick: function shadowBoxClick() {
+      //点击其他区域
+      if (this.unClickBg) return;
+
+      this._removeSelfDom();
+    },
+    iconClose: function iconClose() {
+      //点击关闭图标
+      this._removeSelfDom();
+    },
+    handleActions: function handleActions(action) {
+      this.callback(action);
+    }
+  },
+  components: {
+    JddMask: _mask.default
+  }
+};
+
+var render = function render() {
+  var _vm = this;
+
+  var _h = _vm.$createElement;
+
+  var _c = _vm._self._c || _h;
+
+  return _c('transition', {
+    attrs: {
+      "name": "fade-dialog",
+      "appear": ""
+    }
+  }, [_vm.showAlert ? _c('div', {
+    staticClass: "jdd-dialog-box",
+    attrs: {
+      "id": "jdd-dialog-box"
+    }
+  }, [_c('jdd-mask', {
+    attrs: {
+      "background-color": _vm.backgroundColor
+    },
+    on: {
+      "onClick": _vm.shadowBoxClick
+    },
+    model: {
+      value: _vm.showAlert,
+      callback: function callback($$v) {
+        _vm.showAlert = $$v;
+      },
+      expression: "showAlert"
+    }
+  }), _vm._v(" "), !_vm.activity ? _c('div', {
+    staticClass: "jdd-dialog"
+  }, [_vm.iconClosePro ? _c('div', {
+    staticClass: "iconClose",
+    class: _vm.iconCloseClass,
+    on: {
+      "click": _vm.iconClose
+    }
+  }) : _vm._e(), _vm._v(" "), _c('div', {
+    staticClass: "jdd-dialog-inner"
+  }, [_vm.title ? _c('h2', {
+    domProps: {
+      "textContent": _vm._s(_vm.title)
+    }
+  }) : _vm._e(), _vm._v(" "), _vm.content ? _c('div', {
+    staticClass: "jdd-dialog-content",
+    class: _vm.contentClass,
+    domProps: {
+      "innerHTML": _vm._s(_vm.content)
+    }
+  }) : _vm._e()]), _vm._v(" "), _c('div', {
+    staticClass: "jdd-dialog-btns jdd-border-top",
+    class: _vm.dialogType === 'vertical' ? 'jdd-vertical-btns' : 'jdd-default-btns'
+  }, _vm._l(_vm.btns, function (btn) {
+    return _c('div', {
+      key: btn.id,
+      staticClass: "jdd-btn",
+      class: btn.btnClass ? btn.btnClass : 'jdd-cancel-btn',
+      on: {
+        "click": function click($event) {
+          _vm.btnsArg(btn);
+        }
+      }
+    }, [_vm._v(_vm._s(btn.text))]);
+  }), 0)]) : _c('div', {
+    staticClass: "jdd-dialog jdd-dialog-activity"
+  }, [_c('span', {
+    staticClass: "jdd-dialog-activity-close",
+    on: {
+      "click": _vm._clearWin
+    }
+  }), _vm._v(" "), _c('div', {
+    staticClass: "jdd-dialog-activity-inner",
+    on: {
+      "click": _vm.activeJump
+    }
+  }, [_c('img', {
+    attrs: {
+      "src": _vm.imgSrc,
+      "alt": ""
+    }
+  })])])], 1) : _vm._e()]);
+};
+
+var staticRenderFns = [];
+var __template__ = {
+  render: render,
+  staticRenderFns: staticRenderFns
+};
+
+var _default = (0, _extends2.default)({}, __script__, __template__);
+
+exports.default = _default;

package/lib/field/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _field = _interopRequireDefault(require("./src/field"));
+
+require("./index.css");
+
+_field.default.install = function (Vue) {
+  Vue.component(_field.default.name, _field.default);
+};
+
+var _default = _field.default;
+exports.default = _default;

package/lib/field/src/field.js

@@ -0,0 +1,91 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+//
+//
+//
+//
+//
+//
+//
+//
+//
+var __script__ = {
+  name: "JddField",
+  props: {
+    state: {
+      type: Boolean,
+      default: true
+    },
+    label: {
+      type: String,
+      default: ""
+    },
+    border: {
+      type: String,
+      default: ""
+    },
+    direction: {
+      type: String,
+      default: "column"
+    },
+    isFocus: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data: function data() {
+    return {};
+  },
+  methods: {
+    onClick: function onClick() {
+      this.$emit("label-click");
+    }
+  },
+  computed: {
+    borderClass: function borderClass() {
+      if (this.border === "bottom") {
+        return "jdd-field-border-bottom";
+      } else if (this.border === "top") {
+        return "jdd-field-border-top";
+      }
+
+      return "";
+    }
+  }
+};
+
+var render = function render() {
+  var _vm = this;
+
+  var _h = _vm.$createElement;
+
+  var _c = _vm._self._c || _h;
+
+  return _c('div', {
+    class: [_vm.direction === 'column' ? 'jdd-field' : 'jdd-field-inline', !_vm.state ? 'jdd-field-error' : '', _vm.isFocus ? 'jdd-field-focus' : 'jdd-field-common', _vm.borderClass]
+  }, [_c('div', {
+    staticClass: "jdd-field-label",
+    on: {
+      "click": _vm.onClick
+    }
+  }, [_c('span', [_vm._v(_vm._s(_vm.label))])]), _vm._v(" "), _vm._t("default")], 2);
+};
+
+var staticRenderFns = [];
+var __template__ = {
+  render: render,
+  staticRenderFns: staticRenderFns
+};
+
+var _default = (0, _extends2.default)({}, __script__, __template__);
+
+exports.default = _default;