5566

cdTMP/src/api/project/round.js

@@ -0,0 +1,14 @@
+import { request } from "@/api/request"
+export default {
+    /**
+     * 根据项目名、第{roundNumber}查询该轮次信息
+     * @returns 返回一个轮次的信息
+     */
+    getOneRoundInfo(params = {}) {
+        return request({
+            url: "/project/getOneRoundInfo",
+            method: "get",
+            params
+        })
+    }
+}

cdTMP/src/components/ma-form-modal/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <a-modal v-model:visible="modal.visible" :on-before-ok="modal.submit" unmount-on-close @cancel="modal.cancel">
+    <a-modal v-model:visible="modal.visible" :on-before-ok="modal.submit" unmount-on-close @cancel="modal.cancel" :width="width">
         <template #title>
             {{ prop.title }}
         </template>
@@ -24,7 +24,8 @@ const prop = defineProps({
     column: { type: Array, default: [] }, // ma-form字段
     default_visible: { type: Boolean, default: false }, // 默认隐藏
     options: { type: Object, default: {} }, // ma-form 属性
-    submit: { type: Function, default: () => {} }
+    submit: { type: Function, default: () => {} },
+    width :{ type:String, default:("1000"+'px')}
 })
 
 const maFormRef = ref()

cdTMP/src/layout/project-layout.vue

@@ -11,10 +11,9 @@
                             <a-input style="height: 32px" v-model="searchKey" allow-clear></a-input>
                             <a-button @click="handleSearchTreeDataClick">搜索</a-button>
                         </a-input-group>
-                        <a-input-group class="mb-2 w-full flex items-center justify-between" size="mini">
+                        <a-alert title="提示" style="margin-bottom: 10px" class="mt-0 py-1"
-                            <a-button class="w-1/2" type="primary">增加轮次</a-button>
+                            >空搜索需要点击搜索按钮</a-alert
-                            <a-button class="w-1/2" type="primary" status="danger">删除轮次</a-button>
+                        >
-                        </a-input-group>
                         <a-tree
                             :data="treeData"
                             size="small"
@@ -26,7 +25,47 @@
                             ref="treeRef"
                             border
                             :default-selected-keys="[currentNode ? currentNode : route.query.key]"
-                        ></a-tree>
+                        >
+                            <!-- 在轮次节点可以新增、编辑、删除、复制 -->
+                            <template #extra="nodeData">
+                                <template v-if="nodeData.level === '0'">
+                                    <a-tooltip content="点击新增轮次">
+                                        <IconPlus
+                                            style="
+                                                position: absolute;
+                                                right: 8px;
+                                                font-size: 12px;
+                                                top: 8px;
+                                                color: #3370ff;
+                                            "
+                                            @click="() => handleRoundAddClick(nodeData)"
+                                        />
+                                    </a-tooltip>
+                                    <a-tooltip content="点击删除轮次"
+                                        ><IconMinus
+                                            style="
+                                                position: absolute;
+                                                right: 25px;
+                                                font-size: 12px;
+                                                top: 8px;
+                                                color: #3370ff;
+                                            "
+                                            @click="() => handleRoundDelClick(nodeData)"
+                                    /></a-tooltip>
+                                    <a-tooltip content="点击编辑当前轮次"
+                                        ><IconEdit
+                                            style="
+                                                position: absolute;
+                                                right: 42px;
+                                                font-size: 12px;
+                                                top: 8px;
+                                                color: #3370ff;
+                                            "
+                                            @click="() => handleRoundEditClick(nodeData)"
+                                    /></a-tooltip>
+                                </template>
+                            </template>
+                        </a-tree>
                     </div>
                 </a-layout-sider>
                 <a-layout class="layout-content">
@@ -37,23 +76,32 @@
             </a-layout>
         </a-layout>
     </a-layout>
+    <ma-form-modal
+        ref="maFormModalRef"
+        :title="title"
+        :column="roundColumn"
+        :options="roundOption"
+        width="800px"
+    ></ma-form-modal>
 </template>
 
 <script setup>
 import { provide, ref, onMounted } from "vue"
 import NavBar from "@/layout/components/navbar.vue"
 import PageLayout from "@/layout/page-layout.vue"
+import MaFormModal from "@/components/ma-form-modal/index.vue"
 import projectApi from "@/api/project/project"
+import roundApi from "@/api/project/round"
 import { useRoute } from "vue-router"
 import { useRouter } from "vue-router"
 import { useTreeDataStore } from "@/store"
 import { storeToRefs } from "pinia"
-// 缩小后的menu菜单
+//~~~~ 缩小后的menu菜单
 const drawerVisible = ref(false)
 provide("toggleDrawerMenu", () => {
     drawerVisible.value = !drawerVisible.value
 })
-// 搜索绑定与搜索按钮点击
+//~~~~ 搜索绑定与搜索按钮点击
 const searchKey = ref("")
 const handleSearchTreeDataClick = () => {
     const loop = (itemdata) => {
@@ -81,7 +129,7 @@ const handleSearchTreeDataClick = () => {
         treeData.value = treeDataStore.originTreeData
     }
 }
-// 树状
+//~~~~ 树状组件
 /// 初始化round轮次数据
 const treeDataStore = useTreeDataStore()
 const route = useRoute()
@@ -89,13 +137,13 @@ const router = useRouter()
 const treeRef = ref()
 const { treeData, currentNode } = storeToRefs(treeDataStore)
 const projectInfo = ref({ ...route.query })
-const projectId = ref(route.query.projectId)
+const projectId = ref(route.query.id)
 onMounted(async () => {
     treeDataStore.initTreeData(projectId)
 })
 /// 点击树状节点-参数1:节点数组，参数2:树node对象
 const pointNode = (value, data) => {
-    console.log(data.node);
+    console.log(data.node)
     if (data.node.level === "0") {
         router.push({ name: "round", query: { ...projectInfo.value, key: data.node.key } })
     }
@@ -155,6 +203,168 @@ const loadMore = (nodeData) => {
         })
     }
 }
+
+//~~~~ 表单弹窗组件功能
+const maFormModalRef = ref()
+const title = ref("")
+/// 点击新增轮次按钮
+const handleRoundAddClick = (nodeData) => {
+    // 这里是文档写错了
+    console.log(maFormModalRef.value.form);
+    maFormModalRef.value.form = {}
+    maFormModalRef.value.open({})
+}
+/// 点击编辑轮次按钮
+const handleRoundEditClick = async (nodeData) => {
+    const data = await roundApi.getOneRoundInfo({
+        projectId: projectId.value,
+        round: nodeData.key
+    })
+    maFormModalRef.value.open(data.data)
+    title.value = `编辑轮次:${data.data.name}`
+}
+/// 点击删除轮次按钮
+const handleRoundDelClick = () => {
+    console.log("删除轮次")
+}
+/// 设置轮次弹窗的列信息
+const roundColumn = ref([
+    {
+        title: "基本信息",
+        customClass: ["mb-2", "pb-0"],
+        formType: "card",
+        bodyStyle: { paddingBottom: 0 },
+        formList: [
+            {
+                formType: "grid",
+                cols: [
+                    {
+                        span: 12,
+                        formList: [
+                            { title: "标识", dataIndex: "ident" },
+                            {
+                                title: "开始时间",
+                                dataIndex: "beginTime",
+                                formType: "date",
+                                placeholder: "请选择时间",
+                                rules: [{ required: true, message: "开始时间必填" }]
+                            },
+                            {
+                                title: "速度等级",
+                                dataIndex: "speedGrade",
+                                placeholder: "请填入速度等级",
+                                rules: [{ required: true, message: "速度等级必填" }]
+                            }
+                        ]
+                    },
+                    {
+                        span: 12,
+                        formList: [
+                            { title: "名称", dataIndex: "name" },
+                            {
+                                title: "结束时间",
+                                dataIndex: "endTime",
+                                formType: "date",
+                                placeholder: "请选择时间",
+                                rules: [{ required: true, message: "结束时间必填" }]
+                            },
+                            {
+                                title: "封装",
+                                dataIndex: "package",
+                                placeholder: "请填入封装",
+                                rules: [{ required: true, message: "封装必填" }]
+                            }
+                        ]
+                    }
+                ]
+            }
+        ]
+    },
+    {
+        title: "质量等级",
+        dataIndex: "grade",
+        formType: "radio",
+        dict: {
+            data: [
+                { label: "军级", value: "1" },
+                { label: "商业级", value: "2" },
+                { label: "宇航级", value: "3" },
+                { label: "工业级", value: "4" }
+            ]
+        },
+        placeholder: "请填入质量等级",
+        rules: [{ required: true, message: "质量等级必填" }]
+    },
+    {
+        formType: "card",
+        title: "极端工况信息",
+        customClass: ["mb-2", "pb-0"],
+        bodyStyle: { paddingBottom: 0 },
+        formList: [
+            {
+                formType: "divider",
+                title: "最好工况",
+                orientation: "left",
+                margin: "20px"
+            },
+            {
+                formType: "grid",
+                cols: [
+                    {
+                        span: 12,
+                        formList: [{ title: "电压", dataIndex: "best_condition_voltage", placeholder: "请填入电压" }]
+                    },
+                    {
+                        span: 12,
+                        formList: [{ title: "温度", dataIndex: "best_condition_tem", placeholder: "请填入温度" }]
+                    }
+                ]
+            },
+            {
+                formType: "divider",
+                title: "典型工况",
+                orientation: "left",
+                margin: "20px"
+            },
+            {
+                formType: "grid",
+                cols: [
+                    {
+                        span: 12,
+                        formList: [{ title: "电压", dataIndex: "typical_condition_voltage", placeholder: "请填入电压" }]
+                    },
+                    {
+                        span: 12,
+                        formList: [{ title: "温度", dataIndex: "typical_condition_tem", placeholder: "请填入温度" }]
+                    }
+                ]
+            },
+            {
+                formType: "divider",
+                title: "最差工况",
+                orientation: "left",
+                margin: "20px"
+            },
+            {
+                formType: "grid",
+                cols: [
+                    {
+                        span: 12,
+                        formList: [{ title: "电压", dataIndex: "low_condition_voltage", placeholder: "请填入电压" }]
+                    },
+                    {
+                        span: 12,
+                        formList: [{ title: "温度", dataIndex: "low_condition_tem", placeholder: "请填入温度" }]
+                    }
+                ]
+            }
+        ]
+    }
+])
+/// 表单的option
+const roundOption = ref({
+    customClass: [""]
+})
 </script>
 
 <style lang="less" scoped>

cdTMP/src/views/project/round/index.vue

@@ -2,7 +2,41 @@
     <div class="ma-content-block lg:flex justify-between p-4">
         <div class="lg:w-full w-full lg:ml-4 mt-5 lg:mt-0">
             <!-- CRUD组件 -->
-            <ma-crud :options="crudOptions" :columns="crudColumns"></ma-crud>
+            <ma-crud :options="crudOptions" :columns="crudColumns">
+                <template #total_code_line="{ record }">
+                    <template v-if="record.total_code_line">
+                        <a-statistic
+                            :animation-duration="1000"
+                            :value="parseInt(record.total_code_line)"
+                            animation
+                            :value-style="{ color: '#0fbf60' }"
+                        ></a-statistic>
+                    </template>
+                </template>
+                <template #total_line="{ record }">
+                    <template v-if="record.total_line">
+                        <a-statistic
+                            :animation-duration="1000"
+                            :value="parseInt(record.total_line)"
+                            animation
+                            :value-style="{ color: 'orange' }"
+                        ></a-statistic>
+                    </template>
+                </template>
+                <template #comment_line="{ record }">
+                    <template v-if="record.comment_line">
+                        <a-statistic
+                            :animation-duration="1000"
+                            :precision="2"
+                            :value="parseFloat(record.comment_line)"
+                            animation
+                            :value-style="{ color: 'lightblue' }"
+                        >
+                            <template #suffix> % </template>
+                        </a-statistic>
+                    </template>
+                </template>
+            </ma-crud>
         </div>
     </div>
 </template>
@@ -21,6 +55,7 @@ const crudOptions = ref({
         projectId: route.query.id,
         round: route.query.key
     },
+    operationWidth: 200,
     showIndex: false,
     rowSelection: { showCheckedAll: true },
     add: { show: true },
@@ -29,32 +64,78 @@ const crudOptions = ref({
     searchColNumber: 3,
     tablePagination: true,
     operationColumn: true,
+    operationColumnAlign: "center",
     formOption: {
-        width: 500
+        viewType: "drawer",
+        width: 600
     }
 })
+const beiceType = [
+    { label: "源代码", value: "SO" },
+    { label: "设计说明", value: "SJ" },
+    { label: "需求文档", value: "XQ" },
+    { label: "通信协议", value: "XY" }
+]
+
 const crudColumns = ref([
     {
         title: "ID",
         width: 50,
-        align:'center',
+        align: "center",
         dataIndex: "id",
         search: true,
-        commonRules: [{ required: true, message: "标识是必填" }],
+        commonRules: [{ required: true, message: "ID是必填" }],
         validateTrigger: "blur"
     },
     {
         title: "标识",
         width: 150,
-        align:'center',
+        align: "center",
         dataIndex: "ident",
         search: true,
         commonRules: [{ required: true, message: "标识是必填" }],
         validateTrigger: "blur"
     },
+    {
+        title: "被测类型",
+        align: "center",
+        dataIndex: "type",
+        search: true,
+        formType: "radio",
+        addDefaultValue: "SO",
+        dict: {
+            data: beiceType,
+            translation: true,
+            tagColors: { XQ: "blue", SO: "green", SJ: "orangered", XY: "pinkpurple" }
+        },
+        control: (value) => {
+            if (value === "SO") {
+                return {
+                    black_line: { display: true },
+                    pure_code_line: { display: true },
+                    mix_line: { display: true },
+                    total_comment_line: { display: true },
+                    total_code_line: { display: true },
+                    total_line: { display: true },
+                    comment_line: { display: true }
+                }
+            } else {
+                return {
+                    black_line: { display: false },
+                    pure_code_line: { display: false },
+                    mix_line: { display: false },
+                    total_comment_line: { display: false },
+                    total_code_line: { display: false },
+                    total_line: { display: false },
+                    comment_line: { display: false }
+                }
+            }
+        }
+    },
     {
         title: "被测件名",
         width: 120,
+        align: "center",
         dataIndex: "name",
         search: true,
         commonRules: [{ required: true, message: "需求名称是必填" }],
@@ -63,43 +144,43 @@ const crudColumns = ref([
     {
         title: "空行",
         hide: true,
-        align:'center',
+        align: "center",
         dataIndex: "black_line"
     },
     {
         title: "纯注释",
         hide: true,
-        align:'center',
+        align: "center",
         dataIndex: "pure_code_line"
     },
     {
         title: "混合行",
         hide: true,
-        align:'center',
+        align: "center",
         dataIndex: "mix_line"
     },
     {
         title: "总注释",
         hide: true,
-        align:'center',
+        align: "center",
         dataIndex: "total_comment_line"
     },
     {
         title: "总代码",
-        align:'center',
+        align: "center",
         dataIndex: "total_code_line"
     },
     {
         title: "总行数",
-        align:'center',
+        align: "center",
         dataIndex: "total_line"
     },
     {
         title: "注释率",
-        align:'center',
+        align: "center",
         dataIndex: "comment_line",
-        commonRules: [{ required: true, message: "注释率必填" }],
+        commonRules: [{ required: true, message: "注释率必填" }]
-    },
+    }
 ])
 </script>