feat:黄炎培对话对接中

src/pages/chenyun/reflection/yinyuan/YinyuanGuides.tsx

@@ -0,0 +1,88 @@
+/**
+ * 银元之战引导提示组件
+ * 包含三个引导提示：前往解决按钮、走势图、走势图大图
+ */
+import { StudyGuideModal } from "@/components";
+import { ExhibitOverlay } from "@/components";
+
+export interface YinyuanGuidesProps {
+  /** 是否显示引导提示1（前往解决按钮） */
+  showGuide1: boolean;
+  /** 是否显示引导提示2（走势图） */
+  showGuide2: boolean;
+  /** 是否显示引导提示3（走势图大图） */
+  showGuide3: boolean;
+  /** 是否显示走势图大图 */
+  showTrendChartDetail: boolean;
+  /** 引导提示1关闭回调 */
+  onGuide1Close: () => void;
+  /** 引导提示2关闭回调 */
+  onGuide2Close: () => void;
+  /** 引导提示3关闭回调 */
+  onGuide3Close: () => void;
+  /** 走势图大图关闭回调 */
+  onTrendChartDetailClose: () => void;
+  /** 走势图点击回调 */
+  onTrendChartClick: () => void;
+}
+
+/**
+ * 银元之战引导提示组件
+ * 显示三个引导提示和走势图大图
+ */
+export const YinyuanGuides = ({
+  showGuide1,
+  showGuide2,
+  showGuide3,
+  showTrendChartDetail,
+  onGuide1Close,
+  onGuide2Close,
+  onGuide3Close,
+  onTrendChartDetailClose,
+  onTrendChartClick,
+}: YinyuanGuidesProps) => {
+  return (
+    <>
+      {/* 引导提示1：前往解决按钮出现后 */}
+      <StudyGuideModal
+        visible={showGuide1}
+        onContinue={onGuide1Close}
+        verticalAlign="center"
+        zIndex={130}
+      >
+        请跟随指示点击前往解决按钮
+      </StudyGuideModal>
+
+      {/* 引导提示2：走势图出现后 */}
+      <StudyGuideModal
+        visible={showGuide2}
+        onContinue={onGuide2Close}
+        verticalAlign="center"
+        zIndex={130}
+      >
+        请点击走势图
+      </StudyGuideModal>
+
+      {/* 引导提示3：走势图大图打开后 */}
+      <StudyGuideModal
+        visible={showGuide3}
+        onContinue={onGuide3Close}
+        verticalAlign="center"
+        zIndex={10000}
+      >
+        请点击银元价格走势图
+      </StudyGuideModal>
+
+      {/* 走势图大图展示 - 使用 ExhibitOverlay */}
+      <ExhibitOverlay
+        visible={showTrendChartDetail}
+        src="chenyun/reflection/银元价格走势图"
+        description={`以上海为中心，代表"人民币信用"的绿色区域迅速覆盖全市，并向外辐射。`}
+        disableDrag={true}
+        onClick={onTrendChartClick}
+        onClose={onTrendChartDetailClose}
+      />
+    </>
+  );
+};
+