git config core.ignorecase false
							parent
							
								
									40558e42a6
								
							
						
					
					
						commit
						9aa3347204
					
				|  | @ -0,0 +1,465 @@ | |||
| <script> | ||||
| import Button from '../button/index' | ||||
| import Pager from './Pager' | ||||
| import Options from './Options' | ||||
| import locale from './locale/zh_CN' | ||||
| import KEYCODE from './KeyCode' | ||||
| 
 | ||||
| // 是否是正整数 | ||||
| function isInteger (value) { | ||||
|   return typeof value === 'number' && | ||||
|     isFinite(value) && | ||||
|     Math.floor(value) === value | ||||
| } | ||||
| 
 | ||||
| function defaultItemRender (page, type, element) { | ||||
|   return element | ||||
| } | ||||
| 
 | ||||
| export default { | ||||
|   name: 'Pagination', | ||||
|   props: { | ||||
|     prefixCls: { | ||||
|       type: String, | ||||
|       default: 'ant-pagination', | ||||
|     }, | ||||
|     current: { | ||||
|       type: [Number, String], | ||||
|       default: 1, | ||||
|     }, | ||||
|     total: { | ||||
|       type: [Number, String], | ||||
|       default: 0, | ||||
|     }, | ||||
|     pageSize: { | ||||
|       type: [Number, String], | ||||
|       default: 10, | ||||
|     }, | ||||
|     showSizeChanger: { | ||||
|       type: Boolean, | ||||
|       default: false, | ||||
|     }, | ||||
|     pageSizeOptions: { | ||||
|       type: Array, | ||||
|       default: () => ['10', '20', '30', '40'], | ||||
|     }, | ||||
|     showQuickJumper: { | ||||
|       type: Boolean, | ||||
|       default: false, | ||||
|     }, | ||||
|     size: { | ||||
|       type: String, | ||||
|       default: '', | ||||
|     }, | ||||
|     simple: Boolean, | ||||
|     showTitle: { | ||||
|       type: Boolean, | ||||
|       default: true, | ||||
|     }, | ||||
|     showTotal: Function, | ||||
|     itemRender: { | ||||
|       type: Function, | ||||
|       default: defaultItemRender, | ||||
|     }, | ||||
|   }, | ||||
|   model: { | ||||
|     prop: 'current', | ||||
|   }, | ||||
|   data () { | ||||
|     const { current } = this | ||||
|     return { | ||||
|       stateCurrent: +current, | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     isValid (page) { | ||||
|       return isInteger(page) && page >= 1 && page !== this.stateCurrent | ||||
|     }, | ||||
|     calculatePage (p) { | ||||
|       let pageSize = p | ||||
|       if (typeof pageSize === 'undefined') { | ||||
|         pageSize = this.pageSize | ||||
|       } | ||||
|       return Math.floor((this.total - 1) / pageSize) + 1 | ||||
|     }, | ||||
|     handleGoTO (event) { | ||||
|       if (event.keyCode === KEYCODE.ENTER || event.type === 'click') { | ||||
|         this.handleChange(this.stateCurrent) | ||||
|       } | ||||
|     }, | ||||
|     prev () { | ||||
|       if (this.hasPrev()) { | ||||
|         this.handleChange(this.stateCurrent - 1) | ||||
|       } | ||||
|     }, | ||||
|     next () { | ||||
|       if (this.hasNext()) { | ||||
|         this.handleChange(this.stateCurrent + 1) | ||||
|       } | ||||
|     }, | ||||
|     hasPrev () { | ||||
|       return this.stateCurrent > 1 | ||||
|     }, | ||||
|     hasNext () { | ||||
|       return this.stateCurrent < this.calculatePage() | ||||
|     }, | ||||
|     handleKeyDown (event) { | ||||
|       if (event.keyCode === KEYCODE.ARROW_UP || event.keyCode === KEYCODE.ARROW_DOWN) { | ||||
|         event.preventDefault() | ||||
|       } | ||||
|     }, | ||||
|     handleKeyUp (event) { | ||||
|       const inputValue = event.target.value | ||||
|       const stateCurrent = this.stateCurrent | ||||
|       let value | ||||
| 
 | ||||
|       if (inputValue === '') { | ||||
|         value = inputValue | ||||
|       } else if (isNaN(Number(inputValue))) { | ||||
|         value = stateCurrent | ||||
|       } else { | ||||
|         value = Number(inputValue) | ||||
|       } | ||||
|       event.target.value = value | ||||
| 
 | ||||
|       if (event.keyCode === KEYCODE.ENTER) { | ||||
|         this.handleChange(value) | ||||
|       } else if (event.keyCode === KEYCODE.ARROW_UP) { | ||||
|         this.handleChange(value - 1) | ||||
|       } else if (event.keyCode === KEYCODE.ARROW_DOWN) { | ||||
|         this.handleChange(value + 1) | ||||
|       } | ||||
|     }, | ||||
|     handleChange (p) { | ||||
|       let page = p | ||||
|       if (this.isValid(page)) { | ||||
|         const allTotal = this.calculatePage() | ||||
|         if (page > allTotal) { | ||||
|           page = allTotal | ||||
|         } | ||||
|         this.stateCurrent = page | ||||
|         this.$emit('input', page) | ||||
|         this.$emit('change', page, this.pageSize) | ||||
|         return page | ||||
|       } | ||||
|       return this.stateCurrent | ||||
|     }, | ||||
|     runIfEnter (event, callback, ...restParams) { | ||||
|       if (event.key === 'Enter' || event.charCode === 13) { | ||||
|         callback(...restParams) | ||||
|       } | ||||
|     }, | ||||
|     runIfEnterPrev (event) { | ||||
|       this.runIfEnter(event, this.prev) | ||||
|     }, | ||||
|     runIfEnterNext (event) { | ||||
|       this.runIfEnter(event, this.next) | ||||
|     }, | ||||
|     runIfEnterJumpPrev (event) { | ||||
|       this.runIfEnter(event, this.jumpPrev) | ||||
|     }, | ||||
|     runIfEnterJumpNext (event) { | ||||
|       this.runIfEnter(event, this.jumpNext) | ||||
|     }, | ||||
|     getJumpPrevPage () { | ||||
|       return Math.max(1, this.stateCurrent - (this.showLessItems ? 3 : 5)) | ||||
|     }, | ||||
|     getJumpNextPage () { | ||||
|       return Math.min(this.calculatePage(), this.stateCurrent + (this.showLessItems ? 3 : 5)) | ||||
|     }, | ||||
|     jumpPrev () { | ||||
|       this.handleChange(this.getJumpPrevPage()) | ||||
|     }, | ||||
|     jumpNext () { | ||||
|       this.handleChange(this.getJumpNextPage()) | ||||
|     }, | ||||
|   }, | ||||
|   watch: { | ||||
|     current (val) { | ||||
|       this.stateCurrent = +val | ||||
|     }, | ||||
|   }, | ||||
|   components: { | ||||
|     vcButton: Button, | ||||
|     Pager, | ||||
|   }, | ||||
|   render () { | ||||
|     const prefixCls = this.prefixCls | ||||
|     const allPages = this.calculatePage() | ||||
|     const pagerList = [] | ||||
|     let jumpPrev = null | ||||
|     let jumpNext = null | ||||
|     let firstPager = null | ||||
|     let lastPager = null | ||||
|     let gotoButton = null | ||||
| 
 | ||||
|     const goButton = this.showQuickJumper | ||||
|     const pageBufferSize = this.showLessItems ? 1 : 2 | ||||
|     const { stateCurrent, pageSize } = this | ||||
|     const smallClass = this.size === 'small' ? 'mini' : '' | ||||
|     const prevPage = stateCurrent - 1 > 0 ? stateCurrent - 1 : 0 | ||||
|     const nextPage = stateCurrent + 1 < allPages ? stateCurrent + 1 : allPages | ||||
| 
 | ||||
|     if (this.simple) { | ||||
|       if (goButton) { | ||||
|         if (typeof goButton === 'boolean') { | ||||
|           gotoButton = ( | ||||
|             <li | ||||
|               title={this.showTitle ? `${locale.jump_to}${stateCurrent}/${allPages}` : null} | ||||
|               class={`${prefixCls}-simple-pager`} | ||||
|             > | ||||
|               <vc-button | ||||
|                 onClick={this.handleGoTO} | ||||
|                 onKeyup={this.handleGoTO} | ||||
|               > | ||||
|                 {locale.jump_to_confirm} | ||||
|               </vc-button> | ||||
|             </li> | ||||
|           ) | ||||
|         } else { | ||||
|           gotoButton = goButton | ||||
|         } | ||||
|       } | ||||
|       return ( | ||||
|         <ul class={`${prefixCls} ${prefixCls}-simple ${smallClass}`}> | ||||
|           <li | ||||
|             title={this.showTitle ? locale.prev_page : null} | ||||
|             onClick={this.prev} | ||||
|             tabIndex='0' | ||||
|             onKeypress={this.runIfEnterPrev} | ||||
|             class={`${this.hasPrev() ? '' : `${prefixCls}-disabled`} ${prefixCls}-prev`} | ||||
|             aria-disabled={!this.hasPrev()} | ||||
|           > | ||||
|             {this.itemRender(prevPage, 'prev', <a class={`${prefixCls}-item-link`} />)} | ||||
|           </li> | ||||
|           <li | ||||
|             title={this.showTitle ? `${stateCurrent}/${allPages}` : null} | ||||
|             class={`${prefixCls}-simple-pager`} | ||||
|           > | ||||
|             <input | ||||
|               type='text' | ||||
|               value={this.stateCurrent} | ||||
|               onKeydown={this.handleKeyDown} | ||||
|               onKeyup={this.handleKeyUp} | ||||
|               onChange={this.handleKeyUp} | ||||
|               size='3' | ||||
|             /> | ||||
|             <span class={`${prefixCls}-slash`}>/</span> | ||||
|             {allPages} | ||||
|           </li> | ||||
|           <li | ||||
|             title={this.showTitle ? locale.next_page : null} | ||||
|             onClick={this.next} | ||||
|             tabIndex='0' | ||||
|             onKeypress={this.runIfEnterNext} | ||||
|             class={`${this.hasNext() ? '' : `${prefixCls}-disabled`} ${prefixCls}-next`} | ||||
|             aria-disabled={!this.hasNext()} | ||||
|           > | ||||
|             {this.itemRender(nextPage, 'next', <a class={`${prefixCls}-item-link`} />)} | ||||
|           </li> | ||||
|           {gotoButton} | ||||
|         </ul> | ||||
|       ) | ||||
|     } | ||||
| 
 | ||||
|     if (allPages <= 5 + pageBufferSize * 2) { | ||||
|       for (let i = 1; i <= allPages; i++) { | ||||
|         const active = stateCurrent === i | ||||
|         pagerList.push( | ||||
|           <Pager | ||||
|             rootPrefixCls={this.prefixCls} | ||||
|             onClick={this.handleChange} | ||||
|             onKeypress={this.runIfEnter} | ||||
|             key={i} | ||||
|             page={i} | ||||
|             active={active} | ||||
|             showTitle={this.showTitle} | ||||
|             itemRender={this.itemRender} | ||||
|           /> | ||||
|         ) | ||||
|       } | ||||
|     } else { | ||||
|       const prevItemTitle = this.showLessItems ? locale.prev_3 : locale.prev_5 | ||||
|       const nextItemTitle = this.showLessItems ? locale.next_3 : locale.next_5 | ||||
|       jumpPrev = ( | ||||
|         <li | ||||
|           title={this.showTitle ? prevItemTitle : null} | ||||
|           key='prev' | ||||
|           onClick={this.jumpPrev} | ||||
|           tabIndex='0' | ||||
|           onKeypress={this.runIfEnterJumpPrev} | ||||
|           class={`${prefixCls}-jump-prev`} | ||||
|         > | ||||
|           {this.itemRender( | ||||
|             this.getJumpPrevPage(), 'jump-prev', <a class={`${prefixCls}-item-link`} /> | ||||
|           )} | ||||
|         </li> | ||||
|       ) | ||||
|       jumpNext = ( | ||||
|         <li | ||||
|           title={this.showTitle ? nextItemTitle : null} | ||||
|           key='next' | ||||
|           tabIndex='0' | ||||
|           onClick={this.jumpNext} | ||||
|           onKeypress={this.runIfEnterJumpNext} | ||||
|           class={`${prefixCls}-jump-next`} | ||||
|         > | ||||
|           {this.itemRender( | ||||
|             this.getJumpNextPage(), 'jump-next', <a class={`${prefixCls}-item-link`} /> | ||||
|           )} | ||||
|         </li> | ||||
|       ) | ||||
|       lastPager = ( | ||||
|         <Pager | ||||
|           rootPrefixCls={prefixCls} | ||||
|           onClick={this.handleChange} | ||||
|           onKeypress={this.runIfEnter} | ||||
|           key={allPages} | ||||
|           page={allPages} | ||||
|           active={false} | ||||
|           showTitle={this.showTitle} | ||||
|           itemRender={this.itemRender} | ||||
|         /> | ||||
|       ) | ||||
|       firstPager = ( | ||||
|         <Pager | ||||
|           rootPrefixCls={prefixCls} | ||||
|           onClick={this.handleChange} | ||||
|           onKeypress={this.runIfEnter} | ||||
|           key={1} | ||||
|           page={1} | ||||
|           active={false} | ||||
|           showTitle={this.showTitle} | ||||
|           itemRender={this.itemRender} | ||||
|         /> | ||||
|       ) | ||||
| 
 | ||||
|       let left = Math.max(1, stateCurrent - pageBufferSize) | ||||
|       let right = Math.min(stateCurrent + pageBufferSize, allPages) | ||||
| 
 | ||||
|       if (stateCurrent - 1 <= pageBufferSize) { | ||||
|         right = 1 + pageBufferSize * 2 | ||||
|       } | ||||
| 
 | ||||
|       if (allPages - stateCurrent <= pageBufferSize) { | ||||
|         left = allPages - pageBufferSize * 2 | ||||
|       } | ||||
| 
 | ||||
|       for (let i = left; i <= right; i++) { | ||||
|         const active = stateCurrent === i | ||||
|         pagerList.push( | ||||
|           <Pager | ||||
|             rootPrefixCls={prefixCls} | ||||
|             onClick={this.handleChange} | ||||
|             onKeypress={this.runIfEnter} | ||||
|             key={i} | ||||
|             page={i} | ||||
|             active={active} | ||||
|             showTitle={this.showTitle} | ||||
|             itemRender={this.itemRender} | ||||
|           /> | ||||
|         ) | ||||
|       } | ||||
| 
 | ||||
|       if (stateCurrent - 1 >= pageBufferSize * 2 && stateCurrent !== 1 + 2) { | ||||
|         pagerList[0] = ( | ||||
|           <Pager | ||||
|             rootPrefixCls={prefixCls} | ||||
|             onClick={this.handleChange} | ||||
|             onKeypress={this.runIfEnter} | ||||
|             key={left} | ||||
|             page={left} | ||||
|             className={`${prefixCls}-item-after-jump-prev`} | ||||
|             active={false} | ||||
|             showTitle={this.showTitle} | ||||
|             itemRender={this.itemRender} | ||||
|           /> | ||||
|         ) | ||||
|         pagerList.unshift(jumpPrev) | ||||
|       } | ||||
|       if (allPages - stateCurrent >= pageBufferSize * 2 && stateCurrent !== allPages - 2) { | ||||
|         pagerList[pagerList.length - 1] = ( | ||||
|           <Pager | ||||
|             rootPrefixCls={prefixCls} | ||||
|             onClick={this.handleChange} | ||||
|             onKeypress={this.runIfEnter} | ||||
|             key={right} | ||||
|             page={right} | ||||
|             className={`${prefixCls}-item-before-jump-next`} | ||||
|             active={false} | ||||
|             showTitle={this.showTitle} | ||||
|             itemRender={this.itemRender} | ||||
|           /> | ||||
|         ) | ||||
|         pagerList.push(jumpNext) | ||||
|       } | ||||
| 
 | ||||
|       if (left !== 1) { | ||||
|         pagerList.unshift(firstPager) | ||||
|       } | ||||
|       if (right !== allPages) { | ||||
|         pagerList.push(lastPager) | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     let totalText = null | ||||
| 
 | ||||
|     if (this.showTotal) { | ||||
|       totalText = ( | ||||
|         <li class={`${prefixCls}-total-text`}> | ||||
|           {this.showTotal( | ||||
|             this.total, | ||||
|             [ | ||||
|               (stateCurrent - 1) * pageSize + 1, | ||||
|               stateCurrent * pageSize > this.total ? this.total : stateCurrent * pageSize, | ||||
|             ] | ||||
|           )} | ||||
|         </li> | ||||
|       ) | ||||
|     } | ||||
|     const prevDisabled = !this.hasPrev() | ||||
|     const nextDisabled = !this.hasNext() | ||||
|     return ( | ||||
|       <ul | ||||
|         class={`${prefixCls} ${smallClass}`} | ||||
|         unselectable='unselectable' | ||||
|       > | ||||
|         {totalText} | ||||
|         <li | ||||
|           title={this.showTitle ? locale.prev_page : null} | ||||
|           onClick={this.prev} | ||||
|           tabIndex='0' | ||||
|           onKeypress={this.runIfEnterPrev} | ||||
|           class={`${!prevDisabled ? '' : `${prefixCls}-disabled`} ${prefixCls}-prev`} | ||||
|           aria-disabled={prevDisabled} | ||||
|         > | ||||
|           {this.itemRender(prevPage, 'prev', <a class={`${prefixCls}-item-link`} />)} | ||||
|         </li> | ||||
|         {pagerList} | ||||
|         <li | ||||
|           title={this.showTitle ? locale.next_page : null} | ||||
|           onClick={this.next} | ||||
|           tabIndex='0' | ||||
|           onKeypress={this.runIfEnterNext} | ||||
|           class={`${!nextDisabled ? '' : `${prefixCls}-disabled`} ${prefixCls}-next`} | ||||
|           aria-disabled={nextDisabled} | ||||
|         > | ||||
|           {this.itemRender(nextPage, 'next', <a class={`${prefixCls}-item-link`} />)} | ||||
|         </li> | ||||
|         <Options | ||||
|           locale={locale} | ||||
|           rootPrefixCls={prefixCls} | ||||
|           selectComponentClass={this.selectComponentClass} | ||||
|           selectPrefixCls={this.selectPrefixCls} | ||||
|           changeSize={this.showSizeChanger ? this.changePageSize : null} | ||||
|           current={stateCurrent} | ||||
|           pageSize={pageSize} | ||||
|           pageSizeOptions={this.pageSizeOptions} | ||||
|           quickGo={this.showQuickJumper ? this.handleChange : null} | ||||
|           goButton={goButton} | ||||
|         /> | ||||
|       </ul> | ||||
|     ) | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | @ -0,0 +1,187 @@ | |||
| <script> | ||||
| import { cloneElement, isValidElement, getClass, getStyle } from '../_util/vnode' | ||||
| import RcTooltip from './src/Tooltip' | ||||
| import getPlacements from './placements' | ||||
| import PropTypes from '../_util/vue-types' | ||||
| import { hasProp, getComponentFromProp } from '../_util/props-util' | ||||
| import abstractTooltipProps from './abstractTooltipProps' | ||||
| 
 | ||||
| const splitObject = (obj, keys) => { | ||||
|   const picked = {} | ||||
|   const omited = { ...obj } | ||||
|   keys.forEach(key => { | ||||
|     if (obj && key in obj) { | ||||
|       picked[key] = obj[key] | ||||
|       delete omited[key] | ||||
|     } | ||||
|   }) | ||||
|   return { picked, omited } | ||||
| } | ||||
| const props = abstractTooltipProps() | ||||
| export default { | ||||
|   name: 'Tooltip', | ||||
|   props: { | ||||
|     ...props, | ||||
|     title: PropTypes.any, | ||||
|   }, | ||||
|   model: { | ||||
|     prop: 'visible', | ||||
|     event: 'change', | ||||
|   }, | ||||
|   data () { | ||||
|     return { | ||||
|       sVisible: !!this.$props.visible, | ||||
|     } | ||||
|   }, | ||||
|   watch: { | ||||
|     visible (val) { | ||||
|       this.sVisible = val | ||||
|     }, | ||||
|   }, | ||||
|   methods: { | ||||
|     onVisibleChange (visible) { | ||||
|       if (!hasProp(this, 'visible')) { | ||||
|         this.sVisible = this.isNoTitle() ? false : visible | ||||
|       } | ||||
|       if (!this.isNoTitle()) { | ||||
|         this.$emit('change', visible) | ||||
|       } | ||||
|     }, | ||||
| 
 | ||||
|     getPopupDomNode () { | ||||
|       return this.$refs.tooltip.getPopupDomNode() | ||||
|     }, | ||||
| 
 | ||||
|     getPlacements () { | ||||
|       const { builtinPlacements, arrowPointAtCenter, autoAdjustOverflow } = this.$props | ||||
|       return builtinPlacements || getPlacements({ | ||||
|         arrowPointAtCenter, | ||||
|         verticalArrowShift: 8, | ||||
|         autoAdjustOverflow, | ||||
|       }) | ||||
|     }, | ||||
| 
 | ||||
|     isHoverTrigger () { | ||||
|       const { trigger } = this.$props | ||||
|       if (!trigger || trigger === 'hover') { | ||||
|         return true | ||||
|       } | ||||
|       if (Array.isArray(trigger)) { | ||||
|         return trigger.indexOf('hover') >= 0 | ||||
|       } | ||||
|       return false | ||||
|     }, | ||||
| 
 | ||||
|     // Fix Tooltip won't hide at disabled button | ||||
|     // mouse events don't trigger at disabled button in Chrome | ||||
|     // https://github.com/react-component/tooltip/issues/18 | ||||
|     getDisabledCompatibleChildren (ele) { | ||||
|       const isAntBtn = ele.componentOptions && ele.componentOptions.Ctor.options.__ANT_BUTTON | ||||
|       if (((isAntBtn && ele.componentOptions.propsData.disabled) || (ele.tag === 'button' && ele.data && ele.data.attrs.disabled !== false)) && this.isHoverTrigger()) { | ||||
|       // Pick some layout related style properties up to span | ||||
|       // Prevent layout bugs like https://github.com/ant-design/ant-design/issues/5254 | ||||
|         const { picked, omited } = splitObject( | ||||
|           getStyle(ele), | ||||
|           ['position', 'left', 'right', 'top', 'bottom', 'float', 'display', 'zIndex'], | ||||
|         ) | ||||
|         const spanStyle = { | ||||
|           display: 'inline-block', // default inline-block is important | ||||
|           ...picked, | ||||
|           cursor: 'not-allowed', | ||||
|         } | ||||
|         const buttonStyle = { | ||||
|           ...omited, | ||||
|           pointerEvents: 'none', | ||||
|         } | ||||
|         const spanCls = getClass(ele) | ||||
|         const child = cloneElement(ele, { | ||||
|           style: buttonStyle, | ||||
|           class: null, | ||||
|         }) | ||||
|         return ( | ||||
|           <span style={spanStyle} class={spanCls}> | ||||
|             {child} | ||||
|           </span> | ||||
|         ) | ||||
|       } | ||||
|       return ele | ||||
|     }, | ||||
| 
 | ||||
|     isNoTitle () { | ||||
|       const { $slots, title } = this | ||||
|       return !$slots.title && !title | ||||
|     }, | ||||
| 
 | ||||
|     // 动态设置动画点 | ||||
|     onPopupAlign (domNode, align) { | ||||
|       const placements = this.getPlacements() | ||||
|       // 当前返回的位置 | ||||
|       const placement = Object.keys(placements).filter( | ||||
|         key => ( | ||||
|           placements[key].points[0] === align.points[0] && | ||||
|         placements[key].points[1] === align.points[1] | ||||
|         ), | ||||
|       )[0] | ||||
|       if (!placement) { | ||||
|         return | ||||
|       } | ||||
|       // 根据当前坐标设置动画点 | ||||
|       const rect = domNode.getBoundingClientRect() | ||||
|       const transformOrigin = { | ||||
|         top: '50%', | ||||
|         left: '50%', | ||||
|       } | ||||
|       if (placement.indexOf('top') >= 0 || placement.indexOf('Bottom') >= 0) { | ||||
|         transformOrigin.top = `${rect.height - align.offset[1]}px` | ||||
|       } else if (placement.indexOf('Top') >= 0 || placement.indexOf('bottom') >= 0) { | ||||
|         transformOrigin.top = `${-align.offset[1]}px` | ||||
|       } | ||||
|       if (placement.indexOf('left') >= 0 || placement.indexOf('Right') >= 0) { | ||||
|         transformOrigin.left = `${rect.width - align.offset[0]}px` | ||||
|       } else if (placement.indexOf('right') >= 0 || placement.indexOf('Left') >= 0) { | ||||
|         transformOrigin.left = `${-align.offset[0]}px` | ||||
|       } | ||||
|       domNode.style.transformOrigin = `${transformOrigin.left} ${transformOrigin.top}` | ||||
|     }, | ||||
|   }, | ||||
| 
 | ||||
|   render (h) { | ||||
|     const { $props, $data, $slots } = this | ||||
|     const { prefixCls, openClassName, getPopupContainer, getTooltipContainer } = $props | ||||
|     const children = ($slots.default || []).filter(c => c.tag || c.text.trim() !== '')[0] | ||||
|     let sVisible = $data.sVisible | ||||
|     // Hide tooltip when there is no title | ||||
|     if (!hasProp(this, 'visible') && this.isNoTitle()) { | ||||
|       sVisible = false | ||||
|     } | ||||
|     if (!children) { | ||||
|       return null | ||||
|     } | ||||
|     const child = this.getDisabledCompatibleChildren(isValidElement(children) ? children : <span>{children}</span>) | ||||
|     const childCls = { | ||||
|       [openClassName || `${prefixCls}-open`]: true, | ||||
|     } | ||||
|     const tooltipProps = { | ||||
|       props: { | ||||
|         ...$props, | ||||
|         getTooltipContainer: getPopupContainer || getTooltipContainer, | ||||
|         builtinPlacements: this.getPlacements(), | ||||
|         visible: sVisible, | ||||
|       }, | ||||
|       ref: 'tooltip', | ||||
|       on: { | ||||
|         visibleChange: this.onVisibleChange, | ||||
|         popupAlign: this.onPopupAlign, | ||||
|       }, | ||||
|     } | ||||
|     return ( | ||||
|       <RcTooltip {...tooltipProps}> | ||||
|         <template slot='overlay'> | ||||
|           {getComponentFromProp(this, 'title')} | ||||
|         </template> | ||||
|         {sVisible ? cloneElement(child, { class: childCls }) : child} | ||||
|       </RcTooltip> | ||||
|     ) | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
		Loading…
	
		Reference in New Issue
	
	 tjz
						tjz