HolyKnightIX vor 10 Monaten
Ursprung
Commit
33f6218d30
2 geänderte Dateien mit 31 neuen und 22 gelöschten Zeilen
  1. +21
    -2
      src/components/panel/page.vue
  2. +10
    -20
      src/components/viewport/index.vue

+ 21
- 2
src/components/panel/page.vue Datei anzeigen

@@ -32,8 +32,13 @@
<el-input-number v-model="pageInfo.pageHeight" controls-position="right" :min="0" class="min-input" <el-input-number v-model="pageInfo.pageHeight" controls-position="right" :min="0" class="min-input"
@input="shapeChanged('pageHeight')"></el-input-number> @input="shapeChanged('pageHeight')"></el-input-number>
<span class="unit-text">(mm)</span> <span class="unit-text">(mm)</span>
<span class="unit-text">(mm)</span>
</el-form-item> </el-form-item>
</el-row> </el-row>
<el-row>
<el-button size="mini" type="primary" @click="selectPage(1)">A4纸张预设</el-button>
<el-button size="mini" type="primary" @click="selectPage(2)">标准收据预设</el-button>
</el-row>
</el-form> </el-form>
</div> </div>
</template> </template>
@@ -50,9 +55,23 @@ export default {
// 宽度与高度的比例必须约等于纸张宽度与纸张高度的比例,否则拖拽组件将错位 // 宽度与高度的比例必须约等于纸张宽度与纸张高度的比例,否则拖拽组件将错位
shapeChanged(element) { shapeChanged(element) {
if (element === "pageWidth") { if (element === "pageWidth") {
this.pageInfo.width = this.pageInfo.pageWidth * 2
this.pageInfo.width = this.pageInfo.pageWidth * 2.5
} else if (element === "pageHeight") { } else if (element === "pageHeight") {
this.pageInfo.height = this.pageInfo.pageHeight * 2
this.pageInfo.height = this.pageInfo.pageHeight * 2.5
}
},

selectPage(num) {
if (num == 1) {
this.pageInfo.pageWidth = 210
this.pageInfo.pageHeight = 297
this.shapeChanged("pageWidth")
this.shapeChanged("pageHeight")
} else if (num == 2) {
this.pageInfo.pageWidth = 210
this.pageInfo.pageHeight = 105
this.shapeChanged("pageWidth")
this.shapeChanged("pageHeight")
} }
} }
} }


+ 10
- 20
src/components/viewport/index.vue Datei anzeigen

@@ -1,25 +1,14 @@
<template> <template>
<div id="viewport" data-type="viewport" class="holder"> <div id="viewport" data-type="viewport" class="holder">
<div
:style="{
height: page.height + 'px',
width: page.width + 'px',
backgroundImage: 'url('+backImg+')'
}"
class="screen"
>
<div :style="{
height: page.height + 'px',
width: page.width + 'px',
backgroundImage: 'url(' + backImg + ')'
}" class="screen">
<!-- 组件 --> <!-- 组件 -->
<component
v-for="val in widgetStore"
:is="val.type"
:data-title="val.type"
:class="{'active': widgetId === val.uuid}"
:key="val.uuid"
:val="val"
:data-type="val.type"
:data-uuid="val.uuid"
class="layer"
></component>
<component v-for="val in widgetStore" :is="val.type" :data-title="val.type"
:class="{ 'active': widgetId === val.uuid }" :key="val.uuid" :val="val" :data-type="val.type" :data-uuid="val.uuid"
class="layer"></component>


<!-- 参考线 --> <!-- 参考线 -->
<!-- <ref /> --> <!-- <ref /> -->
@@ -153,7 +142,7 @@ export default {
.holder { .holder {
display: flex; display: flex;
justify-content: center; justify-content: center;
overflow: auto;
overflow: scroll;
font-size: 0; font-size: 0;
border: 1px solid #f5f5f5; border: 1px solid #f5f5f5;
border-width: 0 1px; border-width: 0 1px;
@@ -162,6 +151,7 @@ export default {
background-position: 0 0, 13px 13px; background-position: 0 0, 13px 13px;
background-size: 26px 26px; background-size: 26px 26px;
} }

.screen { .screen {
margin: 25px auto; margin: 25px auto;
transform-origin: center top; transform-origin: center top;


Laden…
Abbrechen
Speichern