pengqiang
/
xiangan_pc
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
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.
44 Commits
3 Branches
0 Tags
124 MiB
 
 
 
 
Tree: 0577ebe9e3
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '0577ebe9e3'
${ noResults }
xiangan_pc/src/components/360View/commonForm/threeVision.vue

773 lines
22 KiB
Raw Blame History

<template>
<div id="operation-record" style=" background: #fff; padding: 10px 20px 50px 20px;page-break-after:always">
<div v-if="!onlyRead" class="btnBox">
<el-button v-print="'#threeFunc'" size="small">打印</el-button>
<el-button type="primary" size="small" @click="handleSaveTable">保存</el-button>
<el-button type="danger" size="small" @click="handleDelete">删除</el-button>
</div>
<div id="threeFunc" style="width: 840px;padding-right: 8px" class="printBox">
<div class="flex j-c">
<img width="450" src="@/assets/img/xianganlogo.png">
</div>
<hr>
<p style="color:#000000;font-size:32px;margin-bottom:30px;text-align:center;">
三级视功能检查报告单
</p>
<div style="display: flex;justify-content: space-around">
<span>登记号：<el-input v-model="dataForm.patientId" style="width: 120px" size="small" clearable placeholder="" /></span>
<span>姓名：<el-input v-model="dataForm.patientName" style="width: 120px" size="small" clearable placeholder="" /></span>
<span>性别：<el-input v-model="dataForm.patientSex" style="width: 120px" size="small" clearable placeholder="" /></span>
<span>年龄：<el-input v-model="dataForm.patientAge" style="width: 120px" size="small" clearable placeholder="" /></span>
</div>
<div class="operation-record-table">
<el-table :data="tableData" :span-method="objectSpanMethod" border style="width: 820px; margin-top: 10px">
<el-table-column label="" width="" align="center" :resizable="false">
<template slot-scope="scope">
<div v-if="scope.row.name === 'ODOS'" style="position: relative;height: 180px">
<div style="display: flex">
<p style="width: 50%">OD</p>
<p style="width: 50%">OS</p>
</div>
<div class="rowLine" />
<div class="cloLine" />
<div class="rowLine-l" />
<div class="cloLine-l" />
<div class="Rline">R</div>
<div class="Rline-os">R</div>
<div class="Lline">L</div>
<div class="Lline-os">L</div>
<el-input v-model="scope.row.a" class="ipt-a" placeholder="" />
<el-input v-model="scope.row.b" class="ipt-b" placeholder="" />
<el-input v-model="scope.row.c" class="ipt-c" placeholder="" />
<el-input v-model="scope.row.d" class="ipt-d" placeholder="" />
<el-input v-model="scope.row.e" class="ipt-e" placeholder="" />
<el-input v-model="scope.row.f" class="ipt-f" placeholder="" />
<el-input v-model="scope.row.g" class="ipt-g" placeholder="" />
<el-input v-model="scope.row.h" class="ipt-h" placeholder="" />
<el-input v-model="scope.row.i" class="ipt-j" placeholder="" />
<el-input v-model="scope.row.j" class="iptos-a" placeholder="" />
<el-input v-model="scope.row.k" class="iptos-b" placeholder="" />
<el-input v-model="scope.row.l" class="iptos-c" placeholder="" />
<el-input v-model="scope.row.m" class="iptos-d" placeholder="" />
<el-input v-model="scope.row.n" class="iptos-e" placeholder="" />
<el-input v-model="scope.row.o" class="iptos-f" placeholder="" />
<el-input v-model="scope.row.p" class="iptos-g" placeholder="" />
<el-input v-model="scope.row.q" class="iptos-h" placeholder="" />
<el-input v-model="scope.row.r" class="iptos-j" placeholder="" />
</div>
<div v-else-if="scope.row.name === 'TITMUS(近)'">
<span>TITMUS(近):</span>
<el-input v-model="scope.row.a" style="width: 60%" placeholder="" />
</div>
<div v-else-if="scope.row.name === '报告描述'">
<span>报告描述:</span>
<el-input v-model="scope.row.value" placeholder="" style="width: 80%" />
</div>
<div v-else-if="scope.row.name === '签名'" style="display: flex;justify-content: space-between;padding: 0 16px">
<div>
<span>视光师:</span>
<el-input v-model="scope.row.a" style="width: 160px" placeholder="" />
</div>
<div>
<span>日期:</span>
<el-date-picker
v-model="scope.row.b"
type="date"
placeholder="选择日期"
/>
</div>
</div>
<span v-else>{{ scope.row.name }}</span>
</template>
</el-table-column>
<el-table-column label="" width="" :resizable="false" prop="type">
<template slot-scope="scope">
<!-- {{scope.row.name}}-->
<div v-if="scope.row.name == '屈光状态'">
<div class="width-180 center">
<el-input v-model="scope.row.OD" placeholder="">
<template slot="prepend">OD:</template>
</el-input>
</div>
</div>
<div v-if="scope.row.name == '屈光状态a'">
<div class="width-180 center">
<el-input v-model="scope.row.OS" placeholder="">
<template slot="prepend">OS:</template>
</el-input>
</div>
</div>
<div v-if="scope.row.name == 'CT+Prism'">
<div class="width-180 center">
<el-input v-model="scope.row.ct" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '检查画片' && scope.row.type == '1'">
<div class="width-180 center">
<el-input v-model="scope.row.value" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '主观斜视角'">
<div class="width-180 center">
<el-input v-model="scope.row.od" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '客观斜视角'">
<div class="width-180 center">
<el-input v-model="scope.row.od" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '检查画片' && scope.row.type == '2'">
<div class="width-180 center">
<el-input v-model="scope.row.value" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '融合点'">
<div class="width-180 center">
<el-input v-model="scope.row.od" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == 'Worth-4-dot'">
<div class="width-180 center">
<el-input v-model="scope.row.a" placeholder="" style="width: 100px" />
@D
<el-input v-model="scope.row.b" placeholder="" style="width: 100px" />
</div>
</div>
<div v-if="scope.row.name == 'TITMUS(近)'">
<div class="width-180 center">
<el-input v-model="scope.row.b" placeholder="">
<template slot="prepend">TNO(近):</template>
</el-input>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="" width="" :resizable="false">
<template slot-scope="scope">
<div v-if="scope.row.name == '屈光状态'">
<div class="width-180 center">
<el-input v-model="scope.row.VA" placeholder="">
<template slot="prepend">VA:</template>
</el-input>
</div>
</div>
<div v-if="scope.row.name == '屈光状态a'">
<div class="width-180 center">
<el-input v-model="scope.row.VA" placeholder="">
<template slot="prepend">VA:</template>
</el-input>
</div>
</div>
<div v-if="scope.row.name == '主观斜视角'">
<div class="width-180 center">
<el-input v-model="scope.row.os" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '客观斜视角'">
<div class="width-180 center">
<el-input v-model="scope.row.os" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '融合点'">
<div class="width-180 center">
<el-input v-model="scope.row.os" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == 'Worth-4-dot'">
<div class="width-180 center">
<el-input v-model="scope.row.c" placeholder="" style="width: 100px" />
@N
<el-input v-model="scope.row.d" placeholder="" style="width: 100px" />
</div>
</div>
<div v-if="scope.row.name == 'TITMUS(近)'">
<div class="width-180 center">
<el-input v-model="scope.row.c" placeholder="">
<template slot="prepend">RDD(远):</template>
</el-input>
</div>
</div>
<!-- <div v-if="scope.row.name == '同视机九方位检查'">-->
<!-- <div class="width-180 center">-->
<!-- OU：<el-input v-model="scope.row.b.yghcValue" placeholder="" />-->
<!-- </div>-->
<!-- </div>-->
<!-- &lt;!&ndash; 签字 &ndash;&gt;-->
<!-- <div v-if="scope.row" class="sign center">-->
<!-- &lt;!&ndash; <span v-if="!operationRecord.doctorSignImg" class="sign" @click="singHandle('doctorSignImg')">点击签字</span>&ndash;&gt;-->
<!-- &lt;!&ndash; <img v-if="operationRecord.doctorSignImg" :src="operationRecord.doctorSignImg" alt="" width="90px" @click="singHandle('doctorSignImg')">&ndash;&gt;-->
<!-- </div>-->
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
isSearch: {
type: String,
default: ''
},
patientId: {
type: String,
default: ''
},
formContent: {
type: Object,
default: () => { }
},
onlyRead: {
type: Boolean,
default: false
}
},
data() {
return {
dataForm: {
patientId: '',
patientName: '',
patientSex: '',
patientAge: ''
},
patientData: {},
tableData: [
{
name: '基础信息',
type: ''
},
{
name: '屈光状态',
OD: '',
VA: '',
type: ''
}, {
name: '屈光状态a',
OS: '',
VA: '',
type: ''
}, {
name: 'CT+Prism',
ct: '',
type: ''
}, {
name: '同时视检查',
type: ''
}, {
name: '检查画片',
value: '',
type: '1'
}, {
name: '主观斜视角',
od: '',
os: ''
}, {
name: '客观斜视角',
od: '',
os: ''
}, {
name: '融合功能检查'
}, {
name: '检查画片',
value: '',
type: '2'
}, {
name: '融合点',
od: '',
os: '',
type: ''
}, {
name: 'Worth-4-dot',
a: '',
b: '',
c: '',
d: ''
}, {
name: '立体式检查',
value: ''
}, {
name: 'TITMUS(近)',
a: '',
b: '',
c: ''
}, {
name: '同视机九方位检查'
}, {
name: 'ODOS',
a: '',
b: '',
c: '',
d: '',
e: '',
f: '',
g: '',
h: '',
i: '',
j: '',
k: '',
l: '',
m: '',
n: '',
o: '',
p: '',
q: '',
r: ''
}, {
name: '报告描述',
value: ''
}, {
name: '签名',
a: '',
b: ''
}]
}
},
computed: {
operationRecord: {
get() {
return this.$store.getters.operationRecord
}
}
},
watch: {
operationRecord: {
handler(value) {
console.log(value)
},
deep: true,
immediate: true
}
},
created() {
// this.printPage('threeFunc')
},
mounted() {
this.getPatientData()
},
methods: {
setData() {
this.dataForm = this.formContent.a
this.tableData = this.formContent.b
this.getPatientData()
},
reSet() {
this.dataForm = {
num: '',
name: '',
sex: '',
age: ''
}
this.tableData = [
{
name: '基础信息',
type: ''
},
{
name: '屈光状态',
OD: '',
VA: '',
type: ''
}, {
name: '屈光状态a',
OS: '',
VA: '',
type: ''
}, {
name: 'CT+Prism',
ct: '',
type: ''
}, {
name: '同时视检查',
type: ''
}, {
name: '检查画片',
value: '',
type: '1'
}, {
name: '主观斜视角',
od: '',
os: ''
}, {
name: '客观斜视角',
od: '',
os: ''
}, {
name: '融合功能检查'
}, {
name: '检查画片',
value: '',
type: '2'
}, {
name: '融合点',
od: '',
os: '',
type: ''
}, {
name: 'Worth-4-dot',
a: '',
b: '',
c: '',
d: ''
}, {
name: '立体式检查',
value: ''
}, {
name: 'TITMUS(近)',
a: '',
b: '',
c: ''
}, {
name: '同视机九方位检查'
}, {
name: 'ODOS'
}, {
name: '报告描述',
value: ''
}, {
name: '签名',
a: '',
b: ''
}]
this.getPatientData()
},
async getPatientData() {
const { data: res } = await this.$http.get(
'/patient/view/getPatientData',
{
params: {
patientId: this.patientId
}
}
)
if (res.code === 0) {
this.dataForm = res.data
} else {
this.$message.error(res.msg)
}
},
// 签名
singHandle(text) {
const value = {
text: text,
pageName: 'operationRecord'
}
this.$store.commit('beginSign', value)
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
if (rowIndex === 0 || rowIndex === 4 || rowIndex === 8 || rowIndex === 12 || rowIndex === 17 || rowIndex === 15 || rowIndex === 16 || rowIndex === 14) {
return {
rowspan: 1,
colspan: 3
}
} else if (rowIndex === 1) {
return {
rowspan: 2,
colspan: 1
}
} else if (rowIndex === 2 || rowIndex === 4) {
return {
rowspan: 0,
colspan: 0
}
}
} else if (columnIndex === 1) {
if (rowIndex === 3 || rowIndex === 5 || rowIndex === 9) {
return {
rowspan: 1,
colspan: 2
}
} else if (rowIndex === 0 || rowIndex === 4 || rowIndex === 8 || rowIndex === 9 || rowIndex === 12 || rowIndex === 14 || rowIndex === 15 || rowIndex === 16 || rowIndex === 17) {
return {
rowspan: 0,
colspan: 0
}
}
} else if (columnIndex === 2 || columnIndex === 1) {
if (rowIndex === 0 || rowIndex === 3 || rowIndex === 4 || rowIndex === 5 || rowIndex === 9 || rowIndex === 8 || rowIndex === 12 || rowIndex === 14 || rowIndex === 15 || rowIndex === 16 || rowIndex === 17) {
return {
rowspan: 0,
colspan: 0
}
}
}
},
handlePrint() {
this.printPage('threeFunc')
},
handleSaveTable() {
const data = {
a: this.dataForm,
b: this.tableData
}
this.$emit('save', data)
},
handleDelete() {
this.$emit('del')
}
}
}
</script>
<style lang="scss">
.flex{
display: flex;
}
.j-c{
justify-content: center;
}
#threeFunc{
.el-table__cell{
padding: 7px 0 !important;
}
}
.printBox{
.btnBox{
display: flex;
justify-content: flex-end;
}
.operation-record-table {
//width: 100%;
width: 840px !important;
padding-right: 8px;
.Rline{
position: absolute;
left: 60px;
top: 80px;
}
.Rline-os{
position: absolute;
right: 60px;
top: 80px;
}
.Lline{
position: absolute;
left: 330px;
top: 80px;
}
.Lline-os{
position: absolute;
right: 330px;
top: 80px;
}
.rowLine{
width: 200px;
height: 50px;
position: absolute;
left: 100px;
top: 70px;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}
.rowLine-l{
width: 200px;
height: 50px;
position: absolute;
right: 100px;
top: 70px;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}
.cloLine{
width: 60px;
height: 160px;
left: 170px;
top: 20px;
position: absolute;
border-left: 1px solid #000;
border-right: 1px solid #000;
}
.cloLine-l{
width: 60px;
height: 160px;
right: 170px;
top: 20px;
position: absolute;
border-left: 1px solid #000;
border-right: 1px solid #000;
}
.ipt-a{
width: 50px;
left: 114px;
top: 33px;
position: absolute;
}
.ipt-b{
width: 50px;
left: 176px;
top: 33px;
position: absolute;
}
.ipt-c{
width: 50px;
left: 242px;
top: 33px;
position: absolute;
}
.ipt-d{
width: 50px;
left: 114px;
top: 80px;
position: absolute;
}
.ipt-e{
width: 50px;
left: 176px;
top: 80px;
position: absolute;
}
.ipt-f{
width: 50px;
left: 242px;
top: 80px;
position: absolute;
}
.ipt-g{
width: 50px;
left: 114px;
top: 133px;
position: absolute;
}
.ipt-h{
width: 50px;
left: 176px;
top: 133px;
position: absolute;
}
.ipt-j{
width: 50px;
left: 242px;
top: 133px;
position: absolute;
}
.iptos-a {
width: 50px;
right: 114px;
top: 33px;
position: absolute;
}
.iptos-b {
width: 50px;
right: 176px;
top: 33px;
position: absolute;
}
.iptos-c {
width: 50px;
right: 242px;
top: 33px;
position: absolute;
}
.iptos-d {
width: 50px;
right: 114px;
top: 80px;
position: absolute;
}
.iptos-e {
width: 50px;
right: 176px;
top: 80px;
position: absolute;
}
.iptos-f {
width: 50px;
right: 242px;
top: 80px;
position: absolute;
}
.iptos-g {
width: 50px;
right: 114px;
top: 133px;
position: absolute;
}
.iptos-h {
width: 50px;
right: 176px;
top: 133px;
position: absolute;
}
.iptos-j {
width: 50px;
right: 242px;
top: 133px;
position: absolute;
}
.operation-text {
font-weight: 700;
}
.text {
font-weight: 700;
}
.sign {
cursor: pointer;
color: #46a1ff;
font-weight: 400;
}
}
.center {
text-align: center;
}
.left {
text-align: left;
}
.width-50 {
.el-input {
width: 50px;
}
}
.width-70 {
.el-input {
width: 70px;
}
}
.width-100 {
.el-input {
width: 100px;
}
}
.width-120 {
.el-input {
width: 120px;
}
}
.width-180 {
.el-input {
width: 180px;
}
}
.el-input__inner {
border: none;
height: 26px !important;
line-height: 26px !important;
text-align: center;
}
.el-input__inner {
border-bottom: 1px solid #ccc;
border-radius: 0;
padding: 0;
}
.el-input__prefix {
display: none;
}
.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
background: none !important;
}
.has-gutter {
display: none;
.cell {
font-weight: 700;
}
.el-table__cell {
background: #ced4d9;
}
}
.el-table__header-wrapper{
display: none;
}
}
</style>