2024-4-30 计划排产增加物料分页能力

src/views/mes/orderDay/components/schedule.vue

@@ -53,7 +53,7 @@
           <div ref="graphContainer"></div
           ></el-main>
         <el-aside width="640px">
-          <el-tag>工序编码：{{currentNode.id}} -工序名称:{{currentNode.attrs.title.text  }}</el-tag>
+          <el-tag>工序编码：{{currentNode.id}} -工序名称:{{currentNode.name  }}</el-tag>
           <el-tabs v-model="activeName" >
             <el-tab-pane label="工序工位" name="workstation">
               <el-table :data="workstationData" ref="tableWorkstations" style="width: 100%; height: 80%">
@@ -70,7 +70,7 @@
 
             </el-tab-pane>
             <el-tab-pane label="工序物料" name="materials">
-                <el-table :data="materialsData" ref="tableMaterials" style="width: 100%; height: 80%">
+                <el-table :data="showMaterialsData" ref="tableMaterials" style="width: 100%; height: 80%">
                 <el-table-column prop="repMaterialCode" label="物料编码" />
                 <el-table-column prop="repMaterialCounts" label="物料数量" />
                 <el-table-column prop="repMaterialModel" label="物料单位" />
@@ -89,6 +89,17 @@
                   </template>
                 </el-table-column>
               </el-table>
+              <el-pagination
+              small
+              hide-on-single-page="true"
+              layout="prev, pager, next"
+              :total="page.total"
+              :page-size="page.size"
+              :current-page="page.current"
+              @current-change="handleCurrentChangeM"
+              @prev-click="handlePrevClickM"
+              @next-click="handleNextClickM"
+            />
             </el-tab-pane>
             <el-tab-pane label="工序人员" name="workers">
               <el-button type="primary" @click="opensearchTableUser">添加人员</el-button>
@@ -262,13 +273,15 @@ const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const  graphJson =ref()
 const currentNode = ref({
-  attrs:{
+  name:'',
-    title:{
-      text:''
-    }
-  },
   id:''
 })
+const showMaterialsData=ref() //物料信息分页展示
+const page=ref({
+  total:0,
+  current:1,
+  size:5
+})
 /*班组数据*/
 const teamData = ref([])
 /*班组弹窗搜索条件*/
@@ -314,12 +327,15 @@ const searchTeamList = () => {
 }
 /** 打开弹窗 */
 const open = async (type: string, row?: any, titleName?: any) => {
-  currentNode.value.attrs.title.text=''
+  currentNode.value.name=''
   currentNode.value.id=''
   //首次打开页面，将数据清空
   workerData.value = []
   equipmentData.value = []
   materialsData.value = []
+  showMaterialsData.value=[]
+  page.value.total = 0
+  page.value.current = 1
   workstationData.value = []
   getOptions()
   dialogVisible.value = true
@@ -377,20 +393,27 @@ const getProcessBom=async (code:any) => {
   queryParams.processCode=code
   let res = await orderDayconfigApi.getOrderDayBomByOrder(queryParams)
   materialsData.value=res
+  if(materialsData.value.length>0){
+    page.value.total = materialsData.value.length
+    page.value.current = 1
+    showMaterialsData.value=materialsData.value.slice(0,page.value.size)
   }
-const currentStartNode = ref({
+}
-  id:''
+// const currentStartNode = ref({
-})
+//   id:''
+// })
 //获取配置的工艺路线信息
 const getProcessroute = async () => {
   let res = await orderDayconfigApi.getConfigProcessRoute(queryParams)
   graphJson.value=JSON.parse(res.newGraphData)
+  graph.value?.fromJSON(graphJson.value.cells)
   //首次打开弹窗，默认打开一个工序的数据
-  currentStartNode.value.id = graphJson.value.cells[0].id
+  //currentStartNode.value = graphJson.value.cells[0]
-  // 手动触发点击事件
-  nodeClick('','','',currentStartNode.value,'')
   currentNode.value = graphJson.value.cells[0]
-  graph.value?.fromJSON(graphJson.value.cells)
+  // 手动触发点击事件
+  nodeClick('','','',currentNode.value,'')
+  
+  
 }
 //获取配置的工序信息
 const getConfigProcessRouteNode= async () => {
@@ -419,7 +442,9 @@ const nodeClick = (e, x, y, node, view) => {
   getConfigProcessWorker(node.id)
   getConfigProcessEquipment(node.id)
   processCode.value = node.id
-  currentNode.value=node
+  currentNode.value.id=node.id
+  console.log(node)
+  currentNode.value.name=node.attrs.title.text
 }
 
 const searchTableRef = ref()
@@ -685,7 +710,25 @@ const saveUser = async () =>{
 const getTeamList = async (params:any) => {
   return TeamApi.getTeamPage(params)
 }
+const handleCurrentChangeM=(value: number)=>{
+      let index=(value-1)*page.value.size
+      page.value.current=value
+      showMaterialsData.value=materialsData.value.slice(index,index+page.value.size)
+      
+}
+const handlePrevClickM=(value: number)=>{
+      page.value.current=value-1
+      if(page.value.current==0) {
+        page.value.current=1
+      }
      
+}
+const handleNextClickM=(value: number)=>{
+     page.value.current=value+1
+     if(page.value.current>page.value.total/page.value.size) {
+        page.value.current=page.value.total/page.value.size -1
+      }
+}
 defineOptions({ name: 'SechledDetail' })
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 // 传递给父类