前端页面

liuying

2024-11-25 84138b3f42b218ecc2efaa54ec31a1c1be29e326

 LA24030_LuLiPackageLine_Web/src/views/main/WmsOrder/wmsOrderAsn/index.vue

@@ -1,242 +1,274 @@
<template>
  <div class="wmsOrderAsn-container">
    <el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
      <el-form :model="queryParams" ref="queryForm" labelWidth="90">
        <el-row>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
            <el-form-item label="关键字">
              <el-input v-model="queryParams.searchKey" clearable="" placeholder="ASN单号" />
   <div class="wmsOrderPurchase-container">
      <el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
         <el-form :model="queryParams" ref="queryForm" labelWidth="90">
            <el-row>
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" class="mb10">
                  <el-form-item label="关键字">
                     <el-input v-model="queryParams.searchKey" clearable="" placeholder="PO单号,供应商编号,供应商名称,ERP单号,项目号" />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
                  <el-form-item label="PO单号">
                     <el-input v-model="queryParams.purchaseNo" clearable="" placeholder="请输入PO单号" />
                  </el-form-item>
               </el-col>

            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="ASN单号">
              <el-input v-model="queryParams.asnNo" clearable="" placeholder="请输入ASN单号" />
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
                  <el-form-item label="业务类型">
                     <el-select clearable="" v-model="queryParams.businessType" placeholder="请选择业务类型">
                        <el-option v-for="(item, index) in getBusinessTypeData_Index" :key="index" :value="item.businessTypeValue" :label="`[${item.businessTypeValue}] ${item.businessTypeName}`" />
                     </el-select>
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
                  <el-form-item label="单据来源">
                     <el-select clearable="" v-model="queryParams.orderSocure" placeholder="请选择单据来源">
                        <el-option v-for="(item, index) in getEnumOrderSocureData_Index" :key="index" :value="item.describe" :label="`${item.describe}`" />
                     </el-select>
                  </el-form-item>
               </el-col>

            </el-form-item>
          </el-col>
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="单据类型">
              <el-select clearable="" v-model="queryParams.asnType" placeholder="请选择单据类型">
                <el-option v-for="(item,index) in getEnumAsnTypeData_Index" :key="index" :value="item.value" :label="`${item.describe}`" />
              </el-select>
            </el-form-item>
          </el-col> -->
 
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="业务类型">
              <el-select clearable="" v-model="queryParams.businessType" placeholder="请选择业务类型">
                <el-option v-for="(item, index) in getBusinessTypeData_Index" :key="index" :value="item.businessTypeValue"
                  :label="`[${item.businessTypeValue}] ${item.businessTypeName}`" />

              </el-select>

            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="单据状态">
              <el-select clearable="" v-model="queryParams.asnStatus" placeholder="请选择单据状态">
                <el-option v-for="(item, index) in getEnumAsnStatusData_Index" :key="index" :value="item.value"
                  :label="`${item.describe}`" />

              </el-select>

            </el-form-item>
          </el-col>
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
                  <el-form-item label="单据状态">
                     <el-select clearable="" v-model="queryParams.poStatus" placeholder="请选择单据状态">
                        <el-option v-for="(item, index) in getEnumPoStatusData_Index" :key="index" :value="item.value" :label="`${item.describe}`" />
                     </el-select>
                  </el-form-item>
               </el-col>
               <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="单据状态名称">
              <el-input v-model="queryParams.asnStatusName" clearable="" placeholder="请输入单据状态名称"/>
              <el-input v-model="queryParams.poStatusName" clearable="" placeholder="请输入单据状态名称"/>
              
            </el-form-item>
          </el-col> -->
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="物流单号">
              <el-input v-model="queryParams.trackingNumber" clearable="" placeholder="请输入物流单号" />
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
                  <!-- <el-form-item label="供应商编号">
              <el-input v-model="queryParams.supplierCode" clearable="" placeholder="请输入供应商编号" />
            </el-form-item> -->

                  <el-form-item label="供应商" prop="supplierCode">
                     <el-select
                        v-model="queryParams.supplierCode"
                        filterable
                        remote
                        reserve-keyword
                        remote-show-suffix
                        :remote-method="remoteMethod"
                        :loading="loading"
                        placeholder="请选择供应商"
                        clearable
                        style="width: 100%"
                        @change="changeXmbh(queryParams.supplierCode)"
                     >
                        <el-option v-for="(item, index) in arrTdp" :key="index" :value="item.custCode" :label="`[${item.custCode}]${item.custChinaName}`"></el-option>
                     </el-select>
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
                  <el-form-item label="供应商名称">
                     <el-input v-model="queryParams.supplierName" clearable="" placeholder="请输入供应商名称" />
                  </el-form-item>
               </el-col>
               <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="收货道口"> -->
               <!-- <el-input v-model="queryParams.dock" clearable="" placeholder="请输入收货道口" /> -->
               <!--     <el-select clearable v-model="queryParams.dock" placeholder="请选择收货道口">
              <el-option
                v-for="(item, index) in getEnumDockData"
                :key="index"
                :value="item.value"
                :label="`${item.describe}`"
              ></el-option>
            </el-select> -->
               <!--   </el-form-item>
          </el-col> -->
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
                  <el-form-item label="ERP单号">
                     <el-input v-model="queryParams.erpOrderNo" clearable="" placeholder="请输入ERP单号" />
                  </el-form-item>
               </el-col>
               <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="项目ID">
              <el-input v-model="queryParams.projectId" clearable="" placeholder="请输入项目ID"/>
              
            </el-form-item>
          </el-col> -->
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="释放状态">
              <el-input-number v-model="queryParams.releaseStatus"  clearable="" placeholder="请输入释放状态"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="释放状态名称">
              <el-input v-model="queryParams.releaseStatusName" clearable="" placeholder="请输入释放状态名称"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="是否冻结">
              <el-select clearable="" v-model="queryParams.isFreeze" placeholder="请选择是否冻结">
                <el-option v-for="(item,index) in getEnumIsFreezeData_Index" :key="index" :value="item.value" :label="`${item.describe}`" />
                
              </el-select>
               <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
                  <el-form-item label="项目号">
                     <el-input v-model="queryParams.projectNo" clearable="" placeholder="请输入项目号" />
                  </el-form-item>
               </el-col>
               <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="项目名称">
              <el-input v-model="queryParams.projectName" clearable="" placeholder="请输入项目名称"/>
              
            </el-form-item>
          </el-col> -->

          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
            <el-form-item label="预计到达日期">
              <el-date-picker placeholder="请选择预计到达日期" value-format="YYYY/MM/DD" type="daterange" v-model="queryParams.estimatedDateRange" />
              
            </el-form-item>
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" class="mb10">
            <el-form-item>
              <el-button-group style="display: flex; align-items: center;">
                <el-button type="primary" icon="ele-Search" @click="handleQuery" v-auth="'wmsOrderAsn:page'"> 查询
                </el-button>
                <el-button icon="ele-Refresh" @click="() => queryParams = {}"> 重置 </el-button>
                <el-button icon="ele-ZoomIn" @click="changeAdvanceQueryUI" v-if="!showAdvanceQueryUI"
                  style="margin-left:5px;"> 高级查询 </el-button>
                <el-button icon="ele-ZoomOut" @click="changeAdvanceQueryUI" v-if="showAdvanceQueryUI"
                  style="margin-left:5px;"> 隐藏 </el-button>
                <!-- <el-button type="primary" style="margin-left:5px;" icon="ele-Plus" @click="openAddWmsOrderAsn" v-auth="'wmsOrderAsn:add'"> 新增 </el-button> -->
                <el-button type="primary" style="margin-left:5px;" icon="ele-Plus" @click="showProp(1)"
                  v-auth="'wmsOrderPurchase:add'"> 新增 </el-button>
                  <el-button type="primary" style="margin-left:5px;" icon="ele-Upload" @click="openImportExcelWmsOrderDeliver"> 导入 </el-button>
                  <el-button type="primary" style="margin-left:5px;" icon="ele-Download" @click="handExport"> 导出</el-button>
              </el-button-group>
            </el-form-item>
               <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" class="mb10">
                  <el-form-item>
                     <el-button-group style="display: flex; align-items: center">
                        <el-button type="primary" icon="ele-Search" @click="handleQuery"> 查询 </el-button>
                        <el-button icon="ele-Refresh" @click="() => (queryParams = {})"> 重置 </el-button>
                        <el-button icon="ele-ZoomIn" @click="changeAdvanceQueryUI" v-if="!showAdvanceQueryUI" style="margin-left: 5px"> 高级查询 </el-button>
                        <el-button icon="ele-ZoomOut" @click="changeAdvanceQueryUI" v-if="showAdvanceQueryUI" style="margin-left: 5px"> 隐藏 </el-button>
                        <!-- <el-button type="primary" style="margin-left:5px;" icon="ele-Plus" @click="openAddWmsOrderPurchase" v-auth="'wmsOrderPurchase:add'"> 新增 </el-button> -->
                        <!-- 新增PO单-ly -->
                        <!-- <el-button type="primary" style="margin-left:5px;" icon="ele-Plus" @click="showProp(1)"> 新增 </el-button> -->
                        <!-- <el-button type="primary" style="margin-left:5px;" icon="ele-Upload" @click="openImportExcelWmsOrderDeliver"> 导入 </el-button> -->
                        <!-- <el-button type="primary" style="margin-left:5px;" icon="ele-Download" @click="handExport"> 导出 </el-button> -->
                     </el-button-group>
                  </el-form-item>
               </el-col>
            </el-row>
         </el-form>
      </el-card>
      <el-card class="full-table" shadow="hover" style="margin-top: 5px">
         <div class="table-container">
            <!-- 左侧表格 -->
            <div class="left-table">
               <p class="text-xtiny">齐套列表</p>

          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card class="full-table" shadow="hover" style="margin-top: 5px">
      <el-table :data="tableData" style="width: 100%" v-loading="loading" tooltip-effect="light" row-key="id"
        @sort-change="sortChange" ref="tableRef" :summary-method="getExportTitle" show-summary border="">
               <el-table
                  :data="tableData"
                  style="width: 100%"
                  v-loading="loading"
                  tooltip-effect="light"
                  ref="tableRef"
                  row-key="id"
                  @sort-change="sortChange"
                  :summary-method="getExportTitle"
                  border=""
               >
                  <el-table-column type="index" label="序号" width="55" align="center" />
                  <!-- <el-table-column prop="packageCode" label="包装号" show-overflow-tooltip="" /> -->
                  <el-table-column label="包装号" prop="packageCode" width="150" align="left" show-overflow-tooltip>
                     <template #default="scope">
                        <span class="under_line" @click="openDrawer(1, scope.row)">
                           {{ scope.row.packageCode }}
                        </span>
                     </template>
                  </el-table-column>

        <el-table-column type="index" label="序号" width="55" align="center" />
        <!-- <el-table-column prop="purchaseNo" label="PO单号"  show-overflow-tooltip="" /> -->
                  <el-table-column prop="placeCode" label="库位编码" show-overflow-tooltip="" />
                  <el-table-column prop="inTime" label="进入时间" width="80" :formatter="formatDate_T_Date" show-overflow-tooltip="" />
                  <el-table-column prop="upi" label="部件条码" show-overflow-tooltip="" />
                  <el-table-column prop="detailName" label="部件名称" show-overflow-tooltip="" />
                  <el-table-column prop="planNo" label="批次" show-overflow-tooltip="" />
                  <el-table-column prop="orderId" label="订单号" show-overflow-tooltip="" />
                  <el-table-column prop="length" label="长" show-overflow-tooltip="" />
                  <el-table-column prop="width" label="宽" show-overflow-tooltip="" />
                  <el-table-column prop="thk" label="厚" show-overflow-tooltip="" />
               </el-table>
            </div>

        <el-table-column label="ASN单号" prop="asnNo" width="160px" align="left" show-overflow-tooltip>
          <template #default="scope">
            <span class="under_line" @click="openDrawer(1, scope.row)">
              {{ scope.row.asnNo }}
            </span>
          </template>
        </el-table-column>
            <!-- 右侧表格 -->
            <div class="right-table">
               <p class="text-xtiny">不齐套列表</p>
               <el-table
                  :data="newTableData"
                  style="width: 100%"
                  v-loading="loading"
                  tooltip-effect="light"
                  ref="newTableRef"
                  row-key="newId"
                  @sort-change="newSortChange"
                  :summary-method="getNewExportTitle"
                  border=""
               >
                  <el-table-column type="index" label="序号" width="55" align="center" />
                  <!-- <el-table-column prop="packageCode" label="包装号" show-overflow-tooltip="" /> -->
                  <el-table-column label="包装号" prop="packageCode" width="150" align="left" show-overflow-tooltip>
                     <template #default="scope">
                        <span class="under_line" @click="openDrawer(1, scope.row)">
                           {{ scope.row.packageCode }}
                        </span>
                     </template>
                  </el-table-column>
                  <el-table-column prop="placeCode" label="库位编码" show-overflow-tooltip="" />
                  <el-table-column prop="inTime" label="进入时间" width="80" :formatter="formatDate_T_Date" show-overflow-tooltip="" />
                  <el-table-column prop="upi" label="部件条码" show-overflow-tooltip="" />
                  <el-table-column prop="detailName" label="部件名称" show-overflow-tooltip="" />
                  <el-table-column prop="planNo" label="批次" show-overflow-tooltip="" />
                  <el-table-column prop="orderId" label="订单号" show-overflow-tooltip="" />
                  <el-table-column prop="length" label="长" show-overflow-tooltip="" />
                  <el-table-column prop="width" label="宽" show-overflow-tooltip="" />
                  <el-table-column prop="thk" label="厚" show-overflow-tooltip="" />
               </el-table>
            </div>
         </div>
      </el-card>

        <!-- 
          <el-table-column prop="asnType" min-width="100px" label="单据类型"  show-overflow-tooltip="" >
            <template #default="scope">
              {{ getEnumDesc(scope.row.asnType, getEnumAsnTypeData_Index)}}
            </template>
          </el-table-column> -->
          <el-table-column prop="businessTypeName" label="业务类型" show-overflow-tooltip="" min-width="90px">
          <template #default="scope">
            {{ scope.row.businessTypeName }}
          </template>
        </el-table-column>
        <el-table-column prop="asnStatus" label="单据状态" show-overflow-tooltip="">
          <template #default="scope">
            <el-tag :type="getTypeStatus(1, getEnumDesc(scope.row.asnStatus, getEnumAsnStatusData_Index))">
              {{ getEnumDesc(scope.row.asnStatus, getEnumAsnStatusData_Index) }}
            </el-tag>
          </template>
        </el-table-column>

        <!-- <el-table-column prop="quantity" label="数量" show-overflow-tooltip="" />
        <el-table-column prop="goodsQuantity" label="已收数量" show-overflow-tooltip="" /> -->

        <el-table-column prop="createTime" label="创建时间" width="130" :formatter="formatDate_T_Time"
          show-overflow-tooltip="" />
        <el-table-column prop="updateTime" label="修改时间" width="130" :formatter="formatDate_T_Time"
          show-overflow-tooltip="" />
        <el-table-column prop="createUserName" label="创建人" show-overflow-tooltip="" />
        <el-table-column prop="updateUserName" label="修改人" show-overflow-tooltip="" />
        <el-table-column label="操作" width="280" align="center" fixed="right" show-overflow-tooltip=""
          v-if="auth('wmsOrderAsn:update') || auth('wmsOrderAsn:delete')">
          <template #default="scope">
            <!-- <el-button icon="ele-Edit" size="small" text="" type="primary" @click="openEditWmsOrderAsn(scope.row)" v-auth="'wmsOrderAsn:update'"> 编辑 </el-button> -->

            <el-button icon="ele-Edit" size="small" text="" type="primary" @click="showProp(scope.row)"
              v-auth="'wmsOrderPurchase:update'" :disabled="scope.row.asnStatus!=0"> 编辑 </el-button>
            <el-button icon="ele-Delete" size="small" text="" type="primary" @click="delWmsOrderAsn(scope.row)"
              v-auth="'wmsOrderAsn:delete'" :disabled="scope.row.asnStatus!=0"> 取消 </el-button>


              <el-button icon="ele-Close" size="small" text="" type="primary" v-auth="'wmsOrderDeliver:delete'"
              @click="tocloseWmsOrderAsn(scope.row)" :disabled="!(scope.row.asnStatus == 0 || scope.row.asnStatus == 1)"> 关闭</el-button>

              <el-button icon="ele-Printer" size="small" text="" type="primary" @click="showProp(3,scope.row)"
              v-auth="'wmsOrderAsn:update'" :disabled="scope.row.asnStatus!=0"> 打印 </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination v-model:currentPage="tableParams.page" v-model:page-size="tableParams.pageSize"
        :total="tableParams.total" :page-sizes="[10, 20, 50, 100, 200, 500]" small="" background=""
        @size-change="handleSizeChange" @current-change="handleCurrentChange"
        layout="total, sizes, prev, pager, next, jumper" />
      <printDialog ref="printDialogRef" :title="printWmsOrderAsnTitle" @reloadTable="handleQuery" />
      <editDialog ref="editDialogRef" :title="editWmsOrderAsnTitle" @reloadTable="handleQuery" />
    </el-card>

    <editDialogWmsOrderDeliver ref="editDialogRefWmsOrderDeliver" :title="editWmsOrderDeliverTitle"
        @reloadTable="handleQuery" />
      <importExcelDialog ref="importExcelDialogRefWmsOrderDeliver" :title="importExcelTitleWmsOrderDeliver"
        @parentUploadFun="handleImportExcelWmsOrderDeliver" @parentDownFun="handleDownExcelWmsOrderDeliver" />

    <!-- 所有弹框 ：新增 编辑 详情 -->
    <open-allprop titleAuthor="1" hexiao="0" ref="propALlProp" @getTabelData="handleQuery"></open-allprop>
  </div>
      <editDialogWmsOrderDeliver ref="editDialogRefWmsOrderDeliver" :title="editWmsOrderDeliverTitle" @reloadTable="handleQuery" />
      <importExcelDialog
         ref="importExcelDialogRefWmsOrderDeliver"
         :title="importExcelTitleWmsOrderDeliver"
         @parentUploadFun="handleImportExcelWmsOrderDeliver"
         @parentDownFun="handleDownExcelWmsOrderDeliver"
      />
      <!-- 所有弹框 ：新增 编辑 详情 -->
      <open-allprop titleAuthor="1" hexiao="0" ref="propALlProp" @getTabelData="handleQuery"></open-allprop>
   </div>
</template>

<script lang="ts" setup="" name="wmsOrderAsn">
import { getCurrentInstance, nextTick, onMounted, ref } from "vue";
import { ElMessageBox, ElMessage } from "element-plus";
<script lang="ts" setup="" name="wmsOrderPurchase">
import { getCurrentInstance, nextTick, onMounted, ref } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
import { auth } from '/@/utils/authFunction';
import { getDictDataItem as di, getDictDataList as dl } from '/@/utils/dict-utils';
import { formatDate, formatDate_T_Date, formatDate_T_Time, defaultTimeRange } from '/@/utils/formatTime';
import printDialog from '/@/views/system/print/component/hiprint/preview.vue'
import editDialog from '/@/views/main/WmsOrder/wmsOrderAsn/component/editDialog.vue'
import { pageWmsOrderAsn, deleteWmsOrderAsn, importExcelWmsOrderAsn, downloadExcelTemplateWmsOrderAsn, downloadExcelTemplateWmsOrderAsnAll, closeWmsOrderAsn } from '/@/api/main/WmsOrder/wmsOrderAsn';
import { pageBaseCustomer } from '/@/api/main/WmsBase/baseCustomer';
import { formatUtcToData, getTypeStatus } from '/@/utils/formate';
import printDialog from '/@/views/system/print/component/hiprint/preview.vue';
import editDialog from '/@/views/main/WmsOrder/wmsOrderPurchase/component/editDialog.vue';
import {
   pageWmsOrderPurchase,
   deleteWmsOrderPurchase,
   importExcelWmsOrderPurchase,
   downloadExcelTemplateWmsOrderPurchase,
   downloadExcelTemplateWmsOrderPurchaseAll,
} from '/@/api/main/WmsOrder/wmsOrderPurchase';
import { handleSlectDataWmsBusinessType } from '/@/utils/selectData';
import { getAPI } from '/@/utils/axios-utils';
import { SysEnumApi } from '/@/api-services/api';
import commonFunction from '/@/utils/commonFunction';
import importExcelDialog from '/@/components/importExcel/index.vue' //引入导入组件
import { handleSlectDataWmsBusinessType } from "/@/utils/selectData";
import {
formatUtcToData,
  getTypeStatus
} from "/@/utils/formate";

import OpenAllprop from "./component/openAllpropAsn.vue";
import { ExcellTableDataExport } from "/@/hooks/exportTableDataExcell";
import importExcelDialog from '/@/components/importExcel/index.vue'; //引入导入组件
import { exportPageExcel } from '/@/utils/exportPageExcel'; //引入导出方法
import OpenAllprop from './component/openAllprop.vue';
import { ExcellTableDataExport } from '/@/hooks/exportTableDataExcell';
const { proxy }: any = getCurrentInstance(); // 访问实例上下文 proxy同时支持开发 线上环境
const  moveType=10;//移动类型 入库
const moveType = 10; //移动类型 入库
// ------------封装导出功能--前端导出+表格标题---------------
const jsonExcellTableExport = {
  titleName: "", //导出表格名称
  interfaceListName: '',//导出接口名称
}
const { getExportTitle, handleExportExcell, formExport, entozhExcell } = ExcellTableDataExport(jsonExcellTableExport)
   titleName: '', //导出表格名称
   interfaceListName: '', //导出接口名称
};
const { getExportTitle, handleExportExcell, formExport, entozhExcell } = ExcellTableDataExport(jsonExcellTableExport);
// --------------end 封装导出功能--前端导出+表格标题-----------------
// ---------------新增-----------------------
const showProp = (item?: any,itemAll?:any) => {
  if (item == 1) { //新增
    proxy.$refs['propALlProp'].openDialog(1);
  } else if(item == 3){ //打印
    proxy.$refs['propALlProp'].openDialog(3, itemAll);
  } else{ //编辑
    proxy.$refs['propALlProp'].openDialog(2, item);
  }
}
const showProp = (item?: any) => {
   if (item == 1) {
      proxy.$refs['propALlProp'].openDialog(1);
   } else {
      proxy.$refs['propALlProp'].openDialog(2, item);
   }
};
// ---------------详情-----------------------
const openDrawer = (type: number, item?: any) => {
  proxy.$refs['propALlProp'].openDrawer(type, item, entozhExcell);
}
   proxy.$refs['propALlProp'].openDrawer(type, item, entozhExcell);
};
// ---------------end详情-----------------------
const getBusinessTypeData_Index = ref<any>([]);//业务类型 create by liuwq
const getEnumAsnTypeData_Index = ref<any>([]);
const getEnumAsnStatusData_Index = ref<any>([]);
const getEnumIsFreezeData_Index = ref<any>([]);


const getBusinessTypeData_Index = ref<any>([]); //业务类型 create by liuwq
const getEnumOrderTypeData_Index = ref<any>([]);
// const getEnumBusinessTypeData_Index = ref<any>([]); //update by liuwq
const getEnumPoStatusData_Index = ref<any>([]);

const { getEnumDesc } = commonFunction();

const getEnumOrderSocureData_Index = ref<any>([]);

const showAdvanceQueryUI = ref(false);
const printDialogRef = ref();
const editDialogRef = ref();
@@ -244,183 +276,242 @@
const tableData = ref<any>([]);
const queryParams = ref<any>({});
const tableParams = ref({
  page: 1,
  pageSize: 10,
  total: 0,
   page: 1,
   pageSize: 10,
   total: 0,
});

const printWmsOrderAsnTitle = ref("");
const editWmsOrderAsnTitle = ref("");
const printWmsOrderPurchaseTitle = ref('');
const editWmsOrderPurchaseTitle = ref('');

// 改变高级查询的控件显示状态
const changeAdvanceQueryUI = () => {
  showAdvanceQueryUI.value = !showAdvanceQueryUI.value;
}
   showAdvanceQueryUI.value = !showAdvanceQueryUI.value;
};

const newTableData = ref([]);

const fetchNewTableData = async () => {
   loading.value = true;
   try {
      const response = await fetch('your-api-endpoint'); // 替换为您的API地址
      const data = await response.json();
      newTableData.value = data;
   } catch (error) {
      console.error('获取新表数据错误:', error);
   } finally {
      loading.value = false;
   }
};

const newSortChange = ({ prop, order }) => {
   console.log(`排序字段: ${prop}, 排序顺序: ${order}`);
   // 处理排序逻辑
};

const openNewDrawer = (type, row) => {
   console.log('打开新的抽屉，类型:', type, ', 数据:', row);
};

const getNewExportTitle = () => {
   return '新表格导出标题';
};

// 查询操作
const handleQuery = async () => {
  loading.value = true;
  debugger
  var res = await pageWmsOrderAsn(Object.assign(queryParams.value, tableParams.value));
  tableData.value = res.data.result?.items ?? [];
  tableParams.value.total = res.data.result?.total;
  loading.value = false;
 
   loading.value = true;
   var res = await pageWmsOrderPurchase(Object.assign(queryParams.value, tableParams.value));
   tableData.value = res.data.result ?? [];

   newTableData.value = res.data.result ?? [];

   // tableParams.value.total = res.data.result?.total;
   loading.value = false;
   // getEnumOrderTypeData_Index.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('OrderTypeEnum')).data.result ?? [];

   // getEnumPoStatusData_Index.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('OrderStatusEnum')).data.result ?? [];
};

// 列排序
const sortChange = async (column: any) => {
  queryParams.value.field = column.prop;
  queryParams.value.order = column.order;
  await handleQuery();
   queryParams.value.field = column.prop;
   queryParams.value.order = column.order;
   await handleQuery();
};

// 打开新增页面
const openAddWmsOrderAsn = () => {
  editWmsOrderAsnTitle.value = '添加ASN主';
  editDialogRef.value.openDialog({});
const openAddWmsOrderPurchase = () => {
   editWmsOrderPurchaseTitle.value = '添加PO单';
   editDialogRef.value.openDialog({});
};

// 打开打印页面
const openPrintWmsOrderAsn = async (row: any) => {
  printWmsOrderAsnTitle.value = '打印ASN主';
}
const openPrintWmsOrderPurchase = async (row: any) => {
   printWmsOrderPurchaseTitle.value = '打印PO单';
};

// 打开编辑页面
const openEditWmsOrderAsn = (row: any) => {
  editWmsOrderAsnTitle.value = '编辑ASN主';
  editDialogRef.value.openDialog(row);
const openEditWmsOrderPurchase = (row: any) => {
   editWmsOrderPurchaseTitle.value = '编辑PO单';
   editDialogRef.value.openDialog(row);
};

// 删除
const delWmsOrderAsn = (row: any) => {
  ElMessageBox.confirm(`确定要取消吗?`, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(async () => {
      var res = await deleteWmsOrderAsn(row);
      if (res.data.type == "success") {
        handleQuery();
        ElMessage.success("取消成功");
      }
    })
const delWmsOrderPurchase = (row: any) => {
   ElMessageBox.confirm(`确定要取消吗?`, '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
   })
      .then(async () => {
         await deleteWmsOrderPurchase(row);
         handleQuery();
         ElMessage.success('取消成功');
      })
      .catch(() => {});
};

// 改变页面容量
const handleSizeChange = (val: number) => {
  tableParams.value.pageSize = val;
  handleQuery();
   tableParams.value.pageSize = val;
   handleQuery();
};

// 改变页码序号
const handleCurrentChange = (val: number) => {
  tableParams.value.page = val;
  handleQuery();
   tableParams.value.page = val;
   handleQuery();
};

// 根据businessTypeValue获取businessTypeName
const getBusinessTypeByValue = (key: any, itemLst: any) => {

return itemLst.find((x: any) => x.businessTypeValue == key)?.businessTypeName;
   return itemLst.find((x: any) => x.businessTypeValue == key)?.businessTypeName;
};

handleQuery();

onMounted(async () => {
  nextTick(async () => {
    getBusinessTypeData_Index.value = await handleSlectDataWmsBusinessType(moveType); //下拉读取接口
    getEnumAsnTypeData_Index.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('OrderTypeEnum')).data.result ?? [];
    getEnumAsnStatusData_Index.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('OrderStatusEnum')).data.result ?? [];
    getEnumIsFreezeData_Index.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('TrueFalseEnum')).data.result ?? [];
  });
//================
const arrTdp = ref<any[]>([]);
const queryParamsW = ref<any>({});
const tableParamsW = ref({
   page: 1,
   pageSize: 200,
   total: 0,
   custType: '供应商',
});

//-----------------远程搜索----------------
const handleQueryTdp = async () => {
   var res = await pageBaseCustomer(Object.assign(queryParamsW.value, tableParamsW.value));
   arrTdp.value = res.data.result?.items ?? [];
};
const changeXmbh = async (query?: any) => {
   loading.value = true;
   var res = await pageBaseCustomer({
      page: 1,
      pageSize: 200,
      custCode: query,
      custType: '供应商',
   });
   loading.value = false;
   arrTdp.value = res.data.result?.items ?? [];
};
// 远程搜索  输入关键字以从远程服务器中查找数据。
const remoteMethod = async (query: string) => {
   loading.value = true;
   var res = await pageBaseCustomer({
      page: 1,
      pageSize: 200,
      custCode: query,
      custType: '供应商',
   });
   loading.value = false;
   arrTdp.value = res.data.result?.items ?? [];
};
//-----------------远程搜索----------------

const getEnumDockData = ref<any>([]);

onMounted(async () => {
   nextTick(async () => {
      // getBusinessTypeData_Index.value = await handleSlectDataWmsBusinessType(moveType); //下拉读取接口
      // getEnumDockData.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('DockEnum')).data.result ?? [];
      // getEnumOrderSocureData_Index.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('SourceByEnum')).data.result ?? [];
   });
});

/***************************************************[DO单操作]结束***************************************************/
/***************************************************[DO单导入]开始***************************************************/
const printWmsOrderDeliverTitle = ref("");
const editWmsOrderDeliverTitle = ref("");
const importExcelTitleWmsOrderDeliver = ref("");
const printWmsOrderDeliverTitle = ref('');
const editWmsOrderDeliverTitle = ref('');
const importExcelTitleWmsOrderDeliver = ref('');
const importExcelDialogRefWmsOrderDeliver = ref();
//打开导入界面
const openImportExcelWmsOrderDeliver = () => {
  importExcelTitleWmsOrderDeliver.value = '导入ASN单';
  importExcelDialogRefWmsOrderDeliver.value.openDialog({});
   importExcelTitleWmsOrderDeliver.value = '导入PO单';
   importExcelDialogRefWmsOrderDeliver.value.openDialog({});
};
//导入数据
const handleImportExcelWmsOrderDeliver = async (formData: Blob) => {
  var result = await importExcelWmsOrderAsn(formData);
  importExcelDialogRefWmsOrderDeliver.value.callBackUploadFun(result.data);//回调导入子页面的方法
  if (result.data.type == "success") {
    handleQuery();
  }
   var result = await importExcelWmsOrderPurchase(formData);
   importExcelDialogRefWmsOrderDeliver.value.callBackUploadFun(result.data); //回调导入子页面的方法
   if (result.data.type == 'success') {
      handleQuery();
   }
};
//下载导入模板
const handleDownExcelWmsOrderDeliver = async () => {
  var result = await downloadExcelTemplateWmsOrderAsn();
  importExcelDialogRefWmsOrderDeliver.value.callBackDownFun(result);//回调导入子页面的方法
   var result = await downloadExcelTemplateWmsOrderPurchase();
   importExcelDialogRefWmsOrderDeliver.value.callBackDownFun(result); //回调导入子页面的方法
};
/***************************************************[DO单导入]结束***************************************************/
/***************************************************[DO单导出]开始***************************************************/



//导出
const handExport = () => {
  downloadExcelTemplateWmsOrderAsnAll(queryParams.value)
    .then((res) => {
      if(res.status == 200){
        const link = document.createElement("a"); //创建a标签
          let blob = new Blob([res.data], { type: "application/vnd.ms-excel" }); // response就是接口返回的文件流
          let objectUrl = URL.createObjectURL(blob);
          link.href = objectUrl;
          link.download = `ASN单导出${formatUtcToData(
            new Date().toString(),
            "YYYY-MM-DD hh:mm:ss"
          )}`; // 自定义文件名
          link.click(); // 下载文件
          URL.revokeObjectURL(objectUrl); // 释放内存
      }
    })
   downloadExcelTemplateWmsOrderPurchaseAll(queryParams.value).then((res) => {
      if (res.status == 200) {
         const link = document.createElement('a'); //创建a标签
         let blob = new Blob([res.data], { type: 'application/vnd.ms-excel' }); // response就是接口返回的文件流
         let objectUrl = URL.createObjectURL(blob);
         link.href = objectUrl;
         link.download = `PO单导出${formatUtcToData(new Date().toString(), 'YYYY-MM-DD hh:mm:ss')}`; // 自定义文件名
         link.click(); // 下载文件
         URL.revokeObjectURL(objectUrl); // 释放内存
      }
   });
};




// 关闭Asn单
const tocloseWmsOrderAsn = (row: any) => {
  ElMessageBox.confirm(`确定要关闭吗?`, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(async () => {
      loading.value = true;
      var ret = await closeWmsOrderAsn(row);
      if (ret.data.type == "success") {
        ElMessage.success("关闭成功");
      }
      loading.value = false;
      handleQuery();
    })
};

</script>
<style scoped>
:deep(.el-input),
:deep(.el-select),
:deep(.el-input-number) {
  width: 100%;
   width: 100%;
}

.under_line {
  color: #F18201;
  text-decoration: underline;
  cursor: pointer;
   color: #f18201;
   text-decoration: underline;
   cursor: pointer;
}
.table-container {
   display: flex; /* 使用 flexbox 布局 */
   justify-content: space-between; /* 表格之间保持间距 */
}

.table-container .left-table,
.table-container .right-table {
   flex: 1; /* 使每个表格占据相同宽度 */
   margin-right: 10px; /* 定义右侧的间距 */
   width: 50%;
}
.text-xtiny {
   font-size: 14px;
   font-weight: 700;
   display: block;
   padding: 0 0 10px 0;
}
.table-container .right-table {
   margin-right: 0; /* 最后一个表格没有右间距 */
}
</style>