You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
<view class="container"> <!-- 顶部背景装饰 --> <view class="bg-decoration"> <view class="circle circle-1"></view> <view class="circle circle-2"></view> </view>
<!-- 分类切换卡片 --> <view class="tab-card"> <view class="category-tab"> <view class="tab-item {{currentTab === 'article' ? 'active' : ''}}" data-type="article" bindtap="switchTab"> <text class="tab-text">发布文章</text> </view> <view class="tab-item {{currentTab === 'video' ? 'active' : ''}}" data-type="video" bindtap="switchTab"> <text class="tab-text">发布视频</text> </view> </view> </view>
<!-- 文章发布表单 --> <form wx:if="{{currentTab === 'article'}}" catchsubmit="submitArticle"> <view class="form-container"> <!-- 文章标题 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">文章标题</text> <text class="required">*</text> </view> <input class="input" type="text" placeholder="请输入文章标题" placeholder-class="placeholder" bindinput="onArticleInput" data-field="title" value="{{articleForm.title}}" /> </view> </view>
<!-- 副标题 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">副标题</text> <text class="optional">选填</text> </view> <input class="input" type="text" placeholder="请输入副标题" placeholder-class="placeholder" bindinput="onArticleInput" data-field="subtitle" value="{{articleForm.subtitle}}" /> </view> </view>
<!-- 文章分类 - 新样式 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">文章分类</text> <text class="required">*</text> </view> <picker mode="selector" range="{{articleCategories}}" range-key="dictLabel" bindchange="onArticleCategoryChange" data-type="article"> <view class="category-selector"> <block wx:if="{{articleCategory}}"> <view class="category-badge" style="background: linear-gradient(135deg, {{getCategoryColor(articleCategory.dictLabel).start}} 0%, {{getCategoryColor(articleCategory.dictLabel).end}} 100%);"> {{articleCategory.dictLabel}} </view> </block> <view wx:else class="category-placeholder"> <text>请选择文章分类</text> <text class="arrow">›</text> </view> </view> </picker> </view> </view>
<!-- 文章封面 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">封面图片</text> <text class="optional">选填</text> </view> <view class="uploader-wrapper"> <view class="uploader" bindtap="chooseCover" data-type="article"> <image class="preview" src="{{articleCoverTemp || ''}}" mode="aspectFill" wx:if="{{articleCoverTemp}}"></image> <view class="upload-placeholder" wx:else> <text class="plus">+</text> <text class="hint">点击上传封面</text> </view> </view> <text class="upload-tip">建议尺寸 16:9,不超过5M</text> </view> </view> </view>
<!-- 文章内容 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">文章内容</text> <text class="required">*</text> </view> <textarea class="textarea" placeholder="写下你的精彩内容吧..." placeholder-class="placeholder" bindinput="onArticleInput" data-field="content" value="{{articleForm.content}}" auto-height maxlength="5000" /> <text class="word-count">{{articleForm.content.length || 0}}/5000</text> </view> </view>
<!-- 提交按钮 --> <view class="btn-wrapper"> <button class="submit-btn {{!articleFormValid ? 'disabled' : ''}}" form-type="submit" disabled="{{!articleFormValid || submitting}}"> <text wx:if="{{!submitting}}">发布文章</text> <text wx:else>发布中...</text> </button> </view> </view> </form>
<!-- 视频发布表单 --> <form wx:else catchsubmit="submitVideo"> <view class="form-container"> <!-- 视频标题 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">视频标题</text> <text class="required">*</text> </view> <input class="input" type="text" placeholder="请输入视频标题" placeholder-class="placeholder" bindinput="onVideoInput" data-field="title" value="{{videoForm.title}}" /> </view> </view>
<!-- 视频描述 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">视频描述</text> <text class="optional">选填</text> </view> <input class="input" type="text" placeholder="简单描述一下你的视频内容" placeholder-class="placeholder" bindinput="onVideoInput" data-field="description" value="{{videoForm.description}}" /> </view> </view>
<!-- 视频分类 - 新样式 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">视频分类</text> <text class="required">*</text> </view> <picker mode="selector" range="{{videoCategories}}" range-key="dictLabel" bindchange="onVideoCategoryChange" data-type="video"> <view class="category-selector"> <block wx:if="{{videoCategory}}"> <view class="category-badge" style="background: linear-gradient(135deg, {{getCategoryColor(videoCategory.dictLabel).start}} 0%, {{getCategoryColor(videoCategory.dictLabel).end}} 100%);"> {{videoCategory.dictLabel}} </view> </block> <view wx:else class="category-placeholder"> <text>请选择视频分类</text> <text class="arrow">›</text> </view> </view> </picker> </view> </view>
<!-- 视频封面 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">视频封面</text> <text class="optional">选填</text> </view> <view class="uploader-wrapper"> <view class="uploader" bindtap="chooseCover" data-type="video"> <image class="preview" src="{{videoCoverTemp || ''}}" mode="aspectFill" wx:if="{{videoCoverTemp}}"></image> <view class="upload-placeholder" wx:else> <text class="plus">+</text> <text class="hint">点击上传封面</text> </view> </view> </view> </view> </view>
<!-- 视频地址 --> <view class="form-card"> <view class="form-item"> <view class="label-wrapper"> <text class="label">视频地址</text> <text class="required">*</text> </view> <view class="video-picker" bindtap="chooseVideo"> <view wx:if="{{videoUrlTemp}}" class="video-info"> <text class="video-name">{{videoUrlTemp}}</text> </view> <view wx:else class="video-placeholder"> <text class="plus">+</text> <text class="hint">点击选择视频</text> </view> </view> </view> </view>
<!-- 提交按钮 --> <view class="btn-wrapper"> <button class="submit-btn {{!videoFormValid ? 'disabled' : ''}}" form-type="submit" disabled="{{!videoFormValid || submitting}}"> <text wx:if="{{!submitting}}">发布视频</text> <text wx:else>发布中...</text> </button> </view> </view> </form></view>
|