ylwl-cpscoms 1.0.0

package/README.md

@@ -0,0 +1,15 @@
+## 使用
+```js
+
+// main.js
+import Vue from 'vue'
+import CpsbComponents from 'ylwl-cpsComs'
+Vue.use(CpsbComponents)
+
+// 之后所有页面可直接使用：
+// <SlPage>, <SlTable>, <SlForm>, <SlDialog>, <SlTitle>,
+// <SlAlert>, <SlDescriptions>, <SlGuide>
+
+// 函数式组件：
+import { createCommandDialog, showConfirmMessageBox } from 'ylwl-cpsComs'
+```

package/es/SlAlert/index.vue.js

@@ -0,0 +1,58 @@
+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 */
+var __vue_render__ = function __vue_render__() {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c("div", {
+    staticClass: "slMessage"
+  }, [_c("div", {
+    staticClass: "message-box"
+  }, [_c("div", {
+    staticClass: "message-title"
+  }, [_c("div", [_c("i", {
+    staticClass: "el-icon-warning"
+  }), _vm._v("\n        温馨提示\n        "), _c("el-button", {
+    staticClass: "toggle-button",
+    attrs: {
+      size: "mini",
+      type: "text"
+    },
+    on: {
+      click: _vm.toggleMessage
+    }
+  }, [_vm._v("\n          " + _vm._s(_vm.isMessageVisible ? "收起" : "展开") + "\n          "), _c("i", {
+    class: _vm.isMessageVisible ? "el-icon-arrow-up" : "el-icon-arrow-down"
+  })])], 1), _vm._v(" "), _vm._t("operate")], 2), _vm._v(" "), _vm.isMessageVisible ? _c("div", {
+    staticClass: "message-row"
+  }, [_vm._t("message")], 2) : _vm._e()])]);
+};
+var __vue_staticRenderFns__ = [];
+__vue_render__._withStripped = true;
+
+/* style */
+var __vue_inject_styles__ = undefined;
+/* scoped */
+var __vue_scope_id__ = "data-v-5d4ea765";
+/* module identifier */
+var __vue_module_identifier__ = undefined;
+/* functional template */
+var __vue_is_functional_template__ = false;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+var __vue_component__ = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__,
+  staticRenderFns: __vue_staticRenderFns__
+}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
+var SlAlert = __vue_component__;
+
+export { SlAlert as default };

package/es/SlAlert/index.vue2.js

@@ -0,0 +1,37 @@
+import { isMobileDevice } from '../utils/index.js';
+
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+
+var script = {
+  data: function data() {
+    return {
+      isMessageVisible: !isMobileDevice()
+    };
+  },
+  methods: {
+    toggleMessage: function toggleMessage() {
+      this.isMessageVisible = !this.isMessageVisible;
+    }
+  }
+};
+
+export { script as default };

package/es/SlAlert/index.vue3.js

@@ -0,0 +1,6 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".message-box[data-v-5d4ea765]{background:#fdf6ec;padding:5px 10px 10px}.message-title[data-v-5d4ea765]{align-items:center;color:#f59a23d8;display:flex;justify-content:space-between}.message-row[data-v-5d4ea765]{font-size:12px}";
+styleInject(css_248z);
+
+export { css_248z as default };

package/es/SlDescriptions/index.vue.js

@@ -0,0 +1,55 @@
+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 */
+var __vue_render__ = function __vue_render__() {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c("div", [_c("el-descriptions", _vm._b({
+    attrs: {
+      size: "small",
+      border: ""
+    }
+  }, "el-descriptions", _vm.elTableProps, false), _vm._l(_vm.renderData.model, function (item) {
+    return _vm.isShow(item) ? _c("el-descriptions-item", {
+      key: item.name
+    }, [_c("template", {
+      slot: "label"
+    }, [_vm._v("\n        " + _vm._s(item.label) + "\n      ")]), _vm._v(" "), !item.format && !item.template ? _c("span", [_vm._v(" " + _vm._s(_vm.renderData.data[item.prop] || _vm.renderData.data[item.prop] === 0 ? _vm.renderData.data[item.prop] : "-"))]) : _vm._e(), _vm._v(" "), item.format && _vm.renderData.data ? _c("renderOptions", {
+      attrs: {
+        "render-options": item.format,
+        data: _vm.renderData.data
+      }
+    }) : _vm._e(), _vm._v(" "), item.template ? _vm._t(item.template, null, {
+      data: _vm.renderData.data
+    }) : _vm._e()], 2) : _vm._e();
+  }))], 1);
+};
+var __vue_staticRenderFns__ = [];
+__vue_render__._withStripped = true;
+
+/* style */
+var __vue_inject_styles__ = undefined;
+/* scoped */
+var __vue_scope_id__ = "data-v-66e3026a";
+/* module identifier */
+var __vue_module_identifier__ = undefined;
+/* functional template */
+var __vue_is_functional_template__ = false;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+var __vue_component__ = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__,
+  staticRenderFns: __vue_staticRenderFns__
+}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
+var SlDescriptions = __vue_component__;
+
+export { SlDescriptions as default };

package/es/SlDescriptions/index.vue2.js

@@ -0,0 +1,57 @@
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+
+var script = {
+  name: 'SlDescriptions',
+  components: {
+    renderOptions: function renderOptions() {
+      return import('./renderOptions.vue.js');
+    }
+  },
+  props: {
+    renderData: {
+      type: Object,
+      required: true
+    },
+    elTableProps: {
+      type: Object,
+      default: function _default() {
+        return {
+          size: 'small',
+          column: 2
+        };
+      }
+    }
+  },
+  data: function data() {
+    return {};
+  },
+  methods: {
+    isShow: function isShow(item) {
+      if (item.isShow !== undefined) {
+        if (typeof item.isShow === 'function') {
+          return item.isShow(this.renderData.data);
+        } else {
+          return item.isShow;
+        }
+      } else {
+        return true;
+      }
+    }
+  }
+};
+
+export { script as default };

package/es/SlDescriptions/index.vue3.js

@@ -0,0 +1,6 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = "";
+styleInject(css_248z);
+
+export { css_248z as default };

package/es/SlDescriptions/renderOptions.vue.js

@@ -0,0 +1,25 @@
+import script from './renderOptions.vue2.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__ = undefined;
+/* 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);
+
+export { __vue_component__ as default };

package/es/SlDescriptions/renderOptions.vue2.js

@@ -0,0 +1,31 @@
+var script = {
+  name: 'EcSystemsRenderOptions',
+  props: {
+    renderOptions: {
+      type: Function,
+      default: function _default() {
+        return {};
+      }
+    },
+    data: {
+      type: Object,
+      default: function _default() {
+        return {};
+      }
+    }
+  },
+  render: function render(h) {
+    if (this._props.renderOptions) {
+      var callback = this._props.renderOptions(h, this._props.data);
+      if (typeof callback === 'string') {
+        return h('span', callback);
+      } else {
+        return callback;
+      }
+    } else {
+      return '';
+    }
+  }
+};
+
+export { script as default };

package/es/SlDialog/dialogPlus.js

@@ -0,0 +1,159 @@
+import { objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
+import Vue from 'vue';
+import { isMobileDevice } from '../utils/index.js';
+
+// 🌟 核心魔法：注册一个全局的辅助组件，充当“传送门”（Portal）
+if (!Vue.component('dialog-footer')) {
+  Vue.component('dialog-footer', {
+    inject: {
+      dialogCtx: {
+        default: null
+      }
+    },
+    mounted: function mounted() {
+      if (this.dialogCtx) {
+        this.dialogCtx.setFooterVNodes(this.$slots.default);
+      }
+    },
+    updated: function updated() {
+      if (this.dialogCtx) {
+        this.dialogCtx.setFooterVNodes(this.$slots.default);
+      }
+    },
+    destroyed: function destroyed() {
+      if (this.dialogCtx) {
+        this.dialogCtx.setFooterVNodes(null);
+      }
+    },
+    render: function render(h) {
+      return h('div', {
+        style: {
+          display: 'none'
+        },
+        class: 'dialog-footer-portal'
+      });
+    }
+  });
+}
+function createCommandDialogPlus(options) {
+  var defaultOptions = {
+    title: '提示',
+    width: '50%',
+    specialWidth: '',
+    closeOnClickModal: false,
+    contentComponent: null,
+    contentProps: {},
+    showClose: true,
+    closeOnPressEscape: false,
+    customClass: ''
+  };
+  var mergedOptions = _objectSpread2(_objectSpread2({}, defaultOptions), options);
+  var Constructor = Vue.extend({
+    provide: function provide() {
+      return {
+        dialogCtx: this
+      };
+    },
+    data: function data() {
+      return {
+        visible: false,
+        footerVNodes: null
+      };
+    },
+    created: function created() {
+      Object.assign(this, mergedOptions);
+    },
+    mounted: function mounted() {
+      var _this = this;
+      Vue.nextTick(function () {
+        _this.visible = true;
+      });
+    },
+    methods: {
+      handleBeforeClose: function handleBeforeClose(done) {
+        if (typeof done === 'function') {
+          done(); // 允许 el-dialog 执行关闭动画
+        } else {
+          this.visible = false;
+        }
+      },
+      handleClose: function handleClose() {
+        var _this2 = this;
+        if (this._hasClosed) return;
+        this._hasClosed = true;
+        console.log('你肯定会执行吗啊');
+        if (typeof this.onClose === 'function') {
+          this.onClose(this);
+        }
+        this.$once('closed', function () {
+          _this2.$destroy();
+          if (_this2.$el && _this2.$el.parentNode) {
+            _this2.$el.parentNode.removeChild(_this2.$el);
+          }
+        });
+      },
+      // 暴露给业务组件的关闭方法
+      closeDialog: function closeDialog() {
+        this.visible = false;
+      },
+      // 兼容以前的 confirm 逻辑（可选保留，为了向后兼容外层传入 onConfirm）
+      confirmDialog: function confirmDialog() {
+        if (typeof this.onConfirm === 'function') {
+          this.onConfirm();
+        }
+        this.visible = false; // 同样只修改 visible
+      },
+      // 供 <dialog-footer> 调用的方法
+      setFooterVNodes: function setFooterVNodes(vnodes) {
+        this.footerVNodes = vnodes;
+      }
+    },
+    render: function render(h) {
+      var _this3 = this;
+      // 渲染主体业务组件
+      var dialogChildren = [h(this.contentComponent, {
+        props: this.contentProps,
+        ref: 'contentComponent',
+        on: {
+          // 业务组件可以通过 this.$emit('close') 主动关闭弹窗
+          close: this.closeDialog,
+          // 业务组件可以通过 this.$emit('confirm') 触发外层回调并关闭弹窗
+          confirm: this.confirmDialog
+          // 【新增】：允许业务组件透传任意自定义事件到外层
+          // 如果你的业务组件需要向外抛出自定义事件（如 'save-draft'），
+          // 可以在调用 createCommandDialog 时通过 on 属性传入监听器。
+        }
+      })];
+      if (this.footerVNodes) {
+        dialogChildren.push(h('template', {
+          slot: 'footer'
+        }, this.footerVNodes));
+      }
+      return h('el-dialog', {
+        props: {
+          title: this.title,
+          visible: this.visible,
+          width: isMobileDevice() ? '90%' : this.specialWidth ? this.specialWidth : this.width === '30%' ? '30%' : '50%',
+          'close-on-click-modal': this.closeOnClickModal,
+          showClose: this.showClose,
+          'close-on-press-escape': this.closeOnPressEscape,
+          customClass: this.customClass
+        },
+        on: {
+          'update:visible': function updateVisible(val) {
+            _this3.visible = val;
+          },
+          'before-close': this.handleBeforeClose,
+          close: this.handleClose,
+          closed: function closed() {
+            _this3.$emit('closed');
+          }
+        }
+      }, dialogChildren);
+    }
+  });
+  var instance = new Constructor().$mount();
+  document.body.appendChild(instance.$el);
+}
+
+export { createCommandDialogPlus };

package/es/SlDialog/index.js

@@ -0,0 +1,202 @@
+import { objectSpread2 as _objectSpread2, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../_virtual/_rollupPluginBabelHelpers.js';
+import Vue from 'vue';
+import { Button } from 'element-ui';
+import { isMobileDevice } from '../utils/index.js';
+
+function createCommandDialog(options) {
+  var defaultOptions = {
+    title: '提示',
+    width: '50%',
+    specialWidth: '',
+    closeOnClickModal: false,
+    contentComponent: null,
+    contentProps: {},
+    footerBtns: [],
+    cancelButtonText: '取消',
+    confirmButtonText: '确定',
+    isShowBtn: true,
+    showClose: true,
+    closeOnPressEscape: false,
+    customClass: ''
+  };
+  var mergedOptions = _objectSpread2(_objectSpread2({}, defaultOptions), options);
+  var Constructor = Vue.extend({
+    data: function data() {
+      return {
+        visible: false // 初始状态为 false
+      };
+    },
+    created: function created() {
+      // 在 created 钩子中，将配置项直接浅拷贝到 this 实例上
+      Object.assign(this, mergedOptions);
+    },
+    mounted: function mounted() {
+      var _this = this;
+      Vue.nextTick(function () {
+        _this.visible = true;
+      });
+    },
+    methods: {
+      handleBeforeClose: function handleBeforeClose() {
+        this.visible = false;
+      },
+      handleClose: function handleClose(done) {
+        var _this2 = this;
+        this.handleBeforeClose();
+        if (typeof this.onClose === 'function') {
+          this.onClose(this);
+        }
+        this.$once('closed', function () {
+          _this2.$destroy();
+          document.body.removeChild(_this2.$el);
+        });
+      },
+      handleCancel: function handleCancel() {
+        this.handleBeforeClose();
+        if (typeof this.onCancel === 'function') {
+          this.onCancel();
+        }
+        this.handleClose();
+      },
+      handleConfirm: function handleConfirm() {
+        var _this3 = this;
+        return _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+          var shouldClose, result, _t;
+          return _regenerator().w(function (_context) {
+            while (1) switch (_context.p = _context.n) {
+              case 0:
+                // body组件中统一confirm方法（不能用在别的地方）
+                shouldClose = true;
+                if (!_this3.$refs.contentComponent.confirm) {
+                  _context.n = 4;
+                  break;
+                }
+                _context.p = 1;
+                _context.n = 2;
+                return _this3.$refs.contentComponent.confirm();
+              case 2:
+                result = _context.v;
+                if (result === false) shouldClose = false;
+                _context.n = 4;
+                break;
+              case 3:
+                _context.p = 3;
+                _t = _context.v;
+                console.error('弹窗确认时发生错误:', _t);
+                shouldClose = false;
+              case 4:
+                if (typeof _this3.onConfirm === 'function' && shouldClose) {
+                  _this3.onConfirm();
+                }
+                if (shouldClose) {
+                  _this3.handleClose();
+                }
+              case 5:
+                return _context.a(2);
+            }
+          }, _callee, null, [[1, 3]]);
+        }))();
+      },
+      // 函数 return false 弹窗不消失； 不返回或者true 弹窗消失
+      footerBtnsClick: function footerBtnsClick(type) {
+        var _this4 = this;
+        return _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
+          var result;
+          return _regenerator().w(function (_context2) {
+            while (1) switch (_context2.n) {
+              case 0:
+                if (!(_this4.$refs.contentComponent && _this4.$refs.contentComponent[type])) {
+                  _context2.n = 2;
+                  break;
+                }
+                _context2.n = 1;
+                return _this4.$refs.contentComponent[type]();
+              case 1:
+                result = _context2.v;
+                if (result !== false) {
+                  _this4.handleClose();
+                }
+                _context2.n = 3;
+                break;
+              case 2:
+                _this4.handleClose();
+              case 3:
+                return _context2.a(2);
+            }
+          }, _callee2);
+        }))();
+      }
+    },
+    render: function render(h) {
+      var _this5 = this;
+      var footerContent = this.footerBtns.length ? h('div', this.footerBtns.map(function (item) {
+        return h(Button, {
+          props: {
+            type: item.type || 'default',
+            size: 'small'
+          },
+          on: {
+            click: function click() {
+              return _this5.footerBtnsClick(item.value);
+            }
+          }
+        }, item.label);
+      })) : h('div', [h(Button, {
+        props: {
+          type: 'default',
+          size: 'small'
+        },
+        on: {
+          click: this.handleCancel
+        }
+      }, this.cancelButtonText), h(Button, {
+        props: {
+          type: 'primary',
+          size: 'small'
+        },
+        on: {
+          click: this.handleConfirm
+        }
+      }, this.confirmButtonText)]);
+      return h('el-dialog', {
+        props: {
+          title: this.title,
+          visible: this.visible,
+          width: isMobileDevice() ? '90%' : this.specialWidth ? this.specialWidth : this.width === '30%' ? '30%' : '50%',
+          'close-on-click-modal': this.closeOnClickModal,
+          showClose: this.showClose,
+          'close-on-press-escape': this.closeOnPressEscape,
+          customClass: this.customClass
+        },
+        on: {
+          'update:visible': function updateVisible(val) {
+            _this5.visible = val;
+          },
+          'before-close': this.handleBeforeClose,
+          'close': this.handleClose,
+          'closed': function closed() {
+            _this5.$emit('closed');
+          }
+        }
+      }, [h(this.contentComponent, {
+        props: this.contentProps,
+        ref: 'contentComponent',
+        scopedSlots: this.$scopedSlots,
+        on: {
+          onClose: function onClose() {
+            _this5.handleClose();
+          },
+          onConfirm: function onConfirm() {
+            _this5.handleConfirm();
+          }
+        }
+      }), !this.isShowBtn ? '' : h('template', {
+        slot: 'footer'
+      }, [footerContent])]);
+    }
+  });
+  var instance = new Constructor().$mount();
+  document.body.appendChild(instance.$el);
+}
+
+export { createCommandDialog };