50 lines
1.7 KiB
Plaintext
50 lines
1.7 KiB
Plaintext
<view class="container">
|
|
<!-- 顶部类型选择 -->
|
|
<view class="header-section">
|
|
<picker bindchange="bindCategoryChange" value="{{categoryIndex}}" range="{{categories}}">
|
|
<view class="category-picker">
|
|
<text class="label">当前换算</text>
|
|
<text class="value">{{categories[categoryIndex]}}</text>
|
|
<text class="arrow">▼</text>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
|
|
<view class="converter-card">
|
|
<!-- 输入区域 -->
|
|
<view class="conversion-row input-row">
|
|
<view class="row-label">输入</view>
|
|
<view class="row-content">
|
|
<input class="value-input" type="digit" placeholder="0" bindinput="bindInput" value="{{inputValue}}" />
|
|
<picker class="unit-selector" bindchange="bindFromUnitChange" value="{{fromIndex}}" range="{{currentUnits}}" range-key="name">
|
|
<view class="unit-text">
|
|
{{currentUnits[fromIndex].name}} <text class="unit-arrow">▼</text>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 分割线/转换图标 -->
|
|
<view class="divider">
|
|
<view class="icon-transfer">⇅</view>
|
|
</view>
|
|
|
|
<!-- 输出区域 -->
|
|
<view class="conversion-row output-row">
|
|
<view class="row-label">结果</view>
|
|
<view class="row-content">
|
|
<view class="value-display">{{outputValue || '0'}}</view>
|
|
<picker class="unit-selector" bindchange="bindToUnitChange" value="{{toIndex}}" range="{{currentUnits}}" range-key="name">
|
|
<view class="unit-text">
|
|
{{currentUnits[toIndex].name}} <text class="unit-arrow">▼</text>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="tips">
|
|
点击单位或数字进行修改
|
|
</view>
|
|
</view>
|