fix picture file list style

pull/2775/head
baiyaaaaa 2017-02-13 01:47:25 +08:00 committed by 杨奕
parent 65f61e0eba
commit b14b0ef8ac
3 changed files with 18 additions and 3 deletions

View File

@ -33,6 +33,7 @@
height: @width;
cursor: pointer;
line-height: calc(@height - 2);
vertical-align: top;
i {
font-size: 28px;
@ -193,8 +194,9 @@
}
}
@m picture-card {
float: left;
margin: 0;
display: inline;
vertical-align: top;
.el-upload-list__item {
overflow: hidden;
@ -272,6 +274,17 @@
}
}
}
.el-progress {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
bottom: auto;
width: 126px;
.el-progress__text {
top: 50%;
}
}
}
@m picture {
.el-upload-list__item {

View File

@ -227,13 +227,14 @@ export default {
return (
<div>
{ this.listType === 'picture-card' ? uploadList : ''}
{
this.$slots.trigger
? [uploadComponent, this.$slots.default]
: uploadComponent
}
{this.$slots.tip}
{uploadList}
{ this.listType !== 'picture-card' ? uploadList : ''}
</div>
);
}

View File

@ -49,7 +49,8 @@
</span>
<el-progress
v-if="file.status === 'uploading'"
:stroke-width="2"
:type="listType === 'picture-card' ? 'circle' : 'line'"
:stroke-width="listType === 'picture-card' ? 6 : 2"
:percentage="parsePercentage(file.percentage)">
</el-progress>
</li>