You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
783 lines
25 KiB
783 lines
25 KiB
3 years ago
|
<template>
|
||
|
|
<el-dialog title="" class="detail-view" :fullscreen="true" :visible.sync="visible" append-to-body @close="closedDialog">
|
||
|
|
<span slot="title" style="display:inline-block;height: 100%">
|
||
|
|
<div class="picTool">
|
||
|
|
<span class="dataBtn" @click="handleSelete(1)">数据与表单</span>
|
||
|
|
<span class="imgBtn" @click="handleSelete(2)">图像与报告</span>
|
||
|
|
<img
|
||
|
|
v-if="isActive === 1"
|
||
|
|
class="pic_img"
|
||
|
|
:src="require('@/assets/img/selecetPic.png')"
|
||
|
|
alt=""
|
||
|
|
@click="handleSelete(1)"
|
||
|
|
>
|
||
|
|
<img v-else class="pic_img" :src="require('@/assets/img/picTool.png')" alt="" @click="handleSelete(1)">
|
||
|
|
<img
|
||
|
|
v-if="isActive === 1"
|
||
|
|
class="pic_img"
|
||
|
|
:src="require('@/assets/img/picTool.png')"
|
||
|
|
alt=""
|
||
|
|
@click="handleSelete(2)"
|
||
|
|
>
|
||
|
|
<img v-else class="pic_img" :src="require('@/assets/img/selecetPic.png')" alt="" @click="handleSelete(2)">
|
||
|
|
</div>
|
||
|
|
</span>
|
||
|
|
<div class="template-container-360">
|
||
|
|
<!-- 概况 -->
|
||
|
|
<div class="patient-wrapper">
|
||
|
|
<!-- 时间轴 -->
|
||
|
|
<time-line
|
||
|
|
v-if="isActive === 1"
|
||
|
|
ref="timeline"
|
||
|
|
:time-axis-data="timeAxisData"
|
||
|
|
class="time-line"
|
||
|
|
@getTimeAxisData="getTimeAxisData"
|
||
|
|
v-on="$listeners"
|
||
|
|
@getTimeAxisNodeInfo="getTimeAxisNodeInfo"
|
||
|
|
@getVisitRecordInfo="getVisitRecordInfo"
|
||
|
|
/>
|
||
|
|
<!-- 数据与表单-->
|
||
|
|
<div v-if="isActive === 1" class="info-content">
|
||
|
|
<el-scrollbar class="scrollbar-wrapper" style="height:100%;">
|
||
|
|
<div class="dataForm">
|
||
|
|
<div class="data-header">
|
||
|
|
<div class="personMsg">
|
||
|
|
<img class="mr16" style="vertical-align: middle" :src="require('@/assets/img/icon-idcard.png')" alt="">
|
||
|
|
<span class="mr16">{{ patientBaseData.patientName }}</span>
|
||
|
|
<span class="mr16">{{ patientBaseData.patientSex }}</span>
|
||
|
|
<span v-if="patientBaseData.patientAge">{{ patientBaseData.patientAge }}岁</span>
|
||
|
|
</div>
|
||
|
|
<div class="personInfo">
|
||
|
|
<span>身份证号：{{ patientBaseData.patientIdNumber }}</span>
|
||
|
|
<span>病历号：{{ patientBaseData.patientId }}</span>
|
||
|
|
<span>出生日期：{{ patientBaseData.patientBirthday ? patientBaseData.patientBirthday.substring(0, 11) : '' }}</span>
|
||
|
|
<span>电话：{{ patientBaseData.patientPhone }}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div style="width: 100%;height: 100%;flex: 1">
|
||
|
|
<div v-if="type === '检查'">
|
||
|
|
<p class="clinical">临床数据</p>
|
||
|
|
<div v-for="(item,index) in timeAxisNodeInfo" :key="index1" class="dataRecord">
|
||
|
|
<div
|
||
|
|
style="display:flex;justify-content:space-between;padding:15px;box-sizing: border-box;color: #FFFFFF;"
|
||
|
|
>
|
||
|
|
<div>
|
||
|
|
<p v-show="item.createTime" style="margin-bottom: 10px">日期:
|
||
|
|
{{ item.createTime ? item.createTime.substring(0, 11) : '' }}</p>
|
||
|
|
<p v-show="item.clinComplain">主诉: {{ item.clinComplain }}</p>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<p v-show="item.clinSymp" style="margin-bottom: 10px">症状: {{ item.clinSymp }}</p>
|
||
|
|
<p v-show="item.clinDiag">诊断: {{ item.clinDiag }}</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div style="background-color: #0C1016;height: 10px;" />
|
||
|
|
<el-table
|
||
|
|
v-if="item.list.length"
|
||
|
|
:data="item.list"
|
||
|
|
style="width: 100%;"
|
||
|
|
>
|
||
|
|
<el-table-column
|
||
|
|
prop="examineItem"
|
||
|
|
label="检查项目"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="examTime"
|
||
|
|
label="检查时间"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
</el-table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-if="type === '诊断'">
|
||
|
|
<div v-for="item in timeAxisNodeInfo" :key="item.id">
|
||
|
|
<p class="clinical">{{ item.createTime ? item.createTime.substring(0,10) : '' }}</p>
|
||
|
|
<div class="dataRecord">
|
||
|
|
<el-table
|
||
|
|
:data="item.list"
|
||
|
|
style="width: 100%"
|
||
|
|
>
|
||
|
|
<el-table-column
|
||
|
|
prop="diagName"
|
||
|
|
label="诊断内容"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
label="主诊断"
|
||
|
|
align="center"
|
||
|
|
>
|
||
|
|
<template slot-scope="scope">
|
||
|
|
{{ scope.row.isMain === '1' ? '是' : '否' }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-if="type === '用药'">
|
||
|
|
<div v-for="item in timeAxisNodeInfo" :key="item.id">
|
||
|
|
<p class="clinical">{{ item.createTime ? item.createTime.substring(0,10) : '' }}</p>
|
||
|
|
<div class="dataRecord">
|
||
|
|
<el-table
|
||
|
|
:data="item.list"
|
||
|
|
style="width: 100%"
|
||
|
|
>
|
||
|
|
<el-table-column
|
||
|
|
prop="medName"
|
||
|
|
label="商品名"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="socName"
|
||
|
|
label="通用名"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="site"
|
||
|
|
label="部位"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="itemType"
|
||
|
|
label="门诊/住院"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
</el-table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-if="type === '手术'">
|
||
|
|
<div v-for="item in timeAxisNodeInfo" :key="item.id">
|
||
|
|
<p class="clinical">{{ item.createTime ? item.createTime.substring(0,10) : '' }}</p>
|
||
|
|
<div class="dataRecord">
|
||
|
|
<el-table
|
||
|
|
:data="item.list"
|
||
|
|
style="width: 100%"
|
||
|
|
>
|
||
|
|
<el-table-column
|
||
|
|
prop="bedNo"
|
||
|
|
label="床号"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="deptName"
|
||
|
|
label="部门名"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="wardName"
|
||
|
|
label="病区名"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="mainDrName"
|
||
|
|
label="主刀医生姓名"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="opName"
|
||
|
|
label="手术名称"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="opPartName"
|
||
|
|
label="手术部位"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="opTime"
|
||
|
|
label="手术时间"
|
||
|
|
align="center"
|
||
|
|
>
|
||
|
|
<template slot-scope="scope">
|
||
|
|
{{ scope.row.opTime.substring(0,10) }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column
|
||
|
|
label="主手术"
|
||
|
|
align="center"
|
||
|
|
>
|
||
|
|
<template slot-scope="scope">
|
||
|
|
{{ scope.row.isMain === '1' ? '是' : '否' }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-if="type === '住院'">
|
||
|
|
<div class="dataRecord">
|
||
|
|
<el-table
|
||
|
|
:data="timeAxisNodeInfo"
|
||
|
|
style="width: 100%"
|
||
|
|
>
|
||
|
|
<el-table-column
|
||
|
|
prop="deptName"
|
||
|
|
label="部门名称"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="wardName"
|
||
|
|
label="病区名称"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="diagName"
|
||
|
|
label="诊断名称"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
label="住院日期"
|
||
|
|
align="center"
|
||
|
|
>
|
||
|
|
<template slot-scope="scope">
|
||
|
|
{{ scope.row.inDate ? scope.row.inDate.substring(0, 10) : '' }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column
|
||
|
|
label="出院日期"
|
||
|
|
align="center"
|
||
|
|
>
|
||
|
|
<template slot-scope="scope">
|
||
|
|
{{ scope.row.outDate ? scope.row.outDate.substring(0, 10) : '' }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-if="type === '出院'">
|
||
|
|
<div class="dataRecord">
|
||
|
|
<el-table
|
||
|
|
:data="timeAxisNodeInfo"
|
||
|
|
style="width: 100%"
|
||
|
|
>
|
||
|
|
<el-table-column
|
||
|
|
prop="deptName"
|
||
|
|
label="部门名称"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="wardName"
|
||
|
|
label="病区名称"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
prop="diagName"
|
||
|
|
label="诊断名称"
|
||
|
|
align="center"
|
||
|
|
/>
|
||
|
|
<el-table-column
|
||
|
|
label="住院日期"
|
||
|
|
align="center"
|
||
|
|
>
|
||
|
|
<template slot-scope="scope">
|
||
|
|
{{ scope.row.inDate ? scope.row.inDate.substring(0, 10) : '' }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column
|
||
|
|
label="出院日期"
|
||
|
|
align="center"
|
||
|
|
>
|
||
|
|
<template slot-scope="scope">
|
||
|
|
{{ scope.row.outDate ? scope.row.outDate.substring(0, 10) : '' }}
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-if="isVisit === '1'" style="height: 100%">
|
||
|
|
<p class="clinical">{{ type }}</p>
|
||
|
|
<div class="VisitContent">
|
||
|
|
|
||
|
|
<crf
|
||
|
|
v-if="crfVisible"
|
||
|
|
ref="crfComponent"
|
||
|
|
:value="VisitContent"
|
||
|
|
:height="'100%'"
|
||
|
|
:js-arr="jsArr"
|
||
|
|
:body-style-show="true"
|
||
|
|
style="margin: 0;padding: 40px 0;width: 95%;border: 1px solid #000;background:#fff;"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</el-scrollbar>
|
||
|
|
</div>
|
||
|
|
<!-- 图像与报告 -->
|
||
|
|
<keep-alive>
|
||
|
|
<imgRecord v-if="isActive === 2" :patient-info="patientBaseData" />
|
||
|
|
</keep-alive>
|
||
|
|
<!-- 关键指标 -->
|
||
|
|
<!-- 收缩框 -->
|
||
|
|
<div v-if="isActive === 1" v-move class="key-indicators-shrink">
|
||
|
|
<div class="icon-circle" @click="shrinkClick">
|
||
|
|
<i :class="drawer==true ? 'el-icon-arrow-right':'el-icon-arrow-left'" />
|
||
|
|
</div>
|
||
|
|
<img :src="require('@/assets/img/key-indicators.png')" alt="">
|
||
|
|
</div>
|
||
|
|
<key-indicators
|
||
|
|
v-show="drawer && isActive === 1"
|
||
|
|
id="drawerKey"
|
||
|
|
ref="keyIndicatorRef"
|
||
|
|
class="key-content"
|
||
|
|
v-bind="$attrs"
|
||
|
|
:patient-id="patientId"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import timeLine from './time-line.vue'
|
||
|
|
import keyIndicators from './key-indicators'
|
||
|
|
import imgRecord from './img-reccrd.vue'
|
||
|
|
import moment from 'moment' // 导入模块
|
||
|
|
import crf from '@/components/hm-crf/load_content.vue'
|
||
|
|
import IntelligentFill from '@/mixins/IntelligentFill.js'
|
||
|
|
const Base64 = require('js-base64').Base64
|
||
|
|
|
||
|
|
export default {
|
||
|
|
components: { timeLine, keyIndicators, crf, imgRecord },
|
||
|
|
directives: {
|
||
|
|
move(el, bindings) {
|
||
|
|
el.onmousedown = (e) => {
|
||
|
|
const init = e.clientX
|
||
|
|
const parent = document.getElementById('drawerKey')
|
||
|
|
const initWidth = parent.offsetWidth
|
||
|
|
document.onmousemove = function(e) {
|
||
|
|
const end = e.clientX
|
||
|
|
const newWidth = init - end + initWidth
|
||
|
|
parent.style.width = newWidth + 'px'
|
||
|
|
}
|
||
|
|
document.onmouseup = function() {
|
||
|
|
document.onmousemove = document.onmouseup = null
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mixins: [IntelligentFill],
|
||
|
|
props: {
|
||
|
|
id: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
},
|
||
|
|
patientId: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
},
|
||
|
|
isSearch: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
drawer: true,
|
||
|
|
visible: false,
|
||
|
|
patientBaseData: {},
|
||
|
|
timeAxisNodeInfo: [], // 点击左侧时间轴获取到的中间区域详细信息
|
||
|
|
VisitContent: '', // 首诊单
|
||
|
|
detailInfo: [], // 详细信息
|
||
|
|
timeAxisData: [], // 左侧时间轴数据
|
||
|
|
kpilist: [], // kpi关键指标checkbox
|
||
|
|
ShiLiAndYanYaData: {}, // 视力和眼压
|
||
|
|
isActive: 1, // 控制数据与报告tab展示
|
||
|
|
fileFlag: true, // 文件展示组件
|
||
|
|
type: '', // 筛查类型
|
||
|
|
defaultProps: {
|
||
|
|
children: 'children',
|
||
|
|
label: 'tagName'
|
||
|
|
},
|
||
|
|
jsArr: [],
|
||
|
|
isVisit: '',
|
||
|
|
crfVisible: false,
|
||
|
|
dataForm: {}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
init() {
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.$refs.keyIndicatorRef.init()
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// 重置时间轴样式
|
||
|
|
setIndex() {
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.$refs.timeline.currentIndex = 0
|
||
|
|
this.$refs.timeline.itemCurrentIndex = 0
|
||
|
|
this.$refs.timeline.itemListCurrentIndex = 0
|
||
|
|
this.$refs.timeline.setCheckArr()
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// 关键指标组件是否显示
|
||
|
|
shrinkClick() {
|
||
|
|
this.drawer = !this.drawer
|
||
|
|
// if (this.drawer) {
|
||
|
|
// this.$nextTick(() => {
|
||
|
|
// this.$refs.keyIndicatorRef.init()
|
||
|
|
// })
|
||
|
|
// }
|
||
|
|
},
|
||
|
|
// 根据id获取患者信息--中间上侧患者信息
|
||
|
|
async getPatientData() {
|
||
|
|
const { data: res } = await this.$http.get(
|
||
|
|
'/patient/view/getPatientData',
|
||
|
|
{
|
||
|
|
params: {
|
||
|
|
patientId: this.patientId
|
||
|
|
}
|
||
|
|
}
|
||
|
|
)
|
||
|
|
if (res.code === 0) {
|
||
|
|
this.patientBaseData = res.data ? res.data : {}
|
||
|
|
} else {
|
||
|
|
this.$message.error(res.msg)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 获取时间轴数据--左侧时间轴
|
||
|
|
async getTimeAxisData(typeScreenCheckArr) {
|
||
|
|
const type = ['诊断', '手术', '用药', '住院', '出院', '检查', '随访']
|
||
|
|
const { data: res } = await this.$http({
|
||
|
|
method: 'post',
|
||
|
|
url: '/patient/view/getTimeAxisData',
|
||
|
|
data: {
|
||
|
|
patientId: this.patientId,
|
||
|
|
type: typeScreenCheckArr !== undefined ? typeScreenCheckArr : type
|
||
|
|
}
|
||
|
|
})
|
||
|
|
if (res.code === 0) {
|
||
|
|
res.data.forEach(item => {
|
||
|
|
item.data.forEach(iten => {
|
||
|
|
iten.active = false
|
||
|
|
})
|
||
|
|
})
|
||
|
|
this.timeAxisData = res.data.length > 0 ? res.data : []
|
||
|
|
if (res.data.length > 0) {
|
||
|
|
const info = this.timeAxisData[0].data[0].itemList[0]
|
||
|
|
info.isVisit === '1' ? this.getVisitRecordInfo(info) : this.getTimeAxisNodeInfo(info)
|
||
|
|
}
|
||
|
|
if (!res.data.length) {
|
||
|
|
this.timeAxisNodeInfo = []
|
||
|
|
this.type = ''
|
||
|
|
this.isVisit = ''
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
this.$message.error(res.msg)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 获取时间轴节点信息--点击左侧时间轴获取患者具体信息
|
||
|
|
async getTimeAxisNodeInfo(item) {
|
||
|
|
this.type = item.type
|
||
|
|
this.isVisit = item.isVisit
|
||
|
|
const { data: res } = await this.$http.get('/patient/view/getTimeAxisNodeInfo', {
|
||
|
|
params: {
|
||
|
|
date: moment(item.date).format('YYYY-MM-DD'),
|
||
|
|
type: item.type,
|
||
|
|
patientId: this.patientId
|
||
|
|
}
|
||
|
|
})
|
||
|
|
if (res.code === 0) {
|
||
|
|
this.timeAxisNodeInfo = res.data && res.data.length ? res.data[0].data : []
|
||
|
|
this.isActive = 1
|
||
|
|
} else {
|
||
|
|
this.$message.error(res.msg)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 获取CRF表单
|
||
|
|
async getVisitRecordInfo(info) {
|
||
|
|
this.crfVisible = false
|
||
|
|
this.type = info.type
|
||
|
|
this.isVisit = info.isVisit
|
||
|
|
const { data: res } = await this.$http.get(`/visit/record/${info.formId}`)
|
||
|
|
if (res.code === 0) {
|
||
|
|
this.VisitContent = res.data.formContent ? Base64.decode(res.data.formContent) : ''
|
||
|
|
this.dataForm = res.data
|
||
|
|
res.data.isWrite === 0 && (res.data.crfDescription === '智能填充' || res.data.crfDescription === '病历模板') ? this.getFirstFeedbackData('智能填充', this.dataForm.id) : this.CRFLoading = false
|
||
|
|
this.crfVisible = true
|
||
|
|
} else {
|
||
|
|
this.$message.error(res.msg)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 切换数据与表单、图像与报告tab
|
||
|
|
handleSelete(index) {
|
||
|
|
this.isActive = index1
|
||
|
|
},
|
||
|
|
// 关闭弹框时
|
||
|
|
closedDialog() {
|
||
|
|
this.$emit('detailViewVisible')
|
||
|
|
this.visible = false
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
.aui-wrapper .detail-view .el-table th {
|
||
|
|
color: #ffffff !important;
|
||
|
|
background-color: #1f2328 !important;
|
||
|
|
}
|
||
|
|
.detail-view {
|
||
|
|
.el-scrollbar__wrap {
|
||
|
|
margin-right: -6px !important;
|
||
|
|
}
|
||
|
|
.el-scrollbar__view {
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
.el-dialog.is-fullscreen {
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.el-input__inner {
|
||
|
|
background-color: #000000;
|
||
|
|
border: 1px solid #1c69dc;
|
||
|
|
color: #ffffff;
|
||
|
|
}
|
||
|
|
.el-step__icon {
|
||
|
|
width: 8px;
|
||
|
|
height: 8px;
|
||
|
|
//background-color: #49AA19;
|
||
|
|
margin-right: 11px;
|
||
|
|
}
|
||
|
|
// 完成
|
||
|
|
.el-step__head.is-success .el-step__icon {
|
||
|
|
background: #49AA19;
|
||
|
|
}
|
||
|
|
.el-step__icon-inner {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.el-step__title {
|
||
|
|
line-height: 25px;
|
||
|
|
}
|
||
|
|
.el-step__head.is-finish {
|
||
|
|
color: #49aa19;
|
||
|
|
border-color: #49aa19;
|
||
|
|
}
|
||
|
|
.el-step__line {
|
||
|
|
margin-right: 12px !important;
|
||
|
|
//background-color: #49AA19
|
||
|
|
}
|
||
|
|
.el-step__icon.is-text {
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
.el-step.is-center .el-step__description{
|
||
|
|
padding: 0 8%;
|
||
|
|
}
|
||
|
|
.el-table th, .el-table .has-gutter .tr{
|
||
|
|
color: #FFFFFF;
|
||
|
|
background: #1F2328;
|
||
|
|
}
|
||
|
|
.el-table th, .el-table tr{
|
||
|
|
color: #FFFFFF;
|
||
|
|
background: #1F2328;
|
||
|
|
}
|
||
|
|
.aui-wrapper .el-table th{
|
||
|
|
color: #FFFFFF;
|
||
|
|
background: #1F2328;
|
||
|
|
}
|
||
|
|
.el-table tbody th, .el-table tbody tr{
|
||
|
|
color: #FFFFFF;
|
||
|
|
background-color: #0C1016;
|
||
|
|
}
|
||
|
|
.el-table--enable-row-hover .el-table__body tr:hover>td {
|
||
|
|
background-color: #0C1016;
|
||
|
|
}
|
||
|
|
.el-table, .el-table__expanded-cell{
|
||
|
|
background-color: #0C1016;
|
||
|
|
border-bottom: 1px solid #000;
|
||
|
|
}
|
||
|
|
.el-table td, .el-table th.is-leaf{
|
||
|
|
border-bottom: 1px solid #1F2328;
|
||
|
|
}
|
||
|
|
.el-table{
|
||
|
|
border: 1px solid #1F2328;
|
||
|
|
}
|
||
|
|
.el-table--border::after, .el-table--group::after, .el-table::before{
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.picTool{
|
||
|
|
position: relative;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
display: inline-block;
|
||
|
|
text-align: center;
|
||
|
|
cursor: pointer;
|
||
|
|
|
||
|
|
.dataBtn {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 24px;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #FFFFFF;
|
||
|
|
}
|
||
|
|
.imgBtn {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 40px;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #FFFFFF;
|
||
|
|
}
|
||
|
|
.pic_img{
|
||
|
|
height: 44px;
|
||
|
|
margin-left: -16px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.template-container-360 {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
|
||
|
|
// 时间轴
|
||
|
|
.time-line {
|
||
|
|
display: inline-block;
|
||
|
|
vertical-align: top;
|
||
|
|
text-align: left;
|
||
|
|
width: 200px;
|
||
|
|
height: 100%;
|
||
|
|
padding: 10px 0;
|
||
|
|
}
|
||
|
|
.patient-wrapper {
|
||
|
|
.scrollbar-wrapper .el-scrollbar__wrap {
|
||
|
|
padding-right: 10px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.key-indicators-shrink {
|
||
|
|
width: 32px;
|
||
|
|
height: 100%;
|
||
|
|
background: linear-gradient(90deg, rgba(47, 130, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%);
|
||
|
|
.icon-circle {
|
||
|
|
border-radius: 50%;
|
||
|
|
width: 24px;
|
||
|
|
height: 24px;
|
||
|
|
border: 2px solid rgba(30, 121, 255, 0.4);
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
margin-top: 18px;
|
||
|
|
margin-left: 3px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
.el-icon-arrow-right,.el-icon-arrow-left {
|
||
|
|
color: #fff;
|
||
|
|
font-weight: 700;
|
||
|
|
}
|
||
|
|
img {
|
||
|
|
width: 32px;
|
||
|
|
height: 142px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
// 关键指标
|
||
|
|
.key-content {
|
||
|
|
height: 100%;
|
||
|
|
width: calc(33% - 5px);
|
||
|
|
padding-bottom: 50px;
|
||
|
|
}
|
||
|
|
.key-indicators-shrink:hover{
|
||
|
|
cursor: w-resize;
|
||
|
|
}
|
||
|
|
|
||
|
|
// 病人信息
|
||
|
|
.patient-wrapper {
|
||
|
|
display: flex;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background-color: #0c1016;
|
||
|
|
|
||
|
|
// 信息
|
||
|
|
.info-content {
|
||
|
|
flex: 1;
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
min-width: 530px;
|
||
|
|
padding: 10px 16px;
|
||
|
|
height: calc(100% - 50px);
|
||
|
|
.info-btn{
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 16px;
|
||
|
|
}
|
||
|
|
.picBtn{
|
||
|
|
margin-left: 0;
|
||
|
|
background-color: #0C1016;
|
||
|
|
border: 1px solid #3D3D3D;
|
||
|
|
color: #FFFFFF;
|
||
|
|
}
|
||
|
|
.bgBlue{
|
||
|
|
background-color: #1C69DC;
|
||
|
|
}
|
||
|
|
.dataForm{
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
.data-header{
|
||
|
|
width: 100%;
|
||
|
|
height: 96px;
|
||
|
|
padding: 16px;
|
||
|
|
background: linear-gradient(180deg,rgba(0,70,251,0.46), rgba(0,3,11,0.10) 100%);
|
||
|
|
border-radius: 4px;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
.clinical{
|
||
|
|
font-size: 20px;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #FFFFFF;
|
||
|
|
margin: 0 0 14px 16px;
|
||
|
|
}
|
||
|
|
.VisitContent{
|
||
|
|
width: 100%;
|
||
|
|
height: 1500px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.dataRecord{
|
||
|
|
width: 100%;
|
||
|
|
background: rgba(255,255,255,0.08);
|
||
|
|
border-radius: 4px;
|
||
|
|
margin-bottom: 22px;
|
||
|
|
}
|
||
|
|
.dataPad{
|
||
|
|
padding: 32px 0px;
|
||
|
|
}
|
||
|
|
.personMsg{
|
||
|
|
color: #FFFFFF;
|
||
|
|
font-size: 20px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
}
|
||
|
|
.personInfo{
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
color: #FFFFFF;
|
||
|
|
font-size: 14px;
|
||
|
|
white-space: nowrap; // 段落不换行
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.mr16{
|
||
|
|
margin-right: 16px;
|
||
|
|
}
|
||
|
|
.stepRecord{
|
||
|
|
.step-title{
|
||
|
|
font-size: 16px;
|
||
|
|
color: #FFFFFF;
|
||
|
|
}
|
||
|
|
.step-description{
|
||
|
|
text-align: left;
|
||
|
|
font-size: 14px;
|
||
|
|
color: rgba(255,255,255,0.45);
|
||
|
|
margin-top: 5px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|