https://ec.ko-cho.com/assets/js/system/pages/_common_section/recco…/top_ranking_products.js?3572074886

1// (c) 2023 W2 Co.,Ltd.
2
3/**
4 * 商品ランキング
5 */
6class SectionCommonDirTopRankingProducts {
7  constructor() {
8  }
9  /**
10   * セクション実行
11   * @param {any} liquidParam liquidからのパラメーター
12   */
13  run(liquidParam) {
14    this.addComponent(liquidParam);
15  }
16  /**
17   * コンポーネント追加
18   */
19  addComponent(liquidParam) {
20    const component = {
21      // text/x-template要素のid
22      template: '#top-ranking-products',
23      data() {
24        return lib.vue.product.ProductRankingModel.create(this.productRankingId);
25      },
26      methods: {
27        /**
28         * 描画
29         * @param {...any} args 引数
30         */
31        draw(...args) {
32          lib.vue.product.ProductRankingService.get(liquidParam, this, args)
33            .then((result) => {
34              // 描画後の任意の処理を記述
35            });
36        },
37        /**
38         * 有効なキャンペーンアイコンリストを取得
39         * @param {...any} args 引数
40         * @returns {Array} 有効なキャンペーンアイコンリスト
41         */
42        getEnabledCampaignIconList(...args) {
43          const productItem = args[0];
44          return productItem.campaignIconList.filter(c => c.isEnabled);
45        },
46        /**
47         * GA4 用商品リスト JSON の取得
48         * @param {...any} args 引数
49         * @returns {string} JSON 文字列
50         */
51        getGoogleAnalyticsItemListJson(...args) {
52          return lib.vue.product.ProductListService.getGoogleAnalyticsItemListJson(args);
53        },
54      },
55      // コンポーネントの引数
56      props: {
57        productRankingId: {
58          type: String,
59        },
60        displayCount: {
61          type: Number,
62        }
63      },
64      watch: {
65      },
66      computed: {
67      },
68      created() {
69      },
70      mounted() {
71        this.draw();
72      },
73    };
74    g_vueManager.setComponent('top-ranking-products', component);
75  }
76}