Merge pull request #36 from iview/2.0

update
This commit is contained in:
yangdan8 2019-09-20 16:53:59 +08:00 committed by GitHub
commit d2c548d1c2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
24 changed files with 1853 additions and 1259 deletions

View file

@ -1,5 +1,5 @@
<p align="center"> <p align="center">
<a href="https://www.iviewui.com"> <a href="http://iview.talkingdata.com/">
<img width="200" src="https://file.iviewui.com/logo-new.svg"> <img width="200" src="https://file.iviewui.com/logo-new.svg">
</a> </a>
</p> </p>
@ -22,7 +22,7 @@ iView
## Docs ## Docs
**[3.x](https://www.iviewui.com)** | [2.x](http://v2.iviewui.com) | [1.x](http://v1.iviewui.com) **[3.x](http://iview.talkingdata.com/)** | [2.x](http://v2.iviewui.com) | [1.x](http://v1.iviewui.com)
## Features ## Features

2298
dist/iview.js vendored

File diff suppressed because it is too large Load diff

2
dist/iview.js.map vendored

File diff suppressed because one or more lines are too long

17
dist/iview.min.js vendored

File diff suppressed because one or more lines are too long

BIN
dist/iview.min.js.gz vendored

Binary file not shown.

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -1,18 +1,9 @@
<style>
.demo-carousel{
height: 200px;
line-height: 200px;
text-align: center;
color: #fff;
font-size: 20px;
background: #506b9e;
}
</style>
<template> <template>
<div style="width: 400px;"> <div>
<Carousel v-model="value1" loop arrow="always" @on-change="handleChange"> <!--#6076-->
<Carousel loop>
<CarouselItem> <CarouselItem>
<div class="demo-carousel">1</div> <div class="demo-carousel">111111111111</div>
</CarouselItem> </CarouselItem>
<CarouselItem> <CarouselItem>
<div class="demo-carousel">2</div> <div class="demo-carousel">2</div>
@ -24,20 +15,65 @@
<div class="demo-carousel">4</div> <div class="demo-carousel">4</div>
</CarouselItem> </CarouselItem>
</Carousel> </Carousel>
<Button @click="value1 = 2">change</Button>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data () { data () {
return { return {
value1: 0
} }
}, },
methods: { methods: {
handleChange (old, newval) {
console.log(old, newval); },
} mounted () {
} }
} }
</script> </script>
<style>
.demo-carousel{
height: 100px;
}
</style>
<!--<style>-->
<!-- .demo-carousel{-->
<!-- height: 200px;-->
<!-- line-height: 200px;-->
<!-- text-align: center;-->
<!-- font-size: 20px;-->
<!-- }-->
<!--</style>-->
<!--<template>-->
<!-- <div>-->
<!-- <Carousel v-model="value1" loop @on-change="handleChange" @on-click="handlerClick">-->
<!-- <CarouselItem v-for="it in 4" :key="it">-->
<!-- <div class="demo-carousel">-->
<!-- {{it}}<Button @click="handlerIndexClick(it)">点击事件</Button>-->
<!-- </div>-->
<!-- </CarouselItem>-->
<!-- </Carousel>-->
<!-- <Button @click="value1 = 2">change</Button>-->
<!-- </div>-->
<!--</template>-->
<!--<script>-->
<!-- export default {-->
<!-- data () {-->
<!-- return {-->
<!-- value1: 0-->
<!-- }-->
<!-- },-->
<!-- methods: {-->
<!-- handleChange (old, newval) {-->
<!-- console.log(old, newval,'-&#45;&#45;on-change');-->
<!-- },-->
<!-- handlerClick(index){-->
<!-- console.log(index,'&#45;&#45;&#45;&#45;&#45;&#45;on-click');-->
<!-- },-->
<!-- handlerIndexClick(it){-->
<!-- console.log(it,'&#45;&#45;&#45;&#45;&#45;&#45;it')-->
<!-- }-->
<!-- },-->
<!-- }-->
<!--</script>-->

View file

@ -1,6 +1,12 @@
<template> <template>
<div> <div>
<Button type="primary" @click="modal1 = true">Display dialog box</Button> <Button type="primary" @click="modal1 = true">Display dialog box</Button>
<Button type="primary" @click="modal2 = true">Display dialog box</Button>
<Modal v-model="modal2" draggable title="Common Modal dialog box title"
@on-ok="ok"
@on-cancel="cancel" :styles="{top: '300px', left: '100px'}">
<p>2123</p>
</Modal>
<Modal <Modal
v-model="modal1" v-model="modal1"
title="Common Modal dialog box title" title="Common Modal dialog box title"
@ -52,6 +58,7 @@
data () { data () {
return { return {
modal1: false, modal1: false,
modal2: false,
cityList: [ cityList: [
{ {
value: 'New York', value: 'New York',

View file

@ -1,8 +1,13 @@
<style>
.ivu-steps{
background: greenyellow;
}
</style>
<template> <template>
<div> <div>
<Steps :current="index"> <Steps :current="index">
<!--<Step title="开始"></Step>--> <!--<Step title="开始"></Step>-->
<Step v-for="(item, index) in activitiList" :title="item.approveUserName" :key="index" :content="item.startTime"></Step> <Step v-for="(item, index) in activitiList" :title="item.approveUserName" :key="index"></Step>
<!--<Step title="结束"></Step>--> <!--<Step title="结束"></Step>-->
</Steps> </Steps>
<Button @click="change">change</Button> <Button @click="change">change</Button>

View file

@ -1,6 +1,6 @@
{ {
"name": "iview", "name": "iview",
"version": "3.4.2", "version": "3.5.1",
"title": "iView", "title": "iView",
"description": "A high quality UI components Library with Vue.js", "description": "A high quality UI components Library with Vue.js",
"homepage": "http://www.iviewui.com", "homepage": "http://www.iviewui.com",

View file

@ -95,7 +95,7 @@
transfer: { transfer: {
type: Boolean, type: Boolean,
default () { default () {
return this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer; return !this.$IVIEW || this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
} }
}, },
name: { name: {

View file

@ -4,10 +4,10 @@
<Icon type="ios-arrow-back"></Icon> <Icon type="ios-arrow-back"></Icon>
</button> </button>
<div :class="[prefixCls + '-list']"> <div :class="[prefixCls + '-list']">
<div :class="[prefixCls + '-track', showCopyTrack ? '' : 'higher']" :style="trackStyles" ref="originTrack"> <div :class="[prefixCls + '-track', showCopyTrack ? '' : 'higher']" :style="trackStyles" ref="originTrack" @click="handlerClickEvent('currentIndex')">
<slot></slot> <slot></slot>
</div> </div>
<div :class="[prefixCls + '-track', showCopyTrack ? 'higher' : '']" :style="copyTrackStyles" ref="copyTrack" v-if="loop"> <div :class="[prefixCls + '-track', showCopyTrack ? 'higher' : '']" :style="copyTrackStyles" @click="handlerClickEvent('copyTrackIndex')" ref="copyTrack" v-if="loop">
</div> </div>
</div> </div>
<button type="button" :class="arrowClasses" class="right" @click="arrowEvent(1)"> <button type="button" :class="arrowClasses" class="right" @click="arrowEvent(1)">
@ -113,10 +113,13 @@
]; ];
}, },
trackStyles () { trackStyles () {
// #6076
const visibleStyle = this.trackIndex === -1 ? 'hidden' : 'visible';
return { return {
width: `${this.trackWidth}px`, width: `${this.trackWidth}px`,
transform: `translate3d(${-this.trackOffset}px, 0px, 0px)`, transform: `translate3d(${-this.trackOffset}px, 0px, 0px)`,
transition: `transform 500ms ${this.easing}` transition: `transform 500ms ${this.easing}`,
visibility : visibleStyle
}; };
}, },
copyTrackStyles () { copyTrackStyles () {
@ -125,7 +128,7 @@
transform: `translate3d(${-this.trackCopyOffset}px, 0px, 0px)`, transform: `translate3d(${-this.trackCopyOffset}px, 0px, 0px)`,
transition: `transform 500ms ${this.easing}`, transition: `transform 500ms ${this.easing}`,
position: 'absolute', position: 'absolute',
top: 0 //top: 0
}; };
}, },
arrowClasses () { arrowClasses () {
@ -142,6 +145,9 @@
} }
}, },
methods: { methods: {
handlerClickEvent(type){
this.$emit('on-click',this[type]);
},
// find option component // find option component
findChild (cb) { findChild (cb) {
const find = function (child) { const find = function (child) {
@ -195,8 +201,8 @@
child.width = this.listWidth; child.width = this.listWidth;
child.height = typeof this.height === 'number' ? `${this.height}px` : this.height; child.height = typeof this.height === 'number' ? `${this.height}px` : this.height;
}); });
const slidesLength = this.slides.length || 0
this.trackWidth = (this.slides.length || 0) * this.listWidth; this.trackWidth = slidesLength * this.listWidth;
}, },
// use when slot changed // use when slot changed
slotChange () { slotChange () {

View file

@ -207,7 +207,7 @@
for (let i = 0; i < arr.length; i++) { for (let i = 0; i < arr.length; i++) {
let item = arr[i]; let item = arr[i];
item.__label = label ? label + ' / ' + item.label : item.label; item.__label = label ? label + ' / ' + item.label : item.label;
item.__value = value ? value + ',' + item.value : item.value; item.__value = value ? [...value, item.value] : [item.value];
if (item.children && item.children.length) { if (item.children && item.children.length) {
getSelections(item.children, item.__label, item.__value); getSelections(item.children, item.__label, item.__value);
@ -328,7 +328,7 @@
this.query = ''; this.query = '';
this.$refs.input.currentValue = ''; this.$refs.input.currentValue = '';
const oldVal = JSON.stringify(this.currentValue); const oldVal = JSON.stringify(this.currentValue);
this.currentValue = item.value.split(','); this.currentValue = item.value;
// use setTimeout for #4786, can not use nextTick, because @on-find-selected use nextTick // use setTimeout for #4786, can not use nextTick, because @on-find-selected use nextTick
setTimeout(() => { setTimeout(() => {
this.emitValue(this.currentValue, oldVal); this.emitValue(this.currentValue, oldVal);
@ -351,7 +351,7 @@
if ('__label' in new_item) { if ('__label' in new_item) {
delete new_item.__label; delete new_item.__label;
} }
if ('children' in new_item && new_item.children.length) { if (Array.isArray(new_item.children) && new_item.children.length) {
new_item.children = new_item.children.map(i => deleteData(i)); new_item.children = new_item.children.map(i => deleteData(i));
} }
return new_item; return new_item;

View file

@ -82,7 +82,10 @@
default: false default: false
}, },
styles: { styles: {
type: Object type: Object,
default() {
return {};
}
}, },
className: { className: {
type: String type: String
@ -202,8 +205,10 @@
let style = {}; let style = {};
if (this.draggable) { if (this.draggable) {
if (this.dragData.x !== null) style.left = `${this.dragData.x}px`; let customTop = this.styles.top ? parseFloat(this.styles.top) : 0;
if (this.dragData.y !== null) style.top = `${this.dragData.y}px`; let customLeft = this.styles.left ? parseFloat(this.styles.left) : 0;
if (this.dragData.x !== null) style.left = `${this.dragData.x - customLeft}px`;
if (this.dragData.y !== null) style.top = `${this.dragData.y - customTop}px`;
const width = parseInt(this.width); const width = parseInt(this.width);
const styleWidth = { const styleWidth = {
width: width <= 100 ? `${width}%` : `${width}px` width: width <= 100 ? `${width}%` : `${width}px`

View file

@ -3,7 +3,7 @@
<li <li
:title="t('i.page.prev')" :title="t('i.page.prev')"
:class="prevClasses" :class="prevClasses"
@click="prev"> @click.stop="prev">
<a><i class="ivu-icon ivu-icon-ios-arrow-back"></i></a> <a><i class="ivu-icon ivu-icon-ios-arrow-back"></i></a>
</li> </li>
<div :class="simplePagerClasses" :title="currentPage + '/' + allPages"> <div :class="simplePagerClasses" :title="currentPage + '/' + allPages">
@ -21,7 +21,7 @@
<li <li
:title="t('i.page.next')" :title="t('i.page.next')"
:class="nextClasses" :class="nextClasses"
@click="next"> @click.stop="next">
<a><i class="ivu-icon ivu-icon-ios-arrow-forward"></i></a> <a><i class="ivu-icon ivu-icon-ios-arrow-forward"></i></a>
</li> </li>
</ul> </ul>
@ -32,24 +32,24 @@
<li <li
:title="t('i.page.prev')" :title="t('i.page.prev')"
:class="prevClasses" :class="prevClasses"
@click="prev"> @click.stop="prev">
<a><template v-if="prevText !== ''">{{ prevText }}</template><i v-else class="ivu-icon ivu-icon-ios-arrow-back"></i></a> <a><template v-if="prevText !== ''">{{ prevText }}</template><i v-else class="ivu-icon ivu-icon-ios-arrow-back"></i></a>
</li> </li>
<li title="1" :class="firstPageClasses" @click="changePage(1)"><a>1</a></li> <li title="1" :class="firstPageClasses" @click.stop="changePage(1)"><a>1</a></li>
<li :title="t('i.page.prev5')" v-if="currentPage > 5" :class="[prefixCls + '-item-jump-prev']" @click="fastPrev"><a><i class="ivu-icon ivu-icon-ios-arrow-back"></i></a></li> <li :title="t('i.page.prev5')" v-if="currentPage > 5" :class="[prefixCls + '-item-jump-prev']" @click.stop="fastPrev"><a><i class="ivu-icon ivu-icon-ios-arrow-back"></i></a></li>
<li :title="currentPage - 3" v-if="currentPage === 5" :class="[prefixCls + '-item']" @click="changePage(currentPage - 3)"><a>{{ currentPage - 3 }}</a></li> <li :title="currentPage - 3" v-if="currentPage === 5" :class="[prefixCls + '-item']" @click.stop="changePage(currentPage - 3)"><a>{{ currentPage - 3 }}</a></li>
<li :title="currentPage - 2" v-if="currentPage - 2 > 1" :class="[prefixCls + '-item']" @click="changePage(currentPage - 2)"><a>{{ currentPage - 2 }}</a></li> <li :title="currentPage - 2" v-if="currentPage - 2 > 1" :class="[prefixCls + '-item']" @click.stop="changePage(currentPage - 2)"><a>{{ currentPage - 2 }}</a></li>
<li :title="currentPage - 1" v-if="currentPage - 1 > 1" :class="[prefixCls + '-item']" @click="changePage(currentPage - 1)"><a>{{ currentPage - 1 }}</a></li> <li :title="currentPage - 1" v-if="currentPage - 1 > 1" :class="[prefixCls + '-item']" @click.stop="changePage(currentPage - 1)"><a>{{ currentPage - 1 }}</a></li>
<li :title="currentPage" v-if="currentPage != 1 && currentPage != allPages" :class="[prefixCls + '-item',prefixCls + '-item-active']"><a>{{ currentPage }}</a></li> <li :title="currentPage" v-if="currentPage != 1 && currentPage != allPages" :class="[prefixCls + '-item',prefixCls + '-item-active']"><a>{{ currentPage }}</a></li>
<li :title="currentPage + 1" v-if="currentPage + 1 < allPages" :class="[prefixCls + '-item']" @click="changePage(currentPage + 1)"><a>{{ currentPage + 1 }}</a></li> <li :title="currentPage + 1" v-if="currentPage + 1 < allPages" :class="[prefixCls + '-item']" @click.stop="changePage(currentPage + 1)"><a>{{ currentPage + 1 }}</a></li>
<li :title="currentPage + 2" v-if="currentPage + 2 < allPages" :class="[prefixCls + '-item']" @click="changePage(currentPage + 2)"><a>{{ currentPage + 2 }}</a></li> <li :title="currentPage + 2" v-if="currentPage + 2 < allPages" :class="[prefixCls + '-item']" @click.stop="changePage(currentPage + 2)"><a>{{ currentPage + 2 }}</a></li>
<li :title="currentPage + 3" v-if="allPages - currentPage === 4" :class="[prefixCls + '-item']" @click="changePage(currentPage + 3)"><a>{{ currentPage + 3 }}</a></li> <li :title="currentPage + 3" v-if="allPages - currentPage === 4" :class="[prefixCls + '-item']" @click.stop="changePage(currentPage + 3)"><a>{{ currentPage + 3 }}</a></li>
<li :title="t('i.page.next5')" v-if="allPages - currentPage >= 5" :class="[prefixCls + '-item-jump-next']" @click="fastNext"><a><i class="ivu-icon ivu-icon-ios-arrow-forward"></i></a></li> <li :title="t('i.page.next5')" v-if="allPages - currentPage >= 5" :class="[prefixCls + '-item-jump-next']" @click.stop="fastNext"><a><i class="ivu-icon ivu-icon-ios-arrow-forward"></i></a></li>
<li :title="allPages" v-if="allPages > 1" :class="lastPageClasses" @click="changePage(allPages)"><a>{{ allPages }}</a></li> <li :title="allPages" v-if="allPages > 1" :class="lastPageClasses" @click.stop="changePage(allPages)"><a>{{ allPages }}</a></li>
<li <li
:title="t('i.page.next')" :title="t('i.page.next')"
:class="nextClasses" :class="nextClasses"
@click="next"> @click.stop="next">
<a><template v-if="nextText !== ''">{{ nextText }}</template><i v-else class="ivu-icon ivu-icon-ios-arrow-forward"></i></a> <a><template v-if="nextText !== ''">{{ nextText }}</template><i v-else class="ivu-icon ivu-icon-ios-arrow-forward"></i></a>
</li> </li>
<Options <Options

View file

@ -5,7 +5,7 @@
<div :class="bgClasses" :style="bgStyle"><div class="ivu-progress-inner-text" v-if="textInside">{{ percent }}%</div></div><div :class="successBgClasses" :style="successBgStyle"></div> <div :class="bgClasses" :style="bgStyle"><div class="ivu-progress-inner-text" v-if="textInside">{{ percent }}%</div></div><div :class="successBgClasses" :style="successBgStyle"></div>
</div> </div>
</div> </div>
<span v-if="!hideInfo" :class="textClasses"> <span v-if="!hideInfo && !textInside" :class="textClasses">
<slot> <slot>
<span v-if="isStatus" :class="textInnerClasses"> <span v-if="isStatus" :class="textInnerClasses">
<Icon :type="statusIcon"></Icon> <Icon :type="statusIcon"></Icon>

View file

@ -558,31 +558,32 @@
this.filterQueryChange = false; this.filterQueryChange = false;
}, },
handleKeydown (e) { handleKeydown (e) {
if (e.key === 'Backspace'){ const key = e.key || e.code;
if ( key === 'Backspace'){
return; // so we don't call preventDefault return; // so we don't call preventDefault
} }
if (this.visible) { if (this.visible) {
e.preventDefault(); e.preventDefault();
if (e.key === 'Tab'){ if ( key === 'Tab'){
e.stopPropagation(); e.stopPropagation();
} }
// Esc slide-up // Esc slide-up
if (e.key === 'Escape') { if ( key === 'Escape') {
e.stopPropagation(); e.stopPropagation();
this.hideMenu(); this.hideMenu();
} }
// next // next
if (e.key === 'ArrowUp') { if ( key === 'ArrowUp') {
this.navigateOptions(-1); this.navigateOptions(-1);
} }
// prev // prev
if (e.key === 'ArrowDown') { if ( key === 'ArrowDown') {
this.navigateOptions(1); this.navigateOptions(1);
} }
// enter // enter
if (e.key === 'Enter') { if ( key === 'Enter') {
if (this.focusIndex === -1) return this.hideMenu(); if (this.focusIndex === -1) return this.hideMenu();
const optionComponent = this.flatOptions[this.focusIndex]; const optionComponent = this.flatOptions[this.focusIndex];

View file

@ -967,7 +967,9 @@
this.$on('on-visible-change', (val) => { this.$on('on-visible-change', (val) => {
if (val) { if (val) {
this.$nextTick(()=>{
this.handleResize(); this.handleResize();
});
} }
}); });
}, },

View file

@ -1,5 +1,5 @@
<template> <template>
<div :class="prefixCls" v-if="show" :style="contentStyle"><slot></slot></div> <div :class="prefixCls" v-show="show" :style="contentStyle"><slot></slot></div>
</template> </template>
<script> <script>
const prefixCls = 'ivu-tabs-tabpane'; const prefixCls = 'ivu-tabs-tabpane';

View file

@ -24,15 +24,14 @@
&-track { &-track {
position: relative; position: relative;
top: 0; top: 100%;
left: 0; left: 0;
display: block; display: block;
overflow: hidden; overflow: hidden;
z-index: 1; z-index: 1;
&.higher { &.higher {
z-index: 2; z-index: 2;
top: 0;
} }
} }

View file

@ -100,14 +100,14 @@
} }
} }
&-horizontal { &-horizontal {
.@{split-prefix-cls}-trigger-con { >.@{split-prefix-cls}-trigger-con {
top: 50%; top: 50%;
height: 100%; height: 100%;
width: 0; width: 0;
} }
} }
&-vertical { &-vertical {
.@{split-prefix-cls}-trigger-con { >.@{split-prefix-cls}-trigger-con {
left: 50%; left: 50%;
height: 0; height: 0;
width: 100%; width: 100%;

View file

@ -128,9 +128,6 @@
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
} }
.@{steps-prefix-cls}-head {
background: #fff;
}
.@{steps-prefix-cls}-head-inner { .@{steps-prefix-cls}-head-inner {
display: block; display: block;
@ -172,8 +169,6 @@
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
color: #666; color: #666;
background: #fff;
> a:first-child:last-child { > a:first-child:last-child {
color: #666; color: #666;
} }
@ -342,12 +337,39 @@
&.@{steps-prefix-cls}-hidden { &.@{steps-prefix-cls}-hidden {
visibility: hidden; visibility: hidden;
} }
.@{steps-prefix-cls}-tail {
display: none;
}
.@{steps-prefix-cls}-content { .@{steps-prefix-cls}-content {
//max-width: 100px; //max-width: 100px;
padding-left: 35px; padding-left: 45px;
} }
.@{steps-prefix-cls}-item:not(:first-child) .@{steps-prefix-cls}-head { .@{steps-prefix-cls}-item:not(:first-child) .@{steps-prefix-cls}-head {
padding-left: 10px; padding-left: 10px;
margin-left: -10px; }
.@{steps-prefix-cls}-item {
overflow: hidden;
&:last-child .@{steps-prefix-cls}-title:after{
display: none;
}
}
.@{steps-prefix-cls}-title {
position: relative;
&:after{
content: '';
position: absolute;
width: 9999px;
height: 1px;
left: 100%;
top: 50%;
background: @border-color-split;
}
}
.@{steps-prefix-cls}-status-finish {
.@{steps-prefix-cls}-title:after {
background: @primary-color;
transition: all @transition-time @ease-in-out;
opacity: 1;
}
} }
} }

558
yarn.lock

File diff suppressed because it is too large Load diff