jasder
/
PPTist
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

优化图表编辑器和图片裁剪工具样式

This commit is contained in:
pipipi-pikachu 2021-01-19 23:51:09 +08:00
parent c77dfb4c5a
commit 952ffb2206
2 changed files with 36 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/views/Editor/Toolbar/ElementStylePanel/ChartStylePanel/ChartDataEditor.vue
View File

@ -162,11 +162,16 @@ export default defineComponent({
tempRangeSize.value = { width, height } tempRangeSize.value = { width, height }
} }
document.onmouseup = () => { document.onmouseup = e => {
isMouseDown = false isMouseDown = false
document.onmousemove = null document.onmousemove = null
document.onmouseup = null document.onmouseup = null
const endPageX = e.pageX
const endPageY = e.pageY
if(startPageX === endPageX && startPageY === endPageY) return
let width = tempRangeSize.value.width let width = tempRangeSize.value.width
let height = tempRangeSize.value.height let height = tempRangeSize.value.height
if(width % CELL_WIDTH > CELL_WIDTH * 0.5) width = width + (CELL_WIDTH - width % CELL_WIDTH) if(width % CELL_WIDTH > CELL_WIDTH * 0.5) width = width + (CELL_WIDTH - width % CELL_WIDTH)
@ -247,13 +252,31 @@ export default defineComponent({
} }
.resizable { .resizable {
position: absolute; position: absolute;
width: 8px; width: 12px;
height: 8px; height: 12px;
left: 0; left: 0;
top: 0; top: 0;
margin: -4px 0 0 -4px; margin: -9px 0 0 -9px;
background-color: $themeColor;
cursor: nwse-resize; cursor: nwse-resize;
&::after {
content: '';
position: absolute;
width: 4px;
height: 12px;
right: 0;
top: 0;
background-color: $themeColor;
}
&::before {
content: '';
position: absolute;
width: 12px;
height: 4px;
right: 0;
bottom: 0;
background-color: $themeColor;
}
} }
table { table {
width: 100%; width: 100%;

12
src/views/components/element/ImageElement/ImageClipHandler.vue
View File

@ -39,8 +39,12 @@
:key="point" :key="point"
@mousedown.stop="$event => scaleClipRange($event, point)" @mousedown.stop="$event => scaleClipRange($event, point)"
> >
<SvgWrapper width="12" height="12" fill="#fff" stroke="#666"> <SvgWrapper width="12" height="12" fill="#fff" stroke="#333">
<path d="M 12 0 L 0 0 L 0 12 L 3 12 L 3 3 L 12 3 L 12 0 Z"></path> <path
stroke-width="0.3"
shape-rendering="crispEdges"
d="M 16 0 L 0 0 L 0 16 L 4 16 L 4 4 L 16 4 L 16 0 Z"
></path>
</SvgWrapper> </SvgWrapper>
</div> </div>
</div> </div>
@ -288,8 +292,8 @@ export default defineComponent({
isSettingClipRange.value = true isSettingClipRange.value = true
let isMouseDown = true let isMouseDown = true
const minWidth = 32 / props.width * 100 const minWidth = 50 / props.width * 100
const minHeight = 32 / props.height * 100 const minHeight = 50 / props.height * 100
const startPageX = e.pageX const startPageX = e.pageX
const startPageY = e.pageY const startPageY = e.pageY