@10yun/cv-mobile-ui 0.5.53 → 0.5.55

package/uni-ui/lib/uni-datetime-picker/keypress.js

@@ -0,0 +1,45 @@
+// #ifdef H5
+export default {
+  name: 'Keypress',
+  props: {
+    disable: {
+      type: Boolean,
+      default: false
+    }
+  },
+  mounted () {
+    const keyNames = {
+      esc: ['Esc', 'Escape'],
+      tab: 'Tab',
+      enter: 'Enter',
+      space: [' ', 'Spacebar'],
+      up: ['Up', 'ArrowUp'],
+      left: ['Left', 'ArrowLeft'],
+      right: ['Right', 'ArrowRight'],
+      down: ['Down', 'ArrowDown'],
+      delete: ['Backspace', 'Delete', 'Del']
+    }
+    const listener = ($event) => {
+      if (this.disable) {
+        return
+      }
+      const keyName = Object.keys(keyNames).find(key => {
+        const keyName = $event.key
+        const value = keyNames[key]
+        return value === keyName || (Array.isArray(value) && value.includes(keyName))
+      })
+      if (keyName) {
+        // 避免和其他按键事件冲突
+        setTimeout(() => {
+          this.$emit(keyName, {})
+        }, 0)
+      }
+    }
+    document.addEventListener('keyup', listener)
+    this.$once('hook:beforeDestroy', () => {
+      document.removeEventListener('keyup', listener)
+    })
+  },
+	render: () => {}
+}
+// #endif

package/uni-ui/lib/uni-datetime-picker/package.json

@@ -0,0 +1,107 @@
+{
+  "id": "uni-datetime-picker",
+  "displayName": "uni-datetime-picker 日期选择器",
+  "version": "2.2.42",
+  "description": "uni-datetime-picker 日期时间选择器，支持日历，支持范围选择",
+  "keywords": [
+    "uni-datetime-picker",
+    "uni-ui",
+    "uniui",
+    "日期时间选择器",
+    "日期时间"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": "",
+    "uni-app": "^4.07",
+    "uni-app-x": ""
+  },
+  "directories": {
+    "example": "../../temps/example_temps"
+  },
+  "dcloudext": {
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
+    "type": "component-vue",
+    "darkmode": "x",
+    "i18n": "x",
+    "widescreen": "x"
+  },
+  "uni_modules": {
+    "dependencies": [
+      "uni-scss",
+      "uni-icons"
+    ],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "x",
+        "aliyun": "x",
+        "alipay": "x"
+      },
+      "client": {
+        "uni-app": {
+          "vue": {
+            "vue2": "√",
+            "vue3": "√"
+          },
+          "web": {
+            "safari": "√",
+            "chrome": "√"
+          },
+          "app": {
+            "vue": "√",
+            "nvue": "√",
+            "android": "√",
+            "ios": "√",
+            "harmony": "√"
+          },
+          "mp": {
+            "weixin": "√",
+            "alipay": "√",
+            "toutiao": "√",
+            "baidu": "√",
+            "kuaishou": "-",
+            "jd": "-",
+            "harmony": "-",
+            "qq": "√",
+            "lark": "-"
+          },
+          "quickapp": {
+            "huawei": "√",
+            "union": "√"
+          }
+        },
+        "uni-app-x": {
+          "web": {
+            "safari": "-",
+            "chrome": "-"
+          },
+          "app": {
+            "android": "-",
+            "ios": "-",
+            "harmony": "-"
+          },
+          "mp": {
+            "weixin": "-"
+          }
+        }
+      }
+    }
+  }
+}

package/uni-ui/lib/uni-datetime-picker/readme.md

@@ -0,0 +1,20 @@
+
+
+> `重要通知：组件升级更新 2.0.0 后，支持日期+时间范围选择，组件 ui 将使用日历选择日期，ui 变化较大，同时支持 PC 和 移动端。此版本不向后兼容，不再支持单独的时间选择（type=time）及相关的 hide-second 属性（时间选可使用内置组件 picker）。若仍需使用旧版本，可在插件市场下载*非uni_modules版本*，旧版本将不再维护`
+
+## DatetimePicker 时间选择器
+
+> **组件名：uni-datetime-picker**
+> 代码块： `uDatetimePicker`
+
+
+该组件的优势是，支持**时间戳**输入和输出（起始时间、终止时间也支持时间戳），可**同时选择**日期和时间。
+
+若只是需要单独选择日期和时间，不需要时间戳输入和输出，可使用原生的 picker 组件。
+
+**_点击 picker 默认值规则：_**
+
+- 若设置初始值 value, 会显示在 picker 显示框中
+- 若无初始值 value，则初始值 value 为当前本地时间 Date.now()， 但不会显示在 picker 显示框中
+
+### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-datetime-picker)

package/uni-ui/lib/uni-datetime-picker/time-picker.vue

@@ -89,11 +89,13 @@
     </view>
   </view>
 </template>
+
 <script>
 import { initVueI18n } from '@dcloudio/uni-i18n';
 import i18nMessages from './i18n/index.js';
 const { t } = initVueI18n(i18nMessages);
 import { fixIosDateFormat } from './util';
+
 /**
  * DatetimePicker 时间选择器
  * @description 可以同时选择日期和时间的选择器
@@ -106,6 +108,7 @@ import { fixIosDateFormat } from './util';
  * @property {String} return-type = [timestamp | string]
  * @event {Function} change  选中发生变化触发
  */
+
 export default {
   name: 'UniDatetimePicker',
   data() {
@@ -141,6 +144,14 @@ export default {
       endSecond: 59
     };
   },
+  options: {
+    // #ifdef MP-TOUTIAO
+    virtualHost: false,
+    // #endif
+    // #ifndef MP-TOUTIAO
+    virtualHost: true
+    // #endif
+  },
   props: {
     type: {
       type: String,
@@ -238,6 +249,7 @@ export default {
       },
       immediate: true
     },
+
     // 月、日、时、分、秒可选范围变化后，检查当前值是否在范围内，不在则当前值重置为可选范围第一项
     months(newVal) {
       this.checkValue('month', this.month, newVal);
@@ -260,21 +272,27 @@ export default {
     years() {
       return this.getCurrentRange('year');
     },
+
     months() {
       return this.getCurrentRange('month');
     },
+
     days() {
       return this.getCurrentRange('day');
     },
+
     hours() {
       return this.getCurrentRange('hour');
     },
+
     minutes() {
       return this.getCurrentRange('minute');
     },
+
     seconds() {
       return this.getCurrentRange('second');
     },
+
     // picker 当前值数组
     ymd() {
       return [this.year - this.minYear, this.month - this.minMonth, this.day - this.minDay];
@@ -282,14 +300,17 @@ export default {
     hms() {
       return [this.hour - this.minHour, this.minute - this.minMinute, this.second - this.minSecond];
     },
+
     // 当前 date 是 start
     currentDateIsStart() {
       return this.year === this.startYear && this.month === this.startMonth && this.day === this.startDay;
     },
+
     // 当前 date 是 end
     currentDateIsEnd() {
       return this.year === this.endYear && this.month === this.endMonth && this.day === this.endDay;
     },
+
     // 当前年、月、日、时、分、秒的最小值和最大值
     minYear() {
       return this.startYear;
@@ -413,6 +434,7 @@ export default {
         }
       }
     },
+
     /**
      * for i18n
      */
@@ -429,6 +451,7 @@ export default {
       return t('uni-datetime-picker.cancel');
     }
   },
+
   mounted() {
     // #ifdef APP-NVUE
     const res = uni.getSystemInfoSync();
@@ -438,14 +461,17 @@ export default {
     };
     // #endif
   },
+
   methods: {
     /**
      * @param {Object} item
      * 小于 10 在前面加个 0
      */
+
     lessThanTen(item) {
       return item < 10 ? '0' + item : item;
     },
+
     /**
      * 解析时分秒字符串，例如：00:00:00
      * @param {String} timeString
@@ -458,6 +484,7 @@ export default {
         this.second = Number(timeArr[2]);
       }
     },
+
     /**
      * 解析选择器初始值，类型可以是字符串、时间戳，例如：2000-10-02、'08:30:00'、 1610695109000
      * @param {String | Number} datetime
@@ -472,6 +499,7 @@ export default {
       }
       this.parseValue(defaultValue);
     },
+
     /**
      * 初始值规则：
      * - 用户设置初始值 value
@@ -488,6 +516,7 @@ export default {
       value = this.superTimeStamp(value);
       start = this.superTimeStamp(start);
       end = this.superTimeStamp(end);
+
       if (start && end) {
         if (value < start) {
           winner = new Date(start);
@@ -503,8 +532,10 @@ export default {
       } else {
         winner = new Date(value);
       }
+
       return winner;
     },
+
     /**
      * 转换为可比较的时间戳，接受日期、时分秒、时间戳
      * @param {Object} value
@@ -524,6 +555,7 @@ export default {
       }
       return this.createTimeStamp(dateBase + value);
     },
+
     /**
      * 解析默认值 value，字符串、时间戳
      * @param {Object} defaultTime
@@ -552,6 +584,7 @@ export default {
         this.second = 0;
       }
     },
+
     /**
      * 解析可选择时间范围 start、end，年月日字符串、时间戳
      * @param {Object} defaultTime
@@ -606,6 +639,7 @@ export default {
         }
       }
     },
+
     // 获取 年、月、日、时、分、秒 当前可选范围
     getCurrentRange(value) {
       const range = [];
@@ -614,28 +648,25 @@ export default {
       }
       return range;
     },
+
     // 字符串首字母大写
     capitalize(str) {
       return str.charAt(0).toUpperCase() + str.slice(1);
     },
+
     // 检查当前值是否在范围内，不在则当前值重置为可选范围第一项
     checkValue(name, value, values) {
       if (values.indexOf(value) === -1) {
         this[name] = values[0];
       }
     },
+
     // 每个月的实际天数
     daysInMonth(year, month) {
       // Use 1 for January, 2 for February, etc.
       return new Date(year, month, 0).getDate();
     },
-    //兼容 iOS、safari 日期格式
-    fixIosDateFormat(value) {
-      if (typeof value === 'string') {
-        value = value.replace(/-/g, '/');
-      }
-      return value;
-    },
+
     /**
      * 生成时间戳
      * @param {Object} time
@@ -652,15 +683,19 @@ export default {
         return Date.parse(time);
       }
     },
+
     /**
      * 生成日期或时间的字符串
      */
     createDomSting() {
       const yymmdd = this.year + '-' + this.lessThanTen(this.month) + '-' + this.lessThanTen(this.day);
+
       let hhmmss = this.lessThanTen(this.hour) + ':' + this.lessThanTen(this.minute);
+
       if (!this.hideSecond) {
         hhmmss = hhmmss + ':' + this.lessThanTen(this.second);
       }
+
       if (this.type === 'date') {
         return yymmdd;
       } else if (this.type === 'time') {
@@ -669,6 +704,7 @@ export default {
         return yymmdd + ' ' + hhmmss;
       }
     },
+
     /**
      * 初始化返回值，并抛出 change 事件
      */
@@ -685,6 +721,7 @@ export default {
         this.$emit('update:modelValue', this.time);
       }
     },
+
     /**
      * 用户选择日期或时间更新 data
      * @param {Object} e
@@ -701,6 +738,7 @@ export default {
       this.minute = this.minutes[val[1]];
       this.second = this.seconds[val[2]];
     },
+
     /**
      * 初始化弹出层
      */
@@ -710,12 +748,14 @@ export default {
       this.initPickerValue(value);
       this.visible = !this.visible;
     },
+
     /**
      * 触发或关闭弹框
      */
     tiggerTimePicker(e) {
       this.visible = !this.visible;
     },
+
     /**
      * 用户点击“清空”按钮，清空当前值
      */
@@ -726,6 +766,7 @@ export default {
       this.$emit('update:modelValue', this.time);
       this.tiggerTimePicker();
     },
+
     /**
      * 用户点击“确定”按钮
      */
@@ -737,5 +778,156 @@ export default {
 };
 </script>
 <style>
-@import 'style.css';
+.uni-datetime-picker {
+  /* #ifndef APP-NVUE */
+  /* width: 100%; */
+  /* #endif */
+}
+
+.uni-datetime-picker-view {
+  height: 130px;
+  width: 270px;
+  /* #ifndef APP-NVUE */
+  cursor: pointer;
+  /* #endif */
+}
+
+.uni-datetime-picker-item {
+  height: 50px;
+  line-height: 50px;
+  text-align: center;
+  font-size: 14px;
+}
+
+.uni-datetime-picker-btn {
+  margin-top: 60px;
+  /* #ifndef APP-NVUE */
+  display: flex;
+  cursor: pointer;
+  /* #endif */
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.uni-datetime-picker-btn-text {
+  font-size: 14px;
+  color: #007aff;
+}
+
+.uni-datetime-picker-btn-group {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  flex-direction: row;
+}
+
+.uni-datetime-picker-cancel {
+  margin-right: 30px;
+}
+
+.uni-datetime-picker-mask {
+  position: fixed;
+  bottom: 0px;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  background-color: rgba(0, 0, 0, 0.4);
+  transition-duration: 0.3s;
+  z-index: 998;
+}
+
+.uni-datetime-picker-popup {
+  border-radius: 8px;
+  padding: 30px;
+  width: 270px;
+  /* #ifdef APP-NVUE */
+  height: 500px;
+  /* #endif */
+  /* #ifdef APP-NVUE */
+  width: 330px;
+  /* #endif */
+  background-color: #fff;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  transition-duration: 0.3s;
+  z-index: 999;
+}
+
+.fix-nvue-height {
+  /* #ifdef APP-NVUE */
+  height: 330px;
+  /* #endif */
+}
+
+.uni-datetime-picker-time {
+  color: grey;
+}
+
+.uni-datetime-picker-column {
+  height: 50px;
+}
+
+.uni-datetime-picker-timebox {
+  border: 1px solid #e5e5e5;
+  border-radius: 5px;
+  padding: 7px 10px;
+  /* #ifndef APP-NVUE */
+  box-sizing: border-box;
+  cursor: pointer;
+  /* #endif */
+}
+
+.uni-datetime-picker-timebox-pointer {
+  /* #ifndef APP-NVUE */
+  cursor: pointer;
+  /* #endif */
+}
+
+.uni-datetime-picker-disabled {
+  opacity: 0.4;
+  /* #ifdef H5 */
+  cursor: not-allowed !important;
+  /* #endif */
+}
+
+.uni-datetime-picker-text {
+  font-size: 14px;
+  line-height: 50px;
+}
+
+.uni-datetime-picker-sign {
+  position: absolute;
+  top: 53px;
+  /* 减掉 10px 的元素高度，兼容nvue */
+  color: #999;
+  /* #ifdef APP-NVUE */
+  font-size: 16px;
+  /* #endif */
+}
+
+.sign-left {
+  left: 86px;
+}
+
+.sign-right {
+  right: 86px;
+}
+
+.sign-center {
+  left: 135px;
+}
+
+.uni-datetime-picker__container-box {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 40px;
+}
+
+.time-hide-second {
+  width: 180px;
+}
 </style>