|
@@ -7,15 +7,22 @@
|
|
|
<el-radio-button :label="1">分类</el-radio-button>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="上级分类" prop="parentId">
|
|
|
- <el-cascader :options="typeData" :props="{ checkStrictly: true, multiple: false, emitPath: false, value: 'id', label: 'name' }" placeholder="请选择关联页面" clearable class="w100" v-model="formData.parentId"></el-cascader>
|
|
|
- </el-form-item>
|
|
|
<template v-if="formData.types===1">
|
|
|
+ <el-form-item label="上级分类" prop="parentId">
|
|
|
+ <el-cascader :options="[{
|
|
|
+ id: -1,
|
|
|
+ name: '根节点',
|
|
|
+ children: typeData
|
|
|
+ }]" :props="{ checkStrictly: true, multiple: false, emitPath: false, value: 'id', label: 'name' }" placeholder="请选择关联页面" clearable class="w100" v-model="formData.parentId"></el-cascader>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="分类名称" prop="name">
|
|
|
<el-input v-model="formData.name" placeholder="输入接口名称" />
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
+ <el-form-item label="上级分类" prop="parentId">
|
|
|
+ <el-cascader :options="typeData" :props="{ checkStrictly: true, multiple: false, emitPath: false, value: 'id', label: 'name' }" placeholder="请选择关联页面" clearable class="w100" v-model="formData.parentId"></el-cascader>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="关联页面" prop="menuIds">
|
|
|
<el-cascader :options="menuData" :props="{ checkStrictly: false, multiple: true, emitPath: false, value: 'id', label: 'title' }" placeholder="请选择关联页面" clearable class="w100" v-model="formData.menuIds"></el-cascader>
|
|
|
</el-form-item>
|
|
@@ -43,7 +50,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { ref, reactive, nextTick } from 'vue';
|
|
|
+import { ref, reactive, nextTick, watch } from 'vue';
|
|
|
import api from '/@/api/system';
|
|
|
import { ApiRow } from '/@/api/model/system/menu';
|
|
|
import { ruleRequired } from '/@/utils/validator';
|
|
@@ -71,6 +78,14 @@ const formData = reactive<ApiRow>({
|
|
|
...baseForm,
|
|
|
});
|
|
|
|
|
|
+// 切换分类时清空上级分类的选择。因为接口里不能选择跟分类节点
|
|
|
+watch(
|
|
|
+ () => formData.types,
|
|
|
+ () => {
|
|
|
+ formData.parentId = undefined
|
|
|
+ },
|
|
|
+);
|
|
|
+
|
|
|
const ruleForm = {
|
|
|
parentId: [ruleRequired('上级分类不能为空', 'change')],
|
|
|
menuIds: [ruleRequired('关联页面不能为空', 'change')],
|
|
@@ -105,11 +120,7 @@ const open = async (row: any) => {
|
|
|
resetForm();
|
|
|
showDialog.value = true;
|
|
|
api.api.getList({ types: 1, status: -1, }).then((res: any) => {
|
|
|
- typeData.value = [{
|
|
|
- id: -1,
|
|
|
- name: '主分类',
|
|
|
- children: res.Info
|
|
|
- }]
|
|
|
+ typeData.value = res.Info
|
|
|
});
|
|
|
nextTick(() => {
|
|
|
Object.assign(formData, { ...row });
|