89 lines
3.1 KiB
Plaintext
89 lines
3.1 KiB
Plaintext
|
<view class="help-container">
|
||
|
|
<!-- 顶部导航栏 -->
|
||
|
|
<view class="nav-bar">
|
||
|
|
<view class="nav-title">帮助中心</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<!-- 搜索框 -->
|
||
|
|
<view class="search-box">
|
||
|
|
<view class="search-icon">
|
||
|
|
<icon type="search" size="28" color="#999"></icon>
|
||
|
|
</view>
|
||
|
|
<input
|
||
|
|
class="search-input"
|
||
|
|
placeholder="搜索问题或关键词"
|
||
|
|
value="{{searchKeyword}}"
|
||
|
|
bindinput="onSearchInput"
|
||
|
|
></input>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<!-- 分类导航 -->
|
||
|
|
<view class="categories">
|
||
|
|
<view class="category-item {{currentCategory === 'all' ? 'active' : ''}}" bindtap="switchCategory" data-category="all">
|
||
|
|
<view class="category-icon all-icon"></view>
|
||
|
|
<view class="category-name">全部</view>
|
||
|
|
</view>
|
||
|
|
<view class="category-item {{currentCategory === 'account' ? 'active' : ''}}" bindtap="switchCategory" data-category="account">
|
||
|
|
<view class="category-icon account-icon"></view>
|
||
|
|
<view class="category-name">账号</view>
|
||
|
|
</view>
|
||
|
|
<view class="category-item {{currentCategory === 'order' ? 'active' : ''}}" bindtap="switchCategory" data-category="order">
|
||
|
|
<view class="category-icon order-icon"></view>
|
||
|
|
<view class="category-name">订单</view>
|
||
|
|
</view>
|
||
|
|
<view class="category-item {{currentCategory === 'payment' ? 'active' : ''}}" bindtap="switchCategory" data-category="payment">
|
||
|
|
<view class="category-icon payment-icon"></view>
|
||
|
|
<view class="category-name">支付</view>
|
||
|
|
</view>
|
||
|
|
<view class="category-item {{currentCategory === 'other' ? 'active' : ''}}" bindtap="switchCategory" data-category="other">
|
||
|
|
<view class="category-icon other-icon"></view>
|
||
|
|
<view class="category-name">其他</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<!-- 常见问题列表 -->
|
||
|
|
<view class="faq-list">
|
||
|
|
<view class="section-title">常见问题</view>
|
||
|
|
|
||
|
|
<!-- 搜索结果为空时显示 -->
|
||
|
|
<view wx:if="{{filteredFAQs.length === 0 && searchKeyword}}" class="empty-result">
|
||
|
|
<view class="empty-icon">
|
||
|
|
<icon type="search" size="60" color="#ccc"></icon>
|
||
|
|
</view>
|
||
|
|
<view class="empty-text">未找到相关问题</view>
|
||
|
|
<view class="empty-hint">请尝试其他关键词</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<!-- 问题列表 -->
|
||
|
|
<view wx:else>
|
||
|
|
<view
|
||
|
|
class="faq-item"
|
||
|
|
wx:for="{{filteredFAQs}}"
|
||
|
|
wx:key="id"
|
||
|
|
bindtap="toggleFaq"
|
||
|
|
data-id="{{item.id}}"
|
||
|
|
>
|
||
|
|
<view class="faq-question">
|
||
|
|
<view class="question-text">{{item.question}}</view>
|
||
|
|
<view class="faq-arrow {{item.expanded ? 'expanded' : ''}}">
|
||
|
|
<icon type="chevron-down" size="24" color="#999"></icon>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="faq-answer {{item.expanded ? 'expanded' : ''}}">
|
||
|
|
{{item.answer}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<!-- 联系客服 -->
|
||
|
|
<view class="contact-section">
|
||
|
|
<view class="contact-title">需要更多帮助？</view>
|
||
|
|
<button class="contact-btn" bindtap="contactCustomerService">
|
||
|
|
<icon type="phone" size="24" color="#fff" class="contact-icon"></icon>
|
||
|
|
联系客服
|
||
|
|
</button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|