Sfoglia il codice sorgente

fix: ai问答展示样式修改

hotchicken1996 3 settimane fa
parent
commit
a89c217250

BIN
client/src/assets/imgs/ai/aiTip.png


+ 34 - 1
client/src/views/OaSystem/aiQA/components/AResult.vue

@@ -7,6 +7,11 @@ interface AResultProps {
   data: AResultRecord
 }
 
+const layoutRightRef = inject('layoutRightRef')
+
+onMounted(() => {
+  console.log('onMounted: ', layoutRightRef.value)
+})
 const props = defineProps<AResultProps>()
 const { data } = toRefs(props)
 // 格式化处理pdf文件
@@ -68,14 +73,28 @@ const handleClose = (): void => {
       </div>
     </div>
     <!--    PDF预览弹窗    -->
+    <!--   :append-to="layoutRightRef" 该属性2.4.3开始支持  -->
     <el-dialog
-      :title="targetViewPdf?.name ?? ''"
+      class="pdf-view-dialog"
       v-model="dialogVisible"
       width="80%"
       @close="handleClose"
       append-to-body
       destroy-on-close
     >
+      <template #header>
+        <div class="pdf-view-header">
+          <h4 class="title">{{ targetViewPdf?.name ?? '' }}</h4>
+          <a class="pdf-link" :href="targetViewPdf?.link">
+            <el-button class="down-load-btn">
+              <el-icon class="el-icon--left">
+                <Download />
+              </el-icon>
+              下载
+            </el-button>
+          </a>
+        </div>
+      </template>
       <div class="pdf-view-body">
         <PDFView
           v-if="targetViewPdf?.link"
@@ -123,4 +142,18 @@ const handleClose = (): void => {
   height: 70vh;
   overflow-y: auto;
 }
+
+.pdf-view-header {
+  display: flex;
+  align-items: center;
+
+  .down-load-btn {
+    margin-left: 10px;
+  }
+}
+</style>
+<style>
+.pdf-view-dialog{
+  margin: calc(50vh - 375px) calc(10% - 92px) calc(50vh - 375px) calc(10% + 92px);
+}
 </style>

+ 12 - 1
client/src/views/OaSystem/aiQA/components/ResultMessageView.vue

@@ -39,7 +39,7 @@ const realContentHtml = computed(() => {
   // 使用正则表达式匹配 [[index]] 格式,并替换为 <b>index</b>
   // 同时添加点击事件
   return MD.render(realResultContent?.value)?.replace(/\[\[(\d+)\]\]/g, (match, index) => {
-    return `<b class="clickable-index" data-index="${index}">[[${index}]]</b>`
+    return `<b class="clickable-index" data-index="${index}">${index}</b>`
   })
 })
 
@@ -91,8 +91,19 @@ const handleClick = (e: Event): void => {
 
     :deep(.clickable-index) {
       //color: #446ae7;
+      display: inline-flex;
+      justify-content: center;
+      align-items: center;
       font-weight: 700;
       cursor: pointer;
+      padding:2px 6px;
+      font-size: 12px;
+      background: #FFFFFF;
+      border-radius: 4px 4px 4px 4px;
+      border: 1px solid #BACAE3;
+      &:hover{
+        background: #BACAE399
+      }
     }
   }
 }

+ 3 - 1
client/src/views/OaSystem/oaLayout/index.vue

@@ -3,7 +3,7 @@
     <div class="layout-left">
       <Menus />
     </div>
-    <div class="layout-right">
+    <div class="layout-right" ref="layoutRightRef">
       <div class="layout-header">
         <Header />
         <TagList />
@@ -44,6 +44,8 @@ const route = useRoute()
 const isFrameView = ref<boolean>(false)
 const iframeViews = ref<any[]>([])
 const currentIframeId = ref<string>('')
+const layoutRightRef = ref<HTMLDivElement>(null)
+provide('layoutRightRef', layoutRightRef)
 
 const getCaches = computed((): string[] => {
   return Array.from(tagsViewStore.cachedViews)

+ 20 - 2
client/src/views/OaSystem/oaLayout/menus.vue

@@ -45,7 +45,10 @@
           <MenusActive :menuData="menuData" v-if="mouseenterIndex == index" />
         </div>
       </el-menu>
-      <img :src="AIBtn" alt="" class="ai-btn" @click="handleGoToAi" />
+      <div class="ai-btn">
+        <img class="ai-tip" :src="AITip" alt="" />
+        <img :src="AIBtn" alt="" class="robot" @click="handleGoToAi" />
+      </div>
     </div>
   </div>
 </template>
@@ -64,6 +67,7 @@ import subscribe from '@/utils/Subscribe'
 import request from '@/config/axios'
 import { useUserStoreWithOut } from '@/store/modules/user'
 import AIBtn from '@/assets/imgs/ai/robot.png'
+import AITip from '@/assets/imgs/ai/aiTip.png'
 
 defineOptions({ name: 'Header' })
 const { t } = useI18n()
@@ -123,7 +127,8 @@ const loginOut = () => {
       tagsViewStore.delAllViews()
       replace('/login?redirect=/index')
     })
-    .catch(() => {})
+    .catch(() => {
+    })
 }
 const handleGoToAi = (): void => {
   push('/OaSystem/aiQA')
@@ -346,6 +351,19 @@ onMounted(() => {
       transform: translateX(-50%);
       z-index: 9;
       cursor: pointer;
+
+      .ai-tip {
+        width: 60px;
+        height: 22px;
+        position: absolute;
+        bottom: 80px;
+        right: -20px;
+      }
+
+      .robot{
+        width: 85px;
+        height: 102px;
+      }
     }
 
     .menuDiv {