软件概述、测评对象-用户自定义片段录入-文，表，图

cdTMP/src/api/project/project.js

@@ -132,5 +132,16 @@ export default {
             method: "get",
             params: { id: id }
         })
+    },
+    /**
+     * 获取所有状态
+     * @returns 返回是否填写软件概述等等是否已经填写
+     */
+    getAllStatus(id) {
+        return request({
+            url: "/testmanage/project/project_info_status/",
+            method: "get",
+            params: { id: id }
+        })
     }
 }

cdTMP/src/layout/components/projectInfoOther/index.vue

@@ -7,31 +7,91 @@
                 </template>
                 <a-space>
                     <span>项目设置</span>
-                    <!-- 这里表示总体状态: not done -->
-                    warning
+                    <a-tooltip :content="allStatus ? '您已全部填写' : '还有未填写项目'">
+                        <span class="text-green-500" v-if="allStatus">
+                            <icon-check-circle-fill />
+                        </span>
+                        <span class="text-red-500" v-else><icon-exclamation-circle-fill /></span>
+                    </a-tooltip>
                 </a-space>
             </a-button>
             <template #content>
-                <a-doption @click="ClickSoftSummary">软件概述</a-doption>
-                <a-doption>软件接口信息</a-doption>
+                <template v-for="item in inputOptions" :key="item.name">
+                    <template v-if="!item.status">
+                        <a-tooltip :content="`还未录入${item.title}`">
+                            <a-doption @click="item.handler">
+                                <span class="mr-1">{{ item.title }}</span>
+                                <span class="text-red-500"><icon-exclamation-circle-fill /></span>
+                            </a-doption>
+                        </a-tooltip>
+                    </template>
+                    <template v-else>
+                        <a-doption @click="item.handler">
+                            <span class="mr-1">{{ item.title }}</span>
+                            <span class="text-green-500"><icon-check-circle-fill /></span>
+                        </a-doption>
+                    </template>
+                </template>
             </template>
         </a-dropdown>
-        <project-modal ref="projectModalRef" />
+        <project-modal ref="projectModalRef" :reset="fetchAllStatus" />
     </div>
 </template>
 
 <script setup lang="ts">
-import { ref } from "vue"
+import { computed, onMounted, ref } from "vue"
 import ProjectModal from "./projectModal/index.vue"
+import projectApi from "@/api/project/project"
+import { useRoute } from "vue-router"
+import { Message } from "@arco-design/web-vue"
+
+const route = useRoute()
 
 // ref
 const projectModalRef = ref<InstanceType<typeof ProjectModal> | null>(null)
 
 // events
-const ClickSoftSummary = async ()=>{
+const clickSoftSummary = async () => {
     projectModalRef.value?.open()
 }
 
+// 进入页面时候请求知道各项目样式情况-ref
+const fetchAllStatus = async () => {
+    try {
+        const { data }: { data: Object } = await projectApi.getAllStatus(route.query.id)
+        inputOptions.value = inputOptions.value.map((it) => {
+            if (data.hasOwnProperty(it.name)) {
+                it.status = data[it.name]
+            }
+            return { ...it }
+        })
+    } catch (e) {
+        Message.error("查询项目级信息是否填写失败，请检查网络")
+    }
+}
+
+onMounted(async () => {
+    await fetchAllStatus()
+})
+
+const inputOptions = ref([
+    {
+        name: "soft_summary",
+        title: "软件概述",
+        status: false,
+        handler: clickSoftSummary
+    },
+    {
+        name: "static_soft_item",
+        title: "接口图",
+        status: true,
+        handler: () => {
+            console.log("暂未实现")
+        }
+    }
+])
+const allStatus = computed(() => inputOptions.value.every((item) => item.status))
+
 defineOptions({
     name: "ProjectInfoOther"
 })

cdTMP/src/layout/components/projectInfoOther/projectModal/hooks/useTable.tsx

@@ -5,7 +5,7 @@ import ImageInput from "../ImageInput/index.vue"
 // wordlike组件
 import WordLikeTable from "../wordLikeTable/index.vue"
 
-export default function useTable() {
+export default function useTable(reset: Function) {
     const columns = reactive<TableColumnData[]>([
         {
             title: "类型",
@@ -69,6 +69,8 @@ export default function useTable() {
     // 卸载时清空数据
     const handleOnClose = () => {
         data.value = [{ ...initalRowData }]
+        // 更新展示状态
+        reset()
     }
 
     // 数据定义 - 测试

cdTMP/src/layout/components/projectInfoOther/projectModal/index.vue

@@ -42,10 +42,14 @@ const { proxy } = getCurrentInstance() as any
 
 const route = useRoute()
 
+const { reset } = defineProps<{
+    reset: () => void
+}>()
+
 const visible = ref(false)
 const title = ref("软件概述-新增")
 
-const { columns, data, handleChange, addTextRow, addPicRow, addTableRow, handleOnClose } = useTable()
+const { columns, data, handleChange, addTextRow, addPicRow, addTableRow, handleOnClose } = useTable(reset)
 
 const handleSyncOk = async () => {
     try {