src/views/inventoryManagement/stockManagement/index.vue
@@ -4,30 +4,45 @@
      <el-tab-pane v-for="tab in tabs"
                   :label="tab.label"
                   :name="tab.name"
                   :key="tab.name">
        <component :is="tab.name === 'qualified' ? QualifiedRecord : UnqualifiedRecord" />
      </el-tab-pane>
                   :key="tab.name" />
    </el-tabs>
    <qualified-record
      v-if="currentParentId !== undefined"
      :key="activeTab"
      :parent-id="currentParentId"
    />
  </div>
</template>
<script setup>
import { getProductParentNames } from "@/api/basicData/productModel.js";
import QualifiedRecord from "@/views/inventoryManagement/stockManagement/Qualified.vue";
import UnqualifiedRecord from "@/views/inventoryManagement/stockManagement/Unqualified.vue";
const activeTab = ref('qualified')
const tabs = ref([
  {
    label: '合格库存',
    name: 'qualified'
  },
  {
    label: '不合格库存',
    name: 'unqualified'
  }
])
const activeTab = ref('')
const tabs = ref([])
const currentParentId = computed(() => {
  const current = tabs.value.find((item) => item.name === activeTab.value)
  return current?.parentId
})
const handleTabChange = (tabName) => {
  activeTab.value = tabName;
}
const getTabs = async () => {
  const res = await getProductParentNames()
  const list = Array.isArray(res?.data) ? res.data : []
  tabs.value = list.map((item) => ({
    label: item.productName,
    name: String(item.id),
    parentId: item.id,
  }))
  if (tabs.value.length && !activeTab.value) {
    activeTab.value = tabs.value[0].name
  }
}
onMounted(() => {
  getTabs()
})
</script>