关于spreadjs:数字化时代纯前端表格控件或将成为协同办公的解决方案

毫无疑问,人类社会的倒退过程曾经步入到数字化时代,数字化改革成为了各行各业的关注焦点。据IDC公布的《将来企业效率白皮书》,到2022年,寰球GDP的60%以上都将是数字化,每个行业的增长都将由数字化加强的产品、经营和关系驱动。而数字经济的运行模式和商业模式,也必将给传统工业社会以来所造成的工作形式带来转变。 能够确定的是,数字经济须要一种更为高效和灵便的工作形式,而协同办公将成为很多企业的办公常态。从会议预约到洽购入库,从销售报表到考察统计……包含日常办公、资产治理以及业务管理在内的诸多场景都须要在技术的帮忙下实现数字化、智能化,这无疑须要大量的开发工作。 协同办公,EXCEL的办公“盲区”而在大数据时代,数据对于任何行业的企业而言都至关重要,数据资产也成为企业在数字化时代最重要的资产之一。然而只有你进行数据处理、数据分析、数据透视等工作,就不可避免地接触过电子表格。这其中,尤以EXCEL的市场占有率和知名度最高,是企业不可或缺的办公“助手”。 尽管EXCEL功能强大,给工业化时代的集体办公和企业办公带来了极大便当。但在挪动互联的数字化时代,它有个致命毛病:即当波及权限治理、工作流、协同办公时,就进入了EXCEL的办公盲区。 当企业对信息化要求越来越高,以EXCEL为代表的单机办公软件就越来越难以适应将来倒退,其在共享交互、工作流、协同办公、用户权限管制上更显得尤为鸡肋,这也成为困扰宽广企业和开发者的痛点难题之一。 数据需要多+开发周期长,开发人员工作量骤升除了难以实现协同办公,面对表格开发这一需要,以后大部分中小型公司的解决办法是:将业务数据贮存在数据库中,待须要数据时IT人员通过sql语句取数,而后再导出Excel表格给业务人员,而后业务人员再在Excel中解决数据。 然而在这一工作流程会呈现很多问题: 首先,数据及时性无奈保障。Excel外面的数据都保留在各个业务人员的电脑中,不论是当月汇总还是当日汇总,都存在肯定的时间差,无奈做到在线实时更新。 其次,存在重复性劳动。总部型的大企业通常上司部门较多,分支机构的很多表格款式都是一样的。但因为采纳Excel各自统计和汇总数据,于是产生了大量的重复劳动,效率低下。 此外,还有一个角色权限的问题。Excel提供了无限的安全性,它只能提供限度用户拜访和批改的权限,然而无奈对用户进行角色的治理,也不能对数据进行级别的拜访限度,企业的数据安全无奈保障。 面对这一简短的工作流程和大量的表格开发需要,如果以传统形式去开发应用程序,每一步都要通过编写代码来实现,就不得不面临着开发周期长、业务响应不及时、效率低等问题,而且前期保护也须要业余的开发人员来负责,进一步加大了开发人员的工作量。 从员工的数字化办公到企业的数字化转型,到底什么样的工具可能满足表格开发人员开发效率高+易运维的需要,帮忙使用者以直观、简洁的形式了解业务数据呢?兼具开放性和扩展性的纯前端表格控件或者提供了解决方案。 类EXCEL纯前端表格控件或将成为开发者的“刚需”和前端开发一样,在数字化时代,表格开发也面临着高频多变的需要。如何高效高质地实现这些需要是开发人员的关注焦点之一,而控件产品或者是个不错的抉择。 因为控件是对数据和办法的封装。这类工具封装了大量的根底性能,且反对复用、能够与其余对象进行交互,是一种缩小反复工作、晋升开发效率的利器,可能为我的项目开发和软件交付提供便当。这一点在SpreadJS上体现的酣畅淋漓。 SpreadJS 应用稠密数组作为存储构造,用 HTML5 Canvas 绘制交互界面,内置 32 种图表、18 种迷你图和 182 种形态,提供了丰盛的数据可视化伎俩和高效的计算引擎,并针对数据处理性能进行了优化,满足了企业各类数据计算、可视化、数据透视剖析等需要,最大化节俭了存储空间。让业务人员直观简洁地获取并了解数据成为可能。 除了在视觉端的突出表现,SpreadJS 的计算引擎还反对 450 多种 Excel 公式函数,包含自定义函数、数组函数、动静数组、异步函数、XMATCH、LET 、XLOOKUP 函数等,开发者能够自定义、跨表格援用、异步调用等多场景计算需要,实现数据聚合,让无效数据不断完善。 而针对开发者的另一大痛点“协同编辑”,纯前端表格控件同样领有良好的体现。SpreadJS 提供了单元格级别的操作颗粒度。通过开发者的二次开发,即可在前端解析 Excel 文档,让多人合作、协同编辑、数据同步、版本治理以及历史查问在线文档成为可能,极大地提高了数据的更新频率,辞别低效繁冗的单机时代。 不同企业、不同开发者习用的利用不一,要想实现高效开发和便于运维这两个“KPI”,兼容性和扩展性就是开发者必须要考量的另一大要害指标。 作为一款纯前端控件,SpreadJS 反对以原生的形式嵌入各类利用,无需借助后盾代码和第三方组件,即能够与各类后端技术框架相结合,从而实现跨平台开发。其表格编辑器还提供了“神似” Excel 的性能,内置在线填报、打印报送、实时预览和数据校验的 API;开发者可在线/离线设计报表模板、编辑、计算、剖析数据并与数据库绑定,加载并批改各种 Excel 文档,并将批改后的数据保留到数据库中。 此外,这款纯前端控件内置 了18 种条件格局、32 种图表、53 项单元格格局和 182 种形态,兼容 Excel 数据格式,可向 Web 零碎中嵌入 Excel 性能,提供高度相似 Excel 的应用体验。通过二次开发,可将 SpreadJS 嵌入企业报表 SaaS 平台,复用业务零碎原始 Excel 报表模板,可间接在浏览器中实现 Excel、CSV、JSON 等文件的导入导出、PDF导出、打印及预览操作,从而升高从本地到线上的数据迁徙工作量。 总结起来,这款基于 HTML5 的纯前端表格控件,具备“高性能、跨平台、与 Excel 高度兼容”的个性,这恰好与表格开发者们所须要的“高效开发、便于运维、多人协同”的需要高度“适配”。 ...

November 23, 2021 · 1 min · jiezi

关于spreadjs:在线办公再添新贵葡萄城表格技术助力网易灵犀-一点通

2020年,一场突发的黑天鹅事件让“在线办公”站上了风口,钉钉、企业微信、飞书等线上办公软件不断涌现,彻底颠覆了传统的企业管理模式,大幅提高了企业的办公效率。 2021年,“在线办公”的热度并未随着全面停工复产而衰减,相同,在数字化浪潮下,在线办公市场潜力微小,赛道内的老玩家们都在继续加码,而新玩家们也开始跑步入场。网易,作为老牌互联网巨头也在2020年末对在线办公赛道全力出击,其成立的灵犀事业部正在打造一款综合性即时通讯App“灵犀”,且将以冷启动的形式呈现在各大安卓利用市场中。作为一款簇新的在线办公软件,灵犀又如何突出重围?乘上“在线办公”风口,破“BATHZ”阵局呢? 为了更好的解答这个问题,咱们在葡萄城公开课上有幸邀请到了网易灵犀文档产品负责人——马曦文学生负责演讲嘉宾, 为咱们分享网易灵犀文档的产品理念、在线文档类软件的行业洞察,以及如何借助 SpreadJS 纯前端表格控件实现多人协同共享编辑。 扫码报名公开课: 网易灵犀办公 ⽹易灵犀⽂档简介灵犀⽂档是由网易出品,以企业邮箱为根底的在线办公平台,其整合了客户治理、日历、网盘、在线文档、即时通讯等性能,旨在面向企业打造实时化、智能化、一体化的全新办公体验。 ⽹易灵犀⽂档性能介绍 通用工具栏:借助SpreadJS的组件API,实现高度相似 Excel 的工具栏面板,为用户提供相熟的应用体验。分享与写作:通过定制化开发,让文档与企业通信工具相结合,实现信息高速流转,让团队沟通更及时。公式:基于SpreadJS内置的 450 多种计算公式进行二次开发,保留罕用公式,让数据分析更加不便高效,升高表格的应用门槛。表格书签:基于SpreadJS的API所开发出的翻新性能,保留用户的拜访状态,清晰治理企业级客户信息。灵犀特色性能 —— 表格书签灵犀文档在需要迭代过程中通过保护“工作上线跟踪表”,跟踪需要的状态,蕴含测试状态、以后问题、及是否已上线。然而,当累计记录过多时,有以下2个问题会十分影响用户的应用体验: 每次进入表格定位最新记录须要手动将表格滚动到底部,十分麻烦。 灵犀事业部对每周设计资源对立排期治理,每周各产品填写设计需要后设计同学排期。该需要排期表中从上至下分为交互需要、UI需要、走查需要、视觉宣传需要4个小表。当周需要较多时,进入排期表将难以定位各分组的小表: 基于上述场景和问题,灵犀提供了一个非常优雅的解决方案——表格书签。 表格书签的灵感起源 表格书签的灵感起源来自于文具柜中看到黑白标签。惯例书签是对最近浏览内容的疾速跳转,而黑白书签能够用于不同类型内容的分组和定位,应用黑白书签便能够很好的解决上述两个问题,且用户提出的对汇总数据的高优先级传播,也能够通过标签将该单元格内容前置展现。 表格书签的实现思路: 选中须要定位区域——点击书签,默认读取以后active单元格*(选中后键入默认输出的单元格)中内容作为书签名,同时反对批改书签名。标签生成后展现在右侧列表。协作者进入表格时即可疾速预览表格中重要单元格信息并实现疾速定位跳转。回到表格注释内容时书签栏会主动收起不烦扰编辑,点击悬浮“书签”入口即可再次关上书签列表。同时书签利用于表格中所有工作簿,后置工作簿中重要信息也能被疾速传播。 在线文档类软件的行业洞察对于这部分内容,马工将在公开课上跟大家分享,欢送大家扫码报名: 以上就是本期公开课的局部精彩内容,文档和表格作为日常根底工具类产品,要想实现他们的性能看起来简略,实则困难重重。即使对于马工这样的资深开发工程师,灵犀文档的研发难度和业务复杂程度也是其从业经验中首屈一指的。 最初,心愿通过本期公开课的分享,帮忙有同样需要的开发者绕过在线文档开发过程中的坑,实现更加易用、稳固的在线办公软件。

July 5, 2021 · 1 min · jiezi

关于spreadjs:Vue-3-组件开发搭建基于SpreadJS的表格编辑系统功能拓展

通过环境搭建和组件集成,咱们学会应用 Vite 和 SpreadJS ,将在线Excel的编辑性能集成在Vue 3我的项目中。 本章,我将率领大家持续扩大 Vue 3 这个我的项目原型,实现数据绑定、模板文件导入/更新/导出和数据透视表等性能,本章的实现思路与上一篇“组件集成”根本相似。 设计思路· 同时创立SpreadJS 和Designer(表格编辑器)两个组件,用切换路由的形式显示不同组件类型。 · 在编辑器组件的工具栏中减少“加载”和“更新”两个按钮。 · 点击“加载”即可加载从服务器获取的Excel文件,在编辑器中对该组件做一些批改,点击“更新”按钮,将批改后的文件传递给服务器。 · 切换路由显示 SpreadJS 组件,在该组件增加 “加载”和“更新”两个button,性能同上。 SpreadJS 组件介绍SpreadJS是一款基于 HTML5 的原生JavaScript组件,兼容 450 种以上的 Excel 公式,提供高度相似 Excel 的性能,次要用于开发 Web Excel 组件,实现多人协同编辑、高性能模板设计和数据填报等功能模块,组件架构合乎UMD标准,能够以原生的形式嵌入各类利用,并与前后端技术框架相结合。 集成 SpreadJS 组件首先在components/ SpreadSheet.vue中集成SpreadJS,代码如下图所示: <template>  <div>    <div ref="ssHost" style="height:700px;width:100%;text-align: left;"></div>  </div></template><script>import { onMounted, ref} from "vue";import "../../node_modules/@grapecity/spread-sheets/styles/gc.spread.sheets.excel2013white.css"import GC from "@grapecity/spread-sheets"export default {  name: 'SpreadSheets',  props: {  },  setup(props, {emit}) {    const ssHost = ref(null);    onMounted(() => {      var workbook = new GC.Spread.Sheets.Workbook(ssHost.value);      emit("workbookInitialized", workbook)    });    return {      ssHost    };  }}</script>具备步骤如下: ...

January 7, 2021 · 2 min · jiezi

关于spreadjs:纵观-Excel-演化史开发者如何通过表格技术提升企业生产力

咱们在之前的文章中曾提到过,很多企业的 IT 业务是从一张表格开始的。 不仅仅是数据存储,团队中的信息共享也需依赖于表格这一数据结构。文档、报告、凭证以及根底数据的汇总计算,大部分是在表格的模式中实现剖析与决策的。即使表格的利用场景曾经非常宽泛,但随着业务的倒退,用户对于表格产品的性能和零碎兼容度还是能提出更高的需要,这也迫使表格产品一直的优化迭代。 提起表格产品,其中最典型的莫过于 Excel 。明天,咱们就站在零碎用户、企业决策者和开发者的立场,通过 Excel 的演化史,察看表格产品的倒退与需要迭代、现阶段表格产品在业务中都笼罩了哪些利用场景,以及如何用“表格技术”晋升企业生产力? 一、Excel 的迭代历程,是用户需要的演化史1978 年,哈佛商学院的学生丹尼尔•布里克林(Daniel Bricklin)想编一个程序,简化财务预算批改当前繁琐的从新计算,就请他的程序员敌人罗伯特•弗兰克斯通(Robert Frankston)来帮忙。 布里克林接到这个需要后,用 BASIC 语言给过后 24K 字节内存的苹果 2 代编写了个示范程序 —— VisiCalc。这也是首次利用行列布局来实现数字的录入和计算的软件,尽管简略,但曾经具备了现在电子表格外围的行列模型。 过后人们做生意都是用笔记在账本上,效率非常低,所以 VisiCalc 一面世就取得人们的青睐。也是靠这款软件,帮忙苹果电脑 2 代关上了市场,大卖特卖。乔布斯当年承受采访时说电子表格促成了产业倒退,VisiCalc 促成了苹果的胜利。 尽管以明天的审美以及用户操作习惯来看,它的界面极其不敌对,但它解决了电子表格的有无问题,让数据表格信息化解决成为可能,甚至能够被称为生产力工具软件的鼻祖。 但 VisiCalc 毕竟过于“繁难”了。 1983 年,一款名为 Lotus 的电子表格软件横空出世,性能在 VisiCalc 的根底上减少了简略图表、数据库和一些根本公式,并且以独占模式公布在了当年的 IBM PC 以及兼容的 MS-DOS 操作系统上,借助着更好的硬件和操作系统,再加上本身交互上的改良,Lotus 逐步吞食了 VisiCalc 的市场,很快就成为世界上第一个销售超过 100 万套的软件。 市场份额变动的背地,其实是用户需要的变动。数据表格产品作为一项生产力工具,相对不会只是简略的数据出现就能够了。所以 VisiCalc 被 Lotus 取代是个必然事件,Lotus 起初被 Excel 取代也是必然事件。 Excel 的前身是一款名为 Muliplan 的软件,与 Lotus 诞生于同一个期间。但 Muliplan 的步子迈的有些大,过高的应用门槛让其在工具市场无人问津,最初自生自灭。但这也促使微软下定决心从新开发一款电子表格软件,这便是起初赫赫有名的 Excel。 ...

January 6, 2021 · 1 min · jiezi

关于spreadjs:Vue-3-组件开发搭建基于-Vite-的在线表格编辑系统组件集成

通过前文的学习,咱们曾经用 Vite 搭建出了Vue 3 的我的项目原型。明天,咱们将基于这个原型,集成 SpreadJS 电子表格组件和在线编辑器组件,使其具备 Excel公式计算、在线导入导出 Excel 文档、数据透视表和可视化剖析能力,实现在线表格编辑零碎的雏形。 设计思路· 同时创立SpreadJS 和Designer(表格编辑器)两个组件,用切换路由的形式显示不同组件类型。 · 在编辑器组件的工具栏中减少“加载”和“更新”两个按钮。 · 点击“加载”即可加载从服务器获取的Excel文件,在编辑器中对该组件做一些批改,点击“更新”按钮,将批改后的文件传递给服务器。 · 切换路由显示 SpreadJS 组件,在该组件增加 “加载”和“更新”两个button,性能同上。 SpreadJS 组件介绍SpreadJS是一款基于 HTML5 的原生JavaScript组件,兼容 450 种以上的 Excel 公式,提供高度相似 Excel 的性能,次要用于开发 Web Excel 组件,实现多人协同编辑、高性能模板设计和数据填报等功能模块,组件架构合乎UMD标准,能够以原生的形式嵌入各类利用,并与前后端技术框架相结合。 目前,SpreadJS已针对Vue 2做了组件封装,临时还未对Vue 3提供组件封装,不过咱们能够通过本人封装SpreadJS组件和表格编辑器的形式,将其集成在Vue 3我的项目中。 将 SpreadJS 与Vue 3 集成1. 装置模块 批改package.json 文件,增加咱们须要的模块,运行命令 npm install 来装置所有依赖我的项目。 "dependencies": {    "@fortawesome/fontawesome-free": "^5.14.0",    "@grapecity/spread-excelio": "^14.0.1",    "@grapecity/spread-sheets": "^14.0.1",    "@grapecity/spread-sheets-barcode": "^14.0.1",    "@grapecity/spread-sheets-charts": "^14.0.1",    "@grapecity/spread-sheets-designer": "^14.0.1",    "@grapecity/spread-sheets-designer-resources-cn": "^14.0.1",    "@grapecity/spread-sheets-designer-vue": "^14.0.1",    "@grapecity/spread-sheets-languagepackages": "^14.0.1",    "@grapecity/spread-sheets-pdf": "^14.0.1",    "@grapecity/spread-sheets-pivot-addon": "^14.0.1",    "@grapecity/spread-sheets-print": "^14.0.1",    "@grapecity/spread-sheets-resources-zh": "^14.0.1",    "@grapecity/spread-sheets-shapes": "^14.0.1",    "@grapecity/spread-sheets-vue": "^14.0.1",    "axios": "^0.21.0",    "vue": "^3.0.2",    "vue-router": "^4.0.0-rc.5"  },2. 配置路由 ...

January 6, 2021 · 4 min · jiezi

关于spreadjs:公开课分享让表格数据处理性能瞬间飙升的几点优化

讲师简介王鸿,2020 中国 .NET 开发者峰会主论坛讲师,葡萄城表格技术负责人,GcExcel项目组资深架构师。 自 2014年起,王鸿老师便始终聚焦于企业高性能表格技术畛域的钻研,为葡萄城设计了全新的表格组件架构,并率领研发团队推出了一款性能在业界当先的电子表格组件GcExcel, 积攒了大量高并发、高可用性表格组件的架构设计教训。 分享内容12月19日,王鸿老师受邀加入 2020中国 .NET开发者大会,与微软、龙芯等知名企业的技术大咖一起,为50 余万名开发者带来了一场对于《高性能表格技术优化实际》的技术讲座。 在大会上,王鸿老师从葡萄城研发电子表格组件的背景与初衷登程,具体比照了 Excel 与原生 C# 代码的读取性能差别,并总结了若干针对prototype 原型进行性能调优的伎俩,如缩小垃圾回收的影响、共享对象晋升性能、压缩数据升高内存、充分利用高速缓存等形式。 本期,葡萄城公开课将持续邀请王鸿老师负责演讲嘉宾,为错过大会的同学深刻解说葡萄城表格组件的性能调优实际,以及葡萄城表格技术的落地产物 SpreadJS 和 GcExcel,曾经收听过的同学仍能够报名加入,获取与王鸿老师在线交换的机会。 扫码上图二维码,收费报名加入 Excel读取1亿个单元格的极限性能是34秒为了测试Excel 文件的读取性能极限,王鸿老师应用了 StopWatch 函数来监听 Excel 的关上工夫,测试对象为一个蕴含30列、1,000,000行、30,000,000 个单元格数据的电子表格文件。 通过测试, Excel关上这个文件须要期待 34 秒。 葡萄城 GcExcel 读取这份文件的极限性能是12秒GrapeCity Documents for Excel (简称:GcExcel)是一款由王鸿老师参加设计,由西安葡萄城自主研发的基于 Java 和 .NET 平台的服务端高性能表格组件。 应用该组件,零碎无需依赖 Office、POI 或第三方应用软件,即可在服务端批量创立、加载、编辑、打印、导入/导出 Excel 文档,满足在线文档的前后端数据同步、服务端批量导出与打印,以及类 Excel 报表模板设计和服务端高性能数据处理的业务需要,提供一套欠缺的类 Excel 全栈解决方案。 通过测试,用葡萄城的表格组件 GcExcel 关上这样一份文件,仅需 12 秒。 为了实现与 Excel 近22秒的性能差距,葡萄城 GcExcel 都做了哪些性能优化呢?实际上,在推出自主研发的表格组件之前,葡萄城便曾经对 Excel 文档的格局、款式和存储构造进行了深刻的钻研。 ...

January 5, 2021 · 1 min · jiezi

关于spreadjs:现代JavaScriptES6-中的-ImportsExportsLetConst-和-Promise

在过来几年里,JavaScript有很多的更新。如果你想晋升写代码的能力,这些更新将会对你有十分大的帮忙。 对于程序员来说,理解这门语言的最新倒退是十分重要的。它能使你跟上最新趋势,进步代码品质,在工作中超群绝伦,从而进一步晋升你的薪资待遇。 特地地,如果你想学习像React、 Angular或Vue这样的框架,你必须把握这些最新的个性。 最近,JavaScript减少了许多有用的性能,比方Nullish coalescing operator, optional chaining, Promises, async/await, ES6 destructuring,等等。 那么当初,咱们将探讨每个JavaScript开发者都应该晓得的概念。 JavaScript 中的 Let 和 const在ES6之前,JavaScript应用var关键字来申明变量,var只有全局作用域和函数作用域,所谓全局作用域就是在代码的任何地位都能拜访var申明的变量,而函数作用域在变量申明的以后函数外部拜访变量。此时是没有块级作用域的。 随着let和const这两个关键字的增加,JS减少了块级作用域的概念。 如何在 JavaScript中应用let当咱们在用let申明变量时,用于申明一次之后就不能再以雷同的名称从新申明它。 // ES5 Codevar value = 10;console.log(value); // 10var value = "hello";console.log(value); // hellovar value = 30;console.log(value); // 30如上所示,咱们屡次应用var关键字从新申明了变量值。 在ES6之前,咱们能够应用var从新申明之前曾经申明过的变量,这就会导致了一个问题:如果咱们在不知情的状况下,在其余中央从新申明了该变量,很有可能会笼罩原先变量的值,造成一些难以调试的问题。 所以,Let解决很好地解决此问题。当你应用let从新申明变量值时,将会报错。 // ES6 Codelet value = 10;console.log(value); // 10let value = "hello"; // Uncaught SyntaxError: Identifier 'value' has already been declared然而,以下代码是非法的: // ES6 Codelet value = 10;console.log(value); // 10value = "hello";console.log(value); // hello咱们发现下面的代码看起来没什么问题,是因为咱们从新给value变量赋了一个新值,然而并没有从新申明。 ...

December 24, 2020 · 8 min · jiezi

关于spreadjs:服务端表格组件-GcExcel-V40-发布构建类Excel全栈解决方案

GrapeCity Documents for Excel(简称:GcExcel)是一款实用于 Java 平台和 .NET 平台的服务端高性能表格组件,无需依赖 Office、POI 或第三方应用软件,可在服务端批量创立、加载、编辑、打印、导入/导出 Excel 文档。 将其与纯前端表格控件 SpreadJS 联合应用,可满足表格数据的在线编辑与展现、前后端数据同步、服务端批量导出与打印,以及高性能类 Excel 报表模板设计与服务端解决等性能,为您的应用程序打造一整套类 Excel 全栈解决方案。 日前,GcExcel 正式公布V4.0版本。从该版本开始,GcExcel将反对数据透视图及跨工作簿公式援用等性能,可进一步升高企业数据分析的门槛,晋升零碎性能。 此外,本次更新GcExcel 还增强了与 SpreadJS 的性能集成,让您真正无惧前端性能瓶颈,实现前后端负载平衡。 在具体介绍 GcExcel V4.0的新个性之前,请返回官网同步下载体验:>> 服务端表格组件 GcExcel 官网 本次更新我的项目包含: 1. PDF表单生成器在OA零碎自动化的流程中,在线填报的性能和性能至关重要,最为现实的状况是:零碎在线收集用户信息,实时校验这些字段以确保信息的准确度,并且,实现上述操作不会因整个表单的填报而提早。 为了实现上述操作,GcExcel的模板性能(templete)提供了新的语法来定义HTML5输出类型,以确保在PDF、Excel等填报项中对其进行实时校验设置。 (通过模板语法设计具备定制输出的PDF填报表格) (PDF通过GcPdfViewer的预览视图,即可在线填报) 2. 增强与 SpreadJS 的性能集成SpreadJS次要用于在前端对 Excel、Grid 表格数据在线编辑和展现;GcExcel 用于在后端批量解决 Excel 文档。本次更新,GcExcel强化了与纯前端表格控件 SpreadJS 的性能反对,使两者优势互补,强强联合。 具体更新我的项目包含: l 反对单元格的内边距和标签 l 反对单元格类型Radio Button List 和checkbox list l 反对区域模板(Range Template) l 反对背景图片设置 l 反对单元格按钮设置(Cell buttons) ...

December 2, 2020 · 1 min · jiezi

关于spreadjs:表格控件SpreadNET-V140-发布支持-NET-5-和-NET-Core-31

Spread.NET 是一个性能、布局与 Excel 高度相似的 .NET表格控件,可全面满足 WinForm、ASP.NET、XAML 和 WinRT 等平台下表格数据处理、数据可视化开发需要。Spread.NET 反对 462 种 Excel 公式,提供可嵌入零碎的类Excel设计器和全面凋谢的 API,为 .NET开发人员构建企业级表格应用程序提供了更加业余的抉择。 日前,表格控件 Spread.NET 正式公布V14.0版本。从该版本开始,Spread.NET将反对 .NET 5和 .NET Core 3.1 Windows窗体平台,产品性能、扩展性和可靠性方面更上一个台阶。 此外,Spread.NET 还在 V14.0中加强了自定义单元格类型,当初能够将 .NET对象间接作为自定义单元格应用。 在具体介绍表格控件 Spread.NET V14.0的新个性之前,请同步下载体验:>> .NET表格控件 Spread.NET V14.0下载 以下为Spread.NET V14.0 的新个性介绍: 1\. 反对 .NET 5 和 .NET Core 3.1表格控件Spread.NET V14.0提供了一个用于 .NET 5 和 .NET Core 3.1 WinForms开发环境的 NuGet程序包。 应用这个新程序包,就能够在 .NET 5 和 .NET Core 3.1 中应用Spread表格控件创立WinForms应用程序,并应用GrapeCity Spread.NET控件移植现有的WinForms我的项目。 2\. 能够将 .NET 对象作为自定义单元格类型 ...

November 26, 2020 · 1 min · jiezi

关于spreadjs:纯前端表格控件SpreadJS-V140发布组件化编辑器数据透视表

SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,可为用户提供高度相似 Excel 的性能,满足 Web Excel组件开发、 表格文档协同编辑、 数据填报、 类Excel报表设计等业务场景需要,极大的升高企业的研发老本和我的项目交付危险。 产品自面市以来,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并于2020年被中国软件行业协会认定为“中国优良软件产品”。 日前,SpreadJS 正式公布V14.0版本。从该版本开始,SpreadJS推出了数据透视表性能,进一步升高企业数据分析的门槛,晋升零碎数据处理的能力。 此外,SpreadJS 还在 V14.0中公布了组件化的在线表格编辑器,提供了更易嵌入、秒级加载、灵便定制的性能。在线表格编辑器可与SpreadJS 集成,助力开发者在支流前端 JS 框架中,实现高性能的模板设计、在线编辑、填报和数据绑定等性能。 在具体介绍SpreadJS V14.0的新个性之前,请同步下载体验: 纯前端表格控件SpreadJS V14.0下载SpreadJS V14.0 新个性介绍1\. 数据透视表:完满再现Excel 弱小的数据分析能力作为一款性能布局与 Excel 高度相似的纯前端表格控件,SpreadJS岂但兼容了450 种以上的 Excel 公式、32 种图表和 18 种迷你图,还在此版本中正式推出数据透视表性能。 (SpreadJS的数据透视表) 如上图所示,SpreadJS的数据透视表已具备了 Excel 透视表的绝大部分性能,包含透视面板、透视表字段、筛选器、值字段设置、数据排序、分类汇总等。 通过50万行数据测试,SpreadJS 的数据透视表仍体现出极高的数据处理性能,所有操作在527毫秒内即可执行结束。 2\. 组件化的在线表格编辑器:更易嵌入、秒级加载、灵便定制在线表格编辑器作为 SpreadJS 的加强组件,可轻松嵌入各类前端页面,内置凋谢的 API 和类 Excel 的 UI 设计元素,助力开发者在 Angular、Vue、React 等前端 JS 框架中,实现高性能的模板设计、在线编辑/填报和数据绑定等性能,并为最终用户带来高度相似 Excel 的应用体验。 ...

November 10, 2020 · 1 min · jiezi

关于spreadjs:用友政务表格技术应用开发实践预算一体化产品核心功能搭建

“近些年,表格技术在财务和财政零碎开发中失去了越来越宽泛的利用。对于政务零碎而言,解决性能、标准化编程接口和与支流前端框架的兼容度是零碎开发者首要解决的问题,借助葡萄城提供的表格控件技术,咱们从根本上解决了零碎性能和产品易用性问题,为行政事业单位的用户提供了与 Excel 操作简直统一的估算一体化产品。” ——年洪东,北京用友政务软件股份有限公司,高级研发工程师、估算产品开发主设计师 为放慢推动古代财政制度建成,须要借助一套标准通明、规范迷信、束缚无力的估算制度来实现全面绩效治理,以更好地施展财政在国家治理中的根底和重要支柱作用。 2019年6月,财政部党组审议通过了《财政信息化三年重点工作布局》和《财政外围业务一体化系统实施计划》,在近年来财政管理现状和存在问题的根底上,明确提出建设估算治理一体化零碎的工作指标和工作,指出要制订对立的业务标准和技术标准,全面标准估算治理数据结构,推动各级财政部门估算管理模式和业务数据的对立,进而造成全国估算治理的一体化体系。 作为中国最大的公共财政和政府财务管理软件供应商,北京用友政务软件股份有限公司(以下简称用友政务)的技术专家受邀参加了该标准规范的研究和编写,并基于这套标准规范,自主研发了一款对立全国估算治理数据结构的估算治理一体化云平台。 用友政务估算一体化云平台用友政务估算一体化云平台无效推动了全面估算制度改革,晋升了财政信息化的撑持能力,翻新地提出了“集中管控、分级经营”的产品设计思维,并建成了残缺的技术中台、业务中台和数据中台。 云平台固化了财政部及省财政标准规范,确保了标准规范的贯彻执行,并以管控的形式,让中央财政在下级财政的标准规范框架下,扩大造成本级财政标准规范,使各级财政能够在受控模式下,独立地对本级的一体化零碎进行经营治理。 表格技术在云平台中的利用演示估算一体化云平台蕴含根底信息库、我的项目库、估算编审和报表查问四个外围功能模块,这些功能模块均利用了SpreadJS表格控件技术,实现了高性能的数据计算、查问和展现。 作为一款基于 HTML5 的纯前端表格控件,SpreadJS兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性。与此同时,产品还提供大量API,可用于二次封装,满足多人协同编辑、 数据填报、 类Excel报表设计等多种业务场景,帮忙用友政务疾速构建出估算一体化云平台的外围性能架构,如: 1. 根底信息录入表配置模型 该模型用于保护云平台中的人员信息,借助SpreadJS表格控件技术,用友政务实现了动静列扩大和简单多重表头设计。 2. 根底信息录入表展现 该表保留了大量根底信息数据,在不借助高性能表格技术的前提下,超过一万行就会造成零碎卡顿,用友政务通过应用葡萄城的SpreadJS表格控件,二次封装实现了零碎分页和多层表头数据绑定,无效解决了性能问题。 3. 预算编制录入表配置模型 作为估算一体化云平台中的重要功能模块,预算编制录入表通过嵌入 SpreadJS 在线表格编辑器高度还原了 Excel 的操作面板,如开始菜单、插入、公式和视图属性等。 估算一体化云平台的其余功能模块,如我的项目库申报、报表查问等,将于2020年10月14 日14:00的公开课分享中予以演示,欢送大家报名加入,独特交换。 公开课地址:https://live.vhall.com/627958872 表格技术利用的外围要点借助 SpreadJS 表格控件,格式化数据存储 1、表格SSJSON文件后端存储计划 · 关系型数据库ORACLE、达梦数据库应用CLOB字段存储 · 为了放慢读取应用REDIS数据库作为缓存 2、表格SSJSON文件前端存储计划 · 应用indexDB存储,要加上查看同步更新机制 · 第三方的封装控件应用开源的LocalForge来调用,十分不便 3、表格SSJSON对象转换 · 尽量不要应用fastJson进行json到Bean转换,如果应用尽量应用高版本 · 倡议应用JackSon进行转换,特地是对于简单类型转换根本没有问题 SpreadJS 嵌入式编辑器利用:充分利用了编辑器的类Excel操作工具栏,联合本身业务特点,简化开发流程。 SpreadJS 可视化设计器利用:缩小了大量反复编码和测试,买通了前端平台化开发的捷径。 ...

October 12, 2020 · 1 min · jiezi

关于spreadjs:企业表格技术应用开发案例大赛圆满落幕

2020年9月8日,由葡萄城携手行业用户独特发动的 “企业表格技术利用开发案例大赛”流动正式落下帷幕,通过一个月的案例征集和8位技术专家的业余评审,来自立信、畅捷通和三节课的3份参赛案例荣获最佳实际奖,来自航天信息软件、珀金埃尔默、华融科技、长江委网信核心等企业的20份参赛案例取得入围奖。 依据大赛规定,通过专家评审委员会的业余评定,企业表格技术利用开发案例大赛的获奖名单颁布如下: 表格是企业日常经营治理中的重要工具之一。基于“表格技术”研发的信息化零碎,可帮忙企业更快更精确地解决数据,大幅提高经营管理效率。 基于此,本次较量旨在面向开发者宽泛征集企业表格技术的典型利用案例,深刻展示表格技术在不同行业信息化零碎搭建中的突出劣势,以期挖掘表格技术在各畛域的最佳实际,并为企业信息化转型带来启迪。 作为本次较量的主办方,葡萄城自 1980 年成立以来,始终专一于开发技术畛域,通过数十年的打磨,推出了泛滥高性能表格类开发工具,如性能和布局与 Excel 高度相似的纯前端表格控件 SpreadJS,以及服务端高性能表格组件 GrapeCity Documents for Excel等,可完满匹配挪动办公场景中基于“表格技术”搭建的信息化零碎开发需要。 纯前端表格控件SpreadJS 本次较量中涌现的优良案例,充沛展现了其在数据填报、在线文档零碎开发、类 Excel表单设计等场景下的最佳利用实际,也为更多正在谋求转型翻新中的企业传递了表格技术的价值。 通过借鉴这些优良案例,开发者们能够迅速搭建出符合实际业务需要的信息化零碎,无效帮忙企业进步开发效率,减速上线和我的项目落地。 以下是本次大赛的局部优良案例展现: 获奖单位:立信会计师事务所(非凡一般合伙) 获奖案例:智能审计云平台(SACP) 业内首款齐全基于云的智能审计作业平台,反对在线协同近程作业,借助 SpreadJS 在线上实现了近乎与 Excel 统一的性能体验,并能够与 Excel 文件、页面字段共享互通、互相验证,平台充分利用了互联网劣势,以数据共享为纽带,将处于不同地点的项目组人员无缝连接。 评审点评: “该平台为业内首款,补救了智能审计在线作业的缺口,性能操作简洁敌对。” ——北京长亮合度信息技术有限公司 项目经理 董亚辉 点击查看案例详情获奖单位:畅捷通信息技术股份有限公司 获奖案例:财务 T-UFO 报表 财务T-UFO报表,是用友 T+Cloud 的两大功能模块之一,通过嵌入 SpreadJS 提供了类 Excel 界面,用于制订个性化报表,并反对自定义取数。借助该报表,财务人员可按部门、集体、往来单位、存货、我的项目设置辅助核算,实现“人财货客”全链条闭环。 评审点评: “产品架构清晰,功能强大,界面灵活性较高,商用价值较高,波及范畴宽泛。” ——北京长亮合度信息技术有限公司 项目经理 董亚辉 点击查看案例详情获奖单位:成都三节课教育科技有限公司 获奖案例:Teammark 常识治理库 Teammark 常识治理库,旨在收集员工在工作时的高频场景问题,包含日报周报、会议、项目管理、新人入职、指标治理、协同等。零碎基于 SpreadJS 二次开发,采纳行业优良的工作办法,以 Excel 模板作为根本的文档范例,满足了客户在线编辑 Excel 文档的刚性需要。 ...

September 10, 2020 · 1 min · jiezi

关于spreadjs:企业表格技术与风险指标补录系统

由华融科技推出的危险指标补录零碎,很好的解决了传统形式中数据收集填报的诸多痛点。零碎对立了治理模板的设计和制订,将 SpreadJS 的在线表格编辑器嵌入零碎,构建了填报模板的设计模块,容许用户在线设计填报模板,并且在模板中间接指定指标入库地位、数据校验规定和权限管控。无需开发人员染指,业务可自主设计并公布,并反对从 Excel 中导入模板,大幅简化了数据绑定、数据校验、公式计算等操作。 上面,让咱们一起来看看华融科技是如何在“危险指标补录零碎”中利用表格技术,实现 “数据填报”的。 我的项目背景企业内的报表收集和报送工作以往都是通过Excel联合邮件来实现,对于现代化企业来说,这种线下的形式存在很多须要改善的中央,如: 报表的审批流程不清晰报表内容的批改不能残缺体现给业务人员带来工作累赘数据反复收集,无奈确保对指标项进行对立治理为了精简指标的录入和收集流程,须要将报表报送的指标归类,同时实现报表的对立应用;为了缩小业务人员的工作量,须要杜绝数据的反复收集景象,实现危险部指标的对立治理、线下补录报送的平台化治理、外部治理报表的生成查看、各类惯例补录和疾速补录,以及补录需要的监控定位和跟踪。 为满足上述需要,华融科技推出了其自主研发的危险指标补录零碎。零碎对立了治理模板的设计和制订,基于 SpreadJS构建了填报模板的设计模块,容许用户在线填报表单,并在模板中间接指定指标入库的地位、数据校验规定和权限管控。 我的项目架构图 我的项目截图零碎的模板编辑模块集成了 SpreadJS在线表格编辑器,可通过编辑器上方的工具栏,在零碎中快捷、不便的设计模板。 零碎能够间接读取 Excel模板,并在其根底上进行批改: 模板设计实现好后将模板保存起来,填报人员登录零碎后便能够通过台账性能加载模板,并在线填报。这里为了管制填报人员的填报权限,没有应用在线表格编辑器,而是用了规范的SpreadJS表格控件进行加载。 填报之后应用汇总性能能够实现下发填报的汇总统计,将统计后果以报表展现,该性能反对导出成Excel文档下载: 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)通过引入SpreadJS纯前端表格控件,极大简化了惯例表单的开发流程,实现了将工作报送与公司自研工作流平台联合,满足了多场景、多流程的数据报送模式,在用户体验方面,零碎联合SpreadJS为用户提供了高度相似的Excel操作体验,相比于传统表格实现有很大晋升。 综上所述,SpreadJS 为危险指标补录零碎带来的价值,次要体现在: 可间接将SpreadJS作为模板编辑展示的入口通过SpreadJS在线表格编辑器嵌入模板,有利于模板的复用和设计类Excel形式的展现、Excel的导入导出等,极大地简化了零碎录入可联合脚本实现Excel的导入、导出流程流转过程中作为补录入口接入大幅简化数据绑定、数据校验、公式计算等操作模板内容对立存储,便于模板的保护和保留以上就是华融科技利用SpreadJS表格控件技术研发的“危险指标补录零碎”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

September 4, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例金融业数据智能分析平台

由北京海创研发的金融业数据智能剖析平台,通过嵌入 SpreadJS,实现了基于Web的数据采集、自助式报表设计与浏览、灵便查问、自主剖析和数据预测等性能,简洁、易用,无效解决了用户数据填报、查问和剖析需要,反对云部署及企业现场部署等多种形式。 上面,让咱们一起来看看北京海创是如何在“金融业数据智能剖析平台”中利用表格技术,实现“数据填报”与数据钻取剖析的。 我的项目背景现阶段,金融IT行业曾经开始推动数据治理的相干工作,尽管其IT零碎绝对健全,但因为数据量宏大、IT零碎的数量泛滥,如果单纯从管理机制和人为因素登程,不依附先进的技术手段和适合的产品撑持,则很难实现数据治理工作。 北京海创基于长期在银行和保险等行业的教训积攒,推出了一款自主研发的数据智能剖析平台(Data Intelligence Platform),该平台在企业BI门户拜访、元数据管理、KPI体系化、主数据管理、数据交换、数据处理、数据生命周期治理等方面进行了针对性的研发,既保证了数据品质,又借助灵便、弱小的剖析性能,无效晋升了数据分析系统的应用体验,能够更好地开掘和施展数据的价值。 数据智能剖析平台(DIP)的次要特点: · 基于浏览器WEB形式实现数据采集、自助式报表设计与浏览、灵便查问、自主剖析和数据预测 · 简洁、易用,无效解决了用户最初一公里的数据填报、数据查问和剖析需要 · 反对云部署及企业现场部署 数据智能剖析平台(DIP)中数据填报模块的特点和次要性能: · 嵌入 SpreadJS 后,可在线设计各类表单模板、在线填报数据、实现Excel导入导出、打印报送、实时预览、数据校验等性能 · 提供三种模板设计形式:从零开始设计模板、查问主数据设计模板和应用零碎提供的模板 · 提供模板批改后对已填报数据的灵便迁徙性能 · 数据权限设置和自定义管制性能 · 无缝连接数据分析性能 · 数据校验和审核性能 数据智能剖析平台(DIP)中数据分析模块的特点和次要性能: · 语义剖析环境,齐全自助剖析 · 基于 SpreadJS 在浏览器中实现了类Excel的利落式剖析 · 反对常见的表格、穿插表、图形、地图等形式的展示和钻取剖析 · 提供灵便的数据权限设置和管制 · 可对剖析后果二次分享 我的项目截图1、数据智能剖析平台的数据填报性能展现: 基于 SpreadJS 开发的模板设计器,在执行线上模板设计时,能够在以后模板上对须要采集的数据单元格设置映射,等审核通过后进行保留,数据会主动进入数据库中,此时,下级机构就能够实时对填报的数据进行聚合汇总统计。 基于SpreadJS灵便的单元格映射机制,以后模板产生改变时,如果用户曾经在原有旧模板上填报了数据,能够通过平台零碎的一键迁徙性能,将数据迁徙至新的填报模板中。 2、数据智能剖析平台的数据查问性能展现,以地图为例: 应用零碎的拖拽或者批量映射业务对象至单元格,而后查问出所需数据;基于查问出的数据应用地图进行展示,先要对地图进行数据源映射: 下图为地图展现数据后的成果,更改单元格中的指标数据能实时在地图上体现进去: 双击省市名称对地图进行钻取操作: 按区域进行数据过滤,其它未抉择的区域以灰色显示(也能够设置为暗藏): 区域的划分是随便的,能够依据业务剖析的须要进行灵便组合;将以后后果导出到PowerPoint中,可实现如下成果,其中展现的表格和地图都不是动态的图片: 3、数据智能剖析平台与SpreadJS集成后的地图功能包含: 内置全国31个省市/地市/区县地图,应用双击、单击钻取和切换性能,即可获取这些数据的钻取门路灵便增加和删除标注的性能(marker)地图色彩、边框色彩、告警区间均可自在设置能够对接GIS地图(如国内的高德地图、百度地图等)应用HTML5和JavaScript技术,没有其余依赖我的项目数据能够导出到PowerPoint中,地图中的省市、区县能够抉择别离转换为形态(Shape)或是整体导出为图片表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)升高了产品应用门槛:市场上绝大部分数据分析工具对数据用户,尤其是一线业务用户和财务部门用户存在肯定的应用门槛,须要培训和较长时间去学习适应,但基于SpreadJS研发的数据智能剖析平台则不会存在这个问题,SpreadJS 具备了“与 Excel 高度兼容”的产品个性,可用来开发Web Excel的组件模块,实现如 Excel 般的数据分析和交互;性能缺点和数据品质问题始终是企事业单位信息化零碎的通病,数据智能剖析平台借助SpreadJS的高性能数据引擎和API进行二次扩大,很好的解决了以上问题。该平台操作简略,用户可灵便设计和保护数据采集模板,满足从源头控制数据品质的诉求;随着企事业单位对数据价值认可度的晋升,业务人员须要数据分析系统提供更高效的计算能力,嵌入了SpreadJS的数据智能剖析平台,反对 450 多种 Excel 计算公式,可满足零碎使用者自定义公式、跨表格援用等多场景下的计算需要。以上就是北京海创利用SpreadJS表格控件技术研发的“金融业数据智能剖析平台”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 ...

September 2, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例Teammark知识管理库

由三节课研发的Teammark零碎,基于 SpreadJS 二次开发实现,采纳行业优良的工作办法,以Excel模板作为根本的文档范例,满足了客户在线编辑Excel文档的刚性需要。 上面,让咱们一起来看看三节课是如何在“Teammark零碎”中利用表格技术,实现多人实时合作与“表格文档协同编辑”的。 我的项目背景在各个企业外部,员工在工作过程中都会产生若干常识财产,很多企业并没有适合的管理工具或平台将这些常识财产汇集在一起,一旦产生员工到职/转岗的状况,这些常识财产便可能遗失,对于公司来说,这就是一种隐形的价值损失。 由三节课研发的Teammark零碎,采纳行业优良的工作办法,以Excel模板作为根本的文档范例,旨在收集员工在工作时的高频场景问题,包含日报周报、会议、项目管理、新人入职、指标治理、协同等。 我的项目架构图 我的项目截图Teammark零碎的在线文档预览界面,基于 SpreadJS 二次开发实现,上方保留有相似Excel的表格工具栏,采纳扁平化的设计模式,使界面看起来更加清新简洁。通过应用表格工具栏上的加载模板悬浮窗,能够抉择已有模板并疾速加载。 借助 SpreadJS 的基本功能,Teammark零碎实现了文档在线编辑模块,用户能够在文档中在线编辑。该模块反对多人协同编辑和邀请编辑,用户能够邀请其他人独特编辑文档内容。 在多人协同编辑时,其他人编辑的单元格会有高亮及名称提醒。 如果存在编辑抵触(同时编辑同一个单元格),会呈现正告提醒: 通过系统生成的文档能够在线预览,在线预览时,可对文档进行查问、筛选、排序等操作,不便数据的查找及定位。 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)该零碎基于 SpreadJS 二次开发实现,为客户带来了相似 Excel 的应用体验,并解决了客户在线编辑Excel文档的刚性需要。 借助 SpreadJS 的 API,零碎实现了Excel导入导出、公式计算、在线填报数据、打印报送、实时预览、数据校验、服务端数据交互等性能,为客户提供了迷信的表格文档治理形式,晋升了企业员工之间的办公效率,使员工的常识财产得以迅速积攒。 以上就是三节课利用SpreadJS表格控件技术研发的“Teammark零碎”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

September 2, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例雨诺订单管理系统雨诺OMS

由青岛雨诺研发的雨诺订单管理系统,为各医疗批发门店提供了对立、简略的操作界面,通过买通线上线下平台,在两个信息孤岛之间搭建通信桥梁,实现了订单、库存、财务信息在线上平台和线下ERP之间自在流转。 上面,让咱们一起来看看青岛雨诺是如何在“雨诺订单管理系统”中利用表格技术,实现“类 Excel 报表设计”与线下线上数据对接的。 我的项目背景在挪动互联网时代,新批发已成为医药批发畛域的新风口,O2O业务热火朝天。如何借助信息化伎俩治理好此类业务,成为了相干企业新的课题。 对于这类企业来说,其最大的痛点是如何解决线上线下零碎的信息孤岛问题,如: 线上O2O平台只负责管理线上的订单流程,如接单、派送、实现及售后等,其无奈治理线下企业的库存和财务信息。线下企业个别都是通过ERP对库存财务等进行治理,但各个平台的后盾构造不同,常常造成零碎操作艰难和昂扬的培训老本。基于这个背景,雨诺OMS零碎应运而生,该零碎为批发门店提供了对立、简略的操作界面,买通了线上线下平台,并在两个信息孤岛之间搭建通信桥梁,实现了订单、库存、财务信息在线上平台和线下ERP之间自在流转。 对线上,OMS曾经对接了全国各大电商平台30个左右,大部分以O2O为主。对线下,OMS反对医药流通领域的数家ERP供应商,可能满足大部分线下企业的治理需要,同时提供二次扩大能力,容许对接任何ERP服务商,截止以后,OMS曾经在50余家客户中胜利利用,每年为客户提供数千万的订单服务。 我的项目架构图 我的项目截图OMS为企业提供了订单、库存和财务的对接,反对各类订单状态解决、库存价格同步,以及各种财务费用计算,并出具财务对账单。 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)青岛雨诺在研发“雨诺订单管理系统”之初,曾遭逢以下问题,且始终未寻找到适合的解决方案: 用户无奈在前端灵便的排序筛选数据。用户无奈对录入的数据执行公式计算。零碎数据的解决性能难以达到要求,如在数据分页时,无奈一次性加载,用户应用起来非常不不便。零碎操作简单,用户最终体验差。为克服上述艰难,青岛雨诺的我的项目开发团队通过考查选型,最终决定应用葡萄城的SpreadJS 纯前端表格控件来搭建零碎原型,次要基于以下几点思考: 用户体验:抉择SpreadJS最次要的起因,是看重了SpreadJS高度相似 Excel 的性能和应用体验,将SpreadJS嵌入零碎后,即刻便能实现类Excel的布局和操作模式。对于财务人员来说,他们曾经习惯应用Excel来解决数据,因而,SpreadJS能让他们更快、更容易的应用零碎。高性能:通过集成SpreadJS,零碎岂但提供了简直所有的 Excel 函数反对,还满足了用户自定义公式、跨表格援用等多场景下的计算需要,轻松实现了数据聚合,让“雨诺订单管理系统”,从能用变成了好用。以上就是青岛雨诺利用SpreadJS表格控件技术研发的“雨诺订单管理系统”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

September 1, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例MHTCP数据填报采集平台

由明厚天股份研发的数据填报采集平台,提供了便于用户操作的类Excel界面模式,可为用户提供标准、正确、残缺的数据采集和填报模型,联合数据自动化抽样,可解析不同数据库、不同数据格式的数据,让数据填报流程更简略、更疾速、更顺畅。 上面,让咱们一起来看看明厚天股份是如何在“MHT-CP数据填报采集平台”中利用表格技术,实现“数据填报”与数据汇总计算的。 我的项目背景近几年,随着计算机技术的倒退和办公自动化的建设,简化用户数据采集流程,提供标准化的数据出现和数据汇总平台已成为企业信息化转型的要害。 由明厚天股份研发的数据填报采集平台,提供了便于用户操作的类Excel界面模式,可为用户提供标准、正确、残缺的数据采集和填报模型,联合数据自动化抽样,可解析不同数据库、不同数据格式的数据,让数据填报流程更简略、更疾速、更顺畅。 除了数据填报,该平台还可依照预制的报表内容进行数据可视化展现,以实现报表模板主动生成与信息多元化利用,通过将 SpreadJS 纯前端表格控件与零碎底层架构集成,不仅保留了 Excel 的数据处理能力,还满足了批量导入导出 Excel 文档、大数据量填报、填报暂存、模板下发、多级上报等多项业务需要。 我的项目架构图 我的项目截图1. 表单设计(款式、填报区域、数据绑定、角色权限等设计) 通过嵌入 SpreadJS 在线表格编辑器,用户可依据具体业务,间接在浏览器中在线填报数据,也可将 Excel 文档作为原始表单模板,导入零碎后,进行数据绑定、权限调配等自定义操作,这样不仅保留了 Excel 的数据处理能力,还可将模板数据传输至服务端进行无效的治理和存储。 2. 数据填报 借助 SpreadJS 对立数据存储模型,实现数据标准化录入,能够大幅简化数据多级上报的设计步骤与开发难度。 平台可根据业务流程和用户的理论填报需要,进行数据采集、查阅及汇总。 (调整模板对应数据源) (自定制Excel模板) (在线预览模板文件) 3. 同业务域的多表单联结填报 4. 数据单元格透视 5. 数据审核 六、表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)针对“表单设计”的利用场景,SpreadJS实现了: 纯前端解析Excel、在线导入导出 Excel、实现过程根本零代码多种数据格式校验,如自定义校验规定,更为灵便高效单元格级别的角色权限管制可通过Sql数据源信息主动生成表单,方便快捷针对“数据填报”的利用场景,SpreadJS实现了: 绑定数据模版并动静填充数据单元格级别的权限管制防止了海量数据引起的性能问题,读写性能高类Excel界面,合乎大部分用户的应用习惯数据公式主动计算,便于数据填报应用SpreadJS控件,大大节约了开发工夫、人力老本,升高了开发难度,且SpreadJS也更合乎一般非技术类人员的操作习惯(类 Excel 模式),易于被用户承受。 明厚天股份之所以抉择SpreadJS控件开发数据填报零碎,次要思考以下两方面起因: 1. 齐全兼容Excel文档,具备在线Excel 导入导出能力 无需后盾代码和第三方组件,SpreadJS 不仅提供了在线导入、导出 Excel 报表、导出 PDF 的性能,还反对多种匹配逻辑和自定义导入导出操作,如只导入数据或公式、导入固定行和不定行、将解冻行列转置为行头列头、导出自适应行高、密码保护等,可提供更加灵便、自主可控的导入导出形式。 2. 反对二次扩大,满足客户化开发 SpreadJS 兼容 Angular、React、Vue等前端开发框架,合乎 UMD 标准,可按需加载,易于在 VSCode 中应用。通过二次扩大,我司间接将 SpreadJS 作为数据填报模块嵌入到填报平台,实现了批量导入导出 Excel、大数据量填报、填报暂存、多 sheet 填报、多级上报等多项业务需要。 ...

September 1, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例表格数据管理平台

由某科技公司研发的表格数据管理平台,是一款面向业务和企业管理系统定制开发的利用平台,包含类 Excel 设计器、PC利用端和挪动利用端等利用模块。该平台具备弱小的业务配置和集成开发能力,对于企业客户的信息系统在管理模式、业务流程、表单界面等个性化需要,均可疾速实现个性化配置。 上面,让咱们一起来看看该公司是如何在“表格数据管理平台”中利用表格技术,实现“类Excel报表设计”性能,从而构建出企业个性化行业利用、集成利用和简单业务报表的。 我的项目背景随着企业数据管理流程越发简单,信息系统在管理模式、业务流程、表单界面等个性化的需要也在逐渐加深,为放慢零碎个性化配置,帮忙业务人员轻松构建出满足企业个性化的行业利用、集成利用和简单的业务报表,企业须要依附一款具备疾速定制开发、交互剖析、流程管控与繁难设计模式的利用平台。 为满足上述需要,某科技公司推出了一款表格数据管理平台。该平台基于 SpreadJS 二次开发,已广泛应用于通信、石油、电力、制造业、服务业、教育、科研等国民经济的各个领域。应用该平台,业务人员可依据企业业务及其倒退,自主构建企业所需的管理系统,包含人事工资管理、ERP、CRM、财务零碎、台账零碎、物业管理、条码零碎、仓库治理、医疗养老免费、计件薪酬治理、绩效考核治理、我的项目进度治理、企业信息生产辅助治理、教务治理、金融统计治理、报工治理等。 我的项目截图表格数据管理平台次要利用于业务和企业管理系统的定制开发,其利用模块包含类 Excel 设计器、PC利用端和挪动利用端。 借助该平台点选式的设计模式和多端利用性能,企业客户可在满足管理模式、业务流程、表单界面等多种个性化需要的前提下,疾速构建信息系统,实现个性化配置。 (表格数据管理平台) (销售报价表) (销售报价——整合第三方模态窗) (销售报价——整合第三方日历抉择面板) (销售订单明细——带数据绑定及筛选性能的Excel表单) 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)纯前端表格控件 SpreadJS 为“表格数据管理平台”所带来的价值,次要体现在: 点选式的繁难设计模式:借助 SpreadJS 的类Excel设计器,实现点选式操作,会Excel就能设计零碎,通过点选式定义数据表,只需简略设置就能够填录数据。中国式治理的业务实现:借助 SpreadJS结构化的逻辑实现办法,疾速实现场景还原,满足企业各类业务场景的需要。无论是中国式的简单业务,还是其它模式的业务变更或扩大,都能轻松应答。企业级的数据管理平台:借助 SpreadJS与 Excel 数据结构的良好兼容性,轻松实现对于企业业务的对立治理和数据源的集中管理,搭建企业级的数据管理平台,对企业数据无效管控。欠缺的多端利用:借助 SpreadJS纯前端的组件架构,实现从PC端到挪动端的无缝连接,随时随地办公。以天为单位的极短施行周期:基于 SpreadJS二次开发,实现欠缺的平台级开发性能,满足用户需要的极短开发周期,提供轻松运维的利用体验。以上就是利用SpreadJS表格控件技术研发的“表格数据管理平台”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

September 1, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例在线问卷系统

由某软件公司研发的在线问卷零碎,是一款通过收集网络信息,帮忙问卷设计者和数据分析师们剖析消费者线上行为特色和态度的零碎平台,应用该零碎可批量而准确地抽取指标网页中的任何数据及信息,疾速实现实时的信息获取。 上面,让咱们一起来看看该公司是如何在“在线问卷零碎”中利用表格技术,实现“类 Excel 报表设计”与 Excel 文件导入导出的。 我的项目背景市面上有多种用于市场调研的形式,考察问卷作为其中投入绝对较少、成果较为显著的一种,更加受到企业用户的青眼。为获得精准的数据,企业在设计考察问卷时,须要针对不同的人群爱好,设计不同的款式,如设计版面时要清新自然、设计问题时要简单明了等。 某软件公司基于 SpreadJS 开发的在线问卷零碎,提供了大量业余且具体的模版,反对在线编辑和多种可视化图表,通过网络信息收集,能够帮忙问卷设计者和数据分析师剖析消费者在线上的行为特色和态度,批量而准确地抽取指标网页中的任何数据及任何信息,疾速实现实时的信息获取。 该零碎为用户提供在线设计问卷模板的性能,能够更及时、更疾速的实现问卷调查、模板设计及问卷回收工作,即使在资金投入较少的状况下,仍能获取丰盛的信息。 我的项目截图1. 对问卷信息进行统计分析 (穿插图表剖析页面) 2. 数据筛选 从后盾返回的数据,通过SpreadJS进行展现,在浏览器中实现筛选、排序等操作,不便用户对统计后果进一步剖析。 (数据筛选) 3. 导出Excel 借助SpreadJS 能够在前端导出Excel 文件。点击导出按钮,将Excel文件无损导出至本地,导出的文件比照成果如下图所示: (导出Excel文件比照) 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)该软件公司的在线问卷零碎基于 SpreadJS 纯前端表格控件二次开发实现,反对在线模板设计、Excel 文件导入导出、公式逻辑计算、在线穿插剖析、即时数据统计和图表化出现等性能。 SpreadJS 为该我的项目带来的价值体现为: 可生成穿插图表:借助SpreadJS 的数据绑定性能,在线问卷零碎能够将收集的数据绑定至表格中,并提供数据筛选、排序、分组、批注、切片器等性能,能够不便进行数据分析及展现。导入导出 Excel 文件:借助SpreadJS 的Excel导入导出能力,在线问卷零碎无需任何后盾代码和第三方组件,便可间接在浏览器中实现 Excel的导入导出、PDF 导出、打印及预览等操作,解决了前端导出Excel文件的需要,不便用户将最终做好的问卷统计分析数据无损导出至本地。数据图表化出现:借助SpreadJS的 32 种图表类型和 182 种形态反对,在线问卷零碎实现了丰盛的数据可视化成果和实时数据分析能力,反对在线穿插剖析和多种样本形成。以上就是利用SpreadJS表格控件技术研发的“在线问卷零碎”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。 ...

August 26, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例资料填报系统

由达美盛研发的材料填报零碎,借助 SpreadJS 纯前端表格控件提供的API,实现了高度相似 Excel 的数据资料填报审批界面,用户可在线实现打印归档、组卷存储和剖析。 上面,让咱们一起来看看达美盛是如何在“材料填报零碎”中利用表格技术,实现“数据填报”、打印归档和数据存储剖析的。 我的项目背景数据填报是专为业务的数据字段录入提供的性能,业务人员将录入的数据寄存在业务库中,以便进行二次剖析。SpreadJS 提供了高度相似 Excel 的数据展现性能与大量用于数据回填入库的 API,非常适合利用于开发“材料填报零碎”,比方,零碎中的“数据资料填报审批界面”,对 SpreadJS的 API 二次扩大,便可间接通过预设的形式实现打印归档、组卷存储和剖析。 (SpreadJS 的数据填报界面) 我的项目截图1. 通过SpreadJS在线表格编辑器实现模板设计 数据模块集成了SpreadJS的在线表格编辑器,以达到在线模板设计的需要,用户可间接应用数据模块自行设计填报模板并与数据相关联,另外,通过对SpreadJS二次开发,模块还集成了电子签章、工作流相干的性能,能够满足简直所有日常业务场景。 2. 在线填报模块 借助SpreadJS与 Excel 的良好兼容性,可间接导入之前设计好的模板,并加载原始的数据在浏览器中进行展现。应用SpreadJS开发的填报模块反对在线填报和导出PDF,能够将以后浏览器中显示的表格数据在线导出成PDF并保留。 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)材料填报零碎借助 SpreadJS 实现了如下性能: 1. 导出PDF:能够将Excel表格文件在线导出成PDF,并且不须要再额定装置其余插件。 2. 数据绑定:能够间接通过 SpreadJS的数据绑定性能跟数据库或者文件中的数据进行关联,便于实时获取到相干数据。 3. 无编码模板设计器:SpreadJS 的在线表格设计器性能和操作形式十分靠近Excel,零碎的最终用户无需专业培训就能够疾速上手。SpreadJS扩展性高,能够和现有的其余业务性能进行集成。 4. 良好的Excel 兼容性:借助SpreadJS这一个性,可在 Excel 软件中设计表格文档,通过SpreadJS模板设计器,轻松导入到零碎中,大幅提高了模板的复用性。 以上就是达美盛利用SpreadJS表格控件技术研发的“材料填报零碎”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。 ...

August 25, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例物业行业全面预算管理系统

由思源软件研发的物业行业全面打算估算管理系统,借助 SpreadJS 纯前端表格控件,买通了各个企业组织外部控制系统的数据通道,构建了一套更为欠缺、更为先进的企业信息化管理模式。 上面,让咱们一起来看看思源软件是如何在“物业行业全面估算管理系统”中利用表格技术,实现“数据填报”与数据管理的。 我的项目背景全面估算治理从20世纪20年代倒退至今,曾经成为企业组织外部控制系统的外围。其在实践上是绝对完满的,但在实践中和其余管理工具一样,也存在有余与缺点。如何交融、集成先进的实践、办法、技术来翻新估算治理,是研发估算管理系统首要解决的问题。 为应答上述问题,就须要全面贯彻落实系统化、策略化、人本化的估算管理策略,而由思源软件研发的“全面估算管理系统”正是遵循了这一策略,该零碎集系统化、策略化、人本化理念为一体,通过业务、资金、信息的整合,明确且适度的受权、分权和策略驱动的业绩评估等,实现了资源合理配置、作业高度协同、策略无效贯彻、经营继续改善、价值稳步减少的指标,并借助 SpreadJS 纯前端表格控件,买通了各个企业组织外部控制系统的数据通道,构建了一套更为欠缺、更为先进的企业信息化管理模式。 我的项目截图 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)SpreadJS 反对 53 项单元格格局、450多种公式函数、18 种条件格局和32 种图表,帮忙思源软件的我的项目开发者在 Web零碎中轻松嵌入类 Excel 模块,实现如 Excel 般的数据分析和交互性能。通过对SpreadJS表格设计器的扩大开发,表单设计人员借助SpreadJS弱小的模板设计性能对单元格进行相应配置,疾速生成了填报、统计模板。SpreadJS 既能够像网格一样应用,绑定整个工作表到数据源,也能够为某一单元格设置独自的数据绑定形式,对全面估算管理系统来说,这样的形式显然更加凋谢且易于应用。以上就是思源软件应用SpreadJS表格控件技术研发的“物业行业全面估算管理系统”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

August 25, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例PtLims云平台

PtLims云平台是一款针对实验室的整套环节而设计的计算机利用零碎,用于实现实验室人、机、料、法、环的全面资源管理,并构建一套残缺的测验综合治理和产品质量监控体系,可满足实验室日常治理要求,保障化验剖析数据的严格管理和管制。 上面,让咱们一起来看看青岛帕特是如何在“PtLims云平台”中利用表格技术,实现“数据填报”、数据分析与品质监控治理的。 我的项目背景PtLims云平台是针对实验室的整套环节而设计,是实现实验室人(人员)、机(仪器)、料(样品、资料)、法(办法、品质)、环(环境、通信)全面资源管理的计算机利用零碎,是一套残缺的测验综合治理和产品质量监控体系,可满足日常治理要求,保障化验剖析数据的严格管理和管制。 测验人员应用该零碎,可全面优化实验室测验治理流程,显著进步实验室的工作效率和生产力,提高质量管制程度。 我的项目截图PtLims云平台通过嵌入SpreadJS纯前端表格控件,实现了原始记录展现和数据分析计算,零碎界面如下图: (模板制作页面) (原始记录编辑页面1) (原始记录编辑页面2) (记录后果界面) (二次开发的数据多范畴修约性能) (二次开发原始记录仪器数据抉择界面) (二次开发规范曲线编辑界面) (二次开发的主动电子签章性能) 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)1. 应用SpreadJS模板设计器进行疾速开发 通过对SpreadJS表格设计器的二次扩大开发,增加了业务所需的自定义单元格、特殊字符等性能,业务人员导入 EXCEL 表格,对单元格进行相应配置就能够疾速生成填报模板。 无编码模板设计器:SpreadJS 提供了在线表单设计器,其扩展性高,无需编码,不须要专业培训,即可疾速上手。通过 Excel 软件设计的表格文档,借助SpreadJS的模板设计器,可轻松导入 SpreadJS 开发的零碎中,进步了模板的复用性。 2. 反对二次开发和自定义函数 PtLims云平台的用户群是实验室测验检测行业,该行业的数据运算须要遵循“四舍六入,五留双”的准则,青岛帕特借助SpreadJS的自定义函数,研发出“数据修约性能”,可满足该行业数据计算的利用须要。 与此同时,青岛帕特还借助了SpreadJS的“散点图”,开发实现了“规范曲线性能和主动电子签章性能”,并在现有数据表格填充计划的根底上,二次开发出适宜PtLims云平台的数据填充计划,解决了行业数据信息化解决难题。 3. 疾速编辑原始记录、在线打印 借助SpreadJS高度兼容Excel 的产品个性,可对导入的Excel原始记录再次编辑、存储,并且通过 SpreadJS实现在线自定制打印。 4. 纯前端导入、导出 Excel 文件 SpreadJS无需借助任何后盾代码和第三方组件,可间接在浏览器中实现 Excel文件的导入导出、PDF 导出、打印及预览操作,解决了对现存大量Excel原始数据进行线上填报存储的问题。 以上就是青岛帕特利用SpreadJS表格控件技术研发的“PtLims云平台”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑 、 数据填报 、 类 Excel 报表设计 等业务场景,可极大升高企业研发老本和我的项目交付危险。 ...

August 25, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例实验室信息化管理系统

天沃研发的实验室信息化管理系统(LIMS),为基于ISO/IEC 17025运作的实验室而推出,面向实验室检测人员提供了客户治理、老本治理、报价治理、检测委托治理、设施治理、报告治理(含一键生成及加密)、应收治理、数字认证等性能。应用该零碎,可显著晋升试验检测效率、缩小人工成本、进步监测数据品质、标准检测流程,实现检测过程无纸化、系统化,检测报告电子化的成果。 上面,让咱们一起来看看天沃是如何在“实验室信息化管理系统”中利用表格技术,实现“数据填报”、数据录入与绑定的。 我的项目背景对基于ISO/IEC 17025运作的实验室,天沃推出了一款绝对业余的实验室信息化管理系统(LIMS)。该零碎实现的性能包含:客户治理、老本治理、报价治理、检测委托治理、设施治理、报告治理(含一键生成及加密)、应收治理、数字认证等。 实验室检测人员应用该零碎,可显著晋升试验检测效率、缩小人工成本、进步监测数据品质、标准检测流程,实现检测过程无纸化、系统化,检测报告电子化的成果。 我的项目截图 (原始记录采集设计页面) (数据绑定配置性能) (原始记录采集填报页面) 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)纯前端表格控件 SpreadJS为实验室信息化管理系统(LIMS)带来的价值,体现在如下几个方面: 应用SpreadJS的数据绑定性能能够实现数据主动提取,如计器编号,样品编号等,零碎能够在设计页面的时候即可绑定数据库中的对应字段,毋庸手动录入,无需重复录入监测数据,方便快捷,准确率高,大大减少了人工成本并升高了出错率。SpreadJS提供权限管制的办法,能够标准批改流程,严格控制报告批改,杜绝了工作人员私下批改数据和后果的问题。用SpreadJS设计的数据录入界面与纸质Excel高度一致,检测人员在应用零碎时无需投入过多的学习老本。以上就是天沃利用SpreadJS表格控件技术研发的“实验室信息化管理系统(LIMS)”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

August 25, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例立信智能审计云平台SACP

立信会计师事务所(非凡一般合伙)(简称“立信”)研发的智能审计云平台,是业内首款齐全基于云的智能审计作业平台,反对在线协同近程作业。 该平台借助 SpreadJS在线上实现了近乎与Excel统一的性能体验,并能够与Excel文件、页面字段共享互通、互相验证,平台充分利用了互联网劣势,以数据共享为纽带,将处于不同地点的项目组人员无缝连接。 上面,让咱们一起来看看立信是如何在“智能审计云平台”中利用表格技术,实现“数据填报”与智能审计治理的。 我的项目背景BDO寰球各地成员所均应用对立的审计形式,在齐全恪守国内审计准则的准则同时,更会应不同地区要求而提供附加指引,务求在寰球提供统一程度的服务。现在,立信的审计过程及档案记录均已实现电子化。然而,审计并非变化无穷,为了给客户提供最好的合规和咨询服务,须要继续开发和坚固BDO的审计工具。 基于对BDO审计办法、工具和指引的一直拓展,立信推出了业内首款齐全基于云的智能审计云平台,该平台次要用于对立事务所内的审计软件,实现审核人员近程复核,数据对立治理。 我的项目架构图 五、我的项目截图智能审计云平台(SACP)借助 SpreadJS在线上实现了近乎与Excel统一的性能体验,并能够与Excel文件、页面字段共享互通、互相验证,平台充分利用了互联网劣势,以数据共享为纽带,将处于不同地点的项目组人员无缝连接。 应用自定义快捷键操作,用户能够自在设计底稿款式,如下图: (在线作业界面) 点击单元格链接,可间接预览附件: 可实现不同 Excel 文档间的跳转,以及主动获取不同 Excel 单元格的值,如下图: 可集成百度地址等 API 服务: 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)智能审计云平台通过嵌入纯前端表格控件 SpreadJS,实现了如下性能: 数据校验:借助 SpreadJS 的自定义数据验证接口,SACP反对丰盛多样的主动校验形式,如平衡性校验、凭证类型校验、负借正贷校验、重复性校验、制单人、审核人校验、辅助核算校验等。主动数据测验可让审计员高深莫测数据品质,帮忙审计人员发现异常数据。数据分析:借助 SpreadJS 的公式函数接口,SACP设计了多种数据分析形式,如科目绝对数剖析、大金额凭证剖析、十分用科目剖析和行业均值剖析等,其中行业均值剖析利用公开的上市公司财务数据库以及立信自有的财务数据库建设而成。强逻辑管制:借助 SpreadJS 的Excel 导入导出和超链接接口,SACP的每一个文件和程序都互相关联,包含附件与底稿的关联,底稿与审计程序的关联,审计程序与科目认定的关联,科目认定与审计打算的关联。这种关联并非是文件夹式的归集,而是可链接、可查问、可穿透、由零碎强制管制的关联。数据核查:借助 SpreadJS 的条件格局接口,SACP实现了数据可全程不落地的在线式工作形式,即云上审计模式。当然,SACP还同时反对离线作业,并能够做在线校验。穿插索引:基于SpreadJS实现的穿插索引性能,可在不同底稿中的数字间互相验证。在SACP中,互为穿插索引的底稿可在一个页面内关上并做公式解决,这确保了不同审计人员解决不同底稿时对数字的一致性要求。单向链接:基于SpreadJS实现的单项链接性能,容许指定某个Excel单元格指向特定底稿中的某个单元格或附件。单项链接可不便的追溯数字间的关系、调整的根据,在设计或复核底稿时,反对在同一页面关上,便于应用。标签:基于SpreadJS实现的标签性能,容许审计员在任何一个底稿单元格,以及零碎中导引表、试算平衡表中做标签。标签性能真正做到了Excel中的数字与零碎中的数字通过自定义的形式建设关联。纯前端表格控件 SpreadJS为智能审计云平台带来的价值,体现在如下几个方面: 在线近程协同作业,提供了近乎与Excel统一的性能体验,使处于不同地点、不同项目组的人员能够无缝连接,扭转重复线上线下交互的工作模式。无需业务人员从新上传文件,在线即可设计电子底稿,并与文件系统疾速交互。反对审核人员近程复核、汇总问题点、在线穿透至批注处。在前端与第三方利用插件无缝对接,在线实现审计辅助类工具的应用。借助SpreadJS在线表格编辑器,业务人员能够更灵便的设计底稿模板,无需开发人员参加。以上就是立信利用SpreadJS表格控件技术研发的“智能审计云平台”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

August 25, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例货运代理客户服务平台

德迅(中国)货运代理有限公司(简称:德迅(中国))研发的货运代理客户服务平台,可无效帮忙物流公司的财务人员线上实现数据获取、模板治理、对账、提交等财务结算工作。通过嵌入 SpreadJS,该平台还提供了高度相似 Excel 的界面布局和性能个性,无效升高了人员应用门槛,并可无缝对接已有模板资源。 上面,让咱们一起来看看德迅(中国)是如何在“货运代理客户服务平台”中利用表格技术,实现“类 Excel报表设计”性能与业务数据采集、剖析和计算的。 我的项目背景过来,物流公司的财务人员在面对数据获取、模板治理、对账、提交等财务结算的工作时,常常通过手工制作模板,从各个系统中复制数据,再填充到对应客户公司的模板里。这样的操作过程,对财务人员来说,即消耗了大量工夫和精力,又会在切换零碎、对齐数据、来回邮寄时,造成误操作和人为疏漏。 如果能将上述操作迁徙至线上,则能够显著晋升工作效率,无效防止人工误操作等行为。然而,实现这一步并不容易,首先必须要解决以下问题: 1、 性能方面,须要满足Excel的相干性能,可能实现现有的业务需要; 2、 交互方面,要思考应用人员的学习老本,确保在现有业务失常运行的根底上,不能给客户公司的使用者带来应用艰难; 3、 兼容性方面,要可能保障与现有Excel模板的兼容,可能利用已有的模板资源,疾速整合到新的零碎中。 德迅(中国)在充分考虑上述问题后,推出了其自主研发的货运代理客户服务平台,可无效帮忙物流公司的财务人员线上实现数据获取、模板治理、对账、提交等财务结算工作。通过嵌入 SpreadJS,该平台还提供了高度相似 Excel 的界面布局和性能个性,无效升高了人员应用门槛,并可无缝对接已有模板资源。 我的项目截图 表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)通过技术选型,德迅(中国)统一认为,SpreadJS纯前端表格控件是以后最合适“货运代理客户服务平台”我的项目开发的选项。 借助SpreadJS ,该平台实现了以下几点价值的晋升: 实用于Web端的模板疾速生成 —— 后盾可能间接上传已有的Excel对账模板,将字段映射到对应的列,在设置好表头行列范畴,并通过预处理后,零碎会去掉多余的sheet和多余的行列,并将后果保留失去原始模板中。财务对账平滑过渡到线上 —— 将生成的模板在前台渲染进去,间接用于对账。通过调用 SpreadJS实现类 Excel的排版布局和计算,最大水平的保留了线下对账的操作习惯,升高客户公司的学习老本。缩短收款周期 —— 以前,制作模板、与各个系统对接、发送邮件都须要手动执行。应用了该平台后,模板生成和调整、数模拆散、模板及数据的散发全副实现线上化、实时化,缩小了不必要的工作环节,进步了业务数据流转速度,极大地缩短了收款的周期。以上就是德迅(中国)利用SpreadJS表格控件技术研发的“货运代理客户服务平台”案例展现,如需查看 SpreadJS 的更多利用案例或须要理解 SpreadJS 的更多功能个性,欢送拜访SpreadJS 产品官网。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

August 25, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例质量制造执行系统-QMES

品质制造执行系统 QMES,扭转了传统制作过程中,针对产品检验品质治理环节粗放式的管制形式,实现了生产全过程品质精细化治理,从很大水平上影响了现场品质管制和品质继续改良。 上面,让咱们一起来看看中天极科技是如何在“品质制造执行系统 QMES”中,利用表格技术实现“数据填报”与表单模板定制化开发的。 我的项目背景在传统制作过程中,品质治理大都采纳了关键环节产品检验及不合格品解决的粗放式品质管制形式,不能实现生产全过程品质精细化治理,这在很大水平上影响了现场品质管制和品质继续改良。 中天极科技研发的品质制造执行系统 QMES通过引入航天产品数据包治理理念和办法,基于产品构造和工艺流程,以品质跟踪卡为主线,对加工、拆卸、测验和试验全过程进行策动、疏导和管制,并实现了生产数据的精确采集、零碎整合、灵便打包、智能剖析和关联追溯,为生产过程品质精细化治理、品质追溯和品质改良提供了无力伎俩。 该零碎的次要性能包含品质跟踪卡管理、测验治理、品质问题解决、分批合批治理、实物配套治理、合格证治理、品质追溯、品质统计分析等。 我的项目截图 (模板标准保护) (表格数据录入) (自定义单元格状态) (在线填报数据) (数据模板展现) (数据包模板编制) 表格技术带来的价值SpreadJS纯前端表格控件内置了大量API接口,可针对不同的需要,调用不同的js办法或事件,使得开发人员在解决业务逻辑操作时,不必编写过多的代码,即可实现简单的需要,即节约了开发成本,又显著晋升了开发人员的工作效率,如: SpreadJS用于表单设计时,可针对用户不同企业、不同部门、不同表单款式,自定义配置出满足理论需要的类 Excel 表单模板。SpreadJS可针对不同的应用场景,对单元格设置不同的属性。SpreadJS即提供了根本单元格类型,也提供了自定义单元格类型,可用来满足更为简单的业务须要。SpreadJS的性能和应用模式与Excel高度相似,如:复制、粘贴、拖拽等操作形式、导出 Excel 文件、在线打印等。SpreadJS反对多种计算公式,应用场景十分宽泛。以上就是中天极科技利用SpreadJS表格控件技术研发的“品质制造执行系统 QMES”案例展现。 对于 SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、 表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

August 18, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例铭天预算执行系统

为某省水利厅研发的“铭天估算执行零碎”,旨在建设对立集成的网上报销流程,实现局域网多点报销审核与估算管制,以此进步财务审核报销与估算管制的效率。 上面,让咱们一起来看看是如何在“铭天估算执行零碎”中,利用表格技术实现“数据填报”、凭证模版在线导出与打印的。 我的项目背景该零碎将打算预算编制、领取核销环节均纳入管制,履行按费用规范、按费用比率外部管制流程及报销单据的可自定义及配置,次要用于解决估算治理中存在的问题: 估算执行是单位财务管理的一个重要内容。随着单位人员数量减少,单位的费用审批估算工作也变得越来越简单。晚期的估算审批都是应用人工形式解决纸质资料,不仅破费了财务人员大量的工夫且不易保留,还往往因集体因素缮写不慎或计算忽略,导致估算审批谬误的景象时有发生。以微型计算机为解决外围,以数据库管理系统为开发环境的估算执行零碎在办公自动化以及商业信息管理等方面的利用,日益受到人们的关注。目前大部分单位都是将表格文件打印或通过 E-Mail 发给各级审核和员工确认,在没有收到反馈问题时才会审批发放。然而,市面上却没有独自针对估算费用审批而设计的解决方案,具体的估算审批仍然通过人工形式采集、录入和治理,这样会大量耗费人力资源,减少人力老本和估算审批的复杂程度。为解决上述问题,该零碎以财政批复的估算金额为主线、领取核销环节均纳入管制,履行按费用规范、按费用比率外部管制流程。零碎中的估算数据来源于预算编制零碎,由其动静估算执行后果并回写供估算剖析应用。同时,零碎还保留了费用台帐,可供业务部门查看残余可用估算。 该零碎通过与财务零碎共享数据,将费用管制过程的业务单据转化为财务零碎预制会计凭证,导入财务核算零碎中,缩小了大量反复工作,零碎所波及的“费用、资金、领取、 估算”等因素,均对经费履行实时的对立精细化、在线化、科学化管理控制。 估算执行零碎的特色性能: 1、反对估算会计与财务布局下的重分类 网上报销管制模块确定了费用报销与费用归属的组织概念,使用估算会计科目与核算会计科目,反对并满足了在财务布局治理环境下的治理会计与估算会计的平行核算重分类。 2、与不同预算编制模式互相连接的估算管制计划 与财政部门“估算管理软件”数据对接,区别年度预算、追加预算、月度资金打算及其混合模式下的费用管制根底,最终造成不同的管制计划。 3、反对核算会计科目管制与费用规范控制技术 在费用收入与报销环节,制订的费用规范是外部管制的重要因素。费用规范不是用来考核业务总量的合理性,但对报销规范、单次费用或人天费用规范同样起到管制作用。在估算管制中,针对不同费用估算科目,能够定义管制规范,并在单据报销审核环节,给予控制性提醒。 4、管制流程、单据可配置化 流程可配置:依据单位财务收入的对象与审批权限规定,借助该零碎,可灵便设置不同的业务收入类型,造成不同的收入单据,再依据组织权限流程设置合乎受权制度的电子审批流程。 单据可配置:依照单位治理偏好与理论状况须要,配置出体贴用户习惯的业务单据。再依据外部管制规定的受权制度,确定各级管理人员的权限与资金额度,配置出不同的审批流程。 5、反对网上报销的电子凭证化 在填制业务单据时,容许上载多个附件,如合同、批文、发票等,实现电子化的财务审批及原始票据电子化存档。 6、数据共享缩小反复工作量 零碎的估算数据来源于预算编制零碎,动静估算执行后果将定期回写估算零碎以供估算剖析应用,同时估算控制系统将保留费用台帐,供业务部门查看残余可用估算;通过与财务零碎共享主数据造成对应,将费用管制过程的业务单据转化为财务零碎预制会计凭证,导入财务核算零碎,缩小反复工作量。 四、我的项目架构图 五、我的项目截图 (在线编辑用户要打印的凭证模版) (绑定客户填报数据) (打印客户纸质凭证) 六、表格技术带来的价值零碎通过嵌入 SpreadJS 纯前端表格控件,实现了相似Excel的数据填报与展现性能,客户可依据须要自行绘制打印凭证、自行批改各类参数。 SpreadJS 为该零碎带来的价值,次要体现为: 1、建设对立的制度及指标。 零碎借助SpreadJS,轻松实现了类Excel的功能模块,把各项财务“制度标准”要求及“指标管制”内嵌入零碎,将财务收入的政策因素、指标因素和规范因素在填报模板中反映,让财务收入“怎么报”、“报哪些”、“报多少”高深莫测, 切实解决了传统收入报销过程中财务人员解释难、经办人员了解难、 收入估算管制难的“三难”问题。 2、欠缺自动化审批、计算流程,防备隐患于未然。 传统的核销形式中人为主观性较强、弹性较大,容易造成工作纰漏和过错,导致执行制度不到位、审核把关不严格等问题,进而引发财务管理危险和隐患。为此,该零碎在SpreadJS 原生API的根底上二次开发,实现了“三重防护”,欠缺了自动化审批和计算流程,如借助 SpreadJS 的单元格个性为填报模板设置了标准化参数,对于超过规范的申请,零碎将无奈进入审批环节,从源头上杜绝了超标收入的危险;借助 SpreadJS 将审批流程迁徙至线上,从源头上抑止了人工填报、审核不严、发票真假难辨、多报错报等问题的呈现;借助 SpreadJS实现了标准化管制流程, 根本杜绝了“先开销、后审批”或“无估算、有开销”等程序倒置的违规景象,从根本上标准财务审批流程。 3、收入过程网上留痕、审批过程全副可溯。 借助 SpreadJS产品的前端个性,零碎的在线审批模块实现了痕迹化治理,使每一步操作、每一笔收入都保留印记,确保过程可追溯、 可还原、可追责。经办人通过零碎提交报销申请、报销事项,零碎初审通过后会将信息推送到审核人名下,通过即时工作揭示,审核人会发现自己名下的待办工作工作, 以便于能及时处理,省时省力高效可行。在财务收入流程,审批通过能够间接推送到下一审批环节,审批未通过就间接回退到上一环节,审批意见和审批过程清晰,责任范畴划分明确,整个过程可回溯,让经办人看得明确、审批人审得释怀。 4、多级权限管控。 借助SpreadJS实现的权限管控,保障所有人都能依据财务管理要求通过线上进行申请、审批等权限操作。此外,零碎围绕财务审批流程,将估算治理、公务接待、会议治理、培训治理、差旅费治理、设施购买等所有收入我的项目囊括其中,实现所有收入审批畛域不漏项、无死角。通过人员、业务双重笼罩,保障所有人员进行的任何收入申请、审批、治理事项都可能在零碎中出现。 5、收入状态网上查问。 借助 SpreadJS 高效的计算引擎,零碎具备了弱小的信息整合和数据归集能力,通过对收入审批事项全过程数据信息的记录、筛选和剖析,保障了财务收入“三个可查”: 审批流程可查收入估算可查统计数据可查以上就是武汉铭天利用SpreadJS表格控件技术研发的“铭天估算执行零碎”案例展现。 由葡萄城携手局部行业用户独特发动的“企业表格技术利用开发案例大赛”正在炽热进行中,欢送提交您的利用案例,赢取华为平板电脑(https://www.grapecity.com.cn/events/spjs-cases-competition/)。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、 表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。 ...

August 18, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例生产采购管理软件

由甘棠软件系统(上海)有限公司(简称:甘棠软件)研发的生产洽购管理软件,是一款广泛应用于制造业业务模块化、全价值链老本管制和个性化定制的管理系统,可满足供应商在线报价、各配置产品间的老本差别比照、整机查看基准书及查看记录在线生成等多种业务需要。 上面,让咱们一起来看看甘棠软件是如何在“生产洽购管理软件”我的项目中,利用表格技术实现“类 Excel报表设计”性能与业务数据采集、剖析和计算的。 一、案例名称:生产洽购管理软件二、企业介绍甘棠软件由原IBM的几位资深业务参谋、软件架构师和制造业经理独特创建,并于2012年3月31日正式注册。“甘棠”二字取意《诗经.召南》的典故,即召伯在甘棠树下勤于理政,辅助周公治理天下。 甘棠软件的外围团队在制造业的业务征询、大型自开发软件系统的软件架构设计与开发施行等方面具备丰盛的我的项目教训,以业务征询、自主知识产权的企业级应用软件、我的项目定制开发与施行、运维服务等外围能力,致力于晋升制造业客户的BOM与老本管理水平。 三、我的项目背景制造业的降级已在寰球范畴内成为一个继续的热点。其本质是制造业与信息技术的深度交融。 一方面,制造业的业务因为模块化、全价值链的老本管制、个性化定制等新治理办法的采纳变得更为简单;另一方面,SOA服务架构、大数据、物联网、云计算等信息技术的倒退突飞猛进。如何将两者深度联合,并落实到治理细节,将是制造业治理能力晋升的要害。 制造业客户须要站在企业级的高度,通过无效的零碎思考来解决企业所面临的简单业务管理问题。但大多数制造业客户广泛不足具备企业级整体视角的人才、系统化的思考形式,以及解决简单业务管理问题的方法论。 为此,甘棠软件推出了一款自主研发的生产洽购管理软件,可广泛应用于制造业业务模块化、全价值链老本管制和个性化定制等场景,并满足供应商在线报价、各配置产品间的老本差别比照、整机查看基准书及查看记录在线生成等多种业务需要。该零碎将制造业客户的业务与信息技术深度交融,即晋升了企业的经营效率,又升高了企业的治理老本。 四、我的项目架构图 五、我的项目截图我的项目利用场景一:供应商在线报价 生产洽购环节,针对某个整机寻找指标供应商时,需邀请多家供应商针对该整机规格进行报价,报价内容须要细化到该整机的原材料老本、加工成本、制作费率、运输成本、包装老本、工装老本等8大子项,每个子项独立成表, 最终计算汇总价格信息。 该场景应用传统形式开发与SpreadJS形式的工作量比照: 我的项目利用场景二:不同配置产品间的老本差别比照 零部件的洽购价格确定后,企业需依据不同产品的老本进行差异化比照,该比照信息需零碎提供Web页面的展现形式,也须要提供Excel文件在线导出的性能。 该场景应用传统形式开发与SpreadJS形式的工作量比照: 我的项目利用场景三:整机查看基准书及查看记录 在整机的样件生产阶段,企业与供应商会提前约定好查看基准书,后续会依照基准书实现查看并记录断定是否合格。 该场景应用传统形式形式与SpreadJS的开发工作量比照: 我的项目其余利用场景: 1. 繁难报表设计:应用SpreadJS作为报表模版,简化UI渲染端的技术实现。 2. 简化业务信息收集:将SpreadJS的SSJSON当作一个数据存储构造,以此简化数据库和后端开发工作。 3. 借助 SpreadJS 的计算引擎,实现金额计算和基于Excel的公式依赖治理。 六、表格技术带来的价值(抉择表格控件 SpreadJS 的次要起因)针对“供应商在线报价”的利用场景,SpreadJS实现了: 表格行管制数据校验权限管制主动生成Excel下载文件,主动解析Excel上传文件衍生的纯前端Excel解析工具(无需编写Java POI代码)针对“产品成本差别比照”的利用场景,SpreadJS实现了: 扫描剖析Web UI组件,动静结构表单模版绑定数据模版并动静填充数据反对树型构造防止了海量数据引起的性能问题针对“查看基准书及查看记录”利用场景,SpreadJS实现了: 动静生成查看书的列和输出单元为不同角色设置可编辑单元格管制权限输出查看单元格与断定后果的联动计算在生产洽购管理软件的搭建中, SpreadJS带来的价值有: 间接通过Excel来定义单元格的名称域,在前端实现了Excel文件解析无需编写读取、解析文件的业务代码纯前端解决数据,缩小了文件传输以及后端解决压力减速我的项目开发,缩小业务代码编写的工作量实现更高性能的前端数据展现成果,让 Excel的可视化设计变为可能 (SpreadJS 在前端解决数据模板的示意图) 以上就是甘棠软件应用SpreadJS表格控件技术研发的“生产洽购管理软件”零碎案例展现。 本次,由葡萄城携手局部行业用户独特发动的“企业表格技术利用开发案例大赛”正在炽热进行中,欢送提交您的利用案例,报名参赛(https://www.grapecity.com.cn/events/spjs-cases-competition/)。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、 表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。 ...

August 11, 2020 · 1 min · jiezi

关于spreadjs:硬核干货葡萄城-SpreadJS-前端表格技术分享

转载请注明出处:葡萄城官网,葡萄城为开发者提供业余的开发工具、解决方案和服务,赋能开发者。 表格作为数据出现的一种根本形式,在各类软件系统都施展着重要的作用。在挪动互联时代,即使再简单的数据通过“表格”的整顿,都能够清晰的出现给用户,并反对用户从多个维度查看、筛选和批改。不论是应答文档、报告、凭证,还是票据,表格都可能附加存储更多的款式信息,尤其对离散式数据存储更加高效。 现在,企业开始纷纷尝试信息化转型,前端、后端、中台、云,这些概念也逐步变得妇孺皆知,在简直所有的B端产品中,表格都作为一种交互式组件受到宽泛欢送。 不过即便如此,表格也常常因为款式简单、操作繁琐等因素,在用户应用时造成诸多体验问题,尤其在Web我的项目中,表格技术时常受限于前端性能制约。 那么,有没有一种方法,能够帮忙开发者冲破前端表格技术的窘境,实现关键技术落地呢? 2020年6月30日,作为寰球当先的软件开发技术提供商,葡萄城举办了“赋能·智变”线上品牌战略发布会。本次会议上,葡萄城正式公布“赋能开发者”业务使命,并就前端表格开发等技术话题进行了分享。 前端表格为开发者带来的困扰 在C/S架构的应用程序中,表格类组件能够获取更多资源反对,内存管制也更加间接。然而当企业进行B/S转型时,前端表格却面临着诸多挑战。 例如,多浏览器差别、浏览器沙箱机制、内存拜访受限、客户端性能低下等。在驳杂且品质参差不齐的前端开发环境中,这些问题都会使咱们在开发利用时,耗费大量的工夫和反复编码,而无奈专一于外围业务。岂但耗时、耗力,加剧软件开发老本,更可能因为外部环境的变更,使零碎的稳定性受到冲击,使前期保护老本飙升。 总结来说,开发前端表格次要有三个技术难点:性能、内存耗费和可靠性。 为了应答这些技术难点,葡萄城联合了多年来的表格开发技术教训,推出了一款可晋升零碎性能、可靠性,升高内存耗费的纯前端表格控件 —— SpreadJS。 葡萄城 SpreadJS 的表格控件技术  针对前端表格开发的三大技术难点:性能、内存耗费和可靠性,SpreadJS别离提出了应答措施: 基于双缓存画布绘制引擎,SpreadJS实现了极高的解决性能基于行模式的稀松矩阵存储策略,SpreadJS可大幅节俭内存耗费基于计算引擎技术,SpreadJS可实现稳固牢靠的利用零碎1.    基于双缓存画布绘制引擎,实现性能晋升  在企业的利用中,数据是惟一的骨干,而作为数据载体的表格,常常被“吐槽”卡顿,UI界面“假死”,界面操作不晦涩等。 引起这些问题的症结在于浏览器渲染引擎的根底原理:当界面元素越多,浏览器的渲染工夫会显著增长,内存耗费会越大。 举例来说,古代应用程序为了谋求更好的用户体验,须要对UI界面重复优化,而频繁的批改界面UI元素,将引发屡次浏览器重绘。在这个过程中,UI元素的创立及批改,会激活外部垃圾回收机制,影响数据处理效率。 除此之外,前端开发环境的多样化、各类高DPI设施、手机、平板、4K显示屏、企业大屏等,这些无不减轻了企业应用零碎的解决累赘。 对于常常用于展现大数据量的表格来说,性能至关重要。也就是说,任何基于表格开发的利用零碎,必须满足以最低的资源耗费,实现高速渲染和刷新。 为此,SpreadJS 纯前端表格控件引入了Canvas绘制模型和双缓存画布技术,具体实现形式如下。 Canvas 绘制模型 因为传统的表格组件应用DOM的形式展现表格数据,无论在table,还是div中,简单的UI都须要大量的DOM渲染。因而,在执行更新、滚动等操作时,须要不停的销毁、创立DOM,这无形中减少了大量有效计算。 为了解决这个问题,前端框架React和Vue3均采纳了虚构DOM的形式,而SpreadJS则采纳了一种更为先进的形式——HTML5 Canvas绘制。 应用Canvas绘制,SpreadJS不仅无需反复创立和销毁DOM元素,在画布的绘制过程中,更是突破了DOM元素渲染对UI的诸多限度。SpreadJS能够绘制品种更为丰盛的UI元素,如线形、非凡图形等,通过画法逻辑,还能够实现更加精准的UI界面渲染,解决了浏览器差别造成的款式误差。 但如果只应用一个画布进行渲染,那么每次绘制时,不论是主体图层还是装璜图层,都须要通过画法逻辑将所有元素进行绘制,这显然是低效的。 双缓存画布技术 为此,SpreadJS又引入了双缓存画布的机制,将不易扭转的主体图层绘制在缓存画布中,在产生渲染行为时,只须要将缓存画布中的主体图层间接通过图像克隆的形式绘制在主画布上,并附加绘制装璜图层元素,便可大大优化整个绘制性能。 SpreadJS双缓存画布的技术特点: 相似油画的分层绘制SpreadJS的绘制引擎基于油画的绘制原理,分为主体图层和装璜图层,主体图层渲染长久的、不易扭转的元素,例如背景,单元格,表格线等。装璜图层则渲染常变性元素,如抉择框、拖拽框、悬浮成果等。 应用缓存画布当产生动静绘制,如表格滚动时,SpreadJS会将主画布清空,从缓存画布中依据行为上下文进行画布偏移,将偏移后的图层间接绘制在主画布上,再在主画布上绘制残余局部,使整个表格的滚动过程更加晦涩。 2.    基于行模式的稀松矩阵存储策略,大幅节俭内存耗费  尽管没有明文规定,但在业界的独特认知里,浏览器会对繁多线程进行内存限度,例如64位的chrome,每个tab页的内存耗费不容许超过4G,在手持设施上,这个限度则更为显著,例如iPhone 6s为1G,而iPhone 7为2G。 这个限度,在单页面利用不成熟的十几年前,不会成为问题。因为,那时大家所关注的,还是如何晋升后端的解决性能,前端只是一种动态的网页表达方式。 随着前端工程化的高速倒退,各种前端工程脚手架日渐成熟,WebComponent规范被提上日程,企业开始由C/S向B/S利用转型。这就要求前端开发者,须要面对单线程解决简单业务数据的挑战。这里的简单,不仅仅是数据量大,更是数据状态的解决。如何高效的解决数据的前后端交互,如何疾速响应数据变更及数据回滚呢? 为此,SpreadJS又提出了一个卓有成效的解决方案——稀松矩阵。   对于表格,惯例的存储形式是数组,如二维数组或对象数组。在类Excel的电子表格中,单元格内容是零散的,也就是说在Sheet中会呈现大量空单元格,而这些空单元格,同样会占用内存空间。 对于电子表格这种涣散的文档构造,SpreadJS采纳了稠密矩阵存储模型(Sparse Array)来保留数据。 相较于传统的链式存储或数组存储,稠密矩阵存储构建了基于行索引的数据字典,在涣散布局的表格数据中,稠密矩阵只会对非空数据进行存储,而不须要对空数据开拓额定的内存空间。 这种非凡的存储策略,不仅节俭了内存耗费,也使得数据片段化变得更加容易。利用SpreadJS,能够随时框取整个数据层中的一片数据,进行序列化或反序列化。 借助这个个性,开发者甚至能够随时替换或复原整个存储构造中的任何一个级别的节点,实现高效的数据回滚和数据恢复。 3.    撑持简单逻辑运算的计算引擎,实现稳固牢靠的利用零碎 公式,是类Excel电子表格中的重要性能,其宽泛的利用于迷信、财务、金融、制作等畛域。SpreadJS反对450多种公式函数,同时还提供自定义公式和异步公式函数。 外表看似简略的Excel公式,却具备高阶编程语言的所有个性,如语法分析、解析、运算、执行等。 当用户设置一个公式到表格中,计算引擎会将其解析为一个中断表达式,如公式“SUM(A1:B1, 3/E1, C1) + 2*(D1 - 1)”,当通过计算引擎的解析后,会在内存中以树型构造进行存储,这个树型构造被咱们称为表达式树。表达式树的生成,是后续构建计算依赖链的要害。 ...

July 28, 2020 · 1 min · jiezi

关于spreadjs:硬核干货葡萄城-SpreadJS-前端表格技术分享

转载请注明出处:葡萄城官网,葡萄城为开发者提供业余的开发工具、解决方案和服务,赋能开发者。 表格作为数据出现的一种根本形式,在各类软件系统都施展着重要的作用。在挪动互联时代,即使再简单的数据通过“表格”的整顿,都能够清晰的出现给用户,并反对用户从多个维度查看、筛选和批改。不论是应答文档、报告、凭证,还是票据,表格都可能附加存储更多的款式信息,尤其对离散式数据存储更加高效。 现在,企业开始纷纷尝试信息化转型,前端、后端、中台、云,这些概念也逐步变得妇孺皆知,在简直所有的B端产品中,表格都作为一种交互式组件受到宽泛欢送。 不过即便如此,表格也常常因为款式简单、操作繁琐等因素,在用户应用时造成诸多体验问题,尤其在Web我的项目中,表格技术时常受限于前端性能制约。 那么,有没有一种方法,能够帮忙开发者冲破前端表格技术的窘境,实现关键技术落地呢? 2020年6月30日,作为寰球当先的软件开发技术提供商,葡萄城举办了“赋能·智变”线上品牌战略发布会。本次会议上,葡萄城正式公布“赋能开发者”业务使命,并就前端表格开发等技术话题进行了分享。 前端表格为开发者带来的困扰 在C/S架构的应用程序中,表格类组件能够获取更多资源反对,内存管制也更加间接。然而当企业进行B/S转型时,前端表格却面临着诸多挑战。 例如,多浏览器差别、浏览器沙箱机制、内存拜访受限、客户端性能低下等。在驳杂且品质参差不齐的前端开发环境中,这些问题都会使咱们在开发利用时,耗费大量的工夫和反复编码,而无奈专一于外围业务。岂但耗时、耗力,加剧软件开发老本,更可能因为外部环境的变更,使零碎的稳定性受到冲击,使前期保护老本飙升。 总结来说,开发前端表格次要有三个技术难点:性能、内存耗费和可靠性。 为了应答这些技术难点,葡萄城联合了多年来的表格开发技术教训,推出了一款可晋升零碎性能、可靠性,升高内存耗费的纯前端表格控件 —— SpreadJS。 葡萄城 SpreadJS 的表格控件技术  针对前端表格开发的三大技术难点:性能、内存耗费和可靠性,SpreadJS别离提出了应答措施: 基于双缓存画布绘制引擎,SpreadJS实现了极高的解决性能基于行模式的稀松矩阵存储策略,SpreadJS可大幅节俭内存耗费基于计算引擎技术,SpreadJS可实现稳固牢靠的利用零碎1.    基于双缓存画布绘制引擎,实现性能晋升  在企业的利用中,数据是惟一的骨干,而作为数据载体的表格,常常被“吐槽”卡顿,UI界面“假死”,界面操作不晦涩等。 引起这些问题的症结在于浏览器渲染引擎的根底原理:当界面元素越多,浏览器的渲染工夫会显著增长,内存耗费会越大。 举例来说,古代应用程序为了谋求更好的用户体验,须要对UI界面重复优化,而频繁的批改界面UI元素,将引发屡次浏览器重绘。在这个过程中,UI元素的创立及批改,会激活外部垃圾回收机制,影响数据处理效率。 除此之外,前端开发环境的多样化、各类高DPI设施、手机、平板、4K显示屏、企业大屏等,这些无不减轻了企业应用零碎的解决累赘。 对于常常用于展现大数据量的表格来说,性能至关重要。也就是说,任何基于表格开发的利用零碎,必须满足以最低的资源耗费,实现高速渲染和刷新。 为此,SpreadJS 纯前端表格控件引入了Canvas绘制模型和双缓存画布技术,具体实现形式如下。 Canvas 绘制模型 因为传统的表格组件应用DOM的形式展现表格数据,无论在table,还是div中,简单的UI都须要大量的DOM渲染。因而,在执行更新、滚动等操作时,须要不停的销毁、创立DOM,这无形中减少了大量有效计算。 为了解决这个问题,前端框架React和Vue3均采纳了虚构DOM的形式,而SpreadJS则采纳了一种更为先进的形式——HTML5 Canvas绘制。 应用Canvas绘制,SpreadJS不仅无需反复创立和销毁DOM元素,在画布的绘制过程中,更是突破了DOM元素渲染对UI的诸多限度。SpreadJS能够绘制品种更为丰盛的UI元素,如线形、非凡图形等,通过画法逻辑,还能够实现更加精准的UI界面渲染,解决了浏览器差别造成的款式误差。 但如果只应用一个画布进行渲染,那么每次绘制时,不论是主体图层还是装璜图层,都须要通过画法逻辑将所有元素进行绘制,这显然是低效的。 双缓存画布技术 为此,SpreadJS又引入了双缓存画布的机制,将不易扭转的主体图层绘制在缓存画布中,在产生渲染行为时,只须要将缓存画布中的主体图层间接通过图像克隆的形式绘制在主画布上,并附加绘制装璜图层元素,便可大大优化整个绘制性能。 SpreadJS双缓存画布的技术特点: 相似油画的分层绘制SpreadJS的绘制引擎基于油画的绘制原理,分为主体图层和装璜图层,主体图层渲染长久的、不易扭转的元素,例如背景,单元格,表格线等。装璜图层则渲染常变性元素,如抉择框、拖拽框、悬浮成果等。 应用缓存画布当产生动静绘制,如表格滚动时,SpreadJS会将主画布清空,从缓存画布中依据行为上下文进行画布偏移,将偏移后的图层间接绘制在主画布上,再在主画布上绘制残余局部,使整个表格的滚动过程更加晦涩。 2.    基于行模式的稀松矩阵存储策略,大幅节俭内存耗费  尽管没有明文规定,但在业界的独特认知里,浏览器会对繁多线程进行内存限度,例如64位的chrome,每个tab页的内存耗费不容许超过4G,在手持设施上,这个限度则更为显著,例如iPhone 6s为1G,而iPhone 7为2G。 这个限度,在单页面利用不成熟的十几年前,不会成为问题。因为,那时大家所关注的,还是如何晋升后端的解决性能,前端只是一种动态的网页表达方式。 随着前端工程化的高速倒退,各种前端工程脚手架日渐成熟,WebComponent规范被提上日程,企业开始由C/S向B/S利用转型。这就要求前端开发者,须要面对单线程解决简单业务数据的挑战。这里的简单,不仅仅是数据量大,更是数据状态的解决。如何高效的解决数据的前后端交互,如何疾速响应数据变更及数据回滚呢? 为此,SpreadJS又提出了一个卓有成效的解决方案——稀松矩阵。   对于表格,惯例的存储形式是数组,如二维数组或对象数组。在类Excel的电子表格中,单元格内容是零散的,也就是说在Sheet中会呈现大量空单元格,而这些空单元格,同样会占用内存空间。 对于电子表格这种涣散的文档构造,SpreadJS采纳了稠密矩阵存储模型(Sparse Array)来保留数据。 相较于传统的链式存储或数组存储,稠密矩阵存储构建了基于行索引的数据字典,在涣散布局的表格数据中,稠密矩阵只会对非空数据进行存储,而不须要对空数据开拓额定的内存空间。 这种非凡的存储策略,不仅节俭了内存耗费,也使得数据片段化变得更加容易。利用SpreadJS,能够随时框取整个数据层中的一片数据,进行序列化或反序列化。 借助这个个性,开发者甚至能够随时替换或复原整个存储构造中的任何一个级别的节点,实现高效的数据回滚和数据恢复。 3.    撑持简单逻辑运算的计算引擎,实现稳固牢靠的利用零碎 公式,是类Excel电子表格中的重要性能,其宽泛的利用于迷信、财务、金融、制作等畛域。SpreadJS反对450多种公式函数,同时还提供自定义公式和异步公式函数。 外表看似简略的Excel公式,却具备高阶编程语言的所有个性,如语法分析、解析、运算、执行等。 当用户设置一个公式到表格中,计算引擎会将其解析为一个中断表达式,如公式“SUM(A1:B1, 3/E1, C1) + 2*(D1 - 1)”,当通过计算引擎的解析后,会在内存中以树型构造进行存储,这个树型构造被咱们称为表达式树。表达式树的生成,是后续构建计算依赖链的要害。 ...

July 28, 2020 · 1 min · jiezi

关于spreadjs:SpreadJS-纯前端表格控件应用案例雷鸟365在线文档系统

一、客户简介上海佳软信息科技有限公司(简称:上海佳软)是一家谋求求实的科技公司,心愿通过小而美的软件产品,为用户解决外围需要。公司深信,只有真正好用的工具能力博得市场的口碑。 二、我的项目背景随着网络信息化的倒退,各类业务零碎、表单零碎、报表零碎、剖析零碎和数据库等相继诞生,大数据处理和高性能要求是这类零碎的广泛特色。 对于这类零碎而言,其数据格式、贮存和应用形式都有不同的规定和要求,这迫使零碎开发者不得不同时保护多套零碎,手动录入各项数据,如此重复、低效的工作,未然成为企业信息化倒退的短板。 为什么通过多年的倒退,数据反而越来越分化,越来越难以被公众所应用了呢? 早在20多年前,Excel就已凭借弱小的公式、条件、图表和语言,让科学家们以一种自在、凋谢、可按需而变的形式应用数据。 现在,咱们为何不能够用互联网的思维形式,从新演绎Excel对数据自在的摸索形式,为其赋予新的价值,让利用数据不再受零碎、环境、操作系统的限度呢? 基于这个起因,上海佳软推出了雷鸟365在线表格文档零碎,这是一款有着Excel弱小性能、容许多人实时合作编辑的产品。雷鸟365的呈现让Excel联网成为可能,只须要导入本地文件,即可实现多人共享编辑文档,还能够设置拜访批改权限。 三、我的项目截图 多人在线编辑发票和付款汇总表 自主配置零碎权限 企业、团队文件共享零碎 四、抉择表格控件 SpreadJS 的次要起因“表格技术利用的最大难点在于不依赖第三方软件,在Web零碎上实现Excel的性能,如果能基于表格实现多人协同编辑,在线实时实现各部门对同一张数据表的录入,肯定会给表格相干的零碎开发带来微小的便当。” —— 刘立兼 上海佳软信息科技有限公司 CTO 雷鸟365在线表格文档零碎是基于葡萄城纯前端表格控件SpreadJS二次开发实现的,该零碎借助 SpreadJS 高度相似Excel的性能和布局、在线Excel 导入导出、数据可视化、公式计算和数据绑定能力,实现了基于单元格的在线协同编辑和多人填报性能,零碎可实时显示以后每个单元格的编辑状态,并为每个编辑过的单元格打上一个标注标签,以便别人查看。 以上就是上海佳软利用SpreadJS表格控件技术研发的在线文档零碎。由葡萄城携手局部行业用户独特发动的“企业表格技术利用开发案例大赛”正在炽热进行中,欢送提交您的利用案例,报名参赛(https://www.grapecity.com.cn/events/spjs-cases-competition/)。 对于SpreadJS 纯前端表格控件SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品个性,备受华为、苏宁易购、天弘基金、远光软件等各畛域龙头企业的青眼,并被中国软件行业协会认定为“中国优良软件产品”。SpreadJS 可为用户带来亲切、易用的应用体验,并满足 Web Excel 组件开发、 表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大升高企业研发老本和我的项目交付危险。

July 23, 2020 · 1 min · jiezi

案例大赛报名开启邀您共赴表格技术多场景最佳实践之约

表格是企业日常经营治理中的重要工具之一。基于“表格技术”研发的信息化零碎,可帮忙企业更快更精确地解决数据,大幅提高经营管理效率,如: · 在线文档零碎:基于表格实现多人协同编辑,在线实时实现各部门对同一张数据表的录入 · 数据填报零碎:简化数据绑定和校验过程,疾速精确的解决打印报送、实时预览、多级上报等工作 · 表单和报表类零碎:帮忙企业以低成本的形式重用业务零碎原始 Excel 文件,利用已有资源搭建企业类 Excel 报表平台 围绕这类信息化零碎, SpreadJS 纯前端表格控件 等开发工具应运而生,无效帮忙企业进步开发效率,疾速上线和利用信息系统。 秉承“赋能开发者”使命,葡萄城携手局部行业用户独特发动本次流动,面向开发者宽泛征集表格技术的典型利用案例,深刻展示表格技术在不同行业信息化零碎搭建中的突出劣势,以期挖掘表格技术在各畛域的最佳实际,为企业信息化转型带来启迪。 理解流动详情对于较量:参赛对象本次案例大赛,将面向所有“表格技术”的开发者和实践者征集。 奖项设置较量针对“表格文档合作、数据填报和表单设计”三类常见的利用场景,设置了最佳实际奖项,各处分价值 3000 元的华为 MatePad Pro 平板电脑一台。 · 最佳实际奖:表格文档合作类 1 名 · 最佳实际奖:数据填报类 1 名 · 最佳实际奖:表单设计类类 1 名 · 入围奖:20 名 除了实物奖品,所有获奖者还可享受如下权利: 所有入围案例,将通过葡萄城官网、官微、20+家单干媒体、技术社群等渠道,向全网用户推送,作为标杆赋能更多开发者优良案例作者,将在葡萄城公开课上,面向更多开发者分享您的成功经验和利用案例所有优良案例将汇编成册,成为《企业“表格技术”利用典型案例集》(PDF版)推介给更多企业用户参赛形式请 点击此处下载案例模板,按要求填写后,发送至: marketing.xa@grapecity.com,即可参赛 案例中需包含如下内容: 案例要求· 案例模板:请下载案例模板,按要求填写后提交 · 字数:600 字以上/篇(不含图表) · 配图:原创清晰,无水印图片 评审规范以技术先进性、行业拓展性、市场参考价值三方面综合考量案例品质。 1. 入围奖:经评审认为合乎案例格局标准的要求,即可取得入围奖 2. 最佳实际奖:在入围案例中,依据三类利用场景,评分选出最优者 3. 最佳实际奖评分根据 · 技术先进性 · 行业拓展性 · 市场参考价值 参赛工具SpreadJS 纯前端表格控件其余表格控件或类 Excel 开发工具流动流程 ...

July 17, 2020 · 1 min · jiezi

SpreadJS能为推进烟草行业信息化建设做些什么

烟草行业是为我国经济社会全面倒退、减少国家财政收入做出踊跃奉献的非凡行业,多年来始终履行“对立领导、垂直治理、专卖专营”的管理体制。 为全面贯彻落实“中国制作2025”和“互联网+”的口头理念,烟草行业致力于踊跃推动传统管理体制的改革降级,全面建设和打造“古代烟草”、“数字烟草”,一直促成烟草行业继续稳固协调衰弱倒退。 然而,随着整体信息化建设工作的发展,烟草行业信息化运维工作面临的有余也日渐突显,次要问题集中于: 运维体系仍处于初级阶段,难以撑持信息化建设的疾速倒退运维治理流程凾需增强,要害节点难以“掌控”无奈疾速定位问题本源,难以解决综合性的问题日常工作中产生的大量数据与文档依然靠纸质记录,短少信息系统将其电子化与流程化针对烟草行业信息化建设过程中凸显的问题,葡萄城纯前端表格控件SpreadJS提出了卓有成效的解决方案。 SpreadJS作为一款业余的电子表格类开发工具,兼容 450 种以上的 Excel 公式,提供纯前端导入、导出 Excel 文件和类 Excel的数据分析能力,可大幅升高用户造轮子的过程,让开发者“用不到 100 行代码,在前端实现 Excel 的全副性能”,借助 SpreadJS ,企业可缩短近50%的Web零碎开发工夫,并实现数据填报、文档协同编辑等高级性能。 烟草行业信息化建设过程中应用SpreadJS,能够解决: 1、 数据迁徙问题。 借助SpreadJS将日常工作中产生的大量Excel报表数据一步迁徙至线上,业务人员通过将Excel模版在线导入至SpreadJS设计器中,可间接转换为页面展现模版,并依照Excel的习惯设置公式和数据验证规定;通过嵌入SpreadJS的View视图,加载模版和近程数据,开发人员实现填写和查阅模式的权限管控仅须要编写几行代码。 2、 国产代替问题。 国产代替作为企业数字化转型的关键点,能够让企业脱离国外技术的垄断,并有能力持续生存。SpreadJS是一款具备自主知识产权的开发工具,应用SpreadJS开发的烟草行业信息化管理系统,可将此前遗留在第三方零碎和服务器中的数据轻松上云,解决新老零碎交替过程中,因为数据积淀多、业务扩散、数据收集难、报表结构复杂、零碎培训老本低等造成的诸多困难。 3、 零碎易用性问题。 我的项目组成员通过调用SpreadJS的API,能够高度还原Excel的操作性能和UI布局,为最终用户带来亲切的 Excel 应用体验,并满足我的项目的 Web Excel 组件开发、数据填报、Excel类报表设计、在线文档协同编辑等业务场景,为我的项目交付与企业信息化转型打下了良好的根底。 纯前端表格控件SpreadJS,帮忙了烟草行业信息化企业以更高效的伎俩治理数据,充分利用无效资源,统一规划、注重实效,最终造成一条具备中国烟草行业特色的信息化治理路线。 本文转自葡萄城

July 15, 2020 · 1 min · jiezi

性能碾压-POI-利用模板语法快速生成-Excel-报表

本期讲师:刘鹏 GcExcel项目组,外围开发者 Hello,大家好,本期葡萄城技术公开课,将由我来为大家带来《性能碾压 POI !利用模板语法疾速生成 Excel 报表》的技术分享。 本期课程,咱们将借助服务端表格组件GcExcel 的模板语法来实现Excel报表的生成,通过应用简略的语法标记,能够在不借助任何第三方组件的状况下,联合数据源,自动化地生成Excel模板文件。 目前,GcExcel能够生成的文件格式包含 XLSX、PDF、SSJSON 以及 HTML。在公开课上,我将具体介绍GcExcel 的模板性能,并教大家如何应用模板生成Excel报表,欢送大家预约本期公开课,7月10日 下午14:00,期待您的准时收看。 收费预约地址:https://live.vhall.com/120821085 GcExcel 的模板性能简介GcExcel 的模板性能是一个高级性能,它提供了一组标记,使用户能够通过简略的语法,疾速制作出一个Excel模板文件。而后,联合数据源,自动化地生成文件。 要应用这个性能,请返回GcExcel产品官网下载试用最新版本。 工作机制:首先,咱们须要筹备一个模板文件(不限于Excel文件,也能够是GcExcel的模板实例)有了模板文件,咱们就能够联合数据源和GcExcel的模板引擎,实现自动化生成模板文件的性能,从而防止了手动输出大量数据的工作 GcExcel 的模板性能工作机制 代码示例://重要的4个步骤://1\. 关上模板文件(.xlsx)//2\. 增加并命名数据源//3\. 解决模板,调用接口 IWorkbook.processTemplate()//4\. 保留已解决的文件IWorkbook workbook = new Workbook();workbook.open("template.xlsx"); //关上模板文件workbook.addDataSource("ds", *getData());* //增加并命名数据源workbook.processTemplate(); //解决模板workbook.save("result.xlsx");//导出解决后的文件模板样例:· Tablix报告:该模板次要用于设计简单表头款式,如行和列题目中存在多行、表头中存在小计行等。 · 员工缺勤打算:该模板应用了条件格局,它通过一个工作表名称,在独自的工作表中显示每个月的数据。 · 商品详情:该模板应用了模板属性 "image=true",即在模板解决后把图片字段的数据显示为图片。 留神:上述模板的展现成果并非 GcExcel 的性能,而是借助了 SpreadJS 纯前端表格控件进行可视化展现。 应用模板生成Excel的基本概念和步骤详解通过上一节,置信大家曾经对GcExcel 的模板性能有了肯定的意识,上面我会具体介绍如何应用模板来生成Excel报表。 根本语法:GcExcel中模板的定义:· 应用 {{ 和 }} 作为标记符,用以定义模板。 · 在这两个标记符之间,用户能够定义数据字段、函数、表达式等。 · GcExcel提供了丰盛的属性,用以配置并更改默认行为。 模板的用法:· 能够以字符串的模式,设置在Excel单元格中。 · 目前,一个单元格只能应用一个模板。 ...

July 10, 2020 · 2 min · jiezi

大庆金桥基于-SpreadJS-开发实现计量器具检定证书的在线生成与打印

一. 客户简介大庆金桥信息技术工程有限公司(简称:大庆金桥)注册成立于1998年5月,公司前身为大庆石油化工总厂信息中心。 经过多年发展,公司拥有了一支业务能力强、专业结构合理、技术搭配得当、综合素质高的人才队伍,在流程行业IT专业领域具有丰富的经验,在企业信息化建设、信息系统运维服务领域不断探索创新,逐步形成了咨询、信息系统集成、服务外包三大主营业务。 二. 项目背景计量器具检定(又称计量器具强制检定),是由政府计量行政部门所属或者授权的计量检定机构,对用于贸易结算、安全防护、医疗卫生、环境监测等方面的计量器具实行定点定期检定,查明和确认计量器具是否符合法定要求的程序,并出具检查标记和(或)检定证书。 作为量值传递的重要形式,计量器具检定是保证量值准确一致的重要措施。随着计算机网络技术应用的普及,为加速提高计量检定、校准工作的自动化水平,实时分析检测任务的完成情况,自动生成各类台帐报表模板,有效跟踪、记录工作,以网络技术为驱动的计量器具检定系统逐步替代了传统检定方式,形成了一套快速、高效、安全的质量信息管理体系。 现阶段,计量器具检定系统的发展已日趋成熟,然而标准化检定证书的在线设计与生成,对计量检测行业来说仍是痛点、也是难点。 计量器具检定系统的主要功能及特点 大庆金桥通过嵌入 SpreadJS 纯前端表格控件,在高度还原了Excel 功能和操作模式的情况下,实现了计量器具检定证书的在线生成与打印,为这个业务链相对成熟的传统行业,开拓了一条全新的增长模式。 通过 SpreadJS ,大庆金桥发掘出一条更加完整的业务链 三. 实际使用情况系统通过嵌入纯前端表格控件SpreadJS,很快便实现了在线表单设计功能,并支持用户将原先在 Excel 中设计的证书模板导入系统,通过权限管控规范化录入,通过自定义模板出具各类检定证书。 由于 SpreadJS 高度还原了Excel 的功能和操作模式,客户端不用安装任何插件,便可在系统内创建、导入大量支持 Excel 操作模式、计算公式和单元格类型的台帐和报表,方便检定机构管理台帐和统计信息,并可衔接连贯系统内各项业务,为计量管理工作提供有力支持。 嵌入SpreadJS后的计量器具检定信息化系统,涵盖如下功能: 1、满足各类检定证书模板的在线设计,如计量器具检定、计量器具校准、计量器具不合格通知书的标准模板; 2、可根据计量器具的信息自动填充、生成模板中的检定内容; 3、为用户提供几百种类型的计量器具检定结果录入模板,并且允许用户自定义模板; 4、在结果模板中,用户可以编辑计算公式,并设定在计量检定证书中要显示的检定结果区域; 5、将标准模板与检定结果区域合并,形成完整的检定证书; 6、内置签名、打印功能。 借助 SpreadJS,大庆金桥扩展了原有的计量管理系统,使其检定证书的生成效率和标准,达到或超过了计量检定院使用的专业软件。 系统架构演示: http://video1.grapecity.com.cn/SpreadJS/pulicclass/spjs_20200619.mp4 系统截图展示: 计量管理系统的设计思路 系统内在线设计各类检定证书模板 检定证书的生成与打印 四. 选择表格控件 SpreadJS 的主要原因在确定使用 SpreadJS 之前,大庆金桥充分调研了市面上其他报表产品,然而他们都不具备表单在线设计能力和高度类似Excel的操作模式。“只有 SpreadJS 做到了完美复刻Excel的全部功能、充分还原了Excel操作模式;支持用户在线编辑,客户端不用安装任何插件;功能丰富,API基本齐全;社区论坛反馈速度快,解决问题及时。”大庆金桥产品经理秦夏在体验过SpreadJS产品后表示。

June 22, 2020 · 1 min · jiezi

葡萄城首席架构师前端开发与Web表格控件技术解读

讲师:__Issam Elbaytam,葡萄城集团全球首席架构师(Chief Software Architect of GrapeCity Global)。曾任 Data Dynamics.Inc 创始人兼资深产品经理,个人研究方向主要为 MS.NET语言及平台、动态化系统构建,以及高性能大型分布式Web系统架构,主导了葡萄城多款畅销控件产品的系统架构与性能优化。 “25年来每天只休息4小时,除了日常作息时间,Issam不是在研究技术和产品,就是在去研究技术发展趋势的路上”这就是葡萄城同事对他的一致评价。 为何他如此痴迷于前端开发技术?在他的眼中,前端开发未来将走向何方?面对当今大热的HTML5、JavaScript,以及区块链等新兴技术,他又有哪些不同的看法和观点?他倡导的用前端开发技术,实现“在线Excel”系统的捷径又是什么?本期葡萄城公开课,我们就来一探究竟。 观看地址:https://live.vhall.com/347833693直播时间:2019-11-20(星期三) 下午14:00直播大纲: Web表格控件的处理性能,与哪些因素相关?SpreadJS 的技术架构和设计理念如何?兼容450余种Excel公式,SpreadJS是如何做到的?前端开发技术日新月异,未来将走向何方?课程摘要本期公开课,Issam将就企业信息化系统如何通过先进的前端开发技术和开发工具,在浏览器或Web应用中嵌入类Excel 模块,快速实现数据填报、在线文档、类 Excel UI 设计等业务场景,并详细介绍SpreadJS 的HTML5 Canvas界面绘制方式和稀疏数组(Sparse Array)模型。 与此同时,还会为大家深入解读“面对不断变化的业务需求,开发者如何保持并不断提升Web应用的开发迭代速度”。 最后,作为一名技术狂热爱好者, Issam还会就当今最热的前端技术发展趋势发表看法。 下面,是本期公开课的核心内容,更多精彩分享,请点击此处观看。 企业Web应用中“Excel”的重要性Excel 作为一款深受用户喜爱的电子表格工具,借助其直观的界面、出色的计算性能、数据分析和图表,已经成为数据统计领域不可或缺的软件之一。Excel对于企业来说: “用Excel的数据说话”是企业走向自动化、信息化的第一步Excel 操作简单,但却隐藏巨大的力量和灵活性许多Web应用程序都是从一张“电子表格”开始的也许难以置信,Excel脚本的确是最流行的功能(性)语言之一 Excel函数和公式无处不在完整的图灵机系统Excel甚至可以来画画和制作游戏(摸鱼必备)不过,企业真正看重的是Excel软件本身吗? Excel对于企业应用的短板: Excel的管理模式混乱且低效依赖Excel完成数据交互,将会大幅降低应用系统的运行效率Excel文件和企业已有应用接驳困难用Excel保存文件简单、通用性强 但数据易遭篡改Excel非常适合基于文件的分析 但难以同时整合、分析和汇总多个文件在企业应用项目中,高度类似Excel,但不依赖于Excel实现的数据排序、筛选、分类汇总等各项功能,才是企业真正所需,亦是信息化系统必不可少的功能模块。比如: LoB 应用降低安全风险并防止敏感数据的临时拷贝权限管控下的应用集中的数据库存储,以及可用于更深入的分析和报告因此,对于企业应用系统来说,如果有一款开发工具能够克服Excel的短板,将Excel的功能,嵌入到Web系统中,实现Web Excel 组件开发、数据填报、在线文档、图表公式联动、类 Excel UI 设计等业务场景,并完全兼容Excel 公式和文档类型,无疑会为企业带来巨大的价值。 而这些,不过是纯前端表格控件SpreadJS的基本功能之一。 Web表格控件 —— SpreadJS诞生记SpreadJS 的诞生即在意料之外,又在情理之中。 自1996年中国全功能接入互联网起, 人们对Web产品的期望愈发殷切。如今,Web开发者不仅需要面对来自PC端单方面的压力,接到更多移动端、PWA(小程序)、app hybird等平台的需求也成了家常便饭。 迫于业务不断变化的压力,导致了开发者需要不断提升Web应用开发迭代的速度,在最大程度缩短项目交付周期的同时,也需时刻保持产品的易用性和稳定性。 有挑战,便存在机遇。 美国一位名叫Issam Elbaytam的工程师在开发过程中发现:大部分用户在处理数据、统计数据时,更习惯使用Excel来做。然而,对于企业Web项目来说, Excel的短板也非常明显,例如:和企业已有应用接驳困难、无法完全脱离Office套件、高昂的授权价格、无法分布式修改数据等。 在了解到这些短板后,一个绝佳的想法就此诞生:如果用纯JavaScript开发一套功能和UI 都与Excel高度类似的电子表格控件供开发者使用,这样既可以满足应用系统当下流行的B/S架构需求,让用户进一步把应用迁移B/S端,也可以完全脱离Office套件使用。 然而,实现这样一个纯前端类Excel的开发工具到底有多难?除了要投入大量的研发成本和时间外,即便如葡萄城一般积累了多年 .NET控件开发经验的集团公司,在没有深入研究过前端数据渲染、框架集成、前后端Excel数据交互逻辑的情况下,空有人力物力也无法成功。别的不说,光是用JavaScript 实现Excel数量庞大的公式和函数,就足够耗费数倍的精力。。。 葡萄城的Spread.NET表格控件 换做其他人也许已经放弃,但Issam没有。连续20年,在每天只休息4小时的情况下,Issam基于葡萄城Spread.NET表格控件的基础,终于在2015年,研发出了一款真正的纯前端电子表格控件——SpreadJS。 ...

November 5, 2019 · 1 min · jiezi

计量检测行业业务系统如何实现信息化

计量检测行业业务系统如何实现信息化?SpreadJS在模板管理、证书管理模块的实践与应用 聂荣臻元帅曾指出:科技要发展,计量须先行。计量检测行业始终是具有生命力和发展前景的高科技行业。 计量检测行业看似陌生,其实它与我们的生活息息相关。小到出租车计价器、水表、燃气表,大到医院血压计、透析机、温度计,以及工厂所用的压力表等设备,都必须通过计量检测行业严格的检测标准并开具检测证书,才可投产上市。 计量检测行业历史悠久,作为一个传统行业,如何保持其旺盛的生命力和发展前景呢?除了灵活运用信息化管理手段外,更离不开现代化计量检测系统的支持。而一套先进计量检测系统的开发,需要借助开发工具的辅助,这样的开发工具有很多,纯前端表格控件SpreadJS不外乎是最适合的一个。 那么,企业如何使用SpreadJS开发一套完善、先进的计量检测系统,进而实现其信息化发展呢?本期葡萄城公开课《计量检测行业业务系统如何实现信息化》,将由吉林科图软件实施部经理——付志国先生,就此问题,与您深入交流,为您提供答案。 计量检测的历史计量在历史上称之为“度量衡”,但随着生产和科学技术的发展,现代计量已远远超出“度量衡”的范围。它涉及到工农业生产、国防建设、科学试验、国内外贸易、生活等各方面。简单地说,统一准确的测量就是计量。 我国计量检测行业现状我国目前计量检测行业处于快速发展阶段,国家对计量检测市场的整顿标准逐步规范化、流程化,其主要体现在:机构认证认可更加严格,门槛明显提高不断加大对机构的监督检查,对违规机构施以停业整顿的严厉处罚各地陆续出台规范计量检测市场的行政法规我国计量检测行业机构众多,但管理体制仍相对落后,信息化水平、技术水平参差不齐,重复建设严重。目前计量检测行业正处在由原计划体制向国际接轨的变革阶段,国有、外资、民营等不同体制和机制的机构共存,市场处于多元混战的无序竞争状态,同时具备很大的市场机遇与风险。基于此,计量检测行业亟需一款同时具备多个智能检测模块和数据分析处理能力的现代化计量检测系统。 计量检测系统的项目背景及迭代本系统的主要应用场景是:解决检测证书的智能生成及模板自动化管理需求。 传统的模板管理方式无法自定义函数,以及灵活调用表格数据,而使用本系统可以调用自己编写的函数、修改现有函数规则,并灵活运用图表表现数据。 本系统的【模板管理】模块一共历经三次升级迭代,V1.0主要通过嵌入HTML管理模板,但无法满足复杂表格的设计需求和自适应列宽行高的业务场景。基于此,我们升级为V2.0版本,通过直接嵌入Excel管理数据模板,但嵌入系统的Excel无法满足自定义宏、自定义公式的需求,因此,我们又对系统进行了全面升级:使用SpreadJS开发一套功能与Excel完全一致,但具备更高扩展性、灵活性和高度自定义能力的Web Excel系统——模板管理V3.0。 计量检测系统的功能架构PC端主要功能: 主要功能: 计量检测系统 - 模板管理模块模板管理模块主要用于:出具通过国家检测依据的客户证书以及绘制表格。 模板管理模块工作流程:绘制模板——>在模板制作完毕后,根据文件要求,完成三级审核——>获取批准——>投入使用。 下方的表格就是在 SpreadJS 中进行绘制的,除了可无损导入导出Excel外,还可直接编写函数公式及调用自定义函数。 本系统严格按照模板管理模块的工作流程设计菜单: 【模板管理】工作流截图: 1 绘制模板:科员根据文件内容、算法,编制模板,并提交审核。 2 核验阶段:核验与批准模板功能一致,选择所要核验、批准的数据,查看科员编制格式是否与文件中的格式符合。如符合选择通过,则该模板正常使用;如不符合驳回模板,科员继续修改,修改完毕重新提交审核。 计量检测系统 – 证书管理模块模板制作完成后,可以在证书管理模块中调用所做的模板: 编制证书时,科室人员输入检测数据,并生成证书,根据文件要求,编制的证书需要三级审核。 系统菜单和证书管理页面如下: 核验与批准人员检查数据是否正确,核验、批准通过即可开始打印证书。 【证书管理】工作流截图: 1 检定科室接到任务,开始检测设备。 2 选择数据,编制实际检测设备的数据添加到已经做好的模板当中,模板自动通过函数计算结果,用户不需要重复计算,可大大减少客户录入数据所耗时间。科员编制完成提交核验。 3 核验人员接到任务,对记录与证书进行核对,查看数据、计算是否填写正确,如填写正确核验人员提交到批准人员账号下,如填写有误,则返回检定人员账号下重新编制并保留修改痕迹。 注:批准同上,批准通过流程结束。 为什么使用SpreadJS?本系统使用SpreadJS开发【模板管理】和【证书管理】两大模块。在使用SpreadJS之前,主要通过HTML和Excel管理数据模板,面临以下难点: HTML:在页面上修改值需要有一定的编码基础,表格来回推拽会导致变形,无法编制图表。Excel:适用于大部分群体,但无法自定义函数及修改现有函数的规则。使用SpreadJS后,与此前使用HTML、Excel相比,优势如下: 实现了Excel 90%以上的功能用户可自定义函数调用编制表格、图表更加方便编制的文件在走流程时不会出现数据、表格改变无损导入导出至Excel中重复使用SpreadJS对最终用户和系统开发者的意义: 用户可自行编制函数、绘制表格,与Excel的使用方式几乎一致代码简洁,调用方法方便、高效售后及时,有问必答SpreadJS对本系统的价值使用 SpreadJS 设计的Excel模版,即可兼容excel的常用公式,也可自定义行业专属公式。使用 SpreadJS 的拷贝粘贴功能,可直接插入证书首页,因此首页不必在模板中维护、设计,用户可任意修改信息。使用 SpreadJS 中的条件表达式,可以使制作模版功能更加灵活。使用 SpreadJS 的富文本编辑功能,使得特殊符号设置更加灵活。使用 SpreadJS 在后端转pdf,可减轻浏览器压力,转换速度更快,方便存储备份证书文件。使用 SpreadJS 的图表功能,满足特殊客户的自动生成图表需求。使用 SpreadJS 的数据验证功能,可提醒客户输入值是否有误。使用 SpreadJS 的任意取值和任意赋值功能,实现自动化设备对接需求。以上就是本期公开课的主要内容,更多系统界面展示及功能演示,欢迎点击此处,预约葡萄城公开课,在线观看学习。 ...

October 9, 2019 · 1 min · jiezi

GrapeCity-Documents-for-Excel-文档API组件-V22-新特性介绍

GrapeCity Documents for Excel 文档API组件 V2.2 正式发布,本次新版本包含诸多重量级产品功能,如:将带有形状的电子表格导出为 PDF、控制分页和电子表格内容、将Excel电子表格的特定页面打印为PDF、在工作簿之间剪切和复制工作表等。 作为一款适用于 .NET 和 Java 6.0+ 标准的文档API组件,GrapeCity Documents for Excel 通过编码的方式,无需依赖 Microsoft Excel ,即可超快批量操作 Excel 文件,与纯前端表格控件 SpreadJS 结合使用,可同时在 Web 端实现 Excel 类数据展示、Excel 功能和布局样式,以及后端 Excel 导入导出等业务场景,使您开发的应用程序具备快速创建、加载、编辑、导入/导出大型 Excel 文档的功能模块。 点击此处,下载最新版 GrapeCity Documents for Excel (Java) 点击此处,下载最新版 GrapeCity Documents for Excel (.NET) 将带有形状的电子表格导出为 PDF使用 GrapeCity Documents for Excel,您可以将带有形状的电子表格导出为 PDF,这些形状包括箭头、线条、图片和一般默认形状(包括 MS Excel 的内置形状)。利用这一特性,开发人员可以创建更为有趣且丰富的 Excel 工作表。 导出的 PDF 中支持的形状属性包括: 填充样式线条样式形状与文本形状与图片旋转的形状翻转的形状分组的形状 .NET 平台帮助文档 | .NET 平台示例 | Java 平台帮助文档 | Java 平台示例 ...

July 16, 2019 · 5 min · jiezi

十分钟教你理解TypeScript中的泛型

转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。 你将在本文中学到什么本文介绍TypeScript中泛型(Generics)的概念和用法,它为什么重要,及其使用场景。我们会以一些清晰的例子,介绍其语法,类型和如何构建参数。你可以在你的集成开发环境中跟着实践。 准备工作要从本文中跟着学习的话,你需要在电脑上准备以下东西: 安装Node.js:你可以运行命令行检查Node是否安装好了。 node -v安装Node Package Manager: 通常安装Node时,它会顺带安装好所需版本的NPM。安装TypeScript:如果你安装好了Node Package Manager,你可以用以下命令在本机的全局环境安装TypeScript。 npm install -g typescript集成开发环境:本文将使用微软团队开发的Visual Studio Code。可以在这里下载。进入其下载的目录,并按照提示进行安装。记得选择“添加打开代码”(Add open with code)选项,这样你就可以在本机从任何位置轻松打开VS Code了。本文是写给各层次的TypeScript开发人员的,包括但并不只是初学者。 这里给出了设置工作环境的步骤,是为了照顾那些TypeScript和Visual Studio Code的新手们。 TypeScript里的泛型是个啥在TypeScript中,泛型是一种创建可复用代码组件的工具。这种组件不只能被一种类型使用,而是能被多种类型复用。类似于参数的作用,泛型是一种用以增强类(classes)、类型(types)和接口(interfaces)能力的非常可靠的手段。这样,我们开发者,就可以轻松地将那些可复用的代码组件,适用于各种输入。然而,不要把TypeScript中的泛型错当成any类型来使用——你会在后面看到这两者的不同。 类似C#和Java这种语言,在它们的工具箱里,泛型是创建可复用代码组件的主要手段之一。即,用于创建一个适用于多种类型的代码组件。这允许用户以他们自己的类使用该泛型组件。 在VS Code中配置TypeScript在计算机中创建一个新文件夹,然后使用VS Code 打开它(如果你跟着从头开始操作,那你已经安装好了)。 在VS Code中,创建一个app.ts文件。我的TypeScript代码都会放在这里面。 把下面打日志的代码拷贝到编辑器中: console.log("hello TypeScript");按下F5键,你会看到一个像这样的launch.json文件: { // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "TypeScript", "program": "${workspaceFolder}\\app.ts", "outFiles": [ "${workspaceFolder}/**/*.js" ] } ]}里面的name字段的值,本来是Launch Program,我把它改成了TypeScript。你可以把它改成其他值。 ...

July 11, 2019 · 2 min · jiezi

GrapeCity-Documents-for-Excel-与-Apache-POI-功能对比

GrapeCity Documents for Excel 是什么?GrapeCity Documents for Excel (简称为:GcExcel)是葡萄城推出的一款文档API组件,同时适用于 Java 和所有支持 .NET Standard 2.0 及以上标准的平台,以编码的方式,无需依赖任何 Microsoft Excel 组件,即可快速批量操作 Excel 文件,轻松满足您关于 Excel 电子表格的一切需求。 超快速、低占用率、更轻量,使用 GrapeCity Documents 可极大节省应用程序在生成、加载、编辑和保存大型文档时所占用的内存和时间,帮助企业以更高效的方式处理各种文档,实现更多定制化选项。 下载试用GrapeCity Documents for Excel (Java平台)下载试用GrapeCity Documents for Excel (.NET平台)Apache POI是什么?Apache POI 是由Java编写的一款免费开源的跨平台Java API,主要用于实现对Microsoft Office文档进行读、写的功能。POI为“Poor Obfuscation Implementation”首字母的缩写,意为“简单的模糊实现”。 GrapeCity Documents for Excel相对于Apache POI的主要优势1.公式数量支持GcExcel支持452种Excel公式,而在Apache POI中,支持的公式数量很少(虽然Apache POI网站罗列了280多种可评估的公式,但在API中仅显示为157种)。 2.导出PDFGcExcel支持导出为PDF格式,以及控制页面设置选项。 Apache POI不支持导出为PDF。 3.条件格式GcExcel支持更多条件格式规则,如自定义图标集、高于平均值(AboveAverage)、发生日期、Top 10和重复项,且这些条件格式规则与VSTO保持一致。但在Apache POI中,使用高级API支持条件格式会受到限制,例如,需要使用标记为内部用途的低级类来处理Top10、高于平均值(AboveAverage)等格式化。 4.图表类型支持GcExcel的图表界面与VSTO一致,支持约53种图表类型。 Apache POI对图表的支持非常有限,仅支持Line、Bar、Column、Scatter和Radar图表类型。 5.迷你图GcExcel完全支持添加和配置迷你图(Sparklines)。 Apache POI目前不支持Sparklines。 6.剪切、复制、粘贴形状GcExcel支持剪切、复制、粘贴形状,Apache POI不支持。 7.过滤器数据类型GcExcel广泛支持文本、数字、日期、颜色和图标等过滤器。 Apache POI仅支持基本的AutoFilter,需要使用低级类来实现应用过滤或创建任何其他高级过滤器。 ...

July 9, 2019 · 1 min · jiezi

使用-SpreadJS-实现-JavaScript-中导入和导出Excel文件

JavaScript是一个涵盖多种框架、直译式、可以轻松自定义客户端的脚本语言,在 Web 应用程序中,更加易于编码和维护。而Excel 作为一款深受用户喜爱的电子表格工具,借助其直观的界面、出色的计算性能和图表工具,已经成为数据统计领域不可或缺的软件之一。 如果有一款产品,能够将二者完美融合,将在前端表格数据处理、数据填报、数据可视化、在线文档等领域大放异彩。SpreadJS,正是这样一款功能布局与Excel高度类似,无需大量代码开发和测试即可实现数据展示、前端 Excel 导入导出、图表面板、数据绑定等业务场景的纯前端表格控件。 使用JavaScript实现 Excel 的导入和导出通过纯JavaScript,您完全可以实现导入和导出Excel文件功能,并为最终用户提供与这些文件进行I/O交互的界面。在本篇教程中,我将向您展示如何借助SpreadJS,在JavaScript中轻松实现导入和导出Excel文件的操作,以及将SpreadJS组件添加到HTML页面是多么的容易。 工欲善其事,必先利其器请下载SpreadJS 纯前端表格控件,以便同步体验设置JavaScript的电子表格项目创建一个新的HTML页面并添加对SpreadJS下载包中Spread.Sheets脚本和CSS文件的引用: <!DOCTYPE html> <html> <head> <title>SpreadJS ExcelIO</title> <script src="http://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script> <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js" type="text/javascript"></script> <link href="http://cdn.grapecity.com/spreadjs/hosted/css/gc.spread.sheets.excel2013white.10.1.0.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://cdn.grapecity.com/spreadjs/hosted/scripts/gc.spread.sheets.all.10.1.0.min.js"></script> <script type="text/javascript" src="http://cdn.grapecity.com/spreadjs/hosted/scripts/interop/gc.spread.excelio.10.1.0.min.js"></script> </head> <body> <div id="ss" style="height:600px ; width :100%; "></div> </body> </html> 然后在初始化Spread.Sheets组件的页面中添加一个脚本,并使用div元素来包含它(因为SpreadJS电子表格组件使用了Canvas 绘制界面,所以这是初始化组件所必需的一步): <script type="text/javascript"> $(document).ready(function () { var workbook = new GC.Spread.Sheets.Workbook(document.getElementById("ss")); }); </script> </head> <body> <div id="ss" style="height:600px ; width :100%; "></div> </body> 添加Excel导入代码我们需要创建一个客户端ExcelIO组件的实例,并用它来实际打开 Excel 文件: var excelIO = new GC.Spread.Excel.IO(); 然后我们需要添加一个导入文件的函数。在此示例中,我们导入本地文件,但您可以对服务器上的文件执行相同的操作。如果要从服务器端导入文件,则需要引用该位置。以下是输入元素的示例,用户可以在其中输入文件的位置: <input type="text" id="importUrl" value="http://www.testwebsite.com/files/TestExcel.xlsx" style="width:300px" /> 完成上述步骤后,您可以直接在脚本代码中访问该值: ...

July 5, 2019 · 2 min · jiezi

案例分享在-React-框架中使用-SpreadJS-纯前端表格控件

本期葡萄城公开课,将由国电联合动力技术有限公司,资深前端开发工程师——李林慧女士,与大家在线分享“在 React 框架中使用 SpreadJS 纯前端表格控件”的实战开发经验。 直播地址:http://live.vhall.com/723418543 直播时间:2019-07-03(星期三)下午 14:00 国电联合动力技术有限公司于2007年6月成立,注册资本3.13亿元,拥有五个全资子公司及五个控股公司,总部位于北京,在全国设有多家生产基地。作为中国国电集团为发展中国绿色能源事业需要,解决风电关键、重大设备国产化问题而组建的高新技术公司,国电联合动力技术有限公司为构建低碳和谐社会、铸造值得信赖的国产风机品牌提供了强大的技术支持,公司主营业务包括风电机组设计、生产制造、研究开发、销售服务等。 以下是本期公开课部分精彩内容: 项目背景: 公司采购SpreadJS 纯前端表格控件,其主要应用场景是开发一套完善的日常业务流程管理系统,该系统以部门为单位划分,每周由各部门填报人员,根据系统运行情况、日常运营数据等在系统中进行填报,后交由部门进行数据汇总,并在移动端/PC端系统页面进行数据展示。 在采购SpreadJS 纯前端表格控件之前,公司使用excel进行数据汇总,无法保证各部门的数据流通及时、共享。在经过技术调研后,决定使用SpreadJS(该控件的功能、布局和操作均接近原生Excel)开发业务流程管理系统。通过该系统,部门领导可以实时查看业务运行状况并给予反馈意见,保证数据流通实时、有效。 选择SpreadJS的主要原因:功能、布局与Excel高度一致,数据操作、使用习惯均接近原生Excel可在前端导入、导出 Excel 文件,且保持文件的最大完整性支持所有常见的Excel公式函数本期公开课大纲:SpreadJS常用组件及其属性 SpreadSheetsWorksheet渲染过程自定义数据验证及Demo演示课程答疑SpreadJS常用组件及其属性<SpreadSheets> <SpreadSheets backColor="aliceblue" hostStyle={{ width: `${tableWidth}px`, height: '600px' }} rowChanged={(_, sheet) => this.handleRowChanged(sheet)} valueChanged={(_, sheet) => this.handleValueChanged(sheet)} rangeChanged={(_, sheet) => this.handleRangeChanged(sheet)} workbookInitialized={spread => this.init(spread)} >rowChanged:主要用于删除整行触发,需要判断 propertyName 属性 handleRowChanged(content) {// 整行删除触发 const {sheet, propertyName} = content if (propertyName === 'deleteRows') { const {originalItem: {reportId}} = sheet.getDeletedRows()[0] if (reportId) { this.setState({loading: true}) setTimeout(() => { alert('删除成功!') }, 2000) } } }valueChanged:改变单元格值触发 ...

July 2, 2019 · 2 min · jiezi

WebApp-安全风险与防护系列一

WebApp 安全风险与防护(系列一)讲师资料:Carl(陈庆),葡萄城高级架构师、葡萄城技术公开课讲师。拥有15年项目开发经验,专注于产品架构、编程技术等领域,对网络安全有着独到见解,曾担任微软TechEd讲师,乐于研究各种前沿技术并分享。 2018 网络安全事故频发,从数据泄露、信息窃取,到 DDOS 攻击、勒索病毒,不仅威胁的总数在增加,威胁态势也变得更加多样化,攻击者在不断开发新的攻击途径的同时,也尽力在攻击过程中掩盖其踪迹,使网络安全防护变得越发棘手。未来是万物互联的时代,唯有把握住网络信息安全,才能避免被降维打击。本场Chat,我们特邀Carl作为分享嘉宾,于葡萄城技术公开课上,以 WebApp 安全防护为出发点,带你了解更多意想不到的安全防护措施与黑客攻击手段,助你提高网络安全意识,最终学会如何规避风险隐患,避免遭受网络安全攻击。欢迎大家扫描下图二维码,预约报名参加。 直播地址:http://live.vhall.com/137416596 下面开始展开正文。 第一节:开阔眼界 – 提升安全意识提升网络安全意识对项目团队中的每一个角色、每一个流程都至关重要。同时,也只有具备了网络安全意识,才愿意为数据安全投入更多的时间和精力。下面,我将为您展示部分2018年发生的网络安全事故,这些事故造成的损失,也许远远超出你的想象。 2018 网络安全事故回顾Facebook数据泄露事件:2018年9月,Facebook因安全系统漏洞而遭受黑客攻击,导致约5000万用户信息泄露。 上市公司数据堂,涉嫌侵犯数百亿条公民个人信息:大数据行业知名企业数据堂在短短8个月的时间内,日均泄露公民个人信息1.3亿余条,累计传输数据压缩后约为4000GB。 圆通10亿快递信息泄露: 10亿条用户数据遭公开售卖,这些数据包括寄(收)件人姓名、电话、地址等隐私信息。 万豪酒店5亿用户开房信息泄露:万豪酒店客房预订数据库遭黑客入侵,约5亿名客户的信息可能被泄露。 更多数据泄露事件国泰航空数据泄露,940万乘客受影响MongoDB 数据库被入侵, 1100 万份邮件记录遭泄露SHEIN 数据泄露影响 642 万用户GovPayNet凭证系统存在漏洞,1400万交易记录被曝光小米有品平台泄露个人隐私 约2000万用户数据遭泄露…勒索病毒事件美国亚特兰大市政府受到勒索软件攻击美国巴尔的摩市遭遇勒索软件攻击,导致911紧急调度服务的计算机辅助调度(CAD)功能掉线台积电勒索病毒事件,约造成17.6 亿元的营收损失,股票市值下跌78亿很多个人电脑和中小网站都曾遭受攻击DDoS 攻击平昌冬奥会开幕式服务器遭到身份不明的黑客入侵GitHub遭1.35T级流量攻击年度重大漏洞盘点CPU数据缓存机制漏洞iOS 平台WebView组件漏洞(UIWebView/ WKWebView)跨域访问漏洞(CNNVD-201801-515)Oracle WebLogic Server WLS核心组件远程代码执行漏洞微信支付SDKXXE漏洞Apache Struts2 S2-057安全漏洞第二节:知己知彼 – 黑客如何攻击系统一名黑客攻击网站的典型步骤,主要分为以下5步: 信息收集和漏洞扫描漏洞利用上传木马获取服务器的控制权清理痕迹总结:黑客不是手动测试系统漏洞的,而是有很多强大的工具可以自动化完成 黑客不是利用系统中的一个漏洞,而是要利用一系列,不同层次的漏洞 黑客经常批量攻击一系列网站,选取其中漏洞较多,较好利用的重点突破 第三节:十大安全风险(OWASP Top 10)不安全的软件正在破坏着我们的金融、医疗、国防、能源和其他重要的基础设施。随着我们的软件变得愈加庞大、复杂且相互关联,实现应用程序安全的难度也呈指数级增长。而现代软件开发过程的飞速发展,使得快速、准确地识别软件安全风险变得愈发的重要,OWASP 组织也因此诞生。 OWASP,即开放式Web应用程序安全项目(Open Web Application Security Project),作为一个开源的、非盈利的全球性安全组织,它提供了有关计算机和互联网应用程序的公正、实际、有成本效益的信息,其目的是协助个人、企业和机构来发现并使用可信赖的软件。 OWASP Top 10是由OWASP组织公布,最具权威性的“10项最严重的Web应用程序安全风险预警”,其就安全问题从威胁性和脆弱性两方面进行可能性分析,并结合技术和商业影响的分析结果,输出公认的、最严重的十类Web应用安全风险排名。OWASP Top 10旨在针对上述风险,提出解决方案,帮助IT公司和开发团队规范应用程序开发流程和测试流程,提高Web产品的安全性。 OWASP敦促所有公司在其组织内采用OWASP Top 10文档,并确保其Web应用程序最大限度地降低这些风险,采用OWASP Top 10可能是将企业内的软件开发文化转变为生成安全代码文化最行之有效的一步。 OWASP Top 10包括:注入失效的身份认证敏感信息泄露XML外部实体(XXE)失效的访问控制安全配置错误跨站脚本(XSS)不安全的反序列化使用含有已知漏洞的组件不足的日志记录和监控以上便是从本次Chat——“WebApp 安全风险与防护(系列一)”中截取的部分内容,下一期将详细介绍OWASP Top 10及其应对策略。更多关于 WebApp 安全风险防护手段及葡萄城安全架构中的实践分享,将在葡萄城系列公开课“WebApp 安全风险与防护”中,由Carl亲自讲解,诚邀您学习观看。公开课地址:http://live.vhall.com/137416596 公开课时间:2019/6/26 (周三)16:00 PM ...

June 25, 2019 · 1 min · jiezi

Vue-2019开发者图谱

作为 Vue 的初学者,您或许已经听过很多关于它的专业术语了,例如:单页面应用程序、异步组件、服务器端呈现等,您可能还听过和Vue经常一起被提到的工具和库,如Vuex、Webpack、Vue CLI和Nuxt。 面对这些海量、未知的专业术语和工具,您很可能会感到无助和绝望,没关系,这是所有新手在初次接触Vue时都会有的感受。 Vue庞大的体系和生态,很可能会让您无所适从。为了便于您更清晰的理解Vue的体系架构,在这里我将为您展示 “2019年Vue开发者知识图谱”,它包含了所有 Vue 开发过程中的关键部分。您可以参考这个图谱,为您在未来学习Vue的框架指引方向。 0.JavaScript和Web开发基础如果我让你去阅读纯英文书籍,那么你应该先学习英文,对吗? 同样,Vue是一个用于构建Web用户界面的JavaScript框架。在开始使用Vue之前,您至少必须先掌握JavaScript和Web开发的基础知识。 1.Vue的基本概念如果您是一名Vue的萌新开发者,您应该更专注于Vue.js 生态系统的核心,它包括Vue核心库、Vue Router和Vuex。因为这些工具将会在绝大部分的Vue应用程序中出现。 Vue核心功能在一般情况下,Vue将网页和JavaScript保持同步,实现这一目标的特性是响应式数据指令和插值等模板功能,这些都是第一天需要学习的内容。 在构建你的第一个Vue应用之前,你还必须要去了解如何在网页中安装/使用Vue,以及了解Vue引用实例的生命周期。 组件Vue的组件是可重复使用、且相互独立的UI元素。您首先需要学习,如何声明组件,及如何通过属性和事件使组件间达成通信。同时,学会组合组件也同样重要,这决定了你能否使用Vue构建出一个健壮、可扩展的Web应用程序。 单页面应用程序单页面应用程序(SPA)架构,决定了你创建的Web页面能够展示和多页面网站一样丰富的内容,且不会发生在用户点击链接后重新加载整个页面这样低效的行为。 一旦您将您的“页面”创建成了一个Vue组件,您可以为每一个组件使用Vue Router,将每个请求映射到一个唯一的访问路径上,Vue Router是一个由Vue团队维护的用于构建单页面应用程序(SPA)的工具。 状态管理随着项目规模越来越庞大, SPA的页面上将会有越来越多的组件,管理全局状态也将变得愈发棘手,组件因为大量的属性和事件监听器而变得臃肿。 为应对上述情况,你的需要开始了解Vue的状态管理:一种被称为“Flux”的特殊模式,可将您的数据保存在稳定的中央存储中。Flux可通过Vuex库来实现,该库由Vue团队维护。 2.生产环境中的Vue您从第一部分获取的知识理论上可用于构建高性能的Vue应用程序。那么,如何确保他们能够在实际生产环境下运行呢? 如果您要把基于Vue.js 的产品推向用户,您还需要了解更多内容,以下将为您介绍。 项目脚手架如果您需要经常构建Vue应用程序,您会发现几乎每个项目都会提供配置、设置和开发人员工具。 Vue团队维护了一个名为Vue CLI的工具,它可以让您在几分钟内构建一个强大的Vue开发环境。 全栈 / 认证应用程序Vue应用是数据驱动型的用户界面,数据通常由Node、Laravel、Rails、Django 或其他服务器框架编写的安全API作为来源,大部分数据是由传统的REST API或GraphQL提供,再或者是Web Socket提供的实时数据。 您应该熟悉这些用于将Vue集成到全堆栈配置中的设计模式,以及在Vue应用程序中保护用户数据安全的各种注意事项。 如果您正在评估什么后端产品是您开发Vue应用时的最好选择,那么这篇文章中应该有您的答案。(后续会翻译)测试如果您想确保您的Vue应用程序在生产环境中表现的既可维护又稳定,您需要对您的应用提供完整的测试。 在Vue应用程序中,单元测试可确保您的组件始终为给定的输入(属性或用户输入的内容)提供相同的输出(渲染好的HTML或事件)。 Vue团队维护着一个名为Vue Test Utils的工具,它允许您对组件单独创建和执行测试过程。 优化手段当您将应用程序部署到远程服务器后,这个应用的访问速度和执行效率很可能不会像在开发阶段表现的那样迅速,很可能当用户访问时速度会变得很慢。 为了提升效率,我们需要优化Vue应用,优化过程可以采用多种技术,如服务端渲染。在服务端渲染中,Vue程序将在服务端执行,在用户访问时,将渲染完成的HTML呈现给用户,从而达到提升访问速度的目的。 当然,优化手段不局限于这一种,还包括:异步组件和渲染功能。 3.关键工具到目前为止,我们所掌握的知识皆来自于Vue.js核心和生态系统中的工具。但Vue并不是孤立存在的,它只是前端技术栈的一部分。 在高级开发领域不应该仅仅熟悉Vue,还要熟悉一些其他关键工具,因为它可能将成为未来Vue应用的重要组成部分。 现代JavaScript和BabelES5可以有效构建的Vue应用程序,也几乎是所有浏览器都支持的JavaScript标准。 为了增强Vue的开发体验,使用最新的浏览器功能,您可以借助最新的JavaScript 标准(ES2015的特性或ES2016及更高版本的全新功能)来构建您的Vue应用程序。 注意:如果您选择使用了最新的JavaScript,那么旧版浏览器将会出现兼容问题,这很可能会造成您的产品损失掉一部分用户。 如何对旧浏览器做兼容呢? Babel 可以实现这个目的,它的职责就是在应用程序发布前将您应用程序中现代的特性“转换”(翻译和编译)为标准功能。 WebpackWebpack是一个模块打包工具,意思是如果您的代码是由跨不同模块编写的(例如,不同的JavaScript文件),Webpack也可以将这些内容“打包”到同一浏览器可读的单个文件中。 Webpack 还可以构建流水线,它允许您在构建代码前进行转换。例如,使用前面提到的Babel、Sass或TypeScript,还可以使用一系列插件来优化您的Web应用程序。 许多开发者认为Webpack很难理解,也很难配置,但如果没有它,Vue的一些特性功能(如:单页面组件)将无法实现。我们有关于WebPack的系列教程,助您快速掌握Webpack的使用和配置。 TypeScriptTypeScript是JavaScript语言的超集,它包含了(String、Boolean、Number等)。有了这样的定义,能保证您在开发期间就能编写出健壮且稳定的代码,并尽早发现错误。 即将于2019年推出的Vue.js 3将完全用TypeScript编写,这并不意味着您必须在Vue项目中使用它。但假如您需要通过阅读Vue的内部代码并加入Vue的开源组织为其贡献力量,您至少也应提前了解TypeScript。 4.Vue框架基于Vue创建的框架,使您无需从头开始实现服务端渲染,就可创建自己的组件库以及其他类似的工作。 目前有许多优秀的Vue框架,这里,我们只列出了应用在不同领域最为广泛的三个框架。 Nuxt.js如果你想要构建一个高性能的Vue应用程序,基于路由、服务端呈现、代码分离和其他前沿特性,同时还需要一些更高级的功能,例如:SEO标记等。您可以使用Nuxt.js框架。 Nuxt.js框架通过其丰富的社区插件提供了所有这些开箱即用的特性,甚至更多,如PWA等。 ...

June 21, 2019 · 1 min · jiezi

每个程序员都该学习的5种开发语言

转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。 我曾在某处读到过(可能在《代码大全》,但我不敢确定),程序员应该每年学习一门新的编程语言。但如果做不到,我建议,你至少学习以下5种开发语言,以便你在职业生涯有很好的表现。 每个公司都喜爱精通多种编程语言并且多才多艺的程序员。一个既能很麻利地写脚本,也能编写复杂的Java程序的程序员,确实相当有价值。所以实际上,对于高级开发者来说,学习不止一种编程语言,几乎就是必然的要求。 目前而言,面试官越来越看重那些拥有多种编程语言经验的工程师。比如,同时有C++ 和Java的经验就很不错,Python和Java也是。我个人喜欢那些在C++ 或者Java方面有着丰富经验,而且能用Groovy、Perl或Python写脚本的软件工程师。 很多时候,写一个小脚本就足以快速搞定一些专有任务。我不想我的程序员们花上一整天用Java去写一个读取CSV文件的程序,或者在TCP/UDP端口抓取信息的程序,这是很浪费时间的一件事情。 为什么我在文章中选择这5种语言呢?我的理由简单且实际。我是基于这些语言的用途、编程范式和流行度及代表性来选择的。 例如,如果你想找一份应用开发的工作,就不能忽视Java。同样,做与web相关的事情,就得知道无处不在的JavaScript。 在开发者职业生涯的早期,我强烈建议学习C语言。它能帮助开发者贴近系统底层,知晓那些编程的关键概念,这是隐藏在JVM或CLR底下的东西。 对于脚本语言,我的选择是Python,尽管你也可用Perl或Groovy代替。但在扩展支持方面来看,Python的表现无疑是最棒的。有很多Python模块可供选择,帮你能分分种搞定各种任务。 学习一种面向对象的语言的同时,也学习一种像Haskell或Scala这样的函数式编程语言,这能拓展你的思维和编程认知。你可以在本文找到学习这5种语言的更多理由。 言归正传,下面就是我列出的5种每个程序员或软件开发者都该尝试学习的编程语言。 它包含了语言的大杂烩,比如[面向对象的]语言(http://javarevisited.blogspot... -object.html),函数式的语言,脚本语言,提供了对底层的控制,也涵盖了广泛用于服务端开发的语言。 JavaJava是近二十年来最流行的语言之一。它统治着全球的服务端应用开发,同时在基于Anroid开发的移动应用和游戏市场,以及企业web开发领域,也占有相当一部分比重。 Java最初的构想是一次编写各种平台均能运行(write once run anywhere)。随着时间的推移,它确实做到了运行在各个平台的各个角落。 你应该学习使用Java构建健壮的、可扩展的服务端应用。你可以用Java构建多种复杂度的工程。与之相伴的,有很棒的工具、技术和社区支持。 为什么你应该学Java呢?你会学到如果专注于应用层面和代码结构的设计,而不用关心特定系统的细节和内存管理。JVM帮你搞定了后面这些。 如果你已经决定开始学习Java了,那么Udemy上的 The Complete Java Master Class 教程就很棒,用它作为入门教程很好,它包含了Java的所有核心概念,很详细。 顺便一提,如果你想要更多选择,而且不介意使用免费的课程学习,那可以看看这上面给新手提供的课程。 Java被许多世界上的大型组织所使用。而且能够向众多用户展示你用Java开发的Android应用。如果你仍然还在动摇,我建议你去这看看10个学习Java的理由。 Python在全球范围的学校和院系,Python是教授最多的语言之一。在美国,许多学术课程中,Python已经取代了Java成为接触编程的首选语言。你将从学习Python中得到什么呢?——那将非常多。 Python既能用于写脚本,也能作为一种面向对象的语言编写大型工程。 许多流行的网站,比如Reddit,就使用基于Python的框架来构建,比如Django。近段时间,许多大型组织也转向使用基于Python的框架了。 Python也越来越多地用于像机器学习、人工智能、数据科学这样的新一代技术中。这也难怪,因为有基于Python的非常棒的机器学习库,比如TensorFlow、Scikit-Learn以及其他。 我个人倒是在用Python写脚本。这能很快地完成一些有用的事情,比如,你可以用Python花5分钟写一个UDP消息的监听器,相比较,用Java可能就要花20分钟。忘掉“编译、打包,然后才能使用”这些步骤。你可以直接为特定任务编写Python脚本。如果你有兴趣学习Python,那么The Complete Python BootCamp就是个很好的开始。 如果你需要更多选择,而且不介意使用免费的课程学习,那也可看看这上面给新手的课程。 并且,如果你困惑于不知道该从Java还是Python开始,看看这个,它比较了两者。 另外,如果你仍然没有被我说服,那就可以看看我的关于10个学习Python理由的文章。 JavaScript你可以用Java替代C++,用Pythont替代Ruby,但是,坦率地讲,当前没有JavaScript的替代品。在最近5年,JavaScript完全统治了世界。 它不再仅仅是客户端脚本语言。有了Node.js这样的库,和Angular、React这样的框架,你可以在服务端做用户界面的开发。 JavaScript的巨大成功,有一部分要归功于jQuery。它真正改变了人们在客户端使用JavaScript的方式。 作为一个在工作中使用JSP和开发基于Servlet的应用的程序员,我有许多机会同时使用jQuery和JavaScript。 有了此语言的知识,可以帮助我们决定哪些功能应该在服务端实现,哪些该在客户端实现。比如,许多服务端的校验逻辑,就被我们迁移到了客户端。 如果你想从头开始深入学习JavaScript,那Udemy上的The Complete JavaScriot就是你可加入的最佳在线课程。 如果你想要更多选择,且不介意跟着免费的课程学习,那么可以看看这里为web开发者提供的课程。 C 和/或 C++如果不知道C或C++,你就不能成为真正的程序员。这听起来有点苛刻,但是我的经验之谈。 了解C的工程师或者开发者,就是比不了解C的程序员要优秀。这可不是简单的巧合。 这是你必须要了解的编程语言之一。我在求学期间学习的C语言,并在那时学到了关于编程的许多关键概念,比如结构体、数组、指针、内存管理等等。 C仍然是操作系统编程方面最受欢迎的语言,并且在这两年,给排名榜首的Java带来了强劲地冲击。如果你想学习这门美妙的语言,那C Programming for Beginners就是个很好的开始。 它同样是最古老的主流语言之一,已经存在了四十多年。 C++ 和C很像,都允许你为系统和驱动编写底层代码。如果你想学习C++ 而不是C,可看看我为新手列出的免费C++课程。 ...

June 14, 2019 · 1 min · jiezi

每个Web开发者都该了解的12条命令行

转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。原文出处:https://tutorialzine.com/2017... 在开发者的弹药箱里,命令行是最具生产力的工具之一。掌握它们可以给你的工作流程带来非常积极的影响。因为,许多日常任务都可以用一条命令然后按回车来解决。 在本文中,我们为你准备了一系列常用命令,帮你充分利用你的终端。这其中有些命令是系统内置的,另外的一些则是需要另外安装的免费工具,不过这些免费工具是经历了时间的考验,所以你可以分分钟将他们安装完成。 curlcurl是一个发送请求的命令行工具。可使用HTTP(s)、FTP,以及一些你可能从未听过的协议发送请求。它可以下载文件,检查响应头,自由地访问远程数据。 在web开发中,curl常用于测试连接和RESTful APIs。 # 获取一个URL的HTTP HEADERcurl -I http://google.comHTTP/1.1 302 FoundCache-Control: privateContent-Type: text/html; charset=UTF-8Referrer-Policy: no-referrerLocation: http://www.google.com/?gfe_rd=cr&ei=0fCKWe6HCZTd8AfCoIWYBQContent-Length: 258Date: Wed, 09 Aug 2017 11:24:01 GMT # 向远程API发出GET请求curl http://numbersapi.com/random/trivia29 is the number of days it takes Saturn to orbit the Sun.curl命令可以远比上面的情况复杂。它有一大堆的选项来控制请求头、cookies、权限验证等等。你可以在这本相当棒的免费书Everything curl中读到更多。 treetree是一个小巧的命令行,用于可视化地展示目录里的文件结构。它递归地执行,检查嵌套的每一个层级,为所有内容绘制出格式化的树形结构。你可以用它快速浏览文件结构,定位到所需的文件。 tree.├── css│ ├── bootstrap.css│ ├── bootstrap.min.css├── fonts│ ├── glyphicons-halflings-regular.eot│ ├── glyphicons-halflings-regular.svg│ ├── glyphicons-halflings-regular.ttf│ ├── glyphicons-halflings-regular.woff│ └── glyphicons-halflings-regular.woff2└── js ├── bootstrap.js └── bootstrap.min.js也有类似正则匹配的选项,用于过滤结果。 tree -P '*.min.*'.├── css│ ├── bootstrap.min.css├── fonts└── js └── bootstrap.min.jstmux根据维基百科所说,tmux是一个终端复用器,翻译为人话就是说,它是一个把多给终端连接为一个终端会话的工具。 ...

June 4, 2019 · 1 min · jiezi

在 Angular 8 中,我们可以期待些什么

转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。本文由葡萄城翻译并发布Angular 作为一款优秀的前端框架,自诞生之日起,就致力于面向前端开发者提供一整套全功能解决方案。与其他流行框架所追求的理念不同,Angular并非作为一款可以并入 Web 应用程序的轻量级框架而生,而是设计为:包含了一个完整的工作流,用于从项目创建开始,持续地维护并更新你的应用程序。2019对于 Angular来说意义非凡,因为其包含了Ivy 等功能的全新版Angular 8 将于本年内正式发布。尽管 Angular 技术团队仍没有对外公布 Angular 8 正式版发布日期,但其beta版在本月上线已几乎没有悬念。Angular 8的发布近在咫尺!那么,在 Angular 8 中,我们可以期待些什么?Angular 8 中有什么新功能尽管大多数开发者都在关注Ivy,但其实 Angular 8 中还是有很多值得称道的亮点:JavaScript中的差异化加载作为构建过程的一部分,Angular CLI生成的新应用程序现在将包含用于旧版JavaScript(ES5)和现代JavaScript(ES2015 +)的单独软件包。该包在客户端中实现差异化加载,以提高浏览器的加载速度和传输间隔时间(TTI)。这是一个好消息,意味着支持ES2015的浏览器将能够下载更小、更高效的应用程序包,而这些应用程序包的加载速度和渲染速度都比以往更快。Ivy (预览版)视图引擎抢先试用您可在应用程序中开始使用Ivy渲染器,并向Angular团队提供使用反馈,以便其及时做出优化和修复。Angular Router的向后兼容模式Angular 添加了向后兼容模式,以降低大型项目的升级成本。Angular Router将可以使用 $ route APIs 在现有的Angular应用程序中,选择延迟加载部分 Angular 1.x应用程序。在理想的情况下,我们甚至可以立即将Angular 1.x应用程序升级到Angular 2+。然而,现实并非如此。直到今天,还有大量传统的Angular应用程序仍在为企业提供服务。而这些企业没有选择升级的原因很简单:它们运行良好,并且在完成重写时无需太多投入。Angular 1.x的时代已经结束,之后不会有任何新的更新,直到2021年6月30日。因此,对于从事大型Angular 1.x应用程序开发的团队,现在正是选择升级的最佳时间。改良的Web Worker绑定方式Web Worker是编写主线程运行代码的好方法,可用于提高应用程序的速度和并发性。为了达到这一目标,Angular团队在 CLI 中添加了改良的 Web Worker绑定支持。可选的信息共享机制为了有效收集您的反馈,更好地建设 Angular社区,Angular团队在CLI中添加了可选的信息共享机制。在您同意的情况下,将开始收集您的命令行和构建速度等匿名信息。依赖关系更新与往常一样,Angular团队正在更新对TypeScript、RxJS和Node等工具的依赖关系,以便与 Angular 生态系统的其余部分保持同步。Angular Ivy 是什么?作为下一代 Angular 的视图引擎,Ivy的出现旨在彻底缩减代码尺寸并增强系统灵活性。与目前的Angular View Engine相比,Ivy具有以下优势:通过 Angular 编译器生成的代码现在将更容易让开发者阅读和理解项目重建时间将明显加快有效减少了负载大小,浏览器用于下载和解析应用程序的时间将更短更好的模板类型检查,以便您在项目构建初期,就可捕获更多BUG,以防止用户在运行时遇到它们除此之外,Angular Ivy与现有的Angular应用程序广泛兼容。因此,在理想的情况下,您将无需更改应用程序即可获得Ivy的全部支持。这也是为什么使用Angular 8和Ivy构建当前的Angular应用程序会更加便利。Ivy(预览版)可能存在的问题目前已知的是,Ivy 的国际版和Angular Universal版尚未完全兼容。当然,如果您在开发过程中遇到任何使用BUG,请立即向Angular技术团队反馈,以便他们能够及时解决问题并将您的建议作为 Ivy 正式版的一部分。如果您的Angular应用程序支持多语言或使用服务器端呈现数据,请不要指望它能与Ivy完美结合。除此之外,用户可能遇到的另一个问题就是Angular Material,目前来看,使用Angular Material的应用似乎与即将发布的Angular 8预览版Ivy不太匹配。Angular 8 对 Web Worker 的支持对于那些对Web Worker 还不熟悉的开发者来说,Web Worker标志着前端开发中的一项重要创新,在此之前,所有 Web 应用程序仅限于使用单线程。而随着 Web Worker 的出现,可以将CPU分配到单独的硬件线程中,使浏览器环境拥有多线程,从而提升项目开发效率。在Angular 8更新之前,使用 Web Worker需要注意的问题是:在worker中运行的代码不能与应用程序的其余部分位于同一JavaScript脚本文件中。它必须是分开的。因此,对于曾经希望借助Angular CLI等工具,自动将JavaScript文件拆分、绑定到更少文件夹下的效果往往不佳。而Angular 8的新特性之一便是改进了使用Angular CLI捆绑WebWorker的支持,这项改进意味着您将走向多并发、自动化的Web Worker之路。Angular 8 对 TypeScript 的支持关于 Angular 8 中的依赖更新,包括了对Angular依赖项和最新版本的更新,如RxJS和TypeScript等框架。这看起来似乎是一个微小的改进,但却同样受欢迎,特别是TypeScript部分。Angular 8 的性能提升虽然 Angular 8 带来了很多令人称赞的功能,但是真正促使我们升级的很大一部分原因取决于其性能的提升!为证实这一点,我们将对 Angular 7.2 和Angular 8.0.0-beta.7 进行全面对比。该性能测试是基于ng new创建的新应用程序运行,并使用ng build –prod构建的。测试本身使用了Chrome的审核标签完成,通过 “Applied Fast 3G,4X CPU Slowdown” 的设置来模拟在移动设备上运行。Angular 7.2使用Angular 7.2的正式版本生成main.js的大小为240KB。具体数据如下图:Angular 8.0.0-beta.7Angular 8 beta版本的main.js文件大小与Angular 7.2相同:240KB。由此可见,文件大小没有任何改变,但让我们对比一下性能数据:Angular 8 看起来更棒!相对于Angular 7.2,获得了相当不错的性能提升。于是,在 Angular 8 中,我们可以得到些什么正如我们所看到的,Angular 8的新增特性除 Ivy 之外并不是很亮眼,尽管这些特性非常好用,但对于大多数应用程序来说并不重要。基于这一点,您应该将应用程序升级到Angular 8,还是坚持使用Angular 7?毫无疑问,你应该升级它们。即便功能上没有任何大的重大更新,但通过 Angular 8 新增的差异化加载,您将获得显著的性能提升。更重要的是,升级到Angular 8将确保您的应用程序为Ivy做好准备,即便目前 Ivy只是Angular 8提供的一个可选预览。如果您的应用程序需要兼容 Ivy,那么最好从现在开始尝试。或者,您也可以选择一条更加快捷且简便的方式,比如使用一款相当成熟的商业化开发工具——WijmoJS。这样,您就不必考虑项目中前端框架的兼容性和版本更新问题,因为它不但同时兼容了Angular、React、Vue、TypeScript和Ionic 等框架,还时刻紧随技术潮流,第一时间保持对框架最新版本的全面支持。本文是由葡萄城技术开发团队发布,转载请注明出处:葡萄城官网了解可嵌入您系统的在线 Excel,请前往SpreadJS纯前端表格控件与开发人员分享前端技术趋势、交流心得技巧,请加入葡萄城“前端技术交流群”(QQ群:720389894) ...

April 15, 2019 · 1 min · jiezi

10 个不常用但你有必要知道的 html 标签

转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。概述HTML 也被称为超文本记语言( hyper text markup language )是为网页创建和其他可在网页浏览器中看到的信息设计的一种标记语言。HTML 被用来结构化信息,如标题、段落和列表等,也可用来在一定程度上描述文档的外观和语义。今天我们将介绍您可能不知道的十个 HTML 标签。虽然不常用,但是一旦遇到使用场景使用起来将是非常方便的。如果您想了解有关 HTML 的更多信息,可以访问 W3Schools 获取更多 HTML 信息。audio:<audio> 标签定义声音,比如音乐或其他音频流。目前支持三种文件格式:MP3,WAV 和 OGG。<audio src="/i/horse.ogg" controls=“controls”>Your browser does not support the audio element.</audio>点击此处查看结果blockquote<blockquote> 标签定义块引用。 <blockquote> 与 </blockquote> 之间的所有文本都会从常规文本中分离出来,经常会在左、右两边进行缩进(增加外边距),而且有时会使用斜体。也就是说,块引用拥有它们自己的空间。Here comes a long quotation:<blockquote>This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation.</blockquote>请注意,浏览器在 blockquote 元素前后添加了换行,并增加了外边距。点击此处查看结果output<output> 标签定义不同类型的输出,比如脚本的输出。标签包含以下属性 for 规定一个或多个元素的 id 列表,以空格分隔。这些元素描述了计算中使用的元素与计算结果之间的关系。 form 规定 <output> 元素所属的一个或多个表单的 id 列表,以空格分隔。 name 规定 <output> 元素的名称。 Internet Explorer 不支持 <output> 标签。<form oninput=“x.value=parseInt(a.value)+parseInt(b.value)">0<input type=“range” id=“a” value=“50”>100+<input type=“number” id=“b” value=“50”>=<output name=“x” for=“a b”></output></form>点击此处查看结果picture<picture> 元素通过包含零或多个 <source> 元素和一个 <img> 元素来为不同的显示 /设备场景提供图像版本。浏览器会选择最匹配的子 <source> 元素,如果没有匹配的,就选择 <img> 元素的 src 属性中的 URL。然后,所选图像呈现在<img>元素占据的空间中。picture 标签的属性如下:srcset (必需) - 定义要显示的图像的 URLmedia - 接受通常在 CSS 中定义的任何有效媒体查询( media queries )例如下面所示<picture><source media="(min-width: 650px)” srcset=“img_pink_flowers.jpg”><source media="(min-width: 465px)" srcset=“img_white_flower.jpg”><img src=“img_orange_flowers.jpg” alt=“Flowers” style=“width:auto;"></picture>根据浏览器的最小宽度的变化,picture 将显示不同的图片点击此处查看结果progress<progress> 标签标示任务的进度(进程)。用于进度条显示<progress value=“22” max=“100”></progress>点击此处查看结果meter<meter> 标签定义已知范围或分数值内的标量测量。也被称为 gauge (尺度)。也可以用于进度条的显示<meter value=“3” min=“0” max=“10”>3/10</meter><br><meter value=“0.6”>60%</meter>点击此处查看结果template<template>标记内的内容本身是对用户隐藏的,通过 JS 可以将其用于重复实例化显示。相当有定义了一个模板,该模板可以通过 JS 重复被调用展示。例如下面定义模板:<template> <img src=” icon.jpg ”></template>在 JS 中可以通过 cloneNode() 方法,来重复实例化显示该模板中的内容:const template = document.querySelecor(‘ template ’);const templateClone = myTemplate.content.cloneNode(true);document.body.appendChild(templateClone);time<time> 标签定义公历的时间( 24 小时制)或日期,时间和时区偏移是可选的。time 主要作用在于可以方便的被爬虫抓取,从而获得相应的数据。time 本身对页面布局没有任何影响例如:<p>我们在每天早上 <time>9:00</time> 开始营业。</p>video与<audio>相对应,<video> 标签定义视频,比如电影片段或其他视频流。<video src="/i/movie.ogg” controls=“controls”>your browser does not support the video tag</video>点击此处查看结果wbrwbr 是 Word Break Opportunity 的简写,规定在文本中的何处适合添加换行符。例如下面的对于较长的单词 XMLHttpRequest 希望在换行时候能够截断换行而不是整个换行的情况下可以使用,下面的代码在换行的时候截断成 XML Http Request 分别进行换行,而不是 XMLHttpRequest 整个进行换行。<p>如果想学习 AJAX,那么您必须熟悉 XML<wbr>Http<wbr>Request 对象。</p>点击此处查看结果本文是由葡萄城技术开发团队发布,转载请注明出处:葡萄城官网了解可嵌入您系统的在线 Excel,请前往SpreadJS 纯前端表格控件 ...

April 3, 2019 · 1 min · jiezi

使用 SpreadJS制作票据金额输入框

前言 | 问题背景本例是由一位用户提出的实际需求。在类似金额的票据中,一个单元格仅允许填写一位数字,每一个单元格都对应着一个数字位,例如千位、万位、百位等。据此需求进行分析,可知需要实现以下几点基本操作:需要把对应表格区域保护并锁定,不能直接允许用户编辑单元格内容,否则不能保证用户仅输入一位数字;需要针对键盘事件进行监听,通过事件代码为单元格赋值,过滤掉除数字外的其它字符;在一个单元格填写完毕后,活动单元格自动后移到下一个单元格上,不需要鼠标点选或键盘切换。本文基于SpreadJS V12版本,下载请点击。示例代码分析由以上分析可知,首先需要对表单进行保护设置,同时设置一下样式和表头,如下所示:var spread = new GC.Spread.Sheets.Workbook(document.getElementById(“ss”), { sheetCount : 1 });var sheet = spread.getActiveSheet();// 设置表单保护sheet.options.isProtected = true;sheet.setRowCount(5);sheet.setColumnCount(9);sheet.defaults.rowHeight = 60;sheet.defaults.colWidth = 40;var style = sheet.getDefaultStyle();// 设置默认样式的边框style.borderLeft =new GC.Spread.Sheets.LineBorder(“black”,GC.Spread.Sheets.LineStyle.thin);style.borderTop = new GC.Spread.Sheets.LineBorder(“black”,GC.Spread.Sheets.LineStyle.thin);style.borderRight = new GC.Spread.Sheets.LineBorder(“black”,GC.Spread.Sheets.LineStyle.thin);style.borderBottom = new GC.Spread.Sheets.LineBorder(“black”,GC.Spread.Sheets.LineStyle.thin);// 设置对齐方式style.hAlign = GC.Spread.Sheets.HorizontalAlign.center;style.vAlign = GC.Spread.Sheets.VerticalAlign.center;sheet.setDefaultStyle(style);var arr = [“百”,“十”,“万”,“千”,“百”,“十”, “元”, “角”, “分”];for(let i=0; i<arr.length; i++){ sheet.setValue(0, i, arr[i], GC.Spread.Sheets.SheetArea.colHeader);}sheet.setRowHeight(0, 60, GC.Spread.Sheets.SheetArea.colHeader);键盘事件需要绑定到div上,先进行字符过滤,再执行填值和移动单元格操作。如下所示:$("#ss").keydown(function (event) { // 判断是否是键盘数字键 var kc = event.keyCode; console.log(kc); var keyValue = -1; if(kc >= 48 && kc <= 57){ keyValue = kc - 48; }else if(kc >= 96 && kc <= 105){ keyValue = kc - 96; } if(keyValue >= 0){ var sel = sheet.getSelections(); if(sel && sel.length > 0){ var row = sel[0].row; var col = sel[0].col; sheet.setValue(row, col, keyValue); // 调用命令向后移动一个单元格 spread.commandManager().execute({ cmd: “moveToNextCell”, sheetName: sheet.name() }); } }});需要完整示例,请点击此处下载。补充讨论本例仅仅展示了最基础的实现思路,仍有很多没有完善的地方,由于篇幅因素,仅在此处进行讨论补充一下。例如:在用户填写错误时,如何撤销或删除?当页面上还有其他数据区域时,如何做到自动后移单元格不会超出金额区域?这些问题大家可以思考补充。SpreadJS | 下载试用纯前端表格控件SpreadJS,是市面上布局与功能都与 Excel 高度类似的一款表格控件,全中文操作界面,适用于.NET、Java、移动端等多个平台的类 Excel 数据开发,备受华为、中通、民航飞行学院等国内知名企业客户青睐。 ...

March 29, 2019 · 1 min · jiezi

在线Excel开发之新人学习笔记 - 工作簿2

Spread JSON 导入导出在SpreadJS表单控件中可以导入导出JSON数据,收集界面的录入数据,数据源序列化若要将表单中的数据源序列化到JSON对象中,可以设置参数includeBindingSource: true,若未设置默认为false.如下图,点击数据源序列化,将上表中的数据源数据导出,在下表中读入:自定义特性序列化一些自定义的特性也支持序列化与反序列化,如下图,点击加样式按钮,为表格的视图及标签区域加入自定义样式,点击自定义特性序列化可将自定义样式也序列化。SpreadJS支持以下自定义特性的序列化与反序列化: 自定义单元格类型, 自定义函数,自定义格式, 自定义函数迷你图, 自定义标签, 以及自定义行筛选。hitTest点击工作表的任何地方,hitTest方法可以返回特定区域》》点击下载本文Demo示例SpreadJS | 下载试用纯前端表格控件SpreadJS,是市面上布局与功能都与 Excel 高度类似的一款表格控件,全中文操作界面,适用于.NET、Java、移动端等多个平台的类 Excel 数据开发,备受华为、中通、民航飞行学院等国内知名企业客户青睐。

March 29, 2019 · 1 min · jiezi

使用 SpreadJS 中的图表和公式创建贝尔曲线(Bell Curve)

前言 | 问题背景贝尔曲线(也称为正态分布、Bell Curve)是变量的常见分布类型。贝尔曲线有很多用例,在统计学中,钟形曲线用于模拟各种各样的真实数据。在金融行业,分析师和投资者在分析证券的回报或整体市场敏感度时使用正态概率分布。在这篇文章中,我将讨论如何在Spread.Sheets中设计钟形曲线。我们将使用散点图和内置公式绘制曲线。具体实现让我们用一些公司员工评级的假设数据填写Spread.Sheets。在Spread.Sheets中填充数据的代码如下:spread = new GC.Spread.Sheets.Workbook(document.getElementById(“ss”), { sheetCount: 2 });var dataSheet = spread.sheets[0];dataSheet.setValue(0, 0, ‘Employee Name’, GC.Spread.Sheets.SheetArea.colHeader);dataSheet.setValue(0, 1, ‘Employee Ratings’, GC.Spread.Sheets.SheetArea.colHeader);dataSheet.setValue(0, 2, ‘Normal Distribution’, GC.Spread.Sheets.SheetArea.colHeader);dataSheet.setValue(0, 3, ‘Mean’, GC.Spread.Sheets.SheetArea.colHeader);dataSheet.setValue(0, 4, ‘Standard Deviation’, GC.Spread.Sheets.SheetArea.colHeader);for (var i = 0; i <= 99; i++){ dataSheet.setValue(i, 0, “Employee” +" “+ i);}for (var i = 0; i <= 99; i++) { dataSheet.setValue(i, 1, Math.floor(Math.random() * (50 - 10 + 1)) + 10);}由于钟形曲线显示正态分布,我们将使用SpreadJS的Norm.Dist()来计算数据点。但是,正态分布需要均值和标准差来计算分布值。因此,让我们首先得到这些值的均值和标准差。请注意,需要按递增顺序对值进行排序,以找到正确的均值。spread.getActiveSheet().sortRange(-1, -1, -1, -1, true, [{ index: 1, ascending: true }]);让我们计算平均值和标准差:dataSheet.setFormula(0, 3, “=AVERAGE(B1:B100)”, GC.Spread.Sheets.SheetArea.viewport);dataSheet.setFormula(0, 4, “=STDEV(B1:B100)”, GC.Spread.Sheets.SheetArea.viewport);让我们将这些值放在Norm.Dist公式中以获得分布:for (var i = 0; i <= 99; i++) { var j = i + 1; dataSheet.setFormula(i, 2, “=NORM.DIST(B” + j + “,D1,E1,FALSE) “, GC.Spread.Sheets.SheetArea.viewport);}现在最重要的部分是使用计算的分布来绘制钟形曲线图。在SpreadJS中,我们将Scatter图表的数据范围设置为这些分布值:var chartType = GC.Spread.Sheets.Charts.ChartType.xyScatter;var chart = dataSheet.charts.add(‘Bell Curve’, chartType, 280, 30, 700, 390, “B1:C100”);钟形曲线显示的正态分布结果如下所示:SpreadJS | 下载试用纯前端表格控件SpreadJS,是市面上布局与功能都与 Excel 高度类似的一款表格控件,全中文操作界面,适用于.NET、Java、移动端等多个平台的类 Excel 数据开发,备受华为、中通、民航飞行学院等国内知名企业客户青睐。 ...

March 29, 2019 · 1 min · jiezi

在线excel开发之新人学习笔记——工作簿

前端页面中经常需要使用到表格控件,为方便表单的设计填报,今天尝试使用一款纯前端表格控件。控件下载地址:https://www.grapecity.com.cn/…首先初始化Spreadvar spread = new GC.Spread.Sheets.Workbook(document.getElementById(‘ss’), { sheetCount: 2 });此时,页面中表格已经出现。通过以下方法可以增加,清空,删除表单:/——————Spread表单————————–/ spread.addSheet(0); console.log(spread.getSheetCount()); // 3 spread.setSheetCount(1); console.log(spread.getSheetCount()); // 3 初始化时创建了两个 var sheet = spread.getSheet(0); var sheet1 = spread.getSheetFromName(‘Sheet3’); console.log (sheet == sheet1); // 结果:True,此时我页面的 索引为0 的sheet 名字叫 Sheet3 // spread.removeSheet(0); // spread.clearSheets(); // 清空了,一片空白 spread.setSheetCount(4); console.log(spread.getActiveSheetIndex()); // 获取活动表单索引spread.setActiveSheetIndex(3); // 设置活动表单通过一下方法可以控制 表单,标签的一些显示,标签名称背景色等/——————表单名称标签————————–/ // spread.options.tabStripVisible = false; // 标签条 显示控制 // spread.options.newTabVisible = false; var curSheet = spread.getActiveSheet(); //curSheet.options.sheetTabColor = ‘blue’; // 设置当前sheetTab 背景颜色, spread.options.tabEditable = true; // 双击是否可修改表单名称 spread.options.allowSheetReorder = false; // 是否可通过拖拽调整表单顺序 // spread.startSheetIndex(1); // 设置起始的sheet的索引 spread.options.tabStripRatio = 0.8; // 设置TabStrip的宽度,取值0-1滚动条的相关设置//horizontal,vertical;both;none 拖动滚动条给出提示,默认none spread.options.showScrollTip = GC.Spread.Sheets.ShowScrollTip.horizontal; spread.options.showVerticalScrollbar = true; // 控制水平或竖直滚动条是否显示 showVerticalScrollbar,showHorizontalScrollbar spread.options.scrollbarShowMax = true; // 是否基于表单全部的行列总数显示滚动条 spread.options.scrollbarMaxAlign = true; //滚动条末尾是否对齐视图中表单的最后一行或一列背景// spread.options.backColor = ‘red’; //spread.options.backgroundImage = ‘img/bag.jpg’; //同时设置,图片优先 //spread.options.backgroundImageLayout = GC.Spread.Sheets.ImageLayout.stretch; //stretch,center,zoom,none spread.options.grayAreaBackColor = ‘red’;// 配合spread.options.scrollbarMaxAlign = false 使用Spread事件var activeSheetChanged = GC.Spread.Sheets.Events.ActiveSheetChanged; spread.bind(activeSheetChanged,function(){ console.log(‘activeSheetChanged’); }) // spread.suspendEvent(); // 暂停触发事件 // spread.resumeEvent(); // 恢复触发事件 var SelectionChanging = GC.Spread.Sheets.Events.SelectionChanging; spread.bind(SelectionChanging,function(){ console.log(‘SelectionChanging’); }) var CellClick = GC.Spread.Sheets.Events.CellClick; spread.bind(CellClick,function(){ console.log(‘CellClick’); }) var SelectionChanged = GC.Spread.Sheets.Events.SelectionChanged; spread.bind(SelectionChanged,function(){ console.log(‘SelectionChanged’); }) var EditStarting = GC.Spread.Sheets.Events.EditStarting; spread.bind(EditStarting,function(){ console.log(‘EditStarting’); }) var EditEnded = GC.Spread.Sheets.Events.EditEnded; spread.bind(EditEnded,function(){ console.log(‘EditEnded’); })事件触发时控制台打印出相应提示:免费在线版Excel:https://demo.grapecity.com.cn… ...

March 26, 2019 · 1 min · jiezi

纯前端表格控件 SpreadJS 内测邀请

纯前端类 Excel 表格 SpreadJS 自发布以来,受到了各行业开发伙伴们的认可,无论国内互联网巨头、上市公司、行业龙头以及跨国集团都将 SpreadJS 作为核心组件应用于多个场景,如报表展示、数据分析、数据填报、办公协同、报告生成和在线文档等。值此 SpreadJS V12 SP1 新版本发布前夕,葡萄城 SpreadJS 产品组特举办本次新版本内测活动,诚邀您的参与。点击下载 SpreadJS V12 SP1内测版同时,我们也希望得到您关于产品宝贵的意见或建议,无论是产品 Bug、新功能,甚至是主题配色等,都将促使我们不断优化并完善 SpreadJS 产品,为您提供更专业的服务。请您点击链接或扫描图中二维码,提交内测反馈。再次感谢您的参与和支持,让我们共同笃定前行,赋能更多开发者!关于 SpreadJS 前端表格控件SpreadJS 纯前端表格控件是基于 HTML5 的 JavaScript 电子表格和网格功能控件,适用于 .NET、Java 和移动端等各平台在线编辑类 Excel 功能的表格程序开发。全中文操作界面,零学习成本!便于您在系统开发过程中,更好的显示和管理类似 Excel 的数据,更方便的进行公式引擎、排序、过滤、输入控件、数据可视化、Excel 导入/导出等操作。

March 12, 2019 · 1 min · jiezi