New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details →
Socket
Book a DemoSign in
Socket

bse-editor

Package Overview
Dependencies
Maintainers
2
Versions
29
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

bse-editor

## 传统方式

latest
npmnpm
Version
0.1.0-alpha-6.24
Version published
Maintainers
2
Created
Source

使用方式

传统方式

import BSE from '@/bse/main.js'
mounted() {
  this._instance = BSE.Editor({ ...options }) --实列对象
}

js 外部编译命令

npm run build:lib

js 外部编译方式引入

<meta charset="utf-8" />
<title>BSE demo</title>
<link rel="stylesheet" href="./BSE.css" />

<body>
  <div></div>
  <!-- 必须指定挂载Node -->
</body>

<script src="./BSE.umd.js"></script>
<script>
  const _instance = new BSE.Editor({ el: document.querySelector('div') })
</script>

cdn 引入方式

npm cdn 映入入外部样式文件

<meta charset="utf-8" />
<title>BSE demo</title>
<link rel="stylesheet" href="./BSE.css" />

<body>
  <div></div>
  <!-- 必须指定挂载Node -->

  <script src="https://cdn.jsdelivr.net/npm/bse-editor@latest/dist-lib/BSE.umd.min.js"></script>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bse-editor@latest/dist-lib/BSE.css" />

  <script src="./BSE.umd.js"></script>
  <script>
    const _instance = new BSE.Editor({ el: document.querySelector('div') })
  </script>
</body>

npm 安装方式

npm 安装命令

npm install bse-editor
import BSE from 'bse-editor'
mounted() {
  this._instance = BSE.Editor({ ...options }) --实列对象
}

options 配置说明

options 示列

mounted() {
  this._instance = BSE.Editor({
    requestDiagnosHistroyTable(callback, formInline) {
      console.log('实列回退参数', formInline)
      setTimeout(() => {
        callback([
          {
            code: '1',
            name: '门诊诊断',
            memo: '临床初步诊断'
          }
        ])
      }, 2000)
    }
  })
}

选项配置说明

参数名参数描述枚举值
elbse 挂载 dom 元素(Node)querySelector 满足的值,比如#id.
className、Element。可以是 Element,也可以是#id 等-
paper纸张类型string设置纸张尺寸A4 A5 A6
baseUrl静态资源基础路径string设置静态资源基础路径-
mode编辑器模式 string切换编辑器模式, 设计模式(designMode)、编辑模式(editMode)、预览模式(previewMode)designMode
footer编辑器页脚 string编辑器底部显示内容曼荼罗软件股份有限公司技术提供
iframeCssSrc编辑器扩展 css [array|string]编辑器外部扩展 css[]
iframeJsSrc编辑器扩展 js array|string编辑器外部扩展 js[]
beforeunload刷新页面是否询问 boolean刷新之前是否询问true
revise修订模式 boolean开不开启修订模式false
loadingloading 状态 boolean编辑器是否处理 loading 状态false
autoPaging分页 boolean是否开启自动分页true
height高度 string设置编辑器高度''
getDynamicTable回调函数function, formInline 参数object获取表格数据{ tablefieldlist: [ { bseFieldName: '男' }, { bseFieldName: '女' } ], // 动态表格数据 tablefieldMapping: { 字段名: 'bseFieldName' } // 动态表格映射 }
requestTable回调函数function, param 参数object点击表格{ tablefieldlist: [ { bseFieldName: '男' }, { bseFieldName: '女' } ], // 动态表格数据 tablefieldMapping: { 字段名: 'bseFieldName' } // 动态表格映射 }
requestTableField回调函数function, param 参数object点击字段[ { label: '男', value: 0 }, { label: '女', value: 1 } ]

诊断接口说明

参数名参数描述枚举值
requestDiagnoseField回调函数function, param 参数object, formInline 参数object获取诊断表单字段[ { code: '1', name: '门诊诊断', memo: '临床初步诊断' } ]
requestDiagnosTreeTable回调函数function, formInline 参数object获取诊断拖拽表格[ // 必须纯在唯一 id 和 children 和 parentId { { id: 1, parentId: 0, bse_type: '中医诊断', bse_categery: '入院诊断', bse_disease_name: '肾虚', bse_disease_name_desc: '病描述', bse_symptom_name: '症名', bse_symptom_name_desc: '症描述', children: [ ] }]
requestDiagnosHistroyTable回调函数function, formInline 参数object获取历史诊断[ { code: '1', name: '门诊诊断', memo: '临床初步诊断' } ]
requestDiagnosCommonlyTable回调函数function, formInline 参数object获取常用诊断[ { code: '1', name: '门诊诊断', memo: '临床初步诊断' } ]
requestDiagnosTableChildren回调函数function, formInline 参数object获取常用子诊断分类[ { code: '类型', name: '分类', memo: '备注' } ]

手术接口说明

参数名参数描述枚举值
requestSurgeryTreeTable回调函数function, formInline 参数object获取常用手术列表[ { type: '类型', code: '手术编码', name: '手术名称', surgeryLevel: '手术等级', anesthesia: '麻醉方法' } ]
requestSurgeryField回调函数function, param 参数object, formInline 参数object获取手术选项列表[ { code: '1', name: '门诊诊断', memo: '临床初步诊断' } ]

触发事件 配置说明

addListener 示列

mounted() {
  this._instance = BSE.Editor({ ...options })
  this._instance.addListener('saveDiagnoseList', (payload, callback) => {
    console.log('触发事件参数', payload)
    setTimeout(() => {
      callback({
        status: 200,
        data: [],
        msg: '保存诊断列表成功'
      })
    }, 2000)
  })
}
触发事件名回调参数描述 值
serachDiagnose参数object, 回调函数function查询诊断触发
setCommonlyDiagnose参数object, 回调函数function设为常用诊断触发
setCommonlySurgery参数object, 回调函数function设为常用手术触发
saveDiagnoseList参数object, 回调函数function保存诊断列表触发

主动唤起组合弹窗说明

组合弹窗示列

methods() {
  // 组合元素弹窗
  composeElement(module = 'moduleEle') {
    this._instance.execCommand('composeelementdialog', { }, (payload) => {
      const html = this._instance.getContent() // 获取编辑器内容
      let divContainer = void(0)
      divContainer = document.createElement('section')
      divContainer.setAttribute('class', 'bse-element')
      divContainer.innerHTML = html
    })
  }
}

常用方法功能说明

常用功能触发示列

methods() {
  // 获取表单验证消息
  validaterulesDocumentElement() {
    this._instance.execCommand('validaterules', (payload) => {
      console.log(payload)
    })
  }
}
触发事件名表单参数回调函数参数描述
validaterules-表单数据(array)所有验证消息数组
insertxmlorhtmlmodulestring表单数据object { contentXmlOrHtmlString: strings // 插入字符串 }-插入 xml 或 html 至编辑器中
getexportxmlorhtmlstring表单数据object { version: '', // 数据版本号 默认 '4.0' htmlstring: true // 返回 html 或者 xml 格式 }html 或 xml 字符串获取 xml 或 html 字符串

通过传入数据更新 html 段落

methods() {
  // 获取表单验证消息
  insertSectionElement() {
    this._instance.execCommand('inserthtmlorxmlstringbyparams',
      { // 更新数据
        '签名控件id': {
          date: '2022-09-10',
          sign: 'bse64'
        },
        '手术控件id': [{
          id: '0',
          type: '类型',
          code: '手术编码01',
          name: '第一台手术',
          date: '2016-05-04',
          surgeryLevel: '手术等级',
          doctor: '术者',
          firstAssistant: '一助',
          secondAssistant: '二助',
          incisionLevel: '切口等级',
          healingLevel: '愈合等级',
          anesthesia: '麻醉方法',
          anesthesiologist: '麻醉医师'
        }],
        '诊断控件id': [
          {
            id: 1,
            parentId: 0,
            bse_type: '中医诊断',
            bse_categery: '入院诊断',
            bse_disease_name: '肾虚',
            bse_disease_name_desc: '病描述',
            bse_symptom_name: '症名',
            bse_symptom_name_desc: '症描述',
            open: true,
            checked: true
          }
        ],
        '血压控件id': {
          extensional: 10,  // 伸缩压
          diastolic: 21 // 舒张压
        },
        '其他控件id''值' // 这种形式
      },
      { contentXmlOrHtmlString: strings || this._instance.getContent(), paper: 'A6' }, // 传入段位html或xml字符串 或者 编辑器内容
      (payload) => {
        console.log(payload)
      }
    )
  }
}

Keywords

editor

FAQs

Package last updated on 05 Dec 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts