From f20a554bdb24e9dfde9dc6a69d78595944f61d15 Mon Sep 17 00:00:00 2001
From: mark <mark18340872469@163.com>
Date: 星期二, 25 十月 2022 14:53:57 +0800
Subject: [PATCH] 设备管理 样式调整
---
src/components/Price.vue | 88 +++++++++++++++++++++++++++++++++++--------
1 files changed, 71 insertions(+), 17 deletions(-)
diff --git a/src/components/Price.vue b/src/components/Price.vue
index d11da29..5078dc4 100644
--- a/src/components/Price.vue
+++ b/src/components/Price.vue
@@ -1,31 +1,67 @@
<template>
<div class="Price">
- 锟�<span class="newPrice">{{ priceNew1 }}</span
- >.00/骞�
- <span class="oldPrice">锟{ priceOld1 }}.00/骞�</span>
+ 锟�<span class="newPrice">{{ priceN1 }}</span
+ >{{ priceN2 }}/骞�
+ <span class="iconSave" v-if="showIcon">鐪�</span>
+ <span class="oldPrice">锟{ priceO1 }}{{ priceO2 }}/骞�</span>
</div>
</template>
<script>
export default {
props: {
- priceNew: {},
- priceOld: {},
- },
- computed: {
- priceNew1() {
- if (this.priceNew) {
- return this.priceNew;
- } else {
- return 0;
- }
+ priceNew: {
+ default: 0,
},
- priceOld1() {
- if (this.priceOld) {
- return this.priceOld;
+ showIcon: {
+ default: false,
+ },
+ },
+ data() {
+ return {
+ priceN1: "",
+ priceN2: "",
+ priceO1: "",
+ priceO2: "",
+ };
+ },
+ created() {
+ const priceO = (this.priceNew * 1.2 + "").split(".");
+ const priceN = (this.priceNew + "").split(".");
+ if (priceN.length > 1) {
+ this.priceN1 = priceN[0];
+ this.priceN2 = "." + priceN[1];
+ } else {
+ this.priceN1 = priceN[0];
+ this.priceN2 = ".00";
+ }
+ if (priceO.length > 1) {
+ this.priceO1 = priceO[0];
+ this.priceO2 = "." + priceO[1];
+ } else {
+ this.priceO1 = priceO[0];
+ this.priceO2 = ".00";
+ }
+ },
+
+ watch: {
+ priceNew() {
+ const priceO = (this.priceNew * 1.2 + "").split(".");
+ const priceN = (this.priceNew + "").split(".");
+ if (priceN.length > 1) {
+ this.priceN1 = priceN[0];
+ this.priceN2 = "." + priceN[1];
} else {
- return this.priceNew1 * 2;
+ this.priceN1 = priceN[0];
+ this.priceN2 = ".00";
+ }
+ if (priceO.length > 1) {
+ this.priceO1 = priceO[0];
+ this.priceO2 = "." + priceO[1];
+ } else {
+ this.priceO1 = priceO[0];
+ this.priceO2 = ".00";
}
},
},
@@ -38,6 +74,12 @@
font-size: 14px;
text-align: left;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 1;
+ overflow: hidden;
+ text-overflow: ellipsis;
+
.newPrice {
font-size: 30px;
color: rgb(255, 96, 0);
@@ -50,5 +92,17 @@
color: #999999;
text-decoration: line-through;
}
+
+ .iconSave {
+ display: inline-block;
+ width: 18px;
+ height: 18px;
+ font-size: 12px;
+ color: #fff;
+ line-height: 18px;
+ text-align: center;
+ background: #ff6000;
+ border-radius: 2px;
+ }
}
</style>
\ No newline at end of file
--
Gitblit v1.8.0