fix(ASA): 修复模板变量语法错误并安装 vuedraggable 依赖

ai-service-admin/package-lock.json

@@ -13,7 +13,8 @@
         "element-plus": "^2.6.1",
         "pinia": "^2.1.7",
         "vue": "^3.4.21",
-        "vue-router": "^4.3.0"
+        "vue-router": "^4.3.0",
+        "vuedraggable": "^4.1.0"
       },
       "devDependencies": {
         "@vitejs/plugin-vue": "^5.0.4",
@@ -895,6 +896,12 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/sortablejs": {
+      "version": "1.14.0",
+      "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.14.0.tgz",
+      "integrity": "sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w==",
+      "license": "MIT"
+    },
     "node_modules/source-map-js": {
       "version": "1.2.1",
       "license": "BSD-3-Clause",
@@ -1053,6 +1060,18 @@
       "peerDependencies": {
         "typescript": ">=5.0.0"
       }
+    },
+    "node_modules/vuedraggable": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-4.1.0.tgz",
+      "integrity": "sha512-FU5HCWBmsf20GpP3eudURW3WdWTKIbEIQxh9/8GE806hydR9qZqRRxRE3RjqX7PkuLuMQG/A7n3cfj9rCEchww==",
+      "license": "MIT",
+      "dependencies": {
+        "sortablejs": "1.14.0"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.1"
+      }
     }
   }
 }

ai-service-admin/package.json

@@ -12,9 +12,9 @@
     "axios": "^1.6.7",
     "element-plus": "^2.6.1",
     "pinia": "^2.1.7",
-    "vuedraggable": "^4.1.0",
     "vue": "^3.4.21",
-    "vue-router": "^4.3.0"
+    "vue-router": "^4.3.0",
+    "vuedraggable": "^4.1.0"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.0.4",

ai-service-admin/src/views/admin/prompt-template/index.vue

@@ -116,7 +116,7 @@
                   class="variable-item"
                   @click="insertVariable(v.name)"
                 >
-                  <span class="var-name">{{ '{{' + v.name + '}}' }}</span>
+                  <span class="var-name">{{ getVarSyntax(v.name) }}</span>
                   <span class="var-desc">{{ v.description }}</span>
                 </div>
               </div>
@@ -189,6 +189,10 @@ const getSceneLabel = (scene: string) => {
   return opt?.label || scene
 }
 
+const getVarSyntax = (name: string) => {
+  return `{{${name}}}`
+}
+
 const getSceneTagType = (scene: string): '' | 'success' | 'warning' | 'danger' | 'info' => {
   const typeMap: Record<string, '' | 'success' | 'warning' | 'danger' | 'info'> = {
     chat: 'primary',