更新组件：Bootstrap-fileinput组件升级，后台代码更新完善头像上传功能
This commit is contained in:
Argo-MacBookPro
parent
d41dd53e68
commit
6cb3d39f78
|
|
@ -1,9 +1,12 @@
|
|||
using Bootstrap.DataAccess;
|
||||
using Longbow.Logging;
|
||||
using Microsoft.AspNetCore.Hosting;
|
||||
using Microsoft.AspNetCore.Http;
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
using System;
|
||||
using System.Collections.Specialized;
|
||||
using System.IO;
|
||||
using System.Threading.Tasks;
|
||||
|
||||
namespace Bootstrap.Admin.Controllers.Api
|
||||
{
|
||||
|
|
@ -14,34 +17,51 @@ namespace Bootstrap.Admin.Controllers.Api
|
|||
public class ProfilesController : Controller
|
||||
{
|
||||
[HttpPost]
|
||||
public string Post()
|
||||
public async Task<JsonResult> Post([FromServices]IHostingEnvironment env, IFormCollection files)
|
||||
{
|
||||
var ret = string.Empty;
|
||||
var previewUrl = string.Empty;
|
||||
long fileSize = 0;
|
||||
var userName = User.Identity.Name;
|
||||
var error = string.Empty;
|
||||
if (User.IsInRole("Administrators")) userName = "default";
|
||||
//var files = HttpContext.Request.Files;
|
||||
//if (files.Count > 0)
|
||||
//{
|
||||
// var webSiteUrl = DictHelper.RetrieveIconFolderPath().Code;
|
||||
// var fileName = string.Format("{0}{1}", userName, Path.GetExtension(files[0].FileName));
|
||||
// var fileUrl = string.Format("{0}{1}", webSiteUrl, fileName);
|
||||
// var filePath = HttpContext.Current.Server.MapPath(fileUrl);
|
||||
// var fileFolder = Path.GetDirectoryName(filePath);
|
||||
// try
|
||||
// {
|
||||
// if (!Directory.Exists(fileFolder)) Directory.CreateDirectory(fileFolder);
|
||||
// files[0].SaveAs(filePath);
|
||||
// ret = string.Format("{0}?q={1}", Url.Content(fileUrl), DateTime.Now.Ticks);
|
||||
// UserHelper.SaveUserIconByName(userName, fileName);
|
||||
// }
|
||||
// catch (Exception ex)
|
||||
// {
|
||||
// var nv = new NameValueCollection();
|
||||
// nv.Add("UpLoadFileName", filePath);
|
||||
// ExceptionManager.Publish(ex, nv);
|
||||
// }
|
||||
//}
|
||||
return ret;
|
||||
if (files.Count > 0)
|
||||
{
|
||||
var uploadFile = files.Files[0];
|
||||
var webSiteUrl = DictHelper.RetrieveIconFolderPath().Code;
|
||||
var fileName = string.Format("{0}{1}", userName, Path.GetExtension(uploadFile.FileName));
|
||||
var fileUrl = string.Format("{0}{1}", webSiteUrl, fileName);
|
||||
var filePath = Path.Combine(env.WebRootPath, webSiteUrl.Replace("~", string.Empty).Replace("/", "\\").TrimStart('\\') + fileName);
|
||||
var fileFolder = Path.GetDirectoryName(filePath);
|
||||
fileSize = uploadFile.Length;
|
||||
try
|
||||
{
|
||||
if (!Directory.Exists(fileFolder)) Directory.CreateDirectory(fileFolder);
|
||||
using (var fs = new FileStream(filePath, FileMode.Create))
|
||||
{
|
||||
await uploadFile.CopyToAsync(fs);
|
||||
}
|
||||
previewUrl = string.Format("{0}?q={1}", Url.Content(fileUrl), DateTime.Now.Ticks);
|
||||
UserHelper.SaveUserIconByName(userName, fileName);
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
var nv = new NameValueCollection
|
||||
{
|
||||
{ "UpLoadFileName", filePath }
|
||||
};
|
||||
error = ex.Message;
|
||||
ExceptionManager.Publish(ex, nv);
|
||||
}
|
||||
}
|
||||
return new JsonResult(new
|
||||
{
|
||||
error = string.IsNullOrEmpty(error) ? error : $"服务器端错误-{error}",
|
||||
initialPreview = new string[] { previewUrl },
|
||||
initialPreviewConfig = new object[] {
|
||||
new { caption= "新头像", size= fileSize, showZoom= true }
|
||||
},
|
||||
append = false
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,23 +1,128 @@
|
|||
/*!
|
||||
* bootstrap-fileinput v4.3.6
|
||||
/*!
|
||||
* bootstrap-fileinput v4.4.9
|
||||
* http://plugins.krajee.com/file-input
|
||||
*
|
||||
* Krajee default styling for bootstrap-fileinput.
|
||||
*
|
||||
* Author: Kartik Visweswaran
|
||||
* Copyright: 2014 - 2016, Kartik Visweswaran, Krajee.com
|
||||
* Copyright: 2014 - 2018, Kartik Visweswaran, Krajee.com
|
||||
*
|
||||
* Licensed under the BSD 3-Clause
|
||||
* https://github.com/kartik-v/bootstrap-fileinput/blob/master/LICENSE.md
|
||||
*/
|
||||
.file-loading {
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
font-size: 999px;
|
||||
text-align: right;
|
||||
color: #fff;
|
||||
background: transparent url('../images/loading.gif') top left no-repeat;
|
||||
.file-loading input[type=file], input[type=file].file-loading {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.file-no-browse {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 20%;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
font-size: 0;
|
||||
opacity: 0;
|
||||
border: none;
|
||||
background: none;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.kv-hidden, .file-caption-icon, .file-zoom-dialog .modal-header:before, .file-zoom-dialog .modal-header:after, .file-input-new .file-preview, .file-input-new .close, .file-input-new .glyphicon-file, .file-input-new .fileinput-remove-button, .file-input-new .fileinput-upload-button, .file-input-new .no-browse .input-group-btn, .file-input-ajax-new .fileinput-remove-button, .file-input-ajax-new .fileinput-upload-button, .file-input-ajax-new .no-browse .input-group-btn, .hide-content .kv-file-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.btn-file input[type=file], .file-caption-icon, .file-preview .fileinput-remove, .krajee-default .file-thumb-progress, .file-zoom-dialog .btn-navigate, .file-zoom-dialog .floating-buttons {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.file-input, .file-loading:before, .btn-file, .file-caption, .file-preview, .krajee-default.file-preview-frame, .krajee-default .file-thumbnail-footer, .file-zoom-dialog .modal-dialog {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.file-error-message pre, .file-error-message ul, .krajee-default .file-actions, .krajee-default .file-other-error {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.file-error-message pre, .file-error-message ul {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.krajee-default .file-drag-handle, .krajee-default .file-upload-indicator {
|
||||
float: left;
|
||||
margin: 5px 0 -5px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.krajee-default .file-thumb-progress .progress, .krajee-default .file-thumb-progress .progress-bar {
|
||||
height: 11px;
|
||||
font-size: 9px;
|
||||
line-height: 10px;
|
||||
}
|
||||
|
||||
.krajee-default .file-caption-info, .krajee-default .file-size-info {
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
width: 160px;
|
||||
height: 15px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.file-zoom-content > .file-object.type-video, .file-zoom-content > .file-object.type-flash, .file-zoom-content > .file-object.type-image {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.file-zoom-content > .file-object.type-video, .file-zoom-content > .file-object.type-flash {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.file-zoom-content > .file-object.type-pdf, .file-zoom-content > .file-object.type-html, .file-zoom-content > .file-object.type-text, .file-zoom-content > .file-object.type-default {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.rotate-2 {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
.rotate-3 {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.rotate-4 {
|
||||
transform: rotate(180deg) rotateY(180deg);
|
||||
}
|
||||
|
||||
.rotate-5 {
|
||||
transform: rotate(270deg) rotateY(180deg);
|
||||
}
|
||||
|
||||
.rotate-6 {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.rotate-7 {
|
||||
transform: rotate(90deg) rotateY(180deg);
|
||||
}
|
||||
|
||||
.rotate-8 {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
|
||||
.file-loading:before {
|
||||
content: " Loading...";
|
||||
display: inline-block;
|
||||
padding-left: 20px;
|
||||
line-height: 16px;
|
||||
font-size: 13px;
|
||||
font-variant: small-caps;
|
||||
color: #999;
|
||||
background: transparent url(../img/loading.gif) top left no-repeat;
|
||||
}
|
||||
|
||||
.file-object {
|
||||
|
|
@ -26,14 +131,12 @@
|
|||
}
|
||||
|
||||
.btn-file {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.btn-file input[type=file] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
text-align: right;
|
||||
|
|
@ -43,19 +146,32 @@
|
|||
display: block;
|
||||
}
|
||||
|
||||
.file-caption-name {
|
||||
.btn-file ::-ms-browse {
|
||||
font-size: 10000px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.file-caption .file-caption-name {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
background: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.file-caption.icon-visible .file-caption-icon {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
height: 20px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.input-group-lg .file-caption-name {
|
||||
height: 25px;
|
||||
.file-caption.icon-visible .file-caption-name {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.file-zoom-dialog {
|
||||
text-align: left;
|
||||
.file-caption-icon {
|
||||
left: 8px;
|
||||
}
|
||||
|
||||
.file-error-message {
|
||||
|
|
@ -67,17 +183,12 @@
|
|||
padding: 15px;
|
||||
}
|
||||
|
||||
.file-error-message pre, .file-error-message ul {
|
||||
margin: 0;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.file-error-message pre {
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.file-caption-disabled {
|
||||
background-color: #EEEEEE;
|
||||
background-color: #eee;
|
||||
cursor: not-allowed;
|
||||
opacity: 1;
|
||||
}
|
||||
|
|
@ -85,34 +196,56 @@
|
|||
.file-preview {
|
||||
border-radius: 5px;
|
||||
border: 1px solid #ddd;
|
||||
padding: 5px;
|
||||
padding: 8px;
|
||||
width: 100%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.file-preview-frame {
|
||||
position: relative;
|
||||
display: table;
|
||||
.file-preview .btn-xs {
|
||||
padding: 1px 5px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.file-preview .fileinput-remove {
|
||||
top: 1px;
|
||||
right: 1px;
|
||||
line-height: 10px;
|
||||
}
|
||||
|
||||
.file-preview .clickable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-preview-image {
|
||||
font: 40px Impact, Charcoal, sans-serif;
|
||||
color: #008000;
|
||||
}
|
||||
|
||||
.krajee-default.file-preview-frame {
|
||||
margin: 8px;
|
||||
height: 160px;
|
||||
border: 1px solid #ddd;
|
||||
box-shadow: 1px 1px 5px 0 #a2958a;
|
||||
padding: 6px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.file-preview-frame:not(.file-preview-error):hover {
|
||||
.krajee-default.file-preview-frame .kv-file-content {
|
||||
width: 213px;
|
||||
height: 160px;
|
||||
}
|
||||
|
||||
.krajee-default.file-preview-frame .file-thumbnail-footer {
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.krajee-default.file-preview-frame:not(.file-preview-error):hover {
|
||||
box-shadow: 3px 3px 5px 0 #333;
|
||||
}
|
||||
|
||||
.file-preview-image {
|
||||
vertical-align: middle;
|
||||
image-orientation: from-image;
|
||||
}
|
||||
|
||||
.file-preview-text {
|
||||
.krajee-default .file-preview-text {
|
||||
display: block;
|
||||
color: #428bca;
|
||||
border: 1px solid #ddd;
|
||||
|
|
@ -122,208 +255,83 @@
|
|||
resize: none;
|
||||
}
|
||||
|
||||
.file-preview-html {
|
||||
.krajee-default .file-preview-html {
|
||||
border: 1px solid #ddd;
|
||||
padding: 8px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .file-preview-text {
|
||||
font-size: 1.2em;
|
||||
.krajee-default .file-other-icon {
|
||||
font-size: 6em;
|
||||
}
|
||||
|
||||
.file-preview-other {
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.file-preview-other:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.file-actions, .file-other-error {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.file-other-icon {
|
||||
font-size: 4.8em;
|
||||
}
|
||||
|
||||
/* noinspection CssOverwrittenProperties */
|
||||
.file-zoom-dialog .file-other-icon {
|
||||
font-size: 8em;
|
||||
font-size: 55vmin;
|
||||
}
|
||||
|
||||
.file-input-new .file-preview, .file-input-new .close, .file-input-new .glyphicon-file,
|
||||
.file-input-new .fileinput-remove-button, .file-input-new .fileinput-upload-button,
|
||||
.file-input-ajax-new .fileinput-remove-button, .file-input-ajax-new .fileinput-upload-button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.file-caption-main {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.file-input-ajax-new .no-browse .input-group-btn,
|
||||
.file-input-new .no-browse .input-group-btn {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.file-input-ajax-new .no-browse .form-control,
|
||||
.file-input-new .no-browse .form-control {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.file-thumb-loading {
|
||||
background: transparent url('../images/loading.gif') no-repeat scroll center center content-box !important;
|
||||
}
|
||||
|
||||
.file-actions {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.file-footer-buttons {
|
||||
.krajee-default .file-footer-buttons {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.file-upload-indicator {
|
||||
display: inline;
|
||||
cursor: default;
|
||||
opacity: 0.8;
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.file-upload-indicator:hover {
|
||||
font-weight: bold;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.file-footer-caption {
|
||||
.krajee-default .file-footer-caption {
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
width: 160px;
|
||||
text-align: center;
|
||||
padding-top: 4px;
|
||||
font-size: 11px;
|
||||
color: #777;
|
||||
margin: 5px auto;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.file-preview-error {
|
||||
.krajee-default .file-preview-error {
|
||||
opacity: 0.65;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.file-preview-frame:not(.file-preview-error) .file-footer-caption:hover {
|
||||
.krajee-default .file-thumb-progress {
|
||||
height: 11px;
|
||||
top: 37px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.krajee-default.kvsortable-ghost {
|
||||
background: #e1edf7;
|
||||
border: 2px solid #a1abff;
|
||||
}
|
||||
|
||||
.krajee-default .file-preview-other:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.krajee-default .file-preview-frame:not(.file-preview-error) .file-footer-caption:hover {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.file-drop-zone {
|
||||
border: 1px dashed #aaa;
|
||||
border-radius: 4px;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
margin: 12px 15px 12px 12px;
|
||||
padding: 5px;
|
||||
.kv-upload-progress .progress {
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
margin: 10px 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.file-drop-zone-title {
|
||||
color: #aaa;
|
||||
font-size: 1.6em;
|
||||
padding: 85px 10px;
|
||||
cursor: default;
|
||||
.kv-upload-progress .progress-bar {
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.file-preview .clickable,
|
||||
.clickable .file-drop-zone-title {
|
||||
cursor: pointer;
|
||||
/*noinspection CssOverwrittenProperties*/
|
||||
.file-zoom-dialog .file-other-icon {
|
||||
font-size: 22em;
|
||||
font-size: 50vmin;
|
||||
}
|
||||
|
||||
.file-drop-zone.clickable:hover {
|
||||
border: 2px dashed #999;
|
||||
.file-zoom-dialog .modal-dialog {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.file-drop-zone.clickable:focus {
|
||||
border: 2px solid #5acde2;
|
||||
}
|
||||
|
||||
.file-drop-zone .file-preview-thumbnails {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.file-highlighted {
|
||||
border: 2px dashed #999 !important;
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.file-uploading {
|
||||
background: url('../images/loading-sm.gif') no-repeat center bottom 10px;
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
.file-thumb-progress {
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.file-thumb-progress .progress, .file-thumb-progress .progress-bar {
|
||||
height: 10px;
|
||||
font-size: 9px;
|
||||
line-height: 10px;
|
||||
}
|
||||
|
||||
.file-thumbnail-footer {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.file-thumb-progress {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.file-zoom-fullscreen.modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.file-zoom-fullscreen .modal-dialog {
|
||||
position: fixed;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.file-zoom-fullscreen .modal-content {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.file-zoom-fullscreen .modal-body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .modal-body {
|
||||
position: relative !important;
|
||||
.file-zoom-dialog .modal-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .btn-navigate {
|
||||
position: absolute;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background: transparent;
|
||||
|
|
@ -335,26 +343,15 @@
|
|||
color: #1c94c4;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .floating-buttons {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.floating-buttons, .floating-buttons .btn {
|
||||
z-index: 3000;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .kv-zoom-actions .btn,
|
||||
.floating-buttons .btn {
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .btn-navigate:not([disabled]):hover,
|
||||
.file-zoom-dialog .btn-navigate:not([disabled]):focus {
|
||||
.file-zoom-dialog .btn-navigate:not([disabled]):hover {
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
opacity: 0.5;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .floating-buttons {
|
||||
top: 5px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .btn-navigate[disabled] {
|
||||
|
|
@ -369,16 +366,118 @@
|
|||
right: 1px;
|
||||
}
|
||||
|
||||
.file-drag-handle {
|
||||
display: inline;
|
||||
margin-right: 2px;
|
||||
font-size: 16px;
|
||||
cursor: move;
|
||||
cursor: -webkit-grabbing;
|
||||
.file-zoom-dialog .kv-zoom-title {
|
||||
font-weight: 300;
|
||||
color: #999;
|
||||
max-width: 50%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.file-drag-handle:hover {
|
||||
opacity: 0.7;
|
||||
.file-input-new .no-browse .form-control {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.file-input-ajax-new .no-browse .form-control {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.file-caption-main {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.file-thumb-loading {
|
||||
background: transparent url(../img/loading.gif) no-repeat scroll center center content-box !important;
|
||||
}
|
||||
|
||||
.file-drop-zone {
|
||||
border: 1px dashed #aaa;
|
||||
border-radius: 4px;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
margin: 12px 15px 12px 12px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.file-drop-zone.clickable:hover {
|
||||
border: 2px dashed #999;
|
||||
}
|
||||
|
||||
.file-drop-zone.clickable:focus {
|
||||
border: 2px solid #5acde2;
|
||||
}
|
||||
|
||||
.file-drop-zone .file-preview-thumbnails {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.file-drop-zone-title {
|
||||
color: #aaa;
|
||||
font-size: 1.6em;
|
||||
padding: 85px 10px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.file-highlighted {
|
||||
border: 2px dashed #999 !important;
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.file-uploading {
|
||||
background: url(../img/loading-sm.gif) no-repeat center bottom 10px;
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.file-zoom-dialog .modal-dialog {
|
||||
max-width: 500px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.file-zoom-dialog .modal-lg {
|
||||
max-width: 800px;
|
||||
}
|
||||
}
|
||||
|
||||
.file-zoom-fullscreen.modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.file-zoom-fullscreen .modal-dialog {
|
||||
position: fixed;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.file-zoom-fullscreen .modal-content {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.file-zoom-fullscreen .modal-body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.floating-buttons {
|
||||
z-index: 3000;
|
||||
}
|
||||
|
||||
.floating-buttons .btn-kv {
|
||||
margin-left: 3px;
|
||||
z-index: 3000;
|
||||
}
|
||||
|
||||
.file-zoom-content {
|
||||
|
|
@ -386,16 +485,70 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.file-zoom-content .file-preview-image {
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.file-zoom-content .file-preview-video {
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.file-zoom-content .is-portrait-gt4 {
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
.file-zoom-content > .file-object.type-image {
|
||||
height: auto;
|
||||
min-height: inherit;
|
||||
}
|
||||
|
||||
.file-zoom-content > .file-object.type-audio {
|
||||
width: auto;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.file-preview-thumbnails {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.file-zoom-dialog .modal-header {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 350px) {
|
||||
.krajee-default.file-preview-frame .kv-file-content {
|
||||
width: 160px;
|
||||
}
|
||||
}
|
||||
|
||||
.file-loading[dir=rtl]:before {
|
||||
background: transparent url(../img/loading.gif) top right no-repeat;
|
||||
padding-left: 0;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.file-sortable .file-drag-handle {
|
||||
cursor: move;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.file-sortable .file-drag-handle:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.clickable .file-drop-zone-title {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.kv-zoom-actions .btn-kv {
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.file-preview-initial.sortable-chosen {
|
||||
background-color: #d9edf7;
|
||||
}
|
||||
|
||||
.file-preview-frame.sortable-ghost {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
/* IE 10 fix */
|
||||
.btn-file ::-ms-browse {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -2,7 +2,8 @@
|
|||
var $headerIcon = $('#headerIcon');
|
||||
var preIcon = $headerIcon.attr('src');
|
||||
$('#fileIcon').fileinput({
|
||||
uploadUrl: Profiles.url,
|
||||
uploadUrl: $.formatUrl(Profiles.url),
|
||||
browseOnZoneClick: true,
|
||||
language: 'zh',
|
||||
maxFileSize: 5000,
|
||||
allowedFileExtensions: ['jpg', 'png', 'bmp', 'gif', 'jpeg'],
|
||||
|
|
@ -10,13 +11,13 @@
|
|||
preIcon
|
||||
],
|
||||
initialPreviewConfig: [
|
||||
{ caption: "现在头像", size: $('#fileIcon').attr('data-init'), showZoom: false },
|
||||
{ caption: "现在头像", size: $('#fileIcon').attr('data-init'), showZoom: true },
|
||||
],
|
||||
initialPreviewAsData: true,
|
||||
overwriteInitial: true,
|
||||
dropZoneTitle: "请选择头像"
|
||||
}).on('fileuploaded', function (event, data, previewId, index) {
|
||||
var url = data.response;
|
||||
var url = data.response.initialPreview[0];
|
||||
if (!!url) $headerIcon.attr('src', url);
|
||||
});
|
||||
|
||||
|
|
@ -60,5 +61,4 @@
|
|||
}
|
||||
});
|
||||
$('button[data-admin="False"]').removeAttr('disabled');
|
||||
$('#kvFileinputModal').appendTo('body');
|
||||
});
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -23,10 +23,12 @@
|
|||
uploadLabel: '上传',
|
||||
uploadTitle: '上传选中文件',
|
||||
msgNo: '没有',
|
||||
msgNoFilesSelected: '',
|
||||
msgNoFilesSelected: '未选择文件',
|
||||
msgCancelled: '取消',
|
||||
msgPlaceholder: '选择 {files}...',
|
||||
msgZoomModalHeading: '详细预览',
|
||||
msgSizeTooSmall: 'File "{name}" (<b>{size} KB</b>) is too small and must be larger than <b>{minSize} KB</b>.',
|
||||
msgFileRequired: '必须选择一个文件上传.',
|
||||
msgSizeTooSmall: '文件 "{name}" (<b>{size} KB</b>) 必须大于限定大小 <b>{minSize} KB</b>.',
|
||||
msgSizeTooLarge: '文件 "{name}" (<b>{size} KB</b>) 超过了允许大小 <b>{maxSize} KB</b>.',
|
||||
msgFilesTooLess: '你必须选择最少 <b>{n}</b> {files} 来上传. ',
|
||||
msgFilesTooMany: '选择的上传文件个数 <b>({n})</b> 超出最大文件的限制个数 <b>{m}</b>.',
|
||||
|
|
@ -35,27 +37,50 @@
|
|||
msgFileNotReadable: '文件 "{name}" 不可读.',
|
||||
msgFilePreviewAborted: '取消 "{name}" 的预览.',
|
||||
msgFilePreviewError: '读取 "{name}" 时出现了一个错误.',
|
||||
msgInvalidFileName: 'Invalid or unsupported characters in file name "{name}".',
|
||||
msgInvalidFileName: '文件名 "{name}" 包含非法字符.',
|
||||
msgInvalidFileType: '不正确的类型 "{name}". 只支持 "{types}" 类型的文件.',
|
||||
msgInvalidFileExtension: '不正确的文件扩展名 "{name}". 只支持 "{extensions}" 的文件扩展名.',
|
||||
msgFileTypes: {
|
||||
'image': 'image',
|
||||
'html': 'HTML',
|
||||
'text': 'text',
|
||||
'video': 'video',
|
||||
'audio': 'audio',
|
||||
'flash': 'flash',
|
||||
'pdf': 'PDF',
|
||||
'object': 'object'
|
||||
},
|
||||
msgUploadAborted: '该文件上传被中止',
|
||||
msgUploadThreshold: 'Processing...',
|
||||
msgUploadThreshold: '处理中...',
|
||||
msgUploadBegin: '正在初始化...',
|
||||
msgUploadEnd: '完成',
|
||||
msgUploadEmpty: '无效的文件上传.',
|
||||
msgUploadError: '上传出错',
|
||||
msgValidationError: '验证错误',
|
||||
msgLoading: '加载第 {index} 文件 共 {files} …',
|
||||
msgProgress: '加载第 {index} 文件 共 {files} - {name} - {percent}% 完成.',
|
||||
msgSelected: '{n} {files} 选中',
|
||||
msgFoldersNotAllowed: '只支持拖拽文件! 跳过 {n} 拖拽的文件夹.',
|
||||
msgImageWidthSmall: '宽度的图像文件的"{name}"的必须是至少{size}像素.',
|
||||
msgImageWidthSmall: '图像文件的"{name}"的宽度必须是至少{size}像素.',
|
||||
msgImageHeightSmall: '图像文件的"{name}"的高度必须至少为{size}像素.',
|
||||
msgImageWidthLarge: '宽度的图像文件"{name}"不能超过{size}像素.',
|
||||
msgImageWidthLarge: '图像文件"{name}"的宽度不能超过{size}像素.',
|
||||
msgImageHeightLarge: '图像文件"{name}"的高度不能超过{size}像素.',
|
||||
msgImageResizeError: '无法获取的图像尺寸调整。',
|
||||
msgImageResizeException: '错误而调整图像大小。<pre>{errors}</pre>',
|
||||
msgImageResizeException: '调整图像大小时发生错误。<pre>{errors}</pre>',
|
||||
msgAjaxError: '{operation} 发生错误. 请重试!',
|
||||
msgAjaxProgressError: '{operation} 失败',
|
||||
ajaxOperations: {
|
||||
deleteThumb: '删除文件',
|
||||
uploadThumb: '上传文件',
|
||||
uploadBatch: '批量上传',
|
||||
uploadExtra: '表单数据上传'
|
||||
},
|
||||
dropZoneTitle: '拖拽文件到这里 …<br>支持多文件同时上传',
|
||||
dropZoneClickTitle: '<br>(或点击{files}按钮选择文件)',
|
||||
fileActionSettings: {
|
||||
removeTitle: '删除文件',
|
||||
uploadTitle: '上传文件',
|
||||
uploadRetryTitle: '重试',
|
||||
zoomTitle: '查看详情',
|
||||
dragTitle: '移动 / 重置',
|
||||
indicatorNewTitle: '没有上传',
|
||||
|
|
@ -72,4 +97,4 @@
|
|||
close: '关闭当前预览'
|
||||
}
|
||||
};
|
||||
})(window.jQuery);
|
||||
})(window.jQuery);
|
||||
|
|
|
|||
Loading…
Reference in New Issue