fix: 修改

src/api/customize.ts

@@ -7,6 +7,7 @@ import {
   IBabyRecord,
   IDomainDetail,
   ISemesterReport,
+  IQuestionReport,
 } from "@/types/customize.d";
 
 /**
@@ -26,7 +27,6 @@ export function getCustomizeSemesterBabies(data: {
   classId: string;
   classLevelCode: string;
   gameType: string;
-  recordType: string;
   semesterType: string;
 }) {
   return request<{ recordData: IRecordData; babyList: IBabies[] }>({
@@ -144,7 +144,7 @@ export function getQuestionRecordRequest(params: {
   babyId: string;
   id: string;
 }) {
-  return request<ISemesterReport>({
+  return request<IQuestionReport>({
     url: `/teach/thought/customize/valuation/report/single/question`,
     method: "GET",
     params,

src/store/modules/customize.ts

@@ -8,9 +8,11 @@ import {
   IBabyDetail,
   IBabyRecord,
   IDomainDetail,
+  IQuestionReport,
   IRecordData,
   ISemesterReport,
   ISingleRecord,
+  defaultQuestionReport
 } from "@/types/customize.d";
 import {
   getBabyDetailRequest,
@@ -42,9 +44,7 @@ export default defineStore("customize", () => {
   const babyDetail = ref<IBabyDetail>(defaultBabyDetail());
   const domainList = ref<IDomainDetail[]>([]);
   const semesterReport = ref<ISemesterReport>(defaultSemesterReport());
-  const questionReport = ref<Record<string, any>>({
-    teacherName: ''
-  });
+  const questionReport = ref<IQuestionReport>(defaultQuestionReport());
 
   async function getSingleRecord(babyId: string, id: string) {
     const { status, data } = await getCustomizeSingleRecord(babyId, id);
@@ -60,7 +60,7 @@ export default defineStore("customize", () => {
     classId: string;
     classLevelCode: string;
     gameType: string;
-    recordType: string;
+
     semesterType: string;
   }) {
     const { status, data } = await getCustomizeSemesterBabies(params);

src/types/customize.d.ts

@@ -46,6 +46,7 @@ export interface ISingleRecord {
   domainList: IDomain[];
 }
 
+
 export function defaultSingleRecord(): ISingleRecord {
   return {
     recordId: "",
@@ -53,7 +54,7 @@ export function defaultSingleRecord(): ISingleRecord {
     sendReport: 0,
     recordDate: "",
     teacherName: "",
-    babyNames: [],
+    babyNames: [],              
     joinSemester: 1,
     story: {
       images: [],
@@ -150,6 +151,8 @@ interface IDomainData {
     education: string;
   }[];
 }
+
+
 export interface ISemesterReport {
   classId: string;
   classLevelCode: -1 | 0 | 1 | 2;
@@ -166,7 +169,26 @@ export interface ISemesterReport {
   domainDataList: IDomainData[];
   learnDepthList: string[]
   babyLearnDepthList: any[]
-  questionList: any
+  questionList: {
+    background: string
+    teacherName: string
+    topic: string
+    questions: {
+      activityCategories: string[]
+      babyResults: {babyId: string, babyName: string, list: {learnDepth: string, levelCode: string, levelText: string}[]}[]
+      id: string
+      plan: {content: string, images: string[], videos: string[]}
+      practice: {content: string, images: string[], videos: string[]}
+      question: string
+      questionCategory: string
+      recordDate: string
+      summary: {content: string, images: string[], videos: string[]}
+      tweaks: {content: string, images: string[], videos: string[]}
+    }[]
+  }[],
+  hobby: []
+  teachers: string[]
+  age: string
 }
 
 export function defaultSemesterReport(): ISemesterReport {
@@ -184,5 +206,75 @@ export function defaultSemesterReport(): ISemesterReport {
     endDate: "",
     domainAbilityNameList: [],
     domainDataList: [],
+    questionList: [{
+      activityCategories: [],
+      babyResults: [],
+      id: '',
+      plan: {content: '', images: [], videos: []},
+      practice: {content: '', images: [], videos: []},
+      question: '',
+      questionCategory: '',
+      recordDate: '',
+      summary: {content: '', images: [], videos: []},
+      tweaks: {content: '', images: [], videos: []}
+    }],
+    hobby: [],
+    teachers: [],
+    age: ''
   };
 }
+
+
+export interface IQuestionReport {
+
+  babyId: string;
+  joinSemester: number | null
+  recordId: string
+  sendReport: number | null
+
+  list: {
+    background: string, 
+    teacherName: string, 
+    topic: string,
+    questions: [{
+      activityCategories: string[]
+      babyResults: {babyId: string, babyName: string, list: {learnDepth: string, levelCode: string, levelText: string}[]}[]
+      id: string
+      plan: {content: string, images: string[], videos: string[]}
+      practice: {content: string, images: string[], videos: string[]}
+      question: string
+      questionCategory: string
+      recordDate: string
+      summary: {content: string, images: string[], videos: string[]}
+      tweaks: {content: string, images: string[], videos: string[]}
+    }]
+  }[]
+}
+
+
+
+export function defaultQuestionReport(): IQuestionReport {
+  return {
+    babyId: '',
+    joinSemester: '',
+    recordId: '',
+    sendReport: null,
+    list: [{
+      background: '', 
+      teacherName: '', 
+      topic: '',
+      questions: [{
+        activityCategories: [],
+        babyResults: [],
+        id: '',
+        plan: {content: '', images: [], videos: []},
+        practice: {content: '', images: [], videos: []},
+        question: '',
+        questionCategory: '',
+        recordDate: '',
+        summary: {content: '', images: [], videos: []},
+        tweaks: {content: '', images: [], videos: []}
+      }]
+    }]
+  };
+}

src/views/customize/ComplexReportList.vue

@@ -9,7 +9,7 @@ import { IBabies } from "@/types/customize";
 
 const router = useRouter();
 
-const { c: classId, l: classLevelCode, g: gameType, r: recordType, s: semesterType, o: isMyRoute } = useRoute().query;
+const { c: classId, l: classLevelCode, g: gameType, s: semesterType, o: isMyRoute } = useRoute().query;
 const customizeStore = useCustomizeStore();
 
 const { recordData, babyList } = storeToRefs(customizeStore);
@@ -77,14 +77,13 @@ onMounted(async () => {
     typeof classId === "string" &&
     typeof classLevelCode === "string" &&
     typeof gameType === "string" &&
-    typeof recordType === "string" &&
+    
     typeof semesterType === "string"
   )
     await getSemesterBabies({
       classId,
       classLevelCode,
       gameType,
-      recordType,
       semesterType,
     });
 });

src/views/customize/GrowthRecord.vue

@@ -89,16 +89,16 @@
 
         <div v-if=" isHas(item.story.images)" :class="['images', item.isExpand && 'mt40']">
           <div
-            v-for="(img, imgIndex) in item.story.images.slice(0, 3)"
+            v-for="(img, imgIndex) in item.story.images"
             :key="imgIndex"
             :style="{
               backgroundImage: `url(${img})`,
             }"
             @click.stop="imagePreview(item.story.images, imgIndex)"
           >
-            <div v-if="imgIndex === 2 && item.story.images.length > 3" class="flex-center">
+            <!-- <div v-if="imgIndex === 2 && item.story.images.length > 3" class="flex-center">
               +{{ item.story.images.length - 3 }}
-            </div>
+            </div> -->
           </div>
         </div>
 
@@ -764,7 +764,7 @@ onUnmounted(() => {
           background-size: cover;
           background-position: center center;
           overflow: hidden;
-
+          margin-bottom: 8px;
           > div {
             width: 100%;
             height: 100%;

src/views/customize/ProblemRecord.vue

@@ -92,78 +92,50 @@ onMounted(async () => {
       <img :src="getImageUrl('problem_logo')" alt="" class="pr-top-logo" />
     </div>
 
-    <div class="pr-info grid_bgi">
-      <div class="pr-info-line">
-        <div class="label">
-          <div class="label_triangle"></div>
-          <div class="label-text">记录教师：</div>
-        </div>
-        <div class="value">{{questionReport.teacherName}}</div>
-      </div>
-      <div class="pr-info-line">
-        <div class="label">
-          <div class="label_triangle"></div>
-          <div class="label-text">加入综合报告：</div>
-        </div>
-        <div class="value">{{questionReport!.joinSemester? '已加入' : '未加入'}}</div>
-      </div>
-    </div>
+    <span v-for="(item, index) in questionReport.list" :key="index" >
+      <div class="pr-topic" > {{item.topic}} </div>
 
-    <!--高阶思维评估-->
-    <div class="pr-evaluate">
-      <img :src="getImageUrl('evaluate_logo')" alt="" class="pr-evaluate-logo" />
-      <div v-for="(item, index) in questionReport!.babyList" :key="index">
-        <div class="pr-evaluate-target" :style="getTargetStyle(index)">
-          <div class="object">
+      <div class="pr-info grid_bgi">
+        <div class="pr-info-line">
+          <div class="label">
             <div class="label_triangle"></div>
-            <div class="object-label">记录对象：</div>
-            <div class="object-text">{{item.babyName}}</div>
-          </div>
-          <div class="target" v-for="learn in item.list" >
-            <div class="target-title">
-              <div class="target-title-dot"></div>
-              <div class="target-title-text">{{learn.learnDepth}}({{getStateage(learn.levelCode) }})</div>
-            </div>
-            <div class="target-content">{{learn.levelText}}。</div>
+            <div class="label-text">记录教师：</div>
           </div>
+          <div class="value">{{item.teacherName}}</div>
         </div>
-        <div
-          v-if="index !== 3"
-          class="pr-evaluate-gap"
-          :style="{ backgroundImage: `url(${getImageUrl('evaluate_gap')})` }"
-        ></div>
       </div>
-    </div>
 
-    <div class="pr-content" v-for="(item, index) in questionReport!.questionList">
+      <div class="pr-bg" > {{item.background}} </div>
+
+      <div class="pr-content" v-for="(question, index) in item.questions">
       <div class="pr-content-line">
         <div class="label_triangle"></div>
         <div class="label">记录日期：</div>
-        <div class="value">{{item.recordDate}}</div>
+        <div class="value">{{question.recordDate}}</div>
       </div>
       <div class="pr-content-line">
         <div class="label_triangle"></div>
         <div class="label">层次：</div>
-        <div class="value">{{item.questionCategory}}</div>
+        <div class="value">{{question.questionCategory}}</div>
       </div>
       <div class="pr-content-line">
         <div class="label_triangle"></div>
         <div class="label">活动形式：</div>
-        <div class="value">{{item.activityCategories.join(',')  }}</div>
+        <div class="value">{{question.activityCategories && question.activityCategories.join('、') }}</div>
       </div>
       <img :src="getImageUrl('content_question_logo')" alt="" class="pr-content-logo" />
       <div class="pr-content-question">
         <div class="title flex-center">问题{{index + 1}}</div>
-        <div class="content">{{item.question}}</div>
+        <div class="content">{{question.question}}</div>
       </div>
       <img :src="getImageUrl('inquiry_process_logo')" alt="" class="pr-content-logo" />
       <div class="pr-content-process">
-        <div class="process" v-for="(record, index) in [item.plan, item.practice, item.summary, item.tweaks]">
+        <div class="process" v-for="(record, index) in [question.plan, question.practice, question.summary, question.tweaks]">
           <div class="process-title">
             <div class="process-title-dot"></div>
             <div class="process-title-text">{{getLabel(index)}}</div>
           </div>
-          <div class="process-content">{{record.content}}</div>
+          <div class="process-content" v-if="record.content">{{record.content}}</div>
           <div class="process-content-video"  v-if="record.videos.length > 0">
             <video
               :src="record.videos[0]"
@@ -175,23 +147,54 @@ onMounted(async () => {
           </div>
           <div class="pr-content-images">
             <div
-              v-for="(img, imgIndex) in record.images.slice(0, 3)"
+              v-for="(img, imgIndex) in record.images"
               :key="imgIndex"
               :style="{
                 backgroundImage: `url(${img})`,
               }"
               @click.stop="imagePreview(record.images, imgIndex)"
             >
-              <div v-if="imgIndex === 2 &&record.images.length > 3" class="flex-center">
-                +{{ record.images.length - 3 }}
-              </div>
+          
             </div>
           </div>
         </div>
       </div>
 
-     
+      <!--高阶思维评估-->
+      <div class="pr-evaluate">
+        <img :src="getImageUrl('evaluate_logo')" alt="" class="pr-evaluate-logo" />
+        <div v-for="(item, index) in question!.babyResults" :key="index">
+            <div class="pr-evaluate-target" :style="getTargetStyle(index)">
+              <div class="object">
+                <div class="label_triangle"></div>
+                <div class="object-label">记录对象：</div>
+                <div class="object-text">{{item.babyName}}</div>
+              </div>
+              <div class="target" v-for="learn in item.list" >
+                <div class="target-title">
+                  <div class="target-title-dot"></div>
+                  <div class="target-title-text">{{learn.learnDepth}}({{getStateage(learn.levelCode) }})</div>
+                </div>
+                <div class="target-content">{{learn.levelText}}。</div>
+              </div>
+            </div>
+            <div
+              v-if="index !== 3"
+              class="pr-evaluate-gap"
+              :style="{ backgroundImage: `url(${getImageUrl('evaluate_gap')})` }"
+            >
+            </div>
+        </div>
+      </div>
     </div>
+    </span>
+
+
+
+
+
+
+  
   </div>
 </template>
 
@@ -208,8 +211,8 @@ onMounted(async () => {
       position: absolute;
       top: 27px;
       left: 17px;
-      width: 200px;
-      height: 54px;
+      width: 243px;
+      height: 58px;
     }
 
     &-logo {
@@ -221,14 +224,19 @@ onMounted(async () => {
     }
   }
 
+
+  &-topic {
+    font-size: 20px;
+    font-weight: bold;
+    padding: 0px 16px;
+    padding-top: 32px;
+    color: #1A2C5E;
+  }
+
   &-info {
     padding: 20px 12px;
-    margin: 0 auto 32px;
+    padding-bottom: 0px;
     width: 343px;
-    box-shadow: 0 1px 6px 0 rgba(42, 105, 253, 0.16);
-    border-radius: 17px 17px 17px 17px;
-    border: 4px solid #b6dcff;
-
     &-line {
       display: flex;
       //align-items: center;
@@ -272,16 +280,19 @@ onMounted(async () => {
     }
   }
 
+  &-bg {
+    font-size: 16px;
+    padding: 16px 16px;
+    color: #1A2C5E;
+  }
+
   &-evaluate {
     display: flex;
     flex-direction: column;
     align-items: center;
-    padding: 24px 0;
-    margin: 0 auto 32px;
-    width: 343px;
+    margin: 32px auto 32px;
+   
     background: #ffffff;
-    box-shadow: 0 1px 6px 0 rgba(42, 105, 253, 0.16);
-    border: 4px solid #b6dcff;
     border-radius: 17px;
 
     &-logo {
@@ -512,7 +523,7 @@ onMounted(async () => {
           background-size: cover;
           background-position: center center;
           overflow: hidden;
-
+          margin-bottom: 7px;
           > div {
             width: 100%;
             height: 100%;

src/views/customize/SemesterReport.vue

@@ -1,10 +1,9 @@
 <script setup lang="ts">
-import { getImageUrl, imagePreview, limitLength, returnAppPage } from "@/utils";
+import { getImageUrl, imagePreview, returnAppPage } from "@/utils";
 import { useRoute, useRouter } from "vue-router";
 import { useCustomizeStore } from "@/store";
 // import { storeToRefs } from "pinia";
 import { computed, onMounted, onUnmounted, ref, watch } from "vue";
-import { formatClassLevelCode, formatSemesterType } from "@/utils/filter";
 import ShareModal from "@/views/customize/components/ShareModal.vue";
 
 const {
@@ -188,10 +187,10 @@ onUnmounted(() => {
     <div class="rd-more" @click="isShow = true">
       <img :src="getImageUrl('more')" alt="" class="rd-more-img" />
     </div>
-    <div class="rd-bgc"></div>
+    <!-- <div class="rd-bgc"></div> -->
 
     <!--信息-->
-    <div class="rd-info" :style="{ backgroundImage: `url(${getImageUrl('detail_info')})` }">
+    <!-- <div class="rd-info" :style="{ backgroundImage: `url(${getImageUrl('detail_info')})` }">
       <img :src="semesterReport.babyHeadImg" alt="" class="rd-info-avatar" />
       <div class="rd-info-name" :style="{ backgroundImage: `url(${getImageUrl('detail_name')})` }">
         {{ limitLength(semesterReport.babyName) }}
@@ -202,11 +201,51 @@ onUnmounted(() => {
         <span>评估时段</span>
         <span> {{ semesterReport.startDate }}-{{ semesterReport.endDate }} </span>
       </div>
-    </div>
+    </div> -->
+
+    <!-- 个人信息 -->
+
+    <div class="rd-info" :style="{ backgroundImage: `url(${getImageUrl('semester-bg')})`, backgroundColor: '#fff' }" >
+      <div class="rd-info-cover" :style="{ backgroundImage: `url(${getImageUrl('cover')})`}"></div>
+      <div class="rd-info-bg" :style="{ backgroundImage: `url(${getImageUrl('baby-cover')})`}">
+
+          <img class="rd-info-bg-headImg"  :src="semesterReport.babyHeadImg" />
+          <div class="rd-info-bg-info">
+            <div class="rd-info-bg-info-name">姓名：{{semesterReport.babyName}}</div>
+            <div class="rd-info-bg-info-class">班级：{{semesterReport.className}}</div>
+            <div class="rd-info-bg-info-stage">成长阶段：{{semesterReport.startDate}}-{{semesterReport.endDate}}</div>
+          </div>
+      </div>
+    </div>  
+
+    <!-- 宝贝信息 -->
+    <div class="rd-baby"  >
+      <div class="rd-baby-info" :style="{ backgroundImage: `url(${getImageUrl('baby-title')})`}" >
+        <div class="rd-baby-info-name" >{{semesterReport.babyName}}</div>
+        <div class="rd-baby-info-age" >{{semesterReport.age}}</div>
+      </div>
+      <div class="rd-baby-school"  :style="{ backgroundImage: `url(${getImageUrl('school')})`}" >
+        <div>{{semesterReport.schoolName  }}</div>
+        <div>{{semesterReport.className  }}</div>
+      </div>
+      <div class="rd-baby-hobby"   :style="{ backgroundImage: `url(${getImageUrl('hobby')})`}" >
+        {{ semesterReport.hobby.slice(0, 4).join('、')}}
+      </div>
+      <div class="rd-baby-teacher" :style="{ backgroundImage: `url(${getImageUrl('teacher')})`}" >
+        <div v-if="semesterReport.teachers.length > 1">{{semesterReport.teachers[0]}}</div>
+        <div v-if="semesterReport.teachers.length > 2">{{semesterReport.teachers[1]}}</div>
+      </div>
+      
+      <img class="rd-baby-icon" :src="getImageUrl('baby-icon')" alt="">
 
+    </div>
     <!--学习维度-->
     <div class="rd-dimension grid_bgi" v-if="semesterReport.learnDepthList && semesterReport.learnDepthList.length > 0">
-      <img :src="getImageUrl('dimension_logo')" alt="" class="rd-dimension-logo" />
+      <!-- <img :src="getImageUrl('dimension_logo')" alt="" class="rd-dimension-logo" /> -->
+      <div class="rd-field-title" :style="{ backgroundImage: `url(${getImageUrl('field_title')})`,marginLeft: '10px' }">
+        <p>高阶思维评估概括</p>
+        <div></div>
+      </div>
       <div class="rd-dimension-list">
         <div v-for="item in semesterReport.learnDepthList" :key="item" class="dimension">{{item}}</div>
       </div>
@@ -215,7 +254,7 @@ onUnmounted(() => {
     <!--幼儿分领域评估概括-->
     <div class="rd-field grid_bgi" v-if="semesterReport.domainAbilityNameList && semesterReport.domainAbilityNameList.length > 0">
       <div class="rd-field-title" :style="{ backgroundImage: `url(${getImageUrl('field_title')})` }">
-        <p>{{ formatClassLevelCode(classLevelCode) }}幼儿分领域评估概括</p>
+        <p>幼儿分领域评估概括</p>
         <div></div>
       </div>
       <div v-for="(item, index) in semesterReport.domainAbilityNameList" :key="index" class="rd-field-item">
@@ -234,88 +273,114 @@ onUnmounted(() => {
       </div>
     </div>
 
-    <div class="rd-logo" v-if="semesterReport.babyLearnDepthList && semesterReport.babyLearnDepthList.length > 0" >
+
+
+    <!--高阶思维评估-->
+
+    <div class="rd-logo"  >
       <img :src="getImageUrl('semester_record_logo')" alt="" class="rd-logo-img" />
-      <div class="rd-logo-text">问题记录</div>
+      <div class="rd-logo-text">问题探究</div>
     </div>
 
-    <!--高阶思维评估-->
-    <div class="rd-evaluate" v-if="semesterReport.babyLearnDepthList && semesterReport.babyLearnDepthList.length > 0">
-      <img :src="getImageUrl('evaluate_logo')" alt="" class="rd-evaluate-logo" />
-      <div v-for="(item, index) in semesterReport.babyLearnDepthList" :key="index">
-        <div class="rd-evaluate-target" :style="getTargetStyle(index)">
-          <div class="object">
-            <div class="label_triangle"></div>
-            <div class="object-label">记录对象：</div>
-            <div class="object-text">{{item.babyName}}</div>
-          </div>
-          <div class="target" v-for="learn in item.list" >
-            <div class="target-title">
-              <div class="target-title-dot"></div>
-              <div class="target-title-text">{{learn.learnDepth}}（{{getStateage(learn.levelCode)}}</div>
+
+    <div 
+      style="background-color: #fff; width: 92.8vw;margin: 0 auto;border-radius: 17px;margin-top: 10px;padding-bottom: 1vw;"  
+      v-for="(re, index) in semesterReport!.questionList" :key="index"
+    >
+
+      <div class="rd-ques" >
+        <div class="rd-ques-topic" > {{re.topic}} </div>
+          <div class="rd-ques-teacher">
+            <div class="rd-ques-teacher-line">
+              <div class="label">
+                <div class="label_triangle"></div>
+                <div class="label-text">记录教师：</div>
+              </div>
+              <div class="value">{{re.teacherName}}</div>
             </div>
-            <div class="target-content">{{learn.levelText}}</div>
           </div>
-        </div>
-        <div
-          v-if="index !== 3"
-          class="rd-evaluate-gap"
-          :style="{ backgroundImage: `url(${getImageUrl('evaluate_gap')})` }"
-        ></div>
-      </div>
-    </div>
 
-    <div class="rd-content" v-for="(item, index) in semesterReport!.questionList">
-      <div class="rd-content-line">
-        <div class="label_triangle"></div>
-        <div class="label">记录日期：</div>
-        <div class="value">{{item.recordDate}}</div>
-      </div>
-      <div class="rd-content-line">
-        <div class="label_triangle"></div>
-        <div class="label">层次：</div>
-        <div class="value">{{item.questionCategory}}</div>
+        <div class="rd-ques-bg" > {{re.background}} </div>
       </div>
-      <div class="rd-content-line">
-        <div class="label_triangle"></div>
-        <div class="label">活动形式：</div>
-        <div class="value">{{item.activityCategories.join(',')}}</div>
-      </div>
-      <img :src="getImageUrl('content_question_logo')" alt="" class="rd-content-logo" />
-      <div class="rd-content-question">
-        <div class="title flex-center">问题{{index}}</div>
-        <div class="content">{{item.question}}</div>
-      </div>
-      <img :src="getImageUrl('inquiry_process_logo')" alt="" class="rd-content-logo" />
-      <div class="rd-content-process">
-        <div class="process" v-for="(record, index) in [item.plan, item.practice, item.summary, item.tweaks]">
-          <div class="process-title">
-            <div class="process-title-dot"></div>
-            <div class="process-title-text">{{getLabel(index)}}</div>
-          </div>
-          <div class="process-content">{{record.content}}</div>
-          <div class="process-content-video"  v-if="record.videos.length > 0">
-            <video
-              :src="record.videos[0]"
-              controls
-              :poster="record.videos[0] + '?vframe/jpg/offset/1'"
-              class="video"
-              @click.stop
-            ></video>
+      
+
+      <div class="rd-content" v-for="(item, index) in re!.questions">
+        <div class="rd-content-line">
+          <div class="label_triangle"></div>
+          <div class="label">记录日期：</div>
+          <div class="value">{{item.recordDate}}</div>
+        </div>
+        <div class="rd-content-line">
+          <div class="label_triangle"></div>
+          <div class="label">层次：</div>
+          <div class="value">{{item.questionCategory}}</div>
+        </div>
+        <div class="rd-content-line">
+          <div class="label_triangle"></div>
+          <div class="label">活动形式：</div>
+          <div class="value">{{item.activityCategories && item.activityCategories.join('、') }}</div>
+        </div>
+        <img :src="getImageUrl('content_question_logo')" alt="" class="rd-content-logo" />
+        <div class="rd-content-question">
+          <div class="title flex-center">问题{{index + 1}}</div>
+          <div class="content">{{item.question}}</div>
+        </div>
+        <img :src="getImageUrl('inquiry_process_logo')" alt="" class="rd-content-logo" />
+        <div class="rd-content-process">
+          <div class="process" v-for="(record, index) in [item.plan, item.practice, item.summary, item.tweaks]">
+            <div class="process-title">
+              <div class="process-title-dot"></div>
+              <div class="process-title-text">{{getLabel(index)}}</div>
+            </div>
+            <div class="process-content">{{record.content}}</div>
+            <div class="process-content-video"  v-if="record.videos.length > 0">
+              <video
+                :src="record.videos[0]"
+                controls
+                :poster="record.videos[0] + '?vframe/jpg/offset/1'"
+                class="video"
+                @click.stop
+              ></video>
+            </div>
+            <div class="pr-content-images">
+              <div
+                v-for="(img, imgIndex) in record.images"
+                :key="imgIndex"
+                :style="{
+                  backgroundImage: `url(${img})`,
+                }"
+                @click.stop="imagePreview(record.images, imgIndex)"
+              >
+                <!-- <div v-if="imgIndex === 2 &&record.images.length > 3" class="flex-center">
+                  +{{ record.images.length - 3 }}
+                </div> -->
+              </div>
+            </div>
           </div>
-          <div class="pr-content-images">
-            <div
-              v-for="(img, imgIndex) in record.images.slice(0, 3)"
-              :key="imgIndex"
-              :style="{
-                backgroundImage: `url(${img})`,
-              }"
-              @click.stop="imagePreview(record.images, imgIndex)"
-            >
-              <div v-if="imgIndex === 2 &&record.images.length > 3" class="flex-center">
-                +{{ record.images.length - 3 }}
+        </div>
+        <!--高阶思维评估-->
+        <div class="rd-evaluate" >
+          <img :src="getImageUrl('evaluate_logo')" alt="" class="rd-evaluate-logo" />
+          <div v-for="(baby, index) in item.babyResults" :key="index">
+            <div class="rd-evaluate-target" :style="getTargetStyle(index)">
+              <div class="object">
+                <div class="label_triangle"></div>
+                <div class="object-label">记录对象：</div>
+                <div class="object-text">{{baby.babyName}}</div>
+              </div>
+              <div class="target" v-for="learn in baby.list" >
+                <div class="target-title">
+                  <div class="target-title-dot"></div>
+                  <div class="target-title-text">{{learn.learnDepth}}（{{getStateage(learn.levelCode)}}）</div>
+                </div>
+                <div class="target-content">{{learn.levelText}}</div>
               </div>
             </div>
+            <div
+              v-if="index !== 3"
+              class="rd-evaluate-gap"
+              :style="{ backgroundImage: `url(${getImageUrl('evaluate_gap')})` }"
+            ></div>
           </div>
         </div>
       </div>
@@ -391,7 +456,7 @@ onUnmounted(() => {
 <style scoped lang="scss">
 .rd {
   position: relative;
-  padding-top: 104px;
+  // padding-top: 104px;
   padding-bottom: 46px;
   width: 100vw;
   min-height: 100vh;
@@ -472,81 +537,214 @@ onUnmounted(() => {
   }
 
   &-info {
-    //padding-top: 98px;
+    width: 100vw;
+    height: 812px;
+    background-color: #fff;
+    background-size: 100% 100%;
     position: relative;
-    width: 100%;
-    height: 210px;
-    background-size: contain;
-
-    &-avatar {
-      position: relative;
-      top: -41px;
-      margin: 0 auto 0;
-      width: 60px;
-      height: 60px;
-      border: 8px solid #ffe082;
-      background-color: #fff;
-      border-radius: 50%;
-      box-sizing: content-box;
-      object-fit: cover;
+    &-cover {
+      position: absolute;
+      top: 98px;
+      left: 50%;
+      transform: translateX(-50%);
+      width: 307px;
+      height: 192px;
+      background-size: 100% 100%;
     }
-
-    &-name {
-      position: relative;
-      z-index: 2;
-      margin: -52px auto 54px;
-      width: 101px;
-      height: 30px;
-      line-height: 30px;
-      background-size: auto 100%;
-      background-repeat: no-repeat;
-      background-position: center center;
-      text-align: center;
-      font-size: 14px;
-      font-family:
-        PingFang SC-Regular,
-        PingFang SC;
-      font-weight: 600;
-      color: #ffffff;
-      @include single-hide();
+    &-bg {
+      width: 228px;
+      height: 358px;
+      background-size: 100% 100%;
+      position: absolute;
+      top: 316px;
+      left: 50%;
+      transform: translateX(-50%);
+      &-headImg {
+        width: 174px;
+        height: 180px;
+        object-fit: cover;
+        border-radius: 10px;
+        position: absolute;
+        top: 65px;
+        left: 50%;
+        transform: translateX(-50%);
+      }
+      &-info {
+        width: 100%;
+        position: absolute;
+        top: 245px;
+        left: 50%;
+        transform: translateX(-50%);
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        color: #2A69FD;
+        font-size: 14px;
+        font-family: Alibaba PuHuiTi 2.0, Alibaba PuHuiTi 20;
+        font-weight: 300;
+        &-name {
+          font-size: 16px;
+          font-family: Alibaba PuHuiTi 2.0, Alibaba PuHuiTi 20;
+          font-weight: 300;
+        }
+        &-class {
+      
+        }
+      }
     }
+  }
 
-    &-garden,
-    &-class {
-      height: 20px;
-      font-size: 12px;
-      font-family:
-        PingFang SC-Regular,
-        PingFang SC;
+
+  &-baby {
+    width: 100vw;
+    height: 812px;
+    background-color: #fff;
+    background-size: 100% 100%;
+    position: relative;
+    font-family: Alibaba PuHuiTi 2.0;
+    font-size: 16px;
+    font-weight: 300;
+    color: #1228B9;
+
+    &-info {
+      width: 177px;
+      height: 88px;
+      position: absolute;
+      top: 114px;
+      left: 34px;
+      font-size: 18px;
+      font-family: Alibaba PuHuiTi 2.0, Alibaba PuHuiTi 20;
       font-weight: 400;
-      color: #ffffff;
-      line-height: 20px;
-      text-align: center;
-      white-space: nowrap;
+      color: #2A69FD;
+      padding-left: 50px;
+      padding-top: 10px;
+      background-size: 100% 100%;
+    }
+    &-school {
+      width: 205px;
+      height: 136px;
+      position: absolute;
+      top: 244px;
+      left: 33px;
+      background-size: 100% 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      flex-direction: column;
+      padding-top: 16px;
+    }
+    &-hobby {
+      width: 196px;
+      height: 123px;
+      position: absolute;
+      top: 364px;
+      right: 19px;
+      background-size: 100% 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      flex-direction: column;
+      padding-top: 16px;
+    }
+    &-teacher {
+      width: 171px;
+      height: 139px;
+      position: absolute;
+      top: 493px;
+      left: 45px;
+      background-size: 100% 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      flex-direction: column;
+      padding-top: 16px;
     }
 
-    &-time {
-      margin-top: 2px;
-      text-align: center;
-
-      span {
-        height: 24px;
-        font-size: 12px;
-        font-family:
-          PingFang SC-Regular,
-          PingFang SC;
-        font-weight: 400;
-        color: #ffffff;
-        line-height: 24px;
-      }
-
-      span:nth-child(2) {
-        margin-left: 14px;
-        margin-right: 40px;
-      }
+    &-icon {
+      width: 159px;
+      height: 106px;
+      position: absolute;
+      right: 14px;
+      bottom: 31px;
     }
+
   }
 
+  // &-info {
+  //   position: relative;
+  //   width: 100%;
+  //   height: 210px;
+  //   background-size: contain;
+
+  //   &-avatar {
+  //     position: relative;
+  //     top: -41px;
+  //     margin: 0 auto 0;
+  //     width: 60px;
+  //     height: 60px;
+  //     border: 8px solid #ffe082;
+  //     background-color: #fff;
+  //     border-radius: 50%;
+  //     box-sizing: content-box;
+  //     object-fit: cover;
+  //   }
+
+  //   &-name {
+  //     position: relative;
+  //     z-index: 2;
+  //     margin: -52px auto 54px;
+  //     width: 101px;
+  //     height: 30px;
+  //     line-height: 30px;
+  //     background-size: auto 100%;
+  //     background-repeat: no-repeat;
+  //     background-position: center center;
+  //     text-align: center;
+  //     font-size: 14px;
+  //     font-family:
+  //       PingFang SC-Regular,
+  //       PingFang SC;
+  //     font-weight: 600;
+  //     color: #ffffff;
+  //     @include single-hide();
+  //   }
+
+  //   &-garden,
+  //   &-class {
+  //     height: 20px;
+  //     font-size: 12px;
+  //     font-family:
+  //       PingFang SC-Regular,
+  //       PingFang SC;
+  //     font-weight: 400;
+  //     color: #ffffff;
+  //     line-height: 20px;
+  //     text-align: center;
+  //     white-space: nowrap;
+  //   }
+
+  //   &-time {
+  //     margin-top: 2px;
+  //     text-align: center;
+
+  //     span {
+  //       height: 24px;
+  //       font-size: 12px;
+  //       font-family:
+  //         PingFang SC-Regular,
+  //         PingFang SC;
+  //       font-weight: 400;
+  //       color: #ffffff;
+  //       line-height: 24px;
+  //     }
+
+  //     span:nth-child(2) {
+  //       margin-left: 14px;
+  //       margin-right: 40px;
+  //     }
+  //   }
+  // }
+
   &-dimension {
     padding: 24px 0 20px 4px;
     margin: 24px auto 0;
@@ -681,13 +879,8 @@ onUnmounted(() => {
     flex-direction: column;
     align-items: center;
     padding: 24px 0;
-    margin: 24px auto 32px;
-    width: 343px;
     background: #ffffff;
-    box-shadow: 0 1px 6px 0 rgba(42, 105, 253, 0.16);
-    border: 4px solid #b6dcff;
     border-radius: 17px;
-
     &-logo {
       width: 311px;
       height: 68px;
@@ -774,6 +967,65 @@ onUnmounted(() => {
     }
   }
 
+  &-ques-topic {
+    font-size: 20px;
+    font-weight: bold;
+    padding: 0px 16px;
+    padding-top: 32px;
+    color: #1A2C5E;
+  }
+
+  &-ques-teacher {
+    padding: 20px 12px;
+    padding-bottom: 0px;
+    width: 343px;
+    &-line {
+      display: flex;
+      .label {
+        display: flex;
+        align-items: center;
+        height: 20px;
+
+        &-triangle {
+          //margin-top: 4px;
+          margin-right: 8px;
+          width: 0;
+          height: 0;
+          border-left: 8px solid #2a69fd;
+          border-top: 5px solid transparent;
+          border-bottom: 5px solid transparent;
+          border-radius: 2px;
+        }
+
+        &-text {
+          line-height: 20px;
+          height: 20px;
+          color: #2a69fd;
+          font-weight: 600;
+          font-size: 14px;
+          white-space: nowrap;
+        }
+      }
+
+      .value {
+        flex: 1;
+        color: #333;
+        font-weight: 500;
+        font-size: 14px;
+      }
+    }
+
+    &-line + &-line {
+      margin-top: 16px;
+    }
+  }
+
+  &-ques-bg {
+    font-size: 16px;
+    padding: 16px 16px;
+    color: #1A2C5E;
+  }
+
   &-content {
     padding: 24px 16px;
     margin: 0 auto 32px;
@@ -920,7 +1172,7 @@ onUnmounted(() => {
           background-size: cover;
           background-position: center center;
           overflow: hidden;
-
+          margin-bottom: 7px;
           > div {
             width: 100%;
             height: 100%;
@@ -936,6 +1188,102 @@ onUnmounted(() => {
         }
       }
     }
+
+
+    &-evaluate {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin: 32px auto 32px;
+    background: #ffffff;
+    border-radius: 17px;
+
+    &-logo {
+      width: 320px;
+      height: 68px;
+      display: block;
+    }
+
+    &-target {
+      padding: 16px 0;
+      width: 311px;
+      background: #ecf9ff;
+      border-radius: 0 0 9px 9px;
+      .object {
+        display: flex;
+        align-items: center;
+        margin-left: 16px;
+
+        &-label {
+          margin-right: 4px;
+          height: 20px;
+          font-size: 14px;
+          font-family: PingFang SC;
+          font-weight: 500;
+          color: #2a69fd;
+          line-height: 20px;
+        }
+
+        &-text {
+          font-size: 14px;
+          font-family:
+            PingFang SC,
+            PingFang SC;
+          font-weight: 400;
+          color: #1a2c5e;
+        }
+      }
+
+      .target {
+        margin-top: 20px;
+
+        &-title {
+          display: flex;
+          align-items: center;
+          margin-left: 16px;
+          margin-bottom: 8px;
+
+          &-dot {
+            margin-right: 8px;
+            width: 6px;
+            height: 6px;
+            background: #2a69fd;
+            border-radius: 50%;
+          }
+
+          &-text {
+            font-size: 14px;
+            font-family:
+              PingFang SC,
+              PingFang SC;
+            font-weight: 600;
+            color: #1a2c5e;
+          }
+        }
+
+        &-content {
+          margin-left: 30px;
+          width: 265px;
+          font-size: 14px;
+          font-family:
+            PingFang SC,
+            PingFang SC;
+          font-weight: 400;
+          color: #1a2c5e;
+        }
+      }
+    }
+
+    &-gap {
+      width: 311px;
+      height: 24px;
+      background-color: #ecf9ff;
+      background-repeat: no-repeat;
+      background-size: 100% 100%;
+    }
+    }
+
+
   }
 
   &-logo {

src/views/customize/components/ShareModal.vue

@@ -37,8 +37,8 @@ const props = withDefaults(
 const show = computed(() => props.show);
 
 function jump(id: 0 | 1) {
-  const image = getImageUrl("single_logo");
-  const description = "";
+  const image = getImageUrl("openAppLogo");
+  const description = "深度学习单词报告";
   const url = window.location.href;
 
   if (typeof title === "string") shareToWechat(image, title, id, description, url);