Merge branch 'master' of http://192.168.1.220:10080/raolu/PC-application

api/consulting-api.js

@@ -0,0 +1,30 @@
(function($){
	var consulting = {
        //创建会话
		createSession: function(data) {
			return httpRequest.imHttpPost("/sessions", {data: data})
		},
		//获取成员列表
		getParticipants:function(sessionId){
			return httpRequest.imHttpGet("/sessions/"+sessionId+"/participants", {data: {}})
		},
       //获取im消息
       getMessages:function(data){
       		return httpRequest.imHttpGet("/sessions/"+data.session_id+"/messages",{data:data});
       },
       //发送消息
       sendMessage: function(sessionId, data){
            return httpRequest.imHttpPost('/sessions/'+sessionId+'/messages', data);
        },
        //上传图片
        uploadImage: function(data){
            return httpRequest.post('upload/chat', data);
        },
        //康复管理-保存指导留言
        saveGuidanceMessage: function(data){
            return httpRequest.post('doctor/specialist/rehabilitation/saveGuidanceMessage', {data:data});
        },
    };
    window.consultingAPI = consulting;
})(jQuery)

api/healthy-control-api.js

@@ -0,0 +1,22 @@
(function(exports) {
    var healthAPI = {
        getlist:function(data){
			return httpRequest.get("doctor/guidance_temp/list", {data: data})
        },
        getSpecialList:function(data){
			return httpRequest.get("doctor/specialist/rehabilitation/findRehabilitationPlanList", {data: data})
        },
        PlanDetailList:function(data){
            return httpRequest.get("doctor/specialist/rehabilitation/findRehabilitationPlanDetailList",{data: data})
        },
        getSpecialDisease:function(data){
            return httpRequest.get("doctor/screen/getSpecialDisease",{data: data})
        },
        updatePlanStatusById:function(data){
            return httpRequest.post("doctor/specialist/rehabilitation/updatePlanStatusById",{data: data})
        }
         
    }
    exports.healthAPI = healthAPI;
})(window)

api/recover_api.js

@@ -0,0 +1,65 @@
(function(exports) {
    var recoverAPI = {
		// 居民康复详情
		patientRehabilitationDetail: function(data) {
			return httpRequest.get("doctor/specialist/rehabilitation/patientRehabilitationDetail", {data: data})
		},
		// 近期康复记录
		recentPlanDetailRecord: function(data) {
			return httpRequest.get("doctor/specialist/rehabilitation/recentPlanDetailRecord", {data: data})
		},
		// 就诊记录
		archivesEvent: function(data) {
			return httpRequest.get("doctor/archives/event", {data: data})
		},
		// 完成项目详情
		serviceItem: function(data) {
			return httpRequest.get("doctor/specialist/rehabilitation/serviceItem", {data: data})
		},
		// 获取专病居民类别
		findLabelAndPatientCountByDoctor: function(data) {
			return httpRequest.get("doctor/specialist/findLabelAndPatientCountByDoctor", {data: data})
		},
		// 获取居民列表by医生
		getPatientInfoByDoctor: function(data) {
			return httpRequest.get("doctor/specialist/getPatientInfoByDoctor", {data: data})
		},
		// 获取居民信息
		getPatientInfo: function(data) {
			return httpRequest.get("doctor/patient_label_info/patient", {data: data})
		},
		// 获取模板列表
		findTemplateList: function(data) {
			return httpRequest.get("/doctor/specialist/rehabilitationPlan/findTemplateList", {data: data})
		},
		// 获取模板详细
		findTemplateDetail: function(data) {
			return httpRequest.get("/doctor/specialist/rehabilitationPlan/findTemplateDetail", {data: data})
		},
		// 删除模板
		deleteTemplate: function(data) {
			return httpRequest.get("/doctor/specialist/rehabilitationPlan/deleteTemplate", {data: data})
		},
		// 获取机构服务项目列表
		findServiceItemsByHospital: function(data) {
			return httpRequest.get("/doctor/specialist/hospitalServiceItem/findServiceItemsByHospital", {data: data})
		},
		// 获取医生团队疾病
		findTeamDiseaseRelation: function(data) {
			return httpRequest.get("third/specialist/findTeamDiseaseRelation", {data: data})
		},
		// 根据机构服务id获取详细信息
		selectByIds: function(data) {
			return httpRequest.get("doctor/specialist/hospitalServiceItem/selectByIds", {data: data})
		},
		// 创建康复计划
		createRehabilitationPlan: function(data) {
			return httpRequest.post("doctor/specialist/rehabilitationPlan/createRehabilitationPlan", {data: data})
		},
		// 根据患者获取专科医生跟技管师
		findPatientSignSpecialistInfo: function(data) {
			return httpRequest.get("doctor/specialist/findPatientSignSpecialistInfo", {data: data})
		}
	}
    exports.recoverAPI = recoverAPI;
})(window)

api/rehabilitation-api.js

@@ -0,0 +1,44 @@
(function(exports) {
    var rehaAPI = {
    	//获取日历列表
		calendarPlanDetail: function(data) {
			return httpRequest.get("doctor/specialist/rehabilitation/calendarPlanDetail",{data:data})
		},
		//获取列表
		calendarPlanDetailList: function(data) {
			return httpRequest.get("doctor/specialist/rehabilitation/calendarPlanDetailList",{data:data})
		},
		serviceItemList:function(data){
			return httpRequest.get("doctor/specialist/rehabilitation/serviceItemList",{data:data})
		},
		serviceItem:function(data){
			return httpRequest.get("doctor/specialist/rehabilitation/serviceItem",{data:data})
		},
		//获取医生二维码
		createServiceQrCode: function(data){
			return httpRequest.post('doctor/specialist/rehabilitation/createServiceQrCode',{data:data})
		},
//		居民扫码后验证是否是关联的居民扫码(居民端)
		checkAfterQrCode: function(data){
			return httpRequest.post('patient/specialist/rehabilitation/checkAfterQrCode',{data:data})
		},
		upload:function(file){
			return httpRequest.post('upload/fastDFSImag',{data: file,contentType: false,
            cache: false,
            processData: false})
		},
		updateNoteAndImageRehabilitationOperate:function(data){
			return httpRequest.post('doctor/specialist/rehabilitation/updateNoteAndImageRehabilitationOperate',{data:data})
		},
//		新增operateRecodr
		saveRehabilitationOperateRecodr:function(data){
			return httpRequest.post('doctor/specialist/rehabilitation/saveRehabilitationOperateRecodr',{data:data})
		},
		
		
		
		
		
	}
    exports.rehaAPI = rehaAPI;
})(window)

app/article/html/article.html

@@ -80,6 +80,7 @@
	    <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
	    <script src="../../../api/http-request.js" type="text/javascript" charset="utf-8"></script>
	    <script type="text/javascript" src="../../../api/jbsc-api.js" ></script>
	    <script type="application/javascript" src="../../../api/rehabilitation-api.js"></script>
		<script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
		<!--<script src="../../../plugins/layer/layer.min.js"></script>-->
        <script type="text/javascript">
@@ -111,6 +112,8 @@
		            levelTit2: '请选择',
		            isShowLevel2: false,
		            resultCode:httpData['resultCode'],
		            isReha:httpData['isReha'],
		            planId:httpData['planId'],
		            selectObj: {
		                firstLevelCategoryId: null, // 文章一级分类
		                secondLevelCategoryId: null, // 文章二级分类
@@ -151,10 +154,9 @@
		            allRecords: null
			    },
				 mounted: function(){
			        var  vm = this
			        this.getJkEduArticleLevel(1)
			        this.getJkEduArticleLevel(2)
			        this.queryArticlePcList(vm.selectObj)
			        this.queryArticlePcList(this.selectObj)
			    },
			    methods: {
			       	getJkEduArticleLevel:function(num, firstlevelId) {
@@ -294,11 +296,39 @@
			            jbscAPI.doctorSendArticleToPatients(obj).then(function(res){
			            	top.layer.close(loadding);
			            	if(res.status==10000){
			            		vm.updataHeathStatus();
			            		if(vm.isReha){
			            			console.log(obj.articleId)
			            			vm.saveRehabilitationOperateRecodr(obj.articleId);
			            		}else{			            			
			            			vm.updataHeathStatus();
			            		}
			            	}else{			            		
			            		top.layer.msg(res.message, {icon: 1});
			            	}
			            })   
			        },
			        saveRehabilitationOperateRecodr:function(id){
			        	var vm=this;
			        	var userInfo = JSON.parse(window.localStorage.getItem(httpRequest.agentName)); 
			        	var params={
			        		rehabilitationDetailId:vm.planId,
							node:null,
							patientCode:httpData['code'],
							doctorCode:userInfo.uid,
							relationRecordType:3,
							relation_record_code:id,
							relationRecordImg:null,
							status:0
			        	}
			        	rehaAPI.saveRehabilitationOperateRecodr({dataJson:JSON.stringify(params)}).then(function(res){
			        		var icon=5;
			        		if(res.status==200){//更新父窗体的状态
			        			icon=1
			        			parent.serviceItem.getServiceItem();
			        		}
			        		top.layer.msg(res.msg, {icon: icon});
			        	})
			        	
			        },
				    updataHeathStatus:function(){
				    	var obj={

app/consulting/css/consulting.css

@@ -0,0 +1,567 @@
.div-main-content,#main{
	height: 100%;
}
.consulting-panel{
    height: calc(100% - 150px);
    position: relative;
}
.c-12b7f5{
    color: #12b7f5;
}
.input-panel{
    height: 150px;
    position: relative;
}
.mtb6{
    margin-top: 6px;
    margin-bottom: 6px;
}
p{
    margin-top: 6px;
    margin-bottom: 6px;
}
.c-chat-box {
	border: none;
	padding-left: 2%;
	padding-right: 2%;
}
.time-tips {
	margin: 10px 0 0 0;
	text-align: center;
	clear: both;
}
.time-tips span {
	position: relative;
	display: inline-block;
	padding: 0 60px;
	color: #aeaeae;
	font-size: 15px;
}
.time-tips span:before,
.time-tips span:after {
	position: absolute;
	content: "";
	display: block;
	width: 50px;
	height: 1px;
	background: #e6e4e1;
	top: 50%;
}
.time-tips span:before {
	left: 0;
}
.time-tips span:after {
	right: 0;
}
.chat-left,
.chat-right {
	clear: both;
	overflow: hidden;
	padding: 10px 0;
}
.chat-left > dt,
.chat-right > dt {
	width: 40px;
	height: 40px;
}
.chat-left > dt {
	float: left;
	margin-right: 15px;
}
.chat-right > dt {
	float: right;
	margin-left: 15px;
}
.chat-left > dt img,
.chat-right > dt img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
}
.chat-left > dd,
.chat-right > dd {
	position: relative;
	min-height: 18px;
	font-size: 15px;
	display: inline-block;
	max-width: 80%;
	background: #fff;
	border: 1px solid #e1e1e1;
	border-radius: 6px;
	padding: 8px 10px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
}
.chat-left > dd {
	float: left;
	/* white-space: pre-wrap; */
	word-wrap: break-word;
}
.chat-right > dd {
	float: right;
	background: #bce0ff;
	border: 1px solid #81bdf7;
	/* white-space: pre-wrap; */
	word-wrap: break-word;
}
.chat-left > dd:after {
	content: "";
	position: absolute;
	top: 14px;
	left: -6px;
	display: block;
	width: 8px;
	height: 8px;
	background: #fff;
	border-color: #e1e1e1;
	border-style: solid;
	border-width: 1px 0 0 1px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.chat-right > dd:after {
	content: "";
	position: absolute;
	top: 14px;
	right: -6px;
	display: block;
	width: 8px;
	height: 8px;
	background: #bce0ff;
	border-color: #81bdf7;
	border-style: solid;
	border-width: 1px 0 0 1px;
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	transform: rotate(135deg);
}
.chat-left > dd p img,
.chat-right > dd p img {
	max-width: 150px;
	max-height: 150px;
	margin: 5px 0;
}
.chat-msg-box {
	bottom: 0;
	left: 0
}
.chat-msg-box .input-group .form-control {
	height: 32px;
}
.pull-more {
	text-align: center;
	color: #5b5b5b;
	font-size: 14px;
	padding: 14px 0;
}
.chat-right .word-bread.sys-msg{
    background-color: #fff;
    
}
.chat-right .word-bread.sys-msg:after{
    background-color: #fff;
    border-color: #17b3ec;
}
.chat-left .word-bread.sys-msg{
    background-color: #fff;
    border-color: #17b3ec;
}
.chat-left .word-bread.sys-msg:after{
    background-color: #fff;
    border-color: #17b3ec;
}
.sys-header{
    display: inline-block;
    background-color: #17b3ec;
    height: 28px;
    line-height: 28px;
    padding: 0 10px;
    border-radius: 14px;
    color: #fff
}
.sys-header img{
    vertical-align: middle;
    margin-right: 5px;
}
.time-tips span{
	padding: 2px 10px;
	border-radius: 15px;
	color: #aaa;
	/*background-color: #E1E1E1;*/
	font-size: 12px;
}
.time-tips .xt-xiaoxi{
    background-color: #e1e1e1;
}
.chat-left, .chat-right {
	display: -webkit-box;
	clear: both;
	overflow: hidden;
	padding: 10px 0;
}
.chat-right{
	-webkit-box-direction: reverse;
}
.chat-left > dt{
	float: none;
}
.chat-right > dt {
	float: none;
}
.chat-right .word-bread{
	text-align: left;
	/*float: right;*/
	background: #17b3ec;
	border: 1px solid #17b3ec;
	/* white-space: pre-wrap; */
	word-wrap: break-word;
	
	position: relative;
	min-height: 18px;
	font-size: 15px;
	display: inline-block;
	max-width: 80%;
	border-radius: 6px;
	padding: 8px 10px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
}
.chat-right > div.c-content{
	-webkit-box-flex: 1;
	text-align: right;
}
.chat-right .word-bread:after{
	content: "";
	position: absolute;
	top: 5px;
	right: -5px;
	display: block;
	width: 8px;
	height: 8px;
	background: #17b3ec;
	border-color: #17b3ec;
	border-style: solid;
	border-width: 1px 0 0 1px;
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	transform: rotate(135deg);
}
.chat-left .word-bread{
	/*float: left;*/
	/* white-space: pre-wrap; */
	word-wrap: break-word;
	
	position: relative;
	min-height: 18px;
	font-size: 15px;
	display: inline-block;
	max-width: 80%;
	background: #fff;
	border: 1px solid #e1e1e1;
	border-radius: 6px;
	padding: 8px 10px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
}
.chat-left > div.c-content{
	-webkit-box-flex: 1;
	text-align: left;
}
.chat-left .word-bread:after{
	content: "";
	position: absolute;
	top: 5px;
	left: -5px;
	display: block;
	width: 8px;
	height: 8px;
	background: #fff;
	border-color: #e1e1e1;
	border-style: solid;
	border-width: 1px 0 0 1px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.chat-left span.name, .chat-right span.name{
	display: block;
	height: 24px;
}
.time-tips span:before, .time-tips span:after{
	height: 0!important;
}
.action-panel{
    background-color: #F5F5FA;
    height: 30px;
    line-height: 30px;
    padding-left: 20px;
    padding-right: 20px;
}
.action-panel i{
    font-size: 18px;
}
.send-btn{
    background-color: #12b7f5;
    color: #fff;
    border: 1px solid #12b7f5;
    position: absolute;
    right: 10px;
    bottom: 10px;
    padding: 4px 10px;
}
.send-btn.disabled,
.send-btn.disabled:hover
{
    border: 1px solid #e7eaec;
    background-color: #f2f4f6;
    color: #ccc;
}
.input-msg{
    width: 100%;
    line-height: 22px;
    overflow-x: hidden;
    overflow-y: auto;
    height: 76px;
    padding: 5px 10px;
    font-size: 14px;
    -webkit-user-select: auto;
    user-modify: read-write-plaintext-only;
    -webkit-user-modify: read-write-plaintext-only
}
.info-panel{
    height: 26px;
    line-height: 26px;
    font-size: 12px;
    color: #666;
    text-align: center;
    background-color: #fafaeb;
}
.info-panel a{
    color: #12b7f5;
}
.diseaseInfo{
    font-size: 12px;
    color: #999;
    background-color: #f5f5fa;
    display: inline-block;
    padding: 5px 12px;
    border-radius: 14px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.status-btn{
    display: inline-block;
    height: 30px;
    border: 1px solid #12b7f5;
    line-height: 30px;
    padding: 0 12px;
    border-radius: 2px;
    color: #12b7f5;
    margin-top: 10px;
}
.consult-icon{
    width: 16px;
    height: 16px;
    margin-right: 10px;
}
.icon-image:before{
    content: url(../../../images/img_icon.png);
}
.icon-image:hover:before{
    content: url(../../../images/img_icon_pre.png);
}
.icon-reply:before{
    content: url(../../../images/huifu_icon.png);
}
.icon-reply:hover:before{
    content: url(../../../images/huifu_icon_pre.png);
}
.quick-reply-panel{
    position: absolute;
    bottom: 0;
    left: 50px;
    background-color: #fff;
    border: 1px solid #e1e1e1;
    display: none;
    max-width: 50%;
}
.reply-list{
    margin: 0;
    padding: 0;
    list-style: none;
}
.reply-list li{
    border-top: 1px solid #e1e1e1;
    padding: 10px;
    text-align: center;
    word-wrap: break-word;
}
.reply-list li:first-child{
    border-top: 0;
}
.reply-list li:hover{
    color: #12b7f5;
}
.chat-right .word-bread.msg-fv{
    background-color: #f5f5fa;
    padding: 10px;
    border: none;
}
.chat-right .word-bread.msg-fv:after{
    background-color: #f5f5fa;
    border-color: #f5f5fa;
}
.msg-fv .fv-content{
    background-color: #fff;
    padding: 8px 10px;
    border-radius: 6px;
}
.fv-remind{
    text-align: center;
    display: inline-block;
    background-color: #f5f5fa;
    padding: 8px 20px;
    border-radius: 18px;
    color: #666;
    margin-bottom: 15px;
}
.mb10-i{
    margin-bottom: 10px !important;
}
.layer-info-content{
    width: 80%;
    margin: auto;
}
body .alert-info .layui-layer-title{
    background-color: #fff;
    border-bottom: 0;
}
body .alert-info .layui-layer-content{
    padding: 0px 20px 10px;
    text-align: center;
    color: #333;
}
body .alert-info .layui-layer-btn{
    text-align: center;
    border-top: 0;
    background-color: #fff;
    padding: 20px;
}
body .alert-info .layui-layer-btn a{
    background-color: #fff;
    border: 1px solid #d7dce6;
    color: #666;
}
.flex-box-li{
    display: -webkit-box;
    display: box;
    -webkit-box-pack: center;
    -webkit-box-align: center;
}
.col-0{
    -webkit-box-flex: 0;
    box-flex: 0;
}
.col-1{
    -webkit-box-flex: 1;
    box-flex: 1;
}
body .quick-reply-setting .layui-layer-title{
    height: 40px;
    background-color: #fff;
    line-height: 40px;
    font-size: 14px;
    font-weight: normal;
    padding: 0 80px 0 10px;
}
body .quick-reply-setting .layui-layer-content{
    padding: 10px;
    color: #333;
}
body .quick-reply-setting .layui-layer-btn{
    background-color: #fff;
    border-top: 0;
    padding: 10px;
}
body .quick-reply-setting .layui-layer-btn a{
    background-color: #fafafa;
    border: 1px solid #d7dce6;
    color: #666;
}
body .quick-reply-setting .layui-layer-btn .layui-layer-btn0{
    border-color: #12b7f5;
}
body .quick-reply-setting .layui-layer-btn .layui-layer-btn1{
}
ul{
    margin: 0;
    list-style: none;
    padding: 0;
}
.reply-list2 li{
    padding: 10px 10px;
}
.link-blue,
.link-blue:hover,
.link-blue:focus
{
    color: #12b7f5;
    text-decoration: underline;
}
.work-break{
    word-wrap: break-word;
}
.ui-col-3{
	height: 100%;
}
.div-message-content{
	height: 100%;
}
.time-tips i {
    width: 60px;
    height: 1px;
    margin-bottom: 4px;
    display: inline-block;
}
.zuoxianduan-icon{
    background-image: url(../../../images/zuoxianduan_img.png);
    background-repeat: no-repeat;
}
.youxianduan-icon{
    background-image: url(../../../images/youxianduan_img.png);
    background-repeat: no-repeat;
}

app/consulting/css/style.css

@@ -0,0 +1,5808 @@
h1,h2,h3,h4,h5,h6 {
    font-weight:100
}
h1 {
    font-size:30px
}
h2 {
    font-size:24px
}
h3 {
    font-size:16px
}
h4 {
    font-size:14px
}
h5 {
    font-size:12px
}
h6 {
    font-size:10px
}
h3,h4,h5 {
    margin-top:5px;
    font-weight:600
}
.c-333{
    color: #333;
}
.c-666{
    color: #666;
}
.c-999{
    color: #999;
}
.c-fff{
    color: #fff;
}
.c-12b7f5{
    color: #12b7f5;
}
.bgc-12b7f5{
    background-color: #12b7f5;
}
.bgc-f5f5fa{
    background-color: #f5f5fa;
}
.c-f14{
    font-size: 14px;
}
.btn-w-80{
    width: 80px;
}
a:focus {
    outline:0
}
.nav>li{
    border-top: 1px solid #d7dce6;
}
.nav>li:first-child,
.nav-second-level>li{
    border-top: none;
}
.nav>li>a {
    color: #333;
    font-weight:600;
    font-size: 14px;
    padding:14px 20px 14px 25px
}
.nav li>a {
    display:block
}
.nav-second-level>li>a{
    color: #666;
    font-weight: normal;
}
.nav.navbar-right>li>a {
    color:#999c9e
}
.nav>li.active>a {
    /* color:#fff */
}
.navbar-default .nav-second-level>li>a:focus{
    background-color: #cbcbd2;
}
.navbar-default .nav>li>a:hover {
    background-color:#ebebf5;
    /* color:#fff */
}
.nav .open>a,.nav .open>a:focus,.nav .open>a:hover {
    background:#fff
}
.nav>li>a i {
    margin-right:6px
}
.navbar {
    border:0
}
.navbar-default {
    background-color:transparent;
    border-color:#2f4050;
    position:relative
}
.navbar-top-links li {
    display:inline-block
}
.navbar-top-links li:last-child {
    margin-right:30px
}
body.body-small .navbar-top-links li:last-child {
    margin-right:10px
}
.navbar-top-links li a {
    padding:20px 10px;
    min-height:50px
}
.dropdown-menu {
    border:medium none;
    display:none;
    float:left;
    font-size:12px;
    left:0;
    list-style:none outside none;
    padding:0;
    position:absolute;
    text-shadow:none;
    top:100%;
    z-index:1000;
    border-radius:0;
    box-shadow:0 0 3px rgba(86,96,117,.3)
}
.dropdown-menu>li>a {
    border-radius:3px;
    color:inherit;
    line-height:25px;
    margin:4px;
    text-align:left;
    font-weight:400
}
.dropdown-menu>li>a.font-bold {
    font-weight:600
}
.navbar-top-links .dropdown-menu li {
    display:block
}
.navbar-top-links .dropdown-menu li:last-child {
    margin-right:0
}
.navbar-top-links .dropdown-menu li a {
    padding:3px 20px;
    min-height:0
}
.navbar-top-links .dropdown-menu li a div {
    white-space:normal
}
.navbar-top-links .dropdown-alerts,.navbar-top-links .dropdown-messages,.navbar-top-links .dropdown-tasks {
    width:310px;
    min-width:0
}
.navbar-top-links .dropdown-messages {
    margin-left:5px
}
.navbar-top-links .dropdown-tasks {
    margin-left:-59px
}
.navbar-top-links .dropdown-alerts {
    margin-left:-123px
}
.navbar-top-links .dropdown-user {
    right:0;
    left:auto
}
.dropdown-alerts,.dropdown-messages {
    padding:10px
}
.dropdown-alerts li a,.dropdown-messages li a {
    font-size:12px
}
.dropdown-alerts li em,.dropdown-messages li em {
    font-size:10px
}
.nav.navbar-top-links .dropdown-alerts a {
    font-size:12px
}
.nav-header {
    padding:33px 25px;
    background:url(patterns/header-profile.png) no-repeat
}
.nav>li.active {
    /* border-left:4px solid #19aa8d; */
    /* background:#293846 */
}
.nav.nav-second-level>li.active {
    border:none
}
.nav.nav-second-level.collapse[style] {
    height:auto!important
}
.nav-header a {
    color:#DFE4ED
}
.nav-header .text-muted {
    color:#8095a8
}
.minimalize-styl-2 {
    padding:4px 12px;
    margin:14px 5px 5px 20px;
    font-size:14px;
    float:left
}
.navbar-form-custom {
    float:left;
    height:50px;
    padding:0;
    width:200px;
    display:inline-table
}
.navbar-form-custom .form-group {
    margin-bottom:0
}
.nav.navbar-top-links a {
    font-size:14px
}
.navbar-form-custom .form-control {
    background:none repeat scroll 0 0 rgba(0,0,0,0);
    border:medium none;
    font-size:14px;
    height:60px;
    margin:0;
    z-index:2000
}
.count-info .label {
    line-height:12px;
    padding:1px 5px;
    position:absolute;
    right:6px;
    top:12px
}
.arrow {
    float:right;
    margin-top:2px
}
.fa.arrow:before {
    content:"\f106"
}
.active>a>.fa.arrow:before {
    content:"\f107"
}
.nav-second-level li,.nav-third-level li {
    border-bottom:none!important
}
.nav-second-level li a {
    padding:7px 15px 7px 10px;
    padding-left:52px
}
.nav-third-level li a {
    padding-left:62px
}
.nav-second-level li:last-child {
    margin-bottom:10px
}
.mini-navbar .nav li:focus>.nav-second-level,body:not(.fixed-sidebar):not(.canvas-menu).mini-navbar .nav li:hover>.nav-second-level {
    display:block;
    border-radius:0 2px 2px 0;
    min-width:140px;
    height:auto
}
body.mini-navbar .navbar-default .nav>li>.nav-second-level li a {
    font-size:12px;
    border-radius:0 2px 2px 0
}
.fixed-nav .slimScrollDiv #side-menu {
    padding-bottom:60px;
    position:relative
}
.slimScrollDiv >* {
    overflow:hidden
}
.mini-navbar .nav-second-level li a {
    padding:10px 10px 10px 15px
}
.canvas-menu.mini-navbar .nav-second-level {
    background:#293846
}
.mini-navbar li.active .nav-second-level {
    left:65px
}
.navbar-default .special_link a {
    background:#1ab394;
    color:#fff
}
.navbar-default .special_link a:hover {
    background:#17987e!important;
    color:#fff
}
.navbar-default .special_link a span.label {
    background:#fff;
    color:#1ab394
}
.navbar-default .landing_link a {
    background:#1cc09f;
    color:#fff
}
.navbar-default .landing_link a:hover {
    background:#1ab394!important;
    color:#fff
}
.navbar-default .landing_link a span.label {
    background:#fff;
    color:#1cc09f
}
.logo-element {
    text-align:center;
    font-size:18px;
    font-weight:600;
    color:#fff;
    display:none;
    padding:18px 0
}
.pace-done #page-wrapper,.pace-done .footer,.pace-done .nav-header,.pace-done .navbar-static-side,.pace-done li.active {
    -webkit-transition:all .5s;
    transition:all .5s
}
.navbar-fixed-top {
    -webkit-transition-duration:.5s;
    transition-duration:.5s;
    z-index:2030
}
.navbar-fixed-top,.navbar-static-top {
    background:#f3f3f4
}
.fixed-nav #wrapper {
    padding-top:60px;
    box-sizing:border-box
}
.fixed-nav .minimalize-styl-2 {
    margin:14px 5px 5px 15px
}
.body-small .navbar-fixed-top {
    margin-left:0
}
body.mini-navbar .navbar-static-side {
    width:70px
}
body.mini-navbar .nav-label,body.mini-navbar .navbar-default .nav li a span,body.mini-navbar .profile-element {
    display:none
}
body.canvas-menu .profile-element {
    display:block
}
body:not(.fixed-sidebar):not(.canvas-menu).mini-navbar .nav-second-level {
    display:none
}
body.mini-navbar .navbar-default .nav>li>a {
    font-size:16px
}
body.mini-navbar .logo-element {
    display:block
}
body.canvas-menu .logo-element {
    display:none
}
body.mini-navbar .nav-header {
    padding:0;
    background-color:#1ab394
}
body.canvas-menu .nav-header {
    padding:33px 25px
}
body.mini-navbar #page-wrapper {
    margin:0 0 0 70px
}
body.canvas-menu.mini-navbar #page-wrapper,body.canvas-menu.mini-navbar .footer {
    margin:0
}
body.canvas-menu .navbar-static-side,body.fixed-sidebar .navbar-static-side {
    position:fixed;
    width:220px;
    z-index:2001;
    height:100%
}
body.fixed-sidebar.mini-navbar .navbar-static-side {
    width:70px
}
body.body-small.fixed-sidebar.mini-navbar #page-wrapper,body.fixed-sidebar.mini-navbar #page-wrapper {
    margin:0 0 0 70px
}
body.body-small.fixed-sidebar.mini-navbar .navbar-static-side {
    width:70px
}
.fixed-sidebar.mini-navbar .nav li> .nav-second-level {
    display:none
}
.fixed-sidebar.mini-navbar .nav li.active {
    border-left-width:0
}
.canvas-menu.mini-navbar .nav li:hover>.nav-second-level,.fixed-sidebar.mini-navbar .nav li:hover>.nav-second-level {
    position:absolute;
    left:70px;
    top:0;
    background-color:#2f4050;
    padding:10px 10px 0;
    font-size:12px;
    display:block;
    min-width:140px;
    border-radius:2px
}
body.fixed-sidebar.mini-navbar .navbar-default .nav>li>.nav-second-level li a {
    font-size:12px;
    border-radius:3px
}
body.canvas-menu.mini-navbar .navbar-default .nav>li>.nav-second-level li a {
    font-size:13px;
    border-radius:3px
}
.canvas-menu.mini-navbar .nav-second-level li a,.fixed-sidebar.mini-navbar .nav-second-level li a {
    padding:10px 10px 10px 15px
}
.canvas-menu.mini-navbar .nav-second-level,.fixed-sidebar.mini-navbar .nav-second-level {
    position:relative;
    padding:0;
    font-size:13px
}
.canvas-menu.mini-navbar li.active .nav-second-level,.fixed-sidebar.mini-navbar li.active .nav-second-level {
    left:0
}
body.canvas-menu nav.navbar-static-side {
    z-index:2001;
    background:#2f4050;
    height:100%;
    position:fixed;
    display:none
}
body.canvas-menu.mini-navbar nav.navbar-static-side {
    display:block;
    width:70px
}
.top-navigation #page-wrapper {
    margin-left:0
}
.top-navigation .navbar-nav .dropdown-menu>.active>a {
    background:#fff;
    color:#1ab394;
    font-weight:700
}
.white-bg .navbar-fixed-top,.white-bg .navbar-static-top {
    background:#fff
}
.top-navigation .navbar {
    margin-bottom:0
}
.top-navigation .nav>li>a {
    padding:15px 20px;
    color:#676a6c
}
.top-navigation .nav>li a:focus,.top-navigation .nav>li a:hover {
    background:#fff;
    color:#1ab394
}
.top-navigation .nav>li.active {
    background:#fff;
    border:none
}
.top-navigation .nav>li.active>a {
    color:#1ab394
}
.top-navigation .navbar-right {
    padding-right:10px
}
.top-navigation .navbar-nav .dropdown-menu {
    box-shadow:none;
    border:1px solid #e7eaec
}
.top-navigation .dropdown-menu>li>a {
    margin:0;
    padding:7px 20px
}
.navbar .dropdown-menu {
    margin-top:0
}
.top-navigation .navbar-brand {
    background:#1ab394;
    color:#fff;
    padding:15px 25px
}
.top-navigation .navbar-top-links li:last-child {
    margin-right:0
}
.body-small.fixed-sidebar.mini-navbar .top-navigation #page-wrapper,.canvas-menu #page-wrapper,.mini-navbar .top-navigation #page-wrapper,.top-navigation.body-small.fixed-sidebar.mini-navbar #page-wrapper,.top-navigation.mini-navbar #page-wrapper {
    margin:0
}
.fixed-nav #wrapper.top-navigation,.top-navigation.fixed-nav #wrapper {
    margin-top:50px
}
.top-navigation .footer.fixed {
    margin-left:0!important
}
.top-navigation .wrapper.wrapper-content {
    padding:40px
}
.body-small .top-navigation .wrapper.wrapper-content,.top-navigation.body-small .wrapper.wrapper-content {
    padding:40px 0
}
.navbar-toggle {
    color:#fff;
    padding:6px 12px;
    font-size:14px
}
.top-navigation .navbar-nav .open .dropdown-menu .dropdown-header,.top-navigation .navbar-nav .open .dropdown-menu>li>a {
    padding:10px 15px 10px 20px
}
@media (max-width:768px) {
    .top-navigation .navbar-header {
        display:block;
        float:none
    }
}
.menu-visible-lg,.menu-visible-md {
    display:none!important
}
@media (min-width:1200px) {
    .menu-visible-lg {
        display:block!important
    }
}
@media (min-width:992px) {
    .menu-visible-md {
        display:block!important
    }
}
@media (max-width:767px) {
    .menu-visible-lg,.menu-visible-md {
        display:block!important
    }
}
.btn {
    border-radius:3px
}
.float-e-margins .btn {
    margin-bottom:5px
}
.btn-w-m {
    min-width:120px
}
.btn-primary.btn-outline {
    color:#1ab394
}
.btn-success.btn-outline {
    color:#1c84c6
}
.btn-info.btn-outline {
    color:#23c6c8
}
.btn-warning.btn-outline {
    color:#f8ac59
}
.btn-danger.btn-outline {
    color:#ed5565
}
.btn-danger.btn-outline:hover,.btn-info.btn-outline:hover,.btn-primary.btn-outline:hover,.btn-success.btn-outline:hover,.btn-warning.btn-outline:hover {
    color:#fff
}
.btn-primary {
    background-color:#1ab394;
    border-color:#1ab394;
    color:#FFF
}
.btn-primary.active,.btn-primary:active,.btn-primary:focus,.btn-primary:hover,.open .dropdown-toggle.btn-primary {
    background-color:#18a689;
    border-color:#18a689;
    color:#FFF
}
.btn-primary.active,.btn-primary:active,.open .dropdown-toggle.btn-primary {
    background-image:none
}
.btn-primary.active[disabled],.btn-primary.disabled,.btn-primary.disabled.active,.btn-primary.disabled:active,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled],.btn-primary[disabled]:active,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary,fieldset[disabled] .btn-primary.active,fieldset[disabled] .btn-primary:active,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover {
    background-color:#1dc5a3;
    border-color:#1dc5a3
}
.btn-success {
    background-color:#12b7f5;
    border-color:#12b7f5;
    color:#FFF
}
.btn-success.active,.btn-success:active,.btn-success:focus,.btn-success:hover,.open .dropdown-toggle.btn-success {
    background-color:#1a7bb9;
    border-color:#1a7bb9;
    color:#FFF
}
.btn-success.active,.btn-success:active,.open .dropdown-toggle.btn-success {
    background-image:none
}
.btn-success.active[disabled],.btn-success.disabled,.btn-success.disabled.active,.btn-success.disabled:active,.btn-success.disabled:focus,.btn-success.disabled:hover,.btn-success[disabled],.btn-success[disabled]:active,.btn-success[disabled]:focus,.btn-success[disabled]:hover,fieldset[disabled] .btn-success,fieldset[disabled] .btn-success.active,fieldset[disabled] .btn-success:active,fieldset[disabled] .btn-success:focus,fieldset[disabled] .btn-success:hover {
    background-color:#1f90d8;
    border-color:#1f90d8
}
.btn-info {
    background-color:#23c6c8;
    border-color:#23c6c8;
    color:#FFF
}
.btn-info.active,.btn-info:active,.btn-info:focus,.btn-info:hover,.open .dropdown-toggle.btn-info {
    background-color:#21b9bb;
    border-color:#21b9bb;
    color:#FFF
}
.btn-info.active,.btn-info:active,.open .dropdown-toggle.btn-info {
    background-image:none
}
.btn-info.active[disabled],.btn-info.disabled,.btn-info.disabled.active,.btn-info.disabled:active,.btn-info.disabled:focus,.btn-info.disabled:hover,.btn-info[disabled],.btn-info[disabled]:active,.btn-info[disabled]:focus,.btn-info[disabled]:hover,fieldset[disabled] .btn-info,fieldset[disabled] .btn-info.active,fieldset[disabled] .btn-info:active,fieldset[disabled] .btn-info:focus,fieldset[disabled] .btn-info:hover {
    background-color:#26d7d9;
    border-color:#26d7d9
}
.btn-default {
    background-color:#c2c2c2;
    border-color:#c2c2c2;
    color:#FFF
}
.btn-default.active,.btn-default:active,.btn-default:focus,.btn-default:hover,.open .dropdown-toggle.btn-default {
    background-color:#bababa;
    border-color:#bababa;
    color:#FFF
}
.btn-default.active,.btn-default:active,.open .dropdown-toggle.btn-default {
    background-image:none
}
.btn-default.active[disabled],.btn-default.disabled,.btn-default.disabled.active,.btn-default.disabled:active,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-default[disabled],.btn-default[disabled]:active,.btn-default[disabled]:focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default,fieldset[disabled] .btn-default.active,fieldset[disabled] .btn-default:active,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:hover {
    background-color:#ccc;
    border-color:#ccc
}
.btn-warning {
    background-color:#f8ac59;
    border-color:#f8ac59;
    color:#FFF
}
.btn-warning.active,.btn-warning:active,.btn-warning:focus,.btn-warning:hover,.open .dropdown-toggle.btn-warning {
    background-color:#f7a54a;
    border-color:#f7a54a;
    color:#FFF
}
.btn-warning.active,.btn-warning:active,.open .dropdown-toggle.btn-warning {
    background-image:none
}
.btn-warning.active[disabled],.btn-warning.disabled,.btn-warning.disabled.active,.btn-warning.disabled:active,.btn-warning.disabled:focus,.btn-warning.disabled:hover,.btn-warning[disabled],.btn-warning[disabled]:active,.btn-warning[disabled]:focus,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning,fieldset[disabled] .btn-warning.active,fieldset[disabled] .btn-warning:active,fieldset[disabled] .btn-warning:focus,fieldset[disabled] .btn-warning:hover {
    background-color:#f9b66d;
    border-color:#f9b66d
}
.btn-danger {
    background-color:#ed5565;
    border-color:#ed5565;
    color:#FFF
}
.btn-danger.active,.btn-danger:active,.btn-danger:focus,.btn-danger:hover,.open .dropdown-toggle.btn-danger {
    background-color:#ec4758;
    border-color:#ec4758;
    color:#FFF
}
.btn-danger.active,.btn-danger:active,.open .dropdown-toggle.btn-danger {
    background-image:none
}
.btn-danger.active[disabled],.btn-danger.disabled,.btn-danger.disabled.active,.btn-danger.disabled:active,.btn-danger.disabled:focus,.btn-danger.disabled:hover,.btn-danger[disabled],.btn-danger[disabled]:active,.btn-danger[disabled]:focus,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger,fieldset[disabled] .btn-danger.active,fieldset[disabled] .btn-danger:active,fieldset[disabled] .btn-danger:focus,fieldset[disabled] .btn-danger:hover {
    background-color:#ef6776;
    border-color:#ef6776
}
.btn-link {
    color:inherit
}
.btn-link.active,.btn-link:active,.btn-link:focus,.btn-link:hover,.open .dropdown-toggle.btn-link {
    color:#1ab394;
    text-decoration:none
}
.btn-link.active,.btn-link:active,.open .dropdown-toggle.btn-link {
    background-image:none
}
.btn-link.active[disabled],.btn-link.disabled,.btn-link.disabled.active,.btn-link.disabled:active,.btn-link.disabled:focus,.btn-link.disabled:hover,.btn-link[disabled],.btn-link[disabled]:active,.btn-link[disabled]:focus,.btn-link[disabled]:hover,fieldset[disabled] .btn-link,fieldset[disabled] .btn-link.active,fieldset[disabled] .btn-link:active,fieldset[disabled] .btn-link:focus,fieldset[disabled] .btn-link:hover {
    color:#cacaca
}
.btn-white {
    color:inherit;
    background:#fff;
    border:1px solid #e7eaec
}
.btn-white.active,.btn-white:active,.btn-white:focus,.btn-white:hover,.open .dropdown-toggle.btn-white {
    color:inherit;
    border:1px solid #d2d2d2
}
.btn-white.active,.btn-white:active {
    box-shadow:0 2px 5px rgba(0,0,0,.15)inset
}
.btn-white.active,.btn-white:active,.open .dropdown-toggle.btn-white {
    background-image:none
}
.btn-white.active[disabled],.btn-white.disabled,.btn-white.disabled.active,.btn-white.disabled:active,.btn-white.disabled:focus,.btn-white.disabled:hover,.btn-white[disabled],.btn-white[disabled]:active,.btn-white[disabled]:focus,.btn-white[disabled]:hover,fieldset[disabled] .btn-white,fieldset[disabled] .btn-white.active,fieldset[disabled] .btn-white:active,fieldset[disabled] .btn-white:focus,fieldset[disabled] .btn-white:hover {
    color:#cacaca
}
.form-control,.form-control:focus,.has-error .form-control:focus,.has-success .form-control:focus,.has-warning .form-control:focus,.navbar-collapse,.navbar-form,.navbar-form-custom .form-control:focus,.navbar-form-custom .form-control:hover,.open .btn.dropdown-toggle,.panel,.popover,.progress,.progress-bar {
    box-shadow:none
}
.btn-outline {
    color:inherit;
    background-color:transparent;
    -webkit-transition:all .5s;
    transition:all .5s
}
.btn-rounded {
    border-radius:50px
}
.btn-large-dim {
    width:90px;
    height:90px;
    font-size:42px
}
button.dim {
    display:inline-block;
    color:#fff;
    text-decoration:none;
    text-transform:uppercase;
    text-align:center;
    padding-top:6px;
    margin-right:10px;
    position:relative;
    cursor:pointer;
    border-radius:5px;
    font-weight:600;
    margin-bottom:20px!important
}
button.dim:active {
    top:3px
}
button.btn-primary.dim {
    box-shadow:inset 0 0 0 #16987e,0 5px 0 0 #16987e,0 10px 5px #999
}
button.btn-primary.dim:active {
    box-shadow:inset 0 0 0 #16987e,0 2px 0 0 #16987e,0 5px 3px #999
}
button.btn-default.dim {
    box-shadow:inset 0 0 0 #b3b3b3,0 5px 0 0 #b3b3b3,0 10px 5px #999
}
button.btn-default.dim:active {
    box-shadow:inset 0 0 0 #b3b3b3,0 2px 0 0 #b3b3b3,0 5px 3px #999
}
button.btn-warning.dim {
    box-shadow:inset 0 0 0 #f79d3c,0 5px 0 0 #f79d3c,0 10px 5px #999
}
button.btn-warning.dim:active {
    box-shadow:inset 0 0 0 #f79d3c,0 2px 0 0 #f79d3c,0 5px 3px #999
}
button.btn-info.dim {
    box-shadow:inset 0 0 0 #1eacae,0 5px 0 0 #1eacae,0 10px 5px #999
}
button.btn-info.dim:active {
    box-shadow:inset 0 0 0 #1eacae,0 2px 0 0 #1eacae,0 5px 3px #999
}
button.btn-success.dim {
    box-shadow:inset 0 0 0 #1872ab,0 5px 0 0 #1872ab,0 10px 5px #999
}
button.btn-success.dim:active {
    box-shadow:inset 0 0 0 #1872ab,0 2px 0 0 #1872ab,0 5px 3px #999
}
button.btn-danger.dim {
    box-shadow:inset 0 0 0 #ea394c,0 5px 0 0 #ea394c,0 10px 5px #999
}
button.btn-danger.dim:active {
    box-shadow:inset 0 0 0 #ea394c,0 2px 0 0 #ea394c,0 5px 3px #999
}
button.dim:before {
    font-size:50px;
    line-height:1em;
    font-weight:400;
    color:#fff;
    display:block;
    padding-top:10px
}
button.dim:active:before {
    top:7px;
    font-size:50px
}
.label {
    background-color:#d1dade;
    color:#5e5e5e;
    font-size:10px;
    font-weight:600;
    padding:3px 8px;
    text-shadow:none
}
.badge {
    background-color:#d1dade;
    color:#5e5e5e;
    font-size:11px;
    font-weight:600;
    padding-bottom:4px;
    padding-left:6px;
    padding-right:6px;
    text-shadow:none
}
.badge-primary,.label-primary {
    background-color:#1ab394;
    color:#FFF
}
.badge-success,.label-success {
    background-color:#1c84c6;
    color:#FFF
}
.badge-warning,.label-warning {
    background-color:#f8ac59;
    color:#FFF
}
.badge-warning-light,.label-warning-light {
    background-color:#f8ac59;
    color:#fff
}
.badge-danger,.label-danger {
    background-color:#ed5565;
    color:#FFF
}
.badge-info,.label-info {
    background-color:#23c6c8;
    color:#FFF
}
.badge-inverse,.label-inverse {
    background-color:#262626;
    color:#FFF
}
.badge-white,.label-white {
    background-color:#FFF;
    color:#5E5E5E
}
.badge-disable,.label-white {
    background-color:#2A2E36;
    color:#8B91A0
}
.chosen-container-single .chosen-single {
    background:#fff;
    box-shadow:none;
    -moz-box-sizing:border-box;
    background-color:#FFF;
    border:1px solid #CBD5DD;
    border-radius:2px;
    cursor:text;
    height:auto!important;
    margin:0;
    min-height:30px;
    overflow:hidden;
    padding:4px 12px;
    position:relative;
    width:100%
}
.chosen-container-multi .chosen-choices li.search-choice {
    background:#f1f1f1;
    border:1px solid #ededed;
    border-radius:2px;
    box-shadow:none;
    color:#333;
    cursor:default;
    line-height:13px;
    margin:3px 0 3px 5px;
    padding:3px 20px 3px 5px;
    position:relative
}
.pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover {
    background-color:#f4f4f4;
    border-color:#DDD;
    color:inherit;
    cursor:default;
    z-index:2
}
.pagination>li>a,.pagination>li>span {
    background-color:#FFF;
    border:1px solid #DDD;
    color:inherit;
    float:left;
    line-height:1.42857;
    margin-left:-1px;
    padding:4px 10px;
    position:relative;
    text-decoration:none
}
.tooltip-inner {
    background-color:#2F4050
}
.tooltip.top .tooltip-arrow {
    border-top-color:#2F4050
}
.tooltip.right .tooltip-arrow {
    border-right-color:#2F4050
}
.tooltip.bottom .tooltip-arrow {
    border-bottom-color:#2F4050
}
.tooltip.left .tooltip-arrow {
    border-left-color:#2F4050
}
.easypiechart {
    position:relative;
    text-align:center
}
.easypiechart .h2 {
    margin-left:10px;
    margin-top:10px;
    display:inline-block
}
.easypiechart canvas {
    top:0;
    left:0
}
.easypiechart .easypie-text {
    line-height:1;
    position:absolute;
    top:33px;
    width:100%;
    z-index:1
}
.easypiechart img {
    margin-top:-4px
}
.jqstooltip {
    box-sizing:content-box
}
.fc-state-default {
    background-color:#fff;
    background-image:none;
    background-repeat:repeat-x;
    box-shadow:none;
    color:#333;
    text-shadow:none;
    border:1px solid
}
.fc-button {
    color:inherit;
    border:1px solid #e7eaec;
    cursor:pointer;
    display:inline-block;
    height:1.9em;
    line-height:1.9em;
    overflow:hidden;
    padding:0 .6em;
    position:relative;
    white-space:nowrap
}
.fc-state-active {
    background-color:#1ab394;
    border-color:#1ab394;
    color:#fff
}
.fc-header-title h2 {
    font-size:16px;
    font-weight:600;
    color:inherit
}
.fc-content .fc-widget-content,.fc-content .fc-widget-header {
    border-color:#e7eaec;
    font-weight:400
}
.fc-border-separate tbody {
    background-color:#F8F8F8
}
.fc-state-highlight {
    background:none repeat scroll 0 0 #FCF8E3
}
.external-event {
    padding:5px 10px;
    border-radius:2px;
    cursor:pointer;
    margin-bottom:5px
}
.fc-ltr .fc-event-hori.fc-event-end,.fc-rtl .fc-event-hori.fc-event-start {
    border-radius:2px
}
.fc-agenda .fc-event-time,.fc-event,.fc-event a {
    padding:4px 6px;
    background-color:#1ab394;
    border-color:#1ab394
}
.fc-event-time,.fc-event-title {
    color:#717171;
    padding:0 1px
}
.ui-calendar .fc-event-time,.ui-calendar .fc-event-title {
    color:#fff
}
.chat-activity-list .chat-element {
    border-bottom:1px solid #e7eaec
}
.chat-element:first-child {
    margin-top:0
}
.chat-element {
    padding-bottom:15px
}
.chat-element,.chat-element .media {
    margin-top:15px
}
.chat-element,.media-body {
    overflow:hidden
}
.media-body {
    display:block;
    width:auto
}
.chat-element>.pull-left {
    margin-right:10px
}
.chat-element img.img-circle,.dropdown-messages-box img.img-circle {
    width:38px;
    height:38px
}
.chat-element .well {
    border:1px solid #e7eaec;
    box-shadow:none;
    margin-top:10px;
    margin-bottom:5px;
    padding:10px 20px;
    font-size:11px;
    line-height:16px
}
.chat-element .actions {
    margin-top:10px
}
.chat-element .photos {
    margin:10px 0
}
.right.chat-element>.pull-right {
    margin-left:10px
}
.chat-photo {
    max-height:180px;
    border-radius:4px;
    overflow:hidden;
    margin-right:10px;
    margin-bottom:10px
}
.chat {
    margin:0;
    padding:0;
    list-style:none
}
.chat li {
    margin-bottom:10px;
    padding-bottom:5px;
    border-bottom:1px dotted #B3A9A9
}
.chat li.left .chat-body {
    margin-left:60px
}
.chat li.right .chat-body {
    margin-right:60px
}
.chat li .chat-body p {
    margin:0;
    color:#777
}
.chat .glyphicon,.panel .slidedown .glyphicon {
    margin-right:5px
}
.chat-panel .panel-body {
    height:350px;
    overflow-y:scroll
}
a.list-group-item.active,a.list-group-item.active:focus,a.list-group-item.active:hover {
    background-color:#1ab394;
    border-color:#1ab394;
    color:#FFF;
    z-index:2
}
.list-group-item-heading {
    margin-top:10px
}
.list-group-item-text {
    margin:0 0 10px;
    color:inherit;
    font-size:12px;
    line-height:inherit
}
.no-padding .list-group-item {
    border-left:none;
    border-right:none;
    border-bottom:none
}
.no-padding .list-group-item:first-child {
    border-left:none;
    border-right:none;
    border-bottom:none;
    border-top:none
}
.no-padding .list-group {
    margin-bottom:0
}
.list-group-item {
    background-color:inherit;
    border:1px solid #e7eaec;
    display:block;
    margin-bottom:-1px;
    padding:10px 15px;
    position:relative
}
.elements-list .list-group-item {
    border-left:none;
    border-right:none;
    padding:15px 25px
}
.elements-list .list-group-item:first-child {
    border-left:none;
    border-right:none;
    border-top:none!important
}
.elements-list .list-group {
    margin-bottom:0
}
.elements-list a {
    color:inherit
}
.elements-list .list-group-item.active,.elements-list .list-group-item:hover {
    background:#f3f3f4;
    color:inherit;
    border-color:#e7eaec;
    border-radius:0
}
.elements-list li.active {
    -webkit-transition:none;
    transition:none
}
.element-detail-box {
    padding:25px
}
.flot-chart {
    display:block;
    height:200px
}
.widget .flot-chart.dashboard-chart {
    display:block;
    height:120px;
    margin-top:40px
}
.flot-chart.dashboard-chart {
    display:block;
    height:180px;
    margin-top:40px
}
.flot-chart-content {
    width:100%;
    height:100%
}
.flot-chart-pie-content {
    width:200px;
    height:200px;
    margin:auto
}
.jqstooltip {
    position:absolute;
    display:block;
    left:0;
    top:0;
    visibility:hidden;
    background:#2b303a;
    background-color:rgba(43,48,58,.8);
    color:#fff;
    text-align:left;
    white-space:nowrap;
    z-index:10000;
    padding:5px;
    min-height:22px;
    border-radius:3px
}
.jqsfield {
    color:#fff;
    text-align:left
}
.h-200 {
    min-height:200px
}
.legendLabel {
    padding-left:5px
}
.stat-list li:first-child {
    margin-top:0
}
.stat-list {
    list-style:none;
    padding:0;
    margin:0
}
.stat-percent {
    float:right
}
.stat-list li {
    margin-top:15px;
    position:relative
}
table.dataTable thead .sorting,table.dataTable thead .sorting_asc:after,table.dataTable thead .sorting_asc_disabled,table.dataTable thead .sorting_desc,table.dataTable thead .sorting_desc_disabled {
    background:0 0
}
table.dataTable thead .sorting_asc:after {
    float:right;
    font-family:fontawesome
}
table.dataTable thead .sorting_desc:after {
    content:"\f0dd";
    float:right;
    font-family:fontawesome
}
table.dataTable thead .sorting:after {
    content:"\f0dc";
    float:right;
    font-family:fontawesome;
    color:rgba(50,50,50,.5)
}
.dataTables_wrapper {
    padding-bottom:30px
}
.img-circle {
    border-radius:50%
}
.btn-circle {
    width:30px;
    height:30px;
    padding:6px 0;
    border-radius:15px;
    text-align:center;
    font-size:12px;
    line-height:1.428571429
}
.btn-circle.btn-lg {
    width:50px;
    height:50px;
    padding:10px 16px;
    border-radius:25px;
    font-size:18px;
    line-height:1.33
}
.btn-circle.btn-xl {
    width:70px;
    height:70px;
    padding:10px 16px;
    border-radius:35px;
    font-size:24px;
    line-height:1.33
}
.show-grid [class^=col-] {
    padding-top:10px;
    padding-bottom:10px;
    border:1px solid #ddd;
    background-color:#eee!important
}
.show-grid {
    margin:15px 0
}
.css-animation-box h1 {
    font-size:44px
}
.animation-efect-links a {
    padding:4px 6px;
    font-size:12px
}
#animation_box {
    background-color:#f9f8f8;
    border-radius:16px;
    width:80%;
    margin:0 auto;
    padding-top:80px
}
.animation-text-box {
    position:absolute;
    margin-top:40px;
    left:50%;
    margin-left:-100px;
    width:200px
}
.animation-text-info {
    position:absolute;
    margin-top:-60px;
    left:50%;
    margin-left:-100px;
    width:200px;
    font-size:10px
}
.animation-text-box h2 {
    font-size:54px;
    font-weight:600;
    margin-bottom:5px
}
.animation-text-box p {
    font-size:12px;
    text-transform:uppercase
}
.pace {
    -webkit-pointer-events:none;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.pace .pace-progress {
    background:#1ab394;
    position:fixed;
    z-index:2000;
    top:0;
    width:100%;
    height:2px
}
.pace-inactive {
    display:none
}
.widget {
    border-radius:5px;
    padding:15px 20px;
    margin-bottom:10px;
    margin-top:10px
}
.widget.style1 h2 {
    font-size:30px
}
.widget h2,.widget h3 {
    margin-top:5px;
    margin-bottom:0
}
.widget-text-box {
    padding:20px;
    border:1px solid #e7eaec;
    background:#fff
}
.widget-head-color-box {
    border-radius:5px 5px 0 0;
    margin-top:10px
}
.widget .flot-chart {
    height:100px
}
.vertical-align div {
    display:inline-block;
    vertical-align:middle
}
.vertical-align h2,.vertical-align h3 {
    margin:0
}
.todo-list {
    list-style:none outside none;
    margin:0;
    padding:0;
    font-size:14px
}
.todo-list.small-list {
    font-size:12px
}
.todo-list.small-list>li {
    background:#f3f3f4;
    border-left:none;
    border-right:none;
    border-radius:4px;
    color:inherit;
    margin-bottom:2px;
    padding:6px 6px 6px 12px
}
.todo-list.small-list .btn-group-xs>.btn,.todo-list.small-list .btn-xs {
    border-radius:5px;
    font-size:10px;
    line-height:1.5;
    padding:1px 2px 1px 5px
}
.todo-list>li {
    background:#f3f3f4;
    border-left:6px solid #e7eaec;
    border-right:6px solid #e7eaec;
    border-radius:4px;
    color:inherit;
    margin-bottom:2px;
    padding:10px
}
.todo-list .handle {
    cursor:move;
    display:inline-block;
    font-size:16px;
    margin:0 5px
}
.todo-list>li .label {
    font-size:9px;
    margin-left:10px
}
.check-link {
    font-size:16px
}
.todo-completed {
    text-decoration:line-through
}
.geo-statistic h1 {
    font-size:36px;
    margin-bottom:0
}
.glyphicon.fa {
    font-family:FontAwesome
}
.inline {
    display:inline-block!important
}
.input-s-sm {
    width:120px
}
.input-s {
    width:200px
}
.input-s-lg {
    width:250px
}
.i-checks {
    padding-left:0
}
.form-control,.single-line {
    background-color:#FFF;
    background-image:none;
    border:1px solid #e5e6e7;
    border-radius:1px;
    color:inherit;
    display:block;
    /* padding:6px 12px; */
    -webkit-transition:border-color .15s ease-in-out 0s,box-shadow .15s ease-in-out 0s;
    transition:border-color .15s ease-in-out 0s,box-shadow .15s ease-in-out 0s;
    width:100%;
    font-size:14px
}
.form-control:focus,.single-line:focus {
    border-color:#1ab394!important
}
.has-success .form-control {
    border-color:#1ab394
}
.has-warning .form-control {
    border-color:#f8ac59
}
.has-error .form-control {
    border-color:#ed5565
}
.has-success .control-label {
    color:#1ab394
}
.has-warning .control-label {
    color:#f8ac59
}
.has-error .control-label {
    color:#ed5565
}
.input-group-addon {
    background-color:#fff;
    border:1px solid #E5E6E7;
    border-radius:1px;
    color:inherit;
    font-size:14px;
    font-weight:400;
    line-height:1;
    padding:6px 12px;
    text-align:center
}
.spinner-buttons.input-group-btn .btn-xs {
    line-height:1.13
}
.spinner-buttons.input-group-btn {
    width:20%
}
.noUi-connect {
    background:none repeat scroll 0 0 #1ab394;
    box-shadow:none
}
.slider_red .noUi-connect {
    background:none repeat scroll 0 0 #ed5565;
    box-shadow:none
}
.ui-sortable .ibox-title {
    cursor:move
}
.ui-sortable-placeholder {
    border:1px dashed #cecece!important;
    visibility:visible!important;
    background:#e7eaec
}
.ibox.ui-sortable-placeholder {
    margin:0 0 23px!important
}
.tabs-container .panel-body {
    background:#fff;
    border:1px solid #e7eaec;
    border-radius:2px;
    padding:20px;
    position:relative
}
.tabs-container .nav-tabs>li.active>a,.tabs-container .nav-tabs>li.active>a:focus,.tabs-container .nav-tabs>li.active>a:hover {
    background-color:#fff
}
.tabs-container .nav-tabs>li {
    float:left;
    margin-bottom:-1px
}
.tabs-container .nav-tabs>li.active>a,.tabs-container .nav-tabs>li.active>a:focus,.tabs-container .nav-tabs>li.active>a:hover {
    border:1px solid #e7eaec;
    border-bottom-color:transparent
}
.tabs-container .nav-tabs {
    border-bottom:1px solid #e7eaec
}
.tabs-container .tab-pane .panel-body {
    border-top:none
}
.tabs-container .tabs-left .tab-pane .panel-body,.tabs-container .tabs-right .tab-pane .panel-body {
    border-top:1px solid #e7eaec
}
.tabs-container .nav-tabs>li a:hover {
    background:0 0;
    border-color:transparent
}
.tabs-container .tabs-below>.nav-tabs,.tabs-container .tabs-left>.nav-tabs,.tabs-container .tabs-right>.nav-tabs {
    border-bottom:0
}
.tabs-container .tabs-left .panel-body {
    position:static
}
.tabs-container .tabs-left>.nav-tabs,.tabs-container .tabs-right>.nav-tabs {
    width:20%
}
.tabs-container .tabs-left .panel-body {
    width:80%;
    margin-left:20%
}
.tabs-container .tabs-right .panel-body {
    width:80%;
    margin-right:20%
}
.tabs-container .pill-content>.pill-pane,.tabs-container .tab-content>.tab-pane {
    display:none
}
.tabs-container .pill-content>.active,.tabs-container .tab-content>.active {
    display:block
}
.tabs-container .tabs-below>.nav-tabs {
    border-top:1px solid #e7eaec
}
.tabs-container .tabs-below>.nav-tabs>li {
    margin-top:-1px;
    margin-bottom:0
}
.tabs-container .tabs-below>.nav-tabs>li>a {
    border-radius:0 0 4px 4px
}
.tabs-container .tabs-below>.nav-tabs>li>a:focus,.tabs-container .tabs-below>.nav-tabs>li>a:hover {
    border-top-color:#e7eaec;
    border-bottom-color:transparent
}
.tabs-container .tabs-left>.nav-tabs>li,.tabs-container .tabs-right>.nav-tabs>li {
    float:none
}
.tabs-container .tabs-left>.nav-tabs>li>a,.tabs-container .tabs-right>.nav-tabs>li>a {
    min-width:74px;
    margin-right:0;
    margin-bottom:3px
}
.tabs-container .tabs-left>.nav-tabs {
    float:left;
    margin-right:19px
}
.tabs-container .tabs-left>.nav-tabs>li>a {
    margin-right:-1px;
    border-radius:4px 0 0 4px
}
.tabs-container .tabs-left>.nav-tabs .active>a,.tabs-container .tabs-left>.nav-tabs .active>a:focus,.tabs-container .tabs-left>.nav-tabs .active>a:hover {
    border-color:#e7eaec transparent #e7eaec #e7eaec;
    *border-right-color:#fff
}
.tabs-container .tabs-right>.nav-tabs {
    float:right;
    margin-left:19px
}
.tabs-container .tabs-right>.nav-tabs>li>a {
    margin-left:-1px;
    border-radius:0 4px 4px 0
}
.tabs-container .tabs-right>.nav-tabs .active>a,.tabs-container .tabs-right>.nav-tabs .active>a:focus,.tabs-container .tabs-right>.nav-tabs .active>a:hover {
    border-color:#e7eaec #e7eaec #e7eaec transparent;
    *border-left-color:#fff;
    z-index:1
}
.onoffswitch {
    position:relative;
    width:54px;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none
}
.onoffswitch-checkbox {
    display:none
}
.onoffswitch-label {
    display:block;
    overflow:hidden;
    cursor:pointer;
    border:2px solid #1AB394;
    border-radius:3px
}
.onoffswitch-inner {
    display:block;
    width:200%;
    margin-left:-100%;
    -webkit-transition:margin .3s ease-in 0s;
    transition:margin .3s ease-in 0s
}
.onoffswitch-inner:after,.onoffswitch-inner:before {
    display:block;
    float:left;
    width:50%;
    height:16px;
    padding:0;
    line-height:16px;
    font-size:10px;
    font-family:Trebuchet,Arial,sans-serif;
    font-weight:700;
    box-sizing:border-box
}
.onoffswitch-inner:before {
    content:"ON";
    padding-left:7px;
    background-color:#1AB394;
    color:#FFF
}
.onoffswitch-inner:after {
    content:"OFF";
    padding-right:7px;
    background-color:#FFF;
    color:#919191;
    text-align:right
}
.onoffswitch-switch {
    display:block;
    width:18px;
    margin:0;
    background:#FFF;
    border:2px solid #1AB394;
    border-radius:3px;
    position:absolute;
    top:0;
    bottom:0;
    right:36px;
    -webkit-transition:all .3s ease-in 0s;
    transition:all .3s ease-in 0s
}
.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner {
    margin-left:0
}
.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch {
    right:0
}
.dd {
    position:relative;
    display:block;
    margin:0;
    padding:0;
    list-style:none;
    font-size:13px;
    line-height:20px
}
.dd-list {
    display:block;
    position:relative;
    margin:0;
    padding:0;
    list-style:none
}
.dd-list .dd-list {
    padding-left:30px
}
.dd-collapsed .dd-list {
    display:none
}
.dd-empty,.dd-item,.dd-placeholder {
    display:block;
    position:relative;
    margin:0;
    padding:0;
    min-height:20px;
    font-size:13px;
    line-height:20px
}
.dd-handle {
    display:block;
    margin:5px 0;
    padding:5px 10px;
    color:#333;
    text-decoration:none;
    border:1px solid #e7eaec;
    background:#f5f5f5;
    border-radius:3px;
    box-sizing:border-box;
    -moz-box-sizing:border-box
}
.dd-handle span {
    font-weight:700
}
.dd-handle:hover {
    background:#f0f0f0;
    cursor:pointer;
    font-weight:700
}
.dd-item>button {
    display:block;
    position:relative;
    cursor:pointer;
    float:left;
    width:25px;
    height:20px;
    margin:5px 0;
    padding:0;
    text-indent:100%;
    white-space:nowrap;
    overflow:hidden;
    border:0;
    background:0 0;
    font-size:12px;
    line-height:1;
    text-align:center;
    font-weight:700
}
.dd-item>button:before {
    content:'+';
    display:block;
    position:absolute;
    width:100%;
    text-align:center;
    text-indent:0
}
.dd-item>button[data-action=collapse]:before {
    content:'-'
}
#nestable2 .dd-item>button {
    font-family:FontAwesome;
    height:34px;
    width:33px;
    color:#c1c1c1
}
#nestable2 .dd-item>button:before {
    content:"\f067"
}
#nestable2 .dd-item>button[data-action=collapse]:before {
    content:"\f068"
}
.dd-empty,.dd-placeholder {
    margin:5px 0;
    padding:0;
    min-height:30px;
    background:#f2fbff;
    border:1px dashed #b6bcbf;
    box-sizing:border-box;
    -moz-box-sizing:border-box
}
.dd-empty {
    border:1px dashed #bbb;
    min-height:100px;
    background-color:#e5e5e5;
    background-image:-webkit-linear-gradient(45deg,#fff 25%,transparent 25%,transparent 75%,#fff 75%,#fff),-webkit-linear-gradient(45deg,#fff 25%,transparent 25%,transparent 75%,#fff 75%,#fff);
    background-image:linear-gradient(45deg,#fff 25%,transparent 25%,transparent 75%,#fff 75%,#fff),linear-gradient(45deg,#fff 25%,transparent 25%,transparent 75%,#fff 75%,#fff);
    background-size:60px 60px;
    background-position:0 0,30px 30px
}
.dd-dragel {
    position:absolute;
    z-index:9999;
    pointer-events:none
}
.dd-dragel>.dd-item .dd-handle {
    margin-top:0
}
.dd-dragel .dd-handle {
    box-shadow:2px 4px 6px 0 rgba(0,0,0,.1)
}
.nestable-lists {
    display:block;
    clear:both;
    padding:30px 0;
    width:100%;
    border:0;
    border-top:2px solid #ddd;
    border-bottom:2px solid #ddd
}
#nestable-menu {
    padding:0;
    margin:10px 0 20px
}
#nestable-output,#nestable2-output {
    width:100%;
    line-height:1.333333em;
    font-family:lucida grande,lucida sans unicode,helvetica,arial,sans-serif
}
#nestable2 .dd-handle {
    color:inherit;
    border:1px dashed #e7eaec;
    background:#f3f3f4;
    padding:10px
}
#nestable2 span.label {
    margin-right:10px
}
#nestable-output,#nestable2-output {
    font-size:12px;
    padding:25px;
    box-sizing:border-box;
    -moz-box-sizing:border-box
}
.CodeMirror {
    border:1px solid #eee;
    height:auto
}
.CodeMirror-scroll {
    overflow-y:hidden;
    overflow-x:auto
}
.google-map {
    height:300px
}
label.error {
    color:#cc5965;
    display:inline-block;
    margin-left:5px
}
.form-control.error {
    border:1px dotted #cc5965
}
.gridStyle {
    border:1px solid #d4d4d4;
    width:100%;
    height:400px
}
.gridStyle2 {
    border:1px solid #d4d4d4;
    width:500px;
    height:300px
}
.ngH eaderCell {
    border-right:none;
    border-bottom:1px solid #e7eaec
}
.ngCell {
    border-right:none
}
.ngTopPanel {
    background:#F5F5F6
}
.ngRow.even {
    background:#f9f9f9
}
.ngRow.selected {
    background:#EBF2F1
}
.ngRow {
    border-bottom:1px solid #e7eaec
}
.ngCell {
    background-color:transparent
}
.ngHeaderCell {
    border-right:none
}
#toast-container>.toast {
    background-image:none!important
}
#toast-container>.toast:before {
    position:fixed;
    font-family:FontAwesome;
    font-size:24px;
    line-height:24px;
    float:left;
    color:#FFF;
    padding-right:.5em;
    margin:auto .5em auto -1.5em
}
#toast-container>div {
    box-shadow:0 0 3px #999;
    opacity:.9;
    -ms-filter:alpha(opacity=90);
    filter:alpha(opacity=90)
}
#toast-container >:hover {
    box-shadow:0 0 4px #999;
    opacity:1;
    -ms-filter:alpha(opacity=100);
    filter:alpha(opacity=100);
    cursor:pointer
}
.toast,.toast-success {
    background-color:#1ab394
}
.toast-error {
    background-color:#ed5565
}
.toast-info {
    background-color:#23c6c8
}
.toast-warning {
    background-color:#f8ac59
}
.toast-top-full-width {
    margin-top:20px
}
.toast-bottom-full-width {
    margin-bottom:20px
}
.img-container,.img-preview {
    overflow:hidden;
    text-align:center;
    width:100%
}
.img-preview-sm {
    height:130px;
    width:200px
}
.forum-post-container .media {
    margin:10px;
    padding:20px 10px;
    border-bottom:1px solid #f1f1f1
}
.forum-avatar {
    float:left;
    margin-right:20px;
    text-align:center;
    width:110px
}
.forum-avatar .img-circle {
    height:48px;
    width:48px
}
.author-info {
    color:#676a6c;
    font-size:11px;
    margin-top:5px;
    text-align:center
}
.forum-post-info {
    padding:9px 12px 6px;
    background:#f9f9f9;
    border:1px solid #f1f1f1
}
.media-body>.media {
    background:#f9f9f9;
    border-radius:3px;
    border:1px solid #f1f1f1
}
.forum-post-container .media-body .photos {
    margin:10px 0
}
.forum-photo {
    max-width:140px;
    border-radius:3px
}
.media-body>.media .forum-avatar {
    width:70px;
    margin-right:10px
}
.media-body>.media .forum-avatar .img-circle {
    height:38px;
    width:38px
}
.mid-icon {
    font-size:66px
}
.forum-item {
    margin:10px 0;
    padding:10px 0 20px;
    border-bottom:1px solid #f1f1f1
}
.views-number {
    font-size:24px;
    line-height:18px;
    font-weight:400
}
.forum-container,.forum-post-container {
    padding:30px!important
}
.forum-item small {
    color:#999
}
.forum-item .forum-sub-title {
    color:#999;
    margin-left:50px
}
.forum-title {
    margin:15px 0
}
.forum-info {
    text-align:center
}
.forum-desc {
    color:#999
}
.forum-icon {
    float:left;
    width:30px;
    margin-right:20px;
    text-align:center
}
a.forum-item-title {
    color:inherit;
    display:block;
    font-size:18px;
    font-weight:600
}
a.forum-item-title:hover {
    color:inherit
}
.forum-icon .fa {
    font-size:30px;
    margin-top:8px;
    color:#9b9b9b
}
.forum-item.active .fa,.forum-item.active a.forum-item-title {
    color:#1ab394
}
@media (max-width:992px) {
    .forum-info {
        margin:15px 0 10px;
        display:none
    }
    .forum-desc {
        float:none!important
    }
}
.vertical-container {
    width:90%;
    max-width:1170px;
    margin:0 auto
}
.vertical-container::after {
    content:'';
    display:table;
    clear:both
}
#vertical-timeline {
    position:relative;
    padding:0;
    margin-top:2em;
    margin-bottom:2em
}
#vertical-timeline::before {
    content:'';
    position:absolute;
    top:0;
    left:18px;
    height:100%;
    width:4px;
    background:#f1f1f1
}
.vertical-timeline-content .btn {
    float:right
}
#vertical-timeline.light-timeline:before {
    background:#e7eaec
}
.dark-timeline .vertical-timeline-content:before {
    border-color:transparent #f5f5f5 transparent transparent
}
.dark-timeline.center-orientation .vertical-timeline-content:before {
    border-color:transparent transparent transparent #f5f5f5
}
.dark-timeline .vertical-timeline-block:nth-child(2n) .vertical-timeline-content:before,.dark-timeline.center-orientation .vertical-timeline-block:nth-child(2n) .vertical-timeline-content:before {
    border-color:transparent #f5f5f5 transparent transparent
}
.dark-timeline .vertical-timeline-content,.dark-timeline.center-orientation .vertical-timeline-content {
    background:#f5f5f5
}
@media only screen and (min-width:1170px) {
    #vertical-timeline.center-orientation {
        margin-top:3em;
        margin-bottom:3em
    }
    #vertical-timeline.center-orientation:before {
        left:50%;
        margin-left:-2px
    }
}
@media only screen and (max-width:1170px) {
    .center-orientation.dark-timeline .vertical-timeline-content:before {
        border-color:transparent #f5f5f5 transparent transparent
    }
}
.vertical-timeline-block {
    position:relative;
    margin:2em 0
}
.vertical-timeline-block:after {
    content:"";
    display:table;
    clear:both
}
.vertical-timeline-block:first-child {
    margin-top:0
}
.vertical-timeline-block:last-child {
    margin-bottom:0
}
@media only screen and (min-width:1170px) {
    .center-orientation .vertical-timeline-block {
        margin:4em 0
    }
    .center-orientation .vertical-timeline-block:first-child {
        margin-top:0
    }
    .center-orientation .vertical-timeline-block:last-child {
        margin-bottom:0
    }
}
.vertical-timeline-icon {
    position:absolute;
    top:0;
    left:0;
    width:40px;
    height:40px;
    border-radius:50%;
    font-size:16px;
    border:3px solid #f1f1f1;
    text-align:center
}
.vertical-timeline-icon i {
    display:block;
    width:24px;
    height:24px;
    position:relative;
    left:50%;
    top:50%;
    margin-left:-12px;
    margin-top:-9px
}
@media only screen and (min-width:1170px) {
    .center-orientation .vertical-timeline-icon {
        width:50px;
        height:50px;
        left:50%;
        margin-left:-25px;
        -webkit-transform:translateZ(0);
        -webkit-backface-visibility:hidden;
        font-size:19px
    }
    .center-orientation .vertical-timeline-icon i {
        margin-left:-12px;
        margin-top:-10px
    }
    .center-orientation .cssanimations .vertical-timeline-icon.is-hidden {
        visibility:hidden
    }
}
.vertical-timeline-content {
    position:relative;
    margin-left:60px;
    background:#fff;
    border-radius:.25em;
    padding:1em
}
.vertical-timeline-content:after {
    content:"";
    display:table;
    clear:both
}
.vertical-timeline-content h2 {
    font-weight:400;
    margin-top:4px
}
.vertical-timeline-content p {
    margin:1em 0;
    line-height:1.6
}
.vertical-timeline-content .vertical-date {
    float:left;
    font-weight:500
}
.vertical-date small {
    color:#1ab394;
    font-weight:400
}
.vertical-timeline-content::before {
    content:'';
    position:absolute;
    top:16px;
    right:100%;
    height:0;
    width:0;
    border:7px solid transparent;
    border-right:7px solid #fff
}
@media only screen and (min-width:768px) {
    .vertical-timeline-content h2 {
        font-size:18px
    }
    .vertical-timeline-content p {
        font-size:13px
    }
}
@media only screen and (min-width:1170px) {
    .center-orientation .vertical-timeline-content {
        margin-left:0;
        padding:1.6em;
        width:45%
    }
    .center-orientation .vertical-timeline-content::before {
        top:24px;
        left:100%;
        border-color:transparent;
        border-left-color:#fff
    }
    .center-orientation .vertical-timeline-content .btn {
        float:left
    }
    .center-orientation .vertical-timeline-content .vertical-date {
        position:absolute;
        width:100%;
        left:122%;
        top:2px;
        font-size:14px
    }
    .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content {
        float:right
    }
    .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content::before {
        top:24px;
        left:auto;
        right:100%;
        border-color:transparent;
        border-right-color:#fff
    }
    .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content .btn {
        float:right
    }
    .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content .vertical-date {
        left:auto;
        right:122%;
        text-align:right
    }
    .center-orientation .cssanimations .vertical-timeline-content.is-hidden {
        visibility:hidden
    }
}
.sidebard-panel {
    width:220px;
    background:#ebebed;
    padding:10px 20px;
    position:absolute;
    right:0
}
.sidebard-panel .feed-element img.img-circle {
    width:32px;
    height:32px
}
.media-body,.sidebard-panel .feed-element,.sidebard-panel p {
    font-size:12px
}
.sidebard-panel .feed-element {
    margin-top:20px;
    padding-bottom:0
}
.sidebard-panel .list-group {
    margin-bottom:10px
}
.sidebard-panel .list-group .list-group-item {
    padding:5px 0;
    font-size:12px;
    border:0
}
.sidebar-content .wrapper,.wrapper.sidebar-content {
    padding-right:240px!important
}
#right-sidebar {
    background-color:#fff;
    border-left:1px solid #e7eaec;
    border-top:1px solid #e7eaec;
    overflow:hidden;
    position:fixed;
    top:60px;
    width:260px!important;
    z-index:1009;
    bottom:0;
    right:-260px
}
#right-sidebar.sidebar-open {
    right:0
}
#right-sidebar.sidebar-open.sidebar-top {
    top:0;
    border-top:none
}
.sidebar-container ul.nav-tabs {
    border:none
}
.sidebar-container ul.nav-tabs.navs-4 li {
    width:25%
}
.sidebar-container ul.nav-tabs.navs-3 li {
    width:33.3333%
}
.sidebar-container ul.nav-tabs.navs-2 li {
    width:50%
}
.sidebar-container ul.nav-tabs li {
    border:none
}
.sidebar-container ul.nav-tabs li a {
    border:none;
    padding:12px 10px;
    margin:0;
    border-radius:0;
    background:#2f4050;
    color:#fff;
    text-align:center;
    border-right:1px solid #334556
}
.sidebar-container ul.nav-tabs li.active a {
    border:none;
    background:#f9f9f9;
    color:#676a6c;
    font-weight:700
}
.sidebar-container .nav-tabs>li.active>a:focus,.sidebar-container .nav-tabs>li.active>a:hover {
    border:none
}
.sidebar-container ul.sidebar-list {
    margin:0;
    padding:0
}
.sidebar-container ul.sidebar-list li {
    border-bottom:1px solid #e7eaec;
    padding:15px 20px;
    list-style:none;
    font-size:12px
}
.sidebar-container .sidebar-message:nth-child(2n+2) {
    background:#f9f9f9
}
.sidebar-container ul.sidebar-list li a {
    text-decoration:none;
    color:inherit
}
.sidebar-container .sidebar-content {
    padding:15px 20px;
    font-size:12px
}
.sidebar-container .sidebar-title {
    background:#f9f9f9;
    padding:20px;
    border-bottom:1px solid #e7eaec
}
.sidebar-container .sidebar-title h3 {
    margin-bottom:3px;
    padding-left:2px
}
.sidebar-container .tab-content h4 {
    margin-bottom:5px
}
.sidebar-container .sidebar-message>a>.pull-left {
    margin-right:10px
}
.sidebar-container .sidebar-message>a {
    text-decoration:none;
    color:inherit
}
.sidebar-container .sidebar-message {
    padding:15px 20px
}
.sidebar-container .sidebar-message .message-avatar {
    height:38px;
    width:38px;
    border-radius:50%
}
.sidebar-container .setings-item {
    padding:15px 20px;
    border-bottom:1px solid #e7eaec
}
body {
    font-family:"open sans","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size:14px;
    color:#333;
    overflow-x:hidden
}
body,body.full-height-layout #page-wrapper,body.full-height-layout #wrapper,html {
    height:100%;
}
#page-wrapper {
    min-height:auto
}
body.boxed-layout {
    background:url(patterns/shattered.png)
}
body.boxed-layout #wrapper {
    background-color:#2f4050;
    max-width:1200px;
    margin:0 auto
}
.boxed-layout #wrapper.top-navigation,.top-navigation.boxed-layout #wrapper {
    max-width:1300px!important
}
.block {
    display:block
}
.clear {
    display:block;
    overflow:hidden
}
a {
    cursor:pointer
}
a:focus,a:hover {
    text-decoration:none
}
.border-bottom {
    border-bottom:1px solid #e7eaec!important
}
.font-bold {
    font-weight:600
}
.font-noraml {
    font-weight:400
}
.text-uppercase {
    text-transform:uppercase
}
.b-r {
    border-right:1px solid #e7eaec
}
.hr-line-dashed {
    border-top:1px dashed #e7eaec;
    color:#fff;
    background-color:#fff;
    height:1px;
    margin:20px 0
}
.hr-line-solid {
    border-bottom:1px solid #e7eaec;
    background-color:rgba(0,0,0,0);
    border-style:solid!important;
    margin-top:15px;
    margin-bottom:15px
}
video {
    width:100%!important;
    height:auto!important
}
.gallery>.row>div {
    margin-bottom:15px
}
.fancybox img {
    margin-bottom:5px;
    /* width:24% */
}
.note-editor {
    height:auto!important;
    min-height:100px;
    border:solid 1px #e5e6e7
}
.modal-content {
    background-clip:padding-box;
    background-color:#FFF;
    border:1px solid rgba(0,0,0,0);
    border-radius:4px;
    box-shadow:0 1px 3px rgba(0,0,0,.3);
    outline:0 none
}
.modal-dialog {
    z-index:1200
}
.modal-body {
    padding:20px 30px 30px
}
.inmodal .modal-body {
    background:#f8fafb
}
.inmodal .modal-header {
    padding:30px 15px;
    text-align:center
}
.animated.modal.fade .modal-dialog {
    -webkit-transform:none;
    -ms-transform:none;
    transform:none
}
.inmodal .modal-title {
    font-size:26px
}
.inmodal .modal-icon {
    font-size:84px;
    color:#e2e3e3
}
.modal-footer {
    margin-top:0
}
#wrapper {
    width:100%;
    overflow-x:hidden;
    background-color:#2f4050
}
.wrapper {
    padding:0 20px
}
.wrapper-content {
    padding:0 10px;
}
#page-wrapper {
    padding:0 15px;
    position:inherit;
    margin:0 0 0 220px
}
.title-action {
    text-align:right;
    padding-top:30px
}
.ibox-content h1,.ibox-content h2,.ibox-content h3,.ibox-content h4,.ibox-content h5,.ibox-title h1,.ibox-title h2,.ibox-title h3,.ibox-title h4,.ibox-title h5 {
    margin-top:5px
}
ol.unstyled,ul.unstyled {
    list-style:none outside none;
    margin-left:0
}
.big-icon {
    font-size:160px;
    color:#e5e6e7
}
.footer {
    background:none repeat scroll 0 0 #fff;
    border-top:1px solid #e7eaec;
    overflow:hidden;
    padding:10px 20px;
    margin:0 -15px;
    height:36px
}
.footer.fixed_full {
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    z-index:1000;
    padding:10px 20px;
    background:#fff;
    border-top:1px solid #e7eaec
}
.footer.fixed {
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    z-index:1000;
    padding:10px 20px;
    background:#fff;
    border-top:1px solid #e7eaec;
    margin-left:220px
}
body.body-small.mini-navbar .footer.fixed,body.mini-navbar .footer.fixed {
    margin:0 0 0 70px
}
body.canvas-menu .footer.fixed,body.mini-navbar.canvas-menu .footer.fixed {
    margin:0!important
}
body.fixed-sidebar.body-small.mini-navbar .footer.fixed {
    margin:0 0 0 220px
}
body.body-small .footer.fixed {
    margin-left:0
}
.page-heading {
    border-top:0;
    padding:0 20px 20px
}
.panel-heading h1,.panel-heading h2 {
    margin-bottom:5px
}
.content-tabs {
    position:relative;
    height:42px;
    background:#fafafa;
    line-height:40px
}
.content-tabs .roll-nav,.page-tabs-list {
    position:absolute;
    width:40px;
    height:40px;
    text-align:center;
    color:#999;
    z-index:2;
    top:0
}
.content-tabs .roll-left {
    left:0;
    border-right:solid 1px #eee
}
.content-tabs .roll-right {
    right:0;
    border-left:solid 1px #eee
}
.content-tabs button {
    background:#fff;
    border:0;
    height:40px;
    width:40px;
    outline:0
}
.content-tabs button:hover {
    background:#fafafa
}
nav.page-tabs {
    margin-left:40px;
    width:100000px;
    height:40px;
    overflow:hidden
}
nav.page-tabs .page-tabs-content {
    float:left
}
.page-tabs a {
    display:block;
    float:left;
    border-right:solid 1px #eee;
    padding:0 15px
}
.page-tabs a i:hover {
    color:#c00
}
.content-tabs .roll-nav:hover,.page-tabs a:hover {
    color:#777;
    background:#f2f2f2;
    cursor:pointer
}
.roll-right.J_tabRight {
    right:140px
}
.roll-right.btn-group {
    right:60px;
    width:80px;
    padding:0
}
.roll-right.btn-group button {
    width:80px
}
.roll-right.J_tabExit {
    background:#fff;
    height:40px;
    width:60px;
    outline:0
}
.dropdown-menu-right {
    left:auto
}
#content-main {
    height:calc(100% - 51px);
    overflow:hidden
}
.fixed-nav #content-main {
    height:calc(100% - 80px);
    overflow:hidden
}
.table-bordered {
    border:1px solid #EBEBEB
}
.table-bordered>thead>tr>td,.table-bordered>thead>tr>th {
    background-color:#F5F5F6
}
.table-bordered>tbody>tr>td,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>td,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>thead>tr>th {
    border:1px solid #e7e7e7
}
.table>thead>tr>th {
    border-bottom:1px solid #DDD
}
.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th {
    border-top:1px solid #e7eaec;
    line-height:1.42857;
    padding:8px;
    vertical-align:middle
}
.panel.blank-panel {
    background:0 0;
    margin:0
}
.blank-panel .panel-heading {
    padding-bottom:0
}
.nav-tabs>li.active>a,.nav-tabs>li.active>a:focus,.nav-tabs>li.active>a:hover {
    -moz-border-bottom-colors:none;
    -moz-border-left-colors:none;
    -moz-border-right-colors:none;
    -moz-border-top-colors:none;
    background:0 0;
    border-color:#ddd #ddd rgba(0,0,0,0);
    border-bottom:#f3f3f4;
    -webkit-border-image:none;
    -o-border-image:none;
    border-image:none;
    border-style:solid;
    border-width:1px;
    color:#555;
    cursor:default
}
.nav.nav-tabs li {
    background:0 0;
    border:none
}
.nav-tabs>li>a {
    color:#A7B1C2;
    font-weight:600;
    padding:10px 20px 10px 25px
}
.nav-tabs>li>a:focus,.nav-tabs>li>a:hover {
    background-color:#e6e6e6;
    color:#676a6c
}
.ui-tab .tab-content {
    padding:20px 0
}
.no-padding {
    padding:0!important
}
.no-borders {
    border:none!important
}
.no-margins {
    margin:0!important
}
.no-top-border {
    border-top:0!important
}
.ibox-content.text-box {
    padding-bottom:0;
    padding-top:15px
}
.border-left-right {
    border-left:1px solid #e7eaec;
    border-right:1px solid #e7eaec;
    border-top:none;
    border-bottom:none
}
.border-left {
    border-left:1px solid #e7eaec;
    border-right:none;
    border-top:none;
    border-bottom:none
}
.border-right {
    border-left:none;
    border-right:1px solid #e7eaec;
    border-top:none;
    border-bottom:none
}
.full-width {
    width:100%!important
}
.link-block {
    font-size:12px;
    padding:10px
}
.nav.navbar-top-links .link-block a {
    font-size:12px
}
.link-block a {
    font-size:10px;
    color:inherit
}
body.mini-navbar .branding {
    display:none
}
img.circle-border {
    border:6px solid #FFF;
    border-radius:50%
}
.branding {
    float:left;
    color:#FFF;
    font-size:18px;
    font-weight:600;
    padding:17px 20px;
    text-align:center;
    background-color:#1ab394
}
.login-panel {
    margin-top:25%
}
.page-header {
    padding:20px 0 9px;
    margin:0 0 20px;
    border-bottom:1px solid #eee
}
.fontawesome-icon-list {
    margin-top:22px
}
.fontawesome-icon-list .fa-hover a {
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display:block;
    color:#222;
    line-height:32px;
    height:32px;
    padding-left:10px;
    border-radius:4px
}
.fontawesome-icon-list .fa-hover a .fa {
    width:32px;
    font-size:14px;
    display:inline-block;
    text-align:right;
    margin-right:10px
}
.fontawesome-icon-list .fa-hover a:hover {
    background-color:#1d9d74;
    color:#fff;
    text-decoration:none
}
.fontawesome-icon-list .fa-hover a:hover .fa {
    font-size:30px;
    vertical-align:-6px
}
.fontawesome-icon-list .fa-hover a:hover .text-muted {
    color:#bbe2d5
}
.feature-list .col-md-4 {
    margin-bottom:22px
}
.feature-list h4 .fa:before {
    vertical-align:-10%;
    font-size:28px;
    display:inline-block;
    width:1.07142857em;
    text-align:center;
    margin-right:5px
}
.ui-draggable .ibox-title {
    cursor:move
}
.breadcrumb {
    background-color:#fff;
    padding:0;
    margin-bottom:0
}
.breadcrumb>.active,.breadcrumb>li a {
    color:inherit
}
code {
    background-color:#F9F2F4;
    border-radius:4px;
    color:#ca4440;
    font-size:90%;
    padding:2px 4px;
    white-space:nowrap
}
.ibox {
    clear:both;
    margin-bottom:25px;
    margin-top:0;
    padding:0
}
.ibox.collapsed .ibox-content {
    display:none
}
.ibox.collapsed .fa.fa-chevron-up:before {
    content:"\f078"
}
.ibox.collapsed .fa.fa-chevron-down:before {
    content:"\f077"
}
.ibox:after,.ibox:before {
    display:table
}
.ibox-title {
    -moz-border-bottom-colors:none;
    -moz-border-left-colors:none;
    -moz-border-right-colors:none;
    -moz-border-top-colors:none;
    background-color:#fff;
    border-color:#e7eaec;
    -webkit-border-image:none;
    -o-border-image:none;
    border-image:none;
    border-style:solid solid none;
    border-width:4px 0 0;
    color:inherit;
    margin-bottom:0;
    padding:14px 15px 7px;
    min-height:48px
}
.ibox-content {
    background-color:#fff;
    color:inherit;
    padding:15px 20px 20px;
    border-color:#e7eaec;
    -webkit-border-image:none;
    -o-border-image:none;
    border-image:none;
    border-style:solid solid none;
    border-width:1px 0
}
table.table-mail tr td {
    padding:12px
}
.table-mail .check-mail {
    padding-left:20px
}
.table-mail .mail-date {
    padding-right:20px
}
.check-mail,.star-mail {
    width:40px
}
.unread td,.unread td a {
    font-weight:600;
    color:inherit
}
.read td,.read td a {
    font-weight:400;
    color:inherit
}
.unread td {
    background-color:#f9f8f8
}
.ibox-content {
    clear:both
}
.ibox-heading {
    background-color:#f3f6fb;
    border-bottom:none
}
.ibox-heading h3 {
    font-weight:200;
    font-size:24px
}
.ibox-title h5 {
    display:inline-block;
    font-size:14px;
    margin:0 0 7px;
    padding:0;
    text-overflow:ellipsis;
    float:left
}
.ibox-title .label {
    float:left;
    margin-left:4px
}
.ibox-tools {
    display:inline-block;
    float:right;
    margin-top:0;
    position:relative;
    padding:0
}
.ibox-tools a {
    cursor:pointer;
    margin-left:5px;
    color:#c4c4c4
}
.ibox-tools a.btn-primary {
    color:#fff
}
.ibox-tools .dropdown-menu>li>a {
    padding:4px 10px;
    font-size:12px
}
.ibox .open>.dropdown-menu {
    left:auto;
    right:0
}
.gray-bg {
    background-color:#f3f3f4
}
.white-bg {
    background-color:#fff
}
.navy-bg {
    background-color:#1ab394;
    color:#fff
}
.blue-bg {
    background-color:#1c84c6;
    color:#fff
}
.lazur-bg {
    background-color:#23c6c8;
    color:#fff
}
.yellow-bg {
    background-color:#f8ac59;
    color:#fff
}
.red-bg {
    background-color:#ed5565;
    color:#fff
}
.black-bg {
    background-color:#262626
}
.panel-primary {
    border-color:#1ab394
}
.panel-primary>.panel-heading {
    background-color:#1ab394;
    border-color:#1ab394
}
.panel-success {
    border-color:#1c84c6
}
.panel-success>.panel-heading {
    background-color:#1c84c6;
    border-color:#1c84c6;
    color:#fff
}
.panel-info {
    border-color:#23c6c8
}
.panel-info>.panel-heading {
    background-color:#23c6c8;
    border-color:#23c6c8;
    color:#fff
}
.panel-warning {
    border-color:#f8ac59
}
.panel-warning>.panel-heading {
    background-color:#f8ac59;
    border-color:#f8ac59;
    color:#fff
}
.panel-danger {
    border-color:#ed5565
}
.panel-danger>.panel-heading {
    background-color:#ed5565;
    border-color:#ed5565;
    color:#fff
}
.progress-bar {
    background-color:#1ab394
}
.progress-small,.progress-small .progress-bar {
    height:10px
}
.progress-mini,.progress-small {
    margin-top:5px
}
.progress-mini,.progress-mini .progress-bar {
    height:5px;
    margin-bottom:0
}
.progress-bar-navy-light {
    background-color:#3dc7ab
}
.progress-bar-success {
    background-color:#1c84c6
}
.progress-bar-info {
    background-color:#23c6c8
}
.progress-bar-warning {
    background-color:#f8ac59
}
.progress-bar-danger {
    background-color:#ed5565
}
.panel-title {
    font-size:inherit
}
.jumbotron {
    border-radius:6px;
    padding:40px
}
.jumbotron h1 {
    margin-top:0
}
.text-navy {
    color:#1ab394
}
.text-primary {
    color:inherit
}
.text-success {
    color:#1c84c6
}
.text-info {
    color:#23c6c8
}
.text-warning {
    color:#f8ac59
}
.text-danger {
    color:#ed5565
}
.text-muted {
    color:#888
}
.simple_tag {
    background-color:#f3f3f4;
    border:1px solid #e7eaec;
    border-radius:2px;
    color:inherit;
    font-size:10px;
    margin-right:5px;
    margin-top:5px;
    padding:5px 12px;
    display:inline-block
}
.img-shadow {
    box-shadow:0 0 3px 0 #919191
}
.ComposeEmail .navbar.navbar-static-top,.Dashboard_2 .navbar.navbar-static-top,.Dashboard_3 .navbar.navbar-static-top,.Dashboard_4_1 .navbar.navbar-static-top,.EmailView .navbar.navbar-static-top,.Inbox .navbar.navbar-static-top,.dashboards\.dashboard_2 nav.navbar,.dashboards\.dashboard_3 nav.navbar,.dashboards\.dashboard_4_1 nav.navbar,.mailbox\.email_compose nav.navbar,.mailbox\.email_view nav.navbar,.mailbox\.inbox nav.navbar {
    background:#fff
}
a.close-canvas-menu {
    position:absolute;
    top:10px;
    right:15px;
    z-index:1011;
    color:#a7b1c2
}
a.close-canvas-menu:hover {
    color:#fff
}
.full-height {
    height:100%
}
.fh-breadcrumb {
    height:calc(100% - 196px);
    margin:0 -15px;
    position:relative
}
.fh-no-breadcrumb {
    height:calc(100% - 99px);
    margin:0 -15px;
    position:relative
}
.fh-column {
    background:#fff;
    height:100%;
    width:240px;
    float:left
}
.modal-backdrop {
    z-index:2040!important
}
.modal {
    z-index:2050!important
}
.spiner-example {
    height:200px;
    padding-top:70px
}
.p-xxs {
    padding:5px
}
.p-xs {
    padding:10px
}
.p-sm {
    padding:15px
}
.p-m {
    padding:20px
}
.p-md {
    padding:25px
}
.p-lg {
    padding:30px
}
.p-xl {
    padding:40px
}
.m-xxs {
    margin:2px 4px
}
.m-xs {
    margin:5px
}
.m-sm {
    margin:10px
}
.m {
    margin:15px
}
.m-md {
    margin:20px
}
.m-lg {
    margin:30px
}
.m-xl {
    margin:50px
}
.m-n {
    margin:0!important
}
.m-l-none {
    margin-left:0
}
.m-l-xs {
    margin-left:5px
}
.m-l-sm {
    margin-left:10px
}
.m-l {
    margin-left:15px
}
.m-l-md {
    margin-left:20px
}
.m-l-lg {
    margin-left:30px
}
.m-l-xl {
    margin-left:40px
}
.m-l-n-xxs {
    margin-left:-1px
}
.m-l-n-xs {
    margin-left:-5px
}
.m-l-n-sm {
    margin-left:-10px
}
.m-l-n {
    margin-left:-15px
}
.m-l-n-md {
    margin-left:-20px
}
.m-l-n-lg {
    margin-left:-30px
}
.m-l-n-xl {
    margin-left:-40px
}
.m-t-none {
    margin-top:0
}
.m-t-xxs {
    margin-top:1px
}
.m-t-xs {
    margin-top:5px
}
.m-t-sm {
    margin-top:10px
}
.m-t {
    margin-top:15px
}
.m-t-md {
    margin-top:20px
}
.m-t-lg {
    margin-top:30px
}
.m-t-xl {
    margin-top:40px
}
.m-t-n-xxs {
    margin-top:-1px
}
.m-t-n-xs {
    margin-top:-5px
}
.m-t-n-sm {
    margin-top:-10px
}
.m-t-n {
    margin-top:-15px
}
.m-t-n-md {
    margin-top:-20px
}
.m-t-n-lg {
    margin-top:-30px
}
.m-t-n-xl {
    margin-top:-40px
}
.m-r-none {
    margin-right:0
}
.m-r-xxs {
    margin-right:1px
}
.m-r-xs {
    margin-right:5px
}
.m-r-sm {
    margin-right:10px
}
.m-r {
    margin-right:15px
}
.m-r-md {
    margin-right:20px
}
.m-r-lg {
    margin-right:30px
}
.m-r-xl {
    margin-right:40px
}
.m-r-n-xxs {
    margin-right:-1px
}
.m-r-n-xs {
    margin-right:-5px
}
.m-r-n-sm {
    margin-right:-10px
}
.m-r-n {
    margin-right:-15px
}
.m-r-n-md {
    margin-right:-20px
}
.m-r-n-lg {
    margin-right:-30px
}
.m-r-n-xl {
    margin-right:-40px
}
.m-b-none {
    margin-bottom:0
}
.m-b-xxs {
    margin-bottom:1px
}
.m-b-xs {
    margin-bottom:5px
}
.m-b-sm {
    margin-bottom:10px
}
.m-b {
    margin-bottom:15px
}
.m-b-md {
    margin-bottom:20px
}
.m-b-lg {
    margin-bottom:30px
}
.m-b-xl {
    margin-bottom:40px
}
.m-b-n-xxs {
    margin-bottom:-1px
}
.m-b-n-xs {
    margin-bottom:-5px
}
.m-b-n-sm {
    margin-bottom:-10px
}
.m-b-n {
    margin-bottom:-15px
}
.m-b-n-md {
    margin-bottom:-20px
}
.m-b-n-lg {
    margin-bottom:-30px
}
.m-b-n-xl {
    margin-bottom:-40px
}
.space-15 {
    margin:15px 0
}
.space-20 {
    margin:20px 0
}
.space-25 {
    margin:25px 0
}
.space-30 {
    margin:30px 0
}
body.modal-open {
    padding-right:inherit!important
}
.search-form {
    margin-top:10px
}
.search-result h3 {
    margin-bottom:0;
    color:#1E0FBE
}
.search-result .search-link {
    color:#006621
}
.search-result p {
    font-size:12px;
    margin-top:5px
}
.contact-box {
    background-color:#fff;
    border:1px solid #e7eaec;
    padding:20px;
    margin-bottom:20px
}
.contact-box a {
    color:inherit
}
.invoice-table tbody>tr>td:last-child,.invoice-table tbody>tr>td:nth-child(2),.invoice-table tbody>tr>td:nth-child(3),.invoice-table tbody>tr>td:nth-child(4),.invoice-table thead>tr>th:last-child,.invoice-table thead>tr>th:nth-child(2),.invoice-table thead>tr>th:nth-child(3),.invoice-table thead>tr>th:nth-child(4),.invoice-total>tbody>tr>td:first-child {
    text-align:right
}
.invoice-total>tbody>tr>td {
    border:0 none
}
.invoice-total>tbody>tr>td:last-child {
    border-bottom:1px solid #DDD;
    text-align:right;
    width:15%
}
.middle-box {
    max-width:400px;
    z-index:100;
    margin:0 auto;
    padding-top:40px
}
.lockscreen.middle-box {
    width:200px;
    padding-top:110px
}
.loginscreen.middle-box {
    width:300px
}
.loginColumns {
    max-width:800px;
    margin:0 auto;
    padding:100px 20px 20px
}
.passwordBox {
    max-width:460px;
    margin:0 auto;
    padding:100px 20px 20px
}
.logo-name {
    color:#e6e6e6;
    font-size:180px;
    font-weight:800;
    letter-spacing:-10px;
    margin-bottom:0
}
.middle-box h1 {
    font-size:170px
}
.wrapper .middle-box {
    margin-top:140px
}
.lock-word {
    z-index:10;
    position:absolute;
    top:110px;
    left:50%;
    margin-left:-470px
}
.lock-word span {
    font-size:100px;
    font-weight:600;
    color:#e9e9e9;
    display:inline-block
}
.lock-word .first-word {
    margin-right:160px
}
.dashboard-header {
    border-top:0;
    padding:20px
}
.dashboard-header h2 {
    margin-top:10px;
    font-size:26px
}
.fist-item {
    border-top:none!important
}
.statistic-box {
    margin-top:40px
}
.dashboard-header .list-group-item span.label {
    margin-right:10px
}
.list-group.clear-list .list-group-item {
    border-top:1px solid #e7eaec;
    border-bottom:0;
    border-right:0;
    border-left:0;
    padding:10px 0
}
ul.clear-list:first-child {
    border-top:none!important
}
.timeline-item .date i {
    position:absolute;
    top:0;
    right:0;
    padding:5px;
    width:30px;
    text-align:center;
    border-top:1px solid #e7eaec;
    border-bottom:1px solid #e7eaec;
    border-left:1px solid #e7eaec;
    background:#f8f8f8
}
.timeline-item .date {
    text-align:right;
    width:110px;
    position:relative;
    padding-top:30px
}
.timeline-item .content {
    border-left:1px solid #e7eaec;
    border-top:1px solid #e7eaec;
    padding-top:10px;
    min-height:100px
}
.timeline-item .content:hover {
    background:#f6f6f6
}
ul.notes li,ul.tag-list li {
    list-style:none
}
ul.notes li h4 {
    margin-top:20px;
    font-size:16px
}
ul.notes li div {
    position:relative
}
ul.notes li div small {
    position:absolute;
    top:5px;
    right:5px;
    font-size:10px
}
ul.notes li div a {
    position:absolute;
    right:10px;
    bottom:10px;
    color:inherit
}
ul.notes li {
    margin:10px 40px 50px 0;
    float:left
}
ul.notes li div p {
    font-size:12px
}
ul.notes li div {
    -webkit-transform:rotate(-6deg);
    -o-transform:rotate(-6deg);
    -moz-transform:rotate(-6deg)
}
ul.notes li:nth-child(even) div {
    -o-transform:rotate(4deg);
    -webkit-transform:rotate(4deg);
    -moz-transform:rotate(4deg);
    position:relative;
    top:5px
}
ul.notes li:nth-child(3n) div {
    -o-transform:rotate(-3deg);
    -webkit-transform:rotate(-3deg);
    -moz-transform:rotate(-3deg);
    position:relative;
    top:-5px
}
ul.notes li:nth-child(5n) div {
    -o-transform:rotate(5deg);
    -webkit-transform:rotate(5deg);
    -moz-transform:rotate(5deg);
    position:relative;
    top:-10px
}
ul.notes li div:focus,ul.notes li div:hover {
    -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -o-transform:scale(1.1);
    position:relative;
    z-index:5
}
ul.notes li div {
    text-decoration:none;
    color:#000;
    background:#ffc;
    display:block;
    height:210px;
    width:210px;
    padding:1em;
    box-shadow:5px 5px 7px rgba(33,33,33,.7);
    -webkit-transition:-webkit-transform .15s linear
}
.file-box {
    float:left;
    width:220px
}
.file-manager h5 {
    text-transform:uppercase
}
.file-manager {
    list-style:none outside none;
    margin:0;
    padding:0
}
.folder-list li a {
    color:#666;
    display:block;
    padding:5px 0
}
.folder-list li {
    border-bottom:1px solid #e7eaec;
    display:block
}
.folder-list li i {
    margin-right:8px;
    color:#3d4d5d
}
.category-list li a {
    color:#666;
    display:block;
    padding:5px 0
}
.category-list li {
    display:block
}
.category-list li i {
    margin-right:8px;
    color:#3d4d5d
}
.category-list li a .text-navy {
    color:#1ab394
}
.category-list li a .text-primary {
    color:#1c84c6
}
.category-list li a .text-info {
    color:#23c6c8
}
.category-list li a .text-danger {
    color:#EF5352
}
.category-list li a .text-warning {
    color:#F8AC59
}
.file-manager h5.tag-title {
    margin-top:20px
}
.tag-list li {
    float:left
}
.tag-list li a {
    font-size:10px;
    background-color:#f3f3f4;
    padding:5px 12px;
    color:inherit;
    border-radius:2px;
    border:1px solid #e7eaec;
    margin-right:5px;
    margin-top:5px;
    display:block
}
.file {
    border:1px solid #e7eaec;
    padding:0;
    background-color:#fff;
    position:relative;
    margin-bottom:20px;
    margin-right:20px
}
.file-manager .hr-line-dashed {
    margin:15px 0
}
.file .icon,.file .image {
    height:100px;
    overflow:hidden
}
.file .icon {
    padding:15px 10px;
    text-align:center
}
.file-control {
    color:inherit;
    font-size:11px;
    margin-right:10px
}
.file-control.active {
    text-decoration:underline
}
.file .icon i {
    font-size:70px;
    color:#dadada
}
.file .file-name {
    padding:10px;
    background-color:#f8f8f8;
    border-top:1px solid #e7eaec
}
.file-name small {
    color:#676a6c
}
.corner {
    position:absolute;
    display:inline-block;
    width:0;
    height:0;
    line-height:0;
    border:.6em solid transparent;
    border-right:.6em solid #f1f1f1;
    border-bottom:.6em solid #f1f1f1;
    right:0;
    bottom:0
}
a.compose-mail {
    padding:8px 10px
}
.mail-search {
    max-width:300px
}
.profile-content {
    border-top:none!important
}
.feed-activity-list .feed-element {
    border-bottom:1px solid #e7eaec
}
.feed-element:first-child {
    margin-top:0
}
.feed-element {
    padding-bottom:15px
}
.feed-element,.feed-element .media {
    margin-top:15px
}
.feed-element,.media-body {
    overflow:hidden
}
.feed-element>.pull-left {
    margin-right:10px
}
.dropdown-messages-box img.img-circle,.feed-element img.img-circle {
    width:38px;
    height:38px
}
.feed-element .well {
    border:1px solid #e7eaec;
    box-shadow:none;
    margin-top:10px;
    margin-bottom:5px;
    padding:10px 20px;
    font-size:11px;
    line-height:16px
}
.feed-element .actions {
    margin-top:10px
}
.feed-element .photos {
    margin:10px 0
}
.feed-photo {
    max-height:180px;
    border-radius:4px;
    overflow:hidden;
    margin-right:10px;
    margin-bottom:10px
}
.mail-box {
    background-color:#fff;
    border:1px solid #e7eaec;
    border-top:0;
    padding:0;
    margin-bottom:20px
}
.mail-box-header {
    background-color:#fff;
    border:1px solid #e7eaec;
    border-bottom:0;
    padding:30px 20px 20px
}
.mail-box-header h2 {
    margin-top:0
}
.mailbox-content .tag-list li a {
    background:#fff
}
.mail-body {
    border-top:1px solid #e7eaec;
    padding:20px
}
.mail-text {
    border-top:1px solid #e7eaec
}
.mail-text .note-toolbar {
    padding:10px 15px
}
.mail-body .form-group {
    margin-bottom:5px
}
.mail-text .note-editor .note-toolbar {
    background-color:#F9F8F8
}
.mail-attachment {
    border-top:1px solid #e7eaec;
    padding:20px;
    font-size:12px
}
.mailbox-content {
    background:0 0;
    border:none;
    padding:10px
}
.mail-ontact {
    width:23%
}
.project-actions,.project-people {
    text-align:right;
    vertical-align:middle
}
dd.project-people {
    text-align:left;
    margin-top:5px
}
.project-people img {
    width:32px;
    height:32px
}
.project-title a {
    font-size:14px;
    color:#676a6c;
    font-weight:600
}
.project-list table tr td {
    border-top:none;
    border-bottom:1px solid #e7eaec;
    padding:15px 10px;
    vertical-align:middle
}
.project-manager .tag-list li a {
    font-size:10px;
    background-color:#fff;
    padding:5px 12px;
    color:inherit;
    border-radius:2px;
    border:1px solid #e7eaec;
    margin-right:5px;
    margin-top:5px;
    display:block
}
.project-files li a {
    font-size:11px;
    color:#676a6c;
    margin-left:10px;
    line-height:22px
}
.faq-item {
    padding:20px;
    margin-bottom:2px;
    background:#fff
}
.faq-question {
    font-size:18px;
    font-weight:600;
    color:#1ab394;
    display:block
}
.faq-question:hover {
    color:#179d82
}
.faq-answer {
    margin-top:10px;
    background:#f3f3f4;
    border:1px solid #e7eaec;
    border-radius:3px;
    padding:15px
}
.faq-item .tag-item {
    background:#f3f3f4;
    padding:2px 6px;
    font-size:10px;
    text-transform:uppercase
}
.message-input {
    height:90px!important
}
.chat-avatar {
    white:36px;
    height:36px;
    float:left;
    margin-right:10px
}
.chat-user-name {
    padding:10px
}
.chat-user {
    padding:8px 10px;
    border-bottom:1px solid #e7eaec
}
.chat-user a {
    color:inherit
}
.chat-view {
    z-index:20012
}
.chat-statistic,.chat-users {
    margin-left:-30px
}
@media (max-width:992px) {
    .chat-statistic,.chat-users {
        margin-left:0
    }
}
.chat-view .ibox-content {
    padding:0
}
.chat-message {
    padding:10px 20px
}
.message-avatar {
    height:48px;
    width:48px;
    border:1px solid #e7eaec;
    border-radius:4px;
    margin-top:1px
}
.chat-discussion .chat-message:nth-child(2n+1) .message-avatar {
    float:left;
    margin-right:10px
}
.chat-discussion .chat-message:nth-child(2n) .message-avatar {
    float:right;
    margin-left:10px
}
.message {
    background-color:#fff;
    border:1px solid #e7eaec;
    text-align:left;
    display:block;
    padding:10px 20px;
    position:relative;
    border-radius:4px
}
.chat-discussion .chat-message:nth-child(2n+1) .message-date {
    float:right
}
.chat-discussion .chat-message:nth-child(2n) .message-date {
    float:left
}
.chat-discussion .chat-message:nth-child(2n+1) .message {
    text-align:left;
    margin-left:55px
}
.chat-discussion .chat-message:nth-child(2n) .message {
    text-align:right;
    margin-right:55px
}
.message-date {
    font-size:10px;
    color:#888
}
.message-content {
    display:block
}
.chat-discussion {
    background:#eee;
    padding:15px;
    height:400px;
    overflow-y:auto
}
.chat-users {
    overflow-y:auto;
    height:400px
}
.chat-message-form .form-group {
    margin-bottom:0
}
.jstree-open>.jstree-anchor>.fa-folder:before {
    content:"\f07c"
}
.jstree-default .jstree-icon.none {
    width:0
}
.clients-list {
    margin-top:20px
}
.clients-list .tab-pane {
    position:relative;
    height:600px
}
.client-detail {
    position:relative;
    height:620px
}
.clients-list table tr td {
    height:46px;
    vertical-align:middle;
    border:none
}
.client-link {
    font-weight:600;
    color:inherit
}
.client-link:hover {
    color:inherit
}
.client-avatar {
    width:42px
}
.client-avatar img {
    width:28px;
    height:28px;
    border-radius:50%
}
.contact-type {
    width:20px;
    color:#c1c3c4
}
.client-status {
    text-align:left
}
.client-detail .vertical-timeline-content p {
    margin:0
}
.client-detail .vertical-timeline-icon.gray-bg {
    color:#a7aaab
}
.clients-list .nav-tabs>li.active>a,.clients-list .nav-tabs>li.active>a:focus,.clients-list .nav-tabs>li.active>a:hover {
    border-bottom:1px solid #fff
}
.blog h2 {
    font-weight:700
}
.blog .btn,.blog h5 {
    margin:0 0 5px
}
.article h1 {
    font-size:48px;
    font-weight:700;
    color:#2F4050
}
.article p {
    font-size:15px;
    line-height:26px
}
.article-title {
    text-align:center;
    margin:60px 0 40px
}
.article .ibox-content {
    padding:40px
}
.issue-tracker .btn-link {
    color:#1ab394
}
table.issue-tracker tbody tr td {
    vertical-align:middle;
    height:50px
}
.issue-info {
    width:50%
}
.issue-info a {
    font-weight:600;
    color:#676a6c
}
.issue-info small {
    display:block
}
.team-members {
    margin:10px 0
}
.team-members img.img-circle {
    width:42px;
    height:42px;
    margin-bottom:5px
}
.sortable-list {
    padding:10px 0
}
.agile-list {
    list-style:none;
    margin:0
}
.agile-list li {
    background:#FAFAFB;
    border:1px solid #e7eaec;
    margin:0 0 10px;
    padding:10px;
    border-radius:2px
}
.agile-list li:hover {
    cursor:pointer;
    background:#fff
}
.agile-list li.warning-element {
    border-left:3px solid #f8ac59
}
.agile-list li.danger-element {
    border-left:3px solid #ed5565
}
.agile-list li.info-element {
    border-left:3px solid #1c84c6
}
.agile-list li.success-element {
    border-left:3px solid #1ab394
}
.agile-detail {
    margin-top:5px;
    font-size:12px
}
ins {
    background-color:#c6ffc6;
    text-decoration:none
}
del {
    background-color:#ffc6c6
}
#small-chat {
    position:fixed;
    bottom:50px;
    right:26px;
    z-index:100
}
#small-chat .badge {
    position:absolute;
    top:-3px;
    right:-4px
}
.open-small-chat {
    height:38px;
    width:38px;
    display:block;
    background:#1ab394;
    padding:9px 8px;
    text-align:center;
    color:#fff;
    border-radius:50%
}
.open-small-chat:hover {
    color:#fff;
    background:#1ab394
}
.small-chat-box {
    display:none;
    position:fixed;
    bottom:50px;
    right:80px;
    background:#fff;
    border:1px solid #e7eaec;
    width:230px;
    height:320px;
    border-radius:4px
}
.small-chat-box.ng-small-chat {
    display:block
}
.body-small .small-chat-box {
    bottom:70px;
    right:20px
}
.small-chat-box.active {
    display:block
}
.small-chat-box .heading {
    background:#2f4050;
    padding:8px 15px;
    font-weight:700;
    color:#fff
}
.small-chat-box .chat-date {
    opacity:.6;
    font-size:10px;
    font-weight:400
}
.small-chat-box .content {
    padding:15px
}
.small-chat-box .content .author-name {
    font-weight:700;
    margin-bottom:3px;
    font-size:11px
}
.small-chat-box .content>div {
    padding-bottom:20px
}
.small-chat-box .content .chat-message {
    padding:5px 10px;
    border-radius:6px;
    font-size:11px;
    line-height:14px;
    max-width:80%;
    background:#f3f3f4;
    margin-bottom:10px
}
.small-chat-box .content .chat-message.active {
    background:#1ab394;
    color:#fff
}
.small-chat-box .content .left {
    text-align:left;
    clear:both
}
.small-chat-box .content .left .chat-message {
    float:left
}
.small-chat-box .content .right {
    text-align:right;
    clear:both
}
.small-chat-box .content .right .chat-message {
    float:right
}
.small-chat-box .form-chat {
    padding:10px
}
.sk-spinner-rotating-plane.sk-spinner {
    width:30px;
    height:30px;
    background-color:#1ab394;
    margin:0 auto;
    -webkit-animation:sk-rotatePlane 1.2s infinite ease-in-out;
    animation:sk-rotatePlane 1.2s infinite ease-in-out
}
@-webkit-keyframes sk-rotatePlane {
    0% {
    -webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg);
    transform:perspective(120px) rotateX(0deg) rotateY(0deg)
}
50% {
    -webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)
}
100% {
    -webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)
}
}@keyframes sk-rotatePlane {
    0% {
    -webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg);
    transform:perspective(120px) rotateX(0deg) rotateY(0deg)
}
50% {
    -webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)
}
100% {
    -webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)
}
}.sk-spinner-double-bounce.sk-spinner {
    width:40px;
    height:40px;
    position:relative;
    margin:0 auto
}
.sk-spinner-double-bounce .sk-double-bounce1,.sk-spinner-double-bounce .sk-double-bounce2 {
    width:100%;
    height:100%;
    border-radius:50%;
    background-color:#1ab394;
    opacity:.6;
    position:absolute;
    top:0;
    left:0;
    -webkit-animation:sk-doubleBounce 2s infinite ease-in-out;
    animation:sk-doubleBounce 2s infinite ease-in-out
}
.sk-spinner-double-bounce .sk-double-bounce2 {
    -webkit-animation-delay:-1s;
    animation-delay:-1s
}
@-webkit-keyframes sk-doubleBounce {
    0%,100% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
50% {
    -webkit-transform:scale(1);
    transform:scale(1)
}
}@keyframes sk-doubleBounce {
    0%,100% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
50% {
    -webkit-transform:scale(1);
    transform:scale(1)
}
}.sk-spinner-wave.sk-spinner {
    margin:0 auto;
    width:50px;
    height:30px;
    text-align:center;
    font-size:10px
}
.sk-spinner-wave div {
    background-color:#1ab394;
    height:100%;
    width:6px;
    display:inline-block;
    -webkit-animation:sk-waveStretchDelay 1.2s infinite ease-in-out;
    animation:sk-waveStretchDelay 1.2s infinite ease-in-out
}
.sk-spinner-wave .sk-rect2 {
    -webkit-animation-delay:-1.1s;
    animation-delay:-1.1s
}
.sk-spinner-wave .sk-rect3 {
    -webkit-animation-delay:-1s;
    animation-delay:-1s
}
.sk-spinner-wave .sk-rect4 {
    -webkit-animation-delay:-.9s;
    animation-delay:-.9s
}
.sk-spinner-wave .sk-rect5 {
    -webkit-animation-delay:-.8s;
    animation-delay:-.8s
}
@-webkit-keyframes sk-waveStretchDelay {
    0%,100%,40% {
    -webkit-transform:scaleY(0.4);
    transform:scaleY(0.4)
}
20% {
    -webkit-transform:scaleY(1);
    transform:scaleY(1)
}
}@keyframes sk-waveStretchDelay {
    0%,100%,40% {
    -webkit-transform:scaleY(0.4);
    transform:scaleY(0.4)
}
20% {
    -webkit-transform:scaleY(1);
    transform:scaleY(1)
}
}.sk-spinner-wandering-cubes.sk-spinner {
    margin:0 auto;
    width:32px;
    height:32px;
    position:relative
}
.sk-spinner-wandering-cubes .sk-cube1,.sk-spinner-wandering-cubes .sk-cube2 {
    background-color:#1ab394;
    width:10px;
    height:10px;
    position:absolute;
    top:0;
    left:0;
    -webkit-animation:sk-wanderingCubeMove 1.8s infinite ease-in-out;
    animation:sk-wanderingCubeMove 1.8s infinite ease-in-out
}
.sk-spinner-wandering-cubes .sk-cube2 {
    -webkit-animation-delay:-.9s;
    animation-delay:-.9s
}
@-webkit-keyframes sk-wanderingCubeMove {
    25% {
    -webkit-transform:translateX(42px) rotate(-90deg) scale(0.5);
    transform:translateX(42px) rotate(-90deg) scale(0.5)
}
50% {
    -webkit-transform:translateX(42px) translateY(42px) rotate(-179deg);
    transform:translateX(42px) translateY(42px) rotate(-179deg)
}
50.1% {
    -webkit-transform:translateX(42px) translateY(42px) rotate(-180deg);
    transform:translateX(42px) translateY(42px) rotate(-180deg)
}
75% {
    -webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    transform:translateX(0px) translateY(42px) rotate(-270deg) scale(0.5)
}
100% {
    -webkit-transform:rotate(-360deg);
    transform:rotate(-360deg)
}
}@keyframes sk-wanderingCubeMove {
    25% {
    -webkit-transform:translateX(42px) rotate(-90deg) scale(0.5);
    transform:translateX(42px) rotate(-90deg) scale(0.5)
}
50% {
    -webkit-transform:translateX(42px) translateY(42px) rotate(-179deg);
    transform:translateX(42px) translateY(42px) rotate(-179deg)
}
50.1% {
    -webkit-transform:translateX(42px) translateY(42px) rotate(-180deg);
    transform:translateX(42px) translateY(42px) rotate(-180deg)
}
75% {
    -webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    transform:translateX(0px) translateY(42px) rotate(-270deg) scale(0.5)
}
100% {
    -webkit-transform:rotate(-360deg);
    transform:rotate(-360deg)
}
}.sk-spinner-pulse.sk-spinner {
    width:40px;
    height:40px;
    margin:0 auto;
    background-color:#1ab394;
    border-radius:100%;
    -webkit-animation:sk-pulseScaleOut 1s infinite ease-in-out;
    animation:sk-pulseScaleOut 1s infinite ease-in-out
}
@-webkit-keyframes sk-pulseScaleOut {
    0% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
100% {
    -webkit-transform:scale(1);
    transform:scale(1);
    opacity:0
}
}@keyframes sk-pulseScaleOut {
    0% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
100% {
    -webkit-transform:scale(1);
    transform:scale(1);
    opacity:0
}
}.sk-spinner-chasing-dots.sk-spinner {
    margin:0 auto;
    width:40px;
    height:40px;
    position:relative;
    text-align:center;
    -webkit-animation:sk-chasingDotsRotate 2s infinite linear;
    animation:sk-chasingDotsRotate 2s infinite linear
}
.sk-spinner-chasing-dots .sk-dot1,.sk-spinner-chasing-dots .sk-dot2 {
    width:60%;
    height:60%;
    display:inline-block;
    position:absolute;
    top:0;
    background-color:#1ab394;
    border-radius:100%;
    -webkit-animation:sk-chasingDotsBounce 2s infinite ease-in-out;
    animation:sk-chasingDotsBounce 2s infinite ease-in-out
}
.sk-spinner-chasing-dots .sk-dot2 {
    top:auto;
    bottom:0;
    -webkit-animation-delay:-1s;
    animation-delay:-1s
}
@-webkit-keyframes sk-chasingDotsRotate {
    100% {
    -webkit-transform:rotate(360deg);
    transform:rotate(360deg)
}
}@keyframes sk-chasingDotsRotate {
    100% {
    -webkit-transform:rotate(360deg);
    transform:rotate(360deg)
}
}@-webkit-keyframes sk-chasingDotsBounce {
    0%,100% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
50% {
    -webkit-transform:scale(1);
    transform:scale(1)
}
}@keyframes sk-chasingDotsBounce {
    0%,100% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
50% {
    -webkit-transform:scale(1);
    transform:scale(1)
}
}.sk-spinner-three-bounce.sk-spinner {
    margin:0 auto;
    width:70px;
    text-align:center
}
.sk-spinner-three-bounce div {
    width:18px;
    height:18px;
    background-color:#1ab394;
    border-radius:100%;
    display:inline-block;
    -webkit-animation:sk-threeBounceDelay 1.4s infinite ease-in-out;
    animation:sk-threeBounceDelay 1.4s infinite ease-in-out;
    -webkit-animation-fill-mode:both;
    animation-fill-mode:both
}
.sk-spinner-three-bounce .sk-bounce1 {
    -webkit-animation-delay:-.32s;
    animation-delay:-.32s
}
.sk-spinner-three-bounce .sk-bounce2 {
    -webkit-animation-delay:-.16s;
    animation-delay:-.16s
}
@-webkit-keyframes sk-threeBounceDelay {
    0%,100%,80% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
40% {
    -webkit-transform:scale(1);
    transform:scale(1)
}
}@keyframes sk-threeBounceDelay {
    0%,100%,80% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
40% {
    -webkit-transform:scale(1);
    transform:scale(1)
}
}.sk-spinner-circle.sk-spinner {
    margin:0 auto;
    width:22px;
    height:22px;
    position:relative
}
.sk-spinner-circle .sk-circle {
    width:100%;
    height:100%;
    position:absolute;
    left:0;
    top:0
}
.sk-spinner-circle .sk-circle:before {
    content:'';
    display:block;
    margin:0 auto;
    width:20%;
    height:20%;
    background-color:#1ab394;
    border-radius:100%;
    -webkit-animation:sk-circleBounceDelay 1.2s infinite ease-in-out;
    animation:sk-circleBounceDelay 1.2s infinite ease-in-out;
    -webkit-animation-fill-mode:both;
    animation-fill-mode:both
}
.sk-spinner-circle .sk-circle2 {
    -webkit-transform:rotate(30deg);
    -ms-transform:rotate(30deg);
    transform:rotate(30deg)
}
.sk-spinner-circle .sk-circle3 {
    -webkit-transform:rotate(60deg);
    -ms-transform:rotate(60deg);
    transform:rotate(60deg)
}
.sk-spinner-circle .sk-circle4 {
    -webkit-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    transform:rotate(90deg)
}
.sk-spinner-circle .sk-circle5 {
    -webkit-transform:rotate(120deg);
    -ms-transform:rotate(120deg);
    transform:rotate(120deg)
}
.sk-spinner-circle .sk-circle6 {
    -webkit-transform:rotate(150deg);
    -ms-transform:rotate(150deg);
    transform:rotate(150deg)
}
.sk-spinner-circle .sk-circle7 {
    -webkit-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
    transform:rotate(180deg)
}
.sk-spinner-circle .sk-circle8 {
    -webkit-transform:rotate(210deg);
    -ms-transform:rotate(210deg);
    transform:rotate(210deg)
}
.sk-spinner-circle .sk-circle9 {
    -webkit-transform:rotate(240deg);
    -ms-transform:rotate(240deg);
    transform:rotate(240deg)
}
.sk-spinner-circle .sk-circle10 {
    -webkit-transform:rotate(270deg);
    -ms-transform:rotate(270deg);
    transform:rotate(270deg)
}
.sk-spinner-circle .sk-circle11 {
    -webkit-transform:rotate(300deg);
    -ms-transform:rotate(300deg);
    transform:rotate(300deg)
}
.sk-spinner-circle .sk-circle12 {
    -webkit-transform:rotate(330deg);
    -ms-transform:rotate(330deg);
    transform:rotate(330deg)
}
.sk-spinner-circle .sk-circle2:before {
    -webkit-animation-delay:-1.1s;
    animation-delay:-1.1s
}
.sk-spinner-circle .sk-circle3:before {
    -webkit-animation-delay:-1s;
    animation-delay:-1s
}
.sk-spinner-circle .sk-circle4:before {
    -webkit-animation-delay:-.9s;
    animation-delay:-.9s
}
.sk-spinner-circle .sk-circle5:before {
    -webkit-animation-delay:-.8s;
    animation-delay:-.8s
}
.sk-spinner-circle .sk-circle6:before {
    -webkit-animation-delay:-.7s;
    animation-delay:-.7s
}
.sk-spinner-circle .sk-circle7:before {
    -webkit-animation-delay:-.6s;
    animation-delay:-.6s
}
.sk-spinner-circle .sk-circle8:before {
    -webkit-animation-delay:-.5s;
    animation-delay:-.5s
}
.sk-spinner-circle .sk-circle9:before {
    -webkit-animation-delay:-.4s;
    animation-delay:-.4s
}
.sk-spinner-circle .sk-circle10:before {
    -webkit-animation-delay:-.3s;
    animation-delay:-.3s
}
.sk-spinner-circle .sk-circle11:before {
    -webkit-animation-delay:-.2s;
    animation-delay:-.2s
}
.sk-spinner-circle .sk-circle12:before {
    -webkit-animation-delay:-.1s;
    animation-delay:-.1s
}
@-webkit-keyframes sk-circleBounceDelay {
    0%,100%,80% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
40% {
    -webkit-transform:scale(1);
    transform:scale(1)
}
}@keyframes sk-circleBounceDelay {
    0%,100%,80% {
    -webkit-transform:scale(0);
    transform:scale(0)
}
40% {
    -webkit-transform:scale(1);
    transform:scale(1)
}
}.sk-spinner-cube-grid.sk-spinner {
    width:30px;
    height:30px;
    margin:0 auto
}
.sk-spinner-cube-grid .sk-cube {
    width:33%;
    height:33%;
    background-color:#1ab394;
    float:left;
    -webkit-animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
    animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out
}
.sk-spinner-cube-grid .sk-cube:nth-child(1) {
    -webkit-animation-delay:.2s;
    animation-delay:.2s
}
.sk-spinner-cube-grid .sk-cube:nth-child(2) {
    -webkit-animation-delay:.3s;
    animation-delay:.3s
}
.sk-spinner-cube-grid .sk-cube:nth-child(3) {
    -webkit-animation-delay:.4s;
    animation-delay:.4s
}
.sk-spinner-cube-grid .sk-cube:nth-child(4) {
    -webkit-animation-delay:.1s;
    animation-delay:.1s
}
.sk-spinner-cube-grid .sk-cube:nth-child(5) {
    -webkit-animation-delay:.2s;
    animation-delay:.2s
}
.sk-spinner-cube-grid .sk-cube:nth-child(6) {
    -webkit-animation-delay:.3s;
    animation-delay:.3s
}
.sk-spinner-cube-grid .sk-cube:nth-child(7) {
    -webkit-animation-delay:0s;
    animation-delay:0s
}
.sk-spinner-cube-grid .sk-cube:nth-child(8) {
    -webkit-animation-delay:.1s;
    animation-delay:.1s
}
.sk-spinner-cube-grid .sk-cube:nth-child(9) {
    -webkit-animation-delay:.2s;
    animation-delay:.2s
}
@-webkit-keyframes sk-cubeGridScaleDelay {
    0%,100%,70% {
    -webkit-transform:scale3D(1,1,1);
    transform:scale3D(1,1,1)
}
35% {
    -webkit-transform:scale3D(0,0,1);
    transform:scale3D(0,0,1)
}
}@keyframes sk-cubeGridScaleDelay {
    0%,100%,70% {
    -webkit-transform:scale3D(1,1,1);
    transform:scale3D(1,1,1)
}
35% {
    -webkit-transform:scale3D(0,0,1);
    transform:scale3D(0,0,1)
}
}.sk-spinner-wordpress.sk-spinner {
    background-color:#1ab394;
    width:30px;
    height:30px;
    border-radius:30px;
    position:relative;
    margin:0 auto;
    -webkit-animation:sk-innerCircle 1s linear infinite;
    animation:sk-innerCircle 1s linear infinite
}
.sk-spinner-wordpress .sk-inner-circle {
    display:block;
    background-color:#fff;
    width:8px;
    height:8px;
    position:absolute;
    border-radius:8px;
    top:5px;
    left:5px
}
@-webkit-keyframes sk-innerCircle {
    0% {
    -webkit-transform:rotate(0);
    transform:rotate(0)
}
100% {
    -webkit-transform:rotate(360deg);
    transform:rotate(360deg)
}
}@keyframes sk-innerCircle {
    0% {
    -webkit-transform:rotate(0);
    transform:rotate(0)
}
100% {
    -webkit-transform:rotate(360deg);
    transform:rotate(360deg)
}
}.sk-spinner-fading-circle.sk-spinner {
    margin:0 auto;
    width:22px;
    height:22px;
    position:relative
}
.sk-spinner-fading-circle .sk-circle {
    width:100%;
    height:100%;
    position:absolute;
    left:0;
    top:0
}
.sk-spinner-fading-circle .sk-circle:before {
    content:'';
    display:block;
    margin:0 auto;
    width:18%;
    height:18%;
    background-color:#1ab394;
    border-radius:100%;
    -webkit-animation:sk-circleFadeDelay 1.2s infinite ease-in-out;
    animation:sk-circleFadeDelay 1.2s infinite ease-in-out;
    -webkit-animation-fill-mode:both;
    animation-fill-mode:both
}
.sk-spinner-fading-circle .sk-circle2 {
    -webkit-transform:rotate(30deg);
    -ms-transform:rotate(30deg);
    transform:rotate(30deg)
}
.sk-spinner-fading-circle .sk-circle3 {
    -webkit-transform:rotate(60deg);
    -ms-transform:rotate(60deg);
    transform:rotate(60deg)
}
.sk-spinner-fading-circle .sk-circle4 {
    -webkit-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    transform:rotate(90deg)
}
.sk-spinner-fading-circle .sk-circle5 {
    -webkit-transform:rotate(120deg);
    -ms-transform:rotate(120deg);
    transform:rotate(120deg)
}
.sk-spinner-fading-circle .sk-circle6 {
    -webkit-transform:rotate(150deg);
    -ms-transform:rotate(150deg);
    transform:rotate(150deg)
}
.sk-spinner-fading-circle .sk-circle7 {
    -webkit-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
    transform:rotate(180deg)
}
.sk-spinner-fading-circle .sk-circle8 {
    -webkit-transform:rotate(210deg);
    -ms-transform:rotate(210deg);
    transform:rotate(210deg)
}
.sk-spinner-fading-circle .sk-circle9 {
    -webkit-transform:rotate(240deg);
    -ms-transform:rotate(240deg);
    transform:rotate(240deg)
}
.sk-spinner-fading-circle .sk-circle10 {
    -webkit-transform:rotate(270deg);
    -ms-transform:rotate(270deg);
    transform:rotate(270deg)
}
.sk-spinner-fading-circle .sk-circle11 {
    -webkit-transform:rotate(300deg);
    -ms-transform:rotate(300deg);
    transform:rotate(300deg)
}
.sk-spinner-fading-circle .sk-circle12 {
    -webkit-transform:rotate(330deg);
    -ms-transform:rotate(330deg);
    transform:rotate(330deg)
}
.sk-spinner-fading-circle .sk-circle2:before {
    -webkit-animation-delay:-1.1s;
    animation-delay:-1.1s
}
.sk-spinner-fading-circle .sk-circle3:before {
    -webkit-animation-delay:-1s;
    animation-delay:-1s
}
.sk-spinner-fading-circle .sk-circle4:before {
    -webkit-animation-delay:-.9s;
    animation-delay:-.9s
}
.sk-spinner-fading-circle .sk-circle5:before {
    -webkit-animation-delay:-.8s;
    animation-delay:-.8s
}
.sk-spinner-fading-circle .sk-circle6:before {
    -webkit-animation-delay:-.7s;
    animation-delay:-.7s
}
.sk-spinner-fading-circle .sk-circle7:before {
    -webkit-animation-delay:-.6s;
    animation-delay:-.6s
}
.sk-spinner-fading-circle .sk-circle8:before {
    -webkit-animation-delay:-.5s;
    animation-delay:-.5s
}
.sk-spinner-fading-circle .sk-circle9:before {
    -webkit-animation-delay:-.4s;
    animation-delay:-.4s
}
.sk-spinner-fading-circle .sk-circle10:before {
    -webkit-animation-delay:-.3s;
    animation-delay:-.3s
}
.sk-spinner-fading-circle .sk-circle11:before {
    -webkit-animation-delay:-.2s;
    animation-delay:-.2s
}
.sk-spinner-fading-circle .sk-circle12:before {
    -webkit-animation-delay:-.1s;
    animation-delay:-.1s
}
@-webkit-keyframes sk-circleFadeDelay {
    0%,100%,39% {
    opacity:0
}
40% {
    opacity:1
}
}@keyframes sk-circleFadeDelay {
    0%,100%,39% {
    opacity:0
}
40% {
    opacity:1
}
}body.rtls #page-wrapper {
    margin:0 220px 0 0
}
body.rtls .nav-second-level li a {
    padding:7px 35px 7px 10px
}
body.rtls .ibox-title h5 {
    float:right
}
body.rtls .pull-right {
    float:left!important
}
body.rtls .pull-left {
    float:right!important
}
body.rtls .ibox-tools,body.rtls .stat-percent {
    float:left
}
body.rtls .navbar-right {
    float:left!important
}
body.rtls .navbar-top-links li:last-child {
    margin-right:0
}
body.rtls .minimalize-styl-2 {
    float:right;
    margin:14px 20px 5px 5px
}
body.rtls .feed-element>.pull-left {
    margin-left:10px;
    margin-right:0
}
body.rtls .timeline-item .date {
    text-align:left
}
body.rtls .timeline-item .date i {
    left:0;
    right:auto
}
body.rtls .timeline-item .content {
    border-right:1px solid #e7eaec;
    border-left:none
}
body.rtls .toast-close-button {
    float:left
}
body.rtls #toast-container>.toast:before {
    margin:auto -1.5em auto .5em
}
body.rtls #toast-container>div {
    padding:15px 50px 15px 15px
}
body.rtls .center-orientation .vertical-timeline-icon i {
    margin-left:0;
    margin-right:-12px
}
body.rtls .vertical-timeline-icon i {
    right:50%;
    left:auto;
    margin-left:auto;
    margin-right:-12px
}
body.rtls .file-box,body.rtls ul.notes li {
    float:right
}
body.rtls .chat-statistic,body.rtls .chat-users {
    margin-right:-30px;
    margin-left:auto
}
body.rtls .dropdown-menu>li>a {
    text-align:right
}
body.rtls .b-r {
    border-left:1px solid #e7eaec;
    border-right:none
}
body.rtls .dd-list .dd-list {
    padding-right:30px;
    padding-left:0
}
body.rtls .dd-item>button {
    float:right
}
body.rtls .skin-setttings {
    margin-right:40px;
    margin-left:0;
    direction:ltr
}
body.rtls .footer.fixed {
    margin-right:220px;
    margin-left:0
}
@media (max-width:992px) {
    body.rtls .chat-statistic,body.rtls .chat-users {
        margin-right:0
    }
}
body.body-small.mini-navbar .footer.fixed,body.rtls.mini-navbar .footer.fixed {
    margin:0 70px 0 0
}
body.body-small.mini-navbar .footer.fixed,body.rtls.mini-navbar.fixed-sidebar .footer.fixed {
    margin:0
}
body.rtls.top-navigation .navbar-toggle {
    float:right;
    margin-left:15px;
    margin-right:15px
}
.body-small.rtls.top-navigation .navbar-header {
    float:none
}
body.rtls.top-navigation #page-wrapper {
    margin:0
}
body.rtls.mini-navbar #page-wrapper {
    margin:0 70px 0 0
}
body.rtls.mini-navbar.fixed-sidebar #page-wrapper {
    margin:0
}
body.rtls.body-small.fixed-sidebar.mini-navbar #page-wrapper {
    margin:0 220px 0 0
}
body.rtls.body-small.fixed-sidebar.mini-navbar .navbar-static-side {
    width:220px
}
.body-small.rtls .navbar-fixed-top {
    margin-right:0
}
.body-small.rtls .navbar-header {
    float:right
}
body.rtls .navbar-top-links li:last-child {
    margin-left:20px
}
body.rtls .top-navigation #page-wrapper,body.rtls .top-navigation .footer.fixed,body.rtls.mini-navbar .top-navigation #page-wrapper,body.rtls.mini-navbar.top-navigation #page-wrapper,body.rtls.top-navigation .footer.fixed {
    margin:0
}
@media (max-width:768px) {
    body.rtls .navbar-top-links li:last-child {
        margin-left:20px
    }
    .body-small.rtls #page-wrapper {
        position:inherit;
        margin:0;
        min-height:1000px
    }
    .body-small.rtls .navbar-static-side {
        display:none;
        z-index:2001;
        position:absolute;
        width:70px
    }
    .body-small.rtls.mini-navbar .navbar-static-side {
        display:block
    }
    .rtls.fixed-sidebar.body-small .navbar-static-side {
        display:none;
        z-index:2001;
        position:fixed;
        width:220px
    }
    .rtls.fixed-sidebar.body-small.mini-navbar .navbar-static-side {
        display:block
    }
}
.rtls .ltr-support {
    direction:ltr
}
.skin-setttings .title {
    background:#efefef;
    text-align:center;
    text-transform:uppercase;
    font-weight:600;
    display:block;
    padding:10px 15px;
    font-size:12px
}
.setings-item {
    padding:10px 30px
}
.setings-item.nb {
    border:none
}
.setings-item.skin {
    text-align:center
}
.setings-item .switch {
    float:right
}
.skin-name a {
    text-transform:uppercase
}
.setings-item a {
    color:#fff
}
.blue-skin,.default-skin,.ultra-skin,.yellow-skin {
    text-align:center
}
.default-skin {
    font-weight:600;
    background:#1ab394
}
.default-skin:hover {
    background:#199d82
}
.blue-skin {
    font-weight:600;
    background:url(patterns/header-profile-skin-1.png) repeat scroll 0 0
}
.blue-skin:hover {
    background:#0d8ddb
}
.yellow-skin {
    font-weight:600;
    background:url(patterns/header-profile-skin-3.png) repeat scroll 0 100%
}
.yellow-skin:hover {
    background:#ce8735
}
.content-tabs {
    border-bottom:solid 2px #2f4050
}
.page-tabs a {
    color:#999
}
.page-tabs a i {
    color:#ccc
}
.page-tabs a.active {
    background:#2f4050;
    color:#a7b1c2
}
.page-tabs a.active i:hover,.page-tabs a.active:hover {
    background:#293846;
    color:#fff
}
.skin-1 .minimalize-styl-2 {
    margin:14px 5px 5px 30px
}
.skin-1 .navbar-top-links li:last-child {
    margin-right:30px
}
.skin-1.fixed-nav .minimalize-styl-2 {
    margin:14px 5px 5px 15px
}
.skin-1 .spin-icon {
    background:#0e9aef!important
}
.skin-1 .nav-header {
    background:#0e9aef;
    background:url(patterns/header-profile-skin-1.png)
}
.skin-1.mini-navbar .nav-second-level {
    background:#3e495f
}
.skin-1 .breadcrumb {
    background:0 0
}
.skin-1 .page-heading {
    border:none
}
.skin-1 .nav>li.active {
    background:#3a4459
}
.skin-1 .nav>li>a {
    color:#9ea6b9
}
.skin-1 .nav>li.active>a {
    color:#fff
}
.skin-1 .navbar-minimalize {
    background:#0e9aef;
    border-color:#0e9aef
}
body.skin-1 {
    background:#3e495f
}
.skin-1 .navbar-static-top {
    background:#fff
}
.skin-1 .dashboard-header {
    background:0 0;
    border-bottom:none!important;
    border-top:none;
    padding:20px 30px 10px
}
.fixed-nav.skin-1 .navbar-fixed-top {
    background:#fff
}
.skin-1 .wrapper-content {
    padding:30px 15px
}
.skin-1 #page-wrapper {
    background:#f4f6fa
}
.skin-1 .ibox-content,.skin-1 .ibox-title {
    border-width:1px
}
.skin-1 .ibox-content:last-child {
    border-style:solid
}
.skin-1 .nav>li.active {
    border:none
}
.skin-1 .nav-header {
    padding:35px 25px 25px
}
.skin-1 .nav-header a.dropdown-toggle {
    color:#fff;
    margin-top:10px
}
.skin-1 .nav-header a.dropdown-toggle .text-muted {
    color:#fff;
    opacity:.8
}
.skin-1 .profile-element {
    text-align:center
}
.skin-1 .img-circle {
    border-radius:5px
}
.skin-1 .navbar-default .nav>li>a:focus,.skin-1 .navbar-default .nav>li>a:hover {
    background:#39aef5;
    color:#fff
}
.skin-1 .nav.nav-tabs>li.active>a {
    color:#555
}
.skin-1 .content-tabs {
    border-bottom:solid 2px #39aef5
}
.skin-1 .nav.nav-tabs>li.active {
    background:0 0
}
.skin-1 .page-tabs a.active {
    background:#39aef5;
    color:#fff
}
.skin-1 .page-tabs a.active i:hover,.skin-1 .page-tabs a.active:hover {
    background:#0e9aef;
    color:#fff
}
.skin-3 .minimalize-styl-2 {
    margin:14px 5px 5px 30px
}
.skin-3 .navbar-top-links li:last-child {
    margin-right:30px
}
.skin-3.fixed-nav .minimalize-styl-2 {
    margin:14px 5px 5px 15px
}
.skin-3 .spin-icon {
    background:#ecba52!important
}
body.boxed-layout.skin-3 #wrapper {
    background:#3e2c42
}
.skin-3 .nav-header {
    background:#ecba52;
    background:url(patterns/header-profile-skin-3.png)
}
.skin-3.mini-navbar .nav-second-level {
    background:#3e2c42
}
.skin-3 .breadcrumb {
    background:0 0
}
.skin-3 .page-heading {
    border:none
}
.skin-3 .nav>li.active {
    background:#38283c
}
.fixed-nav.skin-3 .navbar-fixed-top {
    background:#fff
}
.skin-3 .nav>li>a {
    color:#948b96
}
.skin-3 .nav>li.active>a {
    color:#fff
}
.skin-3 .navbar-minimalize {
    background:#ecba52;
    border-color:#ecba52
}
body.skin-3 {
    background:#3e2c42
}
.skin-3 .navbar-static-top {
    background:#fff
}
.skin-3 .dashboard-header {
    background:0 0;
    border-bottom:none!important;
    border-top:none;
    padding:20px 30px 10px
}
.skin-3 .wrapper-content {
    padding:30px 15px
}
.skin-3 #page-wrapper {
    background:#f4f6fa
}
.skin-3 .ibox-content,.skin-3 .ibox-title {
    border-width:1px
}
.skin-3 .ibox-content:last-child {
    border-style:solid
}
.skin-3 .nav>li.active {
    border:none
}
.skin-3 .nav-header {
    padding:35px 25px 25px
}
.skin-3 .nav-header a.dropdown-toggle {
    color:#fff;
    margin-top:10px
}
.skin-3 .nav-header a.dropdown-toggle .text-muted {
    color:#fff;
    opacity:.8
}
.skin-3 .profile-element {
    text-align:center
}
.skin-3 .img-circle {
    border-radius:5px
}
.skin-3 .navbar-default .nav>li>a:focus,.skin-3 .navbar-default .nav>li>a:hover {
    background:#38283c;
    color:#fff
}
.skin-3 .nav.nav-tabs>li.active>a {
    color:#555
}
.skin-3 .content-tabs {
    border-bottom:solid 2px #3e2c42
}
.skin-3 .nav.nav-tabs>li.active {
    background:0 0
}
.skin-3 .page-tabs a.active {
    background:#3e2c42;
    color:#fff
}
.skin-3 .page-tabs a.active i:hover,.skin-3 .page-tabs a.active:hover {
    background:#38283c;
    color:#fff
}
@media (min-width:768px) {
    .navbar-top-links .dropdown-alerts,.navbar-top-links .dropdown-messages,.navbar-top-links .dropdown-tasks {
        margin-left:auto
    }
}
@media (max-width:768px) {
    body.fixed-sidebar .navbar-static-side {
        display:none
    }
    body.fixed-sidebar.mini-navbar .navbar-static-side {
        width:70px
    }
    .lock-word,.navbar-form-custom {
        display:none
    }
    .navbar-header {
        display:inline;
        float:left
    }
    .sidebard-panel {
        z-index:2;
        position:relative;
        width:auto;
        min-height:100%!important
    }
    .sidebar-content .wrapper {
        padding-right:0;
        z-index:1
    }
    .fixed-sidebar.body-small .navbar-static-side {
        display:none;
        z-index:2001;
        position:fixed;
        width:220px
    }
    .fixed-sidebar.body-small.mini-navbar .navbar-static-side {
        display:block
    }
    .ibox-tools {
        float:none;
        text-align:right;
        display:block
    }
    .content-tabs {
        display:none
    }
    #content-main {
        height:calc(100% - 100px)
    }
    .fixed-nav #content-main {
        height:calc(100% - 38px)
    }
}
.navbar-static-side {
    background:#F5F5FA;
    border-right: 1px solid #d7dce6;
}
.nav-close {
    padding:10px;
    position:absolute;
    right:5px;
    top:5px;
    font-size:1.4em;
    cursor:pointer;
    z-index:10;
    display:none;
    color:rgba(255,255,255,.3)
}
@media (max-width:350px) {
    body.fixed-sidebar.mini-navbar .navbar-static-side {
        width:0
    }
    .nav-close {
        display:block
    }
    #page-wrapper {
        margin-left:0!important
    }
    .timeline-item .date {
        text-align:left;
        width:110px;
        position:relative;
        padding-top:30px
    }
    .timeline-item .date i {
        position:absolute;
        top:0;
        left:15px;
        padding:5px;
        width:30px;
        text-align:center;
        border:1px solid #e7eaec;
        background:#f8f8f8
    }
    .timeline-item .content {
        border-left:none;
        border-top:1px solid #e7eaec;
        padding-top:10px;
        min-height:100px
    }
    .nav.navbar-top-links li.dropdown {
        display:none
    }
    .ibox-tools {
        float:none;
        text-align:left;
        display:inline-block
    }
}
.ui-jqgrid-titlebar {
    height:40px;
    line-height:24px;
    color:#676a6c;
    background-color:#F9F9F9;
    text-shadow:0 1px 0 rgba(255,255,255,.5)
}
.ui-jqgrid .ui-jqgrid-title {
    float:left;
    margin-left:5px;
    font-weight:700
}
.ui-jqgrid .ui-jqgrid-titlebar {
    position:relative;
    border-left:0 solid;
    border-right:0 solid;
    border-top:0 solid
}
.social-feed-separated .social-feed-box {
    margin-left:62px
}
.social-feed-separated .social-avatar {
    float:left;
    padding:0
}
.social-feed-separated .social-avatar img {
    width:52px;
    height:52px;
    border:1px solid #e7eaec
}
.social-feed-separated .social-feed-box .social-avatar {
    padding:15px 15px 0;
    float:none
}
.social-feed-box {
    border:1px solid #e7eaec;
    background:#fff;
    margin-bottom:15px
}
.article .social-feed-box {
    margin-bottom:0;
    border-bottom:none
}
.article .social-feed-box:last-child {
    margin-bottom:0;
    border-bottom:1px solid #e7eaec
}
.article .social-feed-box p {
    font-size:13px;
    line-height:18px
}
.social-action {
    margin:15px
}
.social-avatar {
    padding:15px 15px 0
}
.social-comment .social-comment {
    margin-left:45px
}
.social-avatar img {
    height:40px;
    width:40px;
    margin-right:10px
}
.social-avatar .media-body a {
    font-size:14px;
    display:block
}
.social-body {
    padding:15px
}
.social-body img {
    margin-bottom:10px
}
.social-footer {
    border-top:1px solid #e7eaec;
    padding:10px 15px;
    background:#f9f9f9
}
.social-footer .social-comment img {
    width:32px;
    margin-right:10px
}
.social-comment:first-child {
    margin-top:0
}
.social-comment {
    margin-top:15px
}
.social-comment textarea {
    font-size:12px
}
.checkbox input[type=checkbox],.checkbox-inline input[type=checkbox],.radio input[type=radio],.radio-inline input[type=radio] {
    margin-top:-4px
}
@media (max-width:1000px) {
    .welcome-message {
        display:none
    }
}
.echarts {
    height:240px
}
.checkbox-inline,.checkbox-inline+.checkbox-inline,.radio-inline,.radio-inline+.radio-inline {
    margin:0 15px 0 0
}
.navbar-toggle {
    background-color:#fff
}
.J_menuTab {
    -webkit-transition:all .3s ease-out 0s;
    transition:all .3s ease-out 0s
}
::-webkit-scrollbar-track {
    background-color:#F5F5F5
}
::-webkit-scrollbar {
    width:6px;
    background-color:#F5F5F5
}
::-webkit-scrollbar-thumb {
    background-color:#999
}
.gohome {
    position:fixed;
    top:20px;
    right:20px;
    z-index:100
}
.gohome a {
    height:38px;
    width:38px;
    display:block;
    background:#2f4050;
    padding:9px 8px;
    text-align:center;
    color:#fff;
    border-radius:50%;
    opacity:.5
}
.gohome a:hover {
    opacity:1
}
@media only screen and (-webkit-min-device-pixel-ratio:2) {
    #content-main {
        -webkit-overflow-scrolling:touch;
    }
}
.navbar-header {
    width:60%;
    height: 50px;
    line-height: 50px;
    margin-left: 15px;
    font-size: 16px;
    color: #333;
    font-weight: bold;
}
.bs-glyphicons {
    margin:0 -10px 20px;
    overflow:hidden
}
.bs-glyphicons-list {
    padding-left:0;
    list-style:none
}
.bs-glyphicons li {
    float:left;
    width:25%;
    height:115px;
    padding:10px;
    font-size:10px;
    line-height:1.4;
    text-align:center;
    background-color:#f9f9f9;
    border:1px solid #fff
}
.bs-glyphicons .glyphicon {
    margin-top:5px;
    margin-bottom:10px;
    font-size:24px
}
.bs-glyphicons .glyphicon-class {
    display:block;
    text-align:center;
    word-wrap:break-word
}
.bs-glyphicons li:hover {
    color:#fff;
    background-color:#1ab394
}
@media (min-width:768px) {
    .bs-glyphicons {
        margin-right:0;
        margin-left:0
    }
    .bs-glyphicons li {
        width:12.5%;
        font-size:12px
    }
}
.nav li.n-tab{
    border-top:none;
    font-weight: normal;
    margin: 0 15px;
}
.nav li.n-tab a{
    color: #333;
    font-size: 14px;
    border-bottom-width: 2px;
    padding: 10px 0;
}
.nav li.n-tab:hover a,
.nav li.n-tab.active a{
    background-color: #fff;
    color: #12b7f5;
    border-bottom: 2px solid #12b7f5;
}
.overflow-h{
    overflow: hidden;
}
label{
    font-weight: normal;
    font-size: 14px;
    color: #333;
}
input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
    cursor: pointer;
    position: relative;
    margin: 4px;
}
.icon-checkbox[type=radio]:before{
    content: '';
    background-image:url(../img/dianxuan_btn.png);
    background-size: 14px 14px;
    position: absolute;
    top:0px;
    left:0px;
    height: 14px;
    width: 14px;
    -webkit-font-smoothing: antialiased;
}
.icon-checkbox[type=radio]:checked:before {
    content: '';
    background-image:url(../img/dianxuan_pre.png);
}
.icon-checkbox[type=checkbox]:before{
    content: '';
    background-image:url(../img/gouxuan_btn.png);
    background-size: 14px 14px;
    position: absolute;
    top:0px;
    left:0px;
    height: 14px;
    width: 14px;
    -webkit-font-smoothing: antialiased;
}
.icon-checkbox[type=checkbox]:checked:before {
    content: '';
    background-image:url(../img/gouxuan_pre.png);
}
/* spacing
-----------------------------------------------------------------------------*/
.mt0 { margin-top: 0; }
.mb0 { margin-bottom: 0; }
.mt5 {margin-top:5px;}.mt10 {margin-top:10px;}.mt15 {margin-top:15px;}.mt20 {margin-top:20px;}.mt30 {margin-top:30px;}.mt50 {margin-top:50px;}.mt100 {margin-top:100px;}
.mb5 {margin-bottom:5px;}.mb10 {margin-bottom:10px;}.mb15 {margin-bottom:15px;}.mb20 {margin-bottom:20px;}.mb30 {margin-bottom:30px;}.mb50 {margin-bottom:50px;}.mb100 {margin-bottom:100px;}
.ml5 {margin-left:5px;}.ml10 {margin-left:10px;}.ml15 {margin-left:15px;}.ml20 {margin-left:20px;}.ml30 {margin-left:30px;}.ml50 {margin-left:50px;}.ml100 {margin-left:100px;}
.mr5 {margin-right:5px;}.mr10 {margin-right:10px;}.mr15 {margin-right:15px;}.mr20 {margin-right:20px;}.mr30 {margin-right:30px;}.mr50 {margin-right:50px;}.mr100 {margin-right:100px;}
.mlr5 {margin-left:5px; margin-right:5px;}.mlr10 {margin-left:10px; margin-right:10px;}.mlr15 {margin-left:15px; margin-right:15px;}.mlr20 {margin-left:20px; margin-right:20px;}
.mlr30 {margin-left:30px; margin-right:30px;}.mlr50 {margin-left:50px; margin-right:50px;}.mlr100 {margin-left:100px; margin-right:100px;}
.mtb5 {margin-top:5px; margin-bottom:5px;}.mtb10 {margin-top:10px; margin-bottom:10px;}.mtb15 {margin-top:15px; margin-bottom:15px;}.mtb20 {margin-top:20px; margin-bottom:20px;}
.mtb30 {margin-top:30px; margin-bottom:30px;}.mtb50 {margin-top:50px; margin-bottom:50px;}.mtb100 {margin-top:100px; margin-bottom:100px;}
.pt7 {padding-top:7px;}.pt5 {padding-top:5px;}.pt10 {padding-top:10px;}.pt15 {padding-top:15px;}.pt20 {padding-top:20px;}.pt30 {padding-top:30px;}.pt50 {padding-top:50px;}.pt100 {padding-top:100px;}
.pb5 {padding-bottom:5px;}.pb10 {padding-bottom:10px;}.pb15 {padding-bottom:15px;}.pb20 {padding-bottom:20px;}.pb30 {padding-bottom:30px;}.pb50 {padding-bottom:50px;}.pb100 {padding-bottom:100px;}
.pl5 {padding-left:5px;}.pl10 {padding-left:10px;}.pl15 {padding-left:15px;}.pl20 {padding-left:20px;}.pl30 {padding-left:30px;}.pl50 {padding-left:50px;}.pl100 {padding-left:100px;}
.pr5 {padding-right:5px;}.pr10 {padding-right:10px;}.pr15 {padding-right:15px;}.pr20 {padding-right:20px;}.pr30 {padding-right:30px;}.pr50 {padding-right:50px;}.pr100 {padding-right:100px;}
.ptb5 {padding-top:5px; padding-bottom:5px;}.ptb10 {padding-top:10px; padding-bottom:10px;}.ptb15 {padding-top:15px; padding-bottom:15px;}.ptb20 {padding-top:20px; padding-bottom:20px;}
.ptb30 {padding-top:30px; padding-bottom:30px;}.ptb50 {padding-top:50px; padding-bottom:50px;}.ptb100 {padding-top:100px; padding-bottom:100px;}
.plr0{padding-left: 0px; padding-right: 0px;}
.plr5 {padding-left:5px; padding-right:5px;}.plr10 {padding-left:10px; padding-right:10px;}.plr15 {padding-left:15px; padding-right:15px;}.plr20 {padding-left:20px; padding-right:20px;}
.plr30 {padding-left:30px; padding-right:30px;}.plr50 {padding-left:50px; padding-right:50px;}.plr100 {padding-left:100px; padding-right:100px;}
.c-f16 { font-size: 16px; }
.c-f14 { font-size: 14px; } 
.c-wp100 { width: 100% }
.c-w80 { width: 80px; }
.c-w100 { width: 100px; }
.c-w120 { width: 120px; }
.c-w140 { width: 140px; }
.c-w200 { width: 200px; }
.c-w270 { width: 270px; }
.c-h100 { height: 100px; }
.c-fff { color: #fff; }
.c-12b7f5 { color: #12b7f5; }
.c-f96565 { color: #f96565; }
.bc-12b7f5 { background-color: #12b7f5; }
.bc-f5f5fa { background-color: #f5f5fa; }
.pr { position: relative; }
.clearfix:after {visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0;}
.clearfix {zoom:1;}
.fl,.fr {display:inline;}
.fl {float:left;}
.fr {float:right;}
.c-display-ib { display: inline-block; }
.c-vam { vertical-align: middle; }
.c-vat { vertical-align: top; }
.c-tac { text-align: center; }
.c-b-r5 { border-radius: 5px; }
.c-b-r10 { border-radius: 10px; }
.c-b-r20 { border-radius: 20px; }
.c-b-c12b7f5 { border-color: #12b7f5; }
.c-border { border: 1px solid; }
thead th{
    color: #999;
}
.btn.focus, .btn:focus, .btn:hover{
    color: #fff;
    border: none;
}
a.c-12b7f5:hover{
    color: #12b7f5;
}
a.disabled,
a.disabled:hover{
    color: #83d6f4;
}
/* css3-Grid
-----------------------------------------------------------------------------*/
.ui-grid { display: -webkit-box; display: box; }
.ui-grid-middle { -webkit-box-pack: center; -webkit-box-align: center; box-pack: center; box-align: center; }
.ui-grid-vertical { -webkit-box-orient: vertical; box-orient: vertical; }
.ui-grid-label { -webkit-box-flex: 0; box-flex: 0; width: 100px; font-weight: 600; }
.ui-col-0 { -webkit-box-flex: 0; box-flex: 0; }
.ui-col-1 { -webkit-box-flex: 1; box-flex: 1; }
.ui-col-2 { -webkit-box-flex: 2; box-flex: 2; }
.ui-col-3 { -webkit-box-flex: 3; box-flex: 3; }
.ui-col-4 { -webkit-box-flex: 4; box-flex: 3; }
.ui-col-5 { -webkit-box-flex: 5; box-flex: 5; }
.ui-col-6 { -webkit-box-flex: 6; box-flex: 6; }

app/consulting/html/consulting.html

@@ -0,0 +1,126 @@
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <title>指导留言</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link rel="shortcut icon" href="favicon.ico">
    <link href="../../../css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="../../../css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
    <link href="../../../css/animate.min.css" rel="stylesheet">
    <link href="../../../plugins/toastr/toastr.min.css" rel="stylesheet">
    <link href="../../../plugins/fancybox/jquery.fancybox.css" rel="stylesheet">
    <link href="../../../plugins/artDialog/6.0.5/api/css/ui-dialog.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../../../plugins/layer/skin/layer.css"/>
    <link href="../css/style.css" rel="stylesheet">
    <link rel="stylesheet" href="../css/consulting.css">
    <link rel="stylesheet" href="../../../plugins/plyr/plyr.css">
</head>
<body>
	<div id="main">
		<div class="div-main-content">
			<div class="consulting-panel ui-grid border-bottom">
		        <div class="ui-col-3 border-right">
		            <div class="div-message-content">
		                <div class="plr20" id="talkBox"></div>
		            </div>
		        </div>
		    </div>
		    <div class="input-panel">
		        <div class="action-panel">
		            <span class="consult-icon icon-image" @click="file_head.click()"></span>
		            <input type="file" class="hidden" id="file_head" accept="image/*">
		        </div>
		        <div id="input_content" type="text" class="input-msg width-100" ></div>
		        <button class="btn send-btn" type="button" @click="sendClick"><i class="fa fa-send mr5"></i>发送</button>
		    </div>
	   </div>
	</div>
    
    <!-- 系统消息模板 -->
    <script type="text/html" id="sys_msg_tmp">
        <div class="time-tips"><span class="xt-xiaoxi">{{content}}</span></div>
    </script>
    <!-- 消息模板 -->
    <script type="text/html" id="msg_tmp">
        <div class="time-tips"><i class="zuoxianduan-icon"></i><span>{{time}}</span><i class="youxianduan-icon"></i></div>
        <dl class="{{if isSelf}}chat-right{{else}}chat-left{{/if}} {{if type==17}}mb10-i{{/if}}">
            <dt style="height: auto; text-align: center;">
                <img src="{{img}}" class="images-cycle"/>
            </dt>
            <div class="c-content">
                <span class="c-f12 name">{{name}}</span>
            {{if type == 0 || type == 1 || type == 8 || type == 18 || type == 19 }}
            <dd class="word-bread">
                <span>{{content}}</span>
            </dd>
            {{/if}}
            {{if type == 2}}
            <dd class="word-bread wb-img">
                <a class="fancybox" href="{{content | getSourceUrl}}" title="图片">
                    <img width="100" src="{{content | getSourceUrl}}" />
                </a>
            </dd>
            {{/if}}
            {{if type == 3}}
            <dd class="word-bread">
                <div class="player" style="width:292px;">
                    <audio controls>
                        <!-- Audio files -->
                        <source src="{{content.path | getSourceUrl}}" type="audio/mp3">
                        <!-- Fallback for browsers that don't support the <audio> element -->
                        您的浏览器不支持在线播放，请<a href="{{content.path | getSourceUrl}}">下载</a>
                    </audio>
                </div>
            </dd>
            {{/if}}
            {{if type == 12}}
            <dd class="word-bread">
                <div class="player" style="width:292px;">
                    <video poster="{{content.img | getSourceUrl}}" controls crossorigin>
                        <!-- Video files -->
                        <source src="{{content.path | getSourceUrl}}" type="video/mp4">
                        <!-- Text track file -->
                        <!-- <track kind="captions" label="English" srclang="en" src="https://cdn.selz.com/plyr/1.0/example_captions_en.vtt" default> -->
                        <!-- Fallback for browsers that don't support the <video> element -->
                        <a href="{{content.path | getSourceUrl}}">Download</a>
                    </video>
                </div>
            </dd>
            {{/if}}
        </div>
        </dl>
    </script>
</body>
	<script>
	    (function(d,u){var a=new XMLHttpRequest(),b=d.body;if("withCredentials" in a){a.open("GET",u,true);a.send();a.onload=function(){var c=d.createElement("div");c.setAttribute("hidden","");c.innerHTML=a.responseText;b.insertBefore(c,b.childNodes[0])}}})(document, "../../../plugins/plyr/sprite.svg");
	</script>
	<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../../js/jquery-2.2.4.js?v=2.2.4"></script>
	<script src="../../../js/bootstrap.min.js?v=3.0.0"></script>
	<script src="../../../plugins/metisMenu/jquery.metisMenu.js"></script>
	<script src="../../../plugins/slimscroll/jquery.slimscroll.js"></script>
	<script src="../../../plugins/layer/layer.min.js"></script>
	<script src="../../../js/hplus.min.js?v=4.1.0"></script>
	<script src="../../../js/contabs.min.js"></script>
	<!--<script src="../../../plugins/pace/pace.min.js"></script>-->
	<script src="../../../plugins/toastr/toastr.min.js"></script>
	<script src="../../../js/es6-promise.js"></script>
	<script src="../../../js/underscore.js"></script>
	<script src="../../../js/util.js"></script>
	<script src="../../../js/template.js"></script>
	<script src="../../../plugins/fancybox/jquery.fancybox.js"></script>
	<script src="../../../plugins/plyr/plyr.js"></script>
	<script src="../../../plugins/artDialog/6.0.5/api/js/dialog-plus.js"></script>
	<script src="../../../api/http-request.js"></script>
	<script src="../../../api/consulting-api.js"></script>
	<script src="../js/consulting.js"></script>
</html>

app/consulting/js/consulting.js

@@ -0,0 +1,310 @@
var Request = GetRequest()
new Vue({
  el: '#main',
  data: {
  		sessionId:null,
		sessionType:2,//1对1会话
		curDoctorCode:JSON.parse(window.localStorage.getItem('wlyyAgent')).uid,
		curDoctorName:"",
		otherCode: Request["otherCode"],//对方医生code
		otherName: decodeURIComponent(Request["otherName"]) || "",//对方医生姓名
		planDetailId:Request["planDetailId"],//项目id
		members:[],
		otherInfo:null,//对方的医生信息
		firstMsg:null,
		page:1,
		pagesize:10,
		count:0
	},
	mounted: function() {
		this.createSession();
		this.bindEvents();
	},
	methods:{
		createSession:function(){
			var vm = this;
			var p = {}
			p[vm.curDoctorCode] = 0;
			p[vm.otherCode] = 0;
			var data = {
				session_type: vm.sessionType, session_name: vm.otherName, participants: JSON.stringify(p) 
			}
			consultingAPI.createSession(data).then(function(res){
				if(res.status==200){
					vm.sessionId = res.data.id;
					vm.connectSocket();//创建socket连接
					vm.getMembers();//获取成员列表
				}else{
					layer.msg(res.msg, {icon: 5})
				}
			});
		},
		getMembers:function(){
			var vm = this;
			consultingAPI.getParticipants(vm.sessionId).then(function(rs){
				var members = {};
				var isSTF=false;//是否是专科对家医聊天，需要隐藏发送名片入口
				$.each( rs , function(i, v) {
					if(v.level==1) isSTF=true;
					if(v.id!=vm.curDoctorCode){
						vm.otherInfo = v;
						vm.otherCode = v.id;
					}else {
						vm.curDoctorName = v.name;
					}
					vm.members.push({
						id:v.id,
						code: v.id,
						name: v.name,
						sex: v.sex,
						avatar: v.avatar,
						role: v.role,
        		is_patient: v.is_patient,//0 医生，1 患者
        		last_fetch_time:v.last_fetch_time
					});
				});
				
				//获取消息
				vm.getMessage(true);
			});
		},
		getMessage:function(isInit){
			var vm = this;
			var params = {
		        page: vm.page,
		        pagesize: vm.pagesize,
		        end_msg_id: '',
		        start_msg_id: '',
		        user: vm.curDoctorCode,
		        session_id: vm.sessionId,
		        content_type: '',
		        isoffset: ''
		    }
		    consultingAPI.getMessages(params).then(function(res){
		        var list = res;
		        if (list && list.length > 0) {
		            id = list[list.length - 1].id;
		            var html = '',
		                length = list.length;
		            
		            for (var j = list.length-1; j >= 0; j--) {
		                var reply = list[j];
		                html += vm.formatMsg(reply);
		            }
		            if(isInit){
		                $("#talkBox").append(html);
		                $("#talkBox").slimScroll({
		                    height: '100%',
		                    width: '100%',
		                    alwaysVisible: true,
		                    start : 'bottom',
		                }).bind('slimscroll', function(e, pos) {
		                    if(pos == 'top'){
		                        if(length == 10){
		                            vm.page++;
		                            vm.getMessage();
		                        }
		                    }
		                });
		            }else{
		                $("#talkBox").prepend(html);
		                $("#talkBox").slimScroll({
		                    scrollTo: 'bottom'
		                });
		            }
		            
		            $(".fancybox").fancybox({openEffect:"none",closeEffect:"none"});
		            plyr.setup();
		        }
		    });
		},
		bindEvents:function(){
			var vm = this;
			
			template.helper('getSourceUrl', function(str){
		        return httpRequest.getImgUrl(str);
		    });
		    
		    //发送图片
		    $("#file_head").on('change', function(){
		        var file = this.files[0];
		        //先上传图片去服务器，然后再发送消息
		        var fd=new FormData();
		        fd.append("action", "UploadVMKImagePath");  
		        fd.append("file", file); //加入文件对象
		        fd.append("type", '2');
		        var ajaxObj = {
		            data: fd,
		            cache: false,
		            processData: false,
		            contentType: false 
		        }
		        consultingAPI.uploadImage(ajaxObj).then(function(res){
		            if(res.status == 200){
		                vm.sendMessage(2, res.urls);
		                var obj = {
		                    content: res.urls,
		                    content_type: '2',
		                    sender_id: vm.curDoctorCode,
		                    timestamp: new Date().getTime()
		                }
		                var html = vm.formatMsg(obj);
		                
		                $("#talkBox").append(html);
		                $("#talkBox").slimscroll({
		                    scrollTo: 'bottom'
		                });
		            }else{
										layer.msg(res.msg, {icon: 5})
		            }
		        });
		    });
		},
		sendClick:function(){
			var vm = this;
			var $this = $(this);
	        var text = $.trim($("#input_content").text());
            if(text.length == 0){
                vm.showWarningMsg('发送内容不能为空');
                return false;
            }else{
                vm.sendMessage(1, text);
                $("#input_content").text('');
                var obj = {
                    content: text,
                    content_type: '1',
                    sender_id: vm.curDoctorCode,
                    timestamp: new Date().getTime()
                }
                var html = vm.formatMsg(obj);
                
                $("#talkBox").append(html);
                $("#talkBox").slimscroll({
                    scrollTo: 'bottom'
                });
            }
		},
		sendMessage:function(contentType, content){
			var vm = this;
			var params = {
		        sender_id: vm.curDoctorCode,
		        sender_name: vm.curDoctorName,
		        content_type: contentType,
		        content: content,
		        view: 0
		    };
		    consultingAPI.sendMessage(vm.sessionId, {data: params}).then(function(res){
		        console.log(res);
		        vm.count++;
		        if(vm.count==1 && JSON.parse(window.localStorage.getItem('wlyyAgent')).level=="1"){//level:1 专科医生 （只记录第一条数据）
			        var messages = res.messages[0];
			        var guidanceParams = {
			        	messageId:messages.id,//消息id
			        	content:messages.content,//聊天内容
			        	planDetailId:vm.planDetailId,//服务项目id
			        	contentType:messages.content_type//消息类型
			        }
			        debugger
			        consultingAPI.saveGuidanceMessage(guidanceParams).then(function(rs){
			        	debugger
				        	if(rs.status==200){
				        		
				        	}else{
										layer.msg(rs.msg, {icon: 5})
			            }
			        })
		        }
		    });
		},
		connectSocket:function(){
			var vm = this;
			jQuery.getScript(httpRequest.socketUrl+"/socket.io/socket.io.js").done(function() {
		        var socket = io.connect(httpRequest.socketUrl );
		        socket.emit('login', {
		            userId: vm.curDoctorCode, 
		            password: vm.curDoctorCode, 
		            sessionId: vm.sessionId,
		            clientType: "pc_doctor"
		        });
		        socket.on('message', function (data) {
		            console.log(data);
		            if(data.read && (data.read == "all" || data.read == "one") ){
		                return ;
		            }
		            var html = vm.formatMsg(data);
		            $("#talkBox").append(html);
		            $("#talkBox").slimscroll({
		                scrollTo: 'bottom'
		            });
		        });
		        socket.on('error', function (data) {
		            console.log(data)
		        });
		        socket.on('ack', function (data) {
		        });
		    }).fail(function() {
		        // dialog({contentType:'tipsbox', skin:'bk-popup' ,bottom:true, content:"医生实时对话连接失败！"}).show();     
		    });
		},
		formatMsg:function(reply){
			 var vm = this;
			 try{
		        reply = JSON.parse(reply);
		    }catch(e){
		    }
		    var isSelf = (reply.sender_id==vm.curDoctorCode) ? true : false;
		    var isSystem = reply.sender_id == 'system';
		    var html = '';
		    if(reply.content_type == 7 || reply.content_type == 10 || reply.content_type == 13 || reply.content_type == 14){
		        var content = reply.content;
		        if(isSystem){
		            content = '居民24小时内未回复，系统自动结束咨询';
		        }
		        html = template('sys_msg_tmp', {content: content});
		    }else{
		        var member;
		        for(var i=0; i<vm.members.length; i++){
		            if(reply.sender_id == vm.members[i].id){
		                member = vm.members[i];
		                break;
		            }
		        }
		        var img = httpRequest.getImgUrl(member.avatar);
		        if((img.indexOf('http') == -1) && (img.indexOf("https") == -1)){
		            img = '../../../images/d-male.png';
		        }
		        var content = '';
		        try{
		        	if(reply.content_type == 18 || reply.content_type == 19){//居民名片、聊天记录
		            	content = "暂不支持此类信息";
		            }else{
		        		 content = JSON.parse(reply.content);
		        	}
		        }catch(e){
		            if(reply.content_type == 12){ //视频文件
		                var arr = reply.content.split(",");
		                content = {};
		                content.img = arr[0];
		                content.path = arr[1];
		                content.time = arr[2];
		            }else{
		                content = reply.content;
		            }
		        }
		        var obj = {
		            isSelf: isSelf,
		            time: new Date(reply.timestamp).format('yyyy-MM-dd HH:mm:ss'),
		            type: reply.content_type,
		            name: member.name,
		            img: img,
		            content: content
		        };
		        html = template('msg_tmp', obj);
		    }
		    return html;
		},
		showWarningMsg:function(msg){
			toastr.warning(msg)
		}
	}
})

app/jbsc/html/questionnaire.html

@@ -145,9 +145,9 @@
					//计算选中个数，组装成后台接收格式
					selectItem:function(qst,select){
						var data={
								qstCode:qst.code,
								type:qst.questionType,
								content:qst.content,
							qstCode:qst.code,
							type:qst.questionType,
							content:qst.content,
						}
						var options=[];
						if(select){

app/recover/css/new_recover.css

@@ -0,0 +1,136 @@
#app {
	min-width: 1024px;
	height: 100%;
}
p {margin-bottom: 0; margin-top: 0;}
.re-title .name{font-size: 18px;font-weight: bold;color: #333;height: 40px;line-height: 40px;display: inline-block;padding: 0px 20px;}
.re-title .team{font-size: 14px;color: #333;display: inline-block;}
.no-select{-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select:none}
.re-title{border-bottom:solid 1px #ededed;}
.lh28 {line-height: 28px;}
.plr5 {padding-left: 5px; padding-right: 5px;}
.c-12b7f5 {color: #12b7f5;)}
.bgc-12b7f5 {background-color: #12b7f5;}
.bgc-e1e1e1 {background-color: #e1e1e1;}
.w40 {width: 32px; height: 24px; text-indent: 0.5em;}
.w60 {width: 60px;}
.w80 {width: 80px;}
.lh18 {height: 18px; line-height: 18px;}
.lh24 {height: 24px; line-height: 24px;}
.h30 {height: 30px; line-height: 30px}
.lh40 {line-height: 40px}
.cur-pit {cursor: pointer;}
.content {
	height: calc(100% - 41px);
}
.set-photo, .set-photo img {
	height: 45px;
	width: 45px;
	border-radius: 50%;
	margin: 0 auto;
}
.w300 {width: 300px;}
.c-h100 {height: 100%;}
.c-h100-41 {height: calc(100% - 41px);}
.c-h100-99 {height: calc(100% - 99px);}
.c-h100-80 {height: calc(100% - 79px);}
.w-100-66 {width: calc(100% - 66px);}
.w-100-78 {width: calc(100% - 78px);}
.w-100-300 {width: calc(100% - 301px);}
.muban_con {
	width: 400px;
	margin: 0 auto;
}
.muban_con li {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	border-radius: 5px;
	border: 1px solid #12b7f5;
	cursor: pointer;
}
.addmuban-btn {
	background: #12b7f5 url(../images/xinzeng_icon.png) no-repeat no-repeat 40% 9px;
}
ul {
	list-style: none;
}
.set-label span {
	background: url(../images/dianxuan_btn.png) no-repeat no-repeat 0px center;
	background-size: 15px 15px;
}
.set-label span:hover, .set-label span.active {
	background: url(../images/dianxuan_pre.png) no-repeat no-repeat 0px center;
	background-size: 15px 15px;
}
.search-input {
	border: 0;
	outline: none;
	height: 34px;
	width: calc(100% - 50px);
}
.search-btn {
	width: 30px;
	height: 34px;
	background: url(../../../images/sousuo_icon.png) no-repeat no-repeat center center;
	cursor: pointer;
}
.set-arrow {
	background: url(../images/shouqi_jiantou_icon.png) no-repeat no-repeat 0px center;
	background-size: 9px 9px;
}
.set-arrow.active {
	background: url(../images/zhankai_jiantou_icon.png) no-repeat no-repeat 0px center;
	background-size: 9px 9px;
}
.border-c12b7f5 {
	border-color: #12b7f5;
}
.bgc-green {background-color: green;}
.b-r-3 {border-radius: 3px;}
.txt-ells {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.project:hover {background-color: deepskyblue;}
.c-red {color: red;}
.sub-tap {
	width: 18px;
	height: 18px;
	background: url(../images/qingchu_icon.png) no-repeat no-repeat right top;
	background-size: 18px 18px;
}
.w-50 {width: 50%;}
.set-qiehuan {
	right: 10px;
	top: 15px;
	width: 25px;
	height: 25px;
	background: url(../images/qiehuan_btn.png) no-repeat no-repeat scroll 0px 0px;
	background-size: 25px 25px;
}
.set-qiehuan:hover {
	background: url(../images/qiehuan_ben_pre.png) no-repeat no-repeat scroll 0px 0px;
	background-size: 25px 25px;
}
.bgc-999 {background-color: #999;}
.w100 {width: 100px;}
.set-xia {
	background: url(../../../images/tiaozhuan_xia_icon.png) no-repeat no-repeat 85px center;
	background-size: 8px 4px;
}
.set-shang {
	background: url(../../../images/tiaozhuan_shang_icon.png) no-repeat no-repeat 85px center;
	background-size: 8px 4px;
}
.doc_list {
	left: 0;
	top: 18px;
	width: 98px;
	z-index: 999;
	background-color: #ffffff;
}
.doc_list li:hover {
	background-color: #e1e1e1;
}

app/recover/css/personal-manage.css

@@ -0,0 +1,45 @@
.bgc-f2fcfe {background-color: #f2fcfe;}
.w350 {width: 350px;}
.w-100-350 {width: calc(100% - 351px);}
.c-orange {color: orange;}
.bgc-orange {background-color: orange;}
.bgc-c1c1c1 {background-color: #c1c1c1;}
.lh22 {height: 22px; line-height: 22px;}
.b-r-11 {border-radius: 11px;}
.w30 {width: 30px;}
.set-dianxian {
	width: 20px;
	height: 36px;
	background: url(../images/dianxian.png) no-repeat repeat center center;
}
.mt13 {margin-top: 13px;}
.mt8 {margin-top: 8px;}
.set-taday {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #12b7f5;
	line-height: 20px;
}
.set-row {
	width: 10px;
	height: 10px;
	border-radius: 50%;
}
.w-100-220 {width: calc(100% - 220px);}
.record-li:hover {
	background-color: #f1f6f5;
	color: #12B7F5;
}
.doc-li:hover, .plan-li:hover {
	background-color: #e1e1e1;
}
.bgc-red {
	background-color: lightcoral;
}
.w-100-60 {width: calc(100% - 60px);}
.set-hospital {
	background: url(../images/yiyuan_icon.png) no-repeat no-repeat 5px 5px;
	background-size: 12px 12px;
}
.h73 {height: 73px;}

app/recover/css/project-detail.css

@@ -0,0 +1,41 @@
.lh28 {line-height: 28px;}
.plr5 {padding-left: 5px; padding-right: 5px;}
.c-12b7f5 {color: #12b7f5;)}
.bgc-12b7f5 {background-color: #12b7f5;}
.bgc-e1e1e1 {background-color: #e1e1e1;}
.bgc-f2fcfe {background-color: #f2fcfe;}
.w40 {width: 32px; height: 24px; text-indent: 0.5em;}
.w60 {width: 60px;}
.w80 {width: 80px;}
.lh18 {height: 18px; line-height: 18px;}
.lh24 {height: 24px; line-height: 24px;}
.h30 {height: 30px; line-height: 30px}
.lh40 {line-height: 40px}
.cur-pit {cursor: pointer;}
.set-photo, .set-photo img {
	height: 45px;
	width: 45px;
	margin: 0 auto;
}
ul {
	list-style: none;
}
.border-c12b7f5 {
	border-color: #12b7f5;
}
.bgc-green {background-color: green;}
.b-r-3 {border-radius: 3px;}
.c-red {color: red;}
.w-50 {width: 50%;}
.set-finish {
	background: url(../images/gouxuan_lanse_icon.png) no-repeat no-repeat 0px center;
	background-size: 14px 14px;
}
.set-show {
	background: url(../images/zhankai_btn.png)  no-repeat no-repeat 0px center;
	background-size: 12px 12px;
}
.set-show.active {
	background: url(../images/shouqi_btn.png)  no-repeat no-repeat 0px center;
	background-size: 12px 12px;
}

app/recover/css/select-patient.css

@@ -0,0 +1,61 @@
.c-h100 {
	height: 100%;
}
.w40 {
	width: 40px;
}
.w-100-70 {
	width: calc(100% - 70px);
}
.search-input {
	border: 0;
	outline: none;
	height: 34px;
	width: calc(100% - 50px);
}
.search-btn {
	width: 30px;
	height: 34px;
	background: url(../../../images/sousuo_icon.png) no-repeat no-repeat center center;
	cursor: pointer;
}
.lh34 {
	height: 34px;
	line-height: 34px;
}
.label-list h4 {
	background: url(../../../images/tiaozhuan_icon.png) no-repeat no-repeat calc(100% - 10px) center;
	background-size: 5px 9px;
}
.label-list h4.active {
	background: url(../../../images/tiaozhuan_xia_icon.png) no-repeat no-repeat calc(100% - 10px) center;
	background-size: 9px 5px;
}
.set-img, .set-img img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
}
.lh40 {
	height: 40px;
	line-height: 40px;
}
.lh22 {
	line-height: 22px;
}
.pat-list li:hover {
	background-color: #e1e1e1;
}
.set-txt {width: calc(100% - 50px);}
.bgc-12b7f5 {background-color: #12b7f5;}
.c-12b7f5 {color: #12b7f5;}
.txt-underline {
	text-decoration: underline;
}
.cur-pit {cursor: pointer;}
.b-r-3 {border-radius: 3px;}
.disease-list li.active {
	border: 1px solid #12b7f5;
	background: url(../images/jiaobiao_xuanzhe_img.png) no-repeat no-repeat bottom right;
}
.bgc-f2fcfe {background-color: #f2fcfe;}

app/recover/html/new_recover.html

@@ -0,0 +1,590 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>新增康复安排</title>
		<link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/new_recover.css" />
	</head>
	<body class="m0">
	<div id="app" v-cloak>
		<div class="c-position-a" style="top: -999px; left: -999px;" v-show="isTest"></div>
		<div class="re-title no-select">
			<div class="name">新增康复安排</div>
		</div>
		<div class="content clearfix">
	        <div class="fl c-h100 w300 person_info c-border-r" style="overflow: hidden;">
	        	<div v-if="!patiInfo" class="c-h100" style="overflow: auto;">
		        	<div  class="c-border-b c-t-center pt20">
		        		<div class="set-photo">
		        			<img src="../../../images/p-female.png" alt="居民头像" />
		        		</div>
		        		<p class="ptb10">患者名</p>
		        	</div>
		        	<div>
		        		<div class="no-result c-t-center pt20">
		        			<img src="../images/wushuju01_img.png" alt="无数据" />
		        			<p class="c-999">暂无相关信息</p>
		        			<div class="pt30">
		        				<span class="c-fff btn cur-pit plr10 ptb5 bgc-12b7f5 b-r-3" @click="selectPatient()">同步信息</span>
		        			</div>
		        		</div>
		        	</div>
	        	</div>
	        	<div v-else class="c-h100 plr10" style="overflow: auto;">
	        		<div  class="c-t-center pt20 c-position-r">
		        		<div class="set-photo">
		        			<img :src="setPatImg(patiInfo.photo)" alt="居民头像" />
		        		</div>
		        		<h3 class="ptb10 m0 c-f16">{{patiInfo.name}}</h3>
		        		<span class="c-position-a set-qiehuan cur-pit" @click="selectPatient()"></span>
		        	</div>
		        	<h4 class="h30 m0 c-f14 c-border-b">基本信息</h4>
		        	<ul class="c-333 m0 p0 pb20">
		        		<li class="pt10"><span class="c-999">性&emsp;&emsp;别：</span>{{patiInfo.sex == 1 ? "男" : "女"}}</li>
		        		<li class="pt10"><span class="c-999">年&emsp;&emsp;龄：</span>{{patiInfo.age}}岁</li>
		        		<li class="pt10"><span class="c-999">身份证号：</span>{{patiInfo.idcard}}</li>
		        		<li class="pt10"><span class="c-999">地&emsp;&emsp;址：</span>{{patiInfo.address}}</li>
		        	</ul>
		        	<h4 class="h30 m0 c-f14 c-border-b">家庭医生</h4>
		        	<ul class="c-333 m0 p0 pb20">
		        		<li class="pt10"><span class="c-999">签约社区：</span>{{patiInfo.ssHospitalName}}</li>
		        		<li class="pt10"><span class="c-999">全科医生：</span>{{patiInfo.ssDoctorName}}</li>
		        		<li class="pt10"><span class="c-999">健&ensp;管&ensp;师：</span>{{patiInfo.ssDoctorHealthName}}</li>
		        	</ul>
		        	<!--<h4 class="h30 m0 c-f14 c-border-b">诊疗信息</h4>
		        	<ul class="c-333 m0 p0 pb20">
		        		<li class="pt10"><span class="c-999">诊疗医院：</span>男</li>
		        		<li class="pt10"><span class="c-999">入院科室：</span>男</li>
		        		<li class="pt10"><span class="c-999">主治医师：</span>男</li>
		        		<li class="pt10"><span class="c-999">入院诊断：</span>男</li>
		        		<li class="pt10"><span class="c-999">出院诊断：</span>男</li>
		        	</ul>
		        	<h4 class="h30 m0 c-f14 c-border-b">出院小结</h4>
		        	<p class="m0 pt10 c-333">依旧本次判断，对新消息进行出院诊断做出以下结论：忧郁啥啥事等等等问题</p>-->
	        	</div>
	        </div>
	        <div class="fl c-h100 w-100-300">
	        	<div class="c-h100 plr5" v-if="!isPlan">
		        	<h4 class="m0 pl10 lh40 c-border-b">配置康复计划</h4>
		        	<div style="overflow: hidden; height: calc(100% - 41px);">
		        		<div style="overflow: auto; height: 100%;">
				        	<div class="un-select c-t-center pt45" v-if="!patiInfo">
				        		<img src="../images/wushuju_img.png" alt="" />
				        		<p class="c-999">您还没有选择居民</p>
				        	</div>
				        	<ul class="muban_con lh40 c-t-center pt30" v-else>
				        		<li class="mb20" v-for="(muban, index) in mubanList" :key="index" @click="addMuban(muban.id)">{{muban.title}}</li>
				        		<li class="addmuban-btn c-fff" @click="addMuban()">新增模板</li>
				        	</ul>
			        	</div>
			        </div>
		        </div>
		        <div class="clearfix c-h100" v-else>
		        	<div class="fl w-100-300 c-h100">
		        		<div class="plr5 c-h100-80">
		        			<h4 class="m0 pl10 lh40 c-border-b set-label">配置康复计划
		        				<span v-for="(label, index) in spanLabel" :key="index" class="fr ml20 pl20 c-f14 c-999 cur-pit" :class="{'active': index == labelIndex}" @click="setLabelIndex(index, label)">{{label.labelName}}</span>
		        			</h4>
		        			<div class="c-h100-41" style="overflow: hidden;">
		        				<ul class="c-h100 p0 m0" style="overflow: auto;">
		        					<li class="mt10 plr10 ptb5 c-border b-r-3 clearfix" v-for="(detail, index) in templateDetail" :key="index">
		        						<div class="fl w-100-78 c-333">
		        							<p class="m0 p0 mb10 txt-ells cur-pit" @click="lookProject(detail)">{{detail.specialistServiceItemDO.title}}</p>
	        								<div class="clearfix">
	        									<p class="m0 mb5 mr20 p0 fl"><span class="c-999">医&emsp;&emsp;院：</span>{{detail.hospitalName}}</p>
	        									<div class="m0 mb5 mr20 p0 fl clearfix">
	        										<span class="fl c-999">执行人员：</span>
	        										<div class="fl c-position-r w100">
	        											<p class="m0 p0 plr10 c-border cur-pit set-xia" :class="{'set-shang':detail.selectDoc}" @click="changeSelectDoc(index, detail.selectDoc)">{{detail.executeDoctorName}}</p>
	        											<ul class="m0 p0 c-border-b c-border-l c-border-r c-position-a doc_list" v-if="detail.selectDoc">
	        												<li class="plr10 c-border-t cur-pit" v-for="(list, indDoc) in detail.docList" :key="indDoc" @click="selectLi(index, list)">{{list.name}}</li>
	        											</ul>
	        										</div>
	        									</div>
	        									<p class="m0 mb5 p0 fl"><span class="c-999">费&emsp;&emsp;用：</span>{{detail.specialistServiceItemDO.unit}}</p>
	        								</div>
		        							<div class="m0 p0 lh18 clearfix">
        										<span class="fl c-999">计划时间：</span>
        										<p class="fl lh18 mb5 mr20 clearfix" v-for="(time, ind) in detail.specialistServiceItemDO.executeTime" :key="ind" v-if="detail.specialistServiceItemDO.executeTime.length">
        											<span class="fl">{{time}}</span><span class="fl ml5 sub-tap cur-pit" @click="spliceTimeArr(index, ind)"></span>
        										</p>
        										<span class="fl c-12b7f5 cur-pit calendar" contenteditable="true" readonly="true" @mousedown="selectTime(index)" class=flatpickr data-enable-time=true data-time_24hr=true>添加</span>
        									</div>
		        						</div>
		        						<div class='fr w60 c-t-right clearfix'>
		        							<p class="m0 p0 mb10">×{{detail.specialistServiceItemDO.executeTime.length}}</p>
		        							<div class="fr sub-tap cur-pit" @click="subTemplate(index, detail)"></div>
		        						</div>
		        					</li>
		        					<li class="pt100 c-t-center" v-if="!templateDetail.length">
		        						请在右侧“服务项”列表中选择
		        					</li>
		        				</ul>
		        			</div>
		        		</div>
		        		<div>
	        				<p class="m0 p0 pl20 ptb10 c-border-b set-label">支付方式：<span class="ml10 pl20 active">按服务支付</span><em class="c-red ml20">(按选择支付方式完成收费)</em></p>
	        				<div class="pl20 lh40">总费用：
	        					<span class="c-red c-f16">￥{{allFee}}</span>
	        					<span class="fr lh30 cur-pit w80 c-t-center c-fff" :class="allFee ? 'bgc-12b7f5' : 'bgc-999'" @click="createRehabilitationPlan()">生成计划</span>
	        					<span class="fr lh30 cur-pit w80 c-t-center bgc-green c-fff" @click="canclePlan()">取消</span>
	        				</div>
	        			</div>
		        	</div>
		        	<div class="fr w300 c-h100 c-border-l">
		        		<div class="plr5 c-h100">
		        			<h4 class="m0 pl10 lh40 c-border-b">添加其他项目</h4>
		        			<div class="clearfix mtb10 c-border">
								<input class="fl search-input plr10" type="text" placeholder="输入项目名称" />
								<span class="fr search-btn"></span>
							</div>
							<div class="c-h100-99" style="overflow: hidden;">
								<ul class="c-h100 p0 m0" style="overflow: auto;">
									<li v-for="(project1, index) in projectList" :key="index">
										<h4 class="set-arrow c-f14 h30 p0 m0 pl20 cur-pit" :class="{'active': index == proIndex1}" @click="selectPro(1, index)">{{project1.itemType == 1 ? '康复服务' : '健康服务'}}</h4>
										<ul class="c-h100 p0 m0 pl10" v-if="index == proIndex1">
											<li v-for="(project2, index2) in project1.item" :key="index2">
												<p class="set-arrow h30 c-f14 pl20 m0 c-333 cur-pit" :class="{'active': index2 == proIndex2}" @click="selectPro(2, index2)">{{project2.itemName}}</p>
												<ul class="p0 m0 pr10" v-if="index2 == proIndex2">
													<li v-for="(project3, index3) in project2.hospitalServiceItems" :key="index3" class="clearfix ptb5">
														<div class="fl project c-border w-100-66 cur-pit border-c12b7f5 ptb5 plr5 b-r-3 clearfix" @click="selectProject(index, index2, index3, project3)">
															<p class="fl w-100-78 txt-ells lh18">{{project3.specialistServiceItemDO.title}}</p>
															<span class="fr lh18 b-r-3 c-f12 ml5 bgc-green plr5 c-fff" v-if="project3.flag == 1 || project3.flag == 3">社区</span>
															<span class="fr lh18 b-r-3 c-f12 ml5 bgc-12b7f5 plr5 c-fff" v-if="project3.flag == 2 || project3.flag == 3">医院</span>
														</div>
														<span class="fr h30 btn cur-pit plr10 bgc-12b7f5 c-fff b-r-3" v-if="!project3.isSelect" @click="addProject(index, index2, index3, project3)">添加</span>
														<span class="fr h30 btn plr10 bgc-e1e1e1 c-fff b-r-3" v-else>添加</span>
													</li>
												</ul>
											</li>
										</ul>
									</li>
								</ul>
							</div>
		        		</div>
		        	</div>
		        </div>
	        </div>
	    </div>
	</div>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/jquery-2.2.4.js"></script>
        <script src="../../../plugins/layer/layer.min.js"></script>
        <script src="../../../js/bootstrap.min.js"></script>
        <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" href="../../../js/flatpickr/flatpickr.min.css">
		<script src="../../../js/flatpickr/flatpickr.min.js"></script>
		<script src="../../../api/http-request.js" type="text/javascript"></script>
		<script src="../../../api/recover_api.js" type="text/javascript"></script>
		<script type="text/javascript">
			var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType,
				docInfo = JSON.parse(window.localStorage.getItem('wlyyAgent'))
			var httpData=GetRequest()
			function showSuccessMessage(msg) {
				layer.msg(msg, {
					icon: 1
				})
			}
			
			function showErrorMessage(msg) {
				layer.msg(msg, {
					icon: 5
				})
			}
			
			function showWarningMessage(msg) {
				layer.msg(msg, {
					icon: 2
				})
			}
			
			function showInfoMessage(msg) {
				layer.msg(msg, {
					icon: 6
				})
			}
			// 初始化加载flatpickr插件
			$(".calendar").flatpickr();
			
			recoverVue = new Vue({
                el: "#app",
                data: {
                	isTest: false,
                	pati: null,
                	isPlan: false,
                	proIndex1: null,
                	proIndex2: null,
                	patiInfo: null,
                	diseaseObj: null,
                	mubanList: [],
                	templateDetail: [],
                	templateResult: [],
                	allFee: 0,
                	projectList: null,
                	labelIndex: 2,
                	labelCode: null,
                	spanLabel: [{
                		labelName: "(转)家庭病床",
                		code: 3
                	}, {
                		labelName: "(转)社区医院",
                		code: 2
                	}, {
                		labelName: "康复计划",
                		code: 1
                	}],
                	jDlist: null,
                	zDlist: null,
                	selectProjectDetail: null
                },
                mounted: function() {
                	
                },
                methods: {
                	// 获取居民信息
                	getPatientInfo: function() {
                		this.findPatientSignSpecialistInfo()
                		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				patient: this.pati.patient
			    			}
						recoverAPI.getPatientInfo(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.patiInfo = res.data
								vm.jDlist = [{
									name: vm.patiInfo.ssDoctorName,
									code: vm.patiInfo.ssDoctor
								}, {
									name: vm.patiInfo.ssDoctorHealthName,
									code: vm.patiInfo.ssDoctorHealth
								}]
							} else {
								showErrorMessage(res.msg);
							}
						})
                	},
                	findPatientSignSpecialistInfo: function() {
                		var vm = this,
			    			params = {
			    				patient: this.pati.patient,
			    				doctor: docInfo.uid
			    			}
						recoverAPI.findPatientSignSpecialistInfo(params).then(function(res) {
							if(res.status == 200) {
								vm.zDlist = [{
									name: res.data.doctorName,
									code: res.data.doctor
								}, {
									name: res.data.healthAssistantName,
									code: res.data.healthAssistant
								}]
							} else {
								showErrorMessage(res.msg);
							}
						})
                	},
                	// 模板列表
                	findTemplateList: function() {
                		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				patient: this.pati.patient,
			    				doctor: docInfo.uid
			    			}
						recoverAPI.findTemplateList(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.mubanList = res.data
							} else {
								showErrorMessage(res.msg);
							}
						})
                	},
                	// 模板详细
                	findTemplateDetail: function(templateId) {
                		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				templateId: templateId
			    			}
						recoverAPI.findTemplateDetail(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.templateDetail = []
								vm.templateResult = res.data
								vm.findServiceItemsByHospital()
							} else {
								showErrorMessage(res.msg);
							}
						})
                	},
                	// 服务项目列表
                	findServiceItemsByHospital: function() {
                		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				doctor: docInfo.uid,
								patient: this.pati.patient
			    			}
						recoverAPI.findServiceItemsByHospital(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.projectList = $.each(res.data[0], function(index, o) {
									$.each(vm.templateResult, function(index1, o1) {
										if(o1.specialistServiceItemDO.itemType == o.itemType) {
											$.each(o.item, function(index2, o2) {
												if(o1.specialistServiceItemDO.diseaseItem == o2.itemName) {
													$.each(o2.hospitalServiceItems, function(index3, o3) {
														if(o3.serviceItemId == o1.serviceItemId) {
															o3.isSelect = true
															o3.selectDoc = false
															o3.specialistServiceItemDO.executeTime = []
															if(o3.flag == 2) {
																o3.executeDoctor = vm.zDlist[0].code
																o3.executeDoctorName = vm.zDlist[0].name
																o3.docList = vm.zDlist
															} else {
																o3.executeDoctor = vm.jDlist[0].code
																o3.executeDoctorName = vm.jDlist[0].name
																o3.docList = vm.jDlist
															}
															vm.templateDetail.push(o3)
														}
													});
												}
											});
										}
									});
									return o;
								});
							} else {
								showErrorMessage(res.msg);
							}
						})
                	},
                	setPatImg: function(src) {
			    		if(!src) {
			    			return "../../../images/p-female.png"
			    		} else {
			    			var str = httpRequest.getImgUrl(src);
			    			return str
			    		}
			    	},
			    	changeSelectDoc: function(index, bool) {
			    		this.templateDetail[index].selectDoc = !bool
			    		this.isTest = !this.isTest
			    	},
			    	selectLi: function(index, list) {
			    		this.templateDetail[index].selectDoc = false
			    		this.templateDetail[index].executeDoctor = list.code
			    		this.templateDetail[index].executeDoctorName = list.name
			    		this.templateDetail[index] = this.templateDetail[index]
			    		this.isTest = !this.isTest
			    	},
			    	subTemplate: function(index, detail) {
			    		var vm = this
			    		this.templateDetail.splice(index, 1)
			    		var len = detail.specialistServiceItemDO.executeTime.length
			    		if(len) {
			    			this.allFee -= (len * detail.specialistServiceItemDO.unit)
			    		}
			    		$.each(vm.projectList, function(index, o) {
							if(detail.specialistServiceItemDO.itemType == o.itemType) {
								$.each(o.item, function(index2, o2) {
									if(detail.specialistServiceItemDO.diseaseItem == o2.itemName) {
										$.each(o2.hospitalServiceItems, function(index3, o3) {
											if(o3.serviceItemId == detail.serviceItemId) {
												o3.isSelect = false
												o3.specialistServiceItemDO.executeTime = []
											}
										});
									}
								});
							}
						});
			    	},
			    	// 选择项目
			    	selectProject: function(index, index2, index3, o) {
			    		this.selectProjectDetail = o
                		selectPatientIndex = layer.open({
							type: 2,
							area: ['400px', '500px'],
							shade: 0.5,
							title: '选择项目',
							closeBtn: 1,
							shift: 5,
							shadeClose: false, //点击遮罩关闭层
							content: "select-project.html?isLook=true&projectId=" + o.id + "&index=" + index + "&index3=" + index3 + "&index2=" + index2
						});
                	},
                	// 添加项目
                	addProject: function(index, index2, index3, obj) {
                		if(obj) {
                			this.selectProjectDetail = obj
                		}
                		if(this.selectProjectDetail.isSelect) {
                			showWarningMessage("已添加！")
                			return false;
                		}
                		this.selectProjectDetail.isSelect = true
                		this.selectProjectDetail.selectDoc = false
                		this.selectProjectDetail.specialistServiceItemDO.executeTime = []
						if(this.selectProjectDetail.flag == 2) {
							this.selectProjectDetail.executeDoctor = this.zDlist[0].code
							this.selectProjectDetail.executeDoctorName = this.zDlist[0].name
							this.selectProjectDetail.docList = this.zDlist
						} else {
							this.selectProjectDetail.executeDoctor = this.jDlist[0].code
							this.selectProjectDetail.executeDoctorName = this.jDlist[0].name
							this.selectProjectDetail.docList = this.jDlist
						}
                		this.templateDetail.push(this.selectProjectDetail)
                		this.projectList[index].item[index2].hospitalServiceItems[index3] = this.selectProjectDetail
                	},
                	// 查看项目
                	lookProject: function(o) {
                		selectPatientIndex = layer.open({
							type: 2,
							area: ['400px', '500px'],
							shade: 0.5,
							title: '查看项目',
							closeBtn: 1,
							shift: 5,
							shadeClose: false, //点击遮罩关闭层
							content: "select-project.html?projectId=" + o.id
						});
                	},
                	selectPatient: function() {
                		selectPatientIndex = layer.open({
							type: 2,
							area: ['400px', '500px'],
							shade: 0.5,
							title: '同步出院小结',
							closeBtn: 1,
							shift: 5,
							shadeClose: false, //点击遮罩关闭层
							content: "select-patient.html"
						});
                	},
                	selectPatientOk: function(pati) {
                		this.isPlan = false
                		this.pati = pati
                		this.getPatientInfo()
                		this.findTemplateList()
                	},
                	addMuban: function(oId) {
                		var vm = this
                		selectDiseaseIndex = layer.open({
							type: 2,
							area: ['400px', '500px'],
							shade: 0.5,
							title: '选择疾病',
							closeBtn: 1,
							shift: 5,
							shadeClose: false, //点击遮罩关闭层
							content: "select-disease.html?teamCode=" + vm.pati.teamCode +"&templateId=" + oId || ''
						});
                	},
                	canclePlan: function(obj) {
                		this.isPlan = false
                	},
                	newPlan: function(disease, templateId) {
                		this.diseaseObj = disease
                		this.isPlan = true
                		if(templateId) {
                			this.findTemplateDetail(templateId)
                		} else {
	                		this.templateDetail = []
	                		this.findServiceItemsByHospital()
	                	}
                	},
                	selectPro: function(pro, index) {
                		if(pro == 1) {
                			this.proIndex2 = null;
                			this.proIndex1 == index ? this.proIndex1 = null : this.proIndex1 = index
                		} else {
                			this.proIndex2 == index ? this.proIndex2 = null : this.proIndex2 = index
                		}
                	},
                	setLabelIndex: function(index, label) {
                		this.labelIndex = index
                		this.labelCode = label.code
                	},
                	selectTime: function(index) {
                		var currentEle = $(event.target),
                			vm = this;
                		currentEle.flatpickr({
                			defaultDate: currentEle.val(),
                			minDate: "today",
                			enableTime: true,
                			onOpen: function(obj, str) {
                				currentEle.val(str)
                			},
                			onClose: function(obj, str) {
                				if(!str) {
                					return false;
                				}
                				vm.templateDetail[index].specialistServiceItemDO.executeTime.push(str)
                				vm.allFee += vm.templateDetail[index].specialistServiceItemDO.unit
                			}
                		})
                	},
                	spliceTimeArr: function(index, ind) {
                		this.templateDetail[index].specialistServiceItemDO.executeTime.splice(ind, 1)
                		this.allFee -= this.templateDetail[index].specialistServiceItemDO.unit
                	},
                	createRehabilitationPlan: function() {
                		if(!this.allFee) {
                			showWarningMessage("请选择计划时间！")
                			return false;
                		}
                		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			data = {
			    				patient: this.pati.patient,
			    				name: this.pati.patientName,
			    				title: this.pati.patientName + this.diseaseObj.diseaseName + "康复计划",
			    				disease: this.diseaseObj.diseaseCode,
			    				diseaseName: this.diseaseObj.diseaseName,
			    				planType: this.labelCode,
			    				payment: 2,
			    				totalExpense: this.allFee,
			    				detail: []
			    			},
			    			params = {};
			    		$.each(vm.templateDetail, function(index, o) {
			    			if(o.specialistServiceItemDO.executeTime.length) {
			    				var obj = {
			    					hospitalServiceItemId: o.id,
			    					type: o.flag == 2 ? 2 : 1,
			    					doctor: o.executeDoctor,
			    					doctorName: o.executeDoctorName,
			    					executeTime: o.specialistServiceItemDO.executeTime.join(",")
			    				}
			    				data.detail.push(obj)
			    			}
			    		});
			    		params = {
			    			json: JSON.stringify(data)
			    		}
						recoverAPI.createRehabilitationPlan(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								showSuccessMessage(this.pati.patientName + this.diseaseObj.diseaseName + "康复计划配置成功！")
							} else {
								showErrorMessage(res.msg);
							}
						})
                	}
                }
            })
		</script>
	</body>
</html>

app/recover/html/personal-manage.html

@@ -0,0 +1,314 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>个人康复管理</title>
		<link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/new_recover.css" />
		<link rel="stylesheet" type="text/css" href="../css/personal-manage.css" />
	</head>
	<body class="m0">
	<div id="app" class="c-333" v-cloak>
		<div class="re-title no-select">
			<div class="name">康复管理</div>
		</div>
		<div class="content clearfix">
	        <div class="fl c-h100 w350 person_info c-border-r">
	        	<div class="plr5 c-h100">
		        	<h4 class="m0 pl10 lh40 c-border-b">个人基础信息</h4>
	    			<div class="bgc-f2fcfe mt10 ptb10 plr10">
	    				<div class="clearfix">
		    				<div class="fl w-100-66">
		    					<p class="m0 p0 mb10">
		    						<span class="c-999">姓名：</span>{{recoverPatInfo.patientInfo.patientName}}
		    						<span class="c-999 ml20">性别：</span>{{recoverPatInfo.patientInfo.sex == 1 ? "男" : "女"}}
		    						<span class="c-999 ml20">年龄：</span>{{recoverPatInfo.patientInfo.age}}岁
		    					</p>
		    					<p class="m0 p0 mb10">
		    						<span class="c-999">健康情况：</span>{{recoverPatInfo.patientInfo.healthyCondition}}
		    						<span class="c-999 ml20">联系电话：</span><span class="c-12b7f5 cur-pit">点击查看</span>
		    					</p>
		    				</div>
		    				<div class="fr set-photo">
		    					<img :src="recoverPatInfo.patientInfo.photo" alt="居民头像" />
		    				</div>
	    				</div>
	    				<p class="m0 p0 mb10">
    						<span class="c-999">签约社区：</span>{{recoverPatInfo.patientInfo.signHospitalName}}
    					</p>
    					<p class="m0 p0">
    						<span class="c-999">康复机构：</span>{{recoverPatInfo.patientInfo.rehabilitationOrg}}
    					</p>
	    			</div>
	    			<h4 class="m0 pl10 lh40 c-border-b">服务医生</h4>
	    			<!--<div class="pt10 pb10" style="overflow: hidden; height: 190px;">-->
	    			<div class="pt10 pb10" style="overflow: hidden; height: calc(100% - 231px);">
		    			<ul class="p0 m0 c-h100" style="overflow: auto;">
		    				<li class="clearfix plr20 ptb10 doc-li" v-for="(docInfo, index) in recoverPatInfo.serviceDoctorList" :key="index">
		    					<div class="fl set-photo">
		    						<img :src="setPatImg(docInfo.doctorPhoto, 1)" alt="医生头像" />
		    					</div>
		    					<div class="fl ml10 lh18">
		    						<p class="m0 p0 c-f16">{{docInfo.doctorName}}</p>
		    						<p class="m0 p0 mt10 c-999">{{docInfo.type}}</p>
		    					</div>
		    					<div class="fl ml40 lh18">
		    						<p class="m0 p0">完成项目：<span class="c-orange">{{docInfo.finishedItem}}</span></p>
		    						<p class="m0 p0 mt10">服务次数：<span class="c-orange">{{docInfo.serviceCount}}</span></p>
		    					</div>
		    				</li>
		    			</ul>
	    			</div>
	    			<!--<h4 class="m0 pl10 lh40 c-border-b">出院小结</h4>
	    			<div class="ptb10" style="overflow: hidden; height: calc(100% - 481px);">
	    				<ul class="m0 p0 c-border b-r-3 c-h100" style="overflow: auto;">
	    					<li class="pt5 plr10">
	    						<p class="c-999 lh40 clearfix">
	    							<span class="fl">冠心病诊断</span>
	    							<span class="fr">2018-08-01</span>
	    						</p>
	    						<div class="bgc-f2fcfe plr5 ptb10" style="line-height: 20px;">
	    							&emsp;&emsp;这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容这是诊断内容
	    						</div>
	    					</li>
	    				</ul>
	    			</div>-->
    			</div>
	        </div>
	        <div class="fl c-h100 w-100-350">
	        	<div class="fl w-100-300 c-h100">
	        		<div class="plr5">
		        		<h4 class="m0 pl10 lh40 c-border-b clearfix">康复计划<span class="fr w80 c-333 c-f12 c-t-center">进行中：{{recoverPatInfo.planUnderway}}</span><span class="fr w80 c-333 c-f12 c-t-center">已完成：{{recoverPatInfo.planFinish}}</span></h4>
		        		<div class="pb10" style="overflow: hidden; height: 230px;">
			    			<ul class="p0 m0 c-h100" style="overflow: auto;">
			    				<li class="clearfix plr5 ptb10 mt10 plan-li cur-pit c-border b-r-3" v-for="(plan, index) in recoverPatInfo.planList" :key="index" @click="jumpPlan(plan)">
			    					<div class="fl w300">
			    						<p class="p0 m0 lh22 clearfix">
			    							<span class="fl">{{plan.planTypeName}}</span>
			    							<span class="fr c-999">{{plan.time}}</span>
			    						</p>
			    						<div class="clearfix">
			    							<p class="fl w-100-78 bgc-c1c1c1 lh22 b-r-11 c-position-r c-t-center">{{setPercent(plan)}}
			    								<span class="c-position-a bgc-orange lh22 b-r-11 c-t-center c-fff" :style="{width: setPercent(plan), left: 0}"></span>
			    							</p>
			    							<span class="fr w60 c-999 lh22">{{plan.allFinishCount}}/{{plan.allCount}}</span>
			    						</div>
			    					</div>
			    					<div class="fr c-007cd9 lh40">{{plan.statusName}}</div>
			    				</li>
			    				<li class="ptb10 c-t-center" v-if="!recoverPatInfo.planList.length">暂无相关计划</li>
			    			</ul>
		    			</div>
	    			</div>
	    			<h4 class="m0 pl10 pr5 lh40 c-border-tb clearfix">康复相关记录<span class="fr w80 c-333 c-f12 c-t-center">已完成：{{finishData.planDetailFinish}}</span></h4>
	    			<div class="plr10" style="overflow: hidden; height: calc(100% - 323px);">
	    				<ul class="p0 m0 c-h100 c-999" style="overflow: auto;">
	    					<li class="clearfix cur-pit record-li" v-for="(plan, index) in planDetailList" @click="lookProject(plan)">
	    						<div class="fl w80 ptb10 c-t-right">
	    							<p class="p0 m0 lh18">{{plan.executeTime}}</p>
	    						</div>
	    						<div class="fl set-dianxian plr20 ptb10 clerfix">
	    							<span class="fl set-taday mt8 c-t-center c-fff" v-if="plan.istaDay">今</span>
	    							<span class="fl mlr5 mt13 set-row bgc-e1e1e1" v-else></span>
	    						</div>
	    						<div class="fl ptb10 w-100-220">
	    							<p class="p0 m0 lh18">{{plan.title}}</p>
	    							<p class="p0 m0 lh18 txt-ells">{{plan.content}}</p>
	    						</div>
	    						<div class="fr ptb10 w60 c-t-center">
	    							<p class="p0 m0 lh18">已完成</p>
	    							<p class="p0 m0 lh18">查看</p>
	    						</div>
	    					</li>
	    					<li class="plr20">
	    						<div class="c-border lh40 b-r-3 c-t-center cur-pit" v-if="isFinishMore" @click="addPage()">点击查看更早时间</div>
	    						<div class="c-border lh40 b-r-3 c-t-center" v-else>没有更多了</div>
	    					</li>
	    				</ul>
	    			</div>
	        	</div>
	        	<div class="fr w300 c-h100 c-border-l">
	        		<div class="plr5 c-h100">
	        			<h4 class="m0 pl10 pr5 lh40 c-border-b clearfix">就诊记录</h4>
	        			<div style="overflow: hidden; height: calc(100% - 41px);">
	        				<ul class="c-h100 p0 m0" style="overflow: auto;">
	        					<li class="clearfix" v-for="(record, index) in seeRecord" :key="index">
	        						<div class="fl set-dianxian h73 plr10 pt20 clerfix">
	    								<span class="fl mlr5 set-row bgc-red" v-if="record.eventType == 2"></span>
	    								<span class="fl mlr5 set-row bgc-green" v-if="record.eventType == 3"></span>
	    								<span class="fl mlr5 set-row bgc-orange" v-if="record.eventType == 1"></span>
	    							</div>
	    							<div class="fl w-100-60 pt15">
		    							<div class=" c-border b-r-3">
		    								<p class="m0 p0 plr5 c-fff bgc-red lh22 clearfix" v-if="record.eventType == 2">住院<span class="fr">{{record.eventDate}}</span></p>
		    								<p class="m0 p0 plr5 c-fff bgc-green lh22 clearfix" v-if="record.eventType == 3">体检<span class="fr">{{record.eventDate}}</span></p>
		    								<p class="m0 p0 plr5 c-fff bgc-orange lh22 clearfix" v-if="record.eventType == 1">门诊<span class="fr">{{record.eventDate}}</span></p>
		    								<p class="m0 p0 plr5 pt5 lh22">{{record.dianosis}}</p>
		    								<p class="m0 p0 pr5 pb5 pl20 lh22 set-hospital">{{record.orgName}}</p>
		    							</div>
	    							</div>
	        					</li>
	        					<li class="c-t-center ptb10" v-if="!seeRecord.length">无就诊记录</li>
	        				</ul>
	        			</div>
	        		</div>
	        	</div>
		        </div>
	        </div>
	    </div>
	</div>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/jquery-2.2.4.js"></script>
        <script src="../../../plugins/layer/layer.min.js"></script>
        <script src="../../../js/bootstrap.min.js"></script>
        <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../api/http-request.js" type="text/javascript"></script>
		<script src="../../../api/recover_api.js" type="text/javascript"></script>
		<script type="text/javascript">
			var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType
			var httpData=GetRequest()
			
			function showSuccessMessage(msg) {
				layer.msg(msg, {
					icon: 1
				})
			}
			
			function showErrorMessage(msg) {
				layer.msg(msg, {
					icon: 5
				})
			}
			
			function showWarningMessage(msg) {
				layer.msg(msg, {
					icon: 2
				})
			}
			
			function showInfoMessage(msg) {
				layer.msg(msg, {
					icon: 6
				})
			}
			var nowDate = new Date().format("yyyy/MM/dd")
			
			recoverVue = new Vue({
                el: "#app",
                data: {
                	recoverPatInfo: null,
                	finishData: null,
                	seeRecord: [],
                	planDetailList: [],
                	isFinishMore: false,
                	page: 1,
                	eventPage: 1
                },
                mounted: function() {
                	this.patientRehabilitationDetail()
                	this.recentPlanDetailRecord()
                	this.archivesEvent()
                },
                methods: {
                	jumpPlan: function(plan) {
                		location.href = "../../rehabilitation/html/rehabilitation_management.html?planId=" + plan.id
                	},
					lookProject: function(obj) {
						layer.open({
							type: 2,
							area: ['600px', '500px'],
							shade: 0.5,
							title: '服务项目内容',
							closeBtn: 1,
							shift: 5,
							shadeClose: false, //点击遮罩关闭层
							content: "project-detail.html?planId=" + obj.id
						});
					},
					patientRehabilitationDetail: function() {
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				patientCode: httpData.patientCode || "915ccc97-5b1d-11e6-8344-fa163e8aee56"
			    			}
						recoverAPI.patientRehabilitationDetail(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.recoverPatInfo = res.data
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
			    	recentPlanDetailRecord: function() {
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				patientCode: httpData.patientCode || "915ccc97-5b1d-11e6-8344-fa163e8aee56",
			    				page: vm.eventPage,
			    				pageSize: 10
			    			}
						recoverAPI.recentPlanDetailRecord(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.finishData = res.data
								vm.planDetailList = vm.planDetailList.concat(res.data.planDetailList)
								vm.planDetailList = $.each(vm.planDetailList, function(index, o) {
									if(nowDate == o.executeTime.split(" ")[0]) {
										o.istaDay = true
									}
									return o
								});
								if(vm.finishData.planDetailList >= 10) {
									vm.isFinishMore = true
								}
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
			    	archivesEvent: function() {
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				patient: httpData.patientCode || "915ccc97-5b1d-11e6-8344-fa163e8aee56",
			    				page: vm.page,
			    				pageSize: 20
			    			}
						recoverAPI.archivesEvent(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.seeRecord = vm.seeRecord.concat(res.data)
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
			    	setPatImg: function(src, doc) {
			    		if(!src) {
			    			if(doc) {
			    				return "../../../images/d-default.png"
			    			} else {
			    				return "../../../images/p-female.png"
			    			}
			    		} else {
			    			var str = httpRequest.getImgUrl(src);
			    			return str
			    		}
			    	},
			    	addPage: function() {
			    		this.page++;
			    		this.recentPlanDetailRecord()
			    	},
			    	setPercent: function(plan) {
			    		return Math.floor(plan.allFinishCount / plan.allCount * 100) + "%"
			    	}
                }
            })
		</script>
	</body>
</html>

app/recover/html/project-detail.html

@@ -0,0 +1,141 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>服务项目内容</title>
		<link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/project-detail.css" />
	</head>
	<body class="m0">
	<div id="app" style="height: 100%;" v-cloak>
		<h4 class="p0 pt10 pb5 m0 plr30">{{planDetail.title}}</h4>
		<p class="p0 m0 plr30 pb5 c-border-b c-333 clearfix">
			<span class="fl plr10 lh18 c-border border-c12b7f5 c-12b7f5 mr10 b-r-3">{{planDetail.shortExecuteTime}}</span>
			<span class="fl plr10 lh18 c-border border-c12b7f5 c-12b7f5 mr10 b-r-3" v-for="(name, index) in planDetail.executeDoctorList" :key="index">{{name}}</span>
			<span class="fr pl20 c-12b7f5 set-finish">{{planDetail.statusName}}</span>
		</p>
		<div style="overflow: hidden; height: calc(100% - 60px);">
			<div class="plr15 c-999" style="overflow: auto; height: 100%;">
				<p class="p0 m0 ptb10 c-border-b">项目内涵：{{planDetail.content}}</p>
				<div class="ptb10 c-border-b clearfix">
					<span class="fl w-50 mb5">地点：{{planDetail.hospitalName}}</span>
					<span class="fl w-50 mb5">执行：{{handleArr(planDetail.executeDoctorList)}}</span>
					<span class="fl w-50">时间：{{handleTime(planDetail.executeTime)}}</span>
					<span class="fl w-50">收费：{{planDetail.expense}}元</span>
				</div>
				<p class="p0 m0 ptb10 c-333 clearfix">指导与回报记录<span class="fr pl15 set-show c-12b7f5" :class="{'active':isShowMore}" @click="changeShow()">{{isShowMore ? "收起详情" : "查看详情"}}</span></p>
				<ul class="p0 m0" v-show="isShowMore">
					<li class="bgc-f2fcfe plr10 ptb10 mb10" v-for="(record, index) in planDetail.messageList" :key="index">
						<p class="m0 p0 mb10 clearfix">
							<span class="fl w-50">{{record.doctorName}}&emsp;{{record.adminTeamName}}</span>
							<span class="fl w-50">{{record.createTime}}</span>
						</p>
						<p class="m0 p0 c-333">{{record.content}}</p>
					</li>
					<li class="c-t-center" v-if="!planDetail.messageList.length">暂无记录</li>
				</ul>
				<p class="m0 p0 ptb10 c-333 c-border-b">完成信息</p>
				<div class="ptb10">
					<p class="m0 p0 mb5">完成时间：<span class="c-333">{{planDetail.completeTime}}</span></p>
					<p class="m0 p0">执行医生：<span class="c-333">{{planDetail.operatorDoctorName}}</span></p>
				</div>
				<p class="m0 p0 ptb10 c-333 c-border-b">服务完成笔记</p>
				<div class="ptb10">
					{{planDetail.node}}
				</div>
				<p class="m0 p0 ptb10 c-333">相关记录</p>
				<ul class="p0 m0 ptb10 plr10 mb20 c-border b-r-3 clearfix">
					<li class="fl set-photo c-border mr10 clearfix" v-for="(record, index) in planDetail.relationRecordImg" :key="index">
						<img class="fl" :src="handleImg(record)" alt="记录图" />
					</li>
					<li class="c-t-center" v-if="!planDetail.relationRecordImg.length">暂无相关记录</li>
				</ul>
			</div>
		</div>
	</div>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/jquery-2.2.4.js"></script>
        <script src="../../../plugins/layer/layer.min.js"></script>
        <script src="../../../js/bootstrap.min.js"></script>
        <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../api/http-request.js" type="text/javascript"></script>
		<script src="../../../api/recover_api.js" type="text/javascript"></script>
		<script type="text/javascript">
			var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType
			var httpData=GetRequest()
			function showSuccessMessage(msg) {
				layer.msg(msg, {
					icon: 1
				})
			}
			
			function showErrorMessage(msg) {
				layer.msg(msg, {
					icon: 5
				})
			}
			
			function showWarningMessage(msg) {
				layer.msg(msg, {
					icon: 2
				})
			}
			
			function showInfoMessage(msg) {
				layer.msg(msg, {
					icon: 6
				})
			}
			
			selectVue = new Vue({
                el: "#app",
                data: {
                	isShowMore: false,
                	planDetail: null
                },
                mounted: function() {
                	this.serviceItem()
                },
                methods: {
                	changeShow: function() {
                		this.isShowMore = !this.isShowMore
                	},
                	serviceItem: function() {
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				planDetailId: httpData.planId
			    			}
						recoverAPI.serviceItem(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.planDetail = res.data
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
			    	handleArr: function(arr) {
			    		return arr.join()
			    	},
			    	handleTime: function(time) {
			    		var getTime = new Date(time),
			    			morth = getTime.getMonth() + 1
			    		return getTime.getFullYear() + '-' + this.addZero(morth) + '-' + this.addZero(getTime.getDay()) + " " + this.addZero(getTime.getHours()) + ":" + this.addZero(getTime.getMinutes())
			    	},
			    	addZero: function(num) {
			    		return num >= 10 ? num : '0' + num
			    	},
			    	handleImg: function(src) {
			    		var str = httpRequest.getImgUrl(src);
			    		return str
			    	}
                }
            })
		</script>
	</body>
</html>

app/recover/html/select-disease.html

@@ -0,0 +1,98 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>选择疾病</title>
		<link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/select-patient.css" />
	</head>
	<body class="m0">
	<div id="app" class="c-t-center" style="height: 100%;" v-cloak>
		<div style="overflow: hidden; height: calc(100% - 60px);">
			<ul class="disease-list c-h100 p0 m0 pl20 pr10 clearfix" style="overflow: auto;">
				<li class="fl mr10 plr20 ptb5 c-border b-r-3 mt20" :class="{'active':index == selectIndex}" v-for="(disease, index) in diseaseArr" :key="index" @click="selectFn(index)">{{disease.diseaseName}}</li>
			</ul>
		</div>
		<div class="ptb20">
			<span class="c-fff btn cur-pit plr30 ptb5 bgc-12b7f5 b-r-3" @click="sure()">确 认</span>
		</div>
	</div>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/jquery-2.2.4.js"></script>
        <script src="../../../plugins/layer/layer.min.js"></script>
        <script src="../../../js/bootstrap.min.js"></script>
        <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../api/http-request.js" type="text/javascript"></script>
		<script src="../../../api/recover_api.js" type="text/javascript"></script>
		<script type="text/javascript">
			var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType
			var httpData=GetRequest()
			function showSuccessMessage(msg) {
				layer.msg(msg, {
					icon: 1
				})
			}
			
			function showErrorMessage(msg) {
				layer.msg(msg, {
					icon: 5
				})
			}
			
			function showWarningMessage(msg) {
				layer.msg(msg, {
					icon: 2
				})
			}
			
			function showInfoMessage(msg) {
				layer.msg(msg, {
					icon: 6
				})
			}
			
			selectVue = new Vue({
                el: "#app",
                data: {
                	selectIndex: null,
                	diseaseArr: null
                },
                mounted: function() {
                	this.findTeamDiseaseRelation()
                },
                methods: {
                	selectFn: function(index) {
                		this.selectIndex = index + ''
                	},
                	sure: function() {
                		if(!this.selectIndex) {
                			showWarningMessage("请选择疾病！")
                			return false;
                		}
                		top.recoverVue.newPlan(this.diseaseArr[this.selectIndex], httpData.templateId)
                		top.layer.close(top.selectDiseaseIndex)
                	},
                	findTeamDiseaseRelation: function() {
                		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				teamCode: httpData.teamCode
			    			}
						recoverAPI.findTeamDiseaseRelation(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.diseaseArr = res.data
							} else {
								showErrorMessage(res.msg);
							}
						})
                	}
                }
            })
		</script>
	</body>
</html>

app/recover/html/select-patient.html

@@ -0,0 +1,203 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>同步出院小结</title>
		<link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/select-patient.css" />
	</head>
	<body class="m0">
	<div id="app" style="height: 100%;" v-cloak>
		<div class="plr20 ptb10 c-border-b">
			<div class="clearfix c-border">
				<input class="fl search-input plr10" type="text" placeholder="输入居民姓名或身份证号码" :value="keyword" />
				<span class="fr search-btn"></span>
			</div>
		</div>
		<div style="overflow: hidden; height: calc(100% - 59px);">
			<ul class="pat-list p0 m0" style="overflow: auto; height: 100%;" v-if="isSearch">
				<li class="clearfix lh40 plr20 ptb10" v-for="(pati, index) in patiList" :key="index" @click="getPatientInfo(pati)">
					<div class="fl set-img">
						<img :src="setPatImg(pati.photo)" alt="居民头像" />
					</div>
					<span class="fl ml20 mr10 c-333 c-f16">{{pati.patientName}}</span>
					<span class="fl c-999">（{{pati.sex}}&emsp;{{pati.age}}岁）</span>
				</li>
			</ul>
			<ul class="label-list p0 m0" style="overflow: auto; height: 100%;" v-if="isLabel">
				<li v-for="(label, index) in labelList" :key="index">
					<h4 class="c-border-b m0 lh40 pl10 pr50 clearfix" @click="selectIndexFn(index, label)" :class="{'active':selectIndex == index}">{{label.labelName}}<span class="fr">{{label.count}}</span></h4>
					<ul class="pat-list p0 m0" v-if="selectIndex == index">
						<li class="clearfix lh40 plr20 ptb10" v-for="(pati, ind) in patiList" @click="getPatientInfo(pati)">
							<div class="fl set-img">
								<img :src="setPatImg(pati.photo)" alt="居民头像" />
							</div>
							<span class="fl ml20 mr10 c-333 c-f16">{{pati.patientName}}</span>
							<span class="fl c-999">（{{pati.sex}}&emsp;{{pati.age == 0 ? "<1" : pati.age}}岁）</span>
						</li>
					</ul>
				</li>
			</ul>
			<div class="selected-patient c-h100" v-if="!isSearch && !isLabel">
				<div class="clearfix plr20 ptb10">
					<div class="fl set-img">
						<img :src="setPatImg(patiInfo.photo)" alt="居民头像" />
					</div>
					<div class="fl ml10 set-txt c-999 clearfix">
						<p class="m0 lh22 clearfix"><span class="c-333 c-f16">{{patiInfo.patientName}}</span>&emsp;{{patiInfo.sex}}&emsp;{{patiInfo.age}}岁<strong class="fr mr20 c-333">出院医嘱：<span>0</span></strong></p>
						<p class="m0">身份证号： <span class="c-333">{{patiInfo.idcard}}</span></p>
					</div>
				</div>
				<div class="result plr20" style="overflow: hidden; height: calc(100% - 60px);">
					<div class="no-result c-t-center c-border-t ptb20" v-if="true">
						<img src="../images/wushuju01_img.png" alt="" />
						<p class="c-999 mt10 mb20">暂无相关信息</p>
						<span class="c-fff btn cur-pit plr10 ptb5 bgc-12b7f5 b-r-3" @click="selectPatient()">同步居民</span>
					</div>
					<ul class="p0 m0 c-333 c-border-t" style="overflow: auto; height: 100%;" v-if="false">
						<li class="ptb10 c-border-b">
							<div class="clearfix">
								<p class="fl p0 m0 w-100-70"><span class="c-999">出院医嘱：</span>这是出院医学征服世界爱的色放卡大V阿大V撒<span class="ml10 c-12b7f5 txt-underline cur-pit" @click="showLayer()">查看</span></p>
								<span class="fr w40 c-t-center c-fff btn cur-pit plr10 ptb5 bgc-12b7f5 b-r-3" @click="selectPatient()">提取</span>
							</div>
							<div class="clearfix mt5">
								<p class="fl m0"><span class="c-999">主治医生：</span>名字</p>
								<p class="fr m0"><span class="c-999">出院时间：</span>2018-08-28</p>
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/jquery-2.2.4.js"></script>
        <script src="../../../plugins/layer/layer.min.js"></script>
        <script src="../../../js/bootstrap.min.js"></script>
        <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../api/http-request.js" type="text/javascript"></script>
		<script src="../../../api/recover_api.js" type="text/javascript"></script>
		<script type="text/javascript">
			var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType,
				doctorCode = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).uid
			var httpData=GetRequest()
			function showSuccessMessage(msg) {
				layer.msg(msg, {
					icon: 1
				})
			}
			
			function showErrorMessage(msg) {
				layer.msg(msg, {
					icon: 5
				})
			}
			
			function showWarningMessage(msg) {
				layer.msg(msg, {
					icon: 2
				})
			}
			
			function showInfoMessage(msg) {
				layer.msg(msg, {
					icon: 6
				})
			}
			
			selectVue = new Vue({
                el: "#app",
                data: {
                	page: 1,
                	keyword: null,
                	selectIndex: null,
                	labelList: [],
                	isLabel: true,
                	isSearch: false,
                	patiList: [],
                	patiInfo: null
                },
                mounted: function() {
                	this.findLabelAndPatientCountByDoctor()
                },
                methods: {
                	showLayer: function() {
                		top.layer.open({
                			type: 1,
							area: ['400px', '500px'],
							shade: 0.5,
							title: "出院医嘱",
							closeBtn: 1,
							shift: 5,
							shadeClose: true, //点击遮罩关闭层
							content: "<div class='plr10 ptb10'>&emsp;&emsp;" + "这是医嘱大的大爱大" + "</div>"
                		})
                	},
                	findLabelAndPatientCountByDoctor: function() {
                		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				doctor: doctorCode
			    			}
						recoverAPI.findLabelAndPatientCountByDoctor(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.labelList = res.data
							} else {
								showErrorMessage(res.msg);
							}
						})
                	},
                	getPatientInfoByDoctor: function(label) {
			    		var vm = this,
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				doctor: doctorCode,
								patientInfo: this.keyword, // 居民身份证或者姓名
								disease: label.label,
								page: vm.page,
								size: 50
			    			}
						recoverAPI.getPatientInfoByDoctor(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.patiList = res.data
							} else {
								showErrorMessage(res.msg);
							}
						})
			    	},
                	getPatientInfo: function(pati) {
                		this.isSearch = false
                		this.isLabel = false
                		this.patiInfo = pati
                	},
                	selectIndexFn: function(index, label) {
                		if(this.selectIndex == index) {
                			this.selectIndex = null
                		} else {
                			this.selectIndex = index
                			this.getPatientInfoByDoctor(label)
                		}
                	},
                	selectPatient: function() {
                		top.recoverVue.selectPatientOk(this.patiInfo)
                		top.layer.close(top.selectPatientIndex)
                	},
                	setPatImg: function(src) {
			    		if(!src) {
			    			return "../../../images/p-female.png"
			    		} else {
			    			var str = httpRequest.getImgUrl(src);
			    			return str
			    		}
			    	}
                }
            })
		</script>
	</body>
</html>

app/recover/html/select-project.html

@@ -0,0 +1,108 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>选择项目</title>
		<link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/select-patient.css" />
	</head>
	<body class="m0">
	<div id="app" class="p10 c-333" v-cloak>
		<div class="c-border mb20">
			<h4 class="p0 m0 plr10 ptb5 lh22 c-999 c-border-b bgc-f2fcfe">项目名称</h4>
			<p class="p0 m0 plr10 ptb5 lh22">{{proDetail.specialistServiceItemDO.title}}</p>
		</div>
		<div class="c-border mb20">
			<h4 class="p0 m0 plr10 ptb5 lh22 c-999 c-border-b bgc-f2fcfe">项目内涵</h4>
			<p class="p0 m0 plr10 ptb5 lh22">{{proDetail.specialistServiceItemDO.content}}</p>
		</div>
		<div class="c-border mb20">
			<h4 class="p0 m0 plr10 ptb5 lh22 c-999 c-border-b bgc-f2fcfe">项目类型</h4>
			<p class="p0 m0 plr10 ptb5 lh22">{{proDetail.specialistServiceItemDO.itemType == 1 ? '康复服务' : '健康服务'}}</p>
		</div>
		<div class="c-border mb20">
			<h4 class="p0 m0 plr10 ptb5 lh22 c-999 c-border-b bgc-f2fcfe">服务机构</h4>
			<p class="p0 m0 plr10 ptb5 lh22">{{proDetail.hospitalName}}</p>
		</div>
		<div class="c-border">
			<h4 class="p0 m0 plr10 ptb5 lh22 c-999 c-border-b bgc-f2fcfe">服务地点</h4>
			<p class="p0 m0 plr10 ptb5 lh22">{{proDetail.hospitalDo.address}}</p>
		</div>
		<div class="c-t-center mb20 mt30" v-if="isLook">
			<span class="btn bgc-12b7f5 lh22 c-fff ptb5 plr10 b-r-3 cur-pit" @click="addProject()">添加至计划</span>
		</div>
	</div>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/jquery-2.2.4.js"></script>
        <script src="../../../plugins/layer/layer.min.js"></script>
        <script src="../../../js/bootstrap.min.js"></script>
        <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../api/http-request.js" type="text/javascript"></script>
		<script src="../../../api/recover_api.js" type="text/javascript"></script>
		<script type="text/javascript">
			var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType
			var httpData=GetRequest()
			console.log(httpData)
			function showSuccessMessage(msg) {
				layer.msg(msg, {
					icon: 1
				})
			}
			
			function showErrorMessage(msg) {
				layer.msg(msg, {
					icon: 5
				})
			}
			
			function showWarningMessage(msg) {
				layer.msg(msg, {
					icon: 2
				})
			}
			
			function showInfoMessage(msg) {
				layer.msg(msg, {
					icon: 6
				})
			}
			
			selectVue = new Vue({
                el: "#app",
                data: {
                	isLook: httpData.isLook || false,
                	proDetail: null
                },
                mounted: function() {
                	this.selectByIds()
                },
                methods: {
                	selectByIds: function() {
                		var vm = this,
                			arr = [httpData.projectId],
			    			loadding = layer.load(0, {shade: false}),
			    			params = {
			    				ids: JSON.stringify(arr)
			    			}
						recoverAPI.selectByIds(params).then(function(res) {
							layer.close(loadding)
							if(res.status == 200) {
								vm.proDetail = res.data[0]
							} else {
								showErrorMessage(res.msg);
							}
						})
	                },
	                addProject: function() {
	                	top.recoverVue.addProject(httpData.index, httpData.index2, httpData.index3)
	                	top.layer.close(top.selectPatientIndex)
	                }
                }
            })
		</script>
	</body>
</html>

app/rehabilitation/css/date.css

@@ -0,0 +1,44 @@
#test-n2 {
	position: relative;
	min-height: 400px !important;
	width: 100% !important;
}
#test-n2  #layui-laydate1,#test-n2  #layui-laydate1 .layui-laydate-main,#test-n2 .layui-laydate-content table{
	width: 100%;
}
#test-n2 .layui-laydate-content table tbody{
	height:calc(100vh - 240px)!important;
}
.text_box{
	padding: 15px !important;
}
#test-n3 {
	position: relative;
	min-height: 400px !important;
	width: 100% !important;
}
#layui-laydate1{
	width: 100% !important;
}
#test-n3  #layui-laydate1 .layui-laydate-main{
	width:50%;
}
#test-n3  #layui-laydate1 .layui-laydate-main table{
	width: 100% !important;
}
#test-n3 .layui-laydate-content table tbody{
	height:calc(100vh - 240px)!important;
}
.layui-laydate-content td, .layui-laydate-content th{
	width: 90px !important;
	height: 90px !important;
}

app/rehabilitation/css/health_control.css

@@ -0,0 +1,440 @@
* {
    text-decoration: none;
    outline: none;
    list-style: none;
    box-sizing: border-box;
}
body {
    overflow: auto;
}
.data {
    min-width: 1280px;
  
}
.nav {
    min-width: 1265px;
}
table,
tr,
td {
    margin: 0;
    padding: 0;
}
ul,
li {
    margin: 0;
}
.flex-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.listform-sel-bor {
    width: 160px;
    margin: 10px;
}
.c-ser-btn {
    width: 80px;
    background-color: #12b7f5;
    border-radius: 2px;
    text-align: center;
    font-size: 14px;
}
.c-ser-btn a {
    height: 28px;
}
.re-title .name {
    font-size: 16px;
    font-weight: bold;
    color: #333;
    height: 40px;
    line-height: 40px;
    display: inline-block;
    padding: 0px 20px;
}
.re-title .team {
    font-size: 14px;
    color: #333;
    display: inline-block;
}
.re-title {
    border-bottom: solid 1px #ededed;
}
.c-ser-hold {
    background-color: #ffff;
    height: 28px;
}
.c-ser-div {
    float: left;
    width: 240px;
    margin-left: 25px;
}
.c-ser-main {
    border: 1px solid #d7dce6;
    padding-left: 10px;
}
.c-ser-input {
    width: 240px;
}
/* 内容 */
.neirong1 {
    position: relative;
    min-width: 1235px;
}
.listsel-two {
    width: 160px;
    height: 28px;
}
.neirongrigh {
    margin: 10px;
    margin-left: 0px;
}
.neironglef button {
    display: inline-block;
    background-color: #ffffff;
    border-radius: 2px;
    border: solid 1px #12b7f5;
    font-size: 14px;
    color: #12b7f5;
    padding: 9px 17px 7px 17px;
    margin: 10px;
}
.neironglef button:nth-child(1) {
    padding: 9px 10px 7px 10px;
}
.neirong2 .ul {
    line-height: 42px;
    background-color: #f5f5fa;
    border: solid 1px #d7dce6;
    text-align: center;
    font-size: 14px;
    color: #999999;
}
.quote {
    width: 4px;
    height: 31px;
    background-color: #12b7f5;
    border-radius: 3px;
    margin-right: 0;
}
/* .layui-elem-quote */
.biaoqian {
    padding: 1px 4px 1px 4px;
    background-color: #12b7f5;
    color: #ffffff;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}
.biaoqian span {
    display: inline-block;
    font-size: 12px;
    width: 6px;
    height: 6px;
    background-color: #ffffff;
    border-radius: 50%;
    margin: 0 4px 2px 0;
}
.text-center {
    text-align: center
}
.datad button {
    width: 80px;
    height: 28px;
    outline: none;
    border: 0;
    font-size: 14px;
    border-radius: 2px;
    color: #ffffff;
    margin-top: 18px;
    margin-bottom: 10px;
}
.datad button:nth-child(1) {
    background-color: #02cfb9;
}
.datad button:nth-child(2) {
    background-color: #12b7f5;
}
.datad button:nth-child(3) {
    background-color: #ff3b30;
    margin-right: 20px;
}
.data {
    
    margin: 10px;
    border-radius: 10px;
    height: 62px;
}
.layui-progress {
    width: 240px;
    margin: 10px;
}
.layui-progress-bar {
    background-color: #ff9526;
    display: inline-block;
    height: 100px;
    text-align: center;
}
.dataa {
    width: 355px;
    justify-content: space-between;
}
.dataa .xinxi {
    color: #999999;
    font-size: 14px;
    margin: 5px;
}
.dataa .xinxi span {
    font-size: 16px;
    color: #333333;
}
.datab {
    width: 633px;
    justify-content: center;
}
.datab .cred {
    color: #ff3b30;
    margin: 10px;
    margin-left: 10px;
}
.datab .cgre {
    color: #999999;
}
.datad {
    width: 280px;
    margin: 10px;
    margin-right: 82px;
}
.margin-10 {
    margin: 10px;
}
.input-group-checkbox .input-group-pack .tick,
.input-group-checkbox .input-group-pack .tick:after {
    background-color: #12b7f5;
}
/* 翻页 */
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
    background-color: #f4f4f4;
    border-color: #DDD;
    color: inherit;
    cursor: default;
    z-index: 2
}
.pagination>li>a,
.pagination>li>span {
    background-color: #FFF;
    border: 1px solid #DDD;
    color: inherit;
    float: left;
    line-height: 1.42857;
    margin-left: -1px;
    padding: 4px 10px;
    position: relative;
    text-decoration: none;
}
.fl {
    float: left;
}
a {
    color: white;
}
.form-control {
    height: 28px;
    background-color: #FFFFFF !important;
    background-color: #FFF;
    background-image: none;
    border: 1px solid #e5e6e7;
    border-radius: 1px;
    color: inherit;
    display: block;
    padding: 6px 12px;
    -webkit-transition: border-color .15s ease-in-out 0s, box-shadow .15s ease-in-out 0s;
    transition: border-color .15s ease-in-out 0s, box-shadow .15s ease-in-out 0s;
    width: 100%;
    font-size: 14px
}
select.form-control {
    padding: 1px 1px;
    height: 28px;
}
.btn-white {
    position: relative;
    height: 28px;
    top: -7px;
    left: 6px;
}
.dropdown-menu {
    left: -151px !important;
    top: 20px;
}
.table {
    position: relative;
    left: 0;
    top: 0;
} 
.dataCell {
    margin: 20px 40px 20px 40px;
}
.jhover {
    background: #12B7F5 !important;
    color: #fff;
}
.checkbox {
    display: inline-block;
    cursor: pointer;
    position: relative;
    font-size: 14px;
    line-height: 21px;
}
.icon-chkbox {
    display: inline-block;
    width: 20px;
    height: 20px;
    position: relative;
    z-index: 9;
    margin-right: 5px;
    background: url(../images/gouxuan_pre.png) no-repeat;
    vertical-align: text-top;
    overflow: hidden;
}
.icon-bgchkbox {
    background: url(../images/gouxuan_btn.png) no-repeat;
}
.datas {
    width: 100%;
    justify-content: space-between;
}
.all{
    /* width: 100%; */
    border: 1px solid #d7dce6;
     border-radius: 10px;
}
.c-blocks-3 {
    min-width: 1235px;
}
.nodata {
    text-align: center;
}
.falsebutton {
    background-color: #999999 !important;
}
.table{
     width: calc(100% - 20px);
    margin: 10px 10px !important;
    padding: 10px;
}
.c-ser-btn{
    
}
.c-ser-btn a{
    height: 28px;
    line-height: 28px;
    font-size: 14px;
    padding: 0;
}
.c-ser-main{
    height: 28px;
    font-size: 13px;
}
.c-ser-div{
    height: 28px !important;
    line-height: 28px;
    padding-top: 0;
}
label{
    font-weight: 400;
}

app/rehabilitation/css/moreplan.css

@@ -0,0 +1,348 @@
* {
    outline: none;
    list-style: none;
    box-sizing: border-box;
}
ul,
li,
p {
    margin: 0;
}
.flex-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.re-title .name {
    font-size: 16px;
    font-weight: bold;
    color: #333;
    height: 40px;
    line-height: 40px;
    display: inline-block;
    padding: 0px 20px;
}
.re-title .team {
    font-size: 14px;
    color: #333;
    display: inline-block;
}
.re-title {
    border-bottom: solid 1px #ededed;
}
.neirong2 ul {
    line-height: 42px;
    background-color: #f5f5fa;
    border: solid 1px #d7dce6;
    text-align: center;
    font-size: 14px;
    color: #999999;
}
/* 签约进展 */
.application-name {
    font-size: 14px;
    color: #333;
    font-weight: bold;
    margin-right: 10px;
    display: inline-block;
    height: 40px;
    line-height: 40px;
}
.fl {
    float: left;
}
.vertical-line {
    border-right: 1px solid #ccc;
    height: 25px;
    width: 1px;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}
.div-header {
    padding: 0px 10px 0px 20px;
    height: 40px;
    border-bottom: 1px solid #DCDCDC;
}
.div-header img {
    cursor: pointer;
}
.dataa .xinxi {
    color: #999999;
    font-size: 14px;
    margin: 5px;
}
.xinxitop {
    width: 227px;
}
.dataa .xinxi{
    margin-top: 5px;
}
.dataa .xinxi span {
    font-size: 16px;
    color: #333333;
}
/* 进度条 */
.layui-progress {
    width: 240px;
    margin: 10px;
}
.layui-progress-bar {
    background-color: #ff9526;
    display: inline-block;
    height: 100px;
    text-align: center;
}
/* 边框 */
.quote {
    position: relative;
    top: 58px;
    left: 0;
    width: 4px;
    height: 81px;
    background-color: #12b7f5;
    border-radius: 3px;
    margin-right: 20px;
}
/* 康复期标签 */
.biaoqian {
    padding: 1px 4px 1px 4px;
    background-color: #12b7f5;
    color: #ffffff;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}
.biaoqian span {
    display: inline-block;
    font-size: 12px;
    width: 6px;
    height: 6px;
    background-color: #ffffff;
    border-radius: 50%;
    margin: 0 4px 2px 0;
}
/* 数据 */
.data {
    border: 1px solid #d7dce6;
    margin: 10px;
    border-radius: 10px;
    height: 142px;
    margin-bottom: 0;
    min-width: 1235px;
}
/* .dataa {} */
.dataatop {
    position: relative;
    bottom: 41px;
    left: 20px;
    width: 210px;
    flex-wrap: wrap;
    justify-content: space-between;
}
.dataabom {
    width: 380px;
    background-color: #fafaeb;
    color: #666666;
    padding-left: 5px;
}
.dataabom p {
    margin: 0;
    padding: 8px 0 10px 10px;
}
.dataabom p:nth-child(1) {
    color: #333333;
    padding-bottom: 0;
}
.dac {
    width: 250px;
    position: relative;
    justify-content: space-between;
}
.doc {
    background-color: #f5f5fa;
    width: 280px;
    height: 100px;
    margin: 20px;
    text-align: center;
}
.doc:nth-child(1){
            margin-left: 164px;
}
.fdt,
.fdb {
    margin: 10px;
    width: 200px;
    justify-content: space-around;
    margin-left: 51px;
}
.fdb {
    width: 100%;
    justify-content: space-between;
    text-align: center;
    margin: 0;
    height: 19px;
    margin-top: 10px;
}
.fdb p {
    width: 100%;
}
.fdb p:nth-child(1) {
    border-right: 1px solid #d7dce6;
}
.fdb p span {
    color: #333333;
    font-size: 20px;
    margin-left: 25px;
}
.datad {
    justify-content: center;
    margin-right: 66px;
}
.datad button {
    width: 80px;
    height: 28px;
    outline: none;
    border: 0;
    font-size: 14px;
    border-radius: 2px;
    color: #ffffff;
    margin: 10px;
}
@media screen and (max-width:1450px) {
    .dataabom {
        width: 280px;
    }
}
/* 细节 */
.detail {
    margin: 0 60px;
    height: 60px;
    border: 1px solid #d7dce6;
    border-top: 0;
    min-width: 1000px;
}
.quote2 {
    width: 4px;
    height: 31px;
    background-color: #12b7f5;
    border-radius: 3px;
    margin-right: 20px;
}
.detailc {
    width: 300px;
}
.cred {
    color: #ff3b30;
}
.corg {
    color: #ff9526;
}
.cblue {
    color: #12b7f5;
}
.cgre {
    color: #999999;
}
.detaild a {
    margin-right: 40px;
    color: #12b7f5;
    text-decoration: underline;
}
.miaoshu {
    margin-left: 10px;
}
.miaoshu p span {
    color: #333333;
    font-size: 16px;
}
.miaoshu p:nth-child(2) {
    text-align: left;
}
.miaoshu p {
    width: 222px;
    text-align: left;
}
.inline-block{
    display: inline-block;
}
.datab{
    width: 775px;
}

app/rehabilitation/html/guide_the_message.html

@@ -0,0 +1,316 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>完成项目服务</title>
		<link rel="stylesheet" href="../../../css/bootstrap.min.css" />
	    <link rel="stylesheet" type="text/css" href="../../../css/style.min.css"/>
	    <link rel="stylesheet" type="text/css" href="../../../css/cross.css"/>
		<style type="text/css">
			[v-cloak]{display: none;}
			.flex-box{display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */         /* OLD - Firefox 19- (buggy but mostly works) */
				  display: -ms-flexbox;      /* TWEENER - IE 10 */     /* NEW - Chrome */
				  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
				  -webkit-box-pack: center;
				  -ms-flex-pack: center;
				  justify-content: center;
				  -webkit-box-align: center;
				  -ms-flex-align: center;
				  align-items: center;
				  -ms-flex-wrap: wrap;
				      flex-wrap: wrap;
				  }
			.flex-box-item{-webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
				  -moz-box-flex: 1;         /* OLD - Firefox 19- */
				  -webkit-flex: 1;          /* Chrome */
				  -ms-flex: 1;              /* IE 10 */
				  width: 50%;               /* For old syntax, otherwise collapses. */
				  flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ */
				 position: relative;}
			.icon{width: 12px;height: 12px;vertical-align: middle;background-size: 100% auto;background-repeat: no-repeat;display: inline-block;background-position: center center;}
			.icon-arrow-down{background-image: url(../images/icon/tiaozhuan_xia_icon.png);}
			.icon-gouxuan{background-image: url(../images/icon/gouxuan_lanse_icon.png);}
			.icon-check{background-image: url(../images/icon/zhankai_btn.png);}
			.icon-arrow-right{background-image: url(../images/icon/tiaozhuan_icon.png);background-size: auto 100%;}
			.icon-check,.icon-arrow-down{transition: all .3s ease-in-out;}
			.active .icon-check,.collapsed .icon-arrow-down{transform: rotateZ(180deg);}
			.icon-16{width: 16px;height: 16px;}
			.icon-18{width: 18px;height: 18px;}
			.service-top{font-size: 0;line-height: 1;font-weight: 500;}
			.service-name span{vertical-align: middle;font-size: 16px;}
			.service-name span+span{margin-left: 10px;}
			.service-name{line-height: 1.5;margin-bottom: 0;}
			.service-index{border: 1px solid #12b7f5;width: 16px;line-height: 1;height: 16px;font-size: 14px;display: inline-block;text-align: center;color: #12b7f5;}
			.label-group{padding-left: 26px;}
			.label-group span{color: #12b7f5;font-size: 14px;line-height: 1;margin-top: 10px;}
			.label-blue{border-radius: 5px;border: solid 1px #12b7f5;padding: 4px 15px;display: inline-block;margin-right: 27px;}
			.panel-body{padding: 20px 20px 0;font-size: 14px;color: #999;}
			.service-content{line-height: 30px;padding-bottom: 15px;border-bottom: 1px solid #d7dce6;}
			.service-address{border-bottom: 1px solid #d7dce6;}
			.btn-yuyue{background-color: #02cfb9;color: #fff;}
			.btn-yuyue:hover,.btn-yuyue:link{color: #fff;background-color: #01c1ad;}
			.btn-fuwuma{background-color: #2dbe55;color: #fff;}
			.btn-fuwuma:hover,.btn-fuwuma:link{color: #fff;background-color: #209440;}
			.btn-zhidao{background-color: #12b7f5;color: #fff;}
			.btn-zhidao:hover,.btn-zhidao:link{color: #fff;background-color: #10a0d6;}
			.service-operation .btn{width: 90px;}
			.view-detail{color: #12b7f5;cursor: pointer;}
			.record-list{max-height: 0;overflow: hidden;transition: all .3s linear;}
			.record-list.active{max-height: 999px;}
			.record-item{background-color: #f5f5fa;margin-bottom: 10px;padding: 10px;}
			.complete-title{font-size: 14px;color: #333;padding: 10px 0;border-bottom: 1px solid #D7DCE6;}
			.guanlian-list{border: 1px solid #d7dce6;padding: 3px 5px;}
			.upload-box{padding: 10px 0 10px 10px;overflow: hidden;border: 1px solid #d7dce6;}
			.upload-box li{width: 60px;height: 60px;position: relative;display: block;float: left;margin-right: 10px;}
			.upload-box li img{width: 100%;display: block;}
			.upload-img-box{width: 100%;height: 100%;overflow: hidden;}
			.delete-img{position: absolute;right: -5px;top: -5px;color: #fff;background-color: #ccc;border-radius: 100%;text-align: center;line-height: 15px;width: 15px;height: 15px;}
			.upload-img{position: absolute;left: 0;right: 0;top: 0;bottom: 0;opacity: 0;z-index: 3;font-size: 0;width: 100%;height: 100%;}
			.add-img{font-size: 40px;line-height: 60px;font-weight: 500;width: 60px;height: 60px;display: block;text-align: center;border: 1px dashed #d7dce6;color: #bec8d2;}
			.yslb>span:after{content: '、';}
			.yslb>span:last-child:after{display: none;}
		</style>
	</head>
	<body>
		<div id="app" v-cloak role="tablist" aria-multiselectable="true">
		  <div class="panelcurPage">
		    <div class="panel-heading" role="tab" @click="changeCollapseIndex(index)">
		      <h4 class="panel-title">
		        <a role="button" class="flex-box">
		          <div class="flex-box-item service-top">
		          	<p class="service-name"><span class="service-index">1</span><span>{{service.title}}</span></p>
		         	<div class="label-group">
		         		<span class="pull-right mt5"><i v-if="service.statusName=='已完成'" class="icon icon-gouxuan icon-18 mr5"></i>{{service.statusName}}</span>
		         		<span class="label-blue">{{service.shortExecuteTime}}</span>
		         		<span class="label-blue" v-for="doctor in service.executeDoctorList">{{doctor}}</span>
		         	</div>
		          </div>
		          <!--<span class="icon icon-arrow-down ml50"></span>-->
		        </a>
		      </h4>
		    </div>
		    <div class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
		      	<div class="panel-body">
		      		<div class="service-content">{{service.content}}</div>
		      		<div class="service-address ptb20">
		      			<div class="flex-box">
		      				<div class="flex-box-item">
		      					<p class="m0">地点：{{service.hospitalName}}</p>
		      					<p class="m0">时间：{{service.executeTime | formatDate}}</p>
		      				</div>
		      				<div class="flex-box-item">
		      					<p class="m0 yslb">执行：<span v-for="(doctor,index) in service.executeDoctorList">{{doctor}}</span></p>
		      					<p class="m0">收费：{{service.expense}}元</p>
		      				</div>
		      			</div>
		      		</div>
		   		</div>
	       </div>
		  </div>
	   		<div class="panel-body">
	      		<div class="service-operation pt10">
	      			<p><span class="pull-right view-detail" :class="{active:isCollapse}" @click="chakan"><i class="icon icon-check mr5 icon-16"></i>{{isCollapse?'收起详情':'查看详情'}}</span>指导与汇报记录</p>
	      			<div class="record-list" :class="{active:isCollapse}">
	      				<div class="record-item" v-for="item in service.messageList">
	      					<div class="flex-box c-999 f14">
		      					<div class="flex-box-item">
		      						{{item.adminTeamName}}
		      					</div>
		      					<div class="flex-box-item">
		      						{{item.createTime}}
		      					</div>
		      				</div>
		      				<div class="f14 c-333">{{item.content}}</div>
	      				</div>
	      			</div>
	      		</div>
	      		<div class="complete-info pt10">
	      			<div class="complete-title">完成情况</div>
	      			<div class="ptb10">
	      				<p class="f14 mb5"><span class="c-999">完成情况：</span>{{service.completeTime}}</p>
	      				<p class="f14 mb5"><span class="c-999">执行医生：</span>{{service.operatorDoctorName}}</p>
	      			</div>
	      		</div>
	      		<div class="note-info pt10">
	      			<p class="f14 c-333">服务完成笔记</p>
	      			<textarea v-if="service.status!=1" class="form-control" style="resize: none;" rows="4" placeholder="可备注您的服务记录" v-model="service.node"></textarea>
	      			<div v-if="service.status==1">{{service.node}}</div>
	      		</div>
	      		<div class="note-info pt10" style="display: none;">
	      			<p class="f14 c-333">关联记录</p>
	      			<p class="guanlian-list text-center">
	      				<span class="pull-right"><i class="icon icon-arrow-right"></i></span>随访记录sfs
	      			</p>
	      		</div>
	      		<div class="note-info pt10">
	      			<p class="f14 c-333">相关记录</p>
	      			<ul class="upload-box"  v-if="service.status!=1">
	      				<li class="flex-box" v-for="(img,index) in upImgs">
	      					<div class="upload-img-box">      						
		      					<img :src="img.baseUrl" />
	      					</div>
	      					<a class="delete-img" @click="deleteImg(index)">&times;</a>
	      				</li>
	      				<li class="flex-box" v-if="upImgs.length<5">
	      					<span class="add-img">＋</span>
	      					<input type="file" @change="upLoadImgToBase64" class="upload-img" />
	      				</li>
	      			</ul>
	      			<ul class="upload-box"  v-if="service.status==1">
	      				<li class="flex-box" v-for="img in service.relationRecordImg">
	      					<div class="upload-img-box">      						
		      					<img :src="img | getImgUrl" />
	      					</div>
	      				</li>
	      			</ul>
	      		</div>
	      		<div class="text-center ptb50" v-if="service.status!=1">
	      			<button class="btn btn-zhidao" @click="qrwc">确认完成</button>
	      		</div>
	      	</div>
		</div>
		<script type="text/javascript" src="../../../js/vue.js"></script>
		<script type="text/javascript" src="../../../js/jquery-2.2.4.js" ></script>
		<script type="text/javascript" src="../../../api/http-request.js"></script>
		<script type="text/javascript" src="../../../api/rehabilitation-api.js"></script>
		<script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			!function(){
				var httpData=GetRequest();
				new Vue({
					el:"#app",
					data:{
						imgData: {
				            accept: 'image/gif, image/jpeg, image/png, image/jpg',
				        },
				        isCollapse:false,
				        upImgs:[],
				        upImgArr:[],
				        planid:httpData['planid'],
				        service:[]
					},
					mounted:function(){
						this.getServiceItem();
					},
					methods:{
						getServiceItem:function(){
							var vm=this;
							var loadding = top.layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
							rehaAPI.serviceItem({planDetailId:vm.planid}).then(function(res){
								top.layer.close(loadding);
								if(res.status==200){
									vm.service=res.data;
								}else{
									top.layer.msg(res.msg,{icon:5});
								}
							})
						},
						deleteImg:function(idx){
							console.log(idx)
							this.upImgs.splice(idx,1)
						},
						chakan:function(){
							this.isCollapse=!this.isCollapse;
						},
						upLoadImgToBase64:function(){
							var vm=this;
				            var img1=event.target.files[0];  
				            console.log(img1)
				            var reader =new FileReader();  
				            var type=img1.type;//文件的类型，判断是否是图片  
				            var size=img1.size;//文件的大小，判断图片的大小  
				            if(this.imgData.accept.indexOf(type) == -1){  
				                alert('请选择我们支持的图片格式！');  
				                return false;  
				            }  
				            if(size>3145728){  
				                alert('请选择3M以内的图片！');  
				                return false;  
				            }
				            reader.readAsDataURL(img1);
			             	reader.onload = function (e) {
			             		vm.upImgs.push({baseUrl:e.target.result});
			             		vm.upImgArr.push(img1);
//			             		vm.uploadImg(vm.upImgArr);
			             	}
						},
						qrwc:function(){
							var vm=this;
							vm.uploadImg(vm.upImgArr,vm.updateNoteAndImageRehabilitationOperate);
						},
						 //上传图片
				        uploadImg:function(data,cb){
				        	var vm=this;
				        	var len = data.length;
						    if (!len){
						        cb && cb();
						    }else{
						    	var file=data[len-1];
						    	var formData = new FormData();
								formData.append('file', file);
						    	rehaAPI.upload(formData).then(function(res){
						    		console.log(res)
						    		if(res.status==200){
						    			console.log(vm.upImgs[len-1])
						    			vm.upImgs[len-1].img=res.data;
						    			data.pop();
						    			vm.uploadImg(data,cb);
						    		}
								})
						    }
						},
						updateNoteAndImageRehabilitationOperate:function(){
							var vm=this;
							var _image=[];
							for(var i in vm.upImgs){
								_image.push(vm.upImgs[i].img);
							}
							var params={
								planDetailId:vm.planid,
								node:vm.service.node,
								image:JSON.stringify(_image)
							}
							var loadding = top.layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
							rehaAPI.updateNoteAndImageRehabilitationOperate(params).then(function(res){
					    		top.layer.close(loadding);
					    		console.log(res)
					    		if(res.status==200){
					    			vm.getServiceItem();
					    			parent.serviceItem.getServiceItemList();
					    		}
							})
						},
			       	},
					filters:{
					  	formatDate:function(value, format) {
					  		if(!value) return ;
					  		var fmt=format || "yyyy-MM-dd hh:mm";
							var date = new Date(value);
							if (/(y+)/.test(fmt)) {
								fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
							}
							let o = {
								'M+': date.getMonth() + 1,
								'd+': date.getDate(),
								'h+': date.getHours(),
								'm+': date.getMinutes(),
								's+': date.getSeconds()
							};
							for (let k in o) {
								if (new RegExp(`(${k})`).test(fmt)) {
									let str = o[k] + '';
									fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : ('00' + str).substr(str.length));
								}
							}
							return fmt;
						},
						getImgUrl:function(value){
							var url=httpRequest.getImgUrl(value);
							return url;
						}
					}
				})
			}()
		</script>
	</body>
</html>

app/rehabilitation/html/health_control.html

@@ -0,0 +1,158 @@
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="shortcut icon" href="../../../favicon.ico">
    <link rel="stylesheet" type="text/css" href="../../../css/bootstrap.min.css" />
    <link rel="stylesheet" href="../../../css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/form.ui.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
    <link rel="stylesheet" href="../../../css/cross-searchui.css">
    <link rel="stylesheet" href="../../../plugins/layui-v2.3.0/layui/css/layui.css">
    <link rel="stylesheet" href="../css/health_control.css">
</head>
<body>
    <div id="app" v-cloak>
        <div class="re-title no-select">
            <div class="name">康复管理</div>
        </div>
        <!-- 内容 -->
        <div class="neirong1 flex-box">
            <div class="neirongrigh flex-box">
                <div class="dataCell form-group listform-sel-bor">
                    <div class="w160 inline c-vam">
                        <div class="input-group">
                            <input id="Type" placeholder="请选择疾病类型" type="text" class="form-control bgc-fff" name="Type" readonly="readonly">
                            <div class="input-group-btn">
                                <button type="button" class="btn btn-white dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu dropdown-menu-right">
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="dataCell form-group listform-sel-bor" style="margin-left:20px;">
                    <div class="w160 inline c-vam">
                        <div class="input-group">
                            <input id="Status" placeholder="请选择安排类型" type="text" class="form-control" name="Status" readonly="readonly">
                            <div class="input-group-btn">
                                <button type="button" class="btn btn-white dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu dropdown-menu-right">
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="c-ser-div">
                    <div class="c-ser-main">
                        <input type="text" class="c-ser-input" placeholder="请输入患者姓名" data-form="clear" v-model="name" />
                    </div>
                </div>
                <div class="c-ser-btn" id="queryBtn" @click="search(1)">
                    <a href="javascript:;">搜索</a>
                </div>
            </div>
            <label class="checkbox all-checkbox">
                <input type="checkbox" name="tags" class="c-hide" value="1" id="c" @click="daiban()">
                <i class="icon-chkbox"></i>
                今日代办
            </label>
            <div class="neironglef">
                <button>新康复安排</button>
                <button>模版管理</button>
            </div>
        </div>
        <div class="neirong2">
            <ul class="c-blocks-3 ul">
                <li>患者信息</li>
                <li>医生及计划信息</li>
                <li>操作</li>
            </ul>
            <!-- table -->
            <table class="data table">
                <tr v-if="!wujilu" v-for="(data, index) in tablelist" class="datas">
                    <td>
                        <div class="all flex-box">
                            <div class="dataa flex-box">
                                <div :class="{ quote: isActive}"></div>
                                <img :src="setImgSrc(data.photo)" width="40" height="40" class="c-images-cycle" />
                                <p class="xinxi">
                                    <span>{{data.patientName}}
                                    </span>({{data.sex}}&nbsp;{{data.age}}岁)
                                    <br>{{data.hospitalName}}</p>
                                <p class="biaoqian">
                                    <span></span>{{data.healthyCondition}}</p>
                            </div>
                            <div class="datab flex-box">
                                <p>{{data.planTypeName}}</p>
                                <div class="layui-progress layui-progress-big" :lay-filter="data.id" lay-showpercent="true">
                                    <div class="layui-progress-bar" lay-percent="">
                                    </div>
                                </div>
                                <span class="cgre">{{data.allFinishCount}}/</span>
                                <span class="cgre">{{data.allCount}}</span>
                                <p class="cred">今日代办:
                                    <span>{{data.todayBacklogCount}}</span>
                                </p>
                                <p class="cgre margin-10">已完成:
                                    <span>{{data.finishedCount}}</span>
                                </p>
                                <p class="cgre">未完成:
                                    <span>{{data.unfinishedCount}}</span>
                                </p>
                            </div>
                            <div class="datad flex-box">
                                <button @click="morePlan(data)">
                                    <a href="javascript: void(0)">更多计划</a>
                                </button>
                                <button @click="checkPlan(data)">
                                    <a href="javascript: void(0)">查看计划</a>
                                </button>
                                <button class="" @click="stop(data)" id="button_id">终止计划</button>
                            </div>
                        </div>
                    </td>
                </tr>
                <tr v-if="wujilu">
                    <td>
                        <div class="nodata all" style="line-height: 60px;">
                            无记录
                        </div>
                    </td>
                </tr>
            </table>
            <navigation :pages="pagetotal" :current="currentPage" @navpage="search" :total="total" :size="pagesize"></navigation>
        </div>
    </div>
    <script type="text/javascript" src="../../../js/vue.js"></script>
    <script type="text/javascript" src="../../../js/jquery-2.2.4.js"></script>
    <script type="text/javascript" src="../../../js/cross.ui.js"></script>
    <script src="../../../plugins/layer/layer.min.js"></script>
    <script type="text/javascript" src="../../../plugins/layui-v2.3.0/layui/layui.js"></script>
    <script src="../../../component/common/pagination.js"></script>
    <script src="../../../plugins/suggest/bootstrap-suggest.min.js"></script>
    <script src="../../../js/underscore.js"></script>
    <script src="../../../api/http-request.js"></script>
    <script src="../../../api/healthy-control-api.js"></script>
    <script src="../js/health_control.js"></script>
   
</body>
</html>

app/rehabilitation/html/moreplan.html

@@ -0,0 +1,168 @@
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="shortcut icon" href="../../../favicon.ico">
    <link rel="stylesheet" href="../../../css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
    <link rel="stylesheet" href="../../../plugins/layui-v2.3.0/layui/css/layui.css">
    <link rel="stylesheet" href="../../../css//bootstrap.min.css">
    <link rel="stylesheet" href="../css/moreplan.css">
</head>
<body>
    <div id="app">
        <div class="re-title no-select">
            <div class="name">康复管理</div>
        </div>
        <header-tab :appname="appname" :isback="isback" :isrefresh="isrefresh"></header-tab>
        <div class="neirong2">
            <ul class="c-blocks-3">
                <li>患者信息</li>
                <li>医生及计划信息</li>
                <li>操作</li>
            </ul>
            <!-- henfu -->
            <div class="henfu">
                <div class="data flex-box">
                    <div class="dataa">
                        <div class="quote"></div>
                        <div class="dataatop">
                            <div class="dac flex-box">
                                <p>
                               <img src="../../../images/d-default.png" width="40" height="40" class="c-images-cycle" />
                                </p>
                                <div class="xinxi">
                                    <div class="xinxitop flex-box">
                                            <p>{{name}}&#x3000;({{sex}}{{age}}岁)
                                                </p>
                                                <p class="biaoqian">
                                                    <span></span>康复期
                                                </p>
                                    </div>
                                  
                                    <p>{{hospital}}</p>
                                </div>
                            </div>
                            <div class="dataabom">
                                <p>疾病类型:</p>
                                <p v-for="(data1, index) in diseaseList" class="inline-block">{{data1}}</p>
                            </div>
                        </div>
                    </div>
                    <div class="datab flex-box">
                        <div class="doc fdoctor">
                            <div class="fdt flex-box">
                                <img src="../../../images/d-default.png" width="40" height="40" class="c-images-cycle">
                                <div class="miaoshu cgre">
                                    <p>
                                        <span>家庭医生</span>&nbsp;{{specialistAdminTeamName}}</p>
                                    <p class="mt10">{{familyHospitalName}}</p>
                                </div>
                            </div>
                            <div class="fdb flex-box">
                                <p>完成项目
                                    <span>{{signFamilyFinishItemCount}}</span>
                                </p>
                                <p>服务记录
                                    <span>{{signFamilyServiceRecordCount}}</span>
                                </p>
                            </div>
                        </div>
                        <div class="doc sdoctor">
                            <div class="fdt flex-box">
                                <img src="../../../images/d-default.png" width="40" height="40" class="c-images-cycle">
                                <div class="miaoshu cgre">
                                    <p>
                                        <span>专科医生</span>&nbsp;{{specialistAdminTeamName}}</p>
                                    <p class="mt10">{{specialistHospitalName}}</p>
                                </div>
                            </div>
                            <div class="fdb flex-box">
                                <p>完成项目
                                    <span>{{specialistFinishItemCount}}</span>
                                </p>
                                <p>服务记录
                                    <span>{{specialistServiceRecordCount}}</span>
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="datad flex-box">
                        <button class="falsebutton" @click=noOpen()>健康指导</button>
                        <button class="falsebutton" @click=noOpen()>随访</button>
                        <button class="falsebutton" @click=noOpen()>复诊预约</button>
                    </div>
                </div>
                <!-- 细节点 -->
                <div class="detail flex-box" v-for="(data, index) in tablelist">
                    <div class="detaila flex-box">
                        <div class="quote2"></div>
                        {{data.planTypeName}}
                    </div>
                    <div class="detailb flex-box">
                        <span class="cblue" id="span_font">进行中</span>
                        <div class="layui-progress layui-progress-big" :lay-filter="data.planId" lay-showpercent="true">
                            <div class="layui-progress-bar" lay-percent="">
                            </div>
                        </div>
                        <span class="cgre">{{data.allFinishCount}}/</span>
                        <span class="cgre">{{data.allCount}}</span>
                    </div>
                    <div class="detailc flex-box">
                        <p class="cred">今日项目:
                            <span>{{data.todayBacklogCount}}</span>
                        </p>
                        <p class="cgre">已完成:
                            <span>{{data.finishedCount}}</span>
                        </p>
                        <p class="cgre">未完成:
                            <span>{{data.unfinishedCount}}</span>
                        </p>
                    </div>
                    <div class="detaild">
                        <a href="">查看患者</a>
                        <a href="">查看计划</a>
                        <a href="javascript: void(0)" @click="stop(data)" id="button_id">终止计划</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="../../../js/vue.js"></script>
    <script type="text/javascript" src="../../../js/jquery-2.2.4.js"></script>
    <script type="text/javascript" src="../../../js/cross.ui.js"></script>
    <script src="../../../js/underscore.js"></script>
    <script src="../../../js/util.js"></script>
    <script src="../../../plugins/layer/layer.min.js"></script>
    <script type="text/javascript" src="../../../plugins/layui-v2.3.0/layui/layui.js"></script>
    <script src="../../../api/http-request.js"></script>
    <script src="../../../api/healthy-control-api.js"></script>
    <script src="../../../component/common/event-bus.js"></script>
    <script src="../../../component/common/vuedals.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/header-tab.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/moreplan.js"></script>
</body>
</html>

app/rehabilitation/html/rehabilitation_management.html

@@ -0,0 +1,529 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>康复管理</title>
		<link rel="shortcut icon" href="../../favicon.ico">
	    <link rel="stylesheet" type="text/css" href="../../../css/bootstrap.min.css"/>
	    <link rel="stylesheet" type="text/css" href="../../../css/style.min.css"/>
	    <link rel="stylesheet" type="text/css" href="../../../css/cross.css"/>
	    <link rel="stylesheet" type="text/css" href="../css/date.css" />
		<style type="text/css">
			.flex-box{display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */         /* OLD - Firefox 19- (buggy but mostly works) */
				  display: -ms-flexbox;      /* TWEENER - IE 10 */     /* NEW - Chrome */
				  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
				  -webkit-box-pack: center;
				  -ms-flex-pack: center;
				  justify-content: center;
				  -webkit-box-align: center;
				  -ms-flex-align: center;
				  align-items: center;
				  -ms-flex-wrap: wrap;
				      flex-wrap: wrap;
				  }
			.flex-box-item{-webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
				  -moz-box-flex: 1;         /* OLD - Firefox 19- */
				  -webkit-flex: 1;          /* Chrome */
				  -ms-flex: 1;              /* IE 10 */
				  width: 50%;               /* For old syntax, otherwise collapses. */
				  flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ */
				 position: relative;}
			[flex-grow="2"]{-webkit-box-flex: 2;-ms-flex-positive: 2;flex-grow: 2;}
			[flex-grow="5"]{-webkit-box-flex: 5;-ms-flex-positive: 5;flex-grow: 5;}
			body,html,.c-container{height: 100%;}
			.rehabilition{height: 100%;padding-top: 49px;max-width: 1620px;margin: 0 auto;}
			.nav-content-right{height: 100%;overflow: auto;}
			.search-left{border-right: solid 1px #d7dce6;background-color: #f5f5f5;height: 100%;}
			.mw400{max-width: 400px;}
			.search-condition{padding: 20px 10px;border-bottom: solid 1px #d7dce6;}
			.search-condition p{font-size: 14px;margin-bottom: 15px;}
			.task-list{padding-left: 10px;overflow: hidden;}
			.task-list li{width: 90px;cursor: pointer;text-align: center;display: block;float: left;border-radius: 14px;font-size: 14px;margin-left: 20px;margin-bottom: 20px;color: #333333;border: solid 1px #d7dce6;padding: 3px;}
			.task-list li.active{background-color: #12b7f5;color: #fff;}
			.btn-search{background-color: #12b7f5;color: #fff;border-radius: 0;width: 120px;margin-top: 30px;}
			.btn-search:hover,.btn-search:focus,.btn-search:active,.btn-search:hover:active{background-color: #00ADEE;color: #fff;}
			/*日历*/
			.calendar-content{margin: 0 auto;}
			/*图例注释*/
			.calendar-descript{padding: 15px 20px;background-color: #fff;}
			.calendar-descript span{vertical-align: middle;}
			.icon{width: 12px;height: 12px;vertical-align: middle;background-size: 100% 100%;background-repeat: no-repeat;display: inline-block;}
			.icon-blue{background-color: #12b7f5;border-radius: 2px;}	
			.icon-green{background-color: #2dbe55;border-radius: 2px;}
			.icon-flag{background-image: url(../images/woderenwu_icon.png);}
			.icon-shuaxin{background-image: url(../images/icon/shuaxin.png);}
			.icon-shuaxin:hover{background-image: url(../images/icon/shuaxin1.png);}
			.icon-back{background-image: url(../images/icon/fanhui_icon.png);}
			.icon-back:hover{background-image: url(../images/icon/fanhui02_icon.png);}
			.icon-check{background-image: url(../images/wancheng_icon.png);}
			.icon-prev{background-image: url(../images/icon/houtui_icon.png);}
			.icon-next{background-image: url(../images/icon/qianjing_icon.png);}
			.icon-rili{background-image: url(../images/icon/rilibiao02_icon.png);}
			.rili:hover .icon-rili,.active .icon-rili{background-image: url(../images/icon/rilibiao_icon.png);}
			.icon-liebiao{background-image: url(../images/icon/shijianzhou_icon.png);}
			.shijianzhou:hover .icon-liebiao,.active .icon-liebiao{background-image: url(../images/icon/shijianzhou02_icon.png);}
			
			.icon-20{width: 20px;height: 20px;}
			.icon-16{width: 16px;height: 16px;}
			/*周期*/
			.calendar-week{background-color: #ebebf5;border: solid 1px #d7dce6;padding: 11px;}
			/*日期*/
			.calendar-days>.flex-box{border-bottom: 1px solid #d7dce6;}
			.calendar-day{height: 135px;border-left: 1px solid #d7dce6;cursor: pointer;position: relative;padding: 5px;width: 14.28571428%;border-bottom: 1px solid #d7dce6;}
			.calendar-days .calendar-day:first-child{border-left-width: 0;}
			.calendar-day:hover{-webkit-box-shadow: 0 0 0 1px #12b7f5 inset;box-shadow: 0 0 0 1px #12b7f5 inset;}
			.calendar-day.current-day{background-color: #ddf6fe;}
			.no-server{text-align: center;top: 50%;position: absolute;left: 0;right: 0;color: #c8c8c8;font-size: 18px;}
			/*彩带*/
			.coloured-ribbon{font-size: 12px;width: 22px;text-align: center;height: 40px;display: inline-block;padding-top: 8px;line-height: 1;color: #fff;}
			.coloured-box{top: 0;position: absolute;right: 5px;}
			.coloured-ribbon-blue{background: url(../images/biaoqian-lanse_img.png) center center / 100% 100% no-repeat;}
			.coloured-ribbon-green{background: url(../images/biaoqian-lvse_img.png) center center / 100% 100% no-repeat;margin-left: 5px;}
			.task-icon{position: absolute;right: 63px;top: 10px;min-height: 20px;}
			.task-icon .icon-check{position: absolute;right: -3px;bottom: 0;width: 15px;height: 15px;}
			.day-number{font-size: 28px;color: #999999;margin-bottom: 0;line-height: 1;}
			/*进度条*/
			.progress-box{position: absolute;bottom: 0;left: 0;right: 0;padding: 5px;}
			.progress-box .progress{margin-bottom: 9px;background-color: #d7dce6;border-radius: 10px;position: relative;}
			.progress-box .progress > span{position: absolute;left: 0;right: 0;text-align: center;color: #333333;top: 2px;}
			.progress-box .progress-bar{background-color: #12b7f5;}
			.progress-box .progress-bar-success{background-color: #2dbe55;}
			/*页头*/
			.page-title{position: fixed;top: 0;left: 0;right: 0;padding: 9px;border-bottom: 1px solid #d7dce6;z-index: 5;max-width: 1620px;margin: 0 auto;background-color: #fff}
			.page-title-name{padding-right: 15px;font-size: 14px;border-right: 1px solid #d7dce6;display: inline-block;margin-right: 10px;}
			.page-title span{vertical-align: middle;}
			.mr10{margin-right: 10px;}
			.page-title .icon{cursor: pointer;}
			.currentDay{font-size: 16px;margin: 0 25px;vertical-align: middle;width: 100px;text-align: justify;text-align-last: justify;display: inline-block;}
			.switch-list{border: solid 1px #12b7f5;border-radius: 6px;overflow: hidden;}
			.switch-list .icon{position: relative;top: 3px;}
			.rili,.shijianzhou{width: 40px;height: 28px;display: inline-block;float: left;background-color: #fff;}
			.rili.active,.shijianzhou.active,.rili:hover,.shijianzhou:hover{background-color: #12b7f5;border-radius: 5px;}
			/*列表展示*/
			.time-axis td{border: none !important;color: #999;}
			.time-axis th{background-color: #f5f5fa;border-bottom: solid 1px #d7dce6;}
			.time-axis td p{color: #999;}
			.ellipsis{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
			.time{position: relative;}
			.time-box{position: relative;padding: 8px 50px 8px 8px!important;}
			.cur-status{position: absolute;z-index: 3;right: 5px;top: 50%;padding: 8px;line-height: 1;margin-top: -12.5px;border-radius: 100%;color: #fff;}
			.cur-status:empty{margin-top: -8px;right: 12.5px;background-color: #d7dce6;}
			[is-future="1"]{background-color: #dff5fc;}
			.time-axis tr:hover{background-color: #f5f5fa;}
			.time-axis tr:hover p{color: #333333;}
			[is-future="1"] .cur-status,[is-future="2"] .cur-status{background-color: #12b7f5;}
			[is-future="3"] .cur-status{background-color: #5cb85c;}
			.time-box:after{content: '';position: absolute;right: 0;z-index: 2;right: 19px;height: 100%;width: 1px;background-color: #d7dce6;top: 50%;}
			.time-axis tr:nth-last-of-type(1) .time-box:after{display: none;}
			.view-task{text-align: center;}
			[v-cloak]{display: none;}
		</style>
	</head>
	<body>
		<div class="c-container" id="app" v-cloak>
			<div class="page-title flex-box">
				<div class="flex-box-item mw400" flex-grow="2">				
					<span class="page-title-name">康复计划</span><i class="icon icon-back icon-16 mr10"></i><i class="icon icon-shuaxin icon-16"></i>
				</div>
				<div class="flex-box-item text-center" flex-grow="5">
					<div class="pull-right switch-list">
						<span class="rili" :class="{active:(tabStatus==1)}" @click="tabStatus=1"><i class="icon icon-rili icon-20"></i></span>
						<span class="shijianzhou" :class="{active:(tabStatus==2)}" @click="tabStatus=2"><i class="icon icon-liebiao icon-20"></i></span>
					</div>
					<span style="position: relative;top: 5px;">
						<i class="icon icon-prev icon-20" @click="preMonth"></i>
						<span class="currentDay">{{currentDay}}</span>
						<i class="icon icon-next icon-20" @click="nextMonth"></i></span>
				</div>
			</div>
			<div class="flex-box rehabilition">
				<div class="flex-box-item search-left mw400" flex-grow="2">
					<div class="search-condition">
						<p>快速找任务</p>
						<ul class="task-list">
							<li :class="{'active':(searchTask==task.code)}" v-for="task in taskArr" @click="changeTask(task.code)">{{task.name}}</li>
						</ul>
						<p>任务状态</p>
						<ul class="task-list">
							<li :class="{'active':(status==sts.code)}" v-for="sts in statusArr" @click="changeStatus(sts.code)">{{sts.name}}</li>
						</ul>
					</div>
					<div class="text-center">
						<button class="btn btn-search" @click="goToLoadData">确认</button>
					</div>
				</div>
				<div class="flex-box-item nav-content-right" flex-grow="5">
					<div class="calendar-content" v-show="tabStatus==1">
						<div class="calendar-descript">
							<span>图例注释： </span><i class="icon icon-blue"></i> <span>专科团队</span>&emsp;<i class="icon icon-green"></i> <span>家医团队</span>&emsp; <i class="icon icon-flag"></i> <span>我的任务</span>
						</div>
						<div class="calendar-week">
							<div class="flex-box text-center">
								<div class="flex-box-item">
									周一
								</div>
								<div class="flex-box-item">
									周二
								</div>
								<div class="flex-box-item">
									周三
								</div>
								<div class="flex-box-item">
									周四
								</div>
								<div class="flex-box-item">
									周五
								</div>
								<div class="flex-box-item">
									周六
								</div>
								<div class="flex-box-item">
									周日
								</div>
							</div>
						</div>
						<div class="calendar-days">
							<div class="flex-box">
								<div class="calendar-day" v-for="item in calendarData" @click="viewDetail(item.planDetailIds)">
									<span class="day-number">{{item.day}}</span>
									<div class="task-icon">
										<i v-if="item.myTaskFlag" class="icon icon-flag icon-20"></i>
										<i v-if="item.finishFlag" class="icon icon-check"></i>
									</div>
									<div class="coloured-box">
										<span v-if="item.specialist" class="coloured-ribbon coloured-ribbon-blue">专<br />科</span>
										<span v-if="item.family" class="coloured-ribbon coloured-ribbon-green">家<br />医</span>										
									</div>
									<div class="progress-box">
										<div class="progress" :style="{opacity:item.specialist?'1':'0'}">
											<span>{{(item.specialist && item.specialist.finish)+'/'+(item.specialist && item.specialist.all)}}</span>
										  <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" :style="{width: (item.specialist?(item.specialist.finish/item.specialist.all):0)*100+'%'}"></div>
										</div>
										<div class="progress" :style="{opacity:item.family?'1':'0'}">
											<span>{{(item.family && item.family.finish)+'/'+(item.family && item.family.all)}}</span>
										  <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" :style="{width: (item.family?(item.family.finish/item.family.all):0)*100+'%'}"></div>
										</div>
										<p v-if="!item.noService" class="mb0 f12" style="line-height: 1;">{{searchTask==1?'我的任务':(searchTask==2?'随访':(searchTask==3?'复诊':(searchTask==4?'健康教育':'&emsp;')))}}</p>
									</div>
									<p v-if="item.noService" class="no-server">无服务项</p>
								</div>
							</div>
						</div>
					</div>
					<div class="time-axis" v-show="tabStatus==2">
						<table class="table">
							<tr>
								<th style="padding-right: 50px;text-align: right;">时间</th>
								<th class="text-center">项目</th>
								<th>执行人员</th>
								<th>执行地点</th>
								<th>相关记录</th>
								<th class="text-center">状态</th>
							</tr>
							<tr v-for="item in timeAxisData" :is-future="item.future">
								<td class="time text-right time-box">
									<p class="mb5">{{item.date}}</p>
									<p class="mb0">{{item.time}}</p>
									<span class="cur-status">{{item.html}}</span>
								</td>
								<td class="project-name">
									<p class="mb5">{{item.title}}</p>
									<p class="ellipsis mb0">{{item.content}}</p>
								</td>
								<td class="executor">{{item.doctor_name}}</td>
								<td class="place-of-execution">{{item.hospital}}</td>
								<td class="view-task">查看</td>
								<td class="task-status">{{item.status==0?'未完成':(item.status==1?'已完成':'已预约')}}</td>
							</tr>
							<tr v-if="!timeAxisData.length">
								<td colspan="6" class="f16 ptb10 text-center">暂无数据</td>
							</tr>
						</div>
					</div>
				</div>
			</div>
		</div>
		<script type="text/javascript" src="../../../js/vue.js"></script>
		<script type="text/javascript" src="../../../js/jquery-2.2.4.js"></script>
		<script type="text/javascript" src="../../../api/http-request.js"></script>
		<script type="text/javascript" src="../../../plugins/layer/layer.min.js" ></script>
		<script type="text/javascript" src="../../../api/rehabilitation-api.js"></script>
		<script type="text/javascript" src="../../../js/underscore.js"></script>
		<script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			!function(){
				var httpData=GetRequest();
				var currentGMT=new Date();//当前时间GMT
				new Vue({
					el:"#app",
					data:{
						ynow: currentGMT.getFullYear(),//年份
						mnow: currentGMT.getMonth(),//月份（比实际少一个月---0开始至11）
						dnow: currentGMT.getDate(),//当前日
						currentDay:null,//带中文格式的当前年月
						currentDayForEn:null,//不带中文格式年月日2018/10/01如果写成/的话  转换成时间戳会变成北京时间8点
						calendarData:[],//日历数据
						timeAxisData:[],//时间轴数据
						__Data:[],//当前的年月（日历）
						__xData:[],//当前的年月(时间轴)
						status:null,//任务状态（0未完成，1已完成，2已预约）
						searchTask:null,//快速查找任务：（1、我的任务，2、随访，3、复诊，4、健康教育）
						planId:'402803f6657f195301657f4c4ce70000' || httpData['planId'],
						taskArr:[
							{code:1,name:'我的任务'},
							{code:2,name:'随访'},
							{code:3,name:'复诊'},
							{code:4,name:'健康教育'},
						],
						statusArr:[
							{code:0,name:'未完成'},
							{code:1,name:'已完成'},
							{code:2,name:'已预约'},
						],
						tabStatus:null,
					},
					mounted:function(){
						this.tabStatus=1;
					},
					methods:{
						viewDetail:function(planids){
							if(!planids){
								layer.msg('无服务项',{icon:5})
								return ;
							}
							layer.open({
							  type: 2,
			//				  offset: ['100px'], //右下角弹出
							  area: ['600px', '650px'],
							  shade: 0.5,
							  title: '服务项目内容',
							  fixed: true, //不固定
							  maxmin: true,
							  closeBtn:1,
							  shift: 5,
							  shadeClose: false, //点击遮罩关闭层
							  content: '../../rehabilitation/html/service_item_content.html?planids='+planids
							});
						},
						changeStatus:function(val){
							this.status=this.status==val?null:val;
						},
						changeTask:function(val){
							this.searchTask=this.searchTask==val?null:val;
						},
						monDetail:function(){
						  this.currentDay = this.ynow + '年'+ (this.mnow + 1) +'月';
						  this.currentDayForEn=this.ynow+'/'+(this.mnow>=9?(this.mnow+1):"0"+(this.mnow+1))+'/'+(this.dnow>=9?this.dnow:"0"+this.dnow)
						},
						is_leap:function(year) {  //判断是否为闰年
						   return (year%100==0?res=(year%400==0?1:0):res=(year%4==0?1:0));
						},
						preMonth:function(){  //上一个月
						  if(this.mnow<=0){
						    this.mnow=11;
						    this.ynow=this.ynow-1;
						  }else{
						    this.mnow--;
						  }
						  this.monDetail();
						  this.goToLoadData(true);
						},
						getPreMouth:function(){
							var pMnow,pYnow;
							if(this.mnow<=0){
							    pMnow=11;
							    pYnow=this.ynow-1;
							  }else{
							    pMnow=this.mnow-1;
							    pYnow=this.ynow;
							  }
							var m_days=new Array(31,(28+this.is_leap(pYnow)),31,30,31,30,31,31,30,31,30,31);  //每个月的天数
							return {
									days:m_days[pMnow],
									date:pYnow+'-'+(++pMnow>=10?pMnow:"0"+pMnow)
								}
						},
						nextMonth:function(){   //下一个月
						  if(this.mnow>=11){
						    this.mnow=0;
						    this.ynow=this.ynow+1;
						  }else{
						     this.mnow++;
						  }
						  this.monDetail();
						  this.goToLoadData(true);			
						},
						getNextMouth:function(){
							var nMnow,nYnow;
							if(this.mnow>=11){
							    nMnow=0;
							    nYnow=this.ynow+1;
							  }else{
							     nMnow=this.mnow+1;
							     nYnow=this.ynow;
							  }
							var m_days=new Array(31,(28+this.is_leap(nYnow)),31,30,31,01,31,31,30,31,30,31);  //每个月的天数
							return {
									days:m_days[nMnow],
									date:nYnow+'-'+(++nMnow>=10?nMnow:"0"+nMnow)
								}
						},
						goToLoadData:function(flag){//flag是否更新数据
							this.tabStatus==1 && (!this.calendarData.length || flag) && this.calendar();
							this.tabStatus==2 && (!this.timeAxisData.length || flag) && this.timeAxis();
						},
						calendar:function(){
						  var nlstr = new Date(this.ynow,this.mnow,1);  //当月第一天
						  var firstday = nlstr.getDay()-1;//第一天星期几,默认是周日  我们改成周一
						  firstday=firstday==-1?6:firstday;//如果是-1，说明当月的第一天是周日
						  var m_days=new Array(31,(28+this.is_leap(this.ynow)),31,30,31,30,31,31,30,31,30,31);  //每个月的天数
						  var tr_str=Math.ceil((m_days[this.mnow] + firstday)/7);   //当前月天数+第一天是星期几的数值   获得 表格行数
						  var c_days=m_days[this.mnow];//当前月份的天数
						  var p_arr=this.getPreMouth();
						  var n_arr=this.getNextMouth();
						  var i,k,idx,date_str;
						  var dataArr=[];//天数/年月
						  for(i=0;i<tr_str;i++) { //表格的行
						     for(k=0;k<7;k++) { //表格每行的单元格
						        idx=i*7+k; //单元格自然序列号
						        date_str=idx-firstday+1; //计算日期
						        var __ym;
						        if(date_str<=0){//过滤无效日期（小于等于零的、大于月总天数的）
						        	date_str=date_str+p_arr['days'];//当前日期+上个月的天数就是上个月的日期
						        	__ym=p_arr['date'];
						        }else if(date_str>c_days){
						        	date_str=date_str-c_days;//下个月的日期就是这个月的天数-当月的天数
						        	__ym=n_arr['date'];
						        }else{
						        	__ym=this.ynow+'-'+(this.mnow>=9?"":"0")+(this.mnow+1);
						        }
						        dataArr.push({
						        	day:date_str,
						        	date:__ym
						        });
						     }
						  }
						  this.__Data=dataArr;
						  this.monDetail();
						  this.calenderPlanDetail();
						},
//						日历请求
						calenderPlanDetail:function(){
							var vm=this;
							var __days=vm.__Data;
							var httpData=GetRequest();
							var lastDay=(__days.concat()).pop().day;
							lastDay=lastDay>9?lastDay:'0'+lastDay;
							vm.planId = httpData.planid
							vm.status=httpData.status
							var params={
								executeStartTime:__days[0].date+'-'+__days[0].day+' 00:00:00',//日历开始时间（格式：yyyy-MM-dd HH:mm:ss）
								executeEndTime:(__days.concat()).pop().date+'-'+lastDay+' 23:59:59',//日历结束时间（格式：yyyy-MM-dd HH:mm:ss）
								planId:vm.planId,//计划id
								searchTask:vm.searchTask,//快速查找任务：（1、我的任务，2、随访，3、复诊，4、健康教育）
								status:vm.status,//任务状态（0未完成，1已完成，2已预约）
							}
							rehaAPI.calendarPlanDetail(params).then(function(res){
								vm.calendarData=[];
								if(res.status==200){
									var data=res.data
									for(var i in __days){
										var _key=__days[i].date+'-'+(__days[i].day>9?__days[i].day:'0'+__days[i].day);
										var item={
												noService:true,
												day:__days[i].day
											};
										for(var j in data){
											if(_key==j){
												item=data[j];
												item.day=__days[i].day;
												var finishFlag=false;
												var sFlag=false;
												var fFlag=false;
												if(item.specialist){
													if(item.specialist.all==item.specialist.finish){
														sFlag=true;
													}
												}else{
													sFlag = true;
												}
												if(item.family){
													if(item.family.all==item.family.finish){
														fFlag = true;
													}
												}else{
													fFlag = true;
												}
												finishFlag = sFlag && fFlag;
												item.finishFlag=finishFlag;
												data.length && data.splice(j,1);
												break;
											}
										}
										vm.calendarData.push(item);
									}
								}
							})
						},
//						时间轴请求
						timeAxis:function(){
							var m_days=new Array(31,(28+this.is_leap(this.ynow)),31,30,31,30,31,31,30,31,30,31);  //每个月的天数
							var c_days=m_days[this.mnow];//当前月份的天数
							var __ym=this.ynow+'-'+(this.mnow>=9?"":"0")+(this.mnow+1);
							var dataArr=[];//天数/年月
							for(;c_days>0;c_days--){
								dataArr.push({
						        	day:c_days,
						        	date:__ym
						        });
							}
							this.__xData=dataArr;
							this.monDetail();
							this.calendarPlanDetailList();
						},
//						时间轴请求
						calendarPlanDetailList:function(){
							var vm=this;
							var __days=vm.__xData;
							var lastDay=(__days.concat()).pop().day;
							lastDay=lastDay>9?lastDay:'0'+lastDay;
							var params={
								executeEndTime:__days[0].date+'-'+__days[0].day+' 00:00:00',//日历开始时间（格式：yyyy-MM-dd HH:mm:ss）
								executeStartTime:(__days.concat()).pop().date+'-'+lastDay+' 23:59:59',//日历结束时间（格式：yyyy-MM-dd HH:mm:ss）
								planId:vm.planId,//计划id
								searchTask:vm.searchTask,//快速查找任务：（1、我的任务，2、随访，3、复诊，4、健康教育）
								status:vm.status,//任务状态（0未完成，1已完成，2已预约）
							}
							rehaAPI.calendarPlanDetailList(params).then(function(res){
								if(res.status==200){
									var _currentTimeStamp=+new Date(vm.currentDayForEn);
									vm.timeAxisData=_.map(res.data||{},function(o){
										var _time=o.executeTime.split(' ');
										var thatTime=+new Date(_time[0]);
										console.log(_currentTimeStamp)
										console.log(thatTime)
										var future=_currentTimeStamp>thatTime?0:(_currentTimeStamp==thatTime?1:2);
										var _html=o.status==2?'预':'';
										_html=future==1?'今':_html;
										if(_html=='预') future=3;
										o.html=_html
										o.date=_time[0];
										o.time=_time[1];
										o.future=future;
										return o;
									})||[];
								}
								console.log(vm.timeAxisData)
							})
						},
					},
					watch:{
						tabStatus:function(){
							this.goToLoadData();
						}
					}
				})
			}();
		</script>
	</body>
</html>

app/rehabilitation/html/service_item_content.html

@@ -0,0 +1,338 @@
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="../../../css/bootstrap.min.css" />
	    <link rel="stylesheet" type="text/css" href="../../../css/style.min.css"/>
	    <link rel="stylesheet" type="text/css" href="../../../css/cross.css"/>
		<style type="text/css">
			[v-cloak]{display: none;}
			.flex-box{display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */         /* OLD - Firefox 19- (buggy but mostly works) */
				  display: -ms-flexbox;      /* TWEENER - IE 10 */     /* NEW - Chrome */
				  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
				  -webkit-box-pack: center;
				  -ms-flex-pack: center;
				  justify-content: center;
				  -webkit-box-align: center;
				  -ms-flex-align: center;
				  align-items: center;
				  -ms-flex-wrap: wrap;
				      flex-wrap: wrap;
				  }
			.flex-box-item{-webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
				  -moz-box-flex: 1;         /* OLD - Firefox 19- */
				  -webkit-flex: 1;          /* Chrome */
				  -ms-flex: 1;              /* IE 10 */
				  width: 50%;               /* For old syntax, otherwise collapses. */
				  flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ */
				 position: relative;}
			.icon{width: 12px;height: 12px;vertical-align: middle;background-size: 100% auto;background-repeat: no-repeat;display: inline-block;background-position: center center;}
			.icon-arrow-down{background-image: url(../images/icon/tiaozhuan_xia_icon.png);}
			.icon-gouxuan{background-image: url(../images/icon/gouxuan_lanse_icon.png);}
			.icon-check,.icon-arrow-down{transition: all .3s ease-in-out;}
			.active .icon-check,.collapsed .icon-arrow-down{transform: rotateZ(180deg);}
			.icon-check{background-image: url(../images/icon/zhankai_btn.png);}
			.icon-16{width: 16px;height: 16px;}
			.icon-18{width: 18px;height: 18px;}
			.record-list{max-height: 0;overflow: hidden;transition: all .3s linear;}
			.record-list.active{max-height: 500px;}
			.record-item{background-color: #f5f5fa;margin-bottom: 10px;padding: 10px;}
			.service-top{font-size: 0;line-height: 1;font-weight: 500;}
			.service-name span{vertical-align: middle;font-size: 16px;}
			.service-name span+span{margin-left: 10px;}
			.service-name{line-height: 1.5;margin-bottom: 0;}
			.service-index{border: 1px solid #12b7f5;width: 16px;line-height: 1;height: 16px;font-size: 14px;display: inline-block;text-align: center;color: #12b7f5;}
			.label-group{padding-left: 26px;}
			.label-group span{color: #12b7f5;font-size: 14px;line-height: 1;margin-top: 10px;}
			.label-blue{border-radius: 5px;border: solid 1px #12b7f5;padding: 4px 15px;display: inline-block;margin-right: 27px;}
			.panel-body{padding: 20px;font-size: 14px;color: #999;}
			.panelcurPage{border-bottom: 1px solid #d7dce6;}
			.service-content{line-height: 30px;padding-bottom: 15px;}
			.service-address{border-bottom: 1px solid #d7dce6;}
			.btn-yuyue{background-color: #02cfb9;color: #fff;}
			.btn-yuyue:hover,.btn-yuyue:link{color: #fff;background-color: #01c1ad;}
			.btn-fuwuma{background-color: #2dbe55;color: #fff;}
			.btn-fuwuma:hover,.btn-fuwuma:link{color: #fff;background-color: #209440;}
			.btn-zhidao{background-color: #12b7f5;color: #fff;}
			.btn-zhidao:hover,.btn-zhidao:link{color: #fff;background-color: #10a0d6;}
			.service-operation .btn{width: 90px;}
			.view-detail{color: #12b7f5;cursor: pointer;}
			.yslb>span:after{content: '、';}
			.yslb>span:last-child:after{display: none;}
			.btns-group{padding-left: 20px;}
			.btns-group .btn{margin-right: 20px;}
			.fuwuma-model{position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 9;}
			.fuwuma-layer{position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0,.35);}
			.fuwuma-content{width: 260px;height: 260px;top: 50%;position: absolute;margin-top: -130px;left: 50%;margin-left: -130px;}
			.fuwuma-content img{width: 100%;display: block;}
		</style>
	</head>
	<body>
		<div class="panel-group" id="app" v-cloak role="tablist" aria-multiselectable="true">
		  <div class="panelcurPage" v-for="(service,index) in serviceData">
		    <div class="panel-heading" role="tab" @click="changeCollapseIndex(index)">
		      <h4 class="panel-title">
		        <a role="button" class="flex-box">
		          <div class="flex-box-item service-top">
		          	<p class="service-name"><span class="service-index">{{index+1}}</span><span>{{service.title}}</span></p>
		         	<div class="label-group">
		         		<span class="pull-right mt5"><i v-if="service.statusName=='已完成'" class="icon icon-gouxuan icon-18 mr5"></i>{{service.statusName}}</span>
		         		<span class="label-blue">{{service.shortExecuteTime}}</span>
		         		<span class="label-blue" v-for="doctor in service.executeDoctorList">{{doctor}}</span>
		         	</div>
		          </div>
		          <span class="icon icon-arrow-down ml50"></span>
		        </a>
		      </h4>
		    </div>
		    <div class="panel-collapse collapse" :class="{in:collapseIndex==index}"  role="tabpanel" aria-labelledby="headingOne">
		      	<div class="panel-body">
		      		<div class="service-content">{{service.content}}</div>
		      		<div class="service-address ptb20">
		      			<div class="flex-box">
		      				<div class="flex-box-item">
		      					<p class="m0">地点：{{service.hospitalName}}</p>
		      					<p class="m0">时间：{{service.executeTime | formatDate}}</p>
		      				</div>
		      				<div class="flex-box-item">
		      					<p class="m0 yslb">执行：<span v-for="(doctor,index) in service.executeDoctorList">{{doctor}}</span></p>
		      					<p class="m0">收费：{{service.expense}}元</p>
		      				</div>
		      			</div>
		      		</div>
		      		<div class="service-operation pt10">
		      			<p><span class="pull-right view-detail" :class="{active:isCollapse}" @click="chakan"><i class="icon icon-check mr5 icon-16"></i>{{isCollapse?'收起详情':'查看详情'}}</span>指导与汇报记录</p>
		      			<div class="record-list" :class="{active:isCollapse}">
		      				<div class="record-item" v-for="item in service.messageList">
		      					<div class="flex-box c-999 f14">
			      					<div class="flex-box-item">
			      						{{item.adminTeamName}}
			      					</div>
			      					<div class="flex-box-item">
			      						{{item.createTime}}
			      					</div>
			      				</div>
			      				<div class="f14 c-333">{{item.content}}f</div>
		      				</div>
	      				</div>
		      			<div class="flex-box btns-group">
		      				<!--<button class="btn btn-yuyue" v-if="service.itemType==0 && service.operate!=1">上传附件</button>-->
		      				<button class="btn btn-yuyue" v-if="service.itemType==2 && service.operate!=1" @click="jkjy(service.patient,service.planDetaiId)">健康教育</button>
		      				<button class="btn btn-yuyue" v-if="service.itemType==3 && service.operate!=1" @click="zwkf">健康指导</button>
		      				<button class="btn btn-yuyue" v-if="service.itemType==4 && service.operate!=1" @click="zwkf">随访</button>
		      				<button class="btn btn-zhidao" @click="zdly(service)">指导留言</button>
		      				<button class="btn btn-fuwuma" v-if="service.itemType==1 && service.operate!=1" @click="fwm(service.planDetaiId)">服务码</button>
		      				<!--<button class="btn btn-fuwuma" @click="fwm(service.planDetaiId)">服务码</button>-->
		      				<button class="btn btn-fuwuma" v-if="service.operate==1" @click="goToFinish(service.planDetaiId)">完成</button>
		      			</div>
		      		</div>
		        </div>
		    </div>
		  </div>
		  <div class="fuwuma-model" v-show="qrModal">
		  	<div class="fuwuma-layer" @click="qrModal=false"></div>
		  	<div class="fuwuma-content">
		  		<img :src="qrCode" width="300px" />
		  	</div>
		  </div>
		</div>
		<script type="text/javascript" src="../../../js/vue.js"></script>
		<script type="text/javascript" src="../../../js/jquery-2.2.4.js"></script>
		<script type="text/javascript" src="../../../api/http-request.js"></script>
		<script type="text/javascript" src="../../../api/rehabilitation-api.js"></script>
		<script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			!function(){
				var httpData=GetRequest();
				var userInfo = JSON.parse(window.localStorage.getItem(httpRequest.agentName));  
				window.serviceItem=new Vue({
					el:"#app",
					data:{
						planids:httpData['planids'],
						serviceData:[],
						isCollapse :false,
						collapseIndex:0,
						qrCode:'',
						qrModal:false,
					},
					mounted:function(){
						this.getServiceItemList();
					},
					methods:{
						chakan:function(){
							this.isCollapse=!this.isCollapse;
						},
						changeCollapseIndex:function(idx){
							this.collapseIndex=idx;
						},
						//获取服务列表
						getServiceItemList:function(){
							var vm=this;
							var loadding = top.layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
							rehaAPI.serviceItemList({planDetailIds:vm.planids}).then(function(res){
								top.layer.close(loadding);
								if(res.status==200){
									vm.serviceData=res.data;
								}else{
									top.layer.msg(res.msg,{icon:5});
								}
							})
						},
						//健康教育
						jkjy:function(patient,planId){
							var vm=this
							top.layer.open({
								type: 2,
								//				  offset: ['100px'], //右下角弹出
								area: ['800px', '648px'],
								shade: 0.5,
								title: '健康教育',
								fixed: true, //不固定
								maxmin: true,
								closeBtn: 1,
								shift: 5,
								shadeClose: false, //点击遮罩关闭层
								content: '../../article/html/article.html?code='+patient+'&planId='+planId+'&isReha=true'
							});
						},
//						暂未开放
						zwkf:function(){
							top.layer.msg('此功能暂未开放',{icon:1});
						},
						goToFinish:function(planid){
							top.layer.open({
							  type: 2,
			//				  offset: ['100px'], //右下角弹出
							  area: ['600px', '650px'],
							  shade: 0.5,
							  title: '完成项目确认',
							  fixed: true, //不固定
							  maxmin: true,
							  closeBtn:1,
							  shift: 5,
							  shadeClose: false, //点击遮罩关闭层
							  content: '../../rehabilitation/html/guide_the_message.html?planid='+planid
							});
						},
						fwm:function(planid){
							this.loadSocket(planid);
						},
						zdly:function(data){
							var loginDoctor = JSON.parse(window.localStorage.getItem('wlyyAgent'));
							var otherCode,otherName;
							var planDetailId=data.planDetaiId;
							if(loginDoctor.doctorType==1){
								otherCode=data.familyDoctorCode;
								otherName=data.familyDoctorName;
							}else{
								otherCode=data.specialistDoctorCode;
								otherName=data.specialistDoctorName;
							}
							top.layer.open({
							  type: 2,
			//				  offset: ['100px'], //右下角弹出
							  area: ['800px', '650px'],
							  shade: 0.5,
							  title: '指导留言',
							  fixed: true, //不固定
							  maxmin: true,
							  closeBtn:1,
							  shift: 5,
							  content: '../../consulting/html/consulting.html?otherCode='+otherCode+'&otherName='+encodeURI(otherName)+'&planDetailId='+planDetailId
							});
						},
						loadSocket:function(planid){
							var vm=this;
							var imurl=httpRequest.socketUrl;
						    jQuery.getScript(imurl+"/socket.io/socket.io.js").done(function() {
						    	var type=2;//咨询类型
						        var socket = io.connect(imurl);
						        var sessionId = 'system';
						        socket.emit('login', {userId: userInfo.uid, password: userInfo.uid,sessionId:sessionId,clientType:"doctor"});
						        socket.on('message', function (data) {
						      		console.log(data);
						      		if(data.type==0){
						      			vm.checkAfterQrCode(planid);
						      		}
						        });
						
						        socket.on('error', function (data) {
						          console.log(data);
						        });
						
						        socket.on('ack', function (data) {
						          console.log(data);
						          vm.getQRCode(planid);
						        }); 
						        function getLocalTime(nS) {     
						            return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:\d{1,2}$/,' ');     
						        }    
						    })
						    .fail(function() {
						        top.layer.msg('服务码创建失败',{icon:5});    
						    });
						},
						checkAfterQrCode:function(planid){
							var vm=this;
							rehaAPI.checkAfterQrCode(params).then(function(res){
								var icon=5;
								if(data.status==200){
									if(data.data){
										icon=1;
										vm.goToFinish(planid);
									}
								}
								top.layer.msg(res.msg,{icon:icon});  
							})
						},
						getQRCode:function(planid){
							var vm=this;
							var params={
								planDetailId:planid,
								sessionId: 'system'
							}
							rehaAPI.createServiceQrCode(params).then(function(res){
								console.log(res);
								if(res.status==200){
									vm.qrCode=res.data;
									setTimeout(function(){
										vm.qrModal=true;
									},100)
								}else{
									top.layer.msg('服务码获取失败',{icon:5});  
								}
							})
							
						}
					},
					filters:{
					  	formatDate:function(value, format) {
					  		if(!value) return ;
					  		var fmt=format || "yyyy-MM-dd hh:mm";
							var date = new Date(value);
							if (/(y+)/.test(fmt)) {
								fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
							}
							let o = {
								'M+': date.getMonth() + 1,
								'd+': date.getDate(),
								'h+': date.getHours(),
								'm+': date.getMinutes(),
								's+': date.getSeconds()
							};
							for (let k in o) {
								if (new RegExp(`(${k})`).test(fmt)) {
									let str = o[k] + '';
									fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : ('00' + str).substr(str.length));
								}
							}
							return fmt;
						}
					}
				})
			}()
		</script>
		
	</body>
</html>

app/rehabilitation/js/health_control.js

@@ -0,0 +1,269 @@
layui.use('element', function () {
    // var $ = layui.jquery
    element = layui.element//Tab的切换功能，切换事件监听等，需要依赖element模块
    function Progress(dom, num) {
        window.setTimeout(function () {
            element.progress(dom, num)
        }, 360)
    }
    function showInfoMessage(msg) {
        layer.msg(msg, {
            icon: 6
        })
    }
    function showErrorMessage(msg) {
        layer.msg(msg, {
            icon: 5
        })
    }
    function conFirm(msg, num, isStop, planid, getDat) {
        layer.confirm('您确定要执行该操作吗?', { btn: ['确定', '取消'], title: "提示" }, function (index) {
            if (num == 2) {
                showInfoMessage("计划已完成")
                $("#button_id").attr('disabled', true).addClass("falsebutton")
            } else {
                isStop = num == 0 ? 1 : 0
            }
            var params = {
                status: isStop,
                planId: planid
            }
            healthAPI.updatePlanStatusById(params).then(function (res) {
                if (res.status == 200) {
                    getDat()
                }
            })
            layer.close(index);
        });
    }
    new Vue({
        el: '#app',
        data: {
            code: "",
            modal: "",
            type: "",
            status: "",
            plan: "",
            name: "",
            isDanger: "0",
            pagesize: 10,
            total: "",
            pagetotal: '', //总页数
            currentPage: 1, //当前页数
            tablelist: [],
            diseaselist: [],
            types: [],
            Statics: {},
            wujilu: false,
            datamodelshow: true,
            plantype: 1,
            todaylog: 1,
            isTotayTodo: 1,
            progress: "",
            allFinishCount: "",
            allCount: "",
            planid: "",
            isStop: 1, //
            isActive: true
        },
        watch: {
            tablelist: function (val) {
                var vm = this
                this.$nextTick(function () {
                    element.init()
                    for (var i = 0; i < val.length; i++) {
                        var allFinishCount = val[i].allFinishCount
                        var allCount = val[i].allCount
                        var isStop = val[i].status
                        var isname = val[i].name
                        var ishospitalName=val[i].hospitalName
                        if(ishospitalName==null){
                            
                        }
                        if (isStop == 0) {
                            $(".layui-progress-bar").css({
                                "background-color": "gray"
                            })
                            $("#button_id").html("激活计划")
                        } else {
                            $(".layui-progress-bar").css({
                                "background-color": "#ff9526"
                            })
                            $("#button_id").html("终止计划")
                        }
                        var progressNum = Math.ceil((allFinishCount / allCount) * 100)
                        Progress(val[i].id, progressNum + "%")
                    }
                    var lastColor = 'red';
                    for (var i = 0; i < val.length; i++) {
                        if (i == 0) {
                            $($(".quote")[i]).css("background-color","green")
                            continue
                        }
                        if (val[i].patientName == val[i - 1].patientName) {
                            $($(".quote")[i]).css("background-color","blue")
                            if (lastColor === 'red') {
                                $($(".quote")[i]).css("background-color","green")
                            }
                        } else {
                            if (lastColor !== 'red') {
                                $($(".quote")[i]).css("background-color","green")
                                lastColor = 'red'
                            } else {
                                lastColor = 'white'
                                $($(".quote")[i]).css("background-color","blue")
                            }
                        }
                    }
                })
            },
        },
        mounted() {
            var vm = this
            // vm.getModal()
            vm.getDatas()
            vm.gettypes()
         
        },
        methods: {
            setImgSrc: function(src) {
                var str = httpRequest.getImgUrl(src)
                return str
            },
            getDatas: function () {
                var vm = this
                var params = {
                    patientCondition: vm.name,//	居民条件，可以按身份证或者居民名称模糊匹配
                    diseaseCode: vm.type, //疾病类型
                    planType: vm.status,	//安排类型（1康复计划，2转社区医院，3转家庭病床）
                    todaybacklog: vm.isTotayTodo,	// 今日待办（1、今日待办，2、全部）
                    page: vm.currentPage,
                    pageSize: vm.pagesize,
                    isDanger: vm.isDanger,
                }
                healthAPI.getSpecialList(params).then(function (res) {
                    console.log(res)
                    if (res.status == 200) {
                        vm.wujilu = false
                        vm.total = res.data.totalCount
                        vm.pagetotal = Math.ceil(res.data.totalCount / vm.pagesize)
                        vm.tablelist = _.sortBy(res.data.detailModelList, "patientName")
                        if (vm.tablelist.length == 0) {
                            vm.wujilu = true
                        }
                    } else {
                        showErrorMessage(res.msg);
                    }
                })
            },
            gettypes: function () {
                var vm = this
                var search = true
                $("#Status").bsSuggest({
                    data: {
                        value: [{
                            code: "",
                            name: "全部"
                        },
                        {
                            code: "1",
                            name: "康复计划"
                        },
                        {
                            code: "2",
                            name: "(转)社区医院"
                        },
                        {
                            code: "3",
                            name: "(转)家庭病床"
                        }
                        ]
                    },
                    getDataMethod: "data",
                    effectiveFields: ["name"],
                    idField: "code",
                    keyField: "name"
                });
                healthAPI.getSpecialDisease().then(function (res) {
                    if (res.status == 200) {
                        console.log(res)
                        var data = {}
                        data.value = _.map(res.data, function (v) {
                            return {
                                code: v.code,
                                name: v.name
                            }
                        })
                        if (search) {
                            data.value = [{
                                code: "",
                                name: "全部"
                            }].concat(data.value)
                        }
                        $("#Type").bsSuggest({
                            data: data,
                            getDataMethod: "data",
                            effectiveFields: ["name"],
                            idField: "code",
                            keyField: "name"
                        });
                        vm.types = res.data;
                    } else {
                        showErrorMessage(res.msg);
                    }
                })
            },
            search: function (page) {
                var vm = this
                vm.type = $("#Type").attr("data-id");
                vm.status = $("#Status").attr("data-id");
                vm.currentPage = page
                vm.getDatas()
            },
            daiban: function (page) {
                var vm = this
                vm.isTotayTodo = $("#c").prop("checked") ? 2 : 1
                $(".icon-chkbox").toggleClass("icon-bgchkbox");
                vm.currentPage = page
                console.log(vm.currentPage)
                vm.getDatas()
            },
            morePlan: function (data) {
                location.href = "moreplan.html?patientCode=" + data.patientCode
            },
            checkPlan: function (data) {
                location.href = "../../rehabilitation/html/rehabilitation_management.html?planid=" + data.id + "&status=" + data.status
            },
            stop: function (data) {
                var vm = this
                vm.planid = data.id
                conFirm("确定终止该计划吗", data.status, vm.isStop, vm.planid, vm.getDatas)
            },
        }
    })
});

app/rehabilitation/js/moreplan.js

@@ -0,0 +1,178 @@
   
        layui.use('element', function () {
            element = layui.element//Tab的切换功能，切换事件监听等，需要依赖element模块
            function Progress(dom, num) {
                window.setTimeout(function () {
                    element.progress(dom, num)
                }, 360)
            }
            function showInfoMessage(msg) {
                layer.msg(msg, {
                    icon: 6
                })
            }
            function ConFirm(msg, num, isStop,planid,getDat) {
                layer.confirm('您确定要执行该操作吗?', { btn: ['确定', '取消'], title: "提示" }, function (index) {
                    if (num == 2) {
                        showInfoMessage("计划已完成")
                        $("#button_id").attr('disabled', true).addClass("falsebutton")
                    } else {
                        isStop = num == 0 ? 1 : 0
                    }
                    var params = {
                            status: isStop,
                            planId: planid
                        }
                        healthAPI.updatePlanStatusById(params).then(function (res) {
                            if (res.status == 200) {
                                getDat()
                            }
                        })
                        layer.close(index);
                });
            }
            var reqList = []; //记录请求的参数和url，用于后退时使用
            Vue.use(Vuedals.default);
            new Vue({
                el: "#app",
                data: {
                    appname: "更多计划",
                    isback: true,
                    isrefresh: true,
                    paticentcode: "",
                    tablelistone: [],
                    tablelist: [],
                    name: "",
                    sex: "",
                    age: "",
                    hospital: "",
                    diseaseList: [],
                    signFamilyFinishItemCount: "",
                    signFamilyServiceRecordCount: "",
                    signFamilyAdminTeamName: "",
                    specialistAdminTeamName: "",
                    specialistFinishItemCount: "",
                    specialistServiceRecordCount: "",
                    progress: "",
                    specialistHospitalName: "",
                    familyHospitalName: "",
                    planid: "",
                    isStop: 1 //
                },
                watch: {
                    tablelist: function (val) {
                            this.$nextTick(function () {
                                element.init()
                                for (var i = 0; i < val.length; i++) {
                                    var allFinishCount = val[i].allFinishCount
                                    var allCount = val[i].allCount
                                    var isStop = val[i].status
                                    var bname=val[i].patientName
                                    // if()
                                    if(isStop==2){
                                        $("#span_font").html("已完成")
                                        $("#span_font").addClass("corg")
                                    }
                                    if(isStop==1){
                                        $("#span_font").html("进行中")
                                        $("#span_font").addClass("cblue")
                                    }
                                    if (isStop == 0) {
                                        $(".layui-progress-bar").css({
                                            "background-color": "gray"
                                        })
                                        $("#button_id").html("激活计划")
                                        $("#span_font").html("已中止")
                                        $("#span_font").addClass("cgre")
                                    } else {
                                        $(".layui-progress-bar").css({
                                            "background-color": "#ff9526"
                                        })
                                        $("#button_id").html("终止计划")
                                    }
                                    var progressNum = Math.ceil((allFinishCount / allCount) * 100)
                                    Progress(val[i].planId, progressNum + "%")
                                }
                            })
                       
                    },
                },
                mounted() {
                    var vm = this
                    vm.getDatas()
                    EventBus.$on("back-click", function (arg) {
                        history.go(-1);
                    });
                    //监听页面刷新
                    EventBus.$on("refresh-click", function (arg) {
                        location.reload();
                    });
                },
                components: {
                    vuedals: Vuedals.Component
                },
                methods: {
                    setImgSrc: function(src) {
                        var str = httpRequest.getImgUrl(src)
                        return str
                    },
                    getDatas: function () {
                        var vm = this
                        var httpData = GetRequest()
                        vm.paticentcode = httpData.patientCode
                        var params = {
                            patientCode: vm.paticentcode
                        }
                        healthAPI.PlanDetailList(params).then(function (res) {
                            if (res.status == 200) {
                                console.log(res)
                                vm.wujilu = false
                                vm.name = res.data.patientName
                                vm.sex = res.data.sex
                                vm.age = res.data.age
                                vm.hospital = res.data.hospitalName
                                vm.diseaseList = res.data.diseaseList
                                vm.tablelist=_.sortBy(res.data.rehabilitationPlanList,"patientName")
                                vm.signFamilyServiceRecordCount = res.data.signFamilyServiceRecordCount
                                vm.signFamilyFinishItemCount = res.data.signFamilyFinishItemCount
                                vm.signFamilyAdminTeamName = res.data.signFamilyAdminTeamName
                                vm.specialistAdminTeamName = res.data.specialistAdminTeamName
                                vm.specialistFinishItemCount = res.data.specialistFinishItemCount
                                vm.specialistServiceRecordCount = res.data.specialistServiceRecordCount
                                vm.specialistHospitalName = res.data.specialistHospitalName
                                vm.familyHospitalName = res.data.familyHospitalName
                                if (vm.tablelist.length == 0) {
                                    vm.wujilu = true
                                }
                            } else {
                                // showErrorMessage(res.msg);
                            }
                        })
                    },
                    stop: function (data) {
                        var vm = this
                        vm.planid = data.planId
                        console.log(data.planId)
                        ConFirm("确定终止该计划吗", data.status, vm.isStop,vm.planid,vm.getDatas)
                        var params = {
                            status: vm.isStop,
                            planId: vm.planid
                        }
                   
                        console.log(vm.isStop)
                    },
                    noOpen:function(){
                        showInfoMessage("暂未开放")
                    }
                }
            })
        });

css/cross-searchui.css

@@ -0,0 +1,24 @@
/* css search
-----------------------------------------------------------------------------*/
.bgc-f2f4f6{ background:#f2f4f6;}
.c-ser-hold{ height:2.25rem;}
.c-serposi{ position:fixed; left:0; top:0; z-index:600;}
.c-ser-div { width: 100%; height: 2.25rem; padding: .35rem .5rem 0 .5rem; display: -webkit-box; display: box; box-sizing:border-box; -webkit-box-sizing:border-box;}
.c-ser-into { width:100%; background: #fff; height: 1.5rem; line-height: 1.5rem; border-radius: .2rem; color: #b3b3b3; padding:0 .4rem; box-sizing:border-box; -webkit-box-sizing:border-box;}
.ser-icon { position: relative; display: inline-block; width: 13px; height: 13px; font-size: 1px; background: none; vertical-align:middle; margin-bottom:4px;}
.ser-icon:before, .ser-icon:after { content: ""; position: absolute; left: 0; background: transparent; font-size: 1px; }
.ser-icon-search:before { left: 1px; top: 1px; width: 10px; height: 10px; border: 1px solid #aaa9a9; border-radius: 50%;}
.ser-icon-search:after { left: 10px; top: 12px; width: 5px; height: 1px; background: #aaa9a9; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); }
.c-ser-back { width: 1rem; -webkit-box-flex: 0; box-flex: 0; overflow: hidden; }
.c-ser-back .si-right { display: inline-block; width: 12px; height: 12px; border: solid #a3a3a7; border-width: 0 0 1px 1px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); margin:9px 0 0 3px;}
.c-ser-main { -webkit-box-flex: 1; box-flex: 1; background: #fff; height: 1.5rem; border-radius: .2rem; font-size: .75rem; color: #8e8e93; position: relative; padding:0 .5rem 0 1.25rem; overflow: hidden; }
.c-ser-main i { position: absolute; left: .35rem; top:50%; margin-top:-7px;}
.c-ser-input { width: 100%; background: #fff; height: 1.5rem; line-height: 1.5rem; border: none; color: #333; border-radius: 5px;}
.c-ser-btn { margin-left: .5rem; -webkit-box-flex: 0; box-flex: 0; }
.c-ser-btn a { display: block; height: 1.5rem; line-height: 1.5rem; padding: 0 .5rem; background: #3aa7ed; color: #fff; font-size: .7rem; border-radius: .2rem; }
.c-ser-canc { margin-left: .5rem; -webkit-box-flex: 0; box-flex: 0; }
.c-ser-canc a { display: block; height: 1.5rem; line-height: 1.5rem; padding: 0 .25rem; color:#17b3ec;}
.c-ser-main .input-clear { position: absolute; right: .3rem; top: 50%; margin-top: -.4rem; background: #7e7e7e; border-radius: 50%; width: .8rem; height: .8rem; text-align: center; }
.c-ser-main .input-clear:before, .c-ser-main .input-clear:after { content: ''; position: absolute; height: 1px; width: .5rem; top: 50%; left: 50%; margin-top: -.025rem; margin-left: -.25rem; background: #fff; border-radius: 6px; }
.c-ser-main .input-clear:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.c-ser-main .input-clear:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }

css/list.ui.css

@@ -0,0 +1,40 @@
@charset "utf-8";
/* c-list
-----------------------------------------------------------------------------*/
.ptb12 { padding-top: .6rem; padding-bottom: .6rem; }
.c-list-group h3 { padding: .3rem .75rem; background-color: #f9f9f9; font-size: .65rem; color: #5b5b5b; margin: 0; vertical-align: middle; }
.c-avatar-s { width: 1.3rem; height: 1.3rem; }
.c-avatar-m { width: 2rem; height: 2rem; }
.c-avatar-l { width: 2.7rem; height: 2.7rem; }
.c-avatar-s img,  .c-avatar-m img,  .c-avatar-l img { width: 100%; height: 100%; }
.c-list > li,  .c-list > .c-list-div { position: relative; display: -webkit-box; display: box; -webkit-box-pack: center; box-pack: center; padding-right: 0.75rem; margin-left: 0.75rem; border-top: 1px solid #f1f1f1; line-height:1rem;}
.c-list > li:first-child,  .c-list > .c-list-div:first-child { border-top: none; }
.c-list > .c-list-cover, .c-list > .c-list-link:active { padding-left: 0.75rem; margin-left: 0; }
.c-list > .c-list-link:active {  background: #f7f7f7;}
.c-list-a{display: -webkit-box; display: box; width:100%; color:#333;}
.c-list-title, .c-list-key, .c-list-info { display: -webkit-box; display: box; -webkit-box-orient: vertical; box-orient: vertical; -webkit-box-pack: center; box-pack: center;  }
.c-list-title{ -webkit-box-pack: start; box-pack: start;}
.c-list-info { -webkit-box-flex: 1; box-flex: 1; }
.c-list > .c-list-fun, .c-list > .c-list-label{ border-top: none; padding-right: 0; }
.c-list > li:first-child,  .c-list > .c-list-fun:first-child .c-list-info,  .c-list > .c-list-fun:first-child .c-list-key,  .c-list > .c-list-fun:first-child .c-list-title,  .c-list-div:first-child { border: none; }
.c-list > .list-arrow-r,  .c-list > .list-arrow-u,  .c-list > .list-arrow-d { padding-right: 1.5rem; }
.c-list > .list-arrow-r:after,  .c-list > .list-arrow-u:after,  .c-list > .list-arrow-d:after { position: absolute; top: 50%; right: 0.75rem; margin-top: -0.25rem; content: ""; display: block; width: 0.4rem; height: 0.4rem; border: solid #cdcdcd; border-width: 0.1rem 0.1rem 0 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.c-list > .list-arrow-u:after { right: 0.65rem; margin-top: -0.1rem; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.c-list > .list-arrow-d:after { right: 0.65rem; margin-top: -0.4rem; -webkit-transform: rotate(135deg); transform: rotate(135deg); }
.c-list-info.c-border-t,  .c-list-key.c-border-t,  .c-list-title.c-border-t { border-color: #f1f1f1; }
.required { position: relative; }
.required:before { content: "*"; position: absolute; color: #f00; font-size: 0.7rem; height: 0.6rem; line-height: 0.6rem; vertical-align: middle; left: -0.4rem; top: 50%; margin-top: -0.25rem; }
.listform-text{ width:100%; height:1.5rem; line-height:normal;}
.listform-sel{ display:inline-block; width:100%; position:relative;}
.listform-sel:before{ position: absolute; top: 50%; right:0; margin-top: -0.35rem; content: ""; display: block; width: 0.4rem; height: 0.4rem; border: solid #cdcdcd; border-width: 0.1rem 0.1rem 0 0; -webkit-transform: rotate(135deg); transform: rotate(135deg); }
.listform-sel-bor:before{ right:.5rem;}
.ptb7{ padding-top:.35rem; padding-bottom:.35rem;}
.listform-sel select{ width:100%; height:1.5rem; border:none;}
.listform-sel-bor select{ border:1px solid #e1e1e1; border-radius:4px; padding:0 .5rem;}
.listsel-two{ width:47%; margin-left:4%;}
.c-list-info .listsel-two:first-child{ margin-left:0;}
.listsel-three{ width:30%; margin-left:3%;}
.c-list-info .listsel-three:first-child{ margin-left:0;}
.listform-textarea{ display:block; width:100%; border:none; position:relative;}
.listform-sel-other{width:100%; height:1.5rem; border:1px solid #e1e1e1; border-radius:.2rem; padding:0 .5rem;}

js/cross.ui.js

@@ -0,0 +1,131 @@
/**
 * cross ui_form.js
 */
$(function(){
    $.fn.formFocus = function (){
        var $this = $(this);
        if($this.parents('.input-group').find('span.input-group-addon').length>0 && $this.attr('data-form')=="focus"){
            $span = $this.parents('.input-group').find('span.input-group-addon');
            $span.addClass('focus');
            $this.on('blur',function(){
                $span.removeClass('focus');
            });
        }
        if($this.attr('data-form')=="clear"){
            var $clear = $('<div class="input-clear"></div>').insertAfter($this);
            $this.on('blur',function(){
                setTimeout(function(){$clear.remove();},200);
            });
            $clear.on('click',function(){
                $this.val('').focus();
            });
        }
    }
    $(document).on('focus','input[data-form="focus"],input[data-form="clear"]',function(){
        $(this).formFocus();
    });
    $('body').on('click','label.input-group-checkbox',function(e){
        if (e || e.preventDefault()) e.preventDefault(); else window.event.returnValue = false;
            var $el=$(this),
            $div=$el.children('.input-group-pack'),
            $input=$div.children(':checkbox');
            if($div.is('.input-group-pack-disabled')){
                return false;
            }
            if($div.is('.checked')) {
                $div.removeClass('checked');
                $input.prop({'checked':false});
        } else {
            $div.addClass('checked');
            $input.prop({'checked':true});
        }
    });
    $('body').on('click','label.input-group-radio',function(e){
        if (e || e.preventDefault()) e.preventDefault(); else window.event.returnValue = false;
        var $el=$(this),
        $div=$el.children('.input-group-pack'),
        $input=$div.children(':radio');
        if($div.is('.input-group-pack-disabled')){
            return false;
        }
        $el.parent().find('.input-group-radio').children('.input-group-pack').removeClass('checked').find(':radio').prop({'checked':false});
        $div.addClass('checked');
        $input.prop({'checked':true});
    });
});
var myLayer = {
	alert: function(content,time,callback){
		if($(".c-alert-box").is(":visible")){
			$(".c-alert-box").remove();
		}
		if(time == undefined || time == "" || time == null){
			time = 3000;
		}
		var ahtml = '<div class="c-alert-box">'+content+'</div><div class="c-al-screen"></div>';
		$("body").append(ahtml);
		var aleL = ($(window).width() - $(".c-alert-box").width() - 20) / 2;
		$(".c-alert-box").css('left', aleL + "px");
		setTimeout(function(){
			$(".c-alert-box,.c-al-screen").remove();
			if (callback){callback();}
		},time);
	},
	load: function(content){
		if($(".c-load-box").is(":visible")){
			$(".c-load-box").remove();
		}
		if(content == undefined || content == "" || content == null){
			content = "\u52a0\u8f7d\u4e2d..."
		}
		var lhtml = '<div class="c-load-box"><span class="loadgif"></span><p>'+content+'</p></div><div class="c-al-screen"></div>';
		$("body").append(lhtml);
		var totW = $(window).width();
		var aleL = (totW - $(".c-load-box").width() - 60) / 2;
		$(".c-load-box").css('left', aleL + "px");
	},
	clear: function(){
		$(".c-load-box,.c-al-screen").remove();
	},
	confirm: function(options){
		var dft= {
			title:'',
			con:'',
			cancel: null,
			cancelValue:'\u53d6\u6d88',
			ok: null,
			okValue:'\u786e\u5b9a'
		}
		var ops = $.extend(dft,options);
		var chtml = '<div class="c-conf-screen"></div>';
		chtml += '<div class="c-conf-box">';
		if(ops.title != ""){
			chtml += '<div class="conftitle">'+ops.title+'</div>';
		}
		chtml += '<div class="confcontent">'+ops.con+'</div>';
		if(ops.cancel != null){
			chtml += '<div class="c-confbtn"><a href="javascript:;" class="c-twobtn" id="popcanclebtn">'+ops.cancelValue+'</a><a href="javascript:;" class="c-twobtn" id="popsurebtn">'+ops.okValue+'</a></div>';
		}else{
			chtml += '<div class="c-confbtn"><a href="javascript:;" class="c-onebtn" id="popsurebtn">'+ops.okValue+'</a></div>';	
		}
		chtml += '</div></div>';
		$("body").append(chtml);
		var aleT = ($(".c-conf-box").height() + 15) / 2;
		$(".c-conf-box").css('margin-top', -aleT);
		$("#popcanclebtn").click(function(){
			if (ops.cancel){ops.cancel();}
			$(".c-conf-box,.c-conf-screen").remove();
		});
		$("#popsurebtn").click(function(){
			if (ops.ok){ops.ok();}
			$(".c-conf-box,.c-conf-screen").remove();
		});
	}
}

plugins/layui-v2.3.0/layui/css/layui.css

@@ -0,0 +1,4620 @@
/** layui-v2.3.0 MIT License By https://www.layui.com */
.layui-inline,
img {
    display: inline-block;
    vertical-align: middle;
}
.layui-rate,
li {
    list-style: none
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400
}
.layui-edge,
.layui-header,
.layui-inline,
.layui-main {
    position: relative
}
.layui-btn,
.layui-edge,
.layui-inline,
img {
    vertical-align: middle
}
.layui-btn,
.layui-disabled,
.layui-icon,
.layui-unselect {
    -webkit-user-select: none;
    -ms-user-select: none;
    -moz-user-select: none
}
blockquote,
body,
button,
dd,
div,
dl,
dt,
form,
h1,
h2,
h3,
h4,
h5,
h6,
input,
li,
ol,
p,
pre,
td,
textarea,
th,
ul {
    margin: 0;
    padding: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
a:active,
a:hover {
    outline: 0
}
img {
    border: none
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
h4,
h5,
h6 {
    font-size: 100%
}
button,
input,
optgroup,
option,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    outline: 0
}
pre {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word
}
body {
    line-height: 24px;
    font: 14px Helvetica Neue, Helvetica, PingFang SC, \5FAE\8F6F\96C5\9ED1, Tahoma, Arial, sans-serif
}
hr {
    height: 1px;
    margin: 10px 0;
    border: 0;
    clear: both
}
a {
    color: #333;
    /* text-decoration: none */
}
a:hover {
    color: #777
}
a cite {
    font-style: normal;
    *cursor: pointer
}
.layui-border-box,
.layui-border-box * {
    box-sizing: border-box
}
.layui-box,
.layui-box * {
    box-sizing: content-box
}
.layui-clear {
    clear: both;
    *zoom: 1
}
.layui-clear:after {
    content: '\20';
    clear: both;
    *zoom: 1;
    display: block;
    height: 0
}
.layui-inline {
    *display: inline;
    *zoom: 1
}
.layui-edge {
    display: inline-block;
    width: 0;
    height: 0;
    border-width: 6px;
    border-style: dashed;
    border-color: transparent;
    overflow: hidden
}
.layui-edge-top {
    top: -4px;
    border-bottom-color: #999;
    border-bottom-style: solid
}
.layui-edge-right {
    border-left-color: #999;
    border-left-style: solid
}
.layui-edge-bottom {
    top: 2px;
    border-top-color: #999;
    border-top-style: solid
}
.layui-edge-left {
    border-right-color: #999;
    border-right-style: solid
}
.layui-elip {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}
.layui-disabled,
.layui-disabled:hover {
    color: #d2d2d2 !important;
    cursor: not-allowed !important
}
.layui-circle {
    border-radius: 100%
}
.layui-show {
    display: block !important
}
.layui-hide {
    display: none !important
}
@font-face {
    font-family: layui-icon;
    src: url(../font/iconfont.eot?v=230);
    src: url(../font/iconfont.eot?v=230#iefix) format('embedded-opentype'), url(../font/iconfont.svg?v=230#iconfont) format('svg'), url(../font/iconfont.woff?v=230) format('woff'), url(../font/iconfont.ttf?v=230) format('truetype')
}
.layui-icon {
    font-family: layui-icon !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
.layui-icon-reply-fill:before {
    content: "\e611"
}
.layui-icon-set-fill:before {
    content: "\e614"
}
.layui-icon-menu-fill:before {
    content: "\e60f"
}
.layui-icon-search:before {
    content: "\e615"
}
.layui-icon-share:before {
    content: "\e641"
}
.layui-icon-set-sm:before {
    content: "\e620"
}
.layui-icon-engine:before {
    content: "\e628"
}
.layui-icon-close:before {
    content: "\1006"
}
.layui-icon-close-fill:before {
    content: "\1007"
}
.layui-icon-chart-screen:before {
    content: "\e629"
}
.layui-icon-star:before {
    content: "\e600"
}
.layui-icon-circle-dot:before {
    content: "\e617"
}
.layui-icon-chat:before {
    content: "\e606"
}
.layui-icon-release:before {
    content: "\e609"
}
.layui-icon-list:before {
    content: "\e60a"
}
.layui-icon-chart:before {
    content: "\e62c"
}
.layui-icon-ok-circle:before {
    content: "\1005"
}
.layui-icon-layim-theme:before {
    content: "\e61b"
}
.layui-icon-table:before {
    content: "\e62d"
}
.layui-icon-right:before {
    content: "\e602"
}
.layui-icon-left:before {
    content: "\e603"
}
.layui-icon-cart-simple:before {
    content: "\e698"
}
.layui-icon-face-cry:before {
    content: "\e69c"
}
.layui-icon-face-smile:before {
    content: "\e6af"
}
.layui-icon-survey:before {
    content: "\e6b2"
}
.layui-icon-tree:before {
    content: "\e62e"
}
.layui-icon-upload-circle:before {
    content: "\e62f"
}
.layui-icon-add-circle:before {
    content: "\e61f"
}
.layui-icon-download-circle:before {
    content: "\e601"
}
.layui-icon-templeate-1:before {
    content: "\e630"
}
.layui-icon-util:before {
    content: "\e631"
}
.layui-icon-face-surprised:before {
    content: "\e664"
}
.layui-icon-edit:before {
    content: "\e642"
}
.layui-icon-speaker:before {
    content: "\e645"
}
.layui-icon-down:before {
    content: "\e61a"
}
.layui-icon-file:before {
    content: "\e621"
}
.layui-icon-layouts:before {
    content: "\e632"
}
.layui-icon-rate-half:before {
    content: "\e6c9"
}
.layui-icon-add-circle-fine:before {
    content: "\e608"
}
.layui-icon-prev-circle:before {
    content: "\e633"
}
.layui-icon-read:before {
    content: "\e705"
}
.layui-icon-404:before {
    content: "\e61c"
}
.layui-icon-carousel:before {
    content: "\e634"
}
.layui-icon-help:before {
    content: "\e607"
}
.layui-icon-code-circle:before {
    content: "\e635"
}
.layui-icon-water:before {
    content: "\e636"
}
.layui-icon-username:before {
    content: "\e66f"
}
.layui-icon-find-fill:before {
    content: "\e670"
}
.layui-icon-about:before {
    content: "\e60b"
}
.layui-icon-location:before {
    content: "\e715"
}
.layui-icon-up:before {
    content: "\e619"
}
.layui-icon-pause:before {
    content: "\e651"
}
.layui-icon-date:before {
    content: "\e637"
}
.layui-icon-layim-uploadfile:before {
    content: "\e61d"
}
.layui-icon-delete:before {
    content: "\e640"
}
.layui-icon-play:before {
    content: "\e652"
}
.layui-icon-top:before {
    content: "\e604"
}
.layui-icon-friends:before {
    content: "\e612"
}
.layui-icon-refresh-3:before {
    content: "\e9aa"
}
.layui-icon-ok:before {
    content: "\e605"
}
.layui-icon-layer:before {
    content: "\e638"
}
.layui-icon-face-smile-fine:before {
    content: "\e60c"
}
.layui-icon-dollar:before {
    content: "\e659"
}
.layui-icon-group:before {
    content: "\e613"
}
.layui-icon-layim-download:before {
    content: "\e61e"
}
.layui-icon-picture-fine:before {
    content: "\e60d"
}
.layui-icon-link:before {
    content: "\e64c"
}
.layui-icon-diamond:before {
    content: "\e735"
}
.layui-icon-log:before {
    content: "\e60e"
}
.layui-icon-rate-solid:before {
    content: "\e67a"
}
.layui-icon-fonts-del:before {
    content: "\e64f"
}
.layui-icon-unlink:before {
    content: "\e64d"
}
.layui-icon-fonts-clear:before {
    content: "\e639"
}
.layui-icon-triangle-r:before {
    content: "\e623"
}
.layui-icon-circle:before {
    content: "\e63f"
}
.layui-icon-radio:before {
    content: "\e643"
}
.layui-icon-align-center:before {
    content: "\e647"
}
.layui-icon-align-right:before {
    content: "\e648"
}
.layui-icon-align-left:before {
    content: "\e649"
}
.layui-icon-loading-1:before {
    content: "\e63e"
}
.layui-icon-return:before {
    content: "\e65c"
}
.layui-icon-fonts-strong:before {
    content: "\e62b"
}
.layui-icon-upload:before {
    content: "\e67c"
}
.layui-icon-dialogue:before {
    content: "\e63a"
}
.layui-icon-video:before {
    content: "\e6ed"
}
.layui-icon-headset:before {
    content: "\e6fc"
}
.layui-icon-cellphone-fine:before {
    content: "\e63b"
}
.layui-icon-add-1:before {
    content: "\e654"
}
.layui-icon-face-smile-b:before {
    content: "\e650"
}
.layui-icon-fonts-html:before {
    content: "\e64b"
}
.layui-icon-form:before {
    content: "\e63c"
}
.layui-icon-cart:before {
    content: "\e657"
}
.layui-icon-camera-fill:before {
    content: "\e65d"
}
.layui-icon-tabs:before {
    content: "\e62a"
}
.layui-icon-fonts-code:before {
    content: "\e64e"
}
.layui-icon-fire:before {
    content: "\e756"
}
.layui-icon-set:before {
    content: "\e716"
}
.layui-icon-fonts-u:before {
    content: "\e646"
}
.layui-icon-triangle-d:before {
    content: "\e625"
}
.layui-icon-tips:before {
    content: "\e702"
}
.layui-icon-picture:before {
    content: "\e64a"
}
.layui-icon-more-vertical:before {
    content: "\e671"
}
.layui-icon-flag:before {
    content: "\e66c"
}
.layui-icon-loading:before {
    content: "\e63d"
}
.layui-icon-fonts-i:before {
    content: "\e644"
}
.layui-icon-refresh-1:before {
    content: "\e666"
}
.layui-icon-rmb:before {
    content: "\e65e"
}
.layui-icon-home:before {
    content: "\e68e"
}
.layui-icon-user:before {
    content: "\e770"
}
.layui-icon-notice:before {
    content: "\e667"
}
.layui-icon-login-weibo:before {
    content: "\e675"
}
.layui-icon-voice:before {
    content: "\e688"
}
.layui-icon-upload-drag:before {
    content: "\e681"
}
.layui-icon-login-qq:before {
    content: "\e676"
}
.layui-icon-snowflake:before {
    content: "\e6b1"
}
.layui-icon-file-b:before {
    content: "\e655"
}
.layui-icon-template:before {
    content: "\e663"
}
.layui-icon-auz:before {
    content: "\e672"
}
.layui-icon-console:before {
    content: "\e665"
}
.layui-icon-app:before {
    content: "\e653"
}
.layui-icon-prev:before {
    content: "\e65a"
}
.layui-icon-website:before {
    content: "\e7ae"
}
.layui-icon-next:before {
    content: "\e65b"
}
.layui-icon-component:before {
    content: "\e857"
}
.layui-icon-more:before {
    content: "\e65f"
}
.layui-icon-login-wechat:before {
    content: "\e677"
}
.layui-icon-shrink-right:before {
    content: "\e668"
}
.layui-icon-spread-left:before {
    content: "\e66b"
}
.layui-icon-camera:before {
    content: "\e660"
}
.layui-icon-note:before {
    content: "\e66e"
}
.layui-icon-refresh:before {
    content: "\e669"
}
.layui-icon-female:before {
    content: "\e661"
}
.layui-icon-male:before {
    content: "\e662"
}
.layui-icon-password:before {
    content: "\e673"
}
.layui-icon-senior:before {
    content: "\e674"
}
.layui-icon-theme:before {
    content: "\e66a"
}
.layui-icon-tread:before {
    content: "\e6c5"
}
.layui-icon-praise:before {
    content: "\e6c6"
}
.layui-icon-star-fill:before {
    content: "\e658"
}
.layui-icon-rate:before {
    content: "\e67b"
}
.layui-icon-template-1:before {
    content: "\e656"
}
.layui-icon-vercode:before {
    content: "\e679"
}
.layui-icon-cellphone:before {
    content: "\e678"
}
.layui-icon-screen-full:before {
    content: "\e622"
}
.layui-icon-screen-restore:before {
    content: "\e758"
}
.layui-main {
    width: 1140px;
    margin: 0 auto
}
.layui-header {
    z-index: 1000;
    height: 60px
}
.layui-header a:hover {
    transition: all .5s;
    -webkit-transition: all .5s
}
.layui-side {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 999;
    width: 200px;
    overflow-x: hidden
}
.layui-side-scroll {
    position: relative;
    width: 220px;
    height: 100%;
    overflow-x: hidden
}
.layui-body {
    position: absolute;
    left: 200px;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 998;
    width: auto;
    overflow: hidden;
    overflow-y: auto;
    box-sizing: border-box
}
.layui-layout-body {
    overflow: hidden
}
.layui-layout-admin .layui-header {
    background-color: #23262E
}
.layui-layout-admin .layui-side {
    top: 60px;
    width: 200px;
    overflow-x: hidden
}
.layui-layout-admin .layui-body {
    top: 60px;
    bottom: 44px
}
.layui-layout-admin .layui-main {
    width: auto;
    margin: 0 15px
}
.layui-layout-admin .layui-footer {
    position: fixed;
    left: 200px;
    right: 0;
    bottom: 0;
    height: 44px;
    line-height: 44px;
    padding: 0 15px;
    background-color: #eee
}
.layui-layout-admin .layui-logo {
    position: absolute;
    left: 0;
    top: 0;
    width: 200px;
    height: 100%;
    line-height: 60px;
    text-align: center;
    color: #009688;
    font-size: 16px
}
.layui-layout-admin .layui-header .layui-nav {
    background: 0 0
}
.layui-layout-left {
    position: absolute !important;
    left: 200px;
    top: 0
}
.layui-layout-right {
    position: absolute !important;
    right: 0;
    top: 0
}
.layui-container {
    position: relative;
    margin: 0 auto;
    padding: 0 15px;
    box-sizing: border-box
}
.layui-fluid {
    position: relative;
    margin: 0 auto;
    padding: 0 15px
}
.layui-row:after,
.layui-row:before {
    content: '';
    display: block;
    clear: both
}
.layui-col-lg1,
.layui-col-lg10,
.layui-col-lg11,
.layui-col-lg12,
.layui-col-lg2,
.layui-col-lg3,
.layui-col-lg4,
.layui-col-lg5,
.layui-col-lg6,
.layui-col-lg7,
.layui-col-lg8,
.layui-col-lg9,
.layui-col-md1,
.layui-col-md10,
.layui-col-md11,
.layui-col-md12,
.layui-col-md2,
.layui-col-md3,
.layui-col-md4,
.layui-col-md5,
.layui-col-md6,
.layui-col-md7,
.layui-col-md8,
.layui-col-md9,
.layui-col-sm1,
.layui-col-sm10,
.layui-col-sm11,
.layui-col-sm12,
.layui-col-sm2,
.layui-col-sm3,
.layui-col-sm4,
.layui-col-sm5,
.layui-col-sm6,
.layui-col-sm7,
.layui-col-sm8,
.layui-col-sm9,
.layui-col-xs1,
.layui-col-xs10,
.layui-col-xs11,
.layui-col-xs12,
.layui-col-xs2,
.layui-col-xs3,
.layui-col-xs4,
.layui-col-xs5,
.layui-col-xs6,
.layui-col-xs7,
.layui-col-xs8,
.layui-col-xs9 {
    position: relative;
    display: block;
    box-sizing: border-box
}
.layui-col-xs1,
.layui-col-xs10,
.layui-col-xs11,
.layui-col-xs12,
.layui-col-xs2,
.layui-col-xs3,
.layui-col-xs4,
.layui-col-xs5,
.layui-col-xs6,
.layui-col-xs7,
.layui-col-xs8,
.layui-col-xs9 {
    float: left
}
.layui-col-xs1 {
    width: 8.33333333%
}
.layui-col-xs2 {
    width: 16.66666667%
}
.layui-col-xs3 {
    width: 25%
}
.layui-col-xs4 {
    width: 33.33333333%
}
.layui-col-xs5 {
    width: 41.66666667%
}
.layui-col-xs6 {
    width: 50%
}
.layui-col-xs7 {
    width: 58.33333333%
}
.layui-col-xs8 {
    width: 66.66666667%
}
.layui-col-xs9 {
    width: 75%
}
.layui-col-xs10 {
    width: 83.33333333%
}
.layui-col-xs11 {
    width: 91.66666667%
}
.layui-col-xs12 {
    width: 100%
}
.layui-col-xs-offset1 {
    margin-left: 8.33333333%
}
.layui-col-xs-offset2 {
    margin-left: 16.66666667%
}
.layui-col-xs-offset3 {
    margin-left: 25%
}
.layui-col-xs-offset4 {
    margin-left: 33.33333333%
}
.layui-col-xs-offset5 {
    margin-left: 41.66666667%
}
.layui-col-xs-offset6 {
    margin-left: 50%
}
.layui-col-xs-offset7 {
    margin-left: 58.33333333%
}
.layui-col-xs-offset8 {
    margin-left: 66.66666667%
}
.layui-col-xs-offset9 {
    margin-left: 75%
}
.layui-col-xs-offset10 {
    margin-left: 83.33333333%
}
.layui-col-xs-offset11 {
    margin-left: 91.66666667%
}
.layui-col-xs-offset12 {
    margin-left: 100%
}
@media screen and (max-width:768px) {
    .layui-hide-xs {
        display: none !important
    }
    .layui-show-xs-block {
        display: block !important
    }
    .layui-show-xs-inline {
        display: inline !important
    }
    .layui-show-xs-inline-block {
        display: inline-block !important
    }
}
@media screen and (min-width:768px) {
    .layui-container {
        width: 750px
    }
    .layui-hide-sm {
        display: none !important
    }
    .layui-show-sm-block {
        display: block !important
    }
    .layui-show-sm-inline {
        display: inline !important
    }
    .layui-show-sm-inline-block {
        display: inline-block !important
    }
    .layui-col-sm1,
    .layui-col-sm10,
    .layui-col-sm11,
    .layui-col-sm12,
    .layui-col-sm2,
    .layui-col-sm3,
    .layui-col-sm4,
    .layui-col-sm5,
    .layui-col-sm6,
    .layui-col-sm7,
    .layui-col-sm8,
    .layui-col-sm9 {
        float: left
    }
    .layui-col-sm1 {
        width: 8.33333333%
    }
    .layui-col-sm2 {
        width: 16.66666667%
    }
    .layui-col-sm3 {
        width: 25%
    }
    .layui-col-sm4 {
        width: 33.33333333%
    }
    .layui-col-sm5 {
        width: 41.66666667%
    }
    .layui-col-sm6 {
        width: 50%
    }
    .layui-col-sm7 {
        width: 58.33333333%
    }
    .layui-col-sm8 {
        width: 66.66666667%
    }
    .layui-col-sm9 {
        width: 75%
    }
    .layui-col-sm10 {
        width: 83.33333333%
    }
    .layui-col-sm11 {
        width: 91.66666667%
    }
    .layui-col-sm12 {
        width: 100%
    }
    .layui-col-sm-offset1 {
        margin-left: 8.33333333%
    }
    .layui-col-sm-offset2 {
        margin-left: 16.66666667%
    }
    .layui-col-sm-offset3 {
        margin-left: 25%
    }
    .layui-col-sm-offset4 {
        margin-left: 33.33333333%
    }
    .layui-col-sm-offset5 {
        margin-left: 41.66666667%
    }
    .layui-col-sm-offset6 {
        margin-left: 50%
    }
    .layui-col-sm-offset7 {
        margin-left: 58.33333333%
    }
    .layui-col-sm-offset8 {
        margin-left: 66.66666667%
    }
    .layui-col-sm-offset9 {
        margin-left: 75%
    }
    .layui-col-sm-offset10 {
        margin-left: 83.33333333%
    }
    .layui-col-sm-offset11 {
        margin-left: 91.66666667%
    }
    .layui-col-sm-offset12 {
        margin-left: 100%
    }
}
@media screen and (min-width:992px) {
    .layui-container {
        width: 970px
    }
    .layui-hide-md {
        display: none !important
    }
    .layui-show-md-block {
        display: block !important
    }
    .layui-show-md-inline {
        display: inline !important
    }
    .layui-show-md-inline-block {
        display: inline-block !important
    }
    .layui-col-md1,
    .layui-col-md10,
    .layui-col-md11,
    .layui-col-md12,
    .layui-col-md2,
    .layui-col-md3,
    .layui-col-md4,
    .layui-col-md5,
    .layui-col-md6,
    .layui-col-md7,
    .layui-col-md8,
    .layui-col-md9 {
        float: left
    }
    .layui-col-md1 {
        width: 8.33333333%
    }
    .layui-col-md2 {
        width: 16.66666667%
    }
    .layui-col-md3 {
        width: 25%
    }
    .layui-col-md4 {
        width: 33.33333333%
    }
    .layui-col-md5 {
        width: 41.66666667%
    }
    .layui-col-md6 {
        width: 50%
    }
    .layui-col-md7 {
        width: 58.33333333%
    }
    .layui-col-md8 {
        width: 66.66666667%
    }
    .layui-col-md9 {
        width: 75%
    }
    .layui-col-md10 {
        width: 83.33333333%
    }
    .layui-col-md11 {
        width: 91.66666667%
    }
    .layui-col-md12 {
        width: 100%
    }
    .layui-col-md-offset1 {
        margin-left: 8.33333333%
    }
    .layui-col-md-offset2 {
        margin-left: 16.66666667%
    }
    .layui-col-md-offset3 {
        margin-left: 25%
    }
    .layui-col-md-offset4 {
        margin-left: 33.33333333%
    }
    .layui-col-md-offset5 {
        margin-left: 41.66666667%
    }
    .layui-col-md-offset6 {
        margin-left: 50%
    }
    .layui-col-md-offset7 {
        margin-left: 58.33333333%
    }
    .layui-col-md-offset8 {
        margin-left: 66.66666667%
    }
    .layui-col-md-offset9 {
        margin-left: 75%
    }
    .layui-col-md-offset10 {
        margin-left: 83.33333333%
    }
    .layui-col-md-offset11 {
        margin-left: 91.66666667%
    }
    .layui-col-md-offset12 {
        margin-left: 100%
    }
}
@media screen and (min-width:1200px) {
    .layui-container {
        width: 1170px
    }
    .layui-hide-lg {
        display: none !important
    }
    .layui-show-lg-block {
        display: block !important
    }
    .layui-show-lg-inline {
        display: inline !important
    }
    .layui-show-lg-inline-block {
        display: inline-block !important
    }
    .layui-col-lg1,
    .layui-col-lg10,
    .layui-col-lg11,
    .layui-col-lg12,
    .layui-col-lg2,
    .layui-col-lg3,
    .layui-col-lg4,
    .layui-col-lg5,
    .layui-col-lg6,
    .layui-col-lg7,
    .layui-col-lg8,
    .layui-col-lg9 {
        float: left
    }
    .layui-col-lg1 {
        width: 8.33333333%
    }
    .layui-col-lg2 {
        width: 16.66666667%
    }
    .layui-col-lg3 {
        width: 25%
    }
    .layui-col-lg4 {
        width: 33.33333333%
    }
    .layui-col-lg5 {
        width: 41.66666667%
    }
    .layui-col-lg6 {
        width: 50%
    }
    .layui-col-lg7 {
        width: 58.33333333%
    }
    .layui-col-lg8 {
        width: 66.66666667%
    }
    .layui-col-lg9 {
        width: 75%
    }
    .layui-col-lg10 {
        width: 83.33333333%
    }
    .layui-col-lg11 {
        width: 91.66666667%
    }
    .layui-col-lg12 {
        width: 100%
    }
    .layui-col-lg-offset1 {
        margin-left: 8.33333333%
    }
    .layui-col-lg-offset2 {
        margin-left: 16.66666667%
    }
    .layui-col-lg-offset3 {
        margin-left: 25%
    }
    .layui-col-lg-offset4 {
        margin-left: 33.33333333%
    }
    .layui-col-lg-offset5 {
        margin-left: 41.66666667%
    }
    .layui-col-lg-offset6 {
        margin-left: 50%
    }
    .layui-col-lg-offset7 {
        margin-left: 58.33333333%
    }
    .layui-col-lg-offset8 {
        margin-left: 66.66666667%
    }
    .layui-col-lg-offset9 {
        margin-left: 75%
    }
    .layui-col-lg-offset10 {
        margin-left: 83.33333333%
    }
    .layui-col-lg-offset11 {
        margin-left: 91.66666667%
    }
    .layui-col-lg-offset12 {
        margin-left: 100%
    }
}
.layui-col-space1 {
    margin: -.5px
}
.layui-col-space1>* {
    padding: .5px
}
.layui-col-space3 {
    margin: -1.5px
}
.layui-col-space3>* {
    padding: 1.5px
}
.layui-col-space5 {
    margin: -2.5px
}
.layui-col-space5>* {
    padding: 2.5px
}
.layui-col-space8 {
    margin: -3.5px
}
.layui-col-space8>* {
    padding: 3.5px
}
.layui-col-space10 {
    margin: -5px
}
.layui-col-space10>* {
    padding: 5px
}
.layui-col-space12 {
    margin: -6px
}
.layui-col-space12>* {
    padding: 6px
}
.layui-col-space15 {
    margin: -7.5px
}
.layui-col-space15>* {
    padding: 7.5px
}
.layui-col-space18 {
    margin: -9px
}
.layui-col-space18>* {
    padding: 9px
}
.layui-col-space20 {
    margin: -10px
}
.layui-col-space20>* {
    padding: 10px
}
.layui-col-space22 {
    margin: -11px
}
.layui-col-space22>* {
    padding: 11px
}
.layui-col-space25 {
    margin: -12.5px
}
.layui-col-space25>* {
    padding: 12.5px
}
.layui-col-space30 {
    margin: -15px
}
.layui-col-space30>* {
    padding: 15px
}
.layui-btn,
.layui-input,
.layui-select,
.layui-textarea,
.layui-upload-button {
    outline: 0;
    -webkit-appearance: none;
    transition: all .3s;
    -webkit-transition: all .3s;
    box-sizing: border-box
}
.layui-elem-quote {
    margin-bottom: 10px;
    padding: 15px;
    line-height: 22px;
    border-left: 5px solid #009688;
    border-radius: 0 2px 2px 0;
    background-color: #f2f2f2
}
.layui-quote-nm {
    border-style: solid;
    border-width: 1px 1px 1px 5px;
    background: 0 0
}
.layui-elem-field {
    margin-bottom: 10px;
    padding: 0;
    border-width: 1px;
    border-style: solid
}
.layui-elem-field legend {
    margin-left: 20px;
    padding: 0 10px;
    font-size: 20px;
    font-weight: 300
}
.layui-field-title {
    margin: 10px 0 20px;
    border-width: 1px 0 0
}
.layui-field-box {
    padding: 10px 15px
}
.layui-field-title .layui-field-box {
    padding: 10px 0
}
.layui-progress {
    position: relative;
    height: 6px;
    border-radius: 20px;
    background-color: #e2e2e2
}
.layui-progress-bar {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    max-width: 100%;
    height: 6px;
    border-radius: 20px;
    text-align: right;
    background-color: #5FB878;
    transition: all .3s;
    -webkit-transition: all .3s
}
.layui-progress-big,
.layui-progress-big .layui-progress-bar {
    height: 28px;
    line-height: 28px
}
.layui-progress-text {
    position: relative;
    top: -20px;
    line-height: 18px;
    font-size: 12px;
    color: #666
}
.layui-progress-big .layui-progress-text {
    position: static;
    padding: 0 10px;
    color: #fff
}
.layui-collapse {
    border-width: 1px;
    border-style: solid;
    border-radius: 2px
}
.layui-colla-content,
.layui-colla-item {
    border-top-width: 1px;
    border-top-style: solid
}
.layui-colla-item:first-child {
    border-top: none
}
.layui-colla-title {
    position: relative;
    height: 42px;
    line-height: 42px;
    padding: 0 15px 0 35px;
    color: #333;
    background-color: #f2f2f2;
    cursor: pointer;
    font-size: 14px;
    overflow: hidden
}
.layui-colla-content {
    display: none;
    padding: 10px 15px;
    line-height: 22px;
    color: #666
}
.layui-colla-icon {
    position: absolute;
    left: 15px;
    top: 0;
    font-size: 14px
}
.layui-card-body,
.layui-card-header,
.layui-form-label,
.layui-form-mid,
.layui-form-select,
.layui-input-block,
.layui-input-inline,
.layui-textarea {
    position: relative
}
.layui-card {
    margin-bottom: 15px;
    border-radius: 2px;
    background-color: #fff;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05)
}
.layui-card:last-child {
    margin-bottom: 0
}
.layui-card-header {
    height: 42px;
    line-height: 42px;
    padding: 0 15px;
    border-bottom: 1px solid #f6f6f6;
    color: #333;
    border-radius: 2px 2px 0 0;
    font-size: 14px
}
.layui-bg-black,
.layui-bg-blue,
.layui-bg-cyan,
.layui-bg-green,
.layui-bg-orange,
.layui-bg-red {
    color: #fff !important
}
.layui-card-body {
    padding: 10px 15px;
    line-height: 24px
}
.layui-card-body[pad15] {
    padding: 15px
}
.layui-card-body[pad20] {
    padding: 20px
}
.layui-card-body .layui-table {
    margin: 5px 0
}
.layui-card .layui-tab {
    margin: 0
}
.layui-panel-window {
    position: relative;
    padding: 15px;
    border-radius: 0;
    border-top: 5px solid #E6E6E6;
    background-color: #fff
}
.layui-bg-red {
    background-color: #FF5722 !important
}
.layui-bg-orange {
    background-color: #FFB800 !important
}
.layui-bg-green {
    background-color: #009688 !important
}
.layui-bg-cyan {
    background-color: #2F4056 !important
}
.layui-bg-blue {
    background-color: #1E9FFF !important
}
.layui-bg-black {
    background-color: #393D49 !important
}
.layui-bg-gray {
    background-color: #eee !important;
    color: #666 !important
}
.layui-badge-rim,
.layui-colla-content,
.layui-colla-item,
.layui-collapse,
.layui-elem-field,
.layui-form-pane .layui-form-item[pane],
.layui-form-pane .layui-form-label,
.layui-input,
.layui-layedit,
.layui-layedit-tool,
.layui-quote-nm,
.layui-select,
.layui-tab-bar,
.layui-tab-card,
.layui-tab-title,
.layui-tab-title .layui-this:after,
.layui-textarea {
    border-color: #e6e6e6
}
.layui-timeline-item:before,
hr {
    background-color: #e6e6e6
}
.layui-text {
    line-height: 22px;
    font-size: 14px;
    color: #666
}
.layui-text h1,
.layui-text h2,
.layui-text h3 {
    font-weight: 500;
    color: #333
}
.layui-text h1 {
    font-size: 30px
}
.layui-text h2 {
    font-size: 24px
}
.layui-text h3 {
    font-size: 18px
}
.layui-text a:not(.layui-btn) {
    color: #01AAED
}
.layui-text a:not(.layui-btn):hover {
    text-decoration: underline
}
.layui-text ul {
    padding: 5px 0 5px 15px
}
.layui-text ul li {
    margin-top: 5px;
    list-style-type: disc
}
.layui-text em,
.layui-word-aux {
    color: #999 !important;
    padding: 0 5px !important
}
.layui-btn {
    display: inline-block;
    height: 38px;
    line-height: 38px;
    padding: 0 18px;
    background-color: #009688;
    color: #fff;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
    border: none;
    border-radius: 2px;
    cursor: pointer
}
.layui-btn:hover {
    opacity: .8;
    filter: alpha(opacity=80);
    color: #fff
}
.layui-btn:active {
    opacity: 1;
    filter: alpha(opacity=100)
}
.layui-btn+.layui-btn {
    margin-left: 10px
}
.layui-btn-container {
    font-size: 0
}
.layui-btn-container .layui-btn {
    margin-right: 10px;
    margin-bottom: 10px
}
.layui-btn-container .layui-btn+.layui-btn {
    margin-left: 0
}
.layui-table .layui-btn-container .layui-btn {
    margin-bottom: 9px
}
.layui-btn-radius {
    border-radius: 100px
}
.layui-btn .layui-icon {
    margin-right: 3px;
    font-size: 18px;
    vertical-align: bottom;
    vertical-align: middle\9
}
.layui-btn-primary {
    border: 1px solid #C9C9C9;
    background-color: #fff;
    color: #555
}
.layui-btn-primary:hover {
    border-color: #009688;
    color: #333
}
.layui-btn-normal {
    background-color: #1E9FFF
}
.layui-btn-warm {
    background-color: #FFB800
}
.layui-btn-danger {
    background-color: #FF5722
}
.layui-btn-disabled,
.layui-btn-disabled:active,
.layui-btn-disabled:hover {
    border: 1px solid #e6e6e6;
    background-color: #FBFBFB;
    color: #C9C9C9;
    cursor: not-allowed;
    opacity: 1
}
.layui-btn-lg {
    height: 44px;
    line-height: 44px;
    padding: 0 25px;
    font-size: 16px
}
.layui-btn-sm {
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    font-size: 12px
}
.layui-btn-sm i {
    font-size: 16px !important
}
.layui-btn-xs {
    height: 22px;
    line-height: 22px;
    padding: 0 5px;
    font-size: 12px
}
.layui-btn-xs i {
    font-size: 14px !important
}
.layui-btn-group {
    display: inline-block;
    vertical-align: middle;
    font-size: 0
}
.layui-btn-group .layui-btn {
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-left: 1px solid rgba(255, 255, 255, .5);
    border-radius: 0
}
.layui-btn-group .layui-btn-primary {
    border-left: none
}
.layui-btn-group .layui-btn-primary:hover {
    border-color: #C9C9C9;
    color: #009688
}
.layui-btn-group .layui-btn:first-child {
    border-left: none;
    border-radius: 2px 0 0 2px
}
.layui-btn-group .layui-btn-primary:first-child {
    border-left: 1px solid #c9c9c9
}
.layui-btn-group .layui-btn:last-child {
    border-radius: 0 2px 2px 0
}
.layui-btn-group .layui-btn+.layui-btn {
    margin-left: 0
}
.layui-btn-group+.layui-btn-group {
    margin-left: 10px
}
.layui-btn-fluid {
    width: 100%
}
.layui-input,
.layui-select,
.layui-textarea {
    height: 38px;
    line-height: 1.3;
    line-height: 38px\9;
    border-width: 1px;
    border-style: solid;
    background-color: #fff;
    border-radius: 2px
}
.layui-input::-webkit-input-placeholder,
.layui-select::-webkit-input-placeholder,
.layui-textarea::-webkit-input-placeholder {
    line-height: 1.3
}
.layui-input,
.layui-textarea {
    display: block;
    width: 100%;
    padding-left: 10px
}
.layui-input:hover,
.layui-textarea:hover {
    border-color: #D2D2D2 !important
}
.layui-input:focus,
.layui-textarea:focus {
    border-color: #C9C9C9 !important
}
.layui-textarea {
    min-height: 100px;
    height: auto;
    line-height: 20px;
    padding: 6px 10px;
    resize: vertical
}
.layui-select {
    padding: 0 10px
}
.layui-form input[type=checkbox],
.layui-form input[type=radio],
.layui-form select {
    display: none
}
.layui-form [lay-ignore] {
    display: initial
}
.layui-form-item {
    margin-bottom: 15px;
    clear: both;
    *zoom: 1
}
.layui-form-item:after {
    content: '\20';
    clear: both;
    *zoom: 1;
    display: block;
    height: 0
}
.layui-form-label {
    float: left;
    display: block;
    padding: 9px 15px;
    width: 80px;
    font-weight: 400;
    line-height: 20px;
    text-align: right
}
.layui-form-label-col {
    display: block;
    float: none;
    padding: 9px 0;
    line-height: 20px;
    text-align: left
}
.layui-form-item .layui-inline {
    margin-bottom: 5px;
    margin-right: 10px
}
.layui-input-block {
    margin-left: 110px;
    min-height: 36px
}
.layui-input-inline {
    display: inline-block;
    vertical-align: middle
}
.layui-form-item .layui-input-inline {
    float: left;
    width: 190px;
    margin-right: 10px
}
.layui-form-text .layui-input-inline {
    width: auto
}
.layui-form-mid {
    float: left;
    display: block;
    padding: 9px 0 !important;
    line-height: 20px;
    margin-right: 10px
}
.layui-form-danger+.layui-form-select .layui-input,
.layui-form-danger:focus {
    border-color: #FF5722 !important
}
.layui-form-select .layui-input {
    padding-right: 30px;
    cursor: pointer
}
.layui-form-select .layui-edge {
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -3px;
    cursor: pointer;
    border-width: 6px;
    border-top-color: #c2c2c2;
    border-top-style: solid;
    transition: all .3s;
    -webkit-transition: all .3s
}
.layui-form-select dl {
    display: none;
    position: absolute;
    left: 0;
    top: 42px;
    padding: 5px 0;
    z-index: 999;
    min-width: 100%;
    border: 1px solid #d2d2d2;
    max-height: 300px;
    overflow-y: auto;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
    box-sizing: border-box
}
.layui-form-select dl dd,
.layui-form-select dl dt {
    padding: 0 10px;
    line-height: 36px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}
.layui-form-select dl dt {
    font-size: 12px;
    color: #999
}
.layui-form-select dl dd {
    cursor: pointer
}
.layui-form-select dl dd:hover {
    background-color: #f2f2f2
}
.layui-form-select .layui-select-group dd {
    padding-left: 20px
}
.layui-form-select dl dd.layui-select-tips {
    padding-left: 10px !important;
    color: #999
}
.layui-form-select dl dd.layui-this {
    background-color: #5FB878;
    color: #fff
}
.layui-form-checkbox,
.layui-form-select dl dd.layui-disabled {
    background-color: #fff
}
.layui-form-selected dl {
    display: block
}
.layui-form-checkbox,
.layui-form-checkbox *,
.layui-form-switch {
    display: inline-block;
    vertical-align: middle
}
.layui-form-selected .layui-edge {
    margin-top: -9px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    margin-top: -3px\9
}
:root .layui-form-selected .layui-edge {
    margin-top: -9px\0/IE9
}
.layui-form-selectup dl {
    top: auto;
    bottom: 42px
}
.layui-select-none {
    margin: 5px 0;
    text-align: center;
    color: #999
}
.layui-select-disabled .layui-disabled {
    border-color: #eee !important
}
.layui-select-disabled .layui-edge {
    border-top-color: #d2d2d2
}
.layui-form-checkbox {
    position: relative;
    height: 30px;
    line-height: 30px;
    margin-right: 10px;
    padding-right: 30px;
    cursor: pointer;
    font-size: 0;
    -webkit-transition: .1s linear;
    transition: .1s linear;
    box-sizing: border-box
}
.layui-form-checkbox span {
    padding: 0 10px;
    height: 100%;
    font-size: 14px;
    border-radius: 2px 0 0 2px;
    background-color: #d2d2d2;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}
.layui-form-checkbox:hover span {
    background-color: #c2c2c2
}
.layui-form-checkbox i {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 28px;
    border: 1px solid #d2d2d2;
    border-left: none;
    border-radius: 0 2px 2px 0;
    color: #fff;
    font-size: 20px;
    text-align: center
}
.layui-form-checkbox:hover i {
    border-color: #c2c2c2;
    color: #c2c2c2
}
.layui-form-checked,
.layui-form-checked:hover {
    border-color: #5FB878
}
.layui-form-checked span,
.layui-form-checked:hover span {
    background-color: #5FB878
}
.layui-form-checked i,
.layui-form-checked:hover i {
    color: #5FB878
}
.layui-form-item .layui-form-checkbox {
    margin-top: 4px
}
.layui-form-checkbox[lay-skin=primary] {
    height: auto !important;
    line-height: normal !important;
    border: none !important;
    margin-right: 0;
    padding-right: 0;
    background: 0 0
}
.layui-form-checkbox[lay-skin=primary] span {
    float: right;
    padding-right: 15px;
    line-height: 18px;
    background: 0 0;
    color: #666
}
.layui-form-checkbox[lay-skin=primary] i {
    position: relative;
    top: 0;
    width: 16px;
    height: 16px;
    line-height: 16px;
    border: 1px solid #d2d2d2;
    font-size: 12px;
    border-radius: 2px;
    background-color: #fff;
    -webkit-transition: .1s linear;
    transition: .1s linear
}
.layui-form-checkbox[lay-skin=primary]:hover i {
    border-color: #5FB878;
    color: #fff
}
.layui-form-checked[lay-skin=primary] i {
    border-color: #5FB878;
    background-color: #5FB878;
    color: #fff
}
.layui-checkbox-disbaled[lay-skin=primary] span {
    background: 0 0 !important;
    color: #c2c2c2
}
.layui-checkbox-disbaled[lay-skin=primary]:hover i {
    border-color: #d2d2d2
}
.layui-form-item .layui-form-checkbox[lay-skin=primary] {
    margin-top: 10px
}
.layui-form-switch {
    position: relative;
    height: 22px;
    line-height: 22px;
    min-width: 35px;
    padding: 0 5px;
    margin-top: 8px;
    border: 1px solid #d2d2d2;
    border-radius: 20px;
    cursor: pointer;
    background-color: #fff;
    -webkit-transition: .1s linear;
    transition: .1s linear
}
.layui-form-switch i {
    position: absolute;
    left: 5px;
    top: 3px;
    width: 16px;
    height: 16px;
    border-radius: 20px;
    background-color: #d2d2d2;
    -webkit-transition: .1s linear;
    transition: .1s linear
}
.layui-form-switch em {
    position: relative;
    top: 0;
    width: 25px;
    margin-left: 21px;
    padding: 0 !important;
    text-align: center !important;
    color: #999 !important;
    font-style: normal !important;
    font-size: 12px
}
.layui-form-onswitch {
    border-color: #5FB878;
    background-color: #5FB878
}
.layui-checkbox-disbaled,
.layui-checkbox-disbaled i {
    border-color: #e2e2e2 !important
}
.layui-form-onswitch i {
    left: 100%;
    margin-left: -21px;
    background-color: #fff
}
.layui-form-onswitch em {
    margin-left: 5px;
    margin-right: 21px;
    color: #fff !important
}
.layui-checkbox-disbaled span {
    background-color: #e2e2e2 !important
}
.layui-checkbox-disbaled:hover i {
    color: #fff !important
}
[lay-radio] {
    display: none
}
.layui-form-radio,
.layui-form-radio * {
    display: inline-block;
    vertical-align: middle
}
.layui-form-radio {
    line-height: 28px;
    margin: 6px 10px 0 0;
    padding-right: 10px;
    cursor: pointer;
    font-size: 0
}
.layui-form-radio * {
    font-size: 14px
}
.layui-form-radio>i {
    margin-right: 8px;
    font-size: 22px;
    color: #c2c2c2
}
.layui-form-radio>i:hover,
.layui-form-radioed>i {
    color: #5FB878
}
.layui-radio-disbaled>i {
    color: #e2e2e2 !important
}
.layui-form-pane .layui-form-label {
    width: 110px;
    padding: 8px 15px;
    height: 38px;
    line-height: 20px;
    border-width: 1px;
    border-style: solid;
    border-radius: 2px 0 0 2px;
    text-align: center;
    background-color: #FBFBFB;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box
}
.layui-form-pane .layui-input-inline {
    margin-left: -1px
}
.layui-form-pane .layui-input-block {
    margin-left: 110px;
    left: -1px
}
.layui-form-pane .layui-input {
    border-radius: 0 2px 2px 0
}
.layui-form-pane .layui-form-text .layui-form-label {
    float: none;
    width: 100%;
    border-radius: 2px;
    box-sizing: border-box;
    text-align: left
}
.layui-form-pane .layui-form-text .layui-input-inline {
    display: block;
    margin: 0;
    top: -1px;
    clear: both
}
.layui-form-pane .layui-form-text .layui-input-block {
    margin: 0;
    left: 0;
    top: -1px
}
.layui-form-pane .layui-form-text .layui-textarea {
    min-height: 100px;
    border-radius: 0 0 2px 2px
}
.layui-form-pane .layui-form-checkbox {
    margin: 4px 0 4px 10px
}
.layui-form-pane .layui-form-radio,
.layui-form-pane .layui-form-switch {
    margin-top: 6px;
    margin-left: 10px
}
.layui-form-pane .layui-form-item[pane] {
    position: relative;
    border-width: 1px;
    border-style: solid
}
.layui-form-pane .layui-form-item[pane] .layui-form-label {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border-width: 0 1px 0 0
}
.layui-form-pane .layui-form-item[pane] .layui-input-inline {
    margin-left: 110px
}
@media screen and (max-width:450px) {
    .layui-form-item .layui-form-label {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap
    }
    .layui-form-item .layui-inline {
        display: block;
        margin-right: 0;
        margin-bottom: 20px;
        clear: both
    }
    .layui-form-item .layui-inline:after {
        content: '\20';
        clear: both;
        display: block;
        height: 0
    }
    .layui-form-item .layui-input-inline {
        display: block;
        float: none;
        left: -3px;
        width: auto;
        margin: 0 0 10px 112px
    }
    .layui-form-item .layui-input-inline+.layui-form-mid {
        margin-left: 110px;
        top: -5px;
        padding: 0
    }
    .layui-form-item .layui-form-checkbox {
        margin-right: 5px;
        margin-bottom: 5px
    }
}
.layui-layedit {
    border-width: 1px;
    border-style: solid;
    border-radius: 2px
}
.layui-layedit-tool {
    padding: 3px 5px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    font-size: 0
}
.layedit-tool-fixed {
    position: fixed;
    top: 0;
    border-top: 1px solid #e2e2e2
}
.layui-layedit-tool .layedit-tool-mid,
.layui-layedit-tool .layui-icon {
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-size: 14px
}
.layui-layedit-tool .layui-icon {
    position: relative;
    width: 32px;
    height: 30px;
    line-height: 30px;
    margin: 3px 5px;
    color: #777;
    cursor: pointer;
    border-radius: 2px
}
.layui-layedit-tool .layui-icon:hover {
    color: #393D49
}
.layui-layedit-tool .layui-icon:active {
    color: #000
}
.layui-layedit-tool .layedit-tool-active {
    background-color: #e2e2e2;
    color: #000
}
.layui-layedit-tool .layui-disabled,
.layui-layedit-tool .layui-disabled:hover {
    color: #d2d2d2;
    cursor: not-allowed
}
.layui-layedit-tool .layedit-tool-mid {
    width: 1px;
    height: 18px;
    margin: 0 10px;
    background-color: #d2d2d2
}
.layedit-tool-html {
    width: 50px !important;
    font-size: 30px !important
}
.layedit-tool-b,
.layedit-tool-code,
.layedit-tool-help {
    font-size: 16px !important
}
.layedit-tool-d,
.layedit-tool-face,
.layedit-tool-image,
.layedit-tool-unlink {
    font-size: 18px !important
}
.layedit-tool-image input {
    position: absolute;
    font-size: 0;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .01;
    filter: Alpha(opacity=1);
    cursor: pointer
}
.layui-layedit-iframe iframe {
    display: block;
    width: 100%
}
#LAY_layedit_code {
    overflow: hidden
}
.layui-laypage {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: middle;
    margin: 10px 0;
    font-size: 0
}
.layui-laypage>a:first-child,
.layui-laypage>a:first-child em {
    border-radius: 2px 0 0 2px
}
.layui-laypage>a:last-child,
.layui-laypage>a:last-child em {
    border-radius: 0 2px 2px 0
}
.layui-laypage>:first-child {
    margin-left: 0 !important
}
.layui-laypage>:last-child {
    margin-right: 0 !important
}
.layui-laypage a,
.layui-laypage button,
.layui-laypage input,
.layui-laypage select,
.layui-laypage span {
    border: 1px solid #e2e2e2
}
.layui-laypage a,
.layui-laypage span {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: middle;
    padding: 0 15px;
    height: 28px;
    line-height: 28px;
    margin: 0 -1px 5px 0;
    background-color: #fff;
    color: #333;
    font-size: 12px
}
.layui-laypage a:hover {
    color: #009688
}
.layui-laypage em {
    font-style: normal
}
.layui-laypage .layui-laypage-spr {
    color: #999;
    font-weight: 700
}
.layui-laypage a {
    text-decoration: none
}
.layui-laypage .layui-laypage-curr {
    position: relative
}
.layui-laypage .layui-laypage-curr em {
    position: relative;
    color: #fff
}
.layui-laypage .layui-laypage-curr .layui-laypage-em {
    position: absolute;
    left: -1px;
    top: -1px;
    padding: 1px;
    width: 100%;
    height: 100%;
    background-color: #009688
}
.layui-laypage-em {
    border-radius: 2px
}
.layui-laypage-next em,
.layui-laypage-prev em {
    font-family: Sim sun;
    font-size: 16px
}
.layui-laypage .layui-laypage-count,
.layui-laypage .layui-laypage-limits,
.layui-laypage .layui-laypage-refresh,
.layui-laypage .layui-laypage-skip {
    margin-left: 10px;
    margin-right: 10px;
    padding: 0;
    border: none
}
.layui-laypage .layui-laypage-limits,
.layui-laypage .layui-laypage-refresh {
    vertical-align: top
}
.layui-laypage .layui-laypage-refresh i {
    font-size: 18px;
    cursor: pointer
}
.layui-laypage select {
    height: 22px;
    padding: 3px;
    border-radius: 2px;
    cursor: pointer
}
.layui-laypage .layui-laypage-skip {
    height: 30px;
    line-height: 30px;
    color: #999
}
.layui-laypage button,
.layui-laypage input {
    height: 30px;
    line-height: 30px;
    border-radius: 2px;
    vertical-align: top;
    background-color: #fff;
    box-sizing: border-box
}
.layui-laypage input {
    display: inline-block;
    width: 40px;
    margin: 0 10px;
    padding: 0 3px;
    text-align: center
}
.layui-laypage input:focus,
.layui-laypage select:focus {
    border-color: #009688 !important
}
.layui-laypage button {
    margin-left: 10px;
    padding: 0 10px;
    cursor: pointer
}
.layui-table,
.layui-table-view {
    margin: 10px 0
}
.layui-flow-more {
    margin: 10px 0;
    text-align: center;
    color: #999;
    font-size: 14px
}
.layui-flow-more a {
    height: 32px;
    line-height: 32px
}
.layui-flow-more a * {
    display: inline-block;
    vertical-align: top
}
.layui-flow-more a cite {
    padding: 0 20px;
    border-radius: 3px;
    background-color: #eee;
    color: #333;
    font-style: normal
}
.layui-flow-more a cite:hover {
    opacity: .8
}
.layui-flow-more a i {
    font-size: 30px;
    color: #737383
}
.layui-table {
    width: 100%;
    background-color: #fff;
    color: #666
}
.layui-table tr {
    transition: all .3s;
    -webkit-transition: all .3s
}
.layui-table th {
    text-align: left;
    font-weight: 400
}
.layui-table tbody tr:hover,
.layui-table thead tr,
.layui-table-click,
.layui-table-header,
.layui-table-hover,
.layui-table-mend,
.layui-table-patch,
.layui-table-tool,
.layui-table[lay-even] tr:nth-child(even) {
    background-color: #f2f2f2
}
.layui-table td,
.layui-table th,
.layui-table-fixed-r,
.layui-table-header,
.layui-table-page,
.layui-table-tips-main,
.layui-table-tool,
.layui-table-view,
.layui-table[lay-skin=line],
.layui-table[lay-skin=row] {
    border-width: 1px;
    border-style: solid;
    border-color: #e6e6e6
}
.layui-table td,
.layui-table th {
    position: relative;
    padding: 9px 15px;
    min-height: 20px;
    line-height: 20px;
    font-size: 14px
}
.layui-table[lay-skin=line] td,
.layui-table[lay-skin=line] th {
    border-width: 0 0 1px
}
.layui-table[lay-skin=row] td,
.layui-table[lay-skin=row] th {
    border-width: 0 1px 0 0
}
.layui-table[lay-skin=nob] td,
.layui-table[lay-skin=nob] th {
    border: none
}
.layui-table img {
    max-width: 100px
}
.layui-table[lay-size=lg] td,
.layui-table[lay-size=lg] th {
    padding: 15px 30px
}
.layui-table-view .layui-table[lay-size=lg] .layui-table-cell {
    height: 40px;
    line-height: 40px
}
.layui-table[lay-size=sm] td,
.layui-table[lay-size=sm] th {
    font-size: 12px;
    padding: 5px 10px
}
.layui-table-view .layui-table[lay-size=sm] .layui-table-cell {
    height: 20px;
    line-height: 20px
}
.layui-table[lay-data] {
    display: none
}
.layui-table-box,
.layui-table-view {
    position: relative;
    overflow: hidden
}
.layui-table-view .layui-table {
    position: relative;
    width: auto;
    margin: 0
}
.layui-table-body,
.layui-table-header .layui-table,
.layui-table-page {
    margin-bottom: -1px
}
.layui-table-view .layui-table[lay-skin=line] {
    border-width: 0 1px 0 0
}
.layui-table-view .layui-table[lay-skin=row] {
    border-width: 0 0 1px
}
.layui-table-view .layui-table td,
.layui-table-view .layui-table th {
    padding: 5px 0;
    border-top: none;
    border-left: none
}
.layui-table-view .layui-table td {
    cursor: default
}
.layui-table-view .layui-form-checkbox[lay-skin=primary] i {
    width: 18px;
    height: 18px
}
.layui-table-header {
    border-width: 0 0 1px;
    overflow: hidden
}
.layui-table-sort {
    width: 10px;
    height: 20px;
    margin-left: 5px;
    cursor: pointer !important
}
.layui-table-sort .layui-edge {
    position: absolute;
    left: 5px;
    border-width: 5px
}
.layui-table-sort .layui-table-sort-asc {
    top: 4px;
    border-top: none;
    border-bottom-style: solid;
    border-bottom-color: #b2b2b2
}
.layui-table-sort .layui-table-sort-asc:hover {
    border-bottom-color: #666
}
.layui-table-sort .layui-table-sort-desc {
    bottom: 4px;
    border-bottom: none;
    border-top-style: solid;
    border-top-color: #b2b2b2
}
.layui-table-sort .layui-table-sort-desc:hover {
    border-top-color: #666
}
.layui-table-sort[lay-sort=asc] .layui-table-sort-asc {
    border-bottom-color: #000
}
.layui-table-sort[lay-sort=desc] .layui-table-sort-desc {
    border-top-color: #000
}
.layui-table-cell {
    height: 28px;
    line-height: 28px;
    padding: 0 15px;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box
}
.layui-table-cell .layui-form-checkbox[lay-skin=primary],
.layui-table-cell .layui-form-radio[lay-skin=primary] {
    top: -1px;
    vertical-align: middle
}
.layui-table-cell .layui-form-radio {
    padding-right: 0
}
.layui-table-cell .layui-form-radio>i {
    margin-right: 0
}
.layui-table-cell .layui-table-link {
    color: #01AAED
}
.laytable-cell-checkbox,
.laytable-cell-numbers,
.laytable-cell-radio,
.laytable-cell-space {
    padding: 0;
    text-align: center
}
.layui-table-body {
    position: relative;
    overflow: auto;
    margin-right: -1px
}
.layui-table-body .layui-none {
    line-height: 40px;
    text-align: center;
    color: #999
}
.layui-table-fixed {
    position: absolute;
    left: 0;
    top: 0
}
.layui-table-fixed .layui-table-body {
    overflow: hidden
}
.layui-table-fixed-l {
    box-shadow: 0 -1px 8px rgba(0, 0, 0, .08)
}
.layui-table-fixed-r {
    left: auto;
    right: -1px;
    border-width: 0 0 0 1px;
    box-shadow: -1px 0 8px rgba(0, 0, 0, .08)
}
.layui-table-fixed-r .layui-table-header {
    position: relative;
    overflow: visible
}
.layui-table-mend {
    position: absolute;
    right: -49px;
    top: 0;
    height: 100%;
    width: 50px
}
.layui-table-tool {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 30px;
    padding: 10px 15px;
    border-width: 0 0 1px
}
.layui-table-page {
    position: relative;
    width: 100%;
    padding: 7px 7px 0;
    border-width: 1px 0 0;
    height: 41px;
    font-size: 12px
}
.layui-table-page>div {
    height: 26px
}
.layui-table-page .layui-laypage {
    margin: 0
}
.layui-table-page .layui-laypage a,
.layui-table-page .layui-laypage span {
    height: 26px;
    line-height: 26px;
    margin-bottom: 10px;
    border: none;
    background: 0 0
}
.layui-table-page .layui-laypage a,
.layui-table-page .layui-laypage span.layui-laypage-curr {
    padding: 0 12px
}
.layui-table-page .layui-laypage span {
    margin-left: 0;
    padding: 0
}
.layui-table-page .layui-laypage .layui-laypage-prev {
    margin-left: -7px !important
}
.layui-table-page .layui-laypage .layui-laypage-curr .layui-laypage-em {
    left: 0;
    top: 0;
    padding: 0
}
.layui-table-page .layui-laypage button,
.layui-table-page .layui-laypage input {
    height: 26px;
    line-height: 26px
}
.layui-table-page .layui-laypage input {
    width: 40px
}
.layui-table-page .layui-laypage button {
    padding: 0 10px
}
.layui-table-page select {
    height: 18px
}
.layui-table-view select[lay-ignore] {
    display: inline-block
}
.layui-table-patch .layui-table-cell {
    padding: 0;
    width: 30px
}
.layui-table-edit {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 0 14px 1px;
    border-radius: 0;
    box-shadow: 1px 1px 20px rgba(0, 0, 0, .15)
}
.layui-table-edit:focus {
    border-color: #5FB878 !important
}
select.layui-table-edit {
    padding: 0 0 0 10px;
    border-color: #C9C9C9
}
.layui-table-view .layui-form-checkbox,
.layui-table-view .layui-form-radio,
.layui-table-view .layui-form-switch {
    top: 0;
    margin: 0;
    box-sizing: content-box
}
.layui-table-view .layui-form-checkbox {
    top: -1px;
    height: 26px;
    line-height: 26px
}
body .layui-table-tips .layui-layer-content {
    background: 0 0;
    padding: 0;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .1)
}
.layui-table-tips-main {
    margin: -44px 0 0 -1px;
    max-height: 150px;
    padding: 8px 15px;
    font-size: 14px;
    overflow-y: scroll;
    background-color: #fff;
    color: #333
}
.layui-table-tips-c {
    position: absolute;
    right: -3px;
    top: -12px;
    width: 18px;
    height: 18px;
    padding: 3px;
    text-align: center;
    font-weight: 700;
    border-radius: 100%;
    font-size: 14px;
    cursor: pointer;
    background-color: #666
}
.layui-table-tips-c:hover {
    background-color: #999
}
.layui-upload-file {
    display: none !important;
    opacity: .01;
    filter: Alpha(opacity=1)
}
.layui-upload-drag,
.layui-upload-form,
.layui-upload-wrap {
    display: inline-block
}
.layui-upload-list {
    margin: 10px 0
}
.layui-upload-choose {
    padding: 0 10px;
    color: #999
}
.layui-upload-drag {
    position: relative;
    padding: 30px;
    border: 1px dashed #e2e2e2;
    background-color: #fff;
    text-align: center;
    cursor: pointer;
    color: #999
}
.layui-upload-drag .layui-icon {
    font-size: 50px;
    color: #009688
}
.layui-upload-drag[lay-over] {
    border-color: #009688
}
.layui-upload-iframe {
    position: absolute;
    width: 0;
    height: 0;
    border: 0;
    visibility: hidden
}
.layui-upload-wrap {
    position: relative;
    vertical-align: middle
}
.layui-upload-wrap .layui-upload-file {
    display: block !important;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    font-size: 100px;
    width: 100%;
    height: 100%;
    opacity: .01;
    filter: Alpha(opacity=1);
    cursor: pointer
}
.layui-rate,
.layui-rate * {
    display: inline-block;
    vertical-align: middle
}
.layui-rate {
    padding: 10px 5px 10px 0;
    font-size: 0
}
.layui-rate li i.layui-icon {
    font-size: 20px;
    color: #FFB800;
    margin-right: 5px;
    transition: all .3s;
    -webkit-transition: all .3s
}
.layui-rate li i:hover {
    cursor: pointer;
    transform: scale(1.12);
    -webkit-transform: scale(1.12)
}
.layui-rate[readonly] li i:hover {
    cursor: default;
    transform: scale(1)
}
.layui-code {
    position: relative;
    margin: 10px 0;
    padding: 15px;
    line-height: 20px;
    border: 1px solid #ddd;
    border-left-width: 6px;
    background-color: #F2F2F2;
    color: #333;
    font-family: Courier New;
    font-size: 12px
}
.layui-tree {
    line-height: 26px
}
.layui-tree li {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}
.layui-tree li .layui-tree-spread,
.layui-tree li a {
    display: inline-block;
    vertical-align: top;
    height: 26px;
    *display: inline;
    *zoom: 1;
    cursor: pointer
}
.layui-tree li a {
    font-size: 0
}
.layui-tree li a i {
    font-size: 16px
}
.layui-tree li a cite {
    padding: 0 6px;
    font-size: 14px;
    font-style: normal
}
.layui-tree li i {
    padding-left: 6px;
    color: #333;
    -moz-user-select: none
}
.layui-tree li .layui-tree-check {
    font-size: 13px
}
.layui-tree li .layui-tree-check:hover {
    color: #009E94
}
.layui-tree li ul {
    display: none;
    margin-left: 20px
}
.layui-tree li .layui-tree-enter {
    line-height: 24px;
    border: 1px dotted #000
}
.layui-tree-drag {
    display: none;
    position: absolute;
    left: -666px;
    top: -666px;
    background-color: #f2f2f2;
    padding: 5px 10px;
    border: 1px dotted #000;
    white-space: nowrap
}
.layui-tree-drag i {
    padding-right: 5px
}
.layui-nav {
    position: relative;
    padding: 0 20px;
    background-color: #393D49;
    color: #fff;
    border-radius: 2px;
    font-size: 0;
    box-sizing: border-box
}
.layui-nav * {
    font-size: 14px
}
.layui-nav .layui-nav-item {
    position: relative;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: middle;
    line-height: 60px
}
.layui-nav .layui-nav-item a {
    display: block;
    padding: 0 20px;
    color: #fff;
    color: rgba(255, 255, 255, .7);
    transition: all .3s;
    -webkit-transition: all .3s
}
.layui-nav .layui-this:after,
.layui-nav-bar,
.layui-nav-tree .layui-nav-itemed:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 5px;
    background-color: #5FB878;
    transition: all .2s;
    -webkit-transition: all .2s
}
.layui-nav-bar {
    z-index: 1000
}
.layui-nav .layui-nav-item a:hover,
.layui-nav .layui-this a {
    color: #fff
}
.layui-nav .layui-this:after {
    content: '';
    top: auto;
    bottom: 0;
    width: 100%
}
.layui-nav-img {
    width: 30px;
    height: 30px;
    margin-right: 10px;
    border-radius: 50%
}
.layui-nav .layui-nav-more {
    content: '';
    width: 0;
    height: 0;
    border-style: solid dashed dashed;
    border-color: #fff transparent transparent;
    overflow: hidden;
    cursor: pointer;
    transition: all .2s;
    -webkit-transition: all .2s;
    position: absolute;
    top: 50%;
    right: 3px;
    margin-top: -3px;
    border-width: 6px;
    border-top-color: rgba(255, 255, 255, .7)
}
.layui-nav .layui-nav-mored,
.layui-nav-itemed>a .layui-nav-more {
    margin-top: -9px;
    border-style: dashed dashed solid;
    border-color: transparent transparent #fff
}
.layui-nav-child {
    display: none;
    position: absolute;
    left: 0;
    top: 65px;
    min-width: 100%;
    line-height: 36px;
    padding: 5px 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
    border: 1px solid #d2d2d2;
    background-color: #fff;
    z-index: 100;
    border-radius: 2px;
    white-space: nowrap
}
.layui-nav .layui-nav-child a {
    color: #333
}
.layui-nav .layui-nav-child a:hover {
    background-color: #f2f2f2;
    color: #000
}
.layui-nav-child dd {
    position: relative
}
.layui-nav .layui-nav-child dd.layui-this a,
.layui-nav-child dd.layui-this {
    background-color: #5FB878;
    color: #fff
}
.layui-nav-child dd.layui-this:after {
    display: none
}
.layui-nav-tree {
    width: 200px;
    padding: 0
}
.layui-nav-tree .layui-nav-item {
    display: block;
    width: 100%;
    line-height: 45px
}
.layui-nav-tree .layui-nav-item a {
    position: relative;
    height: 45px;
    line-height: 45px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}
.layui-nav-tree .layui-nav-item a:hover {
    background-color: #4E5465
}
.layui-nav-tree .layui-nav-bar {
    width: 5px;
    height: 0;
    background-color: #009688
}
.layui-nav-tree .layui-nav-child dd.layui-this,
.layui-nav-tree .layui-nav-child dd.layui-this a,
.layui-nav-tree .layui-this,
.layui-nav-tree .layui-this>a,
.layui-nav-tree .layui-this>a:hover {
    background-color: #009688;
    color: #fff
}
.layui-nav-tree .layui-this:after {
    display: none
}
.layui-nav-itemed>a,
.layui-nav-tree .layui-nav-title a,
.layui-nav-tree .layui-nav-title a:hover {
    color: #fff !important
}
.layui-nav-tree .layui-nav-child {
    position: relative;
    z-index: 0;
    top: 0;
    border: none;
    box-shadow: none
}
.layui-nav-tree .layui-nav-child a {
    height: 40px;
    line-height: 40px;
    color: #fff;
    color: rgba(255, 255, 255, .7)
}
.layui-nav-tree .layui-nav-child,
.layui-nav-tree .layui-nav-child a:hover {
    background: 0 0;
    color: #fff
}
.layui-nav-tree .layui-nav-more {
    right: 10px
}
.layui-nav-itemed>.layui-nav-child {
    display: block;
    padding: 0;
    background-color: rgba(0, 0, 0, .3) !important
}
.layui-nav-itemed>.layui-nav-child>.layui-this>.layui-nav-child {
    display: block
}
.layui-nav-side {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    z-index: 999
}
.layui-bg-blue .layui-nav-bar,
.layui-bg-blue .layui-nav-itemed:after,
.layui-bg-blue .layui-this:after {
    background-color: #93D1FF
}
.layui-bg-blue .layui-nav-child dd.layui-this {
    background-color: #1E9FFF
}
.layui-bg-blue .layui-nav-itemed>a,
.layui-nav-tree.layui-bg-blue .layui-nav-title a,
.layui-nav-tree.layui-bg-blue .layui-nav-title a:hover {
    background-color: #007DDB !important
}
.layui-breadcrumb {
    visibility: hidden;
    font-size: 0
}
.layui-breadcrumb>* {
    font-size: 14px
}
.layui-breadcrumb a {
    color: #999 !important
}
.layui-breadcrumb a:hover {
    color: #5FB878 !important
}
.layui-breadcrumb a cite {
    color: #666;
    font-style: normal
}
.layui-breadcrumb span[lay-separator] {
    margin: 0 10px;
    color: #999
}
.layui-tab {
    margin: 10px 0;
    text-align: left !important
}
.layui-tab[overflow]>.layui-tab-title {
    overflow: hidden
}
.layui-tab-title {
    position: relative;
    left: 0;
    height: 40px;
    white-space: nowrap;
    font-size: 0;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    transition: all .2s;
    -webkit-transition: all .2s
}
.layui-tab-title li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: middle;
    font-size: 14px;
    transition: all .2s;
    -webkit-transition: all .2s;
    position: relative;
    line-height: 40px;
    min-width: 65px;
    padding: 0 15px;
    text-align: center;
    cursor: pointer
}
.layui-tab-title li a {
    display: block
}
.layui-tab-title .layui-this {
    color: #000
}
.layui-tab-title .layui-this:after {
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    width: 100%;
    height: 41px;
    border-width: 1px;
    border-style: solid;
    border-bottom-color: #fff;
    border-radius: 2px 2px 0 0;
    box-sizing: border-box;
    pointer-events: none
}
.layui-tab-bar {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    width: 30px;
    height: 39px;
    line-height: 39px;
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
    text-align: center;
    background-color: #fff;
    cursor: pointer
}
.layui-tab-bar .layui-icon {
    position: relative;
    display: inline-block;
    top: 3px;
    transition: all .3s;
    -webkit-transition: all .3s
}
.layui-tab-item {
    display: none
}
.layui-tab-more {
    padding-right: 30px;
    height: auto !important;
    white-space: normal !important
}
.layui-tab-more li.layui-this:after {
    border-bottom-color: #e2e2e2;
    border-radius: 2px
}
.layui-tab-more .layui-tab-bar .layui-icon {
    top: -2px;
    top: 3px\9;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}
:root .layui-tab-more .layui-tab-bar .layui-icon {
    top: -2px\0/IE9
}
.layui-tab-content {
    padding: 10px
}
.layui-tab-title li .layui-tab-close {
    position: relative;
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 20px;
    margin-left: 8px;
    top: 1px;
    text-align: center;
    font-size: 14px;
    color: #c2c2c2;
    transition: all .2s;
    -webkit-transition: all .2s
}
.layui-tab-title li .layui-tab-close:hover {
    border-radius: 2px;
    background-color: #FF5722;
    color: #fff
}
.layui-tab-brief>.layui-tab-title .layui-this {
    color: #009688
}
.layui-tab-brief>.layui-tab-more li.layui-this:after,
.layui-tab-brief>.layui-tab-title .layui-this:after {
    border: none;
    border-radius: 0;
    border-bottom: 2px solid #5FB878
}
.layui-tab-brief[overflow]>.layui-tab-title .layui-this:after {
    top: -1px
}
.layui-tab-card {
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1)
}
.layui-tab-card>.layui-tab-title {
    background-color: #f2f2f2
}
.layui-tab-card>.layui-tab-title li {
    margin-right: -1px;
    margin-left: -1px
}
.layui-tab-card>.layui-tab-title .layui-this {
    background-color: #fff
}
.layui-tab-card>.layui-tab-title .layui-this:after {
    border-top: none;
    border-width: 1px;
    border-bottom-color: #fff
}
.layui-tab-card>.layui-tab-title .layui-tab-bar {
    height: 40px;
    line-height: 40px;
    border-radius: 0;
    border-top: none;
    border-right: none
}
.layui-tab-card>.layui-tab-more .layui-this {
    background: 0 0;
    color: #5FB878
}
.layui-tab-card>.layui-tab-more .layui-this:after {
    border: none
}
.layui-timeline {
    padding-left: 5px
}
.layui-timeline-item {
    position: relative;
    padding-bottom: 20px
}
.layui-timeline-axis {
    position: absolute;
    left: -5px;
    top: 0;
    z-index: 10;
    width: 20px;
    height: 20px;
    line-height: 20px;
    background-color: #fff;
    color: #5FB878;
    border-radius: 50%;
    text-align: center;
    cursor: pointer
}
.layui-timeline-axis:hover {
    color: #FF5722
}
.layui-timeline-item:before {
    content: '';
    position: absolute;
    left: 5px;
    top: 0;
    z-index: 0;
    width: 1px;
    height: 100%
}
.layui-timeline-item:last-child:before {
    display: none
}
.layui-timeline-item:first-child:before {
    display: block
}
.layui-timeline-content {
    padding-left: 25px
}
.layui-timeline-title {
    position: relative;
    margin-bottom: 10px
}
.layui-badge,
.layui-badge-dot,
.layui-badge-rim {
    position: relative;
    display: inline-block;
    padding: 0 6px;
    font-size: 12px;
    text-align: center;
    background-color: #FF5722;
    color: #fff;
    border-radius: 2px
}
.layui-badge {
    height: 18px;
    line-height: 18px
}
.layui-badge-dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border-radius: 50%
}
.layui-badge-rim {
    height: 18px;
    line-height: 18px;
    border-width: 1px;
    border-style: solid;
    background-color: #fff;
    color: #666
}
.layui-btn .layui-badge,
.layui-btn .layui-badge-dot {
    margin-left: 5px
}
.layui-nav .layui-badge,
.layui-nav .layui-badge-dot {
    position: absolute;
    top: 50%;
    margin: -8px 6px 0
}
.layui-tab-title .layui-badge,
.layui-tab-title .layui-badge-dot {
    left: 5px;
    top: -2px
}
.layui-carousel {
    position: relative;
    left: 0;
    top: 0;
    background-color: #f8f8f8
}
.layui-carousel>[carousel-item] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}
.layui-carousel>[carousel-item]:before {
    position: absolute;
    content: '\e63d';
    left: 50%;
    top: 50%;
    width: 100px;
    line-height: 20px;
    margin: -10px 0 0 -50px;
    text-align: center;
    color: #c2c2c2;
    font-family: layui-icon !important;
    font-size: 30px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
.layui-carousel>[carousel-item]>* {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #f8f8f8;
    transition-duration: .3s;
    -webkit-transition-duration: .3s
}
.layui-carousel-updown>* {
    -webkit-transition: .3s ease-in-out up;
    transition: .3s ease-in-out up
}
.layui-carousel-arrow {
    display: none\9;
    opacity: 0;
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -18px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    font-size: 20px;
    border: 0;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .2);
    color: #fff;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    cursor: pointer
}
.layui-carousel-arrow[lay-type=add] {
    left: auto !important;
    right: 10px
}
.layui-carousel:hover .layui-carousel-arrow[lay-type=add],
.layui-carousel[lay-arrow=always] .layui-carousel-arrow[lay-type=add] {
    right: 20px
}
.layui-carousel[lay-arrow=always] .layui-carousel-arrow {
    opacity: 1;
    left: 20px
}
.layui-carousel[lay-arrow=none] .layui-carousel-arrow {
    display: none
}
.layui-carousel-arrow:hover,
.layui-carousel-ind ul:hover {
    background-color: rgba(0, 0, 0, .35)
}
.layui-carousel:hover .layui-carousel-arrow {
    display: block\9;
    opacity: 1;
    left: 20px
}
.layui-carousel-ind {
    position: relative;
    top: -35px;
    width: 100%;
    line-height: 0 !important;
    text-align: center;
    font-size: 0
}
.layui-carousel[lay-indicator=outside] {
    margin-bottom: 30px
}
.layui-carousel[lay-indicator=outside] .layui-carousel-ind {
    top: 10px
}
.layui-carousel[lay-indicator=outside] .layui-carousel-ind ul {
    background-color: rgba(0, 0, 0, .5)
}
.layui-carousel[lay-indicator=none] .layui-carousel-ind {
    display: none
}
.layui-carousel-ind ul {
    display: inline-block;
    padding: 5px;
    background-color: rgba(0, 0, 0, .2);
    border-radius: 10px;
    -webkit-transition-duration: .3s;
    transition-duration: .3s
}
.layui-carousel-ind li {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 3px;
    font-size: 14px;
    background-color: #e2e2e2;
    background-color: rgba(255, 255, 255, .5);
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition-duration: .3s;
    transition-duration: .3s
}
.layui-carousel-ind li:hover {
    background-color: rgba(255, 255, 255, .7)
}
.layui-carousel-ind li.layui-this {
    background-color: #fff
}
.layui-carousel>[carousel-item]>.layui-carousel-next,
.layui-carousel>[carousel-item]>.layui-carousel-prev,
.layui-carousel>[carousel-item]>.layui-this {
    display: block
}
.layui-carousel>[carousel-item]>.layui-this {
    left: 0
}
.layui-carousel>[carousel-item]>.layui-carousel-prev {
    left: -100%
}
.layui-carousel>[carousel-item]>.layui-carousel-next {
    left: 100%
}
.layui-carousel>[carousel-item]>.layui-carousel-next.layui-carousel-left,
.layui-carousel>[carousel-item]>.layui-carousel-prev.layui-carousel-right {
    left: 0
}
.layui-carousel>[carousel-item]>.layui-this.layui-carousel-left {
    left: -100%
}
.layui-carousel>[carousel-item]>.layui-this.layui-carousel-right {
    left: 100%
}
.layui-carousel[lay-anim=updown] .layui-carousel-arrow {
    left: 50% !important;
    top: 20px;
    margin: 0 0 0 -18px
}
.layui-carousel[lay-anim=updown]>[carousel-item]>*,
.layui-carousel[lay-anim=fade]>[carousel-item]>* {
    left: 0 !important
}
.layui-carousel[lay-anim=updown] .layui-carousel-arrow[lay-type=add] {
    top: auto !important;
    bottom: 20px
}
.layui-carousel[lay-anim=updown] .layui-carousel-ind {
    position: absolute;
    top: 50%;
    right: 20px;
    width: auto;
    height: auto
}
.layui-carousel[lay-anim=updown] .layui-carousel-ind ul {
    padding: 3px 5px
}
.layui-carousel[lay-anim=updown] .layui-carousel-ind li {
    display: block;
    margin: 6px 0
}
.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-this {
    top: 0
}
.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-carousel-prev {
    top: -100%
}
.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-carousel-next {
    top: 100%
}
.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-carousel-next.layui-carousel-left,
.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-carousel-prev.layui-carousel-right {
    top: 0
}
.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-this.layui-carousel-left {
    top: -100%
}
.layui-carousel[lay-anim=updown]>[carousel-item]>.layui-this.layui-carousel-right {
    top: 100%
}
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-carousel-next,
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-carousel-prev {
    opacity: 0
}
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-carousel-next.layui-carousel-left,
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-carousel-prev.layui-carousel-right {
    opacity: 1
}
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-this.layui-carousel-left,
.layui-carousel[lay-anim=fade]>[carousel-item]>.layui-this.layui-carousel-right {
    opacity: 0
}
.layui-fixbar {
    position: fixed;
    right: 15px;
    bottom: 15px;
    z-index: 9999
}
.layui-fixbar li {
    width: 50px;
    height: 50px;
    line-height: 50px;
    margin-bottom: 1px;
    text-align: center;
    cursor: pointer;
    font-size: 30px;
    background-color: #9F9F9F;
    color: #fff;
    border-radius: 2px;
    opacity: .95
}
.layui-fixbar li:hover {
    opacity: .85
}
.layui-fixbar li:active {
    opacity: 1
}
.layui-fixbar .layui-fixbar-top {
    display: none;
    font-size: 40px
}
body .layui-util-face {
    border: none;
    background: 0 0
}
body .layui-util-face .layui-layer-content {
    padding: 0;
    background-color: #fff;
    color: #666;
    box-shadow: none
}
.layui-util-face .layui-layer-TipsG {
    display: none
}
.layui-util-face ul {
    position: relative;
    width: 372px;
    padding: 10px;
    border: 1px solid #D9D9D9;
    background-color: #fff;
    box-shadow: 0 0 20px rgba(0, 0, 0, .2)
}
.layui-util-face ul li {
    cursor: pointer;
    float: left;
    border: 1px solid #e8e8e8;
    height: 22px;
    width: 26px;
    overflow: hidden;
    margin: -1px 0 0 -1px;
    padding: 4px 2px;
    text-align: center
}
.layui-util-face ul li:hover {
    position: relative;
    z-index: 2;
    border: 1px solid #eb7350;
    background: #fff9ec
}
.layui-anim {
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}
.layui-anim.layui-icon {
    display: inline-block
}
.layui-anim-loop {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}
.layui-trans,
.layui-trans a {
    transition: all .3s;
    -webkit-transition: all .3s
}
@-webkit-keyframes layui-rotate {
    from {
        -webkit-transform: rotate(0)
    }
    to {
        -webkit-transform: rotate(360deg)
    }
}
@keyframes layui-rotate {
    from {
        transform: rotate(0)
    }
    to {
        transform: rotate(360deg)
    }
}
.layui-anim-rotate {
    -webkit-animation-name: layui-rotate;
    animation-name: layui-rotate;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}
@-webkit-keyframes layui-up {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        opacity: .3
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        opacity: 1
    }
}
@keyframes layui-up {
    from {
        transform: translate3d(0, 100%, 0);
        opacity: .3
    }
    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}
.layui-anim-up {
    -webkit-animation-name: layui-up;
    animation-name: layui-up
}
@-webkit-keyframes layui-upbit {
    from {
        -webkit-transform: translate3d(0, 30px, 0);
        opacity: .3
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        opacity: 1
    }
}
@keyframes layui-upbit {
    from {
        transform: translate3d(0, 30px, 0);
        opacity: .3
    }
    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}
.layui-anim-upbit {
    -webkit-animation-name: layui-upbit;
    animation-name: layui-upbit
}
@-webkit-keyframes layui-scale {
    0% {
        opacity: .3;
        -webkit-transform: scale(.5)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1)
    }
}
@keyframes layui-scale {
    0% {
        opacity: .3;
        -ms-transform: scale(.5);
        transform: scale(.5)
    }
    100% {
        opacity: 1;
        -ms-transform: scale(1);
        transform: scale(1)
    }
}
.layui-anim-scale {
    -webkit-animation-name: layui-scale;
    animation-name: layui-scale
}
@-webkit-keyframes layui-scale-spring {
    0% {
        opacity: .5;
        -webkit-transform: scale(.5)
    }
    80% {
        opacity: .8;
        -webkit-transform: scale(1.1)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1)
    }
}
@keyframes layui-scale-spring {
    0% {
        opacity: .5;
        transform: scale(.5)
    }
    80% {
        opacity: .8;
        transform: scale(1.1)
    }
    100% {
        opacity: 1;
        transform: scale(1)
    }
}
.layui-anim-scaleSpring {
    -webkit-animation-name: layui-scale-spring;
    animation-name: layui-scale-spring
}
@-webkit-keyframes layui-fadein {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}
@keyframes layui-fadein {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}
.layui-anim-fadein {
    -webkit-animation-name: layui-fadein;
    animation-name: layui-fadein
}
@-webkit-keyframes layui-fadeout {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}
@keyframes layui-fadeout {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}
.layui-anim-fadeout {
    -webkit-animation-name: layui-fadeout;
    animation-name: layui-fadeout
}