Vue_New/src/xt_pages/stock/drugs/drugBatchNumber.vue

<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs="crumbs"></bread-crumb>
    </div>
    <div class="app-container ">
      <div class="cell clearfix">
       药品名称:<span>{{this.$route.query.drug_name}}</span>&nbsp;
       库存:{{getCountTwo(this.$route.query.drug_id,this.$route.query.min_number,this.$route.query.max_unit,this.$route.query.min_unit)}}&nbsp;
       规格:<span>{{this.$route.query.unit}}</span>&nbsp;
       厂家:<span>{{this.$route.query.manufacturer}}</span>&nbsp;
      </div>
      <div class="cell clearfix">
        <span>日期查询:</span>
        <el-date-picker
            size="small"
            v-model="start_time"
            prefix-icon="el-icon-date"
            :editable="false"
            style="width: 196px;"
            type="date"
            placeholder="选择日期时间"
            align="right"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            @change="startTimeChange"
           ></el-date-picker>-
            <el-date-picker
              size="small"
              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="endTimeChange"
          ></el-date-picker>
      </div>
      
       <el-table
        :data="tableList"
        border
        style="width: 100%">
        <el-table-column prop="date" label="序号" width="180" align="center">
           <template  slot-scope="scope">
              {{scope.$index + 1}}
           </template>
        </el-table-column>
        <el-table-column prop="drug_type" label="入库单据编码" width="180" align="center">
           <template slot-scope="scope">
              {{scope.row.warehousing_order}}
           </template>
        </el-table-column>
        <el-table-column prop="drug_name" label="操作日期" align="center">
           <template slot-scope="scope">
              {{getTime(scope.row.ctime)}}
           </template>
        </el-table-column>
        <el-table-column prop="drug_name" label="有效期" align="center">
           <template slot-scope="scope">
              {{getTime(scope.row.expiry_date,"{y}-{m}-{d}")}}
           </template>
        </el-table-column>
         <el-table-column prop="drug_name" label="批号" align="center">
           <template slot-scope="scope">
              {{scope.row.number}}
           </template>
        </el-table-column>
         <el-table-column prop="drug_name" label="入库数量" align="center">
           <template slot-scope="scope">
              {{scope.row.stock_max_number}}{{scope.row.max_unit}}{{scope.row.stock_min_number}}{{scope.row.min_unit}}
           </template>
        </el-table-column>
        <el-table-column prop="drug_name" label="进货单价" align="center">
           <template slot-scope="scope">
              {{scope.row.price}}
           </template>
        </el-table-column>
       </el-table>
       
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 50, 100,500,1000]"
        :page-size="10"
        background
        align="right"
        style="margin-top:20px;"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div>

    <setting-dialog
      ref="dialog"
    ></setting-dialog>

  </div>
</template>

<script>
  import { uParseTime } from '@/utils/tools'
  import BreadCrumb from '@/xt_pages/components/bread-crumb'
  import { getBatchOrderDetail,getDrugCountList } from '@/api/drug/drug_stock'
  import SettingDialog from './settingDialog/index'
  import { getDictionaryDataConfig } from "@/utils/data";
  export default {
    name: 'stockIn',
    created() {
      var drugCategory = getDictionaryDataConfig('system','drug_category')
      this.drugCategory.push(...drugCategory)
      this.drugTypeList = getDictionaryDataConfig('system','drug_type') 
      this.getlist()
      this.getDrugCountList()
    },
    components: {
      SettingDialog,
      BreadCrumb
    },
    data() {
      return {
        crumbs: [
          { path: false, name: '库存管理' },
          { path: '/stock/drugs/stock/query', name: '药品库存查询' },
          { path:'/drugstock/in/drugstockflow',name:'库存流水'}
        ],
        keywords: '',
        total: 0,
        multipleSelection: [],
        signAndWeighBoxPatients: 'sign-and-weigh-box-patients',
        start_time: '',
        end_time: '',
        page: 1,
        limit: 10,
        goodType: [],
        goodInfo: [],
        tempArr: [],
        sameRowArr: [],
        WarehouseInfo: {
          loading: false,
          warehouseInfoDate: []
        },
        tableData:[],
        drug_category:0,
        drugCategory:[
          {id:0,name:"全部"}
        ],
        drugTypeList:[],
        tableList:[],
        manufacturerList:[],
        countList:[],
        outCountList:[],
        autoCountList:[],
        minCount:[],
        drugOutList:[],
      }
    },
    methods:{
      getlist(){
         var params = {
           drug_id:this.$route.query.drug_id,
           page:this.page,
           limit:this.limit,
         }
        getBatchOrderDetail(params).then(response=>{
           if(response.data.state == 1){
              var detail =  response.data.data.detail
              console.log("detail2343434",detail)
              this.tableList = detail
              var total = response.data.data.total
              console.log("total",total)
              this.total = total
           }
        })
      },
      getTime(val) {
       if(val < 0){
           return ""
       }
       if(val == ""){
          return ""
        }else {
          return uParseTime(val, '{y}-{m}-{d}')
        }
     },
   handleSizeChange(val) {
      this.limit = val;
      this.getlist();
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getlist();
    },
    startTimeChange(val){
      this.start_time = val
      this.getlist()
    },
    endTimeChange(val){
      this.end_time = val
      this.getlist()
    },
     getDrugCountList(){
         var params = {
          keyword: this.keywords,
          start_time:this.start_time,
          end_time:this.end_time,
         }
      getDrugCountList(params).then(response=>{
          if(response.data.state == 1){
            var countlist =  response.data.data.countList
            console.log("入库数据",countlist)
            this.countList = countlist
            var outcountlist = response.data.data.outCountList
            console.log("出库数据",outcountlist)
            this.outCountList = outcountlist
            var aucountlist = response.data.data.auCountList
            console.log("自动数据",aucountlist)
            this.autoCountList = aucountlist
             var minCount = response.data.data.minCount
            console.log("minCount",minCount)
            this.minCount = minCount
            var info = response.data.data.info
            for(let i=0;i<info.length;i++){
              if(info[i].count_unit == info[i].max_unit){
                 info[i].count = info[i].count * info[i].min_number
              }
            }
            console.log("info2222222",info)
            this.drugOutList = info
          }
        })
      },
      getInCount(id){
        var count = ""
        for(let i=0;i<this.countList.length;i++){
           if(id == this.countList[i].drug_id){
             count = this.countList[i].count
           }
        }
        return count
      },

      getOutCount(id){
        var count = ""
        for(let i=0;i<this.outCountList.length;i++){
           if(id == this.outCountList[i].drug_id){
               count = this.outCountList[i].count
           }
        }
        return count
      },
      getAutoCount(id){
        var count= ""
        for(let i=0;i<this.autoCountList.length;i++){
          if(id == this.autoCountList[i].drug_id){
            count = this.autoCountList[i].count
          }
        }
        return count
      },
         getMinCount(id){
        var count=""
        for(let i=0;i<this.minCount.length;i++){
          if(id == this.minCount[i].drug_id){
            count = this.minCount[i].count
          }
        }
        return count
      },
      getCount(drug_id,min_number,max_unit,min_unit){
        var count= 0
        var str = ""
        var min_str = ""
        for(let i=0;i<this.drugOutList.length;i++){
          if(drug_id == this.drugOutList[i].drug_id){
             count += parseInt(this.drugOutList[i].count)
          }
        }
        if(parseInt(count/min_number)!=0){
          str = parseInt(count/min_number)+ max_unit
        }
        if((count%min_number)!=0){
          min_str =  count%min_number + min_unit
        }
        return str + min_str
      },

      getCountOne(drug_id){
        var count= 0
        for(let i=0;i<this.drugOutList.length;i++){
          if(drug_id == this.drugOutList[i].drug_id){
             count += parseInt(this.drugOutList[i].count)
          }
        }
        return count
      },
     getCountTwo(drug_id,min_number,max_unit,min_unit){
       var total_count = 0
       var out_count = 0
       var count = 0
       var str = ""
       var str_min = ""
       total_count = this.getInCount(drug_id) * min_number
       out_count = this.getCountOne(drug_id)
       count = total_count-out_count
       if(parseInt(count/min_number)!=0){
         str = parseInt(count/min_number) + max_unit
       }
       if((count%min_number)!=0){
         str_min = count%min_number + min_unit
       }
       return str+str_min
     }
    }
  }
</script>

<style rel="stylesheet/css" lang="scss" scoped>
  .information {
    border: 1px #dcdfe6 solid;
    padding: 30px 20px 30px 20px;

  .border {
    border-bottom: 1px #dcdfe6 solid;
    margin: 0px 0 20px 0;
  }

  }

  .title {
    background: #409eff;
    height: 44px;
    line-height: 44px;
    padding: 0 0 0 10px;
    color: #fff;
    margin: 0 0 10px 0;
  }

  .edit_separater {
    border-top: 1px solid rgb(233, 233, 233);
    margin-top: 15px;
    margin-bottom: 15px;
  }
</style>

<style>
  .sign-and-weigh-box .sign-and-weigh-box-patients .cell {
    font-size: 12px;
  }

  .sign-and-weigh-box .sign-and-weigh-box-patients .current-row > td {
    background: #6fb5fa;
  }

  .count {
    color: #bd2c00;
  }

  .el-table td,
  .el-table th.is-leaf,
  .el-table--border,
  .el-table--group {
    border-color: #d0d3da;
  }

  .el-table--border::after,
  .el-table--group::after,
  .el-table::before {
    background-color: #d0d3da;
  }
</style>