Skip to content

Commit 242d986

Browse files
committed
Add image_filter, delete the url in md context after $imgDelByFilename, hinesboy#101
1 parent a26b646 commit 242d986

File tree

3 files changed

+42
-15
lines changed

3 files changed

+42
-15
lines changed

src/components/s-md-toolbar-left.vue

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@
5757
<div class="op-image popup-dropdown" v-show="s_img_dropdown_open">
5858
<div class="dropdown-item" @click.stop="$toggle_imgLinkAdd('imagelink')" title="ctrl+alt+l"><span>{{d_words.tl_image}}</span></div>
5959
<div class="dropdown-item" style="overflow: hidden">
60-
<input type="file" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg" @change="$imgAdd($event)" :key="img_file[0][0]"/>{{d_words.tl_upload}}
60+
<input type="file" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg" @change="$imgAdd($event)" :key="img_file[0][0]" multiple="multiple"/>{{d_words.tl_upload}}
6161
</div>
6262

6363
<div class="dropdown-item dropdown-images" v-if="index > 0" v-for="(item, index) in img_file" @click.stop="$imgFileListClick(index)">
@@ -128,6 +128,10 @@
128128
d_words: {
129129
type: Object,
130130
required: true
131+
},
132+
image_filter: {
133+
type: Function,
134+
default: null,
131135
}
132136
},
133137
data() {
@@ -166,9 +170,19 @@
166170
this.num = this.num + 1;
167171
this.$emit('imgAdd', this.img_file[1][0], $file);
168172
},
173+
$imgFilesAdd($files) {
174+
// valid means if the image_filter exist.
175+
let valid = (typeof this.image_filter == 'function');
176+
for(let i = 0;i < $files.length;i++) {
177+
if(valid && this.image_filter($files[i]) === true) {
178+
this.$imgFileAdd($files[i]);
179+
} else if(!valid && $files[i].type.match(/^image\//i)) {
180+
this.$imgFileAdd($files[i]);
181+
}
182+
}
183+
},
169184
$imgAdd($e) {
170-
// 新增加
171-
this.$imgFileAdd($e.target.files[0]);
185+
this.$imgFilesAdd($e.target.files);
172186
},
173187
$imgDel(pos) {
174188
this.$emit('imgDel', this.img_file[pos]);
@@ -179,8 +193,7 @@
179193
var pos = 0;
180194
while (this.img_file.length > pos) {
181195
if (this.img_file[pos][0] == filename) {
182-
this.$emit('imgDel', filename);
183-
this.img_file.splice(pos, 1);
196+
this.$imgDel(pos);
184197
return true;
185198
}
186199
pos += 1;

src/dev/app.vue

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,13 @@
1818
</h2>
1919
<button @click="uploadimg">upload</button>
2020
<button @click="imgreplace">imgreplace</button>
21+
<input type="text" v-model="imgName" />
22+
<button @click="imgdelete">delete</button>
2123
<mavon-editor ref=md :subfield="subfield" :toolbarsFlag="toolbarsFlag" :editable="editable"
2224
:language="d_language" @change="change" @save="saveone" :ishljs="true" class="item-editor" v-model="help1"
2325
:external_link="external_link"
24-
@imgAdd="$imgAdd" @imgDel="$imgDel" @subfieldtoggle="$subfieldtoggle" @previewtoggle="$previewtoggle"></mavon-editor>
26+
@imgAdd="$imgAdd" @imgDel="$imgDel" @subfieldtoggle="$subfieldtoggle" @previewtoggle="$previewtoggle"
27+
:image_filter="image_filter"></mavon-editor>
2528

2629
<button ref="diy" type="button" @click="$click('selftest')" class="op-icon fa fa-mavon-align-left"
2730
aria-hidden="true" title="自定义"></button>
@@ -119,7 +122,13 @@
119122
preview: true, // 预览
120123
/* 1.4.2 */
121124
navigation: true, // 导航目录
122-
}
125+
},
126+
image_filter: function($files) {
127+
console.log('image_filter files:', $files);
128+
// console.log('here for you', $files);
129+
return true;
130+
},
131+
imgName: '',
123132
}
124133
},
125134
created () {
@@ -218,6 +227,11 @@
218227
},
219228
$previewtoggle(flag , value) {
220229
console.log('preview toggle' + flag)
230+
},
231+
imgdelete() {
232+
var md = this.$refs.md;
233+
var toolbar_left = md.$refs.toolbar_left;
234+
toolbar_left.$imgDelByFilename(this.imgName);
221235
}
222236
},
223237
watch: {

src/mavon-editor.vue

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<div class="v-note-op" v-show="toolbarsFlag">
55
<s-md-toolbar-left ref="toolbar_left" :editable="editable" :d_words="d_words"
66
@toolbar_left_click="toolbar_left_click" @toolbar_left_addlink="toolbar_left_addlink" :toolbars="toolbars"
7-
@imgAdd="$imgAdd" @imgDel="$imgDel" @imgTouch="$imgTouch"/>
7+
@imgAdd="$imgAdd" @imgDel="$imgDel" @imgTouch="$imgTouch" :image_filter="image_filter"/>
88
<s-md-toolbar-right ref="toolbar_right" :d_words="d_words" @toolbar_right_click="toolbar_right_click"
99
:toolbars="toolbars"
1010
:s_subfield="s_subfield"
@@ -168,6 +168,10 @@
168168
type: [Object, Boolean],
169169
default: true
170170
},
171+
image_filter: {
172+
type: Function,
173+
default: null,
174+
}
171175
},
172176
data() {
173177
return {
@@ -317,11 +321,7 @@
317321
var files = dataTransfer.files;
318322
if (files.length > 0) {
319323
$e.preventDefault();
320-
for (var i = 0; i < files.length; i++) {
321-
if(files[i].type.match(/^image\//i)) {
322-
this.$refs.toolbar_left.$imgFileAdd(files[i]);
323-
}
324-
}
324+
this.$refs.toolbar_left.$imgFilesAdd(files);
325325
}
326326
}
327327
},
@@ -338,9 +338,9 @@
338338
break;
339339
}
340340
}
341-
if (item && item.kind === 'file' && item.type.match(/^image\//i)) {
341+
if (item && item.kind === 'file') {
342342
var oFile = item.getAsFile();
343-
this.$refs.toolbar_left.$imgFileAdd(oFile);
343+
this.$refs.toolbar_left.$imgFilesAdd([oFile,]);
344344
}
345345
}
346346
},

0 commit comments

Comments
 (0)