提交 8f7f1188 authored 作者: wangjiahao's avatar wangjiahao

refactor: 优化辅助设计

上级 715d1230
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<!-- 网格线 --> <!-- 网格线 -->
<Grid v-if="showGrid" :matrix-style="matrixStyle" /> <Grid v-if="showGrid" :matrix-style="matrixStyle" />
<!-- positionBox:{{positionBoxInfo}}--> <!-- positionBox:{{positionBoxInfo}}-->
<!-- <PGrid v-if="psDebug" :position-box="positionBoxInfoArray" :matrix-style="matrixStyle" />--> <PGrid v-if="psDebug" :position-box="positionBoxInfoArray" :matrix-style="matrixStyle" />
<!-- 仪表板联动清除按钮--> <!-- 仪表板联动清除按钮-->
<canvas-opt-bar /> <canvas-opt-bar />
...@@ -293,15 +293,20 @@ function resetPositionBox() { ...@@ -293,15 +293,20 @@ function resetPositionBox() {
* @param {any} item * @param {any} item
*/ */
function addItemToPositionBox(item) { function addItemToPositionBox(item) {
const pb = positionBox try {
if (item.x <= 0 || item.y <= 0) return const pb = positionBox
if (item.x <= 0 || item.y <= 0) return
for (let i = item.x - 1; i < item.x - 1 + item.sizex; i++) {
for (let j = item.y - 1; j < item.y - 1 + item.sizey; j++) { for (let i = item.x - 1; i < item.x - 1 + item.sizex; i++) {
if (pb[j][i]) { for (let j = item.y - 1; j < item.y - 1 + item.sizey; j++) {
pb[j][i].el = item if (pb[j][i]) {
pb[j][i].el = item
}
} }
} }
} catch (e) {
// igonre
console.log('addItemToPositionBox failed')
} }
} }
...@@ -878,7 +883,7 @@ export default { ...@@ -878,7 +883,7 @@ export default {
data() { data() {
return { return {
boardSetVisible: false, boardSetVisible: false,
psDebug: false, // 定位调试模式 psDebug: true, // 定位调试模式
editorX: 0, editorX: 0,
editorY: 0, editorY: 0,
start: { // 选中区域的起点 start: { // 选中区域的起点
...@@ -1014,8 +1019,10 @@ export default { ...@@ -1014,8 +1019,10 @@ export default {
watch: { watch: {
matrixCount: { matrixCount: {
handler(newVal, oldVal) { handler(newVal, oldVal) {
const pointScale = newVal.x / oldVal.x if (newVal && oldVal) {
this.changeScale(pointScale) this.changeComponentSizePoint(newVal.x / oldVal.x)
}
this.changeScale()
} }
}, },
customStyle: { customStyle: {
...@@ -1241,17 +1248,17 @@ export default { ...@@ -1241,17 +1248,17 @@ export default {
}, },
// 修改矩阵点 // 修改矩阵点
changeComponentSizePoint(pointScale) { changeComponentSizePoint(pointScale) {
this.componentData.forEach((item, index) => { if (pointScale) {
item.x = (item.x - 1) * pointScale + 1 this.componentData.forEach((item, index) => {
item.y = (item.y - 1) * pointScale + 1 item.x = (item.x - 1) * pointScale + 1
item.sizex = item.sizex * pointScale item.y = (item.y - 1) * pointScale + 1
item.sizey = item.sizey * pointScale item.sizex = item.sizex * pointScale
// this.componentData[index] = item item.sizey = item.sizey * pointScale
}) })
}
}, },
changeScale(pointScale) { changeScale() {
this.changeComponentSizePoint(pointScale)
// 1.3 版本重新设计仪表板定位方式,基准画布宽高为 1600*900 宽度自适应当前画布获取缩放比例scaleWidth // 1.3 版本重新设计仪表板定位方式,基准画布宽高为 1600*900 宽度自适应当前画布获取缩放比例scaleWidth
// 高度缩放比例scaleHeight = scaleWidth 基础矩阵为128*72 矩阵原始宽度12.5*12.5 矩阵高度可以调整 // 高度缩放比例scaleHeight = scaleWidth 基础矩阵为128*72 矩阵原始宽度12.5*12.5 矩阵高度可以调整
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
width="400" width="400"
trigger="click" trigger="click"
> >
<el-col> <el-col v-if="aidedDesign">
<el-form ref="aidedForm" label-width="110px" size="mini"> <el-form ref="aidedForm" label-width="110px" size="mini">
<el-form-item :label="'辅助网格'" class="form-item form-item-slider"> <el-form-item :label="'辅助网格'" class="form-item form-item-slider">
<el-checkbox v-model="aidedDesign.showGrid" size="mini" @change="onChangePanelStyle" /> <el-checkbox v-model="aidedDesign.showGrid" size="mini" @change="onChangePanelStyle" />
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论