tt-help-cli-ycl 1.4.144 → 1.4.145

package/src/watch/data-store.js

@@ -608,6 +608,92 @@ function getTargetUsersByCountryFromDb(targetLocations = [], options = {}) {
   };
 }
 
+/**
+ * 精确商家：目标商家（tt_seller=1 且 verified=0 且 目标国家）中，
+ * 最近 7 天有 isECVideo 播放 > 1000 的视频，且有商品、商品评论数=0、销量 > 10。
+ * 支持分页与搜索（unique_id/nickname），返回 total + users。
+ */
+function getPreciseMerchantsFromDb(targetLocations = [], options = {}) {
+  if (!getDb()) return null;
+  if (!targetLocations.length) return { total: 0, users: [] };
+
+  const { limit, offset, search } = options;
+  const placeholders = targetLocations.map(() => "?").join(", ");
+
+  const where = `
+    tt_seller = 1
+    AND verified = 0
+    AND location_created IN (${placeholders})
+    AND top_video_seo_url IS NOT NULL AND top_video_seo_url != ''
+    AND product_review_count = 0
+    AND product_sold_count > 10
+    AND recent_ec_videos IS NOT NULL AND recent_ec_videos != ''
+    AND EXISTS (
+      SELECT 1 FROM json_each(recent_ec_videos)
+      WHERE CAST(json_extract(value, '$.playCount') AS INTEGER) > 1000
+    )
+  `;
+
+  let searchSql = "";
+  const searchParams = [];
+  if (search) {
+    searchSql = ` AND (unique_id LIKE ? OR nickname LIKE ?)`;
+    searchParams.push(`%${search}%`, `%${search}%`);
+  }
+
+  const totalRow = getDb()
+    .prepare(`SELECT COUNT(*) AS n FROM jobs WHERE ${where}${searchSql}`)
+    .get(...targetLocations, ...searchParams);
+  const total = totalRow?.n || 0;
+
+  const selectSql = `
+    SELECT
+      unique_id,
+      nickname,
+      sec_uid,
+      status,
+      follower_count,
+      video_count,
+      location_created,
+      latest_video_time,
+      refresh_time,
+      top_video_play_count,
+      top_video_href,
+      top_video_is_ad,
+      top_video_product_id,
+      top_video_product_title,
+      top_video_seo_url,
+      product_rating,
+      product_review_count,
+      product_sold_count,
+      product_name,
+      recent_ec_videos,
+      (SELECT COUNT(*) FROM json_each(recent_ec_videos)
+        WHERE CAST(json_extract(value, '$.playCount') AS INTEGER) > 1000) AS ecOver1k,
+      (SELECT MAX(CAST(json_extract(value, '$.playCount') AS INTEGER))
+        FROM json_each(recent_ec_videos)) AS maxEcPlay
+    FROM jobs
+    WHERE ${where}${searchSql}
+    ORDER BY product_sold_count DESC, unique_id ASC
+  `;
+
+  if (limit !== undefined) {
+    const safeLimit = Math.max(Math.min(Math.floor(limit), 1000), 1);
+    const safeOffset = Math.max(Math.floor(offset || 0), 0);
+    const rows = getDb()
+      .prepare(`${selectSql} LIMIT ? OFFSET ?`)
+      .all(...targetLocations, ...searchParams, safeLimit, safeOffset)
+      .map(mapJobRow);
+    return { total, limit: safeLimit, offset: safeOffset, users: rows };
+  }
+
+  const rows = getDb()
+    .prepare(selectSql)
+    .all(...targetLocations, ...searchParams)
+    .map(mapJobRow);
+  return { total, users: rows };
+}
+
 /**
  * 查询已修改（modified_at IS NOT NULL）且 location_created 不在 targetLocations 中的目标商家，
  * 按国家分组返回。
@@ -3549,6 +3635,8 @@ export function createStore(filePath, options = {}) {
     getRawJobsPage: getRawJobsPageFromDb,
     getTargetUsers: getTargetUsersFromDb,
     getTargetUsersByCountry: getTargetUsersByCountryFromDb,
+    getPreciseMerchants: (targetLocations, options) =>
+      getPreciseMerchantsFromDb(targetLocations, options),
     getModifiedTargetUsersOutsideLocations: (loc) =>
       getModifiedTargetUsersOutsideLocations(loc),
     getStats,

package/src/watch/public/app.js

@@ -185,6 +185,7 @@ function renderStats() {
   flashEl("statPending", d.pendingUsers);
   flashEl("statError", d.errorUsers);
   flashEl("statTarget", d.targetUsers, { full: true });
+  flashEl("statPrecise", d.preciseMerchants, { full: true });
   // 检测目标商家新增，放烟花（仅首页，且开关开启时）
   const hash = window.location.hash.replace(/^#/, "");
   if (
@@ -1137,6 +1138,10 @@ document.getElementById("statTargetCard").addEventListener("click", () => {
   navigateToTarget();
 });
 
+document.getElementById("statPreciseCard").addEventListener("click", () => {
+  navigateToPrecise();
+});
+
 // Hash 路由
 window.addEventListener("hashchange", handleRoute);
 window.addEventListener("DOMContentLoaded", handleRoute);
@@ -1290,6 +1295,8 @@ function handleRoute() {
     showRawPage();
   } else if (hash === "#target") {
     showTargetPage();
+  } else if (hash === "#precise") {
+    showPrecisePage();
   } else if (hash === "#tags") {
     showTagsPage();
   } else if (hash === "#settings") {
@@ -1323,6 +1330,7 @@ function showPendingPage() {
   document.getElementById("userUpdatePage").classList.remove("active");
   document.getElementById("rawPage").classList.remove("active");
   document.getElementById("targetPage").classList.remove("active");
+  document.getElementById("precisePage").classList.remove("active");
   document.getElementById("tagsPage").classList.remove("active");
   document.getElementById("settingsPage").classList.remove("active");
   fetchPendingByCountry();
@@ -1335,6 +1343,7 @@ function showUserUpdatePage() {
   document.getElementById("userUpdatePage").classList.add("active");
   document.getElementById("rawPage").classList.remove("active");
   document.getElementById("targetPage").classList.remove("active");
+  document.getElementById("precisePage").classList.remove("active");
   document.getElementById("tagsPage").classList.remove("active");
   document.getElementById("settingsPage").classList.remove("active");
   fetchUserUpdateByCountry();
@@ -1354,6 +1363,7 @@ function showRawPage() {
   document.getElementById("userUpdatePage").classList.remove("active");
   document.getElementById("rawPage").classList.add("active");
   document.getElementById("targetPage").classList.remove("active");
+  document.getElementById("precisePage").classList.remove("active");
   document.getElementById("tagsPage").classList.remove("active");
   document.getElementById("settingsPage").classList.remove("active");
   fetchRawByCountry();
@@ -1366,6 +1376,7 @@ function showMainPage() {
   document.getElementById("userUpdatePage").classList.remove("active");
   document.getElementById("rawPage").classList.remove("active");
   document.getElementById("targetPage").classList.remove("active");
+  document.getElementById("precisePage").classList.remove("active");
   document.getElementById("tagsPage").classList.remove("active");
   document.getElementById("settingsPage").classList.remove("active");
   document.getElementById("watchdogPage").classList.remove("active");
@@ -1379,6 +1390,10 @@ function navigateToTarget() {
   window.location.hash = "#target";
 }
 
+function navigateToPrecise() {
+  window.location.hash = "#precise";
+}
+
 function navigateToTags() {
   window.location.hash = "#tags";
 }
@@ -1399,6 +1414,7 @@ function hideAllPages() {
   document.getElementById("userUpdatePage").classList.remove("active");
   document.getElementById("rawPage").classList.remove("active");
   document.getElementById("targetPage").classList.remove("active");
+  document.getElementById("precisePage").classList.remove("active");
   document.getElementById("tagsPage").classList.remove("active");
   document.getElementById("settingsPage").classList.remove("active");
   document.getElementById("watchdogPage").classList.remove("active");
@@ -1858,6 +1874,220 @@ async function submitAddTags() {
   }
 }
 
+// ========== 精准商家页面 ==========
+
+async function showPrecisePage() {
+  hideAllPages();
+  document.getElementById("precisePage").classList.add("active");
+  // 每次进入都默认视频模式
+  setPreciseView("video");
+  showLoading("正在加载精准商家数据...");
+  await loadPreciseUsersPage(false, true);
+  hideLoading();
+}
+
+let currentPreciseUsers = [];
+let currentPreciseTotal = 0;
+let currentPreciseLoading = false;
+let currentPreciseAllLoaded = false;
+let currentPreciseSeq = 0;
+let currentPreciseView = "video";
+const PRECISE_PAGE_SIZE = 200;
+
+async function loadPreciseUsersPage(append = false, skipLoading = false) {
+  if (currentPreciseLoading) return;
+  currentPreciseLoading = true;
+  const seq = ++currentPreciseSeq;
+  const search = document.getElementById("preciseSearchInput")
+    ? document.getElementById("preciseSearchInput").value.trim()
+    : "";
+  const offset = append ? currentPreciseUsers.length : 0;
+  if (!append && !skipLoading) showLoading("正在加载数据...");
+
+  let data = null;
+  let error = null;
+  try {
+    let url = `/api/precise-merchants?limit=${PRECISE_PAGE_SIZE}&offset=${offset}`;
+    if (search) url += `&search=${encodeURIComponent(search)}`;
+    const res = await fetch(url);
+    data = await res.json();
+  } catch (e) {
+    error = e;
+    console.error("加载精准商家失败:", e);
+  } finally {
+    if (!append && !skipLoading) hideLoading();
+    currentPreciseLoading = false;
+    if (error || !data) return;
+    if (seq !== currentPreciseSeq && !append) return;
+    if (!append) {
+      currentPreciseUsers = data.users || [];
+      currentPreciseTotal = data.total || 0;
+    } else {
+      currentPreciseUsers = currentPreciseUsers.concat(data.users || []);
+      currentPreciseTotal = data.total || 0;
+    }
+    currentPreciseAllLoaded = currentPreciseUsers.length >= currentPreciseTotal;
+    renderPreciseView();
+  }
+}
+
+function setPreciseView(view) {
+  currentPreciseView = view === "table" ? "table" : "video";
+  const tableBtn = document.getElementById("preciseViewTableBtn");
+  const videoBtn = document.getElementById("preciseViewVideoBtn");
+  if (tableBtn)
+    tableBtn.classList.toggle("active", currentPreciseView === "table");
+  if (videoBtn)
+    videoBtn.classList.toggle("active", currentPreciseView === "video");
+  const videoWrap = document.getElementById("preciseVideoWrap");
+  const tableWrap = document.getElementById("preciseTableWrap");
+  if (videoWrap)
+    videoWrap.style.display = currentPreciseView === "video" ? "" : "none";
+  if (tableWrap)
+    tableWrap.style.display = currentPreciseView === "table" ? "" : "none";
+  renderPreciseView();
+}
+
+function renderPreciseView() {
+  if (currentPreciseView === "table") {
+    renderPreciseTable();
+  } else {
+    renderPreciseVideos();
+  }
+  updatePreciseMoreHint();
+}
+
+function updatePreciseMoreHint() {
+  const moreHint = document.getElementById("preciseMoreHint");
+  const totalEl = document.getElementById("precisePageStatTotal");
+  if (totalEl)
+    totalEl.textContent = formatStatNum(currentPreciseTotal, { full: true });
+  if (!moreHint) return;
+  if (currentPreciseTotal === 0) {
+    moreHint.textContent = "";
+    moreHint.style.display = "none";
+  } else if (currentPreciseAllLoaded) {
+    moreHint.textContent = `共 ${currentPreciseTotal} 个，已全部加载`;
+    moreHint.onclick = null;
+    moreHint.style.cursor = "default";
+    moreHint.style.color = "#6b7280";
+  } else {
+    moreHint.textContent = "点击加载更多";
+    moreHint.onclick = () => loadPreciseUsersPage(true);
+    moreHint.style.cursor = "pointer";
+    moreHint.style.color = "#60a5fa";
+  }
+}
+
+function renderPreciseTable() {
+  const el = document.getElementById("preciseTable");
+  if (!el) return;
+  if (!currentPreciseUsers.length) {
+    el.innerHTML =
+      '<tr><td colspan="12" style="text-align:center;color:#666;padding:20px">暂无精准商家</td></tr>';
+    return;
+  }
+  el.innerHTML = currentPreciseUsers
+    .map((u, i) => {
+      const sold = u.productSoldCount ?? 0;
+      const ec = u.ecOver1k ?? 0;
+      const maxEc = u.maxEcPlay ?? 0;
+      const title = (u.productName || "").replace(/</g, "&lt;");
+      return `<tr>
+        <td style="text-align:right;color:#666">${i + 1}</td>
+        <td><a href="https://www.tiktok.com/@${encodeURIComponent(u.uniqueId)}" target="_blank">@${escapeHtml(u.uniqueId)}</a></td>
+        <td>${escapeHtml(u.nickname || "-")}</td>
+        <td>${formatNum(u.followerCount || 0)}</td>
+        <td>${u.videoCount || 0}</td>
+        <td>${u.locationCreated || "-"}</td>
+        <td style="color:#22c55e">${formatNum(sold)}</td>
+        <td style="color:#f87171">${u.productReviewCount ?? 0}</td>
+        <td>${u.productRating != null ? u.productRating : "-"}</td>
+        <td>${ec}</td>
+        <td>${formatNum(maxEc)}</td>
+        <td style="max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${title}">${title || "-"}</td>
+      </tr>`;
+    })
+    .join("");
+}
+
+function renderPreciseVideos() {
+  const wrap = document.getElementById("preciseVideoWrap");
+  if (!wrap) return;
+  if (!currentPreciseUsers.length) {
+    wrap.innerHTML =
+      '<div style="color:#666;text-align:center;padding:24px">暂无精准商家</div>';
+    return;
+  }
+  wrap.innerHTML = currentPreciseUsers
+    .map((u) => {
+      const vids = Array.isArray(u.recentEcVideos) ? u.recentEcVideos : [];
+      const maxPlay = vids.reduce((m, v) => Math.max(m, v.playCount || 0), 0);
+      const sold = u.productSoldCount ?? 0;
+      const review = u.productReviewCount ?? 0;
+      const rating = u.productRating != null ? u.productRating : "-";
+      const userLink = `https://www.tiktok.com/@${encodeURIComponent(u.uniqueId)}`;
+      const tiles = vids
+        .reduce((acc, v) => {
+          const play = v.playCount || 0;
+          const time = v.createTime ? formatShortDate(v.createTime) : "";
+          const isAd = v.isAd ? '<span class="pv-ad">广告</span>' : "";
+          const prod = v.seoUrl
+            ? `<a class="pv-product" href="${escapeAttr(v.seoUrl)}" target="_blank" title="${escapeHtml(v.productTitle || "查看商品")}"><span class="pv-product-icon">🛒</span>${escapeHtml((v.productTitle || "查看商品").slice(0, 80))}</a>`
+            : "";
+          acc.push(`<div class="precise-video-item">
+          <a class="precise-video-tile" href="${escapeAttr(v.href || "#")}" target="_blank" title="播放视频">
+            <span class="pv-play">▶</span>
+            <span class="pv-count${maxPlay > 0 && play === maxPlay ? " pv-count-max" : ""}">${formatNum(play)}</span>
+            <span class="pv-time">${time}</span>
+            ${isAd}
+          </a>
+          ${prod}
+        </div>`);
+          return acc;
+        }, [])
+        .join("");
+      return `<div class="precise-merchant-card">
+        <div class="precise-merchant-head">
+          <a class="pm-user" href="${userLink}" target="_blank">@${escapeHtml(u.uniqueId)}</a>
+          <span class="pm-nick">${escapeHtml(u.nickname || "-")}</span>
+          <span class="pm-country">${u.locationCreated || "-"}</span>
+          <span class="pm-stats">粉丝 ${formatNum(u.followerCount || 0)} · 视频 ${u.videoCount || 0} · 销量 ${formatNum(sold)} · 评论 ${review} · 评分 ${rating} · EC视频 ${vids.length}</span>
+        </div>
+        ${tiles ? `<div class="precise-video-grid">${tiles}</div>` : '<div style="color:#666;font-size:12px;padding:6px 0">该商家暂无 EC 视频数据</div>'}
+      </div>`;
+    })
+    .join("");
+}
+
+function formatShortDate(sec) {
+  if (!sec) return "";
+  const d = new Date(sec * 1000);
+  const pad = (n) => String(n).padStart(2, "0");
+  return `${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}`;
+}
+
+function escapeAttr(str) {
+  return String(str)
+    .replace(/&/g, "&amp;")
+    .replace(/"/g, "&quot;")
+    .replace(/</g, "&lt;");
+}
+
+function clearPreciseFilters() {
+  const input = document.getElementById("preciseSearchInput");
+  if (input) input.value = "";
+  loadPreciseUsersPage();
+}
+
+let preciseSearchTimer = null;
+document.getElementById("preciseSearchInput").addEventListener("input", () => {
+  if (preciseSearchTimer) clearTimeout(preciseSearchTimer);
+  preciseSearchTimer = setTimeout(() => {
+    loadPreciseUsersPage();
+  }, 300);
+});
+
 // ========== 关键词页面 ==========
 
 let currentTags = [];
@@ -1879,6 +2109,7 @@ function showTagsPage() {
   document.getElementById("userUpdatePage").classList.remove("active");
   document.getElementById("rawPage").classList.remove("active");
   document.getElementById("targetPage").classList.remove("active");
+  document.getElementById("precisePage").classList.remove("active");
   document.getElementById("tagsPage").classList.add("active");
   document.getElementById("settingsPage").classList.remove("active");
   showLoading("正在加载关键词...");
@@ -2353,6 +2584,7 @@ function showTargetPage() {
   document.getElementById("userUpdatePage").classList.remove("active");
   document.getElementById("rawPage").classList.remove("active");
   document.getElementById("targetPage").classList.add("active");
+  document.getElementById("precisePage").classList.remove("active");
   document.getElementById("tagsPage").classList.remove("active");
   document.getElementById("settingsPage").classList.remove("active");
   showLoading("正在加载目标商家数据...");

package/src/watch/public/index.html

@@ -59,6 +59,10 @@
         <div class="label">目标商家</div>
         <div class="value target" id="statTarget">0</div>
       </div>
+      <div class="stat-card clickable" id="statPreciseCard" onclick="navigateToPrecise()">
+        <div class="label">精准商家</div>
+        <div class="value target" id="statPrecise">0</div>
+      </div>
       <div class="stat-card clickable pending-card" id="statCommentTaskCard">
         <div class="label">待评论任务</div>
         <div class="value rose" id="statCommentTask">0</div>
@@ -379,6 +383,55 @@
     </div>
     <div id="backToTop" title="回到顶部（可拖动）">↑</div>
   </div>
+  <div id="precisePage">
+    <div class="stats" style="margin-bottom:16px">
+      <div class="stat-card">
+        <div class="label">精准商家</div>
+        <div class="value target" id="precisePageStatTotal">0</div>
+      </div>
+      <div class="stat-card clickable pending-card" onclick="navigateToMain()" style="background:rgba(167,139,250,0.1)">
+        <div class="label">← 返回主页面</div>
+      </div>
+    </div>
+    <div class="table-wrap">
+      <div class="precise-list-header">
+        <h3>精准商家列表</h3>
+        <div class="view-toggle">
+          <button id="preciseViewTableBtn" onclick="setPreciseView('table')">表格</button>
+          <button id="preciseViewVideoBtn" onclick="setPreciseView('video')" class="active">视频</button>
+        </div>
+      </div>
+      <div class="controls">
+        <input type="text" id="preciseSearchInput" placeholder="搜索精准商家用户名 / 昵称...">
+        <button onclick="clearPreciseFilters()">清空筛选</button>
+      </div>
+      <div id="preciseVideoWrap"></div>
+      <div class="table-scroll" id="preciseTableWrap" style="display:none">
+        <table>
+          <thead>
+            <tr>
+              <th style="width:48px">#</th>
+              <th>用户名</th>
+              <th>昵称</th>
+              <th>粉丝</th>
+              <th>视频</th>
+              <th>国家</th>
+              <th>销量</th>
+              <th>评论</th>
+              <th>评分</th>
+              <th>EC超1k视频数</th>
+              <th>最高EC播放</th>
+              <th>商品</th>
+            </tr>
+          </thead>
+          <tbody id="preciseTable"></tbody>
+        </table>
+      </div>
+      <div id="preciseMoreHint" onclick="loadPreciseUsersPage(true)"
+        style="text-align:center;padding:10px 8px;font-size:13px;color:#6b7280;cursor:default;user-select:none;transition:color 0.2s">
+      </div>
+    </div>
+  </div>
   <div id="tagsPage">
     <div class="stats" style="margin-bottom:16px">
       <div class="stat-card">

package/src/watch/public/style.css

@@ -112,6 +112,12 @@ body {
   color: #f472b6;
 }
 
+/* 精准商家卡片文字改为红色 */
+#statPreciseCard .label,
+#statPreciseCard .value {
+  color: #ef4444;
+}
+
 .stat-card .value-sub {
   font-size: 12px;
   font-weight: 400;
@@ -878,6 +884,14 @@ td.user-id:hover {
   display: block;
 }
 
+#precisePage {
+  display: none;
+}
+
+#precisePage.active {
+  display: block;
+}
+
 #backToTop {
   position: fixed;
   bottom: 32px;
@@ -1892,3 +1906,191 @@ td.user-id:hover {
   color: #888;
   font-weight: 600;
 }
+
+/* ===== 精准商家：视频卡片视图 ===== */
+.precise-list-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+  margin-bottom: 8px;
+}
+.precise-list-header h3 {
+  margin: 0;
+}
+.view-toggle {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  border-bottom: 2px solid #2f2f3f;
+}
+.view-toggle button {
+  padding: 7px 18px;
+  border: none;
+  border-bottom: 2px solid transparent;
+  border-radius: 6px 6px 0 0;
+  background: transparent;
+  color: #9aa;
+  font-size: 13px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+.view-toggle button:hover {
+  color: #ccc;
+}
+.view-toggle button.active {
+  color: #fff;
+  border-bottom-color: #7c3aed;
+  background: rgba(124, 58, 237, 0.14);
+  font-weight: 600;
+}
+
+.precise-video-wrap {
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+.precise-merchant-card {
+  background: #1a1a24;
+  border: 1px solid #2a2a3a;
+  border-radius: 10px;
+  padding: 12px 14px;
+}
+.precise-merchant-head {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: 10px;
+  margin-bottom: 10px;
+}
+.precise-merchant-head .pm-user {
+  font-weight: 700;
+  color: #60a5fa;
+  text-decoration: none;
+  font-size: 15px;
+}
+.precise-merchant-head .pm-user:hover {
+  text-decoration: underline;
+}
+.precise-merchant-head .pm-nick {
+  color: #ccc;
+  font-size: 13px;
+}
+.precise-merchant-head .pm-country {
+  font-size: 11px;
+  background: #2a2a3a;
+  color: #a78bfa;
+  padding: 1px 7px;
+  border-radius: 10px;
+}
+.precise-merchant-head .pm-stats {
+  color: #888;
+  font-size: 12px;
+  margin-left: auto;
+}
+
+.precise-video-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+  gap: 10px;
+}
+.precise-video-item {
+  background: #20202e;
+  border: 1px solid #2c2c3c;
+  border-radius: 8px;
+  overflow: hidden;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+}
+.precise-video-tile {
+  display: block;
+  position: relative;
+  aspect-ratio: 9 / 14;
+  background: linear-gradient(160deg, #2a2a3a 0%, #1c1c28 100%);
+  color: #e0e0e0;
+  text-decoration: none;
+  overflow: hidden;
+}
+.precise-video-tile:hover {
+  border-color: #7c3aed;
+}
+.precise-video-tile .pv-play {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  width: 42px;
+  height: 42px;
+  border-radius: 50%;
+  background: rgba(0, 0, 0, 0.55);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 20px;
+  color: #fff;
+}
+.precise-video-tile .pv-count {
+  position: absolute;
+  left: 6px;
+  top: 6px;
+  font-size: 12px;
+  color: #fff;
+  text-shadow: 0 1px 2px #000;
+}
+/* 播放量最大的视频：播放量文字特殊高亮 */
+.precise-video-tile .pv-count-max {
+  color: #1a1a24;
+  font-weight: 800;
+  background: #fbbf24;
+  padding: 1px 5px;
+  border-radius: 4px;
+  text-shadow: none;
+  box-shadow: 0 0 6px rgba(251, 191, 36, 0.8);
+}
+.precise-video-tile .pv-time {
+  position: absolute;
+  left: 6px;
+  top: 24px;
+  font-size: 11px;
+  color: #cfcfcf;
+  text-shadow: 0 1px 2px #000;
+}
+.precise-video-tile .pv-ad {
+  position: absolute;
+  right: 6px;
+  top: 6px;
+  font-size: 10px;
+  background: rgba(254, 44, 85, 0.9);
+  color: #fff;
+  padding: 1px 5px;
+  border-radius: 4px;
+}
+/* 商品名悬浮在图片上，最多 2 行、固定高度以容纳 2 行文字 */
+.precise-video-item .pv-product {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  padding: 30px 8px 8px;
+  background: linear-gradient(to top, rgba(0, 0, 0, 0.92), rgba(0, 0, 0, 0));
+  color: #fbbf24;
+  font-size: 12px;
+  line-height: 1.35;
+  text-decoration: none;
+  text-align: left;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  overflow: hidden;
+  box-sizing: border-box;
+  height: 71px;
+}
+.precise-video-item .pv-product:hover {
+  color: #fff;
+  text-decoration: underline;
+}
+.precise-video-item .pv-product .pv-product-icon {
+  margin-right: 4px;
+}