elizebeth/src/xt_pages/outpatientTool/components/drugDetail.vue

<template>
    <div>
        <div style="display: flex;justify-content: space-between;margin-bottom:10px;">
            <div>
                <el-input size="small" style="width:150px;" v-model="keywords" 
                          @keyup.enter.native='searchAction'
                          placeholder="请输入药品名称"
                          class="filter-item"/>
                 <el-button size="small" class="filter-item" type="primary" @click="searchAction">搜索</el-button>
                <el-date-picker
                        v-model="chargeDate"
                        type="daterange"
                        value-format="yyyy-MM-dd"
                        range-separator="至"
                        start-placeholder="开始日期"
                        @change="changeDate"
                        end-placeholder="结束日期">
                </el-date-picker>
            </div>
        </div>
        <el-table :data="tableData" border :row-style="{ color: '#303133' }" ref="table"
                  :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
                  max-height="600"
                  highlight-current-row>

            <el-table-column align="center" prop="name" label="序号">
                <template slot-scope="scope">
                    {{scope.$index + 1}}
                </template>
            </el-table-column>
          
            <el-table-column align="center" prop="name" label="日期">
                <template slot-scope="scope">
                    {{getTime(scope.row.advice_date)}}
                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" label="药品类型">
                <template slot-scope="scope">
                    {{getDrugTypeName(scope.row.drug_id)}}
                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" label="药品名称">
                <template slot-scope="scope">
                    {{getDrugName(scope.row.drug_id)}}
                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" label="规格">
                <template slot-scope="scope">
                  {{getSpecialName(scope.row.drug_id)}}   
                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" label="数量">
                <template slot-scope="scope">
                  {{getCount(scope.row.child,scope.row.min_number,scope.row.max_unit,scope.row.min_unit)}}
                </template>
            </el-table-column>

           
            <el-table-column align="center" prop="total" label="操作">
                <template slot-scope="scope">
                  <div style="color: #589ff8" @click="jump(scope.row.child,scope.row.min_number,scope.row.drug_id,scope.row.max_unit,scope.row.min_unit)">使用明细</div>
                </template>
            </el-table-column>

        </el-table>

       
       <el-dialog
        title="药品明细"
        :visible.sync="dialogVisible"
        width="60%">
        <div style="margin-bottom:10px"> <span>药品类型:{{getDrugTypeName(drug_id)}}</span>
              <span>药品名称:{{getDrugName(drug_id)}}</span>
        </div>
        <span>
            <el-table :data="tableList" border :row-style="{ color: '#303133' }" ref="table"
                  :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
                  max-height="600"
                  highlight-current-row>

            <el-table-column align="center" prop="name" label="序号">
                <template slot-scope="scope">
                    {{scope.$index + 1}}
                </template>
            </el-table-column>
          
            <el-table-column align="center" prop="name" label="使用日期">
                <template slot-scope="scope">
                    {{getTime(scope.row.advice_date)}}
                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" label="患者名字">
                <template slot-scope="scope">
                   {{getPatientName(scope.row.patient_id)}}
                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" label="数量">
                <template slot-scope="scope">
                  <span v-if="scope.row.prescribing_number_unit == max_unit">{{scope.row.prescribing_number/min_number}}</span>   
                  <span v-if="scope.row.prescribing_number_unit == min_unit && max_unit!=min_unit">{{scope.row.prescribing_number}}</span>   
                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" label="单位">
                <template slot-scope="scope">
                  {{scope.row.prescribing_number_unit}}   
                </template>
            </el-table-column>
        
        </el-table>
        </span>
        <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
        </span>
     </el-dialog>

    </div>

   
</template>


<script>
  import BreadCrumb from '@/xt_pages/components/bread-crumb'
  import {getDrugDetailSummary} from "@/api/stock"
  import { uParseTime } from '@/utils/tools'
import { min } from 'moment'
  const moment = require('moment')
  export default {
    components: {
      BreadCrumb

    },
    data() {
      return {
        detail_loading: false,
        tempArr: [],
        pos: 0,
        sameRowArr: [],
        keywords: '',
        tableData: [],
        chargeDate: [moment(new Date()).add('year', 0).format('YYYY-MM-DD'), moment(new Date()).add('year', 0).format('YYYY-MM-DD')],
        limit:10,
        page:1,
        total:0,
       drugList:[],
       drugTypeList:[],
       dialogVisible:false,
       tableList:[],
       patients:[],
       min_number:0,
       drug_type:"",
       drug_id:0,
       max_unit:"",
       min_unit:"",
      }
    },
    methods:{
      changeDate(){
        this.tableData = []
        this.getlist()
       },
       getlist(){
        let start_time = this.chargeDate[0]
        let end_time = this.chargeDate[1]
        var params = {
            start_time: start_time,
            end_time: end_time,
            keyword: this.keywords,
            limit:this.limit,
            page:this.page,
        }  
       
        getDrugDetailSummary(params).then(response=>{
          if(response.data.state == 1){
            var list = response.data.data.list
           
            var total = response.data.data.total
            var drug = response.data.data.drug
            this.patients = response.data.data.patients
            for(let i =0;i<list.length;i++){
               
              for(let j=0;j<drug.length;j++){
                if(list[i].drug_id == drug[j].id){
                  if(list[i].child!=null && list[i].child.length > 0){
                    for(let z=0;z<list[i].child.length;z++){
                      if(list[i].child[z].prescribing_number_unit == drug[j].max_unit){
                        list[i].child[z].prescribing_number = parseInt(list[i].child[z].prescribing_number) * drug[j].min_number
                      }
                    }
                  }
                }
              }
            }
            this.drugList = drug
            this.total = total
            this.drugTypeList = response.data.data.drugTypeList
            for(let i=0;i<list.length;i++){
                list[i].min_number = 0
                list[i].max_unit = ""
                list[i].min_unit = ""
             for(let j=0;j<drug.length;j++){
               if(list[i].drug_id == drug[j].id){
                 list[i].min_number = drug[j].min_number
                 list[i].max_unit = drug[j].max_unit
                 list[i].min_unit = drug[j].min_unit
                 this.tableData.push(list[i])
               }
             }
            }
          }
        })  
      },
     getTime(val) {
         if(val < 0){
           return ""
         }
         if(val == ""){
          return ""
         }else {
          return uParseTime(val, '{y}-{m}-{d}')
         }
      },  
     getDrugName(id){
       var drug_name = ""
       for(let i=0;i<this.drugList.length;i++){
        if(id == this.drugList[i].id){
           drug_name = this.drugList[i].drug_name
        }
       } 
       return drug_name 
     },
     getSpecialName(id){
       var specification_name = ""
        for(let i=0;i<this.drugList.length;i++){
        if(id == this.drugList[i].id){
           specification_name = this.drugList[i].dose + this.drugList[i].dose_unit +"*" + this.drugList[i].min_number +this.drugList[i].min_unit +"/" + this.drugList[i].max_unit;
        }
       } 
       return specification_name    
     },
     searchAction(){
       this.tableData = []
       this.getlist()  
     },
     getDrugTypeName(drug_id){
      
       var drug_type = ""
       for(let i=0;i<this.drugList.length;i++){
         if(drug_id == this.drugList[i].id){
            drug_type = this.drugList[i].drug_type
         }
       }
       var type_name = ""
       for(let i=0;i<this.drugTypeList.length;i++ ){
          if(drug_type == this.drugTypeList[i].value){
            type_name = this.drugTypeList[i].name
          }
       }  
       return type_name
     },
     getCount(val,min_number,max_unit,min_unit){
    
       var total = 0
       var min_str = ""
       var max_str = ""
       if(val!=null && val!=undefined  && val.length > 0){
         for(let i=0;i<val.length;i++){
           total += parseInt(val[i].prescribing_number)
         }
       }
        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
       },
       jump(val,min_number,drug_id,max_unit,min_unit){
         console.log("max_unit23232233",max_unit)
         console.log("min_unit23232233",min_unit)
         this.dialogVisible = true
         this.tableList= val
         this.min_number = min_number
         this.max_unit = max_unit
         this.min_unit = min_unit
         this.drug_id = drug_id
       },
       getPatientName(id){
         var name = ""
         for(let i=0;i<this.patients.length;i++){
            if(id == this.patients[i].id){
              name = this.patients[i].name
            }
         }
         return name
       }
     
    },
    created() {
      this.getlist()
    }
  }
</script>