Bladeren bron

Merge branch 'beta' of https://git.cocorobo.cn/CocoRoboLabs/pbl-teacher-table into beta

lsc 6 maanden geleden
bovenliggende
commit
1134a6414e

+ 17 - 15
src/components/pages/pocAiClassroom/chatArea2.vue

@@ -1,39 +1,41 @@
 <template>
   <div class="chatArea">
-		<iframe ref="iframeRef" class="ca_iframe" allow="camera *; microphone *;display-capture;midi;encrypted-media;" :src="src"></iframe>
+    <iframe
+      ref="iframeRef"
+      class="ca_iframe"
+      allow="camera *; microphone *;display-capture;midi;encrypted-media;"
+      :src="src"
+    ></iframe>
   </div>
 </template>
 
 <script>
-
 export default {
-
   data() {
     return {
       userId: this.$route.query.userid,
       org: this.$route.query.org,
       oid: this.$route.query.oid,
-			src:"https://beta.cloud.cocorobo.cn/aigpt/#/js?active_role=0"
+      type: this.$route.query.type,
+      src: "https://beta.cloud.cocorobo.cn/aigpt/#/js?active_role=0"
     };
   },
-  methods: {
-
-  },
+  methods: {},
   mounted() {
-    
+   
   }
 };
 </script>
 
 <style scoped>
-.chatArea{
-	width: 100vw;
-	height: 100vh;
-	overflow: hidden;
+.chatArea {
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
 }
 
-.ca_iframe{
-	width: 100%;
-	height: 100%;
+.ca_iframe {
+  width: 100%;
+  height: 100%;
 }
 </style>

+ 361 - 0
src/components/pages/pocAiClassroom/component/changeChapterDialog.vue

@@ -0,0 +1,361 @@
+<template>
+  <div>
+    <el-dialog
+      :center="true"
+      :visible.sync="show"
+      :close-on-click-modal="true"
+      width="600px"
+      class="settingsDialog"
+    >
+      <!-- <div v-if="showDialog == true" class="a-dialog" v-el-drag-dialog> -->
+      <div class="sd_top">
+        <div class="sd_t_topTit">切换章节</div>
+        <div class="sd_t_right">
+          <span @click.stop="close()">×</span>
+        </div>
+      </div>
+      <div class="sd_box">
+        <div class="sd_b_list">
+          <div
+            class="sd_b_l_item"
+            v-for="(item, index) in classList"
+            :key="index"
+          >
+            <div class="sd_b_i_title" @click.stop="item.open = !item.open">
+              <svg
+                width="16"
+                height="16"
+                viewBox="0 0 16 16"
+								:style="item.open?'transform:rotate(0deg)':'transform:rotate(-90deg)'"
+                fill="none"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.54004 6.45977L4.45928 5.54053L7.99966 9.08091L11.54 5.54053L12.4593 6.45977L7.99966 10.9194L3.54004 6.45977Z"
+                  fill="black"
+                  fill-opacity="0.4"
+                />
+              </svg>
+              <span>{{ item.title }}</span>
+            </div>
+						<div class="sd_b_i_list" v-if="item.open">
+							<div :class="['sd_b_i_l_item',type==`${index}-${index2}`?'sd_b_i_listActive':'']" v-for="(item2,index2) in item.allClass" :key="index+'-'+index2" @click.stop="changeChapter(`${index}-${index2}`)">
+								<span>第{{ index2+1 }}节</span><span>{{ item2.title }}</span>
+							</div>
+						</div>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {},
+  data() {
+    return {
+      show: false,
+      classList: [
+        {
+          title: "第一章:科學入門",
+					open:true,
+          allClass: [
+            {
+              title: "學習科學",
+              type: 0,
+              isComplete: true,
+              subject: 4,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8741724834676182.png"
+            },
+            {
+              title: "科學的實踐",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8731724834767532.png"
+            },
+            {
+              title: "實驗室安全",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png"
+            },
+            {
+              title: "實驗室儀器及基本實驗技巧",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8751724834771676.png"
+            },
+            {
+              title: "綜合練習",
+              type: 1,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8711724834666052.png"
+            }
+          ]
+        },
+        {
+          title: "第二章:水",
+					open:true,
+          allClass: [
+            {
+              title: "水的物熊變化",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8761724834777931.png"
+            },
+            {
+              title: "水循環",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8771724834845597.png"
+            },
+            {
+              title: "溶解",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8781724834847977.png"
+            },
+            {
+              title: "水的淨化",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8791724834873373.png"
+            },
+            {
+              title: "食水的進一步處理",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8761724834777931.png"
+            },
+            {
+              title: "節約用水和水污染",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8771724834845597.png"
+            },
+            {
+              title: "綜合練習",
+              type: 1,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png"
+            }
+          ]
+        },
+        {
+          title: "第三章:观察生物",
+					open:true,
+          allClass: [
+            {
+              title: "生物",
+              type: 0,
+              isComplete: true,
+              subject: 4,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8741724834676182.png"
+            },
+            {
+              title: "生物的分類",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8731724834767532.png"
+            },
+            {
+              title: "檢索表",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png"
+            },
+            {
+              title: "生物多樣性",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8751724834771676.png"
+            },
+            {
+              title: "綜合練習",
+              type: 1,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8711724834666052.png"
+            }
+          ]
+        }
+      ],
+			type:"",
+    };
+  },
+  methods: {
+    open(type='2-1') {
+      this.show = true;
+			this.type = type;
+    },
+    close() {
+      this.show = false;
+      this.init();
+    },
+    init() {
+      this.$nextTick(() => {});
+    },
+		changeChapter(index){
+			this.$emit("success",index)
+		},
+  }
+};
+</script>
+
+<style scoped>
+.settingsDialog >>> .el-dialog {
+  min-width: 600px;
+  max-width: 80%;
+  height: 600px;
+  max-height: 80%;
+  box-shadow: 0px 0 8px 0px #555555;
+  border-radius: 8px;
+  background-color: #fff;
+  /* top: 0px; */
+  /* margin: 0 auto; */
+  overflow: hidden;
+}
+.settingsDialog >>> .el-dialog__body {
+  height: 100%;
+  min-width: 500px;
+  flex-shrink: 0;
+  box-sizing: border-box;
+  padding-bottom: 50px;
+  padding-top: 10px;
+}
+.settingsDialog >>> .el-dialog__header {
+  display: none;
+}
+
+.sd_top {
+  /* background: #adadad; */
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: space-between;
+  height: 54px;
+  border-radius: 8px 8px 0 0;
+  user-select: none;
+  font-size: 24px;
+  font-weight: bold;
+  color: black;
+  /* border-bottom: 1px #ccc solid; */
+}
+.sd_top >>> .el-input__icon {
+  line-height: 32px;
+}
+
+.sd_t_right {
+  cursor: pointer;
+}
+
+.sd_box {
+  width: 100%;
+  padding: 0 30px 20px 30px;
+  box-sizing: border-box;
+  height: calc(100% - 30px);
+}
+
+.sd_b_list {
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+}
+
+.sd_b_l_item {
+  width: 100%;
+  height: auto;
+}
+
+.sd_b_i_title {
+  width: 100%;
+  height: 40px;
+  display: flex;
+  align-items: center;
+  font-size: 20px;
+	cursor: pointer;
+}
+
+.sd_b_i_title>svg{
+	width: 20px;
+	height: 20px;
+	margin-right: 10px;
+}
+
+
+.sd_b_i_title>span{
+	display: flex;
+	max-width: 80%;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.sd_b_i_list{
+	width: 100%;
+	height: auto;
+}
+
+.sd_b_i_l_item{
+	width: 100%;
+	height: 40px;
+	border-radius: 4px;
+	background-color: #fff;
+	font-size: 18px;
+	display: flex;
+	align-items: center;
+	box-sizing: border-box;
+	padding-left: 30px;
+	margin: 5px 0;
+	cursor: pointer;
+}
+
+.sd_b_i_l_item>span{
+	margin-right: 10px;
+}
+
+.sd_b_i_l_item:hover{
+	background-color: #E0EAFB;
+	color: #3681FC;
+	
+}
+
+.sd_b_i_listActive{
+	background-color: #E0EAFB !important;
+	color: #3681FC !important;
+}
+
+</style>

+ 8 - 4
src/components/pages/pocAiClassroom/component/chapterCard.vue

@@ -38,7 +38,7 @@
           <span
             class="cc_b_i_ba_doWorks"
             v-if="[0, 1].includes(item.type)"
-            @click.stop="goWorks(item)"
+            @click.stop="goWorks(item,index)"
             >做练习</span
           >
         </div>
@@ -74,7 +74,11 @@ export default {
     subjectList: {
       type: Array,
       default: () => []
-    }
+    },
+		index:{
+			type:Number,
+			default:0
+		}
   },
   data() {
     return {
@@ -89,9 +93,9 @@ export default {
           `/pocClass?userid=${this.userId}&org=${this.org}&oid=${this.oid}`
         );
     },
-    goWorks(item) {
+    goWorks(item,index) {
       this.$router.push(
-        `/pocDoTask?userid=${this.userId}&org=${this.org}&oid=${this.oid}`
+        `/pocDoTask?userid=${this.userId}&org=${this.org}&oid=${this.oid}&type=${this.index}-${index}`
       );
     }
   }

+ 523 - 10
src/components/pages/pocAiClassroom/doTask.vue

@@ -67,6 +67,9 @@
                   : "[单选题]"
               }}</span
               >{{ taskList[showTaskIndex].teststitle }}
+							<div class="titleImage" v-if="taskList[showTaskIndex].imageUrl">
+								<img :src="taskList[showTaskIndex].imageUrl">
+							</div>
             </div>
             <div class="dt_m_b_l_t_choseList">
               <div
@@ -352,7 +355,12 @@
         </span>
 
 				<div class="dt_c_m_message">
-            这题选:<span>{{ taskList[showTaskIndex].answer }}</span>
+					<span v-text="seekAssistMessage"></span>
+					<!-- 这题选:<span>{{
+            typeof taskList[showTaskIndex].answer == 'object'
+              ? taskList[showTaskIndex].answer.map(i => choseList[i]).join('、')
+              : choseList[taskList[showTaskIndex].answer]
+          }}</span> -->
           </div>
           <div class="dt_c_m_btnArea">
 						<span class="dt_c_m_btn1" @click.stop="doNotKnow()">还是不太明白</span>
@@ -443,6 +451,10 @@
               }}{{ index + 1 }}.{{ item.teststitle }}</span
             >
 
+						<div class="titleImage" v-if="item.imageUrl">
+							<img :src="item.imageUrl">
+						</div>
+
             <div class="dt_is_tl_tb_i_choseList">
               <span
                 v-for="(item2, index2) in item.checkList"
@@ -501,11 +513,19 @@
         </div>
       </div>
     </div>
+		<changeChapterDialog ref="changeChapterDialogRef" @success="changeChapterSuccess"/>
+
+
   </div>
 </template>
 
 <script>
+import changeChapterDialog from './component/changeChapterDialog.vue';
+import { v4 as uuidv4 } from 'uuid'
 export default {
+	components:{
+		changeChapterDialog
+	},
   data() {
     return {
       showTaskIndex: 0,
@@ -703,14 +723,13 @@ export default {
         }
       ],
       taskMessage: {
-        chapter: "第一章",
-        grade: "中",
+        chapter: "",
+        grade: "中",
         semester: "上学期",
         edition: "人教版",
-        subject: "物理",
-        title: "第四课 测量平均速度"
+        subject: "科学",
+        title: ""
       },
-
       isSubmit: false,
       star: 4,
       onlyShowMistake: false,
@@ -763,7 +782,166 @@ export default {
           personality:
             "心思细腻,能够敏锐捕捉到别人的需求,喜欢支持和鼓励他人,富有耐心6"
         }
-      ]
+      ],
+			type:this.$route.query.type,
+			classList: [
+        {
+          title: "第一章:科學入門",
+					open:true,
+          allClass: [
+            {
+              title: "學習科學",
+              type: 0,
+              isComplete: true,
+              subject: 4,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8741724834676182.png"
+            },
+            {
+              title: "科學的實踐",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8731724834767532.png"
+            },
+            {
+              title: "實驗室安全",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png"
+            },
+            {
+              title: "實驗室儀器及基本實驗技巧",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8751724834771676.png"
+            },
+            {
+              title: "綜合練習",
+              type: 1,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8711724834666052.png"
+            }
+          ]
+        },
+        {
+          title: "第二章:水",
+					open:true,
+          allClass: [
+            {
+              title: "水的物熊變化",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8761724834777931.png"
+            },
+            {
+              title: "水循環",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8771724834845597.png"
+            },
+            {
+              title: "溶解",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8781724834847977.png"
+            },
+            {
+              title: "水的淨化",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8791724834873373.png"
+            },
+            {
+              title: "食水的進一步處理",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8761724834777931.png"
+            },
+            {
+              title: "節約用水和水污染",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8771724834845597.png"
+            },
+            {
+              title: "綜合練習",
+              type: 1,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png"
+            }
+          ]
+        },
+        {
+          title: "第三章:观察生物",
+					open:true,
+          allClass: [
+            {
+              title: "生物",
+              type: 0,
+              isComplete: true,
+              subject: 4,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8741724834676182.png"
+            },
+            {
+              title: "生物的分類",
+              type: 0,
+              subject: 4,
+              isComplete: true,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8731724834767532.png"
+            },
+            {
+              title: "檢索表",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png"
+            },
+            {
+              title: "生物多樣性",
+              type: 0,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8751724834771676.png"
+            },
+            {
+              title: "綜合練習",
+              type: 1,
+              subject: 4,
+              isComplete: false,
+              image:
+                "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8711724834666052.png"
+            }
+          ]
+        }
+      ],
+			seekAssistLoading:false,
+			seekAssistMessage:"",
     };
   },
   computed: {
@@ -901,11 +1079,12 @@ export default {
     },
     // 切换章节
     changeChapter() {
-      console.log("切换章节");
+      this.$refs.changeChapterDialogRef.open(this.type);
     },
     //求助
     seekAssist() {
       this.showSeekAssist = true;
+			this.getSeekAssist()
     },
     keepTime() {
       if (this.timer !== null) {
@@ -1007,12 +1186,334 @@ export default {
       }
     },
 		doNotKnow(){
-			this.$message.info("多想想")
-		}
+			this.getSeekAssist();
+		},
+		changeChapterSuccess(index){
+			if(index=='1-0'){
+				// {
+        //   teststitle: '请从以下选项中选出一个由三个不同字母组成的组合。',
+        //   checkList: ['abc', 'aaa', 'bca', 'ccc'],
+        //   timuList: [],
+        //   answer: 0,
+        //   type: '1',
+        //   analyze:
+        //     '本题考核学生对字母的识别能力以及对字母组合的理解。学生需要识别每个选项中的字母,并判断是否由三个不同的字母组成。选项1(abc)和选项3(bca)都由三个不同的字母组成,但根据题目要求,选项1是正确答案。',
+        //   answer2: '',
+        //   uuid: '2b29f3aa-3389-4415-85aa-613f72e23de6',
+        //   isSubmit: false
+        // },
+				let task = [
+					{
+						teststitle:"當冰加熱到0°C時,它會發生什麼變化",
+						checkList:["沸騰","凝結","熔化","蒸發"],
+						answer:2,
+						type: '1',
+						analyze:"當冰加熱到0°C時,它會從固態轉變成液態,這個過程稱為熔化。",
+						answer2: '',
+					},
+					{
+						teststitle:"在自然界中,水能以哪種形式存在?",
+						checkList:["只有液態","只有固態","液態和氣態","三態均有"],
+						answer:3,
+						type: '1',
+						analyze:"水在自然界中可以以固態(冰)、液態(水)和氣態(水汽)三種狀態存在。",
+						answer2: '',
+					},{
+						teststitle:"易拉罐表面在夏天常出現水滴,這是由於水汽的什麼現象?",
+						checkList:["蒸發","熔化","沸騰","凝結"],
+						answer:3,
+						type: '1',
+						analyze:"水汽在接觸冷的易拉罐表面時凝結成液態水,這個過程稱為凝結。",
+						answer2: '',
+					},{
+						teststitle:"在夏天,玻璃杯外面的水滴形成是因為哪種水物態變化?",
+						checkList:["凝固","熔化","沸騰","凝結"],
+						answer:3,
+						type: '1',
+						analyze:"玻璃杯外的水滴是由空氣中的水汽經由凝結形成的。",
+						answer2: '',
+					},{
+						teststitle:"下列哪一項說法正確描述水的熱的物態變化?",
+						checkList:["水的凝結點比沸點高","水在0°C時開始凝固或熔化","水只能通過沸騰轉化為氣態","水在自然界只存在於其中一種狀態"],
+						answer:1,
+						type: '1',
+						analyze:"水在0°C時,可以開始從固態冰凝固成液態水,或者從液態水熔化成固態冰。",
+						answer2: '',
+					},{
+						teststitle:"下列哪項關於物熊變化的敘述是不正確的?",
+						checkList:["凝結會於沸點或以下的温度發生","蒸發過程中不会吸收或釋出能量。","凝固是物質由液熊轉變成固熊的過程","D.固體熔化時的温度保持不變。"],
+						answer:1,
+						type: '1',
+						analyze:"選項B蒸發是液體變成氣體的過程,這個過程需要吸收能量,稱為蒸發熱。因此,蒸發是一個吸熱過程。",
+						answer2: '',
+					},{
+						teststitle:"如圖所示,盛了水的鍋正在爐上加熱。在鍋中和在鍋蓋內壁的水正在發生甚麼物熊變化?",
+						imageUrl:"https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/image%20%281%291725689946082.png",
+						checkList:["鍋中:熔化,鍋蓋內璧:沸騰","鍋中:蒸發,鍋蓋內璧:凝固","鍋中:沸騰,鍋蓋內璧:凝結","鍋中:凝結,鍋蓋內璧:蒸發"],
+						answer:2,
+						type: '1',
+						analyze:"鍋中:沸騰。當鍋中的水被加熱到一定的溫度,即水的沸點時,水分子獲得足夠的能量克服相互之間的吸引力,開始從液態轉變為氣態,形成氣泡並上升到水面,然後氣泡破裂,釋放出水蒸氣。這個過程稱為沸騰,是液體變成氣體的相變過程。鍋蓋內璧:凝結。鍋蓋內璧的溫度通常低於鍋中水的溫度,因此當鍋中產生的水蒸氣遇到較冷的鍋蓋內璧時,水蒸氣分子會失去能量,相互之間的吸引力增強,導致它們重新聚集在一起形成液態水。這個過程稱為凝結,是氣體變成液體的相變過程。",
+						answer2: '',
+					},{
+						teststitle:"下列哪項正確顯示冰變成水時的水粒子變化?",
+						imageUrl:"https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/image%20%282%291725690023281.png",
+						checkList:["A","B","C","D"],
+						answer:0,
+						type: '1',
+						analyze:"冰變成水時,水分子間的距離增大,分子運動加快。",
+						answer2: '',
+					},{
+						teststitle:"當水冷卻到0°C時,它會發生什麼變化?",
+						checkList:["熔化","凝固","沸騰","蒸發"],
+						answer:1,
+						type: '1',
+						analyze:"當水冷卻到0°C時,它會從液態轉變成固態,這個過程稱為凝固。",
+						answer2: '',
+					},{
+						teststitle:"水蒸發需要具備哪些條件?",
+						checkList:["高於100°C的溫度","僅能在沸點發生","低於沸點的任何溫度","僅能在冰點發生"],
+						answer:2,
+						type: '1',
+						analyze:"水蒸發可以在低於沸點的任何溫度發生,並不需要達到沸點。",
+						answer2: '',
+					}
+				]
+				this.taskList = task;
+			}else if(index=='1-1'){
+				let task = [
+					{
+						teststitle:`在下列哪個(些)情况下,濕衣服會乾得很慢?
+(1)把衣服摺起來
+(2)空氣濕度低
+(3)把衣服晾在陽光下
+`,
+						checkList:["只有 (1)","只有 (1)和 (2)","只有 (1) 和 (3)","只有 (2) 和 (3)"],
+						answer:0,
+						type: '1',
+						analyze:"當衣服被折疊起來時,水分蒸發的表面積減少,因為衣服內部的水分不容易接觸到流通的空氣,這會減慢幹燥過程。,水分蒸发的表面积减少,因为衣服内部的水分不容易接触到流通的空气,这会减慢干燥过程。",
+						answer2: '',
+					},
+					{
+						teststitle:"下列各容器盛有相同分量的水。把它們置在陽光下幾小時後,哪個容器會剩下最少水?",
+						imageUrl:"https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/image%20%283%291725690506088.png",
+						checkList:["A","B","C","D"],
+						answer:2,
+						type: '1',
+						analyze:"表面積越大,水分接觸空氣的面積越多,蒸發得越快。",
+						answer2: '',
+					},{
+						teststitle:`一把濕雨傘收起後掛在窗邊。下列哪個(些)方法能使目4濕傘快些乾透?
+(1)把雨傘放在陽光下。
+(2)開動風扇,再把雨傘放在風扇前方
+(3)完全打開傘。
+`,
+						checkList:["只有 (1)","只有 (2)和 (3)","只有(1)和(2)","全部(1)(2)和(3)"],
+						answer:3,
+						type: '1',
+						analyze:"(1)將雨傘放在陽光直射的地方,可以利用太陽的熱量來提高雨傘的溫度,這是加快水分蒸發的一個有效方法。(2)使用風扇或其他形式的人工通風可以增加空氣中的對流,幫助將潮濕的空氣帶走,並帶來更幹燥的空氣,這同樣有助於加速雨傘的幹燥。(3)雨傘完全打開時,增加了與空氣接觸的表面積,這意味著有更多的水分可以同時蒸發,從而加快了整體的幹燥過程。",
+						answer2: '',
+					},{
+						teststitle:"下列哪項關於大自然中水的敘述是正確的 ?",
+						checkList:["地球上的水因蒸發不斷流失。","地球上的水因凝結不斷增加。","海洋中水由液熊水轉變成水汽。","高空的水滴不會返回地面。"],
+						answer:2,
+						type: '1',
+						analyze:"A 雖然地球上的水會通過蒸發變成水蒸氣進入大氣中,但這個過程是水循環的一部分,水蒸氣最終會通過凝結成雲,再以雨、雪等形式返回地面,補充到地球上的水源中。B 凝結是水循環中的一個環節,這個過程並不會導致地球上總水量的增加,因為水循環是一個動態平衡的系統。D高空中的水滴可以通過多種方式返回地面,最常見的是水滴凝結成雲,然後以雨、雪、冰雹等形式降落到地面。",
+						answer2: '',
+					},{
+						teststitle:"以下哪個現象不屬於水循環的一部分?",
+						checkList:["蒸發","火山爆發","降水","凝結"],
+						answer:1,
+						type: '1',
+						analyze:"水循環涉及蒸發、凝結、運輸和降水等過程,而火山爆發不是水循環的一部分。",
+						answer2: '',
+					},{
+						teststitle:"以下哪種因素不直接影響水的蒸發速率?",
+						checkList:["溫度","空氣流動","衣服的顏色","表面積"],
+						answer:2,
+						type: '1',
+						analyze:"水的蒸發速率主要受溫度、空氣流動和表面積的影響,衣服的顏色不直接影響水的蒸發。",
+						answer2: '',
+					},{
+						teststitle:"在水循環中,海洋的主要作用是什麼?",
+						// imageUrl:"https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/image%20%281%291725689946082.png",
+						checkList:["提供空氣濕度","儲存地球上大部分水量","為陸地提供地下水","提供生態系統"],
+						answer:1,
+						type: '1',
+						analyze:"海洋覆蓋地球表面的約 70%,儲存了地球總水量的 97%,是水循環的主要儲水地。",
+						answer2: '',
+					},{
+						teststitle:"下列關於水循環的敘述,哪一項是不正確的?",
+						checkList:["降水可以是雨、雪、或冰雹","水循環是由人類活動主導的","降水主要發生在海洋","凝結形成雲"],
+						answer:1,
+						type: '1',
+						analyze:"水循環是自然過程,主要受到太陽能量驅動,而非人類活動。",
+						answer2: '',
+					},{
+						teststitle:"為什麼高空的水滴容易凝結?",
+						checkList:["因為空氣中的二氧化碳含量高","因為高空的溫度較低","因為水的密度變大","因為地心引力的作用"],
+						answer:1,
+						type: '1',
+						analyze:"高空的溫度較低,這樣水汽容易凝結成小水滴。",
+						answer2: '',
+					},{
+						teststitle:"以下哪項活動會加快水的蒸發速率?",
+						checkList:["將盛水的容器蓋住","將水置於陰暗角落","將水置於陽光直射下","增加室內濕度"],
+						answer:2,
+						type: '1',
+						analyze:"在陽光直射下,水分子吸收更多的能量,蒸發速率會增加。",
+						answer2: '',
+					}
+				]
+				this.taskList = task;
+			}else{
+				let task = [
+					{
+						teststitle:"當冰加熱到0°C時,它會發生什麼變化",
+						checkList:["沸騰","凝結","熔化","蒸發"],
+						answer:2,
+						type: '1',
+						analyze:"當冰加熱到0°C時,它會從固態轉變成液態,這個過程稱為熔化。",
+						answer2: '',
+					},
+					{
+						teststitle:"在自然界中,水能以哪種形式存在?",
+						checkList:["只有液態","只有固態","液態和氣態","三態均有"],
+						answer:3,
+						type: '1',
+						analyze:"水在自然界中可以以固態(冰)、液態(水)和氣態(水汽)三種狀態存在。",
+						answer2: '',
+					},{
+						teststitle:"易拉罐表面在夏天常出現水滴,這是由於水汽的什麼現象?",
+						checkList:["蒸發","熔化","沸騰","凝結"],
+						answer:3,
+						type: '1',
+						analyze:"水汽在接觸冷的易拉罐表面時凝結成液態水,這個過程稱為凝結。",
+						answer2: '',
+					},{
+						teststitle:"在夏天,玻璃杯外面的水滴形成是因為哪種水物態變化?",
+						checkList:["凝固","熔化","沸騰","凝結"],
+						answer:3,
+						type: '1',
+						analyze:"玻璃杯外的水滴是由空氣中的水汽經由凝結形成的。",
+						answer2: '',
+					},{
+						teststitle:"下列哪一項說法正確描述水的熱的物態變化?",
+						checkList:["水的凝結點比沸點高","水在0°C時開始凝固或熔化","水只能通過沸騰轉化為氣態","水在自然界只存在於其中一種狀態"],
+						answer:1,
+						type: '1',
+						analyze:"水在0°C時,可以開始從固態冰凝固成液態水,或者從液態水熔化成固態冰。",
+						answer2: '',
+					},{
+						teststitle:"下列哪項關於物熊變化的敘述是不正確的?",
+						checkList:["凝結會於沸點或以下的温度發生","蒸發過程中不会吸收或釋出能量。","凝固是物質由液熊轉變成固熊的過程","D.固體熔化時的温度保持不變。"],
+						answer:1,
+						type: '1',
+						analyze:"選項B蒸發是液體變成氣體的過程,這個過程需要吸收能量,稱為蒸發熱。因此,蒸發是一個吸熱過程。",
+						answer2: '',
+					},{
+						teststitle:"如圖所示,盛了水的鍋正在爐上加熱。在鍋中和在鍋蓋內壁的水正在發生甚麼物熊變化?",
+						imageUrl:"https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/image%20%281%291725689946082.png",
+						checkList:["鍋中:熔化,鍋蓋內璧:沸騰","鍋中:蒸發,鍋蓋內璧:凝固","鍋中:沸騰,鍋蓋內璧:凝結","鍋中:凝結,鍋蓋內璧:蒸發"],
+						answer:2,
+						type: '1',
+						analyze:"鍋中:沸騰。當鍋中的水被加熱到一定的溫度,即水的沸點時,水分子獲得足夠的能量克服相互之間的吸引力,開始從液態轉變為氣態,形成氣泡並上升到水面,然後氣泡破裂,釋放出水蒸氣。這個過程稱為沸騰,是液體變成氣體的相變過程。鍋蓋內璧:凝結。鍋蓋內璧的溫度通常低於鍋中水的溫度,因此當鍋中產生的水蒸氣遇到較冷的鍋蓋內璧時,水蒸氣分子會失去能量,相互之間的吸引力增強,導致它們重新聚集在一起形成液態水。這個過程稱為凝結,是氣體變成液體的相變過程。",
+						answer2: '',
+					},{
+						teststitle:"下列哪項正確顯示冰變成水時的水粒子變化?",
+						imageUrl:"https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/image%20%282%291725690023281.png",
+						checkList:["A","B","C","D"],
+						answer:0,
+						type: '1',
+						analyze:"冰變成水時,水分子間的距離增大,分子運動加快。",
+						answer2: '',
+					},{
+						teststitle:"當水冷卻到0°C時,它會發生什麼變化?",
+						checkList:["熔化","凝固","沸騰","蒸發"],
+						answer:1,
+						type: '1',
+						analyze:"當水冷卻到0°C時,它會從液態轉變成固態,這個過程稱為凝固。",
+						answer2: '',
+					},{
+						teststitle:"水蒸發需要具備哪些條件?",
+						checkList:["高於100°C的溫度","僅能在沸點發生","低於沸點的任何溫度","僅能在冰點發生"],
+						answer:2,
+						type: '1',
+						analyze:"水蒸發可以在低於沸點的任何溫度發生,並不需要達到沸點。",
+						answer2: '',
+					}
+				]
+				this.taskList = task;
+			}
+			this.showTaskIndex = 0;
+			this.time = 0;
+			this.time2 = 0;
+			this.startTime = new Date().getTime();
+			this.type = index;
+			this.taskMessage.chapter = this.classList[parseInt(index.split('-')[0])].title;
+			this.taskMessage.title = `第${parseInt(index.split('-')[1])+1}节 ${this.classList[parseInt(index.split('-')[0])].allClass[parseInt(index.split('-')[1])].title}`;
+			this.$refs.changeChapterDialogRef.close();
+		},
+		getSeekAssist() {
+			if(this.seekAssistLoading)return;
+      return new Promise(resolve => {
+        this.seekAssistLoading = true
+				this.seekAssistMessage = "我想想哦...";
+        let task = this.taskList[this.showTaskIndex]
+        let taskMsg = `${typeof task.answer == 'object' ? '【多选题】' : '【单选题】'}${task.teststitle}
+${task.checkList.map((i, index) => this.choseList[index] + '.' + i).join('\n')}
+正确答案:${
+          typeof task.answer == 'object'
+            ? task.answer.map(i => this.choseList[i]).join('、')
+            : this.choseList[task.answer]
+        }
+解析:${task.analyze}
+`
+
+        let _msg = `Language: Please use the same language as the user requirement, if the user speaks Traditional Chinese, the specific text of your answer should also be in Traditional Chinese.
+ATTENTION: Use '##' to SPLIT SECTIONS, not '#'. Output format carefully referenced "Format example".
+Instruction: Based on the context, follow "Format example", write content
+
+#Context
+這是一道題目相關的資料,你面向的是一位中學一年級的學生。現在學生求解這道題遇到了困難。請你扮演一位香港中學科學老師,請你使用1-3句完整的話,結合該題目考核的具體選項,從側面對題目選項進行暗示,務必不要直接給出答案。請堅持使用繁體中文,並使用香港人習慣使用的表達方式,請使用偏口語的方式表達,適當給予學生鼓勵。
+##題目內容:
+${taskMsg}
+
+#Format example
+(只需要输出一句话即可,不需要输出其他内容,不要输出Object)
+`
+
+        let params = {
+          assistant_id: '6063369f-289a-11ef-8bf4-12e77c4cb76b',
+          userId: this.userId,
+          message: [{ type: 'text', text: _msg }],
+          session_name: uuidv4(),
+          // uid: _uuid,
+          file_ids: [],
+          model: 'gpt-4o-2024-08-06'
+        }
+
+        this.ajax.post("https://gpt4.cocorobo.cn/ai_agent_park_chat", params).then(res => {
+          let _result = res.data.FunctionResponse.message;
+					if(_result){
+						this.seekAssistMessage = _result;
+						this.seekAssistLoading = false;
+					}else{
+						console.log(_result);
+					this.$message.error("获取失败,请重试");
+					this.showSeekAssist = false;
+					}
+        }).catch(e=>{
+					console.log(e);
+					this.$message.error("获取失败,请重试");
+					this.showSeekAssist = false;
+				})
+      })
+    }
   },
   mounted() {
     this.keepTime();
     this.sortTaskList();
+		this.changeChapterSuccess(this.type)
   }
 };
 </script>
@@ -1877,6 +2378,8 @@ export default {
   max-width: 100%;
   font-size: 24px;
   padding: 10px 30px;
+	max-height: 48%;
+	overflow: auto;
 }
 
 .dt_c_m_message > span {
@@ -1914,4 +2417,14 @@ export default {
 	color: #fff;
 	padding: 12px 40px !important;
 }
+
+.titleImage{
+	width: 100%;
+	height: auto;
+}
+
+.titleImage>img{
+	max-width: 80%;
+	max-height: 400px;
+}
 </style>

+ 37 - 34
src/components/pages/pocAiClassroom/index.vue

@@ -136,11 +136,12 @@
       >
     </div> -->
 
-    <div class="pac_box">
+    <div class="pac_box" v-if="subject==='' || subject===4">
       <chapterCard
         v-for="(item, index) in classList"
         :key="index"
         :data="item"
+				:index="index"
         :subjectList="subjectList"
       />
     </div>
@@ -176,7 +177,7 @@
           <div class="pac_fd_b_r_message">
             Hi,{{
               userInfo.userName
-            }}同学,欢迎回来!你是否开始下一节课的学习,学习<span>【运动的快慢】</span>?
+            }}同学,欢迎回来!你是否开始下一节课的学习,学习<span>【水循环】</span>?
           </div>
           <div class="pac_fd_b_r_btnArea">
             <span class="pac_fd_b_r_ba_btn1" @click.stop="dialogBtn(3)"
@@ -230,14 +231,15 @@ export default {
       userId: this.$route.query.userid,
       org: this.$route.query.org,
       oid: this.$route.query.oid,
-      subject: "",
-      edition: "",
+      subject: 4,
+      edition: 0,
       searchValue: "",
       grade: 7,
+	
       showDialog: true,
       userInfo: {
         userName: "科科",
-				grade:7,
+				grade:6,
 				userAvatar:"",
         choseCharacter: 0,
       },
@@ -323,16 +325,17 @@ export default {
       //   { value: 8, label: "政治" }
       // ],
       editionList: [
-        { value: 0, label: "人教版" },
-        { value: 1, label: "教科版" },
-        { value: 2, label: "北师大版" },
-        { value: 3, label: "苏教版" },
-        { value: 4, label: "沪教版" },
-        { value: 5, label: "浙教版" },
-        { value: 6, label: "冀教版" },
-        { value: 7, label: "鲁教版" },
-        { value: 8, label: "人教A版" },
-        { value: 9, label: "人教B版" }
+				{ value: 0, label: "牛津大學" },
+        // { value: 0, label: "人教版" },
+        // { value: 1, label: "教科版" },
+        // { value: 2, label: "北师大版" },
+        // { value: 3, label: "苏教版" },
+        // { value: 4, label: "沪教版" },
+        // { value: 5, label: "浙教版" },
+        // { value: 6, label: "冀教版" },
+        // { value: 7, label: "鲁教版" },
+        // { value: 8, label: "人教A版" },
+        // { value: 9, label: "人教B版" }
       ],
       classList: [
         {
@@ -342,34 +345,34 @@ export default {
               title: '學習科學',
               type: 0,
               isComplete: true,
-              subject: 0,
+              subject: 4,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8741724834676182.png'
             },
             {
               title: '科學的實踐',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: true,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8731724834767532.png'
             },
             {
               title: '實驗室安全',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png'
             },
             {
               title: '實驗室儀器及基本實驗技巧',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8751724834771676.png'
             },
             {
               title: '綜合練習',
               type: 1,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8711724834666052.png'
             }
@@ -381,49 +384,49 @@ export default {
             {
               title: '水的物熊變化',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: true,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8761724834777931.png'
             },
             {
               title: '水循環',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: true,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8771724834845597.png'
             },
             {
               title: '溶解',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: true,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8781724834847977.png'
             },
             {
               title: '水的淨化',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: true,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8791724834873373.png'
             },
             {
               title: '食水的進一步處理',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8761724834777931.png'
             },
             {
               title: '節約用水和水污染',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8771724834845597.png'
             },
             {
               title: '綜合練習',
               type: 1,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png'
             },
@@ -436,34 +439,34 @@ export default {
               title: '生物',
               type: 0,
               isComplete: true,
-              subject: 0,
+              subject: 4,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8741724834676182.png'
             },
             {
               title: '生物的分類',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: true,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8731724834767532.png'
             },
             {
               title: '檢索表',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8721724834685472.png'
             },
             {
               title: '生物多樣性',
               type: 0,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8751724834771676.png'
             },
             {
               title: '綜合練習',
               type: 1,
-              subject: 0,
+              subject: 4,
               isComplete: false,
               image: 'https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E5%9B%BE%E7%89%8711724834666052.png'
             }
@@ -489,12 +492,12 @@ export default {
         this.showDialog = false;
       } else if (type == 1) {
         this.$router.push(
-          `/pocClass?userid=${this.userId}&org=${this.org}&oid=${this.oid}`
+          `/pocClass?userid=${this.userId}&org=${this.org}&oid=${this.oid}&type=1`
         );
         // console.log("开始学习新的内容");
       } else if (type == 2) {
         this.$router.push(
-          `/pocClass?userid=${this.userId}&org=${this.org}&oid=${this.oid}`
+          `/pocClass?userid=${this.userId}&org=${this.org}&oid=${this.oid}&type=2`
         );
         // console.log("复习上一节课");
       } else if (type == 3) {

+ 8 - 1
src/components/pages/pocAiClassroom/pocClass.vue

@@ -13,6 +13,7 @@ export default {
       userId: this.$route.query.userid,
       org: this.$route.query.org,
       oid: this.$route.query.oid,
+			type:this.$route.query.type,
 			src:"https://beta.cloud.cocorobo.cn/aigpt/#/js?active_role=3"
     };
   },
@@ -20,7 +21,13 @@ export default {
 
   },
   mounted() {
-    
+		if (this.type == 1) {
+      this.src = `https://beta.cloud.cocorobo.cn/aigpt/#/js?active_role=${5}`;
+			console.log("5")
+    } else if (this.type == 2) {
+      this.src = `https://beta.cloud.cocorobo.cn/aigpt/#/js?active_role=${3}`;
+			console.log(3)
+    }
   }
 };
 </script>

+ 1 - 60
src/components/pages/pocAiClassroom/startIndex.vue

@@ -1,18 +1,6 @@
 <template>
 	<div class="startIndex">
-		<div class="si_start">
-			<div class="si_s_heardImage"></div>
-			<div class="si_s_messageArea">
-				<span>Hi~同学!😆</span>
-				<span>我是智能学伴,是陪你学习和聊天的小伙伴!😎</span>
-				<span>有什么问题,你都可以随时召唤我🫡</span>
-				<span>请你先帮我取一个名字吧😜</span>
-			</div>
-			<div class="si_s_inputArea">
-				<div class="si_s_inputLeft"></div>
-				<span></span>
-			</div>
-		</div>
+
 	</div>
 </template>
 
@@ -41,51 +29,4 @@
 	justify-content: center;
 }
 
-.si_start{
-	width: auto;
-	height: auto;
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-}
-
-.si_s_messageArea{
-	display: flex;
-	flex-direction: column;
-	padding: 30px;
-	background-color: #fff;
-	border-radius: 10px;
-	border: solid 2px black;
-}
-
-.si_s_messageArea>span{
-	color:#6F93F0;
-	font-size: 20px;
-}
-
-.si_s_inputArea{
-	margin-top: 20px;
-	width: 250px;
-	height: 50px;
-	background-color: #fff;
-	border: solid 2px black;
-	border-radius: 0 10px 10px 10px;
-}
-.si_s_inputLeft{
-	width: 200px;
-	height: 50px;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-}
-
-.si_s_inputArea>span{
-	width: 50px;
-	height: 50px;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	background-color: gray;
-}
 </style>