文件夹结构

在这里插入图片描述

export default defineComponent({
setup() {
const loading = ref(false);
const expandflag = ref(false);
const showLine = ref(true);
const treedetail = ref([]);
const formRef = ref();
const tree = ref([]);
const selectDepartment= ref([]);
const departmenttree = ref([]);
const reportIdList = ref([]);
const currentselect=ref(’’);
const visible = ref(false);
const modalTitle = ref(“添加/编辑部门”);
const operate = ref("");
const formState = ref({
subjectName: “”,
parentId: null,
id: “”,
childList: null,
});
const rules = {
subjectName: [
{
required: true,
message: “请输入主题名称”,
trigger: “blur”,
},
],
};
const addAttr = (data) => {
for (var j = 0; j < data.length; j++) {
data[j][“scopedSlots”] = { title: “custom” }; //添加title属性
data[j][“title”] = data[j].displayName;
data[j][“key”] = data[j].id;
data[j][“value”] = data[j].id;
data[j][“children”] = data[j].children||[];
if (Array.isArray(data[j].children) && data[j].children.length > 0) {
addAttr(data[j].children);
}
}
return data;
};

const addDepartmentAttr = (data) => {
  for (var j = 0; j < data.length; j++) {
    data[j]["scopedSlots"] = { title: "custom" }; //添加title属性
    data[j]["title"] = data[j].departmentName;
  
    data[j]["key"] = data[j].departmentCode;
    data[j]["value"] = data[j].departmentCode;
    data[j]["children"] = data[j].children;
    if (Array.isArray(data[j].children) && data[j].children.length > 0) {
   
      addDepartmentAttr(data[j].children);
    }
  }
  return data;
};
const gettree = () => {
  loading.value = true;
  getDirTree()
    .then((res) => {
      let result = res.data;
      if (result.code === HTTP_ENUM.SUCCESS) {
        loading.value = false;
        tree.value = addAttr(result.data);
        generateList(tree.value)
        if (Array.isArray(result?.data) && result?.data?.length > 0) {
          reportIdList.value =findIds(result.data[0].id, tree.value)
         currentselect.value= result.data[0].id
          treedetails(currentselect.value);
        }
      }
    })
    .catch((err) => {});
};
const showModal = (operatename, record) => {
  visible.value = true;
  operate.value = operatename;
};

const getdepartmenttree = () => {
  loading.value = true;
  getDepartmentTree()
    .then((res) => {
      let result = res.data;
      if (result.code === HTTP_ENUM.SUCCESS) {
        loading.value = false;
        // tree.value = res.data;
        departmenttree.value = addDepartmentAttr(result.data);
      }
    })
    .catch((err) => {});
};
const resetForm = () => {

visible.value = false;
treedetails(currentselect.value)
};
const handleOk = () => {
loading.value = true;
operateTree({ “departmentCodeList”: selectDepartment.value,
“reportIdList”: reportIdList.value })
.then((res) => {
let result = res.data;
if (result.code === HTTP_ENUM.SUCCESS) {
loading.value = false;
visible.value = false;
treedetails(currentselect.value)
}
})
.catch((err) => {});
};
const treedetails = (id) => {
loading.value = true;
getPermissionDetail({ reportId: id })
.then((res) => {
let result = res.data;
if (result.code === HTTP_ENUM.SUCCESS) {
loading.value = false;
treedetail.value = result.data;
selectDepartment.value = treedetail.value.map(item=>{
return item.departmentCode
})
}
})
.catch((err) => {});
};
gettree();
getdepartmenttree();

//展开的key
const expandedKeys = ref([]);
//搜索关键字
const searchValue = ref("");
//是否展开树
const autoExpandParent = ref(true);

// 展开收起触发
const onExpand = (keys) => {
  expandedKeys.value = keys;
  autoExpandParent.value = false;
};

//处理数据,拿到 提取 key title  格式为 :{key:key,title: node.title } Antd组件方法

const dataList = [];
const generateList = (data) => {
  for (let i = 0; i < data.length; i++) {
    const node = data[i];
    const key = node.id;
    console.log("node", node);
    dataList.push({
      key,
      title: node.title,
    });

    if (node.children) {
      generateList(node.children);
    }
  }
};

const onSelect = (selectedKeys, _e) => {
  if (Array.isArray(selectedKeys) && selectedKeys.length > 0) {
    currentselect.value=selectedKeys[0]
    reportIdList.value =findIds(selectedKeys[0], tree.value)
    treedetails(selectedKeys[0]);
  }
};

//andt 组件方法 获取父级节点key
const getParentKey = (key, tree) => {
  let parentKey;
  for (let i = 0; i < tree.length; i++) {
    const node = tree[i];
    
    if (node.children) {
      if (node.children.some((item) => item.id === key)) {
        parentKey = node.id;
      } else if (getParentKey(key, node.children)) {
        parentKey = getParentKey(key, node.children);
      }
    }
  }

  return parentKey;
};

const findIds= (id, data)=> {
for (let node of data) {
if (node.id === id) {
let ids = [node.id];
if (node.children) {
for (let child of node.children) {
ids = […ids, …findIds(child.id, node.children)];
}
}
return ids;
} else if (node.children) {
let ids = findIds(id, node.children);
if (ids.length > 0) {
return ids;
}
}
}
return [];
}
const sercharchange =(e)=>{
if(e==’’){
expandflag.value = false
}else{
nextTick(()=>{
expandflag.value = true
})

}
}

//搜索事件
watch(searchValue, (value) => {
    if (!value) return (autoExpandParent.value = false);
    const expanded = dataList
      .map((item) => {
        if (item?.title.indexOf(value) > -1) {
          return getParentKey(item.key, tree.value);
        }
        return null;
      })
      .filter((item, i, self) => item && self.indexOf(item) === i);
    expandedKeys.value = expanded;
    searchValue.value = value;
    autoExpandParent.value = true;
});

return {
  gettree,
  treedetails,
  loading,
  tree,
  departmenttree,
  treedetail,
  formRef,
  expandedKeys,
  searchValue,
  autoExpandParent,
  onExpand,
  generateList,
  getParentKey,
  dataList,
  showLine,
  onSelect,
  visible,
  modalTitle,
  formState,
  rules,
  showModal,
  resetForm,
  handleOk,
  operate,
  getdepartmenttree,
  selectDepartment,
  reportIdList,
  findIds,
  currentselect,
  expandflag,
  sercharchange
};

},
});

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值