|
|
|
|
|
$(function () {
|
|
|
|
|
|
|
|
|
let time = "all"
|
|
|
let l1_type = 1
|
|
|
let c1_xueduan = "0"
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
let l1_xueduan = "0"
|
|
|
|
|
|
// c1 学校主题活动开展情况监测
|
|
|
//学段切换
|
|
|
$('#l1_xueduan').on('change', function () {
|
|
|
l1_xueduan = $(this).val() + ""
|
|
|
l1(l1_xueduan, time)
|
|
|
})
|
|
|
// 时间切换
|
|
|
$('body').on('click', '#switch_month', function (e) {
|
|
|
time = "day";
|
|
|
$('.switch-time a').removeClass('act')
|
|
|
$('#switch_month').addClass("act")
|
|
|
l1(l1_xueduan, time)
|
|
|
|
|
|
})
|
|
|
// 人数、次数切换
|
|
|
$('body').on('click', '#switch_year', function (e) {
|
|
|
time = "month"
|
|
|
$('.switch-time a').removeClass('act')
|
|
|
$('#switch_year').addClass("act")
|
|
|
|
|
|
l1(l1_xueduan, time)
|
|
|
|
|
|
})
|
|
|
$('body').on('click', '#switch_all', function (e) {
|
|
|
time = "all"
|
|
|
$('.switch-time a').removeClass('act')
|
|
|
$('#switch_all').addClass("act")
|
|
|
l1(l1_xueduan, time)
|
|
|
|
|
|
})
|
|
|
|
|
|
l1(l1_xueduan, time);
|
|
|
function l1(xueduan, time) {
|
|
|
$("#x-table").html("loading...")
|
|
|
|
|
|
if (time === "all") {
|
|
|
query_id1 = "stage_school_social_type_num_all"
|
|
|
query_id2 = "stage_school_social_num_all"
|
|
|
xueduan1 = [xueduan, xueduan, xueduan, xueduan]
|
|
|
xueduan2 = [xueduan, xueduan]
|
|
|
} else if (time === "month") {
|
|
|
query_id1 = "stage_school_social_type_num_month"
|
|
|
query_id2 = "stage_school_social_num_month"
|
|
|
xueduan1 = [xueduan, xueduan, nowYear, xueduan, xueduan, nowYear]
|
|
|
xueduan2 = [xueduan, xueduan, nowYear]
|
|
|
|
|
|
} else if (time === "day") {
|
|
|
query_id1 = "stage_school_social_type_num_day"
|
|
|
query_id2 = "stage_school_social_num_day"
|
|
|
xueduan1 = [xueduan, xueduan, nowYear, nowMonth, xueduan, xueduan, nowYear, nowMonth]
|
|
|
xueduan2 = [xueduan, xueduan, nowYear, nowMonth]
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
axios.all([
|
|
|
axios({
|
|
|
...axiosConf,
|
|
|
data: {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": query_id1,
|
|
|
"query_param": xueduan1
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total"
|
|
|
],
|
|
|
"query_format": "json",
|
|
|
"query_group": [
|
|
|
"org_name", "topic_name"
|
|
|
]
|
|
|
}
|
|
|
}),
|
|
|
axios({
|
|
|
...axiosConf,
|
|
|
data: {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": query_id2,
|
|
|
"query_param": xueduan2
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total"
|
|
|
],
|
|
|
"query_format": "json",
|
|
|
"query_group": [
|
|
|
"org_name"
|
|
|
]
|
|
|
}
|
|
|
|
|
|
})
|
|
|
]).then(axios.spread(function (schoolStageTypeRes, schoolStageRes) {
|
|
|
let html = ""
|
|
|
|
|
|
if (schoolStageTypeRes.data.result == "") {
|
|
|
html = "暂无数据"
|
|
|
console.log(html);
|
|
|
} else {
|
|
|
const schoolStageTypeData = JSON.parse(schoolStageTypeRes.data.result)
|
|
|
const schoolStageData = JSON.parse(schoolStageRes.data.result)
|
|
|
console.log(schoolStageTypeData, schoolStageData);
|
|
|
let orgNameCatch = []
|
|
|
let orgName = []
|
|
|
schoolStageTypeData.map((item) => {
|
|
|
orgNameCatch.push({ id: item.org_id, name: item.org_name });
|
|
|
})
|
|
|
orgName = orgNameCatch.filter((item, index) => {
|
|
|
return orgNameCatch.findIndex(_item => _item.id == item.id) == index;
|
|
|
})
|
|
|
|
|
|
orgName.map((e, i) => {
|
|
|
let arr = []
|
|
|
schoolStageTypeData.map((item, index) => {
|
|
|
if (item.org_name === e.name) {
|
|
|
|
|
|
|
|
|
switch (item.social_topic) {
|
|
|
case "44":
|
|
|
orgName[i].deyu = item.total
|
|
|
break;
|
|
|
case "45":
|
|
|
orgName[i].zhiyu = item.total
|
|
|
break;
|
|
|
case "46":
|
|
|
orgName[i].tiyu = item.total
|
|
|
break;
|
|
|
case "47":
|
|
|
orgName[i].meiyu = item.total
|
|
|
break;
|
|
|
case "48":
|
|
|
orgName[i].laodong = item.total
|
|
|
break;
|
|
|
case "1":
|
|
|
orgName[i].default = item.total
|
|
|
break;
|
|
|
defalut:
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
orgName[i].children = arr
|
|
|
|
|
|
schoolStageData.map((item) => {
|
|
|
if (item.org_name === e.name) {
|
|
|
orgName[i].total = item.total
|
|
|
}
|
|
|
})
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
html = `<div class="x-th">
|
|
|
<div>序号</div>
|
|
|
<div>学校名称</div>
|
|
|
<div>德育</div>
|
|
|
<div>智育</div>
|
|
|
<div>体育</div>
|
|
|
<div>美德</div>
|
|
|
<div>劳动教育</div>
|
|
|
<div>默认</div>
|
|
|
<div>总计</div>
|
|
|
</div>`
|
|
|
orgName.map((item, index) => {
|
|
|
|
|
|
|
|
|
html += `
|
|
|
<div class="x-tr">
|
|
|
<div>${index + 1}</div>
|
|
|
<div>${item.name}</div>
|
|
|
<div>${item.deyu ? item.deyu : 0}</div>
|
|
|
<div>${item.zhiyu ? item.zhiyu : 0}</div>
|
|
|
<div>${item.tiyu ? item.tiyu : 0}</div>
|
|
|
<div>${item.meiyu ? item.meiyu : 0}</div>
|
|
|
<div>${item.laodong ? item.laodong : 0}</div>
|
|
|
<div>${item.default ? item.default : 0}</div>
|
|
|
<div>${item.total}</div>
|
|
|
</div>`
|
|
|
})
|
|
|
|
|
|
|
|
|
}
|
|
|
$("#x-table").html(html)
|
|
|
|
|
|
|
|
|
})).catch(() => {
|
|
|
$("#x-table").html("链接失败")
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
r1();
|
|
|
function r1() {
|
|
|
|
|
|
|
|
|
var myChart = echarts.init(document.getElementById('r1')); // 各阶段学校数量
|
|
|
myChart.showLoading(chartsLoadindStyle);
|
|
|
|
|
|
axios({
|
|
|
...axiosConf,
|
|
|
data: {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "stage_social_type_num_all",
|
|
|
"query_param": []
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"school_typename", "topic_name"
|
|
|
]
|
|
|
}
|
|
|
})
|
|
|
.then((response) => {
|
|
|
|
|
|
const resData = JSON.parse(response.data.result)
|
|
|
let legendData = []
|
|
|
let xAxisName = []
|
|
|
let series = [{
|
|
|
type: 'bar',
|
|
|
data: [],
|
|
|
}]
|
|
|
let dataZoomShow = {
|
|
|
show: false
|
|
|
}
|
|
|
if (!resData.datas) {
|
|
|
myChart.showLoading(chartsLoadindNodataStyle);
|
|
|
myChart.clear()
|
|
|
} else {
|
|
|
|
|
|
xAxisName = resData.groups[0]
|
|
|
legendData = resData.groups[1]
|
|
|
|
|
|
|
|
|
resData.groups[1].map((e, i) => {
|
|
|
|
|
|
series.push({
|
|
|
name: e,
|
|
|
type: 'bar',
|
|
|
data: resData.datas[i],
|
|
|
barMaxWidth: 20,
|
|
|
})
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
myChart.hideLoading();
|
|
|
|
|
|
}
|
|
|
|
|
|
// ===========================================
|
|
|
|
|
|
option = {
|
|
|
// height: "100px",
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'cross',
|
|
|
crossStyle: {
|
|
|
color: '#999'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
|
|
|
textStyle: {
|
|
|
color: '#01DFF4'
|
|
|
},
|
|
|
grid: {
|
|
|
top: 50,
|
|
|
right: 10,
|
|
|
bottom: 40,
|
|
|
},
|
|
|
color: ["#0BCAEA", "#FE8E3A", "#3FDB94"],
|
|
|
legend: {
|
|
|
data: legendData,
|
|
|
itemWidth: 8,
|
|
|
itemHeight: 8,
|
|
|
right: 10,
|
|
|
top: 10,
|
|
|
textStyle: {
|
|
|
color: '#01DFF4'
|
|
|
},
|
|
|
},
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
data: xAxisName,
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#01DFF4' //更改坐标轴颜色
|
|
|
}
|
|
|
},
|
|
|
axisLabel: {
|
|
|
fontSize: 10,
|
|
|
color: "white",
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
yAxis: [
|
|
|
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#01DFF4' //更改坐标轴颜色
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
],
|
|
|
dataZoom: [
|
|
|
{
|
|
|
|
|
|
type: "slider", //slider:滑块 inside:内置，依靠鼠标滚轮或者双击缩放
|
|
|
xAxisIndex: 0, //显示x轴滑块
|
|
|
height: "15px",
|
|
|
end: 80,
|
|
|
top: "90%",
|
|
|
...dataZoomShow
|
|
|
}
|
|
|
],
|
|
|
series: series
|
|
|
};
|
|
|
|
|
|
|
|
|
myChart.setOption(option);
|
|
|
|
|
|
}).catch(() => {
|
|
|
myChart.showLoading(chartsLoadindNodataStyle);
|
|
|
myChart.clear()
|
|
|
})
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
r3();
|
|
|
|
|
|
function r3() {
|
|
|
var myChart = echarts.init(document.getElementById('r3')); // 各阶段学校数量
|
|
|
myChart.showLoading(chartsLoadindStyle);
|
|
|
|
|
|
|
|
|
axios({
|
|
|
...axiosConf,
|
|
|
data: {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "social_type_month_year_all",
|
|
|
"query_param": [
|
|
|
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"year_name", "topic_name"
|
|
|
]
|
|
|
}
|
|
|
}).then((response) => {
|
|
|
|
|
|
const resData = JSON.parse(response.data.result)
|
|
|
|
|
|
let xAxisName = []
|
|
|
|
|
|
let data = []
|
|
|
let series = []
|
|
|
let seriesName = []
|
|
|
if (!resData.datas) {
|
|
|
myChart.showLoading(chartsLoadindNodataStyle);
|
|
|
myChart.clear()
|
|
|
|
|
|
|
|
|
} else {
|
|
|
seriesName = resData.groups[1]
|
|
|
xAxisName = resData.groups[0]
|
|
|
data = resData.datas
|
|
|
data.map((e, i) => {
|
|
|
|
|
|
series.push({
|
|
|
name: seriesName[i],
|
|
|
type: 'line',
|
|
|
data: e
|
|
|
})
|
|
|
})
|
|
|
|
|
|
data1 = resData.datas[0]
|
|
|
data2 = resData.datas[1]
|
|
|
data3 = resData.datas[2]
|
|
|
data3 = resData.datas[3]
|
|
|
data4 = resData.datas[4]
|
|
|
data5 = resData.datas[5]
|
|
|
|
|
|
myChart.hideLoading();
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
option = {
|
|
|
// height: "100px",
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'cross',
|
|
|
crossStyle: {
|
|
|
color: '#999'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
|
|
|
textStyle: {
|
|
|
color: '#01DFF4'
|
|
|
},
|
|
|
grid: {
|
|
|
right: 10,
|
|
|
top: 50,
|
|
|
bottom: 35,
|
|
|
},
|
|
|
color: ["#0BCAEA", "#FE8E3A", "#3FDB94"],
|
|
|
legend: {
|
|
|
data: seriesName,
|
|
|
itemWidth: 8,
|
|
|
itemHeight: 8,
|
|
|
right: 10,
|
|
|
top: 15,
|
|
|
textStyle: {
|
|
|
color: '#01DFF4'
|
|
|
},
|
|
|
|
|
|
},
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
data: xAxisName,
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#01DFF4' //更改坐标轴颜色
|
|
|
}
|
|
|
},
|
|
|
axisLabel: {
|
|
|
fontSize: 10,
|
|
|
color: "white",
|
|
|
|
|
|
}
|
|
|
},
|
|
|
],
|
|
|
yAxis: [
|
|
|
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#01DFF4' //更改坐标轴颜色
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
],
|
|
|
series: series
|
|
|
};
|
|
|
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option);
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
}).catch(() => {
|
|
|
myChart.showLoading(chartsLoadindNodataStyle);
|
|
|
myChart.clear()
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
let r2_time = "2021"
|
|
|
let optionHtml = ""
|
|
|
for (i = nowYear; i > nowYear - 10; i--) {
|
|
|
optionHtml += `<option value="${i}">${i}年</option>`
|
|
|
}
|
|
|
$("#r2_time").html(optionHtml)
|
|
|
|
|
|
|
|
|
$('#r2_time').on('change', function () {
|
|
|
r2_time = $(this).val() + ""
|
|
|
r2(r2_time);
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
r2(r2_time);
|
|
|
function r2(time) {
|
|
|
console.log(time);
|
|
|
var myChart = echarts.init(document.getElementById('r2')); // 各阶段学校数量
|
|
|
myChart.showLoading(chartsLoadindStyle);
|
|
|
|
|
|
|
|
|
axios({
|
|
|
...axiosConf,
|
|
|
data: {
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "social_type_month_num_all",
|
|
|
"query_param": [
|
|
|
time
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"month_name", "topic_name"
|
|
|
]
|
|
|
}
|
|
|
})
|
|
|
.then((response) => {
|
|
|
|
|
|
const resData = JSON.parse(response.data.result)
|
|
|
|
|
|
let xAxisName = []
|
|
|
let legendData = []
|
|
|
let series = []
|
|
|
let dataZoom = {}
|
|
|
if (!resData.datas) {
|
|
|
myChart.showLoading(chartsLoadindNodataStyle);
|
|
|
myChart.clear()
|
|
|
dataZoom = {
|
|
|
show: false
|
|
|
}
|
|
|
} else {
|
|
|
xAxisName = resData.groups[0]
|
|
|
legendData = resData.groups[1]
|
|
|
resData.groups[1].map((e, i) => {
|
|
|
series.push({
|
|
|
name: e,
|
|
|
type: 'bar',
|
|
|
stack: "all",
|
|
|
data: resData.datas[i],
|
|
|
barMaxWidth: 40,
|
|
|
})
|
|
|
|
|
|
})
|
|
|
|
|
|
myChart.hideLoading();
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
option = {
|
|
|
// height: "100px",
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'cross',
|
|
|
crossStyle: {
|
|
|
color: '#999'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
textStyle: {
|
|
|
color: '#01DFF4'
|
|
|
},
|
|
|
grid: {
|
|
|
top: 55,
|
|
|
bottom: 35,
|
|
|
right: 10
|
|
|
},
|
|
|
color: ["#0BCAEA", "#FE8E3A", "#3FDB94", "#4992FF", "#FF6E76"],
|
|
|
legend: {
|
|
|
data: legendData,
|
|
|
top: 15,
|
|
|
right: 10,
|
|
|
itemWidth: 8,
|
|
|
itemHeight: 8,
|
|
|
textStyle: {
|
|
|
color: '#01DFF4'
|
|
|
},
|
|
|
},
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
data: xAxisName,
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#01DFF4' //更改坐标轴颜色
|
|
|
}
|
|
|
},
|
|
|
axisLabel: {
|
|
|
interval: 0,
|
|
|
fontSize: 10,
|
|
|
color: "white",
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
yAxis: [
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#01DFF4' //更改坐标轴颜色
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#01DFF4' //更改坐标轴颜色
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
],
|
|
|
series: series
|
|
|
};
|
|
|
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
}).catch(() => {
|
|
|
myChart.showLoading(chartsLoadindNodataStyle);
|
|
|
myChart.clear()
|
|
|
dataZoom = {
|
|
|
show: false
|
|
|
}
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
