southnote-mini-sdk 1.0.0

package/components/wiki-renderer/wiki-renderer.wxml

@@ -0,0 +1,150 @@
+<view class="wiki-root">
+  <block wx:for="{{parsedBlocks}}" wx:key="index" wx:for-index="index">
+
+    <!-- Banner -->
+    <swiper circular wx:if="{{item.type === 'banner'}}" class="banner-swipe" autoplay="true" interval="3000" indicator-dots="true" indicator-color="white" style="aspect-ratio: {{item.ratio}}">
+      <swiper-item wx:for="{{item.children}}" wx:key="id" wx:for-item="bannerItem">
+        <image src="{{bannerItem.image.url}}" mode="aspectFill" class="banner-img" />
+      </swiper-item>
+    </swiper>
+
+    <!-- 文本 -->
+    <view wx:if="{{item.type === 'text'}}" class="wiki-text">{{item.desc}}</view>
+
+    <!-- 富文本 / 表格：用 towxml 渲染 -->
+    <view wx:if="{{item.type === 'richText' || item.type === 'table'}}" class="wiki-richtext" catch:tap="onRichTextTap" data-index="{{index}}">
+      <towxml nodes="{{item.towxmlNodes}}" bind:linktap="onTowxmlLinkTap" />
+    </view>
+
+    <!-- 图片 -->
+    <view wx:if="{{item.type === 'image'}}" class="image-block" style="aspect-ratio: {{item.ratio}}">
+      <image wx:if="{{item.visible}}" src="{{item.url}}" mode="aspectFill" class="block-img" bindtap="onImageTap" data-jump="{{item.jump}}" />
+    </view>
+
+    <!-- 评分 type=6 -->
+
+    <view wx:if="{{item.type === 'score'}}" class="score-block">
+      <view class="score-header">
+        <text class="score-title">{{item.title}}</text>
+        <view class="score-edit-btn" bindtap="onOpenScoreModal" data-index="{{index}}">
+          <van-icon name="edit" size="22px" />
+        </view>
+      </view>
+
+      <view class="container-divider"></view>
+
+      <view class="score-body">
+        <van-rate value="{{item.averageScore}}" allow-half readonly color="#f5a623" void-color="#e0e0e0" size="32px" />
+        <view class="score-right">
+          <text class="score-avg">{{item.averageScore}}</text>
+          <text class="score-count">{{item.voteCount}} 评分</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 评分弹窗 -->
+
+    <view wx:if="{{scoreModal.visible}}" class="score-modal-mask" catchtap="onCloseScoreModal">
+      <view class="score-modal" catchtap="stopPropagation">
+        <text class="score-modal-title">{{scoreModal.title}}</text>
+        <van-rate value="{{scoreModal.selected}}" allow-half color="#f5a623" void-color="#e0e0e0" size="40px" bind:change="onSelectStar" />
+        <view class="score-modal-btns">
+          <view class="score-modal-cancel" bindtap="onCloseScoreModal">取消</view>
+          <view class="score-modal-confirm {{scoreModal.selected > 0 ? '' : 'disabled'}}" bindtap="onSubmitScore">确认</view>
+        </view>
+      </view>
+    </view>
+
+    <!-- Grid 菜单 -->
+    <view wx:if="{{item.type === 'grid' && item.title}}" class="menu-title" style="background-color: {{item.color}}; color: {{item.titleTextColor}}">{{item.title}}</view>
+    <view wx:if="{{item.type === 'grid'}}" class="menu-tabs">
+
+      <view class="grid" style="grid-template-columns: repeat({{item.count}}, 1fr)">
+        <view wx:for="{{item.children}}" wx:key="index" wx:for-index="gi" wx:for-item="gitem" class="grid-item" bindtap="onJump" data-jump="{{gitem.jump}}">
+          <grid-item data="{{gitem}}" />
+        </view>
+      </view>
+    </view>
+
+    <!-- Tabs（图标网格型） -->
+    <view wx:if="{{item.type === 'tabs' && item.title}}" class="menu-title" style="background-color: {{item.color}}; color: {{item.titleTextColor}}">{{item.title}}</view>
+    <wiki-tabs wx:if="{{item.type === 'tabs'}}" tabs="{{item.tabs}}" color="{{'#002fa7'}}" active="{{tabActiveMap[index]}}" bind:change="onVanTabChange" data-block-index="{{index}}" data-tab-type="tabs">
+      <view wx:for="{{item.tabs}}" wx:key="name" wx:for-item="tab" slot="{{tab.name}}">
+        <view class="grid" style="grid-template-columns: repeat({{item.count}}, 1fr)">
+          <view wx:for="{{tab.children}}" wx:key="index" wx:for-item="gitem" wx:for-index="gi" class="grid-item" bindtap="onJump" data-jump="{{gitem.jump}}">
+            <grid-item data="{{gitem}}" />
+          </view>
+        </view>
+      </view>
+    </wiki-tabs>
+
+    <!-- 内容型 Tabs（递归子块） -->
+    <view wx:if="{{item.type === 'content-tabs' && item.title}}" class="menu-title" style="background-color: {{item.color}}; color: {{item.titleTextColor}}">{{item.title}}</view>
+    <wiki-tabs wx:if="{{item.type === 'content-tabs'}}" tabs="{{item.tabs}}" color="{{'#002fa7'}}" active="{{tabActiveMap[index]}}" bind:change="onVanTabChange" data-block-index="{{index}}" data-tab-type="content-tabs">
+      <view wx:for="{{item.tabs}}" wx:key="name" wx:for-item="tab" slot="{{tab.name}}">
+        <wiki-renderer images="{{images}}" data="{{tab.children}}" game-id="{{gameId}}" wiki-users="{{wikiUsers}}" />
+      </view>
+    </wiki-tabs>
+
+    <!-- 筛选 Tabs -->
+    <view wx:if="{{item.type === 'filter-tabs' && item.title}}" class="menu-title" style="background-color: {{item.color}}; color: {{item.titleTextColor}}">{{item.title}}</view>
+    <view wx:if="{{item.type === 'filter-tabs'}}" class="menu-tabs">
+      <view class="filter-classes">
+        <view wx:for="{{item.classes}}" wx:key="index" wx:for-index="ci" wx:for-item="cls" class="filter-class">
+          <view wx:for="{{cls.allKeys}}" wx:key="index" wx:for-item="key" class="filter-btn {{filterMap[ci] === key || (!filterMap[ci] && key === '不限') ? 'active' : ''}}" bindtap="onFilterChange" data-ci="{{ci}}" data-key="{{key}}">{{key}}</view>
+        </view>
+      </view>
+      <view class="grid" style="grid-template-columns: repeat({{item.count}}, 1fr)">
+        <view wx:for="{{item.filteredChildren}}" wx:key="index" wx:for-item="gitem" wx:for-index="fi" class="grid-item" bindtap="onJump" data-jump="{{gitem.jump}}">
+          <grid-item data="{{gitem}}" />
+        </view>
+      </view>
+    </view>
+
+    <!-- 攻略组成员 -->
+    <view wx:if="{{item.type === 'info'}}" class="info">
+      <view wx:if="{{item.title}}" class="menu-title" style="background-color: {{item.color}}">{{item.title}}</view>
+      <view style="font-size: 14px; line-height: 1.7; margin-top: 10px">{{item.info}}</view>
+      <view class="info-users">
+        <view wx:for="{{wikiUsers}}" wx:key="nickname" wx:for-item="user" class="user-item" bindtap="gotoUserCenter" data-id="{{user.id}}">
+          <image src="{{user.avatar}}" class="user-avatar" />
+          <text class="user-name">{{user.nickname}}</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 折叠容器 -->
+    <view wx:if="{{item.type === 'container' && item.key === 'collapse'}}" class="wiki-container">
+      <view class="collapse-title" style="background-color: {{item.color}}; color: {{item.titleTextColor}}" bindtap="onToggleCollapse" data-index="{{index}}">
+        <text>{{item.title}}</text>
+        <text class="collapse-arrow {{collapseActive[index] ? 'open' : ''}}">▾</text>
+      </view>
+      <view wx:if="{{collapseActive[index]}}">
+        <wiki-renderer images="{{images}}" data="{{item.children}}" game-id="{{gameId}}" wiki-users="{{wikiUsers}}" />
+      </view>
+    </view>
+
+    <!-- 带背景色容器 / 普通容器 / 标题容器 -->
+    <view wx:if="{{item.type === 'container' && item.key !== 'collapse'}}">
+      <view wx:if="{{item.title}}" class="menu-title" style="background-color: {{item.color}}; color: {{item.titleTextColor}}">{{item.title}}</view>
+      <view wx:if="{{item.hasDivider}}" class="container-divider"></view>
+      <view class="wiki-container" style="background-color: {{item.key === 'hasBGC' ? item.color : ''}}">
+        <wiki-renderer images="{{images}}" data="{{item.children}}" game-id="{{gameId}}" wiki-users="{{wikiUsers}}" />
+      </view>
+    </view>
+
+    <!-- 左右布局 -->
+    <view wx:if="{{item.type === 'lr'}}" class="wiki-container">
+      <view wx:if="{{item.title}}" class="menu-title" style="background-color: {{item.color}}; color: {{item.titleTextColor}}">{{item.title}}</view>
+      <view class="lr-block">
+        <view class="lr-side" style="flex: {{item.percent / 100}}">
+          <wiki-renderer wx:if="{{item.left}}" images="{{images}}" data="{{[item.left]}}" game-id="{{gameId}}" wiki-users="{{wikiUsers}}" />
+        </view>
+        <view class="lr-side" style="flex: {{1 - item.percent / 100}}">
+          <wiki-renderer wx:if="{{item.right}}" images="{{images}}" data="{{[item.right]}}" game-id="{{gameId}}" wiki-users="{{wikiUsers}}" />
+        </view>
+      </view>
+    </view>
+
+  </block>
+</view>

package/components/wiki-renderer/wiki-renderer.wxss

@@ -0,0 +1,412 @@
+.wiki-root {}
+
+/* Banner */
+.banner-swipe {
+  border-radius: 8px;
+  overflow: hidden;
+  margin: 15px 0;
+  width: 100%;
+  height: auto;
+}
+
+.banner-img {
+  width: 100%;
+  height: 100%;
+  border-radius: 12px;
+}
+
+/* Image */
+.image-block {
+  position: relative;
+  margin: 15px 0;
+  width: 100%;
+  background-color: #e0e0e0;
+  border-radius: 10rpx;
+}
+
+.block-img {
+  width: 100%;
+  height: 100%;
+  border-radius: 12px;
+}
+
+/* Text */
+.wiki-text {
+  margin: 15px 0;
+  line-height: 2.0;
+  font-size: 14px;
+  color: black;
+}
+
+.wiki-richtext {
+  margin: 15px 0;
+  font-size: 14px;
+  line-height: 2.0;
+  padding: 0 10px;
+}
+
+/* Menu */
+.menu-tabs {
+  background-color: #f5f5f5;
+  padding: 15px;
+}
+
+.menu-title {
+  font-size: 20px;
+  font-weight: bold;
+  text-align: left;
+  padding: 8px;
+  margin-top: 15px;
+}
+
+/* Tabs */
+.tab-bar {
+  display: flex;
+  flex-direction: row;
+  white-space: nowrap;
+  margin-bottom: 15px;
+}
+
+.tab-btn {
+  display: inline-block;
+  padding: 6px 16px;
+  margin-right: 8px;
+  border-radius: 16px;
+  background: #f5f5f5;
+  font-size: 14px;
+}
+
+.tab-btn-active {
+  background: #409eff;
+  color: white;
+}
+
+/* Grid */
+.grid {
+  display: grid;
+  gap: 0;
+}
+
+.grid-item {
+  padding: 6px 0;
+  text-align: center;
+}
+
+/* Filter */
+.filter-classes {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  margin: 15px 0;
+}
+
+.filter-class {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.filter-btn {
+  padding: 4px 12px;
+  border: 1px solid #ccc;
+  border-radius: 12px;
+  background: #f5f5f5;
+  font-size: 14px;
+}
+
+.filter-btn.active {
+  background: #409eff;
+  color: white;
+  border-color: #409eff;
+}
+
+/* Info */
+.info {
+  margin-top: 15px;
+  padding: 10px;
+  border-radius: 12px;
+}
+
+.info-users {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  background: white;
+  padding: 10px;
+}
+
+.user-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 6px;
+}
+
+.user-avatar {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+}
+
+.user-name {
+  width: 60px;
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #a7a7a7;
+  font-size: 12px;
+}
+
+/* Container */
+.wiki-container {
+  padding: 5px;
+  border-radius: 12px;
+  background: #f8f8f8;
+}
+
+.collapse-title {
+  display: flex;
+  justify-content: space-between;
+  padding: 10px;
+  font-weight: bold;
+  border-radius: 8px;
+}
+
+.collapse-arrow {
+  transition: transform 0.2s;
+}
+
+.collapse-arrow.open {
+  transform: rotate(180deg);
+}
+
+/* LR */
+.lr-block {
+  display: flex;
+  gap: 12px;
+  margin: 15px 0;
+}
+
+.lr-side {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.container-divider {
+  height: 1px;
+  background-color: #e0e0e0;
+  margin: 10px 0;
+}
+
+
+/* 评分块 */
+.score-block {
+  margin: 15px 0;
+  padding: 15px 0px;
+  background: #fff;
+  border-radius: 12px;
+}
+
+.score-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 10px;
+}
+
+.score-title {
+  font-size: 20px;
+  font-weight: bold;
+  text-align: left;
+}
+
+.score-edit-btn {
+  padding: 4px 8px;
+}
+
+.score-edit-icon {
+  font-size: 18px;
+  color: #333;
+}
+
+
+
+.score-stars {
+  display: flex;
+  gap: 4px;
+}
+
+.score-star {
+  font-size: 32px;
+  color: #e0e0e0;
+}
+
+.score-star.filled {
+  color: #f5a623;
+}
+
+.score-right {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.score-avg {
+  font-size: 28px;
+  font-weight: bold;
+  line-height: 1.2;
+}
+
+.score-count {
+  font-size: 12px;
+  color: #999;
+}
+
+/* 评分弹窗 */
+/* 蒙层透明度 0.2 */
+.score-modal-mask {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.2);
+  z-index: 999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+/* score-body 改为 space-between */
+.score-body {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  /* ← 关键改动 */
+  width: 100%;
+}
+
+.score-modal {
+  background: #fff;
+  border-radius: 16px;
+  padding: 24px 20px;
+  width: 72vw;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+}
+
+.score-modal-title {
+  font-size: 16px;
+  font-weight: bold;
+  text-align: center;
+}
+
+.score-modal-stars {
+  display: flex;
+  gap: 8px;
+}
+
+.score-modal-star {
+  font-size: 40px;
+  color: #e0e0e0;
+}
+
+.score-modal-star.filled {
+  color: #f5a623;
+}
+
+.score-modal-hint {
+  font-size: 13px;
+  color: #888;
+}
+
+.score-modal-btns {
+  display: flex;
+  gap: 12px;
+  width: 100%;
+}
+
+.score-modal-cancel,
+.score-modal-confirm {
+  flex: 1;
+  text-align: center;
+  padding: 10px 0;
+  border-radius: 20px;
+  font-size: 15px;
+}
+
+.score-modal-cancel {
+  background: #f5f5f5;
+  color: #333;
+}
+
+.score-modal-confirm {
+  background: #002fa7;
+  color: #fff;
+}
+
+.score-modal-confirm.disabled {
+  background: #b0b0b0;
+}
+
+/* 星星容器：相对定位，用于叠加填充层 */
+.star-wrap {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+}
+
+/* 填充层：绝对定位，从左边开始裁剪 */
+.star-fill {
+  position: absolute;
+  left: 0;
+  top: 0;
+  overflow: hidden;
+  /* width 由内联 style 动态设置 0% / 50% / 100% */
+}
+
+/* 弹窗里的星星需要更大触控区 */
+.modal-star {
+  margin: 0 4px;
+}
+
+/* 左半点击区 */
+.star-tap-left {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 50%;
+  height: 100%;
+}
+
+/* 右半点击区 */
+.star-tap-right {
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: 50%;
+  height: 100%;
+}
+
+/* wxss */
+.star-wrap {
+  position: relative;
+  display: inline-flex;
+  width: 32px;   /* 和 van-icon size 保持一致 */
+  height: 32px;
+  overflow: hidden; /* 不需要，填充层自己 overflow hidden */
+}
+
+.star-fill {
+  position: absolute;
+  left: 0;
+  top: 0;
+  overflow: hidden;
+  /* width 由 style 动态设置，此时 % 相对于 32px 父容器计算，正常生效 */
+}
+
+.modal-star {
+  width: 40px;
+  height: 40px;
+}

package/components/wiki-tabs/wiki-tabs.js

@@ -0,0 +1,52 @@
+Component({
+  options: {
+    styleIsolation: 'apply-shared',
+    multipleSlots: true
+  },
+
+  properties: {
+    tabs: {
+      // 格式: [{ name: 'Tab A' }, { name: 'Tab B' }]
+      type: Array,
+      value: []
+    },
+    // 激活颜色，对应 van-tabs 的 color 参数
+    color: {
+      type: String,
+      value: '#1989fa'
+    },
+    // 受控模式：外部传入当前激活 tab 名
+    active: {
+      type: String,
+      value: ''
+    }
+  },
+
+  data: {
+    activeTab: ''
+  },
+
+  observers: {
+    'tabs, active': function (tabs, active) {
+      if (!tabs || !tabs.length) return
+
+      // 如果外部传了 active 且合法，就用外部的；否则默认第一个
+      const names = tabs.map(t => t.name)
+      if (active && names.includes(active)) {
+        this.setData({ activeTab: active })
+      } else if (!this.data.activeTab || !names.includes(this.data.activeTab)) {
+        this.setData({ activeTab: tabs[0].name })
+      }
+    }
+  },
+
+  methods: {
+    onTabTap(e) {
+      const name = e.currentTarget.dataset.name
+      if (name === this.data.activeTab) return
+      this.setData({ activeTab: name })
+      // 触发 change 事件，与 van-tabs 保持一致，detail.name 是新 tab 名
+      this.triggerEvent('change', { name })
+    }
+  }
+})

package/components/wiki-tabs/wiki-tabs.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

package/components/wiki-tabs/wiki-tabs.wxml

@@ -0,0 +1,28 @@
+<view class="wiki-tabs-root">
+  <!-- Tab 按钮栏 -->
+  <scroll-view scroll-x class="wiki-tabs-bar" enhanced="true" show-scrollbar="false">
+    <view class="wiki-tabs-bar-inner">
+      <view
+        wx:for="{{tabs}}"
+        wx:key="name"
+        wx:for-item="tab"
+        wx:for-index="ti"
+        class="wiki-tab-btn {{activeTab === tab.name ? 'active' : ''}}"
+        style="{{activeTab === tab.name ? 'background-color:' + (color || '#1989fa') + '; border-color:' + (color || '#1989fa') + ';' : ''}}"
+        bindtap="onTabTap"
+        data-name="{{tab.name}}"
+      >
+        <text class="wiki-tab-label {{activeTab === tab.name ? 'active' : ''}}">{{tab.name}}</text>
+      </view>
+    </view>
+  </scroll-view>
+
+  <!-- Tab 内容区 -->
+  <view class="wiki-tabs-content">
+    <block wx:for="{{tabs}}" wx:key="name" wx:for-item="tab">
+      <view wx:if="{{activeTab === tab.name}}">
+        <slot name="{{tab.name}}" />
+      </view>
+    </block>
+  </view>
+</view>

package/components/wiki-tabs/wiki-tabs.wxss

@@ -0,0 +1,43 @@
+.wiki-tabs-root {
+  width: 100%;
+}
+
+.wiki-tabs-bar {
+  width: 100%;
+  white-space: nowrap;
+}
+
+.wiki-tabs-bar-inner {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 8rpx;
+  padding: 15px 0 15px;
+}
+
+.wiki-tab-btn {
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 10rpx 28rpx;
+  border-radius: 40rpx;
+  border: 2rpx solid #d9d9d9;
+  background-color: #f5f5f5;
+}
+
+.wiki-tab-label {
+  font-size: 26rpx;
+  color: #555555;
+  font-weight: 400;
+  line-height: 1;
+}
+
+.wiki-tab-label.active {
+  color: #ffffff;
+  font-weight: 600;
+}
+
+.wiki-tabs-content {
+  width: 100%;
+}