智能体管理的页面开发和功能开发

liudong

2024-08-02 3a022dc2caa78267a681824ea1c303f140cd6797

 src/views/dmx/knowledgeLib/index.vue

@@ -11,7 +11,7 @@
          <addKnow @knowledgeData="knowledgeData"></addKnow>
        </div>
        <div class="lf-container-down">
          <div class="tabs">
          <a-scrollbar style="height:56rem;overflow: auto;">
            <div
              class="tab"
              v-for="(tab, index) in tabs"
@@ -29,8 +29,8 @@
                </template>
              </a-popover>
            </div>
          </a-scrollbar>
          </div>
        </div>
      </div>
      <div class="rt-container">
        <a-tabs default-active-key="1">
@@ -228,11 +228,13 @@
                        <icon-download />
                      </template>
                    </a-button>

                    <a-button type="text" size="small"  @click="seeload(record)">
                      <template #icon>
                        <icon-eye />
                      </template>
                    </a-button>

                  </template>
                </a-table>
              </a-card>
@@ -249,44 +251,50 @@
            </div>
          </a-tab-pane>
        </a-tabs>
        <div v-if="detailsShow" class="details">
          <div class="details-header">
            <div style="display: flex;align-items: center">
              <span><icon-arrow-left size="20px" style="cursor: pointer;color: #0960bd;margin: 10px" @click="goBackClick" /></span>
              <icon-file style="color: #0960bd;margin-right: 4px;" />
              <span style="">123.docx</span>
            </div>
            <div style="display: flex; align-items: center;">
              <a-radio-group v-model="position" type="button" style="margin-right: 10px">
                <a-radio value="top">{{'dmx.list.EntireArticle'}}</a-radio>
                <a-radio value="right">{{'dmx.list.omit'}}</a-radio>
              </a-radio-group>
              <a-popover position="bottom">
                <a-button type="outline" class="button" style="margin-right: 10px">{{'dmx.list.batch'}} <icon-down style="margin-left: 4px" /></a-button>
                <template #content>
                  <p>Here is the text content</p>
                  <p>Here is the text content</p>
                </template>
              </a-popover>
              <a-button type="outline" class="button" style="margin-right: 10px">
                <template #icon>
                  <icon-search />
                </template>
              </a-button>
              <a-popover position="bottom">
                <a-button type="outline" class="button" style="margin-right: 10px"><icon-sort /></a-button>
                <template #content>
                  <p>Here is the text content</p>
                  <p>Here is the text content</p>
                </template>
              </a-popover>
              <addDetails></addDetails>
            </div>
          </div>
          <a-divider style="margin-top: 10px" />
        </div>
<!--        <div v-if="detailsShow" class="details">-->
<!--          <div class="details-header">-->
<!--            <div style="display: flex;align-items: center">-->
<!--              <span><icon-arrow-left size="20px" style="cursor: pointer;color: #0960bd;margin: 10px" @click="goBackClick" /></span>-->
<!--              <icon-file style="color: #0960bd;margin-right: 4px;" />-->
<!--              <span style="">123.docx</span>-->
<!--            </div>-->
<!--            <div style="display: flex; align-items: center;">-->
<!--              <a-radio-group v-model="position" type="button" style="margin-right: 10px">-->
<!--                <a-radio value="top">{{'dmx.list.EntireArticle'}}</a-radio>-->
<!--                <a-radio value="right">{{'dmx.list.omit'}}</a-radio>-->
<!--              </a-radio-group>-->
<!--              <a-popover position="bottom">-->
<!--                <a-button type="outline" class="button" style="margin-right: 10px">{{'dmx.list.batch'}} <icon-down style="margin-left: 4px" /></a-button>-->
<!--                <template #content>-->
<!--                  <p>Here is the text content</p>-->
<!--                  <p>Here is the text content</p>-->
<!--                </template>-->
<!--              </a-popover>-->
<!--              <a-button type="outline" class="button" style="margin-right: 10px">-->
<!--                <template #icon>-->
<!--                  <icon-search />-->
<!--                </template>-->
<!--              </a-button>-->
<!--              <a-popover position="bottom">-->
<!--                <a-button type="outline" class="button" style="margin-right: 10px"><icon-sort /></a-button>-->
<!--                <template #content>-->
<!--                  <p>Here is the text content</p>-->
<!--                  <p>Here is the text content</p>-->
<!--                </template>-->
<!--              </a-popover>-->
<!--              <addDetails></addDetails>-->
<!--            </div>-->
<!--          </div>-->
<!--          <a-divider style="margin-top: 10px" />-->
<!--        </div>-->
      </div>
    </div>
    <a-modal title=" " v-model:visible="visible" :footer="false" fullscreen>
<!--      <docx v-if="documenttype=='docx'" previewSrc="http://192.168.20.116:1080/v1/document/get/405c3efa4d8c11ef97560242ac120006"></docx>-->
      <docx v-if="documenttype=='docx'" :previewSrc="previewSrc"></docx>
      <excel v-if="documenttype=='excel'" :previewSrc="previewSrc"></excel>
      <txtPdf v-if="documenttype=='txtPdf'" :previewSrc="previewSrc"></txtPdf>
    </a-modal>
  </div>
</template>

@@ -314,11 +322,11 @@
  import config from '@/views/dmx/knowledgeLib/config.vue'
  import test from '@/views/dmx/knowledgeLib/test.vue'
  import tool from '@/views/dmx/knowledgeLib/tool.vue'
  import addDetails from '@/views/dmx/knowledgeLib/addDetails.vue'
  import docx from '@/views/dmx/knowledgeLib/components/docx.vue'
  import excel from '@/views/dmx/knowledgeLib/components/excel.vue'
  import txtPdf from '@/views/dmx/knowledgeLib/components/txtPdf.vue'
  import { Message } from "@arco-design/web-vue";
  import { parseTime } from "@/utils";
  import { usePinia } from "@/store";
  const store = usePinia();
  type SizeProps = 'mini' | 'small' | 'medium' | 'large';
  type Column = TableColumnData & { checked?: true };
  const account = ref(null)
@@ -346,10 +354,13 @@
  let selectedTab = ref(0)
  let testForm = ref(null)
  let configForm = ref(null)
  let documenttype = ref('docx')
  let previewSrc = ref('')
  let kbId = ref('')
  let kbobj = reactive({})
  let kbdetail = reactive({})
  let parser_ids = reactive({})
  let seeObj = reactive({})
  let kbtenantInfo = reactive({
    "asr_id": "paraformer-realtime-8k-v1",
    "embd_id": "BAAI/bge-large-zh-v1.5",
@@ -507,9 +518,6 @@
        kbdetail  = await queryKbdetail({
          kb_id:params.kb_id,
        });




      }
    } catch (err) {
@@ -671,8 +679,25 @@
      filename: record.name,
    });
  }
const   seeload =  async (row)=>{
  console.log(row);
const   seeload = async (row)=>{
  Object.assign(seeObj, row)
  // console.log(seeObj.name, 'seeObj');
  let type = row.name.split('.')[1];
  console.log(type);
  if(type=='pdf'){
    documenttype.value = 'txtPdf'
  }else if(type=='docx'){
    documenttype.value = 'docx'
  }else if(type=='xlsx'){
    documenttype.value = 'excel'
  }else if(type=='txt'){
    documenttype.value = 'txtPdf'
  }else {
    return false
  }
  previewSrc.value = `${import.meta.env.VITE_API_BASE_URL}/v1/document/get/${row.id}`
  visible.value = true;

}

const   handleChangeStatus =  async (row)=>{
@@ -753,6 +778,8 @@
    padding: 0 20px 20px 20px;
    .main-container{
      display: flex;
      width: 100%;
      height: 100%;
      .lf-container{
        display: flex;
        flex-direction: column;
@@ -762,19 +789,26 @@
        width: 200px;
        .lf-container-top{
          display: flex;
          margin: 10px 0;
        }
        .lf-container-down{
          display: flex;
          flex-direction: column;
          box-sizing: border-box;
          width: 90%;
          height: calc(100% - 5rem);
          //height: 56rem;
          border: 1px solid #eeeeee;
          overflow: auto;
          padding: 10px;
          .tabs .tab {
          //padding: 10px;
          margin-bottom: 10px;
          //.tabs{
          //  width: 100%;
          //  height: 100%;
          //  overflow: auto;
          //}
          .tab {
            cursor: pointer;
            box-sizing: border-box;
            margin: 10px 0;
            margin: 10px 10px;
            padding:0 10px;
            color: rgba(0, 0, 0, 0.88);
            font-size: 14px;
@@ -786,12 +820,12 @@
            border: 1px solid #f0f0f0;
            border-radius: 8px;
          }
          .tabs .tab:hover {
          .tab:hover {
            border: 1px solid #ffffff;
            background: #e8e8ea;
            box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
          }
          .tabs .tab.active {
          .tab.active {
            border: 1px solid #e8e8ea;
            background: #e8e8ea;
            cursor: pointer;
@@ -803,7 +837,7 @@
        //background: #626aea;
        margin-left: 20px;
        width: calc(100% - 200px);
        height: calc(100% - 5rem);
        height: 56rem;
        .rt-container-main{
          height: 76vh;
        }