<!--导入配置  -->
<template>
   <el-form label-position="left" ref="form" label-width="120px" :model="form" :size="defaultFormItemSize" :rules="rules">
    {{ form.knowledge_base_name }}
    <el-form-item label="上传知识库文件:"  prop="filesArr">
      <el-button @click="clickUp" :size="defaultFormItemSize"  type="primary">上传</el-button>
      <input style="display:none" ref="upFile" type="file"  @change="fileinfo($event.target.files)">
      <div v-for="item in files" :key="item.name">{{ item.name }}</div>
    </el-form-item>
    <el-form-item label="单段文本最大长度:">
      <el-slider :min="0" :max="1000" v-model="form.chunk_size" show-input>
      </el-slider>
    </el-form-item>
    <el-form-item label="相邻文本重合长度:">
      <el-slider :min="0" :max="12" v-model="form.chunk_overlap" show-input>
      </el-slider>
    </el-form-item>
    <el-form-item label="开启中文标题加强:">
      <el-checkbox v-model="form.zh_title_enhance"></el-checkbox>
    </el-form-item>
    <el-form-item label="已有文件:">
      <el-table
      :data="listFiles"
      style="width: 100%">
      <el-table-column
      type="index"
      width="50">
    </el-table-column>
      <el-table-column
        prop="name"
        label="名称"
       >
      </el-table-column>
      <el-table-column  label="操作" width="90px" >
       <template slot-scope="scope">
           <el-button type="text" @click="delFile(scope.row)" :size="defaultFormItemSize" >删除</el-button>
      </template>
      </el-table-column>
   
    </el-table>
    </el-form-item>
    <el-row type="flex" justify="end" class="dialog-btn-layer mt20">
      <template>
        <el-button :size="defaultFormItemSize" :plain="true" @click="back" >上一步</el-button>
        <el-button :size="defaultFormItemSize" :plain="true" @click="onSubmit">确认上传</el-button>
    </template>
    </el-row>
  </el-form>
  <!-- </template> -->
</template>

<script>
import { KnowledgeManage } from '@/api/gptController.js';
export default {
  data () {
    return {
      form: {
        filesArr: undefined,
        knowledge_base_name: '',
        override: false,
        to_vector_store: true,
        chunk_size: 250,
        chunk_overlap: 0,
        zh_title_enhance: true,
        not_refresh_vs_cache: false
      },
      files: [],
      listFiles: [],
      rules: {
        filesArr: [
          { required: true, message: '请选择文件', trigger: 'blur' }
        ]
      }
    };
  },
  props: ['item'],
  components: {},

  computed: {},

  mounted () {
    this.getFiles()
  },
  watch: {

  },
  methods: {
  
    fileinfo (files) {
      if (this.files.map((item) => item.name).indexOf(files[0].name) === -1) {
        this.files.push(files[0])
      } else {
        console.log('重复上传');
      }
      this.form.filesArr = this.files
    },
    clickUp () {
      this.$refs.upFile.click()
    },
    onSubmit () {
      return new Promise((resolve, reject) => {
        this.$refs['form'].validate((valid) => {
          if (valid) {
            this.form.knowledge_base_name = this.$parent.knowledgeName
            let params = {};
            params = { ...this.form };
            this.upload('/2api/knowledge_base/upload_docs', params, false).then(res => {
              resolve(res);
              this.$message.success('上传成功');
          
              this.$parent.onCancel(false)
            }).catch(e => {
              reject(e);
            });
          }
        });
      });
    },
    getFiles () {
      let params = {knowledgeName: this.$parent.knowledgeName};
      KnowledgeManage.listFiles(this, params).then(res => {
        this.listFiles = res.data.map((item) => {
          return {
            name: item
          }
        })
      }).catch(e => {
        console.log(e);
      });
    },
    delFile (row) {
      let params = {
        'knowledge_base_name': this.$parent.knowledgeName,
        'file_names': [
          row.name
        ],
        'delete_content': false,
        'not_refresh_vs_cache': false
    
      };
      this.$confirm('是否确认删除', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        KnowledgeManage.deleteDocs(this, params).then(res => {
          if (res.success) {
            this.getFiles()
          }
        }).catch(e => {
          console.log(e);
        });
      })
    },
    back () {
      this.$parent.active--
    }
  }
}

</script>
<style scoped>
.introduce{
  font-size: 12px;
  color: #909399;
}
.title {
  font-size: 20px;
  margin-bottom: 16px;
}
</style>
