Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改输入框字段限制

Browse Source
This commit is contained in:
GGJ
2024-12-13 14:36:23 +08:00
parent a856075ddb
commit 8c4cc891e5
58 changed files with 663 additions and 1211 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/components/tree/index.vue
View File

@@ -1,49 +1,25 @@
<template>
<div :style="{ width: menuCollapse ? '40px' : props.width }" style='transition: all 0.3s; overflow: hidden;'>
<Icon
v-show='menuCollapse'
@click='onMenuCollapse'
:name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
:class="menuCollapse ? 'unfold' : ''"
size='18'
class='fold ml10 mt20 menu-collapse'
style='cursor: pointer'
/>
<div :style="{ width: menuCollapse ? '40px' : props.width }" style='transition: all 0.3s; overflow: hidden;'>
<Icon v-show='menuCollapse' @click='onMenuCollapse' :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
:class="menuCollapse ? 'unfold' : ''" size='18' class='fold ml10 mt20 menu-collapse'
style='cursor: pointer' />
<div class='cn-tree' :style='{ opacity: menuCollapse ? 0 : 1 }'>
<div style='display: flex; align-items: center' class='mb10'>
<el-input v-model='filterText' placeholder='请输入内容' clearable>
<el-input maxlength="32" show-word-limit v-model='filterText' placeholder='请输入内容' clearable>
<template #prefix>
<Icon name='el-icon-Search' style='font-size: 16px' />
</template>
</el-input>
<Icon
@click='onMenuCollapse'
:name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
:class="menuCollapse ? 'unfold' : ''"
size='18'
class='fold ml10 menu-collapse'
style='cursor: pointer'
v-if='props.canExpand'
/>
<Icon @click='onMenuCollapse' :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
:class="menuCollapse ? 'unfold' : ''" size='18' class='fold ml10 menu-collapse'
style='cursor: pointer' v-if='props.canExpand' />
</div>
<el-tree
style='flex: 1; overflow: auto;'
ref='treeRef'
:props='defaultProps'
highlight-current
@check-change="checkTreeNodeChange"
:filter-node-method='filterNode'
node-key='id'
v-bind='$attrs'
>
<el-tree style='flex: 1; overflow: auto;' ref='treeRef' :props='defaultProps' highlight-current
@check-change="checkTreeNodeChange" :filter-node-method='filterNode' node-key='id' v-bind='$attrs'>
<template #default='{ node, data }'>
<span class='custom-tree-node'>
<Icon
:name='data.icon'
style='font-size: 16px'
:style='{ color: data.color }'
v-if='data.icon'
/>
<Icon :name='data.icon' style='font-size: 16px' :style='{ color: data.color }'
v-if='data.icon' />
<span style='margin-left: 4px'>{{ node.label }}</span>
</span>
</template>
@@ -90,9 +66,9 @@ const filterNode = (value: string, data: any) => {
if (!value) return true
return data.name.includes(value)
}
const checkTreeNodeChange=()=>{
console.log( treeRef.value?.getCheckedNodes(),"ikkkkkiisiiisis");
emit('checkTreeNodeChange',treeRef.value?.getCheckedNodes())
const checkTreeNodeChange = () => {
console.log(treeRef.value?.getCheckedNodes(), "ikkkkkiisiiisis");
emit('checkTreeNodeChange', treeRef.value?.getCheckedNodes())
}
const treeRef = ref<InstanceType<typeof ElTree>>()
defineExpose({ treeRef })