zartui 2.0.90 → 2.0.91

package/lib/zart.js

@@ -159,7 +159,7 @@ function createBEM(name) {
   };
 }
 // EXTERNAL MODULE: ./es/locale/index.js + 2 modules
-var locale = __webpack_require__(8);
+var locale = __webpack_require__(9);
 
 // EXTERNAL MODULE: ./es/utils/format/string.js
 var string = __webpack_require__(5);
@@ -584,197 +584,6 @@ function isNaN(val) {
 
 /***/ }),
 /* 8 */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-
-// EXTERNAL MODULE: external {"root":"Vue","commonjs":"vue","commonjs2":"vue","amd":"vue"}
-var external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_ = __webpack_require__(3);
-var external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_default = /*#__PURE__*/__webpack_require__.n(external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_);
-
-// EXTERNAL MODULE: ./es/utils/index.js + 5 modules
-var utils = __webpack_require__(0);
-
-// CONCATENATED MODULE: ./es/utils/deep-assign.js
-
-var deep_assign_hasOwnProperty = Object.prototype.hasOwnProperty;
-
-function assignKey(to, from, key) {
-  var val = from[key];
-
-  if (!Object(utils["e" /* isDef */])(val)) {
-    return;
-  }
-
-  if (!deep_assign_hasOwnProperty.call(to, key) || !Object(utils["g" /* isObject */])(val)) {
-    to[key] = val;
-  } else {
-    // eslint-disable-next-line @typescript-eslint/no-use-before-define
-    to[key] = deepAssign(Object(to[key]), from[key]);
-  }
-}
-
-function deepAssign(to, from) {
-  Object.keys(from).forEach(function (key) {
-    assignKey(to, from, key);
-  });
-  return to;
-}
-// CONCATENATED MODULE: ./es/locale/lang/zh-CN.js
-/* harmony default export */ var zh_CN = ({
-  name: '姓名',
-  tel: '电话',
-  save: '保存',
-  confirm: '确认',
-  cancel: '取消',
-  delete: '删除',
-  complete: '完成',
-  loading: '加载中...',
-  telEmpty: '请填写电话',
-  nameEmpty: '请填写姓名',
-  nameInvalid: '请输入正确的姓名',
-  confirmDelete: '确定要删除吗',
-  telInvalid: '请输入正确的手机号',
-  ztDateTimePicker: {
-    year: '年',
-    month: '月',
-    day: '日',
-    hour: '时',
-    minute: '分'
-  },
-  ztCalendar: {
-    end: '结束',
-    start: '开始',
-    title: '日期选择',
-    confirm: '确定',
-    startEnd: '开始/结束',
-    weekdays: ['日', '一', '二', '三', '四', '五', '六'],
-    monthTitle: function monthTitle(year, month) {
-      return year + "\u5E74" + month + "\u6708";
-    },
-    rangePrompt: function rangePrompt(maxRange) {
-      return "\u9009\u62E9\u5929\u6570\u4E0D\u80FD\u8D85\u8FC7 " + maxRange + " \u5929";
-    }
-  },
-  vanCascader: {
-    select: '请选择'
-  },
-  vanContactCard: {
-    addText: '添加联系人'
-  },
-  vanContactList: {
-    addText: '新建联系人'
-  },
-  vanPagination: {
-    prev: '上一页',
-    next: '下一页'
-  },
-  vanPullRefresh: {
-    pulling: '下拉即可刷新...',
-    loosing: '释放即可刷新...'
-  },
-  ztSubmitBar: {
-    label: '合计：'
-  },
-  vanCoupon: {
-    unlimited: '无使用门槛',
-    discount: function discount(_discount) {
-      return _discount + "\u6298";
-    },
-    condition: function condition(_condition) {
-      return "\u6EE1" + _condition + "\u5143\u53EF\u7528";
-    }
-  },
-  vanCouponCell: {
-    title: '优惠券',
-    tips: '暂无可用',
-    count: function count(_count) {
-      return _count + "\u5F20\u53EF\u7528";
-    }
-  },
-  vanCouponList: {
-    empty: '暂无优惠券',
-    exchange: '兑换',
-    close: '不使用优惠券',
-    enable: '可用',
-    disabled: '不可用',
-    placeholder: '请输入优惠码'
-  },
-  vanAddressEdit: {
-    area: '地区',
-    postal: '邮政编码',
-    areaEmpty: '请选择地区',
-    addressEmpty: '请填写详细地址',
-    postalEmpty: '邮政编码格式不正确',
-    defaultAddress: '设为默认收货地址',
-    telPlaceholder: '收货人手机号',
-    namePlaceholder: '收货人姓名',
-    areaPlaceholder: '选择省 / 市 / 区'
-  },
-  vanAddressEditDetail: {
-    label: '详细地址',
-    placeholder: '街道门牌、楼层房间号等信息'
-  },
-  vanAddressList: {
-    add: '新增地址'
-  },
-  ztAvatar: {
-    defaultSrc: "https://zartui.egova.com.cn/static/head_shot.png",
-    small: "small",
-    medium: "medium",
-    large: "large",
-    square: "square",
-    circle: "circle",
-    defaultText: "头像"
-  },
-  ztSearch: {
-    search: '搜索'
-  },
-  ztEmpty: {
-    notSearchResult: '没有搜索结果',
-    notFound: '页面无法访问',
-    developing: '项目建设中',
-    error: '通用错误',
-    notRight: '您暂未拥有访问权限'
-  },
-  ztSignature: {
-    hint: '请在此签名',
-    browserUnsupported: '对不起，当前浏览器不支持Canvas，无法使用本控件！',
-    screenSizeChangeTip: '旋转屏幕或者改变屏幕大小触发重新绘制',
-    reSign: '重签'
-  }
-});
-// CONCATENATED MODULE: ./es/locale/index.js
-
-
-
-var proto = external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_default.a.prototype;
-var defineReactive = external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_default.a.util.defineReactive;
-defineReactive(proto, '$zartLang', 'zh-CN');
-defineReactive(proto, '$zartMessages', {
-  'zh-CN': zh_CN
-});
-/* harmony default export */ var locale = __webpack_exports__["a"] = ({
-  messages: function messages() {
-    return proto.$zartMessages[proto.$zartLang];
-  },
-  use: function use(lang, messages) {
-    var _this$add;
-
-    proto.$zartLang = lang;
-    this.add((_this$add = {}, _this$add[lang] = messages, _this$add));
-  },
-  add: function add(messages) {
-    if (messages === void 0) {
-      messages = {};
-    }
-
-    deepAssign(proto.$zartMessages, messages);
-  }
-});
-
-/***/ }),
-/* 9 */
 /***/ (function(module, exports, __webpack_require__) {
 
 !function (t, e) {
@@ -1104,15 +913,206 @@ defineReactive(proto, '$zartMessages', {
   }(),
       T = _.prototype;
 
-  return w.prototype = T, [["$ms", r], ["$s", i], ["$m", s], ["$H", u], ["$W", a], ["$M", f], ["$y", c], ["$D", d]].forEach(function (t) {
-    T[t[1]] = function (e) {
-      return this.$g(e, t[0], t[1]);
-    };
-  }), w.extend = function (t, e) {
-    return t.$i || (t(e, _, w), t.$i = !0), w;
-  }, w.locale = S, w.isDayjs = p, w.unix = function (t) {
-    return w(1e3 * t);
-  }, w.en = D[g], w.Ls = D, w.p = {}, w;
+  return w.prototype = T, [["$ms", r], ["$s", i], ["$m", s], ["$H", u], ["$W", a], ["$M", f], ["$y", c], ["$D", d]].forEach(function (t) {
+    T[t[1]] = function (e) {
+      return this.$g(e, t[0], t[1]);
+    };
+  }), w.extend = function (t, e) {
+    return t.$i || (t(e, _, w), t.$i = !0), w;
+  }, w.locale = S, w.isDayjs = p, w.unix = function (t) {
+    return w(1e3 * t);
+  }, w.en = D[g], w.Ls = D, w.p = {}, w;
+});
+
+/***/ }),
+/* 9 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+
+// EXTERNAL MODULE: external {"root":"Vue","commonjs":"vue","commonjs2":"vue","amd":"vue"}
+var external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_ = __webpack_require__(3);
+var external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_default = /*#__PURE__*/__webpack_require__.n(external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_);
+
+// EXTERNAL MODULE: ./es/utils/index.js + 5 modules
+var utils = __webpack_require__(0);
+
+// CONCATENATED MODULE: ./es/utils/deep-assign.js
+
+var deep_assign_hasOwnProperty = Object.prototype.hasOwnProperty;
+
+function assignKey(to, from, key) {
+  var val = from[key];
+
+  if (!Object(utils["e" /* isDef */])(val)) {
+    return;
+  }
+
+  if (!deep_assign_hasOwnProperty.call(to, key) || !Object(utils["g" /* isObject */])(val)) {
+    to[key] = val;
+  } else {
+    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    to[key] = deepAssign(Object(to[key]), from[key]);
+  }
+}
+
+function deepAssign(to, from) {
+  Object.keys(from).forEach(function (key) {
+    assignKey(to, from, key);
+  });
+  return to;
+}
+// CONCATENATED MODULE: ./es/locale/lang/zh-CN.js
+/* harmony default export */ var zh_CN = ({
+  name: '姓名',
+  tel: '电话',
+  save: '保存',
+  confirm: '确认',
+  cancel: '取消',
+  delete: '删除',
+  complete: '完成',
+  loading: '加载中...',
+  telEmpty: '请填写电话',
+  nameEmpty: '请填写姓名',
+  nameInvalid: '请输入正确的姓名',
+  confirmDelete: '确定要删除吗',
+  telInvalid: '请输入正确的手机号',
+  ztDateTimePicker: {
+    year: '年',
+    month: '月',
+    day: '日',
+    hour: '时',
+    minute: '分'
+  },
+  ztCalendar: {
+    end: '结束',
+    start: '开始',
+    title: '日期选择',
+    confirm: '确定',
+    startEnd: '开始/结束',
+    weekdays: ['日', '一', '二', '三', '四', '五', '六'],
+    monthTitle: function monthTitle(year, month) {
+      return year + "\u5E74" + month + "\u6708";
+    },
+    rangePrompt: function rangePrompt(maxRange) {
+      return "\u9009\u62E9\u5929\u6570\u4E0D\u80FD\u8D85\u8FC7 " + maxRange + " \u5929";
+    }
+  },
+  vanCascader: {
+    select: '请选择'
+  },
+  vanContactCard: {
+    addText: '添加联系人'
+  },
+  vanContactList: {
+    addText: '新建联系人'
+  },
+  vanPagination: {
+    prev: '上一页',
+    next: '下一页'
+  },
+  vanPullRefresh: {
+    pulling: '下拉即可刷新...',
+    loosing: '释放即可刷新...'
+  },
+  ztSubmitBar: {
+    label: '合计：'
+  },
+  vanCoupon: {
+    unlimited: '无使用门槛',
+    discount: function discount(_discount) {
+      return _discount + "\u6298";
+    },
+    condition: function condition(_condition) {
+      return "\u6EE1" + _condition + "\u5143\u53EF\u7528";
+    }
+  },
+  vanCouponCell: {
+    title: '优惠券',
+    tips: '暂无可用',
+    count: function count(_count) {
+      return _count + "\u5F20\u53EF\u7528";
+    }
+  },
+  vanCouponList: {
+    empty: '暂无优惠券',
+    exchange: '兑换',
+    close: '不使用优惠券',
+    enable: '可用',
+    disabled: '不可用',
+    placeholder: '请输入优惠码'
+  },
+  vanAddressEdit: {
+    area: '地区',
+    postal: '邮政编码',
+    areaEmpty: '请选择地区',
+    addressEmpty: '请填写详细地址',
+    postalEmpty: '邮政编码格式不正确',
+    defaultAddress: '设为默认收货地址',
+    telPlaceholder: '收货人手机号',
+    namePlaceholder: '收货人姓名',
+    areaPlaceholder: '选择省 / 市 / 区'
+  },
+  vanAddressEditDetail: {
+    label: '详细地址',
+    placeholder: '街道门牌、楼层房间号等信息'
+  },
+  vanAddressList: {
+    add: '新增地址'
+  },
+  ztAvatar: {
+    defaultSrc: "https://zartui.egova.com.cn/static/head_shot.png",
+    small: "small",
+    medium: "medium",
+    large: "large",
+    square: "square",
+    circle: "circle",
+    defaultText: "头像"
+  },
+  ztSearch: {
+    search: '搜索'
+  },
+  ztEmpty: {
+    notSearchResult: '没有搜索结果',
+    notFound: '页面无法访问',
+    developing: '项目建设中',
+    error: '通用错误',
+    notRight: '您暂未拥有访问权限'
+  },
+  ztSignature: {
+    hint: '请在此签名',
+    browserUnsupported: '对不起，当前浏览器不支持Canvas，无法使用本控件！',
+    screenSizeChangeTip: '旋转屏幕或者改变屏幕大小触发重新绘制',
+    reSign: '重签'
+  }
+});
+// CONCATENATED MODULE: ./es/locale/index.js
+
+
+
+var proto = external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_default.a.prototype;
+var defineReactive = external_root_Vue_commonjs_vue_commonjs2_vue_amd_vue_default.a.util.defineReactive;
+defineReactive(proto, '$zartLang', 'zh-CN');
+defineReactive(proto, '$zartMessages', {
+  'zh-CN': zh_CN
+});
+/* harmony default export */ var locale = __webpack_exports__["a"] = ({
+  messages: function messages() {
+    return proto.$zartMessages[proto.$zartLang];
+  },
+  use: function use(lang, messages) {
+    var _this$add;
+
+    proto.$zartLang = lang;
+    this.add((_this$add = {}, _this$add[lang] = messages, _this$add));
+  },
+  add: function add(messages) {
+    if (messages === void 0) {
+      messages = {};
+    }
+
+    deepAssign(proto.$zartMessages, messages);
+  }
 });
 
 /***/ }),
@@ -1143,7 +1143,7 @@ module.exports = g;
 /***/ (function(module, exports, __webpack_require__) {
 
 !function (e, _) {
-   true ? module.exports = _(__webpack_require__(9)) : undefined;
+   true ? module.exports = _(__webpack_require__(8)) : undefined;
 }(this, function (e) {
   "use strict";
 
@@ -4250,6 +4250,10 @@ var picker_createNamespace = Object(utils["b" /* createNamespace */])('picker'),
     valueKey: {
       type: String,
       default: 'text'
+    },
+    popup: {
+      type: Boolean,
+      default: true
     }
   }),
   data: function data() {
@@ -4512,6 +4516,15 @@ var picker_createNamespace = Object(utils["b" /* createNamespace */])('picker'),
       });
       this.emit('confirm');
     },
+    // @exposed-api
+    pureRecordConfirmIndex: function pureRecordConfirmIndex() {
+      this.children.forEach(function (child) {
+        return child.stopMomentum();
+      });
+      this.children.forEach(function (child) {
+        return child.recordConfirmIndex();
+      });
+    },
     cancel: function cancel() {
       this.$emit('update:showPicker', false);
       this.emit('cancel');
@@ -4645,26 +4658,36 @@ var picker_createNamespace = Object(utils["b" /* createNamespace */])('picker'),
     }
   },
   render: function render(h) {
-    return h(popup, {
-      "attrs": {
-        "value": this.showPicker,
-        "round": true,
-        "position": "bottom",
-        "closeOnPopstate": this.closeOnPopstate,
-        "closeOnClickOverlay": this.closeOnClickOverlay,
-        "customOnClickOverlay": this.onClickOverlay,
-        "getContainer": this.getContainer
-      }
-    }, [h("div", {
-      "class": picker_bem(),
-      "ref": 'columnParent'
-    }, [this.toolbarPosition === 'top' ? this.genToolbar() : h(), this.toolbarPosition === 'top' ? h() : this.genTitle(), this.toolbarPosition === 'top' ? h("div", {
-      "class": picker_bem('border')
-    }) : h(), this.loading ? h(es_loading, {
-      "class": picker_bem('loading')
-    }) : h(), this.slots('columns-top'), this.headers && this.headers.length > 0 ? this.genHeaders() : h(), this.headers && this.headers.length > 0 ? h("div", {
-      "class": picker_bem('border')
-    }) : h(), this.genColumns(), this.slots('columns-bottom'), this.toolbarPosition === 'bottom' ? this.genToolbar() : h()])]);
+    var _this7 = this;
+
+    var renderPicker = function renderPicker() {
+      return h("div", {
+        "class": picker_bem(),
+        "ref": "columnParent"
+      }, [_this7.toolbarPosition === 'top' ? _this7.genToolbar() : h(), _this7.toolbarPosition === 'top' ? h() : _this7.genTitle(), _this7.toolbarPosition === 'top' ? h("div", {
+        "class": picker_bem('border')
+      }) : h(), _this7.loading ? h(es_loading, {
+        "class": picker_bem('loading')
+      }) : h(), _this7.slots('columns-top'), _this7.headers && _this7.headers.length > 0 ? _this7.genHeaders() : h(), _this7.headers && _this7.headers.length > 0 ? h("div", {
+        "class": picker_bem('border')
+      }) : h(), _this7.genColumns(), _this7.slots('columns-bottom'), _this7.toolbarPosition === 'bottom' ? _this7.genToolbar() : h()]);
+    };
+
+    if (this.popup) {
+      return h(popup, {
+        "attrs": {
+          "value": this.showPicker,
+          "round": true,
+          "position": "bottom",
+          "closeOnPopstate": this.closeOnPopstate,
+          "closeOnClickOverlay": this.closeOnClickOverlay,
+          "customOnClickOverlay": this.onClickOverlay,
+          "getContainer": this.getContainer
+        }
+      }, [renderPicker()]);
+    }
+
+    return renderPicker();
   }
 }));
 // CONCATENATED MODULE: ./es/area/index.js
@@ -10346,6 +10369,10 @@ var sharedProps = _extends({}, pickerProps, {
     default: function _default(type, value) {
       return value;
     }
+  },
+  showRange: {
+    type: Boolean,
+    default: false
   }
 });
 var TimePickerMixin = {
@@ -10400,12 +10427,12 @@ var TimePickerMixin = {
       var hour = shared_t('hour');
       var minute = shared_t('minute');
       var presetHeaders = {
-        'date': [year, month, day],
+        date: [year, month, day],
         'year-month': [year, month],
         'month-day': [month, day],
-        'time': [hour, minute],
-        'datetime': [year, month, day, hour, minute],
-        'datehour': [year, month, day, hour]
+        time: [hour, minute],
+        datetime: [year, month, day, hour, minute],
+        datehour: [year, month, day, hour]
       }; // console.log('type ' + this.type + ' ' + JSON.stringify(presetHeaders[this.type]))
 
       return presetHeaders[this.type] || [];
@@ -10493,6 +10520,15 @@ var TimePickerMixin = {
     Object.keys(pickerProps).forEach(function (key) {
       props[key] = _this6[key];
     });
+
+    if (this.showRange) {
+      _extends(props, {
+        popup: false,
+        showToolbar: false,
+        title: ''
+      });
+    }
+
     return h(es_picker, {
       "attrs": {
         "show-picker": this.showPicker,
@@ -11787,27 +11823,332 @@ var DatePicker_createNamespace = Object(utils["b" /* createNamespace */])('date-
     }
   }
 }));
+// EXTERNAL MODULE: ./node_modules/dayjs/dayjs.min.js
+var dayjs_min = __webpack_require__(8);
+var dayjs_min_default = /*#__PURE__*/__webpack_require__.n(dayjs_min);
+
 // CONCATENATED MODULE: ./es/datetime-picker/index.js
 
 
 
 
 
+
+
+
+
+
 var datetime_picker_createNamespace = Object(utils["b" /* createNamespace */])('datetime-picker'),
     datetime_picker_createComponent = datetime_picker_createNamespace[0],
     datetime_picker_bem = datetime_picker_createNamespace[1];
 
+var RANGE_START_PICKER = 0;
+var RANGE_END_PICKER = 1;
 /* harmony default export */ var datetime_picker = (datetime_picker_createComponent({
-  props: _extends({}, TimePicker.props, DatePicker.props),
+  props: _extends({}, TimePicker.props, DatePicker.props, {
+    // 是否开启时间范围选择
+    range: {
+      type: Boolean,
+      default: false
+    },
+    startValue: {
+      type: Date,
+      default: function _default() {
+        return new Date();
+      },
+      validator: isDate
+    },
+    endValue: {
+      type: Date,
+      default: function _default() {
+        return new Date();
+      },
+      validator: isDate
+    },
+    rangeHeaderStartText: {
+      type: String,
+      default: '开始时间'
+    },
+    rangeHeaderEndText: {
+      type: String,
+      default: '结束时间'
+    }
+  }),
+  data: function data() {
+    return {
+      rangeSelectedIndex: RANGE_START_PICKER,
+      refreshComputedKey: new Date().getTime(),
+      innerStartValue: this.startValue,
+      innerEndValue: this.endValue,
+      confirmedPopupPickerIndex: false
+    };
+  },
+  computed: {
+    currentStartText: function currentStartText() {
+      return this.genOriginValueText(this.innerStartValue);
+    },
+    currentEndText: function currentEndText() {
+      return this.genOriginValueText(this.innerEndValue);
+    }
+  },
+  watch: {
+    showPicker: function showPicker(val) {
+      var _this = this; // 在第一次打开popup时，需要初始化内部picker存储的时间列index，避免初次打开直接关闭，导致picker内部index丢失
+
+
+      if (val && !this.confirmedPopupPickerIndex) {
+        // 注意这里实际上是双层nextTick,为了解决picker组件setConfirmIndex也在nextTick中执行，导致无法正确设置index的问题
+        this.$nextTick(function () {
+          _this.updatePickerConfirm();
+
+          _this.confirmedPopupPickerIndex = true;
+        });
+      }
+    }
+  },
   methods: {
     // @exposed-api
     getPicker: function getPicker() {
+      if (this.range) {
+        return [this.$refs.rangeStart.getProxiedPicker(), this.$refs.rangeEnd.getProxiedPicker()];
+      }
+
       return this.$refs.root.getProxiedPicker();
+    },
+    genValueText: function genValueText(dateValue, timeValue) {
+      var text = '';
+
+      if (dateValue.length > 0) {
+        text += dateValue.join('/');
+      }
+
+      if (timeValue.length > 0) {
+        text = text + ' ' + timeValue.join(':');
+      }
+
+      return text;
+    },
+    genOriginValueText: function genOriginValueText(values) {
+      if (!values) return '-';
+      var dateTime = dayjs_min_default()(values).format('YYYY-MM-DDTHH:mm:ss');
+      var dateTimeArr = dateTime.split(/[-T:]/);
+      var dateValues = [];
+      var timeValues = [];
+
+      if (this.$refs.rangeStart && this.$refs.rangeStart.originColumns) {
+        this.$refs.rangeStart.originColumns.forEach(function (_ref, index) {
+          var type = _ref.type;
+
+          if (index < dateTimeArr.length) {
+            if (['year', 'month', 'day'].includes(type)) {
+              dateValues.push(dateTimeArr[index]);
+            } else if (['hour', 'minute', 'second'].includes(type)) {
+              timeValues.push(dateTimeArr[index]);
+            }
+          }
+        });
+        return this.genValueText(dateValues, timeValues);
+      }
+    },
+    genRangeHeader: function genRangeHeader() {
+      var _this2 = this;
+
+      var h = this.$createElement;
+      return h("div", {
+        "class": datetime_picker_bem('title-tab-bar')
+      }, [h("div", {
+        "class": [datetime_picker_bem('title-bar', {
+          selected: this.rangeSelectedIndex === RANGE_START_PICKER,
+          unselected: this.rangeSelectedIndex === RANGE_END_PICKER
+        })],
+        "on": {
+          "click": function click() {
+            _this2.rangeSelectedIndex = RANGE_START_PICKER;
+          }
+        }
+      }, [h("div", {
+        "class": ['zt2-ellipsis', datetime_picker_bem('title', {
+          selected: this.rangeSelectedIndex === RANGE_START_PICKER,
+          unselected: this.rangeSelectedIndex === RANGE_END_PICKER
+        })]
+      }, [this.rangeHeaderStartText]), h("div", {
+        "class": ['zt2-ellipsis', datetime_picker_bem('value')]
+      }, [this.currentStartText])]), h("span", {
+        "class": datetime_picker_bem('title-separator')
+      }), h("div", {
+        "class": [datetime_picker_bem('title-bar', {
+          selected: this.rangeSelectedIndex === RANGE_END_PICKER,
+          unselected: this.rangeSelectedIndex === RANGE_START_PICKER
+        })],
+        "on": {
+          "click": function click() {
+            _this2.rangeSelectedIndex = RANGE_END_PICKER;
+          }
+        }
+      }, [h("div", {
+        "class": ['zt2-ellipsis', datetime_picker_bem('title', {
+          selected: this.rangeSelectedIndex === RANGE_END_PICKER,
+          unselected: this.rangeSelectedIndex === RANGE_START_PICKER
+        })]
+      }, [this.rangeHeaderEndText]), h("div", {
+        "class": ['zt2-ellipsis', datetime_picker_bem('value')]
+      }, [this.currentEndText])])]);
+    },
+    genCancel: function genCancel() {
+      var h = this.$createElement;
+      return h(es_button, {
+        "attrs": {
+          "size": "normal",
+          "block": true
+        },
+        "style": {
+          marginRigth: '4px',
+          backgroundColor: 'white'
+        },
+        "on": {
+          "click": this.onCancel
+        }
+      }, [this.cancelButtonText || '取消']);
+    },
+    genConfirm: function genConfirm() {
+      var h = this.$createElement;
+      return h(es_button, {
+        "attrs": {
+          "type": "primary",
+          "size": "normal",
+          "block": true
+        },
+        "style": {
+          marginLeft: '8px'
+        },
+        "on": {
+          "click": this.onConfirm
+        }
+      }, [this.confirmButtonText || '确认']);
+    },
+    genToolbar: function genToolbar() {
+      var h = this.$createElement;
+
+      if (this.showToolbar) {
+        return h("div", {
+          "class": datetime_picker_bem('toolbar')
+        }, [[this.genCancel(), this.genConfirm()]]);
+      }
+    },
+
+    /**
+     * 这里必须手动调用一次picker组件内部pureRecordConfirmIndex，保证picker组件内部confirmIndex是当前选中的时间项index
+     */
+    updatePickerConfirm: function updatePickerConfirm() {
+      var _this3 = this;
+
+      this.$nextTick(function () {
+        var pickers = _this3.getPicker();
+
+        if (Array.isArray(pickers)) {
+          pickers.forEach(function (p) {
+            return p.pureRecordConfirmIndex();
+          });
+        }
+      });
+    },
+    checkRangeValid: function checkRangeValid() {
+      return dayjs_min_default()(this.innerEndValue).isAfter(this.innerStartValue);
+    },
+    onConfirm: function onConfirm() {
+      if (!this.checkRangeValid()) {
+        es_toast('结束日期不能早于开始日期');
+        return;
+      }
+
+      this.updatePickerConfirm();
+      this.$emit('update:startValue', this.innerStartValue);
+      this.$emit('update:endValue', this.innerEndValue);
+      this.$emit('confirm', [this.innerStartValue, this.innerEndValue]);
+    },
+    onCancel: function onCancel() {
+      this.$emit('update:showPicker', false);
+      this.$emit('cancel');
     }
   },
   render: function render() {
+    var _this4 = this;
+
     var h = arguments[0];
     var Component = this.type === 'time' ? TimePicker : DatePicker;
+
+    if (this.range) {
+      var props = _extends({}, this.$props, {
+        bem: datetime_picker_bem,
+        showRange: true
+      });
+
+      var startRangeProps = _extends({}, props, {
+        value: this.startValue
+      });
+
+      var startListener = _extends({}, this.$listeners, {
+        input: function input(val) {
+          _this4.innerStartValue = val;
+        },
+        change: function change(pickerRef) {
+          _this4.$emit('startChange', pickerRef);
+        }
+      });
+
+      var endRangeProps = _extends({}, props, {
+        value: this.endValue
+      });
+
+      var endListener = _extends({}, this.$listeners, {
+        input: function input(val) {
+          _this4.innerEndValue = val;
+        },
+        change: function change(pickerRef) {
+          _this4.$emit('endChange', pickerRef);
+        }
+      });
+
+      return h(popup, {
+        "attrs": {
+          "value": this.showPicker,
+          "round": true,
+          "position": "bottom"
+        },
+        "on": {
+          "input": function input(val) {
+            if (val) {
+              _this4.$emit('update:showPicker', true);
+            } else {
+              _this4.$emit('update:showPicker', false);
+            }
+          }
+        }
+      }, [this.genRangeHeader(), h("div", {
+        "class": datetime_picker_bem('range')
+      }, [h(Component, {
+        "ref": "rangeStart",
+        "directives": [{
+          name: "show",
+          value: this.rangeSelectedIndex === RANGE_START_PICKER
+        }],
+        "class": datetime_picker_bem(),
+        "scopedSlots": this.$scopedSlots,
+        "props": _extends({}, startRangeProps),
+        "on": _extends({}, startListener)
+      }), h(Component, {
+        "ref": "rangeEnd",
+        "directives": [{
+          name: "show",
+          value: this.rangeSelectedIndex === RANGE_END_PICKER
+        }],
+        "class": datetime_picker_bem(),
+        "scopedSlots": this.$scopedSlots,
+        "props": _extends({}, endRangeProps),
+        "on": _extends({}, endListener)
+      })]), this.genToolbar()]);
+    }
+
     return h(Component, {
       "ref": "root",
       "class": datetime_picker_bem(),
@@ -20007,7 +20348,7 @@ var list_createNamespace = Object(utils["b" /* createNamespace */])('list'),
   }
 }));
 // EXTERNAL MODULE: ./es/locale/index.js + 2 modules
-var locale = __webpack_require__(8);
+var locale = __webpack_require__(9);
 
 // CONCATENATED MODULE: ./es/media-picker/type.js
 var MediaUploadStatus;
@@ -20407,10 +20748,6 @@ function checkIsWindows() {
 
 
 
-// EXTERNAL MODULE: ./node_modules/dayjs/dayjs.min.js
-var dayjs_min = __webpack_require__(9);
-var dayjs_min_default = /*#__PURE__*/__webpack_require__.n(dayjs_min);
-
 // EXTERNAL MODULE: ./node_modules/dayjs/locale/zh-cn.js
 var zh_cn = __webpack_require__(11);