[Human] chore(project): 初始化导入 91dj H5 客户端项目代码

从本地工程首次入库；.npmrc（含私有 npm 源 token）与 tsbuildinfo 已加入 .gitignore，不随仓库提交。
2026-10-08 14:22:35 +07:00
commit eada71e211
1421 changed files with 144498 additions and 0 deletions
@@ -0,0 +1,89 @@
+<template>
+  <div class="fiveGridAdv">
+    <div class="fiveGrid" @touchstart.stop @touchmove.stop @touchend.stop v-if="state.advList.length > 0" ref="advRef">
+      <div class="rectAdvBox" @click="handleJumpAdv(item)" v-for="item in state.advList" :key="item.id">
+        <lazyImg class="rectAdvIcon" :src="item.cover" />
+        <div class="rectName">{{ item.title }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import { nextTick, reactive, ref, watch } from 'vue';
+import { jumpAdv } from '@/utils/index';
+import { getAdItem } from '@/utils/getConfig';
+import { AdImpressionType, setAdImpression } from '@/utils/eventReporter/adImpression';
+import { useRoute } from 'vue-router';
+import { reportAdClickEvent } from '@/utils/eventReporter/adClick';
+
+const route = useRoute();
+const props = withDefaults(
+  defineProps<{
+    advType: number;
+    adImpression?: AdImpressionType;
+  }>(),
+  {
+    advType: 2,
+  },
+);
+const state = reactive({
+  advList: <any>(getAdItem(props.advType) || []), // 广告数据
+});
+// 广告展示埋点
+const advRef = ref();
+watch(
+  () => state.advList,
+  () => {
+    if (state.advList.length) {
+      nextTick(() => {
+        setAdImpression(advRef.value, state.advList, {
+          page_key: props.adImpression?.page_key || (route.meta.pageKey as string) || '',
+          page_name: props.adImpression?.page_name || (route.meta.pageName as string) || '',
+          ad_type: props.adImpression?.ad_type || 'small_grid',
+        }).setupObserver();
+      });
+    }
+  },
+  { immediate: true },
+);
+const handleJumpAdv = (item: Types.App.AdsInfoListItem) => {
+  let params = {
+    ...item,
+    page_key: props.adImpression?.page_key || (route.meta.pageKey as string) || '',
+    page_name: props.adImpression?.page_name || (route.meta.pageName as string) || '',
+    ad_type: props.adImpression?.ad_type || 'small_grid',
+  };
+  reportAdClickEvent(params);
+  jumpAdv(item);
+};
+</script>
+<style scoped lang="scss">
+.fiveGridAdv {
+  .fiveGrid {
+    display: flex;
+    overflow-x: auto;
+    margin: 0 0 18px;
+    padding-left: 10px;
+    .rectAdvBox {
+      width: 60px;
+      margin-right: 6px;
+      .rectAdvIcon {
+        height: 60px;
+        width: 60px;
+        border-radius: 12px;
+        overflow: hidden;
+      }
+      .rectName {
+        font-size: 12px;
+        margin-top: 4px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-align: center;
+      }
+    }
+    .rectAdvBox:last-child {
+      margin-right: 9px;
+    }
+  }
+}
+</style>