vxe-table 3.8.21 → 3.8.22

package/lib/vxe-tooltip/style/style.css

@@ -2,6 +2,7 @@
 /*size*/
 /*icon*/
 /*color*/
+/*layout*/
 /*input/radio/checkbox*/
 /*popup*/
 /*table*/

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "3.8.21",
+  "version": "3.8.22",
   "description": "一个基于 vue 的 PC 端表单/表格组件，支持增删改查、虚拟树、列拖拽，懒加载、快捷菜单、数据校验、树形结构、打印导出、自定义模板、渲染器、JSON 配置式...",
   "scripts": {
     "update": "npm install --legacy-peer-deps",

package/packages/locale/lang/en-US.js

@@ -80,6 +80,7 @@ export default {
     },
     pager: {
       goto: 'Go to',
+      gotoTitle: 'Number',
       pagesize: '{0}/page',
       total: 'Total {0} record',
       pageClassifier: '',

package/packages/locale/lang/es-ES.js

@@ -80,6 +80,7 @@ export default {
     },
     pager: {
       goto: 'Ir a',
+      gotoTitle: 'Number',
       pagesize: '{0}/página',
       total: 'Total {0} registro',
       pageClassifier: '',

package/packages/locale/lang/ja-JP.js

@@ -80,6 +80,7 @@ export default {
     },
     pager: {
       goto: '移動',
+      gotoTitle: '页数',
       pagesize: '{0}件/ページ',
       total: '全 {0} 件',
       pageClassifier: 'ページ',

package/packages/locale/lang/pt-BR.js

@@ -80,6 +80,7 @@ export default {
     },
     pager: {
       goto: 'Ir para',
+      gotoTitle: 'Number',
       pagesize: '{0}/página',
       total: 'Total de {0} registros',
       pageClassifier: '',

package/packages/locale/lang/zh-CN.js

@@ -80,6 +80,7 @@ export default {
     },
     pager: {
       goto: '前往',
+      gotoTitle: '页数',
       pagesize: '{0}条/页',
       total: '共 {0} 条记录',
       pageClassifier: '页',

package/packages/locale/lang/zh-TC.js

@@ -80,6 +80,7 @@ export default {
     },
     pager: {
       goto: '前往',
+      gotoTitle: '页数',
       pagesize: '{0}項/頁',
       total: '共 {0} 項記錄',
       pageClassifier: '頁',

package/packages/pager/src/pager.js

@@ -298,17 +298,21 @@ export default {
         isFull ? h('span', {
           class: 'vxe-pager--goto-text'
         }, GlobalConfig.i18n('vxe.pager.goto')) : null,
-        h('input', {
+        h('vxe-input', {
           class: 'vxe-pager--goto',
-          domProps: {
-            value: this.inpCurrPage
-          },
-          attrs: {
-            type: 'text',
-            autocomplete: 'off'
+          props: {
+            value: this.inpCurrPage,
+            placeholder: GlobalConfig.i18n('vxe.pager.gotoTitle'),
+            align: 'center',
+            type: 'integer',
+            max: this.pageCount,
+            min: 1,
+            controls: false
           },
           on: {
-            input: this.jumpInputEvent,
+            modelValue: (val) => {
+              this.inpCurrPage = val
+            },
             keydown: this.jumpKeydownEvent,
             blur: this.triggerJumpEvent
           }
@@ -448,25 +452,24 @@ export default {
       this.$emit('update:pageSize', pageSize)
       this.$emit('page-change', { type: 'size', pageSize, currentPage })
     },
-    jumpInputEvent (evnt) {
-      this.inpCurrPage = evnt.target.value
-    },
-    jumpKeydownEvent (evnt) {
-      if (evnt.keyCode === 13) {
-        this.triggerJumpEvent(evnt)
-      } else if (evnt.keyCode === 38) {
-        evnt.preventDefault()
+    jumpKeydownEvent (params) {
+      const { $event } = params
+      if ($event.keyCode === 13) {
+        this.triggerJumpEvent(params)
+      } else if ($event.keyCode === 38) {
+        $event.preventDefault()
         this.nextPage()
-      } else if (evnt.keyCode === 40) {
-        evnt.preventDefault()
+      } else if ($event.keyCode === 40) {
+        $event.preventDefault()
         this.prevPage()
       }
     },
-    triggerJumpEvent (evnt) {
-      const value = XEUtils.toInteger(evnt.target.value)
+    triggerJumpEvent (params) {
+      const { $event } = params
+      const value = XEUtils.toInteger($event.target.value)
       const current = value <= 0 ? 1 : value >= this.pageCount ? this.pageCount : value
       const currPage = XEUtils.toValueString(current)
-      evnt.target.value = currPage
+      $event.target.value = currPage
       this.inpCurrPage = currPage
       this.jumpPage(current)
     }

package/packages/table/src/header.js

@@ -117,6 +117,7 @@ export default {
           }, cols.map((column, $columnIndex) => {
             const { type, showHeaderOverflow, headerAlign, align, headerClassName } = column
             // const { enabled } = tooltipOpts
+            const colid = column.id
             const isColGroup = column.children && column.children.length
             const fixedHiddenColumn = fixedType ? column.fixed !== fixedType && !isColGroup : column.fixed && overflowX
             const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
@@ -145,7 +146,7 @@ export default {
               thOns.mousedown = evnt => $xetable.triggerHeaderCellMousedownEvent(evnt, params)
             }
             return h('th', {
-              class: ['vxe-header--column', column.id, {
+              class: ['vxe-header--column', colid, {
                 [`col--${headAlign}`]: headAlign,
                 [`col--${type}`]: type,
                 'col--last': $columnIndex === cols.length - 1,
@@ -159,13 +160,13 @@ export default {
                 'col--current': currentColumn === column
               }, UtilTools.getClass(headerClassName, params), UtilTools.getClass(headerCellClassName, params)],
               attrs: {
-                colid: column.id,
+                colid,
                 colspan: column.colSpan > 1 ? column.colSpan : null,
                 rowspan: column.rowSpan > 1 ? column.rowSpan : null
               },
               style: headerCellStyle ? (XEUtils.isFunction(headerCellStyle) ? headerCellStyle(params) : headerCellStyle) : null,
               on: thOns,
-              key: columnKey || columnOpts.useKey || isColGroup ? column.id : $columnIndex
+              key: columnKey || columnOpts.useKey || isColGroup ? colid : $columnIndex
             }, [
               h('div', {
                 class: ['vxe-cell', {

package/styles/button.scss

@@ -262,6 +262,7 @@ $btnThemeList: (
 }
 .vxe-button--dropdown {
   position: relative;
+  outline: 0;
   &+.vxe-button-wrapper,
   &+.vxe-button.type--button,
   &+.vxe-button--dropdown {

package/styles/custom.scss

@@ -100,6 +100,7 @@
   flex-grow: 1;
   overflow-x: hidden;
   overflow-y: auto;
+  outline: 0;
 }
 
 .vxe-table-custom--header,
@@ -221,6 +222,7 @@
 .vxe-table-custom-popup--body {
   overflow: auto;
   height: 100%;
+  outline: 0;
 }
 
 .vxe-table-custom-popup--table-wrapper {

package/styles/grid.scss

@@ -42,6 +42,7 @@
   .vxe-grid--right-wrapper {
     flex-shrink: 0;
     overflow: auto;
+    outline: 0;
   }
   .vxe-grid--table-wrapper {
     flex-grow: 1;

package/styles/input.scss

@@ -86,10 +86,10 @@ $iconWidth: 1.6em;
   top: 1px;
   right: 0.5em;
   height: calc(100% - 2px);
-  color: var($vxe-input-count-color);
-  background-color: var($vxe-input-count-background-color);
+  color: $vxe-input-count-color;
+  background-color: $vxe-input-count-background-color;
   &.is--error {
-    color: var($vxe-input-count-error-color);
+    color: $vxe-input-count-error-color;
   }
 }
 

package/styles/modal.scss

@@ -12,6 +12,7 @@
   color: $vxe-font-color;
   font-family: $vxe-font-family;
   transition: top .4s ease-in-out;
+  outline: 0;
   &.is--active {
     display: block;
   }
@@ -166,6 +167,7 @@
     text-align: left;
     pointer-events: auto;
     opacity: 0;
+    outline: 0;
     &.is--drag {
       cursor: move;
      .vxe-modal--body,
@@ -231,6 +233,7 @@
   .vxe-modal--body {
     display: flex;
     flex-grow: 1;
+    outline: 0;
   }
   .vxe-modal--header {
     display: flex;

package/styles/old-icon.scss

@@ -92,7 +92,7 @@
     border-width: 0.1em;
     border-style: solid;
     border-color: inherit;
-    background-color: var(--vxe-ui-layout-background-color);
+    background-color: $vxe-layout-background-color;
   }
 }
 

package/styles/pager.scss

@@ -152,11 +152,6 @@
     line-height: 2em;
     display: inline-block;
   }
-  .vxe-pager--jump .vxe-pager--goto,
-  .vxe-pager--sizes > .vxe-input {
-    height: 2.15em;
-    line-height: 2.15em;
-  }
   .vxe-pager--sizes > .vxe-select--panel .vxe-select-option {
     text-align: center;
   }
@@ -244,18 +239,6 @@
       }
     }
   }
-  .vxe-pager--jump .vxe-pager--goto {
-    border-radius: $vxe-border-radius;
-    border: 1px solid $vxe-input-border-color;
-    color: $vxe-font-color;
-    transition: border .2s ease-in-out;
-    padding: 0 0.4em;
-    background-color: $vxe-input-background-color;
-    &:focus {
-      border: 1px solid $vxe-primary-color;
-      outline: 0;
-    }
-  }
   .vxe-pager--jump {
     .vxe-pager--goto-text {
       margin-right: 0.25em;
@@ -264,8 +247,7 @@
       margin-left: 0.25em;
     }
     .vxe-pager--goto {
-      width: 3.2em;
-      text-align: center;
+      width: 4em;
     }
   }
 }

package/styles/pulldown.scss

@@ -16,6 +16,7 @@
   padding: 4px 0;
   color: $vxe-font-color;
   text-align: left;
+  outline: 0;
   &:not(.is--transfer) {
     min-width: 100%;
   }
@@ -39,7 +40,7 @@
   }
 }
 .vxe-pulldown--panel-wrapper {
-  background-color: var(--vxe-pulldown-panel-background-color);
+  background-color: $vxe-pulldown-panel-background-color;
 }
 
 .vxe-pulldown,

package/styles/select.scss

@@ -110,6 +110,7 @@
   position: relative;
   overflow-x: hidden;
   overflow-y: auto;
+  outline: 0;
   padding: 4px 0;
   max-height: 200px;
 }

package/styles/table.scss

@@ -44,6 +44,7 @@
 .vxe-table--fixed-right-body-wrapper {
   overflow-y: auto;
   overflow-x: auto;
+  outline: 0;
 }
 
 /*默认的渲染*/
@@ -51,7 +52,7 @@
 .vxe-table--filter-template {
   .vxe-default-input,
   .vxe-default-textarea {
-    background-color: var(--vxe-ui-layout-background-color);
+    background-color: $vxe-layout-background-color;
   }
   .vxe-default-input,
   .vxe-default-textarea,
@@ -59,21 +60,21 @@
     outline: 0;
     padding: 0 2px;
     width: 100%;
-    color: var(--vxe-ui-font-color);
-    border-radius: var(--vxe-ui-border-radius);
-    border: 1px solid var(--vxe-ui-input-border-color);
+    color: $vxe-font-color;
+    border-radius: $vxe-border-radius;
+    border: 1px solid $vxe-input-border-color;
     &:focus {
-      border: 1px solid var(--vxe-ui-font-primary-color);
+      border: 1px solid $vxe-primary-color;
     }
     &[disabled] {
       cursor: not-allowed;
-      background-color: var(--vxe-ui-input-disabled-background-color);
+      background-color: $vxe-input-disabled-background-color;
     }
   }
   .vxe-default-input,
   .vxe-default-textarea,
   .vxe-default-select {
-    height: var(--vxe-ui-input-height-default);
+    height: $vxe-input-height-default;
   }
   .vxe-default-input {
     &[type="date"]::-webkit-inner-spin-button {
@@ -84,7 +85,7 @@
       height: 24px;
     }
     &::placeholder {
-      color: var(--vxe-ui-input-placeholder-color);
+      color: $vxe-input-placeholder-color;
     }
   }
   .vxe-default-textarea {
@@ -900,6 +901,7 @@
     overflow: hidden;
     background-color: inherit;
     transition: 0.3s box-shadow;
+    outline: 0;
     .vxe-table--body-wrapper {
       overflow-x: hidden;
     }
@@ -940,6 +942,7 @@
     &.fixed-right--wrapper {
       position: absolute;
       top: 0;
+      outline: 0;
     }
     &.fixed-left--wrapper {
       left: 0;
@@ -1099,6 +1102,7 @@
     z-index: 1;
     &.is--ellipsis {
       overflow: auto;
+      outline: 0;
     }
   }
 
@@ -1205,6 +1209,7 @@
     overflow: hidden;
     width: 100%;
     pointer-events: none;
+    outline: 0;
   }
   .vxe-table--empty-block {
     display: none;
@@ -1452,6 +1457,7 @@
   margin-top: -1px;
   &.body--wrapper{
     overflow-x: auto;
+    outline: 0;
   }
 }
 

package/styles/variable.scss

@@ -20,6 +20,9 @@ $vxe-info-color: #909399 !default;
 $vxe-warning-color: #e6a23c !default;
 $vxe-danger-color: #f56c6c !default;
 
+/*layout*/
+$vxe-layout-background-color: #fff !default;
+
 $vxe-font-lighten-color: lighten($vxe-font-color, 10%) !default;
 $vxe-primary-lighten-color: lighten($vxe-primary-color, 10%) !default;
 $vxe-success-lighten-color: lighten($vxe-success-color, 10%) !default;
@@ -102,6 +105,7 @@ $vxe-table-cell-dirty-update-color: #f56c6c !default;
 $vxe-table-cell-dirty-insert-color: #19A15F !default;
 $vxe-table-cell-area-border-color: $vxe-primary-color !default;
 $vxe-table-cell-area-border-width: 1px !default;
+$vxe-table-cell-area-status-border-width: $vxe-table-cell-area-border-width !default;
 $vxe-table-cell-main-area-extension-border-color: #fff;
 $vxe-table-cell-main-area-extension-background-color: $vxe-primary-color !default;
 $vxe-table-cell-extend-area-border-width: 2px !default;