117 lines
3.7 KiB
Plaintext
117 lines
3.7 KiB
Plaintext
|
@using JXCMS.Core.Themes
|
|||
|
|
|
|||
|
|
|
|||
|
|
<div class="container-fluid p-t-15">
|
|||
|
|
<div class="card">
|
|||
|
|
<div class="card-body">
|
|||
|
|
<ul class="list-inline clearfix">
|
|||
|
|
@foreach (var theme in ViewBag.themes)
|
|||
|
|
{
|
|||
|
|
<li class="col-xs-12 col-sm-5 col-md-3 themebroder">
|
|||
|
|
<div class="imgbox">
|
|||
|
|
<img alt="@theme.ThemeName" src="/theme/@theme.FolderName/@theme.ScreenShot"/>
|
|||
|
|
<span class="themename">@theme.ThemeName</span>
|
|||
|
|
</div>
|
|||
|
|
<div style="width: 100%;margin-top: 10px">
|
|||
|
|
<div class="col-xs-8 col-sm-8 col-md-8" style="text-align: center">
|
|||
|
|
@switch (@theme.ThemeType)
|
|||
|
|
{
|
|||
|
|
case ThemeUtil.PcTheme:
|
|||
|
|
<text>电脑版主题</text>
|
|||
|
|
break;
|
|||
|
|
case ThemeUtil.MobileTheme:
|
|||
|
|
<text>手机版主题</text>
|
|||
|
|
break;
|
|||
|
|
case ThemeUtil.AdaptiveTheme:
|
|||
|
|
<text>自适应主题</text>
|
|||
|
|
break;
|
|||
|
|
default:
|
|||
|
|
<text>电脑版主题</text>
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
</div>
|
|||
|
|
<div class="col-xs-4 col-sm-4 col-md-4">
|
|||
|
|
@if (theme.IsUsing)
|
|||
|
|
{
|
|||
|
|
<button class="btn btn-default" disabled="">已启用</button>
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
<button class="btn btn-primary" onclick="selectTheme('@theme.FolderName', @theme.ThemeType)">启用</button>
|
|||
|
|
}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</li>
|
|||
|
|
}
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
@section style
|
|||
|
|
{
|
|||
|
|
<link rel="stylesheet" href="@Url.ContentAdmin("js/jconfirm/jquery-confirm.min.css")">
|
|||
|
|
<style>
|
|||
|
|
.imgbox{
|
|||
|
|
position: relative;
|
|||
|
|
overflow: hidden;
|
|||
|
|
padding-bottom: 75%;/*重要属性*/
|
|||
|
|
}
|
|||
|
|
.imgbox img{
|
|||
|
|
width: 100%;
|
|||
|
|
position: absolute;
|
|||
|
|
}
|
|||
|
|
.themename{
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
background-color: #0b2e13;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
width: 100%;
|
|||
|
|
text-align: center
|
|||
|
|
}
|
|||
|
|
.themebroder {
|
|||
|
|
padding-bottom: 16px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@section script
|
|||
|
|
{
|
|||
|
|
<script src="@Url.ContentAdmin("js/jconfirm/jquery-confirm.min.js")"></script>
|
|||
|
|
<script>
|
|||
|
|
function getThemeName(themeType) {
|
|||
|
|
if (themeType === 2) {
|
|||
|
|
return '手机版主题'
|
|||
|
|
}
|
|||
|
|
return '电脑版主题'
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function selectTheme(themeName, themeType) {
|
|||
|
|
$.alert({
|
|||
|
|
title: '切换主题',
|
|||
|
|
content: '是否将' + getThemeName(themeType) + '主题切换为' + themeName + "？",
|
|||
|
|
buttons: {
|
|||
|
|
confirm: {
|
|||
|
|
text: '是',
|
|||
|
|
btnClass: 'btn-primary',
|
|||
|
|
action: function() {
|
|||
|
|
$.ajax({url: '@Url.Action("ChangeTheme")', type: 'post', data: {themeName: themeName, themeType: themeType},
|
|||
|
|
success: function(result,status) {
|
|||
|
|
if (result.code === 200){
|
|||
|
|
window.location.reload()
|
|||
|
|
}else {
|
|||
|
|
$.alert(result.msg)
|
|||
|
|
}
|
|||
|
|
}, error: function(xhr,status,error) {
|
|||
|
|
|
|||
|
|
}})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
cancel: {
|
|||
|
|
text: '否'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
}
|