<!--库存查询-->
<!--页面渲染区域-->
<template>
    <div class="vue-element-page-wrap" ref="tableContainer">
       <el-row class="page-search" justify="space-between" align="bottom">
           <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="80px" label-position="left">
               <el-row :gutter="20">
                   <el-col :span="5">
                        <el-form-item label="物料编号" prop="params.MATERIALSPECNAME">
                                   <el-Input v-model="queryParams.params.MATERIALSPECNAME"    clearable />
                         </el-form-item>
                   </el-col>
                    <el-col :span="1"></el-col>
                    <el-col :span="5">
                        <el-form-item label="BOX编号" prop="params.MATERIALPACKINGNAME">
                                   <el-Input v-model="queryParams.params.MATERIALPACKINGNAME"    clearable />
                         </el-form-item>
                   </el-col>
                   <el-col :span="1"></el-col>
                   <el-col :span="5">
                        <el-form-item label="ERP库位" prop="params.ERPLOCATION">
                                   <el-Input v-model="queryParams.params.ERPLOCATION"    clearable />
                         </el-form-item>
                   </el-col>
                   <el-col :span="1"></el-col>
                   <el-col :span="5">
                        <el-form-item label="位置" prop="params.LOCATIONNAME">
                                   <el-Input v-model="queryParams.params.LOCATIONNAME"    clearable />
                         </el-form-item>
                   </el-col>
                   <el-col :span="5">
                        <el-form-item label="批次" prop="params.CHARGE">
                                   <el-Input v-model="queryParams.params.CHARGE"    clearable />
                         </el-form-item>
                   </el-col>
                   <el-col :span="1"></el-col>
                    <el-col :span="5">
                       <el-form-item label="ERP工厂" prop="params.ERPFACTORY">
                            <el-select v-model="queryParams.params.ERPFACTORY" placeholder="Select" style="width: 240px">
                                  <el-option v-for="item in ERPFactoryList" :key="item.ENUMVALUE" :label="item.ENUMVALUE" :value="item.ENUMVALUE" />
                             </el-select>
                       </el-form-item>
                    </el-col>
                    <el-col :span="1"></el-col>
                    <el-col :span="5">
                       <el-form-item label="物料类型" prop="params.MaterialState">
                            <el-select v-model="queryParams.params.MaterialState" placeholder="Select" style="width: 240px">
                                  <el-option v-for="item in MaterialStateSelect" :key="item.Key" :label="item.Value" :value="item.Value" />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    
               </el-row>
           </el-form>
           <div class="page-search-btns">
               <el-button type="primary" @click="handleQuery">搜索</el-button>
           </div>
       </el-row>    
       <!--table 区域-->
       <div class="vue-element-page-table">
        <el-row>
           <div class="page-table-operate">
            <el-col :span="6">
               <div class="page-table-title">
                   <span>库存信息</span>
               </div>
            </el-col>
            <el-col :span="3">
               <div class="page-table-title-input">
                  <span>物料总数量</span>
                  <el-Input v-model="queryParams.params.sum" disabled />
                </div>
            </el-col>
            <el-col :span="1"></el-col>
            <el-col :span="3">
                <div class="page-table-title-input">
                  <span>非限制数量</span>
                  <el-Input v-model="queryParams.params.sumOK" disabled />
                </div>
            </el-col>
            <el-col :span="1"></el-col>
            <el-col :span="3">
                <div class="page-table-title-input">
                  <span>冻结数量</span>
                  <el-Input v-model="queryParams.params.sumNG" disabled />
                </div>
            </el-col>
           </div>
        </el-row>
           <el-table border v-loading="loading" :data="state.InventoryDetailList" highlight-current-row row-key="id" style="width: 100%" height="250px" @row-click="RowActivate">
               <template v-for="(col,index) in Column" :key="index">
                   <el-table-column v-if="!col.hide" :label="col.header" show-overflow-tooltip>
                       <template #default="scope">
                           <span v-if="col.field === 'status'">
                               <span v-if="scope.row[col.field]" class="table-status-active">启用</span>
                               <span v-else class="table-status-inActive">禁用</span>
                           </span>
                           <span v-else>{{ scope.row[col.field] }}</span>
                       </template>
                   </el-table-column>
               </template>
               <template v-slot:empty>
                   <svg-icon icon-class="noData" width="160px" height="160px"/>
               </template>
           </el-table>
           <div>
               <pagination v-if="total>0"  :total="total"  v-model:pageNumTo="queryParams.pageNum" v-model:pageSizeTo="queryParams.pageSize" @pagination="handleQuery" />
           </div>
           <el-row>
           <div class="page-table-operate">
              <el-col span="6">
               <div class="page-table-title">
                   <span>BOX信息</span>
               </div>
              </el-col>
             <el-col span="3">
               <div class="page-table-title-check">
                  <el-checkbox label="全选" name="type" />
                </div>
             </el-col>
           </div>
        </el-row>
           <el-table border v-loading="loading" :data="state.BoxDetailList" highlight-current-row row-key="id" style="width: 100%" height="175px">
               <template v-for="(col,index) in Column1" :key="index">
                   <el-table-column v-if="!col.hide" :label="col.header" show-overflow-tooltip>
                       <template #default="scope">
                           <span v-if="col.field === 'status'">
                               <span v-if="scope.row[col.field]" class="table-status-active">启用</span>
                               <span v-else class="table-status-inActive">禁用</span>
                           </span>
                           <span v-else>{{ scope.row[col.field] }}</span>
                       </template>
                   </el-table-column>
               </template>
               <template v-slot:empty>
                   <svg-icon icon-class="noData" width="160px" height="160px"/>
               </template>
           </el-table>
           <div>
               <pagination v-if="total1>0"  :total1="total1"  v-model:pageNumTo="queryParams.pageNum" v-model:pageSizeTo="queryParams.pageSize" @pagination="handleQuery" />
           </div>
        </div>
    </div>
</template>
<script lang="ts">
export default {
  name: 'newInventoryView'
};
</script>
<!--script区域-->
<script lang="ts" setup>
                                   /*引入区域*/
import { reactive, ref, onMounted, toRefs, getCurrentInstance, nextTick } from "vue";
import { ElForm, ElMessageBox, ElTable } from "element-plus";
import { getQueryList,getQueryPageList } from "@/api/common";   
import { msToDate } from '@/utils/CommonUtil';                                
                                   /*对象生成赋值区域*/

const queryFormRef = ref(ElForm);
const size = ref<'default' | 'large' | 'small'>('small');//formdata时间设置
const state = reactive({
    queryParams:{
      queryId: "GetNewInventoryView",
     version: "",
     params: {
        SITENAME: localStorage.getItem("siteName"),
        LOCATIONNAME: "",
        ERPLOCATION: "",
        MATERIALPACKINGNAME: "",
        ERPFACTORY: "",
        CHARGE:'',
        MATERIALSPECNAME:'',
        MaterialState:'材料',
        sum:0,
        sumOK:0,
        sumNG:0
        },
     pageNum: 1,
     pageSize: 10
    },
    queryParamsERPFactory:{
     queryId: "GetErpFactoryList",
     version: "WEB00001",
     params: {
        SITENAME: localStorage.getItem("siteName"),
        },
     pageNum: 1,
     pageSize: 10
    },
    queryParamsAdvance:{
        queryId: "GetEMaterialpackingList",
        version: "00002",
        params: {
            SITENAME: localStorage.getItem("siteName"),       
            ERPLOCATION: "",
            ERPFACTORY:'',
            MATERIALSPECNAME:'',
            LOCATIONNAME:'',
            CHARGE:'',
            SUPPLIERNAME:'',
            RECEIVEACTNO:''
            },
     pageNum: 1,
     pageSize: 10
    },
    queryParamsActivate:{
        queryId: "GetEMaterialpackingList",
        version: "00002",
        params: {
            SITENAME: localStorage.getItem("siteName"),       
            MATERIALSPECNAME: "",
            ERPLOCATION:'',
            LOCATIONNAME:'',
            SUPPLIERNAME:'',
            MATERIALQUANTITY:'',
            PACKINGGRADE:'',
            CHARGE:'',
            RECEIVEACTNO:'',
            ERPFACTORY:'',
            OQARESULTSTATE:'',
            },
     pageNum: 1,
     pageSize: 10
    },
    operateParams:{
        date: new Date(),
    },
    MaterialStateSelect:[
        {
            Key:'材料',
            Value:'材料'
        },{
            Key:'备件',
            Value:'备件'
        },{
            Key:'Panel',
            Value:'Panel'
        }
    ],
    Column:[] as any,
    Column1:[] as any,
    total: 0,
    total1: 1,
    loading:false,
    BoxDetailList:[] as any,
    ERPFactoryList:[] as any,
    ERPLocationList:[] as any,
    MaterialDetailList:[] as any,
    ProcessGroupNameList:[] as any,
    ProcessStateList:[] as any,
    InventoryDetailList:[] as any

  });   
  const {
    queryParams,
    Column,
    Column1,
    total,
    total1,
    loading,
    BoxDetailList,
    operateParams,
    MaterialDetailList,
    ERPFactoryList,
    ERPLocationList,
    ProcessStateList,
    ProcessGroupNameList,
    MaterialStateSelect,
    InventoryDetailList
  } = toRefs(state);

                                 /*钩子函数区域*/
                                 onMounted(() => {
   state.Column = [
     { header: "ERP工厂", field: "ERPFACTORY", hide: false },
     { header: "ERP位置", field: "ERPLOCATION", hide: false },
     { header: "位置", field: "LOCATIONNAME", hide: false },
     { header: "物料编号", field: "MATERIALSPECNAME", hide: false },
     { header: "批次", field: "CHARGE", hide: false },
     { header: "供应商名称", field: "SUPPLIERNAME", hide: false },
     { header: "供应商编号", field: "SUPPLIERNO", hide: false },
     { header: "物料描述", field: "DESCRIPTION", hide: false },
     { header: "物料类别", field: "MATERIALSPECTYPE", hide: false },
     { header: "非限制数量", field: "PASSQTY", hide: false },
     { header: "质险中数量", field: "UNINSPECTQTY", hide: false },
     { header: "冻结数量", field: "DEFECTTIVEQTY", hide: false },
     { header: "Hold数量", field: "HOLDINGQTY", hide: false },
     { header: "物料总数量", field: "MATERIALQUANTITY", hide: false },
     { header: "单位", field: "MATERIALUNIT", hide: false },
   ];
   state.Column1 = [
     { header: "BOXID", field: "MATERIALPACKINGNAME", hide: false },
     { header: "物料凭证号", field: "UNDOID", hide: false },
     { header: "Stock状态", field: "STOCKSTATE", hide: false },
     { header: "品质状态", field: "PACKINGGRADE", hide: false },
     { header: "物料总数量", field: "MATERIALQUANTITY", hide: false },
     { header: "生产日期", field: "MAKEDATE", hide: false },
     { header: "过期时间", field: "EXPIRATIONDAY", hide: false },
     { header: "质检批", field: "MATERIALPROCESSGROUPNAME", hide: false },
     { header: "ETCstate", field: "ETCSTATE", hide: false },
     { header: "最后的操作名称", field: "LASTEVENTNAME", hide: false },
     { header: "最后的操作员", field: "LASTEVENTUSER", hide: false },
     { header: "最后的操作时间", field: "LASTEVENTTIME", hide: false },
     
     
   ];
   ERPFactoryQuery();
   
   
 });
                                   /*其它函数区域*/
function handleQuery()
{
  if(state.queryParams.params.MaterialState=='材料')
    {
       if(state.queryParams.params.MATERIALSPECNAME.indexOf(',')==-1)
       {
          state.queryParams.version='000011';
          state.queryParams.params.MATERIALSPECNAME=state.queryParams.params.MATERIALSPECNAME+'%';
       }else{
        state.queryParams.version='000012';
       }
    }else if(state.queryParams.params.MaterialState=='备件'){
        if(state.queryParams.params.MATERIALSPECNAME.indexOf(',')==-1)
       {
          state.queryParams.version='000021';
       }else{
        state.queryParams.version='000022';
       }
    }else{
        if(state.queryParams.params.MATERIALSPECNAME.indexOf(',')==-1)
       {
          state.queryParams.version='00021';
       }else{
        state.queryParams.version='00022';
       }
    }
    getQueryList(state.queryParams)
      .then((res:any)=>{

         if(res.data.length>0)
         {
           state.queryParams.params.sum=0;
           state.queryParams.params.sumNG=0;
           state.queryParams.params.sumOK=0;
           for(let i=0;i<res.data.length;i++)
           {
            state.queryParams.params.sum += res.data[i].MATERIALQUANTITY;
            state.queryParams.params.sumNG +=(res.data[i].DEFECTTIVEQTY==""?0:res.data[i].DEFECTTIVEQTY);
            state.queryParams.params.sumOK +=(res.data[i].PASSQTY!=""?res.data[i].PASSQTY:0);  
           }
          
         }
      })
      .catch(() => {});
      getQueryPageList(state.queryParams)
      .then((res:any)=>{
        state.InventoryDetailList = res.data.list;
        state.total = res.data.total;
      })
      .catch(() => {});
      
}

//ERP工厂查询
function ERPFactoryQuery()
{
    getQueryList(state.queryParamsERPFactory)
      .then((res:any)=>{
        state.ERPFactoryList = res.data;
        state.ERPFactoryList.unshift({
            ENUMVALUE:''
          });
      })
      .catch(() => {});
}
//点击触发
function RowActivate(row:any, event:any, column:any)
{
  state.queryParamsActivate.params.CHARGE=row.CHARGE;
  state.queryParamsActivate.params.ERPLOCATION=row.ERPLOCATION;
  state.queryParamsActivate.params.LOCATIONNAME=row.LOCATIONNAME;
  state.queryParamsActivate.params.SUPPLIERNAME=row.SUPPLIERNAME;
  state.queryParamsActivate.params.MATERIALSPECNAME=row.MATERIALSPECNAME;
  //state.queryParamsActivate.params.RECEIVEACTNO=row.RECEIVEACTNO;
  state.queryParamsActivate.params.ERPFACTORY=row.ERPFACTORY;
  state.queryParamsActivate.params.OQARESULTSTATE=row.OQARESULTSTATE;
 console.log(state.queryParamsActivate);
  getQueryPageList(state.queryParamsActivate)
      .then((res:any)=>{     
             state.BoxDetailList=res.data.list;  
             state.total1=res.data.total;
      })
      .catch(() => {});
}
</script>
<!--style 区域-->
<style>

</style>