根据选择项目跟新材料管理

plus-ui/src/components/ProjectSelector/index.vue

@@ -1,21 +1,16 @@
 <template>
   <div class="select-container">
     <label for="projectSelect" class="select-label">项目列表:</label>
-    <el-select 
+    <el-select
       id="projectSelect"
-      v-model="selectedProjectId" 
-      placeholder="选择工程" 
+      v-model="selectedProjectId"
+      placeholder="全部工程项目"
       clearable
       filterable
       @change="handleSelect"
-      style="width: 120px;margin-right: 20px;"
+      style="width: 150px; margin-right: 20px"
     >
-      <el-option
-        v-for="project in projects"
-        :key="project.id"
-        :label="project.name"
-        :value="project.id"
-      />
+      <el-option v-for="project in projects" :key="project.id" :label="project.name" :value="project.id" />
     </el-select>
   </div>
 </template>
@@ -25,16 +20,24 @@ import { ref, computed, watch } from 'vue';
 import { useUserStore } from '@/store/modules/user';
 
 const userStore = useUserStore();
-const projects = computed(() => userStore.projects);
+const projects = computed(() => [
+  { id: '', name: '全部工程项目' }, // 添加空选项
+  ...userStore.projects
+]);
+
 const selectedProjectId = ref(userStore.selectedProject?.id || '');
 
 // 监听 userStore.selectedProject 变化，更新 selectedProjectId
-watch(() => userStore.selectedProject, (newProject) => {
-  selectedProjectId.value = newProject?.id || '';
-}, { deep: true });
+watch(
+  () => userStore.selectedProject,
+  (newProject) => {
+    selectedProjectId.value = newProject?.id ?? ''; // 避免 undefined 导致 placeholder 显示
+  },
+  { deep: true }
+);
 
 const handleSelect = (projectId: string) => {
-  const selectedProject = projects.value.find(p => p.id === projectId);
+  const selectedProject = projects.value.find((p) => p.id === projectId);
   if (selectedProject) {
     userStore.setSelectedProject(selectedProject);
   }
@@ -100,4 +103,4 @@ const handleSelect = (projectId: string) => {
     }
   }
 }
-</style>
+</style>