<style scoped>
    .outboundD  .xiangq{
    padding: 15px 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
.outboundD .topkuang{
    padding: 5px 10px;
    border:1px solid #e2e2e2;
    background: #e2e2e2;
    border-radius: 15px;
    margin-right: 25px;
}
.outboundD .el-table th.is-leaf{
    text-align: left !important;
}
</style>

<template>
    <div class="outboundD">
        <div v-if="OtherType==15" class="xiangq">
            <div>
                <el-tag style="margin-right: 10px;">{{$t('objFill.v101.FinancialModule.cankumc')}}：{{dataList2.WareHouseName}}</el-tag>
                <el-tag style="margin-right: 10px;">{{$t('pub.pubRemark')}}:{{dataList2.Remark}}</el-tag>
                <!-- <span class="topkuang">{{$t('objFill.v101.FinancialModule.cankumc')}}：{{dataList2.WareHouseName}}</span>
                <span class="topkuang">{{$t('pub.pubRemark')}}:{{dataList2.Remark}}</span> -->
            </div>
        </div>
        <div v-if="OtherType==16" class="xiangq">
            <div>
                <el-tag style="margin-right: 10px;">{{$t('objFill.v101.FinancialModule.chukuzt')}}：{{dataList.StockOutStateStr}}</el-tag>
                <el-tag style="margin-right: 10px;">{{$t('objFill.v101.FinancialModule.chukudbm')}}：{{dataList.StockOutNum}}</el-tag>
                <el-tag style="margin-right: 10px;">{{$t('objFill.v101.FinancialModule.chukusj')}}：{{dataList.UpdateDate}}</el-tag>
                <el-tag style="margin-right: 10px;">{{$t('objFill.v101.FinancialModule.cankumc')}}：{{dataList.WareHouseName}}</el-tag>
                <el-tag style="margin-right: 10px;">{{$t('objFill.v101.FinancialModule.linqur')}}：{{dataList.EmName}}</el-tag>
                <el-tag style="margin-right: 10px;">{{$t('objFill.v101.FinancialModule.caozuorsj')}}：{{dataList.UpdateBy}}/{{dataList.StockOutDate}}</el-tag>



            </div>
        </div>
        <el-table v-if="OtherType==15"
            :data="dataList2.DetailList"
            border
            header-align='left'
            style="width: 100%">
            <el-table-column
                prop="Id"
                label="ID"
                width="80">
            </el-table-column>
            <el-table-column
                prop="ImageList"
                :label="$t('objFill.v101.FinancialModule.fengmt')"
                width="90">
                <template slot-scope="scope">
                    <img :src=" scope.row.MaterialModel.ImageList[0]" alt="" style="width: 60px; height: 60px;">
                </template>
            </el-table-column>
            <el-table-column
                prop="Name"
                :label="$t('MarketingActi.commName')"
                >
                <template slot-scope="scope">
                    <span>{{scope.row.MaterialModel.Name}}</span>

                </template>
            </el-table-column>
             <el-table-column
                prop="Name"
                :label="$t('objFill.v101.FinancialModule.guge')"
                width="300"
                >
               <template  slot-scope="scope">
                      <span v-for="(x,y) in scope.row.MaterialModel.GoodsSpecificationList" :key="y">{{x}} <span v-if="scope.row.MaterialModel.GoodsSpecificationList.length !== y+1"> , </span></span>
                </template>
            </el-table-column>
              <el-table-column
                prop="Number"
                :label="$t('objFill.v101.FinancialModule.caigousl')"
                width="150">
            </el-table-column>
              <el-table-column
                prop="Id"
                :label="$t('objFill.v101.FinancialModule.yirusl')"
                width="150">
                <template slot-scope="scope">
                    <span>{{scope.row.StockInNum!=null?scope.row.StockInNum:0}}</span>
                </template>
            </el-table-column>

        </el-table>


        <el-table v-if="OtherType==16"
            :data="dataList.DetailList"
             header-align="left"
            border
            style="width: 100%">
            <el-table-column

                prop="SuppliesName"
                :label="$t('objFill.v101.FinancialModule.haocaimc')"
                 width="700"
                >
            </el-table-column>
            <el-table-column
                prop="SuppliesNum"
                :label="$t('objFill.v101.FinancialModule.haocaibm')"
                >
            </el-table-column>
            <el-table-column
                prop="CategoryName"
                :label="$t('ground.fenleimc')"
                >
            </el-table-column>
            <el-table-column
                prop="WareHouseName"
                :label="$t('salesModule.BrandName')"
                >
                <template  slot-scope="scope">
                      <span v-for="(x,y) in scope.row.GoodsCategoryList" :key="y">{{x}} <span v-if="scope.row.GoodsCategoryList.length !== y+1"> , </span></span>
                </template>
            </el-table-column>
            <el-table-column
                prop="InventoryNum"
                :label="$t('hotel.hotel_Inventory')"
               >
            </el-table-column>
            <el-table-column
                prop="Number"
                :label="$t('restaurant.res_Number')"
               >
            </el-table-column>




        </el-table>
    </div>
</template>
<script>

export default {
    data(){
        return{
            msg:{
            pageIndex:1,
            pageSize:10,
            StockOutNum:'',
            SuppliesNum:'',
            SuppliesName:'',
            SupplierName:'',
            StartTime:'',
            EndTime:'',
            WarehouseId:'',
            EmployeeId:'',
             Id:0,
             RB_Group_id:''
          },
          msg2:{
              ProcurementId:0,
              RB_Group_id:''
          },
          dataList:{},//出库
          dataList2:{},//采购
        OtherType:0,
        }
    },

    created(){

        this.OtherType = this.$route.query.OtherType
        let RB_Group_id = this.getLocalStorage().RB_Group_id;

        if(this.OtherType ==15){//采购单
            this.msg2.ProcurementId = this.$route.query.ID;
            this.msg2.RB_Group_id = RB_Group_id;
            this.getList2()
        }else if(this.OtherType == 16){//出库单
            this.msg.Id = this.$route.query.ID;
            this.msg.RB_Group_id = RB_Group_id;
            this.getList()
        }


    },
    methods:{
        getList(){
             this.apiJavaPostZc("/api/Warehouse/GetStockOutPageList",this.msg,
                res => {
                if (res.data.resultCode === 1) {
                    this.dataList = res.data.data.pageData[0]
                } else {
                    this.Error(res.data.message);
                }
                },
                null
            );
        },
        getList2(){
             this.apiJavaPostZc("/api/Warehouse/GetProcurementInfo",this.msg2,
                res => {
                if (res.data.resultCode === 1) {
                     this.dataList2 = res.data.data
                } else {
                    this.Error(res.data.message);
                }
                },
                null
            );
        }

    },mounted(){

    }
}
</script>