plain-design 0.0.89 → 0.0.93

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "plain-design",
-  "version": "0.0.89",
+  "version": "0.0.93",
   "description": "",
   "main": "dist/plain-design.min.js",
   "module": "dist/plain-design.commonjs.min.js",
@@ -21,7 +21,7 @@
   "author": "",
   "license": "ISC",
   "peerDependencies": {
-    "plain-design-composition": "0.0.105",
+    "plain-design-composition": "0.0.114",
     "react": "^17.0.1",
     "react-dom": "^17.0.1"
   },
@@ -65,7 +65,7 @@
     "fork-ts-checker-webpack-plugin": "^6.2.4",
     "mini-css-extract-plugin": "^1.6.2",
     "mockjs": "^1.1.0",
-    "plain-design-composition": "0.0.105",
+    "plain-design-composition": "^0.0.114",
     "postcss": "^8.2.13",
     "postcss-loader": "^4.2.0",
     "qs": "^6.10.1",

package/src/packages/PlCascadePanel/cascade-panel.scss

@@ -1,106 +1,107 @@
 @include theme {
-    .pl-cascade-panel {
-        display: inline-block;
-        height: 200px;
-        border: solid 1px $ibc;
-        border-radius: $popperRadius;
-        color: $itc;
-
-        & > .pl-list {
-            height: 100%;
-            overflow: hidden;
-            white-space: nowrap;
-        }
+  .pl-cascade-panel {
+    display: inline-block;
+    height: 200px;
+    border: solid 1px $ibc;
+    border-radius: $popperRadius;
+    color: $itc;
 
-        .pl-cascade-list {
-            width: 180px;
-            height: 100%;
-            padding: 6px 0;
-            font-size: 14px;
-            display: inline-block;
-            vertical-align: top;
-            overflow: hidden;
-            box-sizing: border-box;
-
-            &:not(:last-child) {
-                border-right: solid 1px $ibc;
-            }
+    & > .pl-list {
+      height: 100%;
+      overflow: hidden;
+      white-space: nowrap;
+    }
 
-            .pl-list {
-                overflow: hidden;
-            }
+    .pl-cascade-list {
+      width: 180px;
+      height: 100%;
+      padding: 6px 0;
+      font-size: 14px;
+      display: inline-block;
+      vertical-align: top;
+      overflow: hidden;
+      box-sizing: border-box;
 
-            .pl-cascade-item {
-                padding: 5px 0 5px 12px;
-                font-weight: 400;
-                font-size: 13px;
-                color: $itc;
-                background-color: white;
-                transition: all 300ms $transition;
-                cursor: pointer;
+      &:not(:last-child) {
+        border-right: solid 1px $ibc;
+      }
 
-                .pl-cascade-content {
-                    padding-right: 30px;
-                    position: relative;
+      .pl-list {
+        overflow: hidden;
+      }
 
-                    .pl-cascade-arrow {
-                        position: absolute;
-                        top: 0;
-                        bottom: 0;
-                        right: 0;
-                        width: 30px;
-                        display: flex;
-                        align-items: center;
-                        justify-content: center;
-                        color: $icc;
-                    }
-                }
+      .pl-cascade-item {
+        padding: 5px 0 5px 12px;
+        line-height: 22px;
+        font-weight: 400;
+        font-size: 13px;
+        color: $itc;
+        background-color: white;
+        transition: all 300ms $transition;
+        cursor: pointer;
 
-                &.pl-cascade-item-expand, &:hover {
-                    color: $ihc;
-                    background-color: $disabled;
-                }
+        .pl-cascade-content {
+          padding-right: 30px;
+          position: relative;
 
-                &.pl-cascade-item-active {
-                    color: $colorPrimary;
-                    background-color: rgba($colorPrimary, 0.1);
-                }
+          .pl-cascade-arrow {
+            position: absolute;
+            top: 0;
+            bottom: 0;
+            right: 0;
+            width: 30px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            color: $icc;
+          }
+        }
 
-                &.pl-cascade-empty {
-                    display: flex;
-                    flex-direction: column;
-                    align-items: center;
-                    justify-content: center;
+        &.pl-cascade-item-expand, &:hover {
+          color: $ihc;
+          background-color: $disabled;
+        }
 
-                    padding-left: 0;
-                    font-size: 12px;
-                    color: $disabledText;
-                    background-color: transparent;
-                    cursor: auto;
+        &.pl-cascade-item-active {
+          color: $colorPrimary;
+          background-color: rgba($colorPrimary, 0.1);
+        }
 
-                    .pl-icon {
-                        margin-bottom: 8px;
-                        font-size: 20px;
-                    }
-                }
+        &.pl-cascade-empty {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
 
-                &.pl-cascade-item-disabled {
-                    background-color: transparent;
-                    color: $disabledText;
-                    cursor: not-allowed;
-                }
-            }
+          padding-left: 0;
+          font-size: 12px;
+          color: $disabledText;
+          background-color: transparent;
+          cursor: auto;
 
-            &.pl-cascade-filter-list {
-                width: 360px;
-            }
+          .pl-icon {
+            margin-bottom: 8px;
+            font-size: 20px;
+          }
         }
 
-        .pl-loading-mask {
-            top: 1px;
-            bottom: 1px;
-            left: 1px;
-            right: 1px;
+        &.pl-cascade-item-disabled {
+          background-color: transparent;
+          color: $disabledText;
+          cursor: not-allowed;
         }
+      }
+
+      &.pl-cascade-filter-list {
+        width: 360px;
+      }
+    }
+
+    .pl-loading-mask {
+      top: 1px;
+      bottom: 1px;
+      left: 1px;
+      right: 1px;
     }
-}
+  }
+}

package/src/packages/PlDialog/dialog.scss

@@ -109,7 +109,7 @@
   /*@formatter:off*/
     &.pl-transition-dialog-enter {
         &:before {opacity: 0;}
-        .pl-dialog-body {transform: translateY(-5vh) scale(0.85);opacity: 0;}
+        .pl-dialog-body {transform: translateY(-10px);opacity: 0;}
     }
     &.pl-transition-dialog-enter-active {
         &:before {opacity: 1;}
@@ -121,10 +121,10 @@
     }
     &.pl-transition-dialog-exit-active {
         &:before {opacity: 0;}
-        .pl-dialog-body {transform: translateY(-5vh) scale(0.85);opacity: 0;}
+        .pl-dialog-body {transform: translateY(-10px);opacity: 0;}
     }
     &.pl-transition-dialog-enter-active, &.pl-transition-dialog-exit-active {
-        transition: opacity 300ms linear, transform 300ms $transition;
+        transition: opacity 150ms linear, transform 150ms $transition;
     }
     /*@formatter:on*/
 }
@@ -171,19 +171,19 @@
       /*@formatter:off*/
             &.pl-transition-dialog-#{$key}-enter {
                 &:before {opacity: 0;}
-                .pl-dialog-body {transform: $value;}
+                .pl-dialog-body {opacity: 0;transform: $value;}
             }
             &.pl-transition-dialog-#{$key}-enter-active {
                 &:before {opacity: 1;}
-                .pl-dialog-body {transform: translate3d(0, 0, 0);}
+                .pl-dialog-body {opacity: 1;transform: translate3d(0, 0, 0);}
             }
             &.pl-transition-dialog-#{$key}-exit {
                 &:before {opacity: 1;}
-                .pl-dialog-body {transform: translate3d(0, 0, 0);}
+                .pl-dialog-body {opacity: 1;transform: translate3d(0, 0, 0);}
             }
             &.pl-transition-dialog-#{$key}-exit-active {
                 &:before {opacity: 0;}
-                .pl-dialog-body {transform: $value;}
+                .pl-dialog-body {opacity: 0;transform: $value;}
             }
             &.pl-transition-dialog-#{$key}-enter-active, &.pl-transition-dialog-#{$key}-exit-active {
                 .pl-dialog-body {
@@ -193,4 +193,4 @@
             /*@formatter:on*/
     }
   }
-}
+}

package/src/packages/PlDialog/index.tsx

@@ -121,8 +121,8 @@ export const PlDialog = designComponent({
             let height = props.fullHeight ? `calc(100vh - ${(!!hasHead.value ? 45 : 0) + (hasFoot.value ? 50 : 0)}px)` : props.height
             let width = props.fullWidth ? '100vw' : props.width
 
-            let minHeight = props.minHeight !== undefined ? props.minHeight : height !== undefined ? null : '120px'
-            let minWidth = props.minWidth !== undefined ? props.minWidth : width !== undefined ? null : '500px'
+            let minHeight = props.minHeight !== undefined ? props.minHeight : height !== undefined ? null : '100px'
+            let minWidth = props.minWidth !== undefined ? props.minWidth : width !== undefined ? null : '400px'
             let maxHeight = props.maxHeight !== undefined ? props.maxHeight : height !== undefined ? null : '80vh'
             let maxWidth = props.maxWidth !== undefined ? props.maxWidth : width !== undefined ? null : '60vw'
 

package/src/packages/PlDropdown/dropdown.scss

@@ -55,7 +55,7 @@
     }
 
     .pl-dropdown-group-content {
-      padding: 4px 8px;
+      padding: 4px 0;
     }
 
     &.pl-dropdown-no-title:not(:last-child) {

package/src/packages/PlInput/input.scss

@@ -31,6 +31,7 @@
 
     .pl-input-custom-placeholder {
       color: $ipc;
+      margin-left: 6px;
     }
 
     input, textarea {

package/src/packages/PlSlider/slider.scss

@@ -52,6 +52,7 @@
               background-color: rgba(black, 0.8);
               color: white;
               padding: 3px 6px;
+              line-height: initial;
               position: absolute;
               left: 50%;
               transform: translateX(-50%);
@@ -172,4 +173,4 @@
       }
     }
   }
-}
+}

package/src/packages/createUseTableOption/use/use.methods.tsx

@@ -61,6 +61,14 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
                 requestConfig,
             }
         },
+        getChangeNode: (node: TableNode) => {
+            const {editRow, data} = node
+            const changeKey = Object.keys({...editRow, ...data}).find(key => editRow[key] !== data[key])
+            /*if (!!changeKey) {
+                console.log(editRow[changeKey], data[changeKey])
+            }*/
+            return !!changeKey ? node : null
+        },
     }
 
     const pageMethods = useAsyncMethods((() => {
@@ -381,6 +389,13 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
                             $$message.error(`第${index + 1}条记录校验不通过，${errors[0].label}:${errors[0].message}`)
                             return Promise.reject(validateResult)
                         }
+                        const changeNode = utils.getChangeNode(node)
+                        if (!changeNode) {
+                            // 没有改变任何字段
+                            node.closeEdit()
+                            await selectCurrent(node.editRow[config.keyField])
+                            return
+                        }
                         const saveRow = await saveUpdate(node.editRow)
                         node.saveEdit(saveRow)
                         node.closeEdit()
@@ -425,8 +440,13 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
                         $$message.error(`第${index + 1}条记录校验不通过，${errors[0].label}:${errors[0].message}`)
                         return Promise.reject(validateResults[0])
                     }
+                    const changeNodes = updateNodes.map(node => utils.getChangeNode(node)).filter(Boolean) as TableNode[]
+                    if (changeNodes.length === 0) {
+                        updateNodes.forEach(node => node.cancelEdit())
+                        return confirm.close.clear()
+                    }
                     let {request, requestConfig} = utils.getUrlConfig('batchUpdate')
-                    requestConfig.body = {rows: await Promise.all(deepcopy(updateNodes.map(node => node.editRow)).map(row => hooks.onBeforeSaveRow.exec(row)))}
+                    requestConfig.body = {rows: await Promise.all(deepcopy(changeNodes.map(node => node.editRow)).map(row => hooks.onBeforeSaveRow.exec(row)))}
                     requestConfig = await hooks.onBeforeUpdate.exec(requestConfig)
                     await request!(requestConfig)
                     confirm.close.clear()

package/src/packages/useContextmenu/contextmenu-service.scss

@@ -3,7 +3,7 @@
     position: fixed;
 
     .pl-contextmenu-service-body {
-      transition: all $transition 300ms;
+      transition: all $transition 150ms;
       transform-origin: top left;
       box-sizing: border-box;
       box-shadow: $boxshadow;

package/src/packages/useDialog/PlDialogService.tsx

@@ -197,9 +197,9 @@ export default createDefaultService({
                 const width = (() => {
                     if (!!option.dialogProps && option.dialogProps.width !== undefined) {return option.dialogProps.width}
                     if (option.editType === DialogServiceEditType.textarea) {
-                        return ((option.dialogProps || {}).width || '500px')
+                        return ((option.dialogProps || {}).width || '400px')
                     } else {
-                        return 500
+                        return 400
                     }
                 })()