elizebeth/src/xt_pages/stock/inventoryDetails.vue

<template>
    <div>
        <div style="display: flex;align-items: center;justify-content: space-between;margin-bottom:10px;">
            <div>
             <label class="title"><span class="name">仓库</span> :</label>
              <el-select size="small" v-model="storehouse_id" filterable placeholder="请选择仓库" style="width:200px" @change="changeHouseList">
                  <el-option
                    v-for="(option, index) in houseList"
                    :key="index"
                    :label="option.storehouse_name"
                    :value="option.id">
                  </el-option>
               </el-select>  
                <el-input
                size="small"
                style="width: 200px;margin-left:10px;"
                class="filter-item"
                v-model.trim="searchKey"
                placeholder="请输入耗材名称"
                />
                <el-button
                size="small"
                class="filter-item"
                type="primary"
                icon="el-icon-search"
                @click="search">搜索</el-button>
            </div>
            <div>
              <el-button type="primary" @click="toprint">打印</el-button>
              <el-button type="primary" @click="inventoryExportList">盘点模版打印</el-button>
            </div>
            <!-- <div>
                <el-button size="small" type="primary" @click="print">打印</el-button>
                <el-button size="small" type="primary" @click="exportList">导出</el-button>
            </div> -->
        </div>
        <el-table :data="tableData" border :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)' }" @selection-change="changePrice" >
            <el-table-column type="selection" width="55" align="center"> </el-table-column>
            <el-table-column prop="date" label="耗材名称" align="center">
                <template slot-scope="scope">
                  {{scope.row.good_name}}
                </template>
            </el-table-column>
            <el-table-column prop="name" label="规格" width="200" align="center">
               <template slot-scope="scope">
                  {{scope.row.specification_name}}
                </template>
            </el-table-column>

            <el-table-column  prop="name" label="有效日期" width="200" align="center">
               <template slot-scope="scope">
                 {{getTime(scope.row.expire_date)}}
               </template>
            </el-table-column>

           <el-table-column  prop="name" label="仓库名称" width="200" align="center">
               <template slot-scope="scope">
                 {{getStorehouseName(scope.row.storehouse_id)}}
               </template>
            </el-table-column>
           
            <el-table-column prop="name" label="盘点前数量" width="100" align="center">
              <template slot-scope="scope">
                 <span>{{scope.row.stock_count?scope.row.stock_count:0}}</span>
                </template>
            </el-table-column>
            <el-table-column prop="name" label="盘点后数量" width="100" align="center">
              <template slot-scope="scope">
                <span>{{scope.row.last_stock_count?scope.row.last_stock_count:0}}</span> 
             </template>
            </el-table-column>
           
            <el-table-column prop="name" label="盘盈类型"  width="100" align="center">
                <template slot-scope="scope">
                   <span v-if="scope.row.stock_count > scope.row.last_stock_count">盘亏</span>
                   <span v-if="scope.row.stock_count < scope.row.last_stock_count">盘盈</span>
                </template>
            </el-table-column>
           
            <el-table-column prop="name" label="盘点原因" width="230" align="center">
              <template slot-scope="scope">
                <span v-if="scope.row.inventory_type ==6">默认</span>
                <span v-if="scope.row.inventory_type ==1">到期退货</span>
                <span v-if="scope.row.inventory_type ==2">异常退货</span>
                <span v-if="scope.row.inventory_type ==3">退货</span>
                <span v-if="scope.row.inventory_type ==4">损坏</span>
                <span v-if="scope.row.inventory_type ==5">不计入报损分析</span>
                <span v-if="scope.row.inventory_type ==7">有效期到期</span>
               </template>
            </el-table-column>
          
        </el-table>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :page-sizes="[10, 20, 40, 100]"
            :page-size="10"
            background
            style="margin-top:20px;text-align: right"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
        >
        </el-pagination>
    </div>
</template>

<script>
import { uParseTime } from '@/utils/tools'
import { getInventoryDetailList } from "@/api/stock"

export default {
    name: "inventory",
    data() {
        return{
            searchKey:'',
            value1:'',
            value2:'',
            tableData: [],
            dialogVisible:false,
            form: {
                name: '',
            },
            total: 0,
            limit:10,
            page:1,
            ids:"",
            damageList:[],
            storehouse_id:0,
            houseList:[],
         }
    },
    methods:{
        toprint(){
          this.$router.push({path:'/stock/print_all?storehouse_id='+this.storehouse_id+"&good_name="+this.searchKey+"&limit="+this.limit+"&page="+this.page+"&ids="+this.ids})
        },

        search(){
         this.getlist()
        },
        print(){
           if(this.ids == ""){
             this.$message.error("请勾选打印数据")
             return false
           }
          this.$router.push({path:'/stock/inventoryDetailPrint?ids='+this.ids})
        },
        handleSizeChange(val){
          this.limit = val
          this.getlist()
        },
        handleCurrentChange(val){
          this.page = val
          this.getlist()
        },
        getlist(){
         var params = {
            keyword:this.searchKey,
            limit:this.limit,
            page:this.page,
            storehouse_id:this.storehouse_id,
          }
          this.tableData = []
          getInventoryDetailList(params).then(response=>{
             if(response.data.state == 1){
               var list =  response.data.data.list
               console.log("盘点列表23223232323",list)
             
               this.tableData = list
               this.total = response.data.data.total
               var obj = {id:0,storehouse_name:"全部"}
               this.houseList = []
               this.houseList.push(obj)
               for(let i=0;i<response.data.data.houseList.length;i++){
                 this.houseList.push(response.data.data.houseList[i])
               }
              
             }
          })
        },
      changePrice(val){  
       
        var arr = []
        for(let i=0;i<val.length;i++){
            arr.push(val[i].id)
        }
        var str = arr.join(",")
        
        console.log("str",str)
        this.ids = str  
     },
      exportList(){
       
         import('@/vendor/Export2Excel').then(excel => {
         const tHeader = ['耗材名称', '规格', '单位','零售价','当前库存','盘点数','亏损金额']
         const filterVal = ['good_name', 'specification_name', 'warehousing_unit','packing_price','total','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]));
      },

      getTime(val) {
         if(val < 0){
            return ""
          }
         if(val == ""){
            return ""
          }else {
            return uParseTime(val, '{y}-{m}-{d}')
         }
       },
      inventoryExportList(){
        this.$router.push({path:'/stock/inventoryPrint'})
      },
      getStorehouseName(id){
        var storehouse_name = ""
        for(let i=0;i<this.houseList.length;i++){
          if(id == this.houseList[i].id){
            storehouse_name = this.houseList[i].storehouse_name
          }
        }
        if(storehouse_name == "全部"){
          return ""
        }else{
          return storehouse_name
        }
      },
      changeHouseList(){
        this.houseList = []
        this.getlist()
      }
    },
    created(){
      this.getlist()
    },
};
</script>