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.
556 lines
17 KiB
556 lines
17 KiB
3 years ago
|
<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">{{ 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="type" style="height: 100%">
|
||
|
|
<el-tab-pane name="病史总览" label="病史总览" style="height: 100%">
|
||
|
|
<overView />
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane name="门诊病历" label="门诊病历" style="height: 100%">
|
||
|
|
<medicalRecord :patient-id="patientId" />
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane name="常规检查" label="常规检查" style="height: 100%">
|
||
|
|
<routine />
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane name="特殊检查" label="特殊检查" style="height: 100%">
|
||
|
|
<special />
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane name="诊断" label="诊断">
|
||
|
|
<el-table
|
||
|
|
:data="timeAxisNodeInfo"
|
||
|
|
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>
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane name="手术" label="手术">
|
||
|
|
<el-table
|
||
|
|
:data="timeAxisNodeInfo"
|
||
|
|
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 ? 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>
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane name="用药" label="用药">
|
||
|
|
<el-table
|
||
|
|
:data="timeAxisNodeInfo"
|
||
|
|
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>
|
||
|
|
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane name="住院" label="住院">
|
||
|
|
<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>
|
||
|
|
</el-tab-pane>
|
||
|
|
<el-tab-pane name="随访记录" label="随访记录" style="height: 100%">
|
||
|
|
<followUpRecord />
|
||
|
|
</el-tab-pane>
|
||
|
|
</el-tabs>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<shrink ref="shrinks" :arrowType="1" @display="handleDisplay"/>
|
||
|
|
<drawer ref="drawers" :display.sync="display" :width="drawerWidth" :mask="false">
|
||
|
|
<!-- 关键指标-->
|
||
|
|
<key-indicators
|
||
|
|
v-if="dataType === 1"
|
||
|
|
id="drawerKey"
|
||
|
|
ref="keyIndicatorRef"
|
||
|
|
class="key-content"
|
||
|
|
v-bind="$attrs"
|
||
|
|
:patient-id="patientBaseData.patientId"
|
||
|
|
/>
|
||
|
|
<!-- 数据集-->
|
||
|
|
<dataInfo v-if="dataType === 2" :source-data="source" :data-list="collectList"/>
|
||
|
|
<!-- 病历收藏-->
|
||
|
|
<collection v-if="dataType === 3" />
|
||
|
|
<!-- 常用业务-->
|
||
|
|
<business v-if="dataType === 4" />
|
||
|
|
</drawer>
|
||
|
|
<!-- 图像与报告 -->
|
||
|
|
<keep-alive>
|
||
|
|
<el-dialog title="" class="detail-view" :fullscreen="true" :visible.sync="isActive" append-to-body @close="backList">
|
||
|
|
<imgRecord :patient-info="patientBaseData" />
|
||
|
|
</el-dialog>
|
||
|
|
</keep-alive>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
import timeLine from './time-line.vue'
|
||
|
|
import shrink from '@/components/360View/shrink'
|
||
|
|
import drawer from '@/components/360View/drawer'
|
||
|
|
import dataInfo from './info' // 数据集
|
||
|
|
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 medicalRecord from '@/components/360View/medicalRecord' // 门诊病历
|
||
|
|
import moment from 'moment' // 导入模块
|
||
|
|
const Base64 = require('js-base64').Base64
|
||
|
|
import eventBus from '@/page-subspecialty/utils/eventBus'
|
||
|
|
export default {
|
||
|
|
components: { timeLine, drawer, keyIndicators, shrink, business, collection, imgRecord, overView, medicalRecord, dataInfo, routine, special, followUpRecord },
|
||
|
|
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: [],
|
||
|
|
props: {
|
||
|
|
patientIdNumber: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
},
|
||
|
|
patientId: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
},
|
||
|
|
isSearch: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
display: false,
|
||
|
|
sharkFlag: true,
|
||
|
|
patientBaseData: {},
|
||
|
|
timeAxisNodeInfo: [], // 点击左侧时间轴获取到的中间区域详细信息
|
||
|
|
source: '', // 数据集数据来源
|
||
|
|
collectList: '', // 数据集数据
|
||
|
|
drawerWidth: '',
|
||
|
|
timeAxisData: [], // 左侧时间轴数据
|
||
|
|
dataType: 1,
|
||
|
|
kpilist: [], // kpi关键指标checkbox
|
||
|
|
ShiLiAndYanYaData: {}, // 视力和眼压
|
||
|
|
isActive: false, // 控制数据与报告tab展示
|
||
|
|
type: '', // 筛查类型
|
||
|
|
defaultProps: {
|
||
|
|
children: 'children',
|
||
|
|
label: 'tagName'
|
||
|
|
},
|
||
|
|
jsArr: [],
|
||
|
|
isVisit: '',
|
||
|
|
crfVisible: false,
|
||
|
|
dataForm: {}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
// this.patientIdNumber = '330282200110051983'
|
||
|
|
this.getPatientData()
|
||
|
|
this.getTimeAxisData()
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
// 监听点击添加数据集，获取数据
|
||
|
|
eventBus.$on('sendData', data => {
|
||
|
|
console.log(data)
|
||
|
|
this.dataType = 2
|
||
|
|
this.display = true
|
||
|
|
this.source = 'fore'
|
||
|
|
this.collectList = data
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.$refs.drawers.$el.style.display = 'inline-block'
|
||
|
|
this.$refs.shrinks.$el.style.zIndex = 999
|
||
|
|
this.$refs.drawers.selectShrink()
|
||
|
|
})
|
||
|
|
})
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
selectType(type) {
|
||
|
|
console.log(type)
|
||
|
|
this.dataType = type
|
||
|
|
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() {
|
||
|
|
this.$parent.detailViewVisible = false
|
||
|
|
},
|
||
|
|
// 360浏览器
|
||
|
|
handlePacs() {
|
||
|
|
this.isActive = true
|
||
|
|
},
|
||
|
|
// 关键指标组件是否显示
|
||
|
|
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
|
||
|
|
patientId: '797064'
|
||
|
|
// patientIdNumber: '330282200110051983'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
)
|
||
|
|
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.get(
|
||
|
|
'/patient/view/getTimeAxisData',
|
||
|
|
{
|
||
|
|
params: {
|
||
|
|
// patientId: this.patientId
|
||
|
|
patientId: '797064'
|
||
|
|
// type: typeScreenCheckArr !== undefined ? typeScreenCheckArr : type
|
||
|
|
}
|
||
|
|
}
|
||
|
|
)
|
||
|
|
if (res.code === 0) {
|
||
|
|
if (res.data.length > 0) {
|
||
|
|
this.timeAxisData = res.data.length > 0 ? res.data : []
|
||
|
|
this.type = res.data[0].data[0].itemList[0].groupName
|
||
|
|
}
|
||
|
|
if (!res.data.length) {
|
||
|
|
this.timeAxisNodeInfo = []
|
||
|
|
this.type = ''
|
||
|
|
this.isVisit = ''
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
this.$message.error(res.msg)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 获取时间轴节点信息--点击左侧时间轴获取患者具体信息
|
||
|
|
async getTimeAxisNodeInfo(item) {
|
||
|
|
this.type = item.groupName
|
||
|
|
this.isVisit = item.isVisit
|
||
|
|
const { data: res } = await this.$http.get('/patient/view/getTimeAxisNodeInfo', {
|
||
|
|
params: {
|
||
|
|
// date: moment(item.date).format('YYYY-MM-DD'),
|
||
|
|
date: item.opDate,
|
||
|
|
groupName: item.groupName,
|
||
|
|
patientId: '797064'
|
||
|
|
// patientId: this.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);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</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>
|