<template>
  <div class="pl10 searchForm_cont">
    <el-form :model="form" label-width="80%" label-position="top" class="pt20">
      <el-form-item label="" v-if="searchMethod !== 2">
        <el-switch v-model="form.rerankingEnable"></el-switch>
        <span>Rerank 模型</span>
        <el-tooltip
          class="item"
          effect="dark"
          content="重排序模型将根据候选文档列表与用户问题予以匹配程度进行重新排序，从而改进语义排序的结果"
          placement="top"
        >
          <i class="el-icon-info ml5" style="color: #909399;"></i>
        </el-tooltip>
      </el-form-item>
      <!-- 混合检索 -->
      <div v-if="searchMethod === 2" class="flex mb20">
        <div
          class="fixItem flex"
          v-for="(item, index) in fixSearchList"
          :key="index"
          @click="chooseFixSearch(item)"
        >
          <img
            src="@/assets/images/konwledge/knowledge-2.png"
            alt=""
            style="height: 30px"
          />
          <div class="ml10">
            <div class="flex justify-content-b">
              <p>{{ item.name }}</p>
              <i
                class="el-icon-check"
                v-if="item.isCheck"
                style="color: #4f47f5"
              ></i>
            </div>

            <p>{{ item.desc }}</p>
          </div>
        </div>
      </div>
      <el-row
        v-if="
          (form.rerankingEnable && searchMethod !== 2) ||
            (searchMethod === 2 && fixSearchList[1].isCheck === true)
        "
      >
        <el-col :span="10">
          <el-form-item label="">
            <el-select
              v-model="form.rerankingModelName"
              @change="getRankModel"
              placeholder="请选择"
            >
              <el-option
                v-for="item in rankModelList"
                :key="item.model"
                :label="item.label"
                :value="item.model"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="searchMethod === 2 && fixSearchList[0].isCheck === true">
        <RSlider
          v-model="form.weights"
          :hit-test="true"
          :show-tooltip="false"
          @input="getWeight"
          style="width: 98%"
        />
      </el-row>
      <el-row :gutter="20">
        <!-- Top K -->
        <el-col :span="10" class="flex">
          <el-form-item label="">
            <div class="flex align-items-c">
              <p class="ml5 fwb">Top K</p>
              <el-tooltip
                class="item"
                effect="dark"
                content="用于筛选与用户问题相似度最高的文档片段。系统同时会根据选用模型上下文窗口大小动态调整分段数量。"
                placement="top"
              >
                <i class="el-icon-info ml5" style="color: #909399;"></i>
              </el-tooltip>
            </div>
            <el-input-number
              v-model="form.topK"
              :min="1"
              :max="10"
              label="Top K"
              controls-position="right"
              size="mini"
            ></el-input-number>
          </el-form-item>
          <div class="ml20 mt40" style="width: 80%;">
            <el-slider
              v-model="form.topK"
              :min="1"
              :max="10"
              :step="1"
            ></el-slider>
          </div>
        </el-col>
        <!-- Score阈值-->
        <el-col :span="10" class="flex">
          <el-form-item label="">
            <template slot="label">
              <div class="flex align-items-c">
                <el-switch v-model="form.scoreThresholdEnabled"></el-switch>
                <p class="ml5 fwb">Score阈值</p>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="用于设置文本片段筛选的相似度阈值"
                  placement="top"
                >
                  <i class="el-icon-info ml5" style="color: #909399;"></i>
                </el-tooltip>
              </div>
            </template>
            <el-input-number
              v-model="form.scoreThreshold"
              :min="0"
              :max="1"
              :step="0.01"
              label="Top K"
              controls-position="right"
              size="mini"
              :disabled="!form.scoreThresholdEnabled"
            ></el-input-number>
          </el-form-item>
          <div class="ml20 mt40" style="width: 80%;">
            <el-slider
              v-model="form.scoreThreshold"
              :disabled="!form.scoreThresholdEnabled"
              :min="0"
              :max="1"
              :step="0.01"
            ></el-slider>
          </div>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
import { getRerankModels, retrievalSetting } from '@/api/knowledge/hit-test'

export default {
  name: 'SearchForm',
  props: {
    searchMethod: {
      type: Number
    },
    embeddingItem: {
      type: Object
    }
  },
  data() {
    return {
      form: {
        // 是否启用rerank模型
        rerankingEnable: true,
        // Rerank模型
        rerankingModelName: '',
        rerankingProviderName: '',

        topK: 0,

        // 是否启用score阈值
        scoreThresholdEnabled: false,
        // score阈值
        scoreThreshold: 0,

        // 混合模式- reranking_model:使用rerank模型; weighted_score：使用权重
        rerankingMode: '',
        // 关键词
        keywordWeight: 0,
        // 语义
        vectorWeight: 0
      },
      rankModelList: [
        {
          value: 'sentence-transformers/all-MiniLM-L6-v2',
          label: 'sentence-transformers/all-MiniLM-L6-v2'
        },
        {}
      ],
      fixSearchList: [
        {
          name: '权重设置',
          desc:
            '通过调整分配的权重，重新排序策略确定是优先进行语义匹配还是关键字匹配',
          isCheck: true,
          value: 'weighted_score'
        },
        {
          name: 'Rerank 模型',
          value: 'reranking_model',
          desc:
            '重排序模型将根据候选文档列表与用户问题语义匹配度进行重新排序，从而改进语义排序的结果'
        }
      ]
    }
  },
  created() {
    this.getRerankModelList()
  },
  methods: {
    getRerankModelList() {
      getRerankModels().then(res => {
        if (res) {
          const { content } = res.content
          this.rankModelList = content.flatMap(item => item.models)
        }
      })
    },
    getRankModel() {
      let rankItem = this.rankModelList.find(
        item => item.model === this.form.rerankingModelName
      )
      this.form.rerankingProviderName = rankItem.provider
    },
    chooseFixSearch(val) {
      this.fixSearchList.forEach(item => {
        item.isCheck = false
      })
      val.isCheck = true
      this.form.rerankingMode = val.value
    },
    getWeight() {},
    submitData() {
      let params = {
        datasetId: this.$route.query.datasetId,
        searchMethod: this.searchMethod,
        embeddingModel: this.embeddingItem.model,
        embeddingModelProvider: this.embeddingItem.provider,
        ...this.form
      }
      params.rerankingEnable = this.handleBoolean(this.form.rerankingEnable)
      params.scoreThresholdEnabled = this.handleBoolean(
        this.form.scoreThresholdEnabled
      )
      retrievalSetting(params).then(res => {
        if (res) {
          this.$message.success('保存成功')
          this.$emit('handleClose')
        }
      })
    },

    handleBoolean(val) {
      let value = JSON.parse(JSON.stringify(val))
      return value ? 1 : 0
    }
  }
}
</script>

<style scoped lang="scss">
.searchForm_cont {
  border-left: 1px solid #4f47f5;
  border-right: 1px solid #4f47f5;
  border-bottom: 1px solid #4f47f5;
  border-radius: 0 0 5px 5px;
}
.fixItem {
  border: 1px solid #ebeef5;
  margin-right: 10px;
  padding: 10px;
  border-radius: 8px;
}
</style>
