<template>
    <div class="main-contain">
      <div class="position">
        <bread-crumb :crumbs="crumbs"></bread-crumb>
      </div>
      <div class="app-container ">
        <div class="cell clearfix">
         药品名称:<span>{{getName(this.$route.query.drug_id)}}</span>&nbsp;
         <!-- 库存: {{this.$route.query.over_plus}} -->
         规格:<span>{{drug.dose}}{{drug.dose_unit}}*{{drug.min_number}}{{drug.min_unit}}/{{drug.max_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>
  
          <span>出入库方式:</span>
          <el-select v-model="stock_type" style="width:160px;margin-right:10px;" placeholder="请选择" @change="changeDrug">
              <el-option
                v-for="(item,index) in stockType"
                :key="index"
                :label="item.name"
                :value="item.id">
              </el-option>
          </el-select>
          
          <!-- <span>
            <el-button type="primary" size="small" @click="toExprot">导出</el-button>
  
            <el-button type="primary" size="small" @click="toTongBu">同步</el-button>
          </span> -->
          
        </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">
               <span v-if="scope.row.consumable_type == 1">手动入库</span>
               <span v-if="scope.row.consumable_type == 2">手动出库</span>
               <span v-if="scope.row.consumable_type == 3">自动出库</span>
               <span v-if="scope.row.consumable_type == 4">手动退库</span>
               <span v-if="scope.row.consumable_type == 7">自动退库</span>
               <span v-if="scope.row.consumable_type == 5">报损数量</span>
               <span v-if="scope.row.consumable_type == 10">盘盈</span>
               <span v-if="scope.row.consumable_type == 11">盘亏</span>
               <span v-if="scope.row.consumable_type == 12">调拨出库</span>
               <span v-if="scope.row.consumable_type == 13">调拨入库</span>
               <span v-if="scope.row.consumable_type == 15">结算出库</span>
             </template>
          </el-table-column>
          <el-table-column prop="drug_name" label="入库单据编码" align="center">
             <template slot-scope="scope">
               <span v-if="scope.row.consumable_type == 1">{{scope.row.warehousing_order}}</span>
                <span v-if="scope.row.consumable_type == 2 || scope.row.consumable_type == 3 || scope.row.consumable_type == 12 || scope.row.consumable_type == 15">{{scope.row.warehouse_out_order_number}}</span>
                <span v-if="scope.row.consumable_type == 4 || scope.row.consumable_type == 7">{{scope.row.cancel_order_number}}</span>
                <span v-if="scope.row.consumable_type == 5">{{scope.row.warehouse_out_order_number}}</span>
                <span v-if="scope.row.consumable_type == 10 || scope.row.consumable_type == 11 || scope.row.consumable_type == 13">{{scope.row.warehousing_order}}</span>
             </template>
          </el-table-column>
          <el-table-column prop="drug_name" label="入库日期" align="center">
             <template slot-scope="scope">
               {{getTime(scope.row.ctime,"{y}-{h}-{d}")}}
             </template>
          </el-table-column>
          <el-table-column prop="drug_name" label="操作日期" align="center">
             <template slot-scope="scope">
               {{getTime(scope.row.operate_time,"{y}-{h}-{d}")}}
             </template>
          </el-table-column>
        
          <el-table-column prop="drug_name" label="入库数量&单位" align="center">
             <template slot-scope="scope">
                <span v-if="scope.row.consumable_type != 2 &&  scope.row.consumable_type != 3 && scope.row.consumable_type != 5 && scope.row.consumable_type != 7">{{scope.row.count}}{{scope.row.max_unit}}</span>
                <span v-if="(scope.row.consumable_type == 2 || scope.row.consumable_type == 3 || scope.row.consumable_type == 5 || scope.row.consumable_type == 7) && parseInt(scope.row.count/scope.row.BaseDrugLib.min_number) >0">{{parseInt(scope.row.count/scope.row.BaseDrugLib.min_number)}}{{scope.row.BaseDrugLib.max_unit}}</span>
                <span v-if="(scope.row.consumable_type == 2 || scope.row.consumable_type == 3 || scope.row.consumable_type == 5 || scope.row.consumable_type == 7) && scope.row.count%scope.row.BaseDrugLib.min_number >0">{{scope.row.count%scope.row.BaseDrugLib.min_number}}{{scope.row.BaseDrugLib.min_unit}}</span>
             </template>
          </el-table-column>
  
       
        
           <el-table-column prop="drug_name" label="有效期" align="center">
             <template slot-scope="scope">
                {{getTime(scope.row.expire_date,"{y}-{h}-{d}")}}
              
             </template>
          </el-table-column>
         
   
          <el-table-column prop="drug_name" label="剩余库存" align="center">
             <template slot-scope="scope">
           
                 {{ scope.row.over_count }} {{ drug.min_unit }}
             </template>
          </el-table-column>
          <el-table-column prop="remark" label="备注" align="center">
             <template slot-scope="scope">
               <span > {{scope.row.remark}}</span>
             </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 { getSelfDrugBatchNumberList }  from '@/api/drug/drug'
  export default {
    components: {
      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,
        stock_type:0,
        drugCategory:[
          {id:0,name:"全部"}
        ],
        drugTypeList:[],
        tableList:[],
        manufacturerList:[],
        list:[],
        stockType:[
          {id:0,name:"全部"},
          {id:1,name:"手动入库"},
          {id:2,name:"手动出库"},
          {id:3,name:"自动出库"},
          {id:4,name:"手动退库"},
          {id:10,name:"盘盈"},
          {id:11,name:"盘亏"},
          {id:12,name:"调拨出库"},
          {id:13,name:"调拨入库"},
          {id:15,name:"结算出库"}
        ],
        outList:[],
        countList:[],
        outCountList:[],
        autoCountList:[],
        drugOutList:[],
        total:0,
        houseList:[],
        patientList:[],
        drug:{},
        patients:[]
      }
    },
    created(){
      this.getlist()
    },
    methods:{
      startTimeChange: function(val) {
      this.tableList = []
      var time = this.getTimestamp(val) - this.getTimestamp(this.end_time);
      
      if (time > 0) {
        this.$message.error("开始时间不能大于结束时间");
        this.start_time = "";
      } else {
         
         this.getlist()
     
      }
    },
    endTimeChange: function(val) {
      this.tableList = []
      var time = this.getTimestamp(val) - this.getTimestamp(this.start_time);
      if (time < 0) {
        this.$message.error("结束时间不能小于开始时间");
        this.end_time = "";
      } else {
        this.getlist()
      }
     },
     changeDrug(val){
       this.tableList= []
       this.stock_type = val
       this.getlist()
      },
      handleSizeChange(val) {
        this.limit = val
        this.getlist()
      },
      handleCurrentChange(val) {
        this.page = val
        this.getlist()
      },
      getlist(){
        var params = {
             drug_id:this.$route.query.drug_id,
             start_time:this.start_time,
             end_time:this.end_time,
             page:this.page,
             limit:this.limit,
             patient_id:this.$route.query.patient_id,
         }
        getSelfDrugBatchNumberList(params).then(response=>{
           if(response.data.state ==1){
              var list = response.data.data.list
              this.tableList =list
              var total =  response.data.data.total
              this.total = total
              this.drug =response.data.data.drug
            
           }
        })
      },
      getName(drug_id){
        var name = ""
        if(drug_id == this.drug.id){
           name = this.drug.drug_name
        }
        return name
     },
     getTime(val) {
      if(val < 0){
          return ""
      }
      if(val == ""){
        return ""
      }else {
        return uParseTime(val, '{y}-{m}-{d}')
      }
     },
    
    }
  }
</script>