|
@@ -7,9 +7,7 @@ |
|
|
</el-scrollbar> |
|
|
</el-scrollbar> |
|
|
<div class="kr-designer-tool_bar"> |
|
|
<div class="kr-designer-tool_bar"> |
|
|
<el-button size="mini" type="success" @click="saveTemp">保存</el-button> |
|
|
<el-button size="mini" type="success" @click="saveTemp">保存</el-button> |
|
|
<el-button size="mini" type="primary" @click="previewTemp" |
|
|
|
|
|
>预览</el-button |
|
|
|
|
|
> |
|
|
|
|
|
|
|
|
<el-button size="mini" type="primary" @click="previewTemp">预览</el-button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
@@ -52,6 +50,7 @@ export default { |
|
|
// 预览模板 |
|
|
// 预览模板 |
|
|
previewTemp() { |
|
|
previewTemp() { |
|
|
let page = { ...this.$vptd.state.page }; |
|
|
let page = { ...this.$vptd.state.page }; |
|
|
|
|
|
console.log(page, 'page') |
|
|
this.$lodop.previewTemp(cloneDeep(page)); |
|
|
this.$lodop.previewTemp(cloneDeep(page)); |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
@@ -74,6 +73,7 @@ html { |
|
|
height: 100%; |
|
|
height: 100%; |
|
|
box-sizing: border-box; |
|
|
box-sizing: border-box; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.kr-designer { |
|
|
.kr-designer { |
|
|
font-family: Avenir, Helvetica, Arial, sans-serif; |
|
|
font-family: Avenir, Helvetica, Arial, sans-serif; |
|
|
-webkit-font-smoothing: antialiased; |
|
|
-webkit-font-smoothing: antialiased; |
|
@@ -84,25 +84,30 @@ html { |
|
|
text-align: left; |
|
|
text-align: left; |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-direction: row; |
|
|
flex-direction: row; |
|
|
|
|
|
|
|
|
.kr-designer-view { |
|
|
.kr-designer-view { |
|
|
flex: 1; |
|
|
flex: 1; |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
flex-direction: column; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.kr-designer-tool { |
|
|
.kr-designer-tool { |
|
|
width: 400px; |
|
|
width: 400px; |
|
|
height: 100%; |
|
|
height: 100%; |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
flex-direction: column; |
|
|
|
|
|
|
|
|
.el-scrollbar__wrap { |
|
|
.el-scrollbar__wrap { |
|
|
overflow: auto; |
|
|
overflow: auto; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
&_con { |
|
|
&_con { |
|
|
flex: 1; |
|
|
flex: 1; |
|
|
height: 100%; |
|
|
height: 100%; |
|
|
width: 100%; |
|
|
width: 100%; |
|
|
overflow: hidden; |
|
|
overflow: hidden; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
&_bar { |
|
|
&_bar { |
|
|
padding: 10px; |
|
|
padding: 10px; |
|
|
text-align: center; |
|
|
text-align: center; |
|
@@ -114,9 +119,11 @@ html { |
|
|
.el-form-item--mini.el-form-item { |
|
|
.el-form-item--mini.el-form-item { |
|
|
margin-bottom: 10px; |
|
|
margin-bottom: 10px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.min-input { |
|
|
.min-input { |
|
|
width: 100px; |
|
|
width: 100px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.unit-text { |
|
|
.unit-text { |
|
|
font-size: 12px; |
|
|
font-size: 12px; |
|
|
color: #999999; |
|
|
color: #999999; |
|
|