Commit 5e735e0a authored by wangjiangze's avatar wangjiangze

菜单样式支持缩放

parent 9370f01e
......@@ -12,29 +12,29 @@ class IndexAction extends CommonAction {
if ($a['pid'] == 1){
switch($a['title'])
{
case '系统':
$cla = 'fa-cog';
case '酒店管理':
$cla = 'fa-institution';
break;
case '网络':
$cla = 'fa-sitemap';
case '合作方管理':
$cla = 'fa-handshake-o';
break;
case '设备':
$cla = 'fa-desktop';
case '媒资注入':
$cla = 'fa-tv';
break;
case '业务':
$cla = 'fa-suitcase';
case '内容管理':
$cla = 'fa-film';
break;
case '调度':
$cla = 'fa-random';
case '播控管理':
$cla = 'fa-toggle-on';
break;
case '运维':
$cla = 'fa-tasks';
case '监控告警':
$cla = 'fa-warning';
break;
case '配置':
$cla = 'fa-gears';
case '日志管理':
$cla = 'fa-volume-up';
break;
case '监控':
$cla = 'fa-video-camera';
case '系统配置':
$cla = 'fa-gears';
break;
default:
$cla = 'fa-cog';
......
......@@ -57,7 +57,7 @@ body{padding:20px}
</div>
<div class="col-sm-4">
<label class="control-label col-sm-5" style="text-align:left" for="multiselect"><font color="red">*</font> 已选择酒店</label>
<label class="control-label col-sm-6" style="text-align:left" for="multiselect"><font color="red">*</font> 已选择酒店</label>
<select id="multiselect_to" class="form-control" size="8" multiple="multiple" name="hotel_lists[]" style="height:160px"></select>
</div>
</div>
......@@ -97,7 +97,7 @@ body{padding:20px}
</div>
<div class="col-sm-4">
<label class="control-label col-sm-5" style="text-align:left" for="multiselectMedia"><font color="red">*</font> 已选择媒资</label>
<label class="control-label col-sm-6" style="text-align:left" for="multiselectMedia"><font color="red">*</font> 已选择媒资</label>
<select id="multiselectMedia_to" class="form-control" size="8" multiple="multiple" name="media_lists[]" style="height:160px"></select>
</div>
</div>
......
......@@ -57,7 +57,7 @@ body{padding:20px}
<div class="form-group">
<label for="name" class="col-sm-2 control-label"></label>
<div class="col-sm-4">
<label class="control-label col-sm-3" for="multiselectMedia">未选择</label>
<label class="control-label col-sm-5" style="text-align:left" for="multiselectMedia">未选择</label>
<select id="multiselectMedia" class="form-control" size="8" multiple="multiple" style="height:160px">
</select>
</div>
......@@ -72,7 +72,7 @@ body{padding:20px}
</div>
<div class="col-sm-4">
<label class="control-label col-sm-4" for="multiselectMedia"><font color="red">*</font> 已选择媒资</label>
<label class="control-label col-sm-6" style="text-align:left" for="multiselectMedia"><font color="red">*</font> 已选择媒资</label>
<select id="multiselectMedia_to" class="form-control" size="8" multiple="multiple" name="media_lists[]" style="height:160px"></select>
</div>
</div>
......
......@@ -102,7 +102,7 @@
</script>
<style type="text/css">
.fa-cog,.fa-sitemap,.fa-desktop,.fa-suitcase,.fa-random,.fa-tasks,.fa-video-camera,.fa-gears{ vertical-align: middle; padding-bottom: 1px; margin-right: 10px;font-size:16px; color:#e3e3e3}
.fa-cog,.fa-institution,.fa-handshake-o,.fa-tv,.fa-film,.fa-toggle-on,.fa-warning,.fa-info,.fa-volume-up,.fa-sitemap,.fa-desktop,.fa-suitcase,.fa-random,.fa-tasks,.fa-video-camera,.fa-gears{ vertical-align: middle; padding-bottom: 1px; margin-right: 10px;font-size:16px; color:#e3e3e3}
.system,.net,.dis,.equ,.bus,.dev,.monitor,.fa-home{ color:#6a6f73; margin: 0 5px;}
.fa-home{ font-size: 17px;}
.fa-tablet{ vertical-align: middle; padding-bottom: 1px; margin-right: 10px;color:#adadad}
......@@ -138,23 +138,24 @@
</div>
</div>
</div>
<div class="nav">
<div class="layui-side layui-bg-black" style="position: fixed; top: 65px; bottom: 0; left: 0; overflow-x: hidden; z-index: 999;">
<div class="layui-side-scroll">
<div title="菜单缩放" class="kit-side-fold" style="width:200px; text-align: center; color: #c2c2c2; background: #4e555b; padding-top: 5px; font-size: 16px; padding-bottom: 5px;"><i class="fa fa-navicon" aria-hidden="true"></i></div>
<ul class="layui-nav layui-nav-tree layui-nav-side" lay-filter="index">
<!-- 侧边导航: <ul class="layui-nav layui-nav-tree layui-nav-side"> -->
<volist name="menus" id="vo">
<li class="layui-nav-item ">
<a href="javascript:;"><span class="fa {$vo.class}"></span>{$vo.title}</a>
<li class="layui-nav-item " title="{$vo.title}">
<a href="javascript:;"><i class="fa {$vo.class}"></i><span>{$vo.title}</span></a>
<dl class="layui-nav-child">
<volist name="vo['children']" id="sub">
<dd><a onclick="openMenu('<span class=manage-dispatching-1></span>{$sub.title}','{$sub.url}')" href="javascript:;"><span></span>{$sub.title}</a></dd>
<dd><a onclick="openMenu('<span class=manage-dispatching-1></span>{$sub.title}','{$sub.url}')" href="javascript:;" title="{$sub.title}"><i class="fa fa-caret-right"></i><span>{$sub.title}</span></a></dd>
</volist>
</dl>
</li>
</volist>
</ul>
</div>
</div>
<div class="layui-tab layui-tab-brief " lay-allowClose="true" lay-filter="demo" style="margin: 65px 0 0 200px">
<ul id="tab" class="layui-tab-title" style="min-width: 1000px">
<li lay-id="首页" class="layui-this"><span class="home"></span>首页<a style='display: inherit; margin-left: 4px;margin-right: -4px;color: #757070;font-size: 13px;' href='javascript:;' onclick='location.reload()'><i class='fa fa-repeat'></i></a></li>
......@@ -392,6 +393,55 @@
//…
});
var isShow = true; //定义一个标志位
$('.kit-side-fold').click(function(){
//选择出所有的span,并判断是不是hidden
$('.layui-nav-item span').each(function(){
if($(this).is(':hidden')){
$(this).show();
}else{
$(this).hide();
}
});
//判断isshow的状态
if(isShow){
// $('.layui-side.layui-bg-black').width(60); //设置宽度
$(".layui-side.layui-bg-black").animate({'width':'60px'},"fast");
$('.kit-side-fold i').css('margin-right', '70%'); //修改图标的位置
//将footer和body的宽度修改
$('.layui-body').css('left', 60+'px');
$('.layui-footer').css('left', 60+'px');
$('.layui-nav-item i').css('margin-top',15+'px');
// $('.layui-tab.layui-tab-brief').css("margin-left",60+'px');
$(".layui-tab.layui-tab-brief").animate({'margin-left':'60px'},"fast");
//将二级导航栏隐藏
$('dd i').each(function(){
$(this).hide();
});
$("dd span").show();
$("dd a").animate({'padding':'0px'},"fast");
//修改标志位
isShow =false;
}else{
// $('.layui-side.layui-bg-black').width(200);
$(".layui-side.layui-bg-black").animate({'width':'200px'},"fast");
$('.kit-side-fold i').css('margin-right', '10%');
$('.layui-body').css('left', 200+'px');
$('.layui-footer').css('left', 200+'px');
$('.layui-nav-item i').css('margin-top',0+'px');
// $('.layui-tab.layui-tab-brief').css("margin-left",200+'px');
$(".layui-tab.layui-tab-brief").animate({'margin-left':'200px'},"fast");
$('dd i').each(function(){
$(this).show();
});
$("dd span").show();
$("dd a").animate({'padding':'0 20px'},"fast");
isShow =true;
}
});
$("ul .layui-nav-item a").click(function(){
if(isShow==false){
$('.kit-side-fold').trigger("click");
}
});
</script>
\ No newline at end of file
......@@ -56,9 +56,9 @@ a img{ border:0;}
.layui-nav-tree .layui-nav-item a .manage-dispatching{ background-position: 0 -63px;}
.layui-nav-tree .layui-nav-item a .manage-nameList{background-position: 0 -80px;}
.layui-nav-itemed .layui-nav-child a span{background: url(../images/icon-group.png) no-repeat -24px -126px;display: inline-block; width: 6px; height: 9px; vertical-align: middle; margin:0 10px;}
.layui-nav-itemed .layui-nav-child a i{/*background: url(../images/icon-group.png) no-repeat -24px -126px;*/display: inline-block; width: 6px; height: 9px; /*vertical-align: middle;*/ margin:0 10px;}
.layui-nav-tree .layui-nav-child dd.layui-this a span,.layui-nav-tree .layui-this a span{background: url(../images/icon-group.png) no-repeat -24px -113px;}
.layui-nav-tree .layui-nav-child dd.layui-this a span,.layui-nav-tree .layui-this a span{/*background: url(../images/icon-group.png) no-repeat -24px -113px;*/}
.layui-tab-title{ min-width: 1200px;}
.hyperchanne{padding:0px 0px 5px 0; min-width: 800px;}
......
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment