Vue_New/src/xt_pages/stock/selfPreparedMedicine/patientDrugQuery.vue

<template>
    <div class="main-contain">
        <div class="app-container" style="padding-left:0px;margin:0px;"  v-loading="loading"
        element-loading-text="拼命加载中">
         <el-container>
               <div style="width:27%">
                <!-- <el-row style="white-space:nowrap;display:flex;line-height: 31px;">
                   <span style="font-size:14px;color:#606266"> 时间:</span>
                    <el-date-picker
                      size="small"
                      v-model="start_time"
                      prefix-icon="el-icon-date"
                      :editable="false"
                      type="date"
                      placeholder="选择日期时间"
                      align="right"
                      format="yyyy-MM-dd"
                      value-format="yyyy-MM-dd"
                      @change="startTimeChange"
                      :clearable="false"
                    ></el-date-picker> 
                      <span>-</span> 
                      <el-date-picker
                        size="small"
                        v-model="end_time"
                        prefix-icon="el-icon-date"
                        :editable="false"
                        type="date"
                        placeholder="选择日期时间"
                        align="right"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                        @change="endTimeChange"
                    ></el-date-picker>
                </el-row> -->
                <el-row></el-row>
                 <el-row>
                   <el-col :span="24" style="display:flex">
                      <el-input style="margin-top:10px;margin-bottom:10px" placeholder="请输入患者姓名" v-model="keyword"></el-input>&nbsp;
                      <el-button style="height: 35px;margin-top: 10px;margin-bottom: 10px;" type="primary" @click="onSearch" icon="el-icon-search">搜索</el-button>
                   </el-col>
                  </el-row>

                  <el-row>
                    
                      <el-table
                          ref="singleTable"
                          :data="patientList"
                          highlight-current-row
                           border
                          @current-change="handleCurrentChange"
                           height="440"
                           :row-style="{ color: '#303133' }"
                          :header-cell-style="{
                            backgroundColor: 'rgb(245, 247, 250)',
                            color: '#606266'
                          }"
                        >
                     <el-table-column
                       prop="date"
                       label="序号"
                      align="center"
                      >
                      <template slot-scope="scope">
                        {{scope.$index + 1}}
                      </template>
                    </el-table-column>
                     <el-table-column
                       prop="name"
                      label="姓名"
                      align="center">
                      <template slot-scope="scope">
                        {{scope.row.name}}
                      </template>
                     </el-table-column>

                     </el-table>
                  </el-row>
               </div>

                 <el-main>
                  <div class="main newMain">
                      
                        
                  <el-tabs>

                   <el-tab-pane label="患者使用列表">
                     <div style="float:right;margin-bottom:10px">
                      <!-- <el-button type="primary" @click="toPrint">打印</el-button>
                      <el-button type="primary" @click="exportList">导出</el-button> -->
                      </div>
                     <el-table
                          :data="tableList"
                          highlight-current-row
                           border
                           height="440"
                           :row-style="{ color: '#303133' }"
                          :header-cell-style="{
                            backgroundColor: 'rgb(245, 247, 250)',
                            color: '#606266'
                          }"
                        >
                     <el-table-column
                       prop="date"
                       label="药品名称"
                      align="center"
                      >
                      <template slot-scope="scope">
                        {{scope.row.drug.drug_name}}
                      </template>
                    </el-table-column>
                    <el-table-column
                       prop="date"
                       label="药品规格"
                      align="center"
                      >
                      <template slot-scope="scope">
                        {{ scope.row.drug.dose}}{{ scope.row.drug.dose_unit }} * {{ scope.row.drug.min_number }}{{ scope.row.drug.min_unit }} /{{ scope.row.drug.max_unit }}
                      </template>
                    </el-table-column>
                     <el-table-column
                       prop="name"
                      label="生产厂家"
                      align="center">
                      <template slot-scope="scope">
                        {{ getManufacturName(scope.row.drug.manufacturer) }}
                      </template>
                     </el-table-column>
                      <el-table-column
                       prop="name"
                      label="规格&单位"
                      align="center">
                      <template slot-scope="scope">
                        {{scope.row.dose}}{{scope.row.dose_unit}} * {{scope.row.min_number}}{{scope.row.min_unit}}/{{scope.row.max_unit}}
                      </template>
                     </el-table-column>
                      <el-table-column
                       prop="name"
                      label="入库数量"
                      align="center">
                      <template slot-scope="scope">
                         {{ scope.row.sum_in_count }}
                      </template>
                     </el-table-column>

                     <el-table-column
                       prop="name"
                      label="出库数量"
                      align="center">
                      <template slot-scope="scope">
                        {{ scope.row.sum_out_count }}
                      </template>
                     </el-table-column>

                     <el-table-column
                       prop="name"
                      label="退库数量"
                      align="center">
                      <template slot-scope="scope">
                        {{ scope.row.sum_cancel_count }}
                      </template>
                     </el-table-column>

                     <el-table-column
                       prop="name"
                      label="实际出库"
                      align="center">
                      <template slot-scope="scope">
                        {{ scope.row.sum_act_out_count }}
                      </template>
                     </el-table-column>


                     
                     <el-table-column
                       prop="name"
                      label="剩余库存"
                      align="center">
                      <template slot-scope="scope">
                        {{ scope.row.flush_count }}
                      </template>
                     </el-table-column>

                     <el-table-column label="操作" align="center" width="200px">
               
                      <template slot-scope="scope">
                        <el-button
                          size="small"
                          type="primary"
                          @click="toClick(scope.row)"
                        >库存流水
                        </el-button>
                        <el-button
                          size="small"
                          type="primary"
                          @click="toClickOne(scope.row)"
                        >批次
                        </el-button>
        
                      
                        </template>
                    </el-table-column>

                     </el-table>
                      <el-pagination
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChangeOne"
                        :page-sizes="[10, 50, 100,200,500,1000]"
                        :page-size="10"
                        background
                        align="right"
                        style="margin-top:20px;"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="total"
                        >
                      </el-pagination>
                    </el-tab-pane>
                   </el-tabs>
                </div>
             </el-main>
          </el-container>
        </el-container>
      </el-container>
      </div>
    </div>

</template>
<script>
import { getGoodPatientList,getSelfDrugWarehouseOutDetailByPatientId } from "@/api/drug/drug"
export default {
  data(){
    return{
      zoneList:[],
      zone_id:0,
      tableData:[],
      DeviceTypeType:[],
      device_type:"",
      forms:{},
      start_time:"",
      end_time:"",
      patientList:[],
      tableList:[],
      keyword:"",
      manufacturerList:[],
      patient_id:0,
      patient:{},
      limit:10,
      page:1,
      total:0,
      loading:false,
    }
  },
  methods:{
  
    handleSizeChange(val) {
      this.limit = val;
      this.getDrugWarehouseOutDetailByPatientId()
    },
    handleCurrentChangeOne(val) {
      this.page = val;
      
      this.getDrugWarehouseOutDetailByPatientId()
    },
    startTimeChange(){
      this.handleCurrentChange(this.patient)
    },
    endTimeChange(){
      this.handleCurrentChange(this.patient)
    },
    getManufacturName(id){
        var manufacturer_name = ""
        for(let i=0;i<this.manufacturerList.length;i++){
          if(id == this.manufacturerList[i].id){
             manufacturer_name = this.manufacturerList[i].manufacturer_name
          }
        }
        return manufacturer_name
      },
    getDearName(id){
        var dear_name = ""
        for(let i=0;i<this.dealerList.length;i++){
          if(id == this.dealerList[i].id){
            dear_name = this.dealerList[i].dealer_name
          }
        }
        return dear_name
    },
    getlist(){
        this.loading = true
        var params = {
          keyword:this.keyword,
        }
      getGoodPatientList(params).then(response=>{
        if(response.data.state == 1){
          this.loading = false
          var list = response.data.data.list
          this.patientList=[]
          this.patientList = list
          this.$refs.singleTable.setCurrentRow(this.patientList[0]);
          this.handleCurrentChange(this.patientList[0])
        }
      })
    },
   onSearch(){
     this.getlist()
   },
   handleCurrentChange(val){
       this.patient = val
       var params = {
         patient_id:val.id,
         start_time:this.start_time,
         end_time:this.end_time,
         limit:this.limit,
         page:this.page,
       }
     getSelfDrugWarehouseOutDetailByPatientId(params).then(response=>{
        if(response.data.state == 1){
          var list = response.data.data.list
          this.tableList = list
          this.total = response.data.data.total
          this.manufacturerList = response.data.data.manufacturerList
        }
     })
   },
   getDrugWarehouseOutDetailByPatientId(){
      var params = {
         patient_id:this.patient.id,
         start_time:this.start_time,
         end_time:this.end_time,
         limit:this.limit,
         page:this.page,
       }
      console.log("hh23232323232323",params)
     getDrugWarehouseOutDetailByPatientId(params).then(response=>{
        if(response.data.state == 1){
          var list = response.data.data.list
         console.log("list233223232323",list)
          var outlist = response.data.data.outlist
          this.manufacturerList = response.data.data.manufacturerList
          if(list!=null && list.length > 0){
            for(let i=0;i<list.length;i++){
              if(list[i].count_unit == list[i].drug.max_unit){
                 list[i].count = list[i].count * list[i].drug.min_number
              }
            }
          }
          let dataInfo = {}
          list.forEach((item, index) => {
            let { drug_id } = item
            if (!dataInfo[drug_id]) {
              dataInfo[drug_id] = {
                drug_id,
                child: [],
                dose:item.drug.dose,
                dose_unit:item.drug.dose_unit,
                min_number:item.drug.min_number,
                min_unit:item.drug.min_unit,
                max_unit:item.drug.max_unit,
                drug_name:item.drug.drug_name,
                manufacturer:this.getManufacturName(item.manufacturer),
              }
            }
          })
          let arr = Object.values(dataInfo)
          arr.forEach((item,index)=>{
            for(let i=0;i<outlist.length;i++){
               if(item.drug_id == outlist[i].drug_id){
                 item.child.push(outlist[i])
               }
            }
          })
         
         
          this.tableList = arr
        }
     })
   },
   getManufacturName(id){
     var manufacturer_name = ""
     for(let i=0;i<this.manufacturerList.length;i++){
        if(id == this.manufacturerList[i].id){
          manufacturer_name = this.manufacturerList[i].manufacturer_name
        } 
     }
     return manufacturer_name
   },
   open(){
    console.log("haaaaaaaaaaaaaaaaaaaaaaa")
    this.getlist()
   },
   getCount(val,min_number,max_unit,min_unit){
    var total = 0
    var min_str = ""
    var max_str = ""
    if(val!=null && val.length>0){
      for(let i=0;i<val.length;i++){
        total +=val[i].count
      }
    }
    if (total < min_number) {
      min_str = total + min_unit;
    }
    if (total == 0) {
      min_str = "";
      max_str = "";
    }
    if (total >= min_number) {
      if (parseInt(total / min_number) != 0) {
        max_str = parseInt(total / min_number) + max_unit;
      }
      if (total % min_number != 0) {
        min_str = (total % min_number) + min_unit;
      }
    }
    return max_str + min_str;  
   },
   toPrint(){
    var patient_name = ""
    for(let i=0;i<this.patientList.length;i++){
       if(this.patient.id == this.patientList[i].id){
        patient_name = this.patientList[i].name
       }
    }
    this.$router.push({path:"/drugs/patient/print?start_time="+this.start_time+"&end_time="+this.end_time+"&page="+this.page+"&limit="+this.limit+"&keyword="+this.keyword+"&patient_id="+this.patient.id+"&patient_name="+patient_name})
   },
   exportList(){
      for(let i=0;i<this.tableList.length;i++){
        this.tableList[i].index = i+1
        this.tableList[i].count_name = this.getCount(this.tableList[i].child,this.tableList[i].min_number,this.tableList[i].max_unit,this.tableList[i].min_unit)
        this.tableList[i].query_date = this.start_time + "~" + this.end_time
        this.tableList[i].specification_name = this.tableList[i].dose +this.tableList[i].dose_unit + "*"+this.tableList[i].min_number+this.tableList[i].min_unit+"/"+this.tableList[i].max_unit
        this.tableList[i].patient_name = ""
        if(this.tableList[i].index == 1){
          this.tableList[i].patient_name = this.getPatientName(this.patient.id)
        }
      
      }
      import('@/vendor/Export2Excel').then(excel => {
       
        const tHeader = ['序号','患者姓名','查询日期','药品名称','生产厂家','规格&单位','数量']
        const filterVal = ['index','patient_name','query_date','drug_name', 'manufacturer','specification_name','count_name']

        const data = this.formatJson(filterVal,this.tableList)

        excel.export_json_to_excel({
          header: tHeader,
          data,
          filename: '患者药品使用查询表'
        })
       })
       },
       formatJson(filterVal, jsonData) {
        return jsonData.map(v => filterVal.map(j => v[j]))
       },
       getPatientName(id){
         var patient_name = ""
        for(let i=0;i<this.patientList.length;i++){
          if(id == this.patientList[i].id){
            patient_name = this.patientList[i].name
          }
        }
        return patient_name
       },
       toClick(val){
       
       var manufacturer_name = ""
       var specification_name = ""
       for(let i=0;i<this.manufacturerList.length;i++){
          if(val.drug.manufacturer == this.manufacturerList[i].id){
            manufacturer_name = this.manufacturerList[i].manufacturer_name
          }
       }
      specification_name = val.drug.specification_name + "/" + val.drug.packing_unit
     
      this.$router.push({path:"/stock/selfwarehouse/selfdrugflow?drug_id="+val.drug_id+"&manufacturer="+manufacturer_name+"&packing_unit="+val.drug.packing_unit+"&overCount="+val.flush_count+"&patient_id="+val.patient_id})
    },
    toClickOne(val){
      var manufacturer_name = ""
       var specification_name = ""
       for(let i=0;i<this.manufacturerList.length;i++){
          if(val.drug.manufacturer == this.manufacturerList[i].id){
            manufacturer_name = this.manufacturerList[i].manufacturer_name
          }
       }
      specification_name = val.drug.specification_name + "/" + val.drug.packing_unit

      this.$router.push({path:"/stock/selfwarehouse/selfdrugbatchnumber?drug_id="+val.drug_id+"&manufacturer="+manufacturer_name+"&packing_unit="+val.drug.packing_unit+"&overCount="+val.flush_count+"&patient_id="+val.patient_id})
    },
      
  },
  created(){
    var nowDate = new Date();
    var nowYear = nowDate.getFullYear();
    var nowMonth = nowDate.getMonth() + 1;
    var nowDay = nowDate.getDate();
    this.end_time =
      nowYear +
      "-" +
      (nowMonth < 10 ? "0" + nowMonth : nowMonth) +
      "-" +
      (nowDay < 10 ? "0" + nowDay : nowDay);
    nowDate.setMonth(nowDate.getMonth() - 1);
    nowYear = nowDate.getFullYear();
    nowMonth = nowDate.getMonth() + 1;
    nowDay = nowDate.getDate();
    this.start_time =
      nowYear +
      "-" +
      (nowMonth < 10 ? "0" + nowMonth : nowMonth) +
      "-" +
      (nowDay < 10 ? "0" + nowDay : nowDay);
   
  },
  
}
</script>


   
<style lang="scss" scoped>
    .zone{
      //  margin-left: 30px;
      //  text-align: left;
       width: 70px;
       display: inline-block;
       color:#606266;
    }
    .disinfect{
      position: relative;
      .newButton{
        // position: absolute;
        // right: 2%;
        // top:4px;
        // z-index: 9;
        margin-bottom: 10px;
    margin-left: 90%;
      }
    }
    .disinfectOne{
      position: relative;
      .newButtonOne{
        position: absolute;
         right: 0;
         top: -10;
         z-index: 18;
      }
    }
    .but{
      width: 200px;
      height: 50px;
      // border: solid 1px red;
      margin-left: 77%;
    }
    .clearn{
      width: 460px;
      height: 50px;
      // border:solid 1px red;
      margin-left:650px;
    }

  .zClass{
    width: 200px;
    height: 200px;
    // border:solid 1px red;
    margin-left: 450px;
    margin-top: 200px;
  }
  .warn{
    color: red;
    font-size: 14px;
    width: 100%;
    display: inline-block;
    margin-left: 96px;
  }

  .userbutton{
       margin-bottom: 10px;
    margin-left: 82%
  }
    /deep/ .el-tabs__content{
    margin-top: 10px;
  }

</style>
<style lang="scss">
   .a{
     margin-bottom: 10px;
      margin-top: 6px;

   }

   .b{
    .el-button{
      margin-left: 90%;
      margin-bottom: 10px;
    }
   }

   .stoppage{
     .el-form-item__label{
       width:190px;
     }
   }
   .st{
     .el-form-item__label{
       width:-10px;
     }
   }
   .main{
     position: relative;
     .newButtonOne{
       position:absolute;
       right: 0;
       z-index: 2;
     }
   }

    .elbutton{
      // border: solid 1px red;
      height: 50px;
      width: 400px;
      margin-left: 650px;
    }
  // .el-form-item__label {
  //   width: 130px;
  //   font-size: 14px;
  // }
  .el-form-item__error {
    margin-left: 130px;
  }

 .el-upload-list__item-name {
    color: #606266;
    display: block;
    margin-right: 40px;
    overflow: hidden;
    padding-left: 4px;
    text-overflow: ellipsis;
    transition: color .3s;
    white-space: nowrap;
}
.el-main{
  padding-top: 0px;
}
.newMain{
  .el-form-item__label{
    width: 104px;
  }
}
.newDisinfectOne{
  .el-input--prefix .el-input__inner{
    padding-left: 15px
  }
}
.stoppage{
  .el-form-item__label{
    width: 18%;
  }
}
.newItem{
  .el-form-item__label{
    width: 130px;
  }
}
.formItem{
  .el-form-item__label{
    width: 104px;
    line-height: 30px;
  }
}
.newname{
  .el-form-item__label{
    width: 60px;
  }
}
::-webkit-scrollbar{
  height: 20px;
}
</style>