6月7日

cdTMP/src/views/project/case/components/CaseModal.vue

@@ -0,0 +1,65 @@
+<template>
+    <div class="case-modal-container">
+        <a-modal v-model:visible="visible" draggable unmount-on-close hide-cancel ok-text="关闭" width="900px">
+            <template #title> 问题单关联用例列表 </template>
+            <div>
+                <a-list>
+                    <a-list-item v-for="(item, index) in transformData" :key="index">
+                        <a-descriptions :data="item.showData" :title="'用例名称：' + item.case" bordered :column="1" />
+                    </a-list-item>
+                </a-list>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script setup>
+import { ref, computed } from "vue"
+
+const visible = ref(false)
+// 数据储存在这里
+const data = ref([])
+// 转换为描述数据
+const transformData = computed(() => {
+    return data.value.map((item) => {
+        // 数组的每一项都要转为{ case:'xxx',showData:[{label:'xxx',value:'xxx2'}] }
+        const showData = []
+        for (let key in item) {
+            let showKey = key
+            if (key === "case") continue
+            if (key === "dut") {
+                showKey = "被测件"
+            }
+            if (key === "round") {
+                showKey = "轮次"
+            }
+            if (key === "design") {
+                showKey = "设计需求"
+            }
+            if (key === "demand") {
+                showKey = "测试项"
+            }
+            if (key === "demand_ident") {
+                showKey = "测试项标识"
+            }
+            showData.push({
+                label: showKey,
+                value: item[key]
+            })
+        }
+        return {
+            case: item.case,
+            showData
+        }
+    })
+})
+function open(caseList) {
+    visible.value = true
+    data.value = caseList
+}
+defineExpose({
+    open
+})
+</script>
+
+<style lang="less" scoped></style>

cdTMP/src/views/project/case/components/ProblemChoose.vue

@@ -23,7 +23,14 @@
                 <template #ident="{ record }">
                     {{ "PT_" + route.query.ident + "_" + record.ident.padStart(3, "0") }}
                 </template>
+                <!-- table按钮后置插槽：这里用于提醒 -->
+                <template #tableAfterButtons>
+                    <a-alert banner class="alert">
+                        表格问题单右键可以查看<span :style="{ color: 'red', fontWeight: 700 }">关联用例信息</span>
+                    </a-alert>
+                </template>
             </ma-crud>
+            <case-modal ref="caseModalRef"></case-modal>
         </div>
     </a-modal>
 </template>
@@ -31,8 +38,10 @@
 <script setup lang="jsx">
 import { ref } from "vue"
 import problemApi from "@/api/project/problem"
-import { Message } from "@arco-design/web-vue"
+import problemSingleApi from "@/api/project/singleProblem"
+import { Message, Notification } from "@arco-design/web-vue"
 import { useRoute, useRouter } from "vue-router"
+import CaseModal from "./CaseModal.vue"
 const route = useRoute()
 // 定义props
 const props = defineProps({
@@ -79,6 +88,7 @@ const handleRelatedChange = async (record) => {
 // 数据定义
 const crudRef = ref()
 const visible = ref(false)
+const caseModalRef = ref()
 
 // 定义open事件
 const open = (row) => {
@@ -113,6 +123,25 @@ const crudOptions = ref({
     operationColumn: true,
     operationColumnAlign: "center", // 操作列居中
     isDbClickEdit: false, // 双击不编辑当前列
+    contextMenu: {
+        enabled: true,
+        items: [
+            {
+                operation: "scancase",
+                icon: "icon-list",
+                text: "查看关联用例",
+                onCommand: async (args) => {
+                    const hang = args.record.hang
+                    const problemId = args.record.id
+                    if (hang) {
+                        Notification.warning("该问题单未关联用例")
+                    }
+                    const res = await problemSingleApi.getRelativeCases({ id: problemId })
+                    caseModalRef.value.open(res.data)
+                }
+            }
+        ]
+    },
     bordered: { cell: true },
     formOption: {
         width: 1000,
@@ -437,5 +466,10 @@ const columns = ref([
 // 暴露自己的open方法
 defineExpose({ open })
 </script>
-
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.alert {
+    max-height: 32px;
+    background-color: transparent;
+    user-select: none;
+}
+</style>

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

@@ -27,14 +27,14 @@
 
 <script setup lang="jsx">
 import { ref } from "vue"
-import { useRoute, useRouter } from "vue-router"
+import { useRoute } from "vue-router"
 import problemApi from "@/api/project/problem"
 import { useTreeDataStore } from "@/store"
 import ProblemChoose from "./components/ProblemChoose.vue"
 import { Message } from "@arco-design/web-vue"
 const treeDataStore = useTreeDataStore()
 const route = useRoute()
-const router = useRouter()
+// const router = useRouter()
 const roundNumber = route.query.key.split("-")[0]
 const dutNumber = route.query.key.split("-")[1]
 const designDemandNumber = route.query.key.split("-")[2]
@@ -59,6 +59,8 @@ const crudOptions = ref({
     edit: { show: true, api: problemApi.update },
     delete: { show: true, api: problemApi.delete },
     operationColumnAlign: "center", // 操作列居中
+    // 列表选项卡配置
+    tabs:{},
     beforeOpenAdd: function () {
         // 先判断是否已经有个问题单了，如果有则不让用户创建
         if (crudRef.value.getTableData().length >= 1) {
@@ -106,6 +108,7 @@ const crudOptions = ref({
     },
     showIndex: false,
     showTools: false,
+    operationColumnAlign:'center',
     rowSelection: { showCheckedAll: true },
     searchColNumber: 3,
     tablePagination: false,

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

@@ -37,6 +37,7 @@ const crudOptions = ref({
     add: { show: true, api: caseApi.save, text: "新增用例" },
     edit: { show: true, api: caseApi.update, text: "修改用例" },
     delete: { show: true, api: caseApi.delete },
+    operationColumnAlign:'center',
     // 处理新增删除后树状图显示
     beforeOpenAdd: function () {
         let key_split = route.query.key.split("-")