|
|
<template>
|
|
|
<div class="content">
|
|
|
<div class="import" @click="knowledgeFlag = !knowledgeFlag">
|
|
|
<img src="@/assets/images/导入.png" alt="" />
|
|
|
<span>任务知识导入</span>
|
|
|
</div>
|
|
|
<div v-if="knowledgeFlag">
|
|
|
<a
|
|
|
href="https://zhuanlan.zhihu.com/p/649393225"
|
|
|
target="_blank"
|
|
|
rel="noopener noreferrer"
|
|
|
>https://zhuanlan.zhihu.com/p/649393225</a
|
|
|
>
|
|
|
<br />
|
|
|
|
|
|
<a
|
|
|
href="https://baijiahao.baidu.com/s?id=1777456500129450397&wfr=spider&for=pc"
|
|
|
target="_blank"
|
|
|
rel="noopener noreferrer"
|
|
|
>https://baijiahao.baidu.com/s?id=1777456500129450397&wfr=spider&for=pc</a
|
|
|
>
|
|
|
<br />
|
|
|
<a
|
|
|
href="https://www.fanruan.com/bw/lsdsr"
|
|
|
target="_blank"
|
|
|
rel="noopener noreferrer"
|
|
|
>https://www.fanruan.com/bw/lsdsr</a
|
|
|
>
|
|
|
<br />
|
|
|
<a
|
|
|
href="https://www.woshipm.com/data-analysis/5236102.html"
|
|
|
target="_blank"
|
|
|
rel="noopener noreferrer"
|
|
|
>https://www.woshipm.com/data-analysis/5236102.html</a
|
|
|
>
|
|
|
<div v-html="knowledgeHtml"></div>
|
|
|
</div>
|
|
|
<div v-if="!knowledgeFlag">
|
|
|
<div class="caseBack">
|
|
|
<div class="title">
|
|
|
<img src="@/assets/images/caseIcon.png" alt="" />
|
|
|
<span>案例背景：</span>
|
|
|
</div>
|
|
|
<span style="line-height: 25px; font-size: 14px">
|
|
|
某购物网站2024年2月份有如下订单数据，需要复购的角度展开分析。
|
|
|
</span>
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
<el-table
|
|
|
:data="fileTable1"
|
|
|
style="width: 650px"
|
|
|
border
|
|
|
:header-cell-style="{
|
|
|
color: '#fff',
|
|
|
fontSize: '14px',
|
|
|
backgroundColor: '#6A7DE9!important',
|
|
|
}"
|
|
|
>
|
|
|
<el-table-column label="订单ID" align="center" prop="id">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="客户ID" align="center" prop="cid">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="购买金额" align="center" prop="amount">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="购买商品" align="center" prop="goods">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="订单日期" align="center" prop="date">
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<div class="download" @click="downloadData">下载数据</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="caseBack">
|
|
|
<div class="title">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>第一步，区分首购订单 or 复购订单</span>
|
|
|
</div>
|
|
|
<span style="line-height: 25px; font-size: 14px">
|
|
|
我们需要根据用户ID、订单ID和购买日期，区分每行数据订单是首购or
|
|
|
复购第几次。<br />
|
|
|
|
|
|
通常采用的方法是用户ID作为主排序字段，购买日期作为第二排序字段，分类汇总次数。<br />
|
|
|
首购订单记为1，复购订单依次累加
|
|
|
</span>
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
<el-table
|
|
|
:data="step1Data"
|
|
|
style="width: 850px"
|
|
|
border
|
|
|
:header-cell-style="{
|
|
|
color: '#fff',
|
|
|
fontSize: '14px',
|
|
|
backgroundColor: '#6A7DE9!important',
|
|
|
}"
|
|
|
>
|
|
|
<el-table-column label="订单ID" align="center" prop="id">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="客户ID"
|
|
|
align="center"
|
|
|
prop="cid"
|
|
|
width="100"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="购买金额" align="center" prop="amount">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="购买商品" align="center" prop="goods">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="订单日期" align="center" prop="date">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="首购订单&复购订单"
|
|
|
align="center"
|
|
|
prop="amount"
|
|
|
>
|
|
|
<template #default="scope">
|
|
|
<el-select
|
|
|
v-model="scope.row.params"
|
|
|
placeholder="请选择"
|
|
|
style="width: 95px"
|
|
|
size="small"
|
|
|
>
|
|
|
<el-option
|
|
|
:label="item"
|
|
|
:value="item"
|
|
|
v-for="item in 10"
|
|
|
:key="item"
|
|
|
/>
|
|
|
<!-- <el-option :label="item" :value="item" />
|
|
|
<el-option label="C" value="C" />
|
|
|
<el-option label="D" value="D" /> -->
|
|
|
</el-select>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
|
|
|
<div class="submit" @click="step1Submit">提交</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="caseBack">
|
|
|
<div class="title">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>第二步，复购率计算</span>
|
|
|
</div>
|
|
|
<span style="line-height: 25px; font-size: 14px">
|
|
|
用户复购率=单位时间内购买两次及以上的用户数/有购买行为的总用户数<br />
|
|
|
可见，需要计算出两点，一是有复购行为的用户数，二是有购买行为的总用户数，基于二者计算用户复购率。
|
|
|
</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="name">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="计算说明" align="center" prop="description">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="计算值" align="center" prop="amount">
|
|
|
<template #default="scope">
|
|
|
<el-input
|
|
|
v-model="scope.row.params"
|
|
|
placeholder="请输入"
|
|
|
style="width: 70px"
|
|
|
>
|
|
|
</el-input
|
|
|
><span v-if="scope.$index == 2">%</span>
|
|
|
<span v-else>个</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<div class="submit" @click="step2Submit">提交</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="caseBack">
|
|
|
<div class="title">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>第三步，复购时间趋势分析</span>
|
|
|
</div>
|
|
|
<span style="line-height: 25px; font-size: 14px">
|
|
|
对于复购率的分析，需要按照日期维度，可以按季度、按月、按周查看复购率和用户数/订单数之间的变化关系，绘制变化曲线图。同时实时/定期监控数据健康度，理想状态下复购率应该是较为稳定的，根据数据变化，及时发现异常问题。
|
|
|
</span>
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
<img src="@/assets/images/u4316.png" alt="" />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="caseBack">
|
|
|
<div class="title">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>第四步，复购时间间隔分析</span>
|
|
|
</div>
|
|
|
<span style="line-height: 25px; font-size: 14px">
|
|
|
针对第二步计算的表格，统计分析第二次购买与首购的时间间隔，并根据复购时间间隔进行分组统计分析。<br />
|
|
|
|
|
|
复购时间间隔分析的作用，在于了解用户在不同时间间隔范围内，进行复购行为的占比情况，从而制定营销活动的推出时间间隔。
|
|
|
</span>
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
<el-table
|
|
|
:data="step4Data"
|
|
|
:span-method="tableSpanMethod"
|
|
|
style="width: 950px"
|
|
|
border
|
|
|
:header-cell-style="{
|
|
|
color: '#fff',
|
|
|
fontSize: '14px',
|
|
|
backgroundColor: '#6A7DE9!important',
|
|
|
}"
|
|
|
>
|
|
|
<el-table-column
|
|
|
label="订单ID"
|
|
|
align="center"
|
|
|
prop="data1"
|
|
|
width="120"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="客户ID"
|
|
|
align="center"
|
|
|
prop="data2"
|
|
|
width="120"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="购买金额"
|
|
|
align="center"
|
|
|
prop="data3"
|
|
|
width="120"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="购买商品"
|
|
|
align="center"
|
|
|
prop="data4"
|
|
|
width="120"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="订单日期"
|
|
|
align="center"
|
|
|
prop="data5"
|
|
|
width="120"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="首购订单&复购订单"
|
|
|
align="center"
|
|
|
prop="data6"
|
|
|
width="120"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="第二次购买与首购的时间间隔"
|
|
|
align="center"
|
|
|
prop="amount"
|
|
|
>
|
|
|
<template #default="scope">
|
|
|
<el-input
|
|
|
size="small"
|
|
|
v-model="scope.row.params1"
|
|
|
placeholder="请输入"
|
|
|
style="width: 70px"
|
|
|
>
|
|
|
</el-input
|
|
|
>天
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="时间间隔分组" align="center" prop="amount">
|
|
|
<template #default="scope">
|
|
|
<el-select
|
|
|
v-model="scope.row.params2"
|
|
|
placeholder="请选择"
|
|
|
style="width: 85px"
|
|
|
size="small"
|
|
|
@change="handleChangeTime"
|
|
|
>
|
|
|
<el-option label="7天内" value="7天内" />
|
|
|
<el-option label="15天内" value="15天内" />
|
|
|
<el-option label="30天内" value="30天内" />
|
|
|
<el-option label="30天以上" value="30天以上" />
|
|
|
</el-select>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<div class="submit" @click="step4Submit">提交</div>
|
|
|
</div>
|
|
|
<div style="display: flex; align-items: center">
|
|
|
<p style="line-height: 25px; font-size: 14px">
|
|
|
根据分组字段，使用饼图/环形图展示占比情况。
|
|
|
</p>
|
|
|
<div class="draw" @click="draw">绘制</div>
|
|
|
</div>
|
|
|
<div id="echarts" style="width: 500px; height: 360px"></div>
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="caseBack">
|
|
|
<div class="title">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>第五步，商品复购分析</span>
|
|
|
</div>
|
|
|
<span style="line-height: 25px; font-size: 14px">
|
|
|
商品的复购情况分析十分重要，可以通过复购次数较多的商品，分析用户习惯和商品特征，分析维度包括：<br />
|
|
|
|
|
|
每种商品的复购次数、排行榜;<br />
|
|
|
|
|
|
每种商品复购的用户情况，每个用户复购的次数等;<br />
|
|
|
|
|
|
结合品类、销量、价格区间、评价等等多种维度，进行细化分析等。
|
|
|
</span>
|
|
|
<div class="generateBtn">生成商品复购分析表</div>
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
<el-table
|
|
|
:data="step5Data"
|
|
|
style="width: 690px"
|
|
|
border
|
|
|
:header-cell-style="{
|
|
|
color: '#fff',
|
|
|
fontSize: '14px',
|
|
|
backgroundColor: '#6A7DE9!important',
|
|
|
}"
|
|
|
>
|
|
|
<el-table-column label="订单ID" align="center" prop="data1">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="客户ID" align="center" prop="data2">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="购买金额" align="center" prop="data3">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="购买商品" align="center" prop="data4">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="订单日期" align="center" prop="data5">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="商品复购次数" align="center" prop="data6">
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<div style="margin-left: 10px; margin-top: -44px">
|
|
|
<div class="title" style="margin-bottom: 10px">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>商品复购排行</span>
|
|
|
</div>
|
|
|
<el-table
|
|
|
:data="step5DataTable2"
|
|
|
style="width: 270px"
|
|
|
border
|
|
|
:header-cell-style="{
|
|
|
color: '#fff',
|
|
|
fontSize: '14px',
|
|
|
backgroundColor: '#6A7DE9!important',
|
|
|
}"
|
|
|
>
|
|
|
<el-table-column
|
|
|
label="排名"
|
|
|
align="center"
|
|
|
prop="name"
|
|
|
width="100"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="商品" align="center" prop="amount">
|
|
|
<template #default="scope">
|
|
|
<el-select
|
|
|
v-model="scope.row.params"
|
|
|
placeholder="请选择"
|
|
|
style="width: 95px"
|
|
|
size="small"
|
|
|
>
|
|
|
<el-option
|
|
|
:label="item.label"
|
|
|
:value="item.value"
|
|
|
v-for="item in productList"
|
|
|
:key="item.value"
|
|
|
/>
|
|
|
<!-- <el-option :label="item" :value="item" />
|
|
|
<el-option label="C" value="C" />
|
|
|
<el-option label="D" value="D" /> -->
|
|
|
</el-select>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div style="margin-left: 10px; margin-top: -44px">
|
|
|
<div class="title" style="margin-bottom: 10px">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>每种商品复购的用户情况（用户习惯）</span>
|
|
|
</div>
|
|
|
<el-table
|
|
|
:data="step5DataTable3"
|
|
|
style="width: 370px"
|
|
|
border
|
|
|
:header-cell-style="{
|
|
|
color: '#fff',
|
|
|
fontSize: '14px',
|
|
|
backgroundColor: '#6A7DE9!important',
|
|
|
}"
|
|
|
>
|
|
|
<el-table-column
|
|
|
label="商品"
|
|
|
align="center"
|
|
|
prop="name"
|
|
|
width="100"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="复购率最高的用户"
|
|
|
align="center"
|
|
|
prop="name"
|
|
|
width="130"
|
|
|
>
|
|
|
<template #default="scope">
|
|
|
<el-select
|
|
|
v-model="scope.row.params1"
|
|
|
placeholder="请选择"
|
|
|
style="width: 95px"
|
|
|
size="small"
|
|
|
>
|
|
|
<el-option
|
|
|
:label="item.label"
|
|
|
:value="item.value"
|
|
|
v-for="item in idList"
|
|
|
:key="item.value"
|
|
|
/>
|
|
|
<!-- <el-option :label="item" :value="item" />
|
|
|
<el-option label="C" value="C" />
|
|
|
<el-option label="D" value="D" /> -->
|
|
|
</el-select>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="复购次数" align="center" prop="amount">
|
|
|
<template #default="scope">
|
|
|
<el-input
|
|
|
v-model="scope.row.params2"
|
|
|
placeholder="请输入"
|
|
|
style="width: 55px"
|
|
|
size="small"
|
|
|
></el-input
|
|
|
><span>次</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div class="submit" @click="step5Submit">提交</div>
|
|
|
</div>
|
|
|
<!-- <div class="customerType" style="width: 887px">
|
|
|
<img src="@/assets/images/促销.png" alt="" />
|
|
|
<span
|
|
|
>优化商品配置：可以厘清哪些商品可以一起购买,关联商品可以优化陈列方式、进行促销等;</span
|
|
|
>
|
|
|
</div> -->
|
|
|
<!-- <div class="customerType" style="width: 887px">
|
|
|
<img src="@/assets/images/需求.png" alt="" />
|
|
|
<span
|
|
|
>了解客户需求：分析出顾客的购买习惯，顾客购买商品的时间、地点等;
|
|
|
</span>
|
|
|
</div>
|
|
|
<div class="customerType" style="width: 887px">
|
|
|
<img src="@/assets/images/趋势.png" alt="" />
|
|
|
<span
|
|
|
>分析销售趋势：利用数据仓库对品种和库存的趋势进行分析,选定需要补充的商品,研究顾客购买趋势,分析季节性购买模式,确定降价商品。</span
|
|
|
>
|
|
|
</div> -->
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="caseBack">
|
|
|
<div class="title">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>第六步，商品价值分析</span>
|
|
|
</div>
|
|
|
<span style="line-height: 25px; font-size: 14px">
|
|
|
从商品的角度出发，看一个商品的综合价值，可以使用四象限图（波士顿矩阵）来查看商品价值分析。销量和复购率分别作为横纵轴，以平均值为分割线，将所有商品类型划分到四个象限内。<br />
|
|
|
对于新兴产品：需要着重拓展市场<br />
|
|
|
对于低回购产品：需要检查是否产品有质量问题，导致用户单次购买多但不会回购<br />
|
|
|
对于问题产品：着重关注
|
|
|
</span>
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
<img src="@/assets/images/u4330.png" alt="" />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="caseBack">
|
|
|
<div class="title">
|
|
|
<img src="@/assets/images/步骤.png" alt="" />
|
|
|
<span>第七步，复购深层分析 </span>
|
|
|
</div>
|
|
|
<div class="secondTitle">
|
|
|
<img src="@/assets/images/icon01.png" alt="" />
|
|
|
<span>定期追指标</span>
|
|
|
</div>
|
|
|
<p style="line-height: 25px; font-size: 14px; margin-left: 30px">
|
|
|
用户太久不来消费就可能流失，因此衍生了一个做法：计算用户最近一次消费距今时间，如果发现用户已经距今7天/30天/60天/90天没有复购，则直接开展唤醒动作，发放优惠券。
|
|
|
</p>
|
|
|
<!-- <span style="line-height: 25px; font-size: 14px">
|
|
|
从商品的角度出发，看一个商品的综合价值，可以使用四象限图（波士顿矩阵）来查看商品价值分析。销量和复购率分别作为横纵轴，以平均值为分割线，将所有商品类型划分到四个象限内。<br />
|
|
|
对于新兴产品：需要着重拓展市场<br />
|
|
|
对于低回购产品：需要检查是否产品有质量问题，导致用户单次购买多但不会回购<br />
|
|
|
对于问题产品：着重关注
|
|
|
</span> -->
|
|
|
<div style="margin-top: 10px; display: flex; margin-left: 30px">
|
|
|
<img src="@/assets/images/u3636.png" alt="" />
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="secondTitle">
|
|
|
<img src="@/assets/images/icon1-2.png" alt="" />
|
|
|
<span>找魔法数字</span>
|
|
|
</div>
|
|
|
<p style="line-height: 25px; font-size: 14px; margin-left: 30px">
|
|
|
忠诚用户的复购频率会比普通用户高，这个道理也是不用分析，是个人都知道。于是，有一些数据分析师/运营，会去找这个魔法数字：用户复购X次以后，累计消费与复购率明显高于其他用户（如下图）。<br />
|
|
|
比如发现用户复购4次以后，再进行复购的概率与累计消费都明显高于其他用户。运营便很有动力围绕这个“4次”做文章，通过会员奖励/连续推券/积分等手段，鼓励用户做到这个“4次复购”。
|
|
|
</p>
|
|
|
<div style="margin-top: 10px; display: flex; margin-left: 30px">
|
|
|
<img src="@/assets/images/u4653.png" alt="" />
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="secondTitle">
|
|
|
<img src="@/assets/images/icon1-3.png" alt="" />
|
|
|
<span>发现偏好</span>
|
|
|
</div>
|
|
|
<p style="line-height: 25px; font-size: 14px; margin-left: 30px">
|
|
|
在统计用户消费频次/金额的时候，不要只粗暴地看总量，而是按品牌/品类比例进行区分，尝试找到：集中某一品牌/某一品类的忠实用户，如果发现有这一类相对“专一”的用户存在，<br />
|
|
|
再结合其消费金额/参与活动情况，判断用户是被打折价格吸引还是被商品吸引，从而找出运营策略。
|
|
|
</p>
|
|
|
<div style="margin-top: 10px; display: flex; margin-left: 30px">
|
|
|
<img src="@/assets/images/u4657.png" alt="" />
|
|
|
</div>
|
|
|
<div class="line"></div>
|
|
|
<div class="secondTitle">
|
|
|
<img src="@/assets/images/icon1-4.png" alt="" />
|
|
|
<span>记录场景</span>
|
|
|
</div>
|
|
|
<p style="line-height: 25px; font-size: 14px; margin-left: 30px">
|
|
|
低频消费的用户，不代表一定没有复购，很有可能只是没有触发需求场景而已，比如典型的：<br />
|
|
|
1）喜爱参与大促的用户；<br />
|
|
|
2）节假日/礼品消费的用户；<br />
|
|
|
3）换季/上新时才出现的用户。<br />
|
|
|
这些用户的复购周期是必然远远低于常规用户的，但在特定场景下的消费又非常刚需。因此与其平时浪费资源乱发券，不如通过消费记录/搜索记录等，标志出重点场景用户，集中在这些场景下赢取用户消费。
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</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(
|
|
|
`<p style="text-align: left;">复购率分析是评估消费者对某一品牌或产品忠诚度的重要指标，它反映了消费者满意度和重复购买的行为。通过复购率分析，企业可以更好地了解消费者的购买行为和需求，从而制定更精准的营销策略和产品优化方向。</p><p style="text-align: left;">复购率的计算有两种主要方法：</p><p style="text-align: left;">按客户计算：一定时间内再次购买的客户的人数除以购买的总人数。这种方法不考虑客户购买的次数，只关注是否有重复购买行为。</p><p style="text-align: left;">按订单计算：一定时间内再次购买的客户的订单数除以购买的总订单数。这种方法会统计多次购买的客户订单，区分每次购买的订单。</p><p style="text-align: left;">推荐企业采取按客户计算的复购率算法，因为它更能反映消费者的忠诚度。然而，按订单计算的复购率可能会因为多次购买的客户产生的订单数较多而显得更高。</p><p style="text-align: left;">复购率分析的重要性体现在以下几个方面：</p><p style="text-align: left;">反映客户忠诚度：高复购率意味着消费者对产品的认可度高，愿意再次购买，从而反映出较高的客户忠诚度。</p><p style="text-align: left;">预测销售趋势：通过分析复购率的变化趋势，企业可以预测产品的未来表现，做出更明智的选品决策。</p><p style="text-align: left;">指导选品策略：结合其他指标如销售额、转化率等，对复购率进行综合分析，可以帮助企业筛选出具有潜力的爆款产品。</p><p style="text-align: left;">为了进行复购率分析，企业可以采用以下步骤：</p><p style="text-align: left;">1.收集数据：收集包括订单ID、订单日期、客户名称等指标的数据。</p><p style="text-align: left;">2.计算复购率：根据收集的数据计算一个月内每个用户的购买次数、统计一个月内的购买人数、统计每个月内多次购买的人数并计算月复购率。</p><p style="text-align: left;">3.可视化展示：通过可视化图表的形式展示复购率数据，发现数据规律和问题，如复购时间间隔分析、商品复购分析等。</p><p style="text-align: left;">4.结论分析：根据复购率和用户总数的变化趋势，分析用户黏性的健康度，制定相应的运营策略。</p><p style="text-align: left;">通过复购率分析，企业不仅可以评估现有客户的忠诚度和满意度，还可以预测未来的销售趋势，为产品优化和营销策略提供有力支持。</p>`
|
|
|
);
|
|
|
const list = ref(["-"]);
|
|
|
const errorNum = ref(0);
|
|
|
const step1Error = ref(0);
|
|
|
const step2Error = ref(0);
|
|
|
const step4Error = ref(0);
|
|
|
const step5Error = ref(0);
|
|
|
const step1AnswerFlag = ref(false);
|
|
|
const step2AnswerFlag = ref(false);
|
|
|
const step4AnswerFlag = ref(false);
|
|
|
const step5AnswerFlag = ref(false);
|
|
|
const combinationValue1 = ref("");
|
|
|
const combinationValue2 = ref("");
|
|
|
const knowledgeFlag = ref(false);
|
|
|
//时间间隔分组数-7天内
|
|
|
const sevenNum = ref(0);
|
|
|
//时间间隔分组数-15天内
|
|
|
const fiftyNum = ref(0);
|
|
|
//时间间隔分组数-30天内
|
|
|
const thirtyNumIn = ref(0);
|
|
|
//时间间隔分组数-30天以上
|
|
|
const thirtyNumOut = ref(0);
|
|
|
const step1Data = ref([
|
|
|
{
|
|
|
id: "dd001",
|
|
|
cid: "A",
|
|
|
amount: "189",
|
|
|
goods: "衬衫",
|
|
|
date: "2024-02-02",
|
|
|
},
|
|
|
{
|
|
|
id: "dd017",
|
|
|
cid: "A",
|
|
|
amount: "39",
|
|
|
goods: "睡衣",
|
|
|
date: "2024-02-24",
|
|
|
},
|
|
|
{
|
|
|
id: "dd003",
|
|
|
cid: "B",
|
|
|
amount: "99",
|
|
|
goods: "裤子",
|
|
|
date: "2024-02-04",
|
|
|
},
|
|
|
{
|
|
|
id: "dd008",
|
|
|
cid: "B",
|
|
|
amount: "143",
|
|
|
goods: "外套",
|
|
|
date: "2024-02-14",
|
|
|
},
|
|
|
{
|
|
|
id: "dd013",
|
|
|
cid: "B",
|
|
|
amount: "59",
|
|
|
goods: "衬衫",
|
|
|
date: "2024-02-22",
|
|
|
},
|
|
|
{
|
|
|
id: "dd006",
|
|
|
cid: "C",
|
|
|
amount: "141",
|
|
|
goods: "皮鞋",
|
|
|
date: "2024-02-12",
|
|
|
},
|
|
|
{
|
|
|
id: "dd011",
|
|
|
cid: "C",
|
|
|
amount: "191",
|
|
|
goods: "外套",
|
|
|
date: "2024-02-16",
|
|
|
},
|
|
|
{
|
|
|
id: "dd015",
|
|
|
cid: "C",
|
|
|
amount: "94",
|
|
|
goods: "睡衣",
|
|
|
date: "2024-02-23",
|
|
|
},
|
|
|
{
|
|
|
id: "dd019",
|
|
|
cid: "C",
|
|
|
amount: "186",
|
|
|
goods: "睡衣",
|
|
|
date: "2024-02-28",
|
|
|
},
|
|
|
{
|
|
|
id: "dd007",
|
|
|
cid: "D",
|
|
|
amount: "138",
|
|
|
goods: "裤子",
|
|
|
date: "2024-02-14",
|
|
|
},
|
|
|
{
|
|
|
id: "dd010",
|
|
|
cid: "D",
|
|
|
amount: "150",
|
|
|
goods: "裤子",
|
|
|
date: "2024-02-16",
|
|
|
},
|
|
|
{
|
|
|
id: "dd012",
|
|
|
cid: "D",
|
|
|
amount: "137",
|
|
|
goods: "裤子",
|
|
|
date: "2024-02-20",
|
|
|
},
|
|
|
{
|
|
|
id: "dd014",
|
|
|
cid: "D",
|
|
|
amount: "173",
|
|
|
goods: "衬衫",
|
|
|
date: "2024-02-22",
|
|
|
},
|
|
|
{
|
|
|
id: "dd018",
|
|
|
cid: "D",
|
|
|
amount: "99",
|
|
|
goods: "外套",
|
|
|
date: "2024-02-26",
|
|
|
},
|
|
|
{
|
|
|
id: "dd002",
|
|
|
cid: "E",
|
|
|
amount: "101",
|
|
|
goods: "短袖",
|
|
|
date: "2024-02-02",
|
|
|
},
|
|
|
{
|
|
|
id: "dd005",
|
|
|
cid: "F",
|
|
|
amount: "111",
|
|
|
goods: "外套",
|
|
|
date: "2024-02-10",
|
|
|
},
|
|
|
{
|
|
|
id: "dd009",
|
|
|
cid: "G",
|
|
|
amount: "171",
|
|
|
goods: "帽子",
|
|
|
date: "2024-02-15",
|
|
|
},
|
|
|
{
|
|
|
id: "dd004",
|
|
|
cid: "H",
|
|
|
amount: "176",
|
|
|
goods: "内衣",
|
|
|
date: "2024-02-07",
|
|
|
},
|
|
|
{
|
|
|
id: "dd020",
|
|
|
cid: "J",
|
|
|
amount: "52",
|
|
|
goods: "短袖",
|
|
|
date: "2024-02-28",
|
|
|
},
|
|
|
{
|
|
|
id: "dd016",
|
|
|
cid: "K",
|
|
|
amount: "82",
|
|
|
goods: "短袖",
|
|
|
date: "2024-02-24",
|
|
|
},
|
|
|
]);
|
|
|
const fileTable1 = ref([
|
|
|
{
|
|
|
id: "dd001",
|
|
|
cid: "A",
|
|
|
amount: "189",
|
|
|
goods: "衬衫",
|
|
|
date: "2024-02-02",
|
|
|
},
|
|
|
{
|
|
|
id: "dd002",
|
|
|
cid: "E",
|
|
|
amount: "101",
|
|
|
goods: "短袖",
|
|
|
date: "2024-02-02",
|
|
|
},
|
|
|
{
|
|
|
id: "dd003",
|
|
|
cid: "B",
|
|
|
amount: "99",
|
|
|
goods: "裤子",
|
|
|
date: "2024-02-04",
|
|
|
},
|
|
|
{
|
|
|
id: "dd004",
|
|
|
cid: "H",
|
|
|
amount: "176",
|
|
|
goods: "内衣",
|
|
|
date: "2024-02-07",
|
|
|
},
|
|
|
{
|
|
|
id: "dd005",
|
|
|
cid: "F",
|
|
|
amount: "111",
|
|
|
goods: "外套",
|
|
|
date: "2024-02-10",
|
|
|
},
|
|
|
{
|
|
|
id: "dd006",
|
|
|
cid: "C",
|
|
|
amount: "141",
|
|
|
goods: "皮鞋",
|
|
|
date: "2024-02-12",
|
|
|
},
|
|
|
{
|
|
|
id: "dd007",
|
|
|
cid: "D",
|
|
|
amount: "138",
|
|
|
goods: "裤子",
|
|
|
date: "2024-02-14",
|
|
|
},
|
|
|
{
|
|
|
id: "dd008",
|
|
|
cid: "B",
|
|
|
amount: "143",
|
|
|
goods: "外套",
|
|
|
date: "2024-02-14",
|
|
|
},
|
|
|
{
|
|
|
id: "dd009",
|
|
|
cid: "G",
|
|
|
amount: "171",
|
|
|
goods: "帽子",
|
|
|
date: "2024-02-15",
|
|
|
},
|
|
|
{
|
|
|
id: "dd010",
|
|
|
cid: "D",
|
|
|
amount: "150",
|
|
|
goods: "裤子",
|
|
|
date: "2024-02-16",
|
|
|
},
|
|
|
{
|
|
|
id: "dd011",
|
|
|
cid: "C",
|
|
|
amount: "191",
|
|
|
goods: "外套",
|
|
|
date: "2024-02-16",
|
|
|
},
|
|
|
{
|
|
|
id: "dd012",
|
|
|
cid: "D",
|
|
|
amount: "137",
|
|
|
goods: "裤子",
|
|
|
date: "2024-02-20",
|
|
|
},
|
|
|
{
|
|
|
id: "dd013",
|
|
|
cid: "B",
|
|
|
amount: "59",
|
|
|
goods: "衬衫",
|
|
|
date: "2024-02-22",
|
|
|
},
|
|
|
{
|
|
|
id: "dd014",
|
|
|
cid: "D",
|
|
|
amount: "173",
|
|
|
goods: "衬衫",
|
|
|
date: "2024-02-22",
|
|
|
},
|
|
|
{
|
|
|
id: "dd015",
|
|
|
cid: "C",
|
|
|
amount: "94",
|
|
|
goods: "睡衣",
|
|
|
date: "2024-02-23",
|
|
|
},
|
|
|
{
|
|
|
id: "dd016",
|
|
|
cid: "K",
|
|
|
amount: "82",
|
|
|
goods: "短袖",
|
|
|
date: "2024-02-24",
|
|
|
},
|
|
|
{
|
|
|
id: "dd017",
|
|
|
cid: "A",
|
|
|
amount: "39",
|
|
|
goods: "睡衣",
|
|
|
date: "2024-02-24",
|
|
|
},
|
|
|
{
|
|
|
id: "dd018",
|
|
|
cid: "D",
|
|
|
amount: "99",
|
|
|
goods: "外套",
|
|
|
date: "2024-02-26",
|
|
|
},
|
|
|
{
|
|
|
id: "dd019",
|
|
|
cid: "C",
|
|
|
amount: "186",
|
|
|
goods: "睡衣",
|
|
|
date: "2024-02-28",
|
|
|
},
|
|
|
{
|
|
|
id: "dd020",
|
|
|
cid: "J",
|
|
|
amount: "52",
|
|
|
goods: "短袖",
|
|
|
date: "2024-02-28",
|
|
|
},
|
|
|
]);
|
|
|
const step2Data = ref([
|
|
|
{
|
|
|
name: "有购买行为的总用户数",
|
|
|
description: "第一步表格中“首购订单&复购订单”那一列数字“1”的个数",
|
|
|
account: "800",
|
|
|
},
|
|
|
{
|
|
|
name: "有复购行为的用户数",
|
|
|
description: "第一步表格中“首购订单&复购订单”那一列数字“2”的个数",
|
|
|
account: "1200",
|
|
|
},
|
|
|
{ name: "复购率", description: "", account: "600" },
|
|
|
]);
|
|
|
const step3Data = ref([
|
|
|
{
|
|
|
data1: "A-B",
|
|
|
data2: "5900",
|
|
|
},
|
|
|
{
|
|
|
data1: "A-C",
|
|
|
data2: "2400",
|
|
|
},
|
|
|
{
|
|
|
data1: "A-D",
|
|
|
data2: "1100",
|
|
|
},
|
|
|
|
|
|
{
|
|
|
data1: "B-C",
|
|
|
data2: "600",
|
|
|
},
|
|
|
{
|
|
|
data1: "B-D",
|
|
|
data2: "600",
|
|
|
},
|
|
|
{
|
|
|
data1: "C-D",
|
|
|
data2: "600",
|
|
|
},
|
|
|
]);
|
|
|
const step4Data = ref([
|
|
|
{
|
|
|
data1: "dd001",
|
|
|
data2: "A",
|
|
|
data3: "189",
|
|
|
data4: "衬衫",
|
|
|
data5: "2024-02-02",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd017",
|
|
|
data2: "A",
|
|
|
data3: "39",
|
|
|
data4: "睡衣",
|
|
|
data5: "2024-02-24",
|
|
|
data6: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd008",
|
|
|
data2: "B",
|
|
|
data3: "143",
|
|
|
data4: "外套",
|
|
|
data5: "2024-02-14",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd013",
|
|
|
data2: "B",
|
|
|
data3: "59",
|
|
|
data4: "衬衫",
|
|
|
data5: "2024-02-22",
|
|
|
data6: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd015",
|
|
|
data2: "C",
|
|
|
data3: "94",
|
|
|
data4: "睡衣",
|
|
|
data5: "2024-02-23",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd019",
|
|
|
data2: "C",
|
|
|
data3: "186",
|
|
|
data4: "睡衣",
|
|
|
data5: "2024-02-28",
|
|
|
data6: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd007",
|
|
|
data2: "D",
|
|
|
data3: "138",
|
|
|
data4: "裤子",
|
|
|
data5: "2024-02-14",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd010",
|
|
|
data2: "D",
|
|
|
data3: "150",
|
|
|
data4: "裤子",
|
|
|
data5: "2024-02-16",
|
|
|
data6: "2",
|
|
|
},
|
|
|
]);
|
|
|
const step5Data = ref([
|
|
|
{
|
|
|
data1: "dd003",
|
|
|
data2: "B",
|
|
|
data3: "99",
|
|
|
data4: "裤子",
|
|
|
data5: "2024-02-04",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd007",
|
|
|
data2: "D",
|
|
|
data3: "138",
|
|
|
data4: "裤子",
|
|
|
data5: "2024-02-14",
|
|
|
data6: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd010",
|
|
|
data2: "D",
|
|
|
data3: "150",
|
|
|
data4: "裤子",
|
|
|
data5: "2024-02-16",
|
|
|
data6: "3",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd012",
|
|
|
data2: "D",
|
|
|
data3: "137",
|
|
|
data4: "裤子",
|
|
|
data5: "2024-02-20",
|
|
|
data6: "4",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd017",
|
|
|
data2: "A",
|
|
|
data3: "39",
|
|
|
data4: "睡衣",
|
|
|
data5: "2024-02-24",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd015",
|
|
|
data2: "C",
|
|
|
data3: "94",
|
|
|
data4: "睡衣",
|
|
|
data5: "2024-02-23",
|
|
|
data6: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd019",
|
|
|
data2: "C",
|
|
|
data3: "186",
|
|
|
data4: "睡衣",
|
|
|
data5: "2024-02-28",
|
|
|
data6: "3",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd008",
|
|
|
data2: "B",
|
|
|
data3: "143",
|
|
|
data4: "外套",
|
|
|
data5: "2024-02-14",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd011",
|
|
|
data2: "C",
|
|
|
data3: "191",
|
|
|
data4: "外套",
|
|
|
data5: "2024-02-16",
|
|
|
data6: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd018",
|
|
|
data2: "D",
|
|
|
data3: "99",
|
|
|
data4: "外套",
|
|
|
data5: "2024-02-26",
|
|
|
data6: "3",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd005",
|
|
|
data2: "F",
|
|
|
data3: "111",
|
|
|
data4: "外套",
|
|
|
data5: "2024-02-10",
|
|
|
data6: "4",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd001",
|
|
|
data2: "A",
|
|
|
data3: "189",
|
|
|
data4: "衬衫",
|
|
|
data5: "2024-02-02",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd013",
|
|
|
data2: "B",
|
|
|
data3: "59",
|
|
|
data4: "衬衫",
|
|
|
data5: "2024-02-22",
|
|
|
data6: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd014",
|
|
|
data2: "D",
|
|
|
data3: "173",
|
|
|
data4: "衬衫",
|
|
|
data5: "2024-02-22",
|
|
|
data6: "3",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd002",
|
|
|
data2: "E",
|
|
|
data3: "101",
|
|
|
data4: "短袖",
|
|
|
data5: "2024-02-02",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd020",
|
|
|
data2: "J",
|
|
|
data3: "52",
|
|
|
data4: "短袖",
|
|
|
data5: "2024-02-28",
|
|
|
data6: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd016",
|
|
|
data2: "K",
|
|
|
data3: "82",
|
|
|
data4: "短袖",
|
|
|
data5: "2024-02-24",
|
|
|
data6: "3",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd009",
|
|
|
data2: "G",
|
|
|
data3: "171",
|
|
|
data4: "帽子",
|
|
|
data5: "2024-02-15",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd006",
|
|
|
data2: "C",
|
|
|
data3: "141",
|
|
|
data4: "皮鞋",
|
|
|
data5: "2024-02-12",
|
|
|
data6: "1",
|
|
|
},
|
|
|
{
|
|
|
data1: "dd004",
|
|
|
data2: "H",
|
|
|
data3: "176",
|
|
|
data4: "内衣",
|
|
|
data5: "2024-02-07",
|
|
|
data6: "1",
|
|
|
},
|
|
|
]);
|
|
|
const step6Data = ref([
|
|
|
{
|
|
|
data1: "1",
|
|
|
data2: "小明",
|
|
|
data3: "4",
|
|
|
data4: "2",
|
|
|
data5: "4",
|
|
|
},
|
|
|
{
|
|
|
data1: "2",
|
|
|
data2: "小红",
|
|
|
data3: "5",
|
|
|
data4: "2",
|
|
|
data5: "2",
|
|
|
},
|
|
|
{
|
|
|
data1: "3",
|
|
|
data2: "小李",
|
|
|
data3: "5",
|
|
|
data4: "1",
|
|
|
data5: "1",
|
|
|
},
|
|
|
]);
|
|
|
const rulesTable = ref([
|
|
|
{
|
|
|
data1: "1.重要价值用户",
|
|
|
data2: "高",
|
|
|
data3: "高",
|
|
|
data4: "高",
|
|
|
},
|
|
|
{
|
|
|
data1: "2.重要发展用户",
|
|
|
data2: "高",
|
|
|
data3: "低",
|
|
|
data4: "高",
|
|
|
},
|
|
|
{
|
|
|
data1: "3.重要保持用户",
|
|
|
data2: "低",
|
|
|
data3: "高",
|
|
|
data4: "高",
|
|
|
},
|
|
|
{
|
|
|
data1: "4.重要挽留用户",
|
|
|
data2: "低",
|
|
|
data3: "低",
|
|
|
data4: "高",
|
|
|
},
|
|
|
{
|
|
|
data1: "5.一般价值用户",
|
|
|
data2: "高",
|
|
|
data3: "高",
|
|
|
data4: "低",
|
|
|
},
|
|
|
{
|
|
|
data1: "6.一般发展用户",
|
|
|
data2: "高",
|
|
|
data3: "低",
|
|
|
data4: "低",
|
|
|
},
|
|
|
{
|
|
|
data1: "7.一般保持用户",
|
|
|
data2: "低",
|
|
|
data3: "高",
|
|
|
data4: "低",
|
|
|
},
|
|
|
{
|
|
|
data1: "6.一般挽留用户",
|
|
|
data2: "低",
|
|
|
data3: "低",
|
|
|
data4: "低",
|
|
|
},
|
|
|
]);
|
|
|
const step5DataTable2 = ref([
|
|
|
{
|
|
|
name: "1",
|
|
|
},
|
|
|
{
|
|
|
name: "2",
|
|
|
},
|
|
|
{
|
|
|
name: "3",
|
|
|
},
|
|
|
{
|
|
|
name: "4",
|
|
|
},
|
|
|
{
|
|
|
name: "5",
|
|
|
},
|
|
|
]);
|
|
|
const productList = ref([
|
|
|
{
|
|
|
value: "短袖",
|
|
|
label: "短袖",
|
|
|
},
|
|
|
{
|
|
|
value: "衬衫",
|
|
|
label: "衬衫",
|
|
|
},
|
|
|
{
|
|
|
value: "外套",
|
|
|
label: "外套",
|
|
|
},
|
|
|
{
|
|
|
value: "睡衣",
|
|
|
label: "睡衣",
|
|
|
},
|
|
|
{
|
|
|
value: "裤子",
|
|
|
label: "裤子",
|
|
|
},
|
|
|
{
|
|
|
value: "帽子",
|
|
|
label: "帽子",
|
|
|
},
|
|
|
{
|
|
|
value: "皮鞋",
|
|
|
label: "皮鞋",
|
|
|
},
|
|
|
{
|
|
|
value: "内衣",
|
|
|
label: "内衣",
|
|
|
},
|
|
|
]);
|
|
|
const step5DataTable3 = ref([
|
|
|
{
|
|
|
name: "短袖",
|
|
|
},
|
|
|
{
|
|
|
name: "衬衫",
|
|
|
},
|
|
|
{
|
|
|
name: "外套",
|
|
|
},
|
|
|
{
|
|
|
name: "睡衣",
|
|
|
},
|
|
|
{
|
|
|
name: "裤子",
|
|
|
},
|
|
|
]);
|
|
|
const idList = ref([
|
|
|
{
|
|
|
value: "无",
|
|
|
label: "无",
|
|
|
},
|
|
|
{
|
|
|
value: "A",
|
|
|
label: "A",
|
|
|
},
|
|
|
{
|
|
|
value: "B",
|
|
|
label: "B",
|
|
|
},
|
|
|
{
|
|
|
value: "C",
|
|
|
label: "C",
|
|
|
},
|
|
|
{
|
|
|
value: "D",
|
|
|
label: "D",
|
|
|
},
|
|
|
{
|
|
|
value: "E",
|
|
|
label: "E",
|
|
|
},
|
|
|
{
|
|
|
value: "F",
|
|
|
label: "F",
|
|
|
},
|
|
|
{
|
|
|
value: "G",
|
|
|
label: "G",
|
|
|
},
|
|
|
{
|
|
|
value: "J",
|
|
|
label: "J",
|
|
|
},
|
|
|
{
|
|
|
value: "K",
|
|
|
label: "K",
|
|
|
},
|
|
|
{
|
|
|
value: "H",
|
|
|
label: "H",
|
|
|
},
|
|
|
]);
|
|
|
const typeData = ref([
|
|
|
{
|
|
|
data1: "A类商品",
|
|
|
data2: "占总销售额的80%，需要重点关注",
|
|
|
},
|
|
|
{
|
|
|
data1: "B类商品",
|
|
|
data2: "占总销售额的10%，给予次要关注",
|
|
|
},
|
|
|
{
|
|
|
data1: "C类商品",
|
|
|
data2: "占总销售额的10%，给予一般关注",
|
|
|
},
|
|
|
]);
|
|
|
onMounted(() => {
|
|
|
getData();
|
|
|
});
|
|
|
onBeforeUnmount(() => {
|
|
|
saveData();
|
|
|
});
|
|
|
const moveUp = (index, row) => {
|
|
|
console.log("上移", index, row);
|
|
|
if (index > 0) {
|
|
|
const upDate = step2Data.value[index - 1];
|
|
|
step2Data.value.splice(index - 1, 1);
|
|
|
step2Data.value.splice(index, 0, upDate);
|
|
|
} else {
|
|
|
alert("已经是第一条，不可上移");
|
|
|
}
|
|
|
};
|
|
|
const moveDown = (index, row) => {
|
|
|
console.log("下移", index, row);
|
|
|
if (index + 1 === step2Data.value.length) {
|
|
|
alert("已经是最后一条，不可下移");
|
|
|
} else {
|
|
|
const downDate = step2Data.value[index + 1];
|
|
|
step2Data.value.splice(index + 1, 1);
|
|
|
step2Data.value.splice(index, 0, downDate);
|
|
|
}
|
|
|
};
|
|
|
const addCombination = () => {
|
|
|
if (list.value[0] == "-") {
|
|
|
list.value = [];
|
|
|
}
|
|
|
// list.value = [];
|
|
|
if (combinationValue1.value == "" || combinationValue2.vlaue == "") {
|
|
|
proxy.$modal.msgError("请选择组合");
|
|
|
return;
|
|
|
}
|
|
|
list.value.push(combinationValue1.value + "—" + combinationValue2.value);
|
|
|
};
|
|
|
const tableSpanMethod = ({ row, column, rowIndex, columnIndex }) => {
|
|
|
if (rowIndex === 0) {
|
|
|
if (columnIndex === 6) {
|
|
|
return [2, 1];
|
|
|
}
|
|
|
}
|
|
|
if (rowIndex === 0) {
|
|
|
if (columnIndex === 7) {
|
|
|
return [2, 1];
|
|
|
}
|
|
|
}
|
|
|
if (rowIndex === 2) {
|
|
|
if (columnIndex === 6) {
|
|
|
return [2, 1];
|
|
|
}
|
|
|
}
|
|
|
if (rowIndex === 2) {
|
|
|
if (columnIndex === 7) {
|
|
|
return [2, 1];
|
|
|
}
|
|
|
}
|
|
|
if (rowIndex === 4) {
|
|
|
if (columnIndex === 6) {
|
|
|
return [2, 1];
|
|
|
}
|
|
|
}
|
|
|
if (rowIndex === 4) {
|
|
|
if (columnIndex === 7) {
|
|
|
return [2, 1];
|
|
|
}
|
|
|
}
|
|
|
if (rowIndex === 6) {
|
|
|
if (columnIndex === 6) {
|
|
|
return [2, 1];
|
|
|
}
|
|
|
}
|
|
|
if (rowIndex === 6) {
|
|
|
if (columnIndex === 7) {
|
|
|
return [2, 1];
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
const handleChangeTime = (e) => {
|
|
|
console.log(e);
|
|
|
};
|
|
|
const draw = () => {
|
|
|
sevenNum.value = 0;
|
|
|
fiftyNum.value = 0;
|
|
|
thirtyNumIn.value = 0;
|
|
|
thirtyNumOut.value = 0;
|
|
|
if (
|
|
|
!step4Data.value[0].params2 ||
|
|
|
!step4Data.value[2].params2 ||
|
|
|
!step4Data.value[4].params2 ||
|
|
|
!step4Data.value[6].params2
|
|
|
) {
|
|
|
proxy.$modal.msgError("请完成所有时间间隔分组选择！");
|
|
|
return;
|
|
|
}
|
|
|
for (let item in step4Data.value) {
|
|
|
if (step4Data.value[item].params2 === "7天内") {
|
|
|
sevenNum.value++;
|
|
|
}
|
|
|
if (step4Data.value[item].params2 == "15天内") {
|
|
|
fiftyNum.value++;
|
|
|
}
|
|
|
if (step4Data.value[item].params2 === "30天内") {
|
|
|
thirtyNumIn.value++;
|
|
|
}
|
|
|
if (step4Data.value[item].params2 === "30天以上") {
|
|
|
thirtyNumOut.value++;
|
|
|
}
|
|
|
}
|
|
|
console.log("7天数量", sevenNum.value);
|
|
|
console.log("15天数量", fiftyNum.value);
|
|
|
console.log("30天内", thirtyNumIn.value);
|
|
|
console.log("30天以上", thirtyNumOut.value);
|
|
|
var chartDom = document.getElementById("echarts");
|
|
|
var myChart = echarts.init(chartDom);
|
|
|
var option;
|
|
|
|
|
|
option = {
|
|
|
title: {
|
|
|
text: "时间间隔",
|
|
|
left: "center",
|
|
|
textStyle: {
|
|
|
color: "#fff",
|
|
|
},
|
|
|
},
|
|
|
tooltip: {
|
|
|
trigger: "item",
|
|
|
},
|
|
|
legend: {
|
|
|
orient: "vertical",
|
|
|
left: "left",
|
|
|
textStyle: {
|
|
|
color: "#fff",
|
|
|
},
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
name: "时间间隔",
|
|
|
type: "pie",
|
|
|
radius: "50%",
|
|
|
data: [
|
|
|
{ value: sevenNum.value, name: "7天内" },
|
|
|
{ value: fiftyNum.value, name: "15天内" },
|
|
|
{ value: thirtyNumIn.value, name: "30天内" },
|
|
|
{ value: thirtyNumOut.value, name: "30天以上" },
|
|
|
// { value: 300, name: "Video Ads" },
|
|
|
],
|
|
|
emphasis: {
|
|
|
itemStyle: {
|
|
|
shadowBlur: 10,
|
|
|
shadowOffsetX: 0,
|
|
|
shadowColor: "rgba(0, 0, 0, 0.5)",
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
],
|
|
|
};
|
|
|
|
|
|
option && myChart.setOption(option);
|
|
|
};
|
|
|
const step1Submit = () => {
|
|
|
step1Error.value = 0;
|
|
|
for (let i in step1Data.value) {
|
|
|
// console.log(fileTable1.value[i]);
|
|
|
if (!step1Data.value[i].params) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
if (step1Data.value[0].params && step1Data.value[0].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[1].params && step1Data.value[1].params != "2") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[2].params && step1Data.value[2].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[3].params && step1Data.value[3].params != "2") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[4].params && step1Data.value[4].params != "3") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[5].params && step1Data.value[5].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[6].params && step1Data.value[6].params != "2") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[7].params && step1Data.value[7].params != "3") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[8].params && step1Data.value[8].params != "4") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[9].params && step1Data.value[9].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[10].params && step1Data.value[10].params != "2") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[11].params && step1Data.value[11].params != "2") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[12].params && step1Data.value[12].params != "3") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[13].params && step1Data.value[13].params != "4") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[14].params && step1Data.value[14].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[15].params && step1Data.value[15].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[16].params && step1Data.value[16].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[17].params && step1Data.value[17].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[18].params && step1Data.value[18].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
if (step1Data.value[19].params && step1Data.value[19].params != "1") {
|
|
|
step1Error.value++;
|
|
|
}
|
|
|
console.log(step1Error.value, "错误数");
|
|
|
proxy.$modal.msgSuccess("提交成功");
|
|
|
step1AnswerFlag.value = true;
|
|
|
step4Data.value[0].data6 = step1Data.value[0].params;
|
|
|
step4Data.value[1].data6 = step1Data.value[1].params;
|
|
|
step4Data.value[2].data6 = step1Data.value[3].params;
|
|
|
step4Data.value[3].data6 = step1Data.value[4].params;
|
|
|
step4Data.value[4].data6 = step1Data.value[7].params;
|
|
|
step4Data.value[5].data6 = step1Data.value[8].params;
|
|
|
step4Data.value[6].data6 = step1Data.value[9].params;
|
|
|
step4Data.value[7].data6 = step1Data.value[10].params;
|
|
|
};
|
|
|
const step2Submit = () => {
|
|
|
step2Error.value = 0;
|
|
|
for (let i in step2Data.value) {
|
|
|
// console.log(fileTable1.value[i]);
|
|
|
if (!step2Data.value[i].params) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
if (step2Data.value[0].params && step2Data.value[0].params != "10") {
|
|
|
step2Error.value++;
|
|
|
}
|
|
|
if (step2Data.value[1].params && step2Data.value[1].params != "4") {
|
|
|
step2Error.value++;
|
|
|
}
|
|
|
if (step2Data.value[2].params && step2Data.value[2].params != "40") {
|
|
|
step2Error.value++;
|
|
|
}
|
|
|
console.log(step2Error.value, "错误数");
|
|
|
proxy.$modal.msgSuccess("提交成功");
|
|
|
step2AnswerFlag.value = true;
|
|
|
};
|
|
|
const step4Submit = () => {
|
|
|
// console.log(9);
|
|
|
step4Error.value = 0;
|
|
|
if (!step4Data.value[0].params1 || !step4Data.value[0].params2) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
if (!step4Data.value[2].params1 || !step4Data.value[2].params2) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
if (!step4Data.value[4].params1 || !step4Data.value[4].params2) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
if (!step4Data.value[6].params1 || !step4Data.value[6].params2) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
if (step4Data.value[0].params1 && step4Data.value[0].params1 != "22") {
|
|
|
step4Error.value++;
|
|
|
}
|
|
|
if (step4Data.value[0].params2 && step4Data.value[0].params2 != "30天内") {
|
|
|
step4Error.value++;
|
|
|
}
|
|
|
if (step4Data.value[2].params1 && step4Data.value[2].params1 != "10") {
|
|
|
step4Error.value++;
|
|
|
}
|
|
|
if (step4Data.value[2].params2 && step4Data.value[2].params2 != "15天内") {
|
|
|
step4Error.value++;
|
|
|
}
|
|
|
if (step4Data.value[4].params1 && step4Data.value[4].params1 != "4") {
|
|
|
step4Error.value++;
|
|
|
}
|
|
|
if (step4Data.value[4].params2 && step4Data.value[4].params2 != "7天内") {
|
|
|
step4Error.value++;
|
|
|
}
|
|
|
if (step4Data.value[6].params1 && step4Data.value[6].params1 != "2") {
|
|
|
step4Error.value++;
|
|
|
}
|
|
|
if (step4Data.value[6].params2 && step4Data.value[6].params2 != "7天内") {
|
|
|
step4Error.value++;
|
|
|
}
|
|
|
console.log(step4Error.value, "错误数");
|
|
|
proxy.$modal.msgSuccess("提交成功");
|
|
|
step4AnswerFlag.value = true;
|
|
|
};
|
|
|
const step5Submit = () => {
|
|
|
// console.log(1313);
|
|
|
step5Error.value = 0;
|
|
|
if (!step5DataTable2.value[0].params) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
if (!step5DataTable2.value[1].params) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
for (let i in step5DataTable3.value) {
|
|
|
// console.log(fileTable1.value[i]);
|
|
|
if (
|
|
|
!step5DataTable3.value[i].params1 ||
|
|
|
!step5DataTable3.value[i].params2
|
|
|
) {
|
|
|
proxy.$modal.msgError("请先完成所有填空");
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable2.value[0].params &&
|
|
|
step5DataTable2.value[0].params != "裤子" &&
|
|
|
step5DataTable2.value[0].params != "外套"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable2.value[1].params &&
|
|
|
step5DataTable2.value[1].params != "衬衫" &&
|
|
|
step5DataTable2.value[1].params != "短袖" &&
|
|
|
step5DataTable2.value[1].params != "睡衣"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[0].params1 &&
|
|
|
step5DataTable3.value[0].params1 != "无"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[0].params2 &&
|
|
|
step5DataTable3.value[0].params2 != "0"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[1].params1 &&
|
|
|
step5DataTable3.value[1].params1 != "无"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[1].params2 &&
|
|
|
step5DataTable3.value[1].params2 != "0"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[2].params1 &&
|
|
|
step5DataTable3.value[2].params1 != "无"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[2].params2 &&
|
|
|
step5DataTable3.value[2].params2 != "0"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[3].params1 &&
|
|
|
step5DataTable3.value[3].params1 != "C"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[3].params2 &&
|
|
|
step5DataTable3.value[3].params2 != "1"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[4].params1 &&
|
|
|
step5DataTable3.value[4].params1 != "D"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
if (
|
|
|
step5DataTable3.value[4].params2 &&
|
|
|
step5DataTable3.value[4].params2 != "2"
|
|
|
) {
|
|
|
step5Error.value++;
|
|
|
}
|
|
|
console.log(step5Error.value, "错误数");
|
|
|
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({})
|
|
|
.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 ||
|
|
|
!step4AnswerFlag.value ||
|
|
|
!step5AnswerFlag.value
|
|
|
) {
|
|
|
proxy.$modal.msgError("请先完成所有步骤！");
|
|
|
return;
|
|
|
}
|
|
|
errorNum.value =
|
|
|
step1Error.value + step2Error.value + step4Error.value + step5Error.value;
|
|
|
console.log(errorNum.value, "总错误次数");
|
|
|
portraitModel
|
|
|
.submit({
|
|
|
userId: 492,
|
|
|
taskName: "复购分析",
|
|
|
numberOfErrors: errorNum.value,
|
|
|
})
|
|
|
.then((res) => {
|
|
|
proxy.$modal.msgSuccess("提交成功");
|
|
|
})
|
|
|
.catch((error) => {});
|
|
|
// console.log(666);
|
|
|
};
|
|
|
defineExpose({
|
|
|
submitData,
|
|
|
// practicalTraining,
|
|
|
});
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
.content {
|
|
|
width: 100%;
|
|
|
background: rgba(0, 29, 64, 0.5);
|
|
|
border: 1px solid #0452c6;
|
|
|
padding: 10px;
|
|
|
// opacity: 0.5;
|
|
|
a:hover {
|
|
|
text-decoration: underline;
|
|
|
}
|
|
|
.import {
|
|
|
display: flex;
|
|
|
font-size: 15px;
|
|
|
font-weight: bold;
|
|
|
width: 180px;
|
|
|
height: 56px;
|
|
|
background-image: url("@/assets/images/01.png");
|
|
|
background-size: 180px 56px;
|
|
|
text-align: center;
|
|
|
align-items: center;
|
|
|
line-height: 56px;
|
|
|
cursor: pointer;
|
|
|
img {
|
|
|
margin-left: 20px;
|
|
|
margin-right: 15px;
|
|
|
}
|
|
|
}
|
|
|
.caseBack {
|
|
|
.title {
|
|
|
font-weight: bold;
|
|
|
margin-top: 10px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
span {
|
|
|
margin-left: 10px;
|
|
|
}
|
|
|
}
|
|
|
.download {
|
|
|
cursor: pointer;
|
|
|
margin-left: 20px;
|
|
|
color: #000;
|
|
|
padding-left: 10px;
|
|
|
font-size: 14px;
|
|
|
text-align: center;
|
|
|
line-height: 31px;
|
|
|
width: 89px;
|
|
|
height: 31px;
|
|
|
background: url("@/assets/images/downloadIcon.png");
|
|
|
}
|
|
|
.submit {
|
|
|
cursor: pointer;
|
|
|
margin-left: 20px;
|
|
|
color: #000;
|
|
|
padding-left: 10px;
|
|
|
font-size: 14px;
|
|
|
text-align: center;
|
|
|
line-height: 31px;
|
|
|
width: 99px;
|
|
|
height: 31px;
|
|
|
background: url("@/assets/images/提交任务.png");
|
|
|
}
|
|
|
.customerType {
|
|
|
padding-left: 10px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
width: 945px;
|
|
|
height: 26px;
|
|
|
background: #003b75;
|
|
|
border-radius: 10px;
|
|
|
border: 1px solid #0052a3;
|
|
|
font-size: 12px;
|
|
|
margin-top: 10px;
|
|
|
img {
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
}
|
|
|
.secondTitle {
|
|
|
margin-top: 10px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
img {
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.line {
|
|
|
width: 1400px;
|
|
|
height: 1px;
|
|
|
border: 1px solid #0452c6;
|
|
|
opacity: 0.5;
|
|
|
margin-top: 20px;
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
.addBtn {
|
|
|
background-color: #6af5fb;
|
|
|
color: #080138;
|
|
|
height: 31px;
|
|
|
border: 1px solid #6af5fb;
|
|
|
margin-left: 10px;
|
|
|
}
|
|
|
.comList {
|
|
|
ul {
|
|
|
text-align: center;
|
|
|
list-style-type: none;
|
|
|
border: 1px solid #7190d4;
|
|
|
border-bottom: none;
|
|
|
width: 124px;
|
|
|
padding: 0;
|
|
|
// padding: 0;
|
|
|
margin: 0;
|
|
|
p {
|
|
|
width: 122px;
|
|
|
height: 40px;
|
|
|
line-height: 40px;
|
|
|
background: #6e70f0;
|
|
|
margin: 0;
|
|
|
}
|
|
|
li {
|
|
|
padding: 0;
|
|
|
margin: 0;
|
|
|
line-height: 30px;
|
|
|
width: 122px;
|
|
|
height: 30px;
|
|
|
background: #003b75;
|
|
|
border-bottom: 1px solid #7190d4;
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.draw {
|
|
|
width: 89px;
|
|
|
height: 31px;
|
|
|
background: url("@/assets/images/绘制.png");
|
|
|
text-align: center;
|
|
|
line-height: 31px;
|
|
|
color: #000;
|
|
|
font-size: 14px;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
.generateBtn {
|
|
|
width: 185px;
|
|
|
height: 31px;
|
|
|
background: url("@/assets/images/生成统计.png");
|
|
|
text-align: center;
|
|
|
line-height: 31px;
|
|
|
color: #000;
|
|
|
font-size: 14px;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
}
|
|
|
::v-deep .el-table tr {
|
|
|
background-color: #002652 !important;
|
|
|
color: #fff;
|
|
|
}
|
|
|
</style>
|