|
|
@@ -48,6 +48,17 @@
|
|
|
<text v-else :class="'status-' + status">{{status}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <view class="idle-fee-view" @click="showIdleFee" v-if="info.idleFee && info.idleFee.idleFee">
|
|
|
+ <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
|
+ <path d="M5.84994 5.47044C7.30544 4.29908 9.11864 3.66232 10.9869 3.66644H11.0007C12.9484 3.66644 14.7379 4.34087 16.1501 5.47044L16.8338 4.78672C17.1916 4.42886 17.7719 4.42885 18.1297 4.78672C18.4876 5.14458 18.4876 5.72479 18.1297 6.08266L17.446 6.76637C18.6174 8.22636 19.254 10.0432 19.25 11.9151C19.25 16.4711 15.5561 20.1651 11 20.1651C6.44394 20.1651 2.75 16.4711 2.75 11.9151C2.75 9.95981 3.42994 8.16406 4.56638 6.74987L4.554 6.76569L3.87053 6.08257C3.51256 5.72478 3.51248 5.14452 3.87037 4.78663C4.22818 4.42882 4.80832 4.42882 5.16614 4.78663L5.84994 5.47044ZM11 18.3336C12.7017 18.3336 14.3338 17.6575 15.5371 16.4542C16.7404 15.2509 17.4164 13.6189 17.4164 11.9171C17.4164 10.2154 16.7404 8.58333 15.5371 7.38002C14.3338 6.1767 12.7017 5.50069 11 5.50069C9.29825 5.50069 7.66621 6.1767 6.46289 7.38002C5.25958 8.58333 4.58356 10.2154 4.58356 11.9171C4.58356 13.6189 5.25958 15.2509 6.46289 16.4542C7.66621 17.6575 9.29825 18.3336 11 18.3336ZM7.33356 1.83322C7.33356 1.32689 7.74402 0.916437 8.25034 0.916437H13.7503C14.2567 0.916437 14.6671 1.32689 14.6671 1.83322C14.6671 2.33954 14.2567 2.75 13.7503 2.75H8.25034C7.74402 2.75 7.33356 2.33954 7.33356 1.83322Z" fill="#333333"/>
|
|
|
+ <path d="M11.9163 10.4999C11.9163 10.7761 12.1402 10.9999 12.4163 10.9999H13.6509C14.0657 10.9999 14.3001 11.476 14.0472 11.8048L10.9791 15.7933C10.688 16.1717 10.0828 15.9659 10.0828 15.4885V13.3335C10.0828 13.0574 9.85891 12.8335 9.58276 12.8335H8.34777C7.93301 12.8335 7.69859 12.3576 7.95136 12.0288L11.0199 8.03695C11.3109 7.65837 11.9163 7.86417 11.9163 8.34167V10.4999Z" fill="#009E81"/>
|
|
|
+ </svg>
|
|
|
+ <text class="idle-fee-lebel">This site has idle fees enabled.</text>
|
|
|
+ <i-icon
|
|
|
+ name="arrow-right-s-line"
|
|
|
+ size="48rpx"
|
|
|
+ color="#333"/>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -55,9 +66,9 @@
|
|
|
export default {
|
|
|
name: "StatusView",
|
|
|
props: {
|
|
|
- title: {
|
|
|
- type: String,
|
|
|
- default: ""
|
|
|
+ info: {
|
|
|
+ type: Object,
|
|
|
+ default: () => ({})
|
|
|
},
|
|
|
status: {
|
|
|
type: String,
|
|
|
@@ -124,7 +135,25 @@ export default {
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
-
|
|
|
+ showIdleFee() {
|
|
|
+ const idle = this.info.idleFee;
|
|
|
+ let days = "", times = "";
|
|
|
+ if (idle.repeatDay) {
|
|
|
+ days = idle.repeatDay.join(", ")
|
|
|
+ }
|
|
|
+ if (idle.allDay) {
|
|
|
+ times = "All day"
|
|
|
+ } else {
|
|
|
+ times = idle.startTime + " - " + idle.endTime;
|
|
|
+ }
|
|
|
+ const message = `Effective Days: ${days}\nEffective Time: ${times}\nGrace Period: ${idle.idleGracePeriod} min\nCharging Rate: ${idle.idleFee}/${idle.idleInterval} min\nIdle Fee Cap: ${idle.idleFeeCap}`
|
|
|
+ uni.showModal({
|
|
|
+ title: "Idle Fees",
|
|
|
+ content: message,
|
|
|
+ showCancel: false,
|
|
|
+ confirmText: "CLOSE"
|
|
|
+ })
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -261,6 +290,23 @@ export default {
|
|
|
font-size: 22rpx;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
+.idle-fee-view {
|
|
|
+ width: calc(100vw - 112rpx);
|
|
|
+ display: flex;
|
|
|
+ padding: 10rpx 24rpx;
|
|
|
+ margin-top: 64rpx;
|
|
|
+ margin-bottom: -32rpx;
|
|
|
+ border-radius: 30px;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #e6f1ef;
|
|
|
+}
|
|
|
+.idle-fee-lebel {
|
|
|
+ flex: 1;
|
|
|
+ color: #333;
|
|
|
+ padding-left: 16rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
@keyframes loading {
|
|
|
0% {
|
|
|
transform: rotate(0deg);
|
wudebin