From 2e960901795b52e1a554a9f6fefb6424ff92a901 Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Tue, 23 Aug 2022 17:26:18 +0800
Subject: [PATCH] 优化数值显示组件显示细节
---
common/Tools.js | 21 ++++++++++++++++++++-
layout/numerical/cNumerical.scss | 10 +++++++++-
layout/numerical/CNumerical.vue | 20 ++++++++++++++++++--
plugins/echarts/CECharts.weapp.vue | 1 -
4 files changed, 47 insertions(+), 5 deletions(-)
diff --git a/common/Tools.js b/common/Tools.js
index 3fbb8a8..f5d896f 100644
--- a/common/Tools.js
+++ b/common/Tools.js
@@ -516,6 +516,23 @@
return /^1[3456789]\d{9}$/.test('' + phone);
}
+ /**
+ * 转换周数到日期
+ * @param year
+ * @param week
+ * @param weekDay 需要输出星期几对应的日期 (1~7)
+ * @return {Date}
+ */
+ static transWeekIndexToDate(year, week, weekDay) {
+ const yearStart = moment([year, 0, 1]);
+ const dayLong = 24 * 60 * 60 * 1000;
+ const firstWeekLong = (7 - yearStart.day()) * dayLong;
+ const weeksLong = (week - 1) * 7 * dayLong;
+ const weekDayLong = weekDay * dayLong;
+ const dayTimestamp = yearStart.valueOf() + firstWeekLong + weeksLong + weekDayLong;
+ return moment(dayTimestamp).format('YYYY-MM-DD');
+ }
+
}
// h5 中，实现 rem 转换 px
@@ -531,4 +548,6 @@
const px = (value - p1.x) * (p2.y - p1.y) / (p2.x - p1.x) + p1.y;
console.info(Math.round(px) + 'px');
};
-}
\ No newline at end of file
+}
+
+global.Tools = Tools;
\ No newline at end of file
diff --git a/layout/numerical/CNumerical.vue b/layout/numerical/CNumerical.vue
index 56ec833..04cdbfd 100644
--- a/layout/numerical/CNumerical.vue
+++ b/layout/numerical/CNumerical.vue
@@ -7,11 +7,18 @@
<view class="c-numerical at-row at-row--wrap">
<view
class="at-col"
- v-for="(item,index) in values"
+ v-for="(item,index) in values2"
:key="index"
:class="'at-col-' + valueFlex[index]"
>
- <view class="c-numerical-value">{{item.value}}</view>
+ <view class="c-numerical-value">
+ <text>{{item.integer}}</text>
+ <text
+ class="c-numerical-decimal"
+ :class="item.integer.length>6?'small':''"
+ v-if="item.decimal.length>0"
+ >.{{item.decimal}}</text>
+ </view>
<view class="c-numerical-title">{{item.title}}</view>
</view>
</view>
@@ -29,6 +36,15 @@
values: Array,
},
computed: {
+ values2() {
+ return (
+ this.values.map(item => ({
+ ...item,
+ integer: (item.value + '').split('.')[0] || '',
+ decimal: (item.value + '').split('.')[1] || '',
+ })) || []
+ );
+ },
valueFlex() {
return this.values.map((item, index) => {
const surplus = this.values.length % 3;
diff --git a/layout/numerical/cNumerical.scss b/layout/numerical/cNumerical.scss
index 6323a1c..a157478 100644
--- a/layout/numerical/cNumerical.scss
+++ b/layout/numerical/cNumerical.scss
@@ -13,9 +13,17 @@
.c-numerical-value {
font-size: 40px;
line-height: 60px;
+ .c-numerical-decimal {
+ &.small {
+ font-size: 30px;
+ }
+ &.off {
+ display: none;
+ }
+ }
}
.c-numerical-title {
- font-size: 32px;
+ font-size: 30px;
color: #666;
}
}
\ No newline at end of file
diff --git a/plugins/echarts/CECharts.weapp.vue b/plugins/echarts/CECharts.weapp.vue
index 5cce6e7..3580774 100644
--- a/plugins/echarts/CECharts.weapp.vue
+++ b/plugins/echarts/CECharts.weapp.vue
@@ -5,7 +5,6 @@
<template>
<view class="c-echarts">
- 123
<canvas
class="c-echarts-canvas"
type="2d"
--
Gitblit v1.9.1