职业技能管理-添加下级

src/views/menduner/system/skill/SkillForm.vue

@@ -13,21 +13,21 @@
       <el-form-item label="技能英文名称" prop="nameEn">
         <el-input v-model="formData.nameEn" placeholder="请输入技能英文名称" />
       </el-form-item>
-      <el-form-item label="上级id" prop="parentId">
+      <!-- <el-form-item label="上级" prop="parentId">
         <el-tree-select
           v-model="formData.parentId"
           :data="skillTree"
           :props="{...defaultProps, label: 'nameCn'}"
           check-strictly
           default-expand-all
-          placeholder="请选择上级id"
+          placeholder="请选择上级"
         />
-      </el-form-item>
-      <el-form-item label="层级" prop="level">
+      </el-form-item> -->
+      <!-- <el-form-item v-if="show" label="层级" prop="level">
         <el-radio-group v-model="formData.level">
-          <el-radio label="1">请选择字典生成</el-radio>
+          <el-radio value="1">请选择字典生成</el-radio>
         </el-radio-group>
-      </el-form-item>
+      </el-form-item> -->
     </el-form>
     <template #footer>
       <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
@@ -37,7 +37,7 @@
 </template>
 <script setup lang="ts">
 import { SkillApi, SkillVO } from '@/api/menduner/system/skill'
-import { defaultProps, handleTree } from '@/utils/tree'
+// import { defaultProps, handleTree } from '@/utils/tree'
 
 /** 职业技能 表单 */
 defineOptions({ name: 'SkillForm' })
@@ -53,22 +53,22 @@ const formData = ref({
   id: undefined,
   nameCn: undefined,
   nameEn: undefined,
-  parentId: undefined,
-  level: undefined
+  parentId: 0,
+  level: 0
 })
 const formRules = reactive({
 })
 const formRef = ref() // 表单 Ref
-const skillTree = ref() // 树形结构
+// const skillTree = ref() // 树形结构
 
 /** 打开弹窗 */
-const open = async (type: string, id?: number) => {
+const open = async (type: string, id?: number, level?: number) => {
   dialogVisible.value = true
   dialogTitle.value = t('action.' + type)
   formType.value = type
   resetForm()
   // 修改时，设置数据
-  if (id) {
+  if (id && !!level) {
     formLoading.value = true
     try {
       formData.value = await SkillApi.getSkill(id)
@@ -76,7 +76,12 @@ const open = async (type: string, id?: number) => {
       formLoading.value = false
     }
   }
-  await getSkillTree()
+  // await getSkillTree()
+  // 添加下级
+  if (level === 0) {
+    formData.value.level = Number(level) + 1
+    formData.value.parentId = id
+  }
 }
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
@@ -110,18 +115,18 @@ const resetForm = () => {
     id: undefined,
     nameCn: undefined,
     nameEn: undefined,
-    parentId: undefined,
-    level: undefined
+    parentId: 0,
+    level: 0
   }
   formRef.value?.resetFields()
 }
 
 /** 获得职业技能树 */
-const getSkillTree = async () => {
-  skillTree.value = []
-  const data = await SkillApi.getSkillList()
-  const root: Tree = { id: 0, name: '顶级职业技能', children: [] }
-  root.children = handleTree(data, 'id', 'parentId')
-  skillTree.value.push(root)
-}
+// const getSkillTree = async () => {
+//   skillTree.value = []
+//   const data = await SkillApi.getSkillList({})
+//   const root: Tree = { id: 0, name: '顶级职业技能', children: [] }
+//   root.children = handleTree(data, 'id', 'parentId')
+//   skillTree.value = handleTree(data, 'id', 'parentId')
+// }
 </script>

src/views/menduner/system/skill/index.vue

@@ -108,12 +108,14 @@
       />
       <el-table-column label="操作" align="center">
         <template #default="scope">
-          <!-- <el-button
+          <el-button
+            v-if="scope.row.level === 0"
             link
             type="primary"
+            @click="openForm('create', scope.row.id, scope.row.level)"
           >
             添加下级
-          </el-button> -->
+          </el-button>
           <el-button
             link
             type="primary"
@@ -199,8 +201,8 @@ const resetQuery = () => {
 
 /** 添加/修改操作 */
 const formRef = ref()
-const openForm = (type: string, id?: number) => {
-  formRef.value.open(type, id)
+const openForm = (type: string, id?: number, level?: number) => {
+  formRef.value.open(type, id, level)
 }
 
 /** 删除按钮操作 */
@@ -212,7 +214,9 @@ const handleDelete = async (id: number) => {
     await SkillApi.deleteSkill(id)
     message.success(t('common.delSuccess'))
     // 刷新列表
-    await getList()
+    setTimeout(async () => {
+      await getList()
+    }, 0)
   } catch {}
 }