创新实训——知识库管理页面

添加知识库内容

点击插入按钮，可在知识库中新添加一个文件。

created() {
    console.log('created')
    this.KBId = this.$route.query.kbId
    console.log(this.KBId)
    getChunks(this.KBId).then((res) => {
      console.log(res)
      this.lists = res.data
    }).catch((err) => {
      console.log(err)
    });
  }

显示知识库详情

页面可显示已添加的知识库内容，点击显示框可以打开一个dialog，出现内容的弹框，可在其中对知识库内容进行修改。

methods: {
    toDetail() {
      this.$router.push('/knDetail')
    },
    back() {
      this.$router.back()
    },

    toAdd() {
      this.tempInfo = {}
      this.dialogVisible = true
    },
    openFileSelector() {
      //创建input元素
      const input = document.createElement('input');
      input.type = 'file';
      input.click();

      //监听文件选择事件
      input.onchange = (event) => {
        const file = event.target.files[0];
        //处理选中的文件
        console.log(file);
      }
    },
    edit(item) {
      this.currentIndex = item.chunkId
      this.isEdit = true
      this.tempInfo = item
      this.dialogVisible = true
    },
    confirm() {
      if (this.isEdit) {
        let myObj = this.lists.find(box => box.chunkId == this.currentIndex)
        console.log(myObj)
        myObj = this.tempInfo
        this.dialogVisible = false
        this.isEdit = false
      }
      else {
        this.tempInfo.chunkId = this.lists[this.lists.length - 1].chunkId + 1
        this.lists.push(this.tempInfo)
        this.dialogVisible = false
        this.isEdit = false
      }
    }
  }

使用 overflow: auto; 处理详情框中文字过多的溢出问题。

从本地文件中选择

点击选择文件按钮，可从本地文件中选择想要添加进知识库的文件，将其插入用户创建的知识库中，形成个人的知识库。

openFileSelector() {
      //创建input元素
      const input = document.createElement('input');
      input.type = 'file';
      input.click();

      //监听文件选择事件
      input.onchange = (event) => {
        const file = event.target.files[0];
        //处理选中的文件
        console.log(file);
      }
    }