- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <title>${sheetName}</title>
- <link href="../css/cobalt/jquery-wijmo.css" rel="stylesheet" type="text/css" title="rocket-jqueryui" />
- <link href="../css/jquery.wijmo.wijspread.3.20141.9.css" rel="stylesheet" type="text/css" />
- <script src="../scripts/spreadjs/external/jquery-1.8.2.min.js" type="text/javascript"></script>
- <script src="../scripts/spreadjs/external/jquery-ui-1.9.1.custom.min.js" type="text/javascript"></script>
- <script type="text/javascript" src="../scripts/spreadjs/spread/jquery.wijmo.wijspread.all.3.20141.9.min.js"></script>
- <script src="../scripts/ext4.2.1/bootstrap.js"></script>
- <script src="../scripts/ext4.2.1/locale/ext-lang-zh_CN.js"></script>
- <script type="text/JavaScript">
- Ext.namespace('Ext.test_page');
- Ext.test_page.mappings = ${mappings};
- var jsonData = Ext.test_page.mappings;
- Ext.test_page.cellRangeAddrs = ${cellRangeAddrs};
- var cellRange = Ext.test_page.cellRangeAddrs;
-
- Ext.test_page.sheetName = '${sheetName}';
-
- </script>
- <script type="text/javascript">
- $(document).ready(function () {
- //创建有1张工作表的wijspread对象
- $("#ss").wijspread({ sheetCount: 1 });
-
- //判断浏览器是否为IE9以下的版本
- if ($.browser.msie && parseInt($.browser.version, 10) < 9) {
- //run for ie7/8
- var spread = $("#ss").wijspread("spread"); //获取spread对象
- spread.bind("SpreadsheetObjectLoaded", function () {
- initSpread();
- });
- } else {
- initSpread();
- }
- });
-
- function initSpread() {
- var spread = $("#ss").wijspread("spread");
-
- spread.useWijmoTheme = true;
-
- //获取当前表格
- var sheet = spread.getActiveSheet();
- sheet.setName(Ext.test_page.sheetName);
-
- //手动或自动刷新
- sheet.isPaintSuspended(true);
- loadData();
- sheet.isPaintSuspended(false);
- }
-
-
-
- //根据参数,返回对应的边框样式
- function borderConvert(param){
- return eval("$.wijmo.wijspread.LineStyle."+ param);
- }
-
-
- function loadData() {
- var spread = $("#ss").wijspread("spread");
- var sheet = spread.getActiveSheet();
-
- sheet.referenceStyle($.wijmo.wijspread.ReferenceStyle.R1C1);
-
- for(var i=0; i<jsonData.length; i++)
- {
- sheet.setValue(jsonData[i].rownum, jsonData[i].columnIndex, jsonData[i].text);
- var cell = eval(jsonData[i]);
- var cellStyle = eval(cell.cellStyle);
- var font = cellStyle.boldWeight+" "+(cellStyle.fontSize+3)+"px "+cellStyle.fontName;
- sheet.getCell(jsonData[i].rownum, jsonData[i].columnIndex).font(font);//字体
-
- sheet.setRowHeight(jsonData[i].rownum, cellStyle.rowHeight*1.4,$.wijmo.wijspread.SheetArea.viewport); //行高
- sheet.setColumnWidth(jsonData[i].columnIndex, cellStyle.columnWidth*7,$.wijmo.wijspread.SheetArea.viewport);//列宽
-
- var hAlign = eval("$.wijmo.wijspread.HorizontalAlign."+ cellStyle.hAlign);
- var vAlign = eval("$.wijmo.wijspread.VerticalAlign."+ cellStyle.vAlign);
-
- sheet.getCell(jsonData[i].rownum, jsonData[i].columnIndex).hAlign(hAlign); //水平对齐方式
- sheet.getCell(jsonData[i].rownum, jsonData[i].columnIndex).vAlign(vAlign); //垂直对齐方式
-
-
- if(cellStyle.borderTop!="none"&&cellStyle.borderBottom!="none"){
- sheet.getCell(jsonData[i].rownum, jsonData[i].columnIndex).borderTop(new $.wijmo.wijspread.LineBorder("#000000",borderConvert(cellStyle.borderTop)));
- sheet.getCell(jsonData[i].rownum, jsonData[i].columnIndex).borderBottom(new $.wijmo.wijspread.LineBorder("#000000",borderConvert(cellStyle.borderBottom)));
- sheet.getCell(jsonData[i].rownum, jsonData[i].columnIndex).borderLeft(new $.wijmo.wijspread.LineBorder("#000000",borderConvert(cellStyle.borderLeft)));
- sheet.getCell(jsonData[i].rownum, jsonData[i].columnIndex).borderRight(new $.wijmo.wijspread.LineBorder("#000000",borderConvert(cellStyle.borderRight)));
- }
- //sheet.getCell(jsonData[i].rownum, jsonData[i].columnIndex).backColor(cellStyle.bgColor);
-
- }
-
- //设置跨行跨列单元格
- for(var j=0;j<cellRange.length;j++){
- sheet.addSpan(cellRange[j].fRow ,cellRange[j].fColumn ,cellRange[j].lRow - cellRange[j].fRow + 1,cellRange[j].lColumn - cellRange[j].fColumn + 1);
- }
-
- //设置单元格内公式的样式为A1
- sheet.referenceStyle($.wijmo.wijspread.ReferenceStyle.A1);
- }
- </script>
- </head>
- <body>
- <div class="container">
- <div class="header">
- </div>
- <div class="main demo">
- <div id="ss" style="width: 100%; height: 660px; border: 1px solid gray;"></div>
- </div>
- </div>
- </body>
- </html>
复制代码 |