123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594 |
- <template>
- <div class="page_dialysisParams">
- <div class="cell clearfix" style="margin-top:10px;">
- <!-- <label class="title">
- <span class="name">治疗日期</span> :
- </label>
- <div class="time">
- <ul class>
- <li
- :class="item.state == dayType ? 'active' : ''"
- @click="chooseDay(item.state)"
- v-for="item in day"
- :key="item.value"
- >{{ item.label }}</li>
- </ul>
- </div>
- <el-date-picker
- v-model="time"
- prefix-icon="el-icon-date"
- @change="changeTime"
- :editable="false"
- style="width: 150px;"
- type="date"
- placeholder="选择日期时间"
- align="right"
- format="yyyy-MM-dd"
- value-format="yyyy-MM-dd"
- ></el-date-picker> -->
- <label class="title" style="margin-left:10px;">
- <span class="name">患者信息</span> :
- </label>
- <div class="infoBox">
- <span>姓名:{{ patient.name }}</span> | <span>透析编号:{{ patient.dialysis_no }}</span>
- </div>
- </div>
- <div>
- <el-table :data="monitor_records" style="width: 100%" border :span-method='objectSpanMethod' :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
- <el-table-column fixed prop="date" label="时间" width="140">
- <template slot-scope="scope">
- <p>{{ scope.row.created_time ? uParseTime(scope.row.operate_time, '{y}-{m}-{d} {h}:{i}') : '' }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="uParseTime(scope.row.created_time, '{y}-{m}-{d} {h}:{i}')" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="name" :label="'静脉压\nmmHg'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.venous_pressure }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.venous_pressure" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="province" :label="'动脉压\nmmHg'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.arterial_pressure }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.arterial_pressure" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="city" :label="'电导度\nms/cm'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.conductivity }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.conductivity" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="address" :label="'血流量\nml/min'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.blood_flow_volume }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.blood_flow_volume" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="zip" :label="'透析液流量\nml/min'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.dialysate_flow }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.dialysate_flow" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="zip" :label="'超滤率\nml/h'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.ultrafiltration_rate }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.ultrafiltration_rate" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="zip" :label="'抗凝剂\n单位/h'" width="120">
- </el-table-column>
- <el-table-column prop="zip" :label="'体温\n℃'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.temperature }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.temperature" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="zip" :label="'脉搏\n次/分'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.pulse_frequency }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.pulse_frequency" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="zip" :label="'收缩压\nmmHg'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.systolic_blood_pressure }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.systolic_blood_pressure" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="zip" :label="'舒张压\nmmHg'" width="120">
- <template slot-scope="scope">
- <p>{{ scope.row.diastolic_blood_pressure }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="scope.row.diastolic_blood_pressure" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </template>
- </el-table-column>
- <el-table-column prop="zip" label="症状及处理" width="300">
- <template slot-scope="scope">
- <div v-if="scope.$index == 1">
- <div v-for="item in doctor" :key="item">
- <p>{{ item }}</p>
- <el-button size="mini" type="primary" v-clipboard:copy="item" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</el-button>
- </div>
- </div>
- </template>
- </el-table-column>
- </el-table>
-
- <!-- <div class="table">
- <table class="fixedTable" border="1">
- <tr>
- <td style="height:60px;line-height:60px;border:none;border-bottom:1px solid #d0d3da;">时间</td>
- <td class="fixedColumn"></td>
- <td >静脉压<br />mmHg</td>
- <td >动脉压<br />mmHg</td>
- <td >电导度<br />ms/cm</td>
- <td >血流量<br />ml/min</td>
- <td >透析液流量<br />ml/min</td>
- <td >超滤率<br />ml/h</td>
- <td >抗凝剂<br />单位/h</td>
- <td >体温<br />℃</td>
- <td >脉搏<br />次/分</td>
- <td >收缩压<br />mmHg</td>
- <td >舒张压<br />mmHg</td>
- <td :rowspan="monitor_records.length + 1" style="width:300px;height:100%">
- <div>
- <div style="height:60px;line-height:60px;border-bottom:1px solid #d0d3da;">症状及处理</div>
- <div :style="{height: height}">
- <div v-for="item in doctor" :key="item">
- <p>{{ item }}</p>
- </div>
- </div>
- </div>
- </td>
- </tr>
- <tr v-for="(item,index) in monitor_records" :key="index">
- <td style="border:none">{{ uParseTime(item.created_time, '{y}-{m}-{d} {h}:{i}') }}</td>
- <td class="fixedColumn"></td>
- <td>{{ item.venous_pressure }}</td>
- <td>{{ item.arterial_pressure }}</td>
- <td>{{ item.conductivity }}</td>
- <td>{{ item.blood_flow_volume }}</td>
- <td>{{ item.dialysate_flow }}</td>
- <td>{{ item.ultrafiltration_rate }}</td>
- <td></td>
- <td>{{ item.temperature }}</td>
- <td>{{ item.pulse_frequency }}</td>
- <td>{{ item.systolic_blood_pressure }}</td>
- <td>{{ item.diastolic_blood_pressure }}</td>
- </tr>
- </table>
- </div> -->
- </div>
- </div>
- </template>
-
- <script>
- import { parseTime } from "@/utils";
- export default {
- props:{
- monitor_records:Array,
- patient:Object,
- doctor_advices:Array,
- prescription:Object,
- },
- data(){
- return{
- tableData: [
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- },
- {
- date: "2016",
- name: "王小虎"
- }
- ],
- tableData1: [
- {
- date: "2016-05-03",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-02",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-04",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-01",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-08",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-06",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-07",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-08",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-06",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- },
- {
- date: "2016-05-07",
- name: "王小虎",
- province: "上海",
- city: "普陀区",
- address: "上海市普陀区金沙江路 1518 弄",
- zip: 200333
- }
- ],
- day: [
- { value: 0, label: "今天", state: 0 },
- { value: 1, label: "昨天", state: 1 },
- { value: 2, label: "前天", state: 2 },
- ],
- dayType: 0,
- time:'',
- textarea:'',
- modeId:'',
- advices:[],
- height:''
- }
- },
- created(){
-
- if(this.monitor_records.length > 5){
- this.monitor_records = this.monitor_records
- }else{
- let num = 5 - this.monitor_records.length
- for(let i = 0; i<num;i++){
- this.monitor_records.push({id:0})
- }
- console.log(22222222222222222,this.monitor_records)
- }
-
- if(this.prescription.mode_id){
- this.modeId = this.getMode(this.prescription.mode_id)
- }
- if(this.doctor_advices.length > 0){
- let str = ''
- let arr = []
- this.advices = this.doctor_advices
- this.advices.map(item => {
- str = item.advice_name + (item.advice_desc ? ('(' + item.advice_desc + item.drug_spec_unit + ')') : '' ) + ' ' + item.prescribing_number + item.prescribing_number_unit + ' ' +
- item.single_dose + item.single_dose_unit + ' ' + item.delivery_way + item.execution_frequency + item.remark
- arr.push(str)
- })
- this.doctor = arr
-
- // this.textarea = ''
- // arr.map(item => {
- // this.textarea += item + "\n"
- // })
- }else if(this.doctor_advices.length == 0){
- this.textarea = ''
- this.textarea = '1.开始' + this.modeId + '治疗' + '\n' +
- '2.结束' + this.modeId + '治疗' + '\n' +
- '3.患者离开血透室'
- let str = this.textarea
- this.doctor = []
- this.doctor.push(this.textarea)
- }
- },
- methods:{
- chooseDay(day) {
- this.dayType = day;
- },
- uParseTime(time, cFormat) {
- if (time === 0) {
- return ''
- }
-
- if (arguments.length === 0) {
- return null
- }
- const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'
- let date
- if (typeof time === 'object') {
- date = time
- } else {
- if (('' + time).length !== 13) time = parseInt(time) * 1000
- date = new Date(time)
- }
- const formatObj = {
- y: date.getFullYear(),
- m: date.getMonth() + 1,
- d: date.getDate(),
- h: date.getHours(),
- i: date.getMinutes(),
- s: date.getSeconds(),
- a: date.getDay()
- }
- const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
- let value = formatObj[key]
- if (key === 'a') {
- return ['一', '二', '三', '四', '五', '六', '日'][value - 1]
- }
- if (result.length > 0 && value < 10) {
- value = '0' + value
- }
- return value || 0
- })
- return time_str
- },
- objectSpanMethod({ row, column, rowIndex, columnIndex }) {
- if (columnIndex === 12) {
- if (rowIndex > 0) {
- return {
- rowspan: this.monitor_records.length - 1 ,
- colspan: 1
- };
- }else{
- return {
- rowspan: 0 ,
- colspan: 0
- };
- }
- }
- },
- getMode(id){
- let name = ''
- this.treatment_mode = Object.values(this.$store.getters.treatment_mode)
- this.treatment_mode.map(item => {
- if(item.id == id){
- name = item.name
- }
- })
- return name
- },
- onCopy() {
- this.$message.success("复制成功");
- },
- onError() {
- this.$message.success("复制失败,请重试");
- }
- },
- watch:{
- monitor_records:{
- handler:function(val) {
- if(this.monitor_records.length > 5){
- this.monitor_records = this.monitor_records
- }else{
- let num = 5 - this.monitor_records.length
- for(let i =0; i<num;i++){
- this.monitor_records.push({id:1})
- }
- console.log(333333333333,this.monitor_records)
- }
- }
- },
- patient:{
- handler:function(val) {
- }
- },
- doctor_advices:{
- handler:function(val) {
- if(this.doctor_advices.length > 0){
- let str = ''
- let arr = []
- this.advices = this.doctor_advices
- this.advices.map(item => {
- str = item.advice_name + (item.advice_desc ? ('(' + item.advice_desc + item.drug_spec_unit + ')') : '' ) + ' ' + item.prescribing_number + item.prescribing_number_unit + ' ' +
- item.single_dose + item.single_dose_unit + ' ' + item.delivery_way + item.execution_frequency + item.remark
- arr.push(str)
- })
- this.doctor = arr
- // this.textarea = ''
- // arr.map(item => {
- // this.textarea += item + "\n"
- // })
- }else if(this.doctor_advices.length == 0){
- this.textarea = ''
- this.textarea = '1.开始' + this.modeId + '治疗' + '\n' +
- '2.结束' + this.modeId + '治疗' + '\n' +
- '3.患者离开血透室'
- let str = this.textarea
- this.doctor = []
- this.doctor.push(this.textarea)
- }
- }
- },
- prescription:{
- handler:function(val) {
- if(this.prescription.mode_id){
- this.modeId = this.getMode(this.prescription.mode_id)
- }
- if(this.doctor_advices.length > 0){
- let str = ''
- let arr = []
- this.advices = this.doctor_advices
- this.advices.map(item => {
- str = item.advice_name + (item.advice_desc ? ('(' + item.advice_desc + item.drug_spec_unit + ')') : '' ) + ' ' + item.prescribing_number + item.prescribing_number_unit + ' ' +
- item.single_dose + item.single_dose_unit + ' ' + item.delivery_way + item.execution_frequency + item.remark
- arr.push(str)
- })
- this.doctor = arr
- // this.textarea = ''
- // arr.map(item => {
- // this.textarea += item + "\n"
- // })
- }else if(this.doctor_advices.length == 0){
- this.textarea = ''
- this.textarea = '1.开始' + this.modeId + '治疗' + '\n' +
- '2.结束' + this.modeId + '治疗' + '\n' +
- '3.患者离开血透室'
- let str = this.textarea
- this.doctor = []
- this.doctor.push(this.textarea)
- }
- }
- },
- deep:true,
- }
- }
- </script>
-
- <style lang="scss" scoped>
- .tableTitle {
- font-size: 16px;
- color: #000;
- font-weight: bold;
- line-height: 40px;
- }
- .page_dialysisParams{
- // width: 76%;
- padding-right: 10px;
- .infoBox{
- padding: 10px 20px;
- border-radius: 20px;
- border:1px solid #DCDFE6;
- font-size: 14px;
- color: #606266;
- display: flex;
- align-items: center;
- }
- .paramsTable{
- // width: 1600px;
- width:160%;
- border: 1px solid #000;
- border-spacing: 0px;
- border-collapse: collapse;
- }
- .paramsTable td{
- border:1px solid #000;
- padding:5px;
- }
- .paramsTable th{
- border:1px solid #000;
- padding:5px;
- }
-
- // .paramsTable td:first-child{
- // position:absolute
- // }
- // .paramsTable th:first-child{
- // position:absolute
- // }
-
-
- .table{width:100%;overflow-x: scroll;}
-
- .fixedTable{width:160%;text-align: center;color:#000;font-size:14px; border-collapse:collapse;background: #fff;}
-
- .fixedTable tr{line-height: 30px;border:1px solid #d0d3da;}
-
- // .fixedTable tr:first-child{height:40px;line-height: 40px;}
-
- .fixedTable td:first-child{position:absolute;width:140px;margin:0px 0px 0px 0px;background: #fff;}
-
- .fixedColumn{width:140px;}
- }
-
- </style>
- <style lang="scss">
- .page_dialysisParams{
- .el-table td, .el-table th{
- text-align: center;
- }
- .el-table .cell{
- display: flex;
- align-items: center;
- flex-direction: column;
- white-space: pre-line;
- text-align: center;
- }
- ::-webkit-scrollbar{
- height: 15px !important;
- }
- }
- html, body {
- width: 100% !important;
- height: 100% !important;
- }
-
- </style>
|