软测单独项目
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1621 lines
103 KiB

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link href="home/css/style.css" rel="stylesheet" media="all">
<script src="home/js/jquery-1.js"></script>
<script src="home/js/echarts.min.js"></script>
<link href="../layui/css/layui.css" rel="stylesheet" />
<link rel="stylesheet" href="../../../css/public.css" media="all" />
<!-- 数字计数器 -->
<link type="text/css" href="home/css/globle.css" rel="stylesheet" />
<script type="text/javascript" src="home/js/num.js"></script>
<script type="text/javascript" src="../layui/layui.js"></script>
</head>
<body>
<script>
var OrgId = "";
if (window.sessionStorage.getItem("userInfo") != null) {
userInfo = window.sessionStorage.getItem("userInfo");
} else {
var kn_root_c_cookie = $.cookie("kn_root_cookie");
var kn_root_c_cookie_json = "";
if (kn_root_c_cookie != undefined) {
kn_root_c_cookie_json = JSON.parse(kn_root_c_cookie)
}
if (kn_root_c_cookie != "" && kn_root_c_cookie != null && typeof kn_root_c_cookie == 'string') {
$.ajax({
type: "post",
url: "../ashx/SysUserHandler.ashx",
data: {
Action: "UserInfo2",
UsersUid: kn_root_c_cookie_json.usersUid,
random: new Date().getTime()//随机参数
},
async: false,
dataType: "json",
success: function (res) {
if (res.code == 1) {
userInfo = JSON.stringify(res.data);
window.sessionStorage.setItem("userInfo", JSON.stringify(res.data));
} else {
alert(res.msg);
}
}
})
} else {
alert("您未登录或登录超时请登录后使用");
window.close();
}
}
OrgId = JSON.parse(window.sessionStorage.getItem("userInfo")).OrgID;
ORG_ID = OrgId;
//ORG_ID = "fcb73c1d4e59465ea3fdb53a2fd172e4";//
</script>
<div class="content clearfix">
<div class="con-left fl">
<!-- 车辆管理 -->
<div class="content-div fl">
<div class="content-div-tit">车辆信息</div>
<div class="content-con">
<div class="yqgl-nums">
<div class="zongshu fl">当前在岗车辆</div>
<div id="dataNums"> </div>
<div id="dataNums2"> </div>
<div class="danwei fl">&nbsp;&nbsp;&nbsp;&nbsp;</div>
</div>
<div class="yqgl-cl">
<ul>
<li>
<div class="yqgl-cl-num vehicleoffice"></div>
<div class="yqgl-cl-name">公务车辆</div>
</li>
<li>
<div class="yqgl-cl-num vehicleduty"></div>
<div class="yqgl-cl-name">执勤车辆</div>
</li>
<li>
<div class="yqgl-cl-num vehiclesj"></div>
<div class="yqgl-cl-name">地方车辆</div>
</li>
</ul>
</div>
<script>
function homeCarSta() {
$.post("../ashx/CarHandler.ashx", {
Action: "homeCarSta",
Org_Id: OrgId,
random: new Date().getTime()//随机参数
}, function (res) {
if (res.code == 1) {
var num = res.data[0];
var vehicleoffice = num.GW;
$(".vehicleoffice").html(vehicleoffice);
var vehicleduty = num.ZQ;
$(".vehicleduty").html(vehicleduty);
var vehiclesj = num.SJ;
$(".vehiclesj").html(vehiclesj);
var countSum = vehicleoffice + vehicleduty + vehiclesj;
$("#dataNums").rollNumDaq({
deVal: num.ZG
});
} else {
}
}, "JSON");
}
homeCarSta();
</script>
</div>
</div>
<!-- 人员信息 -->
<div class="content-div fl" style=" margin-left: 20px; width: calc(33.33% - 40px);">
<div class="content-div-tit">人员信息</div>
<div class="content-con">
<div class="yqgl-nums">
<div class="zongshu fl">今日人员总数</div>
<div id="dataNumsa"> </div>
<div id="dataNums2"> </div>
<div class="danwei fl">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
</div>
<div id="ryxx" style="width: 100%; height: calc(100% - 48px);"></div>
<script type="text/javascript">
function personSta() {
$.post("../ashx/SysEmpHandler.ashx", {
Action: "personSta",
Org_Id: OrgId,
random: new Date().getTime()//随机参数
}, function (res) {
if (res.code == 1) {
var num = res.data[0];
var numtotal = num.ZS;
var zgnum = num.ZG;
var lgnum = numtotal - num.ZG;
$("#dataNumsa").rollNumDaq({
deVal: numtotal
});
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('ryxx'));
var res = [{
"label": "在岗",
"value": zgnum
},
{
"label": "未在岗",
"value": lgnum
}
]
var border =
'data:image/png;base64,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
var man =
'home/img/onduty.png';
var woman =
'home/img/leave.png';
var color = ['#00FFFF', 'rgba(196,36,255,1)'];
var data = [];
for (var i = 0; i < res.length; i++) {
data.push({
value: res[i].value,
name: res[i].label,
itemStyle: {
normal: {
borderWidth: 5,
shadowBlur: 20,
borderColor: color[i],
shadowColor: color[i]
}
}
}, {
value: res[0].value / 10,
name: '',
itemStyle: {
normal: {
label: {
show: false
},
labelLine: {
show: false
},
color: 'rgba(0, 0, 0, 0)',
borderColor: 'rgba(0, 0, 0, 0)',
borderWidth: 0
}
}
});
}
option = {
color,
graphic: {
elements: [{
type: 'image',
z: 3,
style: {
image: border,
width: 150,
height: 150
},
left: 'center',
top: 'center',
position: [100, 100]
},
{
type: 'image',
z: 3,
style: {
image: man,
width: 56,
height: 56
},
left: '38%',
top: 'center'
},
{
type: 'image',
z: 3,
style: {
image: woman,
width: 56,
height: 56
},
right: '38%',
top: 'center'
}
]
},
tooltip: {
show: false
},
toolbox: {
show: false
},
series: [{
name: '',
type: 'pie',
clockWise: false,
radius: [70, 75],
hoverAnimation: false,
itemStyle: {
normal: {
label: {
show: true,
fontSize: 16,
formatter(params) {
return params.name ?
params.name + '\n' + params.value + '人' :
'';
}
},
labelLine: {
width: 10,
length: 30,
length2: 30,
show: true,
color: '#00ffff'
}
}
},
data
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
} else {
}
}, "JSON");
}
personSta();
</script>
</div>
</div>
<!-- 报警信息 -->
<div class="content-div fr" style="margin-right: 0; margin-left: 20px;">
<div class="content-div-tit">一周报警信息</div>
<div class="content-con">
<div id="bjxx" style="width: 100%; height: 100%;"></div>
<script type="text/javascript">
function homeAlarmSta() {
var data = [];
$.post("../ashx/AlarmDataHandler.ashx", {
Action: "homeAlarmSta",
Org_Id: OrgId,
random: new Date().getTime()//随机参数
}, function (res) {
if (res.code == 1) {
var data = res.data[0];
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('bjxx'));
var category = [{
name: "人员不假外出",
value: data.PFFWC
},
{
name: "人员超期未归",
value: data.PCQWG
},
{
name: "车辆违规外出",
value: data.CBJWC
},
{
name: "车辆超时未归",
value: data.CCQWG
},
{
name: "车辆超速报警",
value: data.CCS
}
];
var compare = function (prop) {
return function (obj1, obj2) {
var val1 = obj1[prop];
var val2 = obj2[prop];
if (!isNaN(Number(val1)) && !isNaN(Number(val2))) {
val1 = Number(val1);
val2 = Number(val2);
}
if (val1 < val2) {
return -1;
} else if (val1 > val2) {
return 1;
} else {
return 0;
}
}
}
category.sort(compare("value"));
var total = category[0].value + category[1].value + category[2].value + category[3].value + category[4].value;
var datas = [];
category.forEach(value => {
datas.push(value.value);
});
option = {
xAxis: {
max: total,
splitLine: {
show: false
},
axisLine: {
show: false
},
axisLabel: {
show: false
},
axisTick: {
show: false
}
},
grid: {
left: 40,
top: 20, // 设置条形图的边距
right: 60,
bottom: 20
},
yAxis: [{
type: "category",
inverse: true,
data: category,
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
show: false
}
}],
series: [{
// 内
type: "bar",
barWidth: 14,
legendHoverLink: false,
silent: true,
itemStyle: {
normal: {
color: function (params) {
var color;
if (params.dataIndex == 19) {
color = {
type: "linear",
x: 0,
y: 0,
x2: 1,
y2: 0,
colorStops: [{
offset: 0,
color: "#EB5118" // 0% 处的颜色
},
{
offset: 1,
color: "#F21F02" // 100% 处的颜色
}
]
}
} else if (params.dataIndex == 18) {
color = {
type: "linear",
x: 0,
y: 0,
x2: 1,
y2: 0,
colorStops: [{
offset: 0,
color: "#FFA048" // 0% 处的颜色
},
{
offset: 1,
color: "#B25E14" // 100% 处的颜色
}
]
}
} else if (params.dataIndex == 17) {
color = {
type: "linear",
x: 0,
y: 0,
x2: 1,
y2: 0,
colorStops: [{
offset: 0,
color: "#F8E972" // 0% 处的颜色
},
{
offset: 1,
color: "#E5C206" // 100% 处的颜色
}
]
}
} else {
color = {
type: "linear",
x: 0,
y: 0,
x2: 1,
y2: 0,
colorStops: [{
offset: 0,
color: "#147e9d" // 0% 处的颜色
},
{
offset: 1,
color: "#03eefd" // 100% 处的颜色
}
]
}
}
return color;
},
}
},
label: {
normal: {
show: true,
position: [0, -24],
formatter: "{b}",
textStyle: {
color: "#fff",
fontSize: 14
}
}
},
data: category,
z: 1,
animationEasing: "elasticOut"
},
{
// 分隔
type: "pictorialBar",
itemStyle: {
normal: {
color: "#061348"
}
},
symbolRepeat: "fixed",
symbolMargin: 6,
symbol: "rect",
symbolClip: true,
symbolSize: [1, 17],
symbolPosition: "start",
symbolOffset: [1, -1],
symbolBoundingData: this.total,
data: category,
z: 2,
animationEasing: "elasticOut"
},
{
// 外边框
type: "pictorialBar",
symbol: "rect",
symbolBoundingData: total,
itemStyle: {
normal: {
color: "none"
}
},
label: {
normal: {
formatter: (params) => {
var text;
if (params.dataIndex == 1) {
text = '{f| ' + params.data + '}';
} else if (params.dataIndex == 2) {
text = '{f| ' + params.data + '}';
} else if (params.dataIndex == 3) {
text = '{f| ' + params.data + '}';
} else {
text = '{f| ' + params.data + '}';
}
return text;
},
rich: {
f: {
color: "#03eefd",
fontSize: 14
}
},
position: 'right',
distance: 0, // 向右偏移位置
show: true
}
},
data: datas,
z: 0,
animationEasing: "elasticOut"
},
{
name: "外框",
type: "bar",
barGap: "-120%", // 设置外框粗细
data: [total, total, total, total, total, total, total, total, total, total, total, total, total, total,
total,
total, total, total, total, total
],
barWidth: 20,
itemStyle: {
normal: {
color: "transparent", // 填充色
barBorderColor: "#1C4B8E", // 边框色
barBorderWidth: 1, // 边框宽度
// barBorderRadius: 0, //圆角半径
label: {
// 标签显示位置
show: false,
position: "top" // insideTop 或者横向的 insideLeft
}
}
},
z: 0
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
} else {
}
}, "JSON");
}
homeAlarmSta();
</script>
</div>
</div>
<div class="content-div fl" style="margin-top: 18px; margin-bottom: 0;">
<div class="content-div-tit">请假、用车统计</div>
<div class="content-con">
<div id="qjyctj" style="width: 100%; height: 100%;"></div>
<script type="text/javascript">
function homeleaveAndCarSta() {
var myChartLeaveCar = echarts.init(document.getElementById('qjyctj'));
var optionLeaveCar = {
grid: {
left: "3%",
right: "5%",
bottom: "2%",
top: "14%",
containLabel: true
},
tooltip: {
trigger: 'axis',
extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3)',
textStyle: {
color: '#fff',
},
axisPointer: {
type: 'shadow'
}
},
legend: {
top: '0%',
left: '35%',
itemWidth: 12,
itemHeight: 4,
data: ['请假次数', '用车次数'],
textStyle: {
color: '#fff',
}
},
xAxis: {
type: "category",
boundaryGap: true,
show: true,
axisLabel: {
interval: 0,
// show: true,
textStyle: {
color: "#0bbad0",
fontSize: 12
},
rotate: 20
},
axisLine: {
lineStyle: {
color: '#4a646f',
}
},
axisTick: {
show: true,
alignWithLabel: true,
},
},
yAxis: {
type: 'value',
splitNumber: 5,
axisLabel: {
textStyle: {
color: '#0bbad0',
fontSize: 12
}
},
axisLine: {
lineStyle: {
color: 'transparent',
}
},
splitLine: {
show: true,
lineStyle: {
color: '#4a646f',
type: "dashed"
}
}
},
series: [{
name: '请假次数',
type: 'bar',
// smooth: true,
/*stack: '使用情况',*/
itemStyle: {
normal: {
color: "rgba(3,238,253,0.9)"
},
},
}, {
name: '用车次数',
type: 'bar',
// smooth: true,
/*stack: '使用情况',*/
itemStyle: {
normal: {
color: "rgba(41,138,231,0.9)"
},
},
}]
};
myChartLeaveCar.setOption(optionLeaveCar);
//请假
var xdata = [], y1data = [], y2data = [];
$.post("../ashx/OaLeaveHandler.ashx", {
Action: "homeLeaveSta",
Org_Id: OrgId,
random: new Date().getTime()//随机参数
}, function (res) {
if (res.code == 1) {
res.data.forEach(function (value, index, array) {
xdata.push(value.RIQI);
y1data.push(value.NUM);
});
optionLeaveCar.xAxis.data = xdata;
optionLeaveCar.series[0].data = y1data;
myChartLeaveCar.setOption(optionLeaveCar);
} else {
}
}, "JSON");
//用车
var data = [];
$.post("../ashx/CarApplyHandler.ashx", {
Action: "homeApplySta",
Org_Id: OrgId,
random: new Date().getTime()//随机参数
}, function (res) {
if (res.code == 1) {
res.data.forEach(function (value, index, array) {
y2data.push(value.NUM);
});
optionLeaveCar.series[1].data = y2data;
myChartLeaveCar.setOption(optionLeaveCar);
} else {
}
}, "JSON");
}
homeleaveAndCarSta();
</script>
</div>
</div>
<div class="content-div fl" style="width: calc(33.33% - 40px); margin-left: 20px;margin-top: 18px; margin-bottom: 0;">
<div class="content-div-tit">查铺实到率</div>
<div class="content-con">
<div id="cpsdl" style="width: 100%; height: 100%;"></div>
<script type="text/javascript">
//查铺
// 基于准备好的dom,初始化echarts实例
var myChartInspect = echarts.init(document.getElementById('cpsdl'));
var chartData1 = [], chartData2 = [], chartData3 = [], chartData4 = [];
var optionInspect = {
grid: {
left: "3%",
right: "5%",
bottom: "2%",
top: "14%",
containLabel: true
},
tooltip: {
trigger: 'axis',
extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3)',
textStyle: {
color: '#fff',
},
axisPointer: {
type: 'shadow'
}
},
legend: {
top: '0%',
left: '35%',
itemWidth: 12,
itemHeight: 4,
data: ['总数', '实到', '缺席'],
textStyle: {
color: '#fff',
}
},
xAxis: {
type: "category",
boundaryGap: true,
show: true,
axisLabel: {
interval: 0,
// show: true,
textStyle: {
color: "#0bbad0",
fontSize: 10
},
rotate: 20
},
axisLine: {
lineStyle: {
color: '#4a646f',
}
},
axisTick: {
show: true,
alignWithLabel: true,
},
},
yAxis: {
type: 'value',
splitNumber: 5,
axisLabel: {
textStyle: {
color: '#0bbad0',
fontSize: 12
}
},
axisLine: {
lineStyle: {
color: 'transparent',
}
},
splitLine: {
show: true,
lineStyle: {
color: '#4a646f',
type: "dashed"
}
}
},
series: [{
name: '总数',
type: 'bar',
// smooth: true,
/*stack: '总量',*/
itemStyle: {
normal: {
color: "rgba(3,238,253,0.9)"
},
},
},
{
name: '实到',
type: 'bar',
// smooth: true,
/*stack: '总量',*/
itemStyle: {
normal: {
color: "rgba(41,138,231,0.9)"
},
},
},
{
name: '缺席',
type: 'bar',
// smooth: true,
stack: '总量',
itemStyle: {
normal: {
color: "#5e2494"
},
},
}]
};
myChartInspect.setOption(optionInspect);
function homeInspectStaSta() {
$.post("../ashx/FireInspectHandler.ashx", {
Action: "homeInspectSta",
OrgId: OrgId,
random: new Date().getTime()//随机参数
}, function (res) {
if (res.code == 1) {
console.log("查铺信息");
console.log(res.data);
res.data.reverse().forEach(function (value, index, array) {
chartData1.push(value.L_DATE);
chartData2.push(value.TOTAL);
chartData3.push(value.ONSHOW);
chartData4.push(Number(value.NOSHOW) + Number(value.LEAVE_NUM));
});
optionInspect.xAxis.data = chartData1;
optionInspect.series[0].data = chartData2;
optionInspect.series[1].data = chartData3;
optionInspect.series[2].data = chartData4;
myChartInspect.setOption(optionInspect);
}
}, "JSON");
}
homeInspectStaSta();
</script>
</div>
</div>
<!--人员考试分析-->
<div class="content-div fl" style="margin-left: 20px; margin-right: 0;margin-top: 18px; margin-bottom: 0;">
<div class="content-div-tit">人员考试分析</div>
<div class="content-con">
<div id="ryksfx" style="width: 100%; height: 100%;"></div>
<script type="text/javascript">
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('ryksfx'));
var dashedPic =
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAM8AAAAOBAMAAAB6G1V9AAAAD1BMVEX////Kysrk5OTj4+TJycoJ0iFPAAAAG0lEQVQ4y2MYBaNgGAMTQQVFOiABhlEwCugOAMqzCykGOeENAAAAAElFTkSuQmCC';
var color = ['#FF8700', '#ffc300', '#00e473', '#009DFF', '#9725d1'];
var arrName = [];
var arrValue = [];
var arrPercent = [];
var sum = 0;
var pieSeries = [],
lineYAxis = [];
var pieData = [];
var url = "";
var OrgCityType = JSON.parse(window.sessionStorage.getItem("userInfo")).OrgCityType;
switch (OrgCityType) {
case "xj":
url = 'http://8.142.26.221:8089/political/exam/exam/score_echart';
break;
case "xz":
url = 'http://8.142.26.221:8080/political/exam/exam/score_echart';
break;
}
function homeKS() {
$.ajax({
url: url,
//url: 'http://camp.xf365.cn:7080/political/exam/exam/score_echart',
//url: 'http://192.168.3.77:6066/political/exam/exam/score_echart',
type: 'post',
dataType: 'JSON',
data: { orgId: OrgId, random: new Date().getTime() },
success: function (res) {
if (res.code == 1) {
res.data.forEach((v, i) => {
sum += v.value;
})
// 图表option整理
res.data.forEach((v, i) => {
pieData.push({
value: v.value, name: v.name, itemStyle: {
normal: {
color: color[i],
shadowBlur: 10,
shadowColor: color[i]
}
}
});
//arrName.push(v.name);
//arrValue.push(v.value);
/*arrPercent.push((v.value / sum * 100).toFixed(1) + "%");*/
})
var option = {
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b} : {c}人({d}%)"
},
toolbox: {
show: true,
},
legend: {
top: '-1%',
left: 'center',
textStyle: {
color: '#ffffff'
},
},
color: color,
grid: {
top: '0%',
bottom: '56%',
left: "30%",
containLabel: false
},
xAxis: [{
show: false
}],
series: [
{
name: '人员考试分析',
type: 'pie',
label: {
formatter: '{b}: {c}人({d}%)'
},
center: ['50%', '60%'],
radius: '57%',
data: pieData
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
} else {
var chartData = [{
name: "≥90",
value: 0,
unit: '人'
},
{
name: "80~89",
value: 0,
unit: '人'
},
{
name: "70~79",
value: 0,
unit: '人'
},
{
name: "60~69",
value: 0,
unit: '人'
},
{
name: "≤59",
value: 0,
unit: '人'
}
];
// 数据处理
chartData.forEach((v, i) => {
arrName.push(v.name);
arrValue.push(v.value);
sum = sum + v.value;
})
// 图表option整理
chartData.forEach((v, i) => {
pieData.push({
value: v.value, name: v.name, itemStyle: {
normal: {
color: color[i],
shadowBlur: 10,
shadowColor: color[i]
}
}
});
v.percent = "0%";
})
var option = {
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b} : {c}人({d}%)"
},
toolbox: {
show: true,
},
legend: {
top: '0%',
left: 'center',
textStyle: {
color: '#ffffff'
},
},
color: color,
grid: {
top: '0%',
bottom: '56%',
left: "30%",
containLabel: false
},
xAxis: [{
show: false
}],
series: [
{
name: '人员考试分析',
type: 'pie',
label: {
formatter: '{b}: {c} ({d}%)'
},
radius: '57%',
data: pieData
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
}
},
error: function (error) {
console.log(error)
}
})
}
homeKS();
</script>
</div>
</div>
</div>
<!-- 人员记录 -->
<div class="content-div fr" id="ryjl" style="width: calc(25.53% - 40px);margin-right: 0; margin-left: 40px; margin-bottom: 0; background: url(home/img/under-divbg.png) no-repeat;background-size: 100% 100%;">
<div class="content-div-tit">人员记录</div>
<img src="home/img/Dblue.png" style="margin-left: 90px; font-family: auto; width: 241px; color: aquamarine; height: 27px; margin-block: 16px; " />
<p id="ryjlp" style="position: relative; margin-top: -39px; margin-left: 236px; color: aqua; font-size: 17px"></p>
<p style="position: relative; margin-top: -21px;float:left; margin-left: 166px; font-size: 15px">识别次数:</p>
<div class="rcgl-con2" style="overflow-y:auto;height:256px">
<div class=" crjl" style="font-size: 3px; margin-top: 10px">
</div>
</div>
<script type="text/javascript">
layui.config({
base: '../../../js/'
}).use(['ztree', 'form', 'ztree', 'layer', 'table', 'laytpl', 'laydate', 'laypage'], function () {
var form = layui.form,
layer = layui.layer,
$ = layui.jquery,
laytpl = layui.laytpl,
table = layui.table,
laydate = layui.laydate,
laypage = layui.laypage;
var $zTree, OrgList = [];
var OrgType = 1;
var OrgId = JSON.parse(window.sessionStorage.getItem("userInfo")).OrgID;
//获取消防机构列表
var orgStr = "";
$.ajax({
type: "post",
url: "../../../ashx/FireOrgHandler.ashx",
data: { Action: "OrgList", OrgId: OrgId },
dataType: "json",
success: function (result) {
result.data.forEach(function (obj, index, arr) {
orgStr += "<option value='" + obj.ID + "'>" + obj.NAME + "</option>";
});
$("#ORG_ID").append(orgStr);
form.render('select');
}
});
laydate.render({
elem: '#searchTime',
type: 'datetime'
, range: true
});
pageConf = {};
pageConf.pageSize = 10;
pageConf.currentPage = 1;
LoadStaffList(pageConf);
function LoadStaffList(pageConf, is_content) {
var startTime = "", endTime = "";
var searchTime = $("#searchTime").val();
if (searchTime) {
if (searchTime.indexOf(" - ") != -1) {
startTime = searchTime.split(" - ")[0]
endTime = searchTime.split(" - ")[1];
}
}
$.post("../../../ashx/DoorAttendance.ashx", {
Action: 'HomeList',
OrgId: OrgId,
limit: pageConf.pageSize,
page: pageConf.currentPage,
type: "org",
is_content: is_content,
startTime: startTime,
endTime: endTime,
keywords: $(".searchVal").val(),
random: new Date().getTime()//随机参数
}, function (res) {
res = JSON.parse(res);
if (res.data != undefined && res.data != null && res.data.length > 0) {
//初始化分页控件
InitPage(res.count);
$("#ryjlp").append(res.count);
LoadStaffInfo(res);
}
else {
$("#ryjlp").append(res.count);
$(".crjl").html("<span style='margin-left:45%;'>未查询到数据!</span>");
InitPage(0);
}
});
$.post("../../../ashx/CarHandler.ashx", {
Action: 'AccountManagement',
ORG_ID: ORG_ID,
}, function (res) {
res = JSON.parse(res);
if (res == 1) {
$("#ryjl").css('display', 'none');
}
else {
$("#rujl").show();
}
});
}
//初始化分页控件
function InitPage(count) {
laypage.render({
elem: 'divPage',
count: count,
curr: pageConf.currentPage,
limit: pageConf.pageSize,
theme: '#496BC9',
first: "首页",
last: "尾页",
layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
jump: function (obj, first) {
if (!first) {
pageConf.currentPage = obj.curr;
pageConf.pageSize = obj.limit;
LoadStaffList(pageConf);
}
}
});
}
//初始化报警列表
function LoadStaffInfo(res) {
var htmlstr = '<ul>';
res.data.forEach(function (obj, index, arr) {
htmlstr += ' <li>';
htmlstr += ' <div class="crjl-img fl" style="margin: 10px 0;"><img style="margin-left: 25px;float:left;width:100px;height:125px" src="' + obj.CLOSEUP_PIC_URL + '"/>';
htmlstr += ' <div class="crjl-con" style="line-height: 2;height:70px;margin-left: 25px;width:110px;margin-top:136px">';
htmlstr += ' <p style="height:20px;width:100px;overflow:hidden" title="' + obj.NAME + '"><span style="color:auto">姓名:</span>' + obj.NAME + '</p>';
htmlstr += ' <p style="height:20px;width:100px;overflow:hidden" title="' + obj.START_TIME + '"><span>时间:</span>' + obj.START_TIME.substr(obj.START_TIME.indexOf(' ')) + '</p>';
htmlstr += ' <p style="height:20px;width:100px;overflow:hidden" title="' + obj.ADDR + '"><span>地址:</span>' + obj.ADDR + '</p>';
htmlstr += ' </div>';
htmlstr += ' </li>';
});
htmlstr += "</ul>";
//$(".crjl").html(htmlstr);
if (res.count > 0) {
$(".crjl").html(htmlstr);
}
else {
$(".crjl").html("<span style='margin-left:45%;'>未查询到数据!</span>");
InitPage(0);
}
}
function search(treeid, type) {
var startTime = "", endTime = "";
var searchTime = $("#searchTime").val();
if (searchTime) {
if (searchTime.indexOf(" - ") != -1) {
startTime = searchTime.split(" - ")[0]
endTime = searchTime.split(" - ")[1];
}
}
var is_content = "";
$("input:checkbox[name='is_content']:checked").each(function (i) {
is_content = $(this).val();
LoadStaffList(pageConf, is_content);
});
OrgId = treeid;
OrgType = type;
}
var setting = {
view: {
selectedMulti: false
},
check: {
enable: false
},
data: {
key: {
name: "NAME"
},
simpleData: {
enable: true,
type: "TYPE",
idKey: "ID",
pIdKey: "PID"
}
},
edit: {
enable: false
},
callback: {
onClick: function (e, treeId, treeNode) {
OrgId = treeNode.ID
LoadStaffList(pageConf);
}
}
};
//初始化树
$.ajax({
type: "post",
url: "../../../ashx/SysEmpHandler.ashx",
data: { Action: "OrgDeptTree", OrgId: OrgId },
dataType: "json",
success: function (result) {
var data = result.data;
var zNodes = [];
if (data.length > 0) {
for (var i in data) {
if (data[i].TYPE == "org") {
OrgList.push(data[i].ID);
zNodes.push(data[i]);
}
}
}
$zTree = $.fn.zTree.init($("#ztree"), setting, zNodes);
}
});
})
</script>
</div>
<!-- 车辆记录 -->
<div class="content-div fr" id="cljl" style="width: calc(25.53% - 40px); margin-right: 0; margin-left: 40px; margin-bottom: 0; margin-top: 33px; background: url(home/img/under-divbg.png) no-repeat; background-size: 100% 100%;">
<div class="content-div-tit">车辆记录</div>
<img src="home/img/Dblue.png" style="margin-left: 90px; width: 241px; height: 27px; margin-block:16px ;" />
<p style="position: relative; margin-top: -39px; margin-left: 108px; font-size: 15px">车辆进入:</p>
<p style="position: relative; margin-top: -20px; margin-left: 236px; font-size: 15px">车辆出去:</p>
<p id="carIn" style="position: relative; margin-top: -19px; margin-left: 181px; color: aqua; font-size: 17px"></p>
<p id="carOut" style="position: relative; margin-top: -19px; margin-left: 305px; color: aqua; font-size: 17px"></p>
<div class="rcgl-con2" style="overflow-y:auto;height:256px">
<div class=" cljl" style="font-size: 3px; margin-top:10px">
</div>
</div>
<script type="text/javascript">
layui.config({
base: '../../../js/'
}).use(['ztree', 'form', 'ztree', 'layer', 'table', 'laytpl', 'laydate', 'laypage'], function () {
var form = layui.form,
layer = layui.layer,
$ = layui.jquery,
laytpl = layui.laytpl,
table = layui.table,
laydate = layui.laydate,
laypage = layui.laypage;
var $zTree, OrgList = [];
var OrgType = 1;
var OrgId = JSON.parse(window.sessionStorage.getItem("userInfo")).OrgID;
//获取机构列表
laydate.render({
elem: '#searchTime',
type: 'datetime'
, range: true
});
pageConf = {};
pageConf.pageSize = 10;
pageConf.currentPage = 1;
LoadStaffList(pageConf);
function LoadStaffList(pageConf, is_content) {
var startTime = "", endTime = "";
var searchTime = $("#searchTime").val();
if (searchTime) {
if (searchTime.indexOf(" - ") != -1) {
startTime = searchTime.split(" - ")[0]
endTime = searchTime.split(" - ")[1];
}
}
$.post("../../../ashx/CarHandler.ashx", {
Action: 'GetHomeCarAccessList',
OrgId: OrgId,
limit: pageConf.pageSize,
page: pageConf.currentPage,
type: "org",
is_content: is_content,
startTime: startTime,
endTime: endTime,
keywords: $(".searchVal").val(),
random: new Date().getTime()//随机参数
}, function (res) {
res = JSON.parse(res);
$("#carIn").append(res.countIn);
$("#carOut").append(res.countOut);
if (res.data != undefined && res.data != null && res.data.length > 0) {
//初始化分页控件
InitPage(res.count);
LoadStaffInfo(res);
}
else {
$(".cljl").html("<span style='margin-left:45%;'>未查询到数据!</span>");
InitPage(0);
}
});
$.post("../../../ashx/CarHandler.ashx", {
Action: 'AccountManagement',
ORG_ID: ORG_ID,
}, function (res) {
res = JSON.parse(res);
if (res == 1) {
$("#cljl").css('display', 'none');
}
else {
$("#cljl").show();
}
});
}
//初始化分页控件
function InitPage(count) {
laypage.render({
elem: 'divPage',
count: count,
curr: pageConf.currentPage,
limit: pageConf.pageSize,
theme: '#496BC9',
first: "首页",
last: "尾页",
layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
jump: function (obj, first) {
if (!first) {
pageConf.currentPage = obj.curr;
pageConf.pageSize = obj.limit;
LoadStaffList(pageConf);
}
}
});
}
//初始化报警列表
function LoadStaffInfo(res) {
var htmlstr = '<ul>';
res.data.forEach(function (obj, index, arr) {
htmlstr += ' <li>';
htmlstr += ' <div class="cljl-img fl" style="margin: 10px 0;"><img style="margin-left: 18px;float:left;width:111px;height:93px;margin-top:-3px" src="' + obj.PICTURE + '"/>';
htmlstr += ' <img src="' + obj.EXTEND2 + '" style=" margin-left: -116px; width: 120px; height: 100px ;margin-top:-7px">';
htmlstr += ' <div class="cljl-con" style="line-height:2;height:40px;margin-left: 18px;margin-top:8px;width:110px;">';
htmlstr += ' <p style="height:20px;width:120px;overflow:hidden" title="' + obj.CAR_PLATE + '"><span>车牌号:</span>' + obj.CAR_PLATE + '</p>';
htmlstr += ' <p style="height:20px;width:120px;overflow:hidden" title="' + obj.START_TIME + '"><span>时间:</span>' + obj.START_TIME.substr(obj.START_TIME.indexOf(' ')) + '</p>';
htmlstr += ' </div>';
htmlstr += ' </li>';
});
htmlstr += "</ul>";
//$(".cljl").html(htmlstr);
if (res.count > 0) {
$(".cljl").html(htmlstr);
}
else {
$(".cljl").html("<span style='margin-left:45%;'>未查询到数据!</span>");
InitPage(0);
}
}
function search(treeid, type) {
var startTime = "", endTime = "";
var searchTime = $("#searchTime").val();
if (searchTime) {
if (searchTime.indexOf(" - ") != -1) {
startTime = searchTime.split(" - ")[0]
endTime = searchTime.split(" - ")[1];
}
}
var is_content = "";
$("input:checkbox[name='is_content']:checked").each(function (i) {
is_content = $(this).val();
LoadStaffList(pageConf, is_content);
});
OrgId = treeid;
OrgType = type;
}
var setting = {
view: {
selectedMulti: false
},
check: {
enable: false
},
data: {
key: {
name: "NAME"
},
simpleData: {
enable: true,
type: "TYPE",
idKey: "ID",
pIdKey: "PID"
}
},
edit: {
enable: false
},
callback: {
onClick: function (e, treeId, treeNode) {
OrgId = treeNode.ID
LoadStaffList(pageConf);
}
}
};
//初始化树
$.ajax({
type: "post",
url: "../../../ashx/SysEmpHandler.ashx",
data: { Action: "OrgDeptTree", OrgId: OrgId },
dataType: "json",
success: function (result) {
var data = result.data;
var zNodes = [];
if (data.length > 0) {
for (var i in data) {
if (data[i].TYPE == "org") {
OrgList.push(data[i].ID);
zNodes.push(data[i]);
}
}
}
$zTree = $.fn.zTree.init($("#ztree"), setting, zNodes);
}
});
})
</script>
</div>
<div class="content-div fr" id="xjxfjgzqll" style="width: calc(25.53% - 40px); height: 100%;display:none; margin-right: 0; margin-left: 40px; margin-bottom: 0;background: url(home /img/under-divbg.png) no-repeat;background-size: 100% 100%;">
<div class="content-div-tit">下级机构执勤力量</div>
<div class="content-con">
<div class="personnum">
<ul>
<li>
<div class="personnum-img"><img src="home/img/personnum1.png"></div>
<div id="Subordinate_per_sum" class="personnum-num">0</div>
<div class="personnum-tit">人员总数</div>
</li>
<li>
<div class="personnum-img"><img src="home/img/personnum2.png"></div>
<div id="Subordinate_per_zg" class="personnum-num">0</div>
<div class="personnum-tit">在岗数</div>
</li>
<li>
<div class="personnum-img"><img src="home/img/personnum3.png"></div>
<div id="Subordinate_per_lg" class="personnum-num">0</div>
<div class="personnum-tit">离岗数</div>
</li>
</ul>
</div>
<div class="personnum" style="margin-top: 30px;">
<ul>
<li style="width: 25%;">
<div class="personnum-img"><img src="home/img/carnum1.png"></div>
<div id="Subordinate_car_sum" class="personnum-num">0</div>
<div class="personnum-tit">车辆总数</div>
</li>
<li style="width: 25%;">
<div class="personnum-img"><img src="home/img/carnum2.png"></div>
<div id="Subordinate_car_zq" class="personnum-num">0</div>
<div class="personnum-tit">执勤车</div>
</li>
<li style="width: 25%;">
<div class="personnum-img"><img src="home/img/carnum3.png"></div>
<div id="Subordinate_car_gw" class="personnum-num">0</div>
<div class="personnum-tit">公务车</div>
</li>
<li style="width: 25%;">
<div class="personnum-img"><img src="home/img/carnum4.png"></div>
<div id="Subordinate_car_sj" class="personnum-num">0</div>
<div class="personnum-tit">地方车</div>
</li>
</ul>
</div>
<div class="under-list">
<table cellpadding="0" cellspacing="0" border="0">
<tr class="tou">
<th>单位名称</th>
<th>人员总数</th>
<th>车辆总数</th>
</tr>
<tbody id="Subordinate_list">
</tbody>
</table>
</div>
</div>
</div>
<script>
function getSubordinateData() {
$.post("../ashx/CarHandler.ashx", {
Action: "getSubordinateData",
Org_Id: OrgId,
random: new Date().getTime()//随机参数
}, function (res) {
var perData = res.perData;
var lgsum = perData[0].ZS;
$("#Subordinate_per_sum").html(lgsum);
$("#Subordinate_per_zg").html(perData[0].ZG);
$("#Subordinate_per_lg").html(lgsum - perData[0].ZG);
var carData = res.carData;
$("#Subordinate_car_sum").html(carData[0].GW + carData[0].ZQ + carData[0].SJ);
$("#Subordinate_car_gw").html(carData[0].GW);
$("#Subordinate_car_zq").html(carData[0].ZQ);
$("#Subordinate_car_sj").html(carData[0].SJ);
var listData = res.listData;
var tableHtml = "";
listData.forEach(item => {
tableHtml += "<tr><td>" + item.ORG_NAME + "</td><td>" + item.PERNUM + "</td><td>" + item.CARNUM + "</td></tr>";
});
$("#Subordinate_list").html(tableHtml);
}, "JSON");
$.post("../../../ashx/CarHandler.ashx", {
Action: 'AccountManagement',
ORG_ID: ORG_ID,
}, function (res) {
res = JSON.parse(res);
if (res == 1) {
$("#xjxfjgzqll").show();
}
else {
$("#xjxfjgzqll").css('display', 'none');
}
});
}
getSubordinateData();
</script>
</div>
<style type="text/css">
/*.cljl::-webkit-scrollbar-thumb {*/ /*滚动条里面小方块*/
/*border-radius: 7px;
background: #000000;
}*/
::-webkit-scrollbar-thumb {
border-radius: 7px;
background: #128ca9;
}
/*
::-webkit-scrollbar-thumb {
border-radius: 7px;
background: #000000;
}*/
</style>
</body>
</html>