From ab967ca32557c9535a4508468bf855a80e34809d Mon Sep 17 00:00:00 2001
From: zhangxiao <898441624@qq.com>
Date: 星期二, 06 八月 2024 19:24:37 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.5.5:10010/r/web/flow_web

---
 src/views/dmx/IntelligentAgent/components/agentConfig.vue |  595 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 595 insertions(+), 0 deletions(-)

diff --git a/src/views/dmx/IntelligentAgent/components/agentConfig.vue b/src/views/dmx/IntelligentAgent/components/agentConfig.vue
new file mode 100644
index 0000000..c150713
--- /dev/null
+++ b/src/views/dmx/IntelligentAgent/components/agentConfig.vue
@@ -0,0 +1,595 @@
+<template>
+  <a-button
+    v-if="typeAngint == 'add'"
+    type="primary"
+    @click="handleClick"
+    style="margin-left: 10px">
+    <template #icon>
+      <icon-plus />
+    </template>
+    鏂板缓鏅鸿兘浣�
+  </a-button>
+  <a-button
+    v-if="typeAngint == 'edit'"
+    type="text"
+    size="small"
+    @click="editClick"
+  >
+    <template #icon>
+      <icon-tool />
+    </template>
+  </a-button>
+  <a-modal
+    v-model:visible="visible"
+    title="鏅鸿兘浣撻厤缃�"
+    @before-open="handleOpened"
+    @cancel="handleCancel"
+    :ok-loading="loading"
+    @before-ok="handleBeforeOk"
+    :footer="true"
+    title-align="start"
+    width="600px"
+  >
+    <a-row class="">
+      <a-col :span="24">
+        <a-tabs type="capsule" size="large">
+          <a-tab-pane key="1" title="鍔╃悊璁剧疆">
+            <a-divider style="margin-bottom: 20px;margin-top: 0" />
+            <div style="width: 100%;" :style="{height:height}">
+              <a-form
+                ref="formRef"
+                :rules="rules"
+                :model="form"
+                @submit="handleSubmit"
+                :style="{ width: '90%', margin: '0 auto' }"
+              >
+                <a-form-item field="name" label="鏅鸿兘浣撳悕绉�">
+                  <a-input v-model="form.name" placeholder="璇疯緭鍏ュ悕绉�" />
+                </a-form-item>
+                <a-form-item label="鏅鸿兘浣撳浘鏍�">
+                  <a-space direction="vertical" :style="{ width: '100%' }">
+                    <a-upload
+                      :auto-upload="false"
+                      :fileList="file ? [file] : []"
+                      :show-file-list="false"
+                      @change="onChange"
+                      @progress="onProgress"
+                    >
+                      <template #upload-button>
+                        <div
+                          :class="`arco-upload-list-item${
+                      file && file.status === 'error' ? ' arco-upload-list-item-error' : ''
+                    }`"
+                        >
+                          <div
+                            class="arco-upload-list-picture custom-upload-avatar"
+                            v-if="file && file.url"
+                          >
+                            <img :src="file.url" />
+                            <div class="arco-upload-list-picture-mask">
+                              <IconEdit />
+                            </div>
+                            <a-progress
+                              v-if="file.status === 'uploading' && file.percent < 100"
+                              :percent="file.percent"
+                              type="circle"
+                              size="mini"
+                              :style="{
+                          position: 'absolute',
+                          left: '50%',
+                          top: '50%',
+                          transform: 'translateX(-50%) translateY(-50%)',
+                        }"
+                            />
+                          </div>
+                          <div class="arco-upload-picture-card" v-else>
+                            <div class="arco-upload-picture-card-text">
+                              <IconPlus />
+                              <div style="margin-top: 10px; font-weight: 600">涓婁紶</div>
+                            </div>
+                          </div>
+                        </div>
+                      </template>
+                    </a-upload>
+                  </a-space>
+                </a-form-item>
+                <a-form-item label="绌哄洖澶�">
+                  <a-input v-model="form.prompt_config.empty_response" placeholder="" />
+                </a-form-item>
+                <a-form-item label="璁剧疆寮�鍦虹櫧">
+                  <a-textarea
+                    v-model="form.prompt_config.prologue"
+                    placeholder=""
+                    style="height: 100px"
+                  />
+                </a-form-item>
+                <a-form-item label="鏄剧ず寮曟枃">
+                  <a-space direction="vertical" >
+                    <a-switch v-model="form.prompt_config.quote" size="small" />
+                  </a-space>
+                </a-form-item>
+                <a-form-item label="Self-RAG">
+                  <a-space direction="vertical">
+                    <a-switch v-model="form.prompt_config.self_rag" size="small" />
+                  </a-space>
+                </a-form-item>
+                <a-form-item field="kb_ids" label="鐭ヨ瘑搴�">
+                  <a-select
+                    v-model="form.kb_ids"
+                    placeholder="璇烽�夋嫨 ..."
+                    multiple
+                  >
+                    <a-option
+                      v-for="item in tabs"
+                      :key="item.id"
+                      :value="item.id"
+                    >
+                      {{ item.name }}
+                    </a-option>
+                  </a-select>
+                </a-form-item>
+                <!--      <a-form-item>-->
+                <!--        <div style="width: 100%; text-align: right">-->
+                <!--          <a-button @click="visible = false">鍙栨秷</a-button>-->
+                <!--          <a-button style="margin-left: 10px" type="primary" html-type="submit"-->
+                <!--            >纭畾</a-button-->
+                <!--          >-->
+                <!--        </div>-->
+                <!--      </a-form-item>-->
+              </a-form>
+            </div>
+          </a-tab-pane>
+          <a-tab-pane key="2" title="鎻愮ず寮曟搸">
+            <a-divider style="margin-bottom: 20px;margin-top: 0" />
+            <a-scrollbar style="width: 100%;overflow: auto" :style="{height:height}">
+            <a-form
+              ref="formRef1"
+              :rules="rules"
+              :model="form"
+              @submit="handleSubmit"
+              :style="{ width: '90%', margin: '0 auto' }"
+            >
+              <a-form-item field="prompt_config.system" label="绯荤粺">
+                <a-textarea
+                  v-model="form.prompt_config.system"
+                  placeholder=""
+                  style="height: 180px"
+                />
+              </a-form-item>
+              <a-divider style="margin: 0;margin-bottom: 10px" />
+              <a-form-item  label="鐩镐技搴﹂槇鍊�">
+                <a-slider v-model="form.similarity_threshold"  :step="0.01" :min="0" :max="1"  />
+              </a-form-item>
+              <a-form-item  label="鍏抽敭瀛楃浉浼煎害鏉冮噸">
+                <a-slider v-model="form.vector_similarity_weight"  :step="0.01" :min="0" :max="1"  />
+              </a-form-item>
+              <a-form-item  label="Top N">
+                <a-slider v-model="form.top_n" :min="0" :max="30"  />
+              </a-form-item>
+              <a-form-item label="Rerank妯″瀷" >
+                <a-space direction="vertical" size="large">
+                  <a-select :size="'large'" v-model="form.rerank_id"  placeholder="璇烽�夋嫨 ..." allow-clear>
+                    <a-optgroup  :label="index" v-for="(item,index) in rankModelList" :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 v-if="form.rerank_id" label="Top-K">
+                <a-slider v-model="form.top_k" :min="1" :max="2048" />
+              </a-form-item>
+              <a-form-item  label="鍙橀噺">
+                <div style="width: 100%;text-align: right" >
+                  <a-button type="outline" @click="addVariable" style="" size="mini"  shape="round">
+                    鏂板缓
+                  </a-button>
+                </div>
+              </a-form-item>
+              <a-form-item  label="">
+                <a-table
+                  :columns="columns"
+                  :data="form.prompt_config.parameters"
+                  style="width: 100%"
+                >
+                  <template #key="{ record }">
+                    <a-input v-model="record.key" placeholder="" />
+                  </template>
+                  <template #optional="{ record }">
+                    <a-switch v-model="record.optional" size="small" />
+                  </template>
+                  <template #action="{ record }">
+                    <a-button type="text" @click="deleteParameters(record)" style="margin-left: 0px" size="small">
+                      <template #icon>
+                        <icon-delete  />
+                      </template>
+                    </a-button>
+                  </template>
+                </a-table>
+              </a-form-item>
+            </a-form>
+            </a-scrollbar>
+          </a-tab-pane>
+          <a-tab-pane key="3" title="妯″瀷璁剧疆">
+            <a-divider style="margin-bottom: 20px;margin-top: 0" />
+            <div style="width: 100%;" :style="{height:height}">
+              <a-form
+                ref="formRef2"
+                :rules="rules"
+                :model="form"
+                @submit="handleSubmit"
+                :style="{ width: '90%', margin: '0 auto' }"
+              >
+                <a-form-item field="llm_id" label="妯″瀷">
+                  <a-space direction="vertical" size="large">
+                    <a-select :size="'large'" field="llm_id" v-model="form.llm_id" style="width: 400px"  placeholder="璇烽�夋嫨">
+                      <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_id"
+                        >
+                          {{ obj.llm_name }}
+                        </a-option>
+                      </a-optgroup>
+                    </a-select>
+                  </a-space>
+                </a-form-item>
+                <a-divider style="margin-bottom: 20px;margin-top: 0" />
+                <a-form-item label="鑷敱">
+                  <a-select default-value="2" :style="{width:'400px'}" placeholder="">
+                    <a-option value="1">鍗冲叴鍒涗綔</a-option>
+                    <a-option value="2">绮剧‘</a-option>
+                    <a-option value="3">骞宠 </a-option>
+                  </a-select>
+                </a-form-item>
+                <a-form-item label="娓╁害">
+                  <a-switch size="small" />
+                  <a-space direction="vertical" size="large">
+                    <a-slider v-model="form.llm_setting.temperature" :step="0.01" :min="0" :max="1" :style="{ width: '350px', marginLeft: '20px' }" show-input />
+                  </a-space>
+                </a-form-item>
+                <a-form-item label="top P">
+                  <a-switch  size="small" />
+                  <a-space direction="vertical" size="large">
+                    <a-slider v-model="form.llm_setting.top_p" :step="0.01" :min="0" :max="1"  :style="{ width: '350px', marginLeft: '20px' }" show-input />
+                  </a-space>
+                </a-form-item>
+                <a-form-item label="鍑哄腑澶勭綒">
+                  <a-switch size="small" />
+                  <a-space direction="vertical" size="large">
+                    <a-slider v-model="form.llm_setting.presence_penalty" :step="0.01" :min="0" :max="1"  :style="{ width: '350px', marginLeft: '20px' }" show-input />
+                  </a-space>
+                </a-form-item>
+                <a-form-item label="棰戠巼澶勭綒">
+                  <a-switch size="small" />
+                  <a-space direction="vertical" size="large">
+                    <a-slider v-model="form.llm_setting.frequency_penalty" :step="0.01" :min="0" :max="1"  :style="{ width: '350px', marginLeft: '20px' }" show-input />
+                  </a-space>
+                </a-form-item>
+                <a-form-item label="鏈�澶oken鏁�">
+                  <a-switch size="small" />
+                  <a-space direction="vertical" size="large">
+                    <a-slider v-model="form.llm_setting.max_tokens"  :min="0" :max="2048"  :style="{ width: '350px', marginLeft: '20px' }" show-input />
+                  </a-space>
+                </a-form-item>
+              </a-form>
+            </div>
+          </a-tab-pane>
+        </a-tabs>
+      </a-col>
+    </a-row>
+  </a-modal>
+</template>
+
+<script lang="ts" setup>
+import { onMounted, onBeforeMount, reactive, ref, nextTick } from "vue";
+import { kbdocumentupload, queryKbList, queryModelList } from "@/api/kbList";
+import useLoading from "@/hooks/loading";
+import { Message } from "@arco-design/web-vue";
+import { dialogSet } from "@/api/Agent";
+import EventBus from "@/utils/EventBus";
+const { loading,setLoading } = useLoading(true);
+const visible = ref(false);
+const modelList = ref({});
+const rankModelList = ref({});
+let tabs = ref([]);
+const file = ref();
+const formRef = ref();
+const formRef1 = ref();
+const formRef2 = ref();
+const form = reactive({
+  name: "",
+  icon: "",
+  language: "English",
+  prompt_config: {
+    empty_response: "",
+    prologue: "浣犲ソ锛� 鎴戞槸浣犵殑鍔╃悊锛屾湁浠�涔堝彲浠ュ府鍒颁綘鐨勫悧锛�",
+    quote: true,
+    self_rag: true,
+    system: "浣犳槸涓�涓櫤鑳藉姪鎵嬶紝璇锋�荤粨鐭ヨ瘑搴撶殑鍐呭鏉ュ洖绛旈棶棰橈紝璇峰垪涓剧煡璇嗗簱涓殑鏁版嵁璇︾粏鍥炵瓟銆傚綋鎵�鏈夌煡璇嗗簱鍐呭閮戒笌闂鏃犲叧鏃讹紝浣犵殑鍥炵瓟蹇呴』鍖呮嫭鈥滅煡璇嗗簱涓湭鎵惧埌鎮ㄨ鐨勭瓟妗堬紒鈥濊繖鍙ヨ瘽銆�" +
+      "鍥炵瓟闇�瑕佽�冭檻鑱婂ぉ鍘嗗彶銆俓n        浠ヤ笅鏄煡璇嗗簱锛歕n        {knowledge}\n        浠ヤ笂鏄煡璇嗗簱銆�",
+    parameters: [
+      {
+        index: 0,
+        key: "knowledge",
+        optional: false
+      }
+    ]
+  },
+  kb_ids: [],
+  llm_id: "qwen-plus",
+  llm_setting: {
+    temperature: 0.1,
+    top_p: 0.3,
+    presence_penalty: 0.4,
+    frequency_penalty: 0.7,
+    max_tokens: 512
+  },
+  similarity_threshold: 0.2,
+  vector_similarity_weight: 0.30000000000000004,
+  top_n: 8,
+  rerank_id:'',
+  top_k:1024,
+});
+const height = ref('calc(100vh - 520px)');
+const props = defineProps(['typeAngint', 'formData']);
+const emit = defineEmits(['queryList']);
+const columns = [
+  {
+    title: '鍏抽敭瀛�',
+    dataIndex: 'key',
+    slotName: 'key',
+  },
+  {
+    title: '鍙��',
+    dataIndex: 'optional',
+    slotName: 'optional',
+  },
+  {
+    title: '鎿嶄綔',
+    dataIndex: 'action',
+    slotName: 'action',
+  },
+];
+
+const formatter = (value) => {
+  return `${(value / 100).toFixed(2)}`
+};
+
+const onChange = (_, currentFile) => {
+  file.value = currentFile;
+  convertImageToBase64(file.value.file).then((result) => {
+    form.icon = result;
+  });
+};
+
+function convertImageToBase64(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onloadend = function() {
+      resolve(reader.result);
+    };
+    reader.onerror = reject;
+    reader.readAsDataURL(file);
+  });
+}
+
+const onProgress = (currentFile) => {
+  file.value = currentFile;
+};
+
+const rules = {
+  name: [
+    {
+      required: true,
+      message: "鍚嶇О涓嶅厑璁镐负绌�"
+    }
+  ],
+  "prompt_config.system": [
+    {
+      required: true,
+      message: "绯荤粺涓嶅厑璁镐负绌�"
+    }
+  ],
+  llm_id: [
+    {
+      required: true,
+      message: '妯″瀷涓嶈兘涓虹┖',
+    },
+  ],
+  kb_ids: [
+    {
+      required: true,
+      message: '鐭ヨ瘑搴撲笉鑳戒负绌�',
+    },
+  ],
+};
+
+const handleSubmit = ({ values, errors }) => {
+  console.log("values:", values, "\nerrors:", errors);
+  if (!errors) {
+
+  }
+};
+
+const handleClick = () => {
+  visible.value = true;
+};
+defineExpose({
+  handleClick
+});
+
+const handleCancel = () => {
+  visible.value = false;
+  formRef.value.resetFields();
+  formRef1.value.resetFields();
+  formRef2.value.resetFields();
+  form.name = "";
+  emit('queryList');
+};
+
+const handleOpened = (el) => {
+  // Object.assign(form,{
+  //   name: '',// 鐢ㄦ埛鍚�
+  //   nameJoin: '',// 鏄电О
+  //   post: '',// 宀椾綅
+  //   txt: '',// 澶囨敞
+  // });
+  formRef.value.resetFields();
+  form.name = "";
+  form.prompt_config.system = "浣犳槸涓�涓櫤鑳藉姪鎵嬶紝璇锋�荤粨鐭ヨ瘑搴撶殑鍐呭鏉ュ洖绛旈棶棰橈紝璇峰垪涓剧煡璇嗗簱涓殑鏁版嵁璇︾粏鍥炵瓟銆傚綋鎵�鏈夌煡璇嗗簱鍐呭閮戒笌闂鏃犲叧鏃讹紝浣犵殑鍥炵瓟蹇呴』鍖呮嫭鈥滅煡璇嗗簱涓湭鎵惧埌鎮ㄨ鐨勭瓟妗堬紒鈥濊繖鍙ヨ瘽銆�" +
+    "鍥炵瓟闇�瑕佽�冭檻鑱婂ぉ鍘嗗彶銆俓n        浠ヤ笅鏄煡璇嗗簱锛歕n        {knowledge}\n        浠ヤ笂鏄煡璇嗗簱銆�";
+  formRef.value.resetFields();
+  formRef1.value.resetFields();
+  formRef2.value.resetFields();
+};
+
+
+const handleBeforeOk = async (done) => {
+  formRef.value.validate().then(res => {
+    console.log('res:', res)
+  })
+  formRef1.value.validate().then(res => {
+    console.log('res:', res)
+  })
+  formRef2.value.validate().then(res => {
+    console.log('res:', res)
+  })
+  if (form.name && form.kb_ids.length>0 && form.prompt_config.system && form.llm_id) {
+    let title = '鍒涘缓鎴愬姛';
+    let formNew = { ...form };
+    if(formNew.rerank_id){
+      delete formNew.top_k;
+    }
+
+    if(formNew.rerank_id){
+      delete formNew.top_k;
+    }
+
+    if (props.typeAngint == 'edit') {
+      formNew.dialog_id = form.id;
+      delete formNew.id;
+      delete formNew.off;
+      title = '淇敼鎴愬姛';
+    }
+    setLoading(true)
+    try {
+      const data = await dialogSet(formNew);
+      console.log(data, 'data');
+      if (data.code == 0){
+        Message.success(title);
+        handleCancel();
+        EventBus.emit('queryList');
+      }else {
+        Message.error(data.msg);
+      }
+      done(true);
+      setLoading(false)
+    } catch (err) {
+      // you can report use errorHandler or other
+      setLoading(false)
+    }
+  }else {
+    Message.warning('璇峰~鍐欏繀濉」');
+    done(false)
+  }
+};
+
+const editClick = (data) => {
+  visible.value = true;
+  nextTick(()=>{
+    console.log(props.formData,'浼犲叆鏁版嵁');
+    Object.assign(form, props.formData);
+    console.log(form,'琛ㄥ崟鏁版嵁');
+  })
+};
+
+const addVariable = () => {
+  form.prompt_config.parameters.push({
+    index: form.prompt_config.parameters.length,
+    key: "",
+    optional: true
+  });
+  nextTick(() => {
+    formRef.value.validate();
+  });
+}
+
+const deleteParameters = (record) => {
+  // console.log(record, 'record');
+  // console.log(form.prompt_config.parameters);
+  form.prompt_config.parameters = form.prompt_config.parameters.filter(item => item.index !== record.index);
+
+}
+
+
+const queryModel = async (params) => {
+  try {
+    const data = await queryModelList(params);
+    console.log(data.data, '澶фā鍨嬪垪琛�');
+    modelList.value = data.data;
+    rankModelList.value = {
+      BAAI: [data.data.BAAI[1]],
+      Jina: data.data.Jina,
+      youdao: data.data.youdao
+    };
+  } catch (err) {
+    // you can report use errorHandler or other
+  } finally {
+  }
+};
+
+
+const knowledgeData = async (params = { page: 1, page_size: 20 }) => {
+  setLoading(true);
+  try {
+    const { data } = await queryKbList(params);
+    console.log(data, 'data');
+    nextTick(() => {
+      tabs.value = data;
+      console.log(tabs.value, 'tabs');
+    });
+  } catch (err) {
+    // you can report use errorHandler or other
+  } finally {
+    setLoading(false);
+  }
+};
+
+onBeforeMount(() => {
+  queryModel({});
+  knowledgeData();
+});
+onMounted(() => {});
+
+
+
+
+</script>
+<style lang="less" scoped>
+:deep(.arco-tabs-nav-tab-list) {
+  width: 100%;
+
+  .arco-tabs-tab {
+    width: 33%;
+
+    .arco-tabs-tab-title {
+      width: 100%;
+      display: inline-block;
+      text-align: center;
+    }
+  }
+}
+</style>
\ No newline at end of file

--
Gitblit v1.8.0