eoss 0.1.0-alpha.47 → 0.1.0-alpha.49

package/packages/data-table/src/sizer.vue

@@ -1,24 +1,7 @@
 <template>
-  <div class="es-table-sizer">
-    <div class="es-table-sizer-tips">
-      提示：锁定的列排序无效，列的内容是数字才能合计
-    </div>
-    <es-data-table
-      dragSort
-      numbers
-      form
-      row-key="id"
-      default-expand-all
-      height="480px"
-      :mode="mode"
-      :data="theads"
-      :thead="thead"
-      :tree-props="{ children: 'childHead' }"
-      @change="handleChange"
-      @update-drag-sort="handleDrag"
-    >
-    </es-data-table>
-    <div class="sizer-btn-box">
+  <div>
+    <es-table height="380px" :data.sync="rows" :thead="thead"> </es-table>
+    <div class="es-data-table__sizer-btn">
       <es-button type="primary" size="medium" @click="handleConfirm"
         >确定</es-button
       >
@@ -35,25 +18,15 @@ export default {
   components: { EsButton, EsDataTable },
 
   props: {
-    mode: String,
-    data: Array
+    data: Array,
+    showSummary: Boolean
   },
   computed: {
-    theads: {
-      get() {
-        if (this.data && this.data.length) {
-          let newData = [];
-          this.getThead(this.data, newData);
-          return newData;
-        }
-        return [];
-      }
-    }
-  },
-  data() {
-    return {
-      visible: false,
-      thead: [
+    thead() {
+      const thead = [
+        {
+          type: 'drag'
+        },
         {
           title: '名称',
           field: 'title'
@@ -62,9 +35,10 @@ export default {
           title: '锁定列位置',
           field: 'fixed',
           type: 'select',
-          clearable: true,
-          width: 160,
-          data: [
+          config: {
+            clearable: true
+          },
+          optionData: [
             {
               value: 'left',
               name: '左'
@@ -79,43 +53,58 @@ export default {
           title: '列是否显示',
           field: 'hide',
           type: 'switch',
-          width: 160,
           align: 'center',
-          data: [
-            {
-              value: false,
-              name: '隐藏'
-            },
-            {
-              value: true,
-              name: '显示'
-            }
-          ]
-        },
-        {
-          title: '是否开启合计',
-          field: 'total',
-          type: 'switch',
-          width: 160,
-          align: 'center',
-          data: [
-            {
-              value: false,
-              name: '关闭'
-            },
+          // row.hide 为「是否显示」（true=显示），与 thead.hide（true=隐藏）互反，
+          // es-switch 的 ON(true)/OFF(false) 文案按显示语义对应
+          config: {
+            data: [
+              {
+                value: false,
+                name: '隐藏'
+              },
+              {
+                value: true,
+                name: '显示'
+              }
+            ]
+          }
+        }
+      ];
+      return this.showSummary
+        ? [
+            ...thead,
             {
-              value: true,
-              name: '开启'
+              title: '是否开启合计',
+              field: 'total',
+              type: 'switch',
+              align: 'center',
+              data: [
+                {
+                  value: false,
+                  name: '关闭'
+                },
+                {
+                  value: true,
+                  name: '开启'
+                }
+              ]
             }
           ]
-        }
-      ],
+        : thead;
+    }
+  },
+  data() {
+    return {
+      visible: false,
       newThead: [],
-      nid: 0
+      // sizer 表格行模型（活模型）：拖拽顺序经 :data.sync 回写，
+      // 锁定/显示/合计等编辑由 renderDom 的 setValue 直接写回行对象
+      rows: []
     };
   },
   mounted() {
     this.newThead = extend(true, [], this.data);
+    this.getThead(this.data, this.rows);
   },
   methods: {
     show() {
@@ -126,7 +115,8 @@ export default {
         if (
           item.type !== 'index' &&
           item.type !== 'selection' &&
-          item.type !== 'handle'
+          item.type !== 'handle' &&
+          item.type !== 'drag'
         ) {
           let { fixed, hide, childHead, children, title, ...other } = item;
           let items = {
@@ -152,8 +142,6 @@ export default {
             items.children = childHeads;
           }
           data.push(items);
-        } else {
-          this.nid++;
         }
       });
     },
@@ -175,24 +163,53 @@ export default {
         }
       }
     },
-    handleChange(res) {
-      this.setThead(res, this.newThead);
-    },
-    handleDrag(res, evt) {
-      let { oldIndex, newIndex } = evt;
-      oldIndex += this.nid;
-      newIndex += this.nid;
-      if (oldIndex > newIndex) {
-        this.newThead.splice(newIndex, 0, this.newThead[oldIndex]);
-        this.newThead.splice(oldIndex + 1, 1);
-      } else {
-        this.newThead.splice(newIndex + 1, 0, this.newThead[oldIndex]);
-        this.newThead.splice(oldIndex, 1);
-      }
-    },
     handleConfirm() {
+      console.log(this.newThead, this.rows);
       this.visible = false;
-      this.$emit('confirm', this.newThead);
+      // rows 是拖拽+编辑后的活模型：按 field 把各列新值反写回 newThead
+      // （取值映射与 getThead/setThead 的约定互逆），再按 rows 顺序重排，
+      // drag/handle 等不在 rows 里的结构列保持原槽位不动
+      const rowByField = {};
+      this.rows.forEach((row) => {
+        rowByField[row.field] = row;
+      });
+      const applyRow = (item) => {
+        const row = rowByField[item.field];
+        if (row) {
+          if (row.fixed === 'left') {
+            item.fixed = true;
+          } else if (row.fixed === 'right') {
+            item.fixed = 'right';
+          } else {
+            delete item.fixed;
+          }
+          // row.hide 为「是否显示」，与 thead.hide（true=隐藏）互反，回写时取反；
+          // false 时删键保持 thead 干净（与 setThead 的历史处理一致）
+          item.hide = !row.hide;
+          item.hide === false && delete item.hide;
+          // 合计列在展示时把每列 total 标记显式回写：table-footer 默认对
+          // 除 total===false 外的所有列求和，不显式化会把未开启合计的列也算进去
+          if (this.showSummary || 'total' in row) {
+            item.total = !!row.total;
+          }
+        }
+        if (item.childHead && item.childHead.length) {
+          item.childHead.forEach(applyRow);
+        }
+        if (item.children && item.children.length) {
+          item.children.forEach(applyRow);
+        }
+      };
+      this.newThead.forEach(applyRow);
+      const order = this.rows.map((row) => row.field);
+      const pool = this.newThead
+        .filter((item) => order.includes(item.field))
+        .sort((a, b) => order.indexOf(a.field) - order.indexOf(b.field));
+      let i = 0;
+      const merged = this.newThead.map((item) =>
+        order.includes(item.field) ? pool[i++] : item
+      );
+      this.$emit('confirm', merged);
     }
   }
 };

package/packages/dialog/src/dialog.vue

@@ -365,13 +365,15 @@ export default {
      * 获取定位基准矩形（视口）
      * wujie 沙箱（非降级）下 document.body 为 shadowRoot.body，其 rect 只是子应用在主应用内的容器区域
      * （扣除了主应用侧栏/顶栏），fixed 定位的 dialog 用它居中、定边界会整体偏移；
-     * documentElement 的尺寸已被 wujie-polyfill 的 DocElementRectPlugin 修正为主应用视口值，改用它做基准；
+     * 沙箱内 documentElement 仅在主应用注册了 wujie-polyfill 的 DocElementRectPlugin 时才被修正（如 eoss-ui 的 main 未注册），
+     * 故直接通过 __WUJIE_RAW_WINDOW__ 取主应用真实视口尺寸做基准，不依赖主应用是否配置插件；
      * 降级模式与非微前端环境保持原有 document.body 基准不变
      */
     getViewportRect() {
       if (window.__WUJIE && !window.__WUJIE.degrade) {
+        const rawWindow = window.__WUJIE_RAW_WINDOW__ || window;
         const { clientWidth: width, clientHeight: height } =
-          document.documentElement;
+          rawWindow.document.documentElement;
         return { width, height, top: 0, left: 0 };
       }
       return document.body.getBoundingClientRect();

package/packages/dropdown/src/dropdown-item.vue

@@ -1,7 +1,7 @@
 <template>
-  <!-- 根据rules条件决定是否渲染 -->
+  <!-- 根据rules条件决定是否渲染；表格操作列场景下行数据从 esButtonGroup 取 -->
   <li
-    v-if="!rules || rules(param)"
+    v-if="checkRules()"
     class="es-dropdown-menu__item"
     :class="{
       'is-disabled': disabled,
@@ -55,7 +55,11 @@ export default {
   name: 'EsDropdownItem',
 
   mixins: [Emitter],
-  inject: ['dropdownMenu'],
+  inject: {
+    dropdownMenu: { default: null },
+    // 按钮组内使用时由 es-button-group provide；独立使用 dropdown 时为 null
+    esButtonGroup: { default: null }
+  },
   components: { EsTooltip, EsIcon },
 
   props: {
@@ -117,6 +121,20 @@ export default {
       this.dropdownMenu.menuItemCreate(this.$el, this.divided);
   },
   methods: {
+    /**
+     * rules 校验：按钮组场景（表格操作列）用行数据调用，
+     * 否则 rules 拿到 undefined 会把本该显示的菜单项判掉
+     * @returns {Boolean} 是否渲染该菜单项
+     */
+    checkRules() {
+      if (!this.rules) {
+        return true;
+      }
+      if (this.esButtonGroup) {
+        return this.rules(this.esButtonGroup.data, this.esButtonGroup.rowData);
+      }
+      return this.rules(this.param);
+    },
     /**
      * 处理点击事件
      * @param {Event} evt - 点击事件对象

package/packages/form/src/form.vue

@@ -109,11 +109,7 @@
 </template>
 <script>
 import objectAssign from 'eoss/src/utils/merge';
-import {
-  getScrollbarWidth,
-  getScrollSize,
-  scrollMove
-} from 'eoss/src/utils/scrollbar';
+import { getScrollSize, scrollMove } from 'eoss/src/utils/scrollbar';
 import { throttle } from 'throttle-debounce';
 import { uuid, extend, exclAttribute, getWinTop } from 'eoss/src/utils/util';
 import { isObject } from 'eoss/src/utils/types.js';
@@ -486,11 +482,12 @@ export default {
     bodyWrapper() {
       return this.$refs.scrollbar;
     },
-    // 滚动条样式
+    // 滚动条样式：只声明滚动方向，原生滚动条由 CSS 隐藏（见 form.scss 的
+    // .es-form-scroll），它不占位，也就不需要再按条宽加宽容器——那样在浏览器
+    // 缩放时量到的 15px 和实际渲染宽度对不上，容器右侧会露出一条灰边
     scrollStyle() {
       if (!this.inline && !this.accordion) {
-        let barWidth = getScrollbarWidth();
-        return { width: `calc(100% + ${barWidth}px)`, 'overflow-y': 'scroll' };
+        return { 'overflow-y': 'scroll' };
       }
       return {};
     }

package/packages/icons/src/icons.vue

@@ -209,7 +209,7 @@ export default {
         }
 
         const keyword = newVal.toLowerCase();
-        this.filteredIconsList = this.filterIcon(keyword);
+        this.filteredIconsList = this.filterIcons(keyword);
       }),
       immediate: true
     }
@@ -229,7 +229,7 @@ export default {
      * @param {string} keyword - 搜索关键词
      * @returns {Array} 过滤后的图标列表
      */
-    filterIcon(keyword) {
+    filterIcons(keyword) {
       return this.allIcons.filter((name) => {
         if (typeof name === 'string') {
           return (

package/packages/lowcode/src/util/components.js

@@ -9712,35 +9712,6 @@ export default [
               }
             ]
           },
-          {
-            name: 'dragSort',
-            type: 'switch',
-            default: false,
-            label: [
-              {
-                type: 'tips',
-                contents: '是否行拖拽排序（需清除列固定）'
-              },
-              {
-                type: 'text',
-                contents: 'dragSort'
-              }
-            ]
-          },
-          {
-            name: 'dragSortClass',
-            type: 'text',
-            label: [
-              {
-                type: 'tips',
-                contents: '行拖拽排序指示器(handle)类名'
-              },
-              {
-                type: 'text',
-                contents: 'dragSortClass'
-              }
-            ]
-          },
           {
             name: 'infiniteScroll',
             type: 'text',
@@ -9983,21 +9954,6 @@ export default [
               }
             ]
           },
-          {
-            name: 'dragSort',
-            type: 'switch',
-            default: false,
-            label: [
-              {
-                type: 'tips',
-                contents: '是否行拖拽排序'
-              },
-              {
-                type: 'text',
-                contents: 'dragSort'
-              }
-            ]
-          },
           {
             name: 'readonly',
             type: 'switch',
@@ -10549,21 +10505,6 @@ export default [
                 contents: 'executeFilter'
               }
             ]
-          },
-          {
-            name: 'dragSortIcon',
-            type: 'text',
-            default: 'es-icon-caidan',
-            label: [
-              {
-                type: 'tips',
-                contents: '行拖拽排序操作列图标'
-              },
-              {
-                type: 'text',
-                contents: 'dragSortIcon'
-              }
-            ]
           }
         ]
       },

package/packages/menu/src/menu.vue

@@ -74,11 +74,7 @@ import emitter from 'eoss/src/mixins/emitter';
 import Migrating from 'eoss/src/mixins/migrating';
 import Menubar from 'eoss/src/utils/menu/aria-menubar';
 import { addClass, removeClass, hasClass } from 'eoss/src/utils/dom';
-import {
-  getScrollbarWidth,
-  getScrollSize,
-  scrollMove
-} from 'eoss/src/utils/scrollbar';
+import { getScrollSize, scrollMove } from 'eoss/src/utils/scrollbar';
 import { throttle } from 'throttle-debounce';
 /**
  * 导航菜单组件
@@ -338,20 +334,13 @@ export default {
         (this.mode === 'vertical' && this.collapse)
       );
     },
+    // 菜单容器自身滚动，原生条由 CSS 隐藏（见 menu.scss 的 .es-menu-container），
+    // 不占位也就无需按条宽加大容器把它推出去——那样在浏览器缩放时量到的 15px
+    // 和实际渲染宽度对不上，容器右/下侧会露出一条灰边
     styles() {
-      // 优化：使用预计算的滚动条宽度，避免重复计算
-      const barWidth = this.scrollbarWidth;
       return this.mode === 'horizontal'
-        ? {
-            height: `calc(100% + ${barWidth}px)`,
-            width: '100%',
-            'overflow-x': 'scroll'
-          }
-        : {
-            width: `calc(100% + ${barWidth}px)`,
-            height: '100%',
-            'overflow-y': 'scroll'
-          };
+        ? { height: '100%', width: '100%', 'overflow-x': 'scroll' }
+        : { width: '100%', height: '100%', 'overflow-y': 'scroll' };
     }
   },
   watch: {
@@ -406,8 +395,7 @@ export default {
       items: {},
       submenus: {},
       moveTo: 0,
-      barSize: 0,
-      scrollbarWidth: 0
+      barSize: 0
     };
   },
   beforeCreate() {
@@ -415,8 +403,6 @@ export default {
   },
   created() {},
   mounted() {
-    // 计算并存储滚动条宽度，避免重复计算
-    this.scrollbarWidth = getScrollbarWidth();
     this.initOpenedMenu();
     this.$on('item-click', this.handleItemClick);
     this.$on('submenu-click', this.handleSubmenuClick);

package/packages/menu/src/mixins.js

@@ -93,7 +93,12 @@ export default {
       }
 
       const { id, index, open, extendData, ...rest } = item;
-      const openStatus = open || extendData ? Boolean(extendData.openStatus) : false;
+      // extendData 存在时以它为准，没有则回退到 item 自身的 open；
+      // 原写法 `open || extendData ? Boolean(extendData.openStatus)` 在
+      // 只声明了 open、没带 extendData 的菜单项上会直接抛错
+      const openStatus = extendData
+        ? Boolean(extendData.openStatus)
+        : Boolean(open);
       let props;
       if (this.isFourthTabs) {
         if ((item.children && item.children.length) || (item.fourthTabs && item.fourthTabs.length)) {

package/packages/menu/src/submenu.vue

@@ -109,8 +109,11 @@
               ]"
               :style="{
                 backgroundColor: rootMenu.backgroundColor || '',
-                maxHeight: maxH === undefined ? '' : maxH,
-                marginRight: isScroll ? gutterWith : ''
+                // 原生条已由 CSS 隐藏（见 menu.scss 的
+                // .es-menu-hidden > .es-menu--popup），不占位也就无需再用
+                // marginRight: -条宽 把它推出容器——缩放时量到的 15px 和
+                // 实际渲染宽度对不上，popup 右/下侧会露出一条灰边
+                maxHeight: maxH === undefined ? '' : maxH
               }"
             >
               <slot>
@@ -162,7 +165,6 @@
 </template>
 
 <script>
-import { getScrollbarWidth } from 'eoss/src/utils/scrollbar';
 import mixins from './mixins';
 import menuMixin from './menu-mixin';
 import Emitter from 'eoss/src/mixins/emitter';
@@ -399,9 +401,6 @@ export default {
         ? 'es-icon-xia'
         : 'es-icon-you';
     },
-    gutterWith() {
-      return `-${getScrollbarWidth()}px`;
-    },
     iconClass() {
       return this.icon || this.rootMenu.parentMenuIcon || this.rootMenu.icon;
     },
@@ -459,7 +458,6 @@ export default {
       items: {},
       submenus: {},
       mouseInChild: false,
-      isScroll: false,
       height: '',
       isHoveringTitle: false
     };
@@ -601,15 +599,8 @@ export default {
   updated() {
     this.$nextTick(() => {
       const dom = this.$refs.menucontent;
-      if (
-        dom &&
-        (dom.scrollHeight > dom.clientHeight ||
-          dom.offsetHeight > dom.clientHeight)
-      ) {
-        this.isScroll = true;
-      } else {
-        this.isScroll = false;
-      }
+      // 只需要给 es-scrollbar 分支算高度；popup 分支的原生条由 CSS 隐藏，
+      // 不再需要判定是否出了滚动条去抵消它的占位
       if (dom && this.maxH && dom.clientHeight > parseInt(this.maxH, 10)) {
         this.height = this.maxH;
       } else {