@bytenew/bn-applet-ui 1.1.32 → 1.1.33

package/dist/bn-applet-ui.common.js

@@ -638,6 +638,30 @@ ___CSS_LOADER_EXPORT___.push([module.id, `.bytenew-select-box[data-v-12683c88]{w
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
 
+/***/ },
+
+/***/ 6105
+(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1601);
+/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6314);
+/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
+// Imports
+
+
+var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
+// Module
+___CSS_LOADER_EXPORT___.push([module.id, `.virtualPopover[data-v-387cfe9e]{position:fixed;z-index:9999;padding-top:6px}.virtualPopover-modal[data-v-387cfe9e]{position:relative;background:#fff;box-shadow:0 12px 48px 16px rgba(0,0,0,.02),0 9px 28px 0 rgba(0,0,0,.02),0 6px 16px -8px rgba(0,0,0,.04)}.virtualPopover-arrow[data-v-387cfe9e]{position:absolute}.virtualPopover-arrow[data-v-387cfe9e]:after,.virtualPopover-arrow[data-v-387cfe9e]:before{content:"";display:block;width:0;height:0;top:0;border:6px solid transparent;position:absolute;z-index:1}.virtualPopover-arrow[data-v-387cfe9e]:before{z-index:2}.virtualPopover-arrow.bottom[data-v-387cfe9e]{top:-6px}.virtualPopover-arrow.bottom[data-v-387cfe9e]:before{border-bottom-color:#fff}.virtualPopover-arrow.bottom[data-v-387cfe9e]:after{border-bottom-color:rgba(0,0,0,.08);top:-1px}.virtualPopover-arrow.top[data-v-387cfe9e]{bottom:0}.virtualPopover-arrow.top[data-v-387cfe9e]:before{border-top-color:#fff}.virtualPopover-arrow.top[data-v-387cfe9e]:after{border-top-color:rgba(0,0,0,.08);top:1px}.virtualPopover.bottom[data-v-387cfe9e]{margin-top:6px}.virtualPopover.top[data-v-387cfe9e]{margin-bottom:6px}`, ""]);
+// Exports
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
+
+
 /***/ },
 
 /***/ 4911
@@ -1225,6 +1249,22 @@ var update = add("506589a0", content, true, {"sourceMap":false,"shadowMode":fals
 
 /***/ },
 
+/***/ 9587
+(module, __unused_webpack_exports, __webpack_require__) {
+
+// style-loader: Adds some css to the DOM by adding a <style> tag
+
+// load the styles
+var content = __webpack_require__(6105);
+if(content.__esModule) content = content.default;
+if(typeof content === 'string') content = [[module.id, content, '']];
+if(content.locals) module.exports = content.locals;
+// add the styles to the DOM
+var add = (__webpack_require__(9548)/* ["default"] */ .A)
+var update = add("c518d294", content, true, {"sourceMap":false,"shadowMode":false});
+
+/***/ },
+
 /***/ 9548
 (__unused_webpack_module, __webpack_exports__, __webpack_require__) {
 
@@ -10476,6 +10516,7 @@ __webpack_require__.d(__webpack_exports__, {
   BnInputNum: () => (/* reexport */ BnInputNum),
   BnRuleCondition: () => (/* reexport */ bnRuleCondition),
   BnSelect: () => (/* reexport */ BnSelect_select),
+  BnVirtPopover: () => (/* reexport */ BnVirtPopover),
   addressParse: () => (/* reexport */ addressParse),
   "default": () => (/* binding */ entry_lib),
   idsToTexts: () => (/* reexport */ idsToTexts)
@@ -21051,6 +21092,344 @@ var BnFiTaxAutoComplete_component = normalizeComponent(
 )
 
 /* harmony default export */ const BnFiTaxAutoComplete = (BnFiTaxAutoComplete_component.exports);
+;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/babel-loader/lib/index.js!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./packages/BnVirtPopover/index.vue?vue&type=template&id=387cfe9e&scoped=true
+var BnVirtPopovervue_type_template_id_387cfe9e_scoped_true_render = function render() {
+  var _vm = this,
+    _c = _vm._self._c;
+  return _c('transition', {
+    attrs: {
+      "appear": "",
+      "name": _vm.popoverPosition == 'bottom' ? 'el-zoom-in-top' : 'el-zoom-in-bottom'
+    }
+  }, [_c('div', {
+    directives: [{
+      name: "show",
+      rawName: "v-show",
+      value: _vm.modal,
+      expression: "modal"
+    }],
+    ref: "customPopover",
+    staticClass: "virtualPopover",
+    "class": _vm.popoverClass,
+    style: _vm.popoverStyle,
+    on: {
+      "mouseover": _vm.onMouseEvent,
+      "mouseleave": _vm.onMouseEvent
+    }
+  }, [_c('div', {
+    "class": _vm.arrowClass,
+    style: _vm.arrowStyle
+  }), _c('div', {
+    staticClass: "virtualPopover-modal",
+    on: {
+      "click": function click($event) {
+        $event.stopPropagation();
+      }
+    }
+  }, [_vm._t("default")], 2)])]);
+};
+var BnVirtPopovervue_type_template_id_387cfe9e_scoped_true_staticRenderFns = [];
+
+// EXTERNAL MODULE: ./node_modules/core-js/modules/es.string.trim.js
+var es_string_trim = __webpack_require__(2762);
+;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/babel-loader/lib/index.js!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./packages/BnVirtPopover/index.vue?vue&type=script&lang=js
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/* harmony default export */ const BnVirtPopovervue_type_script_lang_js = ({
+  name: "BnVirtPopover",
+  props: {
+    // popover的宽度，支持数字或字符串（如'200px'）
+    width: {
+      type: [Number, String],
+      "default": 220
+    },
+    // popover的显示位置，支持 'top' 或 'bottom'
+    popoverPosition: {
+      type: String,
+      "default": "bottom"
+    }
+  },
+  data: function data() {
+    return {
+      modal: false,
+      // 控制 popover 的显示/隐藏
+      popoverStyle: {},
+      // popover 的样式对象
+      popoverClass: [],
+      // popover 的类名数组
+      arrowStyle: {},
+      // 箭头的样式对象
+      arrowClass: [],
+      // 箭头的类名数组
+      targetEvent: undefined,
+      // 存储触发事件的对象
+      closeTimer: null // 关闭延时器
+    };
+  },
+  computed: {
+    /** 将 width 转为数字（px），用于位置计算；非纯数字返回 null */numericWidth: function numericWidth() {
+      var w = this.width;
+      if (typeof w === 'number' && !isNaN(w)) return w;
+      if (typeof w === 'string' && /^\d+(\.\d+)?$/.test(w.trim())) return parseFloat(w);
+      return null;
+    }
+  },
+  beforeDestroy: function beforeDestroy() {
+    clearTimeout(this.closeTimer);
+    window.removeEventListener('click', this.close);
+    window.removeEventListener('mouseup', this.onMouseup);
+  },
+  methods: {
+    /**
+     * 切换 popover 的显示状态
+     * 如果当前显示且点击同一个触发元素，则关闭
+     * 如果当前显示且点击不同触发元素，则更新位置
+     * 如果当前隐藏，则显示
+     * @param {Event} e - 触发事件对象
+     */
+    toggle: function toggle(e) {
+      if (!e) {
+        alert('把事件对象传进来');
+      }
+      this.targetEvent = e;
+      // 鼠标悬浮事件
+      if (e.type.indexOf('mouse') >= 0) {
+        // 鼠标离开事件
+        if (e.type == 'mouseleave') {
+          this.close(e);
+        } else {
+          this.openPopover(e);
+        }
+      }
+      //点击事件 或 其他
+      else {
+        if (this.modal) {
+          this.close(e);
+        } else {
+          this.openPopover(e);
+        }
+      }
+    },
+    /**
+     * 打开 popover
+     * @param {Event} e - 触发事件对象
+     */
+    openPopover: function openPopover(e) {
+      var _this = this;
+      this.targetEvent = e;
+      this.open();
+      // 等待 DOM 更新后初始化位置
+      this.$nextTick(function () {
+        _this.initPosition();
+      });
+      // 阻止事件冒泡
+      e && e.stopPropagation();
+      // 添加全局事件监听
+      window.addEventListener("click", this.close);
+      window.addEventListener("mouseup", this.onMouseup);
+    },
+    /**
+     * 初始化 popover 位置
+     * 包括：
+     * 1. 计算 popover 的位置和大小
+     * 2. 处理屏幕边界情况
+     * 3. 计算箭头位置
+     * 4. 判断显示方向（上/下）
+     */
+    initPosition: function initPosition() {
+      var triggerEl = this.getTriggerEl();
+      if (triggerEl && triggerEl.getBoundingClientRect) {
+        // 获取触发 dom 位置（优先 currentTarget，避免 el-button 内层子元素导致偏移）
+        var _triggerEl$getBoundin = triggerEl.getBoundingClientRect(),
+          left = _triggerEl$getBoundin.left,
+          top = _triggerEl$getBoundin.top,
+          width = _triggerEl$getBoundin.width,
+          height = _triggerEl$getBoundin.height;
+        // 初始样式
+        this.popoverStyle = {};
+        this.popoverClass = ["virtualPopover"];
+        this.arrowClass = ["virtualPopover-arrow"];
+        // 获取屏幕宽高
+        var clientWidth = window.innerWidth;
+        var clientHeight = window.innerHeight;
+        // 计算变量
+        var arrowWidth = 6;
+        var popWidth = this.numericWidth;
+        var popoverGap = popWidth && width > popWidth ? 0 : 10; // 最小边距
+        var popoverLeft = left - popoverGap; // 距离左侧距离
+
+        // 计算 popover 的最终位置
+        var finalPopoverLeft = popoverLeft;
+        if (popWidth && popoverLeft + popWidth > clientWidth) {
+          // 如果超出右边界，将 popover 靠右对齐
+          finalPopoverLeft = clientWidth - popWidth - popoverGap;
+          this.popoverStyle.left = "".concat(finalPopoverLeft, "px");
+        } else {
+          this.popoverStyle.left = "".concat(popoverLeft, "px");
+        }
+
+        // 计算箭头位置，使其始终指向触发元素的中心
+        var targetCenter = left + width / 2;
+        var arrowLeft = targetCenter - finalPopoverLeft - arrowWidth;
+
+        // 确保箭头不会超出 popover 的边界
+        var minArrowLeft = arrowWidth * 2;
+        var maxArrowLeft = popWidth ? popWidth - arrowWidth * 3 : 200;
+        this.arrowStyle.left = "".concat(Math.min(Math.max(arrowLeft, minArrowLeft), maxArrowLeft), "px");
+
+        // 判断popover宽度是否超出屏幕宽度，超出则减少为最小宽度，出现滚动条
+        if (popWidth == null) {
+          this.popoverStyle.width = "".concat(this.width);
+        } else {
+          if (popWidth + popoverGap * 2 > clientWidth) {
+            this.popoverStyle.width = "".concat(clientWidth - popoverGap * 2, "px");
+          } else this.popoverStyle.minWidth = "".concat(popWidth, "px");
+        }
+        // 获取popover的dom位置
+        var _this$$refs$customPop = this.$refs.customPopover.getBoundingClientRect(),
+          popoverBottom = _this$$refs$customPop.bottom,
+          popoverHeight = _this$$refs$customPop.height;
+        // 判断popover是在上方还是下方
+        var bottomDistance = clientHeight - popoverBottom; // 与底部距离
+        var popoverPosition = this.popoverPosition;
+        if (top > bottomDistance && (popoverHeight === 0 || this.modal || popoverHeight >= bottomDistance)) {
+          popoverPosition = "top";
+        }
+        // 内容高度大于屏幕剩高度，并且上方区域大于下方区域
+        if (popoverPosition === "top") {
+          this.popoverStyle.bottom = "".concat(clientHeight - top, "px");
+        } else {
+          this.popoverStyle.top = "".concat(top + height, "px");
+        }
+        this.arrowClass.push(popoverPosition);
+        this.popoverClass.push(popoverPosition);
+      }
+    },
+    /**
+     * 监听鼠标抬起事件
+     * 用于判断点击位置是否在 popover 外部，决定是否关闭
+     * @param {MouseEvent} param0 - 鼠标事件对象，解构获取坐标
+     */
+    onMouseup: function onMouseup(_ref) {
+      var x = _ref.x,
+        y = _ref.y;
+      if (this.$refs.customPopover && this.modal) {
+        var triggerEl = this.getTriggerEl();
+        if (triggerEl && triggerEl.getBoundingClientRect) {
+          var _triggerEl$getBoundin2 = triggerEl.getBoundingClientRect(),
+            _left = _triggerEl$getBoundin2.left,
+            _right = _triggerEl$getBoundin2.right,
+            _top = _triggerEl$getBoundin2.top,
+            _bottom = _triggerEl$getBoundin2.bottom;
+          if (!(x < _left || x > _right || y < _top || y > _bottom)) return;
+        }
+        var _this$$refs$customPop2 = this.$refs.customPopover.getBoundingClientRect(),
+          left = _this$$refs$customPop2.left,
+          right = _this$$refs$customPop2.right,
+          top = _this$$refs$customPop2.top,
+          bottom = _this$$refs$customPop2.bottom;
+        if (x < left || x > right || y < top || y > bottom) {
+          this.close();
+        }
+        ;
+      }
+    },
+    /**
+     * 开启
+     */
+    open: function open() {
+      clearTimeout(this.closeTimer);
+      this.closeTimer = null;
+      this.modal = true;
+    },
+    /**
+     * 关闭
+     */
+    close: function close() {
+      var _this2 = this;
+      clearTimeout(this.closeTimer);
+      // 当触发是点击事件时，直接关闭，不延时
+      if (this.targetEvent && this.targetEvent.type == 'click') {
+        this.modal = false;
+        window.removeEventListener("click", this.close);
+        window.removeEventListener("mouseup", this.onMouseup);
+      } else {
+        this.closeTimer = setTimeout(function () {
+          _this2.modal = false;
+          window.removeEventListener("click", _this2.close);
+          window.removeEventListener("mouseup", _this2.onMouseup);
+        }, 300);
+      }
+    },
+    /**
+     * 处理鼠标移入移出事件
+     * 用于实现 hover 效果
+     * 移入时清除关闭定时器
+     * 移出时设置延迟关闭
+     * @param {MouseEvent} e - 鼠标事件对象
+     */
+    onMouseEvent: function onMouseEvent(e) {
+      if (!this.targetEvent) return;
+      if (e.type === 'mouseover' && this.targetEvent.type !== 'click') {
+        clearTimeout(this.closeTimer);
+        this.closeTimer = null;
+        this.modal = true;
+      }
+      // 只有触发事件是鼠标悬浮时，从pop移开才关闭
+      else if (this.targetEvent.type.indexOf('mouse') >= 0 && e.type === 'mouseleave') {
+        clearTimeout(this.closeTimer);
+        this.modal = false;
+        window.removeEventListener("click", this.close);
+        window.removeEventListener("mouseup", this.onMouseup);
+      }
+    },
+    /** 获取触发元素：Vue2 组件上 .native 绑定时 currentTarget 为组件根节点 */getTriggerEl: function getTriggerEl() {
+      if (!this.targetEvent) return null;
+      return this.targetEvent.currentTarget || this.targetEvent.target;
+    }
+  }
+});
+;// ./packages/BnVirtPopover/index.vue?vue&type=script&lang=js
+ /* harmony default export */ const packages_BnVirtPopovervue_type_script_lang_js = (BnVirtPopovervue_type_script_lang_js); 
+// EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[4]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./packages/BnVirtPopover/index.vue?vue&type=style&index=0&id=387cfe9e&prod&lang=scss&scoped=true
+var BnVirtPopovervue_type_style_index_0_id_387cfe9e_prod_lang_scss_scoped_true = __webpack_require__(9587);
+;// ./packages/BnVirtPopover/index.vue?vue&type=style&index=0&id=387cfe9e&prod&lang=scss&scoped=true
+
+;// ./packages/BnVirtPopover/index.vue
+
+
+
+;
+
+
+/* normalize component */
+
+var BnVirtPopover_component = normalizeComponent(
+  packages_BnVirtPopovervue_type_script_lang_js,
+  BnVirtPopovervue_type_template_id_387cfe9e_scoped_true_render,
+  BnVirtPopovervue_type_template_id_387cfe9e_scoped_true_staticRenderFns,
+  false,
+  null,
+  "387cfe9e",
+  null
+  
+)
+
+/* harmony default export */ const BnVirtPopover = (BnVirtPopover_component.exports);
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.map.js
 var es_map = __webpack_require__(6033);
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.map.get-or-insert.js
@@ -21141,8 +21520,6 @@ function getApiBaseUrl() {
 });
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.sort.js
 var es_array_sort = __webpack_require__(6910);
-// EXTERNAL MODULE: ./node_modules/core-js/modules/es.string.trim.js
-var es_string_trim = __webpack_require__(2762);
 ;// ../../packages/utils/addressParse.js
 
 
@@ -23595,6 +23972,7 @@ function mainAppRouterPush(route) {
 
 
 
+
 const BnAppletUi = {
     install: (Vue) => {
         Vue.component("BnAddress", BnAddress);
@@ -23611,6 +23989,7 @@ const BnAppletUi = {
         Vue.component("BnRuleCondition", bnRuleCondition);
         Vue.component("BnSelect", BnSelect_select);
         Vue.component("BnFiTaxAutoComplete", BnFiTaxAutoComplete);
+        Vue.component("BnVirtPopover", BnVirtPopover);
     }
 };