From 09382319dffd53bfa390ad7cdc0fa8bf884f6e6a Mon Sep 17 00:00:00 2001
From: ks3356143 <314298729@qq.com>
Date: Mon, 12 Jun 2023 20:47:54 +0800
Subject: [PATCH] 3322

---
 cdTMP/src/api/project/project.js              |  30 +++++
 cdTMP/src/components/ma-treeSlider/index.vue  |   8 +-
 cdTMP/src/layout/components/navbar.vue        |  10 +-
 .../src/layout/components/project-tab-bar.vue |  89 +++++++++++++
 cdTMP/src/layout/project-layout.vue           | 123 +++++++++++++++++
 cdTMP/src/router/index.js                     |  17 ++-
 cdTMP/src/router/routes/base.js               |   3 +-
 cdTMP/src/router/routes/modules/dashboard.js  |   2 +-
 cdTMP/src/router/routes/modules/testmanage.js |   2 +-
 cdTMP/src/store/index.js                      |   9 +-
 .../projmanage/config/crudOptionsConfig.js    | 125 ------------------
 .../testmanage/projmanage/cpns/preview.vue    |   2 +-
 .../src/views/testmanage/projmanage/index.vue |   4 +-
 13 files changed, 289 insertions(+), 135 deletions(-)
 create mode 100644 cdTMP/src/api/project/project.js
 create mode 100644 cdTMP/src/layout/components/project-tab-bar.vue
 create mode 100644 cdTMP/src/layout/project-layout.vue
 delete mode 100644 cdTMP/src/views/testmanage/projmanage/config/crudOptionsConfig.js

diff --git a/cdTMP/src/api/project/project.js b/cdTMP/src/api/project/project.js
new file mode 100644
index 0000000..bfeafe3
--- /dev/null
+++ b/cdTMP/src/api/project/project.js
@@ -0,0 +1,30 @@
+import { request } from "@/api/request"
+
+export default {
+    /**
+     * 根据项目名确定round初始节点
+     * @returns round初始节点
+     */
+    getRoundInfo(projectId) {
+        return request({
+            url: `project/getRoundInfo/${projectId}`,
+            method: "get"
+        })
+    },
+
+    /**
+     * 根据项目名、轮次round查询轮次下面的设计需求
+     * @returns 设计需求树状节点信息
+     */
+    getDemandInfo(projectId, key, level) {
+        return request({
+            url: `project/getdemandInfo`,
+            method: "get",
+            params: {
+                projectId: projectId,
+                key: key,
+                level: level
+            }
+        })
+    }
+}
diff --git a/cdTMP/src/components/ma-treeSlider/index.vue b/cdTMP/src/components/ma-treeSlider/index.vue
index cb3edab..25a7353 100644
--- a/cdTMP/src/components/ma-treeSlider/index.vue
+++ b/cdTMP/src/components/ma-treeSlider/index.vue
@@ -1,7 +1,13 @@
 <template>
     <div class="flex flex-col w-full h-full">
         <a-input-group class="mb-2 w-full flex items-center" size="mini">
-            <a-input :placeholder="props?.searchPlaceholder" allow-clear @input="changeKeyword" @clear="resetData" />
+            <a-input
+                :placeholder="props?.searchPlaceholder"
+                allow-clear
+                @input="changeKeyword"
+                @clear="resetData"
+                style="height: 100%"
+            />
             <a-button
                 @click="
                     () => {
diff --git a/cdTMP/src/layout/components/navbar.vue b/cdTMP/src/layout/components/navbar.vue
index fd6b066..a9c6a02 100644
--- a/cdTMP/src/layout/components/navbar.vue
+++ b/cdTMP/src/layout/components/navbar.vue
@@ -13,7 +13,8 @@
                 />
             </a-space>
         </div>
-        <div class="center-side">
+        <div class="center-side flex items-center justify-center">
+            {{ title }}
             <Menu v-if="topMenu"></Menu>
         </div>
         <ul class="right-side">
@@ -110,6 +111,13 @@ import useUser from "@/hooks/logout"
 import { Message } from "@arco-design/web-vue"
 import Menu from "@/layout/components/menu.vue"
 const appStore = useAppStore()
+// title管理-默认在后台
+const props = defineProps({
+    title: {
+        type: String,
+        default: ""
+    }
+})
 // 是否menu在顶部-暂时不用
 const topMenu = computed(() => appStore.topMenu && appStore.menu)
 // 全屏设置,使用了@vueuse/core
diff --git a/cdTMP/src/layout/components/project-tab-bar.vue b/cdTMP/src/layout/components/project-tab-bar.vue
new file mode 100644
index 0000000..962f9a7
--- /dev/null
+++ b/cdTMP/src/layout/components/project-tab-bar.vue
@@ -0,0 +1,89 @@
+<template>
+    <div class="tab-bar-container">
+        <a-affix ref="affixRef" :offset-top="offsetTop">
+            <div class="tab-bar-box">
+                <div class="tab-bar-scroll">
+                    <div class="tags-wrap">
+                        <tab-item v-for="(tag, index) in tagList" :key="tag.fullPath" :index="index" :item-data="tag" />
+                    </div>
+                </div>
+                <div class="tag-bar-operation"></div>
+            </div>
+        </a-affix>
+    </div>
+</template>
+
+<script setup>
+import { ref, computed, watch, onUnmounted } from "vue"
+import { listenerRouteChange, removeRouteListener } from "@/utils/route-listener"
+import { useAppStore, useProjectTabBarStore } from "@/store"
+import tabItem from "./tab-item.vue"
+
+const appStore = useAppStore()
+const tabBarStore = useProjectTabBarStore()
+
+const affixRef = ref()
+const tagList = computed(() => {
+    return tabBarStore.getTabList
+})
+const offsetTop = computed(() => {
+    return appStore.navbar ? 60 : 0
+})
+
+watch(
+    () => appStore.navbar,
+    () => {
+        affixRef.value.updatePosition()
+    }
+)
+listenerRouteChange((route) => {
+    if (!route.meta.noAffix && !tagList.value.some((tag) => tag.fullPath === route.fullPath)) {
+        tabBarStore.updateTabList(route)
+    }
+}, true)
+
+onUnmounted(() => {
+    removeRouteListener()
+})
+</script>
+
+<style scoped lang="less">
+.tab-bar-container {
+    position: relative;
+    background-color: var(--color-bg-2);
+    .tab-bar-box {
+        display: flex;
+        padding: 0 0 0 20px;
+        background-color: var(--color-bg-2);
+        border-bottom: 1px solid var(--color-border);
+        .tab-bar-scroll {
+            height: 32px;
+            flex: 1;
+            overflow: hidden;
+            .tags-wrap {
+                padding: 4px 0;
+                height: 48px;
+                white-space: nowrap;
+                overflow-x: auto;
+
+                :deep(.arco-tag) {
+                    display: inline-flex;
+                    align-items: center;
+                    margin-right: 6px;
+                    cursor: pointer;
+                    &:first-child {
+                        .arco-tag-close-btn {
+                            display: none;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    .tag-bar-operation {
+        width: 100px;
+        height: 32px;
+    }
+}
+</style>
diff --git a/cdTMP/src/layout/project-layout.vue b/cdTMP/src/layout/project-layout.vue
new file mode 100644
index 0000000..0ff6cbc
--- /dev/null
+++ b/cdTMP/src/layout/project-layout.vue
@@ -0,0 +1,123 @@
+<template>
+    <a-layout class="layout">
+        <div class="navbar layout-navbar">
+            <NavBar :title="$route.query.name" />
+        </div>
+        <a-layout class="layout">
+            <a-layout class="layout layout-demo">
+                <a-layout-sider class="layout-sider">
+                    <div class="p-2">
+                        <a-input-group class="mb-2 w-full flex items-center" size="mini">
+                            <a-input style="height: 32px"></a-input>
+                            <a-button>搜索</a-button>
+                        </a-input-group>
+                        <a-tree
+                            :data="treeData"
+                            size="small"
+                            block-node
+                            animation
+                            @select="pointNode"
+                            :load-more="loadMore"
+                            showLine
+                            ref="treeRef"
+                        ></a-tree>
+                    </div>
+                </a-layout-sider>
+            </a-layout>
+            <a-layout class="layout-content">
+                <a-layout-content class="work-area">
+                    <PageLayout />
+                </a-layout-content>
+            </a-layout>
+        </a-layout>
+    </a-layout>
+</template>
+
+<script setup>
+import { provide, ref, onMounted } from "vue"
+import NavBar from "@/layout/components/navbar.vue"
+import PageLayout from "@/layout/page-layout.vue"
+import projectApi from "@/api/project/project"
+import { useRoute } from "vue-router"
+// 缩小后的menu菜单
+const drawerVisible = ref(false)
+provide("toggleDrawerMenu", () => {
+    drawerVisible.value = !drawerVisible.value
+})
+// 树状
+/// 初始化round轮次数据
+const route = useRoute()
+const treeRef = ref()
+const treeData = ref([])
+const projectId = ref(route.query.id)
+onMounted(async () => {
+    const roundData = await projectApi.getRoundInfo(projectId)
+    treeData.value = roundData
+})
+/// 点击树状节点-参数传入为key的值
+const pointNode = (value, data) => {
+    console.log("点击的节点为:", value)
+    console.log(data.node)
+}
+/// 动态加载函数-参数当前节点点击下箭头
+const loadMore = (nodeData) => {
+    console.log("动态加载的节点为：", nodeData) // 输出点击节点的key,以及添加上去的level属性
+    return new Promise(async (resolve) => {
+        const res = await projectApi.getDemandInfo(route.query.id, nodeData.key, nodeData.level)
+        nodeData.children = res
+        resolve()
+    })
+}
+</script>
+
+<style lang="less" scoped>
+.tree {
+    height: 100%;
+}
+.layout-demo :deep(.arco-layout-sider) {
+    width: 300px !important;
+}
+.layout {
+    width: 100%;
+    height: 100%;
+}
+
+.layout-navbar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 100;
+    width: 100%;
+    height: 60px;
+}
+
+.layout-sider {
+    position: fixed;
+    top: 60px;
+    left: 0;
+    z-index: 99;
+    height: 100%;
+    transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+    &::after {
+        position: absolute;
+        top: 0;
+        right: -1px;
+        display: block;
+        width: 1px;
+        height: 100%;
+        background-color: var(--color-border);
+        content: "";
+    }
+
+    > :deep(.arco-layout-sider-children) {
+        overflow-y: hidden;
+    }
+}
+
+.layout-content {
+    min-height: 100vh;
+    overflow-y: auto;
+    background-color: var(--color-fill-2);
+    transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+}
+</style>
diff --git a/cdTMP/src/router/index.js b/cdTMP/src/router/index.js
index 449267d..523f3de 100644
--- a/cdTMP/src/router/index.js
+++ b/cdTMP/src/router/index.js
@@ -2,7 +2,7 @@ import { createRouter, createWebHistory } from "vue-router"
 // appRoutes为modules下面的所有路由
 import { appRoutes } from "./routes"
 // 引入基本重定向路由和notFound路由
-import { REDIRECT_MAIN, NOT_FOUND_ROUTE } from "./routes/base"
+import { REDIRECT_MAIN, NOT_FOUND_ROUTE, PROJECT_LAYOUT } from "./routes/base"
 import createRouteGuard from "@/router/guard/index"
 
 const router = createRouter({
@@ -20,6 +20,21 @@ const router = createRouter({
                 requiresAuth: false
             }
         },
+        // 项目工作区路由
+        {
+            path: "/project",
+            name: "project",
+            component: PROJECT_LAYOUT,
+            meta: {
+                requiresAuth: true,
+                roles: ["*"],
+                order: 0,
+                locale: "项目工作区",
+                icon: "icon-home"
+            },
+        },
+
+        // 后台管理的路由以及404和重定向路由
         ...appRoutes,
         REDIRECT_MAIN,
         NOT_FOUND_ROUTE
diff --git a/cdTMP/src/router/routes/base.js b/cdTMP/src/router/routes/base.js
index 16c68a1..8e83b85 100644
--- a/cdTMP/src/router/routes/base.js
+++ b/cdTMP/src/router/routes/base.js
@@ -4,7 +4,8 @@ import { REDIRECT_ROUTE_NAME } from "@/router/constants"
  * @description: import('@/layout/default-layout.vue')
  * @type: Promise对象
  */
-export const DEFAULT_LAYOUT = () => import('@/layout/default-layout.vue')
+export const DEFAULT_LAYOUT = () => import("@/layout/default-layout.vue")
+export const PROJECT_LAYOUT = () => import("@/layout/project-layout.vue")
 
 export const REDIRECT_MAIN = {
     path: "/redirect",
diff --git a/cdTMP/src/router/routes/modules/dashboard.js b/cdTMP/src/router/routes/modules/dashboard.js
index 930c369..a3eca44 100644
--- a/cdTMP/src/router/routes/modules/dashboard.js
+++ b/cdTMP/src/router/routes/modules/dashboard.js
@@ -7,7 +7,7 @@ const DASHBOARD = {
     meta: {
         requiresAuth: true,
         icon: "icon-home",
-        order: 0,
+        order: 99,
         locale: "首页"
     },
     children: [
diff --git a/cdTMP/src/router/routes/modules/testmanage.js b/cdTMP/src/router/routes/modules/testmanage.js
index a15e2a4..ba4443c 100644
--- a/cdTMP/src/router/routes/modules/testmanage.js
+++ b/cdTMP/src/router/routes/modules/testmanage.js
@@ -7,7 +7,7 @@ const TESTMANAGE = {
     meta: {
         requiresAuth: true,
         icon: "icon-apps",
-        order: 1,
+        order: 98,
         locale: "测试管理"
     },
     children: [
diff --git a/cdTMP/src/store/index.js b/cdTMP/src/store/index.js
index b85f6b7..134b54b 100644
--- a/cdTMP/src/store/index.js
+++ b/cdTMP/src/store/index.js
@@ -9,5 +9,12 @@ import useTagStore from "./modules/tag"
 
 const pinia = createPinia()
 
-export { useUserStore, useAppStore, useTabBarStore, useFormStore, useKeepAliveStore, useTagStore }
+export {
+    useUserStore,
+    useAppStore,
+    useTabBarStore,
+    useFormStore,
+    useKeepAliveStore,
+    useTagStore,
+}
 export default pinia
diff --git a/cdTMP/src/views/testmanage/projmanage/config/crudOptionsConfig.js b/cdTMP/src/views/testmanage/projmanage/config/crudOptionsConfig.js
deleted file mode 100644
index 53c2d8b..0000000
--- a/cdTMP/src/views/testmanage/projmanage/config/crudOptionsConfig.js
+++ /dev/null
@@ -1,125 +0,0 @@
-import projectApi from "@/api/testmanage/project"
-export const crudOptions = {
-    showIndex: false,
-    rowSelection: { showCheckedAll: true },
-    api: projectApi.getPageList,
-    add: { show: true },
-    edit: { show: true },
-    delete: { show: true },
-    searchColNumber: 3,
-    tablePagination: true,
-    operationColumn: true,
-    operationWidth: 200,
-    showIndex: false,
-    formOption: {
-        isFull: true,
-        layout: [
-            {
-                formType: "grid",
-                cols: [
-                    { span: 8, formList: [{ dataIndex: "ident" }] },
-                    { span: 8, formList: [{ dataIndex: "name" }] },
-                    { span: 8, formList: [{ dataIndex: "engin_model" }] }
-                ]
-            },
-            {
-                formType: "grid",
-                cols: [
-                    { span: 8, formList: [{ dataIndex: "section_system" }] },
-                    { span: 8, formList: [{ dataIndex: "sub_system" }] },
-                    { span: 8, formList: [{ dataIndex: "device" }] }
-                ]
-            },
-            {
-                formType: "divider"
-            },
-            {
-                formType: "grid",
-                cols: [
-                    { span: 8, formList: [{ dataIndex: "beginTime" }] },
-                    { span: 8, formList: [{ dataIndex: "endTime" }] },
-                    { span: 8, formList: [{ dataIndex: "duty_person" }] },
-                    { span: 8, formList: [{ dataIndex: "member" }] }
-                ]
-            },
-            {
-                formType: "grid",
-                cols: [{ span: 24, formList: [{ dataIndex: "security_level" }] }]
-            },
-            {
-                formType: "grid",
-                cols: [
-                    { span: 12, formList: [{ dataIndex: "test_level" }] },
-                    { span: 12, formList: [{ dataIndex: "plant_type" }] }
-                ]
-            },
-            {
-                formType: "grid",
-                cols: [{ span: 24, formList: [{ dataIndex: "report_type" }] }]
-            },
-            {
-                formType: "grid",
-                cols: [{ span: 24, formList: [{ dataIndex: "language" }] }]
-            },
-            {
-                formType: "grid",
-                cols: [{ span: 24, formList: [{ dataIndex: "standard" }] }]
-            },
-            {
-                formType: "grid-tailwind",
-                customClass: ["mt-0"],
-                colNumber: 3,
-                cols: [
-                    {
-                        formList: [
-                            {
-                                formType: "card",
-                                title: "委托方信息",
-                                customClass: ["mt-3", "mb-5", "mx-1"],
-                                formList: [
-                                    { dataIndex: "entrust_ident" },
-                                    { dataIndex: "entrust_legal" },
-                                    { dataIndex: "entrust_contact" },
-                                    { dataIndex: "entrust_contact_phone" },
-                                    { dataIndex: "entrust_email" }
-                                ]
-                            }
-                        ]
-                    },
-                    {
-                        formList: [
-                            {
-                                formType: "card",
-                                title: "研制方信息",
-                                customClass: ["mt-3", "mb-5", "mx-1"],
-                                formList: [
-                                    { dataIndex: "dev_ident" },
-                                    { dataIndex: "dev_legal" },
-                                    { dataIndex: "dev_contact" },
-                                    { dataIndex: "dev_contact_phone" },
-                                    { dataIndex: "dev_email" }
-                                ]
-                            }
-                        ]
-                    },
-                    {
-                        formList: [
-                            {
-                                formType: "card",
-                                title: "测评中心信息",
-                                customClass: ["mt-3", "mb-5", "mx-1"],
-                                formList: [
-                                    { dataIndex: "test_ident" },
-                                    { dataIndex: "test_legal" },
-                                    { dataIndex: "test_contact" },
-                                    { dataIndex: "test_contact_phone" },
-                                    { dataIndex: "test_email" }
-                                ]
-                            }
-                        ]
-                    }
-                ]
-            }
-        ]
-    }
-}
diff --git a/cdTMP/src/views/testmanage/projmanage/cpns/preview.vue b/cdTMP/src/views/testmanage/projmanage/cpns/preview.vue
index 376272f..13df213 100644
--- a/cdTMP/src/views/testmanage/projmanage/cpns/preview.vue
+++ b/cdTMP/src/views/testmanage/projmanage/cpns/preview.vue
@@ -2,7 +2,7 @@
     <!-- 描述列表组件 -->
     <a-modal width="1000px" v-model:visible="visible" :footer="false">
         <template #title>{{ previewRecord.name }}</template>
-        <ma-info :columns="columns" :data="previewRecord" column="3"></ma-info>
+        <ma-info :columns="columns" :data="previewRecord" :column="3"></ma-info>
     </a-modal>
 </template>
 
diff --git a/cdTMP/src/views/testmanage/projmanage/index.vue b/cdTMP/src/views/testmanage/projmanage/index.vue
index 3017660..00d9f8c 100644
--- a/cdTMP/src/views/testmanage/projmanage/index.vue
+++ b/cdTMP/src/views/testmanage/projmanage/index.vue
@@ -4,6 +4,7 @@
             <!-- ma-crud组件 -->
             <ma-crud :options="crudOptions" :columns="crudColumns" ref="crudRef">
                 <template #operationBeforeExtend="{ record }">
+                    <a-link @click="$router.push({ name: 'project', query: record })">进入工作区</a-link>
                     <a-link @click="previewRef.open(record, crudColumns)"><icon-eye />预览</a-link>
                 </template>
             </ma-crud>
@@ -11,7 +12,6 @@
         <preview ref="previewRef"></preview>
     </div>
 </template>
-
 <script lang="jsx" setup>
 import { ref } from "vue"
 import projectApi from "@/api/testmanage/project"
@@ -30,7 +30,7 @@ const crudOptions = ref({
     searchColNumber: 3,
     tablePagination: true,
     operationColumn: true,
-    operationWidth: 200,
+    operationWidth: 500,
     showIndex: false,
     formOption: {
         isFull: true,