/** * Created by Zhong on 2017/11/23. */ let basicInfoView = { orgDatas: [],//for compare datas: [],//just for view workBook: null, setting:{ header: [ {name: '属性', dataCode: 'dispName', width: 200, vAlign: 'center', hAlign: 'left'}, {name: '值', dataCode: 'value', width: 120, vAlign: 'center', hAlign: 'left'} ], options: { allowContextMenu: false, tabStripVisible: false, allowCopyPasteExcelStyle : false, allowExtendPasteRange: false, allowUserDragDrop : false, allowUserDragFill: false, scrollbarMaxAlign : true }, dateRows: [6, 18], locked: { rows: [0, 2, 19, 23, 27], cols: [0] } }, renderSheetFuc: function (sheet, fuc) { sheet.suspendPaint(); sheet.suspendEvent(); fuc(); sheet.resumePaint(); sheet.resumeEvent(); }, setOptions: function (workbook, opts) { for(let opt in opts){ workbook.options[opt] = opts[opt]; } }, setDatePicker: function (sheet, dateRows) { let me = this; this.renderSheetFuc(sheet, function () { for(let i = 0, len = dateRows.length; i < len; i++){ sheet.getCell(dateRows[i], 1).cellType(me.getDatePickerCellType()).width(100).formatter('yyyy-mm-dd'); } }); }, buildHeader: function (sheet, headers) { let me = basicInfoView; let fuc = function () { sheet.options.clipBoardOptions = GC.Spread.Sheets.ClipboardPasteOptions.values; sheet.setColumnCount(headers.length); sheet.setRowHeight(0, 40, GC.Spread.Sheets.SheetArea.colHeader); for(let i = 0, len = headers.length; i < len; i++){ sheet.setValue(0, i, headers[i].name, GC.Spread.Sheets.SheetArea.colHeader); sheet.setColumnWidth(i, headers[i].width, GC.Spread.Sheets.SheetArea.colHeader); } }; me.renderSheetFuc(sheet, fuc); }, buildSheet: function () { if(!this.workBook){ this.workBook = new GC.Spread.Sheets.Workbook($('#basicInfoSpread')[0], {sheetCount: 1}); this.setOptions(this.workBook, this.setting.options); this.buildHeader(this.workBook.getActiveSheet(), this.setting.header); this.bindEvent(this.workBook); } }, bindEvent: function (workBook) { const _events = GC.Spread.Sheets.Events; let sheet = workBook.getActiveSheet(); sheet.bind(_events.EditStarting, this.onEditStarting); sheet.bind(_events.EditEnded, this.onEditEnded); sheet.bind(_events.ClipboardPasting, this.onClipboardPasting); sheet.bind(_events.ClipboardPasted, this.onClipboardPasted); }, showData(datas){ let me = basicInfoView; let sheet = this.workBook.getActiveSheet(); let cols = this.setting.header; let fuc = function () { sheet.setRowCount(datas.length); me.initTree(sheet, true, datas); me.setDatePicker(sheet, me.setting.dateRows); sheet.setFormatter(-1, 1, '@'); for(let col = 0, cLen = cols.length; col < cLen; col++){ sheet.getRange(-1, col, -1, 1).hAlign(GC.Spread.Sheets.HorizontalAlign[cols[col]['hAlign']]); sheet.getRange(-1, col, -1, 1).vAlign(GC.Spread.Sheets.VerticalAlign[cols[col]['vAlign']]); for(let row = 0, rLen = datas.length; row < rLen; row++){ sheet.setValue(row, col, datas[row][cols[col]['dataCode']]); } } }; this.renderSheetFuc(sheet, fuc); }, onEditStarting: function (sender, args) { let me = basicInfoView; if(me.setting.locked.cols.indexOf(args.col) !== -1){ args.cancel = true; } //工程专业 if(args.col === 1 && me.setting.locked.rows.indexOf(args.row) !== -1){ args.cancel = true; } }, onEditEnded: function (sender, args) { let me = basicInfoView; let v = args.editingText ? args.editingText.toString().trim() : ''; if(args.row < me.datas.length){ //date if(me.setting.dateRows.indexOf(args.row) !== -1){ if(v.length > 0){ v = formatDate(new Date(v), 'yyyy-MM-dd') v = me.filtDate(v); if(!v){ alert('请输入正确的日期格式yyyy-mm-dd'); args.sheet.setValue(args.row, args.col, me.datas[args.row].value ? me.datas[args.row].value : ''); return; } } } me.datas[args.row].value = v; } }, onClipboardPasting: function (sender, args) { let me = basicInfoView; if(me.setting.locked.cols.indexOf(args.cellRange.col) !== -1){ args.cancel = true; } }, onClipboardPasted: function (sender, args) { let me = basicInfoView; let items = sheetCommonObj.analyzePasteData(me.setting, args); let recRows = []; for(let i = 0, len = items.length; i < len; i++){ let row = i + args.cellRange.row; if(me.setting.locked.rows.indexOf(row) !== -1){ recRows.push(row); } else if(me.setting.dateRows.indexOf(row) !== -1){ items[i].value = me.filtDate(items[i].value); if(!me.isDef(items[i].value)){ recRows.push(row); } else { me.datas[row].value = items[i].value; } } else { me.datas[row].value = items[i].value; } } if(recRows.length > 0){ me.renderSheetFuc(args.sheet, function () { for(let i = 0, len = recRows.length; i < len; i++){ let staticV = me.datas[recRows[i]].value || ''; args.sheet.setValue(recRows[i], args.cellRange.col, staticV); } }) } }, isDef: function (v) { return v !== undefined && v !== null; }, filtDate: function (v) { let re = /([0-9]{3}[1-9]|[0-9]{2}[1-9][0-9]{1}|[0-9]{1}[1-9][0-9]{2}|[1-9][0-9]{3})-(((0[13578]|1[02])-(0[1-9]|[12][0-9]|3[01]))|((0[469]|11)-(0[1-9]|[12][0-9]|30))|(02-(0[1-9]|[1][0-9]|2[0-8])))/ let reDate = re.exec(v); let rst = reDate ? reDate[0] : null; return rst; }, copyObj: function(obj){ let newObj = {}; for(let attr in obj){ newObj[attr] = obj[attr]; } return newObj; }, initDatas: function (datas) { this.datas = []; for(let i = 0, len = datas.length; i < len; i++){ this.datas.push(this.copyObj(datas[i])); } }, //数据库读到的数据转换为展示的结构 toViewDatas: function (datas) { let rst = []; for(let i = 0, len = datas.length; i < len; i++){ let items = datas[i].items || null; if(items){ rst.push(datas[i]); for(let j = 0, jLen = items.length; j < jLen; j++){ rst.push(items[j]); } } } return rst; }, //展示的结构转换为入库的结构 toSaveDatas: function (datas) { let rst = []; let index = -1; for(let i = 0, len = datas.length; i < len; i++){ let items = datas[i].items || null; if(items){ delete datas[i].collapsed; datas[i].items = []; rst.push(datas[i]); index++; } else { rst[index]['items'].push(datas[i]); } } return rst; }, toUpdate: function (orgDatas, newDatas) { if(orgDatas.length !== newDatas.length){ return true; } for(let i = 0, len = orgDatas.length; i < len; i++){ let orgObj = orgDatas[i], newObj = newDatas[i]; if(orgObj.value !== newObj.value){ return true; } } return false; }, a_updateInfo: function (datas) { let me = this; let url = '/pm/api/updateProjects', updateData = { updateType: 'update', updateData: {ID: parseInt(scUrlUtil.GetQueryString('project')), 'property.basicInformation': datas} }, postData = { user_id: userID, updateData: [updateData] }; CommonAjax.post(url, postData, function (rstData) { me.orgDatas = me.toViewDatas(datas); }); }, initTree:function (sheet, init, datas) { sheet.getRange(-1, 0, -1, 1).cellType(this.getTreeNodeCellType(datas)); for(let i =0, len = datas.length; i < len; i++){ if(datas[i].hasOwnProperty('items')){ let collapsed = false; if(init){ datas[i].collapsed=false; collapsed = true; }else { collapsed = datas[i].collapsed == undefined ? true : datas[i].collapsed; } //sheet.getRange(i+1, -1, datas[i].items.length, -1).visible(!collapsed); } } }, getTreeNodeCellType:function (data) { var ns = GC.Spread.Sheets; var rectW = 10; var rectH = 10; var margin = 3; function TreeNodeCellType() { } function drowRect(ctx,x,y,w,h) { ctx.save(); ctx.strokeStyle = "gray"; ctx.translate(0.5,0.5); ctx.beginPath(); var rectX = x+margin; var rectY = y+ Math.round(h/2)-rectH/2; ctx.moveTo(rectX, rectY); ctx.lineTo(rectX, rectY+rectH); ctx.lineTo(rectX+rectW, rectY+rectH); ctx.lineTo(rectX+rectW, rectY); ctx.lineTo(rectX, rectY); ctx.moveTo(rectX+rectW, y+Math.round(h/2)); ctx.lineTo(rectX+rectW+5, y+Math.round(h/2)); ctx.stroke(); ctx.restore(); } function drowSymbol(ctx,x,y,w,h,collapsed) { ctx.save(); ctx.strokeStyle = "#000000"; ctx.translate(0.5, 0.5); ctx.beginPath(); ctx.moveTo(x+margin+2, y+Math.round(h/2)); ctx.lineTo(x+margin+8, y+Math.round(h/2)); var rectY = y+ Math.round(h/2)-rectH/2; if(collapsed){ ctx.moveTo(x+margin+rectW/2,rectY+2); ctx.lineTo(x+margin+rectW/2,rectY+2+6); } ctx.stroke(); ctx.restore(); } function drowSubItem(ctx,x,y,w,h,offset,nextItem) { offset+=6; ctx.save(); ctx.strokeStyle = "gray"; ctx.translate(0.5, 0.5); ctx.beginPath(); ctx.moveTo(x+offset, y); ctx.lineTo(x+offset, y+Math.round(h/2)); offset+=9; ctx.lineTo(x+offset, y+Math.round(h/2)); if(nextItem&&!nextItem.hasOwnProperty('items')){ ctx.moveTo(x+offset-9, y+Math.round(h/2)); ctx.lineTo(x+offset-9, y+h); } ctx.stroke(); ctx.restore(); return offset; } TreeNodeCellType.prototype = new ns.CellTypes.Text(); TreeNodeCellType.prototype.paint = function (ctx, value, x, y, w, h, style, options) { if(value!=null){ var offset = margin+rectW+6; var recode = data[options.row]; if(recode&&recode.hasOwnProperty('items')){ drowRect(ctx,x,y,w,h); var collapsed = recode.collapsed==undefined?true:recode.collapsed;//options.sheet.getTag(options.row,options.col); drowSymbol(ctx,x,y,w,h,collapsed); }else if(recode&&!recode.hasOwnProperty('items')){ offset= drowSubItem(ctx,x,y,w,h,offset,data[options.row+1]); offset+=1; } x = x + offset; w = w - offset; GC.Spread.Sheets.CellTypes.Text.prototype.paint.apply(this, arguments); } }; // override getHitInfo to allow cell type get mouse messages TreeNodeCellType.prototype.getHitInfo = function (x, y, cellStyle, cellRect, context) { return { x: x, y: y, row: context.row, col: context.col, cellStyle: cellStyle, cellRect: cellRect, sheetArea: context.sheetArea }; } TreeNodeCellType.prototype.processMouseDown = function (hitinfo) { var recode = data[hitinfo.row]; if(recode&&recode.hasOwnProperty('items')){ var hoffset= hitinfo.cellRect.x+3; if (hitinfo.x > hoffset && hitinfo.x < hoffset + 10){ var collapsed = recode.collapsed==undefined?true:recode.collapsed; collapsed = !collapsed recode.collapsed=collapsed; //hitinfo.sheet.setTag(hitinfo.row,hitinfo.col,collapsed); hitinfo.sheet.getRange(hitinfo.row+1, -1, recode.items.length, -1).visible(!collapsed); hitinfo.sheet.invalidateLayout(); hitinfo.sheet.repaint(); } } }; return new TreeNodeCellType() }, getDatePickerCellType: function () { let ns = GC.Spread.Sheets; function DatePickerCellType() { } DatePickerCellType.prototype = new GC.Spread.Sheets.CellTypes.Base(); DatePickerCellType.prototype.createEditorElement = function (context) { //Create input presenter. return document.createElement("input"); }; DatePickerCellType.prototype.activateEditor = function (editorContext, cellStyle, cellRect, context) { //Initialize input editor. if (editorContext) { $editor = $(editorContext); //DatePickerCellType.prototype.activateEditor.apply(this, arguments); $editor.datepicker({dateFormat: 'yy-mm-dd'}); $editor.css("position", "absolute"); $editor.attr("gcUIElement", "gcEditingInput"); $(".ui-datepicker").attr("gcUIElement", "gcEditingInput"); } } DatePickerCellType.prototype.deactivateEditor = function (editorContext, context) { //Remove input editor when end editor status. if (editorContext) { var element = editorContext; $(element).datepicker("hide"); $(element).datepicker("destroy"); } // DatePickerCellType.prototype.deactivateEditor.apply(this, arguments) }; DatePickerCellType.prototype.setEditorValue = function (editor, value, context) { //Sync value from Cell value to editor value. $(editor).datepicker("setDate", value); }; DatePickerCellType.prototype.getEditorValue = function (editor, context) { //Sync value from editor value to cell value. return $(editor).datepicker("getDate"); }; DatePickerCellType.prototype.updateEditor = function (editorContext, cellStyle, cellRect, context) { if (editorContext) { $editor = $(editorContext); $editor.css("width", cellRect.width - 1); $editor.css("height", cellRect.height - 3); } }; return new DatePickerCellType(); } }; $(document).ready(function () { $('#poj-set').on('shown.bs.modal', function (e) { //init Spread basicInfoView.initDatas(basicInfoView.orgDatas); basicInfoView.buildSheet(); basicInfoView.showData(basicInfoView.datas); }); $('#poj-set').on('hidden.bs.modal', function (e) { //destroy Spread if(basicInfoView.workBook){ basicInfoView.workBook.destroy(); basicInfoView.workBook = null; } basicInfoView.datas = []; }); $('#tab_poj-settings-basicInfo').on('shown.bs.tab', function () { basicInfoView.workBook.refresh(); }); /* $('#property_ok').bind('click', function () { if(basicInfoView.toUpdate(basicInfoView.orgDatas, basicInfoView.datas)){ basicInfoView.a_updateInfo(basicInfoView.toSaveDatas(basicInfoView.datas)); } });*/ });