init

src/components/project/nodeLevel2Select.vue

@@ -0,0 +1,70 @@
+<template>
+  <el-select @change="changeFun" v-model="nodeUuid" placeholder="阶段" :options="nodeLevel2ListOptions">
+  </el-select>
+</template>
+<script lang='ts' setup>
+import { getChildrenNodeListApi } from '@/api/project/node';
+import { NODE_TYPE } from '@/utils/enum/node';
+import { onMounted, ref, watch } from 'vue';
+
+const props = defineProps({
+  nodeLevel1Uuid: {
+    type: String,
+    default: '',
+  },
+});
+
+const nodeLevel2ListOptions = ref();
+
+const emits = defineEmits(['update:nodeLevel2Uuid', 'update:updateNodeLevel2Info']);
+const nodeUuid = ref('');
+const nodeInfo = ref();
+
+const changeFun = () => {
+  emits('update:nodeLevel2Uuid', nodeUuid.value);
+  nodeInfo.value = nodeLevel2ListOptions.value.find((item: { value: string; }) => item.value === nodeUuid.value)?.info;
+  console.log('nodeLevel2ListOptions', nodeUuid.value, nodeInfo.value, nodeLevel2ListOptions.value);
+  emits('update:updateNodeLevel2Info',
+    {
+    // 反馈对应的项目信息
+      ...(nodeLevel2ListOptions.value.find((item: { value: string; }) => {return item.value === nodeUuid.value;}).info),
+    });
+};
+
+// 将选中数据回滚到上一个版本
+const rollBackValue = (value:string) => {
+  nodeUuid.value = value;
+};
+
+const nodeLevel2ListApi = async() => {
+  const res:any = await getChildrenNodeListApi({ current: 1, size: 999, nodeType: NODE_TYPE.PHASE, nodeId: props.nodeLevel1Uuid });
+  if (res && res.code === 200) {
+    nodeLevel2ListOptions.value = res.data.map((item: { nodeName: string; uuid: string; }) => {
+      return { label: item.nodeName, value: item.uuid, info: item };
+    });
+    // console.log('nodeLevel2ListOptions', nodeLevel2ListOptions.value);
+    if (nodeLevel2ListOptions.value.length) {
+      nodeUuid.value = nodeLevel2ListOptions.value[0].value;
+      changeFun();
+    }
+  } else {
+    nodeLevel2ListOptions.value = [];
+  }
+};
+onMounted(() => {
+});
+watch(
+  () => props.nodeLevel1Uuid,
+  () => {
+    console.log('props.nodeLevel1Uuid', props.nodeLevel1Uuid);
+    if (props.nodeLevel1Uuid) {
+      nodeLevel2ListApi();
+    }
+  },
+  {
+    immediate: true,
+  }
+);
+defineExpose({ rollBackValue, nodeInfo });
+</script>
+<style lang='scss' scoped></style>