st-comp 0.0.238 → 0.0.240

package/packages/VarietySearch/components/AddTag/index.vue

@@ -233,7 +233,6 @@ const getTotalTagMap = async () => {
       }, {})
     }
   }, {})
-  ElMessage.success('删除成功!')
 }
 
 getTotalTagMap()

package/packages/VarietySearch/components/FactorScreen/index.vue

@@ -2,7 +2,7 @@
 <script setup name="FactorScreen">
 import { nextTick, ref, watch, inject, reactive } from "vue";
 import { Close, Plus, CircleCloseFilled, InfoFilled, Document } from "@element-plus/icons-vue";
-import { handleVerifyScore, extractConditionDetails, extractVariables } from "./tools.js";
+import { handleVerifyScore, extractConditionDetails, extractVariables, sendToAi } from "./tools.js";
 import FactorDescription from "./FactorDescription.vue";
 import MonacoEditor from "../../../MonacoEditor/index.vue";
 
@@ -38,6 +38,7 @@ const visibleDescriptions = ref(false);
 const factorType = ref("脚本");
 const scriptTestLoading = ref(false);
 const scriptCopyLoading = ref(false);
+const scriptAILoading = ref(false);
 const testVariety = ref("");
 const testVarietyVisible = ref(false);
 const scriptTestLogVisible = ref(false);
@@ -45,6 +46,7 @@ const scriptTestResult = reactive({
   result: null,
   detail: "",
   code: "",
+  ai: "",
 });
 
 // 弹窗表单
@@ -322,6 +324,16 @@ const handleScriptCopy = async () => {
     scriptCopyLoading.value = false;
   }
 };
+// 测试: 复制
+const handleTestCodeCopy = () => {
+  let txa = document.createElement("textarea");
+  txa.value = scriptTestResult.code;
+  document.body.appendChild(txa);
+  txa.select();
+  document.execCommand("copy");
+  document.body.removeChild(txa);
+  ElMessage.success("测试代码已经成功复制到粘贴板");
+};
 // 测试: 打开/确认/日志
 const extractCodesFromString = (str) => {
   if (!str) return [];
@@ -351,7 +363,7 @@ const handleScriptTest = async (action) => {
         };
         const testRes = await request.post("/common/qt/testFactorSelect", params);
         const { result, detail } = testRes.body;
-        Object.assign(scriptTestResult, { result, detail, code: body });
+        Object.assign(scriptTestResult, { result, detail, code: body, ai: "" });
         if (result === 1) {
           ElMessage.success("测试通过");
         } else {
@@ -372,6 +384,21 @@ const handleScriptTest = async (action) => {
     }
   }
 };
+// 测试: AI分析
+const handleTestAi = () => {
+  const appId = "87be17ecc84d4d2ea3108d7155bec2ac";
+  const apiKey = "sk-d995eb26a4334bdeb2ccb4cbfaf51de8";
+  scriptAILoading.value = true;
+  scriptTestResult.ai = "";
+  sendToAi(appId, apiKey, scriptTestResult.code, (type, res) => {
+    if (type === "finish") {
+      scriptAILoading.value = false;
+      return;
+    }
+    scriptTestResult.ai = scriptTestResult.ai + res;
+    console.log(scriptTestResult.ai);
+  });
+};
 
 // 监控: 窗口开关
 watch(
@@ -396,6 +423,8 @@ watch(
         Object.assign(scriptTestResult, {
           result: null,
           detail: "",
+          code: "",
+          ai: "",
         });
         break;
       }
@@ -818,6 +847,7 @@ watch(
           ref="monacoEditorRef"
           :language="'lua'"
           :suggestionEnable="true"
+          :variableEnable="true"
         />
       </div>
       <template #footer>
@@ -890,7 +920,7 @@ watch(
   <el-dialog
     modal-class="log-dialog"
     v-model="scriptTestLogVisible"
-    width="830"
+    width="80vw"
     align-center
     append-to-body
     draggable
@@ -923,17 +953,53 @@ watch(
       >
         <pre>{{ scriptTestResult.code }}</pre>
       </el-scrollbar>
-      <!-- 分割线 -->
-      <el-divider direction="vertical" />
       <!-- 日志 -->
-      <el-scrollbar height="600px">
+      <el-scrollbar
+        class="log"
+        height="600px"
+      >
         <pre :class="scriptTestResult.result === 1 ? 'success-log' : 'error-log'">{{ scriptTestResult.result === 1 ? `✅️ 测试通过\n${scriptTestResult.detail}` : scriptTestResult.detail }}</pre>
       </el-scrollbar>
+      <!-- AI分析结果 -->
+      <el-scrollbar
+        class="ai"
+        height="600px"
+      >
+        <v-md-editor
+          v-if="scriptTestResult.ai"
+          mode="preview"
+          :model-value="scriptTestResult.ai"
+        />
+        <!-- 正在进行AI分析, 并且没有返回结果时, 展示骨架屏 -->
+        <el-skeleton
+          v-else-if="scriptAILoading"
+          :rows="5"
+          animated
+        />
+        <!-- 未进行AI分析, 并且没有返回结果时, 展示文案 -->
+        <el-empty
+          v-else-if="!scriptAILoading"
+          description="点击下方按钮: AI分析, 分析结果将会展示在此处"
+        />
+      </el-scrollbar>
     </div>
     <!-- 底部 -->
     <template #footer>
       <div class="dialog-footer">
-        <el-button @click="scriptTestLogVisible = false"> 关闭 </el-button>
+        <el-button
+          type="primary"
+          :loading="scriptAILoading"
+          @click="handleTestAi"
+        >
+          AI分析
+        </el-button>
+        <el-button
+          type="primary"
+          @click="handleTestCodeCopy"
+        >
+          复制
+        </el-button>
+        <el-button @click="scriptTestLogVisible = false">关闭</el-button>
       </div>
     </template>
   </el-dialog>
@@ -1028,15 +1094,13 @@ watch(
   }
   .content {
     display: flex;
-    background-color: var(--el-color-black);
+    gap: 1px;
     .el-scrollbar {
+      background-color: var(--el-color-black);
       flex: 1;
       box-sizing: border-box;
       padding: 8px;
-    }
-    .el-divider {
-      margin: 0;
-      height: 616px;
+      border: var(--el-border);
     }
     .code {
       color: var(--el-color-info);
@@ -1054,6 +1118,10 @@ watch(
       word-break: break-all;
       word-wrap: break-word;
     }
+    .ai {
+      flex: 2;
+      background-color: white;
+    }
   }
 }
 </style>

package/packages/VarietySearch/components/FactorScreen/tools.js

@@ -32,3 +32,44 @@ export const extractVariables = (content) => {
 
   return [...new Set(variables)]; // 去重
 };
+
+// 发送AI
+export const sendToAi = async (appId, apiKey, value, callback) => {
+  try {
+    const res = await fetch(`https://dashscope.aliyuncs.com/api/v1/apps/${appId}/completion`, {
+      method: "POST",
+      body: JSON.stringify({
+        input: { prompt: value },
+        parameters: {
+          incremental_output: "true", // 流式返回
+        },
+        debug: {},
+      }),
+      headers: {
+        Authorization: `Bearer ${apiKey}`,
+        "Content-Type": "application/json",
+        "X-DashScope-SSE": "enable", // 流式输出
+      },
+    });
+    if (!res.ok || !res.body) throw new Error("请求失败");
+
+    const reader = res.body.getReader();
+    const decoder = new TextDecoder();
+
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done && callback) {
+        callback("finish", "");
+        break;
+      }
+      try {
+        const data = decoder.decode(value, { stream: true });
+        const resData = JSON.parse(data.split("\n")[3].substr(5));
+        const resText = resData?.output?.text;
+        if (resText && callback) callback("message", resText);
+      } catch (error) {}
+    }
+  } catch (error) {
+    console.error(error);
+  }
+};

package/src/main.ts

@@ -1,12 +1,17 @@
-import { createApp } from 'vue'
-import './style.css'
-import App from './App.vue'
-import router from './router'
-import stComp from '../packages/index.ts'
-import { createPinia } from 'pinia'
+import { createApp } from "vue";
+import "./style.css";
+import App from "./App.vue";
+import router from "./router";
+import stComp from "../packages/index.ts";
+import { createPinia } from "pinia";
 
-createApp(App)
-  .use(router)
-  .use(stComp)
-  .use(createPinia())
-  .mount('#app')
+// markdown编辑预览组件
+import "@kangc/v-md-editor/lib/style/base-editor.css";
+import "@kangc/v-md-editor/lib/theme/style/vuepress.css";
+import Prism from "prismjs";
+import vuepressTheme from "@kangc/v-md-editor/lib/theme/vuepress.js";
+import VueMarkdownEditor from "@kangc/v-md-editor";
+
+VueMarkdownEditor.use(vuepressTheme, { Prism });
+
+createApp(App).use(router).use(stComp).use(createPinia()).use(VueMarkdownEditor).mount("#app");

package/src/pages/MonacoEditor/index.vue

@@ -8,6 +8,7 @@
       ref="monacoEditorRef"
       :defaultValue="value"
       :suggestionEnable="true"
+      :variableEnable="true"
       @change="changeCode"
     />
   </div>