任务:
- 首页当领导登陆不显示绩效考核曲线图,否则就显示;
- Echarts图月份根据当前月份前推11个月;
-
分别显示各个月份的绩效考核成绩;
1550828243(1).jpg
主要应用知识:
- ajax相关知识点?
- json知识
- Echarts动态获取数据?
问题汇总:
- 问题1:遇到javax.xml.stream.FactoryConfigurationError: Provider for class错误:
解决办法:
缺少一个jar包jar包下载地址 - 问题2:引入jar包
把下载好的jar包存入lib文件夹下,然后点击项目名---Builder Path---Config Builder Path---Librars--AddJar 选择 jar包然后运行 - 问题3:Echarts动态赋值
解决办法:将前端传过来的json数据获取 - 问题4:使用jpa查询数据库出现错误,原因是表的设置有问题,实体类和数据表主键对应不一致
解决办法:
@Override
public List<Map<String, Object>> findByAssessInf(String beAssessmentStaffName) {
StringBuffer sql=new StringBuffer();
List<String> params=new ArrayList<String>();
sql.append("select DATA_MONTH,ASSESS_RESULT_SCORE from assessment_result t where t.BE_ASSESSMENT_STAFF_ID!='0'");
if(StringUtils.isNotBlank(beAssessmentStaffName)) {
sql.append(" and t.BE_ASSESSMENT_STAFF_ID= ? ");
params.add(beAssessmentStaffName);
}
return jdbctemplate.queryForList(sql.toString(),params.toArray());
}
可以查询到需要的数据不需要在持久层写方法,直接在Service层写好,Controller器进行调用
//定义两个全局变量
var month;
var score;
$.ajax({
url: "${ctx}/login/getSysGraph",
type: "GET",
dataType: "json",
success: function(data) {
month = data[1].assessmentMonth; //获取月份信息
score = data[0].assessmentScore; //获取考核成绩信息
//然后在对应的Ecahrts图里面替换数据
xAxis : [
{
type : 'category',
boundaryGap : false,
data : month
}
],
series : [
{
name:'绩效考核得分',
type:'line',
data:score,
然后就能显示从数据库查询到的数据
对于json、ajax的概念比较模糊下来需要好好复习一下
最终效果:
![Q]BG(2L2)OSL2{BDBR]~RH4.png](https://img.haomeiwen.com/i16289001/9fa0410c5c428442.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
网友评论