AI_Engineering/ais_search/web/src/views/document/MoveFiles.vue

<template>
  <a-modal
    v-model:open="open"
    title="文件移动"
    @ok="handleOk"
    @cancel="closeModel"
  >
    <a-directory-tree
      class="directory-tree"
      v-model:expandedKeys="expandedKeys"
      v-model:selectedKeys="selectedKeys"
      :tree-data="treeData"
      style="
        border: 1px solid #e4e7ea;
        border-radius: 4px;
        padding: 10px;
        max-height: 400px;
        min-height: 200px;
        overflow-y: scroll;
      "
    >
      <template #icon="{ key, selected }">
        <MyIcon
          :icon="iconTypeName.dir"
          size="18"
          style="margin-right: 5px; margin-top: 2px"
        />
      </template>
    </a-directory-tree>
  </a-modal>
</template>
<script lang="ts" setup>
/**
 * @description 文件移动弹窗
 */
import { ref, onMounted, watch, toRefs, PropType } from "vue";
import { message } from "ant-design-vue";
import MyIcon from "@/components/myIcon/index.vue";
import { getAllFolder } from "./http";
import { iconTypeName } from "./config";
import { moveFiles } from "./http";
const props = defineProps({
  ids: {
    type: Array as PropType<string[]>,
    default: [],
  },
  open: {
    type: Boolean,
    default: false,
  },
  closeModel: {
    type: Function,
    default: () => {},
  },
});
const { ids, open, closeModel } = toRefs(props);

const expandedKeys = ref<string[]>(["root"]);
const selectedKeys = ref<string[]>([]);
const treeData = ref([
  {
    title: "我的文档",
    key: "root",
    children: [],
  },
]);

onMounted(() => {
  initModel();
});

watch(
  () => open.value,
  () => {
    initModel();
  }
);
const initModel = () => {
  selectedKeys.value = [];
  getAllFolder().then((res) => {
    console.log(res);
    treeData.value[0].children = res.data.map((item: any) => {
      return {
        title: item.fileName,
        key: item.fileId,
      };
    });
  });
};

const handleOk = async () => {
  const selectKey =
    selectedKeys.value[0] == "root" ? "" : selectedKeys.value[0];
  const res: any = await moveFiles(ids.value, selectKey);
  console.log("res", res);
  if (res.success) {
    message.success("文件移动成功！");
    closeModel.value();
  } else {
    message.error("文件移动失败，请稍后重试！");
  }
};
</script>
<style scoped lang="scss"></style>