-
{
if (e.key === 'Enter' || e.key === ' ') {
diff --git a/demo/src/components/settings/index.tsx b/demo/src/components/settings/index.tsx
new file mode 100644
index 00000000..3c3e66b9
--- /dev/null
+++ b/demo/src/components/settings/index.tsx
@@ -0,0 +1,90 @@
+import React, { useState } from 'react';
+import { Modal, Form, Input, Button, FloatButton, ConfigProvider, theme } from 'antd';
+import { SettingOutlined } from '@ant-design/icons';
+import { useAppDispatch, useAppSelector } from '@/common';
+import { setAgentSettings } from '@/store/reducers/global';
+
+interface FormValues {
+ greeting: string;
+ prompt: string;
+}
+
+const FormModal: React.FC = () => {
+ const [isModalVisible, setIsModalVisible] = useState(false);
+ const [form] = Form.useForm
();
+ const dispatch = useAppDispatch();
+ const agentSettings = useAppSelector(state => state.global.agentSettings);
+
+ const showModal = () => {
+ form.setFieldsValue(agentSettings);
+ setIsModalVisible(true);
+ };
+
+ const handleOk = async () => {
+ try {
+ const values = await form.validateFields();
+ console.log('Form Values:', values);
+ // Handle the form submission logic here
+ dispatch(setAgentSettings(values));
+ setIsModalVisible(false);
+ form.resetFields();
+ } catch (errorInfo) {
+ console.log('Validate Failed:', errorInfo);
+ }
+ };
+
+ const handleCancel = () => {
+ setIsModalVisible(false);
+ };
+
+ return (
+ <>
+
+ } onClick={showModal}>
+
+
+
+
+
+
+ );
+};
+
+export default FormModal;
diff --git a/demo/src/platform/mobile/description/index.tsx b/demo/src/platform/mobile/description/index.tsx
index 7473d550..0241a768 100644
--- a/demo/src/platform/mobile/description/index.tsx
+++ b/demo/src/platform/mobile/description/index.tsx
@@ -18,6 +18,7 @@ const Description = () => {
const language = useAppSelector(state => state.global.language)
const voiceType = useAppSelector(state => state.global.voiceType)
const graphName = useAppSelector(state => state.global.graphName)
+ const agentSettings = useAppSelector(state => state.global.agentSettings)
const [loading, setLoading] = useState(false)
useEffect(() => {
@@ -50,7 +51,9 @@ const Description = () => {
userId,
graphName,
language,
- voiceType
+ voiceType,
+ greeting: agentSettings.greeting,
+ prompt: agentSettings.prompt
})
const { code, msg } = res || {}
if (code != 0) {
diff --git a/demo/src/platform/mobile/entry/index.tsx b/demo/src/platform/mobile/entry/index.tsx
index c5f51d5c..3b19cca7 100644
--- a/demo/src/platform/mobile/entry/index.tsx
+++ b/demo/src/platform/mobile/entry/index.tsx
@@ -4,6 +4,7 @@ import Rtc from "../rtc"
import Header from "../header"
import Menu, { IMenuData } from "../menu"
import styles from "./index.module.scss"
+import FormModal from "@/components/settings"
const MenuData: IMenuData[] = [{
@@ -23,6 +24,7 @@ const MobileEntry = () => {
+
}
diff --git a/demo/src/platform/pc/description/index.module.scss b/demo/src/platform/pc/description/index.module.scss
index 50b29301..acefae3a 100644
--- a/demo/src/platform/pc/description/index.module.scss
+++ b/demo/src/platform/pc/description/index.module.scss
@@ -45,6 +45,11 @@
caret-color: transparent;
box-sizing: border-box;
+ &.btnSetting {
+ background: #181A1D;
+ border: 1px solid #272A2F;
+ }
+
.btnText {
width: 100px;
text-align: center;
@@ -70,4 +75,4 @@
border: 1px solid var(--Error-400-T, #E95C7B);
}
-}
+}
\ No newline at end of file
diff --git a/demo/src/platform/pc/description/index.tsx b/demo/src/platform/pc/description/index.tsx
index b95f4658..6d9ec47b 100644
--- a/demo/src/platform/pc/description/index.tsx
+++ b/demo/src/platform/pc/description/index.tsx
@@ -5,7 +5,7 @@ import {
} from "@/common"
import { Select, Button, message, Upload } from "antd"
import { useEffect, useState, MouseEventHandler } from "react"
-import { LoadingOutlined, UploadOutlined } from "@ant-design/icons"
+import { LoadingOutlined, SettingFilled } from "@ant-design/icons"
import styles from "./index.module.scss"
let intervalId: any
@@ -18,6 +18,7 @@ const Description = () => {
const language = useAppSelector(state => state.global.language)
const voiceType = useAppSelector(state => state.global.voiceType)
const graphName = useAppSelector(state => state.global.graphName)
+ const agentSettings = useAppSelector(state => state.global.agentSettings)
const [loading, setLoading] = useState(false)
useEffect(() => {
@@ -50,7 +51,9 @@ const Description = () => {
userId,
graphName,
language,
- voiceType
+ voiceType,
+ greeting: agentSettings.greeting,
+ prompt: agentSettings.prompt
})
const { code, msg } = res || {}
if (code != 0) {
diff --git a/demo/src/platform/pc/entry/index.tsx b/demo/src/platform/pc/entry/index.tsx
index a7ee7592..ad5a7875 100644
--- a/demo/src/platform/pc/entry/index.tsx
+++ b/demo/src/platform/pc/entry/index.tsx
@@ -4,6 +4,9 @@ import Rtc from "../rtc"
import Header from "../header"
import styles from "./index.module.scss"
+import { FloatButton, Form } from "antd"
+import { SettingOutlined } from "@ant-design/icons"
+import FormModal from "@/components/settings"
const PCEntry = () => {
return
@@ -19,6 +22,7 @@ const PCEntry = () => {