| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291 |
- <!DOCTYPE HTML>
- <%@ page language="java" pageEncoding="UTF-8" import="java.util.*" contentType="text/html; charset=UTF-8"%>
- <%@include file="/jsp/framework/head.jsp"%>
- <%@ taglib uri="/WEB-INF/hnisi.tld" prefix="hnisi"%>
- <%
- String sdzlid = (DTOUtil.getValue("sdzlid") == ""? "" : DTOUtil.getValue("sdzlid"));
- String sdjlid = (DTOUtil.getValue("sdjlid") == ""? "" : DTOUtil.getValue("sdjlid"));
- Map dataMap = new HashMap();
- dataMap = (Map) DTOUtil.getData().get("dataMap") == null?null:(Map) DTOUtil.getData().get("dataMap");
-
- final String putObjectUrl = ConfUtil.getParam("GGFW_WJFW_UPLOAD_URL");
- final String usertoken=(String)request.getSession().getAttribute("usertoken");
- %>
- <html>
- <style>
- html,body{
- width: 100%;
- height: 100%;
- margin: 0;
- padding: 0;
- }
- .div-default:active, .div-default:hover {
- background-color:#FFFACD;
- }
- .zllb-div1{
- padding: 10px 5px 10px 5px;
- background: #fbfbfb;
- border-top: 1px solid #efefef;
- border-bottom: 1px solid #efefef;
- }
- .zllb-div2{
- padding: 10px 5px 10px 5px;
- background: #fff;
- border-top: 1px solid #fff;
- border-bottom: 1px solid #fff;
- }
- .div-on {
- background-color:#FFFACD;
- border-color: #8c8c8c;
- color: #8c8c8c;
- }
- .imgcard {
- float: left;
- position: relative;
- border: 1px solid #ccc;
- padding-bottom: 5px;
- float: left;
- margin-right: 10px;
- margin-bottom: 10px;
- }
- .imgcard .title {
- text-align: center;
- }
- </style>
- <head lang="zh-cn">
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <title>本地上传</title>
- </head>
- <body>
- <div id="root" style="width: 100%;height: 100%;padding:0 0 5px 0;">
- <div class="row" style="height:100%;margin:10px 0">
- <!-- 第一块资料类别 -->
- <div class="col col-2">
- <div class="section" style="width: 100%;height: 100%;">
- <div class="section-title">
- <img class="title-icon" src="${ctx}/themes/zjrs/images/title-icon.png" />
- <span class="section-title-text">资料类别</span>
- </div>
- <div id="zllb" class="bg_set" style="overflow:auto;">
- <%if(dataMap != null){
- List<Map<String, Object>> sdzlList = (List) dataMap.get("sdzlList");
- if(sdzlList != null){
- for(int i=0;i<sdzlList.size();i++){
- %>
- <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")%>')">
- <%
- if("1".equals(sdzlList.get(i).get("SFBSBZ"))){
- %>
- <a style="color:red;">*</a>
- <%
- }
- %>
- <%=(String) sdzlList.get(i).get("ZLLBMC")%>(<a id="zllb<%=sdzlList.get(i).get("SDZLID") %>" style="color:blue;"><%=sdzlList.get(i).get("CNT")%></a>)
- </div>
- <%
- }
- }
- } %>
- </div>
- </div>
- </div>
- <div class="col col-10">
- <div class="section" style="width: 100%;height: 100%;">
- <div class="section-title">
- <img class="title-icon" src="${ctx}/themes/zjrs/images/title-icon.png" />
- <span class="section-title-text">导入结果</span>
- <span class="section-title-extra-btn">
- <a style="color:red;">大小不超过2M,数量不超过20;导入确认无误后,请务必点击【保存】。</a>
- <input style="line-height:0;width:180px" type="file" id="localfile" name="localfile" multiple="multiple" accept="image/jpg, image/jpeg, image/png"/>
- <a class="btn btn-primary" onclick="doImportImage()">导入</a>
- <a class="btn btn-primary" onclick="doSave()">保存</a>
- <a class="btn btn-ghost" onclick="doClear()">清空</a>
- <a class="btn btn-primary" onclick="goBack()">返回</a>
- </span>
- </div>
- <div id="image_list_div" class="bg_set" style="overflow:auto;">
-
- </div>
- </div>
- </div>
- </div>
- </div>
- </body>
- <script type="text/javascript">
- var GVAR_LOCALFILE= {
- "sdzlid":"<%=sdzlid%>",
- "sdjlid":"<%=sdjlid%>",
- "camidx":"0"
- };
- //如果GVAR已经定义了则追加
- if(GVAR){
- GVAR = $.extend(GVAR, GVAR_LOCALFILE);
- }else{
- var GVAR = GVAR_LOCALFILE;
- }
- var imgObj = {};//拍摄照片结果
- var imgCnt = 0;//拍摄照片计数
- var imgSaveCnt = 0;//保存照片计数
- //初始化界面
- $(function(){
- //计算高度
- var distance = document.documentElement.clientHeight;
- var divHeight = distance-62;
- document.getElementById("zllb").style.height= divHeight + "px";//左侧div
- document.getElementById("image_list_div").style.height= divHeight + "px";//右侧div
-
- var sdzlid = "<%=sdzlid%>";
- if(sdzlid.length > 0){
- //默认选中传参sdzl
- setSdzlid(sdzlid);
- }
- });
- //切换收单资料id
- function setSdzlid(sdzlid){
- //div增加选中样式
- var div = document.getElementById("zllbdiv"+sdzlid);
- div.className += ' div-on';
- if(GVAR.sdzlid != sdzlid && GVAR.sdzlid != ""){
- var divdel = document.getElementById("zllbdiv"+GVAR.sdzlid);
- var classVal = divdel.getAttribute("class");
- classVal = classVal.replace(" div-on","");
- divdel.setAttribute("class",classVal);
- }
- GVAR.sdzlid = sdzlid;
- }
- //导入
- function doImportImage(){
- var files = document.getElementById("localfile").files;
- if(files.length > 0){
- if(files.length > 20){
- alert("文件数量不可超过20!");
- return;
- }
- var msg = "";
- var filemaxsize = 1024 * 1024 * 2;//2M
- for(var i=0;i<files.length;i++){
- //大小 字节 files[0].size
- if(files[i].size > filemaxsize){
- msg += files[i].name+"文件大小不能大于2M;";
- continue;
- }
- //判断类型files[0].type
- var fileType = files[i].type;
- if(fileType.indexOf("jpg") < 0 && fileType.indexOf("jpeg")<0 && fileType.indexOf("png")< 0){
- msg += files[i].name+"文件类型不符合(.jpg|.jpeg|.png);";
- continue;
- }
-
- var oFReader = new FileReader();
- var file = files[i];
- oFReader.readAsDataURL(file);
- oFReader.onloadend = function(oFRevent){
- var src = oFRevent.target.result;
- var base64 = src.substring(src.indexOf(",")+1);
- //保存数据到图片集
- imgCnt++;
- imgSaveCnt++;
- var imgKey = "img" + imgCnt;
- imgObj[imgKey] = base64;
- var html = '<div class="imgcard">' +
- '<img id="'+imgKey+'" src="data:image/jpeg;base64,' + base64 +
- '" style="width:200px;height: 180px;" />' +
- "</div>";
- $("#image_list_div").append(html);
- }
- }
- if(msg != ""){
- alert(msg);
- }
- var localfile = document.getElementById('localfile');
- localfile.outerHTML = localfile.outerHTML;
- }else{
- alert("请选择文件!");
- }
- }
- //返回
- function goBack(){
- var title=encodeURIComponent('收单页面');
- window.location.href = "${ctx}/shoudan/web/mainview/mainview.do?title="+title+"&sdzlid="+ GVAR.sdzlid +"&sdjlid="+GVAR.sdjlid;
- }
- //清空
- function doClear(){
- document.getElementById("image_list_div").innerHTML = "";
- imgObj = {};//拍摄照片结果
- imgCnt = 0;//拍摄照片计数
- imgSaveCnt = 0;//保存照片计数
- }
- //保存
- function doSave(){
- if(imgSaveCnt > 0){
- var url = "<%=putObjectUrl%>";
- var token = "<%=usertoken%>";
- if(CFW.oValid.fnIsNull(token)){
- alert("系统登录超时,上传失败,请重新登录后上传!");
- return;
- }
- var tyccids = putFiles(url,token);
-
- var mParams={
- sdzlid:GVAR.sdzlid,
- tyccids:tyccids
- };
- CFW.oAJax.doService("mainviewService.saveSdzlmx", mParams, '正在上传资料信息...',
- function(mData) {
- if(mData[0].FLAG=="1"){
- alert("保存成功!");
- //更新资料类别总数
- var cnt = document.getElementById("zllb"+GVAR.sdzlid).innerHTML;
- var zlmxCnt = parseInt(cnt) + imgSaveCnt;
- document.getElementById("zllb"+GVAR.sdzlid).innerHTML = zlmxCnt;
- doClear();
- }else{
- alert("保存失败!");
- }
- }
- );
- }else{
- alert("请导入需要保存的文件!");
- }
- }
- //文件上传,返回统一存储ID
- function putFiles(url,token){
- var tyccids = "";
- for(var i=0;i<imgSaveCnt;i++){
- var formdata = new FormData();
- var imgindex=i+1;
- const blob = base64ToBlob("data:image/jpeg;base64,"+imgObj["img"+imgindex]);
- const file = blobToFile(blob, "img"+imgindex+".jpg");
-
- formdata.append('file', file, "img"+imgindex+".jpg");
- formdata.append('business', 'business1');
-
- var tyccid = putObject(url,token,formdata);
-
- tyccids +=tyccid+",";
- }
-
- return tyccids;
- }
- </script>
- <script src="${ctx}/jsp/shoudan/web/mainview/js/put-object-to-fileserver.js"></script>
- </html>
|