newPeter7
2 years ago
13 changed files with 308 additions and 2244 deletions
File diff suppressed because it is too large
@ -1,634 +0,0 @@ |
|||||
<template> |
|
||||
<div class="container"> |
|
||||
<div style="flex: 1"> |
|
||||
<div class="header"> |
|
||||
<img :src="require('@/assets/img/back-l.png')" alt="" style="margin-right: 8px;cursor: pointer" @click="backList"> |
|
||||
<img :src="require('@/assets/img/boy.png')" alt=""> |
|
||||
<p class="head-t"> |
|
||||
<span class="head-r">{{ patientBaseData.patientName }}</span> |
|
||||
<span class="head-r">{{ patientBaseData.patientSex }}</span> |
|
||||
<span v-if="patientBaseData.patientAge" class="head-r">{{ patientBaseData.patientAge }}岁</span> |
|
||||
<img v-if="patientBaseData.patientId" class="icon-a" :src="require('@/assets/img/pid.png')" alt="" style="margin-right: 6px;vertical-align: text-top"> |
|
||||
<span style="vertical-align: text-bottom">{{ patientBaseData.patientId }}</span> |
|
||||
</p> |
|
||||
<p class="head-b"> |
|
||||
<img v-if="patientBaseData.patientIdNumber" :src="require('@/assets/img/id.png')" alt="" style="margin-right: 6px;vertical-align: middle"> |
|
||||
<span class="mr16" style="vertical-align: middle">{{ maskId(patientBaseData.patientIdNumber) }}</span> |
|
||||
<img v-if="patientBaseData.patientPhone" :src="require('@/assets/img/phone.png')" alt="" style="margin-right: 6px;vertical-align: middle"> |
|
||||
<span class="mr16" style="vertical-align: middle">{{ patientBaseData.patientPhone }}</span> |
|
||||
<img v-if="patientBaseData.patientAddress" :src="require('@/assets/img/position.png')" alt="" style="margin-right: 6px;vertical-align: middle"> |
|
||||
<span style="vertical-align: middle">{{ patientBaseData.patientAddress }}</span> |
|
||||
</p> |
|
||||
<img :src="require('@/assets/img/pacs.png')" alt="" style="float: right;cursor: pointer" @click="handlePacs"> |
|
||||
</div> |
|
||||
<div class="contentBox"> |
|
||||
<div class="leftBox"> |
|
||||
<time-line |
|
||||
ref="timeline" |
|
||||
:time-axis-data="timeAxisData" |
|
||||
@getTimeAxisData="getTimeAxisData" |
|
||||
v-on="$listeners" |
|
||||
@getTimeAxisNodeInfo="getTimeAxisNodeInfo" |
|
||||
/> |
|
||||
</div> |
|
||||
<div class="rightBox"> |
|
||||
<el-tabs type="border-card" :value="timeAxisType" style="height: 100%" @tab-click="tabClick"> |
|
||||
<el-tab-pane name="病史总览" label="病史总览" style="height: 100%"> |
|
||||
<overView :patient-id="patientId||$route.query.patientId" /> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="门诊病历" label="门诊病历" style="height: 100%"> |
|
||||
<medicalRecord :type-name="timeAxisType" :patient-id="patientId || $route.query.patientId" :is-search="isSearch || $route.query.isSearch" :only-read="readOnly" /> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="常规检查" label="常规检查" style="height: 100%"> |
|
||||
<routine :patient-id="patientId||$route.query.patientId" :date="date" :only-read="readOnly" /> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="特殊检查" label="特殊检查" style="height: 100%"> |
|
||||
<special :patient-id="patientId||$route.query.patientId" :only-read="readOnly" /> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="视光档案" label="视光档案" style="height: 100%"> |
|
||||
<opticalFile :patient-id="patientId||$route.query.patientId" :is-search="isSearch || $route.query.isSearch" :only-read="readOnly" /> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="诊断" label="诊断" style="height: 100%"> |
|
||||
<el-table |
|
||||
:data="timeAxisNodeInfo" |
|
||||
style="width: 100%;height: 100%;overflow: auto" |
|
||||
> |
|
||||
<el-table-column |
|
||||
type="index" |
|
||||
width="50" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="diagName" |
|
||||
label="诊断内容" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
label="主诊断" |
|
||||
> |
|
||||
<template slot-scope="scope"> |
|
||||
{{ scope.row.isMain === 'Y' ? '是' : '否' }} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="diagIcd" |
|
||||
label="ICD编码" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="memo" |
|
||||
label="备注" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="doctorName" |
|
||||
label="医师" |
|
||||
/> |
|
||||
</el-table> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="手术" label="手术" style="height: 100%"> |
|
||||
<el-table |
|
||||
:data="timeAxisNodeInfo" |
|
||||
style="width: 100%;height: 100%;overflow: auto" |
|
||||
> |
|
||||
<el-table-column |
|
||||
type="index" |
|
||||
width="50" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="bedNo" |
|
||||
label="床号" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="deptName" |
|
||||
label="部门名" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="wardName" |
|
||||
label="病区名" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="mainDrName" |
|
||||
label="主刀医生姓名" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="opName" |
|
||||
label="手术名称" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="opPartName" |
|
||||
label="手术部位" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="opTime" |
|
||||
label="手术时间" |
|
||||
> |
|
||||
<template slot-scope="scope"> |
|
||||
{{ scope.row.opTime ? scope.row.opTime.substring(0, 10) : '' }} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
label="主手术" |
|
||||
> |
|
||||
<template slot-scope="scope"> |
|
||||
{{ scope.row.isMain === '1' ? '是' : '否' }} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
</el-table> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="医嘱" label="医嘱" style="height: 100%"> |
|
||||
<el-table |
|
||||
:data="timeAxisNodeInfo" |
|
||||
style="width: 100%;height: 100%;overflow: auto" |
|
||||
> |
|
||||
<el-table-column |
|
||||
type="index" |
|
||||
width="50" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="medName" |
|
||||
label="商品名" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="socName" |
|
||||
label="通用名" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="numberUse" |
|
||||
label="数量" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="yzTypeName" |
|
||||
label="类型" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="doctorName" |
|
||||
label="医师" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="itemType" |
|
||||
label="门诊/住院" |
|
||||
/> |
|
||||
</el-table> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="住院" label="住院" style="height: 100%"> |
|
||||
<el-table |
|
||||
:data="timeAxisNodeInfo" |
|
||||
style="width: 100%;height: 100%;overflow: auto" |
|
||||
> |
|
||||
<el-table-column |
|
||||
type="index" |
|
||||
width="50" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="profName" |
|
||||
label="部门名称" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="wardName" |
|
||||
label="病区名称" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
prop="diagName" |
|
||||
label="诊断名称" |
|
||||
/> |
|
||||
<el-table-column |
|
||||
label="住院日期" |
|
||||
> |
|
||||
<template slot-scope="scope"> |
|
||||
{{ scope.row.inDate ? scope.row.inDate.substring(0, 10) : '' }} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
label="出院日期" |
|
||||
> |
|
||||
<template slot-scope="scope"> |
|
||||
{{ scope.row.outDate ? scope.row.outDate.substring(0, 10) : '' }} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
</el-table> |
|
||||
</el-tab-pane> |
|
||||
<el-tab-pane name="随访记录" label="随访记录" style="height: 100%"> |
|
||||
<followUpRecord :patient-id="patientId||$route.query.patientId" :only-read="readOnly" /> |
|
||||
</el-tab-pane> |
|
||||
</el-tabs> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<shrink ref="shrinks" :arrow-type="1" @display="handleDisplay" @changeType="changeType" /> |
|
||||
<drawer ref="drawers" :cur-type="dataType" :display.sync="display" :width="drawerWidth" :mask="true" @display="closeDrawer"> |
|
||||
<!-- 关键指标--> |
|
||||
<key-indicators |
|
||||
v-if="dataType === 1" |
|
||||
id="drawerKey" |
|
||||
ref="keyIndicatorRef" |
|
||||
class="key-content" |
|
||||
v-bind="$attrs" |
|
||||
:patient-id="patientId" |
|
||||
:patient-id-number="patientBaseData.patientIdNumber" |
|
||||
/> |
|
||||
<!-- 数据集--> |
|
||||
<dataInfo v-if="dataType === 2" :fore-list="foreList" :after-list="afterList" /> |
|
||||
<!-- 病历收藏--> |
|
||||
<collection v-if="dataType === 3" :patient-id="patientBaseData.patientId" :platform="isSearch || $route.query.isSearch" /> |
|
||||
<!-- 常用业务--> |
|
||||
<business v-if="dataType === 4" :patient-id="patientBaseData.patientId" :platform="isSearch || $route.query.isSearch" :patient-name="patientBaseData.patientName" /> |
|
||||
</drawer> |
|
||||
</div> |
|
||||
</template> |
|
||||
<script> |
|
||||
import timeLine from './time-line.vue' |
|
||||
import shrink from '@/components/360View/shrink' |
|
||||
import drawer from '@/components/360View/drawer' |
|
||||
import dataInfo from './dataInfo' // 数据集 |
|
||||
import collection from './collection' // 病历收藏 |
|
||||
import business from './business' // 常用业务 |
|
||||
import overView from '@/components/360View/overView' // 病史总览 |
|
||||
import routine from '@/components/360View/routine' // 常规检查 |
|
||||
import special from '@/components/360View/special' // 特殊检查 |
|
||||
import followUpRecord from '@/components/360View/followUpRecord' |
|
||||
import keyIndicators from './key-indicators' |
|
||||
import imgRecord from './img-reccrd.vue' |
|
||||
import pacsList from '@/components/360View/pacs/patientList' |
|
||||
import medicalRecord from '@/components/360View/medicalRecord' // 门诊病历 |
|
||||
import opticalFile from '@/components/360View/opticalFile' // 视光档案 |
|
||||
import eventBus from '@/page-subspecialty/utils/eventBus' |
|
||||
export default { |
|
||||
components: { timeLine, drawer, keyIndicators, shrink, business, collection, imgRecord, overView, medicalRecord, dataInfo, routine, special, followUpRecord, opticalFile, pacsList }, |
|
||||
mixins: [], |
|
||||
props: { |
|
||||
patientId: { |
|
||||
type: String, |
|
||||
default: '' |
|
||||
}, |
|
||||
onlyRead: { |
|
||||
type: Boolean, |
|
||||
default: false |
|
||||
}, |
|
||||
isSearch: { |
|
||||
type: String, |
|
||||
default: '' |
|
||||
} |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
display: false, |
|
||||
sharkFlag: true, |
|
||||
patientBaseData: {}, |
|
||||
timeAxisNodeInfo: [], // 点击左侧时间轴获取到的中间区域详细信息 |
|
||||
doctorId: '', // |
|
||||
date: '', // 点击时间轴的时间 |
|
||||
source: '', // 数据集数据来源 |
|
||||
collectList: '', // 数据集数据 |
|
||||
drawerWidth: '', |
|
||||
timeAxisData: [], // 左侧时间轴数据 |
|
||||
timeAxisAll: [], // 病史总览时间轴数据 |
|
||||
timeAxisType: '病史总览', // tab类型 |
|
||||
foreList: [], // |
|
||||
afterList: [], // |
|
||||
dataType: 1, |
|
||||
kpilist: [], // kpi关键指标checkbox |
|
||||
ShiLiAndYanYaData: {}, // 视力和眼压 |
|
||||
isActive: false, // 控制数据与报告tab展示 |
|
||||
type: '', // 筛查类型 |
|
||||
defaultProps: { |
|
||||
children: 'children', |
|
||||
label: 'tagName' |
|
||||
}, |
|
||||
jsArr: [], |
|
||||
dataForm: {} |
|
||||
} |
|
||||
}, |
|
||||
computed: { |
|
||||
readOnly() { |
|
||||
if (this.$route.query.onlyRead) { |
|
||||
return JSON.parse(this.$route.query.onlyRead) |
|
||||
} else { |
|
||||
return this.onlyRead |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
watch: { |
|
||||
display(val) { |
|
||||
if (val) { |
|
||||
this.$refs.drawers.$el.style.display = 'inline-block' |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
created() { |
|
||||
this.getPatientData() |
|
||||
this.getTimeAxisData() |
|
||||
}, |
|
||||
mounted() { |
|
||||
this.computerData() |
|
||||
if (this.isSearch === '3') { |
|
||||
this.timeAxisType = '视光档案' |
|
||||
} else { |
|
||||
this.timeAxisType = '病史总览' |
|
||||
} |
|
||||
if (this.$route.query.patientId) { |
|
||||
this.timeAxisType = '门诊病历' |
|
||||
} |
|
||||
}, |
|
||||
methods: { |
|
||||
// 切换病史总览时间轴 |
|
||||
tabClick(type) { |
|
||||
this.timeAxisType = type.name |
|
||||
this.timeAxisNodeInfo = [] |
|
||||
}, |
|
||||
selectType(type) { |
|
||||
this.dataType = type |
|
||||
this.display = true |
|
||||
}, |
|
||||
maskId(idCard) { |
|
||||
if (idCard) { |
|
||||
const reg = /^(.{6})(?:\d+)(.{4})$/ |
|
||||
return idCard.replace(reg, '\$1******\$2') |
|
||||
} |
|
||||
}, |
|
||||
computerData() { |
|
||||
// 监听点击添加数据集，获取数据 |
|
||||
eventBus.$off('sendForData') |
|
||||
eventBus.$on('sendForData', data => { |
|
||||
const arr = this.foreList.concat(data) |
|
||||
// const id = 'id' |
|
||||
this.foreList = this.unique(arr) |
|
||||
// this.foreList = arr.reduce((all, next) => all.some((item) => item[id] == next[id]) ? all : [...all, next], []) |
|
||||
this.openDataDrink() |
|
||||
}) |
|
||||
}, |
|
||||
unique(list) { |
|
||||
for (let i = 0; i < list.length - 1; i++) { |
|
||||
for (let j = i + 1; j < list.length; j++) { |
|
||||
if (list[i].id === list[j].id) { |
|
||||
list.splice(i, 1) |
|
||||
j-- |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
return list |
|
||||
}, |
|
||||
openDataDrink() { |
|
||||
this.dataType = 2 |
|
||||
this.display = true |
|
||||
this.$nextTick(() => { |
|
||||
if (this.$refs.drawers && this.$refs.drawers.$el) { |
|
||||
this.$refs.drawers.$el.style.display = 'inline-block' |
|
||||
} |
|
||||
if (this.$refs.shrinks && this.$refs.shrinks.$el) { |
|
||||
this.$refs.shrinks.$el.style.zIndex = 999 |
|
||||
this.$refs.drawers.selectShrink() |
|
||||
} |
|
||||
}) |
|
||||
}, |
|
||||
closeDrawer(val) { |
|
||||
this.display = val |
|
||||
}, |
|
||||
changeType(val) { |
|
||||
this.dataType = val |
|
||||
this.display = true |
|
||||
}, |
|
||||
handleDisplay(val) { |
|
||||
this.dataType = 1 |
|
||||
if (val) { |
|
||||
this.display = true |
|
||||
this.$refs.drawers.$el.style.display = 'inline-block' |
|
||||
} else { |
|
||||
this.display = false |
|
||||
} |
|
||||
}, |
|
||||
changeWidth() { |
|
||||
this.drawerWidth = (this.drawerWidth === '500px') ? '800px' : '500px' |
|
||||
}, |
|
||||
backList() { |
|
||||
if (this.$route.query.patientId && !this.$route.query.doctorId) { |
|
||||
this.$router.go(-1) |
|
||||
} else if (this.$route.query.doctorId) { |
|
||||
this.$router.push('/outpatientManagement-call') |
|
||||
} else { |
|
||||
this.$parent.detailViewVisible = false |
|
||||
this.$parent.getDataListInitial() |
|
||||
} |
|
||||
}, |
|
||||
// 360浏览器 |
|
||||
handlePacs() { |
|
||||
// const baseUrl = 'http://z1.huimucloud.com:8085' |
|
||||
const baseUrl = 'http://10.80.5.32:8026' |
|
||||
// const baseUrl = 'http://192.168.0.85:8001' |
|
||||
const href = `${baseUrl}/EXAMINE_Report/InterFace?PatID=${this.patientId}&DoctorID=${this.employeeId}&PatIdKey=&ExamNo=` |
|
||||
window.open(href, '_blank') |
|
||||
// const { href } = this.$router.resolve({ |
|
||||
// name: 'pacsManage' |
|
||||
// }) |
|
||||
// window.open(href, '_blank') |
|
||||
}, |
|
||||
// 关闭360弹框 |
|
||||
closePacs() { |
|
||||
this.isActive = false |
|
||||
}, |
|
||||
// 关键指标组件是否显示 |
|
||||
shrinkClick() { |
|
||||
this.drawer = !this.drawer |
|
||||
this.display = true |
|
||||
}, |
|
||||
// 根据id获取患者信息--中间上侧患者信息 |
|
||||
async getPatientData() { |
|
||||
const { data: res } = await this.$http.get( |
|
||||
'/patient/view/getPatientData', |
|
||||
{ |
|
||||
params: { |
|
||||
patientId: this.patientId || this.$route.query.patientId |
|
||||
} |
|
||||
} |
|
||||
) |
|
||||
if (res.code === 0) { |
|
||||
this.patientBaseData = res.data ? res.data : {} |
|
||||
} else { |
|
||||
this.$message.error(res.msg) |
|
||||
} |
|
||||
}, |
|
||||
// 获取时间轴数据--左侧时间轴 |
|
||||
async getTimeAxisData() { |
|
||||
const { data: res } = await this.$http.get( |
|
||||
'/patient/view/getTimeAxisData', |
|
||||
{ |
|
||||
params: { |
|
||||
patientId: this.patientId || this.$route.query.patientId |
|
||||
} |
|
||||
} |
|
||||
) |
|
||||
if (res.code === 0) { |
|
||||
if (res.data.length > 0) { |
|
||||
this.timeAxisData = res.data.length > 0 ? res.data : [] |
|
||||
} |
|
||||
if (!res.data.length) { |
|
||||
const year = this.$moment().format('YYYY') |
|
||||
const date = this.$moment().format('YYYY-MM-DD') |
|
||||
this.timeAxisData = [{ year: year, data: [{ date: date, itemList: [{ groupName: '门诊', opDate: date, year: year }] }] }] |
|
||||
} |
|
||||
} else { |
|
||||
this.$message.error(res.msg) |
|
||||
} |
|
||||
}, |
|
||||
// 获取时间轴节点信息--点击左侧时间轴获取患者具体信息 |
|
||||
async getTimeAxisNodeInfo(item) { |
|
||||
this.timeAxisType = item.groupName |
|
||||
const { data: res } = await this.$http.get('/patient/view/getTimeAxisNodeInfo', { |
|
||||
params: { |
|
||||
date: item.opDate, |
|
||||
groupName: item.groupName, |
|
||||
patientId: this.patientId || this.$route.query.patientId |
|
||||
} |
|
||||
}) |
|
||||
if (res.code === 0) { |
|
||||
this.timeAxisNodeInfo = res.data || [] |
|
||||
} else { |
|
||||
this.$message.error(res.msg) |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss"> |
|
||||
.container{ |
|
||||
.el-tabs__content { |
|
||||
height: calc(100% - 38px); |
|
||||
} |
|
||||
.el-tabs--border-card { |
|
||||
box-shadow: none; |
|
||||
} |
|
||||
.el-tabs--border-card>.el-tabs__header{ |
|
||||
background: #F0F2F5; |
|
||||
} |
|
||||
.el-dialog > .el-dialog__body { |
|
||||
height: calc(100% - 48px); |
|
||||
} |
|
||||
} |
|
||||
.detail-view{ |
|
||||
.el-dialog > .el-dialog__body { |
|
||||
height: calc(100% - 50px); |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
<style lang="scss" scoped> |
|
||||
.container{ |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
display: flex; |
|
||||
background: #F0F2F5; |
|
||||
|
|
||||
.contentBox{ |
|
||||
display: flex; |
|
||||
height: calc(100% - 100px); |
|
||||
} |
|
||||
.mr16{ |
|
||||
margin-right: 16px; |
|
||||
} |
|
||||
.header{ |
|
||||
width: 100%; |
|
||||
height: 88px; |
|
||||
padding: 8px; |
|
||||
position: relative; |
|
||||
margin-bottom: 16px; |
|
||||
box-sizing: border-box; |
|
||||
background: #FFFFFF; |
|
||||
border-radius: 4px; |
|
||||
.head-t{ |
|
||||
position: absolute; |
|
||||
left: 155px; |
|
||||
top: 20px; |
|
||||
} |
|
||||
.head-b{ |
|
||||
position: absolute; |
|
||||
left: 155px; |
|
||||
bottom: 20px; |
|
||||
font-size: 14px; |
|
||||
} |
|
||||
.head-r{ |
|
||||
margin-right: 16px; |
|
||||
font-weight: 500; |
|
||||
font-size: 20px; |
|
||||
color: rgba(0, 0, 0, 0.88); |
|
||||
} |
|
||||
} |
|
||||
.key-indicators-shrink { |
|
||||
width: 32px; |
|
||||
margin-left: 8px; |
|
||||
height: 100%; |
|
||||
position: relative; |
|
||||
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; |
|
||||
} |
|
||||
.dataBase{ |
|
||||
position: absolute; |
|
||||
display: inline-block; |
|
||||
color: #1C76FD; |
|
||||
margin-left: 6px; |
|
||||
writing-mode: vertical-rl; |
|
||||
letter-spacing: 3px; |
|
||||
cursor: pointer; |
|
||||
} |
|
||||
.fontColor{ |
|
||||
color: white !important; |
|
||||
} |
|
||||
.dataOne{ |
|
||||
top: 80px; |
|
||||
} |
|
||||
.dataTwo{ |
|
||||
top: 210px; |
|
||||
} |
|
||||
.dataThree{ |
|
||||
top: 328px; |
|
||||
} |
|
||||
.dataFour{ |
|
||||
top: 455px; |
|
||||
} |
|
||||
.imgCur{ |
|
||||
position: absolute; |
|
||||
left: 0; |
|
||||
top: 43px; |
|
||||
} |
|
||||
.imgOne{ |
|
||||
position: absolute; |
|
||||
left: 0; |
|
||||
top: 163px; |
|
||||
} |
|
||||
.imgTwo{ |
|
||||
position: absolute; |
|
||||
left: 0; |
|
||||
top: 287px; |
|
||||
} |
|
||||
.imgThree{ |
|
||||
position: absolute; |
|
||||
left: 0; |
|
||||
top: 411px; |
|
||||
} |
|
||||
} |
|
||||
.leftBox{ |
|
||||
width: 168px; |
|
||||
height: 100%; |
|
||||
margin-right: 16px; |
|
||||
background-color: white; |
|
||||
} |
|
||||
.rightBox{ |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
background-color: #F0F2F5; |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,318 +0,0 @@ |
|||||
import Vue from 'vue' |
|
||||
import Router from 'vue-router' |
|
||||
import http from '../utils/request' |
|
||||
import { isURL } from '@/utils/validate' |
|
||||
import Cookies from 'js-cookie' |
|
||||
|
|
||||
Vue.use(Router) |
|
||||
|
|
||||
// 解决Vue-Router升级导致的Uncaught(in promise) navigation guard问题----------
|
|
||||
const originalPush = Router.prototype.push |
|
||||
Router.prototype.push = function push(location, onResolve, onReject) { |
|
||||
if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject) |
|
||||
return originalPush.call(this, location).catch(err => err) |
|
||||
} |
|
||||
// 解决Vue-Router升级导致的Uncaught(in promise) navigation guard问题----------
|
|
||||
|
|
||||
// 页面路由(独立页面)
|
|
||||
export const pageRoutes = [ |
|
||||
{ |
|
||||
path: '/404', |
|
||||
component: () => import('@/page-subspecialty/views/pages/404'), |
|
||||
name: '404', |
|
||||
meta: { title: '404未找到' }, |
|
||||
beforeEnter(to, from, next) { |
|
||||
// 拦截处理特殊业务场景
|
|
||||
// 如果, 重定向路由包含__双下划线, 为临时添加路由
|
|
||||
if (/__.*/.test(to.redirectedFrom)) { |
|
||||
return next(to.redirectedFrom.replace(/__.*/, '')) |
|
||||
} |
|
||||
next() |
|
||||
} |
|
||||
}, |
|
||||
{ |
|
||||
path: '/login', |
|
||||
component: () => import('@/page-subspecialty/views/pages/login'), |
|
||||
name: 'login', |
|
||||
meta: { title: '登录' } |
|
||||
}, |
|
||||
{ |
|
||||
path: '/pacsManage', |
|
||||
component: () => import('@/page-subspecialty/views/pages/pacsManage/index'), |
|
||||
name: 'pacsManage', |
|
||||
meta: { title: 'pacs浏览器', isTab: true } |
|
||||
}, |
|
||||
{ |
|
||||
path: '/pacs', |
|
||||
component: () => import('@/page-subspecialty/views/pages/pacs/index'), |
|
||||
name: 'pacs', |
|
||||
meta: { title: 'pacs浏览器', isTab: true } |
|
||||
} |
|
||||
|
|
||||
] |
|
||||
|
|
||||
// 模块路由(基于主入口布局页面)*8
|
|
||||
export const moduleRoutes = { |
|
||||
path: '/', |
|
||||
component: () => import('@/page-subspecialty/views/main'), |
|
||||
name: 'main', |
|
||||
redirect: { name: 'outpatientManagement' }, |
|
||||
meta: { title: '首页' }, |
|
||||
children: [ |
|
||||
{ |
|
||||
path: '/outpatientManagement', |
|
||||
component: () => import('@/page-subspecialty/views/modules/outpatientManagement/call'), |
|
||||
name: 'outpatientManagement', |
|
||||
meta: { title: '日常出诊', isTab: true } |
|
||||
}, |
|
||||
// ok镜
|
|
||||
{ |
|
||||
path: '/patientInfo', |
|
||||
name: 'patientInfo', |
|
||||
meta: { title: '详情', isTab: true }, |
|
||||
component: () => import('@/page-subspecialty/views/modules/optometryManagement/seeDoctor/index') |
|
||||
}, |
|
||||
{ |
|
||||
path: '/iframe', |
|
||||
component: null, |
|
||||
name: 'iframe', |
|
||||
meta: { title: 'iframe', isTab: true } |
|
||||
}, |
|
||||
{ |
|
||||
path: '/redirect', |
|
||||
name: 'redirect', |
|
||||
component: () => import('@/page-subspecialty/views/redirect') |
|
||||
}, |
|
||||
{ |
|
||||
path: '/360view', |
|
||||
name: '360view', |
|
||||
component: () => import('@/components/360View/index1.vue') |
|
||||
} |
|
||||
] |
|
||||
} |
|
||||
|
|
||||
export function addDynamicRoute(routeParams, router) { |
|
||||
// 组装路由名称, 并判断是否已添加, 如是: 则直接跳转
|
|
||||
var routeName = routeParams.routeName |
|
||||
var dynamicRoute = window.SITE_CONFIG['dynamicRoutes'].filter(item => item.name === routeName)[0] |
|
||||
if (dynamicRoute) { |
|
||||
return router.push({ name: routeName, params: routeParams.params }) |
|
||||
} |
|
||||
// 否则: 添加并全局变量保存, 再跳转
|
|
||||
dynamicRoute = { |
|
||||
path: routeName, |
|
||||
component: () => Promise.resolve(require(`@/page-subspecialty/views/modules/${routeParams.path}`).default), |
|
||||
// component: () => import(`@/views/modules/${routeParams.path}`),
|
|
||||
name: routeName, |
|
||||
meta: { |
|
||||
...window.SITE_CONFIG['contentTabDefault'], |
|
||||
menuId: routeParams.menuId, |
|
||||
title: `${routeParams.title}` |
|
||||
} |
|
||||
} |
|
||||
router.addRoutes([ |
|
||||
{ |
|
||||
...moduleRoutes, |
|
||||
name: `main-dynamic__${dynamicRoute.name}`, |
|
||||
children: [dynamicRoute] |
|
||||
} |
|
||||
]) |
|
||||
window.SITE_CONFIG['dynamicRoutes'].push(dynamicRoute) |
|
||||
router.push({ name: dynamicRoute.name, params: routeParams.params }) |
|
||||
} |
|
||||
|
|
||||
const createRouter = () => new Router({ |
|
||||
mode: 'history', |
|
||||
scrollBehavior: () => ({ y: 0 }), |
|
||||
routes: pageRoutes.concat(moduleRoutes) |
|
||||
}) |
|
||||
const router = createRouter() |
|
||||
|
|
||||
// [vue-router] Duplicate named routes definition 重复的命名路由定义
|
|
||||
// 动态路由退出再登录会出现警告重复路由
|
|
||||
// 解决方案：在退出时调用resetRouter()方法
|
|
||||
export function resetRouter() { |
|
||||
const newRouter = createRouter() |
|
||||
router.matcher = newRouter.matcher // reset router
|
|
||||
} |
|
||||
|
|
||||
router.beforeEach((to, from, next) => { |
|
||||
// 添加动态(菜单)路由
|
|
||||
// 已添加或者当前路由为页面路由, 可直接访问
|
|
||||
if (window.SITE_CONFIG['dynamicMenuRoutesHasAdded'] || fnCurrentRouteIsPageRoute(to, pageRoutes)) { |
|
||||
return next() |
|
||||
} |
|
||||
if (to.path === from.path) { |
|
||||
return |
|
||||
} |
|
||||
if (to.name === 'login' || to.path === '/login' || to.path === 'satusScreen' || to.name === 'satusScreen') { |
|
||||
next() |
|
||||
} else if (to.name === '360view' && to.query.doctorId) { |
|
||||
loginByDocId(to.query.doctorId, next, to.fullPath) |
|
||||
} else { |
|
||||
// 获取字典列表, 添加并全局变量保存
|
|
||||
// http.get('/sys/dict/type/all').then(({ data: res }) => {
|
|
||||
// if (res.code !== 0) {
|
|
||||
// return
|
|
||||
// }
|
|
||||
// window.SITE_CONFIG['dictList'] = res.data
|
|
||||
// }).catch(() => {})
|
|
||||
// 获取左侧菜单列表，添加并全局变量保存
|
|
||||
http.get('/sys/menu/nav').then(({ data: res }) => { |
|
||||
if (res.code !== 0) { |
|
||||
Vue.prototype.$message.error(res.msg) |
|
||||
return next({ name: 'login' }) |
|
||||
} |
|
||||
window.SITE_CONFIG['menuList'] = res.data |
|
||||
}).catch(() => { |
|
||||
return next({ name: 'login' }) |
|
||||
}) |
|
||||
|
|
||||
// 获取菜单管理菜单列表，并添加动态路由
|
|
||||
http.get('/sys/menu/list', { |
|
||||
params: { |
|
||||
type: 0 |
|
||||
} |
|
||||
}).then(({ data: res }) => { |
|
||||
if (res.code !== 0) { |
|
||||
Vue.prototype.$message.error(res.msg) |
|
||||
return next({ name: 'login' }) |
|
||||
} |
|
||||
// window.SITE_CONFIG['menuList'] = res.data
|
|
||||
const menuListChild = res.data.filter(item => item.children.length > 0) |
|
||||
fnAddDynamicMenuRoutes(JSON.parse(JSON.stringify(res.data)), menuListChild.length) |
|
||||
|
|
||||
next({ ...to, replace: true }) |
|
||||
}).catch(() => { |
|
||||
// console.log(123)
|
|
||||
return next({ name: 'login' }) |
|
||||
}) |
|
||||
} |
|
||||
}) |
|
||||
function getNavList(next) { |
|
||||
http.get('/sys/menu/nav').then(({ data: res }) => { |
|
||||
if (res.code !== 0) { |
|
||||
Vue.prototype.$message.error(res.msg) |
|
||||
return next() |
|
||||
} |
|
||||
window.SITE_CONFIG['menuList'] = res.data |
|
||||
}).catch(() => { |
|
||||
return next({ name: 'login' }) |
|
||||
}) |
|
||||
} |
|
||||
function muneList(next) { |
|
||||
http.get('/sys/menu/list', { |
|
||||
params: { |
|
||||
type: 0 |
|
||||
} |
|
||||
}).then(({ data: res }) => { |
|
||||
if (res.code !== 0) { |
|
||||
Vue.prototype.$message.error(res.msg) |
|
||||
return next({ name: 'login' }) |
|
||||
} |
|
||||
// window.SITE_CONFIG['menuList'] = res.data
|
|
||||
const menuListChild = res.data.filter(item => item.children.length > 0) |
|
||||
fnAddDynamicMenuRoutes(JSON.parse(JSON.stringify(res.data)), menuListChild.length) |
|
||||
}).catch(() => { |
|
||||
return next({ name: 'login' }) |
|
||||
}) |
|
||||
} |
|
||||
function loginByDocId(doctorId, next) { |
|
||||
const params = { |
|
||||
doctorId: doctorId |
|
||||
} |
|
||||
http.post('/loginByDid', params).then(({ data: res }) => { |
|
||||
if (res.code !== 0) { |
|
||||
return this.$message.error(res.msg) |
|
||||
} |
|
||||
console.log(res) |
|
||||
// Cookies.set('xa-token', res.data.token)
|
|
||||
window.sessionStorage.setItem('xa-token', res.data.token) |
|
||||
window.sessionStorage.setItem('qg-userData', JSON.stringify(res.data.currentUser)) |
|
||||
getNavList(next) |
|
||||
muneList(next) |
|
||||
|
|
||||
return next() |
|
||||
}).catch(() => { }) |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* 判断当前路由是否为页面路由 |
|
||||
* @param {*} route 当前路由 |
|
||||
* @param {*} pageRoutes 页面路由 |
|
||||
*/ |
|
||||
function fnCurrentRouteIsPageRoute(route, pageRoutes = []) { |
|
||||
let temp = [] |
|
||||
for (let i = 0; i < pageRoutes.length; i++) { |
|
||||
if (route.path === pageRoutes[i].path) { |
|
||||
return true |
|
||||
} |
|
||||
if (pageRoutes[i].children && pageRoutes[i].children.length >= 1) { |
|
||||
temp = temp.concat(pageRoutes[i].children) |
|
||||
} |
|
||||
} |
|
||||
return temp.length >= 1 ? fnCurrentRouteIsPageRoute(route, temp) : false |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* 添加动态(菜单)路由 |
|
||||
* PH：自上而下遍历，累积平铺 |
|
||||
* @param {*} menuList 菜单列表 |
|
||||
* @param {*} routes 递归创建的动态(菜单)路由 |
|
||||
*/ |
|
||||
function fnAddDynamicMenuRoutes(menuList = [], menuListChildLength, routes = []) { |
|
||||
let index = 0 |
|
||||
menuList.forEach((item, i) => { |
|
||||
// eslint-disable-next-line
|
|
||||
let URL = (item.url || '').replace(/{{([^}}]+)?}}/g, (s1, s2) => eval(s2)) // URL支持{{ window.xxx }}占位符变量
|
|
||||
item['meta'] = { |
|
||||
...window.SITE_CONFIG['contentTabDefault'], |
|
||||
menuId: item.id, |
|
||||
title: item.name |
|
||||
} |
|
||||
if (isURL(URL)) { |
|
||||
item['path'] = item['name'] = `i-${item.id}` |
|
||||
item['meta'].push({ |
|
||||
iframeURL: URL |
|
||||
}) |
|
||||
} else { |
|
||||
// console.log(URL)
|
|
||||
URL = URL.replace(/^\//, '').replace(/_/g, '-') |
|
||||
item['path'] = '/' + URL.replace(/\//g, '-') |
|
||||
item['name'] = URL.replace(/\//g, '-') |
|
||||
// 坑！！！父级也必须要有component,父级要有自己的vue组件,父级路由必须有<router-view />占位符
|
|
||||
// 其孩子children才能展示出来，孩子展示在父级占位符的地方
|
|
||||
URL.includes('seeDoctor') ? URL = 'seeDoctor' : '' // 不同父级有相同子级seeDoctor，防止面包屑冲突，动态路由名字区分设置为seeDoctor、seeDoctorOne,在寻找组件时替换回seeDoctor，可以找到对应组件路径
|
|
||||
item['component'] = () => Promise.resolve(require(`@/page-subspecialty/views/modules/${URL}`).default) |
|
||||
// 如果是父级给父级添加重定向到子菜单第一项
|
|
||||
if (item.children.length > 0 && item.children[0].url) { |
|
||||
// console.log(item)
|
|
||||
// isShow:0显示不菜单 1显示菜单
|
|
||||
item.children[0].isShow === 0 ? '' : item['redirect'] = '/' + item.children[0].url.replace(/\//g, '-') |
|
||||
} |
|
||||
} |
|
||||
if (item.children.length > 0) { |
|
||||
index++ |
|
||||
fnAddDynamicMenuRoutes(item.children) |
|
||||
} |
|
||||
}) |
|
||||
// 此处一定要加判断，因为此方法在递归，要等到递归完成后再执行下面的内容
|
|
||||
// 坑！！！如果不加此判断，this.$route.matched面包屑的父级就不会展示
|
|
||||
if (menuListChildLength === index) { |
|
||||
routes = menuList |
|
||||
// PH：底层调用一次
|
|
||||
// 添加路由
|
|
||||
router.addRoutes([ |
|
||||
{ |
|
||||
...moduleRoutes, |
|
||||
name: 'main-dynamic-menu', |
|
||||
children: [...routes] |
|
||||
}, |
|
||||
{ path: '*', redirect: { name: '404' }} |
|
||||
]) |
|
||||
// console.log('----------------------')
|
|
||||
window.SITE_CONFIG['dynamicMenuRoutes'] = routes |
|
||||
window.SITE_CONFIG['dynamicMenuRoutesHasAdded'] = true |
|
||||
} |
|
||||
} |
|
||||
export default router |
|
||||
Loading…
Reference in new issue