产值计划

src/views/out/purchase/index.vue

@@ -0,0 +1,28 @@
+<template>
+  <div class="p-2">
+    <el-tabs v-model="activeName" class="demo-tabs" type="border-card" @tab-click="handleClick">
+      <el-tab-pane label="对甲" name="1">
+        <purchPage ref="purchPageRef1"></purchPage>
+      </el-tab-pane>
+      <el-tab-pane label="对乙" name="2">
+        <purchPage ref="purchPageRef2"></purchPage>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script setup name="MonthPlan" lang="ts">
+import { ref, watch, computed } from 'vue';
+import purchPage from './comm/purchPage.vue';
+import { on } from 'events';
+// 引用子组件
+const activeName = ref('1');
+const purchPageRef1 = ref<InstanceType<typeof purchPage> | null>(null);
+const purchPageRef2 = ref<InstanceType<typeof purchPage> | null>(null);
+const handleClick = (val) => {
+  purchPageRef1.value.getList(val.props.name); //子组件方法
+};
+onMounted(() => {
+  purchPageRef1.value?.getList('1'); //初始加载
+});
+</script>