dianshang-qianduan/src/views/product/index.vue

<template>
  <div class="rgzn_top app-container2" v-loading="loading" element-loading-text="Loading..." :element-loading-spinner="svg" element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(122, 122, 122, 0.8)">
    <div class="top_item">
      <div>
        <el-button :class="{ active: isActive === 2 }" @click="activeIndex(1)">线性预测法-销售预测</el-button>
      </div>
      <div>
        <el-button id="brtn" type="primary" @click="dialogVisible = true">任务背景与目标</el-button>
      </div>
    </div>
    <div>
      <component v-if="component" :is="component"></component>
    </div>
    <div class="handren">
      <div class="left">
        <el-button-group>蛋糕指数分析</el-button-group>
      </div>
      <div class="right">
        <el-button @click="dialogVisible = true" type="primary">任务背景</el-button>
        <popModel :showModel="dialogVisible" title="任务背景:" @closePop="dialogVisible = false">
          <template v-slot:content>
            <p style="font-size: 1rem">
              在电商产品开发中，数据化选品是一种通过数据分析来选择具有市场潜力和竞争力产品的科学方法。
              <br />

              以下是数据化选品的一些关键步骤和策略：
              <br />

              一、市场需求分析
              <br />

              1. 销量分析：通过分析类目TOP100产品的历史销量曲线，预估每月市场规模，了解市场需求的波动情况。
              <br />

              2. 销售排名分析：分析类目节点TOP100的大类目排名，评估垂直品类在大类目的市场占比，预估四级类目的消费需求量和热销程度。
              <br />

              3. 市场容量分析：利用平台后台工具（如亚马逊品牌分析）和关键词流量工具，分析关键词搜索热度和搜索结果数量，估算品类的供需比，判断市场容量。
              <br />

              4. 品牌集中度分析：对类目TOP100 ASIN进行品牌分析，结合类目排名数据，估算每个品牌的市场占比，判断是否存在品牌垄断现象。
              <br />

              5. Review分析：分析TOP 100 ASIN的Review数量和评分，以及Review的增长趋势和留评率，判断产品对Review的依赖程度，预估新品进入的成本和难度。
              <br />

              6. 卖家数量及库存分析：通过分析卖家数量和库存情况，评估市场竞争的激烈程度和产品的供应稳定性。
              <br />

              二、数据化选品工具
              <br />

              1. 阿里指数：通过阿里指数了解行业大盘走势，确定上架、推广和清仓周期。分析产品属性细分数据，选择热门属性进行产品开发。
              <br />

              2. 生意参谋：采集行业不同子类目最近3年的数据，包括市场容量、市场趋势、竞争度等多维度数据。
              <br />

              3. 爬虫工具：抓取亚马逊等平台的listing排名数据，分析排名变化，评估产品的爆款潜力。
              <br />

              4. FineBI：利用FineBI等数据分析工具，快速构建数据分析模型，进行数据挖掘和分析，优化选品决策。
              <br />
              <br />

              任务目标：
              <br />
              <br />

              使用线性预测法预测销量和销售额，分析历史销量曲线，了解市场需求的波动情况。
              <br />
              <br />

              ①数据源：销量及销售额数据。
              <br />
            </p>
          </template>
        </popModel>
      </div>
    </div>
  </div>
</template>
    <script setup>
import * as portraitModel from "@/api/portraitModel";
import useAlgorithmStore from "@/store/modules/algorithm.js";
import { getUserInfo } from "@/utils/auth";
import popModel from "@/views/components/popModal.vue";
const algorithmStore = useAlgorithmStore();
const userInfo = JSON.parse(getUserInfo());
const route = useRoute();
const pageData = [defineAsyncComponent(() => import("../digitalMarketingAlgorithms/components/regressionAnalysis.vue"))];
const component = ref(pageData[0]);
const isActive = ref(1);
const loading = ref(false);
const dialogVisible = ref(false);
const activeIndex = (index) => {
  isActive.value = index;
  component.value = pageData[index - 1];
};
//选择自建表
const selectZJ = (item) => {
  portraitModel.getUserTableInfo({ userId: userInfo.userId }).then((res) => {
    algorithmStore.userDataLabel = [...res?.data.tableNames, ...res.data.selfBuiltTable].filter((item) => item !== "用户评论表");
  });
};
selectZJ();
</script>
    
    <style lang="scss" scoped>
.content {
  color: #fff;
}
.rgzn_top {
  margin-top: 20px;
  height: calc(100vh - 100px);
  .top_item {
    display: flex;
    justify-content: space-between;
    align-items: center;

    img {
      margin-right: 5px;
    }
    .el-button {
      padding-left: 60px !important;
    }
    .el-button:nth-child(1) {
      width: 236px;
      height: 50px;
      background: url("../../assets/images/11.png") no-repeat !important;
      background-size: 100% 100% !important;
      color: #ffffff;
      border-color: #ffffff00;
      padding: 8px 5px 8px 47px;
    }
    #brtn {
      width: 150px;
      height: 50px;
      background: #409eff !important;
      border-color: #ffffff00;
      padding: 8px 5px 8px 5px !important;
    }
    .active {
      transform: scale(1.1);
      transition: all 0.3s;
    }
  }
}
</style>