founder.jsp 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333
  1. <!DOCTYPE HTML>
  2. <%@ page language="java" pageEncoding="UTF-8" import="java.util.*" contentType="text/html; charset=UTF-8"%>
  3. <%@include file="/jsp/framework/head.jsp"%>
  4. <%@ taglib uri="/WEB-INF/hnisi.tld" prefix="hnisi"%>
  5. <%
  6. String sdzlid = (DTOUtil.getValue("sdzlid") == ""? "" : DTOUtil.getValue("sdzlid"));
  7. String sdjlid = (DTOUtil.getValue("sdjlid") == ""? "" : DTOUtil.getValue("sdjlid"));
  8. Map dataMap = new HashMap();
  9. dataMap = (Map) DTOUtil.getData().get("dataMap") == null?null:(Map) DTOUtil.getData().get("dataMap");
  10. final String putObjectUrl = ConfUtil.getParam("GGFW_WJFW_UPLOAD_URL");
  11. final String usertoken=(String)request.getSession().getAttribute("usertoken");
  12. %>
  13. <html>
  14. <style>
  15. html,body{
  16. width: 100%;
  17. height: 100%;
  18. margin: 0;
  19. padding: 0;
  20. }
  21. .div-default:active, .div-default:hover {
  22. background-color:#FFFACD;
  23. }
  24. .zllb-div1{
  25. padding: 10px 5px 10px 5px;
  26. background: #fbfbfb;
  27. border-top: 1px solid #efefef;
  28. border-bottom: 1px solid #efefef;
  29. }
  30. .zllb-div2{
  31. padding: 10px 5px 10px 5px;
  32. background: #fff;
  33. border-top: 1px solid #fff;
  34. border-bottom: 1px solid #fff;
  35. }
  36. .div-on {
  37. background-color:#FFFACD;
  38. border-color: #8c8c8c;
  39. color: #8c8c8c;
  40. }
  41. </style>
  42. <head lang="zh-cn">
  43. <meta charset="utf-8">
  44. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  45. <meta name="viewport" content="width=device-width,initial-scale=1">
  46. <title>高拍仪</title>
  47. </head>
  48. <body onLoad="Init()">
  49. <div id="root" style="width: 100%;height: 100%;padding:0 0 5px 0;">
  50. <div class="row" style="height:100%;margin:10px 0">
  51. <!-- 第一块资料类别 -->
  52. <div class="col col-3-1">
  53. <div class="section" style="width: 100%;height: 100%;">
  54. <div class="section-title">
  55. <img class="title-icon" src="${ctx}/themes/zjrs/images/title-icon.png" />
  56. <span class="section-title-text">资料类别</span>
  57. </div>
  58. <div id="zllb" class="bg_set" style="overflow:auto;">
  59. <%if(dataMap != null){
  60. List<Map<String, Object>> sdzlList = (List) dataMap.get("sdzlList");
  61. if(sdzlList != null){
  62. for(int i=0;i<sdzlList.size();i++){
  63. %>
  64. <div id="zllbdiv<%=sdzlList.get(i).get("SDZLID") %>" <%if(i%2 == 0){ %> class="zllb-div1 div-default" <%}else{ %> class="zllb-div2 div-default" <%} %> onclick="setSdzlid('<%=sdzlList.get(i).get("SDZLID")%>')">
  65. <%
  66. if("1".equals(sdzlList.get(i).get("SFBSBZ"))){
  67. %>
  68. <a style="color:red;">*</a>
  69. <%
  70. }
  71. %>
  72. <%=(String) sdzlList.get(i).get("ZLLBMC")%>(<a id="zllb<%=sdzlList.get(i).get("SDZLID") %>" style="color:blue;"><%=sdzlList.get(i).get("CNT")%></a>)
  73. </div>
  74. <%
  75. }
  76. }
  77. } %>
  78. </div>
  79. </div>
  80. </div>
  81. <div class="col col-3-2">
  82. <div class="section" style="width: 100%;height: 100%;">
  83. <div class="section-title">
  84. <img class="title-icon" src="${ctx}/themes/zjrs/images/title-icon.png" />
  85. <span class="section-title-text">拍摄预览区</span>
  86. <span class="section-title-extra-btn">
  87. <a style="color:red;">拍照完成确认无误后,请务必点击【保存】。</a>
  88. <input type="radio" name="camidx" value="0" onclick="selectCamera(0)" checked="checked"/>文档头&nbsp;&nbsp;
  89. <input type="radio" name="camidx" value="1" onclick="selectCamera(1)"/>人像头&nbsp;&nbsp;&nbsp;&nbsp;
  90. <a class="btn btn-primary" onclick="doGrabImage()">拍照</a>&nbsp;&nbsp;&nbsp;&nbsp;
  91. <a class="btn btn-primary" onclick="goBack()">返回</a>
  92. </span>
  93. </div>
  94. <div id="noniediv" class="bg_set">
  95. <img id="streamimage" style="width:100%;height: 100%;" src="http://127.0.0.1:38088/?video=stream&camidx=0" />
  96. </div>
  97. <!-- 如果是ie浏览器,会显示ocx -->
  98. <div id="ocxdiv" style="width: 100%;height: 94%;">
  99. <OBJECT id="ocxstreamimage" name="showVideoOcx" width="100%" height="100%" classid="clsid:A4B4E9B5-78E6-4CE3-B8A1-4B36237943F8"></OBJECT>
  100. </div>
  101. </div>
  102. </div>
  103. <div class="col col-3-3">
  104. <div class="section" style="width: 100%;height: 100%;">
  105. <div class="section-title">
  106. <img class="title-icon" src="${ctx}/themes/zjrs/images/title-icon.png" />
  107. <span class="section-title-text">缩略图</span>
  108. <span class="section-title-extra-btn">
  109. <a class="btn btn-ghost" onclick="doClear()">清空</a>
  110. <a class="btn btn-primary" onclick="doSave()">保存</a>
  111. </span>
  112. </div>
  113. <div id="image_list_div" class="bg_set" style="overflow:auto;">
  114. </div>
  115. </div>
  116. </div>
  117. </div>
  118. </div>
  119. </body>
  120. <script src="/web/jsp/shoudan/web/mainview/jquery/jquery.js"></script>
  121. <script type="text/javascript">
  122. var GVAR_FOUNDER= {
  123. "sdzlid":"<%=sdzlid%>",
  124. "sdjlid":"<%=sdjlid%>",
  125. "camidx":"0"
  126. };
  127. //如果GVAR已经定义了则追加
  128. if(GVAR){
  129. GVAR = $.extend(GVAR, GVAR_FOUNDER);
  130. }else{
  131. var GVAR = GVAR_FOUNDER;
  132. }
  133. var $2 = $.noConflict(); // 第二个加载的jQuery对象变成了 $2
  134. var imgObj = {};//拍摄照片结果
  135. var imgCnt = 0;//拍摄照片计数
  136. var imgSaveCnt = 0;//保存照片计数
  137. //浏览器类型
  138. function BrowserType(){
  139. var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
  140. if(userAgent.indexOf("Firefox") > -1){
  141. return "Firefox";
  142. }else if(userAgent.indexOf("Chrome") > -1){
  143. return "Chrome";
  144. }
  145. return "IE";
  146. }
  147. //是否IE浏览器
  148. function IsIE(){
  149. if(BrowserType() == "IE"){
  150. return true;
  151. }else{
  152. return false;
  153. }
  154. }
  155. //启动 CameraService 服务程序
  156. function Init(){
  157. window.location.href="cameraServicetis:0";
  158. //计算高度
  159. var distance = document.documentElement.clientHeight;
  160. var divHeight = distance-52;
  161. //ie浏览器
  162. if(IsIE()){
  163. var ui = document.getElementById("noniediv");
  164. ui.style.display="none";
  165. ui.style.visibility="hidden";
  166. document.getElementById("ocxdiv").style.height= divHeight +"px";
  167. showVideoOcx.StartPreview(0);
  168. }else{
  169. var ui = document.getElementById("ocxdiv");
  170. ui.style.display="none";
  171. ui.style.visibility="hidden";
  172. document.getElementById("noniediv").style.height= (divHeight - 10) +"px";
  173. }
  174. document.getElementById("zllb").style.height= (divHeight - 10) + "px";//左侧div
  175. document.getElementById("image_list_div").style.height= (divHeight - 10) + "px";//右侧div高度
  176. var sdzlid = "<%=sdzlid%>";
  177. if(sdzlid.length > 0){
  178. //默认选中传参sdzl
  179. setSdzlid(sdzlid);
  180. }
  181. }
  182. //切换收单资料id
  183. function setSdzlid(sdzlid){
  184. //div增加选中样式
  185. var div = document.getElementById("zllbdiv"+sdzlid);
  186. div.className += ' div-on';
  187. if(GVAR.sdzlid != sdzlid && GVAR.sdzlid != ""){
  188. var divdel = document.getElementById("zllbdiv"+GVAR.sdzlid);
  189. var classVal = divdel.getAttribute("class");
  190. classVal = classVal.replace(" div-on","");
  191. divdel.setAttribute("class",classVal);
  192. }
  193. GVAR.sdzlid = sdzlid;
  194. }
  195. //切换摄像头
  196. function selectCamera(index){
  197. GVAR.camidx=index;
  198. //ie浏览器
  199. if(IsIE()){
  200. showVideoOcx.StartPreview(index);
  201. }else{
  202. document.getElementById("streamimage").src="http://127.0.0.1:38088/video=stream&camidx="+index;
  203. }
  204. }
  205. //拍照
  206. function doGrabImage(){
  207. var strImageProcess = "";
  208. if(GVAR.camidx == "0"){//文档头
  209. strImageProcess = "{\"cut_type\":\"1\",\"rotate\":\"270\"}";//自动切边,图片逆时针旋转90度
  210. }else{
  211. strImageProcess = "{\"cut_type\":\"0\"}";
  212. }
  213. var strStorageInfo = "{ \"xdpi\":\"200\", \"ydpi\":\"200\", \"jpg_quality\":\"60\"}";
  214. var params = "{\"camidx\":\"" + GVAR.camidx + "\",\"make_uuid\":\"0\",\"image_storage_info\":" + strStorageInfo + ",\"image_process_info\":" + strImageProcess + "}";
  215. //alert("params="+params);
  216. var url = "http://127.0.0.1:38088/video=grabimage";
  217. $2.ajax({
  218. type: "post",
  219. url: url,
  220. dataType: "json",
  221. data: params,
  222. success: function(data){
  223. if(data.code != 0){
  224. alert(data.message);
  225. }else{
  226. var images = data.images;
  227. var iCount = data.image_count;
  228. var strImageList = "";
  229. for(var i = 0; i < iCount; i++){
  230. //保存数据到图片集
  231. imgCnt++;
  232. imgSaveCnt++;
  233. var imgKey = "img" + imgCnt;
  234. imgObj[imgKey] = images[i].base64;
  235. //界面显示
  236. strImageList += "<img id=\"" + imgKey + "\" src=\"data:image/jpg;base64," + images[i].base64 + "\" width=96% />";
  237. //if(typeof(images[i].uuid) != "undefined")
  238. //document.getElementById("pdf_input").value = images[i].uuid;
  239. }
  240. document.getElementById("image_list_div").innerHTML = strImageList + document.getElementById("image_list_div").innerHTML;
  241. }
  242. }
  243. });
  244. }
  245. //返回
  246. function goBack(){
  247. var title=encodeURIComponent('收单页面');
  248. window.location.href = "${ctx}/shoudan/web/mainview/mainview.do?title="+title+"&sdzlid="+ GVAR.sdzlid +"&sdjlid="+GVAR.sdjlid;
  249. }
  250. //清空
  251. function doClear(){
  252. document.getElementById("image_list_div").innerHTML = "";
  253. imgObj = {};//拍摄照片结果
  254. imgCnt = 0;//拍摄照片计数
  255. imgSaveCnt = 0;//保存照片计数
  256. }
  257. //保存
  258. function doSave(){
  259. if(imgSaveCnt > 0){
  260. var url = "<%=putObjectUrl%>";
  261. var token = "<%=usertoken%>";
  262. if(CFW.oValid.fnIsNull(token)){
  263. alert("系统登录超时,上传失败,请重新登录后上传!");
  264. return;
  265. }
  266. var tyccids = putFiles(url,token);
  267. var mParams={
  268. sdzlid:GVAR.sdzlid,
  269. tyccids:tyccids
  270. };
  271. CFW.oAJax.doService("mainviewService.saveSdzlmx", mParams, '正在上传资料信息...',
  272. function(mData) {
  273. if(mData[0].FLAG=="1"){
  274. alert("保存成功!");
  275. //更新资料类别总数
  276. var cnt = document.getElementById("zllb"+GVAR.sdzlid).innerHTML;
  277. var zlmxCnt = parseInt(cnt) + imgSaveCnt;
  278. document.getElementById("zllb"+GVAR.sdzlid).innerHTML = zlmxCnt;
  279. doClear();
  280. }else{
  281. alert("保存失败!");
  282. }
  283. }
  284. );
  285. }else{
  286. alert("请先点击拍照,拍摄需要保存的文件!");
  287. }
  288. }
  289. //文件上传,返回统一存储ID
  290. function putFiles(url,token){
  291. var tyccids = "";
  292. for(var i=0;i<imgSaveCnt;i++){
  293. var formdata = new FormData();
  294. var imgindex=i+1;
  295. const blob = base64ToBlob("data:image/jpeg;base64,"+imgObj["img"+imgindex]);
  296. const file = blobToFile(blob, "img"+imgindex+".jpg");
  297. formdata.append('file', file, "img"+imgindex+".jpg");
  298. formdata.append('business', 'business1');
  299. var tyccid = putObject(url,token,formdata);
  300. tyccids +=tyccid+",";
  301. }
  302. return tyccids;
  303. }
  304. </script>
  305. <script src="${ctx}/jsp/shoudan/web/mainview/js/put-object-to-fileserver.js"></script>
  306. </html>