64 lines
2.1 KiB
Plaintext
64 lines
2.1 KiB
Plaintext
<!--index.wxml-->
|
||
<view class="container">
|
||
<!-- 上部：输入区域 -->
|
||
<view class="input-section">
|
||
<view class="input-row">
|
||
<input
|
||
class="word-input"
|
||
placeholder="请输入汉字（支持多个汉字）"
|
||
value="{{inputWord}}"
|
||
bindinput="onInputChange"
|
||
maxlength="20" />
|
||
<button class="generate-btn" bindtap="onGenerateClick">生成</button>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 已选择的汉字列表 -->
|
||
<view class="selected-section" wx:if="{{wordList.length > 0}}">
|
||
<view class="section-header">
|
||
<text class="section-title"
|
||
>已选择的汉字 ({{wordList.length}})</text
|
||
>
|
||
<button class="clear-btn" bindtap="onClearAll" size="mini">
|
||
清空
|
||
</button>
|
||
</view>
|
||
<view class="word-list">
|
||
<view
|
||
class="word-item selected"
|
||
wx:for="{{wordList}}"
|
||
wx:key="*this"
|
||
wx:for-item="word"
|
||
wx:for-index="index">
|
||
<text class="word-text">{{word}}</text>
|
||
<text
|
||
class="remove-btn"
|
||
bindtap="onRemoveWord"
|
||
data-index="{{index}}"
|
||
>×</text
|
||
>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 下部：可选汉字区域 -->
|
||
<view class="available-section">
|
||
<view class="section-header">
|
||
<text class="section-title"
|
||
>可选汉字 ({{availableWords.length}})</text
|
||
>
|
||
</view>
|
||
<view class="word-grid">
|
||
<view
|
||
class="word-item available {{wordList.includes(word) ? 'disabled' : ''}}"
|
||
wx:for="{{availableWords}}"
|
||
wx:key="*this"
|
||
wx:for-item="word"
|
||
bindtap="onWordSelect"
|
||
data-word="{{word}}">
|
||
<text class="word-text">{{word}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|