next-element-vue 0.3.1 → 0.3.2

package/dist/index.css

@@ -6,10 +6,10 @@
 .next-container{box-sizing:border-box;height:100%;width:100%}.next-container .next-container-card,.next-container>.el-scrollbar__wrap>.el-scrollbar__view{box-sizing:border-box;height:100%;padding:var(--next-container-padding,20px)}.next-container .next-container-card{background-color:var(--next-main-bg-color,#fff);border-radius:12px;box-shadow:0 0 27px rgba(0,0,0,.05);transition:all .3s}
 .next-dialog{border-radius:6px;padding:unset;transition:all .3s ease-out}.next-dialog .el-dialog__header{align-items:center;background-color:var(--el-color-primary-light-9);border-bottom:1px solid var(--el-color-primary-light-8);border-radius:6px 6px 0 0;display:flex;justify-content:space-between;margin-right:unset;padding:var(--el-dialog-padding-primary)}.next-dialog .el-dialog__header .el-dialog__title{color:#303133;font-size:16px;font-weight:400}.next-dialog .el-dialog__header .next-dialog-header{align-items:center;display:flex;justify-content:space-between;width:100%}.next-dialog .el-dialog__header .next-dialog__header-right{align-items:center;display:flex;height:var(--el-dialog-font-line-height)}.next-dialog .el-dialog__header .next-dialog__header-right .icon-fullscreen{font-size:18px;margin-top:2px}.next-dialog .el-dialog__header .next-dialog__header-right .el-icon{color:#909399;cursor:pointer}.next-dialog .el-dialog__header .next-dialog__header-right .el-icon:hover{color:var(--el-color-primary)}.next-dialog .el-dialog__header .next-dialog__header-right .icon-close{align-items:center;display:flex;margin-left:10px}.next-dialog .el-dialog__header .next-dialog__header-right .icon-close .el-icon{transition:all .3s}.next-dialog .el-dialog__header .next-dialog__header-right .icon-close:hover .el-icon{transform:rotate(90deg)}.next-dialog .el-dialog__body{min-height:60px;padding:10px 20px}.next-dialog .el-dialog__footer{padding:unset}.next-dialog .next-dialog-footer__zoom{bottom:-10px;cursor:se-resize;height:20px;position:absolute;right:-10px;width:20px}.next-dialog.is-fullscreen{border-radius:3px;overflow-y:hidden}.next-dialog.is-fullscreen .el-dialog__body{box-sizing:border-box;height:calc(100% - 55px);overflow-y:auto}.next-dialog.is-fullscreen .el-dialog__body::-webkit-scrollbar{background-color:#f5f5f5;height:6px;width:6px}.next-dialog.is-fullscreen .el-dialog__body::-webkit-scrollbar-thumb{background-color:#ccc;border-radius:3px}.next-dialog.is-fullscreen .el-dialog__body::-webkit-scrollbar-thumb:hover{background-color:#aaa}.next-dialog.is-fullscreen .el-dialog__body::-webkit-scrollbar-thumb:inactive{background-color:#eee}
 .next-form .next-form__input-table .el-input__wrapper,.next-form .next-form__input-table .next-form__input-table--placeholder,.next-form .next-form__input-table .next-form__input-table--value,.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.next-form{padding:10px 0}.next-form .el-form-item .el-form-item__label{align-items:center;text-align:right;width:var(--form-label-width)}.next-form .el-form-item .el-form-item__label .next-form__item-label{box-sizing:border-box;max-width:100%;width:auto}.next-form .el-form-item .el-form-item__content>.el-checkbox-group,.next-form .el-form-item .el-form-item__content>.el-input,.next-form .el-form-item .el-form-item__content>.el-select{width:100%}.next-form .next-form__number-range{align-items:center;display:flex;justify-content:space-evenly;width:100%}.next-form .next-form__number-range .el-input-number{flex:1 1 auto}.next-form .next-form__number-range .el-input-number .el-input-number__decrease,.next-form .next-form__number-range .el-input-number .el-input-number__increase{width:24px}.next-form .next-form__number-range .el-input-number .el-input__wrapper{padding-left:26px;padding-right:26px}.next-form .next-form__number-range .next-form__number-range--division{color:#606266;font-size:12px;padding:0 10px}.next-form .next-form__input-table{height:calc(var(--el-input-height, 32px))}.next-form .next-form__input-table .el-input__wrapper{border-bottom-right-radius:0;border-top-right-radius:0;justify-content:flex-start}.next-form .next-form__input-table .el-input__wrapper:hover{box-shadow:0 0 0 1px var(--el-input-focus-border-color) inset}.next-form .next-form__input-table .next-form__input-table--value{align-items:center;color:var(--el-input-text-color,var(--el-text-color-regular));display:flex;width:100%}.next-form .next-form__input-table .next-form__input-table--value>.el-tag{margin-right:6px}.next-form .next-form__input-table .next-form__input-table--value>.el-tag:last-child{margin-right:unset}.next-form .next-form__input-table .next-form__input-table--placeholder{color:var(--el-text-color-placeholder)}.next-form .next-form__input-table .next-form__input-table--append{border-bottom-left-radius:0;border-top-left-radius:0}.next-form .next-form__input-table.is-disabled,.next-form .next-form__input-table.is-disabled .el-input__wrapper{cursor:not-allowed}.next-form .next-form__input-table.is-disabled .el-input__wrapper:hover{box-shadow:none}.next-form .next-form__preview-image{margin-right:6px}.next-form .next-form__preview-image:last-child{margin-right:unset}.next-form .next-form__footer{padding:10px 0;text-align:center}.next-form__input-table--content{height:500px}.next-form__input-table--content .el-radio-group{height:100%;width:100%}.next-form__input-table--content .el-radio-group .el-radio .el-radio__label{display:none}.next-form__input-table--content .el-radio-group .next-crud-table .el-input__wrapper{box-shadow:0 0 0 1px var(--el-input-border-color,var(--el-border-color)) inset}.next-form__tooltip-tags>.el-tag{margin:0 3px}.next-form__input-table--footer{bottom:-10px;padding:0 0 10px;position:sticky;text-align:right}.next-dialog.is-fullscreen .el-dialog__body .next-form__input-table--content{height:calc(100% - 50px)}
-.next-crud-table-header-search-expandBtn>span,.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.next-crud-table{height:100%;transition:all .3s;width:inherit}.next-crud-table-header-search-item .el-form-item{box-sizing:border-box;margin-bottom:18px;margin-right:10px;width:100%}.next-crud-table-header-search-item .el-form-item .el-date-editor--datetimerange,.next-crud-table-header-search-item .el-form-item .el-input,.next-crud-table-header-search-item .el-form-item .el-select{width:100%}.next-crud-table-header-search-item .el-form-item .el-date-editor--datetimerange .el-range-separator,.next-crud-table-header-search-item .el-form-item .el-input .el-range-separator,.next-crud-table-header-search-item .el-form-item .el-select .el-range-separator{font-size:12px}.next-crud-table-header-search-item input::-webkit-inner-spin-button,.next-crud-table-header-search-item input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.next-crud-table-header-search-item input[type=number]{-moz-appearance:textfield}.next-crud-table-header-search-item-number-range{align-items:center;display:flex;justify-content:space-evenly;width:100%}.next-crud-table-header-search-item-number-range .el-input-number{flex:1 1 auto}.next-crud-table-header-search-item-number-range .el-input-number .el-input-number__decrease,.next-crud-table-header-search-item-number-range .el-input-number .el-input-number__increase{width:24px}.next-crud-table-header-search-item-number-range .el-input-number .el-input__wrapper{padding-left:26px;padding-right:26px}.next-crud-table-header-search-item-number-range .number-range-division{color:#606266;font-size:12px;padding:0 10px}.next-crud-table-header-search-btns .el-form-item__content{flex-wrap:nowrap}.next-crud-table-header-search-expandBtn .el-icon{transform:rotate(90deg)}.next-crud-table-header-search-expandBtn>span{display:inline-block;max-width:70px}.next-crud-table-header-menu{align-items:center;display:flex;justify-content:space-between;padding-bottom:10px}.next-crud-table-content{flex:1 1}.next-crud-table-content .el-table{transition:all .3s}.next-crud-table-content .operations-btn.el-button span{margin-left:unset}.next-crud-table-content .el-table__header-wrapper .el-table__header thead tr th{background-color:var(--el-color-primary-light-8)}.next-crud-table-content .el-table__header-wrapper .el-table__header thead tr th .cell{align-items:center;display:flex;white-space:nowrap}.next-crud-table-content .el-table__header-wrapper .el-table__header thead tr th.is-center .cell{justify-content:center}.next-crud-table-content .el-table__body-wrapper .el-table__body tr.hover-row td.el-table__cell{background-color:var(--el-color-primary-light-9)}.next-crud-table-content .el-scrollbar__bar.is-horizontal{height:8px}.next-crud-table-content .el-table-fixed-column--right .el-button+.el-button.is-text{margin-left:unset}.next-crud-table-content .el-empty{padding:unset}.next-crud-table-content .el-empty .el-empty__description{margin-top:unset}.next-crud-table-footer .el-pagination{display:flex;justify-content:center;padding:10px 0}.next-crud-table-setting-drawer .el-drawer__header{border-bottom:1px solid #dcdfe6;margin-bottom:0;padding-bottom:22px}.next-crud-table-setting-drawer .el-drawer__body{padding:0}.next-crud-table-setting-drawer__container{padding:10px 20px}
+.next-crud-table-header-search-expandBtn>span,.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.next-crud-table{height:100%;transition:all .3s;width:inherit}.next-crud-table-header-search-item .el-form-item{box-sizing:border-box;margin-bottom:18px;margin-right:10px;width:100%}.next-crud-table-header-search-item .el-form-item .el-date-editor--datetimerange,.next-crud-table-header-search-item .el-form-item .el-input,.next-crud-table-header-search-item .el-form-item .el-select{width:100%}.next-crud-table-header-search-item .el-form-item .el-date-editor--datetimerange .el-range-separator,.next-crud-table-header-search-item .el-form-item .el-input .el-range-separator,.next-crud-table-header-search-item .el-form-item .el-select .el-range-separator{font-size:12px}.next-crud-table-header-search-item input::-webkit-inner-spin-button,.next-crud-table-header-search-item input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.next-crud-table-header-search-item input[type=number]{-moz-appearance:textfield}.next-crud-table-header-search-item-number-range{align-items:center;display:flex;justify-content:space-evenly;width:100%}.next-crud-table-header-search-item-number-range .el-input-number{flex:1 1 auto}.next-crud-table-header-search-item-number-range .el-input-number .el-input-number__decrease,.next-crud-table-header-search-item-number-range .el-input-number .el-input-number__increase{width:24px}.next-crud-table-header-search-item-number-range .el-input-number .el-input__wrapper{padding-left:26px;padding-right:26px}.next-crud-table-header-search-item-number-range .number-range-division{color:#606266;font-size:12px;padding:0 10px}.next-crud-table-header-search-btns .el-form-item__content{flex-wrap:nowrap}.next-crud-table-header-search-expandBtn .el-icon{transform:rotate(90deg)}.next-crud-table-header-search-expandBtn>span{display:inline-block;max-width:70px}.next-crud-table-header-menu{align-items:center;display:flex;justify-content:space-between;padding-bottom:10px}.next-crud-table-content{flex:1 1}.next-crud-table-content .el-table{transition:all .3s}.next-crud-table-content .operations-btn.el-button span{margin-left:unset}.next-crud-table-content .el-table__header-wrapper .el-table__header thead tr th{background-color:var(--el-color-primary-light-8)}.next-crud-table-content .el-table__header-wrapper .el-table__header thead tr th .cell{align-items:center;display:flex;white-space:nowrap}.next-crud-table-content .el-table__header-wrapper .el-table__header thead tr th.is-center .cell{justify-content:center}.next-crud-table-content .el-table__body-wrapper .el-table__body tr.el-table__row td.el-table__cell em.cell-unit{color:#909399;font-size:12px;padding-left:2px}.next-crud-table-content .el-table__body-wrapper .el-table__body tr.hover-row td.el-table__cell{background-color:var(--el-color-primary-light-9)}.next-crud-table-content .el-scrollbar__bar.is-horizontal{height:8px}.next-crud-table-content .el-table-fixed-column--right .el-button+.el-button.is-text{margin-left:unset}.next-crud-table-content .el-empty{padding:unset}.next-crud-table-content .el-empty .el-empty__description{margin-top:unset}.next-crud-table-footer .el-pagination{display:flex;justify-content:center;padding:10px 0}.next-crud-table-setting-drawer .el-drawer__header{border-bottom:1px solid #dcdfe6;margin-bottom:0;padding-bottom:22px}.next-crud-table-setting-drawer .el-drawer__body{padding:0}.next-crud-table-setting-drawer__container{padding:10px 20px}
 .text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.next-crud-table-virtualized{height:100%;transition:all .3s;width:inherit}
 .next-spin-loading{position:relative}.next-spin-loading-mask{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);height:100%;inset-inline-start:0;left:0;position:absolute;top:0;transition:opacity .3s;width:100%;z-index:4}.next-spin-loading-mask-dot{animation:antRotate 1.2s linear infinite;inset-inline-start:50%;position:absolute;top:50%;transform:rotate(45deg)}.next-spin-loading-mask__text{color:var(--el-color-primary);font-size:14px;left:0;padding-top:15px;position:absolute;text-align:center;text-shadow:0 1px 2px #fff;top:50%;width:100%}.next-spin-loading-mask__dot-item{animation:antSpinMove 1s linear infinite alternate;background-color:var(--el-color-primary);border-radius:100%;display:block;height:12px;opacity:.3;position:absolute;transform:scale(.75);transform-origin:50% 50%;width:12px}.next-spin-loading-mask__dot-item:first-child{inset-inline-start:0;top:0}.next-spin-loading-mask__dot-item:nth-child(2){animation-delay:.4s;inset-inline-end:0;top:0}.next-spin-loading-mask__dot-item:nth-child(3){animation-delay:.8s;bottom:0;inset-inline-end:0}.next-spin-loading-mask__dot-item:nth-child(4){animation-delay:1.2s;bottom:0;inset-inline-start:0}@keyframes antRotate{to{transform:rotate(405deg)}}@keyframes antSpinMove{to{opacity:1}}
 .next-upload .el-upload-list__item-thumbnail{-o-object-fit:cover;object-fit:cover}
 .next-video-player{border-radius:5px;height:100%;min-height:200px;overflow:hidden;position:relative;width:100%}.next-video-player .vjs-default-skin{height:100%!important;left:0;min-height:200px;padding:unset!important;position:absolute;top:0;width:100%}.next-video-player .screemshot-btn{align-items:center;background-color:rgba(0,0,0,.6);border-radius:50%;cursor:pointer;display:inline-flex;height:45px;justify-content:center;opacity:0;position:absolute;right:10px;top:50%;transform:translateY(-50%);transition:all .5s ease-in-out;width:45px}.next-video-player .screemshot-btn i{transition:all .3s ease-in-out}.next-video-player .screemshot-btn:hover i{transform:scale(1.1)}.next-video-player:hover .screemshot-btn{opacity:1}.next-video-player-recongition{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:99}
 .next-drag-resize{position:relative}
-.next-labelimg-loading .next-spin-loading-mask__text{text-shadow:unset}.next-labelimg-fullscreen{background-color:#fff;bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;transition:all .3s;z-index:999}.next-labelimg{border:1px solid #eee;border-radius:3px;box-sizing:border-box;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.next-labelimg-header{box-shadow:0 0 4px 0 rgba(0,0,0,.15);font-size:12px;justify-content:space-between;padding:10px 12px}.next-labelimg-header,.next-labelimg-header__tool,.next-labelimg-header__tool>li{align-items:center;display:flex}.next-labelimg-header__tool>li{cursor:pointer;margin:0 6px}.next-labelimg-header__tool>li:hover{color:var(--el-color-primary)}.next-labelimg-header__tool>li:hover svg{fill:var(--el-color-primary)}.next-labelimg-main{align-items:center;display:flex;justify-content:space-between}.next-labelimg-main__content{align-items:center;display:flex;flex:1 1 100%;justify-content:center}.next-labelimg-main .next-labelimg-loading{align-items:center;display:flex;justify-content:center;width:100%}.next-labelimg-main .next-labelimg-canvas{height:100%;min-height:500px;position:relative;width:100%}.next-labelimg-main .next-labelimg-canvas__context{height:100%;position:absolute;width:100%;z-index:3}.next-labelimg-main .next-labelimg-canvas__rect{height:100%;position:absolute;width:100%;z-index:1}.next-labelimg-main .next-labelimg-right{box-sizing:border-box;flex:0 0 200px;height:inherit;padding:10px;text-align:left}.next-labelimg-main .next-labelimg-right>ul{border-radius:5px;box-shadow:0 0 4px 0 rgba(0,0,0,.15);box-sizing:border-box;height:100%;padding:10px}.next-labelimg-main .next-labelimg-right>ul li{align-items:center;border:1px solid #ddd;border-radius:3px;display:flex;font-size:12px;justify-content:space-between;line-height:20px;margin:5px 0;padding:3px 6px}.next-labelimg-main .next-labelimg-right>ul li .el-icon{cursor:pointer}.next-labelimg-main .next-labelimg-right>ul li:hover{border:1px solid var(--el-color-primary)}.next-labelimg-main .next-labelimg-right>ul li .label-line{border-radius:3px;display:inline-block;height:10px;margin-right:6px;width:3px}.next-labelimg-footer{align-items:center;display:flex;justify-content:space-between;padding:20px 12px 8px}.next-labelimg-footer .left-right,.next-labelimg-footer .next-labelimg-footer__left,.next-labelimg-footer .next-labelimg-footer__right{align-items:center;display:flex;flex:0 0 50px;justify-content:center}.next-labelimg-footer .left-right .el-icon:hover,.next-labelimg-footer .next-labelimg-footer__left .el-icon:hover,.next-labelimg-footer .next-labelimg-footer__right .el-icon:hover{cursor:pointer}.next-labelimg-footer__center{flex:1 1 auto}.next-labelimg-footer__center--list{align-items:center;display:flex;flex-wrap:nowrap;justify-content:flex-start}.next-labelimg-footer__center--list>li{background-color:#fff;border:1px solid #eee;box-sizing:border-box;cursor:pointer;flex:0 0 100px;height:80px;margin:0 5px;overflow:hidden;text-align:center}.next-labelimg-footer__center--list>li.is-activate,.next-labelimg-footer__center--list>li:hover{border:1px solid var(--el-color-primary)}.next-labelimg .next-labelimg-contextmenu-label{background-color:#fff;border-radius:8px;box-shadow:0 0 50px 3px #ccc;padding:10px 15px;position:fixed;transition:all .3s;white-space:nowrap;z-index:9999}.next-labelimg .next-labelimg-contextmenu-label>.label-head{align-items:center;display:flex;font-size:14px;justify-content:space-between;padding-bottom:10px}.next-labelimg .next-labelimg-contextmenu-label>.label-head .el-icon{transition:all .3s}.next-labelimg .next-labelimg-contextmenu-label>.label-head .el-icon:hover{cursor:pointer;transform:rotate(90deg)}.next-labelimg .next-labelimg-contextmenu-label>.label-main{scrollbar-face-color:transparent;scrollbar-3dlight-color:#aaa;scrollbar-highlight-color:#aaa;scrollbar-shadow-color:#aaa;scrollbar-base-color:#aaa;scrollbar-track-color:transparent;scrollbar-arrow-color:transparent;max-height:300px;overflow-y:auto}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar{background-color:transparent;border-radius:6px;height:10px;max-width:6px;width:6px}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-thumb{background-color:hsla(0,0%,67%,.2);border-radius:6px}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-thumb:hover{background-color:#aaa}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-thumb:inactive{background-color:#eee}.next-labelimg .next-labelimg-contextmenu-label>.label-main:hover::-webkit-scrollbar-thumb{background-color:hsla(0,0%,67%,.5)}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-track-piece{background-color:transparent;border-radius:6px}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-resizer,.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-corner{background-color:transparent}.next-labelimg .next-labelimg-contextmenu-label>.label-main>li{align-items:center;display:flex;font-size:12px;padding:3px 0}.next-labelimg .next-labelimg-contextmenu-label>.label-main>li .label-line{border-radius:3px;display:inline-block;height:10px;margin-right:6px;width:3px}.next-labelimg .next-labelimg-contextmenu-label>.label-main>li.activate-label{color:var(--el-color-primary)}.next-labelimg .next-labelimg-draggable-rect{background-color:hsla(0,0%,99%,.5);cursor:move;position:absolute;z-index:999}.next-labelimg .next-labelimg-draggable-rect__resize{height:100%;position:relative;width:100%}.next-labelimg .next-labelimg-draggable-rect__resize .bottom-center,.next-labelimg .next-labelimg-draggable-rect__resize .bottom-left,.next-labelimg .next-labelimg-draggable-rect__resize .bottom-right,.next-labelimg .next-labelimg-draggable-rect__resize .dot,.next-labelimg .next-labelimg-draggable-rect__resize .left-center,.next-labelimg .next-labelimg-draggable-rect__resize .right-center,.next-labelimg .next-labelimg-draggable-rect__resize .top-center,.next-labelimg .next-labelimg-draggable-rect__resize .top-left,.next-labelimg .next-labelimg-draggable-rect__resize .top-right{background-color:var(--el-color-primary);border:1px solid var(--el-color-primary);box-sizing:border-box;height:10px;position:absolute;width:10px}.next-labelimg .next-labelimg-draggable-rect__resize .top-left{cursor:nw-resize;left:-5px;top:-5px}.next-labelimg .next-labelimg-draggable-rect__resize .top-center{cursor:s-resize;left:50%;top:-5px;transform:translateX(-50%)}.next-labelimg .next-labelimg-draggable-rect__resize .top-right{cursor:sw-resize;right:-5px;top:-5px}.next-labelimg .next-labelimg-draggable-rect__resize .left-center{cursor:w-resize;left:-5px;top:50%;transform:translateY(-50%)}.next-labelimg .next-labelimg-draggable-rect__resize .right-center{cursor:w-resize;right:-5px;top:50%;transform:translateY(-50%)}.next-labelimg .next-labelimg-draggable-rect__resize .bottom-left{bottom:-5px;cursor:sw-resize;left:-5px}.next-labelimg .next-labelimg-draggable-rect__resize .bottom-center{bottom:-5px;cursor:s-resize;left:50%;transform:translateX(-50%)}.next-labelimg .next-labelimg-draggable-rect__resize .bottom-right{bottom:-5px;cursor:nw-resize;right:-5px}.next-labelimg-preview{display:inline-block;height:100%}
+.next-labelimg-loading .next-spin-loading-mask__text{text-shadow:unset}.next-labelimg-fullscreen{background-color:#fff;bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;transition:all .3s;z-index:999}.next-labelimg{border:1px solid #eee;border-radius:3px;box-sizing:border-box;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.next-labelimg-header{box-shadow:0 0 4px 0 rgba(0,0,0,.15);font-size:12px;justify-content:space-between;padding:10px 12px}.next-labelimg-header,.next-labelimg-header__tool,.next-labelimg-header__tool>li{align-items:center;display:flex}.next-labelimg-header__tool>li{cursor:pointer;margin:0 6px}.next-labelimg-header__tool>li.hover:hover{color:var(--el-color-primary)}.next-labelimg-header__tool>li.hover:hover svg{fill:var(--el-color-primary)}.next-labelimg-main{align-items:center;display:flex;justify-content:space-between}.next-labelimg-main__content{align-items:center;display:flex;flex:1 1 100%;justify-content:center}.next-labelimg-main .next-labelimg-loading{align-items:center;display:flex;justify-content:center;width:100%}.next-labelimg-main .next-labelimg-canvas{height:100%;min-height:500px;position:relative;width:100%}.next-labelimg-main .next-labelimg-canvas__context{height:100%;position:absolute;width:100%;z-index:3}.next-labelimg-main .next-labelimg-canvas__rect{height:100%;position:absolute;width:100%;z-index:1}.next-labelimg-main .next-labelimg-right{box-sizing:border-box;flex:0 0 200px;height:inherit;padding:10px;text-align:left}.next-labelimg-main .next-labelimg-right>ul{border-radius:5px;box-shadow:0 0 4px 0 rgba(0,0,0,.15);box-sizing:border-box;height:100%;padding:10px}.next-labelimg-main .next-labelimg-right>ul li{align-items:center;border:1px solid #ddd;border-radius:3px;display:flex;font-size:12px;justify-content:space-between;line-height:20px;margin:5px 0;padding:3px 6px}.next-labelimg-main .next-labelimg-right>ul li .el-icon{cursor:pointer}.next-labelimg-main .next-labelimg-right>ul li:hover{border:1px solid var(--el-color-primary)}.next-labelimg-main .next-labelimg-right>ul li .label-line{border-radius:3px;display:inline-block;height:10px;margin-right:6px;width:3px}.next-labelimg-footer{align-items:center;display:flex;justify-content:space-between;padding:20px 12px 8px}.next-labelimg-footer .left-right,.next-labelimg-footer .next-labelimg-footer__left,.next-labelimg-footer .next-labelimg-footer__right{align-items:center;display:flex;flex:0 0 50px;justify-content:center}.next-labelimg-footer .left-right .el-icon:hover,.next-labelimg-footer .next-labelimg-footer__left .el-icon:hover,.next-labelimg-footer .next-labelimg-footer__right .el-icon:hover{cursor:pointer}.next-labelimg-footer__center{flex:1 1 auto}.next-labelimg-footer__center--list{align-items:center;display:flex;flex-wrap:nowrap;justify-content:flex-start;min-height:80px}.next-labelimg-footer__center--list>li{background-color:#fff;border:1px solid #eee;box-sizing:border-box;cursor:pointer;flex:0 0 100px;height:80px;margin:0 5px;overflow:hidden;text-align:center}.next-labelimg-footer__center--list>li.is-activate,.next-labelimg-footer__center--list>li:hover{border:1px solid var(--el-color-primary)}.next-labelimg .next-labelimg-contextmenu-label{background-color:#fff;border-radius:8px;box-shadow:0 0 50px 3px #ccc;padding:10px 15px;position:fixed;transition:all .3s;white-space:nowrap;z-index:9999}.next-labelimg .next-labelimg-contextmenu-label>.label-head{align-items:center;display:flex;font-size:14px;justify-content:space-between;padding-bottom:10px}.next-labelimg .next-labelimg-contextmenu-label>.label-head .el-icon{transition:all .3s}.next-labelimg .next-labelimg-contextmenu-label>.label-head .el-icon:hover{cursor:pointer;transform:rotate(90deg)}.next-labelimg .next-labelimg-contextmenu-label>.label-main{scrollbar-face-color:transparent;scrollbar-3dlight-color:#aaa;scrollbar-highlight-color:#aaa;scrollbar-shadow-color:#aaa;scrollbar-base-color:#aaa;scrollbar-track-color:transparent;scrollbar-arrow-color:transparent;max-height:300px;overflow-y:auto}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar{background-color:transparent;border-radius:6px;height:10px;max-width:6px;width:6px}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-thumb{background-color:hsla(0,0%,67%,.2);border-radius:6px}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-thumb:hover{background-color:#aaa}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-thumb:inactive{background-color:#eee}.next-labelimg .next-labelimg-contextmenu-label>.label-main:hover::-webkit-scrollbar-thumb{background-color:hsla(0,0%,67%,.5)}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-track-piece{background-color:transparent;border-radius:6px}.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-resizer,.next-labelimg .next-labelimg-contextmenu-label>.label-main::-webkit-scrollbar-corner{background-color:transparent}.next-labelimg .next-labelimg-contextmenu-label>.label-main>li{align-items:center;display:flex;font-size:12px;padding:3px 0}.next-labelimg .next-labelimg-contextmenu-label>.label-main>li .label-line{border-radius:3px;display:inline-block;height:10px;margin-right:6px;width:3px}.next-labelimg .next-labelimg-contextmenu-label>.label-main>li.activate-label{color:var(--el-color-primary)}.next-labelimg .next-labelimg-draggable-rect{background-color:hsla(0,0%,99%,.5);cursor:move;position:absolute;z-index:999}.next-labelimg .next-labelimg-draggable-rect__resize{height:100%;position:relative;width:100%}.next-labelimg .next-labelimg-draggable-rect__resize .bottom-center,.next-labelimg .next-labelimg-draggable-rect__resize .bottom-left,.next-labelimg .next-labelimg-draggable-rect__resize .bottom-right,.next-labelimg .next-labelimg-draggable-rect__resize .dot,.next-labelimg .next-labelimg-draggable-rect__resize .left-center,.next-labelimg .next-labelimg-draggable-rect__resize .right-center,.next-labelimg .next-labelimg-draggable-rect__resize .top-center,.next-labelimg .next-labelimg-draggable-rect__resize .top-left,.next-labelimg .next-labelimg-draggable-rect__resize .top-right{background-color:var(--el-color-primary);border:1px solid var(--el-color-primary);box-sizing:border-box;height:10px;position:absolute;width:10px}.next-labelimg .next-labelimg-draggable-rect__resize .top-left{cursor:nw-resize;left:-5px;top:-5px}.next-labelimg .next-labelimg-draggable-rect__resize .top-center{cursor:s-resize;left:50%;top:-5px;transform:translateX(-50%)}.next-labelimg .next-labelimg-draggable-rect__resize .top-right{cursor:sw-resize;right:-5px;top:-5px}.next-labelimg .next-labelimg-draggable-rect__resize .left-center{cursor:w-resize;left:-5px;top:50%;transform:translateY(-50%)}.next-labelimg .next-labelimg-draggable-rect__resize .right-center{cursor:w-resize;right:-5px;top:50%;transform:translateY(-50%)}.next-labelimg .next-labelimg-draggable-rect__resize .bottom-left{bottom:-5px;cursor:sw-resize;left:-5px}.next-labelimg .next-labelimg-draggable-rect__resize .bottom-center{bottom:-5px;cursor:s-resize;left:50%;transform:translateX(-50%)}.next-labelimg .next-labelimg-draggable-rect__resize .bottom-right{bottom:-5px;cursor:nw-resize;right:-5px}.next-labelimg-preview{display:inline-block;height:100%}

package/dist/index.js

@@ -2,8 +2,8 @@
 /**
  * 作　　者：huangteng
  * 邮　　箱：htengweb@163.com
- * 当前版本：0.3.1 v
- * 发布日期：2024-06-22
+ * 当前版本：0.3.2 v
+ * 发布日期：2024-06-27
  * 地　　址：https://www.npmjs.com/package/next-element-vue
  */
 
@@ -3370,6 +3370,8 @@ var defaultConfig$3 = {
     settingBtn: !0,
     operations: !0,
     operationsWidth: 260,
+    operationsHeaderAlign: "center",
+    operationsColumnAlign: "center",
     operationsBtnPlain: !1,
     operationsBtnText: !0,
     operationsBtnSize: "small",
@@ -3968,7 +3970,9 @@ const TableColumnDynamic = defineComponent({
                 }, mergeDicData = loopDicData(columnOption.dicData);
                 return createVNode("span", null, [ _formatterColumnValue(row[columnOption.prop], mergeDicData) ]);
             }
-            return null;
+            return columnOption.cellUnit ? createVNode(Fragment, null, [ createVNode("span", null, [ row[columnOption.prop] ]), createVNode("em", {
+                class: "cell-unit"
+            }, [ columnOption.cellUnit ]) ]) : null;
         };
         return () => createVNode(Fragment, null, [ !columnOption.hide && createVNode(ElTableColumn, {
             prop: columnOption.prop,
@@ -4000,8 +4004,8 @@ var TableColumnOperations = defineComponent({
                 fixed: "right",
                 label: t("next.table.operation"),
                 width: options.operationsWidth,
-                headerAlign: options.headerAlign,
-                align: options.cellAlign
+                headerAlign: valueExist(options.operationsHeaderAlign, options.headerAlign),
+                align: valueExist(options.operationsColumnAlign, options.cellAlign)
             }, {
                 default: scoped => createVNode(Fragment, null, [ slots["operation-column-prefix"]?.(scoped, {
                     text: btnText,
@@ -5458,7 +5462,8 @@ var Element$5 = defineComponent({
             getFormExpose: () => addEditFormRef.value?.getFormExpose(),
             updateColumns: ops => {
                 _updateColumnsAll(ops);
-            }
+            },
+            getSearchFormParams: () => _searchFormParams.value
         });
         return () => createVNode(Fragment, null, [ createVNode(Fragment, null, [ createVNode("div", {
             ref: crudTableRef,
@@ -5978,6 +5983,14 @@ var ToolHeader = defineComponent({
         isFullscreen: {
             type: Boolean,
             default: !1
+        },
+        imageIndex: {
+            type: Number,
+            default: 0
+        },
+        imageLength: {
+            type: Number,
+            default: 0
         }
     },
     emits: [ "fullscreen", "save" ],
@@ -5988,6 +6001,7 @@ var ToolHeader = defineComponent({
         return () => createVNode(Fragment, null, [ createVNode(Fragment, null, [ createVNode("ul", {
             class: [ _ns.be("header", "tool") ]
         }, [ createVNode("li", {
+            class: "hover",
             onClick: () => emit("save")
         }, [ createVNode("svg", {
             t: "1719034799379",
@@ -6008,8 +6022,11 @@ var ToolHeader = defineComponent({
             style: "padding-left: 3px"
         }, [ t("next.labelimg.saveLabel") ]) ]) ]), createVNode("ul", {
             class: [ _ns.be("header", "tool") ]
-        }, [ createVNode("li", {
-            style: "margin-right: 30px;"
+        }, [ props.imageLength ? createVNode("li", null, [ createVNode("span", null, [ createTextVNode("第 "), props.imageIndex + 1, createTextVNode(" 张") ]), createVNode("em", {
+            style: "padding: 0 5px;"
+        }, [ createTextVNode("/") ]), createVNode("span", null, [ createTextVNode("共 "), props.imageLength, createTextVNode(" 张") ]) ]) : null, createVNode("li", {
+            style: "margin-right: 30px;",
+            class: "hover"
         }, [ createVNode(ElPopover, {
             trigger: "hover",
             placement: "bottom",
@@ -6028,6 +6045,7 @@ var ToolHeader = defineComponent({
                 style: "font-size: 12px;white-space: nowrap;"
             }, [ createVNode("li", null, [ createVNode("span", null, [ createTextVNode("W：") ]), createVNode("span", null, [ createTextVNode("鼠标移入图片中，长按W键，鼠标按下左键，移动鼠标开始绘制，鼠标抬起结束绘制") ]) ]), createVNode("li", null, [ createVNode("span", null, [ createTextVNode("A：") ]), createVNode("span", null, [ createTextVNode("A键进入上一张图片进行标注") ]) ]), createVNode("li", null, [ createVNode("span", null, [ createTextVNode("D：") ]), createVNode("span", null, [ createTextVNode("D键进入下一张图片进行标注") ]) ]) ])
         }) ]), props.isFullscreen ? createVNode("li", {
+            class: "hover",
             onClick: () => switchFillscreen(!1)
         }, [ createVNode(ElTooltip, {
             placement: "top",
@@ -6047,6 +6065,7 @@ var ToolHeader = defineComponent({
                 "p-id": "5389"
             }, null) ]) ]
         }) ]) : createVNode("li", {
+            class: "hover",
             onClick: () => switchFillscreen(!0)
         }, [ createVNode(ElTooltip, {
             placement: "top",
@@ -6278,7 +6297,7 @@ var DraggableRect = defineComponent({
             parentRect = props.parentEl.getBoundingClientRect(), document.addEventListener("mousemove", onMousemove), 
             document.addEventListener("mouseup", onMouseup);
         })), onUnmounted((() => {
-            document.removeEventListener("mousemove", onMousemove, !1), document.removeEventListener("mouseup", onMouseup, !1);
+            document.removeEventListener("mousemove", onMousemove), document.removeEventListener("mouseup", onMouseup);
         })), {
             onMousedown: e => {
                 e.preventDefault(), isDraggle.value = !0, draggleOffset.value.diff_x = e.offsetX, 
@@ -6286,7 +6305,7 @@ var DraggableRect = defineComponent({
             },
             onMouseup: onMouseup,
             onContextmenu: e => {
-                e.preventDefault(), emit("contextmenu", e, rect.value);
+                e.preventDefault(), e.preventDefault(), emit("contextmenu", e, rect.value);
             },
             rect: rect,
             onMousedownDot: (e, corner) => {
@@ -6448,26 +6467,13 @@ var DraggableRect = defineComponent({
                     });
                     drawBaseCanvas.value.updateLabels = updateLabels, drawBaseCanvas.value.addDrawRect = addDrawRect, 
                     drawBaseCanvas.value.hitCanvasLabel = hitCanvasLabel;
-                    const {clearCanvas: clearCanvas} = ((canvas, callback, keyW) => {
+                    const {clearCanvas: clearCanvas, removeEventAll: removeEventAll} = ((canvas, callback, keyW) => {
                         const canvasWidth = canvas.width, canvasHeight = canvas.height, ctx = canvas?.getContext("2d"), clearCanvas = () => {
                             ctx.clearRect(0, 0, canvasWidth, canvasHeight);
                         };
                         clearCanvas();
                         let startX, startY, endX, endY, isDrawing = !1, isRectDraw = !1, isWKeyPressed = !1;
-                        document.addEventListener("keydown", (event => {
-                            "KeyW" === event.code && (isWKeyPressed = !0, canvas.style.cursor = "crosshair", 
-                            canvas.style.zIndex = "11", keyW && keyW());
-                        })), document.addEventListener("keyup", (event => {
-                            isDrawing || "KeyW" === event.code && (isWKeyPressed = !1, canvas.style.cursor = "unset", 
-                            canvas.style.zIndex = "0");
-                        })), canvas.addEventListener("mousedown", (e => {
-                            isWKeyPressed && (isDrawing = !0, startX = e.offsetX, startY = e.offsetY);
-                        })), canvas.addEventListener("mousemove", (e => {
-                            isDrawing && isWKeyPressed && (isRectDraw = !0, endX = e.offsetX, endY = e.offsetY, 
-                            drawRect());
-                        })), canvas.addEventListener("mouseup", (() => {
-                            if (!isRectDraw) return;
-                            isDrawing = !1, isWKeyPressed = !1, canvas.style.cursor = "unset", canvas.style.zIndex = "0";
+                        const drawRectDone = () => {
                             const rectWidth = Math.abs(endX - startX), rectHeight = Math.abs(endY - startY);
                             startX > endX && (startX = endX), startY > endY && (startY = endY), callback && callback({
                                 startX: startX,
@@ -6479,8 +6485,30 @@ var DraggableRect = defineComponent({
                             }, {
                                 endX: endX,
                                 endY: endY
-                            }), isRectDraw = !1;
-                        }));
+                            });
+                        }, documentKeydown = event => {
+                            "KeyW" === event.code && (isWKeyPressed = !0, canvas.style.cursor = "crosshair", 
+                            canvas.style.zIndex = "11", keyW && keyW());
+                        }, documentKeyup = event => {
+                            isDrawing || "KeyW" === event.code && (isWKeyPressed = !1, canvas.style.cursor = "unset", 
+                            canvas.style.zIndex = "0");
+                        }, documentMouseup = () => {
+                            isRectDraw && (isDrawing = !1, isWKeyPressed = !1, canvas.style.cursor = "unset", 
+                            canvas.style.zIndex = "0", drawRectDone(), isRectDraw = !1);
+                        };
+                        document.addEventListener("keydown", documentKeydown), document.addEventListener("keyup", documentKeyup), 
+                        document.addEventListener("mouseup", documentMouseup);
+                        const canvasMousedown = e => {
+                            isWKeyPressed && (isDrawing = !0, startX = e.offsetX, startY = e.offsetY);
+                        }, canvasMousemove = e => {
+                            isDrawing && isWKeyPressed && (isRectDraw = !0, endX = e.offsetX, endY = e.offsetY, 
+                            drawRect());
+                        }, canvasMouseup = e => {
+                            e.stopPropagation(), isRectDraw && (isDrawing = !1, isWKeyPressed = !1, canvas.style.cursor = "unset", 
+                            canvas.style.zIndex = "0", drawRectDone(), isRectDraw = !1);
+                        };
+                        canvas.addEventListener("mousedown", canvasMousedown), canvas.addEventListener("mousemove", canvasMousemove), 
+                        canvas.addEventListener("mouseup", canvasMouseup);
                         const drawRect = (color = "#f30635") => {
                             clearCanvas(), ctx.strokeStyle = color, ctx.strokeRect(startX, startY, endX - startX, endY - startY);
                         };
@@ -6488,14 +6516,19 @@ var DraggableRect = defineComponent({
                             canvas: canvas,
                             ctx: ctx,
                             clearCanvas: clearCanvas,
-                            drawRect: drawRect
+                            drawRect: drawRect,
+                            removeEventAll: () => {
+                                document.removeEventListener("mousedown", documentKeydown), document.removeEventListener("keyup", documentKeyup), 
+                                document.removeEventListener("mouseup", documentMouseup), canvas.removeEventListener("mousedown", canvasMousedown), 
+                                canvas.removeEventListener("mousemove", canvasMousemove), canvas.removeEventListener("mouseup", canvasMouseup);
+                            }
                         };
                     })(canvasRectRef.value, ((rect, {endX: endX, endY: endY}) => {
                         activate_add_label.value = rect, drawBaseCanvas.value.addDrawRect(rect), updateContextmenuLabelFixed(endX, endY, rect);
                     }), (() => {
                         onCloseDraggableRectFixed();
                     }));
-                    drawBaseCanvas.value.clearCanvasRect = clearCanvas;
+                    drawBaseCanvas.value.clearCanvasRect = clearCanvas, drawBaseCanvas.value.removeEventAll = removeEventAll;
                 }, image.onerror = () => {
                     loadingImage.value = !1;
                 };
@@ -6527,6 +6560,8 @@ var DraggableRect = defineComponent({
                     renderImageLabel(rowInfo);
                 }
             }));
+        })), onUnmounted((() => {
+            drawBaseCanvas.value.removeEventAll();
         }));
         const contextmenuLabelFixed = ref({
             show: !1,
@@ -6602,8 +6637,8 @@ var DraggableRect = defineComponent({
             onCloseContentmenuLabel: onCloseContentmenuLabel,
             onSelectedLabel: (rect, index) => {
                 onCloseDraggableRectFixed(), nextTick((() => {
-                    const {startX: x, startY: y, type: type} = rect;
-                    updateDraggableRectFixed(x, y, rect, index, colors[type]);
+                    const {startX: x, startY: y, type: type} = rect, color = colors[type];
+                    updateDraggableRectFixed(x, y, labels.value[index], index, color);
                 }));
             },
             onDeleteLabel: onDeleteLabel,
@@ -6688,7 +6723,7 @@ var DraggableRect = defineComponent({
             class: "label-line"
         }, null), createVNode("span", null, [ rect.typeName ]) ]), createVNode(ElPopconfirm, {
             title: t("next.labelimg.confirmDeleteLabel"),
-            width: 180,
+            width: 200,
             onConfirm: () => (rect => {
                 emit("delete", rect);
             })(rect)
@@ -6867,6 +6902,8 @@ var Element = defineComponent({
                     class: [ ns$1.b("header") ]
                 }, [ slots.header ? slots.header() : createVNode(ToolHeader, {
                     isFullscreen: isFullscreen.value,
+                    imageIndex: activateNodeIndex.value,
+                    imageLength: labelImages.value.length,
                     onFullscreen: onSwitchFillscreen,
                     onSave: () => {
                         onChangeActivateNode(activateNodeIndex.value) || ElMessage({
@@ -7067,7 +7104,7 @@ const zoomDialog = app => {
             }));
         }
     });
-}, version = "0.3.1", install = function(app) {
+}, version = "0.3.2", install = function(app) {
     Object.keys(components).forEach((key => {
         const component = components[key];
         app.component(component.name, component);
@@ -7077,7 +7114,7 @@ const zoomDialog = app => {
 };
 
 var index = {
-    version: "0.3.1",
+    version: "0.3.2",
     install: install
 };