月份:2018年5月

java读取mongo数据库的所需的字段-json解析

mongo数据库的配置和引入阿里巴巴的fastjson包 自行百度

package com.wjy329.tesmongo.dao.impl;

import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;
import com.mongodb.BasicDBObject;
import com.mongodb.DBObject;
import com.wjy329.tesmongo.dao.DayTotalService;
import org.bson.BSONObject;
import org.bson.types.ObjectId;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.mongodb.core.MongoTemplate;
import org.springframework.stereotype.Service;

import java.util.Map;
import java.util.Set;

/**
 * @author wjy329
 * @date 2018/5/25
 * @description ${description}
 */
@Service
public class DayTotalServiceImpl implements DayTotalService {
    @Autowired
    //MongoTemplate 可操作mongo数据库
    MongoTemplate template;

    @Override
    public JSONArray getTotalInfo() {
        //获取到day为20180524的数据
        DBObject query = new BasicDBObject("day", "20180524");
        DBObject document = template.getCollection("update_total_model").findOne(query);
        //将数据转为json
        Object content = JSON.toJSON(document);
        JSONObject jsonObject=JSON.parseObject(content.toString());
        //移除_id的数据
        jsonObject.remove("_id");
        //获取字段的数据
        JSONObject test = jsonObject.getJSONObject("xxx");
       //array存放最终的数据
        JSONArray array = new JSONArray();
        //每个obj为一个数据段,可以理解为最后数据中的一个{}     ----[{},{}]
        JSONObject obj = new JSONObject();
        obj.put("day",datetime);
        ......
        ......
        {
         JSONObject allValue = jsonObject.getJSONObject(ccc).getJSONObject("all");
         Object ddd = allValue.get("ddd");
            obj.put("aaaa",cccc);
            obj.put("bbbb", ddd);
        }
           array.add(obj);
        System.out.println("请求数据"+array);
        return array;
    }
}

layui 复选框全选与反选

1、前台代码

<div class="layui-form-item">
<label class="layui-form-label">示例代码</label>
<div class="layui-input-block">
<input type="checkbox"  name="all" lay-skin="primary" id="all"    lay-filter="all" title="全选">
<input type="checkbox" id="one" name="one" lay-skin="primary" class="check" lay-filter="checkOne" title="one" value="1"> 
<input type="checkbox" id="two" name="two" lay-skin="primary" class="check" lay-filter="checkOne" title="two" value="2"> 
<input type="checkbox" id="three" name="three" lay-skin="primary" class="check" lay-filter="checkOne" title="three" value="3">
</div>
</div>

2、js代码

//全选
form.on('checkbox(all)', function(data){
var a = data.elem.checked;
if(a == true){
$(".check").prop("checked", true);
form.render('checkbox');
}else{
$(".check").prop("checked", false);
form.render('checkbox');
}

});
//有一个未选中全选取消选中,当每个都选中时,全选选中
form.on('checkbox(checkOne)', function(data){
var item = $(".check");
var j = 0;
for(var i=0;i<item.length;i++){
if(item[i].checked == false){
$("#all").prop("checked", false);
form.render('checkbox');
}else if(item[i].checked == true){
            j++;
        }
}
if(j == item.length){
        $("#all").prop("checked", true);
        form.render('checkbox');
    }
});

java date格式的转换与比较

1、时间段查询:
当以时间段查询某个字段的值时,一开始考虑使用了两个值来查询数据库,例如,starttime和endtime,由于数据的要求,这里采用了单条查询,所有采用了时间比较得方式,每个时间只返回一个值,直到循环到前台传来的endtime的值即可。
前端和数据库中存放的时间格式都是DATE类型: 2018-05-01
2、转换与比较

/**time_start,time_end为前台出来的值,分别代表起始时间和结束时间*/
/*这里将时间转换为可进行比较类型*/
long startTime = new SimpleDateFormat("yyyy-MM-dd").parse(time_start).getTime();
long endTime = new SimpleDateFormat("yyyy-MM-dd").parse(time_end).getTime();
for (long i = startTime; i <= endTime; i += 86400000L) {
//每比较一次,查询一次时间的值,将long型的值转换为DATE型进行查询
    value = updateMainService.selectValues(new SimpleDateFormat("yyyy-MM-dd").format(new Date(i)));
    ......
       }
}

================更新==============
3、上面是刚开始敲代码时的记录,在一番磨练之后,重新修改,不应该一次次的查询数据库,这样不仅效率低,而且频繁的连接数据库也会造成资源的浪费

改进: 现将数据全部查询出来后再比较,可以用where time > ‘startTime’ and time < ‘endTime’ 或者 in 条件查询数据

ECharts ajax请求数据到图表

1、返回的数据格式:

[{"A":0,"datetime":"2018-04-30","B":0,"C":0,"D":0,"E":0},{"A":12343213,"datetime":"2018-05-01","B":43256789,"C":23412356,"D":25431234,"E":34560987}}]

2、具体实现:

<!-- 为ECharts准备一个具备大小(宽高)的Dom -->
<div id="main" style="width:100%;height:400px;margin-left: auto;margin-right: auto"></div>
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var option = {
    title: {
        text: '这里显示图表的标题',
        left:'5%'  //标题距离图表的位置
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data: ['A', 'B', 'C', 'D', 'E'],  //显示的类别
        right:'5%'
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    toolbox: {
        feature: {
            saveAsImage: {}
        }
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: []
    },
    dataZoom: [
        { //  dataZoom 组件: 控制x轴
            xAxisIndex: [0] // 表示这个 dataZoom 组件控制 第一个 和 第三个 xAxis
        }],
    yAxis: {
        type: 'value'
    },
    series: [
        {
            name: 'A',
            type: 'line',
            stack: '总量',
            /*在图上显示数据*/
           /* label: {
                normal: {
                    show: true,
                    position: 'top'
                }
            },*/
            data: []
        },
        {
            name: 'B',
            type: 'line',
            stack: '总量',
            data: []
        },
        {
            name: ‘C',
            type: 'line',
            stack: '总量',
            data: []
        },
        {
            name: 'D',
            type: 'line',
            stack: '总量',
            data: []
        },
        {
            name: 'E',
            type: 'line',
            stack: '总量',
            data: []
        }
    ]
};
//初始化图表,使其在页面打开时就开始展示
myChart.setOption(option);
/**此处是我按钮的点击事件,点击按钮后,开始获取值*/
function login() {
    var names = [];    //类别数组(实际用来盛放X轴坐标值)
    var series1 = [];   //A 对应的值。。。下面BCDE
    var series2 = [];
    var series3 = [];
    var series4 = [];
    var series5 = [];
    $.ajax({
        type: 'get',
        url: '/values/selectMainValues',//请求数据的地址
        dataType: "json",        //返回数据形式为json
        data: $('#form').serialize(),    //序列化表单,选中表单条件提交后台查询数据
        cache: false,
        success: function (result) {
            //请求成功时执行该函数内容,result即为服务器返回的json对象
            $.each(result, function (index, item) {
                //挨个取出类别并填入类别数组
                names.push(item.datetime); //我这里x轴为时间
                series1.push(item.A); //每次把ABCDE分别放入对应的容器
                series2.push(item.B);
                series3.push(item.C);
                series4.push(item.D);
                series5.push(item.E);
                    });
            myChart.setOption({        //加载数据图表
                xAxis: {
                    data: names
                },
                series: [{
                    data: series1
                },
                    {
                        data: series2
                    },
                    {
                        data: series3
                    },
                    {
                        data: series4
                    },
                    {
                        data: series5
                    }]
            });
        },
        error: function (errorMsg) {
            //请求失败时执行该函数
            alert("图表请求数据失败!检查是否有未选中项!");
            myChart.hideLoading();
        }
    });
    // 使用刚指定的配置项和数据显示图表,true表示不融合数据,每次点击后都显示新的图表。
    myChart.setOption(option, true);
}

连接linux主机出现 Permission denied (publickey,gssapi-keyex,gssapi-with-mic) 错误解决

如图呢,出现了这种情况
解决办法:

1、在服务器执行 cat /etc/ssh/sshd_config 查看最后一行(一般是),看PasswordAuthentication 这个参数是否为 no
2、执行命令 vi /etc/ssh/sshd_config 修改noyes 即,PasswordAuthentication yes
:wq 保存退出
3、执行 service ssh restart 重启ssh服务
4、重启服务器
5、重新 ssh root@xxx.xxx.xxx.xxx

开始使用吧!

Layui 多选框通过表单序列化提交数据到后台

前端:layui,jquery
后端:spring boot,mybatis

1、

<div class="layui-form-item" >
       <label class="layui-form-label">类别</label>
       <div class="layui-input-inline" style="width:auto;">
         <input type="checkbox" name="type" id="all" lay-filter="all" value="" title="全选">
         <input type="checkbox" name="type" id="all" lay-filter="all" value="A" title="这是A">
         <input type="checkbox" name="type" id="all" lay-filter="all" value="B" title="这是B">
         <input type="checkbox" name="type" id="all" lay-filter="all" value="C" title="这是C">
        </div>
</div>

2、表单提交看上一篇
3、Mybatis 使用in xml文件:

<select id="selectType" parameterType="java.util.Map" resultMap="valuesMap">
        select
        *
        from
        tablename       
        where  
type in
        <foreach collection="type" index="index" item="type" open="(" separator=","                 close=")">
        #{type}
        </foreach>
</select>

4、Mapper 映射文件: (只写接口方法,其他自己完成)


Map<String, Object> selectType(@Param("type") String type);

5、Service、ServiceImpl

6、controller 核心方法:

public Map<String, Object> selectTypes(String type){
        /*types:将传入的type字符串转为list,这样就可以将ABC放入list中,在后台通过mybatis  in方法查询,全选按钮可能传值为on,这里用replace去掉,不知道有没有其他方式解决*/
        List<String> types= Arrays.asList(type.replace(“on,”,””).split(","))
...
        return xxx;
    }

Layui ajax提交form表单

Layui ajax提交form表单

1、基本方法
这里的前端页面自己写吧。

<!DOCTYPE html>
<html>
<head>
 ...
</head>
<body>

<form class="layui-form">
  <div class="layui-form-item">
    <label class="layui-form-label">xxx</label>
<div class="layui-input-block">
<input xxxxxxxxx>
    </div>
  </div>

<div class="layui-form-item">
      <div class="layui-input-block">
          <button class="layui-btn " type="button" onclick="login()">查询</button>
<!-- 此处type=”button” 必须添加,不然会刷新页面 -->
      </div>
  </div>

<form>
/*这里使用外部脚本方式,推荐方式,方便以后出问题直接修改js*/
<script th:src="@{/js/xxx/demo.js}"></script> 
</body>
</html>

2、重点:demo.js

/*使用layui模块必须*/
layui.use(['form', 'laydate','jquery'], function () {
    var form = layui.form,      //加载form表单
        laydate = layui.laydate,  //日期插件
        $ = layui.$; 
    //日期
    laydate.render({
        elem: '#time'  //id为time的时间选择器
        ,done: function(value){ //选择完时间后执行的方法
             $(function () { }
    });
       form.render(); //渲染表单
});
/**其实表单主要提交功能在这里*/
function login() {
        $.ajax({
        type: 'get',
        url: '/selectMainValues',//请求数据的地址
        dataType: "json",        //返回数据形式为json
        data: $('#form').serialize(),  //序列化表单,就是要把每一项表单的值拼接成name=value&name=value...的形式(例如:name=wjy&pass=admin)
        success: function (result) {
            //请求成功时执行该函数内容,result即为服务器返回的json对象
            $.each(result, function (index, item) {
                //挨个取出result                
            });
        },
        error: function (errorMsg) {
            //请求失败时执行该函数
           }
    });
}