|
@@ -44,10 +44,10 @@
|
|
|
</div>
|
|
|
<div class="card-setting">
|
|
|
<div class="card-left" :style="`max-height: ${params.cardHeight}mm;max-width: ${params.cardWidth}mm;`">
|
|
|
- <i v-if="params.paddingTop > 0&¶ms.paddingLeft > 0" class="el-icon-arrow-down icon1" :style="`top:${params.paddingTop}mm;left:${params.paddingLeft}mm;`"></i>
|
|
|
- <i v-if="params.paddingTop > 0&¶ms.paddingRight > 0" class="el-icon-arrow-down icon2" :style="`top:${params.paddingTop}mm;right:${params.paddingRight}mm;`"></i>
|
|
|
- <i v-if="params.paddingBottom > 0&¶ms.paddingLeft > 0" class="el-icon-arrow-down icon3" :style="`bottom:${params.paddingBottom}mm;left:${params.paddingLeft}mm;`"></i>
|
|
|
- <i v-if="params.paddingBottom > 0&¶ms.paddingRight > 0" class="el-icon-arrow-down icon4" :style="`bottom:${params.paddingBottom}mm;right:${params.paddingRight}mm;`"></i>
|
|
|
+ <i v-if="showArrow(1)" class="el-icon-arrow-down icon1" :style="`top:${directionPadding('top')}mm;left:${directionPadding('left')}mm;`"></i>
|
|
|
+ <i v-if="showArrow(2)" class="el-icon-arrow-down icon2" :style="`top:${directionPadding('top')}mm;right:${directionPadding('right')}mm;`"></i>
|
|
|
+ <i v-if="showArrow(3)" class="el-icon-arrow-down icon3" :style="`bottom:${directionPadding('bottom')}mm;left:${directionPadding('left')}mm;`"></i>
|
|
|
+ <i v-if="showArrow(4)" class="el-icon-arrow-down icon4" :style="`bottom:${directionPadding('bottom')}mm;right:${directionPadding('right')}mm;`"></i>
|
|
|
<div v-html="cardHtml"></div>
|
|
|
</div>
|
|
|
<div class="card-right">
|
|
@@ -286,10 +286,10 @@ export default {
|
|
|
name: "左中",
|
|
|
value: 2,
|
|
|
},
|
|
|
- {
|
|
|
- name: "左下",
|
|
|
- value: 3,
|
|
|
- },
|
|
|
+ // {
|
|
|
+ // name: "左下",
|
|
|
+ // value: 3,
|
|
|
+ // },
|
|
|
{
|
|
|
name: "中上",
|
|
|
value: 4,
|
|
@@ -298,10 +298,10 @@ export default {
|
|
|
name: "中",
|
|
|
value: 5,
|
|
|
},
|
|
|
- {
|
|
|
- name: "中下",
|
|
|
- value: 6,
|
|
|
- },
|
|
|
+ // {
|
|
|
+ // name: "中下",
|
|
|
+ // value: 6,
|
|
|
+ // },
|
|
|
{
|
|
|
name: "右上",
|
|
|
value: 7,
|
|
@@ -310,10 +310,10 @@ export default {
|
|
|
name: "右中",
|
|
|
value: 8,
|
|
|
},
|
|
|
- {
|
|
|
- name: "右下",
|
|
|
- value: 9,
|
|
|
- },
|
|
|
+ // {
|
|
|
+ // name: "右下",
|
|
|
+ // value: 9,
|
|
|
+ // },
|
|
|
],
|
|
|
dialogVisible: false,
|
|
|
};
|
|
@@ -344,10 +344,10 @@ export default {
|
|
|
${this.contentStyle(this.params.direction)[0]}
|
|
|
}
|
|
|
.card-con {
|
|
|
- margin-top: ${this.params.paddingTop}mm;
|
|
|
- margin-right: ${this.params.paddingRight}mm;
|
|
|
- margin-bottom: ${this.params.paddingBottom}mm;
|
|
|
- margin-left: ${this.params.paddingLeft}mm;
|
|
|
+ margin-top: ${this.directionPadding("top")}mm;
|
|
|
+ margin-right: ${this.directionPadding("right")}mm;
|
|
|
+ margin-bottom: ${this.directionPadding("bottom")}mm;
|
|
|
+ margin-left: ${this.directionPadding("left")}mm;
|
|
|
font-size:35px;
|
|
|
font-family: ${this.params.fontFamily};
|
|
|
${this.contentStyle(this.params.direction)[1]}
|
|
@@ -377,8 +377,106 @@ export default {
|
|
|
deep: true,
|
|
|
},
|
|
|
},
|
|
|
+ // 生命周期 - 创建完成(可以访问当前this实例)
|
|
|
+ created() {
|
|
|
+ this.getNewShopList();
|
|
|
+ this.getCloudPrinterList();
|
|
|
+ this.getCloudConfigList();
|
|
|
+ this.getConfig();
|
|
|
+ },
|
|
|
+ // 生命周期 - 挂载完成(可以访问DOM元素)
|
|
|
+ mounted() {},
|
|
|
+ // 生命周期 - 创建之前
|
|
|
+ beforeCreate() {},
|
|
|
+ // 生命周期 - 挂载之前
|
|
|
+ beforeMount() {},
|
|
|
+ // 生命周期 - 更新之前
|
|
|
+ beforeUpdate() {},
|
|
|
+ // 生命周期 - 更新之后
|
|
|
+ updated() {},
|
|
|
+ // 生命周期 - 销毁之前
|
|
|
+ beforeDestroy() {},
|
|
|
+ // 生命周期 - 销毁完成
|
|
|
+ destroyed() {},
|
|
|
+ // 如果页面有keep-alive缓存功能,这个函数会触发
|
|
|
+ activated() {},
|
|
|
// 方法集合
|
|
|
methods: {
|
|
|
+ directionPadding(flag) {
|
|
|
+ let num = 0;
|
|
|
+ switch (flag) {
|
|
|
+ case "top":
|
|
|
+ num =
|
|
|
+ this.params.direction === 1
|
|
|
+ ? this.params.paddingTop
|
|
|
+ : this.params.paddingLeft;
|
|
|
+ break;
|
|
|
+ case "right":
|
|
|
+ num =
|
|
|
+ this.params.direction === 1
|
|
|
+ ? this.params.paddingRight
|
|
|
+ : this.params.paddingTop;
|
|
|
+ break;
|
|
|
+ case "bottom":
|
|
|
+ num =
|
|
|
+ this.params.direction === 1
|
|
|
+ ? this.params.paddingBottom
|
|
|
+ : this.params.paddingRight;
|
|
|
+ break;
|
|
|
+ case "left":
|
|
|
+ num =
|
|
|
+ this.params.direction === 1
|
|
|
+ ? this.params.paddingLeft
|
|
|
+ : this.params.paddingBottom;
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ return num;
|
|
|
+ },
|
|
|
+ showArrow(flag) {
|
|
|
+ let isShow = false;
|
|
|
+ if (this.params.direction === 1) {
|
|
|
+ switch (flag) {
|
|
|
+ case 1:
|
|
|
+ isShow = this.params.paddingTop > 0 && this.params.paddingLeft > 0;
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ isShow = this.params.paddingTop > 0 && this.params.paddingRight > 0;
|
|
|
+ break;
|
|
|
+ case 3:
|
|
|
+ isShow =
|
|
|
+ this.params.paddingBottom > 0 && this.params.paddingLeft > 0;
|
|
|
+ break;
|
|
|
+ case 4:
|
|
|
+ isShow =
|
|
|
+ this.params.paddingBottom > 0 && this.params.paddingRight > 0;
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ switch (flag) {
|
|
|
+ case 1:
|
|
|
+ isShow =
|
|
|
+ this.params.paddingLeft > 0 && this.params.paddingBottom > 0;
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ isShow = this.params.paddingLeft > 0 && this.params.paddingTop > 0;
|
|
|
+ break;
|
|
|
+ case 3:
|
|
|
+ isShow =
|
|
|
+ this.params.paddingRight > 0 && this.params.paddingBottom > 0;
|
|
|
+ break;
|
|
|
+ case 4:
|
|
|
+ isShow = this.params.paddingRight > 0 && this.params.paddingTop > 0;
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return isShow;
|
|
|
+ },
|
|
|
...mapMutations(["SET_USERINFO"]),
|
|
|
checkCardWidth(e) {
|
|
|
if (e < 195) {
|
|
@@ -763,29 +861,6 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
},
|
|
|
- // 生命周期 - 创建完成(可以访问当前this实例)
|
|
|
- created() {
|
|
|
- this.getNewShopList();
|
|
|
- this.getCloudPrinterList();
|
|
|
- this.getCloudConfigList();
|
|
|
- this.getConfig();
|
|
|
- },
|
|
|
- // 生命周期 - 挂载完成(可以访问DOM元素)
|
|
|
- mounted() {},
|
|
|
- // 生命周期 - 创建之前
|
|
|
- beforeCreate() {},
|
|
|
- // 生命周期 - 挂载之前
|
|
|
- beforeMount() {},
|
|
|
- // 生命周期 - 更新之前
|
|
|
- beforeUpdate() {},
|
|
|
- // 生命周期 - 更新之后
|
|
|
- updated() {},
|
|
|
- // 生命周期 - 销毁之前
|
|
|
- beforeDestroy() {},
|
|
|
- // 生命周期 - 销毁完成
|
|
|
- destroyed() {},
|
|
|
- // 如果页面有keep-alive缓存功能,这个函数会触发
|
|
|
- activated() {},
|
|
|
};
|
|
|
</script>
|
|
|
|