#21: Bulk upload now works with the VueJS model
This commit is contained in:
parent
94b2a9d1b6
commit
aef3dfbdeb
57
public/css/blue-twilight.css
vendored
57
public/css/blue-twilight.css
vendored
@ -2,10 +2,32 @@
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.album-expand-handle {
|
||||
cursor: pointer;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.card-header.card-danger {
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.photo .loading {
|
||||
background-color: #ffffff;
|
||||
display: none;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
opacity: 0.8;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.photo .loading img {
|
||||
margin-top: 40px;
|
||||
}
|
||||
html {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -27,11 +49,46 @@ textarea {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
border: solid 1px rgb(221, 221, 221);
|
||||
border-top: 0;
|
||||
padding: 20px;
|
||||
}
|
||||
.tether-element, .tether-element:after, .tether-element:before, .tether-element *, .tether-element *:after, .tether-element *:before {
|
||||
box-sizing: border-box; }
|
||||
|
||||
.tether-element {
|
||||
position: absolute;
|
||||
display: none; }
|
||||
.tether-element.tether-open {
|
||||
display: block; }
|
||||
|
||||
.tether-element.tether-theme-basic {
|
||||
max-width: 100%;
|
||||
max-height: 100%; }
|
||||
.tether-element.tether-theme-basic .tether-content {
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
|
||||
font-family: inherit;
|
||||
background: #fff;
|
||||
color: inherit;
|
||||
padding: 1em;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5em; }
|
||||
|
||||
.tether-element, .tether-element:after, .tether-element:before, .tether-element *, .tether-element *:after, .tether-element *:before {
|
||||
box-sizing: border-box; }
|
||||
|
||||
.tether-element {
|
||||
position: absolute;
|
||||
display: none; }
|
||||
.tether-element.tether-open {
|
||||
display: block; }
|
||||
|
||||
/*!
|
||||
* Bootstrap v4.0.0-alpha.6 (https://getbootstrap.com)
|
||||
* Copyright 2011-2017 The Bootstrap Authors
|
||||
|
2
public/css/blue-twilight.min.css
vendored
2
public/css/blue-twilight.min.css
vendored
@ -1,4 +1,4 @@
|
||||
.admin-sidebar-card{margin-bottom:15px}.card-header.card-danger{color:#fff;font-weight:bold}html{font-size:14px !important}button,input,optgroup,select,textarea{cursor:pointer;font-family:inherit !important}.album-photo-cards .card{margin-bottom:15px}.container,.container-fluid{margin-top:20px}.tab-content{border:solid 1px #ddd;border-top:0;padding:20px}/*!
|
||||
.admin-sidebar-card{margin-bottom:15px}.album-expand-handle{cursor:pointer;margin-top:5px}.card-header.card-danger{color:#fff;font-weight:bold}.photo .loading{background-color:#fff;display:none;height:100%;left:0;opacity:.8;position:absolute;text-align:center;top:0;width:100%;z-index:1000}.photo .loading img{margin-top:40px}html{font-size:14px !important}button,input,optgroup,select,textarea{cursor:pointer;font-family:inherit !important}.album-photo-cards .card{margin-bottom:15px}.container,.container-fluid{margin-top:20px}.hidden{display:none}.tab-content{border:solid 1px #ddd;border-top:0;padding:20px}.tether-element,.tether-element:after,.tether-element:before,.tether-element *,.tether-element *:after,.tether-element *:before{box-sizing:border-box}.tether-element{position:absolute;display:none}.tether-element.tether-open{display:block}.tether-element.tether-theme-basic{max-width:100%;max-height:100%}.tether-element.tether-theme-basic .tether-content{border-radius:5px;box-shadow:0 2px 8px rgba(0,0,0,0.2);font-family:inherit;background:#fff;color:inherit;padding:1em;font-size:1.1em;line-height:1.5em}.tether-element,.tether-element:after,.tether-element:before,.tether-element *,.tether-element *:after,.tether-element *:before{box-sizing:border-box}.tether-element{position:absolute;display:none}.tether-element.tether-open{display:block}/*!
|
||||
* Bootstrap v4.0.0-alpha.6 (https://getbootstrap.com)
|
||||
* Copyright 2011-2017 The Bootstrap Authors
|
||||
* Copyright 2011-2017 Twitter, Inc.
|
||||
|
File diff suppressed because it is too large
Load Diff
17
public/js/blue-twilight.min.js
vendored
17
public/js/blue-twilight.min.js
vendored
File diff suppressed because one or more lines are too long
@ -574,6 +574,10 @@ function UploadPhotosViewModel(album_id, queue_token, language, urls) {
|
||||
.replace(':current', 0)
|
||||
.replace(':total', this.imagesTotal);
|
||||
},
|
||||
uploadBulkFiles: function(event) {
|
||||
this.isBulkUploadInProgress = true;
|
||||
return true;
|
||||
},
|
||||
uploadIndividualFiles: function(event) {
|
||||
var fileSelect = $('input[type=file]', event.target);
|
||||
|
||||
|
@ -44,7 +44,7 @@
|
||||
])
|
||||
</div>
|
||||
|
||||
<form action="{{ route('photos.storeBulk') }}" method="POST" enctype="multipart/form-data">
|
||||
<form action="{{ route('photos.storeBulk') }}" method="POST" enctype="multipart/form-data" v-on:submit="uploadBulkFiles">
|
||||
{{ csrf_field() }}
|
||||
<input type="hidden" name="album_id" value="{{ $album->id }}"/>
|
||||
<input type="hidden" name="queue_token" value="{{ $queue_token }}"/>
|
||||
@ -57,7 +57,7 @@
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button type="submit" class="btn btn-success" data-bind="disable: (isUploadInProgress() || isBulkUploadInProgress()), text: isBulkUploadInProgress() ? '@lang('admin.is_uploading')' : '@lang('forms.upload_action')'"><i class="fa fa-fw fa-upload"></i> @lang('forms.upload_action')</button>
|
||||
<button type="submit" class="btn btn-success" v-bind:disabled="isUploadInProgress || isBulkUploadInProgress" v-html="isUploadInProgress ? '@lang('admin.is_uploading')' : '@lang('forms.upload_action')'"><i class="fa fa-fw fa-upload"></i> @lang('forms.upload_action')</button>
|
||||
</div>
|
||||
</form>
|
||||
@endif
|
||||
|
Loading…
Reference in New Issue
Block a user