提交

src/api/marketing-algorithm.js

@@ -2,24 +2,32 @@
  * @Author: qinzhenpen qzp1807@126.com
  * @Date: 2024-08-16 10:14:59
  * @LastEditors: qinzhenpen qzp1807@126.com
- * @LastEditTime: 2024-08-16 15:37:34
+ * @LastEditTime: 2024-08-16 16:38:09
  * @FilePath: \vue3\src\api\marketing-algorithm.js
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
-import request from '@/utils/request'
+import request from "@/utils/request";
 // 选择指标分析数据展示
 export function getMarketingAlgorithm(data) {
   return request({
-    url: '/api/model/viewAnalyzeData',
+    url: "/api/model/viewAnalyzeData",
-    method: 'POST',
+    method: "POST",
-    data
+    data,
-  })
+  });
 }
 // 查看指标
 export function getMarketingAlgorithmList(params) {
   return request({
-    url: '/api/model/viewMetrics',
+    url: "/api/model/viewMetrics",
-    method: 'POST',
+    method: "POST",
-    params
+    params,
-  })
+  });
+}
+// 描述性统计数据预处理
+export function getMarketingAlgorithmPreprocessing(data) {
+  return request({
+    url: "/api/model/descriptiveStatistics",
+    method: "POST",
+    data,
+  });
 }

src/assets/styles/index.scss

@@ -134,6 +134,10 @@ aside {
 
 .pagination-container {
   margin-top: 30px;
+  background-color: transparent !important;
+  .el-pagination__total,.el-pagination__goto,.el-pagination__classifier{
+    color: #ffffff !important;
+  }
 }
 
 .text-center {
@@ -183,6 +187,7 @@ aside {
     margin-bottom: 10px;
   }
 }
+
 .app-container {
   margin: 10px;
   box-shadow: 0px 0px 13px 0px #0452C6;
@@ -192,17 +197,21 @@ aside {
 
 .dialog-footer {
   text-align: center;
+
   .el-button:nth-child(1) {
     background: url("../../assets/images/szjj/提交任务.png") no-repeat;
     background-size: 100% 100%;
   }
+
   .el-button:nth-child(2) {
     background: url("../../assets/images/szjj/重新开始.png") no-repeat;
     background-size: 100% 100%;
   }
+
   .el-button--large.is-round {
     padding: 12px 20px 12px 40px !important;
   }
+
   .el-button {
     width: 136px;
     height: 40px;
@@ -212,6 +221,7 @@ aside {
     color: #ffffff;
   }
 }
+
 .app-container2 {
   position: relative;
   padding: 20px;

src/assets/styles/ruoyi.scss

@@ -119,7 +119,7 @@
 }
 
 .pagination-container .el-pagination {
-	right: 0;
+	// right: 0;
 	position: absolute;
 }
 

src/assets/styles/sidebar.scss

@@ -5,8 +5,7 @@
     transition: margin-left .28s;
     margin-left: $base-sidebar-width;
     position: relative;
-    background: url("@/assets/images/背景.png") no-repeat;
+ 
-    background-size: 100% 100%;
   }
 
   .sidebarHide {

src/layout/components/AppMain.vue

@@ -1,7 +1,15 @@
+<!--
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-07-15 15:44:46
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-16 17:40:50
+ * @FilePath: \vue3\src\layout\components\AppMain.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
   <section class="app-main">
     <router-view v-slot="{ Component, route }">
-      <transition name="fade-transform" mode="out-in">
+      <transition name="fade-transform" mode="out-in" :key="route.path">
         <keep-alive :include="tagsViewStore.cachedViews">
           <component v-if="!route.meta.link" :is="Component" :key="route.path" />
         </keep-alive>
@@ -12,18 +20,20 @@
 </template>
 
 <script setup>
-import iframeToggle from "./IframeToggle/index"
+import iframeToggle from "./IframeToggle/index";
-import useTagsViewStore from '@/store/modules/tagsView'
+import useTagsViewStore from "@/store/modules/tagsView";
-const tagsViewStore = useTagsViewStore()
+const tagsViewStore = useTagsViewStore();
 </script>
 
 <style lang="scss" scoped>
 .app-main {
   /* 50= navbar  50  */
-  min-height: calc(100vh - 50px);
+  min-height: calc(100vh - 58px);
   width: 100%;
   position: relative;
   overflow: hidden;
+  background: url("@/assets/images/背景.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .fixed-header + .app-main {
@@ -33,7 +43,7 @@ const tagsViewStore = useTagsViewStore()
 .hasTagsView {
   .app-main {
     /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 84px);
+    min-height: calc(100vh - 58px);
   }
 
   .fixed-header + .app-main {
@@ -64,4 +74,3 @@ const tagsViewStore = useTagsViewStore()
   border-radius: 3px;
 }
 </style>
-

src/layout/components/Sidebar/index.vue

@@ -1,3 +1,11 @@
+<!--
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-08-09 17:36:23
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-16 17:00:39
+ * @FilePath: \vue3\src\layout\components\Sidebar\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
   <div :class="{ 'has-logo': showLogo }" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
     <!-- <logo v-if="showLogo" :collapse="isCollapse" /> -->
@@ -13,7 +21,7 @@
         mode="vertical"
       >
         <sidebar-item
-          v-for="(route, index) in constantRoutes"
+          v-for="(route, index) in dynamicRoutes"
           :key="route.path + index"
           :item="route"
           :base-path="route.path"
@@ -30,7 +38,7 @@ import variables from '@/assets/styles/variables.module.scss'
 import useAppStore from '@/store/modules/app'
 import useSettingsStore from '@/store/modules/settings'
 import usePermissionStore from '@/store/modules/permission'
-import {constantRoutes} from '@/router/index.js'
+import {constantRoutes,dynamicRoutes} from '@/router/index.js'
 
 const route = useRoute();
 const appStore = useAppStore()

src/router/index.js

@@ -70,6 +70,23 @@ export const constantRoutes = [
       },
     ],
   },
+];
+
+// 动态路由，基于用户权限动态去加载
+export const dynamicRoutes = [
+  {
+    path: "",
+    component: Layout,
+    redirect: "/index",
+    children: [
+      {
+        path: "/index",
+        component: () => import("@/views/index"),
+        name: "Index",
+        meta: { title: "首页", icon: "dashboard", affix: true },
+      },
+    ],
+  },
   {
     path: "",
     component: Layout,
@@ -148,7 +165,8 @@ export const constantRoutes = [
         meta: { title: "知识测评", icon: "dashboard", affix: true },
       },
     ],
-  },{
+  },
+  {
     path: "",
     component: Layout,
     redirect: "/Achievement",
@@ -163,12 +181,9 @@ export const constantRoutes = [
   },
 ];
 
-// 动态路由，基于用户权限动态去加载
-export const dynamicRoutes = [];
-
 const router = createRouter({
   history: createWebHistory(),
-  routes: constantRoutes,
+  routes: [...constantRoutes, ...dynamicRoutes],
   scrollBehavior(to, from, savedPosition) {
     if (savedPosition) {
       return savedPosition;

src/store/modules/algorithm.js

@@ -8,9 +8,7 @@ const useAlgorithmStore = defineStore("algorithm", {
     tableData: [],
     tableKey:[],
     userDataLabel:["用户属性表", "用户登录活跃表", "用户消费能力表", "用户行为表", "用户评论表"], //用户数据标签
-    // 指标库
     indexLibrary: [],
-    // 分析数据
     analysisData: [],
   }),
   actions: {

src/views/digitalMarketTech/index.vue

@@ -1,5 +1,13 @@
+<!--
+ * @Author: qinzhenpen qzp1807@126.com
+ * @Date: 2024-08-12 09:29:39
+ * @LastEditors: qinzhenpen qzp1807@126.com
+ * @LastEditTime: 2024-08-16 17:36:43
+ * @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">
+  <div class="rgzn_top  app-container">
     <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>

src/views/digitalMarketingAlgorithms/components/bigData.vue

@@ -22,19 +22,18 @@
     </div>
     <div class="main-right">
       <el-table :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle">
-          <el-table-column v-for="column in algorithmStore.tableKey" :key="column.prop" :prop="column.label" :label="column.label" align="center" />
+        <el-table-column v-for="column in tableLabel" :key="column" :prop="column.prop" :label="column.label" align="center" />
-        <!-- <el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center">
-          <template #default="{ row }">
-            <span>{{ row[column.prop] }}</span>
-          </template>
-        </el-table-column> -->
       </el-table>
+      <pagination v-show="datatotal > 0" :total="datatotal" v-model:page="n_dataTableQuery.index" v-model:limit="n_dataTableQuery.size" @pagination="getSurface" style="margin-top: 10px" />
     </div>
   </div>
 </template>
 <script setup>
+import * as portraitModel from "@/api/portraitModel";
+
 import useUserStore from "@/store/modules/user";
 import useAlgorithmStore from "@/store/modules/algorithm.js";
+import { ref } from "vue";
 const userStore = useUserStore();
 const algorithmStore = useAlgorithmStore();
 // 数据表query
@@ -44,6 +43,7 @@ const n_dataTableQuery = ref({
   tableName: "用户属性表",
   userId: userStore.userInfo.userId,
 });
+const datatotal = ref(0);
 const nzIndex = ref(0);
 const nzData = ["用户属性表", "用户登录活跃表", "用户消费能力表", "用户行为表", "用户评论表"];
 const zjIndex = ref(-1);
@@ -72,9 +72,7 @@ const goZJ = (index) => {
   zjIndex.value = index;
   nzIndex.value = -1;
 };
-const tableData = computed(() => {
+const tableData = ref([]);
-  return algorithmStore.tableData;
-});
 
 const headerCellStyle = () => {
   return {
@@ -84,7 +82,10 @@ const headerCellStyle = () => {
 // 选择内置或自建
 const selectType = (type) => {};
 const getSurface = () => {
-  algorithmStore.getlist(n_dataTableQuery.value);
+  portraitModel.getUserTableData(n_dataTableQuery.value).then((res) => {
+    tableData.value = res?.data?.list;
+    datatotal.value = res.data.total;
+  });
 };
 onMounted(() => {
   getSurface();

src/views/digitalMarketingAlgorithms/components/clusterAnalysis.vue

@@ -0,0 +1,415 @@
+<template>
+    <el-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><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">
+                  <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">
+                  <el-table-column type="selection" prop="date" label="Date"  align="center"/>
+                  <el-table-column prop="name" label="指标"  align="center"/>
+              </el-table>
+              <el-button>确定</el-button>
+          </div>
+          <div class="left-top">
+            <span>二、数据预处理</span>
+          </div>
+          <div class="metrics">
+              <el-select v-model="input" placeholder="请选择数据" style="width: 180px">
+                  <el-option
+                      v-for="item in options"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                  />
+              </el-select>
+          </div>
+          <div class="metrics" style="margin-top:15px">
+              <el-select v-model="input" placeholder="请选择数据" style="width: 180px">
+                  <el-option
+                      v-for="item in options"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.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 :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle">
+                  <el-table-column type="selection" prop="date" label="Date"  align="center"/>
+                  <el-table-column prop="name" label="指标"  align="center"/>
+              </el-table>
+              <el-button>计算</el-button>
+          </div>
+          </div>
+  <div style="margin-top: auto;">
+      <div class="startOver">
+              <img src="../../../assets/images/重新开始.png" alt="">
+              <span>重新开始</span>
+          </div>
+  </div>
+         
+        </div>
+        <div class="main-right">
+          <div>
+              <span style="font-weight: bold;font-size: 18px;color: #3596EB;">分析数据：</span>
+              <el-table :data="tableData"  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>下载</el-button>
+              <el-table :data="tableData"  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>
+      </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">
+          <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="84px" :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-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-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-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-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-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>
+      </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>
+  </template>
+  
+  <script setup>
+  const dialogVisible=ref(false)
+  const tableLabel=reactive([
+      {prop:'date',label:'用户ID'},
+      {prop:'name',label:'登录名'},
+      {prop:'name',label:'用户姓名'},
+      {prop:'name',label:'学号'},
+      {prop:'name',label:'班级'},
+      {prop:'name',label:'专业'},
+      {prop:'name',label:'学校'},
+      {prop:'name',label:'角色名称'},
+      {prop:'name',label:'角色性别'},
+      {prop:'name',label:'角色年龄'},
+      {prop:'name',label:'注册时间'},
+      {prop:'name',label:'所在地'}
+  ])
+  const formInline=reactive({
+      user:'',
+      region:''
+  })
+  const input=ref()
+  const options = [
+    {
+      value: 'Option1',
+      label: 'Option1',
+    },
+    {
+      value: 'Option2',
+      label: 'Option2',
+    },
+    {
+      value: 'Option3',
+      label: 'Option3',
+    },
+    {
+      value: 'Option4',
+      label: 'Option4',
+    },
+    {
+      value: 'Option5',
+      label: 'Option5',
+    },
+  ]
+  const taskSubmit=()=>{
+      dialogVisible.value=true
+  }
+  const tableData = [
+    {
+      date: '2016-05-03',
+      name: 'Tom',
+      address: 'No. 189, Grove St, Los Angeles',
+    },
+    {
+      date: '2016-05-02',
+      name: 'Tom',
+      address: 'No. 189, Grove St, Los Angeles',
+    },
+    {
+      date: '2016-05-04',
+      name: 'Tom',
+      address: 'No. 189, Grove St, Los Angeles',
+    },
+  {
+      date: '2016-05-04',
+      name: 'Tom',
+      address: 'No. 189, Grove St, Los Angeles',
+    },
+  ]
+  const headerCellStyle=()=>{
+       return {
+      backgroundColor: "#1882DE !important", // 设置表头背景颜色
+      color: "#ffffff !important",
+    };
+  }
+  </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;
+  }
+  .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;
+        }
+  }
+  .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;
+      display: flex;
+      width: 205px;
+      height: 100%;
+      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;
+        }
+      }
+      .startOver{
+          margin-left: -10px;
+          width: 205px;
+          height: 55px;
+          background: #00F4FF;
+          //水平居中
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          cursor: pointer;
+      }
+      :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;
+    }
+  }
+    }
+    .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;
+              }
+          }
+      }
+  }
+  .analysisResults{
+      .el-button {
+          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;
+      }
+  }
+  .dialog-footer{
+      margin-bottom: 20px;
+  }
+  </style>
+  <style lang="scss">
+  .el-dialog{
+      background:url('../../../assets/images/弹框.png') !important;
+      background-size: 100% 100% !important;
+      .el-dialog__header{
+          padding: 5px 0px;
+          margin-right: 5px !important;
+          .gbImg{
+              cursor: pointer;
+              width: 51px;
+              height: 31px;
+              background-size: 100% 100%;
+          }
+      }
+      .xtImg{
+      margin-left: 18px;
+      width: 530px;
+    }
+  }
+  .my-header {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    gap: 16px;
+    text-align: center;
+    span{
+      color: #FFFFFF;
+      padding: 38px 20px 0;
+    }
+  }
+  </style>

src/views/digitalMarketingAlgorithms/components/descriptiveStatistics.vue

@@ -16,6 +16,7 @@
     </div>
     <div class="app-main">
       <div class="main-left">
+        <div>
           <div class="left-top">
             <span>一、选择指标</span>
           </div>
@@ -25,7 +26,7 @@
             </el-select>
           </div>
           <div class="metrics-table" style="margin-top: 10px">
-          <el-table border :data="algorithmStore.indexLibrary" style="width: 100%; height: 350px" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange">
+            <el-table border :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>
@@ -35,12 +36,12 @@
             <span>二、数据预处理</span>
           </div>
           <div class="metrics">
-          <el-select placeholder="请选择数据" style="width: 180px">
+            <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 placeholder="请选择数据" style="width: 180px">
+            <el-select v-model="preProcessText.text2" placeholder="请选择数据" style="width: 180px" @change="preProcess">
               <el-option label="缺失值处理-剔除数据" value="缺失值处理-剔除数据" />
               <el-option label="缺失值处理一均值替代" value="缺失值处理一均值替代" />
             </el-select>
@@ -53,20 +54,23 @@
               <el-table-column type="selection" prop="date" label="Date" align="center" />
               <el-table-column prop="name" label="统计量" align="center" />
             </el-table>
-          <el-button>计算</el-button>
+            <el-button @click="modelCalculation">计算</el-button>
+          </div>
         </div>
+        <div style="margin-top: auto">
           <div class="startOver">
             <img src="../../../assets/images/重新开始.png" alt="" />
             <span>重新开始</span>
           </div>
         </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" height="350">
+          <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>
-          <el-pagination style="margin-top: 10px" background layout="prev, pager, next" :total="1000" />
+          <!-- <pagination v-show="datatotal > 0" :total="datatotal" v-model:page="dataqueryParams.index" v-model:limit="dataqueryParams.size" @pagination="submit" style="margin-top: 10px" /> -->
         </div>
         <div class="analysisResults" style="margin-top: 20px">
           <span style="font-weight: bold; font-size: 18px; color: #3596eb; display: block">分析结果：</span>
@@ -80,8 +84,7 @@
       </div>
     </div>
   </el-scrollbar>
-
+  <el-dialog v-model="dialogVisible" title="实训任务提交" width="565" custom-class="dialogClass" :show-close="false">
-  <el-dialog v-model="dialogVisible" title="实训任务提交" width="545" custom-class="dialogClass" :show-close="false">
     <template #header="{ close, titleId, titleClass }">
       <div class="my-header">
         <span :id="titleId" :class="titleClass">实训任务提交</span>
@@ -89,12 +92,50 @@
       </div>
       <img class="xtImg" src="../../../assets/images/线条.png" alt="" />
     </template>
-    This is dialog content.
+    <div class="from-item">
-    <span>This is a message</span>
+      <el-form :inline="true" label-position="right" label-width="84px" :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-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-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-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-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-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>
+    </div>
     <template #footer>
       <div class="dialog-footer">
-        <el-button @click="dialogVisible = false">Cancel</el-button>
+        <el-button @click="dialogVisible = false">确定</el-button>
-        <el-button type="primary" @click="dialogVisible = false">Confirm</el-button>
+        <el-button type="primary" @click="dialogVisible = false">返回</el-button>
       </div>
     </template>
   </el-dialog>
@@ -156,8 +197,8 @@ const modelParams = reactive([
     name: "观测数",
   },
 ]);
-const analysisData=ref([])
+const analysisData = ref([]);
-const analysisHanderKry=ref([])
+const analysisHanderKry = ref([]);
 const tableLabel = reactive([
   { prop: "date", label: "用户ID" },
   { prop: "name", label: "登录名" },
@@ -172,30 +213,28 @@ const tableLabel = reactive([
   { prop: "name", label: "注册时间" },
   { prop: "name", label: "所在地" },
 ]);
+const formInline = ref({});
 const input = ref();
-const options = [
-  {
-    value: "Option1",
-    label: "Option1",
-  },
-  {
-    value: "Option2",
-    label: "Option2",
-  },
-  {
-    value: "Option3",
-    label: "Option3",
-  },
-  {
-    value: "Option4",
-    label: "Option4",
-  },
-  {
-    value: "Option5",
-    label: "Option5",
-  },
-];
 const g_indicatorData = ref([]);
+const preProcessText = ref({
+  text1: "数据去重",
+  text2: "",
+});
+// 模型参数
+const g_modelParameter = ref([]);
+// 预处理
+const preProcess = (tetx) => {
+  marketingAlgorithmApi
+    .getMarketingAlgorithmPreprocessing({
+      mapList: analysisData.value,
+      method: preProcessText.value.text2,
+      userId: n_dataTableQuery.value.userId,
+    })
+    .then((res) => {
+      analysisData.value = res.data;
+    });
+};
+// 提交
 const taskSubmit = () => {
   dialogVisible.value = true;
 };
@@ -230,7 +269,7 @@ const headerCellStyle = () => {
 // 选择指标
 const selectType = (type) => {
   n_dataTableQuery.value.tableName = type;
-  getIndicator()
+  getIndicator();
 };
 // 选择数据
 const handleSelectionChange = (type) => {
@@ -238,19 +277,37 @@ const handleSelectionChange = (type) => {
 };
 // 提交指標
 const submit = () => {
-  marketingAlgorithmApi.getMarketingAlgorithm({ userId: n_dataTableQuery.value.userId, tableName: n_dataTableQuery.value.tableName, fieldList: g_indicatorData.value }).then(res=>{
+  marketingAlgorithmApi.getMarketingAlgorithm({ userId: n_dataTableQuery.value.userId, tableName: n_dataTableQuery.value.tableName, fieldList: g_indicatorData.value }).then((res) => {
-    analysisData.value=res.data
+    analysisData.value = res.data;
-    analysisHanderKry.value=Object.keys(res.data[0])
+    analysisHanderKry.value = Object.keys(res.data[0]);
-
+  });
-  })
 };
 // 选择模型
 const handlemodelSelectionChange = (type) => {
-  console.log(type);
+  g_modelParameter.value = type.map((item) => item.name);
+};
+//计算
+const modelCalculation = () => {
+  const processedData = processArrayData(analysisHanderKry.value, analysisData.value);
+  marketingAlgorithmApi.getMarketingAlgorithmPreprocessing({ map: processedData, statistic: g_modelParameter.value, userId: n_dataTableQuery.value.userId });
 };
+function processArrayData(keys, data) {
+  // 创建结果对象
+  const result = {};
+
+  // 遍历每个键
+  keys.forEach((key) => {
+    // 为每个键创建一个数组，包含 data 数组中该键的所有值
+    const values = data.map((item) => item[key]);
+    // 将键和对应的值数组添加到结果对象中
+    result[key] = values;
+  });
+
+  return result;
+}
 onMounted(() => {
-  getIndicator()
+  getIndicator();
-})
+});
 // 获取指标
 const getIndicator = () => {
   algorithmStore.getUserDatabase({ userId: n_dataTableQuery.value.userId, tableName: n_dataTableQuery.value.tableName });
@@ -286,12 +343,16 @@ const getIndicator = () => {
 }
 .app-main {
   //   background-color: #f5f5f5;
+  min-height: 965px;
   margin: 5px 20px 0;
-  height: calc(117vh - 150px);
+  height: 100%;
   display: flex;
   overflow: auto;
   .main-left {
     //水平居中
+    flex-direction: column;
+    min-height: 965px;
+    display: flex;
     width: 205px;
     height: 100%;
     background: #041c49;
@@ -316,7 +377,6 @@ const getIndicator = () => {
       }
     }
     .startOver {
-      margin-top: 70px;
       margin-left: -10px;
       width: 205px;
       height: 55px;
@@ -338,7 +398,7 @@ const getIndicator = () => {
   }
   .main-right {
     width: 1639px;
-    height: 100%;
+    // height: 100%;
     padding: 20px;
     border: 1px solid #0452c6;
     :deep(.el-table__header) {
@@ -387,13 +447,28 @@ const getIndicator = () => {
     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;
+  }
+}
+.dialog-footer {
+  margin-bottom: 20px;
+}
 </style>
 <style lang="scss">
 .el-dialog {
   background: url("../../../assets/images/弹框.png") !important;
+  background-size: 100% 100% !important;
   .el-dialog__header {
     padding: 5px 0px;
-    margin-right: -4px !important;
+    margin-right: 5px !important;
     .gbImg {
       cursor: pointer;
       width: 51px;
@@ -401,6 +476,10 @@ const getIndicator = () => {
       background-size: 100% 100%;
     }
   }
+  .xtImg {
+    margin-left: 18px;
+    width: 530px;
+  }
 }
 .my-header {
   display: flex;
@@ -412,7 +491,8 @@ const getIndicator = () => {
     color: #ffffff;
     padding: 38px 20px 0;
   }
-  .xtImg {
 }
+.el-table__body-wrapper {
+  // background: #020620 !important;
 }
 </style>

src/views/digitalMarketingAlgorithms/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="rgzn_top">
+    <div class="rgzn_top app-container">
       <div class="top_item">
         <el-button :class="{'active':isActive===1}" @click="activeIndex(1)">用户数据库</el-button>
         <el-button :class="{'active':isActive===2}" @click="activeIndex(2)">描述性统计</el-button>
@@ -19,8 +19,9 @@
 //   import AIGC from './AIGCLargeModel/index.vue'
   import big from './components/bigData.vue'
   import descriptiveStatistics from './components/descriptiveStatistics.vue'
+  import clusterAnalysis from './components/clusterAnalysis.vue'
   const component=ref(big)
-  const pageData=[big,descriptiveStatistics,null]
+  const pageData=[big,descriptiveStatistics,clusterAnalysis]
   const isActive=ref(1)
   const activeIndex=(index)=>{
     isActive.value=index
@@ -33,6 +34,7 @@
       color: #fff;
   }
   .rgzn_top{
+    margin-top: 20px;
     .top_item{
       img{
         margin-right: 5px;

src/views/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="content">
+  <div class="content app-container">
     <div class="title">
       <img src="@/assets/images/indexTopTitle.png" alt="" />
     </div>

src/views/learningCenter/Achievement.vue

@@ -5,131 +5,55 @@
         <div class="study_main_up_top">
           <div class="study_main_up_left">
             <img src="../../assets/icons/svg/score.svg" />
-             <span style="color:#FFFFFF">得分情况</span>
+            <span style="color: #ffffff">得分情况</span>
           </div>
           <el-button type="primary" :icon="Refresh" round @click="updateReportGrade">更新</el-button>
         </div>
         <div class="study_main_up_foot">
-           <el-table
+          <el-table :data="tableData4" :span-method="tableSpanMethod" stripe border :header-cell-style="{ background: '#A2C9FF' }" style="width: 100%">
-             :data="tableData4"
-             :span-method="tableSpanMethod"
-             stripe
-             border
-             :header-cell-style="{background: '#A2C9FF'}"
-             
-             style="width: 100%"
-           >
             <el-table-column prop="sid" label="序号" width="80" align="center" />
-            <el-table-column
+            <el-table-column prop="learningProjects" label="学习项目" align="center" />
-              prop="learningProjects"
+            <el-table-column prop="assessmentItems" label="考核项目" width="150" align="center" />
-              label="学习项目"
+            <el-table-column prop="scoringCriteria" label="计分标准" width="314" align="center" />
-              align="center"
+            <el-table-column prop="totalScore" label="总分" width="129" align="center" />
-            />
+            <el-table-column prop="scoreWeight" label="成绩权重" width="129" align="center" />
-            <el-table-column
+            <el-table-column prop="completionStatus" label="完成情况" width="225" align="center" />
-              prop="assessmentItems"
+            <el-table-column prop="schedule" label="进度" align="center" />
-              label="考核项目"
+            <el-table-column prop="scoreProject" label="得分" width="131" align="center" />
-              width="150"
-              align="center"
-            />
-            <el-table-column
-              prop="scoringCriteria"
-              label="计分标准"
-              width="314"
-              align="center"
-            />
-            <el-table-column
-              prop="totalScore"
-              label="总分"
-              width="129"
-              align="center"
-            />
-            <el-table-column
-              prop="scoreWeight"
-              label="成绩权重"
-              width="129"
-              align="center"
-            />
-            <el-table-column
-              prop="completionStatus"
-              label="完成情况"
-              width="225"
-              align="center"
-            />
-            <el-table-column
-              prop="schedule"
-              label="进度"
-              align="center"
-            />
-            <el-table-column
-              prop="scoreProject"
-              label="得分"
-              width="131"
-              align="center"
-            />
           </el-table>
         </div>
       </div>
       <div class="study_main_but">
         <div class="study_main_but_left">
           <img src="../../assets/icons/svg/sxbg.svg" />
-           <span style="color:#FFFFFF">实训报告</span>
+          <span style="color: #ffffff">实训报告</span>
         </div>
         <!-- action="http://qkljr.sztzjy.com:90/api/stu/concept/block/upload" -->
 
-         <el-upload
+        <el-upload ref="uploadRef" class="upload-demo" :file-list="fileList" :auto-upload="false" :on-change="handleChange" :show-file-list="false" multiple="multiple">
-           ref="uploadRef"
-           class="upload-demo"
-           :file-list="fileList"
-           :auto-upload="false"
-           :on-change="handleChange"
-           :show-file-list="false"
-           multiple="multiple"
-         >
           <template #trigger>
-             <el-button color="#626aef" round ><el-icon><UploadFilled /></el-icon>点击上传</el-button>
+            <el-button color="#626aef" round>
+              <el-icon><UploadFilled /></el-icon>
+              点击上传
+            </el-button>
           </template>
           <!-- <div class="reportPromptFile" v-html="item[`${index}`].path"></div> -->
         </el-upload>
         <div class="study_main_but_foot">
-             <el-table
+          <el-table :data="tableData2" stripe style="width: 100%" border :header-cell-style="{ background: '#A2C9FF' }">
-             :data="tableData2"
+            <el-table-column prop="reportName" label="报告名称" width="289" align="center" />
-             stripe
+            <el-table-column prop="uploadTime" label="上传时间" width="289" align="center" />
-             style="width: 100%"
+            <el-table-column prop="size" label="文件大小" width="290" align="center" />
-             border
+            <el-table-column prop="rating" label="评分" width="289" align="center" />
-             :header-cell-style="{background: '#A2C9FF'}"
+            <el-table-column label="操作" class="controls" width="286" align="center">
-           >
+              <el-link type="success" @click="uploadReport">
-           <el-table-column
+                <el-icon><Download /></el-icon>
-               prop="reportName"
+                下载
-               label="报告名称"
+              </el-link>
-               width="289"
+              <el-link type="warning" @click="showComments">
-               align="center"
+                <el-icon><Tickets /></el-icon>
-             />
+                查看评语
-             <el-table-column
+              </el-link>
-               prop="uploadTime"
-               label="上传时间"
-               width="289"
-               align="center"
-             />
-             <el-table-column
-               prop="size"
-               label="文件大小"
-               width="290"
-               align="center"
-             />
-             <el-table-column
-               prop="rating"
-               label="评分"
-               width="289"
-               align="center"
-             />
-             <el-table-column
-               label="操作"
-               class="controls"
-               width="286"
-               align="center"
-             >
-             <el-link type="success" @click="uploadReport"><el-icon><Download /></el-icon>下载</el-link>
-             <el-link type="warning" @click="showComments"><el-icon><Tickets /></el-icon>查看评语</el-link>
             </el-table-column>
           </el-table>
         </div>
@@ -137,12 +61,7 @@
     </div>
   </div>
 
-   <el-dialog
+  <el-dialog v-model="dialogVisible" title="评语" width="30%" :before-close="handleClose">
-     v-model="dialogVisible"
-     title="评语"
-     width="30%"
-     :before-close="handleClose"
-   >
     <span>{{ tableData2[0].teacherComments }}</span>
     <template #footer>
       <span class="dialog-footer">
@@ -157,16 +76,16 @@
 <script setup>
 import { Refresh } from "@element-plus/icons-vue";
 import { onMounted, ref } from "vue";
- import * as API from "@/api/prtrait/prtrait.js" 
+import * as API from "@/api/prtrait/prtrait.js";
 //  import {Base64} from 'js-base64'
 //  import { useRouter } from "vue-router";
- import {download} from '@/utils/request.js'
+import { download } from "@/utils/request.js";
- import { getToken,getUserInfo } from '@/utils/auth'
+import { getToken, getUserInfo } from "@/utils/auth";
 import { ElMessage } from "element-plus";
 
 //  const router=useRouter();
 //评语弹窗
- const dialogVisible = ref(false)
+const dialogVisible = ref(false);
 
 const tableSpanMethod = computed(() => {
   // if (tableData.value.length >= 5) {
@@ -184,8 +103,8 @@
     }
   }
 };
- const tableData2 =ref([])
+const tableData2 = ref([]);
- const tableData=ref([])
+const tableData = ref([]);
 const tableData4 = ref([
   {
     sid: 1,
@@ -194,8 +113,8 @@
     scoreProject: null,
     scoreWeight: null,
     scoringCriteria: "",
-     schedule:'0%',
+    schedule: "0%",
-     totalScore:100
+    totalScore: 100,
   },
   {
     sid: 2,
@@ -204,8 +123,8 @@
     scoreProject: null,
     scoreWeight: null,
     scoringCriteria: "",
-     schedule:'0%',
+    schedule: "0%",
-     totalScore:100
+    totalScore: 100,
   },
   {
     sid: 3,
@@ -214,8 +133,8 @@
     scoreProject: null,
     scoreWeight: null,
     scoringCriteria: "",
-     schedule:'0%',
+    schedule: "0%",
-     totalScore:100
+    totalScore: 100,
   },
   {
     sid: 4,
@@ -224,8 +143,8 @@
     scoreProject: null,
     scoreWeight: null,
     scoringCriteria: "",
-     schedule:'0%',
+    schedule: "0%",
-     totalScore:100
+    totalScore: 100,
   },
   {
     sid: 5,
@@ -234,31 +153,30 @@
     scoreProject: null,
     scoreWeight: null,
     scoringCriteria: "",
-     schedule:'0%',
+    schedule: "0%",
-     totalScore:100
+    totalScore: 100,
   },
- ])
+]);
 const calculateAverageScore = () => {
-   
   // 计算每个对象的权重乘以得分，并存储在一个新数组中
- const weightedScores = tableData4.value.map(item => {
+  const weightedScores = tableData4.value.map((item) => {
     if (item.scoreProject !== null) {
       // 解析权重字符串，去掉百分号并转换为数字
-   const weight = parseFloat(item.scoreWeight.replace('%', ''))/100;
+      const weight = parseFloat(item.scoreWeight.replace("%", "")) / 100;
       // 解析得分字符串并转换为数字
       const score = parseFloat(item.scoreProject);
       // 计算权重乘以得分
       const weightedScore = weight * score;
       return weightedScore;
     }
-   return 0
+    return 0;
   });
 
   // 使用 reduce 方法计算新数组中所有元素的总和
   const totalWeightedScore = weightedScores.reduce((acc, curr) => acc + curr, 0);
   // 最终结果是总和乘以5
   const finalResult = totalWeightedScore;
- const finalResult1=String(finalResult.toFixed())
+  const finalResult1 = String(finalResult.toFixed());
   const newData = {
     sid: "合计",
     project: "",
@@ -268,49 +186,48 @@
     weight: "",
     condition: "",
     score: "",
-  }
+  };
-   tableData4.value.push(newData)
+  tableData4.value.push(newData);
- }
+};
- const fileList=ref([])
+const fileList = ref([]);
 const data = ref({
-   "ascription":'',
+  ascription: "",
-   "userId":JSON.parse(getUserInfo()).userId,
+  userId: JSON.parse(getUserInfo()).userId,
-   "schoolId":JSON.parse(getUserInfo()).schoolId
+  schoolId: JSON.parse(getUserInfo()).schoolId,
- })
+});
 const handleChange = (info) => {
   fileList.value.push(info);
   let formData2 = new FormData();
-       formData2.append("file", fileList.value[0].raw)
+  formData2.append("file", fileList.value[0].raw);
-       formData2.append("stuBlockProduct", JSON.stringify(data.value))
+  formData2.append("stuBlockProduct", JSON.stringify(data.value));
   fileList.value.splice(0, fileList.value.length);
   API.uploadTrainingReport(formData2).then(() => {
-         getReports()
+    getReports();
-       })
+  });
-     }
+};
 const uploadRef = ref(null);
 
 const getReports = () => {
   API.getDetailsTrainingReport(data.value).then((res) => {
     tableData2.value.splice(0, tableData2.value.length);
     if (res.data !== null) {
-            tableData2.value.push(res.data)
+      tableData2.value.push(res.data);
-            tableData2.value[0].size=tableData2.value[0].size+"kb"
+      tableData2.value[0].size = tableData2.value[0].size + "kb";
-         }
-      })
     }
+  });
+};
 
 const data2 = {
-   "userId":JSON.parse(getUserInfo()).userId,
+  userId: JSON.parse(getUserInfo()).userId,
-   "TOKEN":'Bearer '+getToken()
+  TOKEN: "Bearer " + getToken(),
- }
+};
 //下载
 const uploadReport = async () => {
-
+  window.open(`http://118.31.7.2:7899/api/stu/concept/block/download?TOKEN= ${"Bearer " + getToken()}&userId=${data2.userId}`);
-   window.open(`http://118.31.7.2:7899/api/stu/concept/block/download?TOKEN= ${'Bearer '+getToken()}&userId=${data2.userId}`)
   // window.open(`http://202.97.179.126:8800/api/stu/concept/block/download?reportName=${tableData2.value[0].reportName}&TOKEN= ${'Bearer '+getToken()}&module=${data2.module}&userId=${data.userId}`)
   // window.open(`http://202.199.90.115:8800/api/stu/concept/block/download?reportName=${tableData2.value[0].reportName}&TOKEN= ${'Bearer '+getToken()}&module=${data2.module}&userId=${data.userId}`)
- }
+};
- const isUpdate=ref(false)
+const isUpdate = ref(false);
 //查看评语
 const showComments = () => {
   if (tableData2.value.length <= 0) {
@@ -318,100 +235,99 @@
       message: "暂无评语",
       type: "warning",
     });
-     return 
+    return;
-   }
-   dialogVisible.value=true
   }
+  dialogVisible.value = true;
+};
 onMounted(() => {
   //  data.value.module='数字营销'
   setTimeout(() => {
-    cerateGrade()
+    cerateGrade();
   }, 300);
 
   setTimeout(() => {
-      getReports()
+    getReports();
   }, 600);
- })
+});
 const cerateGrade = () => {
   API.academicRecordEnquiry(data.value).then((res) => {
-         let currentId =1
+    let currentId = 1;
-       const tableData3 = res.data.map(item => {
+    const tableData3 = res.data.map((item) => {
-         const weight1 = parseInt(item.scoreWeight*100)
+      const weight1 = parseInt(item.scoreWeight * 100);
       const weight2 = `${weight1}%`;
       if (item.learningProjects === "知识概要") {
-           const score=parseFloat(item.scoringCriteria)
+        const score = parseFloat(item.scoringCriteria);
-           const time = reactive({value: '/'});
+        const time = reactive({ value: "/" });
         if (item.completionStatus !== null) {
-             time.value=parseFloat(item.completionStatus)
+          time.value = parseFloat(item.completionStatus);
         }
-          tableData4.value[0].scoringCriteria=`阅读1分钟得${score}分,1分钟以下不得分`
+        tableData4.value[0].scoringCriteria = `阅读1分钟得${score}分,1分钟以下不得分`;
-          tableData4.value[0].completionStatus=`阅读${time.value}分钟`
+        tableData4.value[0].completionStatus = `阅读${time.value}分钟`;
-          tableData4.value[0].scoreProject=item.scoreProject
+        tableData4.value[0].scoreProject = item.scoreProject;
-          tableData4.value[0].scoreWeight=weight2
+        tableData4.value[0].scoreWeight = weight2;
-          tableData4.value[0].schedule=item.schedule+'%'
+        tableData4.value[0].schedule = item.schedule + "%";
       }
       if (item.learningProjects === "实验实训") {
-           const score=parseFloat(item.scoringCriteria)
+        const score = parseFloat(item.scoringCriteria);
-           const time = reactive({value: '/'});
+        const time = reactive({ value: "/" });
         if (item.completionStatus !== null) {
-             time.value=parseFloat(item.completionStatus)
+          time.value = parseFloat(item.completionStatus);
         }
-           tableData4.value[3].scoringCriteria=`输错/选错次数扣${score}分`
+        tableData4.value[3].scoringCriteria = `输错/选错次数扣${score}分`;
-           tableData4.value[3].completionStatus=`输错/选错 ${time.value}次`
+        tableData4.value[3].completionStatus = `输错/选错 ${time.value}次`;
-           tableData4.value[3].scoreProject=item.scoreProject
+        tableData4.value[3].scoreProject = item.scoreProject;
-           tableData4.value[3].scoreWeight=weight2
+        tableData4.value[3].scoreWeight = weight2;
-           tableData4.value[3].schedule=item.schedule+'%'
+        tableData4.value[3].schedule = item.schedule + "%";
       }
       if (item.learningProjects === "资源学习") {
-           const score=parseFloat(item.scoringCriteria)
+        const score = parseFloat(item.scoringCriteria);
-           const time = reactive({value: '/'});
+        const time = reactive({ value: "/" });
         if (item.completionStatus !== null) {
-             time.value=parseFloat(item.completionStatus)
+          time.value = parseFloat(item.completionStatus);
         }
-           tableData4.value[1].scoringCriteria=`观看资源1分钟得${score}分`
+        tableData4.value[1].scoringCriteria = `观看资源1分钟得${score}分`;
-           tableData4.value[1].completionStatus=`观看${time.value}分钟`
+        tableData4.value[1].completionStatus = `观看${time.value}分钟`;
-           tableData4.value[1].scoreProject=item.scoreProject
+        tableData4.value[1].scoreProject = item.scoreProject;
-           tableData4.value[1].scoreWeight=weight2
+        tableData4.value[1].scoreWeight = weight2;
-           tableData4.value[1].schedule=item.schedule+'%'
+        tableData4.value[1].schedule = item.schedule + "%";
       }
       if (item.learningProjects === "学习测评") {
-           const time = reactive({value: '/'});
+        const time = reactive({ value: "/" });
         if (item.completionStatus !== null) {
-             time.value=parseFloat(item.completionStatus)
+          time.value = parseFloat(item.completionStatus);
         }
-           const score=parseFloat(item.scoringCriteria)
+        const score = parseFloat(item.scoringCriteria);
-           tableData4.value[2].scoringCriteria=`${score}分/道`
+        tableData4.value[2].scoringCriteria = `${score}分/道`;
-           tableData4.value[2].completionStatus=`错${time.value}道`
+        tableData4.value[2].completionStatus = `错${time.value}道`;
-           tableData4.value[2].scoreProject=item.scoreProject
+        tableData4.value[2].scoreProject = item.scoreProject;
-           tableData4.value[2].scoreWeight=weight2
+        tableData4.value[2].scoreWeight = weight2;
-           tableData4.value[2].schedule=item.schedule+'%'
+        tableData4.value[2].schedule = item.schedule + "%";
       }
       if (item.learningProjects === "实训报告") {
-           tableData4.value[4].scoringCriteria=`提交实训报告，教师评分`
+        tableData4.value[4].scoringCriteria = `提交实训报告，教师评分`;
-           tableData4.value[4].completionStatus=item.completionStatus
+        tableData4.value[4].completionStatus = item.completionStatus;
         if (item.scoreProject !== null) {
-             tableData4.value[4].scoreProject=item.scoreProject
+          tableData4.value[4].scoreProject = item.scoreProject;
         }
-           tableData4.value[4].scoreWeight=weight2
+        tableData4.value[4].scoreWeight = weight2;
-           tableData4.value[4].schedule=item.schedule+'%'
+        tableData4.value[4].schedule = item.schedule + "%";
       }
       return {
-               ...item
+        ...item,
       };
     });
     if (isUpdate.value) {
-           return
+      return;
-         }
-       tableData.value.push(...tableData3)
-       calculateAverageScore()
-      })
     }
+    tableData.value.push(...tableData3);
+    calculateAverageScore();
+  });
+};
 
 const updateReportGrade = () => {
-   getReports()
+  getReports();
-   cerateGrade()
+  cerateGrade();
- }
+};
-   
 </script>
 <style lang="scss" scoped>
 .study_main {
@@ -422,7 +338,7 @@
       margin-right: 0px;
       height: 28px;
       width: 125px;
-     background:  #0E64FE;
+      background: #0e64fe;
     }
     .study_main_up_top {
       display: flex;
@@ -476,30 +392,27 @@
 }
 
 // 设置表格行高度
- :deep(.el-table__body tr,
+:deep(.el-table__body tr, .el-table__body td) {
- .el-table__body td) {
   padding: 0;
   height: 40px !important;
-   border: 2px solid #8CA4EC;
+  border: 2px solid #8ca4ec;
 }
 
- 
+:deep(.el-table__body tr:nth-child(6), .el-table__body td) {
- :deep(.el-table__body tr:nth-child(6),
- .el-table__body td) {
   padding: 0;
   height: 40px !important;
-   color: #FF8C01;
+  color: #ff8c01;
 }
 ::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td {
-    background: #F2F5FB;
+  background: #f2f5fb;
 }
 
 ::v-deep .study_main_up_foot .el-table {
-   --el-table-border-color: #8CA4EC;
+  --el-table-border-color: #8ca4ec;
 }
 
 ::v-deep .study_main_but_foot .el-table {
-   --el-table-border-color: #9E74FF;
+  --el-table-border-color: #9e74ff;
 }
 ::v-deep .el-table__header-wrapper {
   background: red;
@@ -507,8 +420,7 @@
 .reportPromptFile {
   font-size: 12px;
   line-height: 7px;
-     font-family: '微软雅黑';
+  font-family: "微软雅黑";
   font-weight: 300;
 }
 </style>
- 

src/views/portraitModel/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="content">
+  <div class="content app-container">
     <div class="tabList">
       <div class="tabs" v-for="item in tabList" :key="item.id" @click="changeTab(item)">
         <div style="display: flex; align-items: center">