97 lines
3.7 KiB
Plaintext
97 lines
3.7 KiB
Plaintext
<view class="page-container">
|
|
<view class="wrapper">
|
|
<text class="wrapper-title">设置文字和颜色12</text>
|
|
<word-input bind:onConfirm="onConfirmInput" />
|
|
<view class="word-card-box">
|
|
<block
|
|
wx:for="{{cardList}}"
|
|
wx:for-item="item"
|
|
wx:for-index="index">
|
|
<view class="word-card-list" wx:if="{{index % 2 === 0}}">
|
|
<word-card
|
|
key="{{index}}"
|
|
word="{{item.word}}"
|
|
color="{{item.color}}"
|
|
bind:onDelete="deleteWordCard"
|
|
bind:onColorTap="onColorTap" />
|
|
<word-card
|
|
wx:if="{{cardList[index + 1]}}"
|
|
key="{{index + 1}}"
|
|
word="{{cardList[index + 1].word}}"
|
|
color="{{cardList[index + 1].color}}"
|
|
bind:onDelete="deleteWordCard"
|
|
bind:onColorTap="onColorTap" />
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
<view
|
|
id="previewWrapper"
|
|
class="wrapper {{cardList.length > 0 ? '' : 'hidden'}}">
|
|
<text class="wrapper-title">预览打印效果</text>
|
|
<view id="canvasWrapper" class="canvas-wrapper">
|
|
<canvas
|
|
type="2d"
|
|
id="canvasContent"
|
|
class="canvas-content"
|
|
style="width:{{boxWidth}}px;height:{{boxHeight}}px" />
|
|
</view>
|
|
</view>
|
|
<view class="empty"></view>
|
|
<color-picker
|
|
show="{{showColorPopup}}"
|
|
currentColor="{{currentColor}}"
|
|
bind:onClose="onCloseColorPopup" />
|
|
<!-- <van-popup
|
|
show="{{ showColorPopup }}"
|
|
bind:close="onClose"
|
|
custom-class="color-picker-popup">
|
|
<view class="color-picker-container">
|
|
<text class="color-picker-title">选择颜色</text>
|
|
<view class="color-options-title">
|
|
<text class="color-options-title-text">基础12色</text>
|
|
<view class="color-options-title-line"></view>
|
|
</view>
|
|
<view class="color-options">
|
|
<block wx:for="{{WATER_COLORS.basic12}}" wx:key="index">
|
|
<view
|
|
class="color-option"
|
|
style="background-color: {{item.hex}};"
|
|
bindtap="onSelectColor"
|
|
data-color="{{item.hex}}"></view>
|
|
</block>
|
|
</view>
|
|
<view class="color-options-title">
|
|
<text class="color-options-title-text">扩展24色</text>
|
|
<view class="color-options-title-line"></view>
|
|
</view>
|
|
<view class="color-options">
|
|
<block wx:for="{{WATER_COLORS.extended24}}" wx:key="index">
|
|
<view
|
|
class="color-option"
|
|
style="background-color: {{item.hex}};"
|
|
bindtap="onSelectColor"
|
|
data-color="{{item.hex}}"></view>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
</van-popup> -->
|
|
</view>
|
|
<view class="btn-area">
|
|
<!-- <view
|
|
class="btn btn-green {{cardList.length > 0 ? '' : 'disabled'}}"
|
|
bindtap="exportToPrint">
|
|
<van-icon class-prefix="j-icon" name="download" size="44rpx" />
|
|
<text class="btn-text">下载打印</text>
|
|
</view> -->
|
|
<toy-button
|
|
type="green"
|
|
bind:click="exportToPrint"
|
|
width="680rpx"
|
|
disabled="{{cardList.length <= 0}}"
|
|
icon="download"
|
|
icon-class-prefix="j-icon">
|
|
下载打印
|
|
</toy-button>
|
|
</view>
|