【字典分类】列表按钮再放回去,默认选中的高亮

ly
Zhufu 2024-05-07 17:40:11 +08:00
parent f2f3aa6695
commit 5f2fad790a
1 changed files with 14 additions and 12 deletions

View File

@ -1,8 +1,11 @@
<template> <template>
<div class="page-div categories-page"> <div class="page-div categories-page">
<div class="left-div w-1/4 xl:w-1/5 m-4 mr-0"> <div class="left-div w-1/4 xl:w-1/5 m-4 mr-0">
<div class="header mb-1"> <div class="header">
<div class='header-title'>分类列表</div> <div class="buttons-div">
<a-button type="primary" color='error' @click="buttonClick('left-del')"></a-button>
<a-button type="primary" color='info' @click="buttonClick('left-add')"></a-button>
</div>
<div class="search-div"> <div class="search-div">
<a-input-search size="small" v-model:value="LValue" placeholder="搜索" enter-button @search="searchData('left')"/> <a-input-search size="small" v-model:value="LValue" placeholder="搜索" enter-button @search="searchData('left')"/>
</div> </div>
@ -10,7 +13,7 @@
</div> </div>
<div class="content"> <div class="content">
<div class="showTree"> <div class="showTree">
<BasicTree :treeData="showLTree" :loading="lLoading" @select="(selectedKeys,{node}) => {getLeftSelectId(node.id);changeTypeId(node.key)}"/> <BasicTree ref="treeRef" :treeData="showLTree" :loading="lLoading" @select="(selectedKeys,{node}) => {getLeftSelectId(node.id);changeTypeId(node.key)}"/>
</div> </div>
</div> </div>
</div> </div>
@ -40,7 +43,7 @@ import UseModal from './Modal/index.vue'
import { BasicTree } from '@/components/Tree'; import { BasicTree } from '@/components/Tree';
import {BasicTable,useTable} from '@/components/Table' import {BasicTable,useTable} from '@/components/Table'
import { PermissionBtn } from '@/components/PermissionBtn/index'; import { PermissionBtn } from '@/components/PermissionBtn/index';
import {ref,onMounted,reactive,watch,createVNode } from "vue" import {ref,onMounted,reactive,watch,createVNode, unref } from "vue"
import {getLeftTree,getRightTable,addLeftItem,addRightItem,delLeftItem,editRightItem,delRightItem} from '@/api/sys/categories.ts' import {getLeftTree,getRightTable,addLeftItem,addRightItem,delLeftItem,editRightItem,delRightItem} from '@/api/sys/categories.ts'
import {columns,emptyRightItem,emptyLeftItem,dataProcess,searchFormSchema} from './util.ts' import {columns,emptyRightItem,emptyLeftItem,dataProcess,searchFormSchema} from './util.ts'
import {Modal,message} from 'ant-design-vue' import {Modal,message} from 'ant-design-vue'
@ -58,6 +61,7 @@ const modalData = reactive({
data:{}, data:{},
type:'', type:'',
}) })
const treeRef = ref()
const firstRequestCode = ref('') const firstRequestCode = ref('')
const [registerTable,{reload,getSelectRows}] = useTable({ const [registerTable,{reload,getSelectRows}] = useTable({
@ -103,6 +107,7 @@ const getLeftTreeData = (isMounted) => {
if(isMounted && data.length > 0){ if(isMounted && data.length > 0){
firstRequestCode.value = data[0].key firstRequestCode.value = data[0].key
typeId.value = data[0].key typeId.value = data[0].key
unref(treeRef).setSelectedKeys([data[0].key])
} }
reload() reload()
}).catch(err => { }).catch(err => {
@ -246,18 +251,15 @@ const clearModal = () => {
flex-direction: column; flex-direction: column;
.header{ .header{
display: flex; display: flex;
align-items: center; flex-direction: column;
padding:10px; padding:10px;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
.header-title{ .buttons-div{
width: 132px; display: flex;
font-size: 16px; justify-content: space-between;
font-weight: 500;
line-height: 24px;
cursor: pointer;
user-select: none;
} }
.search-div{ .search-div{
margin-top:10px;
display: flex; display: flex;
} }
} }