From ba0eca9b826aed6ec65af47676d7b4f6041df58c Mon Sep 17 00:00:00 2001
From: zhang_li <2235006734@qqq.com>
Date: Thu, 23 Nov 2023 14:09:51 +0800
Subject: [PATCH] =?UTF-8?q?=E9=87=87=E8=B4=AD=E6=94=B6=E8=B4=A7=E7=94=B3?=
 =?UTF-8?q?=E8=AF=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../wms/purchasereceiptRequestDetail/index.ts |  11 +
 src/components/Detail/src/Detail.vue          | 277 +++++++++++-------
 src/components/Table/src/Table.vue            |  16 +-
 src/utils/disposition/tabsList.ts             |   9 +
 .../purchasereceiptRequestMain/index.vue      |  17 +-
 5 files changed, 216 insertions(+), 114 deletions(-)

diff --git a/src/api/wms/purchasereceiptRequestDetail/index.ts b/src/api/wms/purchasereceiptRequestDetail/index.ts
index bd7b39d65..ab8f7d936 100644
--- a/src/api/wms/purchasereceiptRequestDetail/index.ts
+++ b/src/api/wms/purchasereceiptRequestDetail/index.ts
@@ -65,6 +65,17 @@ export const deletePurchasereceiptRequestDetail = async (id: number) => {
   return await request.delete({ url: `/wms/purchasereceipt-request-detail/delete?id=` + id })
 }
 
+// 缺货明细
+export const getScarceGoodsDetailPage = async (params) => {
+  if (params.isSearch) {
+    delete params.isSearch
+    const data = {...params}
+    return await request.post({ url: '/wms/purchaseshortage-detail/senior', data })
+  } else {
+    return await request.get({ url: `/wms/purchaseshortage-detail/page`, params })
+  }
+}
+
 // 导出采购收货申请子 Excel
 export const exportPurchasereceiptRequestDetail = async (params) => {
   return await request.download({ url: `/wms/purchasereceipt-request-detail/export-excel`, params })
diff --git a/src/components/Detail/src/Detail.vue b/src/components/Detail/src/Detail.vue
index 7dc8ea425..1280138e0 100644
--- a/src/components/Detail/src/Detail.vue
+++ b/src/components/Detail/src/Detail.vue
@@ -1,69 +1,100 @@
 <template>
   <div>
-  <el-drawer v-model="isShowDrawer" title="详情" direction="rtl" size="80%" v-loading="detailLoading">
-    <template #header>
-      <div class="font-size-18px">
-        {{ titleValueRef }} <span class="ml-20px font-size-16px">{{ titleNameRef }}</span>
-      </div>
-    </template>
-    <ContentWrap v-if="!isBasic">
-      <Descriptions :data="detailData" labelClassName="label-class-name" label-align="left" direction="vertical"
-        :column="8" :schema="allSchemas.detailSchema" :columns="2" width="200px" />
-    </ContentWrap>
-      
-    <Tabs :tabsList="tabsList" :current="current" @change="change" />
-    <div class="flex" v-if="current == 0">
-      <!-- 详情 -->
-      <ContentWrap class="w-[73%]">
-        <!-- 列表头部 -->
-        <TableHead 
-          v-if="!isBasic"
-          :HeadButttondata="HeadButttondata" 
-          :masterId="masterParmas.masterId"
-          @button-base-click="buttonBaseClick" 
-          :routeName="routeName"
-          @searchFormClick="searchFormClick"
-          :allSchemas="detailAllSchemas"
+    <el-drawer
+      v-model="isShowDrawer"
+      title="详情"
+      direction="rtl"
+      size="80%"
+      v-loading="detailLoading"
+    >
+      <template #header>
+        <div class="font-size-18px">
+          {{ titleValueRef }} <span class="ml-20px font-size-16px">{{ titleNameRef }}</span>
+        </div>
+      </template>
+      <ContentWrap v-if="!isBasic">
+        <Descriptions
+          :data="detailData"
+          labelClassName="label-class-name"
+          label-align="left"
+          direction="vertical"
+          :column="8"
+          :schema="allSchemas.detailSchema"
+          :columns="2"
+          width="200px"
         />
-        <Descriptions v-if="isBasic" :data="detailData" :schema="allSchemas.detailSchema" :columns="2" />
-        <Table 
-          v-if="!isBasic"
-          :columns="detailAllSchemas.tableColumns" 
-          :data="tableObject.tableList" 
-          :loading="tableObject.loading"
-          :pagination="{ total: tableObject.total }" 
-          v-model:pageSize="tableObject.pageSize"
-          v-model:currentPage="tableObject.currentPage" >
-          <template #action="{ row }">
-            <ButtonBase :Butttondata="buttondata" @button-base-click="buttonTableClick($event, row)" />
-          </template>
-        </Table>
-      </ContentWrap>
-      <ContentWrap class="w-[27%] ml-16px">
-        <!-- 附件组件 -->
-        <Annex :annexData="annexData" @handleAnnexSuccess="handleAnnexSuccess" @deleteAnnexSuccess="deleteAnnexSuccess" :upData="remarksData.data"/>
-        <!-- 备注组件 -->
-        <Remarks :remarksData="remarksData"  class="mt-20px"
-          @remarksSubmitScuess="remarksSubmitScuess" />
-        <!-- 变更记录组件 -->
-        <ChangeRecord :changeRecordData="changeRecordData" class="mt-20px" />
       </ContentWrap>
-    </div>
-  </el-drawer>
-  <!-- 表单弹窗：添加/修改 -->
-  <BasicForm 
-    ref="formRef" 
-    @success="submitForm" 
-    :rules="detailAllSchemasRules" 
-    :formAllSchemas="detailAllSchemas"
-    :isBusiness="false"
-    :apiUpdate="apiUpdate"
-    :apiCreate="apiCreate"
-    @searchTableSuccess="searchTableSuccess"
-    :detailData="detailData"
-    @submitForm="submitForm"
-  />
-</div>
+
+      <Tabs :tabsList="tabsList" :current="current" @change="change" />
+      <div class="flex" v-if="current == 0">
+        <!-- 详情 -->
+        <ContentWrap class="w-[73%]">
+          <!-- 列表头部 -->
+          <TableHead
+            v-if="!isBasic"
+            :HeadButttondata="HeadButttondata"
+            :masterId="masterParmas.masterId"
+            @button-base-click="buttonBaseClick"
+            :routeName="routeName"
+            @searchFormClick="searchFormClick"
+            :allSchemas="detailAllSchemas"
+          />
+          <Descriptions
+            v-if="isBasic"
+            :data="detailData"
+            :schema="allSchemas.detailSchema"
+            :columns="2"
+          />
+          <Table
+            v-if="!isBasic"
+            :columns="detailAllSchemas.tableColumns"
+            :data="tableObject.tableList"
+            :loading="tableObject.loading"
+            :pagination="{ total: tableObject.total }"
+            v-model:pageSize="tableObject.pageSize"
+            v-model:currentPage="tableObject.currentPage"
+          >
+            <template #action="{ row }">
+              <ButtonBase
+                :Butttondata="buttondata"
+                @button-base-click="buttonTableClick($event, row)"
+              />
+            </template>
+          </Table>
+        </ContentWrap>
+        <ContentWrap class="w-[27%] ml-16px">
+          <!-- 附件组件 -->
+          <Annex
+            :annexData="annexData"
+            @handleAnnexSuccess="handleAnnexSuccess"
+            @deleteAnnexSuccess="deleteAnnexSuccess"
+            :upData="remarksData.data"
+          />
+          <!-- 备注组件 -->
+          <Remarks
+            :remarksData="remarksData"
+            class="mt-20px"
+            @remarksSubmitScuess="remarksSubmitScuess"
+          />
+          <!-- 变更记录组件 -->
+          <ChangeRecord :changeRecordData="changeRecordData" class="mt-20px" />
+        </ContentWrap>
+      </div>
+    </el-drawer>
+    <!-- 表单弹窗：添加/修改 -->
+    <BasicForm
+      ref="formRef"
+      @success="submitForm"
+      :rules="detailAllSchemasRules"
+      :formAllSchemas="detailAllSchemas"
+      :isBusiness="false"
+      :apiUpdate="apiUpdate"
+      :apiCreate="apiCreate"
+      @searchTableSuccess="searchTableSuccess"
+      :detailData="detailData"
+      @submitForm="submitForm"
+    />
+  </div>
 </template>
 
 <script lang="ts" setup>
@@ -85,7 +116,7 @@ const { t } = useI18n() // 国际化
 const route = useRoute() // 路由信息
 const routeName = ref()
 routeName.value = route.name
-routeName.value = routeName.value.substring(0,routeName.value.length - 4) + 'Detail'
+routeName.value = routeName.value.substring(0, routeName.value.length - 4) + 'Detail'
 
 const props = defineProps({
   // 标签参数
@@ -147,22 +178,31 @@ const props = defineProps({
     type: Array,
     required: false,
     default: null
-  },
+  }
 })
 const isShowDrawer = ref(false)
 const detailLoading = ref(false)
 const tabsList = ref(JSON.parse(JSON.stringify(props.tabs ? props.tabs : '')))
 
-if (tabsList.value && tabsList.value.length > 0) {
-  tabsList.value.unshift({
-    label: '详情',
-    prop: 'Detail'
-  })
+if (props.isBasic == true) {
+  if (tabsList.value && tabsList.value.length > 0) {
+    tabsList.value.unshift({
+      label: '详情',
+      prop: 'Detail'
+    })
+  }
 } else {
-  tabsList.value = [{
-    label: '明细',
-    prop: 'Detail'
-  }]
+  if (tabsList.value && tabsList.value.length > 0) {
+  } else {
+    tabsList.value = [
+      {
+        label: '明细',
+        prop: 'Detail'
+      }
+    ]
+  }
+}
+if (tabsList.value) {
 }
 
 // 附件默认数据
@@ -173,14 +213,14 @@ const annexData = reactive({
 // 备注数据
 const remarksData = reactive({
   remarksList: [],
-  data:{}
+  data: {}
 })
 
 // 变更记录默认数据
 const changeRecordData = reactive({
   changeRecordList: []
 })
-const detailData = ref({})//详情数据
+const detailData = ref({}) //详情数据
 // 获取附件列表篇
 const getFileList = async () => {
   detailLoading.value = true
@@ -194,11 +234,9 @@ const getFileList = async () => {
 const handleAnnexSuccess = () => {
   getFileList()
   getChangeRecordList()
-
 }
 // 删除附件成功之后所走的方法
 const deleteAnnexSuccess = async () => {
-
   getFileList()
   getChangeRecordList()
 }
@@ -207,13 +245,14 @@ const deleteAnnexSuccess = async () => {
 const current = ref(0)
 const change = (item, index) => {
   current.value = index
+  emit('changeTabs', item)
 }
 
 //主表所需的参数
-const masterParmas=ref({
-  masterId:'',//主表id
-  number: '',//主表单据号
-  status: '',//主表状态 用于控制子表新增编辑按钮显示情况
+const masterParmas = ref({
+  masterId: '', //主表id
+  number: '', //主表单据号
+  status: '' //主表状态 用于控制子表新增编辑按钮显示情况
 })
 
 // 列表头部按钮
@@ -229,19 +268,19 @@ const openDetail = async (row: any, titleName: any, titleValue: any, tableName:
   titleValueRef.value = titleValue
   remarksData.data = {
     tableId: row.id,
-    tableName: tableName,
+    tableName: tableName
   }
   // 加载明细列表
-  if(!props.isBasic) {
+  if (!props.isBasic) {
     // 设置主表id
     masterParmas.value.masterId = row.id
     masterParmas.value.number = row.number
     masterParmas.value.status = row.status
     tableObject.params = {
-      masterId: row.id,
+      masterId: row.id
     }
     getList()
-  } 
+  }
   isShowDrawer.value = true
   if (row) {
     detailLoading.value = true
@@ -252,13 +291,19 @@ const openDetail = async (row: any, titleName: any, titleValue: any, tableName:
       getChangeRecordList()
       // 判断详情新增按钮是否显示
       HeadButttondata.value = [
-        defaultButtons.defaultAddBtn({hide:isShowMainButton(row,['1','1','PLAN_PURCHASE_READY','1'])}), // 新增
-        defaultButtons.defaultFilterBtn(null), // 筛选
+        defaultButtons.defaultAddBtn({
+          hide: isShowMainButton(row, ['1', '1', 'PLAN_PURCHASE_READY', '1'])
+        }), // 新增
+        defaultButtons.defaultFilterBtn(null) // 筛选
       ]
       // 动态显示操作列按钮
       buttondata.value = [
-        defaultButtons.mainListEditBtn({hide:isShowMainButton(row,['1','1','PLAN_PURCHASE_READY','1'])}), // 编辑
-        defaultButtons.mainListDeleteBtn({hide:isShowMainButton(row,['1','1','PLAN_PURCHASE_READY','1'])}), // 删除
+        defaultButtons.mainListEditBtn({
+          hide: isShowMainButton(row, ['1', '1', 'PLAN_PURCHASE_READY', '1'])
+        }), // 编辑
+        defaultButtons.mainListDeleteBtn({
+          hide: isShowMainButton(row, ['1', '1', 'PLAN_PURCHASE_READY', '1'])
+        }) // 删除
       ]
     } finally {
       detailLoading.value = false
@@ -286,13 +331,12 @@ const remarksSubmitScuess = async (remark) => {
 const getChangeRecordList = async () => {
   changeRecordData.changeRecordList = await RemarkApi.getChangeRecordPage(remarksData.data)
 }
-
 const { tableObject, tableMethods } = useTable({
   getListApi: props.apiPage // 分页接口
 })
 
 // 根据状态返回该按钮是否显示
-const isShowMainButton = (row,val) => {
+const isShowMainButton = (row, val) => {
   if (val.indexOf(row.status) > -1) {
     return false
   } else {
@@ -300,22 +344,27 @@ const isShowMainButton = (row,val) => {
   }
 }
 
-
 // 获得表格的各种操作
 const { getList } = tableMethods
 
-// 头部按钮事件 
+// 头部按钮事件
 const buttonBaseClick = (val, item) => {
-  if (val == 'add') { // 新增
+  if (val == 'add') {
+    // 新增
     openForm('create')
-  } else if (val == 'import') { // 导入
+  } else if (val == 'import') {
+    // 导入
     handleImport()
-  } else if (val == 'export') { // 导出
+  } else if (val == 'export') {
+    // 导出
     handleExport()
-  } else if (val == 'refresh') { // 刷新
+  } else if (val == 'refresh') {
+    // 刷新
     getList()
-  } else if (val == 'filtrate') { // 筛选
-  } else { // 其他按钮 
+  } else if (val == 'filtrate') {
+    // 筛选
+  } else {
+    // 其他按钮
     console.log('其他按钮', item)
   }
 }
@@ -325,11 +374,13 @@ const buttonBaseClick = (val, item) => {
 //   detailAllSchemas.tableColumns.value = val
 // }
 
-// 列表-操作按钮事件 
+// 列表-操作按钮事件
 const buttonTableClick = async (val, row) => {
-  if (val == 'edit') { // 编辑
+  if (val == 'edit') {
+    // 编辑
     openForm('update', row)
-  } else if (val == 'delete') { // 删除
+  } else if (val == 'delete') {
+    // 删除
     handleDelete(row.id)
   }
 }
@@ -361,9 +412,7 @@ const searchTableSuccess = (formField, searchField, val, formRef) => {
   emit('searchTableSuccessDetail', formField, searchField, val, formRef)
 }
 // 传递给父类
-const emit = defineEmits([
-  'searchTableSuccessDetail',
-])
+const emit = defineEmits(['searchTableSuccessDetail', 'changeTabs'])
 /** 删除按钮操作 */
 const handleDelete = async (id: number) => {
   try {
@@ -374,16 +423,30 @@ const handleDelete = async (id: number) => {
     message.success(t('common.delSuccess'))
     // 刷新列表
     await getList()
-  } catch { }
+  } catch {}
 }
 // 筛选提交
 const searchFormClick = (searchData) => {
   tableObject.params = {
     isSearch: true,
-    filters: searchData.filters?searchData.filters:[{column: "masterId", action: "==", value: masterParmas.value.masterId}]
+    filters: searchData.filters
+      ? searchData.filters
+      : [{ column: 'masterId', action: '==', value: masterParmas.value.masterId }]
   }
   getList() // 刷新当前列表
 }
+console.log(props.apiPage)
+//监视属性
+// watch(props.apiPage, (newValue, oldValue) => {
+//   // 回调函数形式
+//   console.log('求和的值变了', '变化后的值是' + newValue, '变化前的值是' + oldValue)
+// })
+watch(
+  () => props.apiPage,
+  (newValue,oldValue) => {
+    console.log('求和的值变了', '变化后的值是' + newValue, '变化前的值是' + oldValue)
+  }
+)
 </script>
 <style lang="scss">
 .el-drawer__body {
diff --git a/src/components/Table/src/Table.vue b/src/components/Table/src/Table.vue
index 19f3f6315..74896e9d8 100644
--- a/src/components/Table/src/Table.vue
+++ b/src/components/Table/src/Table.vue
@@ -44,6 +44,7 @@ export default defineComponent({
     align: propTypes.string
       .validate((v: string) => ['left', 'center', 'right'].includes(v))
       .def('center'),
+    border : propTypes.bool.def(true),
     // 表头对齐方式
     headerAlign: propTypes.string
       .validate((v: string) => ['left', 'center', 'right'].includes(v))
@@ -174,7 +175,7 @@ export default defineComponent({
     })
 
     const renderTableSelection = () => {
-      const { selection, reserveSelection, align, headerAlign } = unref(getProps)
+      const { selection, reserveSelection, align, headerAlign,border } = unref(getProps)
       // 渲染多选
       return selection ? (
         <ElTableColumn
@@ -182,16 +183,17 @@ export default defineComponent({
           reserveSelection={reserveSelection}
           align={align}
           headerAlign={headerAlign}
+          border={border}
           width="50"
         ></ElTableColumn>
       ) : undefined
     }
 
     const renderTableExpand = () => {
-      const { align, headerAlign, expand } = unref(getProps)
+      const { align, headerAlign, expand,border } = unref(getProps)
       // 渲染展开行
       return expand ? (
-        <ElTableColumn type="expand" align={align} headerAlign={headerAlign}>
+        <ElTableColumn type="expand" align={align} headerAlign={headerAlign} border={border}>
           {{
             // @ts-ignore
             default: (data: TableSlotDefault) => getSlot(slots, 'expand', data)
@@ -201,7 +203,7 @@ export default defineComponent({
     }
 
     const rnderTreeTableColumn = (columnsChildren: TableColumn[]) => {
-      const { align, headerAlign, showOverflowTooltip } = unref(getProps)
+      const { align, headerAlign, showOverflowTooltip,border } = unref(getProps)
       return columnsChildren.map((v) => {
         const props = { ...v }
         if (props.children) delete props.children
@@ -209,6 +211,7 @@ export default defineComponent({
           <ElTableColumn
             showOverflowTooltip={showOverflowTooltip}
             align={align}
+            border={border}
             headerAlign={headerAlign}
             {...props}
             prop={v.field}
@@ -237,7 +240,8 @@ export default defineComponent({
         currentPage,
         align,
         headerAlign,
-        showOverflowTooltip
+        showOverflowTooltip,
+        border
       } = unref(getProps)
       return [...[renderTableExpand()], ...[renderTableSelection()]].concat(
         (columnsChildren || columns).map((v) => {
@@ -252,6 +256,7 @@ export default defineComponent({
                     : (index) => setIndex(reserveIndex, index, pageSize, currentPage)
                 }
                 align={v.align || align}
+                border={v.border || border}
                 headerAlign={v.headerAlign || headerAlign}
                 label={v.label}
                 width="65px"
@@ -264,6 +269,7 @@ export default defineComponent({
               <ElTableColumn
                 showOverflowTooltip={showOverflowTooltip}
                 align={align}
+                border={border}
                 headerAlign={headerAlign}
                 {...props}
                 prop={v.field}
diff --git a/src/utils/disposition/tabsList.ts b/src/utils/disposition/tabsList.ts
index f9415ba9c..96c2fa0db 100644
--- a/src/utils/disposition/tabsList.ts
+++ b/src/utils/disposition/tabsList.ts
@@ -28,4 +28,13 @@ export const ItemBasicTabsList = [{
 },
 
 ]
+export const PurchasereceiptRequestTabsList = [{
+    label: "收货明细",
+    prop: 'receiptDetail',
+  },
+  {
+    label: "缺货明细",
+    prop: 'scarceGoodsDetail',
+  }
+]
 
diff --git a/src/views/wms/purchasereceiptManage/purchasereceipt/purchasereceiptRequestMain/index.vue b/src/views/wms/purchasereceiptManage/purchasereceipt/purchasereceiptRequestMain/index.vue
index 3c83f0073..d7f2f8a24 100644
--- a/src/views/wms/purchasereceiptManage/purchasereceipt/purchasereceiptRequestMain/index.vue
+++ b/src/views/wms/purchasereceiptManage/purchasereceipt/purchasereceiptRequestMain/index.vue
@@ -65,10 +65,12 @@
     :detailAllSchemasRules="PurchasereceiptRequestDetailRules"
     :apiCreate="PurchasereceiptRequestDetailApi.createPurchasereceiptRequestDetail"
     :apiUpdate="PurchasereceiptRequestDetailApi.updatePurchasereceiptRequestDetail"
-    :apiPage="PurchasereceiptRequestDetailApi.getPurchasereceiptRequestDetailPage"
+    :apiPage="apiPage"
     :apiDelete="PurchasereceiptRequestDetailApi.deletePurchasereceiptRequestDetail"
     :Echo="Echo"
+    :tabs="PurchasereceiptRequestTabsList"
     @searchTableSuccessDetail="searchTableSuccessDetail"
+    @changeTabs="changeTabs"
   />
 
   <!-- 导入 -->
@@ -81,6 +83,7 @@ import { PurchasereceiptRequestMain,PurchasereceiptRequestMainRules,Purchaserece
 import * as PurchasereceiptRequestMainApi from '@/api/wms/purchasereceiptRequestMain'
 import * as PurchasereceiptRequestDetailApi from '@/api/wms/purchasereceiptRequestDetail'
 import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import { PurchasereceiptRequestTabsList } from '@/utils/disposition/tabsList'
 
 // 采购收货申请
 defineOptions({ name: 'PurchasereceiptRequestMain' })
@@ -93,6 +96,8 @@ const routeName = ref()
 routeName.value = route.name
 const tableColumns = ref(PurchasereceiptRequestMain.allSchemas.tableColumns)
 
+const apiPage = ref(PurchasereceiptRequestDetailApi.getPurchasereceiptRequestDetailPage)
+
 // 字段设置 更新主列表字段
 const updataTableColumns = (val) => {
   tableColumns.value = val
@@ -358,7 +363,15 @@ const searchFormClick = (searchData) => {
   }
   getList() // 刷新当前列表
 }
-
+const changeTabs = (data) =>{
+  // console.log(data.prop)
+  if(data.prop == 'receiptDetail'){
+    apiPage.value = PurchasereceiptRequestDetailApi.getPurchasereceiptRequestDetailPage
+  }else if(data.prop == 'scarceGoodsDetail'){
+    apiPage.value = PurchasereceiptRequestDetailApi.getScarceGoodsDetailPage
+  }
+  console.log( apiPage.value)
+}
 /** 初始化 **/
 onMounted(async () => {
   getList()