双击详情完成

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

@@ -25,21 +25,18 @@
 
 <script setup lang="jsx">
 import { ref } from "vue"
+import useCrudOptions from "@/views/project/dut/hooks/useCrudOptions"
+import useColumns from "./hooks/useColumns"
 import { useRoute } from "vue-router"
-import designDemandApi from "@/api/project/designDemand"
 import dutApi from "@/api/project/dut"
 import commonApi from "@/api/common"
-import { useTreeDataStore } from "@/store"
 import FileInputModal from "./components/FileInputModal/index.vue"
-const treeDataStore = useTreeDataStore()
 const route = useRoute()
 const crudRef = ref()
-const roundNumber = route.query.key.split("-")[0]
-const dutNumber = route.query.key.split("-")[1]
 const projectId = ref(route.query.id)
 // 5月8日修改设计需求标识就按SJ-FT-设计需求标识来
 const demandTypeDict = ref([])
-!(function () {
+;(function () {
     commonApi.getDict("demandType").then((res) => {
         demandTypeDict.value = res
     })
@@ -63,175 +60,8 @@ const showType = (record) => {
     }
 }
 // crud组件
-const crudOptions = ref({
-    api: designDemandApi.getDesignDemandList,
-    add: { show: true, api: designDemandApi.save, text: "新增设计需求" },
-    edit: { show: true, api: designDemandApi.editDesignDemand, text: "编辑设计需求" },
-    delete: { show: true, api: designDemandApi.delete },
-    // 处理添加后函数
-    beforeOpenAdd: function () {
-        let key_split = route.query.key.split("-")
-        let round_key = key_split[0]
-        let dut_key = key_split[1]
-        let td = treeDataStore.treeData
-        crudRef.value.crudFormRef.actionTitle = `${route.query.ident} > ${td[round_key].title} > ${td[round_key].children[dut_key].title} > 设计需求-`
-        return true
-    },
-    beforeOpenEdit: function (record) {
-        let key_split = route.query.key.split("-")
-        let round_key = key_split[0]
-        let dut_key = key_split[1]
-        let td = treeDataStore.treeData
-        crudRef.value.crudFormRef.actionTitle = `${route.query.ident} > ${td[round_key].title} > ${td[round_key].children[dut_key].title} >设计需求[${record.name}]-`
-        return true
-    },
-    afterAdd: (res) => {
-        let id = projectId.value
-        treeDataStore.updateDesignDemandTreeData(res.data, id)
-    },
-    afterEdit: (res) => {
-        let id = projectId.value
-        treeDataStore.updateDesignDemandTreeData(res.data, id)
-    },
-    afterDelete: (res, record) => {
-        let id = projectId.value
-        if (!record) {
-            record = { key: route.query.key + "-X" }
-        }
-        treeDataStore.updateDesignDemandTreeData(record, id)
-        // 删除后情况行选择器
-        crudRef.value.tableRef.selectAll(false)
-    },
-    parameters: {
-        projectId: route.query.id,
-        round: roundNumber,
-        dut: dutNumber
-    },
-    showIndex: false,
-    rowSelection: { showCheckedAll: true },
-    searchColNumber: 4,
-    tablePagination: false,
-    operationColumnWidth: 250,
-    operationColumn: true,
-    operationColumnAlign: "center",
-    formOption: {
-        width: 1200
-    },
-    showTools: false
-})
-const crudColumns = ref([
-    {
-        title: "ID",
-        align: "center",
-        width: 50,
-        hide: true,
-        dataIndex: "id",
-        commonRules: [{ required: true, message: "ID必填" }],
-        validateTrigger: "blur"
-    },
-    {
-        title: "设需标识",
-        align: "center",
-        sortable: { sortDirections: ["ascend"] },
-        width: 180,
-        dataIndex: "ident",
-        search: true,
-        validateTrigger: "blur",
-        placeholder: "请输入文档中设计需求的标识",
-        help: '若不知道则填"无"或不填',
-        openPrepend: true
-    },
-    {
-        title: "设需名称",
-        align: "center",
-        width: 200,
-        dataIndex: "name",
-        search: true,
-        commonRules: [{ required: true, message: "设计需求名称是必填" }],
-        validateTrigger: "blur"
-    },
-    {
-        title: "章节号",
-        align: "center",
-        width: 150,
-        dataIndex: "chapter",
-        search: true,
-        help: '若为隐含需求则填"/"'
-    },
-    {
-        title: "需求类型",
-        width: 150,
-        align: "center",
-        dataIndex: "demandType",
-        addDefaultValue: "1",
-        formType: "radio",
-        search: true,
-        dict: { name: "demandType", props: { label: "title", value: "key" }, translation: true },
-        commonRules: [{ required: true, message: "需求类型是必填" }],
-        validateTrigger: "blur",
-        // 主要为了添加“接口”的4个字段
-        onControl: (value) => {
-            if (value === "3") {
-                return {
-                    source: { display: true },
-                    to: { display: true },
-                    type: { display: true },
-                    protocal: { display: true }
-                }
-            } else {
-                return {
-                    source: { display: false },
-                    to: { display: false },
-                    type: { display: false },
-                    protocal: { display: false }
-                }
-            }
-        }
-    },
-    {
-        formType: "grid-tailwind",
-        customClass: [],
-        colNumber: 2,
-        cols: [
-            {
-                formList: [
-                    {
-                        title: "接口来源",
-                        dataIndex: "source",
-                        hide: true
-                    },
-                    {
-                        title: "目的地",
-                        dataIndex: "to",
-                        hide: true
-                    }
-                ]
-            },
-            {
-                formList: [
-                    {
-                        title: "接口类型",
-                        dataIndex: "type",
-                        hide: true
-                    },
-                    {
-                        title: "接口内容",
-                        dataIndex: "protocal",
-                        hide: true
-                    }
-                ]
-            }
-        ]
-    },
-    {
-        title: "需求描述",
-        dataIndex: "description",
-        hide: true,
-        width: 300,
-        formType: "editor",
-        height: 300
-    }
-])
+const crudOptions = useCrudOptions(crudRef)
+const crudColumns = useColumns(crudRef)
 // ~~~大功能打开ma-form-modal~~~
 const fileInputRef = ref(null)
 const handleAddFileInputDemand = () => {