|
|
|
|
|
<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/400319684"
|
|
|
|
|
|
target="_blank"
|
|
|
|
|
|
rel="noopener noreferrer"
|
|
|
|
|
|
>https://zhuanlan.zhihu.com/p/400319684</a
|
|
|
|
|
|
>
|
|
|
|
|
|
<br />
|
|
|
|
|
|
</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">
|
|
|
|
|
|
以下是某APP注册用户14天的登录数据，请展开留存分析。
|
|
|
|
|
|
</span>
|
|
|
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
:data="fileTable1"
|
|
|
|
|
|
style="width: 1450px"
|
|
|
|
|
|
border
|
|
|
|
|
|
:header-cell-style="{
|
|
|
|
|
|
color: '#fff',
|
|
|
|
|
|
fontSize: '14px',
|
|
|
|
|
|
backgroundColor: '#6A7DE9!important',
|
|
|
|
|
|
}"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-table-column label="日期" align="center" prop="date">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="新增用户数" align="center" prop="addNum">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="次日" align="center" prop="day2">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="3日" align="center" prop="day3">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="4日" align="center" prop="day4">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="5日" align="center" prop="day5">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="6日" align="center" prop="day6">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="7日" align="center" prop="day7">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="8日" align="center" prop="day8">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="9日" align="center" prop="day9">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="10日" align="center" prop="day10">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="11日" align="center" prop="day11">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="12日" align="center" prop="day12">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="13日" align="center" prop="day13">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="14日" align="center" prop="day14">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
<div class="download">下载数据</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<span style="line-height: 25px; font-size: 14px">
|
|
|
|
|
|
表格列指标释义：<br />
|
|
|
|
|
|
新增用户数，表示当日注册的用户数<br />
|
|
|
|
|
|
次日：当日注册的这批用户在次日有XX人访问<br />
|
|
|
|
|
|
3日：当日注册的这批用户在注册后的第3日有XX人访问<br />
|
|
|
|
|
|
7日：当日注册的这批用户在注册后的第7日有XX人访问
|
|
|
|
|
|
</span>
|
|
|
|
|
|
</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">
|
|
|
|
|
|
留存率是指：某日用户数在第N日仍启动该App的用户比例，留存分析即分析用户随时间变化的活跃情况。获取用户只是第一步，留住用户才是所有产品最终目标。<br />
|
|
|
|
|
|
请按照留存率的计算公式，补全空缺的数据，计算结果保留小数点后0位。
|
|
|
|
|
|
</span>
|
|
|
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
:data="step1Data"
|
|
|
|
|
|
style="width: 1450px"
|
|
|
|
|
|
border
|
|
|
|
|
|
:header-cell-style="{
|
|
|
|
|
|
color: '#fff',
|
|
|
|
|
|
fontSize: '14px',
|
|
|
|
|
|
backgroundColor: '#6A7DE9!important',
|
|
|
|
|
|
}"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-table-column label="日期" align="center" prop="date">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="新增用户数" align="center" prop="addNum">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="次日" align="center" prop="day2">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 12"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="3日" align="center" prop="day3">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 11"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="4日" align="center" prop="day4">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 10"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="5日" align="center" prop="day5">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 9"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="6日" align="center" prop="day6">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 8"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="7日" align="center" prop="day7">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 7"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="8日" align="center" prop="day8">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 6"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="9日" align="center" prop="day9">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 5"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="10日" align="center" prop="day10">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 4"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="11日" align="center" prop="day11">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 3"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="12日" align="center" prop="day12">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 2"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="13日" align="center" prop="day13">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 1"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="14日" align="center" prop="day14">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
v-if="scope.$index == 0"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
<div class="submit">提交</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">
|
|
|
|
|
|
从时间维度划分，常见的的有：次日留存、3日留存、7日留存、14日留存、30日留存、60日留存。<br />
|
|
|
|
|
|
从用户维度划分，常见的的有：新用户留存、活跃留存。<br />
|
|
|
|
|
|
请按照第一步计算的表格数据，计算次日留存、3日留存、7日留存、14日留存的平均数，计算结果保留小数点后0位。
|
|
|
|
|
|
</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">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params1"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="3日" align="center" prop="description">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params2"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="7日" align="center" prop="description">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params3"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="14日" align="center" prop="amount">
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="scope.row.params4"
|
|
|
|
|
|
placeholder="请输入"
|
|
|
|
|
|
style="width: 70px"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-input>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
<div class="submit">提交</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">
|
|
|
|
|
|
以2021/8/1注册的新增的用户数据为例，绘制之后14日的留存率折线图：
|
|
|
|
|
|
</span>
|
|
|
|
|
|
<div class="draw" @click="draw">绘制</div>
|
|
|
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
|
|
|
<div id="echarts" style="width: 400px; height: 300px"></div>
|
|
|
|
|
|
<div style="margin-left: 50px">
|
|
|
|
|
|
<p>通过图表分析，新增用户在哪天之后趋向于平稳</p>
|
|
|
|
|
|
<el-select
|
|
|
|
|
|
v-model="dayValue"
|
|
|
|
|
|
placeholder="请选择"
|
|
|
|
|
|
style="width: 120px"
|
|
|
|
|
|
size="default"
|
|
|
|
|
|
@change="handleChangeDay"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
v-for="item in dayOptions"
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
<div class="analysis">
|
|
|
|
|
|
<div class="conclusion">分析结论：</div>
|
|
|
|
|
|
<span>
|
|
|
|
|
|
1、7日留存率，只有27%，流失率达到了73%，相对比较低，需要提供用户粘性；<br />
|
|
|
|
|
|
2、平缓之后，能够留存下来的客户，是公司的忠诚用户；<br />
|
|
|
|
|
|
3、14日的留存率，每天一直下降，需要找出原因。
|
|
|
|
|
|
</span>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</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 />
|
|
|
|
|
|
日留存率: <br />
|
|
|
|
|
|
快速判断产品是否迎合市场需求，比如新手对产品的UI设计、功能设置、新手引导等的体验是否满意，是否需做调整。<br />
|
|
|
|
|
|
快速判断用户粘性，比如用户是否更易受促销活动的影响等等。<br />
|
|
|
|
|
|
周留存率: <br />
|
|
|
|
|
|
判断用户忠诚度，用户此时对产品基本已有完整的体验。一整套流程体验下来，继续访问的用户可判断为潜在忠诚用户。<br />
|
|
|
|
|
|
分析用户再次访问的原因，找出产品最能巩固用户的点，且参考此点以一贯之，拓展应用到更多的用户身上，促使更多的用户留下来。<br />
|
|
|
|
|
|
月留存率：<br />
|
|
|
|
|
|
评估迭代与优化的效果。砍掉留存率低的产品功能，进行迭代优化。<br />
|
|
|
|
|
|
平均留存率的分析，需要结合公司不同时期，与行业平均水平进行对比，找出差距，分析相关原因，从而制定营销策略。
|
|
|
|
|
|
</span>
|
|
|
|
|
|
<div style="margin-top: 10px; display: flex">
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
:data="step4Data"
|
|
|
|
|
|
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="data1">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="3日" align="center" prop="data2">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="7日" align="center" prop="data3">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column label="14日" align="center" prop="data4">
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
</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="font-size: 14px; margin-top: 10px">
|
|
|
|
|
|
1. 了解一个渠道的质量<br />
|
|
|
|
|
|
可以使用「日留存」来衡量各渠道用户的表现，并以此作为衡量渠道质量的标准之一。如对不同渠道来源的用户进行次日留存、7日留存的对比（不同行业可能选择不同周期），
|
|
|
|
|
|
以此衡量不同渠道的用户留存情况。一般来说，留存情况较好可以反应这个渠道质量较好。
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style="font-size: 14px; margin-top: 10px">
|
|
|
|
|
|
2. 判断运营手段/某项功能改动是否奏效<br />
|
|
|
|
|
|
当我们期待某个运营手段/某项功能可以期提升留存时，可以对通过分析该运营手段/功能，「覆盖到的新用户」和「未覆盖到的新用户」的留存率，对两部分用户的留存进行对比，来验证手段/功能的有效性。
|
|
|
|
|
|
以贴吧为例，该贴吧想检验“看贴”功能是否对新用户的留存是有提升效果，于是对同样来自A渠道的新用户（一部分使用了看贴功能，一部分没有使用看贴功能）进行留存对比。通过比较发现，使用过看贴功能的新用户，
|
|
|
|
|
|
三日留存率比未使用过该功能的新用户，多了10%以上。这说明“看贴”功能对新用户留存有着正向促进作用。
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style="font-size: 14px; margin-top: 10px">
|
|
|
|
|
|
3. 衡量一个产品是否健康<br />
|
|
|
|
|
|
可以使用「周留存」、「月留存」等指标观察用户在平台上的粘性，衡量产品的健康情况。
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="line"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script setup>
|
|
|
|
|
|
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 dayValue = ref("");
|
|
|
|
|
|
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([
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/1",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "88%",
|
|
|
|
|
|
day3: "73%",
|
|
|
|
|
|
day4: "60%",
|
|
|
|
|
|
day5: "54%",
|
|
|
|
|
|
day6: "38%",
|
|
|
|
|
|
day7: "33%",
|
|
|
|
|
|
day8: "25%",
|
|
|
|
|
|
day9: "18%",
|
|
|
|
|
|
day10: "12%",
|
|
|
|
|
|
day11: "10%",
|
|
|
|
|
|
day12: "9%",
|
|
|
|
|
|
day13: "6%",
|
|
|
|
|
|
day14: "68",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/2",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "85%",
|
|
|
|
|
|
day3: "69%",
|
|
|
|
|
|
day4: "56%",
|
|
|
|
|
|
day5: "36%",
|
|
|
|
|
|
day6: "32%",
|
|
|
|
|
|
day7: "20%",
|
|
|
|
|
|
day8: "18%",
|
|
|
|
|
|
day9: "13%",
|
|
|
|
|
|
day10: "10%",
|
|
|
|
|
|
day11: "8%",
|
|
|
|
|
|
day12: "7%",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/3",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "84%",
|
|
|
|
|
|
day3: "74%",
|
|
|
|
|
|
day4: "65%",
|
|
|
|
|
|
day5: "54%",
|
|
|
|
|
|
day6: "45%",
|
|
|
|
|
|
day7: "31%",
|
|
|
|
|
|
day8: "23%",
|
|
|
|
|
|
day9: "15%",
|
|
|
|
|
|
day10: "12%",
|
|
|
|
|
|
day11: "10%",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/4",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "83%",
|
|
|
|
|
|
day3: "68%",
|
|
|
|
|
|
day4: "56%",
|
|
|
|
|
|
day5: "50%",
|
|
|
|
|
|
day6: "38%",
|
|
|
|
|
|
day7: "23%",
|
|
|
|
|
|
day8: "18%",
|
|
|
|
|
|
day9: "12%",
|
|
|
|
|
|
day10: "10%",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/5",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "85%",
|
|
|
|
|
|
day3: "74%",
|
|
|
|
|
|
day4: "64%",
|
|
|
|
|
|
day5: "51%",
|
|
|
|
|
|
day6: "41%",
|
|
|
|
|
|
day7: "32%",
|
|
|
|
|
|
day8: "24%",
|
|
|
|
|
|
day9: "22%",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/6",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "87%",
|
|
|
|
|
|
day3: "76%",
|
|
|
|
|
|
day4: "67%",
|
|
|
|
|
|
day5: "48%",
|
|
|
|
|
|
day6: "35%",
|
|
|
|
|
|
day7: "31%",
|
|
|
|
|
|
day8: "20%",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/7",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "88%",
|
|
|
|
|
|
day3: "79%",
|
|
|
|
|
|
day4: "70%",
|
|
|
|
|
|
day5: "49%",
|
|
|
|
|
|
day6: "39%",
|
|
|
|
|
|
day7: "26%",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/8",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "89%",
|
|
|
|
|
|
day3: "72%",
|
|
|
|
|
|
day4: "58%",
|
|
|
|
|
|
day5: "36%",
|
|
|
|
|
|
day6: "28%",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/9",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "82%",
|
|
|
|
|
|
day3: "72%",
|
|
|
|
|
|
day4: "64%",
|
|
|
|
|
|
day5: "55%",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/10",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "83%",
|
|
|
|
|
|
day3: "73%",
|
|
|
|
|
|
day4: "65%",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/11",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "89%",
|
|
|
|
|
|
day3: "74%",
|
|
|
|
|
|
day4: "",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/12",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "84%",
|
|
|
|
|
|
day3: "",
|
|
|
|
|
|
day4: "",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/13",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "",
|
|
|
|
|
|
day3: "",
|
|
|
|
|
|
day4: "",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/14",
|
|
|
|
|
|
addNum: "100%",
|
|
|
|
|
|
day2: "",
|
|
|
|
|
|
day3: "",
|
|
|
|
|
|
day4: "",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
]);
|
|
|
|
|
|
const fileTable1 = ref([
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/1",
|
|
|
|
|
|
addNum: "1668",
|
|
|
|
|
|
day2: "1472",
|
|
|
|
|
|
day3: "1214",
|
|
|
|
|
|
day4: "1002",
|
|
|
|
|
|
day5: "901",
|
|
|
|
|
|
day6: "631",
|
|
|
|
|
|
day7: "556",
|
|
|
|
|
|
day8: "417",
|
|
|
|
|
|
day9: "295",
|
|
|
|
|
|
day10: "205",
|
|
|
|
|
|
day11: "172",
|
|
|
|
|
|
day12: "145",
|
|
|
|
|
|
day13: "108",
|
|
|
|
|
|
day14: "68",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/2",
|
|
|
|
|
|
addNum: "1692",
|
|
|
|
|
|
day2: "1435",
|
|
|
|
|
|
day3: "1165",
|
|
|
|
|
|
day4: "946",
|
|
|
|
|
|
day5: "607",
|
|
|
|
|
|
day6: "534",
|
|
|
|
|
|
day7: "346",
|
|
|
|
|
|
day8: "300",
|
|
|
|
|
|
day9: "214",
|
|
|
|
|
|
day10: "165",
|
|
|
|
|
|
day11: "143",
|
|
|
|
|
|
day12: "126",
|
|
|
|
|
|
day13: "91",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/3",
|
|
|
|
|
|
addNum: "1669",
|
|
|
|
|
|
day2: "1402",
|
|
|
|
|
|
day3: "1232",
|
|
|
|
|
|
day4: "1083",
|
|
|
|
|
|
day5: "897",
|
|
|
|
|
|
day6: "756",
|
|
|
|
|
|
day7: "518",
|
|
|
|
|
|
day8: "382",
|
|
|
|
|
|
day9: "258",
|
|
|
|
|
|
day10: "199",
|
|
|
|
|
|
day11: "121",
|
|
|
|
|
|
day12: "106",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/4",
|
|
|
|
|
|
addNum: "1301",
|
|
|
|
|
|
day2: "1077",
|
|
|
|
|
|
day3: "883",
|
|
|
|
|
|
day4: "724",
|
|
|
|
|
|
day5: "651",
|
|
|
|
|
|
day6: "494",
|
|
|
|
|
|
day7: "299",
|
|
|
|
|
|
day8: "230",
|
|
|
|
|
|
day9: "155",
|
|
|
|
|
|
day10: "133",
|
|
|
|
|
|
day11: "91",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/5",
|
|
|
|
|
|
addNum: "2049",
|
|
|
|
|
|
day2: "1748",
|
|
|
|
|
|
day3: "1515",
|
|
|
|
|
|
day4: "1314",
|
|
|
|
|
|
day5: "1046",
|
|
|
|
|
|
day6: "831",
|
|
|
|
|
|
day7: "658",
|
|
|
|
|
|
day8: "498",
|
|
|
|
|
|
day9: "442",
|
|
|
|
|
|
day10: "189",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/6",
|
|
|
|
|
|
addNum: "2670",
|
|
|
|
|
|
day2: "2312",
|
|
|
|
|
|
day3: "2039",
|
|
|
|
|
|
day4: "1799",
|
|
|
|
|
|
day5: "1290",
|
|
|
|
|
|
day6: "922",
|
|
|
|
|
|
day7: "828",
|
|
|
|
|
|
day8: "543",
|
|
|
|
|
|
day9: "373",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/7",
|
|
|
|
|
|
addNum: "1999",
|
|
|
|
|
|
day2: "1765",
|
|
|
|
|
|
day3: "1573",
|
|
|
|
|
|
day4: "1401",
|
|
|
|
|
|
day5: "988",
|
|
|
|
|
|
day6: "783",
|
|
|
|
|
|
day7: "514",
|
|
|
|
|
|
day8: "356",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/8",
|
|
|
|
|
|
addNum: "2099",
|
|
|
|
|
|
day2: "1874",
|
|
|
|
|
|
day3: "1515",
|
|
|
|
|
|
day4: "1224",
|
|
|
|
|
|
day5: "765",
|
|
|
|
|
|
day6: "578",
|
|
|
|
|
|
day7: "402",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/9",
|
|
|
|
|
|
addNum: "2509",
|
|
|
|
|
|
day2: "2050",
|
|
|
|
|
|
day3: "1808",
|
|
|
|
|
|
day4: "1595",
|
|
|
|
|
|
day5: "1370",
|
|
|
|
|
|
day6: "752",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/10",
|
|
|
|
|
|
addNum: "1011",
|
|
|
|
|
|
day2: "839",
|
|
|
|
|
|
day3: "740",
|
|
|
|
|
|
day4: "653",
|
|
|
|
|
|
day5: "410",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/11",
|
|
|
|
|
|
addNum: "2128",
|
|
|
|
|
|
day2: "1894",
|
|
|
|
|
|
day3: "1566",
|
|
|
|
|
|
day4: "1214",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/12",
|
|
|
|
|
|
addNum: "1366",
|
|
|
|
|
|
day2: "1145",
|
|
|
|
|
|
day3: "983",
|
|
|
|
|
|
day4: "",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/13",
|
|
|
|
|
|
addNum: "2971",
|
|
|
|
|
|
day2: "2335",
|
|
|
|
|
|
day3: "",
|
|
|
|
|
|
day4: "",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
date: "2021/8/14",
|
|
|
|
|
|
addNum: "2568",
|
|
|
|
|
|
day2: "",
|
|
|
|
|
|
day3: "",
|
|
|
|
|
|
day4: "",
|
|
|
|
|
|
day5: "",
|
|
|
|
|
|
day6: "",
|
|
|
|
|
|
day7: "",
|
|
|
|
|
|
day8: "",
|
|
|
|
|
|
day9: "",
|
|
|
|
|
|
day10: "",
|
|
|
|
|
|
day11: "",
|
|
|
|
|
|
day12: "",
|
|
|
|
|
|
day13: "",
|
|
|
|
|
|
day14: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
]);
|
|
|
|
|
|
const step2Data = ref([
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "平均数",
|
|
|
|
|
|
},
|
|
|
|
|
|
]);
|
|
|
|
|
|
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([
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "平均数",
|
|
|
|
|
|
data1: "666",
|
|
|
|
|
|
data2: "A",
|
|
|
|
|
|
data3: "189",
|
|
|
|
|
|
data4: "衬衫",
|
|
|
|
|
|
},
|
|
|
|
|
|
]);
|
|
|
|
|
|
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 typeData = ref([
|
|
|
|
|
|
{
|
|
|
|
|
|
data1: "A类商品",
|
|
|
|
|
|
data2: "占总销售额的80%，需要重点关注",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
data1: "B类商品",
|
|
|
|
|
|
data2: "占总销售额的10%，给予次要关注",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
data1: "C类商品",
|
|
|
|
|
|
data2: "占总销售额的10%，给予一般关注",
|
|
|
|
|
|
},
|
|
|
|
|
|
]);
|
|
|
|
|
|
const dayOptions = ref([
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "1日",
|
|
|
|
|
|
label: "1日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "2日",
|
|
|
|
|
|
label: "2日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "3日",
|
|
|
|
|
|
label: "3日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "4日",
|
|
|
|
|
|
label: "4日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "5日",
|
|
|
|
|
|
label: "5日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "6日",
|
|
|
|
|
|
label: "6日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "7日",
|
|
|
|
|
|
label: "7日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "8日",
|
|
|
|
|
|
label: "8日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "9日",
|
|
|
|
|
|
label: "9日",
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "10日",
|
|
|
|
|
|
label: "10日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "11日",
|
|
|
|
|
|
label: "11日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "12日",
|
|
|
|
|
|
label: "12日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "13日",
|
|
|
|
|
|
label: "13日",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "14日",
|
|
|
|
|
|
label: "14日",
|
|
|
|
|
|
},
|
|
|
|
|
|
]);
|
|
|
|
|
|
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 handleChangeDay = (e) => {
|
|
|
|
|
|
console.log(e);
|
|
|
|
|
|
};
|
|
|
|
|
|
const draw = () => {
|
|
|
|
|
|
var chartDom = document.getElementById("echarts");
|
|
|
|
|
|
var myChart = echarts.init(chartDom, "dark");
|
|
|
|
|
|
var option;
|
|
|
|
|
|
|
|
|
|
|
|
option = {
|
|
|
|
|
|
title: {
|
|
|
|
|
|
text: "2021/8/1",
|
|
|
|
|
|
left: "center",
|
|
|
|
|
|
top: "10",
|
|
|
|
|
|
},
|
|
|
|
|
|
tooltip: {
|
|
|
|
|
|
trigger: "axis",
|
|
|
|
|
|
formatter: "{c}%",
|
|
|
|
|
|
},
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
|
type: "category",
|
|
|
|
|
|
data: [
|
|
|
|
|
|
"1",
|
|
|
|
|
|
"2",
|
|
|
|
|
|
"3",
|
|
|
|
|
|
"4",
|
|
|
|
|
|
"5",
|
|
|
|
|
|
"6",
|
|
|
|
|
|
"7",
|
|
|
|
|
|
"8",
|
|
|
|
|
|
"9",
|
|
|
|
|
|
"10",
|
|
|
|
|
|
"11",
|
|
|
|
|
|
"12",
|
|
|
|
|
|
"13",
|
|
|
|
|
|
"14",
|
|
|
|
|
|
],
|
|
|
|
|
|
},
|
|
|
|
|
|
yAxis: {
|
|
|
|
|
|
type: "value",
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
formatter: "{value}%",
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
series: [
|
|
|
|
|
|
{
|
|
|
|
|
|
data: [100, 88, 73, 60, 54, 38, 33, 25, 18, 12, 10, 9, 6, 4],
|
|
|
|
|
|
type: "line",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
option && myChart.setOption(option);
|
|
|
|
|
|
};
|
|
|
|
|
|
</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;
|
|
|
|
|
|
}
|
|
|
|
|
|
.analysis {
|
|
|
|
|
|
width: 577px;
|
|
|
|
|
|
height: 117px;
|
|
|
|
|
|
background: #005b55;
|
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
|
padding-left: 20px;
|
|
|
|
|
|
padding-top: 12px;
|
|
|
|
|
|
.conclusion {
|
|
|
|
|
|
// display: block;
|
|
|
|
|
|
|
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.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>
|
