@fangzhongya/fang-ui 0.1.34 → 0.1.35

package/dist/components/videos/src/index2.cjs

@@ -53,7 +53,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const duration = vue.ref(0);
     const isLoading = vue.ref(false);
     const buffered = vue.ref(0);
-    const showControls = vue.ref(false);
+    const showControls = vue.ref(true);
     const showEndOverlay = vue.ref(false);
     const optionsRate = [
       {
@@ -127,6 +127,16 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }
       isMouse.value = true;
     };
+    let controlsTimeout;
+    const resetControlsTimeout = () => {
+      clearTimeout(controlsTimeout);
+      if (isPlaying.value) {
+        controlsTimeout = setTimeout(() => {
+          showControls.value = false;
+          isList.value = false;
+        }, 5e3);
+      }
+    };
     const togglePlay = () => {
       if (!videoRef.value) return;
       if (isPlaying.value) {
@@ -136,6 +146,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }
       isPlaying.value = !isPlaying.value;
       showEndOverlay.value = false;
+      resetControlsTimeout();
     };
     const setPlaybackRate = () => {
       if (videoRef.value) {
@@ -191,6 +202,33 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         }
       });
     };
+    const handleMouseMove = () => {
+      showControls.value = true;
+      resetControlsTimeout();
+    };
+    const handleKeydown = (event) => {
+      if (!videoRef.value) return;
+      console.log("event.key", event.key);
+      switch (event.key) {
+        case " ":
+        case "Spacebar":
+          event.preventDefault();
+          togglePlay();
+          break;
+        case "ArrowLeft":
+          onTrack(true);
+          break;
+        case "ArrowRight":
+          onTrack(false);
+          break;
+        case "ArrowUp":
+          onSkip(true);
+          break;
+        case "ArrowDown":
+          onSkip(false);
+          break;
+      }
+    };
     vue.onMounted(() => {
       if (videoRef.value) {
         videoRef.value.volume = volume.value / 100;
@@ -201,8 +239,12 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           isPlaying.value = true;
         }
       }
+      document.addEventListener("keydown", handleKeydown);
+      resetControlsTimeout();
     });
     vue.onUnmounted(() => {
+      document.removeEventListener("keydown", handleKeydown);
+      clearTimeout(controlsTimeout);
     });
     __expose({
       ...data.dataExpose
@@ -213,10 +255,12 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         class: vue.normalizeClass([
           vue.unref(cs).z(),
           vue.unref(cs).is("fullscreen", vue.unref(isFullscreen)),
-          vue.unref(cs).is("list", isList.value)
+          vue.unref(cs).is("list", isList.value),
+          vue.unref(cs).is("controls", !showControls.value)
         ]),
         ref_key: "domRef",
-        ref: domRef
+        ref: domRef,
+        onMousemove: handleMouseMove
       }, [
         vue.createElementVNode("div", {
           class: vue.normalizeClass(vue.unref(cs).z("videos"))
@@ -381,7 +425,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         ], 2),
         list.value.length > 1 ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
           key: 0,
-          class: vue.normalizeClass(vue.unref(cs).z("list"))
+          class: vue.normalizeClass(vue.unref(cs).z("controls-list"))
         }, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(list.value, (item, index2) => {
             return vue.openBlock(), vue.createElementBlock("div", {
@@ -395,7 +439,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         ], 2)), [
           [vue.vShow, isList.value]
         ]) : vue.createCommentVNode("", true)
-      ], 2);
+      ], 34);
     };
   }
 });

package/dist/components/videos/src/index2.js

@@ -51,7 +51,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const duration = ref(0);
     const isLoading = ref(false);
     const buffered = ref(0);
-    const showControls = ref(false);
+    const showControls = ref(true);
     const showEndOverlay = ref(false);
     const optionsRate = [
       {
@@ -125,6 +125,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       isMouse.value = true;
     };
+    let controlsTimeout;
+    const resetControlsTimeout = () => {
+      clearTimeout(controlsTimeout);
+      if (isPlaying.value) {
+        controlsTimeout = setTimeout(() => {
+          showControls.value = false;
+          isList.value = false;
+        }, 5e3);
+      }
+    };
     const togglePlay = () => {
       if (!videoRef.value) return;
       if (isPlaying.value) {
@@ -134,6 +144,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       isPlaying.value = !isPlaying.value;
       showEndOverlay.value = false;
+      resetControlsTimeout();
     };
     const setPlaybackRate = () => {
       if (videoRef.value) {
@@ -189,6 +200,33 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }
       });
     };
+    const handleMouseMove = () => {
+      showControls.value = true;
+      resetControlsTimeout();
+    };
+    const handleKeydown = (event) => {
+      if (!videoRef.value) return;
+      console.log("event.key", event.key);
+      switch (event.key) {
+        case " ":
+        case "Spacebar":
+          event.preventDefault();
+          togglePlay();
+          break;
+        case "ArrowLeft":
+          onTrack(true);
+          break;
+        case "ArrowRight":
+          onTrack(false);
+          break;
+        case "ArrowUp":
+          onSkip(true);
+          break;
+        case "ArrowDown":
+          onSkip(false);
+          break;
+      }
+    };
     onMounted(() => {
       if (videoRef.value) {
         videoRef.value.volume = volume.value / 100;
@@ -199,8 +237,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           isPlaying.value = true;
         }
       }
+      document.addEventListener("keydown", handleKeydown);
+      resetControlsTimeout();
     });
     onUnmounted(() => {
+      document.removeEventListener("keydown", handleKeydown);
+      clearTimeout(controlsTimeout);
     });
     __expose({
       ...dataExpose
@@ -211,10 +253,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         class: normalizeClass([
           unref(cs).z(),
           unref(cs).is("fullscreen", unref(isFullscreen)),
-          unref(cs).is("list", isList.value)
+          unref(cs).is("list", isList.value),
+          unref(cs).is("controls", !showControls.value)
         ]),
         ref_key: "domRef",
-        ref: domRef
+        ref: domRef,
+        onMousemove: handleMouseMove
       }, [
         createElementVNode("div", {
           class: normalizeClass(unref(cs).z("videos"))
@@ -379,7 +423,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         ], 2),
         list.value.length > 1 ? withDirectives((openBlock(), createElementBlock("div", {
           key: 0,
-          class: normalizeClass(unref(cs).z("list"))
+          class: normalizeClass(unref(cs).z("controls-list"))
         }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(list.value, (item, index) => {
             return openBlock(), createElementBlock("div", {
@@ -393,7 +437,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         ], 2)), [
           [vShow, isList.value]
         ]) : createCommentVNode("", true)
-      ], 2);
+      ], 34);
     };
   }
 });

package/dist/components/window/src/data.cjs

@@ -61,12 +61,12 @@ const dataProps = buildProps.buildProps({
     default: true
   },
   /**
-   * @props {Boolean} noMin=false ( )
+   * @props {Boolean} isMin=true ( )
    * 是否不要最小化
    */
-  noMin: {
+  isMin: {
     type: Boolean,
-    default: false
+    default: true
   },
   /**
    * @props { Boolean } often= ( )

package/dist/components/window/src/data.d.ts

@@ -65,10 +65,10 @@ export declare const dataProps: {
         default: boolean;
     };
     /**
-     * @props {Boolean} noMin=false ( )
+     * @props {Boolean} isMin=true ( )
      * 是否不要最小化
      */
-    noMin: {
+    isMin: {
         type: BooleanConstructor;
         default: boolean;
     };

package/dist/components/window/src/data.js

@@ -59,12 +59,12 @@ const dataProps = buildProps({
     default: true
   },
   /**
-   * @props {Boolean} noMin=false ( )
+   * @props {Boolean} isMin=true ( )
    * 是否不要最小化
    */
-  noMin: {
+  isMin: {
     type: Boolean,
-    default: false
+    default: true
   },
   /**
    * @props { Boolean } often= ( )

package/dist/components/window/src/index2.cjs

@@ -223,7 +223,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                   title: vue.unref(props).title
                 }, {
                   icon: vue.withCtx(() => [
-                    !vue.unref(props).noMin ? (vue.openBlock(), vue.createElementBlock("span", {
+                    vue.unref(props).isMin ? (vue.openBlock(), vue.createElementBlock("span", {
                       key: 0,
                       title: vue.unref(getLocale)("minh"),
                       onClick: onMin,

package/dist/components/window/src/index2.js

@@ -221,7 +221,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   title: unref(props).title
                 }, {
                   icon: withCtx(() => [
-                    !unref(props).noMin ? (openBlock(), createElementBlock("span", {
+                    unref(props).isMin ? (openBlock(), createElementBlock("span", {
                       key: 0,
                       title: unref(getLocale)("minh"),
                       onClick: onMin,

package/dist/css/forms.css

@@ -620,6 +620,9 @@
   margin-bottom: 0;
   flex: 1;
 }
+.forms-div--query .forms-li .el-form-item .selects-select {
+  min-width: 120px;
+}
 .forms-li .el-form-item {
   margin-bottom: var(--forms-item-bottom);
   flex: 1;

package/dist/css/index.css

@@ -620,6 +620,9 @@
   margin-bottom: 0;
   flex: 1;
 }
+.forms-div--query .forms-li .el-form-item .selects-select {
+  min-width: 120px;
+}
 .forms-li .el-form-item {
   margin-bottom: var(--forms-item-bottom);
   flex: 1;
@@ -1431,7 +1434,7 @@
   bottom: 0;
   width: 100%;
 }
-.videos.is-fullscreen .videos-list {
+.videos.is-fullscreen .videos-controls-list {
   background-color: rgba(238, 238, 238, 0.5);
   position: absolute;
   top: 0;
@@ -1441,6 +1444,15 @@
 .videos.is-list .videos-controls-bottom {
   width: calc(100% - var(--videos-list-width));
 }
+.videos.is-controls .videos-controls-top {
+  display: none;
+}
+.videos.is-controls .videos-controls-bottom {
+  display: none;
+}
+.videos.is-controls .videos-controls-list {
+  display: none;
+}
 .videos-videos {
   flex: 1;
   height: 100%;
@@ -1515,7 +1527,7 @@
   width: 60px;
   margin: 0 10px;
 }
-.videos-list {
+.videos-controls-list {
   width: var(--videos-list-width);
   height: 100%;
   box-sizing: border-box;
@@ -1882,4 +1894,32 @@
 }
 .tablesvp-paginat .el-pagination {
   justify-content: flex-end;
+}
+
+.tablesvpd {
+  width: 100%;
+  height: var(--tablesvpd-height);
+  display: flex;
+  flex-direction: column;
+}
+.tablesvpd-main {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  width: 100%;
+}
+.tablesvpd-main.is-radio .el-table__header .el-table-column--selection .el-checkbox {
+  display: none;
+}
+.tablesvpd-main.is-scroll .v-scroll-add {
+  text-align: center;
+  padding: 10px;
+  color: #999;
+  background-color: #eee;
+}
+.tablesvpd-paginat {
+  overflow: hidden;
+}
+.tablesvpd-paginat .el-pagination {
+  justify-content: flex-end;
 }

package/dist/css/page.css

@@ -620,6 +620,9 @@
   margin-bottom: 0;
   flex: 1;
 }
+.forms-div--query .forms-li .el-form-item .selects-select {
+  min-width: 120px;
+}
 .forms-li .el-form-item {
   margin-bottom: var(--forms-item-bottom);
   flex: 1;

package/dist/css/videos.css

@@ -40,7 +40,7 @@
   bottom: 0;
   width: 100%;
 }
-.videos.is-fullscreen .videos-list {
+.videos.is-fullscreen .videos-controls-list {
   background-color: rgba(238, 238, 238, 0.5);
   position: absolute;
   top: 0;
@@ -50,6 +50,15 @@
 .videos.is-list .videos-controls-bottom {
   width: calc(100% - var(--videos-list-width));
 }
+.videos.is-controls .videos-controls-top {
+  display: none;
+}
+.videos.is-controls .videos-controls-bottom {
+  display: none;
+}
+.videos.is-controls .videos-controls-list {
+  display: none;
+}
 .videos-videos {
   flex: 1;
   height: 100%;
@@ -124,7 +133,7 @@
   width: 60px;
   margin: 0 10px;
 }
-.videos-list {
+.videos-controls-list {
   width: var(--videos-list-width);
   height: 100%;
   box-sizing: border-box;

package/dist/icons/index.json

@@ -1,7 +1,7 @@
 {
     "prefix": "fang-ui",
     "info": {},
-    "lastModified": 1763605251473,
+    "lastModified": 1763621868916,
     "icons": {
         "bar": {
             "body": " <path fill=\"currentColor\" d=\"M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64z\" ></path> "

package/dist/index.css

@@ -620,6 +620,9 @@
   margin-bottom: 0;
   flex: 1;
 }
+.forms-div--query .forms-li .el-form-item .selects-select {
+  min-width: 120px;
+}
 .forms-li .el-form-item {
   margin-bottom: var(--forms-item-bottom);
   flex: 1;
@@ -1431,7 +1434,7 @@
   bottom: 0;
   width: 100%;
 }
-.videos.is-fullscreen .videos-list {
+.videos.is-fullscreen .videos-controls-list {
   background-color: rgba(238, 238, 238, 0.5);
   position: absolute;
   top: 0;
@@ -1441,6 +1444,15 @@
 .videos.is-list .videos-controls-bottom {
   width: calc(100% - var(--videos-list-width));
 }
+.videos.is-controls .videos-controls-top {
+  display: none;
+}
+.videos.is-controls .videos-controls-bottom {
+  display: none;
+}
+.videos.is-controls .videos-controls-list {
+  display: none;
+}
 .videos-videos {
   flex: 1;
   height: 100%;
@@ -1515,7 +1527,7 @@
   width: 60px;
   margin: 0 10px;
 }
-.videos-list {
+.videos-controls-list {
   width: var(--videos-list-width);
   height: 100%;
   box-sizing: border-box;
@@ -1882,4 +1894,32 @@
 }
 .tablesvp-paginat .el-pagination {
   justify-content: flex-end;
+}
+
+.tablesvpd {
+  width: 100%;
+  height: var(--tablesvpd-height);
+  display: flex;
+  flex-direction: column;
+}
+.tablesvpd-main {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  width: 100%;
+}
+.tablesvpd-main.is-radio .el-table__header .el-table-column--selection .el-checkbox {
+  display: none;
+}
+.tablesvpd-main.is-scroll .v-scroll-add {
+  text-align: center;
+  padding: 10px;
+  color: #999;
+  background-color: #eee;
+}
+.tablesvpd-paginat {
+  overflow: hidden;
+}
+.tablesvpd-paginat .el-pagination {
+  justify-content: flex-end;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fangzhongya/fang-ui",
   "private": false,
-  "version": "0.1.34",
+  "version": "0.1.35",
   "type": "module",
   "description ": "fang-ui",
   "keywords": [
@@ -51,9 +51,9 @@
     "vue-tsc": "^3.1.4",
     "vxe-table": "4.6.20",
     "@fang-ui/components": "0.0.1-0",
+    "@fang-ui/hooks": "0.0.1-0",
     "@fang-ui/icons": "0.0.1-0",
     "@fang-ui/directives": "0.0.1-0",
-    "@fang-ui/hooks": "0.0.1-0",
     "@fang-ui/locale": "0.0.1-0",
     "@fang-ui/theme": "0.0.1-0",
     "@fang-ui/types": "0.0.1-0",