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.

769 lines
25 KiB

3 years ago
<template>
<div id="operation-record" style=" background: #fff; padding: 10px 20px 50px 20px;page-break-after:always">
<div v-if="!onlyRead && isSearch == '3'" class="btnBox">
2 years ago
<el-button v-print="printObj" size="small">打印</el-button>
3 years ago
<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">
<p style="color:#000000;font-size:32px;margin:0 0 30px 0;text-align:center;">
青少年儿童屈光发育档案
</p>
<div class="operation-record-table">
<el-table :data="headData" :span-method="headSpanMethod" border style="width: 820px; margin-top: 20px">
<el-table-column label="" width="" align="center" :resizable="false">
<template slot-scope="scope">
<span>{{ scope.row.name }}</span>
</template>
</el-table-column>
<el-table-column label="" width="" :resizable="false" prop="type">
<template slot-scope="scope">
<div v-if="scope.row.name == '姓名'">
<div class="width-100 center">
<el-input v-model="scope.row.patientName" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '身高'">
<div class="width-100 center">
<el-input v-model="scope.row.height" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '是否戴镜'">
<div class="width-100 center">
<el-input v-model="scope.row.isMirror" placeholder="" />
</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-100 center">
性别
</div>
</div>
<div v-if="scope.row.name == '身高'">
<div class="width-100 center">
体重
</div>
</div>
<div v-if="scope.row.name == '是否戴镜'">
<div class="width-100 center">
戴镜习惯
</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-100 center">
<el-input v-model="scope.row.sex" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '身高'">
<div class="width-100 center">
<el-input v-model="scope.row.weight" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '是否戴镜'">
<div class="width-100 center">
<el-input v-model="scope.row.mirrorHabit" placeholder="" />
</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-100 center">
出生日期
</div>
</div>
<div v-if="scope.row.name == '身高'">
<div class="width-100 center">
何时发现视力下降
</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-100 center">
<el-input v-model="scope.row.birthday" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '身高'">
<div class="width-100 center">
<el-input v-model="scope.row.time" placeholder="" />
</div>
</div>
</template>
</el-table-column>
</el-table>
<el-table :data="tableData" :span-method="objectSpanMethod" border style="width: 820px">
<el-table-column label="" width="" align="center" :resizable="false">
<template slot-scope="scope">
<span>{{ scope.row.name }}</span>
</template>
</el-table-column>
<el-table-column label="" width="" :resizable="false" prop="type">
<template slot-scope="scope">
<div v-if="scope.row.name == '戴镜类型'">
<div class="width-180 center">
<div style="display: flex;flex-wrap: wrap;justify-content: center">
<div v-for="(item,index) in scope.row.mirrorType" :key="index" class="check" @click="item.isSelect = !item.isSelect">
<input type="checkbox" :checked="item.isSelect">
<div>{{ item.name }}</div>
</div>
</div>
<!-- <el-checkbox-group v-model="scope.row.mirrorType">-->
<!-- <el-checkbox label="框架" />-->
<!-- <el-checkbox label="OK镜" />-->
<!-- <el-checkbox label="RGP" />-->
<!-- <el-checkbox label="软镜" />-->
<!-- </el-checkbox-group>-->
3 years ago
</div>
</div>
<div v-if="scope.row.name == '旧镜参数'">
<div class="width-120 center">
<el-input v-model="scope.row.od" placeholder="">
2 years ago
<template slot="prepend">OD:</template>
</el-input>
3 years ago
</div>
</div>
<div v-if="scope.row.name == '父母是否近视'">
<div class="width-180 center">
<div style="display: flex;flex-wrap: wrap;justify-content: center">
<div v-for="(item,index) in scope.row.shortsighte" :key="index" class="check" @click="item.isSelect = !item.isSelect">
<input type="checkbox" :checked="item.isSelect">
<div>{{ item.name }}</div>
</div>
</div>
<!-- <el-checkbox-group v-model="scope.row.shortsighte">-->
<!-- <el-checkbox label="父亲" />-->
<!-- <el-checkbox label="母亲" />-->
<!-- <el-checkbox label="父亲和母亲" />-->
<!-- <el-checkbox label="均无" />-->
<!-- </el-checkbox-group>-->
3 years ago
</div>
</div>
<div v-if="scope.row.name == '户外活动时间'">
<div class="width-180 center">
<div style="display: flex;flex-wrap: wrap;justify-content: center">
<div v-for="(item,index) in scope.row.outTime" :key="index" class="check" @click="item.isSelect = !item.isSelect">
<input type="checkbox" :checked="item.isSelect">
<div>{{ item.name }}</div>
</div>
</div>
<!-- <el-checkbox-group v-model="scope.row.outTime">-->
<!-- <el-checkbox label="<1h" />-->
<!-- <el-checkbox label="1h-2h" />-->
<!-- <el-checkbox label=">2h" />-->
<!-- </el-checkbox-group>-->
3 years ago
</div>
</div>
<div v-if="scope.row.name == '备注'">
<div class="width-180 center">
<el-input v-model="scope.row.note" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '项目'">
<div class="width-180 center">
OD
</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">
<div style="display: flex;flex-wrap: wrap;justify-content: center">
<div v-for="(item,index) in scope.row.mydriasis" :key="index" class="check" @click="item.isSelect = !item.isSelect">
<input type="checkbox" :checked="item.isSelect">
<div>{{ item.name }}</div>
</div>
</div>
<!-- <el-checkbox-group v-model="scope.row.mydriasis">-->
<!-- <el-checkbox label="未散瞳" />-->
<!-- <el-checkbox label="美多丽" />-->
<!-- <el-checkbox label="阿托品" />-->
<!-- <el-checkbox label="其他" />-->
<!-- </el-checkbox-group>-->
3 years ago
</div>
</div>
<div v-if="scope.row.name == '主觉验光'">
<div class="width-180 center">
<el-input v-model="scope.row.od" placeholder="" style="width: 100px" />
</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 == '眼压/mmHg'">
<div class="width-180 center">
<el-input v-model="scope.row.od" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '角膜曲率/D'">
<div class="width-180 center">
<el-input v-model="scope.row.od" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '角膜厚度/μm'">
<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 == '建议'">
<div class="width-180 center">
<div style="display: flex;flex-wrap: wrap;justify-content: center">
<div v-for="(item,index) in scope.row.suggest" :key="index" class="check" @click="item.isSelect = !item.isSelect">
<input type="checkbox" :checked="item.isSelect">
<div>{{ item.name }}</div>
</div>
</div>
<!-- <el-checkbox-group v-model="scope.row.suggest">-->
<!-- <el-checkbox label="框架" />-->
<!-- <el-checkbox label="OK镜" />-->
<!-- <el-checkbox label="RGP" />-->
<!-- <el-checkbox label="软镜" />-->
<!-- <el-checkbox label="其他" />-->
<!-- </el-checkbox-group>-->
3 years ago
</div>
</div>
<div v-if="scope.row.name == '眼轴/眼底照/地形图'">
<div class="width-180 center">
<el-input v-model="scope.row.type" placeholder="" />
</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-120 center">
<el-input v-model="scope.row.os" placeholder="">
2 years ago
<template slot="prepend">OS:</template>
</el-input>
3 years ago
</div>
</div>
<div v-if="scope.row.name == '项目'">
<div class="width-180 center">
OS
</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="" style="width: 100px" />
</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 == '眼压/mmHg'">
<div class="width-180 center">
<el-input v-model="scope.row.os" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '角膜曲率/D'">
<div class="width-180 center">
<el-input v-model="scope.row.os" placeholder="" />
</div>
</div>
<div v-if="scope.row.name == '角膜厚度/μm'">
<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>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
2 years ago
isSearch: {
type: String,
default: ''
},
3 years ago
formContent: {
type: Object,
default: () => { }
2 years ago
},
onlyRead: {
type: Boolean,
default: false
3 years ago
}
},
data() {
return {
2 years ago
printObj: {
id: 'threeFunc',
extraHead: '<meta http-equiv="Content-Language"content="zh-cn"/>,<style>  #printId { width: 100%; !important; } <style>'
},
3 years ago
dataForm: {
yghcValue: '',
operationListValueOD: []
},
headData: [
{
name: '个人基础信息',
type: ''
},
{
name: '姓名',
patientName: '',
sex: '',
birthday: '',
type: ''
}, {
name: '身高',
height: '',
weight: '',
time: ''
}, {
name: '是否戴镜',
isMirror: '',
mirrorHabit: '',
type: ''
}],
originTableData: [],
3 years ago
tableData: [
{
name: '戴镜类型',
mirrorType: [
{
name: '框架',
isSelect: false
},
{
name: 'OK镜',
isSelect: false
}, {
name: 'RGP',
isSelect: false
}, {
name: '软镜',
isSelect: false
}
]
3 years ago
},
{
name: '旧镜参数',
od: '',
os: '',
type: ''
}, {
name: '父母是否近视',
shortsighte: [
{
name: '父亲',
isSelect: false
}, {
name: '母亲',
isSelect: false
}, {
name: '父亲和母亲',
isSelect: false
}, {
name: '均无',
isSelect: false
}
]
3 years ago
}, {
name: '户外活动时间',
outTime: [
{
name: '<1h',
isSelect: false
}, {
name: '1h-2h',
isSelect: false
}, {
name: '>2h',
isSelect: false
}
],
3 years ago
type: ''
}, {
name: '备注',
note: ''
}, {
name: '综合检查信息',
type: '1'
}, {
name: '项目'
}, {
name: '裸眼/旧镜视力',
od: '',
os: ''
}, {
name: '是否散瞳',
mydriasis: [
{
name: '未散瞳',
isSelect: false
}, {
name: '美多丽',
isSelect: false
}, {
name: '阿托品',
isSelect: false
}, {
name: '其他',
isSelect: false
}
]
3 years ago
}, {
name: '主觉验光',
od: '',
os: '',
vaod: '',
vaos: '',
type: '2'
}, {
name: '眼位',
od: '',
os: '',
type: ''
}, {
name: '眼压/mmHg',
od: '',
os: ''
}, {
name: '角膜曲率/D',
od: '',
os: ''
}, {
name: '角膜厚度/μm',
od: '',
os: ''
}, {
name: '处方',
od: '',
os: ''
}, {
name: '建议',
suggest: [
{
name: '框架',
isSelect: false
}, {
name: 'OK镜',
isSelect: false
}, {
name: 'RGP',
isSelect: false
}, {
name: '软镜',
isSelect: false
}, {
name: '其他',
isSelect: false
}
]
3 years ago
}, {
name: '眼轴/眼底照/地形图',
type: ''
}]
}
},
computed: {
operationRecord: {
get() {
return this.$store.getters.operationRecord
}
}
},
watch: {
operationRecord: {
handler(value) {
},
deep: true,
immediate: true
}
},
created() {
this.originTableData = JSON.parse(JSON.stringify(this.tableData))
3 years ago
// this.printPage('threeFunc')
},
methods: {
setData() {
this.headData = this.formContent.a
this.tableData = this.formContent.b
},
reSet() {
this.headData = [
{
name: '个人基础信息',
type: ''
},
{
name: '姓名',
patientName: '',
sex: '',
birthday: '',
type: ''
}, {
name: '身高',
height: '',
weight: '',
time: ''
}, {
name: '是否戴镜',
isMirror: '',
mirrorHabit: '',
type: ''
}]
this.tableData = this.originTableData
3 years ago
},
handleDelete() {
this.$emit('del')
},
// 签名
singHandle(text) {
const value = {
text: text,
pageName: 'operationRecord'
}
this.$store.commit('beginSign', value)
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
if (rowIndex === 5) {
return {
rowspan: 1,
colspan: 3
}
}
} else if (columnIndex === 1) {
if (rowIndex === 0 || rowIndex === 2 || rowIndex === 3 || rowIndex === 4 || rowIndex === 8 || rowIndex === 15 || rowIndex === 16) {
return {
rowspan: 1,
colspan: 2
}
} else if (rowIndex === 5) {
return {
rowspan: 0,
colspan: 0
}
}
} else if (columnIndex === 2) {
if (rowIndex === 0 || rowIndex === 2 || rowIndex === 3 || rowIndex === 4 || rowIndex === 5 || rowIndex === 8 || rowIndex === 15 || rowIndex === 16) {
return {
rowspan: 0,
colspan: 0
}
}
}
},
headSpanMethod({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
if (rowIndex === 0) {
return {
rowspan: 1,
colspan: 6
}
}
} else if (columnIndex === 1 || columnIndex === 3) {
if (rowIndex === 3) {
return {
rowspan: 1,
colspan: 2
}
}
} else if (columnIndex === 1 || columnIndex === 2 || columnIndex === 3 || columnIndex === 4 || columnIndex === 5) {
if (rowIndex === 0) {
return {
rowspan: 0,
colspan: 0
}
}
}
},
handlePrint() {
this.printPage('threeFunc')
},
handleSaveTable() {
const data = {
a: this.headData,
b: this.tableData
}
this.$emit('save', data)
}
}
}
</script>
<style lang="scss">
2 years ago
.operation-record-table{
.el-input__inner {
border: none;
height: 26px !important;
line-height: 26px !important;
text-align: center;
}
.el-input-group__append, .el-input-group__prepend{
background-color: transparent;
color: #606266;
border: none;
}
.el-table__header-wrapper{
display: none;
}
}
3 years ago
#operation-record {
2 years ago
3 years ago
//height: 93%;
// overflow: auto;
.btnBox{
display: flex;
justify-content: flex-end;
}
.el-table--border{
border-right: 1px solid #EBEEF5;
}
.operation-record-table {
//width: 100%;
width: 840px !important;
padding-right: 8px;
.operation-text {
font-weight: 700;
}
.text {
font-weight: 700;
}
.sign {
cursor: pointer;
color: #46a1ff;
font-weight: 400;
}
2 years ago
.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;
}
3 years ago
}
.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-date-editor.el-input,
//.el-date-editor.el-input__inner {
// width: 140px;
//}
//.el-input__suffix {
// top: -7px;
//}
//.el-checkbox__input.is-checked + .el-checkbox__label {
// color: #606266;
//}
//.el-checkbox__input.is-checked .el-checkbox__inner,
//.el-checkbox__input.is-indeterminate .el-checkbox__inner {
// background: #767676;
// border-color: #767676;
//}
//.el-checkbox__inner:hover,
//.el-checkbox__inner {
// border-color: #767676;
//}
//.el-radio__input.is-checked + .el-radio__label {
// color: #606266;
//}
//.el-radio__input.is-checked .el-radio__inner {
// background: #767676;
// border-color: #767676;
//}
//.el-radio {
// margin-right: 8px;
// display: block;
//}
//.el-radio__inner {
// border: 1px solid #767676 !important;
//}
//.el-radio__inner:hover {
// border-color: #767676;
//}
.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>