@ -12,71 +12,14 @@
}
}
.count_top{
.count_top{
width: 100%;
width: 100%;
height: 30%;
height: 50%;
}
.count_top ul{
width: 100%;
height: 100%;
list-style: none;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0;
}
.count_top ul li{
width: 333px;
height: 168px;
background-color: white;
background-color: white;
border-radius: 10px;
border-radius: 10px;
box-shadow: -4px 4px 4px #d5d5d5;
margin-bottom: 10px;
position: relative;
overflow: hidden;
}
.yuan{
width: 300px;
height: 300px;
display: inline-block;
position: absolute;
bottom: -163px;
right: -146px;
border-radius: 50%;
}
.count_top ul li:nth-child(1) .yuan{
background-color: #e2f0ff;
}
.count_top ul li:nth-child(2) .yuan{
background-color: #ffe7e9;
}
.count_top ul li:nth-child(3) .yuan{
background-color: #e3f7ef;
}
.count_top ul li i{
font-size: 33px;
position: absolute;
top: 72%;
left: 82%;
transform: translate(-50%,-50%);
}
.count_top ul li .textList{
position: absolute;
width: 80%;
height: 117px;
top: 18%;
left: 13px;
}
.textList p{
color: rgba(85, 90, 105, 0.79);
}
.textList p:nth-of-type(1) {
font-size: 33px;
}
.textList p:nth-of-type(2) {
font-size: 24px;
}
}
.count_bottom{
.count_bottom{
width: 100%;
width: 100%;
height: 7 0%;
height: 50%;
background-color: white;
background-color: white;
border-radius: 10px;
border-radius: 10px;
}
}
@ -84,7 +27,6 @@
width: 100%;
width: 100%;
height: 100%;
height: 100%;
background-color: white;
background-color: white;
margin-top: 10px;
border-radius: 10px;
border-radius: 10px;
box-shadow: 1px 1px 3px rgba(0, 0, 0, .2);
box-shadow: 1px 1px 3px rgba(0, 0, 0, .2);
display: flex;
display: flex;
@ -101,138 +43,131 @@
< div class = "container-div" id = "app" > < div class = "container-div" id = "app" >
< div class = "count_box" >
< div class = "count_box" >
< div class = "count_top" >
< div class = "count_top" >
< ul >
< li >
< div class = "textList" >
< p >
{{countList.total}}
< / p >
< p >
总数
< / p >
< / div >
< span class = "yuan" > < / span >
< i class = "fa fa-clipboard" style = "color: #0078ff" > < / i >
< / li >
< li >
< div class = "textList" >
< p >
{{countList.yfc}}
< / p >
< p >
已发出
< / p >
< / div >
< span class = "yuan" > < / span >
< i class = "fa fa-newspaper-o" style = "color: #ff313c" > < / i >
< / li >
< li >
< div class = "textList" >
< p >
{{countList.wfc}}
< / p >
< p >
未发出
< / p >
< / div >
< span class = "yuan" > < / span >
< i class = "fa fa-pie-chart" style = "color: #12b975" > < / i >
< / li >
< / ul >
< / div >
< div class = "count_bottom" >
< div class = "echart" >
< div class = "echart" >
< div class = "children_echarts left_echarts" >
< div id = "leftMain" style = "width: 700px;height:500px" > < / div >
< / div >
< div class = "children_echarts right_echarts" >
< div class = "children_echarts right_echarts" >
< div id = "rightMain" style = "width: 700px;height:50 0px"> < / div >
< div id = "rightMain" style = "width: 1300px;height:380px" > < / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< div class = "count_bottom" >
< div class = "col-sm-12 search-collapse" style = "margin-top: 0" >
< form id = "formId" >
< div class = "select-list" >
< ul >
< li >
< label style = "width: 80px" > 报告人单位：< / label >
< input type = "text" name = "depart" / >
< / li >
< li >
< label > 所属市州：< / label >
< select id = "City" name = "framework" @ change = "getAreaList()" v-model = "City" >
< option value = "" > ---请选择---< / option >
< option v-for = "option in CityList" :value = "option.id" :key = "option.id" >
{{ option.name }}
< / option >
< / select >
< / li >
< li >
< label > 所属区县：< / label >
< select id = "Area" name = "area" v-model = "Area" >
< option value = "" > ---请选择---< / option >
< option v-for = "option in AreaList" :value = "option.id" :key = "option.id" >
{{ option.name }}
< / option >
< / select >
< / li >
< li class = "select-time" >
< label > 检查时间： < / label >
< input type = "text" class = "time-input" id = "startTime" placeholder = "开始时间" name = "checkStartTime" / >
< span > -< / span >
< input type = "text" class = "time-input" id = "endTime" placeholder = "结束时间" name = "heckEndTime" / >
< / li >
< li >
< label > 实有项目总分：< / label >
< input type = "text" name = "totalScore" / >
< / li >
< li >
< label > 实有项目得分：< / label >
< input type = "text" name = "realScore" / >
< / li >
< li >
< a class = "btn btn-primary btn-rounded btn-sm" onclick = "$.table.search()" > < i class = "fa fa-search" > < / i > 搜索< / a >
< a class = "btn btn-warning btn-rounded btn-sm" onclick = "$.form.reset()" > < i class = "fa fa-refresh" > < / i > 重置< / a >
< / li >
< / ul >
< / div >
< / form >
< / div >
< div class = "btn-group-sm" id = "toolbar" role = "group" >
< a class = "btn btn-warning" onclick = "$.table.exportExcel()" shiro:hasPermission = "system:check:export" >
< i class = "fa fa-download" > < / i > 导出
< / a >
< / div >
< div class = "col-sm-12 select-table table-striped" >
< table id = "bootstrap-table" > < / table >
< / div >
< / div >
< / div >
< / div >
< / div > < / div >
< th:block th:include = "include :: footer" / > < th:block th:include = "include :: footer" / >
< th:block th:include = "include :: element-js" / > < th:block th:include = "include :: element-js" / >
< th:block th:include = "include :: echarts-js" / > < th:block th:include = "include :: echarts-js" / >
< script th:inline = "javascript" > < script th:inline = "javascript" >
var detailFlag = [[${@permission.hasPermi('system:check:detail')}]]
var prefix = ctx + "system/checknum";
var prefix = ctx + "system/checknum";
var app = new Vue({
var app = new Vue({
el: '#app',
el: '#app',
data: {
data: {
countList:[],
CityList: [],
AreaList:[],
City:'',
Area:'',
params:{
parentId:'',
}
},
},
created(){
created(){
this.init()
// 初始化地市列表
this.getCityList();
if (this.City){
this.getAreaList()
}
},
},
methods:{
methods:{
init(){
getCityList(){
axios.post(prefix + '/countNotifyList').then(response => {
$.ajax({
this.countList = response.data.data
url: ctx + "system/area/getSysAreaList",
})
type: 'GET',
data:this.params ,
success:((res)=>{
this.CityList = res.data
}) ,
});
},
},
}
getAreaList(){
})
this.params.parentId = this.City
var myChart = echarts.init(document.getElementById('leftMain'));
$.ajax({
axios.post(prefix + '/countResult').then(response => {
url: ctx + "system/area/getSysAreaList",
if (response.data.code == web_status.SUCCESS){
type: 'GET',
myChart.setOption({
data:this.params,
title:{
success:((res)=>{
text:'检查结果统计'
this.AreaList = res.data
},
}) ,
tooltip: {
});
trigger: 'item'
}
},
legend: {
orient: 'vertical',
x: 'left',
y:'bottom'
},
series: [
{
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: 20,
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: response.data.data.map((item,index) => ({
...item,
itemStyle: {
color: ['#99ff99','#66b3ff', '#ffcc99',][index]
}
}))
}
]
});
}
}
})
})
var rightMain = echarts.init(document.getElementById('rightMain'));
var rightMain = echarts.init(document.getElementById('rightMain'));
axios.post(prefix + '/countCheckType ').then(response => {
axios.post(prefix + '/countCheckMonth').then(response => {
if (response.data.code == web_status.SUCCESS){
if (response.data.code == web_status.SUCCESS){
rightMain.setOption({
rightMain.setOption({
title: {
title: {
text: '检查类型 统计'
text: '自查自评统计'
},
},
tooltip: {},
tooltip: {},
legend: {
legend: {
data:['检查类型 ']
data:['次数']
},
},
xAxis: {
xAxis: {
data: response.data.data.xAxisData,
data: response.data.data.xAxisData,
@ -246,7 +181,7 @@
},
},
series: [
series: [
{
{
name: '检查类型 ',
name: '次数 ',
type: 'bar',
type: 'bar',
data: response.data.data.yAxisData,
data: response.data.data.yAxisData,
itemStyle: {
itemStyle: {
@ -257,6 +192,86 @@
});
});
}
}
})
})
var prefixTable = ctx + "system/checkReport";
let datas = []
$.ajax({
url: ctx + "system/area/getAllList",
type: 'GET',
data:{parentId:''} ,
success:((res)=>{
datas = res.data
}) ,
});
$(function() {
var options = {
url: prefixTable + "/list",
detailUrl:prefixTable + "/detail/{id}",
exportUrl: prefixTable + "/export",
modalName: "检查报告管理",
type: 0,
columns: [{
checkbox: true
},
{
field: 'checkId',
title: 'id',
visible: false
},
{
field: 'framework',
title: '所属市州',
formatter: function(value, row, index) {
return getCity(datas, value)
}
},
{
field: 'area',
title: '所属区县',
formatter: function(value, row, index) {
return getCity(datas, value)
}
},
{
field: 'adduser',
title: '检查人员'
},
{
field: 'depart',
title: '检查单位'
},
{
field: 'checkStartTime',
title: '检查开始时间',
},
{
field: 'createTime',
title: '创建时间',
sortable: true
},
{
field: 'totalScore',
title: '实有项目总分',
},
{
field: 'realScore',
title: '实有项目得分',
},
{
field: 'percentageScore',
title: '得分占比(%)',
},
{
title: '操作',
align: 'center',
formatter: function(value, row, index) {
var actions = [];
actions.push('< a class = "btn btn-success btn-xs ' + detailFlag + '" href = "javascript:void(0)" onclick = "$.operate.detailTab(\'' + row.checkId + '\')" > < i class = "fa fa-edit" > < / i > 详情< / a > ');
return actions.join('');
}
}]
};
$.table.init(options);
});
< / script > < / script >
< / body > < / body >
< / html > < / html >
dshclm
6 months ago