ylwl-cpscoms 1.0.0

package/es/SlDrawer/index.js

@@ -0,0 +1,54 @@
+import { objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
+import Vue from 'vue';
+
+function createCommandDrawer(options) {
+  var Constructor = Vue.extend({
+    data: function data() {
+      return _objectSpread2({
+        visible: true
+      }, options);
+    },
+    methods: {
+      handleClose: function handleClose(done) {
+        this.visible = false;
+        this.closeDrawer();
+        done();
+      }
+    },
+    render: function render(h) {
+      var _this = this;
+      var componentListeners = this.contentListeners || {};
+      return h('el-drawer', {
+        props: {
+          title: this.title,
+          size: this.size,
+          direction: this.direction,
+          beforeClose: this.handleClose,
+          visible: this.visible
+        },
+        on: {
+          input: function input(val) {
+            _this.visible = val;
+          }
+        }
+      }, [h(this.contentComponent, {
+        props: this.contentProps,
+        on: componentListeners
+      })]);
+    }
+  });
+  var instance = new Constructor().$mount();
+  document.body.appendChild(instance.$el);
+  instance.visible = true;
+  window.addEventListener('keydown', function (event) {
+    if (event.code === 'Space' || event.key === ' ') {
+      event.preventDefault();
+    }
+  });
+  instance.$once('close', function () {
+    instance.$destroy();
+    document.body.removeChild(instance.$el);
+  });
+}
+
+export { createCommandDrawer };

package/es/SlForm/index.vue.js

@@ -0,0 +1,26 @@
+import script from './index.vue2.js';
+import './index.vue3.js';
+import normalizeComponent from '../node_modules/vue-runtime-helpers/dist/normalize-component.js';
+
+/* script */
+var __vue_script__ = script;
+/* template */
+
+/* style */
+var __vue_inject_styles__ = undefined;
+/* scoped */
+var __vue_scope_id__ = "data-v-b94e832a";
+/* module identifier */
+var __vue_module_identifier__ = undefined;
+/* functional template */
+var __vue_is_functional_template__ = undefined;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+var __vue_component__ = /*#__PURE__*/normalizeComponent({}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
+var SlForm = __vue_component__;
+
+export { SlForm as default };

package/es/SlForm/index.vue2.js

@@ -0,0 +1,433 @@
+import { objectSpread2 as _objectSpread2, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../_virtual/_rollupPluginBabelHelpers.js';
+import { hasKey, typeOf, filterKey, transformName } from '../utils/index.js';
+import EL from 'element-ui';
+import mixinRender from './mixinRender.js';
+
+var script = {
+  name: 'SlForm',
+  mixins: [mixinRender],
+  props: {
+    value: {
+      type: Object,
+      default: function _default() {
+        return {};
+      }
+    },
+    itemWidth: {
+      type: String,
+      default: ''
+    },
+    data: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    showlabel: {
+      type: Boolean,
+      default: true
+    },
+    drawer: {
+      type: Boolean,
+      default: false
+    },
+    // 开启抽屉模式
+    formProps: {
+      type: Object,
+      default: function _default() {
+        return {
+          inline: true
+        };
+      }
+    },
+    formItemProps: {
+      type: Object,
+      default: function _default() {
+        return {};
+      }
+    },
+    pipe: {
+      type: Object,
+      default: function _default() {
+        return {};
+      }
+    },
+    // 动态管道
+    freeData: {
+      type: Object,
+      default: function _default() {
+        return {};
+      }
+    },
+    // 游离的数据（将会合并到form一起返回）
+    initItem: {
+      type: Function,
+      default: function _default() {}
+    } // 初始化item的值
+  },
+  data: function data() {
+    var state = this.formateState();
+    return _objectSpread2(_objectSpread2({}, state), {}, {
+      isDrawerOpen: true,
+      boxHeight: 'auto',
+      firstitemHeight: '0',
+      selectOptions: {},
+      // 实时渲染的selectOptions
+      selectAllOptions: {},
+      // 初始化好的Select的Options
+      aggGameId: '123456'
+    });
+  },
+  mounted: function mounted() {
+    // console.log('mounted', this.form)
+    this.$emit('input', this.form);
+    this.initFirstHieght();
+  },
+  methods: {
+    // 重置
+    reset: function reset() {
+      var _JSON$parse = JSON.parse(JSON.stringify(this.catchInitValueData)),
+        form = _JSON$parse.form,
+        transfer = _JSON$parse.transfer;
+      this.form = form;
+      this.transfer = transfer;
+      this.$emit('input', this.form);
+    },
+    initFirstHieght: function initFirstHieght() {
+      var _ref = (this.$refs.firstItem || {}).$el || {},
+        _ref$offsetHeight = _ref.offsetHeight,
+        offsetHeight = _ref$offsetHeight === void 0 ? 0 : _ref$offsetHeight;
+      this.firstitemHeight = offsetHeight + 20 + 'px';
+    },
+    formateState: function formateState() {
+      var _this = this;
+      var _this$$props = this.$props,
+        data = _this$$props.data,
+        freeData = _this$$props.freeData;
+      var form = _objectSpread2({}, freeData);
+      var transfer = {};
+      var initData = data.reduce(function (pre, item) {
+        // debugger
+        if (hasKey(item, ['model', 'type'])) {
+          !item.props && (item.props = {});
+          item = _this.initItem(item) || item;
+          var _item = item,
+            callback = _item.callback,
+            model = _item.model,
+            value = _item.value;
+          var dispersed = typeOf(callback, 'function'); // 是否离散键（拆分model键）
+
+          var target = dispersed ? transfer : form; //
+          var valueSource = target[model] !== undefined ? target[model] : _this.$props.value[model] !== undefined ? _this.$props.value[model] : value !== undefined ? value : '';
+          if (dispersed) {
+            var res = callback(valueSource || '') || {};
+            Object.keys(res).forEach(function (key) {
+              res[key] === undefined && (res[key] = '');
+              // console.log(!hasKey(form, [key]), "form[key],", form, key, [key])
+              !hasKey(form, [key]) && (form[key] = res[key] || '');
+            });
+          }
+          // console.log(valueSource, "valueSource", !hasKey(target, [model]))
+          !hasKey(target, [model]) && (target[model] = valueSource);
+          pre.push(item);
+          // if (item.show === undefined || item.show === null) pre.push(item)
+          // else if (typeOf(item.show, 'function') && item.show()) pre.push(item)
+          // else if (typeOf(item.show, 'boolean') && item.show) pre.push(item)
+        }
+        return pre;
+      }, []);
+
+      // console.log(initData, "initData")
+      setTimeout(function () {
+        // 初始化后再watch
+        initData.forEach(function () {
+          return _this.watchValue.apply(_this, arguments);
+        });
+      });
+      // const aaa = {
+      //   form,
+      //   transfer,
+      //   initData,
+      //   catchInitValueData: {
+      //     form: JSON.parse(JSON.stringify(form)),
+      //     transfer: JSON.parse(JSON.stringify(transfer))
+      //   }
+      // }
+      // console.log(aaa, "zxckxzcnxzkjc")
+      return {
+        form: form,
+        transfer: transfer,
+        initData: initData,
+        catchInitValueData: {
+          form: JSON.parse(JSON.stringify(form)),
+          transfer: JSON.parse(JSON.stringify(transfer))
+        }
+      };
+    },
+    // 联动变化监听
+    watchValue: function watchValue(item, i, ary) {
+      var callback = item.callback,
+        model = item.model,
+        linkSet = item.linkSet;
+      if (typeOf(linkSet, 'function')) {
+        var dispersed = typeOf(callback, 'function');
+        var target = dispersed ? this.transfer : this.form;
+        var targetstr = dispersed ? 'transfer' : 'form';
+        var watchCallback = /*#__PURE__*/function () {
+          var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(val) {
+            var _this2 = this;
+            var getInfo, _t;
+            return _regenerator().w(function (_context) {
+              while (1) switch (_context.n) {
+                case 0:
+                  _context.n = 1;
+                  return linkSet(val || '');
+                case 1:
+                  _t = _context.v;
+                  if (_t) {
+                    _context.n = 2;
+                    break;
+                  }
+                  _t = {};
+                case 2:
+                  getInfo = _t;
+                  if (!Array.isArray(getInfo)) {
+                    getInfo = [getInfo];
+                  }
+                  getInfo.forEach(function (setItem) {
+                    _this2.$set(_this2.selectOptions, setItem.model, setItem.options || []);
+                    var nextItem = {};
+                    var tindex = ary.findIndex(function (item1) {
+                      var flag = item1.model === setItem.model;
+                      flag && (nextItem = item1);
+                      return flag;
+                    });
+                    console.log('watchCallback', setItem, nextItem, ary, tindex, '----', _this2.initData);
+                    var nextTarget = typeOf(nextItem.callback, 'function') ? _this2.transfer : _this2.form;
+                    hasKey(setItem, 'value') && (nextTarget[setItem.model] = setItem.value);
+                    tindex !== -1 && _this2.$set(ary, tindex, Object.assign(ary[tindex], setItem));
+                    console.log('watchCallback22222', _this2.initData, ary);
+                    // this.initData = ary.filter((item) => {
+                    //   console.log('watchCallback44444', item)
+                    //   if ((item.show === undefined || item.show === null) || (typeOf(item.show, 'function') && item.show()) || (typeOf(item.show, 'boolean') && item.show)) {
+                    //     nextTarget[setItem.model] = ''
+                    //     return true
+                    //   }
+                    //   return false
+                    // })
+                    console.log('watchCallback333333', _this2.initData);
+                  });
+                case 3:
+                  return _context.a(2);
+              }
+            }, _callee);
+          }));
+          return function watchCallback(_x) {
+            return _ref2.apply(this, arguments);
+          };
+        }();
+        this.$watch("".concat(targetstr, ".").concat(model), watchCallback);
+        watchCallback.call(this, target[model]); // 首次进行绑定执行
+      }
+    },
+    fomateValue: function fomateValue(item) {
+      var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : item.value;
+      var callback = item.callback;
+      console.log('fomateValue', typeOf(callback, 'function'), this.form);
+      if (typeOf(callback, 'function')) {
+        this.transfer[item.model] = value;
+        var res = callback(value || '') || {};
+        // console.log(res, 'res')
+        Object.keys(res).forEach(function (key) {
+          res[key] === undefined && (res[key] = '');
+        });
+        Object.assign(this.form, res);
+        console.log(this.form, 'this.form');
+      } else {
+        if (item.type === 'input') {
+          this.form[item.model] = value.replace(/^[ \t]+|[ \t]+$/g, '');
+        } else {
+          this.form[item.model] = value;
+        }
+      }
+    },
+    validate: function validate() {
+      return this.$refs.form.validate();
+    },
+    // 提交表单
+    submit: function submit() {
+      var _this3 = this;
+      return new Promise(function (res, rej) {
+        _this3.$refs.form.validate(function (isOk, msg) {
+          if (isOk) {
+            res(_this3.form);
+          } else {
+            rej(msg);
+          }
+        });
+      });
+    },
+    setItemValue: function setItemValue(item) {
+      var target = item.callback ? this.transfer : this.form;
+      target[item.model] = item.value;
+    },
+    initCommonProps: function initCommonProps(item) {
+      var _this4 = this;
+      var filters = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+      var privateProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+      var privateAttrs = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
+      item.callback ? this.transfer : this.form;
+      // console.log('initCommonProps', item, target, this.value, item.callback ? '1' : '2', this.form)
+      // this.form[item.model] = ''
+      // console.log(this.form, 'this.form111', filterKey(item.props, filters), privateProps)
+      var _this$$props2 = this.$props,
+        itemWidth = _this$$props2.itemWidth,
+        showlabel = _this$$props2.showlabel;
+      return {
+        style: "width:".concat(showlabel ? '100%' : item.width || itemWidth, ";").concat(item.style),
+        props: Object.assign({
+          value: this.form[item.model],
+          clearable: true,
+          filterable: true,
+          placeholder: showlabel ? '请输入' + item.label : item.label
+        }, filterKey(item.props, filters), privateProps),
+        attrs: _objectSpread2({
+          placeholder: showlabel ? '请输入' + item.label : item.label
+        }, privateAttrs),
+        on: {
+          input: function input(value) {
+            _this4.fomateValue(item, value);
+          }
+        }
+      };
+    },
+    initOptions: function initOptions(item) {
+      var _this5 = this;
+      if (item.asycnOptions && typeOf(item.asycnOptions, 'function')) {
+        // console.log(item.asycnOptions, 'it-----em')
+        item.asycnOptions().then(function (result) {
+          // console.log(result, "result")
+          _this5.$set(_this5.selectOptions, item.model, result || []);
+        });
+      } else {
+        this.$set(this.selectOptions, item.model, item.options || []);
+      }
+    }
+  },
+  created: function created() {
+    var _this6 = this;
+    this.initData.forEach(function (item) {
+      if (['select', 'checkbox', 'radio'].includes(item.type)) {
+        _this6.initOptions(item);
+      }
+    });
+  },
+  render: function render(ce) {
+    var _this7 = this;
+    var _this$$props3 = this.$props,
+      showlabel = _this$$props3.showlabel,
+      itemWidth = _this$$props3.itemWidth,
+      drawer = _this$$props3.drawer;
+    // console.log('render', this.initData)
+    var updateInitData = this.initData.filter(function (item) {
+      if (item.show === undefined || item.show === null || typeOf(item.show, 'function') && item.show() || typeOf(item.show, 'boolean') && item.show) {
+        return true;
+      }
+      return false;
+    });
+    var formItems = updateInitData.map(function (item, ii) {
+      var _label = item.label,
+        model = item.model,
+        rules = item.rules,
+        type = item.type,
+        width = item.width,
+        labelTips = item.labelTips;
+      if (type === 'title') {
+        return _this7.renderTitle(ce, item);
+      }
+      // console.log(item, "itexxxxxxm", this)
+      if (type === 'slot' && item.slotName && _this7.$slots[item.slotName]) {
+        return ce('div', {
+          class: 'yl-form-slot-container',
+          style: item.style || ''
+        }, _this7.$slots[item.slotName]);
+      }
+      var itemBody = [_this7["render".concat(transformName(type))](ce, item)];
+      var itemClass = "yl-form-item ".concat(showlabel ? '' : 'yl-form-fullitem', " ").concat(item.className || '');
+      // if (!showlabel) {
+      //   itemBody.unshift(ce('div', { class: 'yl-i-lebel' }, label))
+      //   itemClass += 'yl-form-item-grid'
+      // }
+      if (item.rules && item.rules.find(function (_ref3) {
+        var required = _ref3.required;
+        return required;
+      }) && !showlabel) {
+        itemBody.unshift(ce('span', {
+          class: 'yl-r-icon'
+        }, '*'));
+      }
+      var itemSet = {
+        class: itemClass,
+        style: "width:".concat(width || itemWidth, ";").concat(item.style),
+        props: Object.assign({
+          label: showlabel ? _label : '',
+          prop: model,
+          rules: rules
+        }, _this7.formItemProps),
+        scopedSlots: {
+          label: function label() {
+            return ce('span', {
+              style: 'label-container'
+            }, [labelTips ? ce('el-tooltip', {
+              props: {
+                content: labelTips,
+                placement: 'top'
+              }
+            }, [ce('i', {
+              class: 'el-icon-info'
+            }, [])]) : '', ce('span', {
+              class: 'item-label',
+              domProps: {
+                title: _label
+              },
+              style: 'margin-left: 5px;'
+            }, _label + '：')]);
+          }
+        }
+      };
+      ii === 0 && (itemSet.ref = 'firstItem');
+      var ft = ce(EL.FormItem, itemSet, itemBody);
+      return ft;
+    });
+    // console.log(this, "this.$scopedSlots.default")
+    if (this.$slots.default || drawer) {
+      var element = [];
+      // this.$slots.default &&
+      //   element.push(this.$slots.default(this.form))
+      drawer && element.push(this.renderDrawer(ce));
+      formItems.push(ce('div', {
+        class: "yl-form-drawericon ".concat(this.isDrawerOpen ? '' : 'yl-form-drawericon-float')
+      }, this.$slots.default));
+    }
+    // console.log(this.formProps, "this.formProps")
+    return ce(EL.Form, {
+      class: {
+        'yl-form-box': true,
+        'yl-form-box-shrink': !this.isDrawerOpen,
+        'yl-form-box-inline': this.formProps.inline
+      },
+      style: "height:".concat(this.boxHeight),
+      props: Object.assign({
+        model: this.form
+      }, this.formProps),
+      ref: 'form',
+      nativeOn: {
+        submit: function submit(e) {
+          return e.preventDefault();
+        }
+      }
+    }, formItems);
+  }
+};
+
+export { script as default };

package/es/SlForm/index.vue3.js

@@ -0,0 +1,6 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".yl-form-item{align-items:center;display:flex}::v-deep .el-form-item__content{display:flex;flex:1;margin:0!important}.yl-form-fullitem .el-form-item__content{flex:1}.yl-form-item{display:inline-flex!important}.yl-form-item .yl-form-item-grid .el-form-item__content{font-size:0}.content-box{background-color:hsla(0,0%,100%,.5);box-shadow:0 0 5px #dfdede;height:100%;padding:10px;position:absolute;right:0;top:0}.item-label{display:inline-block;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap;width:auto}.yl-form-box-shrink{background-color:#f1f1f1;overflow:hidden;padding:10px}.yl-form-drawericon{display:inline-block;vertical-align:top}.yl-form-drawericon-float{background-image:linear-gradient(270deg,#ffa140,hsla(0,0%,100%,0));opacity:.9;padding:10px 10px 10px 80px;position:absolute;right:0;top:0;z-index:10}.yl-i-lebel{background-color:#979797;border-radius:4px 4px 0 0;border-radius:0 4px 0 10px;color:#fff;font-size:12px;line-height:12px;padding:2px 8px 4px 10px;right:0;top:0;transform:scale(.8);transform-origin:100% 0;width:auto}.yl-i-lebel,.yl-r-icon{position:absolute;z-index:5}.yl-r-icon{color:red;left:0;line-height:35px;padding:5px;top:50%;transform:translateY(-50%)}.yl-form-slider{border:1px solid #dcdfe6;border-radius:4px;display:flex;line-height:35px;padding:0 20px 0 10px}.yl-form-slider-span{color:#c0c4cc;padding-right:15px}.yl-form-box{border-radius:4px;position:relative;transition:all .2s ease-out;white-space:normal}.yl-form-item{position:relative;white-space:nowrap}.yl-form-range-input{border:1px solid #dcdfe6;border-radius:4px;padding:0 10px}.yl-form-range-input input{border:none;border-radius:4px;height:100%;outline:none;padding:7px;text-align:center;width:70px}.yl-form-range-input input::placeholder{color:#c0c4cc}.el-radio{margin-bottom:0!important}";
+styleInject(css_248z);
+
+export { css_248z as default };