R524809
133 lines
6.3 KiB
Plaintext
133 lines
6.3 KiB
Plaintext
<view class="guide-page">
|
|
<nav-bar title="打印指南" />
|
|
|
|
<view class="guide-page__body">
|
|
<!-- Hero 卡片：白底大圆角 + 顶条品牌色（参考 profile 主卡） -->
|
|
<view class="guide-page__hero">
|
|
<view class="guide-page__hero-tint"></view>
|
|
<view class="guide-page__hero-icon-wrap">
|
|
<text class="guide-page__hero-icon">🖨️</text>
|
|
</view>
|
|
<text class="guide-page__hero-title">3 步完成打印</text>
|
|
<text class="guide-page__hero-sub"
|
|
>保存图片 → 连接打印机 → 一键打印</text
|
|
>
|
|
</view>
|
|
|
|
<!-- 步骤时间线 -->
|
|
<view class="guide-page__steps">
|
|
<view class="guide-page__timeline-line" />
|
|
|
|
<view class="guide-page__step">
|
|
<view class="guide-page__step-num-wrap">
|
|
<view class="guide-page__step-num">1</view>
|
|
</view>
|
|
<view class="guide-page__step-body">
|
|
<text class="guide-page__step-title">保存到相册</text>
|
|
<text class="guide-page__step-desc">
|
|
在练习纸预览页点击「保存到相册」，授权后即可下载图片到手机相册。
|
|
</text>
|
|
|
|
<!-- 相册权限提示（动态状态） -->
|
|
<view
|
|
class="guide-page__perm guide-page__perm--{{albumAuthState}}">
|
|
<view class="guide-page__perm-icon-wrap">
|
|
<van-icon
|
|
wx:if="{{albumAuthState === 'granted'}}"
|
|
name="checked"
|
|
size="36rpx"
|
|
color="#1fe000" />
|
|
<van-icon
|
|
wx:elif="{{albumAuthState === 'denied'}}"
|
|
name="warning-o"
|
|
size="36rpx"
|
|
color="#e8793a" />
|
|
<van-icon
|
|
wx:else
|
|
name="info-o"
|
|
size="36rpx"
|
|
color="#605b50" />
|
|
</view>
|
|
<view class="guide-page__perm-body">
|
|
<text class="guide-page__perm-title"
|
|
>{{albumAuthState === 'granted' ?
|
|
'已开启相册权限' : albumAuthState === 'denied' ?
|
|
'相册权限未开启' : '检查相册权限'}}</text
|
|
>
|
|
<text class="guide-page__perm-desc"
|
|
>{{albumAuthState === 'granted' ?
|
|
'可正常将练习纸保存到手机相册。' :
|
|
albumAuthState === 'denied' ?
|
|
'需要在系统设置中开启「保存到相册」权限，才能下载图片。'
|
|
:
|
|
'请确认是否已授权小程序保存图片到相册。'}}</text
|
|
>
|
|
<view
|
|
wx:if="{{albumAuthState !== 'granted'}}"
|
|
class="guide-page__perm-btn"
|
|
bindtap="onHandleAlbumPerm"
|
|
>{{albumAuthState === 'denied' ? '前往设置开启'
|
|
: '立即检查授权'}}</view
|
|
>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="guide-page__step">
|
|
<view class="guide-page__step-num-wrap">
|
|
<view class="guide-page__step-num">2</view>
|
|
</view>
|
|
<view class="guide-page__step-body">
|
|
<text class="guide-page__step-title">连接打印机</text>
|
|
<text class="guide-page__step-desc">
|
|
确保打印机与手机处于同一
|
|
Wi-Fi，或按打印机说明完成蓝牙配对。
|
|
</text>
|
|
<view class="guide-page__tip">
|
|
家用喷墨 / 激光打印机均可，A4 纸竖向打印即可。
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="guide-page__step guide-page__step--last">
|
|
<view class="guide-page__step-num-wrap">
|
|
<view class="guide-page__step-num">3</view>
|
|
</view>
|
|
<view class="guide-page__step-body">
|
|
<text class="guide-page__step-title">从相册打印</text>
|
|
<text class="guide-page__step-desc">
|
|
打开手机相册，选中刚保存的练习纸图片，点击分享或打印。
|
|
</text>
|
|
<view class="guide-page__tip">
|
|
<text class="guide-page__tip-line">
|
|
iPhone：分享 → 打印 → 选择打印机。
|
|
</text>
|
|
<text class="guide-page__tip-line">
|
|
Android：更多 → 打印，或使用系统相册自带的打印入口。
|
|
</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- FAQ -->
|
|
<view class="guide-page__faq-title">常见问题</view>
|
|
|
|
<view class="guide-page__faq">
|
|
<view class="guide-page__faq-item">
|
|
<text class="guide-page__faq-q">保存失败怎么办？</text>
|
|
<text class="guide-page__faq-a">
|
|
请在小程序设置中开启相册写入权限，并检查手机存储空间是否充足。
|
|
</text>
|
|
</view>
|
|
<view class="guide-page__faq-item guide-page__faq-item--last">
|
|
<text class="guide-page__faq-q">没有打印机？</text>
|
|
<text class="guide-page__faq-a">
|
|
可将图片发到电脑或拷贝至 U 盘，在打印店完成打印。
|
|
</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|