alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(Uploader): add preview-cover slot (#6707)

Browse Source 
* feat(Uploader): add preview-cover slot

* docs: upd

* fix: case name
This commit is contained in:
neverland
2020-07-05 20:09:20 +08:00
committed by GitHub
parent 340a90feaa
commit 5793481ba4
8 changed files with 240 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/uploader/test/__snapshots__/demo.spec.js.snap
+34 -9
View File
@@ -32,14 +32,6 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
</div>
<div>
<div class="van-uploader">
<div class="van-uploader__wrapper van-uploader__wrapper--disabled">
<div class="van-uploader__upload"><i class="van-icon van-icon-photograph van-uploader__upload-icon">
<!----></i><input type="file" accept="image/*" disabled="disabled" class="van-uploader__input"></div>
</div>
</div>
</div>
<div>
<div class="van-uploader">
<div class="van-uploader__wrapper">
@@ -87,6 +79,13 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-uploader">
<div class="van-uploader__wrapper">
<div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/sand.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div><i class="van-icon van-icon-clear van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__upload"><i class="van-icon van-icon-photograph van-uploader__upload-icon">
<!----></i><input multiple="multiple" type="file" accept="image/*" class="van-uploader__input"></div>
</div>
@@ -96,7 +95,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-uploader">
<div class="van-uploader__wrapper">
<div class="van-uploader__input-wrapper"><button class="van-button van-button--primary van-button--normal">
<div class="van-button__content"><i class="van-icon van-icon-photo van-button__icon">
<div class="van-button__content"><i class="van-icon van-icon-plus van-button__icon">
<!----></i><span class="van-button__text">
上传文件
</span></div>
@@ -104,6 +103,24 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
</div>
<div>
<div class="van-uploader">
<div class="van-uploader__wrapper">
<div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
<div class="van-uploader__preview-cover">
<div class="preview-cover van-ellipsis">图片名称</div>
</div>
</div><i class="van-icon van-icon-clear van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__upload"><i class="van-icon van-icon-photograph van-uploader__upload-icon">
<!----></i><input type="file" accept="image/*" class="van-uploader__input"></div>
</div>
</div>
</div>
<div>
<div class="van-uploader">
<div class="van-uploader__wrapper">
@@ -112,5 +129,13 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
</div>
<div>
<div class="van-uploader">
<div class="van-uploader__wrapper van-uploader__wrapper--disabled">
<div class="van-uploader__upload"><i class="van-icon van-icon-photograph van-uploader__upload-icon">
<!----></i><input type="file" accept="image/*" disabled="disabled" class="van-uploader__input"></div>
</div>
</div>
</div>
</div>
`;
src/uploader/test/__snapshots__/index.spec.js.snap
+25
View File
@@ -67,6 +67,31 @@ exports[`max-count prop 1`] = `
</div>
`;
exports[`preview-cover slot 1`] = `
<div class="van-uploader">
<div class="van-uploader__wrapper">
<div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
<div class="van-uploader__preview-cover">https://img.yzcdn.cn/vant/cat.jpeg</div>
</div><i class="van-icon van-icon-clear van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
<div class="van-uploader__preview-cover">https://img.yzcdn.cn/vant/cat.jpeg</div>
</div><i class="van-icon van-icon-clear van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__upload"><i class="van-icon van-icon-photograph van-uploader__upload-icon">
<!----></i><input type="file" accept="image/*" class="van-uploader__input"></div>
</div>
</div>
`;
exports[`preview-size prop 1`] = `
<div class="van-uploader">
<div class="van-uploader__wrapper">
src/uploader/test/index.spec.js
+13
View File
@@ -507,3 +507,16 @@ test('multiFile upload filter max-size file', async () => {
expect(wrapper.emitted('oversize')[0]).toBeTruthy();
});
test('preview-cover slot', () => {
const wrapper = mount(Uploader, {
propsData: {
fileList: [{ url: IMAGE }, { url: IMAGE }],
},
scopedSlots: {
'preview-cover': (item) => item.url,
},
});
expect(wrapper).toMatchSnapshot();
});