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

<template>
    <div class="main-contain">
        <div class="position">
            <bread-crumb :crumbs="crumbs"></bread-crumb>
            <div>
                <el-button
                    size="small"
                    :loading="downloadLoading"
                    @click="exportList"
                    class="filter-item"
                    type="primary"
                    >导出
                </el-button>
                <el-button
                    size="small"
                    @click="toPrint"
                    class="filter-item"
                    type="primary"
                    >打印
                </el-button>
            </div>
        </div>
        <div class="app-container">
            <div class="cell clearfix">
                <el-date-picker
                v-model="start_time"
                prefix-icon="el-icon-date"
                :editable="false"
                style="width: 196px;margin-right:10px;"
                type="date"
                placeholder="选择日期时间"
                align="right"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                @change="changeStartime"
                ></el-date-picker>
                <el-date-picker
                v-model="end_time"
                prefix-icon="el-icon-date"
                :editable="false"
                style="width: 196px;margin-right:10px;"
                type="date"
                placeholder="选择日期时间"
                align="right"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                @change="changeEndtime"
                ></el-date-picker>
                <el-select v-model="drug_name" placeholder="药品名称" style="margin-right:10px;"
                 @change="changeDrugName">
                    <el-option
                    v-for="item in drugName"
                    :key="item.id"
                    :label="item.drug_name"
                    :value="item.id">
                    </el-option>
                </el-select>
                <el-select v-model="drug_spec" placeholder="规格名称"
                @change="changeRullName">
                    <el-option
                    v-for="item in rulleName"
                    :key="item.id"
                    :label="item.drug_spec"
                    :value="item.id">
                    </el-option>
                </el-select>
                <el-input style="width: 180px;margin:0 10px;" @keyup.enter.native='searchAction' v-model.trim="search_input" class="filter-item"/>
                <el-button class="filter-item" type="primary" icon="el-icon-search" @click="searchAction">搜索</el-button>
            </div>
            <el-table :data="tableData" border style="width: 100%;" height="500" :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}" highlight-current-row>
                <el-table-column align="center" label="序号" width="60">
                    <template slot-scope="scope">{{ scope.$index +1 }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="透析号" width="80">
                    <template slot-scope="scope">{{ scope.row.dialysis_no }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="姓名" width="80">
                    <template slot-scope="scope">{{ scope.row.name }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="药品名称">
                    <template slot-scope="scope">{{ scope.row.drug_name }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="规格名称">
                    <template slot-scope="scope">{{ scope.row.drug_spec }}</template>
                </el-table-column>
                <!-- <el-table-column align="center" prop="name" label="单位" width="80">
                    <template slot-scope="scope">{{ scope.row.min_unit }}</template>
                </el-table-column> -->
                <el-table-column align="center" prop="name" label="自备量" width="80">
                    <template slot-scope="scope">{{ scope.row.Total?scope.row.Total:0 }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="已使用" width="80">
                    <template slot-scope="scope">{{ scope.row.Count }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="剩余" width="80">
                    <template slot-scope="scope">{{ (scope.row.Total?scope.row.Total:0) - scope.row.Count }}</template>
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
import BreadCrumb from "../../components/bread-crumb";
import { parseTime } from '@/utils'
import { getAllMedicalList,getRulleName,getAllPatientStockList } from "@/api/drug/drug"
const moment = require('moment')
export default {
    components:{
        BreadCrumb
    },
    data(){
        return{
            crumbs: [
                { path: false, name: "库存管理" },
                { path: false, name: "自备药管理" },
                { path: false, name: "自备药查询" },
            ],
            tableData: [],
            downloadLoading: false,
            search_input:"",
            options:[],
            value:"",
            start_time:moment(new Date()).add('year',0).format("YYYY-MM-DD"),
            end_time:moment(new Date()).add('year',0).format("YYYY-MM-DD"),
            // start_time:"",
            // end_time:"",
            drug_name:"",
            drug_spec:"",
            drugName:[],
            rulleName:[]
        }
    },
    methods:{
        toPrint(){
          this.$router.push({path: '/stock/selfPreparedMedicineQueryPrint?start_time='+this.start_time+"&end_time="+this.end_time+"&drug_name="+this.drug_name+"&drug_spec="+this.drug_spec+"&keyword="+this.search_input})
        },
        exportList(){
         import('@/vendor/Export2Excel').then(excel => {
         const tHeader = ['序号', '透析号', '姓名','药品名称','规格名称','自备量','已使用','剩余']
         const filterVal = ['index', 'dialysis_no', 'name','drug_name','drug_spec','Total','Count','margin']
         for(let i=0;i<this.tableData.length;i++){
            this.tableData[i].margin = (this.tableData[i].Total?this.tableData[i].Total:0) - this.tableData[i].Count
         }

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

         excel.export_json_to_excel({
           header: tHeader,
           data,
           filename: '自备药查询'
         })
          this.downloadLoading = false
        })
       },
       formatJson(filterVal, jsonData) {
        return jsonData.map(v => filterVal.map(j => v[j]));
      },

      changeStartime(){
        this.getlist()
      },
      changeEndtime(){
        this.getlist()
      },

      getAllMedicalList(){
        getAllMedicalList().then(response=>{
          if(response.data.state == 1){
             var drugName =  response.data.data.drugName
             var obj = {
               id:0,
               drug_name:"全部"
             }
             var arr = []
             arr.push(obj)
             arr.push(...drugName)
             console.log("arrr",arr)
             this.drugName = arr

             this.getlist()
          }
        })
      },
      getRulleName(id){
          const params = {
             id:id
          }
        getRulleName(params).then(response=>{
           if(response.data.state == 1){
             var rulleName = response.data.data.rullerList
             var obj = {
               id:0,
               drug_spec:"全部"
             }
             var arr = []
             arr.push(obj)
             arr.push(...rulleName)
             console.log("rulleName",arr)
             this.rulleName = arr
           }
        })
      },
      searchAction(){
        this.getlist()
      },
      changeDrugName(id){
        if(id == 0){
          this.drug_name = 0
        }
        if(id != 0 ){
          var drug_name = ""
          for(let i=0;i<this.drugName.length;i++){
            if(id == this.drugName[i].id){
              drug_name = this.drugName[i].drug_name
            }
          }
          this.drug_name = drug_name
          this.getRulleName(id)
        }
        this.getlist()
      },
      changeRullName(id){
        var drug_spec = ""
        for(let i=0;i<this.rulleName.length;i++){
           if(id == this.rulleName[i].id){
              drug_spec = this.rulleName[i].drug_spec
            }
        }

        this.drug_spec = drug_spec
        this.getlist()
      },
      getlist(){
         var name = ""
          if(this.drug_name == 0){
             name = ""
          }
          if(this.drug_name != 0){
             name = this.drug_name
          }
          if(this.drug_spec == "全部"){
            this.drug_spec = ""
          }
          const params = {
            start_time:this.start_time,
            end_time:this.end_time,
            drug_name:name,
            drug_spec:this.drug_spec,
            search_input:this.search_input
          }
         console.log("params9999999",params)
        getAllPatientStockList(params).then(response=>{
            if(response.data.state == 1){
              var stocklist = response.data.data.stocklist

              for(let i=0;i<stocklist.length;i++){
                 stocklist[i].index = i+1
                 stocklist[i].Count = 0
              }
              var outStockList =  response.data.data.outStockList

              // for(let i=0;i<stocklist.length;i++){
              //   for(let j=0;j<outStockList.length;j++){
              //      if(stocklist[i].patient_id == outStockList[j].patient_id &&stocklist[i].drug_name == outStockList[j].drug_name && stocklist[i].drug_spec == outStockList[j].drug_spec){
              //          stocklist[i].Count = outStockList[j].Count
              //      }
              //   }
              // }

             for(let i=0;i<outStockList.length;i++){
                 for(let j=0;j<stocklist.length;j++){
                     if(outStockList[i].patient_id == stocklist[j].patient_id &&outStockList[i].drug_name == stocklist[j].drug_name && outStockList[i].drug_spec == stocklist[j].drug_spec){
                       if(!stocklist[j].Total){
                          outStockList[i].Total = 0
                       }
                      outStockList[i].Total = stocklist[j].Total
                   }
                 }
              }

              console.log("outStockList",outStockList)
              this.tableData = outStockList
            }
        })
      }
    },
    created(){
      //获取所有药品名称
      this.getAllMedicalList()




    }
}
</script>