实训提交后用户提示问题

dev-QQq
HeHaonan 2 years ago
parent 3f2046aeaf
commit c100ba91b5

File diff suppressed because one or more lines are too long

@ -64,7 +64,13 @@
<el-table-column label="商品名称" align="center" prop="name"></el-table-column>
<el-table-column label="销售额" align="center" prop="amount">
<template #default="scope">
<div style="display: flex; align-items: center; justify-content: center">
<el-input v-model="scope.row.params" placeholder="请输入" style="width: 130px"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="scope.row.isError" style="color: red">X</span>
<span v-if="!scope.row.isError" style="color: #00bb00"></span>
</div>
</div>
</template>
</el-table-column>
</el-table>
@ -122,17 +128,29 @@
}"
>
<el-table-column label="商品名称" align="center" prop="data1"></el-table-column>
<el-table-column label="销售额" align="center" prop="data2"></el-table-column>
<el-table-column label="销售额" align="center" prop="data2" width="100"></el-table-column>
<el-table-column label="销售额占比(%" align="center" prop="data3">
<template #default="scope">
<div style="display: flex; align-items: center; justify-content: center">
<el-input v-model="scope.row.params1" placeholder="请输入" style="width: 110px"></el-input>
%
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="scope.row.isError1" style="color: red">X</span>
<span v-if="!scope.row.isError1" style="color: #00bb00"></span>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="累计销售额占比(%" align="center" prop="data4">
<el-table-column label="累计销售额占比(%" align="center" prop="data4" width="200">
<template #default="scope">
<div style="display: flex; align-items: center; justify-content: center">
<el-input v-model="scope.row.params2" placeholder="请输入" style="width: 110px"></el-input>
%
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="scope.row.isError2" style="color: red">X</span>
<span v-if="!scope.row.isError2" style="color: #00bb00"></span>
</div>
</div>
</template>
</el-table-column>
</el-table>
@ -176,11 +194,17 @@
<el-table-column label="累计销售额占比(%" align="center" prop="data3"></el-table-column>
<el-table-column label="划分商品类型" align="center" prop="data4">
<template #default="scope">
<div style="display: flex; align-items: center; justify-content: center">
<el-select v-model="scope.row.params" placeholder="请选择" style="width: 100px">
<el-option :label="'A类商品'" :value="'A类商品'" />
<el-option :label="'B类商品'" :value="'B类商品'" />
<el-option :label="'C类商品'" :value="'C类商品'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="scope.row.isError" style="color: red">X</span>
<span v-if="!scope.row.isError" style="color: #00bb00"></span>
</div>
</div>
</template>
</el-table-column>
</el-table>
@ -199,30 +223,54 @@
<div class="submit" @click="step5Submit" v-if="step3AnswerFlag"></div>
</div>
<div class="chartXData" v-if="step3AnswerFlag">
<div style="display: flex; align-items: center; justify-content: center">
<el-select v-model="chartParam1" placeholder="请选择" style="width: 85px" class="XdataItem" size="small">
<el-option :label="'男士配饰'" :value="'男士配饰'" />
<el-option :label="'床上用品'" :value="'床上用品'" />
<el-option :label="'婴儿用品'" :value="'婴儿用品'" />
<el-option :label="'儿童服装'" :value="'儿童服装'" />
</el-select>
<div v-if="showAnswerFlag">
<span v-if="chartParam1 != '男士配饰'" style="color: red">X</span>
<span v-if="chartParam1 == '男士配饰'" style="color: #00bb00"></span>
</div>
</div>
<div style="display: flex; align-items: center; justify-content: center">
<el-select v-model="chartParam2" placeholder="请选择" style="width: 85px" class="XdataItem" size="small">
<el-option :label="'男士配饰'" :value="'男士配饰'" />
<el-option :label="'床上用品'" :value="'床上用品'" />
<el-option :label="'婴儿用品'" :value="'婴儿用品'" />
<el-option :label="'儿童服装'" :value="'儿童服装'" />
</el-select>
<div v-if="showAnswerFlag">
<span v-if="chartParam2 != '床上用品'" style="color: red">X</span>
<span v-if="chartParam2 == '床上用品'" style="color: #00bb00"></span>
</div>
</div>
<div style="display: flex; align-items: center; justify-content: center">
<el-select v-model="chartParam3" placeholder="请选择" style="width: 85px" class="XdataItem" size="small">
<el-option :label="'男士配饰'" :value="'男士配饰'" />
<el-option :label="'床上用品'" :value="'床上用品'" />
<el-option :label="'婴儿用品'" :value="'婴儿用品'" />
<el-option :label="'儿童服装'" :value="'儿童服装'" />
</el-select>
<div v-if="showAnswerFlag">
<span v-if="chartParam3 != '婴儿用品'" style="color: red">X</span>
<span v-if="chartParam3 == '婴儿用品'" style="color: #00bb00"></span>
</div>
</div>
<div style="display: flex; align-items: center; justify-content: center">
<el-select v-model="chartParam4" placeholder="请选择" style="width: 85px" class="XdataItem" size="small" @change="selectChange">
<el-option :label="'男士配饰'" :value="'男士配饰'" />
<el-option :label="'床上用品'" :value="'床上用品'" />
<el-option :label="'婴儿用品'" :value="'婴儿用品'" />
<el-option :label="'儿童服装'" :value="'儿童服装'" />
</el-select>
<div v-if="showAnswerFlag">
<span v-if="chartParam4 != '儿童服装'" style="color: red">X</span>
<span v-if="chartParam4 == '儿童服装'" style="color: #00bb00"></span>
</div>
</div>
</div>
</div>
<div class="line"></div>
@ -280,6 +328,7 @@ import * as portraitModel from "@/api/portraitModel";
import { downBlobFile } from "@/utils/index.js";
const { proxy } = getCurrentInstance();
const baseUrl = import.meta.env.VITE_APP_BASE_API;
const showAnswerFlag = ref(false);
const dialogVisible = ref(false);
const knowledgeFlag = ref(false);
const errorNum = ref(0);
@ -653,15 +702,27 @@ const step1Submit = () => {
}
if (step1Data.value[0].params && step1Data.value[0].params !== "5900") {
step1Error.value++;
step1Data.value[0].isError = true;
} else {
step1Data.value[0].isError = false;
}
if (step1Data.value[1].params && step1Data.value[1].params !== "600") {
step1Error.value++;
step1Data.value[1].isError = true;
} else {
step1Data.value[1].isError = false;
}
if (step1Data.value[2].params && step1Data.value[2].params !== "1100") {
step1Error.value++;
step1Data.value[2].isError = true;
} else {
step1Data.value[2].isError = false;
}
if (step1Data.value[3].params && step1Data.value[3].params !== "2400") {
step1Error.value++;
step1Data.value[3].isError = true;
} else {
step1Data.value[3].isError = false;
}
console.log(step1Error.value, "错误数");
proxy.$modal.msgSuccess("提交成功");
@ -698,27 +759,51 @@ const step3Submit = () => {
}
if (step3Data.value[0].params1 && step3Data.value[0].params1 !== "59") {
step3Error.value++;
step3Data.value[0].isError1 = true;
} else {
step3Data.value[0].isError1 = false;
}
if (step3Data.value[0].params2 && step3Data.value[0].params2 !== "59") {
step3Error.value++;
step3Data.value[0].isError2 = true;
} else {
step3Data.value[0].isError2 = false;
}
if (step3Data.value[1].params1 && step3Data.value[1].params1 !== "24") {
step3Error.value++;
step3Data.value[1].isError1 = true;
} else {
step3Data.value[1].isError1 = false;
}
if (step3Data.value[1].params2 && step3Data.value[1].params2 !== "83") {
step3Error.value++;
step3Data.value[1].isError2 = true;
} else {
step3Data.value[1].isError2 = false;
}
if (step3Data.value[2].params1 && step3Data.value[2].params1 !== "11") {
step3Error.value++;
step3Data.value[2].isError1 = true;
} else {
step3Data.value[2].isError1 = false;
}
if (step3Data.value[2].params2 && step3Data.value[2].params2 !== "94") {
step3Error.value++;
step3Data.value[2].isError2 = true;
} else {
step3Data.value[2].isError2 = false;
}
if (step3Data.value[3].params1 && step3Data.value[3].params1 !== "6") {
step3Error.value++;
step3Data.value[3].isError1 = true;
} else {
step3Data.value[3].isError1 = false;
}
if (step3Data.value[3].params2 && step3Data.value[3].params2 !== "100") {
step3Error.value++;
step3Data.value[3].isError2 = true;
} else {
step3Data.value[3].isError2 = false;
}
console.log("错误数", step3Error.value);
proxy.$modal.msgSuccess("提交成功");
@ -745,15 +830,27 @@ const step4Submit = () => {
}
if (step4Data.value[0].params && step4Data.value[0].params !== "A类商品") {
step4Error.value++;
step4Data.value[0].isError = true;
} else {
step4Data.value[0].isError = false;
}
if (step4Data.value[1].params && step4Data.value[1].params !== "B类商品") {
step4Error.value++;
step4Data.value[1].isError = true;
} else {
step4Data.value[1].isError = false;
}
if (step4Data.value[2].params && step4Data.value[2].params !== "C类商品") {
step4Error.value++;
step4Data.value[2].isError = true;
} else {
step4Data.value[2].isError = false;
}
if (step4Data.value[3].params && step4Data.value[3].params !== "C类商品") {
step4Error.value++;
step4Data.value[3].isError = true;
} else {
step4Data.value[3].isError = false;
}
console.log("错误数", step4Error.value);
proxy.$modal.msgSuccess("提交成功");
@ -903,6 +1000,7 @@ const submitData = () => {
})
.then((res) => {
proxy.$modal.msgSuccess("提交成功");
showAnswerFlag.value = true;
})
.catch((error) => {});
};
@ -1007,7 +1105,7 @@ defineExpose({
width: 945px;
height: 26px;
// background: #003b75;
background: #FFF8EE;
background: #fff8ee;
border-radius: 10px;
// border: 1px solid #0052a3;
font-size: 12px;
@ -1017,11 +1115,12 @@ defineExpose({
}
}
.chartXData {
display: flex;
position: relative;
top: -58px;
left: 60px;
left: 50px;
.XdataItem {
margin-right: 15px;
margin-left: 10px;
}
}
}

File diff suppressed because one or more lines are too long

@ -68,12 +68,24 @@
<el-table-column label="客户ID" align="center" prop="name"></el-table-column>
<el-table-column label="消费次数" align="center" prop="amount">
<template #default="scope">
<div style="display: flex; align-items: center; justify-content: center">
<el-input v-model="scope.row.params1" placeholder="请输入" style="width: 130px"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="scope.row.isError1" style="color: red">X</span>
<span v-if="!scope.row.isError1" style="color: #00bb00"></span>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="消费金额" align="center" prop="amount">
<template #default="scope">
<div style="display: flex; align-items: center; justify-content: center">
<el-input v-model="scope.row.params2" placeholder="请输入" style="width: 130px"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="scope.row.isError2" style="color: red">X</span>
<span v-if="!scope.row.isError2" style="color: #00bb00"></span>
</div>
</div>
</template>
</el-table-column>
</el-table>
@ -102,11 +114,19 @@
<el-table-column label="消费次数" align="center" prop="amount">
<template #default="scope">
<el-input v-model="scope.row.params1" placeholder="请输入" style="width: 130px" v-if="scope.$index == 4"></el-input>
<div v-if="showAnswerFlag & (scope.$index == 4)" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError1" style="color: red">X</span>
<span v-if="!scope.row.isError1" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="消费金额" align="center" prop="account">
<template #default="scope">
<el-input v-model="scope.row.params2" placeholder="请输入" style="width: 130px" v-if="scope.$index == 4"></el-input>
<div v-if="showAnswerFlag & (scope.$index == 4)" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError2" style="color: red">X</span>
<span v-if="!scope.row.isError2" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
</el-table>
@ -128,18 +148,34 @@
<div class="point">
<div class="pointItem" @click="drawPoint('A', '#009FF1')">绘制A</div>
<span>3,800</span>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="pointAError" style="color: red">X</span>
<span v-if="!pointAError" style="color: #00bb00"></span>
</div>
</div>
<div class="point">
<div class="pointItem" @click="drawPoint('B', '#FB54A1')">绘制B</div>
<span>4,1200</span>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="pointBError" style="color: red">X</span>
<span v-if="!pointBError" style="color: #00bb00"></span>
</div>
</div>
<div class="point">
<div class="pointItem" @click="drawPoint('C', '#FE8D2A')">绘制C</div>
<span>6,600</span>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="pointCError" style="color: red">X</span>
<span v-if="!pointCError" style="color: #00bb00"></span>
</div>
</div>
<div class="point">
<div class="pointItem" @click="drawPoint('D', '#6E70F0')">绘制D</div>
<span>7,1400</span>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="pointDError" style="color: red">X</span>
<span v-if="!pointDError" style="color: #00bb00"></span>
</div>
</div>
</div>
</div>
@ -160,6 +196,10 @@
<div class="point">
<div class="pointItem" @click="drawPointStep4('E', '#009FF1')">绘制平均消费次数X,平均消费金额Y</div>
<span>5,1000</span>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="centerPointError" style="color: red">X</span>
<span v-if="!centerPointError" style="color: #00bb00"></span>
</div>
</div>
<!-- <div class="point">
<div class="pointItem" @click="drawPointStep4('Y', '#FB54A1')">
@ -195,15 +235,31 @@
<div class="drawPoint">
<div class="point">
<div class="pointItem" @click="drawQuadrant('明星客户', 'rgba(52, 134, 207, 0.8)')">明星客户</div>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="markArea1Error" style="color: red">X</span>
<span v-if="!markArea1Error" style="color: #00bb00"></span>
</div>
</div>
<div class="point">
<div class="pointItem" @click="drawQuadrant('现金流客户', 'rgba(0, 184, 105, 0.8)')">现金流客户</div>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="markArea4Error" style="color: red">X</span>
<span v-if="!markArea4Error" style="color: #00bb00"></span>
</div>
</div>
<div class="point">
<div class="pointItem" @click="drawQuadrant('问题客户', 'rgba(177, 130, 192, 0.8)')">问题客户</div>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="markArea2Error" style="color: red">X</span>
<span v-if="!markArea2Error" style="color: #00bb00"></span>
</div>
</div>
<div class="point">
<div class="pointItem" @click="drawQuadrant('瘦狗客户', 'rgba(254, 141, 42, 0.8)')">瘦狗客户</div>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="markArea3Error" style="color: red">X</span>
<span v-if="!markArea3Error" style="color: #00bb00"></span>
</div>
</div>
</div>
</div>
@ -288,6 +344,7 @@ import { downBlobFile } from "@/utils/index.js";
import { onMounted } from "vue";
const { proxy } = getCurrentInstance();
const baseUrl = import.meta.env.VITE_APP_BASE_API;
const showAnswerFlag = ref(false);
const dialogVisible = ref(false);
const knowledgeFlag = ref(false);
const chart1OptionData = ref([]);
@ -301,6 +358,15 @@ const quadrant1Color = ref("");
const quadrant2Color = ref("");
const quadrant3Color = ref("");
const quadrant4Color = ref("");
const pointAError = ref(false);
const pointBError = ref(false);
const pointCError = ref(false);
const pointDError = ref(false);
const centerPointError = ref(false);
const markArea1Error = ref(false);
const markArea2Error = ref(false);
const markArea3Error = ref(false);
const markArea4Error = ref(false);
const step1Data = ref([
{
name: "A",
@ -1224,27 +1290,51 @@ const step1Submit = () => {
}
if (step1Data.value[0].params1 && step1Data.value[0].params1 !== "3") {
step1Error.value++;
step1Data.value[0].isError1 = true;
} else {
step1Data.value[0].isError1 = false;
}
if (step1Data.value[0].params2 && step1Data.value[0].params2 !== "800") {
step1Error.value++;
step1Data.value[0].isError2 = true;
} else {
step1Data.value[0].isError2 = false;
}
if (step1Data.value[1].params1 && step1Data.value[1].params1 !== "4") {
step1Error.value++;
step1Data.value[1].isError1 = true;
} else {
step1Data.value[1].isError1 = false;
}
if (step1Data.value[1].params2 && step1Data.value[1].params2 !== "1200") {
step1Error.value++;
step1Data.value[1].isError2 = true;
} else {
step1Data.value[1].isError2 = false;
}
if (step1Data.value[2].params1 && step1Data.value[2].params1 !== "6") {
step1Error.value++;
step1Data.value[2].isError1 = true;
} else {
step1Data.value[2].isError1 = false;
}
if (step1Data.value[2].params2 && step1Data.value[2].params2 !== "600") {
step1Error.value++;
step1Data.value[2].isError2 = true;
} else {
step1Data.value[2].isError2 = false;
}
if (step1Data.value[3].params1 && step1Data.value[3].params1 !== "7") {
step1Error.value++;
step1Data.value[3].isError1 = true;
} else {
step1Data.value[3].isError1 = false;
}
if (step1Data.value[3].params2 && step1Data.value[3].params2 !== "1400") {
step1Error.value++;
step1Data.value[3].isError2 = true;
} else {
step1Data.value[3].isError2 = false;
}
console.log(step1Error.value, "错误数");
proxy.$modal.msgSuccess("提交成功");
@ -1262,9 +1352,15 @@ const step2Submit = () => {
}
if (step2Data.value[4].params1 && step2Data.value[4].params1 !== "5") {
step2Error.value++;
step2Data.value[4].isError1 = true;
} else {
step2Data.value[4].isError1 = false;
}
if (step2Data.value[4].params2 && step2Data.value[4].params2 !== "1000") {
step2Error.value++;
step2Data.value[4].isError2 = true;
} else {
step2Data.value[4].isError2 = false;
}
console.log(step2Error.value, "错误数");
proxy.$modal.msgSuccess("提交成功");
@ -1277,21 +1373,33 @@ const step3Submit = () => {
if (chart1OptionData.value[i].name == "A") {
if (Math.round(chart1OptionData.value[i].value[0]) != 3 || Math.round(chart1OptionData.value[i].value[1]) != 800) {
step3Error.value++;
pointAError.value = true;
} else {
pointAError.value = false;
}
}
if (chart1OptionData.value[i].name == "B") {
if (Math.round(chart1OptionData.value[i].value[0]) != 4 || Math.round(chart1OptionData.value[i].value[1]) != 1200) {
step3Error.value++;
pointBError.value = true;
} else {
pointBError.value = false;
}
}
if (chart1OptionData.value[i].name == "C") {
if (Math.round(chart1OptionData.value[i].value[0]) != 6 || Math.round(chart1OptionData.value[i].value[1]) != 600) {
step3Error.value++;
pointCError.value = true;
} else {
pointCError.value = false;
}
}
if (chart1OptionData.value[i].name == "D") {
if (Math.round(chart1OptionData.value[i].value[0]) != 7 || Math.round(chart1OptionData.value[i].value[1]) != 1400) {
step3Error.value++;
pointDError.value = true;
} else {
pointDError.value = false;
}
}
}
@ -1310,6 +1418,9 @@ const step4Submit = () => {
if (Math.round(chart2OptionData.value[i].value[0]) != 5 || Math.round(chart2OptionData.value[i].value[1]) != 1000) {
console.log(chart2OptionData.value[i]);
step4Error.value++;
centerPointError.value = true;
} else {
centerPointError.value = false;
}
}
}
@ -1321,15 +1432,27 @@ const step5Submit = () => {
step5Error.value = 0;
if (optionStep5.value.series[0].markArea.data[0][0].name != "明星客户") {
step5Error.value++;
markArea1Error.value = true;
} else {
markArea1Error.value = false;
}
if (optionStep5.value.series[0].markArea.data[1][0].name != "问题客户") {
step5Error.value++;
markArea2Error.value = true;
} else {
markArea2Error.value = false;
}
if (optionStep5.value.series[0].markArea.data[2][0].name != "瘦狗客户") {
step5Error.value++;
markArea3Error.value = true;
} else {
markArea3Error.value = false;
}
if (optionStep5.value.series[0].markArea.data[3][0].name != "现金流客户") {
step5Error.value++;
markArea4Error.value = true;
} else {
markArea4Error.value = false;
}
console.log(step5Error.value, "错误数");
proxy.$modal.msgSuccess("提交成功");
@ -1362,6 +1485,7 @@ const submitData = () => {
})
.then((res) => {
proxy.$modal.msgSuccess("提交成功");
showAnswerFlag.value = true;
})
.catch((error) => {});
};

@ -74,30 +74,50 @@
<template #default="scope">
<el-input v-if="scope.$index != 0" v-model="scope.row.params1" placeholder="请输入" style="width: 100px"></el-input>
<span v-if="scope.$index != 0">%</span>
<div v-if="showAnswerFlag & (scope.$index != 0)" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError1" style="color: red">X</span>
<span v-if="!scope.row.isError1" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="购物车" align="center" prop="data3">
<template #default="scope">
<el-input v-if="scope.$index != 0" v-model="scope.row.params2" placeholder="请输入" style="width: 100px"></el-input>
<span v-if="scope.$index != 0">%</span>
<div v-if="showAnswerFlag & (scope.$index != 0)" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError2" style="color: red">X</span>
<span v-if="!scope.row.isError2" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="订单" align="center" prop="data4">
<template #default="scope">
<el-input v-if="scope.$index != 0" v-model="scope.row.params3" placeholder="请输入" style="width: 100px"></el-input>
<span v-if="scope.$index != 0">%</span>
<div v-if="showAnswerFlag & (scope.$index != 0)" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError3" style="color: red">X</span>
<span v-if="!scope.row.isError3" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="支付" align="center" prop="data5">
<template #default="scope">
<el-input v-if="scope.$index != 0" v-model="scope.row.params4" placeholder="请输入" style="width: 100px"></el-input>
<span v-if="scope.$index != 0">%</span>
<div v-if="showAnswerFlag & (scope.$index != 0)" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError4" style="color: red">X</span>
<span v-if="!scope.row.isError4" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="完成交易" align="center" prop="data6">
<template #default="scope">
<el-input v-if="scope.$index != 0" v-model="scope.row.params5" placeholder="请输入" style="width: 100px"></el-input>
<span v-if="scope.$index != 0">%</span>
<div v-if="showAnswerFlag & (scope.$index != 0)" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError5" style="color: red">X</span>
<span v-if="!scope.row.isError5" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
</el-table>
@ -115,49 +135,79 @@
<div id="funnel" style="width: 520px; height: 400px"></div>
<div style="margin-top: 75px">
<div>
<el-select v-model="step2Select1" placeholder="请选择" style="width: 130px; margin-bottom: 28px" @change="selectData($event, 4)">
<div style="display: flex; align-items: center; justify-content: center; margin-bottom: 28px">
<el-select v-model="step2Select1" placeholder="请选择" style="width: 130px" @change="selectData($event, 4)">
<el-option :label="'浏览2071'" :value="'浏览2071'" />
<el-option :label="'购物车622'" :value="'购物车622'" />
<el-option :label="'订单284'" :value="'订单284'" />
<el-option :label="'支付235'" :value="'支付235'" />
<el-option :label="'完成交易223'" :value="'完成交易223'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="step2Select1 != '浏览2071'" style="color: red">X</span>
<span v-if="step2Select1 == '浏览2071'" style="color: #00bb00"></span>
</div>
</div>
</div>
<div>
<el-select v-model="step2Select2" placeholder="请选择" style="width: 130px; margin-bottom: 32px" @change="selectData($event, 3)">
<div style="display: flex; align-items: center; justify-content: center; margin-bottom: 32px">
<el-select v-model="step2Select2" placeholder="请选择" style="width: 130px" @change="selectData($event, 3)">
<el-option :label="'浏览2071'" :value="'浏览2071'" />
<el-option :label="'购物车622'" :value="'购物车622'" />
<el-option :label="'订单284'" :value="'订单284'" />
<el-option :label="'支付235'" :value="'支付235'" />
<el-option :label="'完成交易223'" :value="'完成交易223'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="step2Select2 != '购物车622'" style="color: red">X</span>
<span v-if="step2Select2 == '购物车622'" style="color: #00bb00"></span>
</div>
</div>
</div>
<div>
<el-select v-model="step2Select3" placeholder="请选择" style="width: 130px; margin-bottom: 30px" @change="selectData($event, 2)">
<div style="display: flex; align-items: center; justify-content: center; margin-bottom: 30px">
<el-select v-model="step2Select3" placeholder="请选择" style="width: 130px" @change="selectData($event, 2)">
<el-option :label="'浏览2071'" :value="'浏览2071'" />
<el-option :label="'购物车622'" :value="'购物车622'" />
<el-option :label="'订单284'" :value="'订单284'" />
<el-option :label="'支付235'" :value="'支付235'" />
<el-option :label="'完成交易223'" :value="'完成交易223'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="step2Select3 != '订单284'" style="color: red">X</span>
<span v-if="step2Select3 == '订单284'" style="color: #00bb00"></span>
</div>
</div>
</div>
<div>
<el-select v-model="step2Select4" placeholder="请选择" style="width: 130px; margin-bottom: 30px" @change="selectData($event, 1)">
<div style="display: flex; align-items: center; justify-content: center; margin-bottom: 30px">
<el-select v-model="step2Select4" placeholder="请选择" style="width: 130px" @change="selectData($event, 1)">
<el-option :label="'浏览2071'" :value="'浏览2071'" />
<el-option :label="'购物车622'" :value="'购物车622'" />
<el-option :label="'订单284'" :value="'订单284'" />
<el-option :label="'支付235'" :value="'支付235'" />
<el-option :label="'完成交易223'" :value="'完成交易223'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="step2Select4 != '支付235'" style="color: red">X</span>
<span v-if="step2Select4 == '支付235'" style="color: #00bb00"></span>
</div>
</div>
</div>
<div>
<el-select v-model="step2Select5" placeholder="请选择" style="width: 130px; margin-bottom: 30px" @change="selectData($event, 0)">
<div style="display: flex; align-items: center; justify-content: center; margin-bottom: 30px">
<el-select v-model="step2Select5" placeholder="请选择" style="width: 130px" @change="selectData($event, 0)">
<el-option :label="'浏览2071'" :value="'浏览2071'" />
<el-option :label="'购物车622'" :value="'购物车622'" />
<el-option :label="'订单284'" :value="'订单284'" />
<el-option :label="'支付235'" :value="'支付235'" />
<el-option :label="'完成交易223'" :value="'完成交易223'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px">
<span v-if="step2Select5 != '完成交易223'" style="color: red">X</span>
<span v-if="step2Select5 == '完成交易223'" style="color: #00bb00"></span>
</div>
</div>
</div>
</div>
<div class="submit" style="margin-top: 70px; margin-left: 100px" @click="step2Submit"></div>
@ -180,6 +230,10 @@
<el-option :label="'订单--支付'" :value="'订单--支付'" />
<el-option :label="'支付--完成交易'" :value="'付--完成交易'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px;display:inline-block">
<span v-if="step3Select1 != '浏览--购物车'" style="color: red">X</span>
<span v-if="step3Select1 == '浏览--购物车'" style="color: #00bb00"></span>
</div>
</div>
<br />
<div>
@ -190,6 +244,10 @@
<el-option :label="'订单--支付'" :value="'订单--支付'" />
<el-option :label="'支付--完成交易'" :value="'付--完成交易'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px;display:inline-block">
<span v-if="step3Select2 != '购物车--订单'" style="color: red">X</span>
<span v-if="step3Select2 == '购物车--订单'" style="color: #00bb00"></span>
</div>
</div>
<p>实际运用时 转化率需要与不同时期比较与竞争对手行业平均水平比较分析的结果相对准确些</p>
</div>
@ -609,6 +667,7 @@ const step3Error = ref(0);
const step1AnswerFlag = ref(false);
const step2AnswerFlag = ref(false);
const step3AnswerFlag = ref(false);
const showAnswerFlag = ref(false);
const errorNum = ref(0);
const baseUrl = import.meta.env.VITE_APP_BASE_API;
onBeforeUnmount(() => {
@ -674,48 +733,93 @@ const step1Submit = () => {
//
if (step1DataSlice[0].params1 && step1DataSlice[0].params1 !== "100") {
step1Error.value++;
step1DataSlice[0].isError1 = true;
} else {
step1DataSlice[0].isError1 = false;
}
if (step1DataSlice[0].params2 && step1DataSlice[0].params2 !== "30.0" && step1DataSlice[0].params2 !== "30") {
step1Error.value++;
step1DataSlice[0].isError2 = true;
} else {
step1DataSlice[0].isError2 = false;
}
if (step1DataSlice[0].params3 && step1DataSlice[0].params3 !== "45.7") {
step1Error.value++;
step1DataSlice[0].isError3 = true;
} else {
step1DataSlice[0].isError3 = false;
}
if (step1DataSlice[0].params4 && step1DataSlice[0].params4 !== "82.7") {
step1Error.value++;
step1DataSlice[0].isError4 = true;
} else {
step1DataSlice[0].isError4 = false;
}
if (step1DataSlice[0].params5 && step1DataSlice[0].params5 !== "94.9") {
step1Error.value++;
step1DataSlice[0].isError5 = true;
} else {
step1DataSlice[0].isError5 = false;
}
if (step1DataSlice[1].params1 && step1DataSlice[1].params1 !== "0") {
step1Error.value++;
step1DataSlice[1].isError1 = true;
} else {
step1DataSlice[1].isError1 = false;
}
if (step1DataSlice[1].params2 && step1DataSlice[1].params2 !== "70") {
step1Error.value++;
step1DataSlice[1].isError2 = true;
} else {
step1DataSlice[1].isError2 = false;
}
if (step1DataSlice[1].params3 && step1DataSlice[1].params3 !== "54.3") {
step1Error.value++;
step1DataSlice[1].isError3 = true;
} else {
step1DataSlice[1].isError3 = false;
}
if (step1DataSlice[1].params4 && step1DataSlice[1].params4 !== "17.3") {
step1Error.value++;
step1DataSlice[1].isError4 = true;
} else {
step1DataSlice[1].isError4 = false;
}
if (step1DataSlice[1].params5 && step1DataSlice[1].params5 !== "5.1") {
step1Error.value++;
step1DataSlice[1].isError5 = true;
} else {
step1DataSlice[1].isError5 = false;
}
if (step1DataSlice[2].params1 && step1DataSlice[2].params1 !== "100") {
step1Error.value++;
step1DataSlice[2].isError1 = true;
} else {
step1DataSlice[2].isError1 = false;
}
if (step1DataSlice[2].params2 && step1DataSlice[2].params2 !== "30.0" && step1DataSlice[2].params2 !== "30") {
step1Error.value++;
step1DataSlice[2].isError2 = true;
} else {
step1DataSlice[2].isError2 = false;
}
if (step1DataSlice[2].params3 && step1DataSlice[2].params3 !== "13.7") {
step1Error.value++;
step1DataSlice[2].isError3 = true;
} else {
step1DataSlice[2].isError3 = false;
}
if (step1DataSlice[2].params4 && step1DataSlice[2].params4 !== "11.3") {
step1Error.value++;
step1DataSlice[2].isError4 = true;
} else {
step1DataSlice[2].isError4 = false;
}
if (step1DataSlice[2].params5 && step1DataSlice[2].params5 !== "10.8") {
step1Error.value++;
step1DataSlice[2].isError5 = true;
} else {
step1DataSlice[2].isError5 = false;
}
console.log(step1Error.value, "错误数");
proxy.$modal.msgSuccess("提交成功");
@ -891,6 +995,7 @@ const submitData = () => {
})
.then((res) => {
proxy.$modal.msgSuccess("提交成功");
showAnswerFlag.value = true;
})
.catch((error) => {});
// console.log(666);

@ -39,9 +39,7 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
<img src="@/assets/images/caseIcon.png" alt="" />
<span>案例背景</span>
</div>
<span style="line-height: 25px; font-size: 14px">
本案例模拟企业搭建用户的标签系统用户画像系统以及用户画像的应用
</span>
<span style="line-height: 25px; font-size: 14px">本案例模拟企业搭建用户的标签系统用户画像系统以及用户画像的应用</span>
</div>
<div class="line"></div>
<div class="caseBack">
@ -50,128 +48,98 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
<span>第一步获取原始数据</span>
</div>
<span style="line-height: 25px; font-size: 14px">
用户画像体系依赖于完善的用户标签体系而用户标签体系则采用完备的数据来源--原始数据这一层我们需要获得尽量多的原始数据因后面的所有的应用场景都依托于原始数据的计算分析建模所以在原始数据库搭建时需要考虑更全面<br />
以电商平台为例用到用户仓库中的表主要有用户信息表商品订单表商品信息表App端日志表Web端日志表商品评论表等<br />
用户画像体系依赖于完善的用户标签体系而用户标签体系则采用完备的数据来源--原始数据这一层我们需要获得尽量多的原始数据因后面的所有的应用场景都依托于原始数据的计算分析建模所以在原始数据库搭建时需要考虑更全面
<br />
以电商平台为例用到用户仓库中的表主要有用户信息表商品订单表商品信息表App端日志表Web端日志表商品评论表等
<br />
请根据字段的相关属性判断该表属于数据库中哪一个
</span>
<div style="margin-top: 10px">
<div style="display: flex; margin-bottom: 20px">
<el-select
v-model="step1SelectParams1"
placeholder="请选择"
style="width: 160px"
>
<el-option
v-for="item in selectList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<div style="display: flex; margin-bottom: 20px; align-items: center">
<el-select v-model="step1SelectParams1" placeholder="请选择" style="width: 160px">
<el-option v-for="item in selectList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="step1SelectParams1 != '用户信息表'" style="color: red">X</span>
<span v-if="step1SelectParams1 == '用户信息表'" style="color: #00bb00"></span>
</div>
<ul class="selectUl">
<li class="selectLi" v-for="item in selectTable1" :key="item">
{{ item }}
</li>
</ul>
</div>
<div style="display: flex; margin-bottom: 20px">
<el-select
v-model="step1SelectParams2"
placeholder="请选择"
style="width: 160px"
>
<el-option
v-for="item in selectList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<div style="display: flex; margin-bottom: 20px; align-items: center">
<el-select v-model="step1SelectParams2" placeholder="请选择" style="width: 160px">
<el-option v-for="item in selectList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="step1SelectParams2 != '商品订单表'" style="color: red">X</span>
<span v-if="step1SelectParams2 == '商品订单表'" style="color: #00bb00"></span>
</div>
<ul class="selectUl">
<li class="selectLi" v-for="item in selectTable2" :key="item">
{{ item }}
</li>
</ul>
</div>
<div style="display: flex; margin-bottom: 20px">
<el-select
v-model="step1SelectParams3"
placeholder="请选择"
style="width: 160px"
>
<el-option
v-for="item in selectList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<div style="display: flex; margin-bottom: 20px; align-items: center">
<el-select v-model="step1SelectParams3" placeholder="请选择" style="width: 160px">
<el-option v-for="item in selectList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="step1SelectParams3 != '访问日志表'" style="color: red">X</span>
<span v-if="step1SelectParams3 == '访问日志表'" style="color: #00bb00"></span>
</div>
<ul class="selectUl">
<li class="selectLi" v-for="item in selectTable3" :key="item">
{{ item }}
</li>
</ul>
</div>
<div style="display: flex; margin-bottom: 20px">
<el-select
v-model="step1SelectParams4"
placeholder="请选择"
style="width: 160px"
>
<el-option
v-for="item in selectList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<div style="display: flex; margin-bottom: 20px; align-items: center">
<el-select v-model="step1SelectParams4" placeholder="请选择" style="width: 160px">
<el-option v-for="item in selectList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="step1SelectParams4 != '商品评论表'" style="color: red">X</span>
<span v-if="step1SelectParams4 == '商品评论表'" style="color: #00bb00"></span>
</div>
<ul class="selectUl">
<li class="selectLi" v-for="item in selectTable4" :key="item">
{{ item }}
</li>
</ul>
</div>
<div style="display: flex; margin-bottom: 20px">
<el-select
v-model="step1SelectParams5"
placeholder="请选择"
style="width: 160px"
>
<el-option
v-for="item in selectList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<div style="display: flex; margin-bottom: 20px; align-items: center">
<el-select v-model="step1SelectParams5" placeholder="请选择" style="width: 160px">
<el-option v-for="item in selectList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="step1SelectParams5 != '搜索日志表'" style="color: red">X</span>
<span v-if="step1SelectParams5 == '搜索日志表'" style="color: #00bb00"></span>
</div>
<ul class="selectUl">
<li class="selectLi" v-for="item in selectTable5" :key="item">
{{ item }}
</li>
</ul>
</div>
<div style="display: flex; margin-bottom: 20px">
<el-select
v-model="step1SelectParams6"
placeholder="请选择"
style="width: 160px"
>
<el-option
v-for="item in selectList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<div style="display: flex; margin-bottom: 20px; align-items: center">
<el-select v-model="step1SelectParams6" placeholder="请选择" style="width: 160px">
<el-option v-for="item in selectList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="step1SelectParams6 != '销售明细表'" style="color: red">X</span>
<span v-if="step1SelectParams6 == '销售明细表'" style="color: #00bb00"></span>
</div>
<ul class="selectUl">
<li class="selectLi" v-for="item in selectTable6" :key="item">
{{ item }}
</li>
</ul>
</div>
<div class="submit" style="margin-top: 25px" @click="step1Submit">
提交
</div>
<div class="submit" style="margin-top: 25px" @click="step1Submit"></div>
</div>
</div>
<div class="line"></div>
@ -181,10 +149,14 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
<span>第二步构建用户标签体系</span>
</div>
<span style="line-height: 25px; font-size: 14px">
基于原始数据的转换文本字段的数量化表示以及统计汇总建立属性标签体系按统计方式分类可分为事实类标签规则类标签预测类标签<br />
1事实标签从原始数据中提取通常是基于原始数据清理后的归类用于描述客观事实例如用户注册信息中提取用户性别生日注册手机号注册城市等<br />
2规则标签没有直接对应数据需要通过规则进行定义可以自定义规则或者利用常用的RFM波士顿矩阵漏斗模型复购分析AARRR模型等通过计算来得出标签例如流失用户支付偏好等<br />
3预测标签基于现有事实及规则无法得出需要运用决策树算法贝叶斯算法等进行数据挖掘与训练得出标签预测结果来预测用户的偏好例如根据用户历史的购买行为来预测其群体特性<br />
基于原始数据的转换文本字段的数量化表示以及统计汇总建立属性标签体系按统计方式分类可分为事实类标签规则类标签预测类标签
<br />
1事实标签从原始数据中提取通常是基于原始数据清理后的归类用于描述客观事实例如用户注册信息中提取用户性别生日注册手机号注册城市等
<br />
2规则标签没有直接对应数据需要通过规则进行定义可以自定义规则或者利用常用的RFM波士顿矩阵漏斗模型复购分析AARRR模型等通过计算来得出标签例如流失用户支付偏好等
<br />
3预测标签基于现有事实及规则无法得出需要运用决策树算法贝叶斯算法等进行数据挖掘与训练得出标签预测结果来预测用户的偏好例如根据用户历史的购买行为来预测其群体特性
<br />
不同行业客户标签体系会有差异以电商行业为例常用的标签体系如下表请对标签进行分类
</span>
<div style="margin-top: 10px; display: flex">
@ -199,29 +171,20 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
backgroundColor: '#6A7DE9!important',
}"
>
<el-table-column label="一级标签" align="center" prop="firstTag">
</el-table-column>
<el-table-column label="二级标签" align="center" prop="secondTag">
</el-table-column>
<el-table-column
label="三级标签"
align="center"
prop="thirdTag"
width="500"
>
</el-table-column>
<el-table-column label="标签属性" align="center" prop="description">
<el-table-column label="一级标签" align="center" prop="firstTag"></el-table-column>
<el-table-column label="二级标签" align="center" prop="secondTag"></el-table-column>
<el-table-column label="三级标签" align="center" prop="thirdTag" width="500"></el-table-column>
<el-table-column label="标签属性" align="center" prop="description" width="170">
<template #default="scope">
<el-select
v-model="scope.row.params"
placeholder="请选择"
style="width: 130px"
size="small"
>
<el-select v-model="scope.row.params" placeholder="请选择" style="width: 130px" size="small">
<el-option :label="'事实标签'" :value="'事实标签'" />
<el-option :label="'规则标签'" :value="'规则标签'" />
<el-option :label="'预测标签'" :value="'预测标签'" />
</el-select>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError" style="color: red">X</span>
<span v-if="!scope.row.isError" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
</el-table>
@ -235,9 +198,7 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
<img src="@/assets/images/步骤.png" alt="" />
<span>第三步构建用户画像</span>
</div>
<span style="line-height: 25px; font-size: 14px">
基于构建的用户标签体系经过数据的采集预处理挖掘可视化采用文本挖掘算法分类聚类算法相似度计算推荐算法机器学习算法预测算法等以及用户画像分析的各类常用模型RFM模型漏斗模型AARRR模型等根据不同的业务场景需求构建相应的用户画像
</span>
<span style="line-height: 25px; font-size: 14px">基于构建的用户标签体系经过数据的采集预处理挖掘可视化采用文本挖掘算法分类聚类算法相似度计算推荐算法机器学习算法预测算法等以及用户画像分析的各类常用模型RFM模型漏斗模型AARRR模型等根据不同的业务场景需求构建相应的用户画像</span>
<div style="margin-top: 10px; display: flex">
<div>
<img src="@/assets/images/u6063.png" alt="" />
@ -272,18 +233,19 @@ https://help.fanruan.com/finebi5.1/doc-view-1256.html"
<span>第四步用户画像应用场景</span>
</div>
<span style="line-height: 25px; font-size: 14px">
1人群分析人群分析是用户画像最基础的应用场景之一运营人员可借助标签深入分析不同用户画像群体的分布特征又或是不同人群的消费习惯消费偏好不同地域的差异分析等<br />
2广告优化用户画像可以圈选定位更准确的人群同时也为素材文案广告创意提供了更具体的撰写方向做到精准且有效的投放此外用户画像可以助力广告主完成洞察到决策的环节让投放工作更有目标方向广告主也可基于标签高效触达目标人群提升用户体验实现营销价值的最大化<br />
3精细化消费者运营运营人员可以通过快速分析用户特征找到不同运营场景下的目标用户从而精准圈定目标人群进行更灵活更有针对性的营销活动和个性化消息推送基于用户画像分析在合适的时间通过最佳渠道给用户传递最感兴趣的内容可以根据用户历史数据实现基于用户兴趣的个性化推荐也可在文案中植入用户个性化标签增加用户的好感度亲密度还可以通过用户历史购买时间判断用户最容易消费的时间点在合适时间给用户发送营销信息<br />
1人群分析人群分析是用户画像最基础的应用场景之一运营人员可借助标签深入分析不同用户画像群体的分布特征又或是不同人群的消费习惯消费偏好不同地域的差异分析等
<br />
2广告优化用户画像可以圈选定位更准确的人群同时也为素材文案广告创意提供了更具体的撰写方向做到精准且有效的投放此外用户画像可以助力广告主完成洞察到决策的环节让投放工作更有目标方向广告主也可基于标签高效触达目标人群提升用户体验实现营销价值的最大化
<br />
3精细化消费者运营运营人员可以通过快速分析用户特征找到不同运营场景下的目标用户从而精准圈定目标人群进行更灵活更有针对性的营销活动和个性化消息推送基于用户画像分析在合适的时间通过最佳渠道给用户传递最感兴趣的内容可以根据用户历史数据实现基于用户兴趣的个性化推荐也可在文案中植入用户个性化标签增加用户的好感度亲密度还可以通过用户历史购买时间判断用户最容易消费的时间点在合适时间给用户发送营销信息
<br />
</span>
</div>
<div class="line"></div>
</div>
<pop-modal :showModel="dialogVisible" @closePop="dialogVisible = false">
<template v-slot:content>
<div v-html="knowledgeHtml">
</div>
<div v-html="knowledgeHtml"></div>
</template>
</pop-modal>
</div>
@ -317,6 +279,7 @@ const step1SelectParams3 = ref("");
const step1SelectParams4 = ref("");
const step1SelectParams5 = ref("");
const step1SelectParams6 = ref("");
const showAnswerFlag = ref(false);
const selectList = ref([
{
value: "用户信息表",
@ -343,84 +306,12 @@ const selectList = ref([
label: "销售明细表",
},
]);
const selectTable1 = ref([
"用户编码",
"用户姓名",
"用户状态",
"出生日期",
"性别",
"电话号码",
"注册日期",
"归属省",
"归属市",
"学历",
"职业",
"行业",
"婚姻状况",
"子女状况",
]);
const selectTable2 = ref([
"订单号",
"订单来源标识",
"用户编码",
"用户姓名",
"商品编码",
"商品名称",
"订单生成时间",
"订单日期",
"订单备注",
"订单状态",
"订单金额",
"付款账户",
"付款方式",
]);
const selectTable3 = ref([
"设备登录名",
"用户ID",
"设备ID",
"访问时间",
"IP所在省份",
"IP所在城市",
"上一个页面URL",
"当前页面URL",
"操作系统",
"登录日期",
"经度",
"纬度",
"付款方式",
]);
const selectTable4 = ref([
"用户ID",
"用户姓名",
"评论内容",
"评论图片",
"评论状态",
"综合评分",
"订单ID",
"创建日期",
"评论用户IP",
"更新时间",
]);
const selectTable5 = ref([
"设备登录名",
"用户ID",
"设备ID",
"搜索ID",
"搜索日期",
"用户搜索的关键词",
"搜索匹配标签内容",
]);
const selectTable6 = ref([
"商品编码",
"商品名称",
"商品归属类目",
"销售额",
"销售数量",
"订单号",
"用户编码",
"用户姓名",
"销售时间",
]);
const selectTable1 = ref(["用户编码", "用户姓名", "用户状态", "出生日期", "性别", "电话号码", "注册日期", "归属省", "归属市", "学历", "职业", "行业", "婚姻状况", "子女状况"]);
const selectTable2 = ref(["订单号", "订单来源标识", "用户编码", "用户姓名", "商品编码", "商品名称", "订单生成时间", "订单日期", "订单备注", "订单状态", "订单金额", "付款账户", "付款方式"]);
const selectTable3 = ref(["设备登录名", "用户ID", "设备ID", "访问时间", "IP所在省份", "IP所在城市", "上一个页面URL", "当前页面URL", "操作系统", "登录日期", "经度", "纬度", "付款方式"]);
const selectTable4 = ref(["用户ID", "用户姓名", "评论内容", "评论图片", "评论状态", "综合评分", "订单ID", "创建日期", "评论用户IP", "更新时间"]);
const selectTable5 = ref(["设备登录名", "用户ID", "设备ID", "搜索ID", "搜索日期", "用户搜索的关键词", "搜索匹配标签内容"]);
const selectTable6 = ref(["商品编码", "商品名称", "商品归属类目", "销售额", "销售数量", "订单号", "用户编码", "用户姓名", "销售时间"]);
const knowledgeFlag = ref(false);
//-7
const sevenNum = ref(0);
@ -601,8 +492,7 @@ const step2Data = ref([
{
firstTag: "用户价值标签",
secondTag: "用户价值RFM等级",
thirdTag:
"1.重要价值用户2.重要发展用户3.重要保持用户4.重要挽留用户5.一般价值用户6.一般发展用户7.一般保持用户8.一般挽留用户",
thirdTag: "1.重要价值用户2.重要发展用户3.重要保持用户4.重要挽留用户5.一般价值用户6.一般发展用户7.一般保持用户8.一般挽留用户",
},
{
firstTag: "用户价值标签",
@ -953,22 +843,7 @@ const draw = () => {
},
xAxis: {
type: "category",
data: [
"1",
"2",
"3",
"4",
"5",
"6",
"7",
"8",
"9",
"10",
"11",
"12",
"13",
"14",
],
data: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14"],
},
yAxis: {
type: "value",
@ -1035,14 +910,7 @@ const drawEcharts = () => {
};
const step1Submit = () => {
step1Error.value = 0;
if (
step1SelectParams1.value == "" ||
step1SelectParams2.value == "" ||
step1SelectParams3.value == "" ||
step1SelectParams4.value == "" ||
step1SelectParams5.value == "" ||
step1SelectParams6.value == ""
) {
if (step1SelectParams1.value == "" || step1SelectParams2.value == "" || step1SelectParams3.value == "" || step1SelectParams4.value == "" || step1SelectParams5.value == "" || step1SelectParams6.value == "") {
proxy.$modal.msgError("请先完成所有填空");
return;
}
@ -1080,18 +948,27 @@ const step2Submit = () => {
for (let i in sliceList1) {
if (sliceList1[i].params != "事实标签") {
step2Error.value++;
sliceList1[i].isError = true;
} else {
sliceList1[i].isError = false;
}
}
let sliceList2 = step2Data.value.slice(29, 34);
for (let i in sliceList2) {
if (sliceList2[i].params != "规则标签") {
step2Error.value++;
sliceList2[i].isError = true;
}else{
sliceList2[i].isError = false;
}
}
let sliceList3 = step2Data.value.slice(34);
for (let i in sliceList3) {
if (sliceList3[i].params != "预测标签") {
step2Error.value++;
sliceList3[i].isError = true;
}else{
sliceList3[i].isError = false;
}
}
console.log(step2Error.value, "错误数");
@ -1228,6 +1105,7 @@ const submitData = () => {
})
.then((res) => {
proxy.$modal.msgSuccess("提交成功");
showAnswerFlag.value = true;
})
.catch((error) => {});
};
@ -1293,9 +1171,9 @@ defineExpose({
padding: 0;
margin-left: 20px;
// background: #022603;
background: #FDEFDD;
background: #fdefdd;
// border: 1px solid #338554;
border: 1px solid #F7B55F;
border: 1px solid #f7b55f;
.selectLi {
list-style-type: none;
display: inline-block;
@ -1307,7 +1185,7 @@ defineExpose({
text-align: center;
font-size: 14px;
// border-right: 1px solid #338554;
border-right: 1px solid #F7B55F;
border-right: 1px solid #f7b55f;
}
.selectLi:nth-last-of-type(1) {
border-right: none;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -80,7 +80,7 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
<div style="margin-top: 10px; display: flex">
<el-table
:data="step1Data"
style="width: 600px"
style="width: 650px"
border
:header-cell-style="{
color: '#fff',
@ -92,17 +92,29 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
<el-table-column label="日活跃用户(个)" align="center" prop="addNum">
<template #default="scope">
<el-input v-model="scope.row.params1" placeholder="请输入" style="width: 90px" size="small"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError1" style="color: red">X</span>
<span v-if="!scope.row.isError1" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="日活跃率(%" align="center" prop="day2">
<el-table-column label="日活跃率(%" align="center" prop="day2" width="150">
<template #default="scope">
<el-input v-model="scope.row.params2" placeholder="请输入" style="width: 90px" size="small"></el-input>
%
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError2" style="color: red">X</span>
<span v-if="!scope.row.isError2" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="日活跃平均时长(分钟)" align="center" prop="day3" width="180">
<template #default="scope">
<el-input v-model="scope.row.params3" placeholder="请输入" style="width: 90px" size="small"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError3" style="color: red">X</span>
<span v-if="!scope.row.isError3" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
</el-table>
@ -143,12 +155,20 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
<el-table-column label="周活跃用户(个)" align="center" prop="description">
<template #default="scope">
<el-input v-model="scope.row.params1" placeholder="请输入" style="width: 90px"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError1" style="color: red">X</span>
<span v-if="!scope.row.isError1" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="周活跃率(%" align="center" prop="description">
<template #default="scope">
<el-input v-model="scope.row.params2" placeholder="请输入" style="width: 90px"></el-input>
%
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError2" style="color: red">X</span>
<span v-if="!scope.row.isError2" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
</el-table>
@ -181,12 +201,20 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
<el-table-column label="月活跃用户(个)" align="center" prop="description">
<template #default="scope">
<el-input v-model="scope.row.params1" placeholder="请输入" style="width: 90px"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError1" style="color: red">X</span>
<span v-if="!scope.row.isError1" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
<el-table-column label="月活跃率(%" align="center" prop="description">
<template #default="scope">
<el-input v-model="scope.row.params2" placeholder="请输入" style="width: 90px"></el-input>
%
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError2" style="color: red">X</span>
<span v-if="!scope.row.isError2" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
</el-table>
@ -233,6 +261,10 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
<el-table-column label="活跃天数" align="center" prop="data1">
<template #default="scope">
<el-input v-model="scope.row.params1" placeholder="请输入" style="width: 90px"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError" style="color: red">X</span>
<span v-if="!scope.row.isError" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
</el-table>
@ -250,6 +282,10 @@ https://blog.csdn.net/kevin1993best/article/details/106329573"
<el-table-column label="数值" align="center" prop="data1">
<template #default="scope">
<el-input v-model="scope.row.params1" placeholder="请输入" style="width: 90px"></el-input>
<div v-if="showAnswerFlag" style="margin-left: 3px; display: inline-block">
<span v-if="scope.row.isError" style="color: red">X</span>
<span v-if="!scope.row.isError" style="color: #00bb00"></span>
</div>
</template>
</el-table-column>
</el-table>
@ -316,6 +352,7 @@ const step2Error = ref(0);
const step3Error = ref(0);
const step4Error = ref(0);
const knowledgeFlag = ref(false);
const showAnswerFlag = ref(false);
//-7
const sevenNum = ref(0);
//-15
@ -1441,12 +1478,21 @@ const step1Submit = () => {
for (let i in step1Data.value) {
if (step1Data.value[i].params1 != step1RightAnswer.value[i].activeNum) {
step1Error.value++;
step1Data.value[i].isError1 = true;
} else {
step1Data.value[i].isError1 = false;
}
if (step1Data.value[i].params2 != step1RightAnswer.value[i].activeRate) {
step1Error.value++;
step1Data.value[i].isError2 = true;
} else {
step1Data.value[i].isError2 = false;
}
if (step1Data.value[i].params3 != step1RightAnswer.value[i].activeTime) {
step1Error.value++;
step1Data.value[i].isError3 = true;
} else {
step1Data.value[i].isError3 = false;
}
}
console.log(step1Error.value, "错误数");
@ -1465,9 +1511,15 @@ const step2Submit = () => {
for (let i in step2Data.value) {
if (step2Data.value[i].params1 != step2RightAnswer.value[i].num) {
step2Error.value++;
step2Data.value[i].isError1 = true;
} else {
step2Data.value[i].isError1 = false;
}
if (step2Data.value[i].params2 != step2RightAnswer.value[i].ratio) {
step2Error.value++;
step2Data.value[i].isError2 = true;
} else {
step2Data.value[i].isError2 = false;
}
}
console.log(step2Error.value, "错误数");
@ -1485,9 +1537,15 @@ const step3Submit = () => {
}
if (step3Data.value[0].params1 != "10") {
step3Error.value++;
step3Data.value[0].isError1 = true;
}else{
step3Data.value[0].isError1 = false;
}
if (step3Data.value[0].params2 != "100") {
step3Error.value++;
step3Data.value[0].isError2 = true;
}else{
step3Data.value[0].isError2 = false;
}
// console.log(89);
console.log(step3Error.value, "错误数");
@ -1513,13 +1571,22 @@ const step4Submit = () => {
for (let i in step4Data.value) {
if (step4Data.value[i].params1 != step4RightAnswer.value[i]) {
step4Error.value++;
step4Data.value[i].isError = true;
}else{
step4Data.value[i].isError = false;
}
}
if (step4DataTable2.value[0].params1 != "20") {
step4Error.value++;
step4DataTable2.value[0].isError = true;
}else{
step4DataTable2.value[0].isError = false;
}
if (step4DataTable2.value[1].params1 != "3") {
step4Error.value++;
step4DataTable2.value[1].isError = true;
}else{
step4DataTable2.value[1].isError = false;
}
console.log(step4Error.value, "错误数");
proxy.$modal.msgSuccess("提交成功");
@ -1682,6 +1749,7 @@ const submitData = () => {
})
.then((res) => {
proxy.$modal.msgSuccess("提交成功");
showAnswerFlag.value = true;
})
.catch((error) => {});
};

Loading…
Cancel
Save