Jeesite模块实现：患者管理Demo

Version 1.0

创建并使用数据库

create database `chronic_disease_management_archives`;
use `chronic_disease_management_archives`;

建数据表

数据表建单表/主表模板

create table table_name(
	id varchar(64) primary key,
    #推荐添加: table_id int(64) not null,
    ## 添加自己的属性
	status char(1),
	create_by varchar(64),
	create_date datetime,
	update_by varchar(64),
	update_date datetime,
	remarks nvarchar(500)
);

数据表建子表模板

create table table_name(
	id varchar(64) primary key,
    MainTable_id varchar(64),
    #推荐添加: table_id int(64) not null,
    ## 添加自己的属性
	status char(1),
	create_by varchar(64),
	create_date datetime,
	update_by varchar(64),
	update_date datetime,
	remarks nvarchar(500)
);

患者档案信息表

create table patient(
	id varchar(64) primary key, # 档案编号

    pati_name varchar(64) ,# 患者姓名
    pati_ID varchar(64) , # 身份证号
    pati_birth varchar(64) , # 生日
    pati_perman varchar(64) , # 常驻类型
    pati_height varchar(64) , # 身高
    pati_BMI varchar(64) , # BMI
    pati_energy varchar(64) , # 每日能量
    pati_occupa varchar(64) , # 职业
    pati_contact varchar(64) , # 联系人
    pati_reside varchar(64) , # 居住的地区
    pati_illness varchar(64) , # 慢病
    pati_sex varchar(64) , # 性别
    pati_telephone varchar(64) , # 联系电话
    pati_age varchar(64) , # 年龄
    pati_blood varchar(64) , # 血型
    pati_weight varchar(64) , # 体重
    pati_shape varchar(64) , # 体型
    pati_nation varchar(64) , # 民族
    pati_work varchar(64) , # 工作单位
    pati_address varchar(64) , # 详细地址
    pati_diabe_type varchar(64) , # 糖尿病类型
    pati_mag_mechan varchar(64) , # 管理机构
    pati_state varchar(64) , # 状态
    pati_marriage varchar(64) , # 婚姻状况
    pati_RH varchar(64) , # RH阴性
    pati_waist varchar(64) , # 腰围
    pati_work_intsy varchar(64) , # 工作强度
    pati_education varchar(64) , # 文化程度
    pati_pay varchar(64) , # 医疗支付
    pati_last varchar(64) , 
    # 上次随访：作为外键——随访管理的随访结果
    pati_next varchar(64) ,
    # 下次随访：作为外键——下次随访日期
	status char(1),
	create_by varchar(64),
	create_date datetime,
	update_by varchar(64),
	update_date datetime,
	remarks nvarchar(500)
);

糖尿病信息表

create table diabetes(
	id varchar(64) primary key,
    patient_id varchar(64),
    diagno_date varchar(64) , # 确诊日期
    ill_age varchar(64) , # 病龄
    target varchar(64) , # 控制目标
    plan varchar(64) , # 管理计划
    symptom varchar(64) , # 目前症状
    strategy varchar(64) , # 干预策略
    complication varchar(64) , # 并发症
    fam_dise varchar(64) , # 家族病史
    pati_label varchar(64) , # 患者标签
    diab_eat_habit varchar(64) , # 饮食习惯
    sleep_habit varchar(64) , # 睡眠习惯
    drug_abuse varchar(64) , # 药物滥用史
    smoke varchar(64) , # 吸烟情况
    drink varchar(64) , # 喝酒频率
    exercise varchar(64) , # 锻炼频率
	status char(1),
	create_by varchar(64),
	create_date datetime,
	update_by varchar(64),
	update_date datetime,
	remarks nvarchar(500)
);

病史信息表

create table medical_history(
	id varchar(64) primary key,
    patient_id varchar(64),
    allergy varchar(64) , # 药物过敏史
    expose varchar(64) , # 暴露史
    genet varchar(64) , # 遗传病史
    operation varchar(64) , # 既往史-手术
    trauma varchar(64) , # 既往史-外伤
    blood_trans varchar(64) , # 输血
    his_disease varchar(64) , # 疾病
    disabty varchar(64) , # 残疾情况
	status char(1),
	create_by varchar(64),
	create_date datetime,
	update_by varchar(64),
	update_date datetime,
	remarks nvarchar(500)
);

生活信息表

create table live(
	id varchar(64) primary key,
    patient_id varchar(64),
    kitchen varchar(64) , # 厨房排风设施
    fuel varchar(64) , # 燃料类型
    water varchar(64) , # 饮水
    WC varchar(64) , # 厕所
    livestock varchar(64) , # 禽畜栏
    live_eat_habit varchar(64) , # 饮食习惯
	status char(1),
	create_by varchar(64),
	create_date datetime,
	update_by varchar(64),
	update_date datetime,
	remarks nvarchar(500)
);

功能实现

自定义按钮查询

step 01 设置按钮

<input type="button" class="btn btn-primary btn-sm" value="全部" id="quanbu" />
<input type="button" class="btn btn-danger btn-sm" value="重点" id="zhongdian" onclick="zhongdianchaxun()" />
<input type="button" class="btn btn-warning btn-sm" value="一般" id="yiban" onclick="yibanchaxun()" /><input type="button" class="btn btn-info btn-sm" value="简单" id="jiandan" onclick="jiandanchaxun()" />
<input type="button" class="btn btn-default btn-sm" value="转移" id="zhuanyi" onclick="zhuanyichaxun()" />

• “全部” 按钮

  • 按钮关联触发重置
  • 按钮关联触发查询

• “重点” 按钮（其余同理）

  • 按钮触发自定义函数

    • 自定义函数：向查询框赋对应值

  • 按钮关联触发查询

• 隐藏查询框对应 label 和 div

step 02 给查询按钮和重置按钮设置id

<button type="submit" class="btn btn-primary btn-sm" id="chaxun" >${text('查询')}</button>
<button type="reset" class="btn btn-default btn-sm" id="chongzhi">${text('重置')}</button>

step 03 设置按钮关联触发

window.onload=function(){
    $("#quanbu").click(function(){
        $("#chongzhi").trigger('click');
        $("#chaxun").trigger('click');
    });
    $("#zhongdian").click(function(){
        $("#chaxun").trigger('click');
    });
    $("#yiban").click(function(){
        $("#chaxun").trigger('click');
    });
    $("#jiandan").click(function(){
        $("#chaxun").trigger('click');
    });
    $("#zhuanyi").click(function(){
        $("#chaxun").trigger('click');
    });
}

step 04 自定义函数

注意val()内的值，可以通过生成的网页元素检查获取

function zhongdianchaxun() {
	$("#patiState").val("0");
}

function yibanchaxun() {
	$("#patiState").val("1");
}

function jiandanchaxun() {
	$("#patiState").val("2");
}

function zhuanyichaxun() {
	$("#patiState").val("3");
}

附录：一些用到的 jquery 函数

// 该方法用于在网页加载完毕后立刻执行的操作，即当html加载完毕后，立刻执行某个方法
window.onload=function(){ }

// 点击按钮1触发点击按钮2
$("#id01").click(function(){
        $("#id02").trigger('click');
    });

/* 
也可用于选择下拉框
val()中的值对应的是option的value而非text值
*/
$("#id01").val("0");

数据字典使用

基于弹窗的地图API调用

step 01 前端搭建页面

<div class="col-xs-4">
    <div class="form-group">
        <label class="control-label col-sm-4" title="">
            <span class="required hide">*</span> ${text('详细地址')}：
            <i class="fa icon-question hide"></i>
        </label>
        <!-- 按钮触发模态框 -->
        <input type="button" class="btn btn-default btn-sm" data-toggle="modal" 
               data-target="#myModal" value="请选择您的详细地址 " style="width:250px;" id="dizhi01"/>
        <!-- 模态框（Modal） -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" 
             aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" 
                                aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">请选择您的详细地址</h4>
                    </div>
                    <div class="modal-body">
                        <iframe id="map_frame" src="manbingmap"></iframe>
                        <div class="col-sm-8"><br>
                            <#form:input path="patiAddress" maxlength="64" class="form-control"/>
                        </div>

                        <div class="modal-footer">
                            <input type="button" class="btn btn-default" 
                                   data-dismiss="modal" value="关闭" id="guanbi"/>
                            <input type="button" class="btn btn-primary" 
                                   value="提交更改" id="tijiaogenggai"/>
                        </div>
                    </div><!-- /.modal-content -->
                </div><!-- /.modal -->
            </div>
        </div>
    </div>
</div>

step 02 准备内联网页

• 内联网页代码

<!doctype html>
<html>
<head>
    
    
    
    <title>输入提示后查询</title>
	<link  rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="https://cache.amap.com/lbs/static/main1119.css"/>
    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=50509607507600a25b22befcd53a1747&plugin=AMap.Autocomplete,AMap.PlaceSearch,AMap.Geocoder"></script>
    <script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
	<script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
	<style type="text/css">

	</style>
</head>
	<body>
		<div id="container"></div>
			<div id="myPageTop">
			    <table>
			        <tr>
			            <td>
			                <label>请输入关键字：</label>

			            </td>
			        </tr>
			        <tr>
			            <td>
			                <input id="tipinput"/>
			            </td>
			        </tr>
					<tr>
					    <td>
							<div class="input-item-prepend">
                                <span class="input-item-text">经纬度</span>
                            </div>
							<input id='lnglat' class="disadd" type="text" disabled>
					    </td>
					</tr>
					<tr>
					    <td>
							<div class="input-item-prepend">
                                <span class="input-item-text" >地址</span>
                            </div>
							<input id='address' class="disadd" type="text" disabled>
					    </td>
					</tr>
			    </table>
			</div>

			<script type="text/javascript">

			    //地图加载
			    var map = new AMap.Map("container", {
			        resizeEnable: true
			    });
			    //输入提示
			    var autoOptions = {
			        input: "tipinput"
			    };
			    var auto = new AMap.Autocomplete(autoOptions);
			    var placeSearch = new AMap.PlaceSearch({
			        map: map
			    });  //构造地点查询类
			    AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
			    function select(e) {
			        placeSearch.setCity(e.poi.adcode);
			        placeSearch.search(e.poi.name);  //关键字查询查询
			    }

			    var geocoder = new AMap.Geocoder({
			        city: "010", //城市设为北京，默认：“全国”
			        radius: 1000 //范围，默认：500
			    });
			    var marker = new AMap.Marker();;
			    function regeoCode() {

			        var lnglat  = document.getElementById('lnglat').value.split(',');
			        map.add(marker);
			        marker.setPosition(lnglat);

			        geocoder.getAddress(lnglat, function(status, result) {
			            if (status === 'complete'&&result.regeocode) {
			                var address = result.regeocode.formattedAddress;
			                document.getElementById('address').value = address;
			            }else{ }
			        });
			    }

			    map.on('click',function(e){
			        document.getElementById('lnglat').value = e.lnglat;
			        regeoCode();
			    })
			    document.getElementById("regeo").onclick = regeoCode;
			    document.getElementById('lnglat').onkeydown = function(e) {
			        if (e.keyCode === 13) {
			            regeoCode();
			            return false;
			        }
			        return true;
			    };
			</script>

		</div>
	</body>
</html>

• API调用分析

  • 主要解决两个API怎么复合使用的问题

  • 开发文档：

  • 

  • 

  • 输入提示后查询

    • <!doctype html>
      <html>
      <head>
          
          
          
          <title>输入提示后查询</title>
          <link rel="stylesheet" href="https://cache.amap.com/lbs/static/main1119.css"/>
          <script type="text/javascript" src="https://webapi.amap.com/maps?v=2.0&key=您申请的key值"></script>
      </head>
      <body>
      <div id="container"></div>
      <div id="myPageTop">
          <table>
              <tr>
                  <td>
                      <label>请输入关键字：</label>
                  </td>
              </tr>
              <tr>
                  <td>
                      <input id="tipinput"/>
                  </td>
              </tr>
          </table>
      </div>
      <script type="text/javascript">
          //地图加载
          var map = new AMap.Map("container", {
              resizeEnable: true
          });
          //输入提示
          var autoOptions = {
              input: "tipinput"
          };
      
          AMap.plugin(['AMap.PlaceSearch','AMap.AutoComplete'], function(){
              var auto = new AMap.AutoComplete(autoOptions);
              var placeSearch = new AMap.PlaceSearch({
                  map: map
              });  //构造地点查询类
              auto.on("select", select);//注册监听，当选中某条记录时会触发
              function select(e) {
                  placeSearch.setCity(e.poi.adcode);
                  placeSearch.search(e.poi.name);  //关键字查询查询
              }
          });
      </script>
      </body>
      </html>
      

  • 地理/逆地理编码

    • 

    • <!doctype html>
      <html>
      <head>
          
          
          
          <title>逆地理编码(经纬度->地址)</title>
          <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css"/>
          <style>
              html,body,#container{
                  height:100%;
                  width:100%;
              }
              .btn{
                  width:10rem;
                  margin-left:6.8rem;   
              }
          </style>
      </head>
      <body>
      <div id="container"></div>
      <div class='info'>输入或点击地图获取经纬度。</div>
      <div class="input-card" style='width:28rem;'>
          <label style='color:grey'>逆地理编码，根据经纬度获取地址信息</label>
          <div class="input-item">
              <div class="input-item-prepend"><span class="input-item-text">经纬度</span></div>
              <input id='lnglat' type="text" value='116.39,39.9'>
          </div>
          <div class="input-item">
              <div class="input-item-prepend"><span class="input-item-text" >地址</span></div>
              <input id='address' type="text" disabled>
          </div>
          <input id="regeo" type="button" class="btn" value="经纬度 -> 地址" >
      </div>
      <script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
      <script type="text/javascript" src="https://webapi.amap.com/maps?v=2.0&key=您申请的key值&plugin=AMap.Geocoder"></script>
      <script type="text/javascript">
          var map = new AMap.Map("container", {
              resizeEnable: true
          });
          
          var geocoder = new AMap.Geocoder({
              city: "010", //城市设为北京，默认：“全国”
              radius: 1000 //范围，默认：500
          });
          var marker = new AMap.Marker();;
          function regeoCode() {
              
              var lnglat  = document.getElementById('lnglat').value.split(',');
              map.add(marker);
              marker.setPosition(lnglat);
              
              geocoder.getAddress(lnglat, function(status, result) {
                  if (status === 'complete'&&result.regeocode) {
                      var address = result.regeocode.formattedAddress;
                      document.getElementById('address').value = address;
                  }else{
                      log.error('根据经纬度查询地址失败')
                  }
              });
          }
          
          map.on('click',function(e){
              document.getElementById('lnglat').value = e.lnglat;
              regeoCode();
          })
          document.getElementById("regeo").onclick = regeoCode;
          document.getElementById('lnglat').onkeydown = function(e) {
              if (e.keyCode === 13) {
                  regeoCode();
                  return false;
              }
              return true;
          };
      </script>
      </body>
      </html>
      

  • 合并注意：

    • 地图初始化只需要一次，需要在另一个页面中进行删除

  • 加入网页：需要使用内联标签<iframe></iframe>

  • 部署到服务器时，src不能是静态路径，需写controller中@RequestMapping映射的路径

step 03 编写controller层

	@RequestMapping(value = {"manbingmap", ""})
	public String manbingmap(Mbpatient mbpatient, Model model) {
		model.addAttribute("mbpatient", mbpatient);
		return "modules/patient/manbing_map";
	}

标签：function,varchar,Demo,Jeesite,var,64,模块,pati,create
来源： https://www.cnblogs.com/Ding1fun/p/15232839.html