-
- {{ node?.title }}
- {{ node?.title?.substr(0, index) }}
- {{ node?.title?.substr(index, searchKey.length) }}
- {{ node?.title?.substr(index + searchKey.length) }}
-
+ {{ node?.title }}
@@ -47,15 +42,10 @@ import type { TreeInstance, TreeNodeData } from '@arco-design/web-vue'
import { ref } from 'vue'
import { useDept } from '@/hooks/app'
-interface Props {
- placeholder?: string
-}
-const props = withDefaults(defineProps
(), {
- placeholder: '请输入关键词',
-})
const emit = defineEmits<{
(e: 'node-click', keys: Array): void
}>()
+
// 选中节点
const selectedKeys = ref()
const select = (keys: Array) => {
@@ -83,7 +73,7 @@ const search = (keyword: string) => {
const loop = (data: TreeNodeData[]) => {
const result = [] as TreeNodeData[]
data.forEach((item: TreeNodeData) => {
- if (item.title?.toLowerCase().includes(keyword.toLowerCase())) {
+ if (item.title?.toLowerCase().includes(keyword)) {
result.push({ ...item })
} else if (item.children) {
const filterData = loop(item.children)
@@ -102,20 +92,9 @@ const search = (keyword: string) => {
const treeData = computed(() => {
if (!searchKey.value) return deptList.value
- return search(searchKey.value)
+ return search(searchKey.value.toLowerCase())
})
-/**
- * 获取匹配索引
- *
- * @param name 名称
- */
-// eslint-disable-next-line unused-imports/no-unused-vars
-const getMatchIndex = (name: string) => {
- if (!searchKey.value) return -1
- return name.toLowerCase().indexOf(searchKey.value.toLowerCase())
-}
-
onMounted(() => {
getDeptList()
})
@@ -152,7 +131,7 @@ onMounted(() => {
}
}
-.left-tree {
+.container {
flex: 1;
overflow: hidden;
position: relative;
@@ -161,26 +140,25 @@ onMounted(() => {
box-sizing: border-box;
height: 100%;
- &__search {
+ .search {
margin-bottom: 16px;
}
- &__container {
+ .tree-wrapper {
flex: 1;
overflow: hidden;
background-color: var(--color-bg-1);
position: relative;
height: 100%;
margin-bottom:10px;
- }
-
- &__tree {
- position: absolute;
- top: 0;
- bottom: 0;
- left: 0;
- right: 0;
- overflow: auto
+ .tree {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ overflow: auto
+ }
}
}
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index fa7f5ec..f1a6a19 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -7,7 +7,7 @@
-
+
删除
@@ -111,23 +111,11 @@ import { DisEnableStatusList } from '@/constant/common'
defineOptions({ name: 'SystemUser' })
-const queryForm = reactive({
- sort: ['t1.createTime,desc', 't1.id,desc'],
-})
-const {
- tableData: dataList,
- loading,
- pagination,
- search,
- handleDelete,
-} = useTable((page) => listUser({ ...queryForm, ...page }), { immediate: false })
-
const options: Options = reactive({
form: { layout: 'inline' },
grid: { cols: { xs: 1, sm: 1, md: 2, lg: 3, xl: 3, xxl: 3 } },
fold: { enable: true, index: 1, defaultCollapsed: true },
})
-
const queryFormColumns: Columns = reactive([
{
type: 'input',
@@ -159,7 +147,17 @@ const queryFormColumns: Columns = reactive([
},
},
])
+const queryForm = reactive({
+ sort: ['t1.createTime,desc', 't1.id,desc'],
+})
+const {
+ tableData: dataList,
+ loading,
+ pagination,
+ search,
+ handleDelete,
+} = useTable((page) => listUser({ ...queryForm, ...page }), { immediate: false })
const columns: TableInstanceColumns[] = [
{
title: '序号',
@@ -178,13 +176,13 @@ const columns: TableInstanceColumns[] = [
fixed: !isMobile() ? 'left' : undefined,
},
{ title: '用户名', dataIndex: 'username', slotName: 'username', minWidth: 140, ellipsis: true, tooltip: true },
- { title: '状态', slotName: 'status', align: 'center' },
- { title: '性别', slotName: 'gender', align: 'center' },
- { title: '所属部门', dataIndex: 'deptName', ellipsis: true, tooltip: true, minWidth: 180 },
- { title: '角色', dataIndex: 'roleNames', minWidth: 160, slotName: 'roleNames' },
+ { title: '状态', dataIndex: 'status', slotName: 'status', align: 'center' },
+ { title: '性别', dataIndex: 'gender', slotName: 'gender', align: 'center' },
+ { title: '所属部门', dataIndex: 'deptName', minWidth: 180, ellipsis: true, tooltip: true },
+ { title: '角色', dataIndex: 'roleNames', slotName: 'roleNames', minWidth: 165 },
{ title: '手机号', dataIndex: 'phone', minWidth: 170, ellipsis: true, tooltip: true },
{ title: '邮箱', dataIndex: 'email', minWidth: 170, ellipsis: true, tooltip: true },
- { title: '系统内置', slotName: 'isSystem', width: 100, align: 'center', show: false },
+ { title: '系统内置', dataIndex: 'isSystem', slotName: 'isSystem', width: 100, align: 'center', show: false },
{ title: '描述', dataIndex: 'description', minWidth: 130, ellipsis: true, tooltip: true },
{ title: '创建人', dataIndex: 'createUserString', width: 140, ellipsis: true, tooltip: true, show: false },
{ title: '创建时间', dataIndex: 'createTime', width: 180 },
@@ -211,7 +209,7 @@ const reset = () => {
// 删除
const onDelete = (record: UserResp) => {
return handleDelete(() => deleteUser(record.id), {
- content: `是否确定删除 [${record.nickname}(${record.username})]？`,
+ content: `是否确定删除用户「${record.nickname}(${record.username})」？`,
showModal: true,
})
}
@@ -227,18 +225,18 @@ const handleSelectDept = (keys: Array) => {
search()
}
+const UserImportDrawerRef = ref>()
+// 导入
+const onImport = () => {
+ UserImportDrawerRef.value?.onOpen()
+}
+
const UserAddDrawerRef = ref>()
// 新增
const onAdd = () => {
UserAddDrawerRef.value?.onAdd()
}
-const UserImportDrawerRef = ref>()
-// 导入
-const onImport = () => {
- UserImportDrawerRef.value?.onImport()
-}
-
// 修改
const onUpdate = (record: UserResp) => {
UserAddDrawerRef.value?.onUpdate(record.id)
@@ -247,13 +245,13 @@ const onUpdate = (record: UserResp) => {
const UserDetailDrawerRef = ref>()
// 详情
const onDetail = (record: UserResp) => {
- UserDetailDrawerRef.value?.onDetail(record.id)
+ UserDetailDrawerRef.value?.onOpen(record.id)
}
const UserResetPwdModalRef = ref>()
// 重置密码
const onResetPwd = (record: UserResp) => {
- UserResetPwdModalRef.value?.onReset(record.id)
+ UserResetPwdModalRef.value?.onOpen(record.id)
}
const UserUpdateRoleModalRef = ref>()