nicky
5 months ago
59 changed files with 80273 additions and 12227 deletions
File diff suppressed because it is too large
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 888 KiB |
|
After Width: | Height: | Size: 5.9 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 5.8 KiB |
@ -0,0 +1,288 @@ |
|||
<template> |
|||
<div style="width: 100%; height: 100%"> |
|||
<div id="dicomImage"></div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
// 加载相关库文件 |
|||
import cornerstone from './dist/cornerstone.js'; |
|||
import cornerstoneTools from './dist/cornerstoneTools'; |
|||
import cornerstoneWADOImageLoader from './dist/cornerstoneWADOImageLoader.bundle.min'; |
|||
import Hammer from './dist/hammer'; |
|||
import dicomParser from './dist/dicomParser.min'; |
|||
import cornerstoneMath from './dist/cornerstoneMath.min'; |
|||
|
|||
export default { |
|||
name: 'dcmview', |
|||
props: { |
|||
currentDcm: { |
|||
type: Array, |
|||
default: [], |
|||
}, |
|||
imgurl: { |
|||
type: String, |
|||
default: '', |
|||
}, |
|||
toolType: { |
|||
type: String, |
|||
default: '', |
|||
}, |
|||
width: { |
|||
type: String, |
|||
default: '750rpx', |
|||
}, |
|||
height: { |
|||
type: String, |
|||
default: '1000rpx', |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
imageIds: [], |
|||
}; |
|||
}, |
|||
watch: { |
|||
toolType: { |
|||
handler(newVal, lodVal) { |
|||
console.log(newVal, lodVal); |
|||
this.viewDcm1(); |
|||
}, |
|||
}, |
|||
currentDcm: { |
|||
handler(newVal, lodVal) { |
|||
console.log('newVal', newVal); |
|||
this.handleDcm(newVal); |
|||
}, |
|||
}, |
|||
}, |
|||
mounted() { |
|||
console.log(11111111, '1212'); |
|||
this.handleDcm(this.currentDcm); |
|||
console.log(11111111, this.currentDcm); |
|||
}, |
|||
|
|||
methods: { |
|||
// 处理获取图像数组 |
|||
async handleDcm(_Arr) { |
|||
let that = this; |
|||
this.imageIds = []; |
|||
await _Arr.forEach((item) => { |
|||
this.imageIds.push('dicomweb:' + item.dcmPath); |
|||
}); |
|||
this.viewDcm(); |
|||
}, |
|||
// 显示dcm图片函数 |
|||
viewDcm() { |
|||
cornerstoneTools.external.cornerstone = cornerstone; |
|||
cornerstoneTools.external.cornerstoneMath = cornerstoneMath; |
|||
cornerstoneTools.external.Hammer = Hammer; |
|||
cornerstoneWADOImageLoader.external.dicomParser = dicomParser; |
|||
cornerstoneWADOImageLoader.external.cornerstone = cornerstone; |
|||
cornerstoneWADOImageLoader.webWorkerManager.initialize({ |
|||
maxWebWorkers: navigator.hardwareConcurrency || 1, |
|||
startWebWorkersOnDemand: true, |
|||
taskConfiguration: { |
|||
decodeTask: { |
|||
initializeCodecsOnStartup: false, |
|||
}, |
|||
}, |
|||
webWorkerPath: './dist/cornerstoneWADOImageLoader.bundleCopy.min.js', |
|||
}); |
|||
cornerstoneTools.init({ |
|||
mouseEnabled: true, //触摸 |
|||
touchEnabled: true, //鼠标 |
|||
showSVGCursors: true, |
|||
autoResizeViewports: true, |
|||
}); |
|||
const element = document.getElementById('dicomImage'); |
|||
|
|||
cornerstone.enable(element); |
|||
|
|||
// const PanTool = cornerstoneTools.PanTool; |
|||
|
|||
const StackScrollTool = cornerstoneTools.StackScrollTool; |
|||
const StackScrollMouseWheelTool = |
|||
cornerstoneTools.StackScrollMouseWheelTool; |
|||
const imageIds = this.imageIds; |
|||
const stack = { |
|||
currentImageIdIndex: 0, |
|||
imageIds: imageIds, |
|||
}; |
|||
console.log('imageIds', imageIds); |
|||
element.addEventListener('cornerstonenewimage', (event) => { |
|||
console.log('event: ', event); |
|||
// console.log(event.detail.oldImage, stack.currentImageIdIndex, 'event') |
|||
this.hanldeByValue(stack.currentImageIdIndex); |
|||
}); |
|||
element.addEventListener('cornerstonetap', (event) => { |
|||
console.log('cornerstonetap: ', cornerstonetap); |
|||
const direction = event.detail.direction; |
|||
if (direction === 'LEFT') { |
|||
// 向左划动 |
|||
stack.currentImageIdIndex++; |
|||
} else if (direction === 'RIGHT') { |
|||
// 向右划动 |
|||
stack.currentImageIdIndex--; |
|||
} |
|||
|
|||
// 更新堆栈中的当前图像 |
|||
const imageIds = stack.imageIds; |
|||
const newImageIdIndex = stack.currentImageIdIndex; |
|||
const newImageId = imageIds[newImageIdIndex]; |
|||
cornerstone |
|||
.loadAndCacheImage(newImageId) |
|||
.then((loadedImage) => { |
|||
cornerstone.displayImage(element, loadedImage); |
|||
}); |
|||
}); |
|||
console.log('imageIds,', imageIds) |
|||
cornerstone.loadImage(imageIds[0]).then((image) => { |
|||
console.log(image, 'image'); |
|||
cornerstone.displayImage(element, image); |
|||
cornerstoneTools.addStackStateManager(element, ['stack']); |
|||
cornerstoneTools.addToolState(element, 'stack', stack); |
|||
// cornerstoneTools.addTool(PanTool); |
|||
cornerstoneTools.addTool(StackScrollTool, { |
|||
configuration: { |
|||
loop: true, |
|||
allowSkipping: true, |
|||
}, |
|||
}); |
|||
cornerstoneTools.addTool(StackScrollMouseWheelTool, { |
|||
configuration: { |
|||
loop: true, |
|||
allowSkipping: true, |
|||
invert: false, |
|||
}, |
|||
}); |
|||
// cornerstoneTools.setToolActive('Pan', { mouseButtonMask: 1 }); |
|||
cornerstoneTools.setToolActive('StackScroll', { |
|||
mouseButtonMask: 1, |
|||
}); |
|||
cornerstoneTools.setToolActive('StackScrollMouseWheel', { |
|||
mouseButtonMask: 4, |
|||
}); |
|||
}); |
|||
}, |
|||
// 显示dcm图片函数 |
|||
viewDcm1() { |
|||
var element = document.getElementById('dicomImage'); |
|||
//激活获取到的用于图片加载的区域 |
|||
console.log('this.toolType: ', this.toolType); |
|||
switch (this.toolType) { |
|||
case 'ScrollTool': |
|||
const StackScrollTool = cornerstoneTools.StackScrollTool; |
|||
const StackScrollMouseWheelTool = |
|||
cornerstoneTools.StackScrollMouseWheelTool; |
|||
cornerstoneTools.addTool(StackScrollTool, { |
|||
configuration: { |
|||
loop: true, |
|||
allowSkipping: true, |
|||
}, |
|||
}); |
|||
cornerstoneTools.addTool(StackScrollMouseWheelTool, { |
|||
configuration: { |
|||
loop: true, |
|||
allowSkipping: true, |
|||
invert: false, |
|||
}, |
|||
}); |
|||
// cornerstoneTools.setToolActive('Pan', { mouseButtonMask: 1 }); |
|||
cornerstoneTools.setToolActive('StackScroll', { |
|||
mouseButtonMask: 1, |
|||
}); |
|||
cornerstoneTools.setToolActive('StackScrollMouseWheel', { |
|||
mouseButtonMask: 4, |
|||
}); |
|||
break; |
|||
case 'Wwwc': |
|||
// 从cornerstoneTools库中获取窗宽,窗高工具 |
|||
const WwwcTool = cornerstoneTools.WwwcTool; |
|||
//添加WwwcTool窗宽,窗高工具 |
|||
cornerstoneTools.addTool(WwwcTool); |
|||
// 绑定工具操作功能到鼠标左键 |
|||
cornerstoneTools.setToolActive('Wwwc', { |
|||
mouseButtonMask: 1, |
|||
}); |
|||
break; |
|||
case 'Angle': |
|||
// 角度工具 |
|||
const AngleTool = cornerstoneTools.AngleTool; |
|||
cornerstoneTools.addTool(AngleTool); |
|||
cornerstoneTools.setToolActive('Angle', { |
|||
mouseButtonMask: 1, |
|||
}); |
|||
break; |
|||
case 'RectangleRoi': |
|||
// 矩形Roi工具 |
|||
const RectangleRoiTool = cornerstoneTools.RectangleRoiTool; |
|||
cornerstoneTools.addTool(RectangleRoiTool); |
|||
cornerstoneTools.setToolActive('RectangleRoi', { |
|||
mouseButtonMask: 1, |
|||
}); |
|||
break; |
|||
case 'DragProbe': |
|||
// 拖动探针工具 |
|||
const DragProbeTool = cornerstoneTools.DragProbeTool; |
|||
cornerstoneTools.addTool(DragProbeTool); |
|||
cornerstoneTools.setToolActive('DragProbe', { |
|||
mouseButtonMask: 1, |
|||
}); |
|||
break; |
|||
case 'Length': |
|||
// 长度工具 |
|||
const LengthTool = cornerstoneTools.LengthTool; |
|||
cornerstoneTools.addTool(LengthTool); |
|||
cornerstoneTools.setToolActive('Length', { |
|||
mouseButtonMask: 1, |
|||
}); |
|||
break; |
|||
case 'Zoom': |
|||
// 放大缩小 |
|||
const ZoomMouseWheelTool = |
|||
cornerstoneTools.ZoomMouseWheelTool; |
|||
cornerstoneTools.addTool(ZoomMouseWheelTool); |
|||
cornerstoneTools.setToolActive('ZoomMouseWheel', { |
|||
mouseButtonMask: 1, |
|||
}); |
|||
break; |
|||
case 'eliminate': |
|||
// 清空效果 |
|||
cornerstoneTools.clearToolState(element, 'Length'); |
|||
break; |
|||
default: |
|||
throw new Error('工具参数错误'); |
|||
break; |
|||
} |
|||
}, |
|||
clearAllTool() { |
|||
for (let k in this.name) { |
|||
cornerstoneTools.clearToolState(this.element, this.name[k]); |
|||
} |
|||
// 写了他才能让界面也更新清除了tool的视图 |
|||
cornerstone.updateImage(this.element); |
|||
// reset viewport将视图重置位置 |
|||
cornerstone.reset(this.element); |
|||
}, |
|||
// 给父组件传值 |
|||
hanldeByValue(_index) { |
|||
this.$emit('byValue', _index); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style> |
|||
/* 定义图片显示区域div大小 */ |
|||
#dicomImage { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
.btn { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
flex-wrap: wrap; |
|||
} |
|||
</style> |
|||
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,3 @@ |
|||
/*! cornerstone-web-image-loader - 2.1.1 - 2018-12-05 | (c) 2016 Chris Hafey | https://github.com/cornerstonejs/cornerstoneWebImageLoader */ |
|||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("cornerstoneWebImageLoader",[],t):"object"==typeof exports?exports.cornerstoneWebImageLoader=t():e.cornerstoneWebImageLoader=t()}(window,function(){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},n.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=5)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.external=void 0;var r,o=n(4),a=(r=o)&&r.__esModule?r:{default:r};var u=void 0,i={set cornerstone(e){u=e,(0,a.default)(u)},get cornerstone(){return u}};t.external=i},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.loadImage=function(e){var t=r.external.cornerstone,n=new XMLHttpRequest;return n.open("GET",e,!0),n.responseType="arraybuffer",i.beforeSend(n),n.onprogress=function(n){if(n.lengthComputable){var r=n.loaded,o=n.total,a=Math.round(r/o*100),u={imageId:e,loaded:r,total:o,percentComplete:a};t.triggerEvent(t.events,"cornerstoneimageloadprogress",u)}},{promise:new Promise(function(t,r){n.onload=function(){(0,o.default)(this.response).then(function(n){var r=(0,a.default)(n,e);t(r)},r)},n.send()}),cancelFn:function(){n.abort()}}},t.configure=function(e){i=e};var r=n(0),o=u(n(3)),a=u(n(2));function u(e){return e&&e.__esModule?e:{default:e}}var i={beforeSend:function(){}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e,t){var n=e.naturalHeight,u=e.naturalWidth;return{imageId:t,minPixelValue:0,maxPixelValue:255,slope:1,intercept:0,windowCenter:128,windowWidth:255,render:r.external.cornerstone.renderWebImage,getPixelData:function(){return(n=void 0,a===t?n=o.getContext("2d"):(o.height=e.naturalHeight,o.width=e.naturalWidth,(n=o.getContext("2d")).drawImage(e,0,0),a=t),n.getImageData(0,0,e.naturalWidth,e.naturalHeight)).data;var n},getCanvas:function(){return a===t?o:(o.height=e.naturalHeight,o.width=e.naturalWidth,o.getContext("2d").drawImage(e,0,0),a=t,o)},getImage:function(){return e},rows:n,columns:u,height:n,width:u,color:!0,rgba:!1,columnPixelSpacing:void 0,rowPixelSpacing:void 0,invert:!1,sizeInBytes:n*u*4}};var r=n(0),o=document.createElement("canvas"),a=void 0},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){return new Promise(function(t,n){var r=new Image,o=new Uint8Array(e),a=new Blob([o]),u=window.URL||window.webkitURL,i=u.createObjectURL(a);r.src=i,r.onload=function(){t(r),u.revokeObjectURL(i)},r.onerror=function(e){u.revokeObjectURL(i),n(e)}})}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){e.registerImageLoader("http",r.loadImage),e.registerImageLoader("https",r.loadImage)};var r=n(1)},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.external=t.configure=t.loadImage=t.createImage=t.arrayBufferToImage=void 0;var r=i(n(3)),o=i(n(2)),a=n(1),u=n(0);function i(e){return e&&e.__esModule?e:{default:e}}var d={arrayBufferToImage:r.default,createImage:o.default,loadImage:a.loadImage,configure:a.configure,external:u.external};t.arrayBufferToImage=r.default,t.createImage=o.default,t.loadImage=a.loadImage,t.configure=a.configure,t.external=u.external,t.default=d}])}); |
|||
//# sourceMappingURL=cornerstoneWebImageLoader.min.js.map
|
|||
File diff suppressed because it is too large
File diff suppressed because it is too large
@ -0,0 +1,11 @@ |
|||
{ |
|||
"name": "dcmview", |
|||
"version": "1.1.0", |
|||
"description": "基于cornerstone.js的前端预览dicom医学影像组件", |
|||
"main": "index.js", |
|||
"scripts": { |
|||
"test": "echo \"Error: no test specified\" && exit 1" |
|||
}, |
|||
"author": "", |
|||
"license": "ISC" |
|||
} |
|||
@ -0,0 +1,64 @@ |
|||
<template> |
|||
<a-modal class="" width="80%" :maskClosable="false" destroyOnClose v-model="visible" :title="title" :footer="null" |
|||
@cancel="close"> |
|||
<a-card :tab-list="tabList" :active-tab-key="activeKey" @tabChange="key => onTabChange(key)"> |
|||
<div style="height: calc(100vh - 25vw); width: 100%; overflow-y: auto;"> |
|||
<throm-result-baseInfo v-if="activeKey == 'base'" :patientId="patientId"></throm-result-baseInfo> |
|||
<throm-result-firstInfo v-else-if="activeKey == 'first'" :patientId="patientId"></throm-result-firstInfo> |
|||
</div> |
|||
</a-card> |
|||
|
|||
</a-modal> |
|||
</template> |
|||
|
|||
<script> |
|||
import ThromResultBaseInfo from "@/views/thrombolysis/components/throm-result-baseInfo.vue" |
|||
import ThromResultFirstInfo from "@/views/thrombolysis/components/throm-result-firstInfo.vue" |
|||
export default { |
|||
name: 'DocDetail', |
|||
components: { |
|||
ThromResultBaseInfo, |
|||
ThromResultFirstInfo |
|||
}, |
|||
data() { |
|||
return { |
|||
title: "患者详情", |
|||
patientId: '', |
|||
visible: false, |
|||
activeKey: "base", |
|||
tabList: [{ |
|||
key: 'base', |
|||
tab: '患者基本信息', |
|||
}, |
|||
{ |
|||
key: 'first', |
|||
tab: '急救信息记录', |
|||
}, |
|||
], |
|||
} |
|||
}, |
|||
created() { |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
open(data) { |
|||
this.patientId = data.firstAidId |
|||
this.visible = true; |
|||
|
|||
}, |
|||
close() { |
|||
console.log('close') |
|||
this.patientId = undefined; |
|||
this.activeKey = "base"; |
|||
this.visible = false; |
|||
}, |
|||
onTabChange(key) { |
|||
this.activeKey = key; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
@ -0,0 +1,700 @@ |
|||
<template> |
|||
<div class="Overviewbasicr"> |
|||
<div class="first-content"> |
|||
<!-- <v-head text="主要治疗操作"></v-head> --> |
|||
<div class="basicr-back" style="background-color: transparent;"> |
|||
<a-form class="detail-form" :form="firstForm"> |
|||
<a-form-item |
|||
class="jmrs-form-item" |
|||
v-for="(k, v) in JMRS_CODE" |
|||
:key="v" |
|||
v-if="computeShow(v, codeForm)" |
|||
> |
|||
<!-- operate === collapse --> |
|||
<a-collapse |
|||
class="jmrs-form-item-con" |
|||
v-if="k.operate === 'collapse'" |
|||
:bordered="false" |
|||
expandIconPosition="right" |
|||
> |
|||
<a-collapse-panel |
|||
key="1" |
|||
:header="k.operateData.text" |
|||
> |
|||
<div |
|||
class="collapse-content" |
|||
v-for="item in k.operateData.code" |
|||
:key="item" |
|||
> |
|||
<div |
|||
class="content-left ant-form-item-label" |
|||
> |
|||
<label |
|||
:for="`FirstInfo_${JMRS_CODE[item]}`" |
|||
v-if="JMRS_CODE[item].text" |
|||
> |
|||
{{ `${JMRS_CODE[item].text}` }} |
|||
<span |
|||
v-if=" |
|||
JMRS_CODE[item].description |
|||
" |
|||
class="label-info" |
|||
>{{ |
|||
JMRS_CODE[item].description |
|||
}}</span |
|||
> |
|||
</label> |
|||
</div> |
|||
<div class="content-right"> |
|||
<!-- input --> |
|||
<a-input |
|||
:disabled="writeAble" |
|||
v-if=" |
|||
JMRS_CODE[item].type === 'input' |
|||
" |
|||
:type="item.inputType" |
|||
v-decorator="[item]" |
|||
@blur=" |
|||
handleChange( |
|||
$event.target.value, |
|||
v |
|||
) |
|||
" |
|||
placeholder="请输入" |
|||
/> |
|||
<!-- pageText --> |
|||
<a-input |
|||
:disabled="writeAble" |
|||
v-if=" |
|||
JMRS_CODE[item].type === |
|||
'pageText' |
|||
" |
|||
@blur=" |
|||
handleChange( |
|||
$event.target.value, |
|||
item |
|||
) |
|||
" |
|||
:type="item.inputType" |
|||
v-decorator="[item]" |
|||
placeholder="请输入" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</a-collapse-panel> |
|||
</a-collapse> |
|||
<!-- operate === jump --> |
|||
<div |
|||
v-else-if="k.operate === 'jump'" |
|||
class="jmrs-form-item-con" |
|||
> |
|||
<div |
|||
class="content-left ant-form-item-label" |
|||
v-if="k.text" |
|||
> |
|||
<label :for="`FirstInfo_${v}`"> |
|||
{{ `${k.text}` }} |
|||
<span |
|||
v-if="k.description" |
|||
class="label-info" |
|||
>{{ k.description }}</span |
|||
> |
|||
</label> |
|||
</div> |
|||
<div |
|||
class="content-right" |
|||
@click="toMore(k.path.name)" |
|||
> |
|||
<div class="operate fz24"> |
|||
{{ k.rightText }} |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="jmrs-form-item-con" v-else :class="k.type"> |
|||
<div class="content-left ant-form-item-label"> |
|||
<label :for="`FirstInfo_${v}`" v-if="k.text"> |
|||
{{ `${k.text}` }} |
|||
<span |
|||
v-if="k.description" |
|||
class="label-info" |
|||
>{{ k.description }}</span |
|||
> |
|||
</label> |
|||
</div> |
|||
<div class="content-right"> |
|||
<!-- text --> |
|||
<a-input |
|||
:disabled="writeAble" |
|||
v-if="k.type === 'text'" |
|||
type="text" |
|||
v-decorator="[v]" |
|||
readOnly |
|||
/> |
|||
<!-- modal --> |
|||
<a-input |
|||
:disabled="writeAble" |
|||
v-if="k.type === 'modal'" |
|||
:placeholder="k.rightText" |
|||
@click="toInform" |
|||
type="text" |
|||
v-decorator="[v]" |
|||
readOnly |
|||
/> |
|||
<!-- radio --> |
|||
<a-radio-group |
|||
:disabled="writeAble" |
|||
v-if="k.type === 'radio'" |
|||
v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" |
|||
@change=" |
|||
handleChange($event.target.value, v) |
|||
" |
|||
> |
|||
<a-radio |
|||
v-for="(item, index) in k.range" |
|||
:key="item" |
|||
:value="item" |
|||
> |
|||
{{ item }} |
|||
</a-radio> |
|||
</a-radio-group> |
|||
<!-- checkbox --> |
|||
<a-checkbox-group |
|||
:disabled="writeAble" |
|||
v-if="k.type === 'checkbox'" |
|||
:options="k.range" |
|||
v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" |
|||
@change=" |
|||
handleChange($event, v, null, k.type) |
|||
" |
|||
/> |
|||
<!-- input --> |
|||
<a-input |
|||
:disabled="writeAble" |
|||
v-if="k.type === 'input'" |
|||
:type="k.inputType" |
|||
v-decorator="[v]" |
|||
@blur="handleChange($event.target.value, v)" |
|||
placeholder="请输入" |
|||
/> |
|||
<!-- datetime --> |
|||
<a-input |
|||
:disabled="writeAble" |
|||
v-if="k.type === 'datetime'" |
|||
readOnly |
|||
@click="selectOption(v)" |
|||
v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" |
|||
placeholder="请选择" |
|||
/> |
|||
<a-select |
|||
:disabled="writeAble" |
|||
v-if="k.type === 'select'" |
|||
v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" |
|||
@change="handleChange($event, v)" |
|||
placeholder="请选择" |
|||
style="display: block;" |
|||
> |
|||
<a-select-option |
|||
v-for="(item, v) in k.range" |
|||
:key="item" |
|||
> |
|||
{{ item }} |
|||
</a-select-option> |
|||
</a-select> |
|||
<!-- pageText --> |
|||
<a-input |
|||
:disabled="writeAble" |
|||
v-if="k.type === 'pageText'" |
|||
@blur="handleChange($event.target.value, v)" |
|||
v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" |
|||
placeholder="请输入" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</a-form-item> |
|||
|
|||
</a-form> |
|||
</div> |
|||
|
|||
<div class="common-picker"> |
|||
<van-datetime-picker |
|||
v-if="pickerVisable" |
|||
v-model="currentDate" |
|||
:formatter="formatter" |
|||
@cancel="pickerVisable = false" |
|||
@confirm="onConfirm" |
|||
/> |
|||
</div> |
|||
<!-- <a-modal |
|||
class="first" |
|||
:width="900" |
|||
wrapClassName="first-modal" |
|||
:destroyOnClose="true" |
|||
v-model="modalVisable" |
|||
@ok="modalVisable = false" |
|||
:footer="null" |
|||
> |
|||
<Informed |
|||
ref="informed" |
|||
source="first" |
|||
@on-success="successInformed" |
|||
/> |
|||
</a-modal> --> |
|||
</div> |
|||
|
|||
<div class="btns"> |
|||
<a-button :disabled="writeAble" class="common-button" block type="primary" size="large" @click="onSubmit">下一步</a-button> |
|||
</div> |
|||
<!-- <div class="first-footer"> |
|||
<a-button |
|||
:disabled="writeAble" |
|||
type="link" |
|||
size="large" |
|||
@click="onSubmit" |
|||
> |
|||
保存<a-icon type="check" /> |
|||
</a-button> |
|||
</div> --> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
// import Adverse from '../ing/Adverse.vue'; |
|||
// import Informed from '../before/Informed.vue'; |
|||
// import head from './components/title'; |
|||
import { idcardInfo } from 'api'; |
|||
import { mapMutations, mapState } from 'vuex'; |
|||
import { AID_CODE, JMRS_CODE, XGZL_CODE } from '@/config/code.js'; |
|||
export default { |
|||
name: 'FirstInfo', |
|||
data() { |
|||
return { |
|||
// 知情同意书弹窗 |
|||
modalVisable: false, |
|||
AID_CODE, |
|||
JMRS_CODE, |
|||
XGZL_CODE, |
|||
// 当前选中日期 |
|||
currentDate: new Date(), |
|||
//日期选择器是否展示 |
|||
pickerVisable: false, |
|||
radioStyle: { |
|||
display: 'block', |
|||
height: '30px', |
|||
lineHeight: '30px', |
|||
}, |
|||
firstForm: this.$form.createForm(this, { |
|||
name: 'FirstInfo', |
|||
}), |
|||
//页面中使用code |
|||
codeForm: { |
|||
'RYPG-HEIGHT': '', |
|||
'RYPG-WEIGHT': '', |
|||
'RYPG-SYSTOLIC-PRESSURE': '', |
|||
'RYPG-DIASTOLIC-PRESSURE': '', |
|||
'RYPG-PULSE': '', |
|||
'RYPG-MRS': '', |
|||
'RYPG-NIHSS': '', |
|||
'RYPG-BLOOD-TIME': '', |
|||
'RYPG-BLOOD-SUGAR': '', |
|||
'RYPG-ECG-TIME': '', |
|||
'RYPG-CT-DD-TIME': '', |
|||
'RYPG-CT-OUTSIZE': '', |
|||
'JMRS-Y': '', |
|||
'JMRS-WRSYY': '', |
|||
'JMRS-WRSYY-ELSE': '', |
|||
'JMRS-TH-TIME': '', |
|||
'JMRS-SIGN': '', |
|||
'JMRS-Q-NIHSS': '', |
|||
'JMRS-Q-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-Q-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-RSCS': '', |
|||
'JMRS-TIME': '', |
|||
'JMRS-RSYW': '', |
|||
'JMRS-RSYW-ZL': '', |
|||
'JMRS-TZJL': '', |
|||
'JMRS-JDJL': '', |
|||
'JMRS-15-NIHSS': '', |
|||
'JMRS-15-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-15-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-30-NIHSS': '', |
|||
'JMRS-30-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-30-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-45-NIHSS': '', |
|||
'JMRS-45-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-45-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-60-NIHSS': '', |
|||
'JMRS-60-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-60-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-BFZ': '', |
|||
'XGZL-Y': '', |
|||
'XGZL-WZLYY': '', |
|||
'XGZL-WZLYY-ELSE': '', |
|||
'XGZL-ZQTH-TIME': '', |
|||
'XGZL-ZQTH-QZ': '', |
|||
'XGZL-SQ-NIHSS': '', |
|||
'XGZL-SQ-ASPECT-CT': '', |
|||
'XGZL-SQ-ASPECT-MRI': '', |
|||
'XGZL-SQ-TICI': '', |
|||
'XGZL-CCWC-TIME': '', |
|||
'XGZL-XGKT': '', |
|||
'XGZL-SH-SCXGZTSJ': '', |
|||
'XGZL-BFZ': '', |
|||
'XGZL-BFZ-ELSE': '', |
|||
}, |
|||
selectCode: '', // 当前选中code |
|||
}; |
|||
}, |
|||
components: { |
|||
// 'v-head': head, |
|||
// Adverse, |
|||
// Informed, |
|||
}, |
|||
computed: { |
|||
...mapState('patient', ['patientData', 'writeAble']), |
|||
...mapState('storm', ['nationList']), |
|||
}, |
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
if (this.patientData) { |
|||
this.echo(this.patientData); |
|||
} |
|||
}); |
|||
}, |
|||
methods: { |
|||
successInformed() { |
|||
this.modalVisable = false; |
|||
}, |
|||
// 去签署 |
|||
toInform() { |
|||
this.modalVisable = true; |
|||
this.$nextTick(() => { |
|||
this.$refs.informed.open(); |
|||
}); |
|||
}, |
|||
echo(data) { |
|||
const { recordValDict, patientGender } = data; |
|||
this.firstForm.getFieldDecorator(['RYPG-GENDER'], { |
|||
preserve: true, //即便字段不再使用，也保留该字段的值 |
|||
}); |
|||
this.firstForm.setFieldsValue({ |
|||
['RYPG-GENDER']: patientGender === 1 ? '女' : '男', |
|||
}); |
|||
for (let k in recordValDict) { |
|||
if (recordValDict[k]) { |
|||
let answer = recordValDict[k][0].answer; |
|||
this.firstForm.getFieldDecorator([`${k}`], { |
|||
preserve: true, //即便字段不再使用，也保留该字段的值 |
|||
}); |
|||
if (k === 'RYPG-WEIGHT' || k === 'RYPG-HEIGHT') { |
|||
let weight = |
|||
recordValDict['RYPG-WEIGHT'] && |
|||
recordValDict['RYPG-WEIGHT'][0].answer.toString(); |
|||
let height = |
|||
recordValDict['RYPG-HEIGHT'] && |
|||
recordValDict['RYPG-HEIGHT'][0].answer.toString(); |
|||
this.firstForm.setFieldsValue({ |
|||
'RYPG-BMI': this.utils.computeBMI(weight, height), |
|||
}); |
|||
} |
|||
if (Object.keys(this.codeForm).includes(k)) { |
|||
this.codeForm[k] = answer.toString() || ''; |
|||
//多选 |
|||
if ( |
|||
k !== 'JMRS-WRSYY' && |
|||
k !== 'JMRS-BFZ' && |
|||
k !== 'XGZL-WZLYY' && |
|||
k !== 'XGZL-BFZ' && |
|||
k !== 'XGZL-XGKT' |
|||
) { |
|||
answer = answer.toString() || ''; |
|||
} |
|||
this.firstForm.setFieldsValue({ |
|||
[`${k}`]: answer, |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
toMore(name) { |
|||
if (!name) return; |
|||
this.$router.push({ |
|||
name, |
|||
}); |
|||
}, |
|||
computeShow(code, codeForm) { |
|||
return this.utils.computeShow(code, codeForm); |
|||
}, |
|||
selectOption(v) { |
|||
this.selectCode = v; |
|||
this.pickerVisable = true; |
|||
}, |
|||
// |
|||
onConfirm(date) { |
|||
this.firstForm.setFieldsValue({ |
|||
[`${this.selectCode}`]: this.utils.format(date), |
|||
}); |
|||
this.pickerVisable = false; |
|||
// this.updateAidBase(this.selectCode, this.utils.format(date)) |
|||
}, |
|||
//格式化日期 |
|||
formatter(type, val) { |
|||
if (type === 'year') { |
|||
return val + '年'; |
|||
} |
|||
if (type === 'month') { |
|||
return val + '月'; |
|||
} |
|||
if (type === 'day') { |
|||
return val + '日'; |
|||
} |
|||
if (type === 'hour') { |
|||
return val + '时'; |
|||
} |
|||
if (type === 'minute') { |
|||
return val + '分'; |
|||
} |
|||
return val; |
|||
}, |
|||
handleChange(value, code, type, show) { |
|||
this.codeForm[code] = value; |
|||
if (show === 'checkbox') { |
|||
this.utils.computeShow(code, this.codeForm); |
|||
} |
|||
if (code === 'RYPG-WEIGHT' || code === 'RYPG-HEIGHT') { |
|||
this.codeForm['RYPG-BMI'] = this.utils.computeBMI( |
|||
this.codeForm['RYPG-WEIGHT'], |
|||
this.codeForm['RYPG-HEIGHT'] |
|||
); |
|||
this.firstForm.setFieldsValue({ |
|||
['RYPG-BMI']: this.codeForm['RYPG-BMI'], |
|||
}); |
|||
} |
|||
// this.updateAidBase(code, value, type) |
|||
}, |
|||
async onSubmit(e) { |
|||
e.preventDefault(); |
|||
let codeAndAnswerList = [], |
|||
params = {}; |
|||
this.$nextTick(async () => { |
|||
let adverseSubmit = this.$refs.adverse; |
|||
if (adverseSubmit) { |
|||
let res = await adverseSubmit.onAdverseSubmit(e, 'first'); |
|||
if (res.length > 0) { |
|||
codeAndAnswerList = codeAndAnswerList.concat(res); |
|||
} |
|||
} |
|||
this.firstForm.validateFields(async (err, values) => { |
|||
for (var k in values) { |
|||
if (Object.keys(this.codeForm).includes(k)) { |
|||
let answer = [values[k]]; |
|||
if (typeof values[k] !== 'string') { |
|||
answer = values[k]; |
|||
} |
|||
if (values[k]) { |
|||
codeAndAnswerList.push({ |
|||
questionCode: k, |
|||
answer, |
|||
time: '', |
|||
}); |
|||
} |
|||
} else if ( |
|||
values[k] && |
|||
k !== 'RYPG-BMI' && |
|||
k !== 'RYPG-GENDER' |
|||
) { |
|||
params[`${k}`] = values[k]; |
|||
} |
|||
} |
|||
await this.home.updateAidCode( |
|||
{ |
|||
...params, |
|||
codeAndAnswerList, |
|||
}, |
|||
false |
|||
); |
|||
this.firstForm.resetFields() |
|||
this.$emit('next') |
|||
}); |
|||
}); |
|||
}, |
|||
//更新基本信息 |
|||
async updateAidBase(code, value, type) { |
|||
let params; |
|||
let codeAndAnswerList = []; |
|||
if (type) { |
|||
params = { |
|||
[`${code}`]: value, |
|||
}; |
|||
} else { |
|||
let answer = [value]; |
|||
if (typeof value !== 'string') { |
|||
answer = value; |
|||
} |
|||
codeAndAnswerList.push({ |
|||
questionCode: code, |
|||
answer, |
|||
time: '', |
|||
}); |
|||
} |
|||
await this.home.updateAidCode( |
|||
{ |
|||
...params, |
|||
codeAndAnswerList, |
|||
}, |
|||
false |
|||
); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="less"> |
|||
p { |
|||
margin: 0; |
|||
} |
|||
|
|||
.Overviewbasicr { |
|||
display: flex; |
|||
margin-bottom: 0; |
|||
|
|||
.first-content { |
|||
flex: 1; |
|||
overflow-y: auto; |
|||
background-color: #f9f9f9; |
|||
} |
|||
|
|||
.first-footer { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
margin-top: 10px; |
|||
} |
|||
} |
|||
|
|||
.first { |
|||
/deep/ .ant-modal { |
|||
max-height: 500px; |
|||
overflow-y: auto; |
|||
} |
|||
} |
|||
|
|||
.adverse { |
|||
padding: 15px 0; |
|||
} |
|||
</style> |
|||
<style scoped> |
|||
>>> .adverse .ant-form-item { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
>>> .adverse .ant-form-item-label { |
|||
width: 25%; |
|||
} |
|||
|
|||
>>> .adverse .ant-form-item-control-wrapper { |
|||
flex: 1; |
|||
display: flex; |
|||
justify-content: flex-end; |
|||
} |
|||
|
|||
>>> .adverse .ant-form-item-label label { |
|||
font-size: 22px !important; |
|||
} |
|||
|
|||
>>> .adverse .ant-input { |
|||
width: 100% !important; |
|||
background: none; |
|||
} |
|||
|
|||
>>> .adverse .ant-form-item-control { |
|||
margin-left: 0; |
|||
} |
|||
|
|||
>>> .ant-btn-link { |
|||
color: #7690e5; |
|||
font-size: 24px; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
>>> .ant-radio-wrapper { |
|||
text-align: left; |
|||
font-size: 24px; |
|||
height: 58px !important; |
|||
line-height: 58px !important; |
|||
box-sizing: border-box; |
|||
border-bottom: 1px solid #f0f0f0 !important; |
|||
} |
|||
|
|||
>>> .ant-collapse { |
|||
border: none; |
|||
background: none; |
|||
} |
|||
|
|||
>>> .ant-collapse-header { |
|||
font-size: 24px; |
|||
padding: 10px 0 !important; |
|||
font-weight: bold; |
|||
text-align: left; |
|||
} |
|||
|
|||
>>> .ant-collapse-item { |
|||
flex: 1; |
|||
border-bottom: 0px; |
|||
} |
|||
|
|||
>>> .ant-collapse-content-box { |
|||
padding: 0 10px; |
|||
} |
|||
|
|||
>>> .detail-form .jmrs-form-item .ant-form-item-control-wrapper { |
|||
flex: 1; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
>>> .detail-form .jmrs-form-item .ant-form-item-control { |
|||
flex: 1; |
|||
margin-left: 0; |
|||
} |
|||
|
|||
>>> .ant-radio-wrapper:last-child { |
|||
border-bottom: none !important; |
|||
} |
|||
|
|||
>>> .ant-radio { |
|||
font-size: 24px; |
|||
} |
|||
|
|||
>>> .ant-radio-inner::after { |
|||
width: 16px; |
|||
height: 16px; |
|||
} |
|||
|
|||
>>> .ant-radio-inner { |
|||
width: 24px; |
|||
height: 24px; |
|||
} |
|||
|
|||
.back-ff { |
|||
box-shadow: 0 2px 12px 0 rgba(52, 52, 52, 0.1); |
|||
background: #fff; |
|||
padding: 10px 20px; |
|||
border-radius: 12px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,410 @@ |
|||
<template> |
|||
<a-spin tip="正在请求..." class="zhezhao1" :spinning="load"> |
|||
<div class="div-box1"> |
|||
<div class="div-box"> |
|||
<div class="div-box-left"> |
|||
<!-- :class="highlight_id == item.id ? 'highlight1' : ''" --> |
|||
<div class="div-boxleft-li" v-for="(item, index) in imgurlArr" :key="index" |
|||
@click="handleView(item)" :class=" |
|||
currentObj.id == item.id ? 'boxleft-current' : '' |
|||
"> |
|||
{{ item.title }} |
|||
<span> #{{ item.fileSize }}</span> |
|||
</div> |
|||
</div> |
|||
<div class="div-box-right"> |
|||
<!-- 工具 --> |
|||
<div class="div-boxright-butbox"> |
|||
<div class="butbox-li" :class="highlight == index ? 'highlight' : ''" |
|||
v-for="(item, index) in tool" :key="index" @click="handleShadow(item.type, index)"> |
|||
<div class="butbox-img"> |
|||
<img :src="item.url" width="25" /> |
|||
</div> |
|||
<div class="butbox-text">{{ item.text }}</div> |
|||
</div> |
|||
</div> |
|||
<!-- 图像 --> |
|||
<div class="dcmviewBox" style=""> |
|||
<div class="dcmview" style="height: 100%"> |
|||
<div class="dcmview-top"> |
|||
<div>{{ currentObj.manufacturer }}</div> |
|||
<div v-show="currentObj.studyId"> |
|||
EX：{{ currentObj.studyId }} |
|||
</div> |
|||
<div v-show="currentObj.imagesInAcquisition"> |
|||
Se：{{ currentObj.imagesInAcquisition }} |
|||
</div> |
|||
<div v-show="currentObj.fileSize"> |
|||
Lm：{{ currentIndex }} / |
|||
{{ currentObj.fileSize }} |
|||
</div> |
|||
</div> |
|||
<div class="dcmview-right"> |
|||
<div>{{ currentObj.institutionName }}</div> |
|||
<div> |
|||
{{ currentObj.patientSex }} |
|||
{{ currentObj.patientAge }} |
|||
</div> |
|||
<div>{{ currentObj.seriesDescription }}</div> |
|||
<div>{{ currentObj.accessionNumber }}</div> |
|||
</div> |
|||
<!-- <div class="dcmview-bottom"> |
|||
<div>{{ currentObj.hospital }}</div> |
|||
<div>{{ currentObj.name }}</div> |
|||
<div>{{ currentObj.Ex }}</div> |
|||
<div>{{ currentObj.lm }}</div> |
|||
</div> --> |
|||
<div class="dcmview-left"> |
|||
<div v-show="currentObj.kv"> |
|||
KV：{{ currentObj.kv }} |
|||
</div> |
|||
<div>{{ currentObj.seriesDate }}</div> |
|||
</div> |
|||
<dcmview @byValue="hanldeByValue" ref="dcmview" :currentDcm="currentDcm" |
|||
:toolType="toolType"> |
|||
</dcmview> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</a-spin> |
|||
</template> |
|||
<script> |
|||
//引入组件 |
|||
import { |
|||
mapMutations, |
|||
mapState |
|||
} from 'vuex'; |
|||
import { |
|||
getCtInfoPath |
|||
} from 'api'; |
|||
import dcmview from '@/components/yuanzhen-dcmView/dcmview.vue'; |
|||
import { |
|||
screenage, |
|||
apiUrl, |
|||
proxyUrl |
|||
} from '@/config/setting.js'; |
|||
|
|||
export default { |
|||
//注册组件 |
|||
components: { |
|||
dcmview, |
|||
}, |
|||
data() { |
|||
return { |
|||
load: false, |
|||
imgurlArr: [ |
|||
// { |
|||
// title: '系列一', |
|||
// name: '孙交勇', |
|||
// hospital: '金堂仁爱医院', |
|||
// Basds: 'Basds', |
|||
// Ex: 'P000370691', |
|||
// se: 1, |
|||
// lm: 6, |
|||
// id: 11, |
|||
// imgArr: [ |
|||
// { |
|||
// lm: 1, |
|||
// url: '/api/dicom/test1/1(1).dcm', |
|||
// }, |
|||
// ], |
|||
// }, |
|||
// { |
|||
// title: '系列二', |
|||
// name: '孙交勇2', |
|||
// hospital: '金堂仁爱医院', |
|||
// lm: 6, |
|||
// id: 22, |
|||
// imgArr: [ |
|||
// { |
|||
// lm: 1, |
|||
// url: '/api/dicom/test1/2(1).dcm', |
|||
// }, |
|||
// { |
|||
// lm: 2, |
|||
// url: '/api/dicom/test1/2(2).dcm', |
|||
// }, |
|||
// { |
|||
// lm: 3, |
|||
// url: '/api/dicom/test1/2(3).dcm', |
|||
// }, |
|||
// { |
|||
// lm: 4, |
|||
// url: '/api/dicom/test1/2(4).dcm', |
|||
// }, |
|||
// { |
|||
// lm: 5, |
|||
// url: '/api/dicom/test1/2(5).dcm', |
|||
// }, |
|||
// { |
|||
// lm: 6, |
|||
// url: '/api/dicom/test1/2(6).dcm', |
|||
// }, |
|||
// ], |
|||
// }, |
|||
], |
|||
imgurl: '', //传值，传dcm图片地址给<dcmview>组件 |
|||
toolType: 'ScrollTool', //工具传值，根据传值绑定不同工具 |
|||
currentDcm: [], |
|||
currentObj: {}, |
|||
i: 0, |
|||
currentIndex: 1, |
|||
tool: [{ |
|||
text: '翻图', |
|||
url: require('@/assets/images/xz.png'), |
|||
type: 'ScrollTool', |
|||
}, |
|||
// { |
|||
// text: '清空', |
|||
// url: require('@/assets/images/xz.png'), |
|||
// type: 'eliminate', |
|||
// }, |
|||
{ |
|||
text: '阴影', |
|||
url: require('@/assets/images/阴影.png'), |
|||
type: 'Wwwc', |
|||
}, |
|||
{ |
|||
text: '角度标记', |
|||
url: require('@/assets/images/icon-design-34.png'), |
|||
type: 'Angle', |
|||
}, |
|||
{ |
|||
text: '矩形标记', |
|||
url: require('@/assets/images/矩形标记.png'), |
|||
type: 'RectangleRoi', |
|||
}, |
|||
{ |
|||
text: '拖动探针', |
|||
url: require('@/assets/images/探针.png'), |
|||
type: 'DragProbe', |
|||
}, |
|||
{ |
|||
text: '长度测量', |
|||
url: require('@/assets/images/长度测量直尺.png'), |
|||
type: 'Length', |
|||
}, |
|||
], |
|||
highlight_id: '', |
|||
highlight: 0, |
|||
}; |
|||
}, |
|||
|
|||
computed: { |
|||
...mapState('storm', ['spinning', 'showNav']), |
|||
...mapState('patient', ['patientData', 'timerData', 'overviewType']), |
|||
}, |
|||
mounted() { |
|||
this.toolType = 'ScrollTool'; |
|||
this.goCreate(); |
|||
// console.log(11111111111); |
|||
}, |
|||
methods: { |
|||
//创建患者 |
|||
async goCreate() { |
|||
console.log('firstAidId', 2222223333333) |
|||
try { |
|||
this.load = true; |
|||
const { |
|||
firstAidId |
|||
} = this.patientData; |
|||
console.log('firstAidId', firstAidId) |
|||
const res = await getCtInfoPath({ |
|||
firstAidId |
|||
}); |
|||
const { |
|||
data, |
|||
code, |
|||
msg |
|||
} = res; |
|||
console.log('data: ', data); |
|||
if (code === 200) { |
|||
this.load = false; |
|||
const data1 = data[0].resultList |
|||
data1.forEach((item, index) => { |
|||
item.title = '系列' + (index + 1); |
|||
item.fileDtoList.forEach((row) => { |
|||
item.accessionNumber = row.accessionNumber; |
|||
item.institutionName = row.institutionName; |
|||
item.kv = row.kv; |
|||
item.manufacturer = row.manufacturer; |
|||
item.patientAge = row.patientAge; |
|||
item.patientSex = row.patientSex; |
|||
item.studyId = row.studyId; |
|||
row.dcmPath = apiUrl + row.dcmPath; |
|||
}); |
|||
}); |
|||
// 默认展示第一个患者 |
|||
if (data1.length) { |
|||
this.currentObj = data1[0]; // 患者信息 |
|||
this.currentDcm = data1[0].fileDtoList; // 影像数组 |
|||
console.log('currentDcm', this.currentDcm) |
|||
this.highlight_id = data1[0].id; |
|||
} |
|||
|
|||
this.imgurlArr = data1; |
|||
} |
|||
} catch (err) { |
|||
this.load = false; |
|||
console.log('err: ', err); |
|||
} |
|||
}, |
|||
//获 |
|||
// 获取当前展示的是第几张 - 子组件传值 |
|||
hanldeByValue(_index) { |
|||
this.currentIndex = _index + 1; |
|||
}, |
|||
// 更换docom图像 |
|||
handleView(_item) { |
|||
this.currentObj = _item; |
|||
this.currentDcm = _item.fileDtoList; |
|||
this.$refs.dcmview.viewDcm(); |
|||
console.log('this.imgurl', this.imgurl); |
|||
}, |
|||
// 工具 |
|||
handleShadow(_type, _index) { |
|||
this.toolType = _type; |
|||
this.highlight = _index; |
|||
console.log('this.highlight ', this.highlight); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="less"> |
|||
.highlight { |
|||
background: #4f8bff; |
|||
// border-radius: 10px; |
|||
} |
|||
|
|||
.div-box-right { |
|||
flex: 1; |
|||
background: #000; |
|||
border-radius: 0 0 6px 6px; |
|||
} |
|||
|
|||
.dcmviewBox { |
|||
background: #000; |
|||
border-radius: 4px 4px 0 0; |
|||
overflow: hidden; |
|||
height: calc(100% - 80px); |
|||
} |
|||
|
|||
.dcmview { |
|||
position: relative; |
|||
color: pink; |
|||
text-align: left; |
|||
|
|||
.dcmview-top { |
|||
position: absolute; |
|||
top: 10px; |
|||
left: 10px; |
|||
} |
|||
|
|||
.dcmview-right { |
|||
position: absolute; |
|||
top: 10px; |
|||
right: 10px; |
|||
} |
|||
|
|||
.dcmview-left { |
|||
position: absolute; |
|||
bottom: 10px; |
|||
left: 10px; |
|||
} |
|||
|
|||
.dcmview-bottom { |
|||
position: absolute; |
|||
bottom: 10px; |
|||
right: 10px; |
|||
} |
|||
} |
|||
|
|||
.div-box { |
|||
display: flex; |
|||
// height: 100%; |
|||
height: calc(100vh - 30vw); |
|||
} |
|||
|
|||
.div-box1 { |
|||
height: 100%; |
|||
width: 100%; |
|||
background: #282828; |
|||
// padding: 10px; |
|||
border-radius: 10px; |
|||
} |
|||
|
|||
.div-box-left { |
|||
flex-shrink: 0; |
|||
width: 150px; |
|||
background: #282828; |
|||
color: #fff; |
|||
padding: 0 10px 0 0; |
|||
height: 100%; |
|||
overflow: scroll; |
|||
|
|||
div { |
|||
line-height: 25px; |
|||
border-radius: 4px; |
|||
} |
|||
} |
|||
|
|||
.div-boxright-butbox { |
|||
display: flex; |
|||
background: #282828; |
|||
padding: 0 10px 10px 0px; |
|||
height: 72px; |
|||
box-sizing: border-box; |
|||
|
|||
.butbox-li { |
|||
width: 80px; |
|||
display: flex; |
|||
justify-content: center; |
|||
color: #fff; |
|||
// background-color: #4f8bff; |
|||
flex-wrap: wrap; |
|||
font-size: 14px; |
|||
padding-bottom: 5px; |
|||
border-radius: 4px; |
|||
|
|||
div { |
|||
width: 100%; |
|||
text-align: center; |
|||
} |
|||
|
|||
.butbox-img { |
|||
height: 35px; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.butbox-text {} |
|||
} |
|||
} |
|||
|
|||
.div-boxleft-li { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
padding: 5px 10px; |
|||
} |
|||
|
|||
.boxleft-current { |
|||
background: #4f8bff; |
|||
} |
|||
|
|||
.highlight1 { |
|||
background: #555555; |
|||
border-radius: 5px; |
|||
} |
|||
</style> |
|||
<style> |
|||
.zhezhao1 { |
|||
width: 100%; |
|||
height: 100% !important; |
|||
box-sizing: border-box; |
|||
padding-bottom: 20px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,340 @@ |
|||
<template> |
|||
<div class="throm-interfere-informed"> |
|||
<div class="Informed-container"> |
|||
<h1 style="text-align: center;font-size: 2rem;line-height: 5rem;font-weight: bold;">急性脑梗塞静脉溶栓治疗知情同意书 |
|||
</h1> |
|||
<div style="transition: all 1s; overflow: hidden; padding: 1rem 0;"> |
|||
<div v-html="content" class="card-content ql-editor content-detail" style="white-space: pre-wrap"></div> |
|||
</div> |
|||
<div class="informed-list"> |
|||
<div class="informed-item"> |
|||
<span class="psign">患者签名: </span> |
|||
<div class="item-img" v-if="informed.patientSign" @click="lookSign(informed.patientSign)"> |
|||
<img :src="apiUrl + informed.patientSign" alt="" /> |
|||
</div> |
|||
<div class="item-img" v-else></div> |
|||
</div> |
|||
<div class="informed-item1"> |
|||
<span>签名日期: </span> |
|||
<span>{{getPatientTime}}</span> |
|||
</div> |
|||
</div> |
|||
<div class="informed-list before"> |
|||
<div class="informed-item"> |
|||
<span>授权亲属签字: </span> |
|||
<div class="item-img" v-if="informed.empowerSign" @click="lookSign(informed.empowerSign)"> |
|||
<img :src="apiUrl + informed.empowerSign" alt="" /> |
|||
</div> |
|||
<div class="item-img" v-else></div> |
|||
</div> |
|||
<div class="informed-item1"> |
|||
<span>与患者关系：</span> |
|||
<span>{{informed.empowerRelation}}</span> |
|||
</div> |
|||
</div> |
|||
<template> |
|||
<div class="informed-info"> |
|||
<strong> 医生陈述 </strong> |
|||
</div> |
|||
<div class="informed-info"> |
|||
我已经告知患者将要进行的治疗方式、此次治疗及术后可能发生的并发症和风险、可能存在的其它治疗方法并且解答了患者关于此次治疗的相关问题。 |
|||
</div> |
|||
<div class="informed-list"> |
|||
<div class="informed-item"> |
|||
<span>医生签名: </span> |
|||
<div class="item-img" v-if="informed.doctorSign" @click="lookSign(informed.doctorSign)"> |
|||
<img :src="apiUrl + informed.doctorSign" alt="" /> |
|||
</div> |
|||
<div class="item-img " v-else></div> |
|||
</div> |
|||
<div class="informed-item1"> |
|||
<span>签名日期：</span> |
|||
<span>{{getDoctorTime}}</span> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<a-modal :width="650" :destroyOnClose="true" v-model="lookVisable" title="查看签名" :footer="null"> |
|||
<div class="modal-content"> |
|||
<img :src="apiUrl + currentSign" alt="" style="width: 100%; height: 100%;" /> |
|||
</div> |
|||
</a-modal> |
|||
</div> |
|||
<div> |
|||
<a-form-model> |
|||
<a-form-model-item label="姓名"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="性别"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="民族"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="民族"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="身份证号"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="发病时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="发病时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="是否院内卒中"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="到达急救时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="通知卒中医生时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="卒中到场时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="来源方式"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="疑似诊断"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
</a-form-model> |
|||
</div> |
|||
<div> |
|||
<a-form-model v-model="form" :label-col="labelCol" :wrapper-col="wrapperCol"> |
|||
<a-form-model-item label="身高(cm)"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="体重(kg)"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="性别"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="BMI"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="收缩压(mmHg)"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="舒张压(mmHg)"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="脉搏(次/分)"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="本次入院mRS评分"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="本次入院NIHSS评分"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="采血开始时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="血糖(mol/L)"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="心电开始时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="CT是否院外已查"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="到达CT时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="是否进行静脉溶栓"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="谈话开始时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="签署知情同意书"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="开始静脉溶栓场所"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="开始静脉溶栓时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="静脉溶栓药物"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="团注剂量(mg)"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="静滴剂量(mg)"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="15min"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="30min"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="45min"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="60min"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="不良反应"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<div>血管内治疗</div> |
|||
<a-form-model-item label="是否给予血管内治疗"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="谈话开始时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="签署知情同意书时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="NIHSS评分"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="CT"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="TICI分级"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="穿刺完成时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="血管内开通方法"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="首次血管再通时间"> |
|||
<a-input v-model="form.name"></a-input> |
|||
</a-form-model-item> |
|||
<a-form-model-item label="手术并发症"> |
|||
<a-checkbox-group @change="onChange"> |
|||
<a-row> |
|||
<a-col :span="8"><a-checkbox value="无">无</a-checkbox> </a-col> |
|||
<a-col :span="8"><a-checkbox value="支架取栓">无</a-checkbox> </a-col> |
|||
<a-col :span="8"><a-checkbox value="无">无</a-checkbox> </a-col> |
|||
<a-col :span="8"><a-checkbox value="无">无</a-checkbox> </a-col> |
|||
<a-col :span="8"><a-checkbox value="无">无</a-checkbox> </a-col> |
|||
<a-col :span="8"><a-checkbox value="无">无</a-checkbox> </a-col> |
|||
<a-col :span="8"><a-checkbox value="无">无</a-checkbox> </a-col> |
|||
<a-col :span="8"><a-checkbox value="无">无</a-checkbox> </a-col> |
|||
<a-col :span="8"><a-checkbox value="无">无</a-checkbox> </a-col> |
|||
</a-row> |
|||
</a-checkbox-group> |
|||
</a-form-model-item> |
|||
</a-form-model> |
|||
</div> |
|||
<div class="btns"> |
|||
<a-button :disabled="writeAble" class="common-button" block type="primary" size="large" |
|||
@click="onSubmit">下一步</a-button> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
mapState |
|||
} from 'vuex'; |
|||
import { |
|||
imgUrl |
|||
} from '@/config/setting.js'; |
|||
import { |
|||
uploadfile, |
|||
saveInformedConsent, |
|||
queryConsentResult, |
|||
thTime, |
|||
uploadBase64 |
|||
} from 'api'; |
|||
export default { |
|||
name: "throm-interfere-informed", |
|||
data() { |
|||
return { |
|||
apiUrl: imgUrl, |
|||
content: '', |
|||
informed: { |
|||
doctorSign: '', |
|||
doctorTime: '', |
|||
patientSign: '', |
|||
patientTime: '', |
|||
empowerSign: '', |
|||
empowerRelation: '', |
|||
empowerMobile: '', |
|||
legalTime: '', |
|||
}, |
|||
lookVisable: false, |
|||
currentSign: '', |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapState('patient', ['patientData', 'book', 'video', 'writeAble']), |
|||
getDoctorTime() { |
|||
const { |
|||
informed |
|||
} = this; |
|||
if (!informed.doctorTime) return; |
|||
return informed.doctorTime.split(' ')[0]; |
|||
}, |
|||
getPatientTime() { |
|||
const { |
|||
informed |
|||
} = this; |
|||
if (!informed.patientTime) return; |
|||
return informed.patientTime.split(' ')[0]; |
|||
}, |
|||
getLegalTime() { |
|||
const { |
|||
informed |
|||
} = this; |
|||
if (!informed.legalTime) return; |
|||
return informed.legalTime.split(' ')[0]; |
|||
}, |
|||
}, |
|||
created() { |
|||
this.content = this.book.find((item) => item.type === 1)?.content || ''; |
|||
this.queryConsentResult() |
|||
}, |
|||
methods: { |
|||
onSubmit() { |
|||
this.$emit('next') |
|||
}, |
|||
async queryConsentResult() { |
|||
const { |
|||
firstAidId |
|||
} = this.patientData; |
|||
if (!firstAidId) return this.$message.error('缺少急救'); |
|||
let res = await queryConsentResult({ |
|||
firstAidId, |
|||
type: 0, |
|||
}); |
|||
const { |
|||
code, |
|||
data, |
|||
msg |
|||
} = res; |
|||
if (code === 200) { |
|||
this.utils.merge(this.informed, data); |
|||
} |
|||
}, |
|||
lookSign(url) { |
|||
this.currentSign = url; |
|||
this.lookVisable = true; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="less" scoped> |
|||
.throm-interfere-informed { |
|||
padding: 10px; |
|||
} |
|||
</style> |
|||
<style lang="less"> |
|||
.throm-interfere-informed {} |
|||
</style> |
|||
@ -0,0 +1,451 @@ |
|||
<template> |
|||
<div class="BasicInfo"> |
|||
<div class="basic-content"> |
|||
<!-- 患者基本信息 --> |
|||
<div class='basicr-back'> |
|||
<a-form class="detail-form" :form="baseForm" labelWitch="260px" :labelCol="{span: 6}" :wrapperCol="{span: 16}"> |
|||
<a-form-item label="扫描身份证"> |
|||
<div class="detail-form-control"> |
|||
<a-upload :disabled="writeAble" class="idcard-upload" accept=".img,.png,.jpg" |
|||
:before-upload="handleBeforeUpload" :showUploadList="false" name="file" |
|||
:multiple="false" :customRequest="handleUploadAdd"> |
|||
<a-icon type="scan" class="fz24" /> |
|||
</a-upload> |
|||
</div> |
|||
</a-form-item> |
|||
<a-form-item label="姓名"> |
|||
<div class="detail-form-control" > |
|||
<a-input :disabled="writeAble" v-decorator="['patientName']" style="width: 448px;" |
|||
@blur="onBaseChange($event.target.value, 'patientName')" placeholder='请输入' /> |
|||
</div> |
|||
</a-form-item> |
|||
<a-form-item label="性别"> |
|||
<div class="detail-form-control"> |
|||
<a-radio-group :disabled="writeAble" v-decorator="['patientGender']" style="width: 448px;" |
|||
@change="onBaseChange($event.target.value, 'patientGender')"> |
|||
<a-radio :value='0'> 男 </a-radio> |
|||
<a-radio :value='1'> 女 </a-radio> |
|||
</a-radio-group> |
|||
</div> |
|||
</a-form-item> |
|||
<a-form-item label="民族"> |
|||
<div class="detail-form-control"> |
|||
<a-select :disabled="writeAble" ref="select" v-decorator="['patientNation']" style="display: block;width: 448px;" |
|||
@change="handleChange($event, 'patientNation', 'default')" placeholder='请选择'> |
|||
<a-select-option v-for="item in nationList" :key="item" :value="item"> |
|||
{{item}} |
|||
</a-select-option> |
|||
</a-select> |
|||
</div> |
|||
</a-form-item> |
|||
<a-form-item label="身份证号"> |
|||
<div class="detail-form-control"> |
|||
<a-input :disabled="writeAble" v-decorator="['patientIdCardNo']" placeholder='请输入' |
|||
@blur="onBaseChange($event.target.value, 'patientIdCardNo')" style="width: 448px;" /> |
|||
</div> |
|||
</a-form-item> |
|||
<a-form-item v-for="(k,v) in BASE_CODE" :key="v" :label="k.text" v-if="computeShow(v, codeForm)"> |
|||
<div class="detail-form-control"> |
|||
<!-- radio --> |
|||
<a-radio-group :disabled="writeAble" v-if="k.type==='radio'" style="width: 448px;" v-decorator="[ |
|||
v, |
|||
{initialValue: codeForm[k] }, |
|||
]" @change="handleChange($event.target.value, v)"> |
|||
<a-radio v-for="(item,index) in k.range" :key="item" :value="item"> |
|||
{{item}} |
|||
</a-radio> |
|||
</a-radio-group> |
|||
<!-- input --> |
|||
<a-input :disabled="writeAble" v-if="k.type==='input'" :type="k.inputType" v-decorator="[ |
|||
v]" @blur="handleChange($event.target.value, v)" placeholder='请输入' style="width: 448px;"> |
|||
</a-input> |
|||
<!-- datetime --> |
|||
<a-input :disabled="writeAble" v-if="k.type==='datetime'" readOnly @click="selectOption(v)" style="width: 448px;" |
|||
v-decorator="[ |
|||
v, |
|||
]" placeholder='请选择'> |
|||
</a-input> |
|||
<a-select :disabled="writeAble" v-if="k.type==='select'" v-decorator="[ |
|||
v]" @change="handleChange($event, v)" placeholder='请选择' style="display: block;width: 448px;"> |
|||
<a-select-option v-for="item in k.range" :key="item" :value="item"> |
|||
{{item}} |
|||
</a-select-option> |
|||
</a-select> |
|||
</div> |
|||
</a-form-item> |
|||
</a-form> |
|||
</div> |
|||
<!-- 疑似诊断 --> |
|||
<div class='diagnosis'> |
|||
<v-head text='疑似诊断'></v-head> |
|||
<div class='back-ff'> |
|||
<a-radio-group :disabled="writeAble" v-model:value="firstAidZlType" style="width: 448px;" |
|||
@change="onBaseChange($event.target.value, 'firstAidZlType')"> |
|||
<a-radio :style="radioStyle" v-for="(k,v) in FIRSTAIDZLTYPE_DICT" :key="v" |
|||
:value="v">{{k}}</a-radio> |
|||
</a-radio-group> |
|||
</div> |
|||
</div> |
|||
<div class="common-picker"> |
|||
<van-datetime-picker v-if="pickerVisable" v-model="currentDate" :formatter="formatter" |
|||
@cancel="pickerVisable = false" @confirm="onConfirm" style="width: 448px;" /> |
|||
</div> |
|||
</div> |
|||
<div class="basic-footer"> |
|||
<a-button :disabled="writeAble" class="common-button" block type="primary" size="large" |
|||
@click="onSubmit">{{patientId ? '保存' : '下一步'}}</a-button> |
|||
<!-- <a-button :disabled="writeAble" type="link" size="large" @click="onSubmit"> |
|||
保存<a-icon type="check" /> |
|||
</a-button> --> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import head from '@/views/Patient/components/title.vue'; |
|||
import { |
|||
uploadIdcard, |
|||
updateFirstAid, |
|||
queryAidRecord |
|||
} from 'api' |
|||
import { |
|||
mapMutations, |
|||
mapState |
|||
} from 'vuex' |
|||
import { |
|||
BASE_CODE |
|||
} from '@/config/code.js' |
|||
import { |
|||
FIRSTAIDZLTYPE_DICT |
|||
} from '@/config/dict.js' |
|||
export default { |
|||
name: 'BasicInfo', |
|||
data() { |
|||
return { |
|||
BASE_CODE, |
|||
FIRSTAIDZLTYPE_DICT, |
|||
// 当前选中日期 |
|||
currentDate: new Date(), |
|||
//日期选择器是否展示 |
|||
pickerVisable: false, |
|||
radioStyle: { |
|||
display: 'block', |
|||
height: '30px', |
|||
lineHeight: '30px', |
|||
}, |
|||
baseForm: this.$form.createForm(this, { |
|||
name: 'BasicInfo' |
|||
}), |
|||
//页面中使用code |
|||
codeForm: { |
|||
'JBXX-SFXHCZ': '已知', |
|||
'JBXX-FBSJ': '', |
|||
'JBXX-ZHZC-TIME': '', |
|||
'JBXX-SFYNCZ': '是', |
|||
'JBXX-DDJZ-TIME': '', |
|||
'JBXX-TZCZYS-TIME': '', |
|||
'JBXX-CZYSDC-TIME': '', |
|||
'JBXX-LYFS': '', |
|||
}, |
|||
firstAidZlType: 0, //疑似诊断 |
|||
selectCode: '' // 当前选中code |
|||
} |
|||
}, |
|||
props: ['patientId'], |
|||
components: { |
|||
'v-head': head |
|||
}, |
|||
computed: { |
|||
...mapState('patient', ['patientData', 'writeAble']), |
|||
...mapState('storm', ['nationList']) |
|||
}, |
|||
async mounted() { |
|||
console.log('patientId', this.patientId) |
|||
if (this.patientId) { |
|||
const res = await queryAidRecord(this.patientId) |
|||
|
|||
this.$nextTick(() => { |
|||
this.echo(res.data) |
|||
}) |
|||
} else { |
|||
this.$nextTick(() => { |
|||
if (this.patientData) { |
|||
this.echo(this.patientData) |
|||
} |
|||
}) |
|||
} |
|||
|
|||
}, |
|||
methods: { |
|||
echo(data) { |
|||
const { |
|||
recordValDict, |
|||
patientName, |
|||
patientGender, |
|||
patientNation, |
|||
patientIdCardNo, |
|||
firstAidZlType |
|||
} = data |
|||
this.firstAidZlType = firstAidZlType && firstAidZlType.toString() || '0' |
|||
this.baseForm.getFieldDecorator([patientName, |
|||
patientGender, |
|||
patientNation, |
|||
patientIdCardNo |
|||
], { |
|||
preserve: true, //即便字段不再使用，也保留该字段的值 |
|||
}) |
|||
this.baseForm.setFieldsValue({ |
|||
patientName, |
|||
patientGender, |
|||
patientNation, |
|||
patientIdCardNo |
|||
}); |
|||
for (let k in recordValDict) { |
|||
if (recordValDict[k]) { |
|||
const { |
|||
answer |
|||
} = recordValDict[k][0] |
|||
if (Object.keys(this.codeForm).includes(k)) { |
|||
this.codeForm[k] = answer.toString() |
|||
} |
|||
this.baseForm.getFieldDecorator([`${k}`], { |
|||
preserve: true, //即便字段不再使用，也保留该字段的值 |
|||
}) |
|||
this.baseForm.setFieldsValue({ |
|||
[`${k}`]: answer.toString(), |
|||
}); |
|||
} |
|||
} |
|||
}, |
|||
computeShow(code, codeForm) { |
|||
return this.utils.computeShow(code, codeForm) |
|||
}, |
|||
selectOption(v) { |
|||
this.selectCode = v |
|||
this.pickerVisable = true |
|||
}, |
|||
//格式化日期 |
|||
formatter(type, val) { |
|||
if (type === 'year') { |
|||
return val + '年'; |
|||
} |
|||
if (type === 'month') { |
|||
return val + '月'; |
|||
} |
|||
if (type === 'day') { |
|||
return val + '日'; |
|||
} |
|||
if (type === 'hour') { |
|||
return val + '时'; |
|||
} |
|||
if (type === 'minute') { |
|||
return val + '分'; |
|||
} |
|||
return val; |
|||
}, |
|||
// |
|||
onConfirm(date) { |
|||
this.baseForm.setFieldsValue({ |
|||
[`${this.selectCode}`]: this.utils.format(date), |
|||
}); |
|||
this.pickerVisable = false |
|||
// this.updateAidBase(this.selectCode, this.utils.format(date)) |
|||
}, |
|||
handleChange(value, code, type) { |
|||
const codes = ['patientGender', 'patientIdCardNo', 'patientName', 'patientNation'] |
|||
if (!codes.includes(code)) { |
|||
this.codeForm[code] = value |
|||
} |
|||
// this.updateAidBase(code, value, type) |
|||
}, |
|||
async onBaseChange(value, code) { |
|||
if (code === 'patientIdCardNo') { |
|||
const reg = |
|||
/^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/ |
|||
|
|||
if (!reg.test(value)) { |
|||
this.$message.error('身份证格式不正确') |
|||
return |
|||
} |
|||
} |
|||
// await this.home.updateAidCode({ |
|||
// [`${code}`]: value |
|||
// }, false) |
|||
}, |
|||
//更新基本信息 |
|||
async updateAidBase(code, value, type) { |
|||
let params |
|||
let codeAndAnswerList = [] |
|||
if (type) { |
|||
params = { |
|||
[`${code}`]: value |
|||
} |
|||
} else { |
|||
let answer = [value] |
|||
if (typeof value !== 'string') { |
|||
answer = value |
|||
} |
|||
codeAndAnswerList.push({ |
|||
questionCode: code, |
|||
answer, |
|||
time: '' |
|||
}) |
|||
} |
|||
await this.home.updateAidCode({ |
|||
...params, |
|||
codeAndAnswerList |
|||
}, false) |
|||
}, |
|||
// 上传前校检格式和大小 |
|||
handleBeforeUpload(file) { |
|||
this.file = file |
|||
const isLt10M = file.size / 1024 / 1024 < 10000; |
|||
// 校检文件大小 |
|||
if (!isLt10M) { |
|||
this.$message.error('上传头像图片大小不能超过 10MB!'); |
|||
} |
|||
return isLt10M; |
|||
}, |
|||
async onSubmit(e) { |
|||
e.preventDefault(); |
|||
let firstAidId = this.patientData.firstAidId |
|||
let codeAndAnswerList = [], |
|||
params = { |
|||
firstAidId |
|||
} |
|||
const codes = ['patientGender', 'patientIdCardNo', 'patientName', 'patientNation'] |
|||
this.$nextTick(async () => { |
|||
this.baseForm.validateFields(async (err, values) => { |
|||
for (var k in values) { |
|||
if (Object.keys(this.codeForm).includes(k)) { |
|||
let answer = [values[k]] |
|||
if (typeof values[k] !== 'string') { |
|||
answer = values[k] |
|||
} |
|||
if (values[k]) { |
|||
codeAndAnswerList.push({ |
|||
questionCode: k, |
|||
answer, |
|||
time: '' |
|||
}) |
|||
} |
|||
} else if (codes.includes(k)) { |
|||
params[`${k}`] = values[k] |
|||
} |
|||
} |
|||
var res = await updateFirstAid(params) |
|||
await this.home.updateAidCode({ |
|||
codeAndAnswerList |
|||
}, false) |
|||
this.$message.success(res.msg) |
|||
this.$emit('next') |
|||
}) |
|||
}) |
|||
}, |
|||
// 上传成功回 |
|||
handleUploadAdd() { |
|||
// 使用FormData传参数和文件 |
|||
var form = new FormData(); |
|||
// 文件 |
|||
form.append('file', this.file); |
|||
uploadIdcard(form).then((res) => { |
|||
if (res.code === 200) { |
|||
if (res.data) { |
|||
const { |
|||
name, |
|||
sex, |
|||
idCardNo, |
|||
nation |
|||
} = res.data; |
|||
this.baseForm.setFieldsValue({ |
|||
['patientName']: name, |
|||
['patientGender']: sex, |
|||
['patientNation']: nation, |
|||
['patientIdCardNo']: idCardNo |
|||
}); |
|||
} else { |
|||
this.$message.error('请扫描正确身份证'); |
|||
} |
|||
} else { |
|||
this.$message.error(res.msg); |
|||
} |
|||
}); |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="less"> |
|||
p { |
|||
margin: 0; |
|||
} |
|||
|
|||
.basic-content { |
|||
flex: 1; |
|||
overflow-y: auto; |
|||
} |
|||
|
|||
.BasicInfo { |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.basic-footer { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
margin-top: 20px; |
|||
padding: 0 10%; |
|||
} |
|||
</style> |
|||
<style scoped> |
|||
>>>.ant-btn-link { |
|||
color: #7690e5; |
|||
font-size: 24px; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
>>>.ant-radio-wrapper { |
|||
text-align: left; |
|||
font-size: 24px; |
|||
height: 58px !important; |
|||
line-height: 58px !important; |
|||
box-sizing: border-box; |
|||
border-bottom: 1px solid #f0f0f0 !important; |
|||
} |
|||
|
|||
>>>.ant-col.ant-form-item-control-wrapper { |
|||
flex: 2; |
|||
} |
|||
|
|||
>>>.ant-radio-wrapper:last-child { |
|||
border-bottom: none !important; |
|||
} |
|||
|
|||
>>>.ant-radio { |
|||
font-size: 24px; |
|||
} |
|||
|
|||
>>>.ant-radio-inner::after { |
|||
width: 16px; |
|||
height: 16px; |
|||
} |
|||
|
|||
>>>.ant-radio-inner { |
|||
width: 24px; |
|||
height: 24px; |
|||
} |
|||
|
|||
>>>.container-left-header { |
|||
padding-bottom: 0; |
|||
} |
|||
|
|||
.back-ff { |
|||
box-shadow: 0 2px 12px 0 rgba(52, 52, 52, .1); |
|||
background: #fff; |
|||
padding: 10px 20px; |
|||
border-radius: 12px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,707 @@ |
|||
<template> |
|||
<div class="Overviewbasicr"> |
|||
<div class="first-content"> |
|||
<!-- 患者急救记录 --> |
|||
<div class="basicr-back"> |
|||
<a-form class="detail-form" :form="firstForm"> |
|||
<a-form-item class="jmrs-form-item" v-for="(k, v) in AID_CODE" :key="v"> |
|||
<div class="jmrs-form-item-con"> |
|||
<div class="content-left ant-form-item-label"> |
|||
<label :for="`FirstInfo_${v}`" v-if="k.text"> |
|||
{{ `${k.text}` }} |
|||
<span v-if="k.description" class="label-info">{{ k.description }}</span> |
|||
</label> |
|||
</div> |
|||
<div class="content-right"> |
|||
<!-- text --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'text'" type="text" v-decorator="[v]" |
|||
readOnly /> |
|||
<!-- input --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'input'" :type="k.inputType" |
|||
v-decorator="[v]" @blur="handleChange($event.target.value, v)" placeholder="请输入" /> |
|||
<!-- datetime --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'datetime'" readOnly |
|||
@click="selectOption(v)" v-decorator="[v]" placeholder="请选择" /> |
|||
<a-select :disabled="writeAble" v-if="k.type === 'select'" v-decorator="[v]" |
|||
@change="handleChange($event, v)" placeholder="请选择" style="display: block;"> |
|||
<a-select-option v-for="(item, val) in k.range" :key="val"> |
|||
{{ val }} |
|||
</a-select-option> |
|||
</a-select> |
|||
<!-- radio --> |
|||
<a-radio-group :disabled="writeAble" v-if="k.type === 'radio'" v-decorator="[v]" |
|||
@change=" |
|||
handleChange($event.target.value, v) |
|||
"> |
|||
<a-radio v-for="(item, index) in k.range" :key="item" :value="item"> |
|||
{{ item }} |
|||
</a-radio> |
|||
</a-radio-group> |
|||
<!-- pageText --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'pageText'" |
|||
@blur="handleChange($event.target.value, v)" v-decorator="[v]" placeholder="请输入" /> |
|||
</div> |
|||
</div> |
|||
</a-form-item> |
|||
</a-form> |
|||
</div> |
|||
<v-head text="主要治疗操作"></v-head> |
|||
<div class="basicr-back"> |
|||
<a-form class="detail-form" :form="firstForm"> |
|||
<a-form-item class="jmrs-form-item" v-for="(k, v) in JMRS_CODE" :key="v" |
|||
v-if="computeShow(v, codeForm)"> |
|||
<!-- operate === collapse --> |
|||
<a-collapse class="jmrs-form-item-con" v-if="k.operate === 'collapse'" :bordered="false" |
|||
expandIconPosition="right"> |
|||
<a-collapse-panel key="1" :header="k.operateData.text"> |
|||
<div class="collapse-content" v-for="item in k.operateData.code" :key="item"> |
|||
<div class="content-left ant-form-item-label"> |
|||
<label :for="`FirstInfo_${JMRS_CODE[item]}`" v-if="JMRS_CODE[item].text"> |
|||
{{ `${JMRS_CODE[item].text}` }} |
|||
<span v-if=" |
|||
JMRS_CODE[item].description |
|||
" class="label-info">{{ |
|||
JMRS_CODE[item].description |
|||
}}</span> |
|||
</label> |
|||
</div> |
|||
<div class="content-right"> |
|||
<!-- input --> |
|||
<a-input :disabled="writeAble" v-if=" |
|||
JMRS_CODE[item].type === 'input' |
|||
" :type="item.inputType" v-decorator="[item]" @blur=" |
|||
handleChange( |
|||
$event.target.value, |
|||
v |
|||
) |
|||
" placeholder="请输入" /> |
|||
<!-- pageText --> |
|||
<a-input :disabled="writeAble" v-if=" |
|||
JMRS_CODE[item].type === |
|||
'pageText' |
|||
" @blur=" |
|||
handleChange( |
|||
$event.target.value, |
|||
item |
|||
) |
|||
" :type="item.inputType" v-decorator="[item]" placeholder="请输入" /> |
|||
</div> |
|||
</div> |
|||
</a-collapse-panel> |
|||
</a-collapse> |
|||
<!-- operate === jump --> |
|||
<div v-else-if="k.operate === 'jump'" class="jmrs-form-item-con"> |
|||
<div class="content-left ant-form-item-label" v-if="k.text"> |
|||
<label :for="`FirstInfo_${v}`"> |
|||
{{ `${k.text}` }} |
|||
<span v-if="k.description" class="label-info">{{ k.description }}</span> |
|||
</label> |
|||
</div> |
|||
<div class="content-right" @click="toMore(k.path.name)"> |
|||
<div class="operate fz24"> |
|||
{{ k.rightText }} |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="jmrs-form-item-con" v-else :class="k.type"> |
|||
<div class="content-left ant-form-item-label"> |
|||
<label :for="`FirstInfo_${v}`" v-if="k.text"> |
|||
{{ `${k.text}` }} |
|||
<span v-if="k.description" class="label-info">{{ k.description }}</span> |
|||
</label> |
|||
</div> |
|||
<div class="content-right"> |
|||
<!-- text --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'text'" type="text" v-decorator="[v]" |
|||
readOnly /> |
|||
<!-- modal --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'modal'" :placeholder="k.rightText" |
|||
@click="toInform" type="text" v-decorator="[v]" readOnly /> |
|||
<!-- radio --> |
|||
<a-radio-group :disabled="writeAble" v-if="k.type === 'radio'" v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" @change=" |
|||
handleChange($event.target.value, v) |
|||
"> |
|||
<a-radio v-for="(item, index) in k.range" :key="item" :value="item"> |
|||
{{ item }} |
|||
</a-radio> |
|||
</a-radio-group> |
|||
<!-- checkbox --> |
|||
<a-checkbox-group :disabled="writeAble" v-if="k.type === 'checkbox'" :options="k.range" |
|||
v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" @change=" |
|||
handleChange($event, v, null, k.type) |
|||
" /> |
|||
<!-- input --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'input'" :type="k.inputType" |
|||
v-decorator="[v]" @blur="handleChange($event.target.value, v)" placeholder="请输入" /> |
|||
<!-- datetime --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'datetime'" readOnly |
|||
@click="selectOption(v)" v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" placeholder="请选择" /> |
|||
<a-select :disabled="writeAble" v-if="k.type === 'select'" v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" @change="handleChange($event, v)" placeholder="请选择" style="display: block;"> |
|||
<a-select-option v-for="(item, v) in k.range" :key="item"> |
|||
{{ item }} |
|||
</a-select-option> |
|||
</a-select> |
|||
<!-- pageText --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'pageText'" |
|||
@blur="handleChange($event.target.value, v)" v-decorator="[ |
|||
v, |
|||
{ initialValue: k.default }, |
|||
]" placeholder="请输入" /> |
|||
</div> |
|||
</div> |
|||
</a-form-item> |
|||
<!-- 不良反应 --> |
|||
<div class="adverse"> |
|||
<a-collapse class="jmrs-form-item-con" :bordered="false" expandIconPosition="right"> |
|||
<a-collapse-panel key="1" header="不良反应"> |
|||
<Adverse source="first" ref="adverse" /> |
|||
</a-collapse-panel> |
|||
</a-collapse> |
|||
</div> |
|||
</a-form> |
|||
</div> |
|||
<v-head text="血管内治疗"></v-head> |
|||
<div class="basicr-back"> |
|||
<a-form class="detail-form" :form="firstForm"> |
|||
<a-form-item class="jmrs-form-item" v-for="(k, v) in XGZL_CODE" :key="v" |
|||
v-if="computeShow(v, codeForm)"> |
|||
<div class="jmrs-form-item-con" :class="k.type"> |
|||
<div class="content-left ant-form-item-label"> |
|||
<label :for="`FirstInfo_${v}`" v-if="k.text"> |
|||
{{ `${k.text}` }} |
|||
<span v-if="k.description" class="label-info">{{ k.description }}</span> |
|||
</label> |
|||
</div> |
|||
<div class="content-right"> |
|||
<!-- text --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'text'" type="text" v-decorator="[v]" |
|||
readOnly /> |
|||
<!-- radio --> |
|||
<a-radio-group :disabled="writeAble" v-if="k.type === 'radio'" v-decorator="[v]" |
|||
@change=" |
|||
handleChange($event.target.value, v) |
|||
"> |
|||
<a-radio v-for="(item, index) in k.range" :key="item" :value="item"> |
|||
{{ item }} |
|||
</a-radio> |
|||
</a-radio-group> |
|||
<!-- input --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'input'" :type="k.inputType" |
|||
v-decorator="[v]" @blur="handleChange($event.target.value, v)" placeholder="请输入" /> |
|||
<!-- checkbox --> |
|||
<a-checkbox-group :disabled="writeAble" v-if="k.type === 'checkbox'" :options="k.range" |
|||
v-decorator="[v]" @change=" |
|||
handleChange($event, v, null, k.type) |
|||
" /> |
|||
<!-- datetime --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'datetime'" readOnly |
|||
@click="selectOption(v)" v-decorator="[v]" placeholder="请选择" /> |
|||
<a-select :disabled="writeAble" v-if="k.type === 'select'" v-decorator="[v]" |
|||
@change="handleChange($event, v)" placeholder="请选择"> |
|||
<a-select-option v-for="(item, v) in k.range" :key="item"> |
|||
{{ v }} |
|||
</a-select-option> |
|||
</a-select> |
|||
<!-- pageText --> |
|||
<a-input :disabled="writeAble" v-if="k.type === 'pageText'" |
|||
@blur="handleChange($event.target.value, v)" v-decorator="[v]" placeholder="请输入" /> |
|||
</div> |
|||
</div> |
|||
</a-form-item> |
|||
</a-form> |
|||
</div> |
|||
<div class="common-picker"> |
|||
<van-datetime-picker v-if="pickerVisable" v-model="currentDate" :formatter="formatter" |
|||
@cancel="pickerVisable = false" @confirm="onConfirm" /> |
|||
</div> |
|||
<a-modal class="first" :width="900" wrapClassName="first-modal" :destroyOnClose="true" |
|||
v-model="modalVisable" @ok="modalVisable = false" :footer="null"> |
|||
<!-- <Informed ref="informed" source="first" @on-success="successInformed" /> --> |
|||
</a-modal> |
|||
</div> |
|||
<div class="first-footer"> |
|||
<a-button :disabled="writeAble" class="common-button" block type="primary" size="large" |
|||
@click="onSubmit">{{patientId? '保存' : '下一步'}}</a-button> |
|||
<!-- <a-button :disabled="writeAble" type="link" size="large" @click="onSubmit"> |
|||
保存<a-icon type="check" /> |
|||
</a-button> --> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import Adverse from '@/views/ing/Adverse.vue'; |
|||
import Informed from '@/views/before/Informed.vue'; |
|||
import head from '@/views/Patient/components/title.vue'; |
|||
// import headTitle from '@/Patient/components/title' |
|||
import { |
|||
idcardInfo, |
|||
queryAidRecord |
|||
} from 'api'; |
|||
import { |
|||
mapMutations, |
|||
mapState |
|||
} from 'vuex'; |
|||
import { |
|||
AID_CODE, |
|||
JMRS_CODE, |
|||
XGZL_CODE |
|||
} from '@/config/code.js'; |
|||
export default { |
|||
name: 'FirstInfo', |
|||
data() { |
|||
return { |
|||
// 知情同意书弹窗 |
|||
modalVisable: false, |
|||
AID_CODE, |
|||
JMRS_CODE, |
|||
XGZL_CODE, |
|||
// 当前选中日期 |
|||
currentDate: new Date(), |
|||
//日期选择器是否展示 |
|||
pickerVisable: false, |
|||
radioStyle: { |
|||
display: 'block', |
|||
height: '30px', |
|||
lineHeight: '30px', |
|||
}, |
|||
firstForm: this.$form.createForm(this, { |
|||
name: 'FirstInfo', |
|||
}), |
|||
//页面中使用code |
|||
codeForm: { |
|||
'RYPG-HEIGHT': '', |
|||
'RYPG-WEIGHT': '', |
|||
'RYPG-SYSTOLIC-PRESSURE': '', |
|||
'RYPG-DIASTOLIC-PRESSURE': '', |
|||
'RYPG-PULSE': '', |
|||
'RYPG-MRS': '', |
|||
'RYPG-NIHSS': '', |
|||
'RYPG-BLOOD-TIME': '', |
|||
'RYPG-BLOOD-SUGAR': '', |
|||
'RYPG-ECG-TIME': '', |
|||
'RYPG-CT-DD-TIME': '', |
|||
'RYPG-CT-OUTSIZE': '', |
|||
'JMRS-Y': '', |
|||
'JMRS-WRSYY': '', |
|||
'JMRS-WRSYY-ELSE': '', |
|||
'JMRS-TH-TIME': '', |
|||
'JMRS-SIGN': '', |
|||
'JMRS-Q-NIHSS': '', |
|||
'JMRS-Q-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-Q-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-RSCS': '', |
|||
'JMRS-TIME': '', |
|||
'JMRS-RSYW': '', |
|||
'JMRS-RSYW-ZL': '', |
|||
'JMRS-TZJL': '', |
|||
'JMRS-JDJL': '', |
|||
'JMRS-15-NIHSS': '', |
|||
'JMRS-15-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-15-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-30-NIHSS': '', |
|||
'JMRS-30-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-30-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-45-NIHSS': '', |
|||
'JMRS-45-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-45-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-60-NIHSS': '', |
|||
'JMRS-60-SYSTOLIC-PRESSURE': '', |
|||
'JMRS-60-DIASTOLIC-PRESSURE': '', |
|||
'JMRS-BFZ': '', |
|||
'XGZL-Y': '', |
|||
'XGZL-WZLYY': '', |
|||
'XGZL-WZLYY-ELSE': '', |
|||
'XGZL-ZQTH-TIME': '', |
|||
'XGZL-ZQTH-QZ': '', |
|||
'XGZL-SQ-NIHSS': '', |
|||
'XGZL-SQ-ASPECT-CT': '', |
|||
'XGZL-SQ-ASPECT-MRI': '', |
|||
'XGZL-SQ-TICI': '', |
|||
'XGZL-CCWC-TIME': '', |
|||
'XGZL-XGKT': '', |
|||
'XGZL-SH-SCXGZTSJ': '', |
|||
'XGZL-BFZ': '', |
|||
'XGZL-BFZ-ELSE': '', |
|||
}, |
|||
selectCode: '', // 当前选中code |
|||
}; |
|||
}, |
|||
props: ['patientId'], |
|||
components: { |
|||
'v-head': head, |
|||
Adverse, |
|||
Informed, |
|||
}, |
|||
computed: { |
|||
...mapState('patient', ['patientData', 'writeAble']), |
|||
...mapState('storm', ['nationList']), |
|||
}, |
|||
// mounted() { |
|||
// this.$nextTick(() => { |
|||
// if (this.patientData) { |
|||
// this.echo(this.patientData); |
|||
// } |
|||
// }); |
|||
// }, |
|||
async mounted() { |
|||
console.log('patientId', this.patientId) |
|||
if (this.patientId) { |
|||
const res = await queryAidRecord(this.patientId) |
|||
|
|||
this.$nextTick(() => { |
|||
this.echo(res.data) |
|||
}) |
|||
} else { |
|||
this.$nextTick(() => { |
|||
if (this.patientData) { |
|||
this.echo(this.patientData) |
|||
} |
|||
}) |
|||
} |
|||
|
|||
}, |
|||
methods: { |
|||
successInformed() { |
|||
this.modalVisable = false; |
|||
}, |
|||
// 去签署 |
|||
toInform() { |
|||
this.modalVisable = true; |
|||
this.$nextTick(() => { |
|||
this.$refs.informed.open(); |
|||
}); |
|||
}, |
|||
echo(data) { |
|||
const { |
|||
recordValDict, |
|||
patientGender |
|||
} = data; |
|||
this.firstForm.getFieldDecorator(['RYPG-GENDER'], { |
|||
preserve: true, //即便字段不再使用，也保留该字段的值 |
|||
}); |
|||
this.firstForm.setFieldsValue({ |
|||
['RYPG-GENDER']: patientGender === 1 ? '女' : '男', |
|||
}); |
|||
for (let k in recordValDict) { |
|||
if (recordValDict[k]) { |
|||
let answer = recordValDict[k][0].answer; |
|||
this.firstForm.getFieldDecorator([`${k}`], { |
|||
preserve: true, //即便字段不再使用，也保留该字段的值 |
|||
}); |
|||
if (k === 'RYPG-WEIGHT' || k === 'RYPG-HEIGHT') { |
|||
let weight = |
|||
recordValDict['RYPG-WEIGHT'] && |
|||
recordValDict['RYPG-WEIGHT'][0].answer.toString(); |
|||
let height = |
|||
recordValDict['RYPG-HEIGHT'] && |
|||
recordValDict['RYPG-HEIGHT'][0].answer.toString(); |
|||
this.firstForm.setFieldsValue({ |
|||
'RYPG-BMI': this.utils.computeBMI(weight, height), |
|||
}); |
|||
} |
|||
if (Object.keys(this.codeForm).includes(k)) { |
|||
this.codeForm[k] = answer.toString() || ''; |
|||
//多选 |
|||
if ( |
|||
k !== 'JMRS-WRSYY' && |
|||
k !== 'JMRS-BFZ' && |
|||
k !== 'XGZL-WZLYY' && |
|||
k !== 'XGZL-BFZ' && |
|||
k !== 'XGZL-XGKT' |
|||
) { |
|||
answer = answer.toString() || ''; |
|||
} |
|||
this.firstForm.setFieldsValue({ |
|||
[`${k}`]: answer, |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
toMore(name) { |
|||
if (!name) return; |
|||
this.$router.push({ |
|||
name, |
|||
}); |
|||
}, |
|||
computeShow(code, codeForm) { |
|||
return this.utils.computeShow(code, codeForm); |
|||
}, |
|||
selectOption(v) { |
|||
this.selectCode = v; |
|||
this.pickerVisable = true; |
|||
}, |
|||
// |
|||
onConfirm(date) { |
|||
this.firstForm.setFieldsValue({ |
|||
[`${this.selectCode}`]: this.utils.format(date), |
|||
}); |
|||
this.pickerVisable = false; |
|||
// this.updateAidBase(this.selectCode, this.utils.format(date)) |
|||
}, |
|||
//格式化日期 |
|||
formatter(type, val) { |
|||
if (type === 'year') { |
|||
return val + '年'; |
|||
} |
|||
if (type === 'month') { |
|||
return val + '月'; |
|||
} |
|||
if (type === 'day') { |
|||
return val + '日'; |
|||
} |
|||
if (type === 'hour') { |
|||
return val + '时'; |
|||
} |
|||
if (type === 'minute') { |
|||
return val + '分'; |
|||
} |
|||
return val; |
|||
}, |
|||
handleChange(value, code, type, show) { |
|||
this.codeForm[code] = value; |
|||
if (show === 'checkbox') { |
|||
this.utils.computeShow(code, this.codeForm); |
|||
} |
|||
if (code === 'RYPG-WEIGHT' || code === 'RYPG-HEIGHT') { |
|||
this.codeForm['RYPG-BMI'] = this.utils.computeBMI( |
|||
this.codeForm['RYPG-WEIGHT'], |
|||
this.codeForm['RYPG-HEIGHT'] |
|||
); |
|||
this.firstForm.setFieldsValue({ |
|||
['RYPG-BMI']: this.codeForm['RYPG-BMI'], |
|||
}); |
|||
} |
|||
// this.updateAidBase(code, value, type) |
|||
}, |
|||
async onSubmit(e) { |
|||
e.preventDefault(); |
|||
let codeAndAnswerList = [], |
|||
params = {}; |
|||
this.$nextTick(async () => { |
|||
let adverseSubmit = this.$refs.adverse; |
|||
if (adverseSubmit) { |
|||
let res = await adverseSubmit.onAdverseSubmit(e, 'first'); |
|||
if (res.length > 0) { |
|||
codeAndAnswerList = codeAndAnswerList.concat(res); |
|||
} |
|||
} |
|||
this.firstForm.validateFields(async (err, values) => { |
|||
for (var k in values) { |
|||
if (Object.keys(this.codeForm).includes(k)) { |
|||
let answer = [values[k]]; |
|||
if (typeof values[k] !== 'string') { |
|||
answer = values[k]; |
|||
} |
|||
if (values[k]) { |
|||
codeAndAnswerList.push({ |
|||
questionCode: k, |
|||
answer, |
|||
time: '', |
|||
}); |
|||
} |
|||
} else if ( |
|||
values[k] && |
|||
k !== 'RYPG-BMI' && |
|||
k !== 'RYPG-GENDER' |
|||
) { |
|||
params[`${k}`] = values[k]; |
|||
} |
|||
} |
|||
await this.home.updateAidCode({ |
|||
...params, |
|||
codeAndAnswerList, |
|||
}, |
|||
false |
|||
); |
|||
this.$message.success("操作成功") |
|||
this.$emit('next') |
|||
}); |
|||
}); |
|||
}, |
|||
//更新基本信息 |
|||
async updateAidBase(code, value, type) { |
|||
let params; |
|||
let codeAndAnswerList = []; |
|||
if (type) { |
|||
params = { |
|||
[`${code}`]: value, |
|||
}; |
|||
} else { |
|||
let answer = [value]; |
|||
if (typeof value !== 'string') { |
|||
answer = value; |
|||
} |
|||
codeAndAnswerList.push({ |
|||
questionCode: code, |
|||
answer, |
|||
time: '', |
|||
}); |
|||
} |
|||
await this.home.updateAidCode({ |
|||
...params, |
|||
codeAndAnswerList, |
|||
}, |
|||
false |
|||
); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="less"> |
|||
p { |
|||
margin: 0; |
|||
} |
|||
|
|||
.Overviewbasicr { |
|||
display: flex; |
|||
margin-bottom: 0; |
|||
|
|||
.first-content { |
|||
flex: 1; |
|||
overflow-y: auto; |
|||
} |
|||
|
|||
.first-footer { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
margin-top: 20px; |
|||
padding: 0 10%; |
|||
} |
|||
|
|||
.jmrs-form-item-con{ |
|||
display: flex; |
|||
.content-left, |
|||
.content-right{ |
|||
flex: 1; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.first { |
|||
/deep/ .ant-modal { |
|||
max-height: 500px; |
|||
overflow-y: auto; |
|||
} |
|||
} |
|||
|
|||
.adverse { |
|||
padding: 15px 0; |
|||
} |
|||
</style> |
|||
<style scoped> |
|||
>>>.adverse .ant-form-item { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
>>>.adverse .ant-form-item-label { |
|||
width: 25%; |
|||
} |
|||
|
|||
>>>.adverse .ant-form-item-control-wrapper { |
|||
flex: 1; |
|||
display: flex; |
|||
justify-content: flex-end; |
|||
} |
|||
|
|||
>>>.adverse .ant-form-item-label label { |
|||
font-size: 22px !important; |
|||
} |
|||
|
|||
>>>.adverse .ant-input { |
|||
width: 100% !important; |
|||
background: none; |
|||
} |
|||
|
|||
>>>.adverse .ant-form-item-control { |
|||
margin-left: 0; |
|||
} |
|||
|
|||
>>>.ant-btn-link { |
|||
color: #7690e5; |
|||
font-size: 24px; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
>>>.ant-radio-wrapper { |
|||
text-align: left; |
|||
font-size: 24px; |
|||
height: 58px !important; |
|||
line-height: 58px !important; |
|||
box-sizing: border-box; |
|||
border-bottom: 1px solid #f0f0f0 !important; |
|||
} |
|||
|
|||
>>>.ant-collapse { |
|||
border: none; |
|||
background: none; |
|||
} |
|||
|
|||
>>>.ant-collapse-header { |
|||
font-size: 24px; |
|||
padding: 10px 0 !important; |
|||
font-weight: bold; |
|||
text-align: left; |
|||
} |
|||
|
|||
>>>.ant-collapse-item { |
|||
flex: 1; |
|||
border-bottom: 0px; |
|||
} |
|||
|
|||
>>>.ant-collapse-content-box { |
|||
padding: 0 10px; |
|||
} |
|||
|
|||
>>>.detail-form .jmrs-form-item .ant-form-item-control-wrapper { |
|||
flex: 1; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
>>>.detail-form .jmrs-form-item .ant-form-item-control { |
|||
flex: 1; |
|||
margin-left: 0; |
|||
} |
|||
|
|||
>>>.ant-radio-wrapper:last-child { |
|||
border-bottom: none !important; |
|||
} |
|||
|
|||
>>>.ant-radio { |
|||
font-size: 24px; |
|||
} |
|||
|
|||
>>>.ant-radio-inner::after { |
|||
width: 16px; |
|||
height: 16px; |
|||
} |
|||
|
|||
>>>.ant-radio-inner { |
|||
width: 24px; |
|||
height: 24px; |
|||
} |
|||
|
|||
.back-ff { |
|||
box-shadow: 0 2px 12px 0 rgba(52, 52, 52, 0.1); |
|||
background: #fff; |
|||
padding: 10px 20px; |
|||
border-radius: 12px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,169 @@ |
|||
<template> |
|||
<div class="throm-result"> |
|||
<div class="throm-step"> |
|||
<a-steps progress-dot :current="currentIndex" direction="vertical" @change="handleClickStep"> |
|||
<a-step :status="currentIndex == 0 ? 'process' : currentIndex > 0 ? 'finish' : 'wait'" title="患者基本信息" /> |
|||
<a-step :status="currentIndex == 1 ? 'process' : currentIndex > 1 ? 'finish' : 'wait'" title="急救信息记录" /> |
|||
</a-steps> |
|||
</div> |
|||
<div class="throm-content"> |
|||
<div v-if="currentIndex == 0"> |
|||
<throm-result-baseInfo @next="handleNext"></throm-result-baseInfo> |
|||
</div> |
|||
<div v-else-if="currentIndex == 1"> |
|||
<throm-result-firstInfo @next="handleNextStep"></throm-result-firstInfo> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import ThromResultBaseInfo from './throm-result-baseInfo.vue'; |
|||
import ThromResultFirstInfo from './throm-result-firstInfo.vue'; |
|||
export default { |
|||
name: "ThromResult", |
|||
components: { |
|||
ThromResultBaseInfo, |
|||
ThromResultFirstInfo |
|||
}, |
|||
data() { |
|||
return { |
|||
currentIndex: 0, |
|||
labelCol: { |
|||
span: 4 |
|||
}, |
|||
wrapperCol: { |
|||
span: 18 |
|||
}, |
|||
form: {} |
|||
} |
|||
}, |
|||
created() { |
|||
|
|||
}, |
|||
methods: { |
|||
handleClickStep(current) { |
|||
this.currentIndex = current; |
|||
}, |
|||
handleNext() { |
|||
this.currentIndex++ |
|||
}, |
|||
handleNextStep() { |
|||
this.$emit('next') |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="less" scoped> |
|||
.throm-result { |
|||
display: flex; |
|||
|
|||
.throm-step { |
|||
padding: 10px; |
|||
margin-right: .2rem; |
|||
background-color: #fff; |
|||
|
|||
.ant-steps-vertical .ant-steps-item-content { |
|||
min-height: 6rem; |
|||
} |
|||
|
|||
.ant-steps-item-title { |
|||
padding: 0; |
|||
} |
|||
|
|||
.ant-steps-item-finish { |
|||
.ant-steps-item-title { |
|||
color: #000000; |
|||
} |
|||
} |
|||
|
|||
.ant-steps-item-process { |
|||
.ant-steps-item-title { |
|||
color: #007AFF; |
|||
// border-bottom: 1px solid #007AFF; |
|||
border-bottom: 3px solid transparent; |
|||
/* 设置透明的底部边框 */ |
|||
border-image: linear-gradient(to right, #fff, #007AFF) 1; |
|||
/* 使用渐变色填充边框 */ |
|||
border-radius: 10px; |
|||
/* 设置圆角 */ |
|||
} |
|||
} |
|||
} |
|||
|
|||
.throm-content { |
|||
height: calc(100vh - 120px); |
|||
overflow-y: auto; |
|||
padding: 10px; |
|||
box-sizing: border-box; |
|||
flex: 1; |
|||
background-color: #fff; |
|||
|
|||
.ant-form .ant-form-item-label label { |
|||
font-size: 0.85rem; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
.ant-form-item { |
|||
background: #f9f9f9; |
|||
margin-bottom: .5rem; |
|||
padding: 12px; |
|||
border-radius: 4px; |
|||
} |
|||
|
|||
.ant-radio-button-wrapper { |
|||
padding: 0 1.64vw; |
|||
height: 3.64vw; |
|||
line-height: 3.64vw; |
|||
font-size: 0.75rem !important; |
|||
margin-right: 1.82vw; |
|||
margin-bottom: 0.91vw; |
|||
border: 0.5px solid #a3acbf; |
|||
border-radius: 0.55vw; |
|||
vertical-align: middle; |
|||
|
|||
&:before, |
|||
.ant-radio-button-wrapper-checked:before { |
|||
display: none !important; |
|||
} |
|||
|
|||
&:first-child, |
|||
&:last-child { |
|||
border-radius: 6px !important; |
|||
} |
|||
|
|||
&:last-child { |
|||
margin-right: 0; |
|||
} |
|||
} |
|||
|
|||
.solid { |
|||
.ant-checkbox-wrapper { |
|||
background: #f9f9f9; |
|||
border: 0.5px solid #a3acbf; |
|||
border-radius: 6px; |
|||
vertical-align: middle; |
|||
margin-right: 20px; |
|||
margin-bottom: 10px; |
|||
font-size: 0.75vw !important; |
|||
line-height: 40px; |
|||
padding: 0 6px; |
|||
height: 40px; |
|||
min-width: 0 !important; |
|||
|
|||
&.ant-checkbox-wrapper-checked { |
|||
background: #007AFF; |
|||
color: #fff; |
|||
} |
|||
|
|||
.ant-checkbox { |
|||
display: none; |
|||
} |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue