github/magic-boot
github/magic-boot
3
0
Fork 0
mirror of https://gitee.com/ssssssss-team/magic-boot.git synced 2025-02-21 02:12:50 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

vue3-treeselect 改为 el-tree-select

Browse Source
This commit is contained in:
zegezy 2022-05-07 13:51:54 +08:00
parent 608e81c00c
commit 3443b4be80
19 changed files with 38 additions and 206 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

166
data/magic-api/api/系统管理/用户管理/所有机构.ms
View File

@ -4,8 +4,8 @@
"script" : null,
"groupId" : "4f0230049d7e4f39b1e0897cc0f46f9a",
"name" : "所有机构",
"createTime" : 1646490239474,
"updateTime" : 1642134606249,
"createTime" : null,
"updateTime" : 1651892081106,
"lock" : "0",
"createBy" : null,
"updateBy" : null,
@ -16,7 +16,7 @@
"requestBody" : "",
"headers" : [ ],
"paths" : [ ],
"responseBody" : "{\n \"code\": 200,\n \"message\": \"success\",\n \"data\": {\n \"list\": [{\n \"id\": \"4c37a80226134bce8bc91c8fc04a7d2f\",\n \"label\": \"<font color=\\\"yellow\\\">马小东公司</font>\",\n \"pid\": \"0\",\n \"children\": [{\n \"id\": \"81b5493cdb31477f9ceea85b2cd08f15\",\n \"label\": \"<font color=\\\"yellow\\\">马小东子公司</font>\",\n \"pid\": \"4c37a80226134bce8bc91c8fc04a7d2f\",\n \"children\": []\n }, {\n \"id\": \"31b365008f994e93850186126fce87cb\",\n \"label\": \"<font color=\\\"yellow\\\">马小东子公司2</font>\",\n \"pid\": \"4c37a80226134bce8bc91c8fc04a7d2f\",\n \"children\": []\n }]\n }, {\n \"id\": \"935126327e2a4f90b3f485f818f61ea5\",\n \"label\": \"<font color=\\\"yellow\\\">吕金泽公司</font>\",\n \"pid\": \"0\",\n \"children\": [{\n \"id\": \"1ae0299fc79b43c6b0ae2e14756ec41a\",\n \"label\": \"<font color=\\\"yellow\\\">吕金泽子公司</font>\",\n \"pid\": \"935126327e2a4f90b3f485f818f61ea5\",\n \"children\": []\n }]\n }],\n \"total\": 2\n },\n \"timestamp\": 1642134574553,\n \"executeTime\": 5\n}",
"responseBody" : "{\n \"code\": 402,\n \"message\": \"凭证已过期\",\n \"data\": null,\n \"timestamp\": 1651892073882,\n \"executeTime\": null\n}",
"description" : null,
"requestBodyDefinition" : null,
"responseBodyDefinition" : {
@ -32,7 +32,7 @@
"expression" : "",
"children" : [ {
"name" : "code",
"value" : "200",
"value" : "402",
"description" : "",
"required" : false,
"dataType" : "Integer",
@ -44,7 +44,7 @@
"children" : [ ]
}, {
"name" : "message",
"value" : "success",
"value" : "凭证已过期",
"description" : "",
"required" : false,
"dataType" : "String",
@ -56,7 +56,7 @@
"children" : [ ]
}, {
"name" : "data",
"value" : "",
"value" : "null",
"description" : "",
"required" : false,
"dataType" : "Object",
@ -65,154 +65,10 @@
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ {
"name" : "list",
"value" : "",
"description" : "",
"required" : false,
"dataType" : "Array",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ {
"name" : "",
"value" : "",
"description" : "",
"required" : false,
"dataType" : "Object",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ {
"name" : "id",
"value" : "4c37a80226134bce8bc91c8fc04a7d2f",
"description" : "",
"required" : false,
"dataType" : "String",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ ]
}, {
"name" : "label",
"value" : "<font color=\\\"yellow\\\">马小东公司</font>",
"description" : "",
"required" : false,
"dataType" : "String",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ ]
}, {
"name" : "pid",
"value" : "0",
"description" : "",
"required" : false,
"dataType" : "String",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ ]
}, {
"name" : "children",
"value" : "",
"description" : "",
"required" : false,
"dataType" : "Array",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ {
"name" : "",
"value" : "",
"description" : "",
"required" : false,
"dataType" : "Object",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ {
"name" : "id",
"value" : "81b5493cdb31477f9ceea85b2cd08f15",
"description" : "",
"required" : false,
"dataType" : "String",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ ]
}, {
"name" : "label",
"value" : "<font color=\\\"yellow\\\">马小东子公司</font>",
"description" : "",
"required" : false,
"dataType" : "String",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ ]
}, {
"name" : "pid",
"value" : "4c37a80226134bce8bc91c8fc04a7d2f",
"description" : "",
"required" : false,
"dataType" : "String",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ ]
}, {
"name" : "children",
"value" : "",
"description" : "",
"required" : false,
"dataType" : "Array",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ ]
} ]
} ]
} ]
} ]
}, {
"name" : "total",
"value" : "2",
"description" : "",
"required" : false,
"dataType" : "Integer",
"type" : null,
"defaultValue" : null,
"validateType" : "",
"error" : "",
"expression" : "",
"children" : [ ]
} ]
"children" : [ ]
}, {
"name" : "timestamp",
"value" : "1642134574553",
"value" : "1651892073882",
"description" : "",
"required" : false,
"dataType" : "Long",
@ -224,7 +80,7 @@
"children" : [ ]
}, {
"name" : "executeTime",
"value" : "5",
"value" : "null",
"description" : "",
"required" : false,
"dataType" : "Integer",
@ -238,8 +94,8 @@
}
}
================================
var toTree = (list,pid) => select t.*,toTree(list,t.id) children from list t where t.pid = pid
var list = toTree(db.select('select id,name label,pid from sys_office where is_del = 0 order by sort'),'0')
var toTree = (list,pid) => select t.*,toTree(list,t.value) children from list t where t.pid = pid
var list = toTree(db.select('select id value,name label,pid from sys_office where is_del = 0 order by sort'),'0')
return {
list: list,

28
data/magic-api/api/系统管理/组件/选择组件.ms
View File

@ -5,7 +5,7 @@
"groupId" : "6f106ebdee21489db34b956f7770ff03",
"name" : "选择组件",
"createTime" : null,
"updateTime" : 1648647253717,
"updateTime" : 1651902325727,
"lock" : "0",
"createBy" : null,
"updateBy" : null,
@ -16,7 +16,7 @@
"requestBody" : "",
"headers" : [ ],
"paths" : [ ],
"responseBody" : "{\n \"code\": 200,\n \"message\": \"success\",\n \"data\": [{\n \"id\": \"9bf92d503f4242d39a0f271c577aa3ac\",\n \"label\": \"系统管理\",\n \"children\": [{\n \"id\": \"6bee7576eea04963a573b21bb657784d\",\n \"label\": \"字典管理\",\n \"children\": [{\n \"id\": \"sys-dict-list\",\n \"label\": \"列表(sys-dict-list)\"\n }]\n }]\n }],\n \"timestamp\": 1648025200208,\n \"executeTime\": 14\n}",
"responseBody" : "{\n \"code\": 200,\n \"message\": \"success\",\n \"data\": [{\n \"value\": \"55ff62aa20144b7bb5c6dfb5d76c8139\",\n \"label\": \"数据管理(/data)\",\n \"children\": [{\n \"value\": \"eb5dbed949de4f50ba4bf59f483252a5\",\n \"label\": \"测试生成(/test)\",\n \"children\": [{\n \"id\": \"data-test-list\",\n \"label\": \"列表(/list)\"\n }]\n }]\n }],\n \"timestamp\": 1651902176780,\n \"executeTime\": 9\n}",
"description" : null,
"requestBodyDefinition" : null,
"responseBodyDefinition" : {
@ -77,8 +77,8 @@
"error" : "",
"expression" : "",
"children" : [ {
"name" : "id",
"value" : "9bf92d503f4242d39a0f271c577aa3ac",
"name" : "value",
"value" : "55ff62aa20144b7bb5c6dfb5d76c8139",
"description" : "",
"required" : false,
"dataType" : "String",
@ -90,7 +90,7 @@
"children" : [ ]
}, {
"name" : "label",
"value" : "系统管理",
"value" : "数据管理(/data)",
"description" : "",
"required" : false,
"dataType" : "String",
@ -123,8 +123,8 @@
"error" : "",
"expression" : "",
"children" : [ {
"name" : "id",
"value" : "6bee7576eea04963a573b21bb657784d",
"name" : "value",
"value" : "eb5dbed949de4f50ba4bf59f483252a5",
"description" : "",
"required" : false,
"dataType" : "String",
@ -136,7 +136,7 @@
"children" : [ ]
}, {
"name" : "label",
"value" : "字典管理",
"value" : "测试生成(/test)",
"description" : "",
"required" : false,
"dataType" : "String",
@ -170,7 +170,7 @@
"expression" : "",
"children" : [ {
"name" : "id",
"value" : "sys-dict-list",
"value" : "data-test-list",
"description" : "",
"required" : false,
"dataType" : "String",
@ -182,7 +182,7 @@
"children" : [ ]
}, {
"name" : "label",
"value" : "列表(sys-dict-list)",
"value" : "列表(/list)",
"description" : "",
"required" : false,
"dataType" : "String",
@ -200,7 +200,7 @@
} ]
}, {
"name" : "timestamp",
"value" : "1648025200208",
"value" : "1651902176780",
"description" : "",
"required" : false,
"dataType" : "Long",
@ -212,7 +212,7 @@
"children" : [ ]
}, {
"name" : "executeTime",
"value" : "14",
"value" : "9",
"description" : "",
"required" : false,
"dataType" : "Integer",
@ -230,7 +230,7 @@ import org.ssssssss.magicapi.utils.PathUtils
import org.ssssssss.magicapi.core.service.MagicResourceService
var getFiles = (groupId) => {
return MagicResourceService.listFiles(groupId).map(file => {
id: PathUtils.replaceSlash(String.format("%s/%s", MagicResourceService.getGroupPath(file.groupId), file.path)).replace(/^\//,'').replace(/\/\//, '/').replace('/', '-'),
value: PathUtils.replaceSlash(String.format("%s/%s", MagicResourceService.getGroupPath(file.groupId), file.path)).replace(/^\//,'').replace(/\/\//, '/').replace('/', '-'),
label: `${file.name}(${file.path})`
})
}
@ -238,7 +238,7 @@ var toTree = (children) => {
var treeData = []
children.forEach(it => {
var chi = {}
chi.id = it.node.id
chi.value = it.node.id
chi.label = `${it.node.name}(${it.node.path})`
if(it.children.length > 0){
chi.children = toTree(it.children)

3
magic-boot-ui/package.json
View File

@ -10,13 +10,12 @@
},
"dependencies": {
"axios": "^0.24.0",
"element-plus": "^2.1.7",
"element-plus": "^2.1.8",
"nprogress": "0.2.0",
"path-browserify": "^1.0.1",
"vue": "^3.2.25",
"vue-cropper": "^1.0.2",
"vue-router": "^4.0.0-0",
"vue3-treeselect": "^0.1.10",
"vuedraggable": "^4.1.0",
"xlsx": "^0.18.3"
},

0
magic-boot-ui/src/components/magic/basic/mb-pagination.vue → magic-boot-ui/src/components/magic/data/mb-pagination.vue
View File

0
magic-boot-ui/src/components/magic/basic/mb-search.vue → magic-boot-ui/src/components/magic/data/mb-search.vue
View File

0
magic-boot-ui/src/components/magic/basic/mb-table-column.vue → magic-boot-ui/src/components/magic/data/mb-table-column.vue
View File

0
magic-boot-ui/src/components/magic/basic/mb-table.vue → magic-boot-ui/src/components/magic/data/mb-table.vue
View File

0
magic-boot-ui/src/components/magic/form/mb-tree.vue → magic-boot-ui/src/components/magic/data/mb-tree.vue
View File

2
magic-boot-ui/src/components/magic/form/mb-treeselect.vue → magic-boot-ui/src/components/magic/data/mb-treeselect.vue
View File

@ -1,5 +1,5 @@
<template>
<treeselect v-model="selectValue" :options="options" :key="modelValue" :placeholder="placeholder || (itemLabel && '请选择' + itemLabel)" :show-count="true" v-bind="props.props" />
<el-tree-select v-model="selectValue" :data="options" :key="modelValue" :placeholder="placeholder || (itemLabel && '请选择' + itemLabel)" v-bind="props.props" />
</template>
<script setup>

0
magic-boot-ui/src/components/magic/basic/mb-dialog.vue → magic-boot-ui/src/components/magic/feedback/mb-dialog.vue
View File

0
magic-boot-ui/src/components/magic/advanced/mb-form.vue → magic-boot-ui/src/components/magic/template/mb-form.vue
View File

0
magic-boot-ui/src/components/magic/advanced/mb-list.vue → magic-boot-ui/src/components/magic/template/mb-list.vue
View File

3
magic-boot-ui/src/scripts/globalProperties.js
View File

@ -1,6 +1,4 @@
import * as PlusIcons from '@element-plus/icons-vue'
import Treeselect from 'vue3-treeselect'
import 'vue3-treeselect/dist/vue3-treeselect.css'
import request from './request'
import global from './global'
import common from './common'
@ -27,6 +25,5 @@ const install = (app) => {
for(var key in PlusIcons) {
app.component(`El${key}`, PlusIcons[key])
}
app.component('treeselect', Treeselect)
}
export default install

2
magic-boot-ui/src/scripts/treeTable.js
View File

@ -41,7 +41,7 @@ treeTable.genTree = (children) => {
for(var i in children){
var chi = {}
chi.label = children[i].name
chi.id = children[i].id
chi.value = children[i].id
if(children[i].children && children[i].children.length > 0){
chi.children = treeTable.genTree(children[i].children)
}

4
magic-boot-ui/src/views/lowcode/code-gen-form.vue
View File

@ -71,7 +71,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="上级菜单" prop="pid">
<treeselect v-model="genInfo.info.pid" :options="menuTree" :key="genInfo.info.pid" style="position: fixed;z-index:999999;width: 548px;" />
<el-tree-select v-model="genInfo.info.pid" :data="menuTree" :key="genInfo.info.pid" style="width: 100%" check-strictly />
</el-form-item>
</el-col>
<el-col :span="12">
@ -102,7 +102,7 @@
proxy.$get('/system/menu/tree').then(res => {
menuTree.value = [{
label: '根节点',
id: '0',
value: '0',
children: proxy.$treeTable.genTree(res.data.list)
}]
})

16
magic-boot-ui/src/views/system/menu/menu-form.vue
View File

@ -17,7 +17,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="上级菜单" prop="pid">
<treeselect v-model="temp.pid" :options="menuTree" :key="temp.pid" style="position: relative;z-index:999999;" />
<el-tree-select v-model="temp.pid" :data="menuTree" :key="temp.pid" style="width: 100%" check-strictly />
</el-form-item>
</el-col>
</el-row>
@ -28,15 +28,7 @@
<el-input v-model="temp.url" />
</el-form-item>
<el-form-item label="关联组件" prop="componentName" v-if="menuType == 'menu'">
<treeselect
v-model="temp.componentName"
:disable-branch-nodes="true"
:show-count="true"
placeholder=""
:options="componentTree"
:key="temp.componentName"
style="position: fixed;z-index:999998;width: 850px;"
/>
<el-tree-select v-model="temp.componentName" :data="componentTree" :key="temp.componentName" style="width: 100%" placeholder=" " />
</el-form-item>
<el-form-item label="权限标识" prop="permission" v-if="menuType == 'button'">
<el-input v-model="temp.permission" />
@ -88,8 +80,6 @@
<script setup>
import { ref, reactive, watch, nextTick, getCurrentInstance, defineExpose } from 'vue'
import MenuIcons from './menu-icons'
import Treeselect from 'vue3-treeselect'
import 'vue3-treeselect/dist/vue3-treeselect.css'
const { proxy } = getCurrentInstance()
@ -121,7 +111,7 @@ const getTemp = () => {
pid: 0,
icon: '',
keepAlive: 0,
componentName: null
componentName: ''
}
}

2
magic-boot-ui/src/views/system/menu/menu-list.vue
View File

@ -245,7 +245,7 @@ onMounted(() => reloadTable())
watch(menuData, () => {
menuTree.value = [{
label: '根节点',
id: '0',
value: '0',
children: proxy.$treeTable.genTree(menuData.value)
}]
})

6
magic-boot-ui/src/views/system/office/office-list.vue
View File

@ -43,7 +43,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="上级机构" prop="pid">
<treeselect v-model="temp.pid" :options="officeTree" :key="temp.pid" />
<el-tree-select v-model="temp.pid" :key="temp.pid" :data="officeTree" style="width: 100%" check-strictly />
</el-form-item>
</el-col>
</el-row>
@ -74,8 +74,6 @@
</template>
<script setup>
import Treeselect from 'vue3-treeselect'
import 'vue3-treeselect/dist/vue3-treeselect.css'
import { ref, reactive, onMounted, watch, nextTick, getCurrentInstance } from 'vue'
const { proxy } = getCurrentInstance()
@ -229,7 +227,7 @@ onMounted(() => {
watch(officeData, () => {
officeTree.value = [{
label: '根节点',
id: '0',
value: '0',
children: proxy.$treeTable.genTree(officeData.value)
}]
})

12
magic-boot-ui/src/views/system/user/user-form.vue
View File

@ -27,7 +27,7 @@
<el-row :gutter="24">
<el-col :span="12">
<el-form-item label="组织机构" prop="officeId">
<treeselect v-model="temp.officeId" :options="officeTree" :key="temp.officeId" :show-count="true" placeholder="请选择组织机构" />
<mb-treeselect url="/system/user/offices" v-model="temp.officeId" :key="temp.officeId" placeholder="请选择组织机构" check-strictly />
</el-form-item>
</el-col>
<el-col :span="12">
@ -47,7 +47,7 @@
<script setup>
import { ref, reactive, onBeforeMount, getCurrentInstance, nextTick, defineExpose } from 'vue'
import { ref, reactive, getCurrentInstance, nextTick, defineExpose } from 'vue'
const emit = defineEmits(['reload-table'])
const { proxy } = getCurrentInstance()
@ -59,17 +59,9 @@ const rules = reactive({
officeId: [{ required: true, message: '请选择组织机构', trigger: 'change' }]
})
const temp = ref(getTemp())
const officeTree = ref([])
const isForm = ref(true)
const dataForm = ref()
onBeforeMount(() => {
proxy.$get('/system/user/offices').then(res => {
officeTree.value = res.data.list
proxy.$treeTable.deleteEmptyChildren(officeTree.value)
})
})
function getTemp() {
return {
id: '',