|
|
@@ -140,147 +140,7 @@
|
|
|
</div>
|
|
|
<div class="emr-editor"
|
|
|
:style="{marginTop: completeModeSwitch ? '10px' : 0 }">
|
|
|
- <div style="height: 30px" @mousewheel="mousewheel($event)">
|
|
|
- <el-scrollbar ref="tootScrollRef" @scroll="scroll">
|
|
|
- <div class="tool_emr">
|
|
|
- <el-select style="width: 150px;"
|
|
|
- @change="textStyleFunc.fontFamily()"
|
|
|
- v-model="emrStyle.fontFamily">
|
|
|
- <el-option v-for="item in availableFonts"
|
|
|
- :value="item.font"
|
|
|
- :label="item.text">
|
|
|
- <span :style="{'fontFamily':item.font }">
|
|
|
- {{ item.text }}
|
|
|
- </span>
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <el-select style="width: 70px;"
|
|
|
- @change="textStyleFunc.fontSize()"
|
|
|
- v-model="emrStyle.fontSize">
|
|
|
- <el-option v-for="item in fontSizes"
|
|
|
- :value="item.code"
|
|
|
- :label="item.name"/>
|
|
|
- </el-select>
|
|
|
- <el-divider direction="vertical"/>
|
|
|
- <el-button-group>
|
|
|
- <el-button @click="textStyleFunc.fontSizeAdjust('increase')"
|
|
|
- title="放大字体">
|
|
|
- +
|
|
|
- </el-button>
|
|
|
- <el-button @click="textStyleFunc.fontSizeAdjust('decrease') "
|
|
|
- title="缩小字体">
|
|
|
- -
|
|
|
- </el-button>
|
|
|
- </el-button-group>
|
|
|
- <el-divider direction="vertical"/>
|
|
|
- <el-button-group>
|
|
|
- <el-button
|
|
|
- title="字体加粗"
|
|
|
- :class="buttonClass('fontWeight','bold')"
|
|
|
- @click="textStyleFunc.fontWeight()">
|
|
|
- <i class="iconfont icon-jiacu"></i>
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- title="斜体"
|
|
|
- :class="buttonClass('fontStyle','oblique')"
|
|
|
- @click="textStyleFunc.fontStyle()">
|
|
|
- <i class="iconfont icon-xieti"></i>
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- title="下划线"
|
|
|
- :class="buttonClass('underline')"
|
|
|
- @click="textStyleFunc.underline()">
|
|
|
- <i class="iconfont icon-xiahuaxian"></i>
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- title="删除线"
|
|
|
- :class="buttonClass('lineThrough')"
|
|
|
- @click="textStyleFunc.lineThrough()">
|
|
|
- <i class="iconfont icon-shanchuxian"></i>
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- title="上标"
|
|
|
- :class="buttonClass('super')"
|
|
|
- @click="textStyleFunc.super()">
|
|
|
- <i class="iconfont icon-zitishangbiao"></i>
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- title="下标"
|
|
|
- :class="buttonClass('sub')"
|
|
|
- @click="textStyleFunc.sub()">
|
|
|
- <i class="iconfont icon-zitixiabiao"></i>
|
|
|
- </el-button>
|
|
|
- </el-button-group>
|
|
|
- <div class="color_picker"
|
|
|
- title="字体颜色">
|
|
|
- <i class="iconfont icon-zitiyanse"></i>
|
|
|
- <el-color-picker v-model="emrStyle.color"
|
|
|
- @change="textStyleFunc.color()"
|
|
|
- :predefine="predefineColors"/>
|
|
|
- </div>
|
|
|
- <div class="color_picker"
|
|
|
- title="背景颜色">
|
|
|
- <i class="iconfont icon-beijingyanse"></i>
|
|
|
- <el-color-picker v-model="emrStyle.backgroundColor"
|
|
|
- @change="textStyleFunc.backgroundColor()"
|
|
|
- :predefine="predefineColors"/>
|
|
|
- </div>
|
|
|
- <el-divider direction="vertical"/>
|
|
|
- <el-button-group>
|
|
|
- <el-popover
|
|
|
- :width="0"
|
|
|
- trigger="hover">
|
|
|
- <template #reference>
|
|
|
- <el-button title="无序列表">
|
|
|
- <i class="iconfont icon-wuxuliebiao"></i>
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- <emr-unordered-list list-type="disorder" @click-list="textStyleFunc.unorderedList"/>
|
|
|
- </el-popover>
|
|
|
- <el-popover
|
|
|
- :width="0"
|
|
|
- trigger="hover">
|
|
|
- <template #reference>
|
|
|
- <el-button title="有序列表">
|
|
|
- <i class="iconfont icon-youxuliebiao"></i>
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- <emr-unordered-list list-type="orderly" @click-list="textStyleFunc.orderedList"/>
|
|
|
- </el-popover>
|
|
|
- </el-button-group>
|
|
|
- <el-divider direction="vertical"/>
|
|
|
- <el-button-group>
|
|
|
- <el-button title="左对齐"
|
|
|
- @click="textStyleFunc.alignment('left')">
|
|
|
- <i class="iconfont icon-zuoduiqi"></i>
|
|
|
- </el-button>
|
|
|
- <el-button title="居中对其"
|
|
|
- @click="textStyleFunc.alignment('center')">
|
|
|
- <i class="iconfont icon-juzhongduiqi"></i>
|
|
|
- </el-button>
|
|
|
- <el-button title="右对齐"
|
|
|
- @click="textStyleFunc.alignment('right')">
|
|
|
- <i class="iconfont icon-youduiqi"></i>
|
|
|
- </el-button>
|
|
|
- <el-button title="两端对齐"
|
|
|
- @click="textStyleFunc.alignment('justify')">
|
|
|
- <i class="iconfont icon-zuoyouduiqi"></i>
|
|
|
- </el-button>
|
|
|
- </el-button-group>
|
|
|
- <el-divider direction="vertical"/>
|
|
|
- <el-button-group>
|
|
|
- <el-button title="增加缩进"
|
|
|
- @click="textStyleFunc.indent(1)">
|
|
|
- <i class="iconfont icon-yousuojin"></i>
|
|
|
- </el-button>
|
|
|
- <el-button title="减小缩进"
|
|
|
- @click="textStyleFunc.indent(-1)">
|
|
|
- <i class="iconfont icon-zuosuojin"></i>
|
|
|
- </el-button>
|
|
|
- </el-button-group>
|
|
|
- </div>
|
|
|
- </el-scrollbar>
|
|
|
- </div>
|
|
|
+ <EmrStyleBar ref="styleBarRef"/>
|
|
|
<div class="emr-iframe">
|
|
|
<div>
|
|
|
<el-button @click="showIframe = 1" :type="showIframe === 1 ? 'primary' : ''">正在编辑</el-button>
|
|
|
@@ -454,6 +314,8 @@ import XEUtils from 'xe-utils'
|
|
|
import {
|
|
|
EmrEditCreateLimit
|
|
|
} from "@/views/hospitalization/zhu-yuan-yi-sheng/electronic-medical-record/emr-editor/emr-edit-create-limit";
|
|
|
+import EmrStyleBar
|
|
|
+ from "@/views/hospitalization/zhu-yuan-yi-sheng/electronic-medical-record/emr-editor/components/EmrStyleBar.vue";
|
|
|
|
|
|
|
|
|
const props = defineProps({
|
|
|
@@ -526,47 +388,7 @@ const isCourse = () => {
|
|
|
return categoryCode === 'shoucibingchengjilu' || categoryCode === 'xinshengerjianhujilu';
|
|
|
}
|
|
|
|
|
|
-let emrStyle = $ref({
|
|
|
- // 字体样式
|
|
|
- fontFamily: '"Microsoft YaHei"',
|
|
|
- // 字体大小
|
|
|
- fontSize: '10.5pt',
|
|
|
- // 字体加粗
|
|
|
- fontWeight: 'normal',
|
|
|
- // 斜体
|
|
|
- fontStyle: 'normal',
|
|
|
- // 下划线
|
|
|
- underline: false,
|
|
|
- //删除线
|
|
|
- lineThrough: false,
|
|
|
- // 上标
|
|
|
- super: false,
|
|
|
- // 下标
|
|
|
- sub: false,
|
|
|
- // 颜色
|
|
|
- color: '',
|
|
|
- backgroundColor: '',
|
|
|
- paragraphStyle: {}
|
|
|
-})
|
|
|
-
|
|
|
-const predefineColors = ref([
|
|
|
- '#ff4500',
|
|
|
- '#ff8c00',
|
|
|
- '#ffd700',
|
|
|
- '#90ee90',
|
|
|
- '#00ced1',
|
|
|
- '#1e90ff',
|
|
|
- '#c71585',
|
|
|
- 'rgba(255, 69, 0, 0.68)',
|
|
|
- 'rgb(255, 120, 0)',
|
|
|
- 'hsv(51, 100, 98)',
|
|
|
- 'hsva(120, 40, 94, 0.5)',
|
|
|
- 'hsl(181, 100%, 37%)',
|
|
|
- 'hsla(209, 100%, 56%, 0.73)',
|
|
|
- '#c7158577',
|
|
|
-])
|
|
|
-
|
|
|
-let autoSave = $ref(true)
|
|
|
+let autoSave = $ref(!isDev)
|
|
|
|
|
|
const emrMainWidth = () => {
|
|
|
if (showIframe.value === 3) {
|
|
|
@@ -586,8 +408,7 @@ const emrMainWidth = () => {
|
|
|
|
|
|
const emrEvent = {
|
|
|
'loaded': async (event) => {
|
|
|
- // await 判断可否创建或编辑()
|
|
|
- editor = currentEmr.value.getEditor()
|
|
|
+ setEditor()
|
|
|
loaded = false
|
|
|
// 获取医生等级
|
|
|
doctorLevelFunc()
|
|
|
@@ -626,21 +447,11 @@ const emrEvent = {
|
|
|
},
|
|
|
|
|
|
'contextUpdate': (evt, contextMap, component, context) => {
|
|
|
- emrStyle.fontSize = context.fontSize
|
|
|
- emrStyle.fontFamily = context.fontFamily
|
|
|
- emrStyle.fontStyle = context.italic ? 'oblique' : 'normal'
|
|
|
- emrStyle.fontWeight = context.bold ? 'bold' : 'normal'
|
|
|
- emrStyle.underline = context.underline
|
|
|
- emrStyle.lineThrough = context.linethrough
|
|
|
- emrStyle.super = context.superScript
|
|
|
- emrStyle.sub = context.subScript
|
|
|
- emrStyle.color = context.color
|
|
|
- emrStyle.backgroundColor = context.backgroundColor
|
|
|
- emrStyle.paragraphStyle = context.paragraphStyle
|
|
|
+ styleBarRef.value.setEmrStyleV2(context)
|
|
|
},
|
|
|
|
|
|
'ready': (event) => {
|
|
|
- editor = currentEmr.value.getEditor()
|
|
|
+ setEditor()
|
|
|
popupFunc.setShortcutKey()
|
|
|
rightClickOnRegistration()
|
|
|
},
|
|
|
@@ -1047,7 +858,6 @@ const clickSnippet = async ({content, styles, code}) => {
|
|
|
// 移动到文档结尾
|
|
|
editor.setCursor('DOCUMENT_END');
|
|
|
editor.scrollToCursor()
|
|
|
- console.log(data)
|
|
|
let insertContent = {
|
|
|
// 内容
|
|
|
value: content,
|
|
|
@@ -1057,7 +867,6 @@ const clickSnippet = async ({content, styles, code}) => {
|
|
|
// 就是在这里填充的值
|
|
|
defaultData: data,
|
|
|
}
|
|
|
- console.log(insertContent)
|
|
|
editor.setRevisionMode('off')
|
|
|
editor.execute("insertContents", insertContent);
|
|
|
if (isReadonly) {
|
|
|
@@ -1230,13 +1039,12 @@ const deleteDataElement = () => {
|
|
|
// 重新设置提取的数据, 这里是强制替换
|
|
|
const reQueryPatientInformation = () => {
|
|
|
// 如果不是是编辑状态
|
|
|
- if (!emrConfig.value.editor) return
|
|
|
+ if (!emrConfig.value.editor) return;
|
|
|
// 如果是只读模式就不触发这个
|
|
|
- if (!readonlyPattern()) {
|
|
|
- // 如果没有文档 id 就说明是
|
|
|
- if (documentId && extractData) {
|
|
|
- editor.setValues(extractData, true, true)
|
|
|
- }
|
|
|
+ if (readonlyPattern()) return;
|
|
|
+ // 如果没有文档 id 就说明是新建的，extractData如果是空就不用调用，不然他会使用 getAppContext 里面的数据
|
|
|
+ if (documentId && extractData) {
|
|
|
+ editor.setValues(extractData, true, true)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -1373,101 +1181,7 @@ const paginationSymbol = () => {
|
|
|
editor.execute('insertContents', {value: [{type: 'pagebreak'}]})
|
|
|
}
|
|
|
|
|
|
-const textStyleFunc = ref({
|
|
|
- fontSizeAdjust: (val) => {
|
|
|
- editor.execute('fontSizeAdjust', {value: val})
|
|
|
- },
|
|
|
- fontFamily: () => {
|
|
|
- editor.execute('fontFamily', {value: emrStyle.fontFamily})
|
|
|
- editor.focus()
|
|
|
- },
|
|
|
- fontSize: () => {
|
|
|
- editor.execute('fontSize', {value: emrStyle.fontSize})
|
|
|
- editor.focus()
|
|
|
- },
|
|
|
- fontWeight: () => {
|
|
|
- let val = emrStyle.fontWeight === 'normal' ? 'bold' : 'normal'
|
|
|
- emrStyle.fontWeight = val
|
|
|
- editor.execute('fontWeight', {value: val})
|
|
|
- editor.focus()
|
|
|
- },
|
|
|
- fontStyle: () => {
|
|
|
- let val = emrStyle.fontStyle === 'normal' ? 'oblique' : 'normal'
|
|
|
- emrStyle.fontStyle = val
|
|
|
- editor.execute('fontStyle', {value: val})
|
|
|
- editor.focus()
|
|
|
- },
|
|
|
- underline: () => {
|
|
|
- emrStyle.underline = !emrStyle.underline
|
|
|
- let value = emrStyle.underline ? 'underline' : 'remove underline'
|
|
|
- editor.execute('textDecoration', {value})
|
|
|
- },
|
|
|
- lineThrough: () => {
|
|
|
- emrStyle.lineThrough = !emrStyle.lineThrough
|
|
|
- let value = emrStyle.lineThrough ? 'line-through' : 'remove line-through'
|
|
|
- editor.execute('textDecoration', {value})
|
|
|
- },
|
|
|
- super: () => {
|
|
|
- emrStyle.super = !emrStyle.super
|
|
|
- let value = emrStyle.super ? 'super' : 'baseline'
|
|
|
- editor.execute('verticalAlign', {value})
|
|
|
- },
|
|
|
- sub: () => {
|
|
|
- emrStyle.sub = !emrStyle.sub
|
|
|
- let value = emrStyle.sub ? 'sub' : 'baseline'
|
|
|
- editor.execute('verticalAlign', {value})
|
|
|
- },
|
|
|
- color: () => {
|
|
|
- editor.execute('color', {value: emrStyle.color})
|
|
|
- },
|
|
|
- backgroundColor: () => {
|
|
|
- editor.execute('backgroundColor', {value: emrStyle.backgroundColor})
|
|
|
- },
|
|
|
- alignment: (val) => {
|
|
|
- editor.execute('textAlign', {value: val})
|
|
|
- },
|
|
|
- unorderedList: (val) => {
|
|
|
- if (val === null) {
|
|
|
- editor.execute("nonList", {
|
|
|
- value: "none"
|
|
|
- })
|
|
|
- }
|
|
|
- editor.execute('symbolList', {"value": val})
|
|
|
- },
|
|
|
- orderedList: (val) => {
|
|
|
- if (val === null) {
|
|
|
- editor.execute("nonList", {
|
|
|
- value: "none"
|
|
|
- })
|
|
|
- }
|
|
|
- //设置有序列表
|
|
|
- editor.execute('orderList', {"value": val})
|
|
|
- },
|
|
|
- indent: (val) => {
|
|
|
- emrStyle.paragraphStyle.paragraphIndent.left += val
|
|
|
- editor.execute('paragraphStyle', {value: emrStyle.paragraphStyle})
|
|
|
- }
|
|
|
-})
|
|
|
-
|
|
|
-const scroll = ({scrollLeft: left, scrollTop}) => {
|
|
|
- scrollLeft = left
|
|
|
-}
|
|
|
-
|
|
|
-const tootScrollRef = ref(null)
|
|
|
-let scrollLeft = 0
|
|
|
-const mousewheel = (e) => {
|
|
|
- let eventDelta = -e.wheelDelta || -e.deltaY * 40;
|
|
|
- tootScrollRef.value?.setScrollLeft(scrollLeft + eventDelta);
|
|
|
-}
|
|
|
-
|
|
|
-const buttonClass = (val, activation = true) => {
|
|
|
- if (emrStyle[val] === activation) {
|
|
|
- return 'emr__button_select'
|
|
|
- } else {
|
|
|
- return 'button'
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
+const styleBarRef = ref(null)
|
|
|
|
|
|
/**
|
|
|
* 解析 iframe 上面的参数保证一致
|
|
|
@@ -1601,7 +1315,6 @@ onMounted(async () => {
|
|
|
}
|
|
|
})
|
|
|
|
|
|
-
|
|
|
autoSaveFunc()
|
|
|
|
|
|
emrMitt.on('editor', () => {
|
|
|
@@ -1628,7 +1341,6 @@ onMounted(async () => {
|
|
|
document.title = `电子病历-正在编辑【${props.huanZheXinXi.name}】`
|
|
|
}
|
|
|
}, {immediate: true})
|
|
|
-
|
|
|
})
|
|
|
|
|
|
onDeactivated(() => {
|
|
|
@@ -1811,100 +1523,9 @@ function changeRatio() {
|
|
|
return ratio;
|
|
|
}
|
|
|
|
|
|
-let backToQC = {
|
|
|
- "id": 1,
|
|
|
- "name": "",
|
|
|
- "code": "",
|
|
|
- "thePromptWasNotCreated": "",
|
|
|
- "editThePromptStatement": "",
|
|
|
- "level1DoctorCreatesATimeLimit": 0,
|
|
|
- "level1DoctorEditingTimeLimit": 0,
|
|
|
- "theSeniorDoctorCreatesATimeLimit": 0,
|
|
|
- "sqlId": 0,
|
|
|
- "sql": "",
|
|
|
- "sqlName": "",
|
|
|
- "open": 1,
|
|
|
- "timeSubtracts": 74
|
|
|
-}
|
|
|
-
|
|
|
-/**
|
|
|
- * 现在有两个特殊病历
|
|
|
- * 入院病历需要填写补充诊断
|
|
|
- * 病程记录锁住
|
|
|
- */
|
|
|
-const 判断可否创建或编辑 = async () => {
|
|
|
- backToQC = null
|
|
|
- 规则不可编辑 = false
|
|
|
- if (typeof props.huanZheXinXi.dischargeDays !== 'undefined'
|
|
|
- && props.huanZheXinXi.dischargeDays > 7) {
|
|
|
- return
|
|
|
- }
|
|
|
- let data = {
|
|
|
- code: categoryCode,
|
|
|
- documentId,
|
|
|
- patNo: props.huanZheXinXi.inpatientNo,
|
|
|
- times: props.huanZheXinXi.admissTimes,
|
|
|
- userCode: userData.code
|
|
|
- }
|
|
|
- try {
|
|
|
- backToQC = await createAnEdit(data)
|
|
|
- if (stringIsBlank(documentId)) {
|
|
|
- 可否创建()
|
|
|
- } else {
|
|
|
- 可否编辑()
|
|
|
- }
|
|
|
- } catch {
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-const 可否创建 = () => {
|
|
|
- if (backToQC === null) return
|
|
|
- let 时限 = doctorLevel === 1 ? backToQC.level1DoctorCreatesATimeLimit : backToQC.theSeniorDoctorCreatesATimeLimit;
|
|
|
- if (backToQC.timeSubtracts > 时限) {
|
|
|
- let str = `<span style="color: red">${backToQC.thePromptWasNotCreated}</span>
|
|
|
- 医务部通过审核后，方可创建病历。`
|
|
|
- ElMessageBox.prompt(str, '提示', {
|
|
|
- type: "warning",
|
|
|
- closeOnPressEscape: false,
|
|
|
- closeOnClickModal: false,
|
|
|
- inputValidator: (val) => {
|
|
|
- if (XEUtils.isEmpty(val)) {
|
|
|
- return false;
|
|
|
- }
|
|
|
- if (val === null || val.length < 1 || val.length > 50) {
|
|
|
- return false;
|
|
|
- }
|
|
|
- },
|
|
|
- dangerouslyUseHTMLString: true,
|
|
|
- inputErrorMessage: '不能为空，最多可输入50个字符。',
|
|
|
- }).then(({value}) => {
|
|
|
- let data = {
|
|
|
- inputRemark: value,
|
|
|
- code: categoryCode,
|
|
|
- patNo: props.huanZheXinXi.inpatientNo,
|
|
|
- times: props.huanZheXinXi.admissTimes,
|
|
|
- flag: 0
|
|
|
- }
|
|
|
- reqUnlock(data)
|
|
|
- }).catch(() => {
|
|
|
-
|
|
|
- }).finally(() => {
|
|
|
- emptyEditor()
|
|
|
- })
|
|
|
- throw new Error('')
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-let 规则不可编辑 = false
|
|
|
-const 可否编辑 = () => {
|
|
|
- if (backToQC === null) return
|
|
|
- if (doctorLevel === 1) {
|
|
|
- let 时限 = backToQC.level1DoctorEditingTimeLimit
|
|
|
- if (backToQC.timeSubtracts > 时限) {
|
|
|
- 规则不可编辑 = true
|
|
|
- ElMessage.error(backToQC.editThePromptStatement)
|
|
|
- }
|
|
|
- }
|
|
|
+const setEditor = () => {
|
|
|
+ editor = currentEmr.value.getEditor()
|
|
|
+ styleBarRef.value.setEditor(editor)
|
|
|
}
|
|
|
|
|
|
defineExpose({
|
|
|
@@ -1931,33 +1552,11 @@ defineExpose({
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
-.emr__button_select {
|
|
|
- border: 1px solid #a0a0a0;
|
|
|
- font-size: 14px;
|
|
|
-}
|
|
|
-
|
|
|
.button {
|
|
|
border: 1px solid transparent;
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
|
|
|
-.tool_emr {
|
|
|
- width: max-content;
|
|
|
- height: 30px;
|
|
|
- background-color: #f0f0f0;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-
|
|
|
-.color_picker {
|
|
|
- &:hover {
|
|
|
- cursor: pointer;
|
|
|
- color: #409EFF;
|
|
|
- }
|
|
|
-
|
|
|
- background-color: white;
|
|
|
-}
|
|
|
-
|
|
|
.emr-template-open {
|
|
|
width: 215px;
|
|
|
background-color: white;
|
