关联分析：等距、频数图标

src/features/projectCompareDetail/ScoreRateCompare.vue

@@ -10,16 +10,35 @@
         <a-select-option :value="20">20</a-select-option>
         <a-select-option :value="50">50</a-select-option>
       </a-select>
+      <div style="flex-grow: 1; height: 300px">
+        <v-chart
+          v-if="courses.length >= 2"
+          class="chart"
+          :option="segementsLine()"
+          :autoresize="true"
+        />
+        <div
+          v-if="courses.length >= 2"
+          class="tw-text-lg tw-font-bold tw-text-center -tw-mt-8"
+          style="color: #4a4a4a"
+        >
+          {{ courses[0].courseName }}科目成绩（总分）等距（{{
+            scoreGap
+          }}分）分组频数分布对比分析
+        </div>
+      </div>
+
       <div class="tw-mt-4"></div>
-      <!-- <div style="flex-grow: 1">
-      <v-chart
-                class="chart"
-                :option="rangeSegementsLine(course)"
-                :autoresize="true"
-              />
-            </div> -->
+      <div style="flex-grow: 1; height: 300px">
+        <v-chart
+          v-if="hasRangeSegementsComparison"
+          class="chart"
+          :option="rangeSegementsLine()"
+          :autoresize="true"
+        />
+      </div>
 
-      <div>
+      <div class="tw-mt-4">
         <table v-if="hasFirstTryComparison" class="custom-table">
           <tr>
             <th rowspan="2">初试总分分数段</th>
@@ -64,6 +83,14 @@
             </template>
           </tr>
         </table>
+
+        <div
+          v-if="hasFirstTryComparison"
+          class="tw-text-lg tw-font-bold tw-text-center tw-mt-2"
+          style="color: #4a4a4a"
+        >
+          {{ courses[0].courseName }}科目成绩占初试总分权重对比分析
+        </div>
       </div>
     </div>
   </div>
@@ -140,88 +167,22 @@ async function fetchData() {
   courses = res.data;
 }
 
-// const segementsLine = computed(() => {
-//   // console.log(data, data.length);
-//   if (courses.length === 0) return;
-//   return {
-//     tooltip: {
-//       trigger: "axis",
-//       axisPointer: {
-//         type: "shadow",
-//       },
-//     },
-//     title: {
-//       text: courses[0].courseName + "试卷特征量数对比分析",
-//       left: "50%",
-//       textAlign: "center",
-//       bottom: "0px",
-//     },
-//     xAxis: {
-//       type: "category",
-//       data: columns.map((v) => v.title),
-//     },
-//     yAxis: {
-//       type: "value",
-//     },
-//     series: [
-//       {
-//         type: "bar",
-//         stack: "x",
-//         // eslint-disable-next-line @typescript-eslint/no-unsafe-return
-//         data: columns.map((v) => courses[0][v.dataIndex]),
-//       },
-//       {
-//         type: "bar",
-//         stack: "y",
-//         // eslint-disable-next-line @typescript-eslint/no-unsafe-return
-//         data: columns.map((v) => courses[1][v.dataIndex]),
-//       },
-//     ],
-//   } as EChartsOption;
-// });
-
-const columns = [
-  {
-    title: "满分",
-    dataIndex: "totalScore",
-  },
-  {
-    title: "最高分",
-    dataIndex: "maxScore",
-  },
-  {
-    title: "最低分",
-    dataIndex: "minScore",
-  },
-  {
-    title: "全距",
-    dataIndex: "allRange",
-  },
-  {
-    title: "平均分",
-    dataIndex: "avgScore",
-  },
-  {
-    title: "标准差",
-    dataIndex: "stdev",
-  },
-  {
-    title: "差异系数",
-    dataIndex: "coefficient",
-  },
-  {
-    title: "信度1",
-    dataIndex: "reliability1",
-  },
-  {
-    title: "信度2",
-    dataIndex: "reliability2",
-  },
-  {
-    title: "难度",
-    dataIndex: "difficulty",
-  },
-];
+function segementsLine() {
+  return {
+    xAxis: {
+      type: "category",
+      data: courses[0].segements.map((v) => v[0]),
+    },
+    yAxis: {
+      type: "value",
+    },
+    series: courses.map((course) => ({
+      data: course.segements.map((v) => v[2]),
+      type: "line",
+      smooth: true,
+    })),
+  } as EChartsOption;
+}
 
 onMounted(fetchData);
 
@@ -298,13 +259,6 @@ watch(
   }
 );
 
-// let scores = [];
-// const scoreComputed = computed(() => {
-//   const s = {};
-//   // data[0].scoreRange =
-//   // scores.push()
-// });
-
 function scoreTitle(rangeConfig: RangeConfig) {
   if (!rangeConfig) return false;
   if (rangeConfig.type === "ZERO") return "0-";
@@ -314,53 +268,44 @@ function scoreTitle(rangeConfig: RangeConfig) {
   }${rangeConfig.adjustScore > 0 ? "+" : ""}${rangeConfig.adjustScore})-`;
 }
 
-function segementsLine(course: SasCourse) {
-  console.log(course);
+function rangeSegementsLine() {
+  console.log(courses);
+  if (courses.length < 2) return;
   return {
     title: {
-      text: "频率",
-      left: "left",
+      text: courses[0].courseName + "科目分数线分组的频数分布对比分析",
+      left: "50%",
+      // right: "center",
+      // right: "50%",
+      // textStyle: {
+      //   width: "100%",
+      // },
+      textAlign: "center",
+      bottom: "0px",
     },
     xAxis: {
       type: "category",
-      data: course.segements.map((v) => v[0]),
+      data: courses[0].rangeSegements.map((v) => v[0]),
     },
     yAxis: {
       type: "value",
     },
-    series: [
-      {
-        data: course.segements.map((v) => v[1]),
-        type: "line",
-        smooth: true,
-      },
-    ],
+    series: courses.map((course) => ({
+      data: course.rangeSegements.map((v) => v[1]),
+      type: "line",
+      smooth: true,
+    })),
   } as EChartsOption;
 }
 
-function rangeSegementsLine(course: SasCourse) {
-  console.log(course);
-  return {
-    title: {
-      text: "频率",
-      left: "left",
-    },
-    xAxis: {
-      type: "category",
-      data: course.rangeSegements.map((v) => v[0]),
-    },
-    yAxis: {
-      type: "value",
-    },
-    series: [
-      {
-        data: course.rangeSegements.map((v) => v[1]),
-        type: "line",
-        smooth: true,
-      },
-    ],
-  } as EChartsOption;
-}
+const hasRangeSegementsComparison = $computed(() => {
+  const r = courses
+    .filter((c) => c.rangeConfig)
+    .map((c) => JSON.stringify(c.rangeConfig));
+
+  const s = new Set(r);
+  return r.length === courses.length && s.size === 1;
+});
 
 const hasFirstTryComparison = $computed(() => {
   const r = courses