@sim-design/training 1.0.0

package/dist/DialoguePlugin-DU00QpmQ.js

@@ -0,0 +1,416 @@
+import { c as H, j as o, i as $, e as M, a as N, r as B } from "./RadarChart-C5ZM0kWt.js";
+import { Button as T, Tag as I, Card as z, Input as Y, message as F } from "antd";
+import { u as V } from "./useDialogueLogic-IHELcN3X.js";
+import { a as K } from "./judgement-D_9i7x9S.js";
+import { useRef as O, useEffect as q } from "react";
+import { P as L } from "./PluginHeader-B-GESJmT.js";
+const { TextArea: J } = Y, Q = {
+  happy: { emoji: "😊", label: "开心", color: "#52c41a" },
+  confused: { emoji: "😕", label: "困惑", color: "#faad14" },
+  angry: { emoji: "😠", label: "不满", color: "#ff4d4f" }
+};
+function U(e) {
+  const d = new Date(e);
+  return `${d.getHours().toString().padStart(2, "0")}:${d.getMinutes().toString().padStart(2, "0")}`;
+}
+const X = ({
+  messages: e,
+  input: d,
+  aiResponding: c,
+  aiError: f,
+  dialogueLogCount: s,
+  scenario: g,
+  dialogueGoals: p,
+  tellerRoleName: u,
+  customerRoleName: x,
+  uiConfig: n,
+  onInputChange: b,
+  onSend: y,
+  onComplete: v
+}) => {
+  const r = H(n.theme), h = n.showAvatar !== !1, C = n.chatAreaHeight || 420, i = n.tellerBubbleColor || r.primaryColor, R = n.customerBubbleColor || r.surfaceLightColor, E = n.showTimestamp !== !1, W = n.showEmotionTag !== !1, A = n.inputPlaceholder || "输入您的话术... (Shift+Enter换行，Enter发送)", P = n.submitButtonText || "完成对话", S = n.scenarioDisplay || "card", w = n.goalDisplay || "tags", t = r.borderRadius, k = O(null);
+  return q(() => {
+    var l;
+    (l = k.current) == null || l.scrollIntoView({ behavior: "smooth" });
+  }, [e, c]), /* @__PURE__ */ o.jsxs("div", { style: { padding: "20px", ...n.styleOverrides }, children: [
+    /* @__PURE__ */ o.jsxs("div", { style: { display: "flex", alignItems: "flex-start", gap: 12, marginBottom: 16 }, children: [
+      g && S !== "none" && /* @__PURE__ */ o.jsx("div", { style: { flex: 1, minWidth: 0 }, children: S === "banner" ? /* @__PURE__ */ o.jsx(L, { title: g, variant: "banner", theme: r, noMargin: !0 }) : /* @__PURE__ */ o.jsx(L, { title: g, variant: "card", theme: r, noMargin: !0 }) }),
+      /* @__PURE__ */ o.jsx(
+        T,
+        {
+          type: "default",
+          icon: /* @__PURE__ */ o.jsx($, {}),
+          onClick: v,
+          disabled: s === 0,
+          style: {
+            flexShrink: 0,
+            alignSelf: "flex-start",
+            marginLeft: !g || S === "none" ? "auto" : void 0,
+            borderRadius: t,
+            borderColor: r.primaryColor,
+            color: r.primaryColor
+          },
+          children: P
+        }
+      )
+    ] }),
+    p && p.length > 0 && w !== "none" && (w === "tags" ? /* @__PURE__ */ o.jsxs("div", { style: { marginBottom: 16 }, children: [
+      /* @__PURE__ */ o.jsx("div", { style: { fontSize: 13, fontWeight: 600, color: r.headerColor, marginBottom: 8 }, children: "对话目标：" }),
+      /* @__PURE__ */ o.jsx("div", { style: { display: "flex", gap: 8, flexWrap: "wrap" }, children: p.map((l, m) => /* @__PURE__ */ o.jsx(
+        I,
+        {
+          style: {
+            borderColor: r.primaryColor,
+            color: r.primaryColor,
+            borderRadius: 20,
+            padding: "2px 12px",
+            fontSize: 13,
+            background: "transparent"
+          },
+          children: l
+        },
+        m
+      )) })
+    ] }) : w === "card" ? /* @__PURE__ */ o.jsx(
+      z,
+      {
+        size: "small",
+        style: {
+          marginBottom: 16,
+          borderRadius: t,
+          borderColor: r.borderColor
+        },
+        title: /* @__PURE__ */ o.jsx("span", { style: { fontSize: 13, fontWeight: 600, color: r.headerColor }, children: "对话目标" }),
+        children: /* @__PURE__ */ o.jsx("ul", { style: { margin: 0, paddingLeft: 20 }, children: p.map((l, m) => /* @__PURE__ */ o.jsx("li", { style: { fontSize: 13, color: "#595959", marginBottom: 4 }, children: l }, m)) })
+      }
+    ) : /* @__PURE__ */ o.jsxs(
+      "div",
+      {
+        style: {
+          marginBottom: 16,
+          padding: "12px 16px",
+          backgroundColor: r.backgroundColor,
+          borderRadius: t,
+          borderLeft: `4px solid ${r.primaryColor}`
+        },
+        children: [
+          /* @__PURE__ */ o.jsx("div", { style: { fontSize: 13, fontWeight: 600, color: r.headerColor, marginBottom: 8 }, children: "对话目标" }),
+          p.map((l, m) => /* @__PURE__ */ o.jsxs("div", { style: { display: "flex", alignItems: "flex-start", gap: 8, marginBottom: 4 }, children: [
+            /* @__PURE__ */ o.jsx($, { style: { color: r.primaryColor, marginTop: 3, fontSize: 13 } }),
+            /* @__PURE__ */ o.jsx("span", { style: { fontSize: 13, color: "#595959" }, children: l })
+          ] }, m))
+        ]
+      }
+    )),
+    /* @__PURE__ */ o.jsxs(
+      "div",
+      {
+        className: "dialogue-chat-area",
+        style: {
+          borderRadius: t,
+          height: C,
+          overflowY: "auto",
+          marginBottom: 16,
+          padding: 16,
+          backgroundColor: r.surfaceColor,
+          border: `1px solid ${r.borderColor}`
+        },
+        children: [
+          e.map((l, m) => {
+            const a = l.role === "teller", j = l.emotion && l.emotion !== "neutral" ? Q[l.emotion] : null;
+            return /* @__PURE__ */ o.jsxs(
+              "div",
+              {
+                style: {
+                  marginBottom: 16,
+                  display: "flex",
+                  flexDirection: a ? "row-reverse" : "row",
+                  alignItems: "flex-start",
+                  gap: 10
+                },
+                children: [
+                  h && /* @__PURE__ */ o.jsx(
+                    "div",
+                    {
+                      style: {
+                        width: 36,
+                        height: 36,
+                        borderRadius: "50%",
+                        backgroundColor: a ? i : "#bfbfbf",
+                        color: "#fff",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        fontSize: 14,
+                        fontWeight: 600,
+                        flexShrink: 0
+                      },
+                      children: a ? u[0] : x[0]
+                    }
+                  ),
+                  /* @__PURE__ */ o.jsxs("div", { style: { maxWidth: "70%" }, children: [
+                    /* @__PURE__ */ o.jsxs(
+                      "div",
+                      {
+                        style: {
+                          fontSize: 12,
+                          color: "#8c8c8c",
+                          marginBottom: 4,
+                          textAlign: a ? "right" : "left"
+                        },
+                        children: [
+                          a ? u : x,
+                          W && j && /* @__PURE__ */ o.jsxs(
+                            I,
+                            {
+                              color: j.color,
+                              style: { marginLeft: 6, fontSize: 11, lineHeight: "18px", padding: "0 6px" },
+                              children: [
+                                j.emoji,
+                                " ",
+                                j.label
+                              ]
+                            }
+                          )
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ o.jsx(
+                      "div",
+                      {
+                        style: {
+                          padding: "10px 14px",
+                          borderRadius: a ? `${t}px 2px ${t}px ${t}px` : `2px ${t}px ${t}px ${t}px`,
+                          backgroundColor: a ? i : R,
+                          color: a ? "#fff" : "#262626",
+                          boxShadow: "0 1px 4px rgba(0,0,0,0.08)",
+                          border: a ? void 0 : `1px solid ${r.borderColor}`,
+                          lineHeight: 1.6,
+                          fontSize: 14
+                        },
+                        children: l.content
+                      }
+                    ),
+                    E && /* @__PURE__ */ o.jsx(
+                      "div",
+                      {
+                        style: {
+                          fontSize: 11,
+                          color: "#bfbfbf",
+                          marginTop: 4,
+                          textAlign: a ? "right" : "left"
+                        },
+                        children: U(l.timestamp)
+                      }
+                    )
+                  ] })
+                ]
+              },
+              m
+            );
+          }),
+          c && /* @__PURE__ */ o.jsxs("div", { style: { display: "flex", alignItems: "flex-start", gap: 10, marginBottom: 16 }, children: [
+            h && /* @__PURE__ */ o.jsx(
+              "div",
+              {
+                style: {
+                  width: 36,
+                  height: 36,
+                  borderRadius: "50%",
+                  backgroundColor: "#bfbfbf",
+                  color: "#fff",
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  fontSize: 14,
+                  fontWeight: 600,
+                  flexShrink: 0
+                },
+                children: x[0]
+              }
+            ),
+            /* @__PURE__ */ o.jsx(
+              "div",
+              {
+                style: {
+                  padding: "12px 18px",
+                  borderRadius: `2px ${t}px ${t}px ${t}px`,
+                  backgroundColor: r.surfaceLightColor,
+                  border: `1px solid ${r.borderColor}`,
+                  boxShadow: "0 1px 4px rgba(0,0,0,0.08)"
+                },
+                children: /* @__PURE__ */ o.jsx("div", { style: { display: "flex", gap: 4, alignItems: "center" }, children: [0, 1, 2].map((l) => /* @__PURE__ */ o.jsx(
+                  "span",
+                  {
+                    style: {
+                      width: 7,
+                      height: 7,
+                      borderRadius: "50%",
+                      backgroundColor: r.primaryColor,
+                      opacity: 0.4,
+                      display: "inline-block",
+                      animation: `dialogueTyping 1.4s infinite ${l * 0.2}s`
+                    }
+                  },
+                  l
+                )) })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ o.jsx("div", { ref: k })
+        ]
+      }
+    ),
+    f && /* @__PURE__ */ o.jsxs(
+      z,
+      {
+        size: "small",
+        style: {
+          marginBottom: 16,
+          backgroundColor: "#fff2e8",
+          borderColor: "#ffbb96",
+          borderRadius: t
+        },
+        children: [
+          /* @__PURE__ */ o.jsx("span", { style: { fontWeight: 600 }, children: "⚠️ AI服务异常：" }),
+          f,
+          "（将使用模拟回复）"
+        ]
+      }
+    ),
+    /* @__PURE__ */ o.jsxs(
+      "div",
+      {
+        style: {
+          display: "flex",
+          gap: 10,
+          padding: 12,
+          backgroundColor: r.surfaceLightColor,
+          borderRadius: t,
+          border: `1px solid ${r.borderColor}`,
+          boxShadow: "0 1px 4px rgba(0,0,0,0.06)"
+        },
+        children: [
+          /* @__PURE__ */ o.jsx(
+            J,
+            {
+              value: d,
+              onChange: (l) => b(l.target.value),
+              onPressEnter: (l) => {
+                l.shiftKey || (l.preventDefault(), y());
+              },
+              placeholder: A,
+              autoSize: { minRows: 2, maxRows: 4 },
+              style: { flex: 1, border: "none", boxShadow: "none", resize: "none", backgroundColor: r.surfaceLightColor },
+              disabled: c
+            }
+          ),
+          /* @__PURE__ */ o.jsx(
+            T,
+            {
+              type: "primary",
+              icon: /* @__PURE__ */ o.jsx(M, {}),
+              onClick: y,
+              disabled: !d.trim() || c,
+              loading: c,
+              style: {
+                alignSelf: "center",
+                borderRadius: t,
+                backgroundColor: i,
+                borderColor: i
+              },
+              children: "发送"
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ o.jsx("style", { children: `
+        @keyframes dialogueTyping {
+          0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
+          30% { opacity: 1; transform: translateY(-4px); }
+        }
+        .dialogue-chat-area::-webkit-scrollbar {
+          width: 5px;
+        }
+        .dialogue-chat-area::-webkit-scrollbar-track {
+          background: transparent;
+        }
+        .dialogue-chat-area::-webkit-scrollbar-thumb {
+          background: ${r.primaryColor}33;
+          border-radius: 4px;
+        }
+        .dialogue-chat-area::-webkit-scrollbar-thumb:hover {
+          background: ${r.primaryColor}66;
+        }
+        .dialogue-chat-area {
+          scrollbar-width: thin;
+          scrollbar-color: ${r.primaryColor}33 transparent;
+        }
+      ` })
+  ] });
+}, re = ({
+  initData: e,
+  checkRules: d,
+  onFinish: c,
+  onRealtimeData: f
+}) => {
+  var h, C;
+  const s = V(e, {
+    onRealtimeData: f,
+    enableRealtimeGuidance: !0,
+    checkRules: d
+  }), g = (e == null ? void 0 : e.tellerRoleName) || (e == null ? void 0 : e.targetPosition) || "柜员", p = ((h = e == null ? void 0 : e.roleConfig) == null ? void 0 : h.角色名称) || (e == null ? void 0 : e.customerRoleName) || "客户", u = (e == null ? void 0 : e.uiConfig) || {}, x = e == null ? void 0 : e.caseData, { filledData: n } = N(), b = { ...x || {}, ...e || {} }, y = B((e == null ? void 0 : e.scenario) || "", b, n), v = (C = e == null ? void 0 : e.dialogueGoals) == null ? void 0 : C.map(
+    (i) => B(i, b, n)
+  ), r = () => {
+    const i = s.checkCompletion(d);
+    if (!i.canComplete) {
+      F.warning(i.reason || "请完成所有必要对话");
+      return;
+    }
+    c({
+      stepId: (e == null ? void 0 : e.stepId) || "unknown",
+      operationType: "dialogue",
+      operationData: {
+        dialogueHistory: s.messages,
+        dialogueLog: s.dialogueLog,
+        totalMessages: s.messages.length,
+        mustConfirmResult: d != null && d.mustConfirm ? s.isConfirmed() : void 0
+      },
+      operationLog: s.dialogueLog,
+      timestamp: Date.now(),
+      evidenceSummary: K({
+        sourceStepId: (e == null ? void 0 : e.stepId) || "unknown",
+        sourceStepName: (e == null ? void 0 : e.stepName) || "对话交互",
+        sourceType: "dialogue",
+        title: `${(e == null ? void 0 : e.stepName) || "对话交互"}摘要`,
+        summary: `完成 ${s.messages.length} 条消息的对话交互。`,
+        keyFacts: [
+          { label: "消息总数", value: String(s.messages.length) },
+          { label: "对话轮数", value: String(Math.ceil(s.messages.length / 2)) }
+        ]
+      })
+    });
+  };
+  return /* @__PURE__ */ o.jsx(
+    X,
+    {
+      messages: s.messages,
+      input: s.input,
+      aiResponding: s.aiResponding,
+      aiError: s.aiError,
+      dialogueLogCount: s.dialogueLog.length,
+      scenario: y,
+      dialogueGoals: v,
+      tellerRoleName: g,
+      customerRoleName: p,
+      uiConfig: u,
+      onInputChange: s.setInput,
+      onSend: s.handleSend,
+      onComplete: r
+    }
+  );
+};
+export {
+  re as default
+};