nicky
1 year 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