Commit c39f609dfc9832a3c44a92804a3dbe344e3ec4fe
1 parent
aa63ee55a2
Exists in
master
and in
3 other branches
fixed validation and removw overflow image in view dialog
Showing
1 changed file
with
50 additions
and
29 deletions
Show diff stats
src/pages/Gallery/gallery.vue
... | ... | @@ -204,7 +204,7 @@ |
204 | 204 | <v-card-actions> |
205 | 205 | <v-btn round dark @click.native="close">Cancel</v-btn> |
206 | 206 | <v-spacer></v-spacer> |
207 | - <v-btn round dark @click="save">Save</v-btn> | |
207 | + <v-btn round dark @click="save" :loading="editGalleryLoading">Save</v-btn> | |
208 | 208 | </v-card-actions> |
209 | 209 | </v-flex> |
210 | 210 | </v-layout> |
... | ... | @@ -216,7 +216,7 @@ |
216 | 216 | |
217 | 217 | <!-- ****** PROFILE VIEW Gallery ****** --> |
218 | 218 | |
219 | - <v-dialog v-model="dialog1" max-width="940px"> | |
219 | + <v-dialog v-model="dialog1" max-width="940px" scrollable> | |
220 | 220 | <v-card> |
221 | 221 | <v-toolbar color="grey lighten-2" flat> |
222 | 222 | <v-spacer></v-spacer> |
... | ... | @@ -226,23 +226,31 @@ |
226 | 226 | <v-spacer></v-spacer> |
227 | 227 | <v-icon @click="close1">close</v-icon> |
228 | 228 | </v-toolbar> |
229 | - <v-flex align-center justify-center layout text-xs-center> | |
230 | - <v-avatar size="100" v-if="editedItem.imageUrl == ''" class="mt-4 pa-2"> | |
231 | - <img src="/static/icon/user.png" width="240" height="180" /> | |
232 | - </v-avatar> | |
233 | - <span | |
234 | - v-for="(image,i) in editedItem.imageUrl" | |
235 | - :key="i" | |
236 | - class="mt-4 pa-2" | |
237 | - v-if="editedItem.imageUrl" | |
238 | - > | |
239 | - <img :src="image.imageLink" alt="Gallery" width="240" height="180" class="imgNews" /> | |
240 | - </span> | |
241 | - </v-flex> | |
242 | - <v-card-text> | |
229 | + <v-card-text > | |
230 | + <v-layout row wrap> | |
231 | + <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center my-4"> | |
232 | + <v-avatar size="100" v-if="editedItem.imageUrl == ''" class="mt-4 pa-2"> | |
233 | + <img src="/static/icon/user.png" width="240" height="180" /> | |
234 | + </v-avatar> | |
235 | + <span | |
236 | + v-for="(image,i) in editedItem.imageUrl" | |
237 | + :key="i" | |
238 | + class="mt-4 pa-2" | |
239 | + v-if="editedItem.imageUrl" | |
240 | + > | |
241 | + <img | |
242 | + :src="image.imageLink" | |
243 | + alt="Gallery" | |
244 | + width="240" | |
245 | + height="180" | |
246 | + class="imgNews" | |
247 | + /> | |
248 | + </span> | |
249 | + </v-flex> | |
250 | + </v-layout> | |
243 | 251 | <v-container grid-list-md> |
244 | 252 | <v-layout wrap> |
245 | - <v-flex> | |
253 | + <v-flex xs12> | |
246 | 254 | <v-layout> |
247 | 255 | <v-flex xs5 sm6> |
248 | 256 | <h5 class="right my-1"> |
... | ... | @@ -306,12 +314,18 @@ |
306 | 314 | <span v-for="(image,_id) in props.item.imageUrl" class="pa-2"> |
307 | 315 | <img :src="image.imageLink" alt="newsImage" width="100" height="70" /> |
308 | 316 | </span> |
317 | + <img | |
318 | + src="/static/icon/user.png" | |
319 | + v-if="props.item.imageUrl == '' && editFiles == ''" | |
320 | + width="60" | |
321 | + alt="Gallery" | |
322 | + /> | |
309 | 323 | </td> |
310 | 324 | <td id="td" class="text-xs-center">{{ props.item.title}}</td> |
311 | 325 | <td id="td" class="text-xs-center">{{ props.item.description}}</td> |
312 | 326 | |
313 | 327 | <td id="td" class="text-xs-center"> |
314 | - <span> | |
328 | + <span> | |
315 | 329 | <v-tooltip top> |
316 | 330 | <img |
317 | 331 | slot="activator" |
... | ... | @@ -537,6 +551,7 @@ export default { |
537 | 551 | valid: true, |
538 | 552 | isActive: true, |
539 | 553 | newActive: false, |
554 | + editGalleryLoading: false, | |
540 | 555 | addclass: [], |
541 | 556 | addSection: [], |
542 | 557 | finds: [{ value: "" }], |
... | ... | @@ -644,7 +659,7 @@ export default { |
644 | 659 | e.target.result |
645 | 660 | ); |
646 | 661 | }; |
647 | - console.log("uploadImage=======>", this.files); | |
662 | + console.log("uploadeditFilesImage=======>", this.editFiles); | |
648 | 663 | }); |
649 | 664 | fr.readAsDataURL(file); |
650 | 665 | return getResult.then(file => { |
... | ... | @@ -658,7 +673,7 @@ export default { |
658 | 673 | // }); |
659 | 674 | } else { |
660 | 675 | this.editImageName = ""; |
661 | - this.editFiles = ""; | |
676 | + this.editFiles = []; | |
662 | 677 | } |
663 | 678 | }, |
664 | 679 | getGalleryList() { |
... | ... | @@ -707,17 +722,17 @@ export default { |
707 | 722 | } |
708 | 723 | ) |
709 | 724 | .then(response => { |
710 | - if ((this.snackbar = true)) { | |
711 | - this.text = "Successfully delete Existing Gallery"; | |
712 | - } | |
725 | + this.snackbar = true; | |
726 | + this.text = "Successfully delete Existing Gallery"; | |
713 | 727 | this.getGalleryList(); |
714 | 728 | }) |
715 | 729 | .catch(error => { |
716 | 730 | // console.log(error); |
731 | + this.snackbar = true; | |
732 | + this.text = error.response.data.message; | |
717 | 733 | }); |
718 | 734 | }, |
719 | 735 | deleteImage(imageId, id) { |
720 | - console.log("imageId", imageId, "id", id); | |
721 | 736 | let deleteImages = { |
722 | 737 | galleryId: id, |
723 | 738 | imageId: imageId |
... | ... | @@ -758,7 +773,6 @@ export default { |
758 | 773 | this.dialog1 = false; |
759 | 774 | }, |
760 | 775 | submit() { |
761 | - this.loading = true; | |
762 | 776 | for (let i = 0; i < this.finds.length; i++) { |
763 | 777 | this.addGallery.youTubeLinkUrl.push(this.finds[i].value); |
764 | 778 | } |
... | ... | @@ -780,6 +794,7 @@ export default { |
780 | 794 | description: this.addGallery.description, |
781 | 795 | upload: this.addGallery.upload |
782 | 796 | }; |
797 | + // this.loading = true; | |
783 | 798 | http() |
784 | 799 | .post("/createGallery", galleryData) |
785 | 800 | .then(response => { |
... | ... | @@ -791,9 +806,9 @@ export default { |
791 | 806 | this.files = ""; |
792 | 807 | }) |
793 | 808 | .catch(error => { |
794 | - if ((this.snackbar = true)) { | |
795 | - this.text = error.response.data.message; | |
796 | - } | |
809 | + this.snackbar = true; | |
810 | + this.text = error.response.data.message; | |
811 | + this.loading = false; | |
797 | 812 | }); |
798 | 813 | } else if (this.addGallery.youTubeLinkUrl) { |
799 | 814 | http() |
... | ... | @@ -825,6 +840,7 @@ export default { |
825 | 840 | for (let i = 0; i < this.updates.length; i++) { |
826 | 841 | linkUrl.push(this.updates[i].youTubeLink); |
827 | 842 | } |
843 | + console.log("uploadeditFilesImage--BBBBBBBBB", this.editFiles); | |
828 | 844 | if (this.editFiles) { |
829 | 845 | var ary = []; |
830 | 846 | var imageData = []; |
... | ... | @@ -853,6 +869,7 @@ export default { |
853 | 869 | title: this.editedItem.title |
854 | 870 | }; |
855 | 871 | } |
872 | + this.editGalleryLoading = true; | |
856 | 873 | http() |
857 | 874 | .put("/updateGallery", updateData) |
858 | 875 | .then(response => { |
... | ... | @@ -860,9 +877,13 @@ export default { |
860 | 877 | this.close(); |
861 | 878 | this.snackbar = true; |
862 | 879 | this.text = response.data.message; |
880 | + this.editGalleryLoading = false; | |
881 | + (this.editImageName = ""), (this.editFiles = []); | |
863 | 882 | }) |
864 | 883 | .catch(error => { |
865 | - console.log(error); | |
884 | + this.editGalleryLoading = false; | |
885 | + this.snackbar = true; | |
886 | + this.text = error.response.data.message; | |
866 | 887 | }); |
867 | 888 | }, |
868 | 889 | getAllClasses() { | ... | ... |