mirror of
https://github.com/BookStackApp/BookStack.git
synced 2025-05-29 20:06:18 +08:00
Added custom user avatars
This commit is contained in:
@ -80,15 +80,6 @@
|
||||
imageType: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
resizeWidth: {
|
||||
type: String
|
||||
},
|
||||
resizeHeight: {
|
||||
type: String
|
||||
},
|
||||
resizeCrop: {
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
|
||||
@ -137,21 +128,7 @@
|
||||
},
|
||||
|
||||
returnCallback: function (image) {
|
||||
var _this = this;
|
||||
var isResized = _this.resizeWidth && _this.resizeHeight;
|
||||
|
||||
if (!isResized) {
|
||||
_this.callback(image);
|
||||
return;
|
||||
}
|
||||
|
||||
var cropped = _this.resizeCrop ? 'true' : 'false';
|
||||
var requestString = '/images/thumb/' + image.id + '/' + _this.resizeWidth + '/' + _this.resizeHeight + '/' + cropped;
|
||||
_this.$http.get(requestString, function(data) {
|
||||
image.thumbs.custom = data.url;
|
||||
_this.callback(image);
|
||||
});
|
||||
|
||||
this.callback(image);
|
||||
},
|
||||
|
||||
imageClick: function (image) {
|
||||
|
@ -7,31 +7,89 @@
|
||||
</div>
|
||||
<button class="button" type="button" @click="showImageManager">Select Image</button>
|
||||
<br>
|
||||
<button class="text-button" @click="reset" type="button">Reset</button> <span class="sep">|</span> <button class="text-button neg" v-on:click="remove" type="button">Remove</button>
|
||||
<input type="hidden" :name="name" :id="name" v-model="image">
|
||||
<button class="text-button" @click="reset" type="button">Reset</button> <span v-show="showRemove" class="sep">|</span> <button v-show="showRemove" class="text-button neg" @click="remove" type="button">Remove</button>
|
||||
<input type="hidden" :name="name" :id="name" v-model="value">
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
props: ['currentImage', 'name', 'imageClass', 'defaultImage'],
|
||||
data: function() {
|
||||
return {
|
||||
image: this.currentImage
|
||||
props: {
|
||||
currentImage: {
|
||||
required: true,
|
||||
type: String
|
||||
},
|
||||
currentId: {
|
||||
required: false,
|
||||
default: 'false',
|
||||
type: String
|
||||
},
|
||||
name: {
|
||||
required: true,
|
||||
type: String
|
||||
},
|
||||
defaultImage: {
|
||||
required: true,
|
||||
type: String
|
||||
},
|
||||
imageClass: {
|
||||
required: true,
|
||||
type: String
|
||||
},
|
||||
resizeWidth: {
|
||||
type: String
|
||||
},
|
||||
resizeHeight: {
|
||||
type: String
|
||||
},
|
||||
resizeCrop: {
|
||||
type: Boolean
|
||||
},
|
||||
showRemove: {
|
||||
type: Boolean,
|
||||
default: 'true'
|
||||
}
|
||||
},
|
||||
data: function() {
|
||||
return {
|
||||
image: this.currentImage,
|
||||
value: false
|
||||
}
|
||||
},
|
||||
compiled: function() {
|
||||
this.value = this.currentId === 'false' ? this.currentImage : this.currentId;
|
||||
},
|
||||
methods: {
|
||||
setCurrentValue: function(imageModel, imageUrl) {
|
||||
this.image = imageUrl;
|
||||
this.value = this.currentId === 'false' ? imageUrl : imageModel.id;
|
||||
},
|
||||
showImageManager: function(e) {
|
||||
var _this = this;
|
||||
ImageManager.show(function(image) {
|
||||
_this.image = image.thumbs.custom || image.url;
|
||||
_this.updateImageFromModel(image);
|
||||
});
|
||||
},
|
||||
reset: function() {
|
||||
this.image = '';
|
||||
this.setCurrentValue({id: 0}, this.defaultImage);
|
||||
},
|
||||
remove: function() {
|
||||
this.image = 'none';
|
||||
},
|
||||
updateImageFromModel: function(model) {
|
||||
var _this = this;
|
||||
var isResized = _this.resizeWidth && _this.resizeHeight;
|
||||
|
||||
if (!isResized) {
|
||||
_this.setCurrentValue(model, model.url);
|
||||
return;
|
||||
}
|
||||
|
||||
var cropped = _this.resizeCrop ? 'true' : 'false';
|
||||
var requestString = '/images/thumb/' + model.id + '/' + _this.resizeWidth + '/' + _this.resizeHeight + '/' + cropped;
|
||||
_this.$http.get(requestString, function(data) {
|
||||
_this.setCurrentValue(model, data.url);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
Reference in New Issue
Block a user