perf: 图片翻转UI优化

This commit is contained in:
pipipi-pikachu 2021-02-07 17:32:47 +08:00
parent c38ca3a6b6
commit 1b0deff1d7

View File

@ -59,24 +59,18 @@
<Button class="full-width-btn"><IconColorFilter class="btn-icon" /> 设置滤镜</Button> <Button class="full-width-btn"><IconColorFilter class="btn-icon" /> 设置滤镜</Button>
</Popover> </Popover>
<div class="row"> <CheckboxButtonGroup class="row">
<div style="flex: 2;">水平翻转</div> <CheckboxButton
<div class="switch-wrapper" style="flex: 3;"> style="flex: 1;"
<Switch :checked="flip.x === 180"
:checked="flip.x === 180" @click="updateImage({ flip: { x: flip.x === 180 ? 0 : 180, y: flip.y } })"
@change="checked => updateImage({ flip: { x: checked ? 180 : 0, y: flip.y } })" ><IconFlipVertically /> 水平翻转</CheckboxButton>
/> <CheckboxButton
</div> style="flex: 1;"
</div> :checked="flip.y === 180"
<div class="row"> @click="updateImage({ flip: { x: flip.x, y: flip.y === 180 ? 0 : 180 } })"
<div style="flex: 2;">垂直翻转</div> ><IconFlipHorizontally /> 垂直翻转</CheckboxButton>
<div class="switch-wrapper" style="flex: 3;"> </CheckboxButtonGroup>
<Switch
:checked="flip.y === 180"
@change="checked => updateImage({ flip: { x: flip.x, y: checked ? 180 : 0 } })"
/>
</div>
</div>
<Divider /> <Divider />
<ElementOutline /> <ElementOutline />