为什么推荐的人这么少~~~~

更新（2017-4-18）：

截止目前已知的已有2个三甲医院在使用该编辑器，容我内心澎湃以下，O(∩_∩)O哈哈~

先放github地址：https://github.com/tlzzu/SoDiaoEditor.v2

首先，这不是愚人节的玩笑，，，

本想着三月底发布来着，结果昨天又在兼容性上调出几个bug，然后拖到了愚人节这天。

我是个追求完美的人，这点认识我的人，都能够从我的相貌中看出来。

转眼五个月过去了，期间不断有人发来邮件进行鼓励，并在不打赏的情况下厚着脸皮的来问我什么时候进行下一版的更新！

静下心来，再次翻看原来的病历编辑器发现了几个问题：

当我想添加扩展时，卧槽，没留位置，不能扩展；

当性能出问题时，卧槽，代码不清晰，不好排查；

当要解决bug时，卧槽，code分布太多，改死狗；

当其他人拿出code问我时，卧槽，这不是我写的code吧…

我焦虑了，code跟屎一样，怎么可能是我这么优秀的人写出来的？

“算了谁没个过去啊”就这样我先原谅了自己。

然后举着充满老茧的右手起誓：

新的版本中

ta必须能够扩展；
ta必须容易使用；
ta必须考虑兼容性；
ta性能必须足够优化；
ta设计必须足够合理；

所以就只能重构了。

当然对比之前版本的优势还是很明显的：

接口更加简洁
可扩展性更高
框架调整，为后续更新发力
...（想好再补充）

未来希望增加图像控件，体温的这些。

老版本模板如果要升级现有版本：

模板中的样式去掉tl-改成sde-
模板中去除所有click绑定

以下为github中内容：

SoDiaoEditor.v2

预览(国外站点打开会比较慢，请耐心等待，或者自己下载过来在本地打开)

设计模式--电子病历设计器(扩展toolbar)

　　　　建议给病历模板设计者（开发人员，或者科主任）使用。

　　　　可用来设计电子病历模板，也可以当做电子病历编辑器使用。

　　　　此时输入的值可利用SDE对象暴露出的接口获取。

编辑模式--电子病历设计器)

　　　　建议给医生使用。

　　　　此时医生可以在原有模板中添加已有的控件，也可以给科主任用来设计模板。

　　　　亦可通过SDE对象暴露出来的接口获取数据。

只读模式--电子病历设计器)

　　　　建议该模式给医生查看使用，在该模式下电子病历中所有控件均不可编辑。

按钮控制--电子病历设计器

　　　　按钮通过事件控制！

编辑模式--电子病历编辑器

　　　　建议给医生使用，此模式下医生只能编辑控件中的值，其余均不可修改。

只读模式--电子病历编辑器

　　　　该模式只允许查看，控件不可被编辑。

按钮控制--电子病历编辑器

　　　　按钮通过事件控制！

更新

本次更新以下内容：

新增以下toolbar：

编辑

  i. 剪切板

      . 复制、粘贴、切剪

  ii. 字体

      . 字体、字号、增大字体、缩小字体

插入

  i. 字符

  ii. 链接

      . 取消链接

  iii. 图片

      . 图片、涂鸦（蛮好用的你可以试试）

  iv. 表格

表格

  i. 表格

      1. 插入表格

设计器中新增SED对象
修复事件兼容性（暂不支持IE8及其以下的浏览器，后续会有解决方案）
增加toolbar可配置性。
解决上一个版本中的bug。
等

结构

data                    模拟异步请求的数据，正式项目中可忽略

dialogs                 扩展百度ueditor的dialogs

dist                    核心js文件

    js

        sde.design.js   SoDiaoEditor设计器核心js

        sde.editor.js   SoDiaoEditor编辑器核心js

example                 一些demo

ueditor                 百度ueditor库，可替换成自己版本

sde.config.js           核心配置文件

使用

电子病历设计器：

<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>设计模式--电子病历设计器</title>

    <!-- 注意以下各脚本之间的加载顺序！ -->

    <script type="text/javascript" src="sde.config.js"></script>

    <link rel="stylesheet" href="ueditor/themes/default/css/ueditor.css" />

    <script type="text/javascript" src="ueditor/ueditor.all.js"></script>

    <script type="text/javascript" src="ueditor/lang/zh-cn/zh-cn.js"></script>

    <script type="text/javascript"  src="dist/js/sde.design.js"></script>

</head>

<body>

    <script id="myEditor" type="text/plain" style="width:680px;height:1000px;">

        病历模板...

    </script>

    <script type="text/javascript">

        window.onload = function() {

            var sde = new SDE({

                id: "myEditor",

                title: '<div style="height: 45px;overflow: hidden;">' +

                    '<div class="left" style="position:absolute;top:0;left:0;">' +

                    '<img src="../data/img/SoDiaoL.png" style="height:35px;margin:5px;border:none;" />' +

                    '</div>' +

                    '<h1 style="font-size: 14px;height: 45px;line-height: 45px;margin: 0 auto;text-align: center;font-weight: normal;color:#fff;" >SoDiaoEditor电子病历编辑器</h1>' +

                    '</div>', //自定义title
　　　　　　　　　　　　toolbars: {

　　　　　　　　'sde-toolbar-file': 'file',

　　　　　　　　'sde-toolbar-editor': ['history', 'clipboard', 'fonts', 'paragraphs', 'styles'],

　　　　　　　　'sde-toolbar-insert': ['horizontal', 'spechars', 'link', 'img', 'map', 'code', 'table', 'formula', 'comment'],

　　　　　　　　'sde-toolbar-tables': ['table', 'blockmergecells'],

　　　　　　　　'sde-toolbar-views': ['directory', 'showcomment', 'preview'],

　　　　　　　　'sde-toolbar-tools': ['drafts', 'print', 'searchreplace', 'wordcount'],

　　　　　　　　'sde-toolbar-records': ['sdetemplate', 'sdecontrols'],

　　　　　　　　}//可自行删减

            });

        };

    </script>

</body>

</html>

注意：

各个脚本之间的加载顺序，已本例为准。配置项(sde.config.js)：

/*

默认配置项

*/

(function() {

    var URL = window.UEDITOR_HOME_URL || getUEBasePath();

    /*

    SDE_CONFIG 配置项

    */

    window.SDE_CONFIG = {

        HOME_URL: URL,

        HOME_URL_DIALOGS: URL + 'dialogs/',//SoDiaoEditor扩展ueditor的dialogs位置

        EDITOR_URL: URL + 'dist/js/sde.editor.js',

        MODE: "DESIGN", //DESIGN:设计|EDITOR:编辑|READONLY:只读（所有节点都不可编辑）

        CONTROL_TEMPLATES: []//控件模板

    };

    /**

     * 配置项主体。注意，此处所有涉及到路径的配置别遗漏URL变量。

     */

    window.UEDITOR_CONFIG = {

        UEDITOR_HOME_URL: URL + 'ueditor/', //为编辑器实例添加一个路径，这个不能被注释

        serverUrl: URL + "data/config.json", //URL + "net/controller.ashx", // 服务器统一请求接口路径

        toolbars: [], //工具栏上的所有的功能按钮和下拉框，可以在new编辑器的实例时选择自己需要的重新定义

        autoClearinitialContent: false, //是否自动清除编辑器初始内容，注意：如果focus属性设置为true,这个也为真，那么编辑器一上来就会触发导致初始化的内容看不到了

        //iframeJsUrl: URL + window.SDE_CONFIG.EDITOR_URL + '?temp=' + new Date().getTime(), //给编辑区域的iframe引入一个js文件

        // iframeCssUrl: URL + 'EMR/css/default.css?temp=' + new Date().getTime(), //给编辑区域的iframe引入一个css文件

        allowDivTransToP: false, //允许进入编辑器的div标签自动变成p标签

        wordCount: false, //关闭字数统计

        elementPathEnabled: false, //关闭elementPath

        autoClearinitialContent: false

    };

    function getUEBasePath(docUrl, confUrl) {

        return getBasePath(docUrl || self.document.URL || self.location.href, confUrl || getConfigFilePath());

    }

    function getConfigFilePath() {

        var configPath = document.getElementsByTagName('script');

        return configPath[configPath.length - 1].src;

    }

    function getBasePath(docUrl, confUrl) {

        var basePath = confUrl;

        if (/^(\/|\\\\)/.test(confUrl)) {

            basePath = /^.+?\w(\/|\\\\)/.exec(docUrl)[0] + confUrl.replace(/^(\/|\\\\)/, '');

        } else if (!/^[a-z]+:/i.test(confUrl)) {

            docUrl = docUrl.split("#")[0].split("?")[0].replace(/[^\\\/]+$/, '');

            basePath = docUrl + "" + confUrl;

        }

        return optimizationPath(basePath);

    }

    function optimizationPath(path) {

        var protocol = /^[a-z]+:\/\//.exec(path)[0],

            tmp = null,

            res = [];

        path = path.replace(protocol, "").split("?")[0].split("#")[0];

        path = path.replace(/\\/g, '/').split(/\//);

        path[path.length - 1] = "";

        while (path.length) {

            if ((tmp = path.shift()) === "..") {

                res.pop();

            } else if (tmp !== ".") {

                res.push(tmp);

            }

        }

        return protocol + res.join("/");

    }

    window.UE = {

        getUEBasePath: getUEBasePath

    };

})();

注意：

请重点关注window.SDE_CONFIG 和 window.UEDITOR_CONFIG 。建议window.UEDITOR_CONFIG不要修改，可根据需求该window.SDE_CONFIG对象

电子病历编辑器：

<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>编辑模式--电子病历编辑器</title>

    <script type="text/javascript" src="dist/js/sde.editor.js"></script>

</head>

<body>

    <div id="myEditor" style="width:680px;height:1000px;margin:0 auto;">

        病历内容...

    </div>

    <script type="text/javascript">

        window.onload = function() {

            var sde = new SDE({

                id: "myEditor",

                title: '<div style="height: 45px;overflow: hidden;">' +

                    '<div class="left" style="position:absolute;top:0;left:0;">' +

                    '<img src="../data/img/SoDiaoL.png" style="height:35px;margin:5px;border:none;" />' +

                    '</div>' +

                    '<h1 style="font-size: 14px;height: 45px;line-height: 45px;margin: 0 auto;text-align: center;font-weight: normal;color:#fff;" >SoDiaoEditor电子病历编辑器</h1>' +

                    '</div>', //自定义title

                mode: 'EDITOR'//配置模式

            });

        };

    </script>

</body>

</html>

文档

电子病历设计器：

方法	说明	描述
ready(function(){})	编辑器加载完成	(之后的所有方法必须在ready加载完成后使用）
html([html])	获取/设置所有编辑器中的html模板	如果html不传递，则为获取，有值则为设置
getControl([id])	获取编辑器中的控件	id为可选，若为无则是获取所有控件
setControl(ctl)	设置编辑器中指定id的控件值	ctl：{ID:'',VALUE:''}如果是select控件类型ctl：{ID:'',VALUE:'',TEXT:''}。ctl可以为数组也可以为对象，设置冻结REQUIRED：1为冻结，只读不可操作
setMode(mode)	设置编辑器模式	mode可选：DESIGN（设计）、EDITOR（编辑）、READONLY（只读）

电子病历编辑器：

方法	说明	描述
getControl([id])	获取编辑器中的控件	id为可选，若为无则是获取所有控件
setControl(ctl)	设置编辑器中指定id的控件值	ctl：{ID:'',VALUE:''}如果是select控件类型ctl：{ID:'',VALUE:'',TEXT:''}。ctl可以为数组也可以为对象，设置冻结REQUIRED：1为冻结，只读不可操作
setMode(mode)	设置编辑器模式	mode可选：DESIGN（设计）、EDITOR（编辑）、READONLY（只读）

贡献&bug提交

可邮件至dd@sodiao.org；
可以在github中的Iss中提交；

后续~~

本次框架调整相对合理，后续会持续跟进，toolbar也会相对完善。

最后

谨以此，献给那些还在医疗行业奋斗的小伙伴们

【SoDiaoEditor电子病历编辑器更新啦】--谨以献给那些还在医疗行业奋斗的小伙伴们的更多相关文章

【SoDiaoEditor更新啦】--谨以献给那些还在医疗行业奋斗的小伙伴们
先放github地址:https://github.com/tlzzu/SoDiaoEditor.v2 首先,这不是愚人节的玩笑,,, 本想着三月底发布来着,结果昨天又在兼容性上调出几个bug,然后拖 ...
SoDiaoEditor电子病历编辑器更新至V3版本，愿与各位一路同行！
简单闲聊两句-- 记得刚参加工作那会儿,去医院实施,信息科不远处就是手术室,门口每天都挤满了人,他们中大多数都是等待手术结果的患者家属,有的还会把折叠床带来,应该是陪床有段时间了.有时路过,还会听到一 ...
【SoDiaoEditor电子病历编辑器】阶段性更新--新增复选框、日期控件、表格排版支持等
转眼距离上一次v2正式发布已经过去一个半月了.github期间不定期push了二十几次,同时感谢分布在广州.福建.上海.北京的一众小伙伴,正是你们给出的建议,才让SoDiaoEditor不断完善. 我 ...
【SoDiaoEditor电子病历编辑器】阶段性更新啦
转眼距离上一次v2正式发布已经过去一个半月了.github期间不定期push了二十几次,同时感谢分布在广州.福建.上海.北京的一众小伙伴,正是你们给出的建议,才让SoDiaoEditor不断完善. 我 ...
【SoDiaoEditor电子病历编辑器】编辑器支持移动化
写在前面每次写SoDiao时都是一次灵魂拷问,这么猥琐的名字,会对程序媛产生多少误导啊,我是一个正直的人,不管你信不信每个见到我的人都这么说.本次更新拖了很久,本来半个月前应该实现的,却一直拖到昨天 ...
【开源】SoDiaoEditor 可能是目前最好用的开源电子病历编辑器（B/S架构）
此刻我的内心是忐忑的,这个标题给了我很大的压力,虽然很久以前我就在github上搜索一圈了,也没发现有其他更好的开源电子病历编辑器,如各位亲发现有更好的,烦请知会我一声. 该编辑器其实已经憋了很久了, ...
正在开发纯BS的可在线编辑内容的电子病历编辑器
在线电子病历编辑器功能预览,支持Firefox/Chrome/Opera/UC/IE/Safari.演示地址 http://www.dcwriter.cn:9090/ 在WINFORM.NET中的效果 ...
都昌 DCWriter电子病历编辑器演示文档截屏
中文分词实战——基于jieba动态加载字典和调整词频的电子病历分词
分词是自然语言处理中最基本的一个任务,这篇小文章不介绍相关的理论,而是介绍一个电子病历分词的小实践. 开源的分词工具中,我用过的有jieba.hnlp和stanfordnlp,感觉jieba无论安装和 ...

随机推荐

Linux at命令详解
at 只能执行一次,在一个指定的时间执行一个指定任务,只能执行一次,且需要开启atd进程 anacron: 适合于非 7*24 类型的服务器,以天为周期或者在系统开机后执行任务的工作它会定时检测服务 ...
September 22nd 2017 Week 38th Friday
If we believe that tomorrow will be better, we can bear a hardship today. 如果我们相信明天会更好,今天就能承受艰辛. If y ...
GNSS基础（持续更新）
1.整周模糊度成功率可参考文献:GNSS整周模糊度概率特性 2.正太分布见百度百科 https://baike.baidu.com/item/%E6%AD%A3%E6%80%81%E5%88%86 ...
spring中MessageSource的配置使用方法2--ReloadableResourceBundleMessageSource【转】
本文转载仅供自己学习收录,不做任何商业用途,如有需要可访问原地址:http://blog.csdn.net/qyf_5445/article/details/8124362 如何在spring mvc ...
mysql用户创建及授权
一. 创建用户: 命令:CREATE USER 'username'@'host' IDENTIFIED BY 'password'; 说明:username - 你将创建的用户名, host - 指 ...
CSS3 新增颜色表示方式
一.CSS1&2颜色表示方式(W3C标准) 1.Color name 颜色名称方式(用颜色关键字表示对应的颜色.) 例如:red(红色).blue(蓝色).pink(粉色) 优点:方便快捷而 ...
【转】 android中的文件操作详解以及内部存储和外部存储
摘要其实安卓文件的操作和Java在pc环境下的操作并无二致,之所以需要单独讲解是因为安卓系统提供了不同于pc的访问文件系统根路径的api,同时对一个应用的私有文件做了统一的管理.根据我的经验,初学者 ...
windows配置cider和clojure clj
windows配置cider和clojure clj */--> pre.src {background-color: #292b2e; color: #b2b2b2;} windows配置ci ...
python pyspark入门篇
一.环境介绍: 1.安装jdk 7以上 2.python 2.7.11 3.IDE pycharm 4.package: spark-1.6.0-bin-hadoop2.6.tar.gz 二.Setu ...
如何给sublime text.安装插件
1.Sublime的Package Control安装方法 Package Control插件本身是一个为了方便管理插件的插件第一步:ctrl+~,在弹出的下部边框中输入: 如果是 Sublime ...

【SoDiaoEditor电子病历编辑器更新啦】--谨以献给那些还在医疗行业奋斗的小伙伴们

SoDiaoEditor.v2

预览(国外站点打开会比较慢，请耐心等待，或者自己下载过来在本地打开)

更新

结构

使用

电子病历设计器：

注意：

电子病历编辑器：

文档

电子病历设计器：

电子病历编辑器：

贡献&bug提交

【SoDiaoEditor电子病历编辑器更新啦】--谨以献给那些还在医疗行业奋斗的小伙伴们的更多相关文章

随机推荐

热门专题