调试配置接口页面逻辑

liudong

2024-07-31 633d7dd0cbbd745e1a61c47205c96bbe1fe496d5

 src/views/dmx/knowledgeLib/test.vue

@@ -6,56 +6,48 @@
        <div class="main-container-lf-down">
          <div style="color: #999;">最后一步！ 成功后，剩下的就交给Infiniflow AI吧。</div>
          <a-divider style="margin-top: 10px" />
          <a-form ref="formRef" :size="form.size" :model="form" :style="{width:'100%'}" layout="vertical"  @submit="handleSubmit">
            <a-form-item field="slider" label="相似度阈值" :rules="[{type:'number', min:5,message:'slider is min than 5'}]">
              <a-slider v-model="form.slider" :max="10" />
          <a-form ref="formRef"  :model="form" :style="{width:'100%'}" layout="vertical"  @submit="handleSubmit">
            <a-form-item field="similarity_threshold" label="相似度阈值">
              <a-slider v-model="form.similarity_threshold"  />
            </a-form-item>
            <a-form-item field="slider" label="关键字相似度权重" :rules="[{type:'number', min:5,message:'slider is min than 5'}]">
              <a-slider v-model="form.score" :max="10" />
              <a-slider v-model="form.vector_similarity_weight"  />
            </a-form-item>
            <a-form-item field="section" label="Rerank模型" :rules="[{match:/section one/,message:'请选择'}]">
              <a-select v-model="form.section" placeholder="请选择" allow-clear>
                <a-option value="section one">Section One</a-option>
                <a-option value="section two">Section Two</a-option>
                <a-option value="section three">Section Three</a-option>
              </a-select>
              <a-space direction="vertical" size="large">
                <a-select :size="'large'" v-model="form.rerank_id" :style="{width:'100%'}" placeholder="请选择 ..." allow-clear>
                  <a-optgroup  :label="index" v-for="(item,index) in modelList" :key=index>
                    <a-option
                      v-for="(obj) in item"
                      :key="obj.fid"
                      :disabled="!obj.available"
                      :value="obj.llm_name"
                    >
                      {{obj.llm_name}}
                    </a-option>
                  </a-optgroup>
                </a-select>
              </a-space>
            </a-form-item>
            <a-form-item field="section" :rules="[{match:/section one/,message:'请选择'}]">
            <a-form-item field="slider" label="Top-K" :rules="[{type:'number', min:5,message:'slider is min than 5'}]">
              <a-slider v-model="form.top_k" :min="1" :max="2048" />
            </a-form-item>
            <a-form-item >
              <div class="main-container-form-item-extra">
                <div class="main-container-form-item-extra-top">测试文本</div>
                <div class="main-container-form-item-extra-down">
                  <a-textarea style="height: 10rem;border: 1px solid  var(--color-fill-3);border-radius: 4px" placeholder="" allow-clear/>
                  <a-textarea v-model="form.question" style="height: 10rem;border: 1px solid  var(--color-fill-3);border-radius: 4px" placeholder="" allow-clear/>
                </div>
                <div class="main-container-form-item-extra-btn">
                  <a-button type="primary" html-type="submit">测试</a-button>
                </div>
              </div>
            </a-form-item>
<!--            <a-form-item>-->
<!--              <a-space>-->
<!--                <a-button html-type="submit">Submit</a-button>-->
<!--                <a-button @click="$refs.formRef.resetFields()">Reset</a-button>-->
<!--              </a-space>-->
<!--            </a-form-item>-->
          </a-form>
        </div>
      </div>
      <div class="main-container-rt">
        <a-collapse style="width: 96%;margin-top: 1rem;margin-left: 2%">
<!--          <a-collapse-item header="Beijing Toutiao Technology Co., Ltd." key="1">-->
<!--            <template #extra>-->
<!--              <icon-copy />-->
<!--            </template>-->
<!--            <div>Beijing Toutiao Technology Co., Ltd.</div>-->
<!--            <div>Beijing Toutiao Technology Co., Ltd.</div>-->
<!--          </a-collapse-item>-->
<!--          <a-collapse-item header="Beijing Toutiao Technology Co., Ltd." :key="2">-->
<!--            <template #extra>-->
<!--              <a-button type="primary" size="mini" @click.stop="sayHello">hello</a-button>-->
<!--            </template>-->
<!--            <div>Beijing Toutiao Technology Co., Ltd.</div>-->
<!--            <div>Beijing Toutiao Technology Co., Ltd.</div>-->
<!--          </a-collapse-item>-->
          <a-collapse-item header="0/0 选定的文件" key="3">
            <template #extra>
              <a-tag size="small">命中数</a-tag>
@@ -71,112 +63,65 @@
</template>

<script lang="ts" setup>
import { onMounted ,onBeforeMount, reactive, ref } from "vue";
import { onMounted, onBeforeMount, reactive, ref, watch } from "vue";
import { Message } from '@arco-design/web-vue';
import { kbretrievalTest, queryModelList } from "@/api/kbList";
// import { usePinia } from "../../../store";
// const store = usePinia();
// const props = defineProps({
//   kbobj: {
//     type: Object,
//     default: () => {
//       return {}
//     }
//   }
// })
// watch(
//   ()=>props.kbobj,
//   (val)=>{
//     console.log(val, '见听到新值');
//   },
//   {
//     deep: true,
//     immediate: true
//   }
// )

const props = defineProps({
  record: {
    type: Object,
    default: () => {
      return {}
    }
  }
})




const visible = ref(false);
const loading = ref(false);
let visible = ref(false);
let loading = ref(false);
const formRef = ref(null);



const form = reactive({
  size: 'medium',
  name: '',
  age: undefined,
  section: '',
  province: 'haidian',
  options: [],
  date: '',
  time: '',
  radio: 'radio one',
  slider: 5,
  score: 5,
  switch: false,
  multiSelect: ['section one'],
  treeSelect: ''
const modelList = ref({});
let form = reactive({
  // kb_id: store.kbobj.id,
  page: 1,
  question: '',
  rerank_id: '',
  similarity_threshold: 20,
  size: 10,
  top_k: 1024,
  vector_similarity_weight: 30,
});
const options = [
  {
    value: 'beijing',
    label: 'Beijing',
    children: [
      {
        value: 'chaoyang',
        label: 'ChaoYang',
        children: [
          {
            value: 'datunli',
            label: 'Datunli',
          },
        ],
      },
      {
        value: 'haidian',
        label: 'Haidian',
      },
      {
        value: 'dongcheng',
        label: 'Dongcheng',
      },
      {
        value: 'xicheng',
        label: 'XiCheng',
      },
    ],
  },
  {
    value: 'shanghai',
    label: 'Shanghai',
    children: [
      {
        value: 'shanghaishi',
        label: 'Shanghai',
        children: [
          {
            value: 'huangpu',
            label: 'Huangpu',
          },
        ],
      },
    ],
  },
];


const sayHello = () => {
  Message.info('hello');
const formatter = (value) => {
  // return String(Math.round(value / 100))
};

const handleSubmit = ({values, errors}) => {
  console.log('values:', values, '\nerrors:', errors)
const handleSubmit = async ({values, errors}) => {
  // console.log(props.kbobj, 'props.kbobj');
  console.log(store.kbobj.id, 'store');
  if (!form.question){
    return
  }
  // let formObj = {...form}
  // formObj.kb_id = store.kbobj.id;
  // formObj.similarity_threshold = formObj.similarity_threshold/100;
  // formObj.vector_similarity_weight = formObj.vector_similarity_weight/100;
  //  const data = await kbretrievalTest(formObj);
}

const handleClick = () => {
  visible.value = true;
};
const handleBeforeOk = (done) => {
    formRef.value.validate().then(res => {
      console.log('form:', form)
      if (!form.name) {
        done(false)
      }else {
        console.log('请求数据');

      }
    })
};
const handleCancel = () => {
  visible.value = false;
@@ -184,25 +129,34 @@

const handleOpened =(el) => {
  Object.assign(form,{
    name: '',// 用户名
    nameJoin: '',// 昵称
    post: '',// 岗位
    txt: '',// 备注

  });
  formRef.value.resetFields();
  console.log(props.record, 'record');
  // if(props.edit == 'edit'){
  //   Object.assign(form,props.record);
  // }
}
const queryModel = async (params) => {
  try {
    const data = await queryModelList(params);
    console.log(data.data, '大模型列表');
    modelList.value = {
      BAAI: [data.data.BAAI[1]],
      Jina: data.data.Jina,
      youdao: data.data.youdao
    };
  } catch (err) {
    // you can report use errorHandler or other
  } finally {

  }
};
onBeforeMount(()=>{

  queryModel({})
})
onMounted(()=>{


})


</script>

<script lang="ts">