group增加原卷显示开始/关闭功能

stmms-biz/src/main/java/cn/com/qmth/stmms/biz/exam/model/MarkGroup.java

@@ -78,6 +78,12 @@ public class MarkGroup implements Serializable {
 
     @Column(name = "left_count")
     private Integer leftCount;
+    
+    /**
+     * 开启/关闭 原卷显示
+     */
+    @Column(name = "sheet_view", nullable = false)
+    private boolean sheetView;
 
     @Transient
     private int currentCount;
@@ -132,6 +138,7 @@ public class MarkGroup implements Serializable {
         if (markMode != null) {
             this.markMode = MarkMode.findByName(markMode);
         }
+        this.sheetView = false;
     }
 
     public Integer getExamId() {
@@ -324,4 +331,12 @@ public class MarkGroup implements Serializable {
         this.markMode = markMode;
     }
 
+	public boolean isSheetView() {
+		return sheetView;
+	}
+
+	public void setSheetView(boolean sheetView) {
+		this.sheetView = sheetView;
+	}
+
 }

stmms-web/src/main/java/cn/com/qmth/stmms/admin/exam/MarkGroupController.java

@@ -172,7 +172,7 @@ public class MarkGroupController extends BaseExamController {
 
     @RequestMapping("/add")
     @RoleRequire(Role.SCHOOL_ADMIN)
-    public String editSimple(HttpServletRequest request, Model model, @RequestParam String subjectCode) {
+    public String add(HttpServletRequest request, Model model, @RequestParam String subjectCode) {
         int examId = getSessionExamId(request);
         ExamSubject subject = subjectService.find(examId, subjectCode);
         if (subject == null) {
@@ -254,13 +254,16 @@ public class MarkGroupController extends BaseExamController {
             @RequestParam(required = false) String intervalScoreList, @RequestParam(required = false) String scoreList,
             @RequestParam(required = false) Double doubleRate,
             @RequestParam(required = false) Double arbitrateThreshold,
-            @RequestParam(required = false) Integer scorePolicy, @RequestParam(required = false) String markMode) {
+            @RequestParam(required = false) Integer scorePolicy, @RequestParam(required = false) String markMode,
+            @RequestParam(required = false) boolean sheetView) {
         int examId = getSessionExamId(request);
         MarkGroup group = groupService.findOne(examId, subjectCode, number);
         List<ExamQuestion> questionList = questionService
                 .findByExamAndSubjectAndPaperTypeAndObjectiveAndMainNumber(examId, subjectCode, null, false, number);
         if (group != null) {
             // quick update
+        	group.setSheetView(sheetView);
+        	groupService.save(group);
             picList = StringEscapeUtils.unescapeHtml(picList);
             JSONArray array = JSONArray.fromObject(picList);
             List<PictureConfigItem> list = JSONArray.toList(array, new PictureConfigItem(), new JsonConfig());
@@ -315,7 +318,8 @@ public class MarkGroupController extends BaseExamController {
             @RequestParam(required = false) String title, @RequestParam(required = false) String picList,
             @RequestParam(required = false) String scoreList, @RequestParam(required = false) Double doubleRate,
             @RequestParam(required = false) Double arbitrateThreshold,
-            @RequestParam(required = false) Integer scorePolicy, @RequestParam(required = false) String markMode) {
+            @RequestParam(required = false) Integer scorePolicy, @RequestParam(required = false) String markMode,
+            @RequestParam(required = false) boolean sheetView) {
         int examId = getSessionExamId(request);
         MarkGroup group = groupService.findOne(examId, subjectCode, number);
         if (group != null) {
@@ -333,6 +337,7 @@ public class MarkGroupController extends BaseExamController {
             List<PictureConfigItem> list = JSONArray.toList(array, new PictureConfigItem(), new JsonConfig());
             group = new MarkGroup(examId, subjectCode, number, StringUtils.trimToNull(title), list, 0d, doubleRate,
                     arbitrateThreshold, scorePolicy, markMode);
+            group.setSheetView(sheetView);
             List<Double> scores = buildDoubleList(scoreList);
             if (group.getTitle() != null && group.getPicList() != null && scores.size() > 0) {
                 // clear and replace exam_question

stmms-web/src/main/java/cn/com/qmth/stmms/mark/MarkController.java

@@ -118,14 +118,14 @@ public class MarkController extends BaseController {
     private ModelAndView getMarkModeView(Marker marker, MarkMode mode) {
         boolean forceMode = false;
         MarkMode sysMode = MarkMode.findByName(forceMarkMode);
+        MarkGroup group = groupService.findOne(marker.getExamId(), marker.getSubjectCode(),
+                marker.getGroupNumber());
         if (sysMode != null) {
             // 全局配置的强制评卷模式
             mode = sysMode;
             forceMode = true;
         } else {
             // 没有全局配置，优先从大题配置取强制评卷模式
-            MarkGroup group = groupService.findOne(marker.getExamId(), marker.getSubjectCode(),
-                    marker.getGroupNumber());
             if (group != null && group.getMarkMode() != null) {
                 mode = group.getMarkMode();
                 forceMode = true;
@@ -145,6 +145,7 @@ public class MarkController extends BaseController {
         ModelAndView view = new ModelAndView(
                 mode == MarkMode.TRACK ? "modules/mark/markTrack" : "modules/mark/markNew");
         view.addObject("forceMode", forceMode);
+        view.addObject("sheetView", group.isSheetView());
         return view;
     }
 

stmms-web/src/main/webapp/WEB-INF/views/modules/exam/groupAdd.jsp

@@ -109,6 +109,12 @@
             </div>
         </div>
         </div>
+		<div class="control-group">
+			<label class="control-label">原卷显示</label>
+			<div class="controls">
+				<input name="sheetView" type="checkbox" <c:if test="${group.sheetView}">checked</c:if>/>
+			</div>
+		</div>
         <div class="form-actions">
             <input id="btnSubmit" class="btn btn-primary" type="submit" value="保 存"/>&nbsp;
             <input id="btnCancel" class="btn" type="button" value="返 回" onclick="history.go(-1)"/>

stmms-web/src/main/webapp/WEB-INF/views/modules/exam/groupEditFull.jsp

@@ -124,6 +124,12 @@
             </div>
         </div>
         </div>
+ 		<div class="control-group">
+			<label class="control-label">原卷显示</label>
+			<div class="controls">
+				<input name="sheetView" type="checkbox" <c:if test="${group.sheetView}">checked</c:if>/>
+			</div>
+		</div>
         <div class="control-group">
             <label class="control-label">重要提示</label>
             <div class="controls">

stmms-web/src/main/webapp/WEB-INF/views/modules/exam/groupEditSimple.jsp

@@ -112,6 +112,12 @@
             </div>
         </div>
         </div>
+		<div class="control-group">
+			<label class="control-label">原卷显示</label>
+			<div class="controls">
+				<input name="sheetView" type="checkbox" <c:if test="${group.sheetView}">checked</c:if>/>
+			</div>
+		</div>
         <div class="form-actions">
             <a id="btnSubmit" href="##" class="btn btn-primary">保 存</a>&nbsp;
             <a id="btnCancel" href="##" class="btn" onclick="history.go(-1)">返 回</a>

stmms-web/src/main/webapp/WEB-INF/views/modules/mark/markNew.jsp

@@ -70,9 +70,11 @@
 						needConfirm : false,
 						//showTotalScore:true
 					},
-					//'sheet-view' : {
+					<c:if test="${sheetView==true}">
-					//	server : '${sheetServer}'
+					'sheet-view' : {
-					//},
+						server : '${sheetServer}'
+					},
+					</c:if>
 					'warning-info': {
 					},
 					'thumbnail':{

stmms-web/src/main/webapp/WEB-INF/views/modules/mark/markTrack.jsp

@@ -70,9 +70,11 @@
 					},
                     'specialTag':{
                     },
-					//'sheet-view':{
+                    <c:if test="${sheetView==true}">
-                    //    server : '${sheetServer}'
+					'sheet-view':{
-                    //},
+                        server : '${sheetServer}'
+                    },
+                    </c:if>
 					'object-view':{
 					    list: [
 					           {title:'试卷',  url:'<c:if test="${subject.hasPaper==true}">${cardServer}${subject.paperUrl}</c:if>'},

stmms-web/src/main/webapp/static/mark-new/css/style.css

@@ -1206,4 +1206,20 @@ a.button.all-zero-button {
 }
 .buttonCss{
     border-bottom: 1px solid #b50505;!important;
-}
+}
+
+.sheet, .sheet > * {
+	list-style: none;
+	outline: none;
+	-webkit-tap-highlight-color: transparent;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+.sheet .popover-cont {
+	width: 100%;
+	height: -webkit-calc(100vh - 51px);
+	height: -moz-calc(100vh - 51px);
+	height: calc(100vh - 51px);
+	padding: 15px;
+	overflow-y: scroll;
+}

stmms-web/src/main/webapp/static/mark-new/js/modules/sheet-view.js

@@ -21,22 +21,102 @@ function SheetView(option) {
 }
 
 SheetView.prototype.init = function() {
+	var self = this;
     this.markControl.initMarkFunction();
-    this.container = getDom(this.container_dom, this.markControl).appendTo(this.markControl.container.assistant).find('#sheet-list');
+    this.container = getDom(this.container_dom, this.markControl).appendTo(this.markControl.container);
+    this.container.width(this.maxWidth);
+    
+    this.container.header = getDom(this.container_header_dom, this.markControl).appendTo(this.container);
+    this.container.header.width('100%');
+
+    this.container.content = getDom(this.container_content_dom, this.markControl).appendTo(this.container);
+    this.container.content.width('100%');
+    
+    this.container.header.find('.image-close').click(function () {
+        self.toggle(false);
+    });
+    
+    this.control = getDom(this.control_dom, this.markControl).appendTo(this.markControl.container.assistant);
+    this.control.find('#show-sheet-button').click(function () {
+        self.markControl.container.assistant.hide();
+        self.toggle(true);
+    });
+    this.control.find('#hide-sheet-button').click(function () {
+        self.markControl.container.assistant.hide();
+        self.toggle(false);
+    });
+    self.toggle(false);
 }
 
 SheetView.prototype.render = function(urls) {
+	var self = this;
     if (urls != undefined && urls.length > 0) {
-        this.container.empty();
         for (var i = 0; i < urls.length; i++) {
-            this.container.append('<a href="' + (this.server + urls[i]) + '" target="_blank">' + (i + 1) + '</a>');
+        	var url = urls[i];
+        	var sheetId = "sheet"+i;
+        	var nav = $('<a href="#" data-url="'+url+'" id="'+sheetId+'"><span>'+(i+1)+'</span></a>').appendTo(this.container.header.find('.image-switch'));
         }
+        this.container.header.find('.image-switch a').click(function(){
+        	var url = this.getAttribute("data-url");
+        	var sheetId = this.getAttribute("id");
+        	self.renderContent(self.container.content, sheetId);
+        });
+        this.container.header.find('.image-switch a').first().click();
+        
+    } else {
+        this.container.hide();
+    }
+}
+
+SheetView.prototype.renderContent = function(content, sheetId) {
+	content.width(this.markControl.container.centerContent.width());
+	content.height(this.markControl.container.centerContent.height());
+	content.empty();
+	var url =  document.getElementById(sheetId).getAttribute("data-url");
+	var show  = false;
+	var i = sheetId.split("sheet")[1];
+	if(i%2==0){
+		show = true;
+	}
+	content.append($('<canvas id="sheet-canvas"></canvas>'));
+	var image = new Image();
+	image.crossOrigin = '';
+	image.src = this.server + url ;
+    image.canvas = document.getElementById('sheet-canvas');
+    image.content = content;
+    image.onload = function() {
+    	var ctx = this.canvas.getContext("2d");
+    	this.canvas.width = Math.min(this.width, this.content.width());
+    	this.canvas.height = this.canvas.width * this.height / this.width;
+    	ctx.drawImage(image, 0,0,this.width,this.height,0, 0, this.canvas.width, this.canvas.height);
+    	if(show){
+    		ctx.fillStyle = "#FFFFFF";
+    		ctx.fillRect(0, 0, this.canvas.width/2, this.canvas.height*3.7/10);
+    	}
+    	this.canvas.toDataURL("image/jpeg");
+    }
+}
+
+SheetView.prototype.toggle = function(show) {
+    if (show == true) {
+        this.show = true;
         this.container.show();
     } else {
+        this.show = false;
         this.container.hide();
     }
 }
 
-SheetView.prototype.container_dom = '<h3 class="popover-title">查看原卷</h3>\
+SheetView.prototype.control_dom = '<h3 class="popover-title">查看原卷</h3>\
 <div class="popover-content"><p id="sheet-list" class="popover-list">\
-</p></div>';
+<a href="#" id="show-sheet-button">打开</a><a href="#" id="hide-sheet-button">关闭</a>\
+</p></div>';
+
+SheetView.prototype.container_dom = '<div class="image-view-popover sheet" style=" width:100%; height:100vh;"></div>';
+
+SheetView.prototype.container_header_dom = '<div class="popover-header">\
+	<p class="title">原图切换</p>\
+	<p class="image-switch"></p>\
+	<p class="image-close"><img src="{staticServer}/mark-new/images/images-close-b.png" /></p></div>';
+
+SheetView.prototype.container_content_dom = '<div class="popover-cont"></div>';

stmms-web/src/main/webapp/static/mark-new/sheet-popover.html

@@ -0,0 +1,39 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<title>高校版阅卷系统</title>
+<link href="css/bootstrap.css" rel="stylesheet" type="text/css" />
+<link href="css/style.css" rel="stylesheet" type="text/css" />
+<style type="text/css">
+/*新增css*/
+.sheet, .sheet > * {
+	list-style: none;
+	outline: none;
+	-webkit-tap-highlight-color: transparent;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+.sheet .popover-cont {
+	width: 100%;
+	height: -webkit-calc(100vh - 51px);
+	height: -moz-calc(100vh - 51px);
+	height: calc(100vh - 51px);
+	padding: 15px;
+	overflow-y: scroll;
+}
+</style>
+</head>
+<body>
+<div class="image-view-popover sheet" style=" width:100%; height:100vh;">
+  <div class="popover-header">
+    <p class="title">原图切换</p>
+    <p class="image-switch"><a href="#">1</a><a href="#">2</a><a class="curr" href="#">3</a><a href="#">4</a></p>
+    <p class="image-close"><img src="images/images-close-b.png" /></p>
+  </div>
+  <div class="popover-cont">
+    <canvas id="canvas"></canvas>
+  </div>
+</div>
+</body>
+</html>

stmms-web/src/main/webapp/static/mark-track/js/modules/sheet-view.js

@@ -27,10 +27,10 @@ SheetView.prototype.render = function(urls) {
 			if(this.list.length > i) {
 				var item = this.list[i];
 				item.nav.show();
-				this.renderContent(item.content, url);
+				this.renderContent(item.content, url,i);
 			} else {
 				var content = $(this.container_dom).appendTo(this.markControl.container.centerContent);
-				this.renderContent(content, url);
+				this.renderContent(content, url,i);
 				this.list.push({
 				    nav: this.markControl.addNavGroup('原卷' + (i + 1), content),
 				    content: content
@@ -46,11 +46,32 @@ SheetView.prototype.render = function(urls) {
 	}
 }
 
-SheetView.prototype.renderContent = function(content, url) {
+SheetView.prototype.renderContent = function(content, url,i) {
 	content.width(this.markControl.container.centerContent.width());
 	content.height(this.markControl.container.centerContent.height());
 	content.empty();
-	content.append($('<img src="'+this.server + url +'">'));
+//	content.append($('<img src="'+this.server + url +'">'));
+	var show  = false;
+	if(i%2==0){
+		show = true;
+	}
+	content.append($('<canvas id="sheet-canvas'+i+'"></canvas>'));
+	var image = new Image();
+	image.crossOrigin = '';
+	image.src = this.server + url ;
+    image.canvas = document.getElementById('sheet-canvas'+i);
+    image.content = content;
+    image.onload = function() {
+    	var ctx = this.canvas.getContext("2d");
+    	this.canvas.width = Math.min(this.width, this.content.width());
+    	this.canvas.height = this.canvas.width * this.height / this.width;
+    	ctx.drawImage(image, 0,0,this.width,this.height,0, 0, this.canvas.width, this.canvas.height);
+    	if(show){
+    		ctx.fillStyle = "#FFFFFF";
+    		ctx.fillRect(0, 0, this.canvas.width/2, this.canvas.height*3.7/10);
+    	}
+    	this.canvas.toDataURL("image/jpeg");
+    }
 }
 
 SheetView.prototype.container_dom = '<div style="display:none; overflow: scroll"></div>';