生成标签默认显示箱规格，分页问题

src/components/BasicForm/src/BasicForm.vue

@@ -102,6 +102,7 @@
       @clearInput='clearInput'
           @batchAdd="batchAdd"
           :routeName="routeName"
+          @visibleChange='visibleChange'
       >
       <template v-slot="{row}">
         <slot :row="row"></slot>
@@ -692,8 +693,12 @@ const emit = defineEmits([
   'footButtonClick',
   'clearSearchInput',
   'clearInput',
-  'sumFormDataHandle'
+  'sumFormDataHandle',
+  'visibleChange'
 ])
+const visibleChange = (field, val, row, index) => {
+  emit('visibleChange',field, val, row, index)
+}
 //普通下拉改变事件
 const formSelectChange = (field, val, row) => {
   emit('formSelectChange', field, val, row)

src/components/TableForm/src/TableForm.vue

@@ -165,6 +165,7 @@
               :placeholder="headerItem?.tableForm?.placeholder || '请选择' + headerItem.label"
               @change="formSelectChange(headerItem.field, $event, row)"
               @blur="tableFormSelectOnBlur(headerItem.field, $event, row, $index)"
+              @visible-change="visibleChange(headerItem.field, $event, row, $index)"
             >
               <el-option
                 v-for="op in initSelectOptions(headerItem,row)"
@@ -518,7 +519,8 @@ const emit = defineEmits([
   'tableFormSelectOnBlur',
   'formFormDateChange',
   'clearInput',
-  'batchAdd'
+  'batchAdd',
+  'visibleChange'
 ])
 // 获取下拉列表 | type = radio | type = select
 const initSelectOptions = (headerItem,row) => {
@@ -653,7 +655,9 @@ const clearInput = (field, row, index) => {
 const buttonOperationClick = (row, label, index) => {
   emit('buttonOperationClick', row, label, index)
 }
-
+const visibleChange = (field, val, row, index) => {
+  emit('visibleChange',field, val, row, index)
+}
 const currentPage = ref(1)
 const pageSize = ref(10)
 const showTableData = () => {

src/views/wms/purchasereceiptManage/supplierdeliver/supplierdeliverRequestMain/index.vue

@@ -154,6 +154,7 @@
     :footButttondata="footButttondata"
     @footButtonClick="footButtonClick"
     @formSelectChange="formSelectChangeLabel"
+    @visibleChange='visibleChange'
   />
   <!-- 上传质量报告 -->
   <BasicForm
@@ -590,20 +591,7 @@ const buttonTableClick = async (val, row) => {
     }
     genLabelId.value = row.masterId
     // await getDetailList()
-    const params1 = {
-      masterId: row.masterId,
-      pageSize: '500',
-      pageNo: '1',
-      sort: '',
-      by: 'ASC'
-    }
-    await SupplierdeliverRequestDetailApi.getGenerateLabelList(params1).then((res) => {
-      detatableData1.value = res
-      detatableData1.value.forEach((item) => {
-        console.log(item.boxPackaging)
-        item.packUnitInitOptions = item.boxPackaging
-      })
-    })
+    await getGenerateLabelList(row)
     formLabelRef.value.open('create', row, null, 'createLabel') //创建标签页面 createLabel 标题
   } else if (val == 'ressbq') {
     console.log('重新生成标签')
@@ -620,24 +608,7 @@ const buttonTableClick = async (val, row) => {
             }
             genLabelId.value = row.masterId
             // await getDetailList()
-            const params1 = {
-      masterId: row.masterId,
-      pageSize: '500',
-      pageNo: '1',
-      sort: '',
-      by: 'ASC'
-    }
-            await SupplierdeliverRequestDetailApi.getGenerateLabelList(params1).then((res) => {
-                detatableData1.value = res
-                detatableData1.value.forEach((item) => {
-                  console.log(item.boxPackaging)
-                  if (item.boxPackaging?.length > 0) {
-                    item.packUnitInitOptions = item.boxPackaging.map((cur) => {
-                      return { label: cur.packName, value: cur.packUnit }
-                    })
-                  }
-                })
-              })
+            await  getGenerateLabelList(row)
             formLabelRef.value.open('create', row, null, 'createLabel') //创建标签页面 createLabel 标题
           }
         })
@@ -657,6 +628,27 @@ const footButttondata = ref([
   defaultButtons.formNextStepBtn(null), // BOM下一步
   defaultButtons.formCloseBtn(null) // BOM关闭
 ])
+// 获取箱规格
+const getGenerateLabelList=async(row)=>{
+  const params1 = {
+      masterId: row.masterId,
+      pageSize: '500',
+      pageNo: '1',
+      sort: '',
+      by: 'ASC'
+    }
+    await SupplierdeliverRequestDetailApi.getGenerateLabelList(params1).then((res) => {
+      detatableData1.value = res
+      detatableData1.value.forEach((item) => {
+        item.packUnitInitOptions = item.boxPackaging
+        let obj = item?.boxPackaging[0]
+        if (obj) {
+          item.packUnit= obj.packUnit
+          item.packQty = obj.packQty
+        } 
+      })
+    })
+}
 // 下一步
 const labelFormRef = ref()
 const footButtonClick = async (val) => {
@@ -665,6 +657,13 @@ const footButtonClick = async (val) => {
     if (!validateForm) {
       return
     }
+    let isNext = detatableData1.value.some((item)=>{
+      return !item.packUnit  || !item.packQty
+    })
+    if(isNext){
+      message.warning('有数据没有选择箱规格')
+      return;
+    }
     const data = JSON.parse(JSON.stringify(detatableData1.value))
     labelFormRef.value.openLabel(data)
   } else if (val == 'close') {
@@ -682,14 +681,7 @@ const formSelectChangeLabel = (field, val, row) => {
     }
     row.secondPackUnit = ''
     row.secondPackQty = ''
-    // 获取托规格
-    const params1 = {
-      itemCode: row.itemCode,
-      packUnit: row.packUnit
-    }
-    SupplierdeliverRequestDetailApi.getGenerateLabelParentList(params1).then((res) => {
-      row.secondPackUnitInitOptions  = res
-    })
+   
   }
   // 设置托
   if (field == 'secondPackUnit') {
@@ -701,6 +693,24 @@ const formSelectChangeLabel = (field, val, row) => {
     }
   }
 }
+// tableForm下拉框弹出隐藏
+const visibleChange=(field, val, row, index)=>{
+  row.secondPackUnitInitOptions=[]
+  console.log(field, val, row)
+  if(field=='secondPackUnit'){
+    if(val){
+  // 获取托规格
+    const params1 = {
+      itemCode: row.itemCode,
+      packUnit: row.packUnit
+    }
+    SupplierdeliverRequestDetailApi.getGenerateLabelParentList(params1).then((res) => {
+      row.secondPackUnitInitOptions  = res
+    })
+    }
+  }
+
+}
 
 // 获取部门 用于详情 部门回显
 const { wsCache } = useCache()

src/views/wms/purchasereceiptManage/supplierdeliver/supplierdeliverRequestMain/labelForm.vue

@@ -1,7 +1,7 @@
 <template>
   <el-dialog v-model="dialogTableVisible" title="标签" width="1100">
     <el-table
-      :data="tableData"
+      :data="showTableData()"
       border
       row-key="id"
       style="width: 1050px; max-height: 70vh; overflow-y: auto"
@@ -135,6 +135,16 @@
       <el-table-column label="箱规格" width="100" prop="packUnit" align="center" />
       <el-table-column label="箱数量" width="100" prop="packQty" align="center" />
     </el-table>
+    <el-pagination
+      v-show="tableData.length > 10"
+      style="margin-top: 10px"
+      v-model:current-page="currentPage"
+      v-model:page-size="pageSize"
+      :small="true"
+      :background="false"
+      layout="total, prev, pager, next, jumper"
+      :total="tableData.length"
+    />
     <template #footer>
       <slot name="foorter"></slot>
       <ButtonBase :Butttondata="Butttondata" @button-base-click="buttonBaseClick" />
@@ -157,19 +167,31 @@ const props = defineProps({
 
 const dialogTableVisible = ref(false)
 const defaultExpandAll = ref(false)
-
 const tableData = ref([])
 const isLoading = ref(false)
-const openLabel = (tableList) => {
+const oneId = ref(0) //每托的id
+const twoId = ref(0) //每箱的id
+const openLabel =async (tableList) => {
   dialogTableVisible.value = true
   tableData.value = tableList
   defaultExpandAll.value = false
-  // intData()
-  intData()
+  await intData()
 }
-const oneId = ref(0) //每托的id
-const twoId = ref(0) //每箱的id
-const intData = () => {
+const currentPage = ref(1)
+const pageSize = ref(10)
+const showTableData = () => {
+  console.log(777,tableData.value.length)
+  if (tableData.value.length > 10) {
+    return tableData.value.slice(
+      (currentPage.value - 1) * pageSize.value,
+      currentPage.value * pageSize.value
+    )
+  } else {
+    return tableData.value
+  }
+  
+}
+const intData =async () => {
   tableData.value.forEach((row) => {
     if (row.secondPackUnit && row.secondPackQty) {
       // 数量%托数量  获取总共几托
@@ -178,7 +200,7 @@ const intData = () => {
       // 数量%每箱数量  获取总共几箱
       row.allTuoQty = Math.ceil(parseFloat(row.qty) / parseFloat(row.packQty))
     }
-    expandChange(row)
+   expandChange(row)
   })
 }
 const expandChange = (row: any, expandedRows: any[]) => {