diff --git a/package.json b/package.json
index ecece67..0482887 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
     "@vueuse/core": "9.5.0",
     "axios": "0.27.2",
     "echarts": "5.4.0",
+    "echarts-wordcloud": "2.0.0",
     "element-plus": "2.2.27",
     "file-saver": "2.0.5",
     "fuse.js": "6.6.2",
diff --git a/src/assets/images/01.png b/src/assets/images/01.png
index 96f14f5..e908594 100644
Binary files a/src/assets/images/01.png and b/src/assets/images/01.png differ
diff --git a/src/components/Crontab/hour.vue b/src/components/Crontab/hour.vue
index f9a6374..437b455 100644
--- a/src/components/Crontab/hour.vue
+++ b/src/components/Crontab/hour.vue
@@ -38,7 +38,7 @@ const emit = defineEmits(['update'])
 const props = defineProps({
     cron: {
         type: Object,
-        default: {
+       default: {
             second: "*",
             min: "*",
             hour: "*",
@@ -87,7 +87,7 @@ function changeRadioValue(value) {
     } else if (value.indexOf('/') > -1) {
         const indexArr = value.split('/')
         average01.value = Number(indexArr[0])
-        average02.value = Number(indexArr[1])
+        average01.value = Number(indexArr[1])
         radioValue.value = 3
     } else {
         checkboxList.value = [...new Set(value.split(',').map(item => Number(item)))]
diff --git a/src/directive/common/lazy.js b/src/directive/common/lazy.js
new file mode 100644
index 0000000..99fe78a
--- /dev/null
+++ b/src/directive/common/lazy.js
@@ -0,0 +1,27 @@
+/*
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-08-21 13:43:25
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-21 13:43:48
+ * @FilePath: \vue3\src\directive\common\lazy.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+export default {
+  mounted(el, binding) {
+    const loadIframe = () => {
+      const iframeSrc = binding.value;
+      el.src = iframeSrc;
+    };
+
+    const observer = new IntersectionObserver((entries) => {
+      entries.forEach((entry) => {
+        if (entry.isIntersecting) {
+          loadIframe();
+          observer.unobserve(el);
+        }
+      });
+    });
+
+    observer.observe(el);
+  },
+};
diff --git a/src/directive/index.js b/src/directive/index.js
index b2009ad..992af71 100644
--- a/src/directive/index.js
+++ b/src/directive/index.js
@@ -2,7 +2,7 @@
  * @Author: qinzhenpen qzp1807@126.com
  * @Date: 2024-07-15 15:44:46
  * @LastEditors: qinzhenpen qzp1807@126.com
- * @LastEditTime: 2024-08-20 15:53:35
+ * @LastEditTime: 2024-08-21 13:44:40
  * @FilePath: \vue3\src\directive\index.js
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -10,10 +10,12 @@ import hasRole from './permission/hasRole'
 import hasPermi from './permission/hasPermi'
 import copyText from './common/copyText'
 import debounce from './common/debounce'
+import lazy from './common/lazy'
 
 export default function directive(app){
   app.directive('hasRole', hasRole)
   app.directive('hasPermi', hasPermi)
   app.directive('copyText', copyText)
   app.directive('debounce', debounce)
+  app.directive('lazy', lazy)
 }
\ No newline at end of file
diff --git a/src/permission.js b/src/permission.js
index b098714..54343ef 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -1,3 +1,11 @@
+/*
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-08-16 17:56:32
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-21 13:48:30
+ * @FilePath: \vue3\src\permission.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 import router from './router'
 import { ElMessage } from 'element-plus'
 import NProgress from 'nprogress'
@@ -8,7 +16,7 @@ import { isRelogin } from '@/utils/request'
 import useUserStore from '@/store/modules/user'
 import useSettingsStore from '@/store/modules/settings'
 import usePermissionStore from '@/store/modules/permission'
-
+  
 NProgress.configure({ showSpinner: false });
 
 const whiteList = ['/login', '/register'];
diff --git a/src/views/digitalMarketTech/AIGCLargeModel/components/AIPicture.vue b/src/views/digitalMarketTech/AIGCLargeModel/components/AIPicture.vue
index 9a96117..1e24ab7 100644
--- a/src/views/digitalMarketTech/AIGCLargeModel/components/AIPicture.vue
+++ b/src/views/digitalMarketTech/AIGCLargeModel/components/AIPicture.vue
@@ -147,6 +147,7 @@ const handleChange2 = async (info) => {
   formData.append("userId", JSON.parse(getUserInfo()).userId);
   formData.append("module", "AI修图");
   formData.append("count", 2);
+
   try {
     previewFile2.value = [];
     const res = await uploadFile(formData);
diff --git a/src/views/digitalMarketTech/AIGCLargeModel/components/AIVenisonDiagram.vue b/src/views/digitalMarketTech/AIGCLargeModel/components/AIVenisonDiagram.vue
index 099c957..4b1c2a7 100644
--- a/src/views/digitalMarketTech/AIGCLargeModel/components/AIVenisonDiagram.vue
+++ b/src/views/digitalMarketTech/AIGCLargeModel/components/AIVenisonDiagram.vue
@@ -46,7 +46,7 @@
 </template>
 <script setup>
 import { MdPreview, MdCatalog } from "md-editor-v3";
-import { getToken,getUserInfo } from '@/utils/auth'
+import { getToken, getUserInfo } from "@/utils/auth";
 import useUserStore from "@/store/modules/user";
 import "md-editor-v3/lib/preview.css";
 import * as AI from "@/api/AI.js";
@@ -99,9 +99,9 @@ const sendExample = (item) => {
   input.value = item.text;
   sendText();
 };
-const aiUserid=computed(()=>{
-  return  getUserInfo() ? JSON.parse(getUserInfo()) : "";
-})
+const aiUserid = computed(() => {
+  return getUserInfo() ? JSON.parse(getUserInfo()) : "";
+});
 const sendText = async () => {
   if (input.value.trim() === "" || isRequestPending.value) return;
   if (input.value.trim() === "") return;
@@ -178,7 +178,7 @@ const handleKeyDown = (event) => {
     event.preventDefault();
     sendText();
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/views/digitalMarketTech/AIGCLargeModel/components/thirdPartyAIGC.vue b/src/views/digitalMarketTech/AIGCLargeModel/components/thirdPartyAIGC.vue
index 194bb34..f87328c 100644
--- a/src/views/digitalMarketTech/AIGCLargeModel/components/thirdPartyAIGC.vue
+++ b/src/views/digitalMarketTech/AIGCLargeModel/components/thirdPartyAIGC.vue
@@ -1,23 +1,35 @@
+<!--
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-08-19 09:10:19
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-21 16:24:11
+ * @FilePath: \vue3\src\views\digitalMarketTech\AIGCLargeModel\components\thirdPartyAIGC.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
-  <div class="app-containerO">
-    <iframe src="https://pidoutv.com/" frameborder="0"></iframe>
+  <div class="app-containerO" v-loading="loding">
+    <iframe v-lazy="'https://pidoutv.com/'" src="https://pidoutv.com/" frameborder="0"></iframe>
   </div>
 </template>
-
 <script setup>
-
+const { proxy } = getCurrentInstance();
+const loding = ref(true);
+onMounted(() => {
+  setTimeout(()=>{
+    loding.value = false;
+  },2000)
+});
 </script>
-
 <style scoped lang="scss">
 .app-containerO {
-    margin: 10px;
-    box-shadow: 0px 0px 13px 0px #0452C6;
-    border-radius: 10px;
-    width: 100%;
+  margin: 10px;
+  box-shadow: 0px 0px 13px 0px #0452c6;
+  border-radius: 10px;
+  width: 100%;
   height: 740px;
 }
 iframe {
   width: 100%;
   height: 100%;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/digitalMarketTech/AIGCLargeModel/index.vue b/src/views/digitalMarketTech/AIGCLargeModel/index.vue
index d490ac4..0f23533 100644
--- a/src/views/digitalMarketTech/AIGCLargeModel/index.vue
+++ b/src/views/digitalMarketTech/AIGCLargeModel/index.vue
@@ -1,17 +1,20 @@
+<!--
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-08-20 18:09:46
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-21 09:13:12
+ * @FilePath: \vue3\src\views\digitalMarketTech\AIGCLargeModel\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
   <div class="app-top">
     <el-button v-for="(item, index) in imgData" :key="index" :class="item.img" @click="clickIndx(index)">{{ item.text }}</el-button>
   </div>
-  <component :is="page"></component>
+  <component v-if="page" :is="page"></component>
 </template>
 <script setup>
-import AIVenison from "./components/AIVenisonDiagram.vue";
-import AIWriting from "./components/AIWriting.vue";
-import AIPicture from "./components/AIPicture.vue"
-import AIVideo from "./components/AIVideo.vue"
-import AIGC from "./components/thirdPartyAIGC.vue";
-const pageData = [AIVenison, AIWriting, null, AIPicture, AIVideo, AIGC];
-const page = ref(AIVenison);
+const pageData = [defineAsyncComponent(() => import("./components/AIVenisonDiagram.vue")), defineAsyncComponent(() => import("./components/AIWriting.vue")), defineAsyncComponent(() => import("./components/AIPicture.vue")), defineAsyncComponent(() => import("./components/AIVideo.vue")), defineAsyncComponent(() => import("./components/thirdPartyAIGC.vue"))];
+const page = ref(pageData[0]);
 const clickIndx = (index) => {
   page.value = pageData[index];
 };
@@ -24,10 +27,6 @@ const imgData = [
     text: "AI写作",
     img: "wz",
   },
-  {
-    text: "AI标题",
-    img: "bt",
-  },
   {
     text: "AI修图",
     img: "xt",
@@ -36,6 +35,10 @@ const imgData = [
     text: "AI视频",
     img: "sp",
   },
+  {
+    text: "第三方AIGC大模型",
+    img: "dmx",
+  },
 ];
 </script>
 
diff --git a/src/views/digitalMarketTech/artificialIntelligence/index.vue b/src/views/digitalMarketTech/artificialIntelligence/index.vue
index 4fa3ac2..ac91ef4 100644
--- a/src/views/digitalMarketTech/artificialIntelligence/index.vue
+++ b/src/views/digitalMarketTech/artificialIntelligence/index.vue
@@ -1,19 +1,27 @@
+<!--
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-08-16 17:56:32
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-21 11:17:00
+ * @FilePath: \vue3\src\views\digitalMarketTech\artificialIntelligence\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
-    <div class="app-top">
-       <el-button v-for="(item,index) in imgData" :key="index" :class="item.img" @click="clickIndx(index)">{{item.text}}</el-button>
+   <div class="app-top">
+      <el-button v-for="(item,index) in imgData" :key="index" :class="item.img" @click="clickIndx(index)">{{item.text}}</el-button>
    </div>
- <component :is="page"></component>
+ <component v-if="page" :is="page"></component>
 </template>
-
 <script setup>
-import face from './components/face-recognition.vue'
-import article from './components/article-identification.vue'
-import recognition from './components/Image-recognition.vue'
-import voice from './components/voice-technology.vue'
-import Naturall from './components/Naturallanguageprocessing.vue'
-import Robot from './components/Robot-learning.vue'
-const pageData=[recognition,article,face,voice,Naturall,Robot]
-const page=ref(recognition)
+const pageData = [
+  defineAsyncComponent(() => import('./components/Image-recognition.vue')),
+  defineAsyncComponent(() => import('./components/article-identification.vue')),
+  defineAsyncComponent(() => import('./components/face-recognition.vue')),
+  defineAsyncComponent(() => import('./components/voice-technology.vue')),
+  defineAsyncComponent(() => import('./components/Naturallanguageprocessing.vue')),
+  defineAsyncComponent(() => import('./components/Robot-learning.vue')),
+];
+const page=ref(pageData[0])
 const clickIndx=(index)=>{
    page.value=pageData[index]
 }
diff --git a/src/views/digitalMarketTech/bigData/index.vue b/src/views/digitalMarketTech/bigData/index.vue
index 53ff358..2ac3b5c 100644
--- a/src/views/digitalMarketTech/bigData/index.vue
+++ b/src/views/digitalMarketTech/bigData/index.vue
@@ -1,76 +1,82 @@
+<!--
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-08-16 17:56:32
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-21 13:18:12
+ * @FilePath: \vue3\src\views\digitalMarketTech\bigData\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
-    <div class="app-top">
-       <el-button v-for="(item,index) in imgData" :key="index" :class="item.img" @click="clickIndx(index)">{{item.text}}</el-button>
-   </div>
- <component :is="page"></component>
+  <div class="app-top">
+    <el-button v-for="(item, index) in imgData" :key="index" :class="item.img" @click="clickIndx(index)">{{ item.text }}</el-button>
+  </div>
+  <component v-if="page" :is="page"></component>
 </template>
 
 <script setup>
-import AIVenison from './components/whatBigData.vue'
-import technology from './components/technologyFramework.vue'
-import hadoop from './components/hadoop.vue'
-import HDFS from './components/HadoopHDFS.vue'
-import Marketing from './components/digitalMarketing.vue'
-const pageData=[AIVenison,technology,hadoop,HDFS,Marketing]
-const page=ref(AIVenison)
-const clickIndx=(index)=>{
-   page.value=pageData[index]
-}
-const imgData=[
-   {
-       text:'什么是大数据',
-       img:'wst'
-   },{
-       text:'大数据技术框架',
-       img:'wz'
-   },{
-       text:'HADOOP',
-       img:'bt'
-   },{
-       text:'HDFS',
-       img:'xt'
-   },{
-       text:'Apriori关联算法',
-       img:'sp'
-   }
-]
+const pageData = [defineAsyncComponent(() => import("./components/whatBigData.vue")), defineAsyncComponent(() => import("./components/technologyFramework.vue")), defineAsyncComponent(() => import("./components/hadoop.vue")), defineAsyncComponent(() => import("./components/HadoopHDFS.vue")), defineAsyncComponent(() => import("./components/digitalMarketing.vue"))];
+const page = ref(pageData[0]);
+const clickIndx = (index) => {
+  page.value = pageData[index];
+};
+const imgData = [
+  {
+    text: "什么是大数据",
+    img: "wst",
+  },
+  {
+    text: "大数据技术框架",
+    img: "wz",
+  },
+  {
+    text: "HADOOP",
+    img: "bt",
+  },
+  {
+    text: "HDFS",
+    img: "xt",
+  },
+  {
+    text: "Apriori关联算法",
+    img: "sp",
+  },
+];
 </script>
 
 <style lang="scss" scoped>
-.content{
-   color: #fff;
+.content {
+  color: #fff;
 }
-.app-top{
-   background: #041C49;
-   padding: 10px;
-   margin: 10px 10px -9px;
+.app-top {
+  background: #041c49;
+  padding: 10px;
+  margin: 10px 10px -9px;
 }
-.el-button{
-   width: 150px;
-   height: 36px;
-   color: #FFFFFF;
-   border-color:#FFFFFF00
+.el-button {
+  width: 150px;
+  height: 36px;
+  color: #ffffff;
+  border-color: #ffffff00;
 }
-.wst{
-   background: url('@/assets/images/1.png');
+.wst {
+  background: url("@/assets/images/1.png");
 }
-.wz{
-   background: url('@/assets/images/2.png');
+.wz {
+  background: url("@/assets/images/2.png");
 }
-.bt{
-   background: url('@/assets/images/3.png');
+.bt {
+  background: url("@/assets/images/3.png");
 }
-.xt{
-   background: url('@/assets/images/4.png');
+.xt {
+  background: url("@/assets/images/4.png");
 }
-.sp{
-   background: url('@/assets/images/5.png');
+.sp {
+  background: url("@/assets/images/5.png");
 }
-.dmx{
-   background: url('@/assets/images/6.png');
+.dmx {
+  background: url("@/assets/images/6.png");
 }
-.el-button{
-   padding:8px 0px 8px 32px
+.el-button {
+  padding: 8px 0px 8px 32px;
 }
 </style>
-
diff --git a/src/views/digitalMarketTech/index.vue b/src/views/digitalMarketTech/index.vue
index 5eff6d6..48c0a04 100644
--- a/src/views/digitalMarketTech/index.vue
+++ b/src/views/digitalMarketTech/index.vue
@@ -1,57 +1,62 @@
 <!--
  * @Author: qinzhenpen qzp1807@126.com
- * @Date: 2024-08-12 09:29:39
+ * @Date: 2024-08-20 17:50:08
  * @LastEditors: qinzhenpen qzp1807@126.com
- * @LastEditTime: 2024-08-16 17:36:43
+ * @LastEditTime: 2024-08-21 10:30:04
  * @FilePath: \vue3\src\views\digitalMarketTech\index.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
-  <div class="rgzn_top  app-container2">
+  <div class="rgzn_top app-container2">
     <div class="top_item">
-      <el-button :class="{'active':isActive===1}" @click="activeIndex(1)"><img src="@/assets/images/大数据.png">大数据</el-button>
-      <el-button :class="{'active':isActive===2}" @click="activeIndex(2)"><img src="@/assets/images/人工智能.png">人工智能</el-button>
-      <el-button :class="{'active':isActive===3}" @click="activeIndex(3)"><img src="@/assets/images/aigc.png">AIGC大模型</el-button>
+      <el-button :class="{ active: isActive === 1 }" @click="activeIndex(1)">
+        <img src="@/assets/images/大数据.png" />
+        大数据
+      </el-button>
+      <el-button :class="{ active: isActive === 2 }" @click="activeIndex(2)">
+        <img src="@/assets/images/人工智能.png" />
+        人工智能
+      </el-button>
+      <el-button :class="{ active: isActive === 3 }" @click="activeIndex(3)">
+        <img src="@/assets/images/aigc.png" />
+        AIGC大模型
+      </el-button>
     </div>
     <div>
-      <component :is="component"></component>
+      <component v-if="component" :is="component"></component>
     </div>
   </div>
 </template>
-
 <script setup>
-import AIGC from './AIGCLargeModel/index.vue'
-import big from './bigData/index.vue'
-import artificial from './artificialIntelligence/index.vue'
-const component=ref(big)
-const pageData=[big,artificial,AIGC]
-const isActive=ref(1)
-const activeIndex=(index)=>{
-  isActive.value=index
-  component.value=pageData[index-1]
-}
+const pageData = [defineAsyncComponent(() => import("./bigData/index.vue")), defineAsyncComponent(() => import("./artificialIntelligence/index.vue")), defineAsyncComponent(() => import("./AIGCLargeModel/index.vue"))];
+const component = ref(pageData[0]);
+
+const isActive = ref(1);
+const activeIndex = (index) => {
+  isActive.value = index;
+  component.value = pageData[index - 1];
+};
 </script>
 
 <style lang="scss" scoped>
-.content{
-    color: #fff;
+.content {
+  color: #fff;
 }
-.rgzn_top{
-  .top_item{
-    img{
+.rgzn_top {
+  .top_item {
+    img {
       margin-right: 5px;
     }
-    .el-button{
+    .el-button {
       width: 180px;
       height: 50px;
-      background: url('../../assets/images/常（钮）.png');
-      color:#FFFFFF;
-      border-color:#FFFFFF00;
+      background: url("../../assets/images/常（钮）.png");
+      color: #ffffff;
+      border-color: #ffffff00;
     }
-    .active{
-      background: url('../../assets/images/亮（钮）.png');
+    .active {
+      background: url("../../assets/images/亮（钮）.png");
     }
   }
 }
 </style>
-
diff --git a/src/views/digitalMarketingAlgorithms/components/associationRuleMining.vue b/src/views/digitalMarketingAlgorithms/components/associationRuleMining.vue
index 2f3cd22..a89a7ed 100644
--- a/src/views/digitalMarketingAlgorithms/components/associationRuleMining.vue
+++ b/src/views/digitalMarketingAlgorithms/components/associationRuleMining.vue
@@ -327,7 +327,7 @@
 
 <script setup>
 import * as echarts from "echarts";
-import * as XLSX from "xlsx";
+import * as XLSX from "XLSX";
 import { MdEditor, MdPreview } from "md-editor-v3";
 import "md-editor-v3/lib/style.css";
 import * as API from "@/api/AI.js";
@@ -447,7 +447,7 @@ const resTable2 = ref();
 const taskZB = () => {
   flag.value = true;
   if (selectedRows.value.length === 0) {
-    return;
+    return proxy.$modal.msgWarning("请选择指标!");
   }
   const sendData = {
     tableName: input.value,
@@ -510,6 +510,12 @@ const headerCellStyle = () => {
   };
 };
 const optionData2 = () => {
+  if (tableData2.value.length === 0) {
+    input2.value = "";
+    input3.value = "";
+    proxy.$modal.msgWarning("请先选择指标！");
+    return;
+  }
   if (input2.value && input3.value) {
     const sendData = ref({
       mapList: tableData2.value,
@@ -529,6 +535,10 @@ const optionData2 = () => {
 const exportTableRef = ref(null);
 const uplodFlag = ref(false);
 const computation = () => {
+  if (resTable2.value.length === 0 || input2.value == ""  || input3.value == "") {
+    proxy.$modal.msgWarning("请先计算/对数据进行预处理！");
+    return;
+  }
   if (input5.value && input6.value && input4.value) {
     const sendData = {
       confidence: parseFloat(input5.value) / 100,
@@ -548,6 +558,8 @@ const computation = () => {
       }
       tableData3.value = res.data;
     });
+  } else {
+    proxy.$modal.msgWarning("请模型参数进行设置！");
   }
 };
 const upload = () => {
diff --git a/src/views/digitalMarketingAlgorithms/components/bigData.vue b/src/views/digitalMarketingAlgorithms/components/bigData.vue
index 7ee9f0c..ebb2fb7 100644
--- a/src/views/digitalMarketingAlgorithms/components/bigData.vue
+++ b/src/views/digitalMarketingAlgorithms/components/bigData.vue
@@ -30,7 +30,7 @@
       <el-table :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle">
         <el-table-column v-for="column in tableLabel" :key="column" :prop="column.prop" :label="column.label" align="center">
           <template #default="{ row }">
-            {{ formatDate(row[column.prop])?? '...' }}
+            {{ formatDate(row[column.prop]) ?? "..." }}
           </template>
         </el-table-column>
       </el-table>
@@ -118,9 +118,10 @@ const selectType = (type) => {
   nzIndex.value = -1;
 };
 const getSurface = () => {
+  loading.value = true;
   portraitModel.getUserTableData(n_dataTableQuery.value).then((res) => {
-    tableData.value = res?.data?.list;
-    datatotal.value = res.data.total;
+    tableData.value = res?.data?.list
+    datatotal.value = res?.data?.total    
     tableLabel2.value = [];
     if (tableData.value[0]?.stepOneA) {
       arrhander.value = JSON.parse(tableData.value[0].stepOneA);
@@ -133,7 +134,13 @@ const getSurface = () => {
       });
       tableLabel.value = tableLabel2.value;
     }
-  });
+    setTimeout(()=>{
+      loading.value = false;
+    },1000)
+  }).catch(err=>{
+    loading.value = false;
+    tableData.value=[]
+  })
 };
 // 导入
 const importData = (e) => {
@@ -144,6 +151,7 @@ const importData = (e) => {
   formdata.append("userId", userInfo.userId);
   marketingAlgorithmApi.getMarketingAlgorithmImport(formdata).then((res) => {
     loading.value = false;
+    getZJData();
     proxy.$modal.msgSuccess("导入成功");
   });
 };
diff --git a/src/views/digitalMarketingAlgorithms/components/clusterAnalysis.vue b/src/views/digitalMarketingAlgorithms/components/clusterAnalysis.vue
index 4e9f514..225c17c 100644
--- a/src/views/digitalMarketingAlgorithms/components/clusterAnalysis.vue
+++ b/src/views/digitalMarketingAlgorithms/components/clusterAnalysis.vue
@@ -270,7 +270,7 @@
 import popModel from "@/views/components/popModal.vue";
 import { htmlPdf } from "@/utils/pdf.js";
 import * as echarts from "echarts";
-import * as XLSX from "xlsx";
+import * as XLSX from "XLSX";
 import JSZip from "jszip";
 import * as API from "@/api/AI.js";
 import { getUserInfo } from "@/utils/auth";
@@ -393,7 +393,7 @@ const resTable2 = ref();
 const taskZB = () => {
   flag.value = true;
   if (selectedRows.value.length === 0) {
-    return;
+    return proxy.$modal.msgWarning("请选择指标!");
   }
   const sendData = {
     tableName: input.value,
@@ -408,6 +408,7 @@ const taskZB = () => {
         prop: key,
       });
     }
+    proxy.$modal.msgSuccess("计算完成!");
     tableData2.value = res.data;
     flag.value = true;
   });
@@ -456,6 +457,12 @@ const headerCellStyle = () => {
   };
 };
 const optionData2 = () => {
+  if (tableData2.value.length === 0) {
+    input2.value = "";
+    input3.value = "";
+    proxy.$modal.msgWarning("请先选择指标！");
+    return;
+  }
   if (input2.value && input3.value) {
     const sendData = ref({
       mapList: tableData2.value,
@@ -475,6 +482,10 @@ const showChart = ref(false);
 //生产表格
 const nowData = ref([]);
 const computation = () => {
+  if (tableData2.value.length === 0 && input2.value == "" && input3.value == "") {
+    proxy.$modal.msgWarning("请先计算/对数据进行预处理！");
+    return;
+  }
   if (input5.value && input6.value && input4.value) {
     const sendData = {
       k: input5.value,
@@ -551,6 +562,8 @@ const computation = () => {
         }
       }, 100);
     });
+  } else {
+    proxy.$modal.msgWarning("请模型参数进行设置！");
   }
 };
 const exportTableRef = ref(null);
diff --git a/src/views/digitalMarketingAlgorithms/components/descriptiveStatistics.vue b/src/views/digitalMarketingAlgorithms/components/descriptiveStatistics.vue
index 226c02b..0abb45f 100644
--- a/src/views/digitalMarketingAlgorithms/components/descriptiveStatistics.vue
+++ b/src/views/digitalMarketingAlgorithms/components/descriptiveStatistics.vue
@@ -1,5 +1,4 @@
 <template>
-  <!-- <el-scrollbar height="800px" v-loading="loading"> -->
   <div class="main-top">
     <span style="font-weight: bold; font-size: 18px; color: #3596eb">任务描述</span>
     <p style="font-weight: 400; font-size: 12px; color: #e6e6e6">（给出任务清单参考，做哪些数据的统计分析）Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget.</p>
@@ -16,47 +15,49 @@
   </div>
   <div class="app-main">
     <div class="main-left">
-      <div>
-        <div class="left-top">
-          <span>一、选择指标</span>
-        </div>
-        <div class="metrics">
-          <el-select v-model="n_dataTableQuery.tableName" placeholder="请选择数据" style="width: 180px" @change="selectType">
-            <el-option v-for="item in algorithmStore.userDataLabel" :key="item" :label="item" :value="item" />
-          </el-select>
-        </div>
-        <div class="metrics-table" style="margin-top: 10px">
-          <el-table border ref="multipleTableRef" :data="algorithmStore.indexLibrary" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange">
-            <el-table-column type="selection" prop="date" label="Date" align="center" />
-            <el-table-column label="指标" align="center" prop="label" />
-          </el-table>
-          <el-button @click="submit">确定</el-button>
-        </div>
-        <div class="left-top">
-          <span>二、数据预处理</span>
-        </div>
-        <div class="metrics">
-          <el-select v-model="preProcessText.text1" placeholder="请选择数据" style="width: 180px">
-            <el-option label="数据去重" value="数据去重" />
-          </el-select>
-        </div>
-        <div class="metrics" style="margin-top: 15px">
-          <el-select v-model="preProcessText.text2" placeholder="请选择数据" style="width: 180px" @change="preProcess">
-            <el-option label="缺失值处理-剔除数据" value="缺失值处理-剔除数据" />
-            <el-option label="缺失值处理一均值替代" value="缺失值处理一均值替代" />
-          </el-select>
-        </div>
-        <div class="left-top" style="margin-top: 10px">
-          <span>三、模型参数设置</span>
-        </div>
-        <div class="metrics-table" style="margin-top: 10px">
-          <el-table border ref="multipleTableRef" :data="modelParams" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handlemodelSelectionChange">
-            <el-table-column type="selection" prop="date" label="Date" align="center" />
-            <el-table-column prop="name" label="统计量" align="center" />
-          </el-table>
-          <el-button @click="modelCalculation">计算</el-button>
+      <el-scrollbar height="550px" style="padding-right: 10px" min-size="5">
+        <div>
+          <div class="left-top">
+            <span>一、选择指标</span>
+          </div>
+          <div class="metrics">
+            <el-select v-model="n_dataTableQuery.tableName" placeholder="请选择数据" style="width: 180px" @change="selectType">
+              <el-option v-for="item in algorithmStore.userDataLabel" :key="item" :label="item" :value="item" />
+            </el-select>
+          </div>
+          <div class="metrics-table" style="margin-top: 10px">
+            <el-table border ref="multipleTableRef" :data="algorithmStore.indexLibrary" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange">
+              <el-table-column type="selection" prop="date" label="Date" align="center" />
+              <el-table-column label="指标" align="center" prop="label" />
+            </el-table>
+            <el-button @click="submit">确定</el-button>
+          </div>
+          <div class="left-top">
+            <span>二、数据预处理</span>
+          </div>
+          <div class="metrics">
+            <el-select v-model="preProcessText.text1" placeholder="请选择数据" style="width: 180px">
+              <el-option label="数据去重" value="数据去重" />
+            </el-select>
+          </div>
+          <div class="metrics" style="margin-top: 15px">
+            <el-select v-model="preProcessText.text2" placeholder="请选择数据" style="width: 180px" @change="preProcess">
+              <el-option label="缺失值处理-剔除数据" value="缺失值处理-剔除数据" />
+              <el-option label="缺失值处理一均值替代" value="缺失值处理一均值替代" />
+            </el-select>
+          </div>
+          <div class="left-top" style="margin-top: 10px">
+            <span>三、模型参数设置</span>
+          </div>
+          <div class="metrics-table" style="margin-top: 10px">
+            <el-table border ref="multipleTableRef" :data="modelParams" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handlemodelSelectionChange">
+              <el-table-column type="selection" prop="date" label="Date" align="center" />
+              <el-table-column prop="name" label="统计量" align="center" />
+            </el-table>
+            <el-button @click="modelCalculation">计算</el-button>
+          </div>
         </div>
-      </div>
+      </el-scrollbar>
       <div style="margin-top: auto">
         <div class="startOver" @click="restart">
           <img src="../../../assets/images/重新开始.png" alt="" />
@@ -65,24 +66,25 @@
       </div>
     </div>
     <div class="main-right">
-      <div>
-        <span style="font-weight: bold; font-size: 18px; color: #3596eb">分析数据：</span>
-        <el-table :data="analysisData" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle">
-          <el-table-column v-for="column in analysisHanderKry" :key="column" :prop="column" :label="column" align="center" />
-        </el-table>
-        <pagination v-show="n_analyzeTheNumberOfDataItems > 0" :total="n_analyzeTheNumberOfDataItems" v-model:page="n_dataTableQuery.index" v-model:limit="n_dataTableQuery.size" @pagination="analyzeDataNext" />
-      </div>
-      <div class="analysisResults" style="margin-top: 20px">
-        <span style="font-weight: bold; font-size: 18px; color: #3596eb; display: block">分析结果：</span>
-        <el-button @click="download">下载</el-button>
-        <el-table :data="tableData" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
-          <el-table-column v-for="column in tableLabel" :key="column.label" :prop="column.prop" :label="column.label" align="center"></el-table-column>
-        </el-table>
-        <pagination v-show="nNumberOfAnalysisResults > 0" :total="nNumberOfAnalysisResults" v-model:page="gAnalysisResults.index" v-model:limit="gAnalysisResults.size" @pagination="updatePageAnalysisResults" />
-      </div>
+      <el-scrollbar height="550px" style="padding: 20px">
+        <div>
+          <span style="font-weight: bold; font-size: 18px; color: #3596eb">分析数据：</span>
+          <el-table :data="analysisData" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle">
+            <el-table-column v-for="column in analysisHanderKry" :key="column" :prop="column" :label="column" align="center" />
+          </el-table>
+          <pagination v-show="n_analyzeTheNumberOfDataItems > 0" :total="n_analyzeTheNumberOfDataItems" v-model:page="n_dataTableQuery.index" v-model:limit="n_dataTableQuery.size" @pagination="analyzeDataNext" />
+        </div>
+        <div class="analysisResults" style="margin-top: 20px">
+          <span style="font-weight: bold; font-size: 18px; color: #3596eb; display: block">分析结果：</span>
+          <el-button @click="download">下载</el-button>
+          <el-table :data="tableData" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350" v-loading="loading">
+            <el-table-column v-for="column in tableLabel" :key="column.label" :prop="column.prop" :label="column.label" align="center"></el-table-column>
+          </el-table>
+          <pagination v-show="nNumberOfAnalysisResults > 0" :total="nNumberOfAnalysisResults" v-model:page="gAnalysisResults.index" v-model:limit="gAnalysisResults.size" @pagination="updatePageAnalysisResults" />
+        </div>
+      </el-scrollbar>
     </div>
   </div>
-  <!-- </el-scrollbar> -->
   <el-dialog v-model="dialogVisible" title="实训任务提交" width="565" custom-class="dialogClass" :show-close="false">
     <template #header="{ close, titleId, titleClass }">
       <div class="my-header">
@@ -154,39 +156,76 @@
       </div>
     </template>
   </el-dialog>
-  <pop-model
-      :showModel="runResultShow"
-      title="关联规则挖掘"
-      @closePop="runResultShow = false"
-    >
-      <template v-slot:content>
-        <div>
-          <p style="font-weight: 700;font-size:22px">什么是描述性统计分析</p><p>描述性统计分析是数据分析的一种方法，旨在对数据进行总结和描述，以便更好地理解数据的特征和趋势。它主要通过统计指标和图表来呈现数据的基本特征，包括中心趋势、离散程度、分布形态等。<br />常用的描述性统计指标包括：</p><li>中心趋势：用于描述数据集的集中程度，常见的指标有均值、中位数和众数。</li><li>离散程度：用于描述数据的分散程度，常见的指标有方差、标准差和极差。</li><li>分布形态：用于描述数据的分布形态，常见的指标有偏度和峰度。</li><p>描述性统计分析还可以通过图表来展示数据的特征，常见的图表包括：</p>
-          <li>频数分布表和直方图：用于展示数据的分布情况，可以观察数据的集中程度和离散程度。</li><li>箱线图：用于展示数据的分布情况和离群值，可以观察数据的中位数、四分位数和异常值。</li><li>散点图：用于展示两个变量之间的关系，可以观察数据的相关性和趋势。</li><p>描述性统计分析可以帮助我们对数据有一个直观的了解，发现数据中的规律和异常情况，为后续的数据分析和决策提供基础。</p><p style="font-size:19px;font-weight:600">描述性统计分析的优势和局限性</p><p>描述性统计分析的优势和局限性如下：<br />优势：</p><li>简单易懂：描述性统计分析使用简单的统计指标和图表，可以直观地呈现数据的特征，使人们更容易理解和解释数据。</li>
-          <li>提供概览：通过描述性统计分析，可以获得数据的整体概览，包括数据的中心趋势（如均值、中位数）、数据的分布情况（如标准差、百分位数）等。</li><li>发现异常值：描述性统计分析可以帮助我们发现数据中的异常值或离群点，从而帮助我们识别数据质量问题或异常情况。</li><p>局限性：</p><li>缺乏深入分析：描述性统计分析主要关注数据的基本特征，无法深入挖掘数据背后的关联和因果关系。</li><li>无法进行推断：描述性统计分析只是对已有数据的总结和描述，并不能进行推断或预测。</li><li>受数据限制：描述性统计分析的结果受到数据本身的限制，如果数据质量不好或数据量较小，可能会导致结果不准确或不可靠。</li><p>综上所述，描述性统计分析是数据分析的重要工具，可以帮助我们了解数据的基本特征和趋势，但在深入分析和推断方面有一定的局限性。</p>
-          <p style="font-size:19px;font-weight:600">描述性统计分析的常用方法</p><p>描述性统计分析是对数据进行总结和描述的过程，常用的方法包括：</p><li>中心趋势度量：包括均值（mean）、中位数（median）和众数（mode），用于描述数据的集中程度。</li><li>离散程度度量：包括方差（variance）、标准差（standard deviation）和极差（range），用于描述数据的离散程度。</li><li>分布形状度量：包括偏度（skewness）和峰度（kurtosis），用于描述数据的分布形状。</li><li>频数统计：通过频数表、频率分布表和直方图等方式，统计数据的频数和频率。</li><li>百分位数：用于描述数据中某个特定百分比的位置，如中位数、四分位数等。</li><li>相关性分析：通过计算相关系数（如Pearson相关系数）来衡量两个变量之间的相关性。</li>
-          <p style="font-size:19px;font-weight:600">描述性统计分析的应用场景</p><p>描述性统计分析在许多领域和应用场景中都有重要的作用，以下是一些常见的应用场景：</p><li>提供概览：描述性统计分析可以提供数据的概览，帮助我们了解数据的整体特征和规律。通过计算中心趋势测量（如均值、中位数、众数）、离散程度测量（如方差、标准差、极差）和分布形态测量（如偏度、峰度），我们可以得到数据的集中趋势、离散程度和分布形态等信息。</li><li>数据比较：描述性统计分析可以帮助我们比较不同组或不同时间点的数据。通过比较不同组的中心趋势、离散程度和分布形态等，我们可以了解不同组之间的差异和相似之处，从而得出结论或提出假设。</li><li>发现异常值：描述性统计分析可以帮助我们发现数据中的异常值。通过观察离群点（如极端值）和异常值（如异常观测值），我们可以发现数据中的异常情况，进而进行进一步的分析和处理。</li>
-          <li>数据可视化：描述性统计分析可以通过可视化方法（如直方图、散点图、箱线图等）将数据转化为图形，使得数据更加直观和易于理解。数据可视化可以帮助我们发现数据的分布模式、趋势和关联关系，从而更好地理解数据。</li><li>数据摘要：描述性统计分析可以通过频数和频率分布表、百分位数等方式对数据进行摘要和概括。这些摘要信息可以帮助我们对数据进行快速的了解和比较，从而支持后续的决策和分析。</li><li>假设检验：描述性统计分析可以为假设检验提供依据，通过对样本数据的描述性统计分析，我们可以判断样本数据是否符合某种假设分布，从而进行假设检验。</li><li>数据报告和展示：描述性统计分析可以提供数据的概括性描述，用于撰写数据报告和展示，帮助他人更好地理解数据的特征和趋势。</li><li>数据清洗：描述性统计分析可以帮助我们发现数据中的问题和错误。通过观察数据的分布情况和异常值，我们可以判断数据的质量，并进行必要的数据清洗和修正。</li>
-          <li>数据探索：描述性统计分析是探索性数据分析的一部分，它可以帮助我们发现数据中的模式、关联和趋势。通过观察数据的分布、散点图、相关系数等，我们可以发现数据中的隐藏信息和规律。</li><li>决策支持：描述性统计分析可以为决策提供支持。通过对数据的摘要和可视化，我们可以获取有关数据的重要信息，帮助决策者做出基于数据的决策。</li><p style="font-size:19px;font-weight:600">如何进行描述性统计分析</p><p>开展描述性统计分析可以按照以下步骤进行：</p><li>收集数据：首先，需要收集所需的数据，可以是通过调查问卷、实验、观察或从现有数据源获取。</li><li>数据清洗：对收集到的数据进行清洗，包括处理缺失值、异常值和错误数据等。</li><li>描述性统计：使用统计方法计算数据的基本统计量，如平均值、中位数、标准差等，以了解数据的集中趋势、离散程度和分布情况。</li><li>可视化展示：将统计结果以图表的形式进行可视化展示，如直方图、箱线图、散点图等，以更直观地呈现数据的特征和趋势。</li>
-          <li>解读分析结果：根据统计分析的结果，解读数据的含义和趋势，提取有用的信息和洞察，并进行合理的解释和推断。</li><p style="font-size:19px;font-weight:600">描述性统计分析的注意事项</p><p>在进行描述性统计分析时，有以下几个注意事项：</p><li>数据质量：确保数据的准确性和完整性。进行数据清洗，处理缺失值、异常值和重复值等，以保证分析结果的可靠性。</li><li>数据类型：根据数据的类型选择合适的统计方法和图表。对于定量数据，可以使用均值、标准差等统计量；对于定性数据，可以使用频数和百分比等统计量。</li><li>样本大小：考虑样本大小对统计结果的影响。样本较小可能导致统计结果不够准确，而样本较大可能会增加计算复杂度。</li><li>数据分布：了解数据的分布情况，选择合适的统计方法和图表。例如，对于正态分布的数据，可以使用均值和标准差进行描述；对于偏态分布的数据，可以使用中位数和四分位数等进行描述。</li><li>上下文和目的：考虑数据分析的上下文和目的。根据具体的问题和需求，选择合适的统计方法和图表，以便更好地解读数据和提取有价值的信息。</li>
-          <li>解读和推断：描述性统计分析主要是对数据进行概括和描述，不能进行推断和因果分析。在解读结果时，要注意避免过度解读和误导。</li><li>可视化呈现：使用合适的图表和图形将数据可视化，以便更好地传达数据的特征和趋势。选择简洁明了的图表，避免图表过于复杂和混乱。</li>
-        </div>
-        <!-- 情感分析 -->
-        <!-- <div>
-          <p style="font-weight: 700;font-size:22px">总览</p><p>文本分析指对文本数据进行表示 (representation)，处理(processing)和建模(modeling)来获得有用的见解(insight)。<br />文本分析的一个挑战是高维度(high dimensionality)。<br /><br />语料库: 指在自然语言处理中用于各种目的的大量文本(文档)集合。<br /><br />另一个挑战是: 大多数情况下文本是非结构化数据(not structured)。</p><img src="@/assets/images/f4001.png" alt=""><p style="font-weight: 700;font-size:22px">文本分析步骤</p><p>&nbsp;&nbsp;&nbsp;&nbsp;1.句法分析(Parsing): 是指处理非结构化文本使其具有一定的结构，供将来分析的过程。句法分析将文本进行解构，然后以一种更为结构化的方式来呈现。(unsturctured -> sturctured)<br />&nbsp;&nbsp;&nbsp;&nbsp;2.搜索和检索 (Search and retrieval): 在一个语料库中识别包含例如特殊单词，短语，主题或者实体(如人或组织)等搜索项(search items)的文档。这些搜索项通常称为关键术语 (key term)。<br />&nbsp;&nbsp;&nbsp;&nbsp;3.文本挖掘 (text mining): 指使用前两步产生的术语和索引来发现与感兴趣领域或问题相关的有意义的见解(discover meaningful insights)。<br />聚类(clustering) 和 分类 (classification) 都可以应用于文本挖掘。比如：将文档聚化成簇 或者 分类文本以进行情感分析(sentiment analysis)。<br />文本挖掘可以利用来自各个研究领域的方法和技术，如统计分析(statistical analysis)，信息检索(information retrieval)，数据挖掘(data mining)和自然语言处理(natural language processing)等。</p>
-          <p style="font-weight: 700;font-size:22px">挑战</p><li>语法(syntax): 涉及句子结构和语法规则。</li><li>语义(semantics): 是对句子含义的研究。</li><li>语用(pragmatic): 关注特定上下文中句子的含义。</li><li>同义词(homonyms): 具有相同拼写但含义不同的单词。</li><li>缩写词(acronyms): 是单词的缩写形式。</li><p>对于计算机来说，文本只是编码和数字的字符序列(sequence of characters)。它不了解语法，语义(semantic meanings)和其实用含义(pragmatic meaning)。<br />同时，在原始形式中，单词或者文本之间没有自然相似性度量(nature similarity metric)。(因此难以执行聚类或分类)<br />因此，我们需要以适合用于聚类和分类的形式来表示和处理文本。</p><p style="font-weight: 700;font-size:22px">第一步：收集原始文本数据(Collecting Raw Text)</p><p>对于文本分析来说，进行任何事情之前必须先收集数据。</p>
-          <li>可以在许多网站上对用户生成的内容(user-generated contents)开始积极的监控。（可以使用公开的API, 网页爬虫 web scraper/crawler）</li><li>准备处理非结构化或者半结构化数据。</li><p style="font-weight: 700;font-size:22px">第二步：表示文本 (Representing Text)</p><p>使用文本规范化的技术(text normalization techniques)对原始文本进行转化。</p><li>分词 (tokenization): 指从文本正文中分离(也叫做标记)单词 (seperating words)。</li><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;1.按空格(spaces)来分词。(可能会把标点符号也给分出来，比如 day. )<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2.基于标点符号和空格来分词 (可能会把 we’ll, can’t, state-of-the-art 等直接分开)<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;分词比想象中更困难 (résumé 和 resume)<br />没有一个分词器适用于每一种情形(no one-size-fits-all)。</p><li>大小写转换 (case folding): 将所有的字母都变成小写(或者都变成大写)。</li>
-          <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;1.但是在一些情况下可能会出错: 如专有名词，缩写，公司名等(General Motors; WHO; US;)<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2.减少错误的方法是对不进行大小写转换的单词建立一个查找表(lookup table)。</p><li>停止词(stop word): 在给定语言中，并非所有的单词都需要被考虑。(比如：the, a, of, and, to等这些不太可能有助于语义的理解)</li><li>词根法(Lemmatization)和词干法(Stemming): 词根法看单词的意义(如: Goose, geese, goose, gander, ganders)。词干法看单词的组成(如：walk, walking, Walk, walks, walked)。最受欢迎的是"Porter stemmer", “WordNet”。</li><li>词袋法(Bag-of-words representation): 将文档转化成高维向量(high-dimensional vector)，向量指示了文档中各个单词的 存在/不存在/出现频率(presence/absence/frequency)。</li><img src="@/assets/images/f4002.png" alt=""><p>词袋法足够简单(朴素且过分简化问题 naive and over-simplified) 并被广泛应用于文本分析问题中 (是入门的好方法)。其将文档表示为一组词语(单词)，而忽略了其他信息(如顺序 order，上下文 context，推论 inferences和语义 semantics)。比如，“a dog bites a man” 和 "a man bites a dog"意思完全不同但是他们在词袋法里是同一种表示。</p>
-          <li>语料库的表示(Representation of a corpus): 语料库可以大到包括一种或者多种语言的所有文档，也可以小到仅限于特定领域(focused on a specific domains)。</li><p>大多数语料库都具有元数据，比如语料库的大小以及文本提取的领域。某些语料库包含了文本中出现的每个词的信息内容(Information content, IC)。信息内容是用来表示语料库中词语重要性(importance of a term)的度量。IC值较高的词语的重要性要比IC值较低的词语高。<br />然而，信息内容无法满足分析动态改变的非结构化数据的需求。问题：传统语料库和IC元数据都无法随着时间改变，因此任何语料库中不存在的词汇和任何新发明的词汇都会自动得到0的IC值。其次，传统语料库限制了用于文本分析算法 (text analysis algorithm) 的全部知识(语料库代表了整个知识库)。</p><p style="font-weight: 700;font-size:22px">第三步：词频-逆文档频率(TFIDF - Term Frequency - Inverse Document Frequency)</p><p style="font-weight: 600;font-size:18px">词频 (Term Frequency)</p><p>我们需要一个适应文本上下文(context)和性质(nature)的度量标准 metric (不像IC一样)。<br />TFIDF直接作用于所有获取的文档(fetched documents)。一旦获取的文档发生更改，TFIDF可以被轻松更新。TFIDF是一种广泛用于文本分析的措施。TFIDF对动态内容的处理也是相当强大且有效的，因为文档的变化只需要更新频率计数。<br />
-            给定一个单词 t 以及一个包含 n 个词的文档 d = {t1, t2, …, tn}。在 d 中 t 最简单的词频形式可以定义为 t 在 d 中出现的次数。</p><img src="@/assets/images/f4003.png" alt=""><p>可以对词频函数取对数，以获得更多数据细节。</p><img src="@/assets/images/f4005.png" alt=""><p>对于长文档，因为其包含的词语数量和种类多，因此往往有更高的词频值。这些因素导致了长文档的词频值的提升，以至于人们对长文档产生了偏见。为了解决这个问题，可以对词频进行规范化。</p><img src="@/assets/images/f4006.png" alt=""><p>Zipf’s Law：第 i 个最常见的单词出现在最常见词的 1/i 处。</p><p style="font-weight: 600;font-size:18px">Term Frequency 问题</p><p>词语的重要性仅取决于其在特定文档中的存在。如果该词语频繁出现在每个文档中怎么办？这个词还重要吗？我们需要拓宽我们的视野，不仅要在单个文档中，而是要在整个语料库中考虑一个词语的重要性。</p><p style="font-weight: 600;font-size:18px">词语的文档频率 (Document Frequency of a term)</p><p>文档频率被定义为语料库中包含一个词语的文档的数目。假设语料库D包含N个文档。语料库D={d1, d2, …, dn}中词语 t 的文档频率的定义为：</p><img src="@/assets/images/f4007.png" alt=""><p style="font-weight: 600;font-size:18px">逆文档频率 (Inverse Document Frequency)</p><p>逆文档频率的定义，N代表了语料库的总文档数，DF(t) 代表单词 t 的文档频率。逆文档频率就是他们的商取对数得到。</p>
-            <img src="@/assets/images/f4008.png" alt=""><p>如果词语不在语料库内，会导致分母为零，快速解决的方法是在分母上加个1。</p><img src="@/assets/images/f4009.png" alt=""><p>拥有较高IDF的词往往在整个语料库中更重要。罕见单词的IDF会很高。高频单词的IDF会很低。<br />警告，因为语料库中所有文档数目(N)是保持恒定的，因此IDF仅取决于DF，那些DF值最低的词获得相同的最高IDF。因此，有必要引入更多权重词来对文档中出现次数相同的词进行区分。</p><p style="font-weight: 600;font-size:18px">TFIDF</p><p>是一种既考虑词在单个文档中的普及率 prevalence (TF)，也考虑他在整个语料库中的稀缺程度 scarcity (IDF)的评估方法。词语 t 在文档 d 中的TFIDF 定义为 d 中 t 的词频 乘以语料库中 t 的文档频率，如下公式：</p><img src="@/assets/images/f4010.png" alt=""><p>一个词的TFIDF值越高，它在一个文档中出现的就越频繁，但在语料库的所有文档中出现得就越少。<br />TFIDF在简单和直接的计算中是很有效的，因为它不需要文本含义的相关知识。文档 d 被表示为 TFIDF(t, d)值 的高维向量 (high-dimensional vector)。<br /><br />TFIDF方法减少描述长度的数量相对较少，同时其很难揭示文档内或文档之间(intra-document or inter-document)的统计结构。<br />主题建模(Topic Modelling)能够解决这个问题。主题(topic): 经常在一起出现的具有相关含义的单词簇(a cluster of words)。每个词在主题中都有权重。</p>
-            <p style="font-weight: 700;font-size:22px">第四步：主题建模(Topic Modelling)</p><p>主题建模提供了文档的简短描述。同时，它也提供了自动组织，搜索，理解并汇总大量信息的工具。主题建模是统计模型，它研究一组文档中的单词，确定文档主题，并发现主题是如何相关(associated)或者如何随时间变化的(change over time)。</p><p style="font-weight: 600;font-size:18px">流程</p><p>&nbsp;&nbsp;&nbsp;&nbsp;1.揭开(uncover)语料库中隐藏的主题模式(hidden topical patterns)。<br />&nbsp;&nbsp;&nbsp;&nbsp;2.根据这些主题来注释文档(annotate document)。<br />&nbsp;&nbsp;&nbsp;&nbsp;3.使用注释来组织，搜索，汇总文档(organize, search, summarise)。</p><p style="font-weight: 600;font-size:18px">主题(topic)</p><p>一个主题被正式定义为固定单词词汇分布(a distribution over a fixed vocabulary of words)。不同的主题在相同的词汇上会有不同的分布。词汇中的某个词可以在多个主题中有不同的权重。<br />一个文档通常由多个主题以不同的比例贯穿文本。</p><p style="font-weight: 600;font-size:18px">LDA</p><p>最简单的主题模型是Latent Dirichlet Allocation(LDA)，这是一个语料库的生成概率模型(generative probabilistic model of a corpus)。在生成概率模型中，从概率密度函数 (probability density function) 得出模型观测值 (model observation)。在LDA中，文档被视为生成过程 (generative process) 的结果(带有隐藏变量 hidden variables)。<br />LDA假设了：<br /></p><li>有一个固定的词汇表 (fixed vocabulary of words)。</li>
-            <li>潜在主题 (latent topics) 的数目是预定义的。</li><li>每个潜在主题的特征都是词汇表中单词的分布(Dirichlet distribution)。</li><li>每个文档表示潜在主题的一个随机混合(random mixture)。</li><p style="font-weight: 600;font-size:18px">LDA流程</p><p>&nbsp;&nbsp;&nbsp;&nbsp;1.选择文档的长度N。<br />&nbsp;&nbsp;&nbsp;&nbsp;2.每个文档有一个在主题上的分布。<br />&nbsp;&nbsp;&nbsp;&nbsp;3.为文档中的每个词分配一个主题，并选择相应的主题中的单词。<br /><br />在现实中，只有文档是可用(available)的。LDA的目标是为每一个文档推断潜在的主题(underlying topic)，主题比例 (topic proportion) 以及主题分配 (topic assignment)。</p><p style="font-weight: 600;font-size:18px">算法</p><p>&nbsp;&nbsp;&nbsp;&nbsp;1.选择一个值 k。<br />&nbsp;&nbsp;&nbsp;&nbsp;2.对于每个文档，将文档中的每个单词随机分配给k个主题之一。<br />&nbsp;&nbsp;&nbsp;&nbsp;对于每个文档 d，遍历每个单词 w，然后计算 d 中分配给主题 t 的单词所占的比例，通常会应用平滑(smoothing)处理：</p><img src="@/assets/images/f4011.png" alt=""><p>&nbsp;&nbsp;&nbsp;&nbsp;4.计算从单词w来的所有文档中对主题 t 的分配比例 P(w | t)<br />&nbsp;&nbsp;&nbsp;&nbsp;5.计算属于主题 t 的单词 w 的概率：</p><img src="@/assets/images/f4012.png" alt=""> <p style="font-weight: 600;font-size:18px">注意事项</p> <p>LDA将文档视为主题的混合体。<br />LDA将主题视为单词的混合体。<br />如果单词 w 很有可能出现在主题 t 中，则所有带有 w 的文档将与主题 t 的关联更为紧密。<br />
-              如果单词 w 不太可能出现在主题 t 中，则包含 w 的文档出现在 t 中的可能性将会很小。因为文档 d 中剩余的单词将出现在其他主题中，因此 d 有更高的可能性属于那些主题。因此，就算我们将 w 添加到 t 中，也不会将很多该类文档带到 t 。</p><p style="font-weight: 600;font-size:18px">应用</p><p>主题模型可以被用于文档建模(document modelling)，文档分类(document classification)与协同过滤(collaborative filtering)。<br />主题模型不仅可以应用于文本数据，它还可以用于注释图像。</p><p style="font-weight: 700;font-size:22px">情感分析 (Sentiment Analysis)</p><p>情感分析使用统计和自然语言处理来从文本中挖掘观点来识别并抽取主观信息。<br />应用： 检测产品或者电影的评论的极性(polarity of reviews)。<br /><br />分析层面包括了文档层面(document)，语句层面(sentence)，短语层面(phrase)，和短文层面(short-text)。<br /><br />分类方法(朴素贝叶斯，最大熵，或者支持向量机SVM) 经常被用来提取语料库统计以用于情感分析。</p><img src="@/assets/images/f4013.png" alt=""><p>分类器仅基于对其进行训练的数据集来确定情感：</p><li>词义随着领域不同而改变。</li><li>因此模型无法直接应用于其他领域。</li><p>绝对的情感水平无法提供信息，应该建立一条基线，然后将其与观察值比较。比如，一个产品拥有40%正面推文，60%负面推文，貌似是不成功的。但是如果其他类似的成功产品也有类似的正负面百分比，那么不应该认为该产品是不成功的。<br /><br />如何对大量评论添加标签(积极，消极，中立):<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;1.使用表情符号 (小心阴阳怪气)<br />
-                &nbsp;&nbsp;&nbsp;&nbsp;2.使用 Amazon Mechanical Turk 互联网众包市场，将上标签工作外包出去。</p><p style="font-weight: 700;font-size:22px">获得结果(gaining insights)</p><p style="font-weight: 600;font-size:18px">词云(word cloud)</p><p>五星好评的词云</p><img src="@/assets/images/f4015.png" alt=""><p>一星差评的词云：</p><img src="@/assets/images/f4016.png" alt=""><p>TFIDF能够用来凸显评论中有信息量的单词。</p> <img src="@/assets/images/f4017.png" alt=""><p>LDA可以把评论归类为主题。圆盘的大小代表了词的权重。</p><img src="@/assets/images/f4018.png" alt=""><p>另一种可视化方式。</p><img src="@/assets/images/f4019.png" alt=""> 
-        </div> -->
-      </template>
-    </pop-model>
+  <pop-model :showModel="runResultShow" title="关联规则挖掘" @closePop="runResultShow = false">
+    <template v-slot:content>
+      <div>
+        <p style="font-weight: 700; font-size: 22px">什么是描述性统计分析</p>
+        <p>
+          描述性统计分析是数据分析的一种方法，旨在对数据进行总结和描述，以便更好地理解数据的特征和趋势。它主要通过统计指标和图表来呈现数据的基本特征，包括中心趋势、离散程度、分布形态等。
+          <br />
+          常用的描述性统计指标包括：
+        </p>
+        <li>中心趋势：用于描述数据集的集中程度，常见的指标有均值、中位数和众数。</li>
+        <li>离散程度：用于描述数据的分散程度，常见的指标有方差、标准差和极差。</li>
+        <li>分布形态：用于描述数据的分布形态，常见的指标有偏度和峰度。</li>
+        <p>描述性统计分析还可以通过图表来展示数据的特征，常见的图表包括：</p>
+        <li>频数分布表和直方图：用于展示数据的分布情况，可以观察数据的集中程度和离散程度。</li>
+        <li>箱线图：用于展示数据的分布情况和离群值，可以观察数据的中位数、四分位数和异常值。</li>
+        <li>散点图：用于展示两个变量之间的关系，可以观察数据的相关性和趋势。</li>
+        <p>描述性统计分析可以帮助我们对数据有一个直观的了解，发现数据中的规律和异常情况，为后续的数据分析和决策提供基础。</p>
+        <p style="font-size: 19px; font-weight: 600">描述性统计分析的优势和局限性</p>
+        <p>
+          描述性统计分析的优势和局限性如下：
+          <br />
+          优势：
+        </p>
+        <li>简单易懂：描述性统计分析使用简单的统计指标和图表，可以直观地呈现数据的特征，使人们更容易理解和解释数据。</li>
+        <li>提供概览：通过描述性统计分析，可以获得数据的整体概览，包括数据的中心趋势（如均值、中位数）、数据的分布情况（如标准差、百分位数）等。</li>
+        <li>发现异常值：描述性统计分析可以帮助我们发现数据中的异常值或离群点，从而帮助我们识别数据质量问题或异常情况。</li>
+        <p>局限性：</p>
+        <li>缺乏深入分析：描述性统计分析主要关注数据的基本特征，无法深入挖掘数据背后的关联和因果关系。</li>
+        <li>无法进行推断：描述性统计分析只是对已有数据的总结和描述，并不能进行推断或预测。</li>
+        <li>受数据限制：描述性统计分析的结果受到数据本身的限制，如果数据质量不好或数据量较小，可能会导致结果不准确或不可靠。</li>
+        <p>综上所述，描述性统计分析是数据分析的重要工具，可以帮助我们了解数据的基本特征和趋势，但在深入分析和推断方面有一定的局限性。</p>
+        <p style="font-size: 19px; font-weight: 600">描述性统计分析的常用方法</p>
+        <p>描述性统计分析是对数据进行总结和描述的过程，常用的方法包括：</p>
+        <li>中心趋势度量：包括均值（mean）、中位数（median）和众数（mode），用于描述数据的集中程度。</li>
+        <li>离散程度度量：包括方差（variance）、标准差（standard deviation）和极差（range），用于描述数据的离散程度。</li>
+        <li>分布形状度量：包括偏度（skewness）和峰度（kurtosis），用于描述数据的分布形状。</li>
+        <li>频数统计：通过频数表、频率分布表和直方图等方式，统计数据的频数和频率。</li>
+        <li>百分位数：用于描述数据中某个特定百分比的位置，如中位数、四分位数等。</li>
+        <li>相关性分析：通过计算相关系数（如Pearson相关系数）来衡量两个变量之间的相关性。</li>
+        <p style="font-size: 19px; font-weight: 600">描述性统计分析的应用场景</p>
+        <p>描述性统计分析在许多领域和应用场景中都有重要的作用，以下是一些常见的应用场景：</p>
+        <li>提供概览：描述性统计分析可以提供数据的概览，帮助我们了解数据的整体特征和规律。通过计算中心趋势测量（如均值、中位数、众数）、离散程度测量（如方差、标准差、极差）和分布形态测量（如偏度、峰度），我们可以得到数据的集中趋势、离散程度和分布形态等信息。</li>
+        <li>数据比较：描述性统计分析可以帮助我们比较不同组或不同时间点的数据。通过比较不同组的中心趋势、离散程度和分布形态等，我们可以了解不同组之间的差异和相似之处，从而得出结论或提出假设。</li>
+        <li>发现异常值：描述性统计分析可以帮助我们发现数据中的异常值。通过观察离群点（如极端值）和异常值（如异常观测值），我们可以发现数据中的异常情况，进而进行进一步的分析和处理。</li>
+        <li>数据可视化：描述性统计分析可以通过可视化方法（如直方图、散点图、箱线图等）将数据转化为图形，使得数据更加直观和易于理解。数据可视化可以帮助我们发现数据的分布模式、趋势和关联关系，从而更好地理解数据。</li>
+        <li>数据摘要：描述性统计分析可以通过频数和频率分布表、百分位数等方式对数据进行摘要和概括。这些摘要信息可以帮助我们对数据进行快速的了解和比较，从而支持后续的决策和分析。</li>
+        <li>假设检验：描述性统计分析可以为假设检验提供依据，通过对样本数据的描述性统计分析，我们可以判断样本数据是否符合某种假设分布，从而进行假设检验。</li>
+        <li>数据报告和展示：描述性统计分析可以提供数据的概括性描述，用于撰写数据报告和展示，帮助他人更好地理解数据的特征和趋势。</li>
+        <li>数据清洗：描述性统计分析可以帮助我们发现数据中的问题和错误。通过观察数据的分布情况和异常值，我们可以判断数据的质量，并进行必要的数据清洗和修正。</li>
+        <li>数据探索：描述性统计分析是探索性数据分析的一部分，它可以帮助我们发现数据中的模式、关联和趋势。通过观察数据的分布、散点图、相关系数等，我们可以发现数据中的隐藏信息和规律。</li>
+        <li>决策支持：描述性统计分析可以为决策提供支持。通过对数据的摘要和可视化，我们可以获取有关数据的重要信息，帮助决策者做出基于数据的决策。</li>
+        <p style="font-size: 19px; font-weight: 600">如何进行描述性统计分析</p>
+        <p>开展描述性统计分析可以按照以下步骤进行：</p>
+        <li>收集数据：首先，需要收集所需的数据，可以是通过调查问卷、实验、观察或从现有数据源获取。</li>
+        <li>数据清洗：对收集到的数据进行清洗，包括处理缺失值、异常值和错误数据等。</li>
+        <li>描述性统计：使用统计方法计算数据的基本统计量，如平均值、中位数、标准差等，以了解数据的集中趋势、离散程度和分布情况。</li>
+        <li>可视化展示：将统计结果以图表的形式进行可视化展示，如直方图、箱线图、散点图等，以更直观地呈现数据的特征和趋势。</li>
+        <li>解读分析结果：根据统计分析的结果，解读数据的含义和趋势，提取有用的信息和洞察，并进行合理的解释和推断。</li>
+        <p style="font-size: 19px; font-weight: 600">描述性统计分析的注意事项</p>
+        <p>在进行描述性统计分析时，有以下几个注意事项：</p>
+        <li>数据质量：确保数据的准确性和完整性。进行数据清洗，处理缺失值、异常值和重复值等，以保证分析结果的可靠性。</li>
+        <li>数据类型：根据数据的类型选择合适的统计方法和图表。对于定量数据，可以使用均值、标准差等统计量；对于定性数据，可以使用频数和百分比等统计量。</li>
+        <li>样本大小：考虑样本大小对统计结果的影响。样本较小可能导致统计结果不够准确，而样本较大可能会增加计算复杂度。</li>
+        <li>数据分布：了解数据的分布情况，选择合适的统计方法和图表。例如，对于正态分布的数据，可以使用均值和标准差进行描述；对于偏态分布的数据，可以使用中位数和四分位数等进行描述。</li>
+        <li>上下文和目的：考虑数据分析的上下文和目的。根据具体的问题和需求，选择合适的统计方法和图表，以便更好地解读数据和提取有价值的信息。</li>
+        <li>解读和推断：描述性统计分析主要是对数据进行概括和描述，不能进行推断和因果分析。在解读结果时，要注意避免过度解读和误导。</li>
+        <li>可视化呈现：使用合适的图表和图形将数据可视化，以便更好地传达数据的特征和趋势。选择简洁明了的图表，避免图表过于复杂和混乱。</li>
+      </div>
+    </template>
+  </pop-model>
 </template>
 <script setup>
 import * as portraitModel from "@/api/portraitModel";
@@ -204,7 +243,7 @@ const userStore = useUserStore();
 const algorithmStore = useAlgorithmStore();
 const multipleTableRef = ref(null);
 const b_introductionOfAlgorithmKnowledge = ref(false);
-const runResultShow=ref(false)
+const runResultShow = ref(false);
 const n_dataTableQuery = ref({
   index: 1,
   size: 5,
@@ -237,7 +276,7 @@ const modelParams = reactive([
     name: "标准误差",
   },
   {
-    name: "峰度;",
+    name: "峰度",
   },
   {
     name: "偏度",
@@ -256,7 +295,8 @@ const modelParams = reactive([
   },
 ]);
 const analysisData = ref([]);
-const analysisHanderKry = ref([]);
+const analysisHanderKry = ref([""]);
+
 const tableLabel = reactive([
   { prop: "average", label: "平均数" },
   { prop: "median", label: "中位数" },
@@ -339,6 +379,7 @@ const handleSelectionChange = (type) => {
 const submit = () => {
   if (g_indicatorData.value.length == 0) return proxy.$modal.msgWarning("请选择指标");
   marketingAlgorithmApi.getMarketingAlgorithm({ userId: n_dataTableQuery.value.userId, tableName: n_dataTableQuery.value.tableName, fieldList: g_indicatorData.value }).then((res) => {
+    analysisHanderKry.value.length = 0;
     analysisData.value = res.data;
     analysisHanderKry.value = Object.keys(res.data[0]);
     if (res.data.length > 5) {
@@ -355,20 +396,30 @@ const handlemodelSelectionChange = (type) => {
 };
 //计算
 const modelCalculation = () => {
-  if (analysisData.value.length == 0 && g_modelParameter.value.length == 0) {
+  if (analysisData.value.length == 0 || g_modelParameter.value.length == 0) {
     proxy.$modal.msgWarning("请先分析数据/未选择模型参数!");
     return;
   }
   const processedData = processArrayData(analysisHanderKry.value, analysisData.value);
-  marketingAlgorithmApi.getMarketingAlgorithmPreprocessing(JSON.stringify({ map: processedData, statistic: g_modelParameter.value, userId: n_dataTableQuery.value.userId })).then((res) => {
-    aOriginalDataOfAnalysisResults2.value = res.data;
-    tableData.value = res.data.map((item) => item.statistics);
-    if (res.data.length > 5) {
-      nNumberOfAnalysisResults.value = res.data.length;
-      aOriginalDataOfAnalysisResults.value = res.data.map((item) => item.statistics);
-      tableData.value = res.data.map((item) => item.statistics).slice(0, 5);
-    }
-  });
+  loading.value = true;
+  marketingAlgorithmApi
+    .getMarketingAlgorithmPreprocessing(JSON.stringify({ map: processedData, statistic: g_modelParameter.value, userId: n_dataTableQuery.value.userId }))
+    .then((res) => {
+      aOriginalDataOfAnalysisResults2.value = res.data;
+      tableData.value = res.data.map((item) => item.statistics);
+      if (res.data.length > 5) {
+        nNumberOfAnalysisResults.value = res.data.length;
+        aOriginalDataOfAnalysisResults.value = res.data.map((item) => item.statistics);
+        tableData.value = res.data.map((item) => item.statistics).slice(0, 5);
+      }
+      setTimeout(() => {
+        loading.value = false;
+        proxy.$modal.msgSuccess("计算成功");
+      }, 1000);
+    })
+    .catch((err) => {
+      loading.value = true;
+    });
 };
 function processArrayData(keys, data) {
   // 创建结果对象
@@ -393,7 +444,7 @@ const getIndicator = () => {
 };
 // 算法知识导入
 const knowledgeImport = () => {
-  runResultShow.value=true
+  runResultShow.value = true;
 };
 // 实训任务提交
 const submitTask = () => {
@@ -503,20 +554,21 @@ const download = () => {
 }
 .app-main {
   //   background-color: #f5f5f5;
-  min-height: 965px;
+  // min-height: 965px;
   margin: 5px 20px 0;
   height: 100%;
   display: flex;
-  overflow: auto;
+  // overflow: auto;
   .main-left {
     //水平居中
     flex-direction: column;
-    min-height: 965px;
+    // min-height: 965px;
     display: flex;
     width: 205px;
     height: 100%;
     background: #041c49;
-    padding: 0px 10px;
+    // padding: 0px 10px;
+    padding-left: 10px;
     .left-top {
       padding: 10px;
       span {
@@ -557,9 +609,9 @@ const download = () => {
     }
   }
   .main-right {
-    width: 1639px;
+    width: 100%;
     // height: 100%;
-    padding: 20px;
+    // padding: 20px;
     border: 1px solid #0452c6;
     :deep(.el-table__header) {
       .el-table__cell {
@@ -621,4 +673,8 @@ const download = () => {
 .dialog-footer {
   margin-bottom: 20px;
 }
-</style>
\ No newline at end of file
+:deep(.pagination-container .el-pagination) {
+  // 去除定位
+  position: static;
+}
+</style>
diff --git a/src/views/digitalMarketingAlgorithms/components/emotion-analysis.vue b/src/views/digitalMarketingAlgorithms/components/emotion-analysis.vue
index a34e331..54a4371 100644
--- a/src/views/digitalMarketingAlgorithms/components/emotion-analysis.vue
+++ b/src/views/digitalMarketingAlgorithms/components/emotion-analysis.vue
@@ -181,13 +181,33 @@
       </div>
     </template>
   </el-dialog>
+  <popModel :showModel="b_algorithmKnowledge" title="情感分析" @closePop="b_algorithmKnowledge = false">
+    <template v-slot:content>      
+      <!-- 情感分析 -->
+      <div>
+            <p style="font-weight: 700;font-size:22px">总览</p><p>文本分析指对文本数据进行表示 (representation)，处理(processing)和建模(modeling)来获得有用的见解(insight)。<br />文本分析的一个挑战是高维度(high dimensionality)。<br /><br />语料库: 指在自然语言处理中用于各种目的的大量文本(文档)集合。<br /><br />另一个挑战是: 大多数情况下文本是非结构化数据(not structured)。</p><img src="@/assets/images/f4001.png" alt=""><p style="font-weight: 700;font-size:22px">文本分析步骤</p><p>&nbsp;&nbsp;&nbsp;&nbsp;1.句法分析(Parsing): 是指处理非结构化文本使其具有一定的结构，供将来分析的过程。句法分析将文本进行解构，然后以一种更为结构化的方式来呈现。(unsturctured -> sturctured)<br />&nbsp;&nbsp;&nbsp;&nbsp;2.搜索和检索 (Search and retrieval): 在一个语料库中识别包含例如特殊单词，短语，主题或者实体(如人或组织)等搜索项(search items)的文档。这些搜索项通常称为关键术语 (key term)。<br />&nbsp;&nbsp;&nbsp;&nbsp;3.文本挖掘 (text mining): 指使用前两步产生的术语和索引来发现与感兴趣领域或问题相关的有意义的见解(discover meaningful insights)。<br />聚类(clustering) 和 分类 (classification) 都可以应用于文本挖掘。比如：将文档聚化成簇 或者 分类文本以进行情感分析(sentiment analysis)。<br />文本挖掘可以利用来自各个研究领域的方法和技术，如统计分析(statistical analysis)，信息检索(information retrieval)，数据挖掘(data mining)和自然语言处理(natural language processing)等。</p>
+            <p style="font-weight: 700;font-size:22px">挑战</p><li>语法(syntax): 涉及句子结构和语法规则。</li><li>语义(semantics): 是对句子含义的研究。</li><li>语用(pragmatic): 关注特定上下文中句子的含义。</li><li>同义词(homonyms): 具有相同拼写但含义不同的单词。</li><li>缩写词(acronyms): 是单词的缩写形式。</li><p>对于计算机来说，文本只是编码和数字的字符序列(sequence of characters)。它不了解语法，语义(semantic meanings)和其实用含义(pragmatic meaning)。<br />同时，在原始形式中，单词或者文本之间没有自然相似性度量(nature similarity metric)。(因此难以执行聚类或分类)<br />因此，我们需要以适合用于聚类和分类的形式来表示和处理文本。</p><p style="font-weight: 700;font-size:22px">第一步：收集原始文本数据(Collecting Raw Text)</p><p>对于文本分析来说，进行任何事情之前必须先收集数据。</p>
+            <li>可以在许多网站上对用户生成的内容(user-generated contents)开始积极的监控。（可以使用公开的API, 网页爬虫 web scraper/crawler）</li><li>准备处理非结构化或者半结构化数据。</li><p style="font-weight: 700;font-size:22px">第二步：表示文本 (Representing Text)</p><p>使用文本规范化的技术(text normalization techniques)对原始文本进行转化。</p><li>分词 (tokenization): 指从文本正文中分离(也叫做标记)单词 (seperating words)。</li><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;1.按空格(spaces)来分词。(可能会把标点符号也给分出来，比如 day. )<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2.基于标点符号和空格来分词 (可能会把 we’ll, can’t, state-of-the-art 等直接分开)<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;分词比想象中更困难 (résumé 和 resume)<br />没有一个分词器适用于每一种情形(no one-size-fits-all)。</p><li>大小写转换 (case folding): 将所有的字母都变成小写(或者都变成大写)。</li>
+            <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;1.但是在一些情况下可能会出错: 如专有名词，缩写，公司名等(General Motors; WHO; US;)<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2.减少错误的方法是对不进行大小写转换的单词建立一个查找表(lookup table)。</p><li>停止词(stop word): 在给定语言中，并非所有的单词都需要被考虑。(比如：the, a, of, and, to等这些不太可能有助于语义的理解)</li><li>词根法(Lemmatization)和词干法(Stemming): 词根法看单词的意义(如: Goose, geese, goose, gander, ganders)。词干法看单词的组成(如：walk, walking, Walk, walks, walked)。最受欢迎的是"Porter stemmer", “WordNet”。</li><li>词袋法(Bag-of-words representation): 将文档转化成高维向量(high-dimensional vector)，向量指示了文档中各个单词的 存在/不存在/出现频率(presence/absence/frequency)。</li><img src="@/assets/images/f4002.png" alt=""><p>词袋法足够简单(朴素且过分简化问题 naive and over-simplified) 并被广泛应用于文本分析问题中 (是入门的好方法)。其将文档表示为一组词语(单词)，而忽略了其他信息(如顺序 order，上下文 context，推论 inferences和语义 semantics)。比如，“a dog bites a man” 和 "a man bites a dog"意思完全不同但是他们在词袋法里是同一种表示。</p>
+            <li>语料库的表示(Representation of a corpus): 语料库可以大到包括一种或者多种语言的所有文档，也可以小到仅限于特定领域(focused on a specific domains)。</li><p>大多数语料库都具有元数据，比如语料库的大小以及文本提取的领域。某些语料库包含了文本中出现的每个词的信息内容(Information content, IC)。信息内容是用来表示语料库中词语重要性(importance of a term)的度量。IC值较高的词语的重要性要比IC值较低的词语高。<br />然而，信息内容无法满足分析动态改变的非结构化数据的需求。问题：传统语料库和IC元数据都无法随着时间改变，因此任何语料库中不存在的词汇和任何新发明的词汇都会自动得到0的IC值。其次，传统语料库限制了用于文本分析算法 (text analysis algorithm) 的全部知识(语料库代表了整个知识库)。</p><p style="font-weight: 700;font-size:22px">第三步：词频-逆文档频率(TFIDF - Term Frequency - Inverse Document Frequency)</p><p style="font-weight: 600;font-size:18px">词频 (Term Frequency)</p><p>我们需要一个适应文本上下文(context)和性质(nature)的度量标准 metric (不像IC一样)。<br />TFIDF直接作用于所有获取的文档(fetched documents)。一旦获取的文档发生更改，TFIDF可以被轻松更新。TFIDF是一种广泛用于文本分析的措施。TFIDF对动态内容的处理也是相当强大且有效的，因为文档的变化只需要更新频率计数。<br />
+              给定一个单词 t 以及一个包含 n 个词的文档 d = {t1, t2, …, tn}。在 d 中 t 最简单的词频形式可以定义为 t 在 d 中出现的次数。</p><img src="@/assets/images/f4003.png" alt=""><p>可以对词频函数取对数，以获得更多数据细节。</p><img src="@/assets/images/f4005.png" alt=""><p>对于长文档，因为其包含的词语数量和种类多，因此往往有更高的词频值。这些因素导致了长文档的词频值的提升，以至于人们对长文档产生了偏见。为了解决这个问题，可以对词频进行规范化。</p><img src="@/assets/images/f4006.png" alt=""><p>Zipf’s Law：第 i 个最常见的单词出现在最常见词的 1/i 处。</p><p style="font-weight: 600;font-size:18px">Term Frequency 问题</p><p>词语的重要性仅取决于其在特定文档中的存在。如果该词语频繁出现在每个文档中怎么办？这个词还重要吗？我们需要拓宽我们的视野，不仅要在单个文档中，而是要在整个语料库中考虑一个词语的重要性。</p><p style="font-weight: 600;font-size:18px">词语的文档频率 (Document Frequency of a term)</p><p>文档频率被定义为语料库中包含一个词语的文档的数目。假设语料库D包含N个文档。语料库D={d1, d2, …, dn}中词语 t 的文档频率的定义为：</p><img src="@/assets/images/f4007.png" alt=""><p style="font-weight: 600;font-size:18px">逆文档频率 (Inverse Document Frequency)</p><p>逆文档频率的定义，N代表了语料库的总文档数，DF(t) 代表单词 t 的文档频率。逆文档频率就是他们的商取对数得到。</p>
+              <img src="@/assets/images/f4008.png" alt=""><p>如果词语不在语料库内，会导致分母为零，快速解决的方法是在分母上加个1。</p><img src="@/assets/images/f4009.png" alt=""><p>拥有较高IDF的词往往在整个语料库中更重要。罕见单词的IDF会很高。高频单词的IDF会很低。<br />警告，因为语料库中所有文档数目(N)是保持恒定的，因此IDF仅取决于DF，那些DF值最低的词获得相同的最高IDF。因此，有必要引入更多权重词来对文档中出现次数相同的词进行区分。</p><p style="font-weight: 600;font-size:18px">TFIDF</p><p>是一种既考虑词在单个文档中的普及率 prevalence (TF)，也考虑他在整个语料库中的稀缺程度 scarcity (IDF)的评估方法。词语 t 在文档 d 中的TFIDF 定义为 d 中 t 的词频 乘以语料库中 t 的文档频率，如下公式：</p><img src="@/assets/images/f4010.png" alt=""><p>一个词的TFIDF值越高，它在一个文档中出现的就越频繁，但在语料库的所有文档中出现得就越少。<br />TFIDF在简单和直接的计算中是很有效的，因为它不需要文本含义的相关知识。文档 d 被表示为 TFIDF(t, d)值 的高维向量 (high-dimensional vector)。<br /><br />TFIDF方法减少描述长度的数量相对较少，同时其很难揭示文档内或文档之间(intra-document or inter-document)的统计结构。<br />主题建模(Topic Modelling)能够解决这个问题。主题(topic): 经常在一起出现的具有相关含义的单词簇(a cluster of words)。每个词在主题中都有权重。</p>
+              <p style="font-weight: 700;font-size:22px">第四步：主题建模(Topic Modelling)</p><p>主题建模提供了文档的简短描述。同时，它也提供了自动组织，搜索，理解并汇总大量信息的工具。主题建模是统计模型，它研究一组文档中的单词，确定文档主题，并发现主题是如何相关(associated)或者如何随时间变化的(change over time)。</p><p style="font-weight: 600;font-size:18px">流程</p><p>&nbsp;&nbsp;&nbsp;&nbsp;1.揭开(uncover)语料库中隐藏的主题模式(hidden topical patterns)。<br />&nbsp;&nbsp;&nbsp;&nbsp;2.根据这些主题来注释文档(annotate document)。<br />&nbsp;&nbsp;&nbsp;&nbsp;3.使用注释来组织，搜索，汇总文档(organize, search, summarise)。</p><p style="font-weight: 600;font-size:18px">主题(topic)</p><p>一个主题被正式定义为固定单词词汇分布(a distribution over a fixed vocabulary of words)。不同的主题在相同的词汇上会有不同的分布。词汇中的某个词可以在多个主题中有不同的权重。<br />一个文档通常由多个主题以不同的比例贯穿文本。</p><p style="font-weight: 600;font-size:18px">LDA</p><p>最简单的主题模型是Latent Dirichlet Allocation(LDA)，这是一个语料库的生成概率模型(generative probabilistic model of a corpus)。在生成概率模型中，从概率密度函数 (probability density function) 得出模型观测值 (model observation)。在LDA中，文档被视为生成过程 (generative process) 的结果(带有隐藏变量 hidden variables)。<br />LDA假设了：<br /></p><li>有一个固定的词汇表 (fixed vocabulary of words)。</li>
+              <li>潜在主题 (latent topics) 的数目是预定义的。</li><li>每个潜在主题的特征都是词汇表中单词的分布(Dirichlet distribution)。</li><li>每个文档表示潜在主题的一个随机混合(random mixture)。</li><p style="font-weight: 600;font-size:18px">LDA流程</p><p>&nbsp;&nbsp;&nbsp;&nbsp;1.选择文档的长度N。<br />&nbsp;&nbsp;&nbsp;&nbsp;2.每个文档有一个在主题上的分布。<br />&nbsp;&nbsp;&nbsp;&nbsp;3.为文档中的每个词分配一个主题，并选择相应的主题中的单词。<br /><br />在现实中，只有文档是可用(available)的。LDA的目标是为每一个文档推断潜在的主题(underlying topic)，主题比例 (topic proportion) 以及主题分配 (topic assignment)。</p><p style="font-weight: 600;font-size:18px">算法</p><p>&nbsp;&nbsp;&nbsp;&nbsp;1.选择一个值 k。<br />&nbsp;&nbsp;&nbsp;&nbsp;2.对于每个文档，将文档中的每个单词随机分配给k个主题之一。<br />&nbsp;&nbsp;&nbsp;&nbsp;对于每个文档 d，遍历每个单词 w，然后计算 d 中分配给主题 t 的单词所占的比例，通常会应用平滑(smoothing)处理：</p><img src="@/assets/images/f4011.png" alt=""><p>&nbsp;&nbsp;&nbsp;&nbsp;4.计算从单词w来的所有文档中对主题 t 的分配比例 P(w | t)<br />&nbsp;&nbsp;&nbsp;&nbsp;5.计算属于主题 t 的单词 w 的概率：</p><img src="@/assets/images/f4012.png" alt=""> <p style="font-weight: 600;font-size:18px">注意事项</p> <p>LDA将文档视为主题的混合体。<br />LDA将主题视为单词的混合体。<br />如果单词 w 很有可能出现在主题 t 中，则所有带有 w 的文档将与主题 t 的关联更为紧密。<br />
+                如果单词 w 不太可能出现在主题 t 中，则包含 w 的文档出现在 t 中的可能性将会很小。因为文档 d 中剩余的单词将出现在其他主题中，因此 d 有更高的可能性属于那些主题。因此，就算我们将 w 添加到 t 中，也不会将很多该类文档带到 t 。</p><p style="font-weight: 600;font-size:18px">应用</p><p>主题模型可以被用于文档建模(document modelling)，文档分类(document classification)与协同过滤(collaborative filtering)。<br />主题模型不仅可以应用于文本数据，它还可以用于注释图像。</p><p style="font-weight: 700;font-size:22px">情感分析 (Sentiment Analysis)</p><p>情感分析使用统计和自然语言处理来从文本中挖掘观点来识别并抽取主观信息。<br />应用： 检测产品或者电影的评论的极性(polarity of reviews)。<br /><br />分析层面包括了文档层面(document)，语句层面(sentence)，短语层面(phrase)，和短文层面(short-text)。<br /><br />分类方法(朴素贝叶斯，最大熵，或者支持向量机SVM) 经常被用来提取语料库统计以用于情感分析。</p><img src="@/assets/images/f4013.png" alt=""><p>分类器仅基于对其进行训练的数据集来确定情感：</p><li>词义随着领域不同而改变。</li><li>因此模型无法直接应用于其他领域。</li><p>绝对的情感水平无法提供信息，应该建立一条基线，然后将其与观察值比较。比如，一个产品拥有40%正面推文，60%负面推文，貌似是不成功的。但是如果其他类似的成功产品也有类似的正负面百分比，那么不应该认为该产品是不成功的。<br /><br />如何对大量评论添加标签(积极，消极，中立):<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;1.使用表情符号 (小心阴阳怪气)<br />
+                  &nbsp;&nbsp;&nbsp;&nbsp;2.使用 Amazon Mechanical Turk 互联网众包市场，将上标签工作外包出去。</p><p style="font-weight: 700;font-size:22px">获得结果(gaining insights)</p><p style="font-weight: 600;font-size:18px">词云(word cloud)</p><p>五星好评的词云</p><img src="@/assets/images/f4015.png" alt=""><p>一星差评的词云：</p><img src="@/assets/images/f4016.png" alt=""><p>TFIDF能够用来凸显评论中有信息量的单词。</p> <img src="@/assets/images/f4017.png" alt=""><p>LDA可以把评论归类为主题。圆盘的大小代表了词的权重。</p><img src="@/assets/images/f4018.png" alt=""><p>另一种可视化方式。</p><img src="@/assets/images/f4019.png" alt=""> 
+          </div>
+    </template>
+  </popModel>
 </template>
 <script setup>
+import popModel from "@/views/components/popModal.vue";
+
 import { paginate } from "@/utils/index.js";
 import * as echarts from "echarts";
 import * as XLSX from "XLSX";
-// import "echarts-wordcloud/dist/echarts-wordcloud";
-// import "echarts-wordcloud/dist/echarts-wordcloud.min";
+import "echarts-wordcloud/dist/echarts-wordcloud";
+import "echarts-wordcloud/dist/echarts-wordcloud.min";
 import * as portraitModel from "@/api/portraitModel";
 import * as API from "@/api/AI.js";
 import * as marketingAlgorithmApi from "@/api/marketing-algorithm.js";
@@ -195,6 +215,8 @@ import html2canvas from "html2canvas";
 import useAlgorithmStore from "@/store/modules/algorithm.js";
 import useUserStore from "@/store/modules/user";
 import { getUserInfo } from "@/utils/auth";
+// 算法知识
+const b_algorithmKnowledge=ref(false)
 const userInfo = JSON.parse(getUserInfo());
 const loading = ref(false);
 const loading2 = ref(false);
@@ -361,7 +383,7 @@ const getIndicator = () => {
 };
 // 算法知识导入
 const knowledgeImport = () => {
-  b_introductionOfAlgorithmKnowledge.value = true;
+  b_algorithmKnowledge.value = true;
 };
 // 实训任务提交
 const submitTask = () => {
@@ -470,32 +492,37 @@ const sentimentAnalysis = () => {
   }
   if (g_analyzeTheNumberOfDataItems.value == "") return proxy.$modal.msgWarning("请先选择指标/手动输入进行情感分析!");
   loading.value = true;
-  marketingAlgorithmApi.getMarketingAlgorithmSentiment({ id: s_commentType.value, userId: n_dataTableQuery.value.userId, content: g_analyzeTheNumberOfDataItems.value, modelType: preProcessText.value.text3 == "词云生成" ? "词频分析" : preProcessText.value.text3 }).then((res) => {
-    if (preProcessText.value.text3 === "词云生成") {
-      nOriginalWordFrequency.value = res.data;
-      initChart();
-    } else if (preProcessText.value.text3 === "词频分析") {
-      nOriginalWordFrequency.value = res.data;
-      aWordFrequency.value = res.data.slice(0, 5);
-      nOriginalWordFrequencyNum.value = res.data.length;
-    } else if (preProcessText.value.text3 === "情感倾向分析") {
-      g_emotionAnalysisinfo = JSON.parse(res.data);
-      g_emotionAnalysis.value = JSON.parse(res.data)?.items[0]?.sentiment;
-      n_emotiveTendency.value = Math.round(g_emotionAnalysisinfo.items[0].positive_prob * 100);
-    } else {
-      aCommentOpinion.value = JSON.parse(res.data).items.reduce((groups, item) => {
-        // 如果该 sentiment 的组不存在，则创建
-        if (!groups[item.sentiment]) {
-          groups[item.sentiment] = [];
-        }
-        // 将 item 加入到相应的组中
-        groups[item.sentiment].push(item);
-        return groups;
-      }, {});
-    }
-    loading.value = false;
-    proxy.$modal.msgSuccess("分析成功");
-  });
+  marketingAlgorithmApi
+    .getMarketingAlgorithmSentiment({ id: s_commentType.value, userId: n_dataTableQuery.value.userId, content: g_analyzeTheNumberOfDataItems.value, modelType: preProcessText.value.text3 == "词云生成" ? "词频分析" : preProcessText.value.text3 })
+    .then((res) => {
+      if (preProcessText.value.text3 === "词云生成") {
+        nOriginalWordFrequency.value = res.data;
+        initChart();
+      } else if (preProcessText.value.text3 === "词频分析") {
+        nOriginalWordFrequency.value = res.data;
+        aWordFrequency.value = res.data.slice(0, 5);
+        nOriginalWordFrequencyNum.value = res.data.length;
+      } else if (preProcessText.value.text3 === "情感倾向分析") {
+        g_emotionAnalysisinfo = JSON.parse(res.data);
+        g_emotionAnalysis.value = JSON.parse(res.data)?.items[0]?.sentiment;
+        n_emotiveTendency.value = Math.round(g_emotionAnalysisinfo.items[0].positive_prob * 100);
+      } else {
+        aCommentOpinion.value = JSON.parse(res.data).items.reduce((groups, item) => {
+          // 如果该 sentiment 的组不存在，则创建
+          if (!groups[item.sentiment]) {
+            groups[item.sentiment] = [];
+          }
+          // 将 item 加入到相应的组中
+          groups[item.sentiment].push(item);
+          return groups;
+        }, {});
+      }
+      loading.value = false;
+      proxy.$modal.msgSuccess("分析成功");
+    })
+    .catch((err) => {
+      loading.value = false;
+    });
 };
 // 清空
 const clear = () => {
diff --git a/src/views/digitalMarketingAlgorithms/components/regressionAnalysis.vue b/src/views/digitalMarketingAlgorithms/components/regressionAnalysis.vue
index 7a0beaa..41358f5 100644
--- a/src/views/digitalMarketingAlgorithms/components/regressionAnalysis.vue
+++ b/src/views/digitalMarketingAlgorithms/components/regressionAnalysis.vue
@@ -1,698 +1,787 @@
 <template>
-    <el-scrollbar ref="scrollbar" height="800px">
-      <div class="main-top">
-          <span style="font-weight: bold;font-size: 18px;color: #3596EB;">任务描述</span>
-          <p style="font-weight: 400;font-size: 12px;color: #E6E6E6;">（给出任务清单参考，做哪些数据的统计分析）Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget.</p>
-      </div>
-      <div class="main-but">
-            <el-button @click="runResultShow=true"><img src="../../../assets/images/导入.png" alt="">算法知识导入</el-button>
-          <el-button  @click="taskSubmit"><img src="../../../assets/images/提交.png" alt="">实训任务提交</el-button>
-      </div>
-      <div class="app-main">
-        <div class="main-left">
-          <div>
-              <div class="left-top">
+  <el-scrollbar ref="scrollbar" height="800px">
+    <div class="main-top">
+      <span style="font-weight: bold; font-size: 18px; color: #3596eb">任务描述</span>
+      <p style="font-weight: 400; font-size: 12px; color: #e6e6e6">（给出任务清单参考，做哪些数据的统计分析）Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget.</p>
+    </div>
+    <div class="main-but">
+      <el-button @click="runResultShow = true">
+        <img src="../../../assets/images/导入.png" alt="" />
+        算法知识导入
+      </el-button>
+      <el-button @click="taskSubmit">
+        <img src="../../../assets/images/提交.png" alt="" />
+        实训任务提交
+      </el-button>
+    </div>
+    <div class="app-main">
+      <div class="main-left">
+        <div>
+          <div class="left-top">
             <span>一、选择指标</span>
           </div>
           <div class="metrics">
-              <el-select v-model="input" placeholder="请选择" style="width: 180px" @change="optionData">
-                  <el-option
-                      v-for="item in options"
-                      :key="item.value"
-                      :label="item.label"
-                      :value="item.value"
-                  />
-              </el-select>
+            <el-select v-model="input" placeholder="请选择" style="width: 180px" @change="optionData">
+              <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
           </div>
           <div class="metrics-table" style="margin-top: 10px">
-              <el-table border :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange" >
-                  <el-table-column type="selection" label="Date" align="center"  :selectable="flag"/>
-                  <el-table-column prop="text" label="指标"  align="center"/>
-              </el-table>
-              <el-button @click="taskZB">确定</el-button>
+            <el-table border :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange">
+              <el-table-column type="selection" label="Date" align="center" :selectable="flag" />
+              <el-table-column prop="text" label="指标" align="center" />
+            </el-table>
+            <el-button @click="taskZB">确定</el-button>
           </div>
-          <div class="left-top" style="margin-top:50px">
+          <div class="left-top" style="margin-top: 50px">
             <span>二、数据预处理</span>
           </div>
           <div class="metrics">
-              <el-select v-model="input2" @change="optionData2" placeholder="请选择" style="width: 180px">
-                  <el-option
-                      v-for="item in options2"
-                      :key="item.value"
-                      :label="item.label"
-                      :value="item.value"
-                  />
-              </el-select>
+            <el-select v-model="input2" @change="optionData2" placeholder="请选择" style="width: 180px">
+              <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
           </div>
-          <div class="metrics" style="margin-top:15px">
-              <el-select v-model="input3" @change="optionData2" placeholder="请选择" style="width: 180px">
-                  <el-option
-                      v-for="item in options3"
-                      :key="item.value"
-                      :label="item.label"
-                      :value="item.value"
-                  />
-              </el-select>
+          <div class="metrics" style="margin-top: 15px">
+            <el-select v-model="input3" @change="optionData2" placeholder="请选择" style="width: 180px">
+              <el-option v-for="item in options3" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
           </div>
           <div class="left-top" style="margin-top: 50px">
             <span>三、模型参数设置</span>
           </div>
           <div class="metrics-table" style="margin-top: 10px">
-              <span style="font-weight: 400;font-size: 12px;color: #FFFFFF;">
-                聚类方法：
-              </span>
-              <div class="metrics" style="margin-top:10px">
-                    <el-select v-model="input4" placeholder="请选择" style="width: 180px">
-                        <el-option
-                            v-for="item in options4"
-                            :key="item.value"
-                            :label="item.label"
-                            :value="item.value"
-                        />
-                    </el-select>
-                </div>
-                <div class="metrics2" style="margin-top:10px;">
-                    <span style="font-weight: 400;font-size: 12px;color: #FFFFFF;">
-                        Y变量选择：
-                    </span>
-                    <!-- <el-input v-model="input5" style="width: 160px;margin-top:5px"/> -->
-                    <el-select v-model="input5" multiple placeholder="请选择" style="width: 180px">
-                        <el-option
-                            v-for="item in option5"
-                            :key="item.value"
-                            :label="item.label"
-                            :value="item.value"
-                        />
-                    </el-select>
-                </div>
-                <div class="metrics2" style="margin-top:10px;">
-                    <span style="font-weight: 400;font-size: 12px;color: #FFFFFF;">
-                        X变量选择:
-                    </span>
-                    <!-- <el-input v-model="input6" style="width: 160px;margin-top:5px"/> -->
-                    <el-select v-model="input6" multiple placeholder="请选择" style="width: 180px">
-                        <el-option
-                            v-for="item in option5"
-                            :key="item.value"
-                            :label="item.label"
-                            :value="item.value"
-                        />
-                    </el-select>
-                </div>
-              <el-button @click="computation">计算</el-button>
-          </div>
-          </div>
-  <div style="margin-top: auto;">
-      <div class="startOver" @click="startOver()">
-              <img src="../../../assets/images/重新开始.png" alt="">
-              <span>重新开始</span>
+            <span style="font-weight: 400; font-size: 12px; color: #ffffff">聚类方法：</span>
+            <div class="metrics" style="margin-top: 10px">
+              <el-select v-model="input4" placeholder="请选择" style="width: 180px">
+                <el-option v-for="item in options4" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </div>
+            <div class="metrics2" style="margin-top: 10px">
+              <span style="font-weight: 400; font-size: 12px; color: #ffffff">Y变量选择：</span>
+              <!-- <el-input v-model="input5" style="width: 160px;margin-top:5px"/> -->
+              <el-select v-model="input5" multiple placeholder="请选择" style="width: 180px">
+                <el-option v-for="item in option5" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </div>
+            <div class="metrics2" style="margin-top: 10px">
+              <span style="font-weight: 400; font-size: 12px; color: #ffffff">X变量选择:</span>
+              <!-- <el-input v-model="input6" style="width: 160px;margin-top:5px"/> -->
+              <el-select v-model="input6" multiple placeholder="请选择" style="width: 180px">
+                <el-option v-for="item in option5" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </div>
+            <el-button @click="computation">计算</el-button>
           </div>
-  </div>
-         
         </div>
-        <div class="main-right">
-          <div>
-              <span style="font-weight: bold;font-size: 18px;color: #3596EB;">分析数据：</span>
-              <el-table :data="tableData2"  style="width: 94%;margin-top:10px" :header-cell-style="headerCellStyle" height="350">
-                  <el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center"/>
-              </el-table>
-              <el-pagination style="margin-top:10px" background layout="prev, pager, next" :total="1000" />
-          </div>
-          <div class="analysisResults" style="margin-top: 20px">
-              <span style="font-weight: bold;font-size: 18px;color: #3596EB;display: block;">分析结果：</span>
-              <el-button class="imgBtn" v-if="flagUP" @click="upLoad">下载</el-button>
-              <el-table :data="tableData3" ref="exportTableRef" row-key="TSuid" style="width: 94%;margin-top:10px" :header-cell-style="headerCellStyle" height="350">
-                  <el-table-column v-for="column in tableLabel2" :key="column.prop" :prop="column.prop" :label="column.label" align="center"/>
-                  <el-table-column v-if="flagColumn" label="预测" align="center">
-                      <template #default="scope">
-                          <el-button type="primary" link @click="handleClick(scope.row)" v-if="predictionResults===''">预测</el-button>
-                          <span v-else>{{predictionResults}}</span>
-                      </template>
-                  </el-table-column>
-              </el-table>
+        <div style="margin-top: auto">
+          <div class="startOver" @click="startOver()">
+            <img src="../../../assets/images/重新开始.png" alt="" />
+            <span>重新开始</span>
           </div>
         </div>
       </div>
-    </el-scrollbar>
-  
-    <el-dialog
-      v-model="dialogVisible"
-      title="实训任务提交"
-      width="600"
-      custom-class="dialogClass"
-      :show-close="false"
-    >
-    <template #header="{ close, titleId, titleClass }">
-        <div class="my-header">
-          <span :id="titleId" :class="titleClass">实训任务提交</span>
-         <img class="gbImg" src="../../../assets/images/关闭.png" @click="close" alt="">
+      <div class="main-right">
+        <div>
+          <span style="font-weight: bold; font-size: 18px; color: #3596eb">分析数据：</span>
+          <el-table :data="tableData2" style="width: 94%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
+            <el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center" />
+          </el-table>
         </div>
-        <img class="xtImg" src="../../../assets/images/线条.png" alt="">
-      </template>
-      <div class="from-item">
-          <el-form :inline="true" label-position="right" label-width="115px" :model="form" class="demo-form-inline">
-              <el-form-item label="聚类个数：">
-                  <el-input style="width: 120px;" v-model="formInline.user" clearable />
-              </el-form-item>
-              <el-form-item label="最大迭代次数：">
-                  <el-input style="width: 120px;" v-model="formInline.user" clearable />
-              </el-form-item>
-            </el-form>
-              <span style="color:#FFFFFF;font-weight: 700;">各簇类特征描述：</span>
-            <el-form :inline="true" label-position="right" style="margin:15px 0" label-width="115px" :model="form" class="demo-form-inline">
-              <el-form-item label="簇类1:">
-                  <el-input style="width: 240px;" v-model="formInline.user" clearable />
-              </el-form-item>
-              <el-form-item label="簇类2:">
-                  <el-input style="width: 240px;" v-model="formInline.user" clearable />
-              </el-form-item>
-              <el-form-item label="簇类3:">
-                  <el-input style="width: 240px;" v-model="formInline.user" clearable />
-              </el-form-item>
-              <el-form-item label="簇类4:">
-                  <el-input style="width: 240px;" v-model="formInline.user" clearable />
-              </el-form-item>
-              </el-form>
-      </div>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button @click="dialogVisible = false">确定</el-button>
-          <el-button type="primary" @click="dialogVisible = false">
-            返回
-          </el-button>
+        <div class="analysisResults" style="margin-top: 20px">
+          <span style="font-weight: bold; font-size: 18px; color: #3596eb; display: block">分析结果：</span>
+          <el-button class="imgBtn" v-if="flagUP" @click="upLoad">下载</el-button>
+          <el-table :data="tableData3" ref="exportTableRef" row-key="TSuid" style="width: 94%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
+            <el-table-column v-for="column in tableLabel2" :key="column.prop" :prop="column.prop" :label="column.label" align="center" />
+            <el-table-column v-if="flagColumn" label="预测" align="center">
+              <template #default="scope">
+                <el-button type="primary" link @click="handleClick(scope.row)" v-if="predictionResults === ''">预测</el-button>
+                <span v-else>{{ predictionResults }}</span>
+              </template>
+            </el-table-column>
+          </el-table>
         </div>
-      </template>
-    </el-dialog>
+      </div>
+    </div>
+  </el-scrollbar>
 
-    <el-dialog
-      v-model="dialogVisible2"
-      title="预测"
-      width="400"
-      custom-class="dialogClass"
-      :show-close="false"
-    >
+  <el-dialog v-model="dialogVisible" title="实训任务提交" width="600" custom-class="dialogClass" :show-close="false">
     <template #header="{ close, titleId, titleClass }">
-        <div class="my-header">
-          <span :id="titleId" :class="titleClass">预测</span>
-         <img class="gbImg" src="../../../assets/images/关闭.png" @click="close" alt="">
-        </div>
-        <img class="xtImg" src="../../../assets/images/线条.png" alt="">
-      </template>
-      <div class="from-item">
-          <el-form :inline="true" label-position="right" label-width="50px" :model="form" class="demo-form-inline">
-              <el-form-item label="x：">
-                  <el-input style="width: 225px;" v-model="formInline2.user" clearable placeholder="请输入x， 多个以英文逗号隔开" />
-              </el-form-item>
-            </el-form>
+      <div class="my-header">
+        <span :id="titleId" :class="titleClass">实训任务提交</span>
+        <img class="gbImg" src="../../../assets/images/关闭.png" @click="close" alt="" />
       </div>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button @click="Forecasting">确定</el-button>
-        </div>
-      </template>
-    </el-dialog>
+      <img class="xtImg" src="../../../assets/images/线条.png" alt="" />
+    </template>
+    <div class="from-item">
+      <el-form :inline="true" label-position="right" label-width="115px" :model="form" class="demo-form-inline">
+        <el-form-item label="聚类个数：">
+          <el-input style="width: 120px" v-model="formInline.user" clearable />
+        </el-form-item>
+        <el-form-item label="最大迭代次数：">
+          <el-input style="width: 120px" v-model="formInline.user" clearable />
+        </el-form-item>
+      </el-form>
+      <span style="color: #ffffff; font-weight: 700">各簇类特征描述：</span>
+      <el-form :inline="true" label-position="right" style="margin: 15px 0" label-width="115px" :model="form" class="demo-form-inline">
+        <el-form-item label="簇类1:">
+          <el-input style="width: 240px" v-model="formInline.user" clearable />
+        </el-form-item>
+        <el-form-item label="簇类2:">
+          <el-input style="width: 240px" v-model="formInline.user" clearable />
+        </el-form-item>
+        <el-form-item label="簇类3:">
+          <el-input style="width: 240px" v-model="formInline.user" clearable />
+        </el-form-item>
+        <el-form-item label="簇类4:">
+          <el-input style="width: 240px" v-model="formInline.user" clearable />
+        </el-form-item>
+      </el-form>
+    </div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="dialogVisible = false">确定</el-button>
+        <el-button type="primary" @click="dialogVisible = false">返回</el-button>
+      </div>
+    </template>
+  </el-dialog>
 
-    <pop-model
-      :showModel="runResultShow"
-      title="关联规则挖掘"
-      @closePop="runResultShow = false"
-    >
-      <template v-slot:content>
-        <div>
-          <p style="font-weight: 700;font-size:22px">变量间的关系的度量</p><p style="font-size:19px;font-weight:600">变量间的关系</p><li>函数关系：设有两个x和y，y随x一起变化，并完全依赖于x，y是x的函数，y = f ( x ) y = f(x)y=f(x)，x为自变量，y为因变量。</li><li>相关关系：变量之前存在的不确定的关系称为相关关系。</li><p>&nbsp;&nbsp;&nbsp;1.一个变量的取值不能由另一个变量唯一确定<br />&nbsp;&nbsp;&nbsp;2.当变量x 取某个值时，变量y 的取值对应着一个分布<br />&nbsp;&nbsp;&nbsp;3.各观测点分布在直线周围</p><p style="font-size:19px;font-weight:600">相关关系的描述与测量</p><li>散点图：可以通过散点图判断两个变量之间有无相关关系，并对变量间的关系形态做出大致的描述。</li><img src="@/assets/images/f3001.png" alt="">
-          <li>相关系数：是度量变量之间线性关系强度的一个统计量。</li><p>若相关系数是根据总体全部数据计算的，称为总体相关系数，记为ρ；<br />若是根据样本数据计算的，则称为样本相关系数，简称为相关系数，记为 r rr，也称为Pearson \textbf{Pearson}Pearson相关系数或者线性相关系数。</p><img src="@/assets/images/f3002.png" alt=""><br /><p>相关系数r rr 的性质：<br />&nbsp;&nbsp;&nbsp;r 的取值范围为 [ 0 , 1 ] [0,1][0,1];</p><img src="@/assets/images/f3003.png" alt=""><p>&nbsp;&nbsp;&nbsp;r 具有对称性。即x与y之间的相关系数和y与x之间的相关系数相等，即r x y = r y x r_{xy}= r_{yx}r <br />&nbsp;&nbsp;&nbsp;r 数值大小与x和y原点及尺度无关，即改变x和y的数据原点及计量尺度，并不改变r数值大小<br />&nbsp;&nbsp;&nbsp;r 仅仅是x与y之间线性关系的一个度量，它不能用于描述非线性关系。这意味着， r=0只表示两个变量之间不存在线性相关关系，并不说明变量之间没有任何关系
-            &nbsp;&nbsp;&nbsp;r 虽然是两个变量之间线性关系的一个度量，却不一定意味着x与y一定有因果关系</p><img src="@/assets/images/f3005.png" alt="" /><p style="font-size:19px;font-weight:600">相关关系的显著性检验</p><p>检验两个变量之间是否存在线性相关关系，通常将 r rr 作为 ρ ρρ 的估计值。<br />&nbsp;&nbsp;&nbsp;r 的抽样分布（不写）<br />&nbsp;&nbsp;&nbsp;r 的显著性检验</p><img src="@/assets/images/f3006.png" alt=""><p style="font-size:19px;font-weight:600">一元线性回归的估计和检验</p><li>相关分析目的在于用相关系数测度变量之间的关系强度。</li><li>而回归分析侧重于考察变量之间的数量关系，并通过一定的数学表达式将这种关系描述出来，从而确定一个或几个变量（自变量）的变化对另一个特定变量（因变量）的影响程度。具体来说，回归分析具体解决以下几个方面的问题：</li><p>&nbsp;&nbsp;&nbsp;1.从一组样本数据出发，确定变量之间的数学关系式。<br />&nbsp;&nbsp;&nbsp;2.对这些关系式的可信程度进行各种统计检验，并从影响因变量的诸多变量中找出哪些变量的影响是显著的，哪些是不显著的。<br />&nbsp;&nbsp;&nbsp;3.利用所求的关系式，根据一个或几个自变量的取值来估计或预测因变量的取值，并给出这种估计或预测的可靠程度。</p><li>在回归分析中：</li><p>被预测或被解释的变量称为因变量，用y表示；<br />用来预测或被解释的一个或多个变量称为自变量，用x表示；</p>
-            <p style="font-size:16px;font-weight:600">相关关系的显著性检验</p><p>检验两个变量之间是否存在线性相关关系，通常将 r rr 作为 ρ ρρ 的估计值。</p><img src="@/assets/images/f3007.png" alt="" /><p style="font-size:19px;font-weight:600">一元线性回归的估计和检验</p><li>相关分析目的在于用相关系数测度变量之间的关系强度。</li><li>而回归分析侧重于考察变量之间的数量关系，并通过一定的数学表达式将这种关系描述出来，从而确定一个或几个变量（自变量）的变化对另一个特定变量（因变量）的影响程度。具体来说，回归分析具体解决以下几个方面的问题：</li><p>&nbsp;&nbsp;&nbsp;1.从一组样本数据出发，确定变量之间的数学关系式。<br />&nbsp;&nbsp;&nbsp;2.对这些关系式的可信程度进行各种统计检验，并从影响因变量的诸多变量中找出哪些变量的影响是显著的，哪些是不显著的。<br />&nbsp;&nbsp;&nbsp;3.利用所求的关系式，根据一个或几个自变量的取值来估计或预测因变量的取值，并给出这种估计或预测的可靠程度。</p><li>在回归分析中：</li>
-            <p>&nbsp;&nbsp;&nbsp;被预测或被解释的变量称为因变量，用y表示；<br />&nbsp;&nbsp;&nbsp;用来预测或被解释的一个或多个变量称为自变量，用x表示；</p><p style="font-size:19px;font-weight:600"> 一元线性回归模型</p><p>涉及一个自变量的回归。</p><li>回归模型：描述因变量y 如何依赖于自变量x 和误差项 ε εε 的方程称为回归模型，一元线性回归模型可表示为：</li><img src="@/assets/images/f3008.png" alt=""><li>上述模型称为理论回归模型，对于这一模型，有以下几个假定：</li><p>&nbsp;&nbsp;&nbsp;1.因变量y与自变量x之间具有线性关系；<br />&nbsp;&nbsp;&nbsp;2.在重复抽样中，自变量x的取值是固定的，即假定x是非随机的；<br />&nbsp;&nbsp;&nbsp;3.对于满足：</p><img src="@/assets/images/f3009.png" alt=""><li>回归方程 ：描述因变量y的期望值如何依赖于自变量x的方程称为回归方程，一元线性回归方程的形式为：</li>
-            <img src="@/assets/images/f3010.png" alt="" /><img src="@/assets/images/f3011.png" alt="" /><p style="font-size:19px;font-weight:600">参数的最小二乘估计</p><img src="@/assets/images/f3012.png" alt="" /><br /><img src="@/assets/images/f3013.png" alt="" /><br /><img src="@/assets/images/f3014.png" alt="" /><p style="font-size:19px;font-weight:600">回归直线的拟合优度</p><p>估计或预测的精度如何，将取决于回归直线对观测数据的拟合程度。各观测点越是紧密围绕直线，说明对观测数据的拟合程度越好，反之越差。</p><img src="@/assets/images/f3015.png" alt=""><li>总平方和（S S T SSTSST）：反映因变量的n 个观察值与其均值的总误差。</li><img src="@/assets/images/f3016.png" alt=""><li>残差平方和：又称误差平方和，反映除x 以外的其他因素对y 取值的影响，也称为不可解释的平方和或剩余平方和。</li>
-            <img src="@/assets/images/f3017.png" alt="" /><li>回归平方和（SSR）：反映自变量x 的变化对因变量y 取值变化的影响，或者说，是由于x 与y 之间的线性关系引起的y 的取值变化，也称为可解释的平方和。</li><img src="@/assets/images/f3018.png" alt="" /><li>三者的关系为：</li><img src="@/assets/images/f3019.png" alt="" /><li>估计标准误差（s<sub>e</sub>）：反映实际观察值在回归直线周围的分散状况，是均方残差（MSE）的平方根</li><img src="@/assets/images/f3020.png" alt=""><p style="font-size:19px;font-weight:600">显著性检验</p><img src="@/assets/images/f3021.png" alt=""><img src="@/assets/images/f3022.png" alt=""><p style="font-size:19px;font-weight:600">利用回归方程进行预测</p><p style="font-size:16px;font-weight:600">平均值的置信区间</p><li>置信区间(confidence interval)：利用估计的回归方程，对于自变量x 的一个给定值x<sub>0</sub>，求出因变量y yy的平均值的估计区间，这一估计区间称为置信区间。</li>
-            <p>比平均值的公式根号内多了个1而已：</p><img src="@/assets/images/f3023.png" alt="" /><p style="font-size:19px;font-weight:600">残差分析</p><p style="font-size:16px;font-weight:600">残差与残差图（检验方差齐性）</p><li>残差：因变量的观测值与根据估计的回归方程求出的预测值之差，用e表示，反映了用估计的回归方程去预测而引起的误差。</li><img src="@/assets/images/f3024.png" alt=""><img src="@/assets/images/f3025.png" alt=""><p style="font-size:19px;font-weight:600">标准化残差（检验正态性）</p><li>标准化残差：也称为Pearson 残差或半学生化残差(semistudentized residuals)。</li><img src="@/assets/images/f3026.png" alt="">
-        </div>
-      </template>
-    </pop-model>
-  </template>
-  
-  <script setup>
-  import popModel from "@/views/components/popModal.vue";
-  import * as echarts from 'echarts';
-  import * as API from '@/api/AI.js'
-  import { getUserInfo } from "@/utils/auth";
-  import * as XLSX from 'xlsx' 
-  import { onMounted, reactive } from 'vue';
-  const { proxy } = getCurrentInstance()
-  const dialogVisible=ref(false)
-  const dialogVisible2=ref(false)
-  const flagColumn=ref(false)
-  const runResultShow=ref(false)
-  const exportTableRef = ref(null);
-  const tableLabel=reactive([
-      {prop:'date',label:''},
-  ])
-  const tableLabel2=reactive([
-      {prop:'date',label:''},
-  ])
-  const formInline2=reactive({
-    user:''
-  })
-  const flagUP=ref(false)
-  const option5=ref([])
-  const option6=ref([])
-  const getList=()=>{
-    API.selectionMetrics({userId:JSON.parse(getUserInfo()).userId}).then((res)=>{
-        res.data.forEach(element => {
-            options.value.push({
-                value:element,
-                label:element
-            })
-        })
-    })
-  }
-  const showChart=ref(false)
-  const fileList=ref([])
-  const handleChange=(info)=>{
-    fileList.value.push(info);
-  }
-  const flag=ref(false)
-  
-  onMounted(()=>{
-    getList()
-  })
-  
-  const optionData=()=>{
-    API.viewingMetrics({userId:JSON.parse(getUserInfo()).userId,tableName:input.value,algorithmName:'回归分析'}).then((res)=>{
-        tableData.value=[]
-        res.data.forEach(element => {
-            tableData.value.push({
-                text:element
-            })
-        })
-    })
+  <el-dialog v-model="dialogVisible2" title="预测" width="400" custom-class="dialogClass" :show-close="false">
+    <template #header="{ close, titleId, titleClass }">
+      <div class="my-header">
+        <span :id="titleId" :class="titleClass">预测</span>
+        <img class="gbImg" src="../../../assets/images/关闭.png" @click="close" alt="" />
+      </div>
+      <img class="xtImg" src="../../../assets/images/线条.png" alt="" />
+    </template>
+    <div class="from-item">
+      <el-form :inline="true" label-position="right" label-width="50px" :model="form" class="demo-form-inline">
+        <el-form-item label="x：">
+          <el-input style="width: 225px" v-model="formInline2.user" clearable placeholder="请输入x， 多个以英文逗号隔开" />
+        </el-form-item>
+      </el-form>
+    </div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="Forecasting">确定</el-button>
+      </div>
+    </template>
+  </el-dialog>
+
+  <pop-model :showModel="runResultShow" title="关联规则挖掘" @closePop="runResultShow = false">
+    <template v-slot:content>
+      <div>
+        <p style="font-weight: 700; font-size: 22px">变量间的关系的度量</p>
+        <p style="font-size: 19px; font-weight: 600">变量间的关系</p>
+        <li>函数关系：设有两个x和y，y随x一起变化，并完全依赖于x，y是x的函数，y = f ( x ) y = f(x)y=f(x)，x为自变量，y为因变量。</li>
+        <li>相关关系：变量之前存在的不确定的关系称为相关关系。</li>
+        <p>
+          &nbsp;&nbsp;&nbsp;1.一个变量的取值不能由另一个变量唯一确定
+          <br />
+          &nbsp;&nbsp;&nbsp;2.当变量x 取某个值时，变量y 的取值对应着一个分布
+          <br />
+          &nbsp;&nbsp;&nbsp;3.各观测点分布在直线周围
+        </p>
+        <p style="font-size: 19px; font-weight: 600">相关关系的描述与测量</p>
+        <li>散点图：可以通过散点图判断两个变量之间有无相关关系，并对变量间的关系形态做出大致的描述。</li>
+        <img src="@/assets/images/f3001.png" alt="" />
+        <li>相关系数：是度量变量之间线性关系强度的一个统计量。</li>
+        <p>
+          若相关系数是根据总体全部数据计算的，称为总体相关系数，记为ρ；
+          <br />
+          若是根据样本数据计算的，则称为样本相关系数，简称为相关系数，记为 r rr，也称为Pearson \textbf{Pearson}Pearson相关系数或者线性相关系数。
+        </p>
+        <img src="@/assets/images/f3002.png" alt="" />
+        <br />
+        <p>
+          相关系数r rr 的性质：
+          <br />
+          &nbsp;&nbsp;&nbsp;r 的取值范围为 [ 0 , 1 ] [0,1][0,1];
+        </p>
+        <img src="@/assets/images/f3003.png" alt="" />
+        <p>
+          &nbsp;&nbsp;&nbsp;r 具有对称性。即x与y之间的相关系数和y与x之间的相关系数相等，即r x y = r y x r_{xy}= r_{yx}r
+          <br />
+          &nbsp;&nbsp;&nbsp;r 数值大小与x和y原点及尺度无关，即改变x和y的数据原点及计量尺度，并不改变r数值大小
+          <br />
+          &nbsp;&nbsp;&nbsp;r 仅仅是x与y之间线性关系的一个度量，它不能用于描述非线性关系。这意味着， r=0只表示两个变量之间不存在线性相关关系，并不说明变量之间没有任何关系 &nbsp;&nbsp;&nbsp;r 虽然是两个变量之间线性关系的一个度量，却不一定意味着x与y一定有因果关系
+        </p>
+        <img src="@/assets/images/f3005.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">相关关系的显著性检验</p>
+        <p>
+          检验两个变量之间是否存在线性相关关系，通常将 r rr 作为 ρ ρρ 的估计值。
+          <br />
+          &nbsp;&nbsp;&nbsp;r 的抽样分布（不写）
+          <br />
+          &nbsp;&nbsp;&nbsp;r 的显著性检验
+        </p>
+        <img src="@/assets/images/f3006.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">一元线性回归的估计和检验</p>
+        <li>相关分析目的在于用相关系数测度变量之间的关系强度。</li>
+        <li>而回归分析侧重于考察变量之间的数量关系，并通过一定的数学表达式将这种关系描述出来，从而确定一个或几个变量（自变量）的变化对另一个特定变量（因变量）的影响程度。具体来说，回归分析具体解决以下几个方面的问题：</li>
+        <p>
+          &nbsp;&nbsp;&nbsp;1.从一组样本数据出发，确定变量之间的数学关系式。
+          <br />
+          &nbsp;&nbsp;&nbsp;2.对这些关系式的可信程度进行各种统计检验，并从影响因变量的诸多变量中找出哪些变量的影响是显著的，哪些是不显著的。
+          <br />
+          &nbsp;&nbsp;&nbsp;3.利用所求的关系式，根据一个或几个自变量的取值来估计或预测因变量的取值，并给出这种估计或预测的可靠程度。
+        </p>
+        <li>在回归分析中：</li>
+        <p>
+          被预测或被解释的变量称为因变量，用y表示；
+          <br />
+          用来预测或被解释的一个或多个变量称为自变量，用x表示；
+        </p>
+        <p style="font-size: 16px; font-weight: 600">相关关系的显著性检验</p>
+        <p>检验两个变量之间是否存在线性相关关系，通常将 r rr 作为 ρ ρρ 的估计值。</p>
+        <img src="@/assets/images/f3007.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">一元线性回归的估计和检验</p>
+        <li>相关分析目的在于用相关系数测度变量之间的关系强度。</li>
+        <li>而回归分析侧重于考察变量之间的数量关系，并通过一定的数学表达式将这种关系描述出来，从而确定一个或几个变量（自变量）的变化对另一个特定变量（因变量）的影响程度。具体来说，回归分析具体解决以下几个方面的问题：</li>
+        <p>
+          &nbsp;&nbsp;&nbsp;1.从一组样本数据出发，确定变量之间的数学关系式。
+          <br />
+          &nbsp;&nbsp;&nbsp;2.对这些关系式的可信程度进行各种统计检验，并从影响因变量的诸多变量中找出哪些变量的影响是显著的，哪些是不显著的。
+          <br />
+          &nbsp;&nbsp;&nbsp;3.利用所求的关系式，根据一个或几个自变量的取值来估计或预测因变量的取值，并给出这种估计或预测的可靠程度。
+        </p>
+        <li>在回归分析中：</li>
+        <p>
+          &nbsp;&nbsp;&nbsp;被预测或被解释的变量称为因变量，用y表示；
+          <br />
+          &nbsp;&nbsp;&nbsp;用来预测或被解释的一个或多个变量称为自变量，用x表示；
+        </p>
+        <p style="font-size: 19px; font-weight: 600">一元线性回归模型</p>
+        <p>涉及一个自变量的回归。</p>
+        <li>回归模型：描述因变量y 如何依赖于自变量x 和误差项 ε εε 的方程称为回归模型，一元线性回归模型可表示为：</li>
+        <img src="@/assets/images/f3008.png" alt="" />
+        <li>上述模型称为理论回归模型，对于这一模型，有以下几个假定：</li>
+        <p>
+          &nbsp;&nbsp;&nbsp;1.因变量y与自变量x之间具有线性关系；
+          <br />
+          &nbsp;&nbsp;&nbsp;2.在重复抽样中，自变量x的取值是固定的，即假定x是非随机的；
+          <br />
+          &nbsp;&nbsp;&nbsp;3.对于满足：
+        </p>
+        <img src="@/assets/images/f3009.png" alt="" />
+        <li>回归方程 ：描述因变量y的期望值如何依赖于自变量x的方程称为回归方程，一元线性回归方程的形式为：</li>
+        <img src="@/assets/images/f3010.png" alt="" />
+        <img src="@/assets/images/f3011.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">参数的最小二乘估计</p>
+        <img src="@/assets/images/f3012.png" alt="" />
+        <br />
+        <img src="@/assets/images/f3013.png" alt="" />
+        <br />
+        <img src="@/assets/images/f3014.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">回归直线的拟合优度</p>
+        <p>估计或预测的精度如何，将取决于回归直线对观测数据的拟合程度。各观测点越是紧密围绕直线，说明对观测数据的拟合程度越好，反之越差。</p>
+        <img src="@/assets/images/f3015.png" alt="" />
+        <li>总平方和（S S T SSTSST）：反映因变量的n 个观察值与其均值的总误差。</li>
+        <img src="@/assets/images/f3016.png" alt="" />
+        <li>残差平方和：又称误差平方和，反映除x 以外的其他因素对y 取值的影响，也称为不可解释的平方和或剩余平方和。</li>
+        <img src="@/assets/images/f3017.png" alt="" />
+        <li>回归平方和（SSR）：反映自变量x 的变化对因变量y 取值变化的影响，或者说，是由于x 与y 之间的线性关系引起的y 的取值变化，也称为可解释的平方和。</li>
+        <img src="@/assets/images/f3018.png" alt="" />
+        <li>三者的关系为：</li>
+        <img src="@/assets/images/f3019.png" alt="" />
+        <li>
+          估计标准误差（s
+          <sub>e</sub>
+          ）：反映实际观察值在回归直线周围的分散状况，是均方残差（MSE）的平方根
+        </li>
+        <img src="@/assets/images/f3020.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">显著性检验</p>
+        <img src="@/assets/images/f3021.png" alt="" />
+        <img src="@/assets/images/f3022.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">利用回归方程进行预测</p>
+        <p style="font-size: 16px; font-weight: 600">平均值的置信区间</p>
+        <li>
+          置信区间(confidence interval)：利用估计的回归方程，对于自变量x 的一个给定值x
+          <sub>0</sub>
+          ，求出因变量y yy的平均值的估计区间，这一估计区间称为置信区间。
+        </li>
+        <p>比平均值的公式根号内多了个1而已：</p>
+        <img src="@/assets/images/f3023.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">残差分析</p>
+        <p style="font-size: 16px; font-weight: 600">残差与残差图（检验方差齐性）</p>
+        <li>残差：因变量的观测值与根据估计的回归方程求出的预测值之差，用e表示，反映了用估计的回归方程去预测而引起的误差。</li>
+        <img src="@/assets/images/f3024.png" alt="" />
+        <img src="@/assets/images/f3025.png" alt="" />
+        <p style="font-size: 19px; font-weight: 600">标准化残差（检验正态性）</p>
+        <li>标准化残差：也称为Pearson 残差或半学生化残差(semistudentized residuals)。</li>
+        <img src="@/assets/images/f3026.png" alt="" />
+      </div>
+    </template>
+  </pop-model>
+</template>
+
+<script setup>
+import popModel from "@/views/components/popModal.vue";
+import * as echarts from "echarts";
+import * as API from "@/api/AI.js";
+import { getUserInfo } from "@/utils/auth";
+import * as XLSX from "XLSX";
+import { onMounted, reactive } from "vue";
+const { proxy } = getCurrentInstance();
+const dialogVisible = ref(false);
+const dialogVisible2 = ref(false);
+const flagColumn = ref(false);
+const runResultShow = ref(false);
+const exportTableRef = ref(null);
+const tableLabel = reactive([{ prop: "date", label: "" }]);
+const tableLabel2 = reactive([{ prop: "date", label: "" }]);
+const formInline2 = reactive({
+  user: "",
+});
+const flagUP = ref(false);
+const option5 = ref([]);
+const option6 = ref([]);
+const getList = () => {
+  API.selectionMetrics({ userId: JSON.parse(getUserInfo()).userId }).then((res) => {
+    res.data.forEach((element) => {
+      options.value.push({
+        value: element,
+        label: element,
+      });
+    });
+  });
+};
+const showChart = ref(false);
+const fileList = ref([]);
+const handleChange = (info) => {
+  fileList.value.push(info);
+};
+const flag = ref(false);
+
+onMounted(() => {
+  getList();
+});
+
+const optionData = () => {
+  API.viewingMetrics({ userId: JSON.parse(getUserInfo()).userId, tableName: input.value, algorithmName: "回归分析" }).then((res) => {
+    tableData.value = [];
+    res.data.forEach((element) => {
+      tableData.value.push({
+        text: element,
+      });
+    });
+  });
+};
+const selectedRows = ref([]);
+const handleSelectionChange = (selection) => {
+  selectedRows.value = selection;
+};
+const tableData2 = ref([]);
+const tableData3 = ref([]);
+const resTable2 = ref();
+const taskZB = () => {
+  flag.value = true;
+  if (selectedRows.value.length === 0) {
+    return proxy.$modal.msgWarning("请选择指标!");
   }
-  const selectedRows = ref([]);
-  const handleSelectionChange = (selection) => {
-    selectedRows.value = selection;
-    };
-  const tableData2=ref([])
-  const tableData3=ref([])
-  const resTable2=ref()
-    const taskZB=()=>{
-        flag.value=true
-        if(selectedRows.value.length===0){
-            return
-        }
-        const sendData={
-            tableName:input.value,
-            userId:JSON.parse(getUserInfo()).userId,
-            fieldList:selectedRows.value.map(item=>item.text)
-        }
-        API.analysisDataDisplay(sendData).then((res)=>{
-            tableLabel.length=0
-            option5.value.length=0
-                for (const key in res.data[0]) {
-                    option5.value.push({
-                        value:key,
-                        label:key
-                    })
-                    tableLabel.push({
-                        label:key,
-                        prop:key
-                    })
-                }
-                tableData2.value=res.data
-            flag.value=true
-        })
-    }
-  const formInline=reactive({
-      user:'',
-      region:''
-  })
-  const input=ref()
-  const options = ref([])
-  const input2=ref()
-  const options2=ref([
-    {
-        value:'数据区重',
-        label:'数据去重'
+  const sendData = {
+    tableName: input.value,
+    userId: JSON.parse(getUserInfo()).userId,
+    fieldList: selectedRows.value.map((item) => item.text),
+  };
+  API.analysisDataDisplay(sendData).then((res) => {
+    tableLabel.length = 0;
+    option5.value.length = 0;
+    for (const key in res.data[0]) {
+      option5.value.push({
+        value: key,
+        label: key,
+      });
+      tableLabel.push({
+        label: key,
+        prop: key,
+      });
     }
-  ])
-  const input3=ref()
-  const options3=ref([
-    {
-        value:'缺失值处理--剔除数据',
-        label:'缺失值处理--剔除数据'
-    },{
-        value:'缺失值处理--均值替换',
-        label:'缺失值处理--均值替换'
-    },
-  ])
-  const input4=ref()
-  const options4=ref([
-    {
-        value:'线性回归',
-        label:'线性回归'
-    },{
-        value:'Logistic逻辑回归',
-        label:'Logistic逻辑回归'
-    },
-  ])
-  const input5=ref()
-  const input6=ref()
-  const taskSubmit=()=>{
-      dialogVisible.value=true
+    tableData2.value = res.data;
+    flag.value = true;
+  });
+};
+const formInline = reactive({
+  user: "",
+  region: "",
+});
+const input = ref();
+const options = ref([]);
+const input2 = ref('');
+const options2 = ref([
+  {
+    value: "数据区重",
+    label: "数据去重",
+  },
+]);
+const input3 = ref('');
+const options3 = ref([
+  {
+    value: "缺失值处理--剔除数据",
+    label: "缺失值处理--剔除数据",
+  },
+  {
+    value: "缺失值处理--均值替换",
+    label: "缺失值处理--均值替换",
+  },
+]);
+const input4 = ref();
+const options4 = ref([
+  {
+    value: "线性回归",
+    label: "线性回归",
+  },
+  {
+    value: "Logistic逻辑回归",
+    label: "Logistic逻辑回归",
+  },
+]);
+const input5 = ref();
+const input6 = ref();
+const taskSubmit = () => {
+  dialogVisible.value = true;
+};
+const tableData = ref([]);
+const headerCellStyle = () => {
+  return {
+    backgroundColor: "#1882DE !important", // 设置表头背景颜色
+    color: "#ffffff !important",
+  };
+};
+const optionData2 = () => {
+  if (tableData2.value.length === 0) {
+    input2.value = "";
+    input3.value = "";
+    proxy.$modal.msgWarning("请先选择指标！");
+    return;
   }
-  const tableData = ref([
-    
-  ])
-  const headerCellStyle=()=>{
-       return {
-      backgroundColor: "#1882DE !important", // 设置表头背景颜色
-      color: "#ffffff !important",
-    };
+  if (input2.value && input3.value) {
+    const sendData = ref({
+      mapList: tableData2.value,
+      method: input3.value,
+      userId: JSON.parse(getUserInfo()).userId,
+    });
+    API.dataPreprocessing(sendData.value).then((res) => {
+      resTable2.value = res.data;
+      tableData2.value = [];
+      tableData2.value = res.data;
+      proxy.$modal.msgSuccess("预处理成功！");
+    });
   }
-  const optionData2=()=>{
-    if(input2.value&&input3.value){
-        const sendData=ref({
-            mapList:tableData2.value,
-            method:input3.value,
-            userId:JSON.parse(getUserInfo()).userId
-        })
-        API.dataPreprocessing(sendData.value).then((res)=>{
-            resTable2.value=res.data
-            tableData2.value=[]
-            tableData2.value=res.data
-            proxy.$modal.msgSuccess("预处理成功！");
-        })
-    }
+};
+
+//生产表格
+const computation = () => {  
+  if (tableData.value.length === 0 || input2.value=='' || input3.value=='') {
+    proxy.$modal.msgWarning("请先计算/对数据进行预处理！");
+    return;
   }
-  
-  //生产表格
-  const computation=()=>{
-    if(input5.value&&input6.value&&input4.value){
-        let sendData={
-          y:[],
-          x:[],
-            userId:JSON.parse(getUserInfo()).userId,
+  if (input5.value && input6.value && input4.value) {
+    let sendData = {
+      y: [],
+      x: [],
+      userId: JSON.parse(getUserInfo()).userId,
+    };
+    if (input4.value === "线性回归") {
+      if (input5.value.length > 1) {
+        proxy.$modal.msgError("y变量数量有误！");
+        return;
+      }
+      if (input6.value.length != 2 || input6.value.length > 2) {
+        proxy.$modal.msgError("x变量数量有误！");
+        return;
+      }
+      flagColumn.value = true;
+      tableData2.value.forEach((item) => {
+        sendData.y.push(item[input5.value[0]]);
+        sendData.x.push([item[input6.value[0]], item[input6.value[1]]]);
+      });
+      API.linearRegression(sendData).then((res) => {
+        tableLabel2.length = 0;
+        for (const key in res.data) {
+          tableLabel2.push({
+            label: key,
+            prop: key,
+          });
         }
-        if(input4.value==='线性回归'){
-            if(input5.value.length>1){
-                proxy.$modal.msgError("y变量数量有误！");
-                return
-            }
-            if(input6.value.length!=2||input6.value.length>2){
-                proxy.$modal.msgError("x变量数量有误！");
-                return
-            }
-            flagColumn.value=true
-            tableData2.value.forEach(item=>{
-                sendData.y.push(item[input5.value[0]])
-                sendData.x.push([item[input6.value[0]],item[input6.value[1]]])
-            })
-            API.linearRegression(sendData).then((res)=>{
-                tableLabel2.length=0
-                for (const key in res.data) {
-                    tableLabel2.push({
-                        label:key,
-                        prop:key
-                    })
-                }
-                let data=res.data
-                data.slopes=data.slopes.join(',')
-                tableData3.value=[data]
-                predictionResults.value=''
-            })
-        }else{
-            if(input5.value.length>1){
-                proxy.$modal.msgError("y变量数量有误！");
-                return
-            }
-            if(input6.value.length>2){
-                proxy.$modal.msgError("x变量数量有误！");
-                return
-            }
-            flagColumn.value=true
-            if(input6.value.length===1){
-              tableData2.value.forEach(item=>{
-                    sendData.y.push(item[input5.value[0]])
-                    sendData.x.push([item[input6.value[0]]])
-                })
-            }else{
-              tableData2.value.forEach(item=>{
-                    sendData.y.push(item[input5.value[0]])
-                    sendData.x.push([item[input6.value[0]],item[input6.value[1]]])
-                })
-            }
-            
-            API.logisticRegression(sendData).then((res)=>{
-                    tableLabel2.length=0
-                    for (const key in res.data) {
-                        tableLabel2.push({
-                            label:key,
-                            prop:key
-                        })
-                    }
-                    let data=res.data
-                    data.slope=data.slope
-                    tableData3.value=[data]
-                    predictionResults.value=''
-                })
+        let data = res.data;
+        data.slopes = data.slopes.join(",");
+        tableData3.value = [data];
+        predictionResults.value = "";
+      });
+    } else {
+      if (input5.value.length > 1) {
+        proxy.$modal.msgError("y变量数量有误！");
+        return;
+      }
+      if (input6.value.length > 2) {
+        proxy.$modal.msgError("x变量数量有误！");
+        return;
+      }
+      flagColumn.value = true;
+      if (input6.value.length === 1) {
+        tableData2.value.forEach((item) => {
+          sendData.y.push(item[input5.value[0]]);
+          sendData.x.push([item[input6.value[0]]]);
+        });
+      } else {
+        tableData2.value.forEach((item) => {
+          sendData.y.push(item[input5.value[0]]);
+          sendData.x.push([item[input6.value[0]], item[input6.value[1]]]);
+        });
+      }
+
+      API.logisticRegression(sendData).then((res) => {
+        tableLabel2.length = 0;
+        for (const key in res.data) {
+          tableLabel2.push({
+            label: key,
+            prop: key,
+          });
         }
+        let data = res.data;
+        data.slope = data.slope;
+        tableData3.value = [data];
+        predictionResults.value = "";
+      });
     }
-    flagUP.value=true
+  } else {
+    proxy.$modal.msgWarning("请模型参数进行设置！");
   }
-  const nowData=ref([])
-  const handleClick=(item)=>{
-    dialogVisible2.value=true
-    nowData.value=item
+  flagUP.value = true;
+};
+const nowData = ref([]);
+const handleClick = (item) => {
+  dialogVisible2.value = true;
+  nowData.value = item;
+};
+const predictionResults = ref("");
+const Forecasting = () => {
+  if (nowData.value.type === "线性回归") {
+    const sendData = {
+      intercept: nowData.value.intercept,
+      type: nowData.value.type,
+      slopes: nowData.value.slopes.split(",").map(Number),
+      raX: formInline2.user.split(",").map(Number),
+    };
+    API.logisticRegressionPrediction(sendData).then((res) => {
+      dialogVisible2.value = false;
+      predictionResults.value = res.data;
+    });
   }
-  const predictionResults=ref('')
-  const Forecasting=()=>{
-    if(nowData.value.type==='线性回归'){
-        const sendData={
-            intercept:nowData.value.intercept,
-            type:nowData.value.type,
-            slopes:nowData.value.slopes.split(',').map(Number),
-            raX:formInline2.user.split(',').map(Number)
-        }
-        API.logisticRegressionPrediction(sendData).then((res)=>{
-            dialogVisible2.value=false
-            predictionResults.value=res.data
-        })
-    }
-    if(nowData.value.type==='逻辑回归'){
-        const sendData={
-            intercept:nowData.value.intercept,
-            type:nowData.value.type,
-            slope:nowData.value.slope,
-            lx:formInline2.user
-        }
-        API.logisticRegressionPrediction(sendData).then((res)=>{
-            dialogVisible2.value=false
-            predictionResults.value=res.data
-        })
-    }
+  if (nowData.value.type === "逻辑回归") {
+    const sendData = {
+      intercept: nowData.value.intercept,
+      type: nowData.value.type,
+      slope: nowData.value.slope,
+      lx: formInline2.user,
+    };
+    API.logisticRegressionPrediction(sendData).then((res) => {
+      dialogVisible2.value = false;
+      predictionResults.value = res.data;
+    });
   }
-  const upLoad=()=>{
-    const tableDom = exportTableRef.value?.$el;
+};
+const upLoad = () => {
+  const tableDom = exportTableRef.value?.$el;
   if (!tableDom) {
     return;
   }
-  
+
   const wb = XLSX.utils.table_to_book(tableDom);
-  XLSX.writeFile(wb, '回归分析.xlsx');
-  }
-  const startOver=()=>{
-    input.value=''
-    tableData.value=[]
-    tableData2.value=[]
-    tableData3.value=[]
-    input2.value=''
-    input3.value=''
-    input4.value=''
-    input5.value=''
-    input6.value=''
-    flagColumn.value=false
-     tableLabel.length=0
-   tableLabel2.length=0
-   nowData.value=[]
-   formInline2.user=''
-   predictionResults.value=''
-   flagUP.value=false
-  }
-  </script>
-  
-  <style lang="scss" scoped>
-  .main-top {
+  XLSX.writeFile(wb, "回归分析.xlsx");
+};
+const startOver = () => {
+  input.value = "";
+  tableData.value = [];
+  tableData2.value = [];
+  tableData3.value = [];
+  input2.value = "";
+  input3.value = "";
+  input4.value = "";
+  input5.value = "";
+  input6.value = "";
+  flagColumn.value = false;
+  tableLabel.length = 0;
+  tableLabel2.length = 0;
+  nowData.value = [];
+  formInline2.user = "";
+  predictionResults.value = "";
+  flagUP.value = false;
+};
+</script>
+
+<style lang="scss" scoped>
+.main-top {
   margin: 20px 20px 0;
-    margin-top: 10px;
-    height: 85px;
-    background: #001d40;
-    border: 1px solid #0452c6;
-    padding: 5px 20px;
+  margin-top: 10px;
+  height: 85px;
+  background: #001d40;
+  border: 1px solid #0452c6;
+  padding: 5px 20px;
+}
+.main-but {
+  margin: 5px 20px 0;
+  display: flex;
+  .el-button:nth-child(1) {
+    width: 180px;
+    height: 56px;
+    background: url("../../../assets/images/011.png");
+    color: #ffffff;
+    border-color: #ffffff00;
   }
-  .main-but{
-      margin: 5px 20px 0;
-      display: flex;
-      .el-button:nth-child(1) {
-          width: 180px;
-          height: 56px;
-          background: url('../../../assets/images/011.png');
-          color:#FFFFFF;
-          border-color:#FFFFFF00;
-        }
-        .el-button:nth-child(2) {
-          width: 180px;
-          height: 56px;
-          background: url('../../../assets/images/022.png');
-          color:#FFFFFF;
-          border-color:#FFFFFF00;
-        }
+  .el-button:nth-child(2) {
+    width: 180px;
+    height: 56px;
+    background: url("../../../assets/images/022.png");
+    color: #ffffff;
+    border-color: #ffffff00;
   }
-  .app-main {
-    //   background-color: #f5f5f5;
+}
+.app-main {
+  //   background-color: #f5f5f5;
+  min-height: 965px;
+  margin: 5px 20px 0;
+  height: 100%;
+  display: flex;
+  overflow: auto;
+  .main-left {
+    //水平居中
+    flex-direction: column;
     min-height: 965px;
-    margin: 5px 20px 0;
-    height: 100%;
     display: flex;
-    overflow: auto;
-    .main-left {
-      //水平居中
-      flex-direction: column;
-      min-height: 965px;
-      display: flex;
-      width: 205px;
+    width: 205px;
     //   height: 100%;
-      background: #041c49;
-      padding: 0px 10px;
-      .left-top {
-        padding: 10px;
-        span {
-          font-weight: bold;
-          font-size: 18px;
-          color: #3596eb;
-        }
+    background: #041c49;
+    padding: 0px 10px;
+    .left-top {
+      padding: 10px;
+      span {
+        font-weight: bold;
+        font-size: 18px;
+        color: #3596eb;
       }
-      .metrics-table{
-          .el-button {
-          width: 149px;
-          height: 48px;
-          background: url('../../../assets/images/确定.png');
-          color:#FFFFFF;
-          border-color:#FFFFFF00;
-          background-size: 100% 100%;
-          margin: 15px;
-        }
-        .el-input{
-            --el-input-text-color:#FFFFFF;
-          --el-input-bg-color:#002651;
-          --el-input-border-color:#67B3D6;
-        }
+    }
+    .metrics-table {
+      .el-button {
+        width: 149px;
+        height: 48px;
+        background: url("../../../assets/images/确定.png");
+        color: #ffffff;
+        border-color: #ffffff00;
+        background-size: 100% 100%;
+        margin: 15px;
       }
-      .startOver{
-          margin-left: -10px;
-          width: 205px;
-          height: 55px;
-          background: #00F4FF;
-          //水平居中
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          cursor: pointer;
+      .el-input {
+        --el-input-text-color: #ffffff;
+        --el-input-bg-color: #002651;
+        --el-input-border-color: #67b3d6;
       }
-      :deep(.el-table) {
-      --el-table-row-hover-bg-color:#002651 !important;
-      --el-table-border-color: #7AC1FF;
-    .el-table__row{
-      background-color: #002652 !important;
-      color: #E6E6E6;
     }
-  }
+    .startOver {
+      margin-left: -10px;
+      width: 205px;
+      height: 55px;
+      background: #00f4ff;
+      //水平居中
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
     }
-    .main-right {
-      width: 1639px;
-    //   height: 100%;
-      padding: 20px;
-      border: 1px solid #0452c6;
-      :deep(.el-table__header){
-      .el-table__cell{
-              background:linear-gradient(0deg, #5304BE 0%, #9126FE 100%) !important;
-          }
+    :deep(.el-table) {
+      --el-table-row-hover-bg-color: #002651 !important;
+      --el-table-border-color: #7ac1ff;
+      .el-table__row {
+        background-color: #002652 !important;
+        color: #e6e6e6;
       }
-      :deep(.el-table) {
-          --el-table-row-hover-bg-color:#002651 !important;
-          --el-table-border-color: #002651;
-          --el-table-bg-color:#FFFFFF00;
-      .el-table__row{
-          background-color: #002652 !important;
-          color: #E6E6E6;
+    }
+  }
+  .main-right {
+    width: 1639px;
+    //   height: 100%;
+    padding: 20px;
+    border: 1px solid #0452c6;
+    :deep(.el-table__header) {
+      .el-table__cell {
+        background: linear-gradient(0deg, #5304be 0%, #9126fe 100%) !important;
       }
+    }
+    :deep(.el-table) {
+      --el-table-row-hover-bg-color: #002651 !important;
+      --el-table-border-color: #002651;
+      --el-table-bg-color: #ffffff00;
+      .el-table__row {
+        background-color: #002652 !important;
+        color: #e6e6e6;
       }
     }
-    .metrics{
-          :deep(.el-input){
-              .el-input__wrapper{
-                  background-color:#FFFFFF00;
-                  background-image:url('../../../assets/images/下拉框.png');
-                  background-size: 100% 100%;
-              }
-              --el-input-text-color:#FFFFFF;
-              --el-input-border-color:#FFFFFF00;
-              --el-input-hover-border-color:#FFFFFF00;
-              --el-input-hover-border:#FFFFFF00;
-              --el-select-border-color-hover:#FFFFFF00;
-              --el-select-input-focus-border-color:#FFFFFF00;
-              --el-input-placeholder-color:#FFFFFF;
-              .el-input__inner{
-                  color:#FFFFFF;
-              }
-          }
+  }
+  .metrics {
+    :deep(.el-input) {
+      .el-input__wrapper {
+        background-color: #ffffff00;
+        background-image: url("../../../assets/images/下拉框.png");
+        background-size: 100% 100%;
       }
-      .metrics2{
-          :deep(.el-input){
-              .el-input__wrapper{
-                  background-color:#FFFFFF00;
-              }
-              --el-input-text-color:#FFFFFF;
-              --el-input-border-color:#409EFF;
-              --el-input-hover-border-color:#409EFF;
-              --el-input-hover-border:#409EFF;
-              --el-select-border-color-hover:#409EFF;
-              --el-select-input-focus-border-color:#409EFF;
-              --el-input-placeholder-color:#FFFFFF;
-              .el-input__inner{
-                  color:#FFFFFF;
-              }
-          }
+      --el-input-text-color: #ffffff;
+      --el-input-border-color: #ffffff00;
+      --el-input-hover-border-color: #ffffff00;
+      --el-input-hover-border: #ffffff00;
+      --el-select-border-color-hover: #ffffff00;
+      --el-select-input-focus-border-color: #ffffff00;
+      --el-input-placeholder-color: #ffffff;
+      .el-input__inner {
+        color: #ffffff;
       }
+    }
   }
-  .analysisResults{
-      .imgBtn {
-          width: 89px;
-          height: 31px;
-          background: url('../../../assets/images/下载.png');
-          color:black;
-          border-color:#FFFFFF00;
-          // background-size: 100% 100%;
-          margin: 15px 0px 5px;
-        }
-  }
-  :deep(.el-form-item__label){
-      color: #FFFFFF;;
-  }
-  .from-item{
-      padding: 20px;
-      .el-input{
-          --el-input-text-color:#FFFFFF;
-          --el-input-bg-color:#002651;
-          --el-input-border-color:#67B3D6;
+  .metrics2 {
+    :deep(.el-input) {
+      .el-input__wrapper {
+        background-color: #ffffff00;
+      }
+      --el-input-text-color: #ffffff;
+      --el-input-border-color: #409eff;
+      --el-input-hover-border-color: #409eff;
+      --el-input-hover-border: #409eff;
+      --el-select-border-color-hover: #409eff;
+      --el-select-input-focus-border-color: #409eff;
+      --el-input-placeholder-color: #ffffff;
+      .el-input__inner {
+        color: #ffffff;
       }
+    }
   }
-  .dialog-footer{
-      margin-bottom: 20px;
+}
+.analysisResults {
+  .imgBtn {
+    width: 89px;
+    height: 31px;
+    background: url("../../../assets/images/下载.png");
+    color: black;
+    border-color: #ffffff00;
+    // background-size: 100% 100%;
+    margin: 15px 0px 5px;
   }
-  :deep(.el-table__expand-icon){
-    color: #9126FE;
-    .el-icon{
-      font-size: 16px;
-    }
+}
+:deep(.el-form-item__label) {
+  color: #ffffff;
+}
+.from-item {
+  padding: 20px;
+  .el-input {
+    --el-input-text-color: #ffffff;
+    --el-input-bg-color: #002651;
+    --el-input-border-color: #67b3d6;
+  }
+}
+.dialog-footer {
+  margin-bottom: 20px;
+}
+:deep(.el-table__expand-icon) {
+  color: #9126fe;
+  .el-icon {
+    font-size: 16px;
   }
-  </style>
\ No newline at end of file
+}
+</style>
diff --git a/src/views/digitalMarketingAlgorithms/index.vue b/src/views/digitalMarketingAlgorithms/index.vue
index d0018cc..a3f8bdb 100644
--- a/src/views/digitalMarketingAlgorithms/index.vue
+++ b/src/views/digitalMarketingAlgorithms/index.vue
@@ -7,24 +7,15 @@
       <el-button :class="{ active: isActive === 4 }" @click="activeIndex(4)">关联规则挖掘</el-button>
       <el-button :class="{ active: isActive === 5 }" @click="activeIndex(5)">回归分析</el-button>
       <el-button :class="{ active: isActive === 6 }" @click="activeIndex(6)">情感分析/文本挖掘</el-button>
-      <!-- <el-button :class="{'active':isActive===7}" @click="activeIndex(7)">决策树分析</el-button> -->
     </div>
     <div>
-      <component :is="component"></component>
+      <component v-if="component" :is="component"></component>
     </div>
   </div>
 </template>
-
 <script setup>
-//   import AIGC from './AIGCLargeModel/index.vue'
-import big from "./components/bigData.vue";
-import descriptiveStatistics from "./components/descriptiveStatistics.vue";
-import clusterAnalysis from "./components/clusterAnalysis.vue";
-import associationRuleMining from "./components/associationRuleMining.vue";
-import regressionAnalysis from "./components/regressionAnalysis.vue";
-import emotionAnalysis from "./components/emotion-analysis.vue";
-const component = ref(emotionAnalysis);
-const pageData = [big, descriptiveStatistics, clusterAnalysis, associationRuleMining, regressionAnalysis, emotionAnalysis];
+const pageData = [defineAsyncComponent(() => import("./components/bigData.vue")), defineAsyncComponent(() => import("./components/descriptiveStatistics.vue")), defineAsyncComponent(() => import("./components/clusterAnalysis.vue")), defineAsyncComponent(() => import("./components/associationRuleMining.vue")), defineAsyncComponent(() => import("./components/regressionAnalysis.vue")), defineAsyncComponent(() => import("./components/emotion-analysis.vue"))];
+const component = ref(pageData[0]);
 const isActive = ref(1);
 const activeIndex = (index) => {
   isActive.value = index;
diff --git a/src/views/learningCenter/learningResources.vue b/src/views/learningCenter/learningResources.vue
index 5659cc7..1b9ed47 100644
--- a/src/views/learningCenter/learningResources.vue
+++ b/src/views/learningCenter/learningResources.vue
@@ -1,7 +1,6 @@
 <template>
   <div class="app-container">
-    <el-scrollbar height="780px" always>
-      <!-- <div class="app-container"> -->
+    <el-scrollbar :height="height + 'px'" always style="padding-right: 15px">
       <div class="main">
         <el-row :gutter="40">
           <el-col :span="3" v-for="i in item" :key="i">
@@ -11,9 +10,7 @@
                   <span>{{ i.resourcesName }}</span>
                 </a>
               </div>
-
               <div class="el_bon">
-                <!-- <a :href="getImgLink(i.resourcesUrl)" target="_blank"> -->
                 <a target="_blank" @click="showResource(i.resourcesUrl)">
                   <img :src="getImg(i.resourcesImg)" />
                 </a>
@@ -22,7 +19,6 @@
           </el-col>
         </el-row>
       </div>
-      <!-- </div> -->
     </el-scrollbar>
   </div>
 </template>
@@ -30,7 +26,7 @@
 import * as API from "@/api/prtrait/prtrait.js";
 import { getAssetsFile } from "@/utils";
 import { getUserInfo } from "@/utils/auth";
-import { onMounted } from "vue";
+import { computed, onMounted } from "vue";
 const getImg = (i) => {
   return getAssetsFile(i);
 };
@@ -106,8 +102,13 @@ onBeforeUnmount(() => {
   data.value.stuScoreDetailsDTO.viewingTime = seconds;
   API.resourcesLearningScoreStatistics(data.value);
 });
-
-const taskTime = async () => {};
+// 拿到页面的高度
+const height = computed(() => {
+  return document.documentElement.clientHeight - 130;
+});
+onMounted(() => {
+  console.log(height.value, "document.documentElement.clientHeight");
+});
 </script>
 <style lang="scss" scoped>
 .app-container {
@@ -156,7 +157,7 @@ const taskTime = async () => {};
     // padding: 10px 27px 10px 27px;
     img {
       width: 159px;
-      height: 184px;
+      height: 190px;
     }
   }
   .el-row {
@@ -177,4 +178,7 @@ const taskTime = async () => {};
     min-height: 36px;
   }
 }
+:deep(.el-scrollbar__thumb) {
+  background-color: #2179bd;
+}
 </style>
diff --git a/src/views/portraitModel/index.vue b/src/views/portraitModel/index.vue
index 9de2bd6..ea50fb9 100644
--- a/src/views/portraitModel/index.vue
+++ b/src/views/portraitModel/index.vue
@@ -257,20 +257,8 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
-import { defineExpose } from "vue";
 import * as portraitModel from "@/api/portraitModel";
 import mainContent from "@/views/components/mainContent.vue";
-import rfmAnalysis from "./components/rfmAnalysis.vue";
-import abcAnalysis from "./components/abcAnalysis.vue";
-import bostonAnalysis from "./components/bostonAnalysis.vue";
-import funnelAnalysis from "./components/funnelAnalysis.vue";
-import basketAnalysis from "./components/basketAnalysis.vue";
-import repurchaseAnalysis from "./components/repurchaseAnalysis.vue";
-import retainAnalysis from "./components/retainAnalysis.vue";
-import viscosityAnalysis from "./components/viscosityAnalysis.vue";
-import AARRRAnalysis from "./components/AARRRAnalysis.vue";
-import portraitAnalysis from "./components/portraitAnalysis.vue";
 import { onMounted } from "vue";
 const { proxy } = getCurrentInstance();
 const currentComponent = ref(null);
@@ -281,61 +269,61 @@ const fileTable = ref([]);
 const tabList = ref([
   {
     id: "1",
-    key: rfmAnalysis,
+    key: () => import('./components/rfmAnalysis.vue'),
     title: "RFM分析",
     backImg: "src/assets/images/icon1.png",
   },
   {
     id: "2",
-    key: abcAnalysis,
+    key: () => import('./components/abcAnalysis.vue'),
     title: "帕累托/ABC分析",
     backImg: "src/assets/images/icon2.png",
   },
   {
     id: "3",
-    key: bostonAnalysis,
+    key: () => import('./components/bostonAnalysis.vue'),
     title: "波士顿矩阵分析",
     backImg: "src/assets/images/icon3.png",
   },
   {
     id: "4",
-    key: funnelAnalysis,
+    key: () => import('./components/funnelAnalysis.vue'),
     title: "转化分析-漏斗模型",
     backImg: "src/assets/images/icon4.png",
   },
   {
     id: "5",
-    key: basketAnalysis,
+    key: () => import('./components/basketAnalysis.vue'),
     title: "购物篮分析",
     backImg: "src/assets/images/icon5.png",
   },
   {
     id: "6",
-    key: repurchaseAnalysis,
+    key: () => import('./components/repurchaseAnalysis.vue'),
     title: "复购分析",
     backImg: "src/assets/images/icon6.png",
   },
   {
     id: "7",
-    key: retainAnalysis,
+    key: () => import('./components/retainAnalysis.vue'),
     title: "留存分析",
     backImg: "src/assets/images/icon7.png",
   },
   {
     id: "8",
-    key: viscosityAnalysis,
+    key: () => import('./components/viscosityAnalysis.vue'),
     title: "用户粘性分析",
     backImg: "src/assets/images/icon8.png",
   },
   {
     id: "9",
-    key: AARRRAnalysis,
+    key: () => import('./components/AARRRAnalysis.vue'),
     title: "AARRR用户运营分析",
     backImg: "src/assets/images/icon9.png",
   },
   {
     id: "10",
-    key: portraitAnalysis,
+    key: () => import('./components/portraitAnalysis.vue'),
     title: "用户画像分析",
     backImg: "src/assets/images/icon10.png",
   },
@@ -343,7 +331,7 @@ const tabList = ref([
 // defineExpose({ submitMethod });
 onMounted(() => {
   // getTableData("用户属性表");
-  currentComponent.value = tabList.value[0].key
+  currentComponent.value =defineAsyncComponent( tabList.value[0].key)
 });
 const getTableData = (name) => {
   fileTable.value = [];
@@ -377,7 +365,7 @@ const handleChange = (index) => {
   }
 };
 const changeTab = (item) => {
-  currentComponent.value = item.key;
+  currentComponent.value = defineAsyncComponent(item.key);
   menuIndex.value = 0;
   //   tabIndex = item.id;
 };