Merge branch 'next' into doc-demand

package/component/package.json

@@ -42,21 +42,6 @@
     "uuid": "^8.3.2",
     "vue-i18n": "^9.1.9"
   },
-  "devDependencies": {
-    "@babel/core": "^7.17.9",
-    "@babel/preset-env": "^7.15.8",
-    "@babel/preset-typescript": "^7.15.0",
-    "@rollup/plugin-babel": "^5.3.0",
-    "@types/node": "^16.11.9",
-    "@vitejs/plugin-vue": "^2.3.1",
-    "@vue/compiler-sfc": "^3.2.33",
-    "@vue/server-renderer": "^3.2.33",
-    "less": "^4.1.2",
-    "rimraf": "^3.0.2",
-    "rollup": "^2.70.1",
-    "typescript": "^4.6.3",
-    "vite": "2.9.8"
-  },
   "files": [
     "lib",
     "es",

package/component/src/component/collapseItem/index.vue

@@ -56,7 +56,9 @@ const showHandle = function () {
       @click="showHandle"
     >
       <slot name="title" :props="props">{{ title }}</slot>
-      <i class="layui-icon layui-colla-icon">{{ isShow ? "" : "" }}</i>
+      <i class="layui-icon layui-colla-icon">
+        {{ isShow ? "" : "" }}
+      </i>
     </h2>
     <lay-transition :enable="collapseTransition">
       <div v-if="isShow">

package/component/src/component/fullscreen/index.vue

@@ -184,7 +184,7 @@ const activeEl = computed(() => (targetEl.value = props.target));
 
 /**
  * 处理 fullscreenchange 和浏览器窗口内全屏 Escape 按键事件
- * @param event Escape 键盘事件
+ * @param event 键盘事件
  */
 const onFullscreenchange = function (event: KeyboardEvent) {
   if (isFullscreen.value && !document.fullscreenElement) {
@@ -197,10 +197,25 @@ const onFullscreenchange = function (event: KeyboardEvent) {
   }
 };
 
+/**
+ * 屏蔽 F11 按键原生事件,用 fullscreenAPI 代替
+ * @param event 键盘事件
+ */
+const onKeydownF11 = function (event: KeyboardEvent) {
+  // DOM 根节点全屏
+  let isRootNodeFullscreen =
+    props.immersive && (!activeEl.value || activeEl.value === defaultElement);
+  if (event.key === "F11" && isRootNodeFullscreen) {
+    event.preventDefault();
+    toggle();
+  }
+};
+
 onMounted(() => {
   //@ts-ignore
   document.addEventListener(fullscreenAPI.fullscreenchange, onFullscreenchange);
   document.addEventListener("keydown", onFullscreenchange);
+  document.addEventListener("keydown", onKeydownF11);
 });
 
 onBeforeUnmount(() => {
@@ -210,6 +225,7 @@ onBeforeUnmount(() => {
     onFullscreenchange
   );
   document.removeEventListener("keydown", onFullscreenchange);
+  document.removeEventListener("keydown", onKeydownF11);
 });
 </script>
 

package/component/src/component/menu/index.less

@@ -308,9 +308,4 @@
   .layui-nav-child {
     background-color: transparent;
   }
-}
-
-.layui-nav-child-spacing .layui-nav-item .layui-nav-child {
-  padding-left: 10px;
-  box-sizing: border-box;
-}
+}

package/component/src/component/menu/index.vue

@@ -5,15 +5,7 @@ export default {
 </script>
 
 <script setup lang="ts">
-import {
-  computed,
-  ComputedRef,
-  provide,
-  Ref,
-  ref,
-  watch,
-  WritableComputedRef,
-} from "vue";
+import { computed, ComputedRef, provide, Ref, ref, watch } from "vue";
 import "./index.less";
 
 export interface LayMenuProps {
@@ -25,7 +17,6 @@ export interface LayMenuProps {
   level?: boolean | string;
   collapse?: boolean | string;
   collapseTransition?: boolean | string;
-  childSpacing?: boolean;
 }
 
 const emit = defineEmits([
@@ -44,7 +35,6 @@ const props = withDefaults(defineProps<LayMenuProps>(), {
   level: true,
   collapse: false,
   collapseTransition: true,
-  childSpacing: false,
 });
 
 const isTree: ComputedRef = computed(() => props.tree);
@@ -103,7 +93,6 @@ provide("isCollapseTransition", isCollapseTransition);
       tree ? 'layui-nav-tree' : '',
       theme === 'dark' ? 'layui-nav-dark' : 'layui-nav-light',
       collapse ? 'layui-nav-collapse' : '',
-      childSpacing ? 'layui-nav-child-spacing' : '',
     ]"
   >
     <slot></slot>

package/component/src/component/subMenu/index.vue

@@ -89,15 +89,25 @@ onBeforeUnmount(() => window.removeEventListener("resize", setPosition));
 <template>
   <li class="layui-nav-item">
     <a href="javascript:void(0)" @click="openHandle()">
+      <!-- 图标 -->
       <i>
         <slot v-if="slots.icon" name="icon"></slot>
       </i>
+      <!-- 标题 -->
       <span>
         <slot v-if="slots.title" name="title"></slot>
       </span>
+      <!-- 扩展 -->
+      <i v-if="slots.expandIcon" class="layui-nav-more">
+        <slot name="expandIcon" :isExpand="isOpen"></slot>
+      </i>
       <i
-        :class="[isOpen && !isTree ? 'layui-nav-mored' : '']"
-        class="layui-icon layui-icon-down layui-nav-more"
+        v-else
+        :class="[
+          isOpen ? 'layui-nav-mored' : '',
+          'layui-icon layui-icon-down',
+          'layui-nav-more',
+        ]"
       ></i>
     </a>
     <template v-if="isTree">

package/component/src/component/table/index.less

@@ -479,10 +479,6 @@
   padding: 0 10px;
 }
 
-.layui-table-page select {
-  height: 18px;
-}
-
 .layui-table-pagebar {
   float: right;
   line-height: 26px;

package/component/src/component/table/index.vue

@@ -211,6 +211,7 @@ onMounted(() => {
   <div :id="tableId">
     <table class="layui-hide" lay-filter="test"></table>
     <div class="layui-form layui-border-box layui-table-view">
+      <!-- 工具栏 -->
       <div v-if="defaultToolbar || slot.toolbar" class="layui-table-tool">
         <div v-if="slot.toolbar" class="layui-table-tool-temp">
           <slot name="toolbar"></slot>
@@ -253,7 +254,7 @@ onMounted(() => {
       </div>
 
       <div class="layui-table-box">
-        <!-- table header -->
+        <!-- 表头 -->
         <div class="layui-table-header" ref="tableHeader">
           <table class="layui-table" :lay-size="size">
             <thead>
@@ -308,12 +309,11 @@ onMounted(() => {
             </thead>
           </table>
         </div>
-        <!-- table body -->
+        <!-- 表身 -->
         <div class="layui-table-body layui-table-main" ref="tableBody">
           <table class="layui-table" :lay-size="size">
             <tbody>
               <template v-for="data in tableDataSource" :key="data">
-                <!-- sub table impl -->
                 <tr
                   @click.stop="rowClick(data, $event)"
                   @dblclick.stop="rowDoubleClick(data, $event)"
@@ -332,8 +332,9 @@ onMounted(() => {
 
                   <!-- 数据列 -->
                   <template v-for="column in columns" :key="column">
+                    <!-- 展示否 -->
                     <template v-if="tableColumnKeys.includes(column.key)">
-                      <!-- 插 槽 Column -->
+                      <!-- 插槽列 -->
                       <template v-if="column.customSlot">
                         <td
                           class="layui-table-cell"
@@ -346,21 +347,18 @@ onMounted(() => {
                         </td>
                       </template>
                       <!-- 匹 配 Column -->
-                      <template
-                        v-else
-                        v-for="(value, key) in data"
-                        :key="value"
-                      >
-                        <td
-                          v-if="column.key == key"
-                          class="layui-table-cell"
-                          :style="{
-                            textAlign: column.align,
-                            flex: column.width ? '0 0 ' + column.width : '1',
-                          }"
-                        >
-                          <span> {{ value }} </span>
-                        </td>
+                      <template v-else>
+                        <template v-if="column.key in data">
+                          <td
+                            class="layui-table-cell"
+                            :style="{
+                              textAlign: column.align,
+                              flex: column.width ? '0 0 ' + column.width : '1',
+                            }"
+                          >
+                            <span> {{ data[column.key] }} </span>
+                          </td>
+                        </template>
                       </template>
                     </template>
                   </template>