知识库配置页面修改

src/views/dmx/knowledgeLib/config.vue

@@ -0,0 +1,376 @@
+<template>
+  <div class="main-container">
+    <div class="main-container-lf">
+      <div class="main-container-lf-down">
+        <div style="margin-bottom: 10px">配置</div>
+        <div style="color: #999;">在这里更新您的知识库详细信息，尤其是解析方法。</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="name" label="知识库名称"
+                       :rules="[{required:true,message:'name is required'},{minLength:5,message:'must be greater than 5 characters'}]"
+                       :validate-trigger="['change','input']"
+          >
+            <a-input v-model="form.name" placeholder="请输入" />
+          </a-form-item>
+          <a-form-item field="section" label="知识库图片">
+            <a-space direction="vertical" :style="{ width: '100%' }">
+              <a-upload
+                action="/"
+                :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 field="section" label="描述">
+            <a-textarea placeholder="" allow-clear />
+          </a-form-item>
+          <a-form-item field="section" label="语言" :rules="[{match:/section one/,message:'请选择'}]">
+            <a-select v-model="form.section" placeholder="请选择" allow-clear>
+              <a-option value="0">中文</a-option>
+              <a-option value="1">英文</a-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item field="section" label="嵌入模型" :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-form-item>
+          <a-form-item field="section" label="解析方法" :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-form-item>
+          <a-form-item field="slider" label="块Token数" :rules="[{type:'number', min:5,message:'slider is min than 5'}]">
+            <a-slider v-model="form.score" :max="10" />
+            <a-input-number v-model="form.score" :style="{width:'100px',marginLeft:'2rem',borderRadius:'4px'}" placeholder="Please Enter" class="input-demo" :min="10" :max="1000"/>
+          </a-form-item>
+          <a-form-item field="slider" label="布局识别" :rules="[{type:'number', min:5,message:'slider is min than 5'}]">
+            <a-space direction="vertical" size="large">
+              <a-switch v-model="form.score" checked-value="yes" unchecked-value="no" />
+            </a-space>
+          </a-form-item>
+          <a-form-item field="raptor" label="使用召回增强RAPTOR策略">
+            <a-space direction="vertical" size="large">
+              <a-switch v-model="form.raptor" @change="onChangeRAPTOR" />
+            </a-space>
+          </a-form-item>
+          <div v-if="form.raptor">
+            <a-form-item field="section" label="提示词">
+              <a-textarea style="height: 10rem;border: 1px solid  var(--color-fill-3);border-radius: 4px" placeholder="" allow-clear/>
+            </a-form-item>
+            <a-form-item field="slider" label="最大token数" :rules="[{type:'number', min:5,message:'slider is min than 5'}]">
+              <a-slider v-model="form.score" :max="10" />
+              <a-input-number v-model="form.score" :style="{width:'100px',marginLeft:'2rem',borderRadius:'4px'}" placeholder="Please Enter" class="input-demo" :min="10" :max="1000"/>
+            </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-input-number v-model="form.score" :style="{width:'100px',marginLeft:'2rem',borderRadius:'4px'}" placeholder="Please Enter" class="input-demo" :min="10" :max="1000"/>
+            </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-input-number v-model="form.score" :style="{width:'100px',marginLeft:'2rem',borderRadius:'4px'}" placeholder="Please Enter" class="input-demo" :min="10" :max="1000"/>
+            </a-form-item>
+            <a-form-item field="slider" label="随机种子" :rules="[{type:'number', min:5,message:'slider is min than 5'}]">
+              <a-input-number v-model="form.score" :style="{width:'300px',marginRight:'1rem',borderRadius:'4px'}" placeholder="请输入" class="input-demo" :min="10" :max="100"/>
+              <a-button type="primary" @click=""><icon-plus /></a-button>
+
+            </a-form-item>
+
+          </div>
+
+
+
+
+
+
+
+
+            <a-form-item>
+              <div style="width: 100%;text-align: right">
+                <a-space>
+                  <a-button type="primary" html-type="submit">保存</a-button>
+                  <!--               <a-button @click="$refs.formRef.resetFields()">Reset</a-button>-->
+                </a-space>
+              </div>
+            </a-form-item>
+        </a-form>
+      </div>
+    </div>
+    <div class="main-container-rt">
+
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { onMounted, onBeforeMount, reactive, ref } from "vue";
+import { Message } from "@arco-design/web-vue";
+
+const props = defineProps({
+  record: {
+    type: Object,
+    default: () => {
+      return {};
+    }
+  }
+});
+
+
+const visible = ref(false);
+const configIsShow = ref(false);
+const loading = ref(false);
+const formRef = ref(null);
+
+
+const form = reactive({
+  size: "medium",
+  name: "",
+  age: undefined,
+  section: "0",
+  province: "haidian",
+  options: [],
+  date: "",
+  time: "",
+  radio: "radio one",
+  slider: 5,
+  score: 5,
+  switch: false,
+  multiSelect: ["section one"],
+  treeSelect: "",
+  raptor: false
+});
+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 file = ref();
+
+const onChange = (_, currentFile) => {
+  file.value = {
+    ...currentFile
+    // url: URL.createObjectURL(currentFile.file),
+  };
+};
+const onProgress = (currentFile) => {
+  file.value = currentFile;
+};
+
+
+const handleSubmit = ({ values, errors }) => {
+  console.log("values:", values, "\nerrors:", errors);
+};
+
+
+const onChangeRAPTOR = () => {
+  console.log(form.raptor);
+};
+
+
+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;
+};
+
+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);
+  // }
+};
+
+onBeforeMount(() => {
+
+});
+onMounted(() => {
+
+
+});
+</script>
+
+<script lang="ts">
+import { IconEdit, IconPlus } from "@arco-design/web-vue/es/icon";
+
+export default {
+  name: "config",
+  components: { IconPlus, IconEdit },
+  methods: {}
+};
+</script>
+<style scoped lang="less">
+.main-container {
+  display: flex;
+  justify-content: space-between;
+  height: 100%;
+  overflow: auto;
+  //background: #626aea;
+  background: #ffffff;
+  &-lf {
+    width: 40%;
+    //height: 100%;
+    //border: 1px solid #cccccc;
+    border-radius: 10px;
+
+    &-top {
+      width: 100%;
+      height: 60px;
+      line-height: 60px;
+      //background: rgb(var(--primary-6));
+      //color: #ffffff;
+      //text-align: center;
+    }
+
+    &-down {
+      padding: 20px;
+      width: 100%;
+    }
+  }
+
+  &-form-item-extra {
+    width: 100%;
+    height: 20rem;
+    border: 1px solid var(--color-fill-3);
+    border-radius: 6px;
+    overflow: hidden;
+
+    &-top {
+      width: 100%;
+      height: 40px;
+      line-height: 40px;
+      border-bottom: 1px solid var(--color-fill-3);
+      //background: rgb(var(--primary-6));
+      color: #999999;
+      text-align: center;
+    }
+
+    &-down {
+      width: 92%;
+      margin-left: 4%;
+      margin-top: 30px;
+    }
+
+    &-btn {
+      width: 96%;
+      text-align: right;
+      margin-top: 1rem;
+    }
+  }
+
+  &-rt {
+    width: 60%;
+    //background: #626aea;
+    //border: 1px solid #cccccc;
+    border-radius: 10px;
+  }
+}
+</style>

src/views/dmx/knowledgeLib/index.vue

@@ -263,12 +263,12 @@
           </a-tab-pane>
           <a-tab-pane key="2" title="测试">
             <div class="rt-container-main">
-
+              <test ></test>
             </div>
           </a-tab-pane>
           <a-tab-pane key="3" title="配置">
             <div class="rt-container-main">
-
+              <config ></config>
             </div>
           </a-tab-pane>
         </a-tabs>
@@ -287,7 +287,9 @@
   import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
   import cloneDeep from 'lodash/cloneDeep';
   import Sortable from 'sortablejs';
-  import add from '@/views/user/account/add.vue'
+  import add from '@/views/dmx/knowledgeLib/add.vue'
+  import config from '@/views/dmx/knowledgeLib/config.vue'
+  import test from '@/views/dmx/knowledgeLib/test.vue'
   import { deleteAccount } from "@/api/account";
   type SizeProps = 'mini' | 'small' | 'medium' | 'large';
   type Column = TableColumnData & { checked?: true };
@@ -344,43 +346,29 @@
     //   dataIndex: 'index',
     //   slotName: 'index',
     // },
-    // {
-    //   title: t('searchTable.columns.number'),
-    //   dataIndex: 'number',
-    // },
     {
-      title: t('用户名'),
+      title: t('名称'),
       dataIndex: 'name',
     },
-    // {
-    //   title: t('searchTable.columns.contentType'),
-    //   dataIndex: 'contentType',
-    //   slotName: 'contentType',
-    // },
-    // {
-    //   title: t('searchTable.columns.filterType'),
-    //   dataIndex: 'filterType',
-    // },
-    // {
-    //   title: t('searchTable.columns.count'),
-    //   dataIndex: 'count',
-    // },
     {
-      title: t('创建时间'),
-      dataIndex: 'createdTime',
+      title: t('分快数'),
+      dataIndex: 'contentType',
+      slotName: 'contentType',
     },
     {
-      title: t('所属部门'),
+      title: t('上传时间'),
       dataIndex: 'filterType',
-      slotName: 'filterType',
     },
     {
-      title: t('备注'),
-      dataIndex: 'status',
-      slotName: 'status',
+      title: t('创建人'),
+      dataIndex: 'count',
+    },
+    {
+      title: t('解析状态'),
+      dataIndex: 'createdTime',
     },
     {
-      title: t('searchTable.columns.operations'),
+      title: t('操作'),
       dataIndex: 'operations',
       slotName: 'operations',
     },

src/views/dmx/knowledgeLib/test.vue

@@ -0,0 +1,277 @@
+
+<template>
+    <div class="main-container">
+      <div class="main-container-lf">
+        <div class="main-container-lf-top">检索测试</div>
+        <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-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-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-form-item>
+            <a-form-item field="section" :rules="[{match:/section one/,message:'请选择'}]">
+              <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/>
+                </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>
+              <a-tag size="small">看法</a-tag>
+            </template>
+            <div>
+              <a-empty />
+            </div>
+          </a-collapse-item>
+        </a-collapse>
+      </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { onMounted ,onBeforeMount, reactive, ref } from "vue";
+import { Message } from '@arco-design/web-vue';
+
+const props = defineProps({
+  record: {
+    type: Object,
+    default: () => {
+      return {}
+    }
+  }
+})
+
+
+
+
+const visible = ref(false);
+const 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 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 handleSubmit = ({values, errors}) => {
+  console.log('values:', values, '\nerrors:', errors)
+}
+
+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;
+}
+
+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);
+  // }
+}
+
+onBeforeMount(()=>{
+
+})
+onMounted(()=>{
+
+
+})
+</script>
+
+<script lang="ts">
+export default {
+  name: 'config',
+  methods: {
+
+  }
+};
+</script>
+<style scoped lang="less">
+  .main-container{
+    display: flex;
+    justify-content: space-between;
+    height: 100%;
+    //background: #626aea;
+    &-lf{
+      width: 30%;
+      height: 100%;
+      //border: 1px solid #cccccc;
+      background: #ffffff;
+      border-radius: 10px;
+      overflow: hidden;
+      &-top{
+        width: 100%;
+        height: 60px;
+        line-height: 60px;
+        background: rgb(var(--primary-6));
+        color: #ffffff;
+        text-align: center;
+      }
+      &-down{
+        padding: 20px;
+        width: 100%;
+      }
+    }
+    &-form-item-extra{
+      width: 100%;
+      height: 20rem;
+      border: 1px solid var(--color-fill-3);
+      border-radius: 6px;
+      overflow: hidden;
+      &-top{
+        width: 100%;
+        height: 40px;
+        line-height: 40px;
+        border-bottom: 1px solid  var(--color-fill-3);
+        //background: rgb(var(--primary-6));
+        color: #999999;
+        text-align: center;
+      }
+      &-down{
+        width: 92%;
+        margin-left: 4%;
+        margin-top: 30px;
+      }
+      &-btn{
+        width: 96%;
+        text-align: right;
+        margin-top: 1rem;
+      }
+    }
+    &-rt{
+      width: 69%;
+      height: 100%;
+      //background: #626aea;
+      //border: 1px solid #cccccc;
+      background: #ffffff;
+      border-radius: 10px;
+    }
+  }
+</style>