fix: "新建课题"

src/components/tall/left/Index.vue

@@ -19,22 +19,24 @@
       <p>是否新建课题？</p>
     </a-modal>
 
-    <Projects ref="projectsRef" />
+    <Projects />
+    <!-- ref="projectsRef" -->
   </div>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-// import { useStore } from 'vuex';
+import { useStore } from 'vuex';
-import dayjs from 'dayjs';
+// import dayjs from 'dayjs';
 import { PlusCircleFilled } from '@ant-design/icons-vue';
 import { create } from 'apis';
 import Calendar from './Calendar.vue';
 import Projects from './Projects.vue';
 // import { importWbs } from 'apis';
 
+const store = useStore();
 const visible = ref(false);
-const projectsRef = ref(null);
+// const projectsRef = ref(null);
 const showModal = () => {
   visible.value = true;
 };
@@ -48,7 +50,8 @@ const handleOk = async () => {
 async function createExperiment() {
   try {
     const data = await create();
-    projectsRef.value.getProjectsList(dayjs().startOf('day').format('x'), dayjs().endOf('day').format('x'));
+    store.commit('projects/setNewProject', data);
+    // projectsRef.value.getProjectsList(dayjs().startOf('day').format('x'), dayjs().endOf('day').format('x'));
     return data;
   } catch (error) {
     throw new Error(error);

src/components/tall/left/Projects.vue

@@ -69,7 +69,7 @@
 </template>
 
 <script setup>
-import { reactive, ref } from 'vue';
+import { reactive, ref, watch, computed } from 'vue';
 import { useStore } from 'vuex';
 import dayjs from 'dayjs';
 import { getProjects, delProject } from 'apis';
@@ -80,6 +80,13 @@ const projects = reactive({ projects: [] });
 const visible = ref(false);
 const deleteId = ref(null);
 const projectId = sessionStorage.getItem('projectId');
+const newProject = computed(() => store.state.projects.newProject); // 新建项目
+
+watch(newProject, () => {
+  getProjectsList(dayjs().startOf('day').format('x'), dayjs().endOf('day').format('x'));
+});
+
+getProjectsList(dayjs().startOf('day').format('x'), dayjs().endOf('day').format('x'));
 
 // 点击操作面试显示隐藏
 const showActionCard = item => {
@@ -88,7 +95,7 @@ const showActionCard = item => {
 };
 
 // 获取项目列表
-const getProjectsList = async (startTime, endTime) => {
+async function getProjectsList(startTime, endTime) {
   try {
     const data = await getProjects(startTime, endTime);
     projects.projects = [];
@@ -117,9 +124,7 @@ const getProjectsList = async (startTime, endTime) => {
   } catch (error) {
     throw new Error(error);
   }
-};
+}
-
-getProjectsList(dayjs().startOf('day').format('x'), dayjs().endOf('day').format('x'));
 
 function toDetail(item) {
   item.show = true;
@@ -153,9 +158,6 @@ async function deleteProject(param) {
   }
 }
 </script>
-<script>
-export default { name: 'Projects' };
-</script>
 
 <style scoped>
 .list-flex {

src/store/tall/projects/index.js

@@ -5,6 +5,7 @@ export default {
     project: { name: '加载中...' }, // 当前项目信息
     projects: [], // 项目列表
     dotList: [], // 小红点
+    newProject: {}, // 新建项目信息
   },
 
   getters: {
@@ -31,6 +32,15 @@ export default {
       }
     },
 
+    /**
+     * 设置state project新建项目信息
+     * @param {object} state
+     * @param {array} data 项目信息
+     */
+    setNewProject(state, data) {
+      state.newProject = data;
+    },
+
     /**
      * 设置子项目收缩展开
      * @param { object } state