101 lines
4.6 KiB
Plaintext
101 lines
4.6 KiB
Plaintext
<view class="record-page">
|
|
<custom-nav content-height="86" padding-x="34">
|
|
<view class="record-nav">
|
|
<view class="nav-back" bindtap="handleBack"><text></text></view>
|
|
<view class="nav-title-wrap">
|
|
<text class="nav-title">设置数字人</text>
|
|
<text class="nav-subtitle">上传照片和录音，生成你的专属数字人</text>
|
|
</view>
|
|
<view class="nav-space"></view>
|
|
</view>
|
|
</custom-nav>
|
|
|
|
<view class="record-content">
|
|
<view class="panel photo-panel">
|
|
<text class="panel-title">上传数字人照片</text>
|
|
<view class="photo-body">
|
|
<view class="photo-preview">
|
|
<image class="portrait-bg icon-placeholder" src="{{ avatar }}" mode="aspectFit"></image>
|
|
<view class="camera-badge"><image class="camera-icon icon-placeholder" style="width: 60%;height: 60%;" src="/static/images/carram_white.png" mode="aspectFit"></image></view>
|
|
</view>
|
|
|
|
<view class="photo-actions">
|
|
<view class="primary-small" bindtap="handleUploadPhoto">上传照片</view>
|
|
<view class="ghost-small" bindtap="handleUseDefaultAvatar">使用默认形象</view>
|
|
</view>
|
|
</view>
|
|
<view class="hint-row">
|
|
<image class="hint-dot icon-placeholder" src="/static/images/zhuyi1.png" mode="aspectFit"></image>
|
|
<text>建议上传清晰正脸照片，生成效果更自然</text>
|
|
</view>
|
|
<!-- <view wx:if="{{avatarChecked}}" class="asset-status success-status">照片检测通过</view> -->
|
|
</view>
|
|
|
|
<view class="panel voice-panel">
|
|
<text class="panel-title">录取专属音色</text>
|
|
<view class="voice-body">
|
|
<view class="voice-visual {{recordingClass}}">
|
|
<view wx:if="{{isRecording}}" class="recording-pill"><text></text><text>录制中</text></view>
|
|
<view class="wave-row wave-left">
|
|
<text wx:for="{{waveBars}}" wx:key="id" class="{{item.cls}}"></text>
|
|
</view>
|
|
<view class="mic-wrap">
|
|
<view class="pulse-ring ring-one"></view>
|
|
<view class="pulse-ring ring-two"></view>
|
|
<view class="pulse-ring ring-three"></view>
|
|
<view class="mic-core">
|
|
<image class="mic-icon icon-placeholder" style="width: 60%;height: 60%;" src="/static/images/mic.png" mode="aspectFit"></image>
|
|
</view>
|
|
</view>
|
|
<view class="wave-row wave-right">
|
|
<text wx:for="{{waveBars}}" wx:key="id" class="{{item.cls}}"></text>
|
|
</view>
|
|
<text class="record-time">{{recordTime}}</text>
|
|
</view>
|
|
|
|
<view class="voice-actions">
|
|
<view class="primary-small" wx:if="{{!isRecording}}" bindtap="handleRecord">录取音色</view>
|
|
<view class="stop-small" wx:if="{{isRecording}}" bindtap="handleStopRecord">
|
|
<image class="stop-dot icon-placeholder" style="width: 40rpx;height: 40rpx;" src="/static/images/stop.png" mode="aspectFit"></image>
|
|
<text>停止录制</text>
|
|
</view>
|
|
<view class="ghost-small" bindtap="handleUseDefaultVoice">使用默认音色</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="hint-row voice-hint">
|
|
<image class="hint-dot icon-placeholder" src="/static/images/zhuyi1.png" mode="aspectFit"></image>
|
|
<text>建议录制 10 秒以上，环境安静效果更佳</text>
|
|
</view>
|
|
<!-- <view wx:if="{{voiceStatusText}}" class="asset-status {{voiceChecked ? 'success-status' : 'pending-status'}}">{{voiceStatusText}}</view> -->
|
|
|
|
<view class="script-section">
|
|
<text class="script-title">朗读以下文案（约10秒）</text>
|
|
<view class="script-card">
|
|
<text>大家好，我是你的数字人口播助手。今天为大家带来一段精彩的内容介绍。</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="default-section">
|
|
<text class="default-title">默认选项（可直接体验）</text>
|
|
<view class="default-row">
|
|
<view class="default-card">
|
|
<image class="mini-avatar icon-placeholder" src="https://cdn.zhuangb123.com/chat-square/EB3D71A23725-6CD76-956EFD1DB-0C25B0.jpg" mode="aspectFit"></image>
|
|
<text class="default-name">默认数字人</text>
|
|
<text class="trial-pill">可直接体验</text>
|
|
</view>
|
|
<view class="default-card">
|
|
<image class="mini-voice icon-placeholder" src="/static/images/ys.png" mode="aspectFit"></image>
|
|
<text class="default-name">默认音色</text>
|
|
<text class="trial-pill blue-pill">可直接体验</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="next-action" bindtap="handleNext">下一步：选择视频背景</view>
|
|
</view>
|
|
</view>
|
|
|
|
|