elizebeth/src/xt_pages/outpatientCharges/outpatientChargesManagement...

<template>
  <div class="main-contain outpatientChargesManagement">
    <div class="position">
      <bread-crumb :crumbs='crumbs'></bread-crumb>
    </div>
    <div class="app-container" style="display:flex;flex: 1;padding: 20px 20px 0px 20px;">
      <div class="mainLeft">
        <!--<div class="mainCell" style="justify-content: space-between;">-->
        <!--<p>未就诊：<span>1</span>人</p>-->
        <!--<p>已就诊：<span>0</span>人</p>-->
        <!--</div>-->
        <!--<div class="mainCell">-->
        <!--<el-radio-group v-model="radio" @change="changeRadio">-->
        <!--<el-radio :label=1>未就诊</el-radio>-->
        <!--<el-radio :label=2>已就诊</el-radio>-->
        <!--<el-radio :label=3>全部</el-radio>-->
        <!--</el-radio-group>-->
        <!--</div>-->
        <div class="mainCell" style="margin-bottom:10px;">
          <el-input size="small" @keyup.enter.native='searchAction' v-model.trim="search_input" class="filter-item"/>
          <el-button size="small" style="margin-left:10px;" class="filter-item" type="primary" @click="searchAction">
            搜索
          </el-button>
        </div>
        <div style="flex:1;overflow-y:auto;">
          <el-table :data="patientTableData" border style="width: 100%;" :row-style="{ color: '#303133' }"
                    :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
                    highlight-current-row ref="tab"
                    @current-change="handleCurrentChange">
            <el-table-column align="center" prop="name" label="患者姓名">
              <template slot-scope="scope">{{scope.row.patients?scope.row.patients.name:''}}</template>
            </el-table-column>
            <el-table-column align="center" prop="name" label="就诊号" width="90">
              <template slot-scope="scope">{{ scope.row.his_patient ?scope.row.his_patient.number:''}}</template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <div class="mainRight">

        <div class="mainCell" style="margin-bottom:10px;flex-direction: row-reverse;">
          <el-button size="small" @click="open(1)" type="primary" style="margin-left:10px;">打印处置单</el-button>
          <el-button size="small" @click="open(2)" type="primary">打印治疗单</el-button>
          <el-button size="small" @click="open(3)" type="primary">打印</el-button>
          <el-button v-loading="loadingone"  size="small"
                     @click="open(6)"
                     type="primary">挂号
          </el-button>
          <el-button v-loading="loadingtwo" v-if="this.info.prescription_status == 1" size="small"
                     @click="open(4)"
                     type="primary">收费
          </el-button>
          <el-button size="small" @click="open(5)" type="primary" v-if="this.info && this.info.prescription_status == 3">退费</el-button>
        </div>

        <div class="mainCenter">
          <el-tabs class="settlementTabs" v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="日结" name="first">
              <div style="display:flex;height:100%;">
                <div class="centerLeft">
                  <div class="tabsBox">
                    <!--<el-button type="text" class="addTab" @click="addCharges" icon="el-icon-circle-plus">附加收费</el-button>-->
                    <el-tabs class="preTabs" v-model="editableTabsValue" type="card" @tab-click="tabclickEvent">
                      <el-tab-pane
                        v-for="(item, index) in prescriptions"
                        :key="index"
                        :label="item.name"
                        :name="item.name"
                      >
                      </el-tab-pane>

                      <div class="RP">
                        Rp
                        <el-date-picker
                          v-model="record_date"
                          type="date"
                          @change="changeDate"
                          format="yyyy-MM-dd"
                          value-format="yyyy-MM-dd"
                          placeholder="选择日期">
                        </el-date-picker>
                      </div>
                      <prescription-table ref="prescription_tables"
                                          :prescription="curPrescriptions"></prescription-table>

                    </el-tabs>

                  </div>
                  <div class="costBox">
                    <span>当前处方总费用：<span style="color:red;">{{ total}}元</span></span>
                    <span v-if="this.curPrescriptions.order_status  == 1">待结算</span>
                    <span v-if="this.curPrescriptions.order_status  == 2">已结算</span>
                    <span v-if="this.curPrescriptions.order_status  == 3">已退费</span>

                  </div>
                </div>
                <div class="centerRight">
                  <p class="centerRightTitle">人员信息</p>
                  <div style="display:flex;justify-content: space-between;line-height:30px;">
                    <span style="font-size:14px;">人员编码:{{patientInfo.dialysis_no}}</span>
                    <span style="font-size:14px;">日期:{{record_date}}</span>
                  </div>
                  <ul class="basicUl">
                    <li style="width:50%;">姓名：{{patientInfo.name}}</li>
                    <li style="width:50%;">性别：{{patientInfo.gender == 1 ? '男' : '女' }}</li>
                    <li style="width:50%;">年龄：{{patientInfo.age }}</li>
                    <li style="width:50%;">身高：{{patientInfo.height?patientInfo.height:''}}</li>
                    <li style="width:50%;">体重：{{patientInfo.weight?patientInfo.weight:''}}</li>
                    <li style="width:50%;">电话：{{patientInfo.phone}}</li>
                    <li style="width:100%;">地址：{{patientInfo.home_address}}</li>
                    <li style="width:100%;">过敏史及其他病史：{{info.sick_history}}</li>
                  </ul>
                  <p class="centerRightTitle">诊断信息</p>
                  <div style="display:flex;justify-content: space-between;line-height:30px;">
                    <span style="font-size:14px;">门诊编号:{{ hisPatientInfo.number}}</span>
                  </div>
                  <ul class="basicUl">
                    <li style="width:50%;">医生：{{ info.doctor }}</li>
                    <li style="width:50%;">科室：{{ info.departments }}</li>
                    <li style="width:50%;">总费用：{{ getTotal() }}</li>

                    <li style="width:100%;">判断结果：{{info.diagnosis}}</li>
                    <li style="width:100%;">是否有传染病：</li>
                    <li style="width:100%;">血压：</li>
                  </ul>
                </div>
              </div>
            </el-tab-pane>
            <!--<el-tab-pane label="月结" name="second">-->
            <!--<div style="display:flex;height:100%;">-->
            <!--<div class="centerLeft">-->
            <!--<div class="tabsBox">-->
            <!--&lt;!&ndash;<el-button type="text" class="addTab" @click="addCharges" icon="el-icon-circle-plus">附加收费</el-button>&ndash;&gt;-->
            <!--<el-tabs class="preTabs" v-model="editableTabsValue" type="card" closable>-->
            <!--<el-tab-pane-->
            <!--v-for="(item, index) in editableTabs"-->
            <!--:key="index"-->
            <!--:label="item.title"-->
            <!--:name="item.name"-->
            <!--&gt;-->
            <!--<div class="RP">-->
            <!--Rp-->
            <!--<el-date-picker-->
            <!--style="width:420px;"-->
            <!--v-model="value1"-->
            <!--type="daterange"-->
            <!--range-separator="至"-->
            <!--start-placeholder="开始日期"-->
            <!--end-placeholder="结束日期">-->
            <!--</el-date-picker>-->
            <!--</div>-->
            <!--<prescription-table :preTableData='preTableData'></prescription-table>-->
            <!--</el-tab-pane>-->
            <!--&lt;!&ndash;<el-tab-pane name="more" closable><span slot="label"><i class="el-icon-plus" @click="addTab"></i></span></el-tab-pane>&ndash;&gt;-->
            <!--</el-tabs>-->

            <!--</div>-->
            <!--<div class="costBox">-->
            <!--<span>处方编号：2134348971237883</span>-->
            <!--<span>当前处方总费用：<span style="color:red;">{{ total }}元</span></span>-->
            <!--<span>{{ state }}</span>-->
            <!--</div>-->
            <!--</div>-->
            <!--<div class="centerRight">-->
            <!--<p class="centerRightTitle">人员信息</p>-->
            <!--<div style="display:flex;justify-content: space-between;line-height:30px;">-->
            <!--<span style="font-size:14px;">人员编码:</span>-->
            <!--<span style="font-size:14px;">日期:{{start_time}}</span>-->
            <!--</div>-->
            <!--<ul class="basicUl">-->
            <!--<li style="width:50%;">姓名：{{ patientInfo.name }}</li>-->
            <!--<li style="width:50%;">性别：{{ patientInfo && patientInfo.gend == 1 ? '男' : "女" }}</li>-->
            <!--<li style="width:50%;">年龄：{{ patientInfo.age }}</li>-->
            <!--<li style="width:50%;">身高：</li>-->
            <!--<li style="width:50%;">体重：</li>-->
            <!--<li style="width:50%;">电话：</li>-->
            <!--<li style="width:100%;">地址：</li>-->
            <!--<li style="width:100%;">过敏史：</li>-->
            <!--</ul>-->
            <!--<p class="centerRightTitle">诊断信息</p>-->
            <!--<div style="display:flex;justify-content: space-between;line-height:30px;">-->
            <!--<span style="font-size:14px;">门诊编号:676273816287361</span>-->
            <!--</div>-->
            <!--<ul class="basicUl">-->
            <!--<li style="width:50%;">医生：{{ doctor.name }}</li>-->
            <!--<li style="width:50%;">科室：{{ doctor.department }}</li>-->
            <!--<li style="width:100%;">费用：{{ doctor.total }}元</li>-->
            <!--<li style="width:100%;">判断结果：</li>-->
            <!--<li style="width:100%;">是否有传染病：</li>-->
            <!--<li style="width:100%;">血压：</li>-->
            <!--</ul>-->
            <!--</div>-->
            <!--</div>-->
            <!--</el-tab-pane>-->
          </el-tabs>


        </div>
      </div>
    </div>
    <!--<additionalCharges ref='additionalCharges'></additionalCharges>-->
  </div>
</template>


<script>
  import BreadCrumb from '@/xt_pages/components/bread-crumb'
  import noCharge from './components/noCharge'
  import charged from './components/charged'
  import medicalInsuranceRefund from './components/medicalInsuranceRefund'
  import prescriptionTable from './components/prescriptionTable'
  import additionalCharges from './components/additionalCharges'
  import { getPatientInformation, getPatientList } from '@/api/project/project'
  import { getPatientInfo, getSchedulePatientList, register, upload,Refund } from '@/api/his/his'

  const moment = require('moment')
  export default {
    components: {
      BreadCrumb,
      noCharge,
      charged,
      medicalInsuranceRefund,
      prescriptionTable,
      additionalCharges
    },
    data() {
      return {
        crumbs: [
          { path: false, name: '门诊收费' },
          { path: false, name: '门诊收费管理' }
        ],
        activeName: 'first',
        info: {},
        curPrescriptions: {},
        prescriptions: [],
        record_date: '',
        tableData: [],
        editableTabsValue: '1',
        loadingone: false,
        editableTabs: [{
          title: '处方1',
          name: '1'
        }],
        tabIndex: 1,
        hisPatientInfo: {},
        loadingtwo: false,
        patientTableData: [{
          name: '杨美英',
          mdtrt_id: '1709946'
        }],
        patientInfo: { id: 0 },
        doctor: {},
        total: 0,
        state: '未收费',
        radio: 1,
        radioStatus: 1,
        search_input: '',
        start_time: moment().locale('zh-cn').format('YYYY-MM-DD')
      }
    },
    created() {
      var nowDate = new Date()
      var nowYear = nowDate.getFullYear()
      var nowMonth = nowDate.getMonth() + 1
      var nowDay = nowDate.getDate()
      this.record_date =
        nowYear +
        '-' +
        (nowMonth < 10 ? '0' + nowMonth : nowMonth) +
        '-' +
        (nowDay < 10 ? '0' + nowDay : nowDay)

      //获取患者信息
      this.getPatientList()
    },
    methods: {
      changeDate(val) {
        if (this.patientInfo.id == 0) {
          this.$message.error('请先选择患者')
          return
        }
        let params = {
          'record_date': val,
          'patient_id': this.patientInfo.id
        }
        getPatientInfo(params).then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            this.patientInfo = response.data.data.xt_info
            this.hisPatientInfo = response.data.data.his_info
            this.info = response.data.data.info
            this.prescriptions = []
            for (let i = 0; i < response.data.data.prescription.length; i++) {
              var prescription = response.data.data.prescription[i]

              let tempAdvice = []
              let tempProject = []

              for (let b = 0; b < prescription.advices.length; b++) {
                let obj = {
                  advice_id: prescription.advices[b].id,
                  drug_name: prescription.advices[b].advice_name,
                  single_dose: prescription.advices[b].single_dose,
                  delivery_way: prescription.advices[b].delivery_way,
                  execution_frequency: prescription.advices[b].execution_frequency,
                  retail_price: prescription.advices[b].price.toString(),
                  remark: prescription.advices[b].remark,
                  prescribing_number: prescription.advices[b].prescribing_number.toString(),
                  single_dose_unit: prescription.advices[b].single_dose_unit,
                  prescribing_number_unit: prescription.advices[b].prescribing_number_unit,
                  min_unit: prescription.advices[b].single_dose_unit,
                  medical_insurance_number: prescription.advices[b].med_list_codg

                }
                tempAdvice.push(obj)
              }

              for (let b = 0; b < prescription.project.length; b++) {
                console.log(prescription.project[b].project.project_name)
                let obj = {
                  id: prescription.project[b].id,
                  project_id: prescription.project[b].project.id,
                  project_name: prescription.project[b].project.project_name,
                  statistical_classification: prescription.project[b].statistical_classification,
                  single_dose: prescription.project[b].single_dose,
                  delivery_way: prescription.project[b].delivery_way,
                  execution_frequency: prescription.project[b].execution_frequency,
                  number_days: prescription.project[b].day,
                  total: prescription.project[b].count.toString(),
                  price: prescription.project[b].price,
                  remark: prescription.project[b].remark,
                  medical_code: prescription.project[b].project.medical_code
                }
                tempProject.push(obj)
              }
              let index = i + 1
              let obj = {
                id: prescription.id,
                name: '处方' + index,
                advices: tempAdvice,
                project: tempProject,
                type: response.data.data.prescription[i].type,
                order_status: response.data.data.prescription[i].order_status
              }
              this.prescriptions.push(obj)
              this.curPrescriptions = this.prescriptions[0]
              this.total = 0
              this.total = this.getTotalOne()
            }
          }
        })
      },
      handleClick() {

      },
      searchAction() {

      },
      tabclickEvent(val) {
        for (let i = 0; i < this.prescriptions.length; i++) {
          if (this.prescriptions[i].name == val.name) {
            this.curPrescriptions = {}
            var temp = this.deepClone(this.prescriptions[i])
            this.curPrescriptions = temp
          }
        }
        console.log(this.curPrescriptions)

        this.total = 0
        this.total = this.getTotalOne()
        console.log(this.total)



      }, deepClone(source) {
        if (!source && typeof source !== 'object') {
          throw new Error('error arguments', 'shallowClone')
        }
        const targetObj = source.constructor === Array ? [] : {}
        Object.keys(source).forEach((keys) => {
          if (source[keys] && typeof source[keys] === 'object') {
            targetObj[keys] = this.deepClone(source[keys])
          } else {
            targetObj[keys] = source[keys]
          }
        })
        return targetObj
      },getTotalOne(){
        var total = 0
          if(this.curPrescriptions.type == 1) {
            if (this.curPrescriptions.advices != null) {
              for (let a = 0; a < this.curPrescriptions.advices.length; a++) {
                console.log(this.curPrescriptions.advices[a].retail_price)
                console.log(this.curPrescriptions.advices[a].prescribing_number)

                total = total + this.curPrescriptions.advices[a].retail_price * this.curPrescriptions.advices[a].prescribing_number
              }
            }
            return total

          }else{
            var total = 0
            if (this.curPrescriptions.project != null) {
              for (let b = 0; b < this.curPrescriptions.project.length; b++) {
                console.log(this.curPrescriptions.project[b].price )
                console.log(this.curPrescriptions.project[b].total )
                total = total + this.curPrescriptions.project[b].price * this.curPrescriptions.project[b].total
              }
            }
            return total

          }



      },
      getTotal() {
        var total = 0
        for (let i = 0; i < this.prescriptions.length; i++) {
          if (this.prescriptions[i].advices != null) {
            for (let a = 0; a < this.prescriptions[i].advices.length; a++) {
              total = total + this.prescriptions[i].advices[a].retail_price * this.prescriptions[i].advices[a].prescribing_number
            }
          }
          if (this.prescriptions[i].project != null) {
            for (let b = 0; b < this.prescriptions[i].project.length; b++) {
              total = total + this.prescriptions[i].project[b].price * this.prescriptions[i].project[b].total
            }
          }
        }
        return total
      },
      moreState(tab, event) {
        if (tab == 'more') {
          return false
        }
      },
      open(index) {
        if (index == 1) {
        } else if (index == 2) {

        } else if (index == 4) {

          let params = {
            'id': this.patientInfo.id,
            'record_time': this.record_date
          }
          this.loadingtwo = true
          upload(params).then(response => {
            if (response.data.state == 0) {
              this.$message.error(response.data.msg)
              this.loadingtwo = false

              return false

            } else {
              this.loadingtwo = false

            }
          })

          this.state = '已收费'
          this.$message({ message: '收费成功', type: 'success' })
        } else if (index == 5) {
          let params = {
            'id': this.patientInfo.id,
            'record_time': this.record_date
          }
          Refund(params).then(response => {
            if (response.data.state == 0) {
              this.$message.error(response.data.msg)
              this.loadingtwo = false

              return false

            } else {
              this.loadingtwo = false

            }
          })




          this.$message({ message: '退费成功', type: 'success' })
        } else if (index == 6) {

          if (this.patientInfo.id == 0) {
            this.$message.error('请先选择要挂号的病人')
            return
          }
          let params = {
            'id': this.patientInfo.id,
            'record_time': this.record_date
          }
          this.loadingone = true
          register(params).then(response => {
            if (response.data.state == 0) {
              this.$message.error(response.data.msg)
              this.loadingone = false

              return false

            } else {
              this.loadingone = false
              var his_info = response.data.data.his_info
              this.hisPatientInfo = his_info
            }
          })
        }
      },

      choosePatient() {
        console.log(id)
        this.radioStatus = id
        this.getPatientList()
      },
      changeRadio(id) {
        console.log(id)
        this.radioStatus = id
        this.getPatientList()
      },

      //患者列表
      getPatientList() {
        let params = {
          'record_date': this.record_date
        }
        getSchedulePatientList(params).then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            this.patientTableData = []
            for (let i = 0; i < response.data.data.list.length; i++) {

              if (response.data.data.list[i].prescription != null && response.data.data.list[i].prescription.length > 0) {
                this.patientTableData.push(response.data.data.list[i])
              }
            }
          }
        })
      },

      unique(arr) {
        const res = new Map()
        return arr.filter((arr) => !res.has(arr.id_card_no) && res.set(arr.id_card_no, 1))
      },
      handleCurrentChange(val) {
        console.log('val', val)
        this.getPatientInformation(val.patients.id)
      },

      //获取患者的基本信息
      getPatientInformation(id) {
        let params = {
          'record_date': this.record_date,
          'patient_id': id
        }
        getPatientInfo(params).then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            this.patientInfo = response.data.data.xt_info
            this.hisPatientInfo = response.data.data.his_info
            this.info = response.data.data.info
            this.prescriptions = []
            for (let i = 0; i < response.data.data.prescription.length; i++) {
              var prescription = response.data.data.prescription[i]

              let tempAdvice = []
              let tempProject = []

              for (let b = 0; b < prescription.advices.length; b++) {
                let obj = {
                  advice_id: prescription.advices[b].id,
                  drug_name: prescription.advices[b].advice_name,
                  single_dose: prescription.advices[b].single_dose,
                  delivery_way: prescription.advices[b].delivery_way,
                  execution_frequency: prescription.advices[b].execution_frequency,
                  retail_price: prescription.advices[b].price.toString(),
                  remark: prescription.advices[b].remark,
                  prescribing_number: prescription.advices[b].prescribing_number.toString(),
                  single_dose_unit: prescription.advices[b].single_dose_unit,
                  prescribing_number_unit: prescription.advices[b].prescribing_number_unit,
                  min_unit: prescription.advices[b].single_dose_unit,
                  medical_insurance_number: prescription.advices[b].med_list_codg

                }
                tempAdvice.push(obj)
              }

              for (let b = 0; b < prescription.project.length; b++) {
                console.log(prescription.project[b].project.project_name)
                let obj = {
                  id: prescription.project[b].id,
                  project_id: prescription.project[b].project.id,
                  project_name: prescription.project[b].project.project_name,
                  statistical_classification: prescription.project[b].statistical_classification,
                  single_dose: prescription.project[b].single_dose,
                  delivery_way: prescription.project[b].delivery_way,
                  execution_frequency: prescription.project[b].execution_frequency,
                  number_days: prescription.project[b].day,
                  total: prescription.project[b].count.toString(),
                  price: prescription.project[b].price,
                  remark: prescription.project[b].remark,
                  medical_code: prescription.project[b].project.medical_code
                }
                tempProject.push(obj)
              }
              let index = i + 1
              let obj = {
                id: prescription.id,
                name: '处方' + index,
                advices: tempAdvice,
                project: tempProject,
                order_status:response.data.data.prescription[i].order_status,
                type: response.data.data.prescription[i].type
              }
              this.prescriptions.push(obj)
              this.curPrescriptions = this.prescriptions[0]
              this.total = 0
              this.total = this.getTotalOne()
              console.log(this.total)


            }
          }
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  .app-container {
    height: 100%;
  }

  .outpatientChargesManagement {
    height: 100%;
    display: flex;
    flex-direction: column;

  .mainLeft {
    width: 200px;
    height: 100%;
    display: flex;
    flex-direction: column;

  .el-radio {
    margin-right: 5px;
  }

  }
  .mainCell {
    height: 36px;
    display: flex;
    align-items: center;
  }

  .mainRight {
    margin-left: 20px;
    flex: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;

  .cellSpan {
    min-width: 80px;
    display: inline-block;
    margin-right: 10px;
  }

  }
  .tabsBox {
    position: relative;
    height: 90%;
    overflow-y: auto;
    margin-bottom: 60px;

  .el-tabs__item {
    padding: 0 10px;
  }

  }
  .addTab {
    position: absolute;
    right: 0;
    top: 6px;
    z-index: 20;
  }

  .mainCenter {
    display: flex;
    flex: 1;
  }

  .costBox {
    width: 100%;
    height: 60px;
    background: #fff;
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .centerLeft {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    height: 100%;
  }

  .settlementTabs {
    flex: 1;

  .el-tab-pane {
    height: 100%;
  }

  .el-tabs__content {
    height: 100%;
  }

  }
  .centerRight {
    width: 300px;
    margin-left: 5px;
    display: flex;
    flex-direction: column;
  }

  .RP {
    color: #409EFF;
    font-size: 20px;
    margin-bottom: 5px;
  }

  .centerRightTitle {
    color: #409EFF;
    padding-top: 10px;;
  }

  .basicUl {
    border-top: 1px solid #e5e5e5;
    border-left: 1px solid #e5e5e5;
    display: flex;
    flex-wrap: wrap;

  li {
    border-bottom: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    width: 100%;
    height: 38px;
    line-height: 38px;
    text-indent: 5px;
    font-size: 14px;
  }

  }
  }
</style>

<style lang="scss">
  #tab-more {

  .el-icon-close {
    display: none;
  }

  }
  .settlementTabs {

  .el-tabs__content {
    height: 90%;
  }

  }
</style>