项目类型设置修改

src/renderer/src/views/system2/model.vue

@@ -15,7 +15,7 @@
                             v-else
                             v-model="item.dictValue"
                             size="small"
-                            class="w-32"
+                            class="h-32px w-32"
                         />
                         <div>
                             <HcIcon
@@ -46,7 +46,14 @@
                 <div v-for="(item, index) in dealForm.list" :key="index" class="hc-form-item mb-2 items-center justify-center">
                     <div class="w-full flex items-center">
                         <div class="mr-2 whitespace-nowrap">选项{{ index + 1 }}</div>
-                        <el-input v-model="item.dictValue" clearable placeholder="请输入" />
+                        <el-input v-if="item.isEditing" v-model="item.dictValue" clearable placeholder="请输入" class="inSmallInput" />
+                        <span v-else class="type-list-item-1">{{ item.dictValue }}</span>
+                        <HcIcon
+                                
+                            :name="item.isEditing ? 'save' : 'edit'"
+                            class="ml-2 cursor-pointer text-xl text-blue-500"
+                            @click.stop="item.isEditing ? saveInEdit(item) : startInEdit(item)" 
+                        />
                         <HcIcon v-del-com:[deleteOption]="item" name="close" class="ml-2 cursor-pointer text-2xl text-red" />
                     </div>
                 </div>
@@ -60,7 +67,7 @@
 </template>
 
 <script setup>
-import { onMounted, ref } from 'vue'
+import { nextTick, onMounted, ref } from 'vue'
 import { deepClone, formValidate, getArrValue } from 'js-fast-way'
 import { getDictionary, remove, submit, submitList } from '~api/dictbiz.js'
 
@@ -138,6 +145,10 @@ const formRef = ref(null)
 
 const startEdit = (item) => {
     item.isEditing = true
+    nextTick(() => {
+        const input = document.querySelector('.h-32px.w-32 input')
+        if (input) input.focus()
+    })
 }
 const saveEditLoading = ref(false)
 const saveEdit = async (item) => {
@@ -159,8 +170,35 @@ const saveEdit = async (item) => {
        
     } 
 }
+const saveInEdit = async (item) => {
+    saveEditLoading.value = true
+    const { error, code, msg } = await submit({
+        dictValue:item.dictValue,
+        code:'ibaRouteType',
+        systemType:2,
+        parentId:dealForm.value.id,
+        id:item.id,
+      
+    })
+    //判断状态
+    saveEditLoading.value = false
+    if (!error && code === 200) {
+        window?.$message?.success(msg)
+      
+        await getTypeListData(dealForm.value.id, 'ibaRouteType') // 重新加载路线类型列表
+        await getTypeListData(1, 'ibaProjectType') // 重新加载项目类型列表
+       
+    } 
+}
+const startInEdit = async (item) => {
+    item.isEditing = true
+    nextTick(() => {
+        const input = document.querySelector('.inSmallInput input')
+        if (input) input.focus()
+    })
+}
 const typeClick = async (item) => {
-    console.log(item)
+
     dealForm.value = deepClone(item)
     dealForm.value.list = []
    await getTypeListData(dealForm.value.id, 'ibaRouteType')
@@ -170,7 +208,7 @@ const dealModal = ref(false)
 const dealForm = ref({})
 const dealFormRef = ref(null)
 const addItemClick = () => {
-    dealForm.value.list.push({ dictValue:'', parentId:dealForm.value.id, code:'ibaRouteType', systemType:2 })
+    dealForm.value.list.push({ dictValue:'', parentId:dealForm.value.id, code:'ibaRouteType', systemType:2, isEditing:true })
 }
 const dealModalLoading = ref(false)
 const dealModalSubmit = async () => {
@@ -249,5 +287,24 @@ const deleteOption = async ({ item }, resolve) => {
             border-color: #c0c4cc;
         }
     }
+        
+
 }
+.type-list-item-1 {
+        width: 100%;
+        cursor: pointer;
+        padding: 5px 15px;
+        border: 1px solid #dcdfe6;
+        border-radius: 4px;
+        background-color: #fff;
+        // height: 32px;
+        line-height: 32px;
+        color: #606266;
+        transition: border-color 0.2s;
+        justify-items: center;
+        
+        &:hover {
+            border-color: #c0c4cc;
+        }
+    }
 </style>