sg-paisou 0.0.0 → 0.0.1

package/src/components/AIChatSDK/component/Dialogs.vue

@@ -1,340 +0,0 @@
-<template>
-  <div class="dialogs" v-if="visible">
-    <!-- 无法解答弹窗 -->
-    <div class="insolubility-content" v-if="dialogType === 'insolubility'">
-      <img :src="insolubilityIcon" class="insolubility-content-img" alt="">
-      <div class="insolubility-content-text">
-        <span>Oops, Sorry</span>
-        <span class="insolubility-content-text-subtext">Thinkie can't explain this question.</span>
-        <div class="insolubility-content-button"  @click="handleBack">
-          <img :src="photographIcon" alt="">
-          <span>Snap another one</span>
-        </div>
-      </div>
-    </div>
-
-    <!-- 反馈弹窗 -->
-    <div class="feedback-dialog" v-if="dialogType === 'feedback'">
-      <!-- 顶部图片和关闭按钮 -->
-      <div class="feedback-header">
-        <img :src="feedbackThinkieImg" class="feedback-robot-img" alt="Feedback">
-        <div class="close-button" @click="handleClose">
-          <svg width="24" height="24" viewBox="0 0 24 24" fill="none">
-            <path d="M18 6L6 18M6 6L18 18" stroke="#999999" stroke-width="2.4" stroke-linecap="round"/>
-          </svg>
-        </div>
-      </div>
-      <div class="feedback-content">
-        <!-- 标题 -->
-        <div class="feedback-title">Problem Feedback</div>
-        <div class="feedback-subtitle">Can you tell us what went wrong?</div>
-
-        <!-- 反馈选项 -->
-        <div class="feedback-tags">
-          <div
-            v-for="tag in feedbackOptions"
-            :key="tag.value"
-            class="feedback-tag"
-            :class="{ active: selectedTags.includes(tag.value) }"
-            @click="toggleTag(tag.value)"
-          >
-            {{ tag.label }}
-          </div>
-        </div>
-
-        <!-- 输入框 -->
-        <textarea
-          v-model="feedbackText"
-          class="feedback-textarea"
-          placeholder="Tell us more how we can improve"
-          rows="5"
-        ></textarea>
-
-        <!-- 提交按钮 -->
-        <button
-          class="feedback-submit"
-          :class="{ disabled: !canSubmit }"
-          :disabled="!canSubmit"
-          @click="handleSubmit"
-        >
-          Submit
-        </button>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { ref, computed } from 'vue'
-import { backToClient } from '../../../utils/bridge'
-import { feedbackApi } from '../../../utils/request'
-import { showMessageToast } from '../../../utils/messageToast'
-import insolubilityIcon from '@/assets/images/insolubility.png'
-import photographIcon from '@/assets/images/photograph-icon.png'
-import feedbackThinkieImg from '@/assets/images/feedback-thinkie-img.png'
-
-// 反馈类型枚举
-export type FeedbackType = 'angry' | 'thumbsDown' // 'angry' 对应😡，'thumbsDown' 对应👎
-
-const props = withDefaults(defineProps<{
-  visible: boolean
-  dialogType: 'insolubility' | 'feedback'
-  feedbackType?: FeedbackType
-  currentLongPressMessageId?: string
-}>(), {
-  visible: false,
-  dialogType: 'insolubility',
-  feedbackType: 'angry',
-  currentLongPressMessageId: ''
-})
-
-// Emits
-const emit = defineEmits<{
-  (e: 'close', messageId?: string): void
-  (e: 'submit', data: { tags: string[], text: string }): void
-}>()
-
-// 反馈选项配置
-const baseOptions = [
-  { value: 'wrong_answer', label: 'Wrong answer' },
-  { value: 'difficult_to_understand', label: 'Difficult to understand' },
-  { value: 'too_much_detail', label: 'Too much detail' },
-  { value: 'poor_formatting', label: 'Poor formatting' },
-  { value: 'lacks_detail', label: 'Lacks detail' }
-]
-
-// 反馈选项
-const feedbackOptions = computed(() => 
-  props.feedbackType === 'thumbsDown' 
-    ? [...baseOptions, { value: 'slow', label: 'Slow' }, { value: 'wrong_explanation', label: 'Wrong explanation' }]
-    : baseOptions
-)
-
-// 选中的标签
-const selectedTags = ref<string[]>([])
-// 反馈文本
-const feedbackText = ref('')
-// 是否可以提交
-const canSubmit = computed(() => selectedTags.value.length > 0)
-
-const resetState = () => {
-  selectedTags.value = []
-  feedbackText.value = ''
-}
-
-const handleBack = () => backToClient()
-
-const toggleTag = (value: string) => {
-  const index = selectedTags.value.indexOf(value)
-  index > -1 ? selectedTags.value.splice(index, 1) : selectedTags.value.push(value)
-}
-
-// 关闭弹窗
-const handleClose = () => {
-  resetState()
-  emit('close')
-}
-
-// 提交反馈
-const handleSubmit = async () => {
-  if (!canSubmit.value) return
-  
-  const subjectId = props.feedbackType === 'thumbsDown'
-    ? props.currentLongPressMessageId
-    : JSON.parse(sessionStorage.getItem('questionInfo') || '{}')?.sessionId || ''
-  
-  await feedbackApi({
-    subjectId,
-    tags: selectedTags.value,
-    content: feedbackText.value.trim(),
-    vote: 'downvote'
-  })
-  
-  showMessageToast()
-  resetState()
-  emit('close', props.currentLongPressMessageId || '')
-}
-
-defineExpose({ handleClose, handleSubmit })
-</script>
-
-<style lang="scss" scoped>
-.dialogs {
-  position: fixed;
-  inset: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background: rgba(0, 0, 0, 0.5);
-  z-index: 1000;
-
-  // 无法解答弹窗样式
-  .insolubility-content {
-    width: 350px;
-
-    .insolubility-content-img {
-      width: 100%;
-      vertical-align: top;
-    }
-
-    .insolubility-content-text {
-      width: 100%;
-      font-weight: 500;
-      color: #222;
-      background: #FFF;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      gap: 16px;
-      padding: 20px 0;
-      text-transform: capitalize;
-      border-radius: 0 0 20px 20px;
-
-      span {
-        font-size: 20px;
-        line-height: 24px;
-      }
-
-      .insolubility-content-text-subtext {
-        font-size: 16px;
-        color: #999;
-      }
-
-      .insolubility-content-button {
-        padding: 8px 16px;
-        background: linear-gradient(91.95deg, #FFCB00 0%, #FFAB03 100%);
-        border-radius: 70px;
-        display: flex;
-        align-items: center;
-
-        img {
-          width: 20px;
-          margin-right: 8px;
-        }
-
-        span {
-          font-size: 16px;
-          color: #FFF;
-        }
-      }
-    }
-  }
-
-  // 反馈弹窗样式
-  .feedback-dialog {
-    width: 420px;
-    overflow: hidden;
-    display: flex;
-    flex-direction: column;
-
-    .feedback-header {
-      position: relative;
-
-      .feedback-robot-img {
-        width: 100%;
-        vertical-align: top;
-      }
-
-      .close-button {
-        position: absolute;
-        top: 37px;
-        right: 12px;
-      }
-    }
-
-    .feedback-content {
-      padding: 12px 20px 20px;
-      background: #FFF;
-      border-radius: 0 0 20px 20px;
-      display: flex;
-      flex-direction: column;
-
-      .feedback-title {
-        font-size: 20px;
-        font-weight: 500;
-        line-height: 24px;
-        color: #222;
-        text-align: center;
-      }
-
-      .feedback-subtitle {
-        line-height: 24px;
-        color: #999;
-        text-align: center;
-        margin-top: 8px;
-      }
-
-      .feedback-tags {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 12px;
-        margin-top: 8px;
-        justify-content: center;
-
-        .feedback-tag {
-          font-size: 14px;
-          padding: 6px 8px 6px 12px;
-          background: rgba(0, 0, 0, 0.03);
-          border: 1px solid transparent;
-          border-radius: 38px;
-          color: #666;
-          user-select: none;
-          line-height: 100%;
-
-          &.active {
-            background: #FFF;
-            border-color: rgba(255, 157, 0, 0.3);
-            color: #FF9D00;
-          }
-
-          &:active {
-            transform: scale(0.98);
-          }
-        }
-      }
-
-      .feedback-textarea {
-        height: 94px;
-        margin-top: 12px;
-        padding: 12px;
-        background: #F7F7F7;
-        border: 1px solid transparent;
-        border-radius: 12px;
-        font-size: 14px;
-        line-height: 24px;
-        color: #222;
-        resize: none;
-        outline: none;
-        transition: all 0.2s;
-        font-family: inherit;
-
-        &::placeholder {
-          color: #999;
-        }
-
-        &:focus {
-          background: #FFF;
-          border-color: #FFAB03;
-        }
-      }
-
-      .feedback-submit {
-        margin-top: 16px;
-        padding: 8px 24px;
-        background: linear-gradient(91.95deg, #FFCB00 0%, #FFAB03 100%);
-        border: none;
-        border-radius: 70px;
-        font-size: 16px;
-        font-weight: 500;
-        line-height: 24px;
-        color: #FFF;
-        transition: all 0.2s;
-
-        &.disabled {
-          opacity: 0.2;
-        }
-      }
-    }
-  }
-}
-</style>

package/src/components/AIChatSDK/component/SpecialQuestions.vue

@@ -1,208 +0,0 @@
-<template>
-  <!-- 特殊题 -->
-  <div class="special-questions">
-    <div class="solution-content">
-      <div class="solution-content-title">
-        <img :src="solutionIcon" alt="Solution">
-        <span class="solution-content-title-text">Solution</span>
-      </div>
-      <div 
-        ref="solutionRef"
-        class="solution-content-description"
-        v-html="renderedSolution"
-      ></div>
-    </div>
-    <div class="answer-content">
-      <div class="answer-content-title">
-        <img :src="answerIcon" alt="Answer">
-        <span class="answer-content-title-text">Answer</span>
-      </div>
-      <div 
-        ref="answerRef"
-        class="answer-content-description"
-        v-html="renderedAnswer"
-      ></div>
-    </div>
-    <div class="feedback-content">
-      <span class="feedback-content-title">Was this solution helpful?</span>
-      <img :src="smilingIcon" alt="Feedback" @click="handleFeedback('upvote')">
-      <img :src="angerIcon" alt="Feedback" @click="handleFeedback('downvote')">
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { ref, onMounted, watch, nextTick } from 'vue'
-import solutionIcon from '@/assets/images/solution-icon.png'
-import answerIcon from '@/assets/images/answer-icon.png'
-import smilingIcon from '@/assets/images/smiling.png'
-import angerIcon from '@/assets/images/anger.png'
-
-// Props
-const props = withDefaults(defineProps<{
-  solutionAnswer?: { solution: any, answer: any }  // 解析数据
-  isDownVoted?: boolean
-}>(), {
-  solutionAnswer: () => ({ solution: null, answer: null } as { solution: any, answer: any })
-})
-
-// Emits
-const emit = defineEmits<{
-  (e: 'feedback', type: 'upvote' | 'downvote', isDownVoted: boolean): void
-}>()
-
-// Refs
-const solutionRef = ref<HTMLElement>()
-const answerRef = ref<HTMLElement>()
-const renderedSolution = ref('')
-const renderedAnswer = ref('')
-
-// 声明全局 TalqsTemplate 和 MathJax
-declare global {
-  interface Window {
-    TalqsTemplate: any
-    MathJax: any
-  }
-}
-
-// 渲染 Solution
-const renderSolution = () => {
-  try {
-    // 使用 TalqsTemplate 渲染
-    if (window.TalqsTemplate) {
-      renderedSolution.value = window.TalqsTemplate.render(props.solutionAnswer.solution, {
-        // 可以添加配置选项
-      })
-      console.log(renderedSolution.value);
-      nextTick(() => {
-        renderMathJax(solutionRef.value)
-      })
-    }
-  } catch (error) {
-    console.error('Solution 渲染失败:', error)
-    renderedSolution.value = '<div>渲染失败</div>'
-  }
-}
-
-// 渲染 Answer
-const renderAnswer = () => {
-  try {
-    // 使用 TalqsTemplate 渲染
-    if (window.TalqsTemplate) {
-       
-        
-      renderedAnswer.value = window.TalqsTemplate.render(props.solutionAnswer.solution, {
-        analyzeVersion: 2, // 解析显示版本
-        entryTemplate: window.TalqsTemplate.components.AnalyzeWrapper, // 入口组件
-        // 可以添加配置选项
-      })
-      console.log(renderedAnswer.value);
-      nextTick(() => {
-        renderMathJax(answerRef.value)
-      })
-    }
-  } catch (error) {
-    console.error('Answer 渲染失败:', error)
-    renderedAnswer.value = '<div>渲染失败</div>'
-  }
-}
-
-// 使用 MathJax 渲染公式
-const renderMathJax = (element: HTMLElement | undefined) => {
-  if (!element) return
-  
-  try {
-    if (window.MathJax && window.MathJax.Hub) {
-      window.MathJax.Hub.Queue(["Typeset", window.MathJax.Hub, element])
-    } else if (window.MathJax && window.MathJax.typesetPromise) {
-      // MathJax 3.x
-      window.MathJax.typesetPromise([element]).catch((err: any) => {
-        console.error('MathJax 渲染失败:', err)
-      })
-    }
-  } catch (error) {
-    console.error('MathJax 渲染失败:', error)
-  }
-}
-
-// 反馈处理
-const handleFeedback = (type: 'upvote' | 'downvote') => {
-  emit('feedback', type, props.isDownVoted || false)
-}
-
-// 监听数据变化，重新渲染
-watch(() => props.solutionAnswer.solution, () => {
-  renderSolution()
-}, { deep: true })
-
-watch(() => props.solutionAnswer.answer, () => {
-  renderAnswer()
-}, { deep: true })
-
-// 组件挂载时渲染
-onMounted(() => {
-  renderSolution()
-  renderAnswer()
-})
-
-// 暴露方法供外部调用
-defineExpose({
-  renderSolution,
-  renderAnswer,
-  renderMathJax
-})
-</script>
-
-<style lang="scss" scoped>
-.special-questions {
-  padding: 20px;
-  display: flex;
-  flex-direction: column;
-  gap: 20px;
-
-  img {
-    width: 24px;
-    transition: transform 0.1s ease;
-  }
-
-  
-
-  .solution-content, .answer-content {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    gap: 12px;
-
-    .solution-content-title, 
-    .answer-content-title {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-
-      .solution-content-title-text, .answer-content-title-text {
-        font-size: 20px;
-        font-weight: 600;
-        line-height: 32px;
-      }
-    }
-
-    .solution-content-description, .answer-content-description {
-        padding: 12px 16px;
-        background: #F8F7F6;
-        border-radius: 12px;
-        line-height: 24px;
-    }
-  }
-
-  .feedback-content {
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    gap: 12px;
-
-      img:active {
-      transform: scale(1.2);
-    }
-  }
-}
-</style>

package/src/components/AIChatSDK/index.ts

@@ -1,146 +0,0 @@
-// AI聊天SDK入口文件
-
-import AIChatComponent from './AIChatComponent.vue'
-import type {
-  IAIChatConfig,
-  IAIChatSDKProps,
-  IMessage,
-  IAvatarConfig,
-  IAIInfoConfig,
-  IMuteButtonConfig,
-  IFeedbackButton,
-  IFeedbackConfig,
-  IInputConfig,
-  IStyleConfig,
-  IMessageStyle
-} from './types'
-import { DEFAULT_CONFIG } from './types'
-import { IMAGE_ASSETS, getImageUrl, hasImage, createImageConfig } from './utils/imageUtils'
-
-// 导出组件
-export { AIChatComponent }
-
-// 导出图片工具
-export { IMAGE_ASSETS, getImageUrl, hasImage, createImageConfig }
-
-// 导出类型
-export type {
-  IAIChatConfig,
-  IAIChatSDKProps,
-  IMessage,
-  IAvatarConfig,
-  IAIInfoConfig,
-  IMuteButtonConfig,
-  IFeedbackButton,
-  IFeedbackConfig,
-  IInputConfig,
-  IStyleConfig,
-  IMessageStyle
-}
-
-// 导出默认配置
-export { DEFAULT_CONFIG }
-
-// 创建AI聊天实例的工厂函数
-export function createAIChatConfig(config?: Partial<IAIChatConfig>): IAIChatConfig {
-  const mergedConfig = { ...DEFAULT_CONFIG }
-
-  if (config) {
-    // 深度合并配置
-    Object.keys(config).forEach(key => {
-      const configKey = key as keyof IAIChatConfig
-      const configValue = config[configKey]
-      const mergedValue = mergedConfig[configKey]
-
-      if (typeof configValue === 'object' && configValue !== null && !Array.isArray(configValue) &&
-          typeof mergedValue === 'object' && mergedValue !== null) {
-        mergedConfig[configKey] = { ...mergedValue, ...configValue } as any
-      } else if (configValue !== undefined) {
-        mergedConfig[configKey] = configValue as any
-      }
-    })
-  }
-
-  return mergedConfig
-}
-
-// 预设配置
-export const PRESET_CONFIGS = {
-  // 默认配置
-  default: DEFAULT_CONFIG,
-
-  // 简洁模式
-  minimal: createAIChatConfig({
-    feedback: {
-      show: false
-    },
-    styles: {
-      container: {
-        borderRadius: '8px',
-        boxShadow: 'none'
-      }
-    }
-  }),
-
-  // 暗色主题
-  dark: createAIChatConfig({
-    styles: {
-      container: {
-        background: '#1a1a1a',
-        color: '#ffffff'
-      },
-      header: {
-        borderBottom: '1px solid #333333',
-        background: '#1a1a1a'
-      },
-      messages: {
-        aiMessage: {
-          background: '#2d2d2d',
-          color: '#ffffff',
-          border: '1px solid #333333'
-        },
-        userMessage: {
-          background: '#0066cc',
-          color: '#ffffff'
-        }
-      }
-    },
-    aiInfo: {
-      nameStyle: {
-        color: '#ffffff'
-      },
-      titleStyle: {
-        color: '#cccccc'
-      }
-    }
-  }),
-
-  // 紧凑模式
-  compact: createAIChatConfig({
-    styles: {
-      header: {
-        padding: '8px 16px'
-      },
-      inputContainer: {
-        padding: '8px 16px 16px'
-      },
-      messages: {
-        messageGap: '8px'
-      }
-    },
-    feedback: {
-      containerStyle: {
-        padding: '0 0 8px 0',
-        gap: '8px'
-      }
-    }
-  })
-}
-
-// 默认导出
-export default {
-  AIChatComponent,
-  createAIChatConfig,
-  PRESET_CONFIGS,
-  DEFAULT_CONFIG
-}