{extend name="main"}
{block name="style"}
<style type="text/css">
.w-400px{width: 350px;}
.table-title{font-size: .9rem;font-weight: bold;padding-bottom: .5rem;}
.hover-box-shadow:hover{box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04) }
.hover-border-light{border:solid 1px #f8f9fa;}
.hover-border-light:hover{border-color: #e3e4e5;}
.el-divider__text, .el-link{font-weight: normal;}
.bg-light-primary{background-color: #f0f7fe;}
.hover-border-light-primary{border:solid 1px #f0f7fe;}
.hover-border-light-primary:hover{border-color: #b0c9e2;}
.bg-light-success{background-color: #e2f9e7;}
.hover-border-light-success{border:solid 1px #e2f9e7;}
.hover-border-light-success:hover{border-color: #b8e2c1;}
.bg-light-danger{background-color: #ffe8ea;}
.hover-border-light-danger{border:solid 1px #ffe8ea;}
.hover-border-light-danger:hover{border-color: #eebabf;}
.h3{color: #6c757d;}
</style>
{/block}
{block name="body"}
<div class="flex">
<div class="flex-1 pr-3">
	<div class="flex pb-3">
		<div class="flex-1 mr-2 p-3 bg-white hover-box-shadow rounded-lg">
			<div class="table-title text-secondary">企业</div>
			<div class="row px-2">
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/user')">
						<div class="small text-truncate">新增会员</div>
						<div class="h3">{{statistics.company_new_user}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/jobs')">
						<div class="small text-truncate">发布职位</div>
						<div class="h3">{{statistics.company_jobs_sum}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/jobs')">
						<div class="small text-truncate">职位刷新</div>
						<div class="h3">{{statistics.company_jobs_refresh}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/resume/resume-downloaded')">
						<div class="small text-truncate">简历下载</div>
						<div class="h3">{{statistics.company_download_resume}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/orders')">
						<div class="small text-truncate">订单(数量)</div>
						<div class="h3">{{statistics.company_order}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/orders')">
						<div class="small text-truncate">订单(金额)</div>
						<div class="h3">{{statistics.company_order_price}}</div>
					</div>
				</div>
			</div>
		</div>
		<div class="flex-1 ml-2 p-3 bg-white hover-box-shadow rounded-lg">
			<div class="table-title text-secondary">个人</div>
			<div class="row px-2">
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/user')">
						<div class="small text-truncate">新增会员</div>
						<div class="h3">{{statistics.personal_new_user}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/resume')">
						<div class="small text-truncate">新增简历</div>
						<div class="h3">{{statistics.personal_resume}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/resume')">
						<div class="small text-truncate">简历刷新</div>
						<div class="h3">{{statistics.personal_refresh}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/jobs/delivery_resume')">
						<div class="small text-truncate">投递</div>
						<div class="h3">{{statistics.personal_delivery_resume}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/orders')">
						<div class="small text-truncate">订单(数量)</div>
						<div class="h3">{{statistics.personal_order}}</div>
					</div>
				</div>
				<div class="col-4 p-2">
					<div class="bg-light rounded p-3 pointer hover-border-light"
					@click="window.open('/orders')">
						<div class="small text-truncate">订单(金额)</div>
						<div class="h3">{{statistics.personal_order_price}}</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="p-3 bg-white hover-box-shadow rounded-lg mb-3">
		<el-tabs v-model="ChartsSeriesAlias">
		    <el-tab-pane label="注册" name="user"></el-tab-pane>
		    <el-tab-pane label="投递" name="delivery"></el-tab-pane>
		    <el-tab-pane label="订单" name="order"></el-tab-pane>
		</el-tabs>
		<div class="mt-4 overflow-hidden" id="charts"></div>
	</div>
	<div class="p-3 bg-white hover-box-shadow rounded-lg">
		<div class="table-title text-secondary">系统信息</div>
		<div class="row px-2">
			<div class="col-2 p-2">
				<div class="rounded p-3">
					<div class="small text-truncate">服务器系统</div>
					<div class="h5">{$System.sys}</div>
				</div>
			</div>
			<div class="col-4 p-2">
				<div class="rounded p-3">
					<div class="small text-truncate">系统版本</div>
					<div class="h5">{$System.sys_r}</div>
				</div>
			</div>
			<div class="col-2 p-2">
				<div class="rounded p-3">
					<div class="small text-truncate">WEB服务</div>
					<div class="h5">{$System.software}</div>
				</div>
			</div>
			<div class="col-2 p-2">
				<div class="rounded p-3">
					<div class="small text-truncate">MySql</div>
					<div class="h5">{$System.mysql_version}</div>
				</div>
			</div>
			<div class="col-2 p-2">
				<div class="rounded p-3">
					<div class="small text-truncate">PHP</div>
					<div class="h5">{$System.php_version}</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="w-400px">
	<div class="p-3 bg-white mb-3 hover-box-shadow rounded-lg">
		<div class="table-title text-secondary">今日待办</div>
		<div class="row text-center">
			<div class="col-6 p-2">
				<div class="bg-light-primary rounded p-3 pointer hover-border-light-primary"
				@click="window.open('/company/attestation?status=0')">
					<div class="small">待认证企业</div>
					<div class="h3 text-primary">{{todo_statistics.company_attestation}}</div>
				</div>
			</div>
			<div class="col-6 p-2">
				<div class="bg-light-primary rounded p-3 pointer hover-border-light-primary"
				@click="window.open('/jobs?examine=0')">
					<div class="small">待审核职位</div>
					<div class="h3 text-primary">{{todo_statistics.company_jobs_examine}}</div>
				</div>
			</div>
			<div class="col-6 p-2">
				<div class="bg-light-primary rounded p-3 pointer hover-border-light-primary"
				@click="window.open('/company/demeanor?status=0')">
					<div class="small">待审核企业风采</div>
					<div class="h3">{{todo_statistics.company_demeanor}}</div>
				</div>
			</div>
			<div class="col-6 p-2">
				<div class="bg-light-danger rounded p-3 pointer hover-border-light-danger">
					<div class="small">注销账号申请</div>
					<div class="h3 text-danger">{{todo_statistics.written_off}}</div>
				</div>
			</div>
			<div class="col-6 p-2">
				<div class="bg-light-success rounded p-3 pointer hover-border-light-success"
				@click="window.open('/resume?examine=0')">
					<div class="small">待审核简历</div>
					<div class="h3 text-success">{{todo_statistics.resume_examine}}</div>
				</div>
			</div>
			<div class="col-6 p-2">
				<div class="bg-light-success rounded p-3 pointer hover-border-light-success"
				@click="window.open('/resume/works?status=0')">
					<div class="small">待审核作品</div>
					<div class="h3">{{todo_statistics.resume_works}}</div>
				</div>
			</div>
			<div class="col-6 p-2">
				<div class="bg-light rounded p-3 pointer hover-border-light"
				@click="window.open('/user/real_name?status=0')">
					<div class="small">待认证用户</div>
					<div class="h3">{{todo_statistics.real_name}}</div>
				</div>
			</div>
			<div class="col-6 p-2">
				<div class="bg-light rounded p-3 pointer hover-border-light"
				@click="window.open('/feedback?status=0')">
					<div class="small">待处理反馈</div>
					<div class="h3">{{todo_statistics.feedback}}</div>
				</div>
			</div>
		</div>
	</div>
	<div class="p-3 bg-white mb-3 hover-box-shadow rounded-lg" v-if="xycmsArticleList.length>0">
		<div class="table-title text-secondary">动态</div>
		<div v-for="(v,index) in xycmsArticleList" class="flex flex-center">
			<div class="flex-1">
			<el-link 
			:href="'https://www.xycms.com/article/content/'+v.id+'.html'"
			:underline="false"
			target="_blank">{{v.title}}</el-link>
			</div>
			<div class="small text-secondary">{{XYBase.Date.date('Y-m-d',v.create_time*1000)}}</div>
		</div>
		<div>
		<el-link 
		type="primary"
		href="https://www.xycms.com/article/classify/official"
		:underline="false"
		target="_blank">更多</el-link>
		</div>
	</div>
	<div class="p-3 bg-white mb-3 hover-box-shadow rounded-lg">
		<div class="flex flex-center">
			<div class="table-title text-secondary flex-1">版权信息</div>
			<el-link type="primary" :underline='false' :loading="true" @click="updateSystemVersion()">
			<el-badge is-dot :hidden="!SystemInfo.update">{{SystemInfo.update?'立即更新':'检查更新'}}</el-badge>
			</el-link>
		</div>
		<table class="table table-borderless table-sm">
			<tr>
				<td width="100" class="text-right text-secondary small">当前版本</td>
				<td class="text-primary small">{{SystemInfo.version_name}}</td>
			</tr>
			<tr v-if="SystemInfo.update">
				<td width="100" class="text-right text-secondary small">新版本</td>
				<td class="text-primary small">{{SystemInfo.new_version_name}}
				<a :href="SystemInfo.website+'/packages/version/'+SystemInfo.new_version_code" target="_blank" class="ml-2">查看</a>
				</td>
			</tr>
			<tr>
				<td class="text-right text-secondary small">授权版本</td>
				<td class="text-primary small">{{SystemInfo.authorization_type}}</td>
			</tr>
			<tr v-if="SystemInfo.new_authorization_type">
				<td class="text-right text-secondary small">新授权版本</td>
				<td class="text-primary small">{{SystemInfo.new_authorization_type}}</td>
			</tr>
			<tr>
				<td class="text-right text-secondary small">授权对象</td>
				<td class="text-primary small">{{SystemInfo.authorization_object}}</td>
			</tr>
			<tr>
				<td class="text-right text-secondary small">授权IP</td>
				<td class="text-primary small">{{SystemInfo.authorization_ip}}</td>
			</tr>
			<tr>
				<td class="text-right text-secondary small">上次检查时间</td>
				<td class="text-secondary small">{{SystemInfo.time}}</td>
			</tr>
		</table>
		<div class="small text-secondary">
			<div class="font-weight-bold">本系统版权归柳州新云网络科技有限公司所有。</div>
			<div>未获商业授权之前，您不得将本软件用于任何用途。购买商业授权请联系
			<a :href="SystemInfo.website" target="_blank">{{SystemInfo.website}}</a>。</div>
		</div>
	</div>
</div>
</div>
{/block}
{block name="script"}
{js href="/static/plugin/Echarts/echarts.min.js"}
<script type="text/javascript">
var chart=null,chartDom=null;
var vm=new Vue({
el:'#app',
data:{
	view:XYBase.view,
	ChartsSeriesAlias:'user',
	SystemInfo:{empty name="SystemInfo"}{}{else/}{$SystemInfo|raw}{/empty},
	statistics:{
		company_new_user:'--',
		company_jobs_sum:'--',
		company_jobs_refresh:'--',
		company_download_resume:'--',
		company_order:'--',
		company_order_price:'--',
		personal_new_user:'--',
		personal_resume:'--',
		personal_refresh:'--',
		personal_delivery_resume:'--',
		personal_order:'--',
		personal_order_price:'--',
	},
	todo_statistics:{
		company_attestation:'--',
		company_jobs_examine:'--',
		company_demeanor:'--',
		written_off:'--',
		resume_examine:'--',
		resume_works:'--',
		real_name:'--',
		feedback:'--',
	},
	xycmsArticleList:[]
},
watch:{
    view:XYBase.viewWatch,
    ChartsSeriesAlias(val,oldVal){
    	if(chart){
    		chart.setOption({
			    legend:{
				    selected:{
				    		'注册用户':false,
				    		'个人用户':false,
				    		'企业用户':false,
				    		'投递简历':false,
				    		'面试邀请':false,
				    		'订单数量':false,
				    		'订单金额':false
				    	}
				    }
			})
    		switch(val){
    			case 'user':
		    		chart.setOption({
					    legend:{
						    selected:{
						    		'注册用户':true,
						    		'个人用户':true,
						    		'企业用户':true
						    	}
						    }
					})
    			break;
    			case 'delivery':
		    		chart.setOption({
					    legend:{
						    selected:{
						    		'投递简历':true,
						    		'面试邀请':true
						    	}
						    }
					})
    			break;
    			case 'order':
		    		chart.setOption({
					    legend:{
						    selected:{
						    		'订单数量':true,
						    		'订单金额':true
						    	}
						    }
					})
    			break;
    		}
    	}
    }
},
created(){
	XYBase.created(this);
	this.initStatistics();
	setInterval(function(){
		vm.initStatistics();
	},10000);
	this.initTodoStatistics();
	setInterval(function(){
		vm.initTodoStatistics();
	},5000);
	if (this.SystemInfo.time){
		var lastTime=Date.parse(this.SystemInfo.time)/1000;
		var time=new Date();
		if(time.getTime()/1000-lastTime>3600*24){
			setTimeout(()=>{
				this.inspectSystemVersion();
			},500)
		}else if(this.SystemInfo.update){
			this.showUpdateNotify();
		}
	}else if(!this.SystemInfo.time){
		setTimeout(()=>{
			this.inspectSystemVersion();
		},500)
	}else if(this.SystemInfo.update){
		this.showUpdateNotify();
	}
	this.getOfficialArticle();
},
methods:{
	getOfficialArticle(){
		var _this=this;
		$.getJSON('//www.xycms.com/article/classify/official?json=1',function(ret){
			if(ret){
				if(ret.code===0){
					_this.xycmsArticleList=ret.data.data;
				}
			}
		})
	},
	initStatistics(){
		var _this=this;
		$.getJSON('/ajax/statistics',function(ret){
			if(ret){
				if(ret.code===0){
					_this.statistics=ret.data;
				}
			}
		})
	},
	initTodoStatistics(){
		var _this=this;
		$.getJSON('/ajax/todo_statistics',function(ret){
			if(ret){
				if(ret.code===0){
					_this.todo_statistics=ret.data;
				}
			}
		})
	},
	updateSystemVersion(){
		if(this.SystemInfo.update){
	        this.$confirm('是否立即更新？', '提示', {
	          title:'更新提示',
	          confirmButtonText: '立即更新',
	          cancelButtonText: '取消',
	          type: 'warning'
	        }).then(() => {
				XYBase.updateSystemVersion();
	        }).catch(() => {
				XYBase.msg('已取消');
	        });
		}else{
			this.inspectSystemVersion();
		}
	},
	inspectSystemVersion(){
		var _this=this;
		XYBase.inspectSystemVersion(this,function(ret) {
			if(ret){
				if(ret.code===600){
					_this.SystemInfo=ret.data;
					_this.showUpdateNotify();
				}else if(ret.code===0){
					XYBase.success(ret.msg)
				}else{
					XYBase.msg(ret.msg)
				}
			}else{
				XYBase.error(XYBase.config.system_network_error);
			}
		});
	},
	showUpdateNotify(){
		this.$notify({
          title: '更新提示',
          message: '有新版是否更新？点击立即更新',
          position: 'bottom-right',
          iconClass:'el-icon-upload',
          showClose:false,
          duration:3000,
          onClick:()=>{
          	this.updateSystemVersion();
          }
        });
	}
}
});
$(function(){
$(window).resize(function(){
	bodyResizeChange();
});
initCharts();
initChartsStatistics();
});
function initChartsStatistics(){
	$.getJSON('/ajax/charts_statistics',function(ret){
		if(ret){
			if(ret.code===0){
				setChartsOption(ret.data)
			}
		}
	})
}
function bodyResizeChange(){
chartDom.style.height=parseInt($(window).height()*0.4)+'px';
chart&&chart.resize();
}
function initCharts() {
chartDom=document.getElementById('charts');
chartDom.style.height=parseInt($(window).height()*0.4)+'px';
chart = echarts.init(chartDom);
}
function setChartsOption(data) {
chart.setOption({
	yAxis: {
		title: {
			text: ''
		}
	},
	xAxis: {
        type: 'category',
        boundaryGap: false,
        data: data.time
    },
    legend: {
    	selected:{
    		'投递简历':false,
    		'面试邀请':false,
    		'订单数量':false,
    		'订单金额':false
    	},
        data: data.legend
    },
    series: data.series,
    tooltip: {
        trigger: 'axis'
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
});
}
</script>
{/block}