ziqim/Yangcai365_web/manage/zview/zhiqim_manager/main.zml

${zhiqim_manager_content()}
<style>
	
	.leftDiv {
		margin: 0px -10px;
	}
	
	.card {
		margin: 10px;
		display: flex;
		flex-direction: column;
		width: 287.5px;
		height: 100px;
		border-radius: 2px;
	    background-color: #fff;
	    box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
	}
	
	.cardHeard {
		display: flex;
		position: relative;
	    line-height: 35px;
	    padding: 0 15px;
	    border-bottom: 1px solid #DCDCDC;
	    color: #333;
	    border-radius: 2px 2px 0 0;
	    font-size: 14px;
	    align-items: center;
	    justify-content: space-between;
	}
	
	.cardHeard img {
		width: 25px;
	}
	
	.cardContent {
		margin-top: 10px;
		position: relative;
	    padding: 10px 15px;
	    line-height: 24px;
	    display: flex;
	    align-items: center;
	    flex: 1;
	    justify-content: center;
	}
	
	.cardContent img {
		height: 70px;
	}
	
	.cardContent span {
		text-align: center;
    	font-size: 40px;
    	color: #1296db;
	}
	
	.cardContent table {
		width: 100%;
		color: #666;
		border-spacing: 0;
	}
	
	.cardContent table tbody{
		text-align: center;
	}
	
	.cardContent table tr{
		border-width: 1px;
	    border-style: solid;
	    border-color: #e6e6e6;
	}
	
	.cardContent table tr td:nth-child(1) {
		padding: 0;
	}
	
	.cardContent table tr td:last-child {
		padding: 0;
		padding-left: 45px;
		text-align: left;
	}
	
	.cardContent table tr td:nth-child(1) img {
		width: 35px;
    	height: 35px;
	}
	
	.cardContent table tr td:last-child img {
		width: 15px;
    	height: 15px;
    	margin-bottom: 3px;
	}
	
	.cardContent table th, .cardContent table td{
		position: relative;
	    padding: 9px 15px;
	    min-height: 20px;
	    line-height: 20px;
	    font-size: 14px;
        border-width: 0 0 1px;
	    border-style: solid;
    	border-color: #e6e6e6;
    	display: table-cell;
		vertical-align: inherit;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
		margin: 0;
	}
	
	.cardFooter {
		line-height: 25px;
	    text-align: right;
	    bottom: 5px;
	    right: 15px;
	    position: absolute;
	}
	
	.cardFooter a {
		width: 20px;
	    text-align: center;
	    display: inline-block;
	}
	
	.cardFooter .footerActivate {
		color: #1296db;
	}
	
	.leftDiv .card {
		display: inline-block;
	}
	
	.rightDiv {
	    
	}
	
	.noticeDiv {
		width: 770px;
    	height: 490px;
    	padding-top: 10px;
	}
	
	#noticeTitle {
		text-align: center;
	}
	
	#releaseTime {
		text-align: center;
		color: #949494;
	}
	
	#noticeContent {

		width: 93%;
	    margin-left: 5%;
	    font-size: 17px;
	    margin-top: 10px;
	}
	
	.levelTitle {
	    background-color: #fff;
	    padding: 10px 10px 10px 20px;
	}
	
	.levelTitle > div {
		display: inline-table;
		font-size: 16px;
	}
	
	.levelTitle > div:nth-child(1){
		width: 21%;
		border-right: 1px #cccccc solid;
	}
	
	.levelTitle > div:nth-child(2){
		width: 21%;
		text-align: center;
	}
	
	.levelTitle > div:not(.levelDiv) div{
	    font-size: 20px;
	    line-height: 40px;
	    margin-top: 5px;
	}
	
	.levelDiv {
		min-height: 65px;
	}
	
	.levelDiv div {
		height: 50%;
		display: table-row;
		font-size: 16px;
	}
	
	.levelDiv div a{
		margin-left: 35px; 
		color: #235fce;
	}
	
	.virtualAccount{
        background-color: #fff;
        height: 134px;
        width: 734px;
        margin-left: 18px;
    }
    
    .virtualAccountSumMoney{
        font-size: 23px;
        font-weight: 700;
        color: #00a2eb;
        cursor:pointer;
        display:inline-block;
    }
    
    .virtualAccountUsableMoney{
       font-size: 23px;
        font-weight: 700;
        color: #00a2eb;
        cursor:pointer;
        display:inline-block;
    }
    
    .virtualAccountFreezeMoney{
        font-size: 23px;
        font-weight: 700;
        cursor:pointer;
        display:inline-block;
        color:red;
    }
    
    .virtualAccountTitle{
        padding: 12px 0px;
        font-size: 15px;
    }
    
	.aLen{
		    width: 420px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            display: block;
            float: left;
	}
}
</style>

<script>
	var ajax = new Z.Ajax();
    ajax.setClassName("ConsolePresenter");
    ajax.setMethodName("getTodayOrderInfo");
    ajax.setFailureAlert();
    ajax.setSuccess(function(responseText){
    	var data = eval('('+responseText+')');
		Z("#todayOrderNumber").text(data[0]);
		Z("#todayOrderEndNumber").text(data[1]);
		Z("#todayOrderRefundNumber").text(data[2]);
    });
    ajax.execute();
</script>
<script>
    //查询本月订单数据
    var ajax = new Z.Ajax();
    ajax.setClassName("ConsolePresenter");
    ajax.setMethodName("getCurrentMonthOrderInfo");
    ajax.setFailureAlert();
    ajax.setSuccess(function(responseText){
        var data = eval('('+responseText+')');
        Z("#currentMonthOrderNumber").text(data[0]);
        Z("#currentMonthOrderEndNumber").text(data[1]);
        Z("#currentMonthOrderRefundNumber").text(data[2]);

        var currentMonthEnd = data[1] == 0 ? 0 : data[1]/data[0];
        var num = new Number(currentMonthEnd * 100);
        currentMonthEnd = num.toFixed(2)
        var currentMonthOrderRefund = data[2] == 0 ? 0 : data[2]/data[0];
        var num1 = new Number(currentMonthOrderRefund * 100);
        currentMonthOrderRefund = num1.toFixed(2)
        Z("#currentMonthEndPercentage").text(currentMonthEnd + "%");
        Z("#currentMonthOrderRefundPercentage").text(currentMonthOrderRefund + "%");
        if(currentMonthEnd < 93){
            Z("#currentMonthEndPercentage").css("color","red");
        } else {
            Z("#currentMonthEndPercentage").css("color","green");
        }
        if(currentMonthOrderRefund > 6){
            Z("#currentMonthOrderRefundPercentage").css("color","red");
        } else {
            Z("#currentMonthOrderRefundPercentage").css("color","green");
        }
        
        var ajax2 = new Z.Ajax();
        ajax2.setClassName("ConsolePresenter");
        ajax2.setMethodName("getLastMonthOrderInfo");
        ajax2.setFailureAlert();
        ajax2.setSuccess(function(responseText){
            var data2 = eval('('+responseText+')');
            var lastMonthEnd = data2[1] == 0 ? 0 : data2[1]/data2[0];
            var lastMonthOrderRefund = data2[2] == 0 ? 0 : data2[2]/data2[0];
            var num2 = new Number(lastMonthEnd * 100);
            lastMonthEnd = num2.toFixed(2)
            var num3 = new Number(lastMonthOrderRefund * 100);
            lastMonthOrderRefund = num3.toFixed(2)
            
            if(currentMonthEnd > lastMonthEnd){
                Z("#currentMonthEndPercentage").next().text("↑").css("color","green");
            } else if(currentMonthEnd < lastMonthEnd){
                Z("#currentMonthEndPercentage").next().text("↓").css("color","red");
            }
            
            if(currentMonthOrderRefund > lastMonthOrderRefund){
                Z("#currentMonthOrderRefundPercentage").next().text("↑").css("color","red");
            } else if(currentMonthOrderRefund < lastMonthOrderRefund){
                Z("#currentMonthOrderRefundPercentage").next().text("↓").css("color","green");
            }
            
        });
        ajax2.execute();
        
    });
    ajax.execute();
</script>
<script>
	var ajax = new Z.Ajax();
    ajax.setClassName("ConsolePresenter");
    ajax.setMethodName("getLastMonthOrderInfo");
    ajax.setFailureAlert();
    ajax.setSuccess(function(responseText){
		var data = eval('('+responseText+')');
		Z("#lastMonthOrderNumber").text(data[0]);
		Z("#lastMonthOrderEndNumber").text(data[1]);
		Z("#lastMonthOrderRefundNumber").text(data[2]);
    });
    ajax.execute();
</script>

<script>
	var ajax = new Z.Ajax();
    ajax.setClassName("ConsolePresenter");
    ajax.setMethodName("getUndoneOrderInfo");
    ajax.setFailureAlert();
    ajax.setSuccess(function(responseText){
		var data = eval('('+responseText+')');
		Z("#undoneOrder").text("(总计"+data[0]+"单)");
		Z("#undoneOrder24").text(data[1]);
		Z("#undoneOrder24-48").text(data[2]);
		Z("#undoneOrder48").text(data[3]);
    });
    ajax.execute();
</script>

<div style="display: flex;justify-content: center;">
	<div style="width: 60%;">
		<div class="levelTitle" style="width: 910px">
			<div>
				本月定稿率
				<div><span id="currentMonthEndPercentage"></span><span></span></div>
			</div>
			<div>
				本月退款率
				<div><span id="currentMonthOrderRefundPercentage"></span><span></span></div>
			</div>
		</div>
		<div style="margin: 20px 10px 0px 10px;font-size: 16px;">订单概述</div>
		<div class="leftDiv">
			<div class="card" id="todayOrder">
				<div class="cardHeard">
					今日接单量
				</div>
				<div class="cardContent">
					<span id="todayOrderNumber"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card" id="todayOrderEnd">
				<div class="cardHeard">
					今日定稿量
				</div>
				<div class="cardContent">
					<span id="todayOrderEndNumber"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card" id="todayOrderRefund">
				<div class="cardHeard">
					今日退款量
				</div>
				<div class="cardContent">
					<span id="todayOrderRefundNumber"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card" id="currentMonthOrder">
				<div class="cardHeard">
					本月接单量
				</div>
				<div class="cardContent">
					<span id="currentMonthOrderNumber"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card" id="todayOrderEnd">
				<div class="cardHeard">
					本月定稿量
				<span style="height:30px" class="z-pointer" data-role="z-tooltip" data-options="placement:top;align:left;width:350px;" data-text="只统计本月接单定稿量;<br/>若是上月接的单,本月定稿的情况,此单将不会统计到本月定稿量"><svg t="1618819497927" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4064" width="28"><path d="M512 127.9c51.9 0 102.2 10.1 149.5 30.2 45.7 19.3 86.8 47 122.1 82.3s63 76.4 82.3 122.1c20 47.3 30.2 97.6 30.2 149.5S886 614.2 865.9 661.5c-19.3 45.7-47 86.8-82.3 122.1s-76.4 63-122.1 82.3c-47.3 20-97.6 30.2-149.5 30.2S409.8 886 362.5 865.9c-45.7-19.3-86.8-47-122.1-82.3s-63-76.4-82.3-122.1c-20-47.3-30.2-97.6-30.2-149.5s10.1-102.2 30.2-149.5c19.3-45.7 47-86.8 82.3-122.1s76.4-63 122.1-82.3c47.3-20 97.6-30.2 149.5-30.2m0-64C264.5 63.9 63.9 264.5 63.9 512S264.5 960.1 512 960.1 960.1 759.5 960.1 512 759.5 63.9 512 63.9z" fill="#1296db" p-id="4065"></path><path d="M480 736h64v64h-64zM476.9 686.3c-0.3-9.3-0.4-42.2-0.4-46.8 0-27.3 3.9-50.8 11.6-70.6 5.7-14.9 14.8-30 27.4-45.1 9.3-11.1 25.9-27.2 50-48.4 24-21.2 39.7-38.1 46.9-50.7s10.8-26.4 10.8-41.3c0-27-10.5-50.7-31.6-71.2-21.1-20.4-46.9-30.7-77.5-30.7-29.6 0-54.3 9.3-74.1 27.8-19.8 18.5-32.8 47.4-39 86.8l-71.4-8.5c6.4-52.7 25.5-93.1 57.3-121.1s73.7-42 125.9-42c55.3 0 99.4 15 132.3 45.1 32.9 30.1 49.4 66.5 49.4 109.2 0 24.7-5.8 47.4-17.4 68.3s-34.2 46.2-67.9 76c-22.6 20.1-37.4 34.8-44.4 44.4-6.9 9.5-12.1 20.4-15.4 32.8-3.3 12.3-5.3 58.4-5.8 86.2h-66.7v-0.2z" fill="#1296db" p-id="4066"></path></svg>
									
				</div>
				
				<div class="cardContent">
					<span id="currentMonthOrderEndNumber"></span>
					<span style="font-size: 30px;">单</span>
					
				</div>
			</div>
			<div class="card" id="currentMonthOrderRefund">
				<div class="cardHeard">
					本月退款量
				</div>
				<div class="cardContent">
					<span id="currentMonthOrderRefundNumber"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card" id="lastMonthOrder">
				<div class="cardHeard">
					上月接单量
				</div>
				<div class="cardContent">
					<span id="lastMonthOrderNumber"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card" id="lastMonthOrderEnd">
				<div class="cardHeard">
					上月定稿量
				</div>
				<div class="cardContent">
					<span id="lastMonthOrderEndNumber"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card" id="lastMonthOrderRefund">
				<div class="cardHeard">
					上月退款量
				</div>
				<div class="cardContent">
					<span id="lastMonthOrderRefundNumber"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
		</div>
		<div style="margin: 10px 10px 0px 10px;font-size: 16px;">未完成订单<span id="undoneOrder" style="color: #bd0000;font-size: 10px;"></span></div>
		<div class="leftDiv">
			<div class="card">
				<div class="cardHeard">
					24小时内未完成
				</div>
				<div class="cardContent">
					<span id="undoneOrder24"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card">
				<div class="cardHeard">
					24-48小时未完成
				</div>
				<div class="cardContent">
					<span id="undoneOrder24-48"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
			<div class="card">
				<div class="cardHeard">
					48小时以上未完成
				</div>
				<div class="cardContent">
					<span id="undoneOrder48"></span>
					<span style="font-size: 30px;">单</span>
				</div>
			</div>
		</div>
		<div id="undoneOrder"></div>
	</div>
</div>

${zhiqim_manager_content_end()}