From 0cb7ceeec1f499274d4dd055e4cfca4f7327ee7b Mon Sep 17 00:00:00 2001
From: HeHaonan <1822907900@qq.com>
Date: Tue, 13 Aug 2024 18:22:21 +0800
Subject: [PATCH] =?UTF-8?q?=E7=94=A8=E6=88=B7=E7=B2=98=E6=80=A7=E5=88=86?=
 =?UTF-8?q?=E6=9E=90=E3=80=81AARRR=E7=94=A8=E6=88=B7=E8=BF=90=E8=90=A5?=
 =?UTF-8?q?=E5=88=86=E6=9E=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/portraitModel.js                      |   8 +
 src/utils/request.js                          |   3 +-
 .../components/AARRRAnalysis.vue              | 260 +++++++++++----
 .../components/repurchaseAnalysis.vue         | 120 +++++++
 .../components/retainAnalysis.vue             | 120 +++++++
 .../components/viscosityAnalysis.vue          | 312 +++++++++++++++++-
 6 files changed, 752 insertions(+), 71 deletions(-)

diff --git a/src/api/portraitModel.js b/src/api/portraitModel.js
index 7353c24..d992841 100644
--- a/src/api/portraitModel.js
+++ b/src/api/portraitModel.js
@@ -65,6 +65,14 @@ export function downloadDataByRetain(data) {
       params: data,
     });
   }
+//数据下载-用户粘性分析
+export function downloadDataByViscosity(data) {
+    return request({
+      url: "/api/downDataByUserPortrait/analysisByStickiness",
+      method: "get",
+      params: data,
+    });
+  }
 //筛选出统计样本
 export function filterOutStatisSample(data) {
   return request({
diff --git a/src/utils/request.js b/src/utils/request.js
index df87be3..a56ec3b 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -16,7 +16,8 @@ axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
 const service = axios.create({
   // axios中请求配置有baseURL选项，表示请求URL公共部分
   // baseURL: import.meta.env.VITE_APP_BASE_API,
-  baseURL:'http://192.168.2.28:9868/',
+  // baseURL:'http://192.168.2.28:9868/',
+  baseURL:'http://192.168.2.16:9868/',
   // 超时
   timeout: 10000
 })
diff --git a/src/views/portraitModel/components/AARRRAnalysis.vue b/src/views/portraitModel/components/AARRRAnalysis.vue
index 34aad1c..883f3bd 100644
--- a/src/views/portraitModel/components/AARRRAnalysis.vue
+++ b/src/views/portraitModel/components/AARRRAnalysis.vue
@@ -91,7 +91,7 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
             <div style="margin-left: 20px">
               <p>1、推广渠道中，获客数量最多的是：</p>
               <el-select
-                v-model="asd"
+                v-model="step1Params1"
                 placeholder="请选择"
                 style="width: 200px"
               >
@@ -104,7 +104,7 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
             <div style="margin-left: 20px">
               <p>2、哪种渠道的获客质量最高：</p>
               <el-select
-                v-model="asd"
+                v-model="step1Params2"
                 placeholder="请选择"
                 style="width: 200px"
               >
@@ -114,7 +114,9 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
                 <el-option :label="'线下活动推广'" :value="'线下活动推广'" />
               </el-select>
             </div>
-            <div class="submit" style="margin-top: 75px">提交</div>
+            <div class="submit" style="margin-top: 75px" @click="step1Submit">
+              提交
+            </div>
           </div>
         </div>
       </div>
@@ -129,60 +131,54 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
           对各月份的用户新增情况进行分析，折线图如下图：
         </span>
         <div style="margin-top: 10px; display: flex">
-          <el-table
-            :data="step2Data"
-            style="width: 650px"
-            border
-            :header-cell-style="{
-              color: '#fff',
-              fontSize: '14px',
-              backgroundColor: '#6A7DE9!important',
-            }"
-          >
-            <el-table-column label="周数" align="center" prop="week">
-            </el-table-column>
-            <el-table-column label="日期间隔" align="center" prop="interval">
-            </el-table-column>
-            <el-table-column
-              label="周活跃用户（个）"
-              align="center"
-              prop="description"
-            >
-              <template #default="scope">
-                <el-input
-                  v-model="scope.row.params1"
-                  placeholder="请输入"
-                  style="width: 90px"
-                >
-                </el-input>
-              </template>
-            </el-table-column>
-            <el-table-column
-              label="周活跃率（%）"
-              align="center"
-              prop="description"
+          <div>
+            <div
+              @click="drawLineEchart"
+              class="draw"
+              style="
+                padding-left: 25px;
+                margin-bottom: 10px;
+                background-size: 180px 31px;
+                width: 180px;
+                padding-left: 32px;
+              "
             >
-              <template #default="scope">
-                <el-input
-                  v-model="scope.row.params2"
-                  placeholder="请输入"
-                  style="width: 90px"
-                >
-                </el-input
-                >%
-              </template>
-            </el-table-column>
-          </el-table>
-          <div style="width: 650px">
-            <div class="analysisConclusion">分析结论</div>
-            <el-input
-              v-model="analysisConclusion"
-              style="margin-left: 20px; margin-top: 20px; margin-bottom: 20px"
-              :rows="8"
-              type="textarea"
-              placeholder="请输入"
-            />
-            <div class="submit">提交</div>
+              生成月度激活率图表
+            </div>
+            <div id="echartsLine" style="width: 1000px; height: 274px"></div>
+          </div>
+          <div style="margin-top: 40px">
+            <div class="analysisBtn">图表分析</div>
+            <div style="margin-left: 20px">
+              <p>1、月度平均激活率是多少：</p>
+              <el-select
+                v-model="asd"
+                placeholder="请选择"
+                style="width: 200px"
+              >
+                <el-option :label="'50%'" :value="'50%'" />
+                <el-option :label="'60%'" :value="'60%'" />
+                <el-option :label="'70%'" :value="'70%'" />
+                <el-option :label="'80%'" :value="'80%'" />
+                <el-option :label="'90%'" :value="'90%'" />
+              </el-select>
+            </div>
+            <div style="margin-left: 20px">
+              <p>2、需要重点分析哪个月的激活率：</p>
+              <el-select
+                v-model="asd"
+                placeholder="请选择"
+                style="width: 200px"
+              >
+                <el-option
+                  :label="item.label"
+                  :value="item.value"
+                  v-for="item in activationList"
+                  :key="item.value"
+                />
+              </el-select>
+            </div>
+            <div class="submit" style="margin-top: 75px">提交</div>
           </div>
         </div>
       </div>
@@ -197,11 +193,7 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
         </span>
         <div style="margin-top: 10px; display: flex">
           <div>
-            <div
-              class="draw"
-              style="padding-left: 25px; margin-bottom: 10px"
-              @click="drawEcharts"
-            >
+            <div class="draw" style="padding-left: 25px; margin-bottom: 10px">
               生成留存率图表
             </div>
 
@@ -390,6 +382,8 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
 </template>
 
 <script setup>
+import * as portraitModel from "@/api/portraitModel";
+import { downBlobFile } from "@/utils/index.js";
 import * as echarts from "echarts";
 const { proxy } = getCurrentInstance();
 const knowledgeHtml = ref(
@@ -400,6 +394,19 @@ const dayValue = ref("");
 const combinationValue1 = ref("");
 const combinationValue2 = ref("");
 const analysisConclusion = ref("");
+const errorNum = ref(0);
+const step1Error = ref(0);
+const step2Error = ref(0);
+const step3Error = ref(0);
+const step4Error = ref(0);
+const step5Error = ref(0);
+const step1AnswerFlag = ref(false);
+const step2AnswerFlag = ref(false);
+const step3AnswerFlag = ref(false);
+const step4AnswerFlag = ref(false);
+const step5AnswerFlag = ref(false);
+const step1Params1 = ref("");
+const step1Params2 = ref("");
 const knowledgeFlag = ref(false);
 //时间间隔分组数-7天内
 const sevenNum = ref(0);
@@ -409,6 +416,48 @@ const fiftyNum = ref(0);
 const thirtyNumIn = ref(0);
 //时间间隔分组数-30天以上
 const thirtyNumOut = ref(0);
+const activationList = ref([
+  {
+    label: "2020-01",
+    value: "2020-01",
+  },
+  {
+    label: "2020-02",
+    value: "2020-02",
+  },
+  {
+    label: "2020-03",
+    value: "2020-03",
+  },
+  {
+    label: "2020-04",
+    value: "2020-04",
+  },
+  {
+    label: "2020-05",
+    value: "2020-05",
+  },
+  {
+    label: "2020-06",
+    value: "2020-06",
+  },
+  {
+    label: "2020-07",
+    value: "2020-07",
+  },
+  {
+    label: "2020-08",
+    value: "2020-08",
+  },
+  {
+    label: "2020-09",
+    value: "2020-09",
+  },
+  {
+    label: "2020-10",
+    value: "2020-10",
+  },
+]);
 const step1Data = ref([
   {
     data1: "基础线上工作",
@@ -865,6 +914,95 @@ const drawEcharts = () => {
 
   option && myChart.setOption(option);
 };
+const drawLineEchart = () => {
+  var chartDom = document.getElementById("echartsLine");
+  var myChart = echarts.init(chartDom, "dark");
+  var option;
+
+  option = {
+    xAxis: {
+      type: "category",
+      boundaryGap: false,
+      data: [
+        "2020-01",
+        "2020-02",
+        "2020-03",
+        "2020-04",
+        "2020-05",
+        "2020-06",
+        "2020-07",
+        "2020-08",
+        "2020-09",
+        "2020-10",
+      ],
+      axisLabel: {
+        textStyle: {
+          color: "#fff", //坐标值得具体的颜色
+        },
+      },
+    },
+    yAxis: {
+      type: "value",
+      name: "激活率",
+      axisLabel: {
+        formatter: "{value}%", // 在这里添加单位
+        textStyle: {
+          color: "#fff", //坐标值得具体的颜色
+        },
+      },
+    },
+    tooltip: {
+      //   trigger: "axis",
+      formatter: "注册日期：{b}<br />激活率：{c}%",
+    },
+    series: [
+      {
+        data: [81.9, 83.78, 79.39, 77.29, 78.25, 73.43, 80, 84.9, 84.48, 58.33],
+        label: {
+          formatter: "{c}%",
+          show: true,
+          position: "top",
+        },
+        type: "line",
+        lineStyle: {
+          color: "#AACC63",
+        },
+        itemStyle: {
+          color: "#AACC63",
+        },
+        areaStyle: {
+          color: {
+            type: "linear",
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: "#00751C", // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: "#002652", // 100% 处的颜色
+              },
+            ],
+            global: false, // 缺省为 false
+          },
+        },
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+};
+const step1Submit = () => {
+  if (step1Params1.value == "" || step1Params2.value == "") {
+    proxy.$modal.msgError("请先完成所有填空");
+    return;
+  }
+  console.log(666);
+};
 </script>
 
 <style scoped lang="scss">
diff --git a/src/views/portraitModel/components/repurchaseAnalysis.vue b/src/views/portraitModel/components/repurchaseAnalysis.vue
index f347682..39bb6c2 100644
--- a/src/views/portraitModel/components/repurchaseAnalysis.vue
+++ b/src/views/portraitModel/components/repurchaseAnalysis.vue
@@ -1325,6 +1325,12 @@ const typeData = ref([
     data2: "占总销售额的10%，给予一般关注",
   },
 ]);
+onMounted(() => {
+  getData();
+});
+onBeforeUnmount(() => {
+  saveData();
+});
 const moveUp = (index, row) => {
   console.log("上移", index, row);
   if (index > 0) {
@@ -1730,6 +1736,120 @@ const step5Submit = () => {
   proxy.$modal.msgSuccess("提交成功");
   step5AnswerFlag.value = true;
 };
+const saveData = () => {
+  const params = {
+    stepFiveA: step1Data.value[0].params,
+    stepFiveB: step1Data.value[1].params,
+    stepFiveC: step1Data.value[2].params,
+    stepFiveD: step1Data.value[3].params,
+    stepSixA: step1Data.value[4].params,
+    stepSixB: step1Data.value[5].params,
+    stepSixC: step1Data.value[6].params,
+    stepSixD: step1Data.value[7].params,
+    stepSevenA: step1Data.value[8].params,
+    stepSevenB: step1Data.value[9].params,
+    stepSevenC: step1Data.value[10].params,
+    stepSevenD: step1Data.value[11].params,
+    stepEightA: step1Data.value[12].params,
+    stepEightB: step1Data.value[13].params,
+    stepEightC: step1Data.value[14].params,
+    stepEightD: step1Data.value[15].params,
+    stepNineA: step1Data.value[16].params,
+    stepNineB: step1Data.value[17].params,
+    stepNineC: step1Data.value[18].params,
+    stepNineD: step1Data.value[19].params,
+    stepTenA: step2Data.value[0].params,
+    stepTenB: step2Data.value[1].params,
+    stepTenC: step2Data.value[2].params,
+    stepTenD: step4Data.value[0].params1,
+    stepElevenA: step4Data.value[0].params2,
+    stepOneA: step4Data.value[2].params1,
+    stepOneB: step4Data.value[2].params2,
+    stepOneC: step4Data.value[4].params1,
+    stepOneD: step4Data.value[4].params2,
+    stepTwoA: step4Data.value[6].params1,
+    stepTwoB: step4Data.value[6].params2,
+    stepTwoC: step5DataTable2.value[0].params,
+    stepThreeA: step5DataTable2.value[1].params,
+    stepThreeB: step5DataTable2.value[2].params,
+    stepThreeC: step5DataTable2.value[3].params,
+    stepThreeD: step5DataTable2.value[4].params,
+    stepFourA: step5DataTable3.value[0].params1,
+    stepFourB: step5DataTable3.value[0].params2,
+    stepFourC: step5DataTable3.value[1].params1,
+    stepFourD: step5DataTable3.value[1].params2,
+    stepNewOne: step5DataTable3.value[2].params1,
+    stepNewTwo: step5DataTable3.value[2].params2,
+    stepNewThree: step5DataTable3.value[3].params1,
+    stepNewFive: step5DataTable3.value[3].params2,
+    stepNewSix: step5DataTable3.value[4].params1,
+    stepNewEight: step5DataTable3.value[4].params2,
+  };
+  portraitModel
+    .saveData({
+      userId: 492,
+      module: "复购分析",
+      ...params,
+    })
+    .then((res) => {})
+    .catch((error) => {});
+};
+const getData = () => {
+  portraitModel
+    .getData({
+      userId: 492,
+      module: "复购分析",
+    })
+    .then((res) => {
+      step1Data.value[0].params = res.data.stepFiveA;
+      step1Data.value[1].params = res.data.stepFiveB;
+      step1Data.value[2].params = res.data.stepFiveC;
+      step1Data.value[3].params = res.data.stepFiveD;
+      step1Data.value[4].params = res.data.stepSixA;
+      step1Data.value[5].params = res.data.stepSixB;
+      step1Data.value[6].params = res.data.stepSixC;
+      step1Data.value[7].params = res.data.stepSixD;
+      step1Data.value[8].params = res.data.stepSevenA;
+      step1Data.value[9].params = res.data.stepSevenB;
+      step1Data.value[10].params = res.data.stepSevenC;
+      step1Data.value[11].params = res.data.stepSevenD;
+      step1Data.value[12].params = res.data.stepEightA;
+      step1Data.value[13].params = res.data.stepEightB;
+      step1Data.value[14].params = res.data.stepEightC;
+      step1Data.value[15].params = res.data.stepEightD;
+      step1Data.value[16].params = res.data.stepNineA;
+      step1Data.value[17].params = res.data.stepNineB;
+      step1Data.value[18].params = res.data.stepNineC;
+      step1Data.value[19].params = res.data.stepNineD;
+      step2Data.value[0].params = res.data.stepTenA;
+      step2Data.value[1].params = res.data.stepTenB;
+      step2Data.value[2].params = res.data.stepTenC;
+      step4Data.value[0].params1 = res.data.stepTenD;
+      step4Data.value[0].params2 = res.data.stepElevenA;
+      step4Data.value[2].params1 = res.data.stepOneA;
+      step4Data.value[2].params2 = res.data.stepOneB;
+      step4Data.value[4].params1 = res.data.stepOneC;
+      step4Data.value[4].params2 = res.data.stepOneD;
+      step4Data.value[6].params1 = res.data.stepTwoA;
+      step4Data.value[6].params2 = res.data.stepTwoB;
+      step5DataTable2.value[0].params = res.data.stepTwoC;
+      step5DataTable2.value[1].params = res.data.stepThreeA;
+      step5DataTable2.value[2].params = res.data.stepThreeB;
+      step5DataTable2.value[3].params = res.data.stepThreeC;
+      step5DataTable2.value[4].params = res.data.stepThreeD;
+      step5DataTable3.value[0].params1 = res.data.stepFourA;
+      step5DataTable3.value[0].params2 = res.data.stepFourB;
+      step5DataTable3.value[1].params1 = res.data.stepFourC;
+      step5DataTable3.value[1].params2 = res.data.stepFourD;
+      step5DataTable3.value[2].params1 = res.data.stepNewOne;
+      step5DataTable3.value[2].params2 = res.data.stepNewTwo;
+      step5DataTable3.value[3].params1 = res.data.stepNewThree;
+      step5DataTable3.value[3].params2 = res.data.stepNewFive;
+      step5DataTable3.value[4].params1 = res.data.stepNewSix;
+      step5DataTable3.value[4].params2 = res.data.stepNewEight;
+    })
+    .catch((error) => {});
+};
 const downloadData = () => {
   portraitModel
     .downloadDataByRepurchase({})
diff --git a/src/views/portraitModel/components/retainAnalysis.vue b/src/views/portraitModel/components/retainAnalysis.vue
index f514e34..0047bd0 100644
--- a/src/views/portraitModel/components/retainAnalysis.vue
+++ b/src/views/portraitModel/components/retainAnalysis.vue
@@ -1321,6 +1321,12 @@ const step1RightAnswer = ref([
   "72",
   "79",
 ]);
+onMounted(() => {
+  getData();
+});
+onBeforeUnmount(() => {
+  saveData();
+});
 const moveUp = (index, row) => {
   console.log("上移", index, row);
   if (index > 0) {
@@ -1521,6 +1527,120 @@ const step3Submit = () => {
   proxy.$modal.msgSuccess("提交成功");
   step3AnswerFlag.value = true;
 };
+const saveData = () => {
+  const params = {
+    stepFiveA: step1Data.value[0].params,
+    stepFiveB: step1Data.value[1].params,
+    stepFiveC: step1Data.value[2].params,
+    stepFiveD: step1Data.value[3].params,
+    stepSixA: step1Data.value[4].params,
+    stepSixB: step1Data.value[5].params,
+    stepSixC: step1Data.value[6].params,
+    stepSixD: step1Data.value[7].params,
+    stepSevenA: step1Data.value[8].params,
+    stepSevenB: step1Data.value[9].params,
+    stepSevenC: step1Data.value[10].params,
+    stepSevenD: step1Data.value[11].params,
+    stepEightA: step1Data.value[12].params,
+    stepEightB: step2Data.value[0].params1,
+    stepEightC: step2Data.value[0].params2,
+    stepEightD: step2Data.value[0].params3,
+    stepNineA: step2Data.value[0].params4,
+    stepNineB: dayValue.value,
+    // stepNineC: step1Data.value[18].params,
+    // stepNineD: step1Data.value[19].params,
+    // stepTenA: step2Data.value[0].params,
+    // stepTenB: step2Data.value[1].params,
+    // stepTenC: step2Data.value[2].params,
+    // stepTenD: step4Data.value[0].params1,
+    // stepElevenA: step4Data.value[0].params2,
+    // stepOneA: step4Data.value[2].params1,
+    // stepOneB: step4Data.value[2].params2,
+    // stepOneC: step4Data.value[4].params1,
+    // stepOneD: step4Data.value[4].params2,
+    // stepTwoA: step4Data.value[6].params1,
+    // stepTwoB: step4Data.value[6].params2,
+    // stepTwoC: step5DataTable2.value[0].params,
+    // stepThreeA: step5DataTable2.value[1].params,
+    // stepThreeB: step5DataTable2.value[2].params,
+    // stepThreeC: step5DataTable2.value[3].params,
+    // stepThreeD: step5DataTable2.value[4].params,
+    // stepFourA: step5DataTable3.value[0].params1,
+    // stepFourB: step5DataTable3.value[0].params2,
+    // stepFourC: step5DataTable3.value[1].params1,
+    // stepFourD: step5DataTable3.value[1].params2,
+    // stepNewOne: step5DataTable3.value[2].params1,
+    // stepNewTwo: step5DataTable3.value[2].params2,
+    // stepNewThree: step5DataTable3.value[3].params1,
+    // stepNewFive: step5DataTable3.value[3].params2,
+    // stepNewSix: step5DataTable3.value[4].params1,
+    // stepNewEight: step5DataTable3.value[4].params2,
+  };
+  portraitModel
+    .saveData({
+      userId: 492,
+      module: "留存分析",
+      ...params,
+    })
+    .then((res) => {})
+    .catch((error) => {});
+};
+const getData = () => {
+  portraitModel
+    .getData({
+      userId: 492,
+      module: "留存分析",
+    })
+    .then((res) => {
+      step1Data.value[0].params = res.data.stepFiveA;
+      step1Data.value[1].params = res.data.stepFiveB;
+      step1Data.value[2].params = res.data.stepFiveC;
+      step1Data.value[3].params = res.data.stepFiveD;
+      step1Data.value[4].params = res.data.stepSixA;
+      step1Data.value[5].params = res.data.stepSixB;
+      step1Data.value[6].params = res.data.stepSixC;
+      step1Data.value[7].params = res.data.stepSixD;
+      step1Data.value[8].params = res.data.stepSevenA;
+      step1Data.value[9].params = res.data.stepSevenB;
+      step1Data.value[10].params = res.data.stepSevenC;
+      step1Data.value[11].params = res.data.stepSevenD;
+      step1Data.value[12].params = res.data.stepEightA;
+      step2Data.value[0].params1 = res.data.stepEightB;
+      step2Data.value[0].params2 = res.data.stepEightC;
+      step2Data.value[0].params3 = res.data.stepEightD;
+      step2Data.value[0].params4 = res.data.stepNineA;
+      dayValue.value = res.data.stepNineB;
+      // step1Data.value[18].params = res.data.stepNineC;
+      // step1Data.value[19].params = res.data.stepNineD;
+      // step2Data.value[0].params = res.data.stepTenA;
+      // step2Data.value[1].params = res.data.stepTenB;
+      // step2Data.value[2].params = res.data.stepTenC;
+      // step4Data.value[0].params1 = res.data.stepTenD;
+      // step4Data.value[0].params2 = res.data.stepElevenA;
+      // step4Data.value[2].params1 = res.data.stepOneA;
+      // step4Data.value[2].params2 = res.data.stepOneB;
+      // step4Data.value[4].params1 = res.data.stepOneC;
+      // step4Data.value[4].params2 = res.data.stepOneD;
+      // step4Data.value[6].params1 = res.data.stepTwoA;
+      // step4Data.value[6].params2 = res.data.stepTwoB;
+      // step5DataTable2.value[0].params = res.data.stepTwoC;
+      // step5DataTable2.value[1].params = res.data.stepThreeA;
+      // step5DataTable2.value[2].params = res.data.stepThreeB;
+      // step5DataTable2.value[3].params = res.data.stepThreeC;
+      // step5DataTable2.value[4].params = res.data.stepThreeD;
+      // step5DataTable3.value[0].params1 = res.data.stepFourA;
+      // step5DataTable3.value[0].params2 = res.data.stepFourB;
+      // step5DataTable3.value[1].params1 = res.data.stepFourC;
+      // step5DataTable3.value[1].params2 = res.data.stepFourD;
+      // step5DataTable3.value[2].params1 = res.data.stepNewOne;
+      // step5DataTable3.value[2].params2 = res.data.stepNewTwo;
+      // step5DataTable3.value[3].params1 = res.data.stepNewThree;
+      // step5DataTable3.value[3].params2 = res.data.stepNewFive;
+      // step5DataTable3.value[4].params1 = res.data.stepNewSix;
+      // step5DataTable3.value[4].params2 = res.data.stepNewEight;
+    })
+    .catch((error) => {});
+};
 const submitData = () => {
   if (
     !step1AnswerFlag.value ||
diff --git a/src/views/portraitModel/components/viscosityAnalysis.vue b/src/views/portraitModel/components/viscosityAnalysis.vue
index 45ded8e..cca690e 100644
--- a/src/views/portraitModel/components/viscosityAnalysis.vue
+++ b/src/views/portraitModel/components/viscosityAnalysis.vue
@@ -66,7 +66,7 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
             >
             </el-table-column>
           </el-table>
-          <div class="download">下载数据</div>
+          <div class="download" @click="downloadData">下载数据</div>
         </div>
       </div>
       <div class="line"></div>
@@ -148,7 +148,7 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
             <div id="echartsDom" style="width: 750px; height: 500px"></div>
             <div class="analysisConclusion">分析结论</div>
             <el-input
-              v-model="analysisConclusion"
+              v-model="analysisConclusionStep1"
               style="margin-left: 20px; margin-top: 20px; margin-bottom: 20px"
               :rows="12"
               type="textarea"
@@ -217,13 +217,13 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
           <div style="width: 650px">
             <div class="analysisConclusion">分析结论</div>
             <el-input
-              v-model="analysisConclusion"
+              v-model="analysisConclusionStep2"
               style="margin-left: 20px; margin-top: 20px; margin-bottom: 20px"
               :rows="8"
               type="textarea"
               placeholder="请输入"
             />
-            <div class="submit">提交</div>
+            <div class="submit" @click="step2Submit">提交</div>
           </div>
         </div>
       </div>
@@ -282,13 +282,13 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
           <div style="width: 650px">
             <div class="analysisConclusion">分析结论</div>
             <el-input
-              v-model="analysisConclusion"
+              v-model="analysisConclusionStep3"
               style="margin-left: 20px; margin-top: 20px; margin-bottom: 20px"
               :rows="8"
               type="textarea"
               placeholder="请输入"
             />
-            <div class="submit">提交</div>
+            <div class="submit" @click="step3Submit">提交</div>
           </div>
         </div>
       </div>
@@ -374,13 +374,13 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
           <div style="width: 650px">
             <div class="analysisConclusion">分析结论</div>
             <el-input
-              v-model="analysisConclusion"
+              v-model="analysisConclusionStep4"
               style="margin-left: 20px; margin-top: 20px; margin-bottom: 20px"
               :rows="8"
               type="textarea"
               placeholder="请输入"
             />
-            <div class="submit">提交</div>
+            <div class="submit" @click="step4Submit">提交</div>
           </div>
         </div>
       </div>
@@ -390,6 +390,8 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
 </template>
 
 <script setup>
+import * as portraitModel from "@/api/portraitModel";
+import { downBlobFile } from "@/utils/index.js";
 import * as echarts from "echarts";
 const { proxy } = getCurrentInstance();
 const knowledgeHtml = ref(
@@ -400,6 +402,14 @@ const dayValue = ref("");
 const combinationValue1 = ref("");
 const combinationValue2 = ref("");
 const analysisConclusion = ref("");
+const analysisConclusionStep1 = ref("");
+const analysisConclusionStep2 = ref("");
+const analysisConclusionStep3 = ref("");
+const analysisConclusionStep4 = ref("");
+const step1AnswerFlag = ref(false);
+const step2AnswerFlag = ref(false);
+const step3AnswerFlag = ref(false);
+const step4AnswerFlag = ref(false);
 const errorNum = ref(0);
 const step1Error = ref(0);
 const step2Error = ref(0);
@@ -1273,6 +1283,42 @@ const step1RightAnswer = ref([
     activeTime: "24.50",
   },
 ]);
+const step2RightAnswer = ref([
+  {
+    num: "10",
+    ratio: "100",
+  },
+  {
+    num: "7",
+    ratio: "70",
+  },
+  {
+    num: "5",
+    ratio: "50",
+  },
+  {
+    num: "6",
+    ratio: "60",
+  },
+]);
+const step4RightAnswer = ref([
+  "6",
+  "10",
+  "11",
+  "13",
+  "2",
+  "5",
+  "3",
+  "5",
+  "1",
+  "4",
+]);
+onMounted(() => {
+  getData();
+});
+onBeforeUnmount(() => {
+  saveData();
+});
 const moveUp = (index, row) => {
   console.log("上移", index, row);
   if (index > 0) {
@@ -1514,7 +1560,7 @@ const drawEcharts = () => {
   option && myChart.setOption(option);
 };
 const step1Submit = () => {
-  step1Error.value++;
+  step1Error.value = 0;
   for (let i in step1Data.value) {
     // console.log(fileTable1.value[i]);
     if (
@@ -1539,7 +1585,255 @@ const step1Submit = () => {
   }
   console.log(step1Error.value, "错误数");
   proxy.$modal.msgSuccess("提交成功");
+  step1AnswerFlag.value = true;
+};
+const step2Submit = () => {
+  step2Error.value = 0;
+  for (let i in step2Data.value) {
+    // console.log(fileTable1.value[i]);
+    if (!step2Data.value[i].params1 || !step2Data.value[i].params2) {
+      proxy.$modal.msgError("请先完成所有填空");
+      return;
+    }
+  }
+  for (let i in step2Data.value) {
+    if (step2Data.value[i].params1 != step2RightAnswer.value[i].num) {
+      step2Error.value++;
+    }
+    if (step2Data.value[i].params2 != step2RightAnswer.value[i].ratio) {
+      step2Error.value++;
+    }
+  }
+  console.log(step2Error.value, "错误数");
+  proxy.$modal.msgSuccess("提交成功");
+  step2AnswerFlag.value = true;
+};
+const step3Submit = () => {
+  step3Error.value = 0;
+  for (let i in step3Data.value) {
+    // console.log(fileTable1.value[i]);
+    if (!step3Data.value[i].params1 || !step3Data.value[i].params2) {
+      proxy.$modal.msgError("请先完成所有填空");
+      return;
+    }
+  }
+  if (step3Data.value[0].params1 != "10") {
+    step3Error.value++;
+  }
+  if (step3Data.value[0].params2 != "100") {
+    step3Error.value++;
+  }
+  // console.log(89);
+  console.log(step3Error.value, "错误数");
+  proxy.$modal.msgSuccess("提交成功");
+  step3AnswerFlag.value = true;
+};
+const step4Submit = () => {
+  step4Error.value = 0;
+  for (let i in step4Data.value) {
+    // console.log(fileTable1.value[i]);
+    if (!step4Data.value[i].params1) {
+      proxy.$modal.msgError("请先完成所有填空");
+      return;
+    }
+  }
+  for (let i in step4DataTable2.value) {
+    // console.log(fileTable1.value[i]);
+    if (!step4DataTable2.value[i].params1) {
+      proxy.$modal.msgError("请先完成所有填空");
+      return;
+    }
+  }
+  for (let i in step4Data.value) {
+    if (step4Data.value[i].params1 != step4RightAnswer.value[i]) {
+      step4Error.value++;
+    }
+  }
+  if (step4DataTable2.value[0].params1 != "20") {
+    step4Error.value++;
+  }
+  if (step4DataTable2.value[1].params1 != "3") {
+    step4Error.value++;
+  }
+  console.log(step4Error.value, "错误数");
+  proxy.$modal.msgSuccess("提交成功");
+  step4AnswerFlag.value = true;
+};
+const saveData = () => {
+  let infoList = [];
+  for (let i in step1Data.value) {
+    infoList.push({
+      loginTime: step1Data.value[i].date,
+      activeUser: parseInt(step1Data.value[i].params1),
+      activeUserRate: parseFloat(step1Data.value[i].params2),
+      activeUserTime: parseFloat(step1Data.value[i].params3),
+    });
+  }
+  const params = {
+    stepFiveA: step2Data.value[0].params1,
+    stepFiveB: step2Data.value[0].params2,
+    stepFiveC: step2Data.value[1].params1,
+    stepFiveD: step2Data.value[1].params2,
+    stepSixA: step2Data.value[2].params1,
+    stepSixB: step2Data.value[2].params2,
+    stepSixC: step2Data.value[3].params1,
+    stepSixD: step2Data.value[3].params2,
+    stepSevenA: step3Data.value[0].params1,
+    stepSevenB: step3Data.value[0].params2,
+    stepSevenC: step4Data.value[0].params1,
+    stepSevenD: step4Data.value[1].params1,
+    stepEightA: step4Data.value[2].params1,
+    stepEightB: step4Data.value[3].params1,
+    stepEightC: step4Data.value[4].params1,
+    stepEightD: step4Data.value[5].params1,
+    stepNineA: step4Data.value[6].params1,
+    stepNineB: step4Data.value[7].params1,
+    stepNineC: step4Data.value[8].params1,
+    stepNineD: step4Data.value[9].params1,
+    stepTenA: step4DataTable2.value[0].params1,
+    stepTenB: step4DataTable2.value[1].params1,
+    stepTenC: analysisConclusionStep1.value,
+    stepTenD: analysisConclusionStep2.value,
+    stepElevenA: analysisConclusionStep3.value,
+    stepOneA: analysisConclusionStep4.value,
+    // stepOneB: step1Data.value[8].params3,
+    // stepOneC: step1Data.value[9].params1,
+    // stepOneD: step1Data.value[9].params2,
+    // stepTwoA: step1Data.value[9].params3,
+    // stepTwoB: step4Data.value[6].params2,
+    // stepTwoC: step5DataTable2.value[0].params,
+    // stepThreeA: step5DataTable2.value[1].params,
+    // stepThreeB: step5DataTable2.value[2].params,
+    // stepThreeC: step5DataTable2.value[3].params,
+    // stepThreeD: step5DataTable2.value[4].params,
+    // stepFourA: step5DataTable3.value[0].params1,
+    // stepFourB: step5DataTable3.value[0].params2,
+    // stepFourC: step5DataTable3.value[1].params1,
+    // stepFourD: step5DataTable3.value[1].params2,
+    // stepNewOne: step5DataTable3.value[2].params1,
+    // stepNewTwo: step5DataTable3.value[2].params2,
+    // stepNewThree: step5DataTable3.value[3].params1,
+    // stepNewFive: step5DataTable3.value[3].params2,
+    // stepNewSix: step5DataTable3.value[4].params1,
+    // stepNewEight: step5DataTable3.value[4].params2,
+    stuMachineLearningInfoDTOList: infoList,
+  };
+  portraitModel
+    .saveData({
+      userId: 492,
+      module: "用户粘性分析",
+      ...params,
+    })
+    .then((res) => {})
+    .catch((error) => {});
+};
+const getData = () => {
+  portraitModel
+    .getData({
+      userId: 492,
+      module: "用户粘性分析",
+    })
+    .then((res) => {
+      for (let i in res.data.stuMachineLearningInfoDTOList) {
+        if (
+          res.data.stuMachineLearningInfoDTOList[i].loginTime ==
+          step1Data.value[i].date
+        ) {
+          step1Data.value[i].params1 =
+            res.data.stuMachineLearningInfoDTOList[i].activeUser;
+          step1Data.value[i].params2 =
+            res.data.stuMachineLearningInfoDTOList[i].activeUserRate;
+          step1Data.value[i].params3 =
+            res.data.stuMachineLearningInfoDTOList[i].activeUserTime;
+        }
+      }
+      step2Data.value[0].params1 = res.data.stepFiveA;
+      step2Data.value[0].params2 = res.data.stepFiveB;
+      step2Data.value[1].params1 = res.data.stepFiveC;
+      step2Data.value[1].params2 = res.data.stepFiveD;
+      step2Data.value[2].params1 = res.data.stepSixA;
+      step2Data.value[2].params2 = res.data.stepSixB;
+      step2Data.value[3].params1 = res.data.stepSixC;
+      step2Data.value[3].params2 = res.data.stepSixD;
+      step3Data.value[0].params1 = res.data.stepSevenA;
+      step3Data.value[0].params2 = res.data.stepSevenB;
+      step4Data.value[0].params1 = res.data.stepSevenC;
+      step4Data.value[1].params1 = res.data.stepSevenD;
+      step4Data.value[2].params1 = res.data.stepEightA;
+      step4Data.value[3].params1 = res.data.stepEightB;
+      step4Data.value[4].params1 = res.data.stepEightC;
+      step4Data.value[5].params1 = res.data.stepEightD;
+      step4Data.value[6].params1 = res.data.stepNineA;
+      step4Data.value[7].params1 = res.data.stepNineB;
+      step4Data.value[8].params1 = res.data.stepNineC;
+      step4Data.value[9].params1 = res.data.stepNineD;
+      step4DataTable2.value[0].params1 = res.data.stepTenA;
+      step4DataTable2.value[1].params1 = res.data.stepTenB;
+      analysisConclusionStep1.value = res.data.stepTenC;
+      analysisConclusionStep2.value = res.data.stepTenD;
+      analysisConclusionStep3.value = res.data.stepElevenA;
+      analysisConclusionStep4.value = res.data.stepOneA;
+      // step1Data.value[8].params3 = res.data.stepOneB;
+      // step1Data.value[9].params1 = res.data.stepOneC;
+      // step1Data.value[9].params2 = res.data.stepOneD;
+      // step1Data.value[9].params3 = res.data.stepTwoA;
+      // step4Data.value[6].params2 = res.data.stepTwoB;
+      // step5DataTable2.value[0].params = res.data.stepTwoC;
+      // step5DataTable2.value[1].params = res.data.stepThreeA;
+      // step5DataTable2.value[2].params = res.data.stepThreeB;
+      // step5DataTable2.value[3].params = res.data.stepThreeC;
+      // step5DataTable2.value[4].params = res.data.stepThreeD;
+      // step5DataTable3.value[0].params1 = res.data.stepFourA;
+      // step5DataTable3.value[0].params2 = res.data.stepFourB;
+      // step5DataTable3.value[1].params1 = res.data.stepFourC;
+      // step5DataTable3.value[1].params2 = res.data.stepFourD;
+      // step5DataTable3.value[2].params1 = res.data.stepNewOne;
+      // step5DataTable3.value[2].params2 = res.data.stepNewTwo;
+      // step5DataTable3.value[3].params1 = res.data.stepNewThree;
+      // step5DataTable3.value[3].params2 = res.data.stepNewFive;
+      // step5DataTable3.value[4].params1 = res.data.stepNewSix;
+      // step5DataTable3.value[4].params2 = res.data.stepNewEight;
+    })
+    .catch((error) => {});
+};
+const downloadData = () => {
+  portraitModel
+    .downloadDataByViscosity({})
+    .then((res) => {
+      // console.log(res,'--');
+      const blob = new Blob([res], { type: "application/vnd.ms-excel" });
+      downBlobFile(`案例数据-用户粘性分析`, blob);
+    })
+    .catch((error) => {});
+};
+const submitData = () => {
+  if (
+    !step1AnswerFlag.value ||
+    !step2AnswerFlag.value ||
+    !step3AnswerFlag.value ||
+    !step4AnswerFlag.value
+  ) {
+    proxy.$modal.msgError("请先完成所有步骤！");
+    return;
+  }
+  errorNum.value =
+    step1Error.value + step2Error.value + step3Error.value + step4Error.value;
+  console.log(errorNum.value, "总错误次数");
+  portraitModel
+    .submit({
+      userId: 492,
+      taskName: "用户粘性分析",
+      numberOfErrors: errorNum.value,
+    })
+    .then((res) => {
+      proxy.$modal.msgSuccess("提交成功");
+    })
+    .catch((error) => {});
 };
+defineExpose({
+  submitData,
+  // practicalTraining,
+});
 </script>
 
 <style scoped lang="scss">