feat: 增加数据标题设置
This commit is contained in:
Argo Zhang
parent
2da783dda3
commit
5a91330bf6
|
|
@ -19,7 +19,7 @@ namespace Bootstrap.Admin.Controllers.Api
|
||||||
/// <param name="value"></param>
|
/// <param name="value"></param>
|
||||||
/// <returns></returns>
|
/// <returns></returns>
|
||||||
[HttpPost]
|
[HttpPost]
|
||||||
[ButtonAuthorize(Url = "~/Admin/Settings", Auth = "saveTitle,saveFooter,saveTheme")]
|
[ButtonAuthorize(Url = "~/Admin/Settings", Auth = "saveTitle,saveFooter,saveTheme,saveUISettings")]
|
||||||
public bool Post([FromBody]BootstrapDict value) => DictHelper.SaveSettings(value);
|
public bool Post([FromBody]BootstrapDict value) => DictHelper.SaveSettings(value);
|
||||||
|
|
||||||
/// <summary>
|
/// <summary>
|
||||||
|
|
|
||||||
|
|
@ -3,12 +3,12 @@
|
||||||
namespace Bootstrap.Admin.Models
|
namespace Bootstrap.Admin.Models
|
||||||
{
|
{
|
||||||
/// <summary>
|
/// <summary>
|
||||||
///
|
/// ModelBase 基础类
|
||||||
/// </summary>
|
/// </summary>
|
||||||
public class ModelBase
|
public class ModelBase
|
||||||
{
|
{
|
||||||
/// <summary>
|
/// <summary>
|
||||||
///
|
/// 默认构造函数
|
||||||
/// </summary>
|
/// </summary>
|
||||||
public ModelBase()
|
public ModelBase()
|
||||||
{
|
{
|
||||||
|
|
@ -16,15 +16,16 @@ namespace Bootstrap.Admin.Models
|
||||||
Footer = DictHelper.RetrieveWebFooter();
|
Footer = DictHelper.RetrieveWebFooter();
|
||||||
Theme = DictHelper.RetrieveActiveTheme();
|
Theme = DictHelper.RetrieveActiveTheme();
|
||||||
IsDemo = DictHelper.RetrieveSystemModel();
|
IsDemo = DictHelper.RetrieveSystemModel();
|
||||||
|
ShowCardTitle = DictHelper.RetrieveCardTitleStatus() ? "" : "no-card-header";
|
||||||
}
|
}
|
||||||
|
|
||||||
/// <summary>
|
/// <summary>
|
||||||
///
|
/// 获取 网站标题
|
||||||
/// </summary>
|
/// </summary>
|
||||||
public string Title { get; private set; }
|
public string Title { get; private set; }
|
||||||
|
|
||||||
/// <summary>
|
/// <summary>
|
||||||
///
|
/// 获取 网站页脚
|
||||||
/// </summary>
|
/// </summary>
|
||||||
public string Footer { get; private set; }
|
public string Footer { get; private set; }
|
||||||
|
|
||||||
|
|
@ -37,5 +38,10 @@ namespace Bootstrap.Admin.Models
|
||||||
/// 是否为演示系统
|
/// 是否为演示系统
|
||||||
/// </summary>
|
/// </summary>
|
||||||
public bool IsDemo { get; protected set; }
|
public bool IsDemo { get; protected set; }
|
||||||
|
|
||||||
|
/// <summary>
|
||||||
|
/// 是否显示卡片标题
|
||||||
|
/// </summary>
|
||||||
|
public string ShowCardTitle { get; protected set; }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -2,14 +2,24 @@
|
||||||
@{
|
@{
|
||||||
ViewBag.Title = "网站设置";
|
ViewBag.Title = "网站设置";
|
||||||
}
|
}
|
||||||
|
@section css {
|
||||||
|
<environment include="Development">
|
||||||
|
<link href="~/lib/bootstrap-toggle/css/bootstrap-toggle.css" rel="stylesheet" />
|
||||||
|
</environment>
|
||||||
|
<environment exclude="Development">
|
||||||
|
<link href="~/lib/bootstrap-toggle/css/bootstrap-toggle.min.css" rel="stylesheet" />
|
||||||
|
</environment>
|
||||||
|
}
|
||||||
@section javascript {
|
@section javascript {
|
||||||
<environment include="Development">
|
<environment include="Development">
|
||||||
<script src="~/lib/validate/jquery.validate.js"></script>
|
<script src="~/lib/validate/jquery.validate.js"></script>
|
||||||
<script src="~/lib/validate/localization/messages_zh.js"></script>
|
<script src="~/lib/validate/localization/messages_zh.js"></script>
|
||||||
|
<script src="~/lib/bootstrap-toggle/js/bootstrap-toggle.js"></script>
|
||||||
</environment>
|
</environment>
|
||||||
<environment exclude="Development">
|
<environment exclude="Development">
|
||||||
<script src="~/lib/validate/jquery.validate.min.js"></script>
|
<script src="~/lib/validate/jquery.validate.min.js"></script>
|
||||||
<script src="~/lib/validate/localization/messages_zh.min.js"></script>
|
<script src="~/lib/validate/localization/messages_zh.min.js"></script>
|
||||||
|
<script src="~/lib/bootstrap-toggle/js/bootstrap-toggle.min.js"></script>
|
||||||
</environment>
|
</environment>
|
||||||
<script src="~/lib/longbow/longbow.dataentity.js"></script>
|
<script src="~/lib/longbow/longbow.dataentity.js"></script>
|
||||||
<script src="~/lib/longbow/longbow.validate.js"></script>
|
<script src="~/lib/longbow/longbow.validate.js"></script>
|
||||||
|
|
@ -70,6 +80,26 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">网站调整</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="form-inline">
|
||||||
|
<div class="row">
|
||||||
|
<div class="form-group col-sm-6">
|
||||||
|
<label class="control-label" for="sider">侧边栏设置</label>
|
||||||
|
<input id="sider" hidden type="checkbox" data-toggle="toggle" data-width="120" data-onstyle="success" data-on="展开" data-off="收缩" />
|
||||||
|
</div>
|
||||||
|
<div class="form-group col-sm-6">
|
||||||
|
<label class="control-label" for="cardTitle">标题设置</label>
|
||||||
|
<input id="cardTitle" hidden type="checkbox" data-default-val="@Model.ShowCardTitle" data-toggle="toggle" data-width="120" data-onstyle="success" data-on="显示" data-off="关闭" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer" asp-auth="saveUISettings">
|
||||||
|
<button id="btnSaveCss" data-method="UISettings" class="btn btn-secondary" type="button"><i class="fa fa-save"></i><span>保存</span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<div class="d-flex align-items-center">
|
<div class="d-flex align-items-center">
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,5 @@
|
||||||
@{
|
@model ModelBase
|
||||||
|
@{
|
||||||
Layout = "_Bootstrap";
|
Layout = "_Bootstrap";
|
||||||
}
|
}
|
||||||
@section css {
|
@section css {
|
||||||
|
|
@ -35,7 +36,7 @@
|
||||||
<script src="~/js/log.js" asp-append-version="true"></script>
|
<script src="~/js/log.js" asp-append-version="true"></script>
|
||||||
}
|
}
|
||||||
@await Html.PartialAsync("Navigator")
|
@await Html.PartialAsync("Navigator")
|
||||||
<section id="main-content" class="main-content">
|
<section id="main-content" class="main-content @Model.ShowCardTitle">
|
||||||
<div class="main-header">
|
<div class="main-header">
|
||||||
<ol class="breadcrumb">
|
<ol class="breadcrumb">
|
||||||
<li class="breadcrumb-item"><a href="@Url.Content("~/Admin/Index")"><i class="fa fa-home"></i>首页</a></li>
|
<li class="breadcrumb-item"><a href="@Url.Content("~/Admin/Index")"><i class="fa fa-home"></i>首页</a></li>
|
||||||
|
|
|
||||||
|
|
@ -51,20 +51,20 @@
|
||||||
border-bottom: solid 1px #307eb6;
|
border-bottom: solid 1px #307eb6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card {
|
.main-content:not(.no-card-header) .card {
|
||||||
border-top-width: 1px;
|
border-top-width: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card:hover {
|
|
||||||
border-top-color: #84bbe2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card, .modal-footer, .form-control, .popover, .date .input-group-text,
|
.card, .modal-footer, .form-control, .popover, .date .input-group-text,
|
||||||
.input-group .btn:not(.btn-secondary):not(.btn-primary):not(.btn-warning):not(.btn-info):not(.btn-danger),
|
.input-group .btn:not(.btn-secondary):not(.btn-primary):not(.btn-warning):not(.btn-info):not(.btn-danger),
|
||||||
.form-select-input:hover {
|
.form-select-input:hover {
|
||||||
border-color: #84bbe2;
|
border-color: #84bbe2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.card:hover {
|
||||||
|
border-top-color: #337ab7;
|
||||||
|
}
|
||||||
|
|
||||||
.card .card-header, .modal-header {
|
.card .card-header, .modal-header {
|
||||||
background-image: linear-gradient(to bottom, #5893be 0%, #63a6d7 100%);
|
background-image: linear-gradient(to bottom, #5893be 0%, #63a6d7 100%);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -557,6 +557,10 @@ input.pending {
|
||||||
margin-top: -10px;
|
margin-top: -10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.no-card-header .card-header {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.btn i + span {
|
.btn i + span {
|
||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
}
|
}
|
||||||
|
|
@ -869,3 +873,32 @@ label[for] {
|
||||||
font-size: 0.75rem;
|
font-size: 0.75rem;
|
||||||
padding: 4px 6px;
|
padding: 4px 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.toggle .btn-default, .toggle.btn-default {
|
||||||
|
text-shadow: 0 1px 0 #fff;
|
||||||
|
background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
|
||||||
|
background-image: -o-linear-gradient(top, #fff 0%, #e0e0e0 100%);
|
||||||
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0));
|
||||||
|
background-image: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||||
|
border-color: #ccc;
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
|
||||||
|
}
|
||||||
|
|
||||||
|
.toggle .btn-default.active {
|
||||||
|
background-image: none;
|
||||||
|
background-color: #e0e0e0;
|
||||||
|
border-color: #dbdbdb;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toggle .btn-default.active:hover {
|
||||||
|
color: #333;
|
||||||
|
background-color: #d4d4d4;
|
||||||
|
border-color: #8c8c8c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toggle.btn .toggle-handle {
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -37,6 +37,21 @@ $(function () {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
break;
|
break;
|
||||||
|
case 'UISettings':
|
||||||
|
var uiSettings = $('#sider').prop('checked') ? "1" : "0";
|
||||||
|
$.bc({
|
||||||
|
url: Settings.url, data: { name: '侧边栏状态', code: uiSettings, category: '网站设置' }, method: "post"
|
||||||
|
});
|
||||||
|
var cardTitle = $('#cardTitle').prop('checked') ? "1" : "0";
|
||||||
|
$.bc({
|
||||||
|
url: Settings.url, data: { name: '卡片标题状态', code: cardTitle, category: '网站设置' }, title: '保存网站设置', method: "post",
|
||||||
|
callback: function (result) {
|
||||||
|
if (result) {
|
||||||
|
window.setTimeout(function () { window.location.reload(true); }, 1000);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,83 @@
|
||||||
|
/*! ========================================================================
|
||||||
|
* Bootstrap Toggle: bootstrap-toggle.css v2.2.0
|
||||||
|
* http://www.bootstraptoggle.com
|
||||||
|
* ========================================================================
|
||||||
|
* Copyright 2014 Min Hur, The New York Times Company
|
||||||
|
* Licensed under MIT
|
||||||
|
* ======================================================================== */
|
||||||
|
|
||||||
|
|
||||||
|
.checkbox label .toggle,
|
||||||
|
.checkbox-inline .toggle {
|
||||||
|
margin-left: -20px;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toggle {
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.toggle input[type="checkbox"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.toggle-group {
|
||||||
|
position: absolute;
|
||||||
|
width: 200%;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
transition: left 0.35s;
|
||||||
|
-webkit-transition: left 0.35s;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
}
|
||||||
|
.toggle.off .toggle-group {
|
||||||
|
left: -100%;
|
||||||
|
}
|
||||||
|
.toggle-on {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 50%;
|
||||||
|
margin: 0;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.toggle-off {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 50%;
|
||||||
|
right: 0;
|
||||||
|
margin: 0;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.toggle-handle {
|
||||||
|
position: relative;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding-top: 0px;
|
||||||
|
padding-bottom: 0px;
|
||||||
|
height: 100%;
|
||||||
|
width: 0px;
|
||||||
|
border-width: 0 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toggle.btn { min-width: 59px; min-height: 34px; }
|
||||||
|
.toggle-on.btn { padding-right: 24px; }
|
||||||
|
.toggle-off.btn { padding-left: 24px; }
|
||||||
|
|
||||||
|
.toggle.btn-lg { min-width: 79px; min-height: 45px; }
|
||||||
|
.toggle-on.btn-lg { padding-right: 31px; }
|
||||||
|
.toggle-off.btn-lg { padding-left: 31px; }
|
||||||
|
.toggle-handle.btn-lg { width: 40px; }
|
||||||
|
|
||||||
|
.toggle.btn-sm { min-width: 50px; min-height: 30px;}
|
||||||
|
.toggle-on.btn-sm { padding-right: 20px; }
|
||||||
|
.toggle-off.btn-sm { padding-left: 20px; }
|
||||||
|
|
||||||
|
.toggle.btn-xs { min-width: 35px; min-height: 22px;}
|
||||||
|
.toggle-on.btn-xs { padding-right: 12px; }
|
||||||
|
.toggle-off.btn-xs { padding-left: 12px; }
|
||||||
|
|
||||||
|
|
@ -0,0 +1,28 @@
|
||||||
|
/*! ========================================================================
|
||||||
|
* Bootstrap Toggle: bootstrap-toggle.css v2.2.0
|
||||||
|
* http://www.bootstraptoggle.com
|
||||||
|
* ========================================================================
|
||||||
|
* Copyright 2014 Min Hur, The New York Times Company
|
||||||
|
* Licensed under MIT
|
||||||
|
* ======================================================================== */
|
||||||
|
.checkbox label .toggle,.checkbox-inline .toggle{margin-left:-20px;margin-right:5px}
|
||||||
|
.toggle{position:relative;overflow:hidden}
|
||||||
|
.toggle input[type=checkbox]{display:none}
|
||||||
|
.toggle-group{position:absolute;width:200%;top:0;bottom:0;left:0;transition:left .35s;-webkit-transition:left .35s;-moz-user-select:none;-webkit-user-select:none}
|
||||||
|
.toggle.off .toggle-group{left:-100%}
|
||||||
|
.toggle-on{position:absolute;top:0;bottom:0;left:0;right:50%;margin:0;border:0;border-radius:0}
|
||||||
|
.toggle-off{position:absolute;top:0;bottom:0;left:50%;right:0;margin:0;border:0;border-radius:0}
|
||||||
|
.toggle-handle{position:relative;margin:0 auto;padding-top:0;padding-bottom:0;height:100%;width:0;border-width:0 1px}
|
||||||
|
.toggle.btn{min-width:59px;min-height:34px}
|
||||||
|
.toggle-on.btn{padding-right:24px}
|
||||||
|
.toggle-off.btn{padding-left:24px}
|
||||||
|
.toggle.btn-lg{min-width:79px;min-height:45px}
|
||||||
|
.toggle-on.btn-lg{padding-right:31px}
|
||||||
|
.toggle-off.btn-lg{padding-left:31px}
|
||||||
|
.toggle-handle.btn-lg{width:40px}
|
||||||
|
.toggle.btn-sm{min-width:50px;min-height:30px}
|
||||||
|
.toggle-on.btn-sm{padding-right:20px}
|
||||||
|
.toggle-off.btn-sm{padding-left:20px}
|
||||||
|
.toggle.btn-xs{min-width:35px;min-height:22px}
|
||||||
|
.toggle-on.btn-xs{padding-right:12px}
|
||||||
|
.toggle-off.btn-xs{padding-left:12px}
|
||||||
|
|
@ -0,0 +1,184 @@
|
||||||
|
/*! ========================================================================
|
||||||
|
* Bootstrap Toggle: bootstrap-toggle.js v2.2.0
|
||||||
|
* http://www.bootstraptoggle.com
|
||||||
|
* ========================================================================
|
||||||
|
* Copyright 2014 Min Hur, The New York Times Company
|
||||||
|
* Licensed under MIT
|
||||||
|
* ======================================================================== */
|
||||||
|
|
||||||
|
|
||||||
|
+function ($) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
// TOGGLE PUBLIC CLASS DEFINITION
|
||||||
|
// ==============================
|
||||||
|
|
||||||
|
var Toggle = function (element, options) {
|
||||||
|
this.$element = $(element)
|
||||||
|
this.options = $.extend({}, this.defaults(), options)
|
||||||
|
this.render()
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.VERSION = '2.2.0'
|
||||||
|
|
||||||
|
Toggle.DEFAULTS = {
|
||||||
|
on: 'On',
|
||||||
|
off: 'Off',
|
||||||
|
onstyle: 'primary',
|
||||||
|
offstyle: 'default',
|
||||||
|
size: 'normal',
|
||||||
|
style: '',
|
||||||
|
width: null,
|
||||||
|
height: null,
|
||||||
|
defaultVal: ''
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.defaults = function() {
|
||||||
|
return {
|
||||||
|
on: this.$element.attr('data-on') || Toggle.DEFAULTS.on,
|
||||||
|
off: this.$element.attr('data-off') || Toggle.DEFAULTS.off,
|
||||||
|
onstyle: this.$element.attr('data-onstyle') || Toggle.DEFAULTS.onstyle,
|
||||||
|
offstyle: this.$element.attr('data-offstyle') || Toggle.DEFAULTS.offstyle,
|
||||||
|
size: this.$element.attr('data-size') || Toggle.DEFAULTS.size,
|
||||||
|
style: this.$element.attr('data-style') || Toggle.DEFAULTS.style,
|
||||||
|
width: this.$element.attr('data-width') || Toggle.DEFAULTS.width,
|
||||||
|
height: this.$element.attr('data-height') || Toggle.DEFAULTS.height,
|
||||||
|
defaultVal: this.$element.attr('data-default-val') || Toggle.DEFAULTS.defaultVal,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.render = function () {
|
||||||
|
if(this.options.defaultVal === '') this.$element.prop('checked', true);
|
||||||
|
|
||||||
|
this._onstyle = 'btn-' + this.options.onstyle
|
||||||
|
this._offstyle = 'btn-' + this.options.offstyle
|
||||||
|
var size = this.options.size === 'large' ? 'btn-lg'
|
||||||
|
: this.options.size === 'small' ? 'btn-sm'
|
||||||
|
: this.options.size === 'mini' ? 'btn-xs'
|
||||||
|
: ''
|
||||||
|
var $toggleOn = $('<label class="btn">').html(this.options.on)
|
||||||
|
.addClass(this._onstyle + ' ' + size)
|
||||||
|
var $toggleOff = $('<label class="btn">').html(this.options.off)
|
||||||
|
.addClass(this._offstyle + ' ' + size + ' active')
|
||||||
|
var $toggleHandle = $('<span class="toggle-handle btn btn-default">')
|
||||||
|
.addClass(size)
|
||||||
|
var $toggleGroup = $('<div class="toggle-group">')
|
||||||
|
.append($toggleOn, $toggleOff, $toggleHandle)
|
||||||
|
var $toggle = $('<div class="toggle btn" data-toggle="toggle">')
|
||||||
|
.addClass( this.$element.prop('checked') ? this._onstyle : this._offstyle+' off' )
|
||||||
|
.addClass(size).addClass(this.options.style)
|
||||||
|
|
||||||
|
this.$element.wrap($toggle)
|
||||||
|
$.extend(this, {
|
||||||
|
$toggle: this.$element.parent(),
|
||||||
|
$toggleOn: $toggleOn,
|
||||||
|
$toggleOff: $toggleOff,
|
||||||
|
$toggleGroup: $toggleGroup
|
||||||
|
})
|
||||||
|
this.$toggle.append($toggleGroup)
|
||||||
|
|
||||||
|
var width = this.options.width || Math.max($toggleOn.outerWidth(), $toggleOff.outerWidth())+($toggleHandle.outerWidth()/2)
|
||||||
|
var height = this.options.height || Math.max($toggleOn.outerHeight(), $toggleOff.outerHeight())
|
||||||
|
$toggleOn.addClass('toggle-on')
|
||||||
|
$toggleOff.addClass('toggle-off')
|
||||||
|
this.$toggle.css({ width: width, height: height })
|
||||||
|
if (this.options.height) {
|
||||||
|
$toggleOn.css('line-height', $toggleOn.height() + 'px')
|
||||||
|
$toggleOff.css('line-height', $toggleOff.height() + 'px')
|
||||||
|
}
|
||||||
|
this.update(true)
|
||||||
|
this.trigger(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.toggle = function () {
|
||||||
|
if (this.$element.prop('checked')) this.off()
|
||||||
|
else this.on()
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.on = function (silent) {
|
||||||
|
if (this.$element.prop('disabled')) return false
|
||||||
|
this.$toggle.removeClass(this._offstyle + ' off').addClass(this._onstyle)
|
||||||
|
this.$element.prop('checked', true)
|
||||||
|
if (!silent) this.trigger()
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.off = function (silent) {
|
||||||
|
if (this.$element.prop('disabled')) return false
|
||||||
|
this.$toggle.removeClass(this._onstyle).addClass(this._offstyle + ' off')
|
||||||
|
this.$element.prop('checked', false)
|
||||||
|
if (!silent) this.trigger()
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.enable = function () {
|
||||||
|
this.$toggle.removeAttr('disabled')
|
||||||
|
this.$element.prop('disabled', false)
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.disable = function () {
|
||||||
|
this.$toggle.attr('disabled', 'disabled')
|
||||||
|
this.$element.prop('disabled', true)
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.update = function (silent) {
|
||||||
|
if (this.$element.prop('disabled')) this.disable()
|
||||||
|
else this.enable()
|
||||||
|
if (this.$element.prop('checked')) this.on(silent)
|
||||||
|
else this.off(silent)
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.trigger = function (silent) {
|
||||||
|
this.$element.off('change.bs.toggle')
|
||||||
|
if (!silent) this.$element.change()
|
||||||
|
this.$element.on('change.bs.toggle', $.proxy(function() {
|
||||||
|
this.update()
|
||||||
|
}, this))
|
||||||
|
}
|
||||||
|
|
||||||
|
Toggle.prototype.destroy = function() {
|
||||||
|
this.$element.off('change.bs.toggle')
|
||||||
|
this.$toggleGroup.remove()
|
||||||
|
this.$element.removeData('bs.toggle')
|
||||||
|
this.$element.unwrap()
|
||||||
|
}
|
||||||
|
|
||||||
|
// TOGGLE PLUGIN DEFINITION
|
||||||
|
// ========================
|
||||||
|
|
||||||
|
function Plugin(option) {
|
||||||
|
return this.each(function () {
|
||||||
|
var $this = $(this)
|
||||||
|
var data = $this.data('bs.toggle')
|
||||||
|
var options = typeof option == 'object' && option
|
||||||
|
|
||||||
|
if (!data) $this.data('bs.toggle', (data = new Toggle(this, options)))
|
||||||
|
if (typeof option == 'string' && data[option]) data[option]()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
var old = $.fn.bootstrapToggle
|
||||||
|
|
||||||
|
$.fn.bootstrapToggle = Plugin
|
||||||
|
$.fn.bootstrapToggle.Constructor = Toggle
|
||||||
|
|
||||||
|
// TOGGLE NO CONFLICT
|
||||||
|
// ==================
|
||||||
|
|
||||||
|
$.fn.toggle.noConflict = function () {
|
||||||
|
$.fn.bootstrapToggle = old
|
||||||
|
return this
|
||||||
|
}
|
||||||
|
|
||||||
|
// TOGGLE DATA-API
|
||||||
|
// ===============
|
||||||
|
|
||||||
|
$(function() {
|
||||||
|
$('input[type=checkbox][data-toggle^=toggle]').bootstrapToggle()
|
||||||
|
})
|
||||||
|
|
||||||
|
$(document).on('click.bs.toggle', 'div[data-toggle^=toggle]', function(e) {
|
||||||
|
var $checkbox = $(this).find('input[type=checkbox]')
|
||||||
|
$checkbox.bootstrapToggle('toggle')
|
||||||
|
e.preventDefault()
|
||||||
|
})
|
||||||
|
|
||||||
|
}(jQuery);
|
||||||
|
|
@ -0,0 +1,9 @@
|
||||||
|
/*! ========================================================================
|
||||||
|
* Bootstrap Toggle: bootstrap-toggle.js v2.2.0
|
||||||
|
* http://www.bootstraptoggle.com
|
||||||
|
* ========================================================================
|
||||||
|
* Copyright 2014 Min Hur, The New York Times Company
|
||||||
|
* Licensed under MIT
|
||||||
|
* ======================================================================== */
|
||||||
|
+function(a){"use strict";function b(b){return this.each(function(){var d=a(this),e=d.data("bs.toggle"),f="object"==typeof b&&b;e||d.data("bs.toggle",e=new c(this,f)),"string"==typeof b&&e[b]&&e[b]()})}var c=function(b,c){this.$element=a(b),this.options=a.extend({},this.defaults(),c),this.render()};c.VERSION="2.2.0",c.DEFAULTS={on:"On",off:"Off",onstyle:"primary",offstyle:"default",size:"normal",style:"",width:null,height:null},c.prototype.defaults=function(){return{on:this.$element.attr("data-on")||c.DEFAULTS.on,off:this.$element.attr("data-off")||c.DEFAULTS.off,onstyle:this.$element.attr("data-onstyle")||c.DEFAULTS.onstyle,offstyle:this.$element.attr("data-offstyle")||c.DEFAULTS.offstyle,size:this.$element.attr("data-size")||c.DEFAULTS.size,style:this.$element.attr("data-style")||c.DEFAULTS.style,width:this.$element.attr("data-width")||c.DEFAULTS.width,height:this.$element.attr("data-height")||c.DEFAULTS.height}},c.prototype.render=function(){this._onstyle="btn-"+this.options.onstyle,this._offstyle="btn-"+this.options.offstyle;var b="large"===this.options.size?"btn-lg":"small"===this.options.size?"btn-sm":"mini"===this.options.size?"btn-xs":"",c=a('<label class="btn">').html(this.options.on).addClass(this._onstyle+" "+b),d=a('<label class="btn">').html(this.options.off).addClass(this._offstyle+" "+b+" active"),e=a('<span class="toggle-handle btn btn-default">').addClass(b),f=a('<div class="toggle-group">').append(c,d,e),g=a('<div class="toggle btn" data-toggle="toggle">').addClass(this.$element.prop("checked")?this._onstyle:this._offstyle+" off").addClass(b).addClass(this.options.style);this.$element.wrap(g),a.extend(this,{$toggle:this.$element.parent(),$toggleOn:c,$toggleOff:d,$toggleGroup:f}),this.$toggle.append(f);var h=this.options.width||Math.max(c.outerWidth(),d.outerWidth())+e.outerWidth()/2,i=this.options.height||Math.max(c.outerHeight(),d.outerHeight());c.addClass("toggle-on"),d.addClass("toggle-off"),this.$toggle.css({width:h,height:i}),this.options.height&&(c.css("line-height",c.height()+"px"),d.css("line-height",d.height()+"px")),this.update(!0),this.trigger(!0)},c.prototype.toggle=function(){this.$element.prop("checked")?this.off():this.on()},c.prototype.on=function(a){return this.$element.prop("disabled")?!1:(this.$toggle.removeClass(this._offstyle+" off").addClass(this._onstyle),this.$element.prop("checked",!0),void(a||this.trigger()))},c.prototype.off=function(a){return this.$element.prop("disabled")?!1:(this.$toggle.removeClass(this._onstyle).addClass(this._offstyle+" off"),this.$element.prop("checked",!1),void(a||this.trigger()))},c.prototype.enable=function(){this.$toggle.removeAttr("disabled"),this.$element.prop("disabled",!1)},c.prototype.disable=function(){this.$toggle.attr("disabled","disabled"),this.$element.prop("disabled",!0)},c.prototype.update=function(a){this.$element.prop("disabled")?this.disable():this.enable(),this.$element.prop("checked")?this.on(a):this.off(a)},c.prototype.trigger=function(b){this.$element.off("change.bs.toggle"),b||this.$element.change(),this.$element.on("change.bs.toggle",a.proxy(function(){this.update()},this))},c.prototype.destroy=function(){this.$element.off("change.bs.toggle"),this.$toggleGroup.remove(),this.$element.removeData("bs.toggle"),this.$element.unwrap()};var d=a.fn.bootstrapToggle;a.fn.bootstrapToggle=b,a.fn.bootstrapToggle.Constructor=c,a.fn.toggle.noConflict=function(){return a.fn.bootstrapToggle=d,this},a(function(){a("input[type=checkbox][data-toggle^=toggle]").bootstrapToggle()}),a(document).on("click.bs.toggle","div[data-toggle^=toggle]",function(b){var c=a(this).find("input[type=checkbox]");c.bootstrapToggle("toggle"),b.preventDefault()})}(jQuery);
|
||||||
|
//# sourceMappingURL=bootstrap-toggle.min.js.map
|
||||||
Loading…
Reference in New Issue