From c22e91296d532873b70cb51bf5510bf7738f3f1a Mon Sep 17 00:00:00 2001
From: peng <peng.com>
Date: 星期三, 09 七月 2025 18:01:36 +0800
Subject: [PATCH] 完成小程序商户端查看订单发货查看物流
---
pages/tabbar/user/utils/tool.vue | 2
uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/index.js | 8
uni_modules/uni-datetime-picker/components/uni-datetime-picker/time-picker.vue | 940 ++++++++
pages/supplier/suppler-order/suppler-order.vue | 101
uni_modules/uni-table/changelog.md | 35
uni_modules/uni-datetime-picker/components/uni-datetime-picker/calendar.vue | 947 ++++++++
uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/zh-Hans.json | 22
uni_modules/uni-datetime-picker/readme.md | 21
uni_modules/uni-datetime-picker/changelog.md | 169 +
uni_modules/uni-table/components/uni-table/uni-table.vue | 460 ++++
uni_modules/uni-table/components/uni-tbody/uni-tbody.vue | 34
uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/zh-Hant.json | 22
uni_modules/uni-table/components/uni-th/filter-dropdown.vue | 511 ++++
uni_modules/uni-datetime-picker/package.json | 90
pages/userPermissions/userPermissions.vue | 2
uni_modules/uni-table/i18n/zh-Hant.json | 9
uni_modules/uni-table/components/uni-tr/uni-tr.vue | 184 +
pages/supplier/suppler-order/order-detail.vue | 471 ++++
uni_modules/uni-table/components/uni-td/uni-td.vue | 95
uni_modules/uni-table/components/uni-tr/table-checkbox.vue | 179 +
uni_modules/uni-table/components/uni-th/uni-th.vue | 295 ++
uni_modules/uni-table/i18n/zh-Hans.json | 9
uni_modules/uni-datetime-picker/components/uni-datetime-picker/calendar-item.vue | 177 +
pages.json | 26
uni_modules/uni-table/i18n/es.json | 9
uni_modules/uni-table/package.json | 86
uni_modules/uni-table/i18n/en.json | 9
api/supplier.js | 52
pages/mine/msgTips/packageMsg/logisticsDetail.vue | 1
uni_modules/uni-datetime-picker/components/uni-datetime-picker/util.js | 421 +++
uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/en.json | 22
pages/supplier/suppler-order/order-detail - 副本.vue | 69
uni_modules/uni-table/i18n/fr.json | 9
uni_modules/uni-table/i18n/index.js | 12
uni_modules/uni-table/readme.md | 13
uni_modules/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue | 1073 +++++++++
uni_modules/uni-table/components/uni-thead/uni-thead.vue | 137 +
37 files changed, 6,628 insertions(+), 94 deletions(-)
diff --git a/api/supplier.js b/api/supplier.js
index 4de4179..d0d47a4 100644
--- a/api/supplier.js
+++ b/api/supplier.js
@@ -17,5 +17,53 @@
needToken: true,
});
}
-
-
+/**
+ * 灏忕▼搴忓晢鎴风鑾峰彇搴楅摵缁忚惀鐨勫垎绫�
+ *
+ * @param params
+ */
+ export function supplierOrderList(param) {
+ return http.request({
+ url: "/lmk/supplier/orderList",
+ method: Method.GET,
+ needToken: true,
+ params:param
+ });
+}
+/**
+ * 鑾峰彇璁㈠崟璇︽儏
+ *
+ * @param params
+ */
+ export function supplierOrderDetail(snNo) {
+ return http.request({
+ url: "/lmk/supplier/orderDetail/"+snNo,
+ method: Method.GET,
+ needToken: true,
+ });
+}
+/**
+ * 鑾峰彇鍟嗗寮�鏀剧殑蹇�掔被鍨�
+ *
+ * @param params
+ */
+ export function getChecked() {
+ return http.request({
+ url: "/lmk/supplier/getChecked",
+ method: Method.GET,
+ needToken: true,
+ });
+}
+/**
+ * 鑾峰彇鍟嗗寮�鏀剧殑蹇�掔被鍨�
+ *
+ * @param params
+ */
+ export function partDelivery(orderSn,data) {
+ return http.request({
+ url: `/lmk/supplier/${orderSn}/partDelivery`,
+ method: Method.POST,
+ needToken: true,
+ data:data
+ });
+}
diff --git a/pages.json b/pages.json
index 869ae4a..ea225f5 100644
--- a/pages.json
+++ b/pages.json
@@ -1497,17 +1497,23 @@
"navigationStyle": "custom"
}
}]
+ },
+ {
+ "root": "pages/supplier/suppler-order",
+ "pages": [{
+ "path": "suppler-order",
+ "style": {
+ "navigationBarTitleText": "渚涘簲鍟嗙"
+ // "navigationStyle": "custom"
+ }
+ },{
+ "path": "order-detail",
+ "style": {
+ "navigationBarTitleText": "璁㈠崟璇︽儏"
+ // "navigationStyle": "custom"
+ }
+ }]
}
- // {
- // "root": "pages/supplier/publish-goods",
- // "pages": [{
- // "path": "publishGoods",
- // "style": {
- // "navigationBarTitleText": "鍟嗗搧鍙戝竷"
- // // "navigationStyle": "custom"
- // }
- // }]
- // }
// ,
// {
// "root": "pages/commodity-square",
diff --git a/pages/mine/msgTips/packageMsg/logisticsDetail.vue b/pages/mine/msgTips/packageMsg/logisticsDetail.vue
index 6cf936b..6a573c9 100644
--- a/pages/mine/msgTips/packageMsg/logisticsDetail.vue
+++ b/pages/mine/msgTips/packageMsg/logisticsDetail.vue
@@ -48,6 +48,7 @@
init(sn) {
getExpress(sn).then((res) => {
this.logiList = res.data.result;
+ console.log('-------------------------->loiList',JSON.stringify(this.logiList))
});
},
},
diff --git "a/pages/supplier/suppler-order/order-detail - \345\211\257\346\234\254.vue" "b/pages/supplier/suppler-order/order-detail - \345\211\257\346\234\254.vue"
new file mode 100644
index 0000000..1848bff
--- /dev/null
+++ "b/pages/supplier/suppler-order/order-detail - \345\211\257\346\234\254.vue"
@@ -0,0 +1,69 @@
+<template>
+ <view class="container">
+ <uni-table ref="table" :loading="loading" border stripe type="selection" emptyText="鏆傛棤鏇村鏁版嵁"
+ @selection-change="selectionChange">
+ <uni-tr>
+ <uni-th width="40" align="center">鍟嗗搧 </uni-th>
+ <uni-th width="50" align="center">鍗曚环</uni-th>
+ <uni-th width="50">鏁伴噺</uni-th>
+ <uni-th width="20">宸插彂鍖呰９ </uni-th>
+ <uni-th width="20">灏忚 </uni-th>
+ </uni-tr>
+ <uni-tr v-for="(item, index) in tableData" :key="index">
+ <uni-td>{{ item.date }}</uni-td>
+ <uni-td>
+ <view class="name">{{ item.name }}</view>
+ </uni-td>
+ <uni-td align="center">{{ item.address }}</uni-td>
+ <uni-td>
+ <view class="uni-group">
+ <button class="uni-button" size="mini" type="primary">淇敼</button>
+ <button class="uni-button" size="mini" type="warn">鍒犻櫎</button>
+ </view>
+ </uni-td>
+ </uni-tr>
+ </uni-table>
+ </view>
+</template>
+
+<script>
+ import {
+ supplierOrderDetail
+ } from '@/api/supplier.js'
+ export default {
+ data() {
+ return {
+ tableData: [],
+ loading: false,
+ selectedIndexs: []
+
+ }
+ },
+ methods: {
+ methods: {
+ // 澶氶�夊鐞�
+ selectedItems() {
+ if(this.tableData.length == 0) return
+ return this.selectedIndexs.map(i => this.tableData[i])
+ },
+ // 澶氶��
+ selectionChange(e) {
+ console.log(e.detail.index)
+ this.selectedIndexs = e.detail.index
+ },
+ },
+ async onLoad(query) {
+ // const {
+ // order_sn
+ // } = query
+ const order_sn = 'O202507091942755596113694720'
+ const orderDetail = await supplierOrderDetail(order_sn);
+ this.tableData = orderDetail.data.result.orderItems
+ console.log('------------------------------>', JSON.stringify(this.tableData))
+ }
+ }
+ }
+</script>
+
+<style>
+</style>
\ No newline at end of file
diff --git a/pages/supplier/suppler-order/order-detail.vue b/pages/supplier/suppler-order/order-detail.vue
new file mode 100644
index 0000000..b9c7906
--- /dev/null
+++ b/pages/supplier/suppler-order/order-detail.vue
@@ -0,0 +1,471 @@
+<template>
+ <view class="container">
+ <!-- 鐗╂祦淇℃伅鍗＄墖 -->
+ <input type="text" v-model="flushDom" v-show="true" />
+ <view class="card delivery-info">
+ <view class="section-title">鐗╂祦淇℃伅</view>
+ <view class="userInfo">
+ <view class="name">
+ <text>濮撳悕锛�</text> {{order.consigneeName}}</view>
+ <view class="phone"><text>鑱旂郴鐢佃瘽:</text> {{order.consigneeMobile}}</view>
+ <view class="addresss"><text>鍦板潃锛�</text> {{order.consigneeAddressPath}}</view>
+ </view>
+ <view class="form-item">
+ <picker @change="selectLogistics" :value="logisticsIndex" :range="logisticsList" range-key="name"
+ class="picker">
+ <view class="input">
+ {{ selectedLogistics ? selectedLogistics.name : '璇烽�夋嫨鐗╂祦鍏徃' }}
+ </view>
+ </picker>
+ </view>
+
+ <view class="form-item">
+ <input v-model="trackingNumber" placeholder="濉啓蹇�掑崟鍙�" class="input" />
+ <!-- <button class="scan-btn" @click="scanBarcode">
+ <uni-icons type="scan" size="20" color="#fff" />
+ </button> -->
+ </view>
+ </view>
+
+ <!-- 鍟嗗搧鍒楄〃 -->
+ <view class="card">
+ <view class="section-title">閫夋嫨鍙戣揣鍟嗗搧</view>
+ <view class="goods-list">
+ <view v-for="(item, index) in goodsList" :key="item.id" class="goods-item">
+ <view class="goods-info">
+ <image :src="item.image" class="goods-image" />
+ <view class="goods-detail">
+ <text class="goods-name">{{ item.goodsName }}</text>
+ <view class="goods-meta">
+ <text class="goods-price">楼{{ item.unitPrice.toFixed(2) }}</text>
+ <text class="goods-stock">鍟嗗搧鏁伴噺: {{ item.num }}</text>
+ </view>
+ </view>
+ </view>
+
+ <view class="quantity-control">
+ <text class="label">鍙戣揣鏁伴噺:</text>
+ <view class="quantity-selector">
+ <button class="btn-minus" :disabled="item.selected <= 0" @click="adjustQuantity(index, -1)">
+ -
+ </button>
+ <input v-model.number="item.selected" type="number" :min="0" :max="item.num"
+ @blur="validateQuantity(index,item.selected)" class="input-quantity"
+ :disabled="item.num==0" />
+ <button class="btn-plus" :disabled="item.selected >= item.num"
+ @click="adjustQuantity(index, 1)">
+ +
+ </button>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+
+ <!-- 搴曢儴鎿嶄綔鏍� -->
+ <view class="action-bar">
+ <view class="summary">
+ <text>鍏� {{ totalSelected }} 浠跺晢鍝�</text>
+ <text class="total-amount">鍚堣: 楼{{ totalAmount.toFixed(2) }}</text>
+ </view>
+ <button class="submit-btn" :class="{ disabled: !canSubmit }" @click="submitDelivery">
+ 纭鍙戣揣
+ </button>
+ </view>
+ </view>
+</template>
+
+<script>
+ import {
+ supplierOrderDetail,
+ getChecked,
+ partDelivery
+ } from '@/api/supplier.js'
+ export default {
+ data() {
+ return {
+ logisticsIndex: -1,
+ logisticsList: [],
+ trackingNumber: '',
+ goodsList: [],
+ orderSn: '',
+ flushDom: '',
+ order:{}
+ }
+ },
+ computed: {
+ // 褰撳墠閫変腑鐨勭墿娴佸叕鍙�
+ selectedLogistics() {
+ return this.logisticsIndex >= 0 ?
+ this.logisticsList[this.logisticsIndex] :
+ null
+ },
+
+ // 宸查�夊晢鍝佹�绘暟
+ totalSelected() {
+ return this.goodsList.reduce((sum, item) => sum + item.selected, 0)
+ },
+
+ // 鎬婚噾棰�
+ totalAmount() {
+ return this.goodsList.reduce(
+ (sum, item) => sum + (item.unitPrice * item.selected),
+ 0
+ )
+ },
+
+ // 鏄惁鍙互鎻愪氦
+ canSubmit() {
+ return this.selectedLogistics &&
+ this.trackingNumber.trim() &&
+ this.totalSelected > 0
+ }
+ },
+ methods: {
+ // 閫夋嫨鐗╂祦鍏徃
+ selectLogistics(e) {
+ this.logisticsIndex = e.detail.value
+ },
+
+ // 鎵爜蹇�掑崟鍙�
+ scanBarcode() {
+ uni.scanCode({
+ success: res => {
+ this.trackingNumber = res.result
+ },
+ fail: err => {
+ uni.showToast({
+ title: '鎵爜澶辫触',
+ icon: 'none'
+ })
+ }
+ })
+ },
+
+ // 璋冩暣鍟嗗搧鏁伴噺
+ adjustQuantity(index, delta) {
+ const newVal = this.goodsList[index].selected + delta
+ if (newVal >= 0 && newVal <= this.goodsList[index].num) {
+ this.goodsList[index].selected = newVal
+ }
+ },
+
+ // 鏍￠獙鏁伴噺杈撳叆
+ validateQuantity(index, selected) {
+ const item = this.goodsList[index]
+ if (item.selected < 0) {
+ item.selected = 0
+ }
+ if (item.selected > item.num) {
+ item.selected = item.num
+ }
+ },
+ async loadData(order_sn) {
+ this.goodsList = [];
+ this.order = {};
+ const orderDetail = await supplierOrderDetail(order_sn);
+ this.order = orderDetail.data.result.order
+ this.orderSn = order_sn;
+ this.goodsList = orderDetail.data.result.orderItems.map(item => {
+ const remain = item.num - item.deliverNumber
+ return {
+ image: item.image,
+ id: item.id,
+ goodsName: item.goodsName,
+ unitPrice: item.unitPrice,
+ num: remain,
+ selected: remain,
+ orderSn: item.orderSn
+ }
+ })
+ },
+ // 鎻愪氦鍙戣揣
+ async submitDelivery() {
+ if (!this.canSubmit) return
+ uni.showModal({
+ title: "鏄惁纭鍙戣揣",
+ success: async(e)=> {
+ if (e.confirm) {
+
+ // 鏋勫缓鍙戣揣鍟嗗搧鏁版嵁
+ const deliveryItems = this.goodsList
+ .filter(item => item.selected > 0)
+ .map(item => ({
+ orderItemId: item.id,
+ deliveryNum: item.selected,
+ }))
+
+ const deliveryData = {
+ logisticsId: this.selectedLogistics.id,
+ logisticsNo: this.trackingNumber,
+ partDeliveryDTOList: deliveryItems,
+ orderSn: this.orderSn
+ }
+
+ uni.showLoading({
+ title: '鎻愪氦涓�...',
+ mask: true
+ })
+ // 瀹為檯椤圭洰涓皟鐢ˋPI鎺ュ彛
+ // 杩欓噷浣跨敤妯℃嫙鎻愪氦
+ try {
+ const delivery = await partDelivery(this.orderSn, deliveryData)
+ if (delivery.code == 200) {
+ uni.showToast({
+ title: '鍙戣揣鎴愬姛',
+ icon: 'success',
+ success: () => {
+ // 杩斿洖涓婁竴椤垫垨璺宠浆鍒扮粨鏋滈〉
+ setTimeout(() => uni.navigateBack(), 1500)
+ }
+ })
+ }
+ } finally {
+ uni.hideLoading()
+ await this.loadData(this.orderSn)
+ }
+ }
+ }
+ })
+
+ }
+ },
+
+ async onLoad(query) {
+ const {
+ order_sn
+ } = query
+ // const orderDetail = await supplierOrderDetail(order_sn);
+ // this.orderSn = order_sn;
+ // this.goodsList = orderDetail.data.result.orderItems.map(item => {
+ // console.log('------------------------------>', item.num, item.deliverNumber)
+ // const remain = item.num - item.deliverNumber
+ // return {
+ // image: item.image,
+ // id: item.id,
+ // goodsName: item.goodsName,
+ // unitPrice: item.unitPrice,
+ // num: remain,
+ // selected: remain,
+ // orderSn: item.orderSn
+ // }
+ // })
+ await this.loadData(order_sn);
+ const checked = await getChecked();
+ this.logisticsList = checked.data.result.map(item => {
+ return {
+ id: item.logisticsId,
+ name: item.name,
+ code: item.logisticsId
+
+ }
+ })
+ }
+ }
+</script>
+
+<style scoped>
+ /* 鏍峰紡淇濇寔涓嶅彉 */
+ .container {
+ padding: 20rpx;
+ background-color: #f5f5f5;
+ height: calc(100vh - env(safe-area-inset-bottom));
+ overflow: auto;
+ padding-bottom: env(safe-area-inset-bottom);
+
+ }
+
+ .card {
+ background-color: #fff;
+ border-radius: 16rpx;
+ padding: 30rpx;
+ margin-bottom: 20rpx;
+ box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.03);
+ }
+
+ .section-title {
+ font-size: 32rpx;
+ font-weight: bold;
+ color: #333;
+ margin-bottom: 30rpx;
+ padding-bottom: 20rpx;
+ border-bottom: 1rpx solid #eee;
+ }
+
+ .form-item {
+ margin-top: 30rpx;
+ margin-bottom: 30rpx;
+ position: relative;
+ }
+
+ .picker {
+ width: 100%;
+ font-size: 32rpx;
+ }
+
+ .input {
+ height: 88rpx;
+ line-height: 88rpx;
+ padding: 0 30rpx;
+ background-color: #f9f9f9;
+ border-radius: 12rpx;
+ font-size: 28rpm;
+ color: #333;
+ border: 1rpx solid #eee;
+ }
+
+ .scan-btn {
+ position: absolute;
+ right: 10rpx;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 80rpx;
+ height: 70rpx;
+ background-color: #2979ff;
+ border-radius: 8rpx;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 0;
+ }
+
+ .goods-item {
+ padding: 30rpx 0;
+ border-bottom: 1rpx solid #f0f0f0;
+ }
+
+ .goods-item:last-child {
+ border-bottom: none;
+ }
+
+ .goods-info {
+ display: flex;
+ align-items: center;
+ margin-bottom: 30rpx;
+ }
+
+ .goods-image {
+ width: 160rpx;
+ height: 160rpx;
+ border-radius: 8rpx;
+ margin-right: 20rpx;
+ }
+
+ .goods-detail {
+ flex: 1;
+ }
+
+ .goods-name {
+ font-size: 28rpx;
+ color: #333;
+ line-height: 1.5;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 2;
+ overflow: hidden;
+ }
+
+ .goods-meta {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 15rpx;
+ }
+
+ .goods-price {
+ font-size: 32rpx;
+ color: #e64340;
+ font-weight: bold;
+ }
+
+ .goods-stock {
+ font-size: 26rpx;
+ color: #999;
+ }
+
+ .quantity-control {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+
+ .label {
+ font-size: 28rpx;
+ color: #666;
+ }
+
+ .quantity-selector {
+ display: flex;
+ align-items: center;
+ }
+
+ .btn-minus,
+ .btn-plus {
+ width: 60rpx;
+ height: 60rpx;
+ background-color: #f5f5f5;
+ border-radius: 50%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ font-size: 36rpx;
+ color: #666;
+ padding: 0;
+ }
+
+ .btn-minus[disabled],
+ .btn-plus[disabled] {
+ opacity: 0.4;
+ }
+
+ .input-quantity {
+ width: 100rpx;
+ height: 60rpx;
+ text-align: center;
+ font-size: 32rpx;
+ margin: 0 15rpx;
+ border: 1rpx solid #eee;
+ border-radius: 8rpx;
+ }
+
+ .action-bar {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ height: 100rpx;
+ background-color: #fff;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 0 30rpx;
+ box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.05);
+ z-index: 100;
+ margin-bottom: env(safe-area-inset-bottom);
+ }
+
+ .summary {
+ display: flex;
+ flex-direction: column;
+ }
+
+ .total-amount {
+ font-size: 32rpx;
+ color: #e64340;
+ font-weight: bold;
+ margin-top: 6rpx;
+ }
+
+ .submit-btn {
+ background-color: #2979ff;
+ color: #fff;
+ height: 80rpx;
+ line-height: 80rpx;
+ border-radius: 40rpx;
+ font-size: 30rpx;
+ padding: 0 50rpx;
+ }
+
+ .submit-btn.disabled {
+ background-color: #cccccc;
+ }
+</style>
\ No newline at end of file
diff --git a/pages/supplier/suppler-order/suppler-order.vue b/pages/supplier/suppler-order/suppler-order.vue
index df4e95d..76b984c 100644
--- a/pages/supplier/suppler-order/suppler-order.vue
+++ b/pages/supplier/suppler-order/suppler-order.vue
@@ -106,6 +106,7 @@
shape="circle"
size="mini"
v-if="order.orderStatus==='UNDELIVERED'"
+ @click="navigationToOrderDetail(order.sn)"
>鍙戣揣</view
>
<!-- 绛夊緟鏀惰揣 -->
@@ -134,6 +135,7 @@
<script>
import '@/components/uview-components/uview-ui';
import { getOrderXcxList, cancelOrder, confirmReceipt ,getOrderDetail} from "@/api/order.js";
+import{supplierOrderList} from '@/api/supplier.js'
import { getClearReason } from "@/api/after-sale.js";
import LiLiWXPay from "@/js_sdk/lili-pay/wx-pay.js";
export default {
@@ -263,6 +265,9 @@
* 淇app绔偣鍑婚櫎鍏ㄩ儴璁㈠崟澶栫殑鎸夐挳杩涘叆鏃朵笉鍔犺浇鏁版嵁鐨勯棶棰�
* 鏇挎崲onLoad涓嬩唬鐮佸嵆鍙�
*/
+ if(!options.status){
+ options.status = 0
+ }
let status = Number(options.status);
this.status = status;
@@ -286,6 +291,11 @@
},
},
methods: {
+ navigationToOrderDetail(snNo){
+ uni.navigateTo({
+ url:`/pages/supplier/suppler-order/order-detail?order_sn=${snNo}`
+ })
+ },
async selectPhone(sn){
const orderInfo = await getOrderDetail(sn)
console.log('----------------->',orderInfo)
@@ -295,8 +305,15 @@
this.userInfo.address = orderInfo.data.result.order.consigneeAddressPath
uni.showModal({
- title:"鐢ㄦ埛鑱旂郴鐢佃瘽",
- content:orderInfo.data.result.order.consigneeMobile
+ title:orderInfo.data.result.order.consigneeName + '锛堝厛鐢�/濂冲＋锛�',
+ content:orderInfo.data.result.order.consigneeMobile,
+ success(e) {
+ if(e.confirm){
+ uni.makePhoneCall({
+ phoneNumber:orderInfo.data.result.order.consigneeMobile
+ })
+ }
+ }
})
},
@@ -316,7 +333,7 @@
loadData(index) {
this.params.pageNumber = this.navList[index].pageNumber;
// this.params.tag = this.orderStatus[index].orderStatus;
- getOrderXcxList(this.params).then((res) => {
+ supplierOrderList(this.params).then((res) => {
uni.stopPullDownRefresh();
if (!res.data.success) {
this.navList[index].loadStatus = "noMore";
@@ -367,83 +384,7 @@
stateTipColor,
};
},
- /**
- * 閫夋嫨鍙栨秷鍘熷洜
- */
- reasonChange(reason) {
- this.reason = reason;
- },
- /**
- * 鎻愪氦鍙栨秷璁㈠崟锛堟湭浠樻锛�
- */
- submitCancel() {
- cancelOrder(this.orderSn, { reason: this.reason }).then((res) => {
- if (res.data.success) {
- uni.showToast({
- title: "璁㈠崟宸插彇娑�",
- duration: 2000,
- icon: "none",
- });
- this.initData(this.tabCurrentIndex);
-
- this.cancelShow = false;
- } else {
- uni.showToast({
- title: res.data.message,
- duration: 2000,
- icon: "none",
- });
- this.cancelShow = false;
- }
- });
- },
-
- /**
- * 纭鏀惰揣鏄剧ず
- */
- onRog(sn) {
- this.orderSn = sn;
- this.rogShow = true;
- },
-
- /**
- * 鐐瑰嚮纭鏀惰揣
- */
- confirmRog() {
- confirmReceipt(this.orderSn).then((res) => {
- if (res.data.code == 200) {
- uni.showToast({
- title: "宸茬‘璁ゆ敹璐�",
- duration: 2000,
- icon: "none",
- });
- this.initData(this.tabCurrentIndex);
- this.rogShow = false;
- }
- });
- },
-
- /**
- * 璇勪环鍟嗗搧
- */
- onComment(sn) {
- uni.navigateTo({
- url: "./evaluate/myEvaluate",
- });
- },
-
- /**
- * 閲嶆柊璐拱
- */
- reBuy(order) {
- console.log(order);
- return;
- uni.navigateTo({
- url:
- "/pages/product/goods?id=" + order.id + "&goodsId=" + order.goodsId,
- });
- },
/**
* 鏌ョ湅鐗╂祦
@@ -451,7 +392,7 @@
navigateToLogistics(order) {
uni.navigateTo({
url:
- "/pages/mine/msgTips/packageMsg/logisticsDetail?order_sn=" + order.sn,
+ `/pages/order/deliverDetail?order_sn=${order.sn}`,
});
},
},
diff --git a/pages/tabbar/user/utils/tool.vue b/pages/tabbar/user/utils/tool.vue
index 0896956..d2e4e9d 100644
--- a/pages/tabbar/user/utils/tool.vue
+++ b/pages/tabbar/user/utils/tool.vue
@@ -126,7 +126,7 @@
<image src="/static/mine/setting.png" mode=""></image>
<view>鍟嗗搧绠＄悊</view>
</view>
- <view class="interact-item" @click="navigateTo('/pages/goods-manager/goodsList/goodsList')">
+ <view class="interact-item" @click="navigateTo('/pages/supplier/suppler-order/suppler-order')">
<image src="/static/mine/order.png" mode=""></image>
<view>鍟嗘埛璁㈠崟绠＄悊</view>
</view>
diff --git a/pages/userPermissions/userPermissions.vue b/pages/userPermissions/userPermissions.vue
index 7a4c50c..5f4d1b6 100644
--- a/pages/userPermissions/userPermissions.vue
+++ b/pages/userPermissions/userPermissions.vue
@@ -5,7 +5,7 @@
<text class="title">鐢ㄦ埛鍒楄〃</text>
</view>
<view>
- <button class="add-btn" @click="navigateToAdd()" :disabled="!isShopkeeper">鏂板鐢ㄦ埛</button>
+ <button class="add-btn" @click="navigateToAdd()">鏂板鐢ㄦ埛</button>
</view>
<!-- 鎼滅储妗� -->
<view class="search-box">
diff --git a/uni_modules/uni-datetime-picker/changelog.md b/uni_modules/uni-datetime-picker/changelog.md
new file mode 100644
index 0000000..e606c4d
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/changelog.md
@@ -0,0 +1,169 @@
+## 2.2.40锛�2025-04-14锛�
+- 淇 缁戝畾瀛楃涓插�肩殑鏃讹紝鏃ュ巻闈㈡澘閫変腑鐘舵�佹湭閲嶇疆鍒伴粯璁ゅ�肩殑闂
+## 2.2.39锛�2025-04-14锛�
+- 淇 鍦� iOS 寰俊灏忕▼搴忎笂type='daterange'鏃讹紝浼犲叆'YYYY-MM-DD'鏍煎紡涓嶇敓鏁堢殑闂
+
+## 2.2.38锛�2024-10-15锛�
+- 淇 寰俊灏忕▼搴忎腑鐨刧etSystemInfo璀﹀憡
+## 2.2.35锛�2024-09-21锛�
+- 淇 娌℃湁閫変腑鏃ユ湡鏃剁偣鍑荤‘瀹氱洿鎺ユ姤閿欑殑Bug [璇︽儏](https://ask.dcloud.net.cn/question/198168)
+## 2.2.34锛�2024-04-24锛�
+- 鏂板 鏃ユ湡鐐瑰嚮浜嬩欢锛屽湪鐐瑰嚮鏃ユ湡鏃朵細瑙﹀彂璇ヤ簨浠躲��
+## 2.2.33锛�2024-04-15锛�
+- 淇 鎶栭煶灏忕▼搴忎簨浠朵紶閫掑け鏁坆ug
+## 2.2.32锛�2024-02-20锛�
+- 淇 鏃ュ巻鐨刢lose浜嬩欢瑙﹀彂寮傚父鐨刡ug [璇︽儏](https://github.com/dcloudio/uni-ui/issues/844)
+## 2.2.31锛�2024-02-20锛�
+- 淇 h5骞冲彴 鍙宠竟鏃ュ巻鐨勬湀浠介粯璁�+1鐨刡ug [璇︽儏](https://github.com/dcloudio/uni-ui/issues/841)
+## 2.2.30锛�2024-01-31锛�
+- 淇 闅愯棌鈥滅鈥濇椂锛屽湪IOS15鍙婁互涓嬬増鏈椂鍑虹幇 缁撴潫鏃堕棿鍦ㄥ紑濮嬫椂闂翠箣鍓� 鐨刡ug [璇︽儏](https://github.com/dcloudio/uni-ui/issues/788)
+## 2.2.29锛�2024-01-20锛�
+- 鏂板 show浜嬩欢锛屽脊绐楀脊鍑烘椂瑙﹀彂璇ヤ簨浠� [璇︽儏](https://github.com/dcloudio/uni-app/issues/4694)
+## 2.2.28锛�2024-01-18锛�
+- 鍘婚櫎 noChange浜嬩欢锛屽綋杩涜鏃ユ湡鑼冨洿閫夋嫨鏃讹紝鑻ュ彧閫変簡涓�澶╋紝鍒欏紑濮嬬粨鏉熸棩鏈熼兘涓哄悓涓�澶� [璇︽儏](https://github.com/dcloudio/uni-ui/issues/815)
+## 2.2.27锛�2024-01-10锛�
+- 浼樺寲 澧炲姞noChange浜嬩欢锛屽綋杩涜鏃ユ湡鑼冨洿閫夋嫨鏃讹紝鑻ユ湁绌哄�硷紝鍒欒Е鍙戣浜嬩欢 [璇︽儏](https://github.com/dcloudio/uni-ui/issues/815)
+## 2.2.26锛�2024-01-08锛�
+- 淇 瀛楄妭灏忕▼搴忔椂闂撮�夋嫨鑼冨洿鍣ㄥけ鏁堥棶棰� [璇︽儏](https://github.com/dcloudio/uni-ui/issues/834)
+## 2.2.25锛�2023-10-18锛�
+- 淇 PC绔垵娆′慨鏀规椂闂达紝寮�濮嬫椂闂存湭鏇存柊鐨凚ug [璇︽儏](https://github.com/dcloudio/uni-ui/issues/737)
+## 2.2.24锛�2023-06-02锛�
+- 淇 閮ㄥ垎鎯呭喌淇敼鏃堕棿锛屽紑濮嬨�佺粨鏉熸椂闂存樉绀哄紓甯哥殑Bug [璇︽儏](https://ask.dcloud.net.cn/question/171146)
+- 浼樺寲 褰撳墠鏈堝彲浠ラ�夋嫨涓婃湀銆佷笅鏈堢殑鏃ユ湡鐨凚ug
+## 2.2.23锛�2023-05-02锛�
+- 淇 閮ㄥ垎鎯呭喌淇敼鏃堕棿锛屽紑濮嬫椂闂存湭鏇存柊鐨凚ug [璇︽儏](https://github.com/dcloudio/uni-ui/issues/737)
+- 淇 閮ㄥ垎骞冲彴鍙婅澶囩涓�娆＄偣鍑绘棤娉曟樉绀哄脊妗嗙殑Bug
+- 淇 ios 鏃ユ湡鏍煎紡鏈ˉ闆舵樉绀哄強浣跨敤寮傚父鐨凚ug [璇︽儏](https://ask.dcloud.net.cn/question/162979)
+## 2.2.22锛�2023-03-30锛�
+- 淇 鏃ュ巻 picker 淇敼骞存湀鍚庯紝鑷姩閫変腑褰撴湀1鏃ョ殑Bug [璇︽儏](https://ask.dcloud.net.cn/question/165937)
+- 淇 灏忕▼搴忕 浣庣増鏈� ios NaN鐨凚ug [璇︽儏](https://ask.dcloud.net.cn/question/162979)
+## 2.2.21锛�2023-02-20锛�
+- 淇 firefox 娴忚鍣ㄦ樉绀哄尯鍩熺偣鍑绘棤娉曟媺璧锋棩鍘嗗脊妗嗙殑Bug [璇︽儏](https://ask.dcloud.net.cn/question/163362)
+## 2.2.20锛�2023-02-17锛�
+- 浼樺寲 鍊间负绌轰緷鐒堕�変腑褰撳ぉ闂
+- 浼樺寲 鎻愪緵 default-value 灞炴�ф敮鎸侀厤缃�夋嫨鍣ㄦ墦寮�鏃堕粯璁ゆ樉绀虹殑鏃堕棿
+- 浼樺寲 闈炶寖鍥撮�夋嫨鏈�夋嫨鏃ユ湡鏃堕棿锛岀偣鍑荤‘璁ゆ寜閽�変腑褰撳墠鏃ユ湡鏃堕棿
+- 浼樺寲 瀛楄妭灏忕▼搴忔棩鏈熸椂闂磋寖鍥撮�夋嫨锛屽簳閮ㄦ棩鏈熸崲琛岀殑Bug
+## 2.2.19锛�2023-02-09锛�
+- 淇 2.2.18 寮曡捣鑼冨洿閫夋嫨閰嶇疆 end 閫夋嫨鏃犳晥鐨凚ug [璇︽儏](https://github.com/dcloudio/uni-ui/issues/686)
+## 2.2.18锛�2023-02-08锛�
+- 淇 绉诲姩绔寖鍥撮�夋嫨change浜嬩欢瑙﹀彂寮傚父鐨凚ug [璇︽儏](https://github.com/dcloudio/uni-ui/issues/684)
+- 浼樺寲 PC绔緭鍏ユ棩鏈熸牸寮忛敊璇椂杩斿洖褰撳墠鏃ユ湡鏃堕棿
+- 浼樺寲 PC绔緭鍏ユ棩鏈熸椂闂磋秴鍑� start銆乪nd 闄愬埗鐨凚ug
+- 浼樺寲 绉诲姩绔棩鏈熸椂闂磋寖鍥寸敤娉曟椂闂村睍绀轰笉瀹屾暣闂
+## 2.2.17锛�2023-02-04锛�
+- 淇 灏忕▼搴忕缁戝畾 Date 绫诲瀷鎶ラ敊鐨凚ug [璇︽儏](https://github.com/dcloudio/uni-ui/issues/679)
+- 淇 vue3 time-picker 鏃犳硶鏄剧ず缁戝畾鏃跺垎绉掔殑Bug
+## 2.2.16锛�2023-02-02锛�
+- 淇 瀛楄妭灏忕▼搴忔姤閿欑殑Bug
+## 2.2.15锛�2023-02-02锛�
+- 淇 鏌愪簺鎯呭喌鍒囨崲鏈堜唤閿欒鐨凚ug
+## 2.2.14锛�2023-01-30锛�
+- 淇 鏌愪簺鎯呭喌鍒囨崲鏈堜唤閿欒鐨凚ug [璇︽儏](https://ask.dcloud.net.cn/question/162033)
+## 2.2.13锛�2023-01-10锛�
+- 淇 澶氭鍔犺浇缁勪欢閫犳垚鍐呭瓨鍗犵敤鐨凚ug
+## 2.2.12锛�2022-12-01锛�
+- 淇 vue3 涓� i18n 鍥介檯鍖栧垵濮嬪�间笉姝ｇ‘鐨凚ug
+## 2.2.11锛�2022-09-19锛�
+- 淇 鏀粯瀹濆皬绋嬪簭鏍峰紡閿欎贡鐨凚ug [璇︽儏](https://github.com/dcloudio/uni-app/issues/3861)
+## 2.2.10锛�2022-09-19锛�
+- 淇 鍙嶅悜閫夋嫨鏃ユ湡鑼冨洿锛屾棩鏈熸樉绀哄紓甯哥殑Bug [璇︽儏](https://ask.dcloud.net.cn/question/153401?item_id=212892&rf=false)
+## 2.2.9锛�2022-09-16锛�
+- 鍙互浣跨敤 uni-scss 鎺у埗涓婚鑹�
+## 2.2.8锛�2022-09-08锛�
+- 淇 close浜嬩欢鏃犳晥鐨凚ug
+## 2.2.7锛�2022-09-05锛�
+- 淇 绉诲姩绔� maskClick 鏃犳晥鐨凚ug [璇︽儏](https://ask.dcloud.net.cn/question/140824)
+## 2.2.6锛�2022-06-30锛�
+- 浼樺寲 缁勪欢鏍峰紡锛岃皟鏁翠簡缁勪欢鍥炬爣澶у皬銆侀珮搴︺�侀鑹茬瓑锛屼笌uni-ui椋庢牸淇濇寔涓�鑷�
+## 2.2.5锛�2022-06-24锛�
+- 淇 鏃ュ巻椤堕儴骞存湀鍙婂簳閮ㄧ‘璁ゆ湭鍥介檯鍖栫殑Bug
+## 2.2.4锛�2022-03-31锛�
+- 淇 Vue3 涓嬪姩鎬佽祴鍊�,鍗曢�夌被鍨嬫湭鍝嶅簲鐨凚ug
+## 2.2.3锛�2022-03-28锛�
+- 淇 Vue3 涓嬪姩鎬佽祴鍊兼湭鍝嶅簲鐨凚ug
+## 2.2.2锛�2021-12-10锛�
+- 淇 clear-icon 灞炴�у湪灏忕▼搴忓钩鍙颁笉鐢熸晥鐨凚ug
+## 2.2.1锛�2021-12-10锛�
+- 淇 鏃ユ湡鑼冨洿閫夊湪灏忕▼搴忓钩鍙帮紝蹇呴』澶氱偣鍑讳竴娆℃墠鑳藉彇娑堥�変腑鐘舵�佺殑Bug
+## 2.2.0锛�2021-11-19锛�
+- 浼樺寲 缁勪欢UI锛屽苟鎻愪緵璁捐璧勬簮 [璇︽儏](https://uniapp.dcloud.io/component/uniui/resource)
+- 鏂囨。杩佺Щ [https://uniapp.dcloud.io/component/uniui/uni-datetime-picker](https://uniapp.dcloud.io/component/uniui/uni-datetime-picker)
+## 2.1.5锛�2021-11-09锛�
+- 鏂板 鎻愪緵缁勪欢璁捐璧勬簮锛岀粍浠舵牱寮忚皟鏁�
+## 2.1.4锛�2021-09-10锛�
+- 淇 hide-second 鍦ㄧЩ鍔ㄧ鐨凚ug
+- 淇 鍗曢�夎祴榛樿鍊兼椂锛岃祴鍊兼棩鏈熸湭楂樹寒鐨凚ug
+- 淇 璧嬮粯璁ゅ�兼椂锛岀Щ鍔ㄧ鏈纭樉绀烘椂闂寸殑Bug
+## 2.1.3锛�2021-09-09锛�
+- 鏂板 hide-second 灞炴�э紝鏀寔鍙娇鐢ㄦ椂鍒嗭紝闅愯棌绉�
+## 2.1.2锛�2021-09-03锛�
+- 浼樺寲 鍙栨秷閫変腑鏃讹紙鑼冨洿閫夛級鐩存帴寮�濮嬩笅涓�娆￠�夋嫨, 閬垮厤澶氱偣涓�娆�
+- 浼樺寲 绉诲姩绔敮鎸佹竻闄ゆ寜閽紝鍚屾椂鏀寔閫氳繃 ref 璋冪敤缁勪欢鐨� clear 鏂规硶
+- 浼樺寲 璋冩暣瀛楀彿澶у皬锛岀編鍖栨棩鍘嗙晫闈�
+- 淇 鍥犲浗闄呭寲瀵艰嚧鐨� placeholder 澶辨晥鐨凚ug
+## 2.1.1锛�2021-08-24锛�
+- 鏂板 鏀寔鍥介檯鍖�
+- 浼樺寲 鑼冨洿閫夋嫨鍣ㄥ湪 pc 绔繃瀹界殑闂
+## 2.1.0锛�2021-08-09锛�
+- 鏂板 閫傞厤 vue3
+## 2.0.19锛�2021-08-09锛�
+- 鏂板 鏀寔浣滀负 uni-forms 瀛愮粍浠剁浉鍏冲姛鑳�
+- 淇 鍦� uni-forms 涓娇鐢ㄦ椂锛岄�夋嫨鏃堕棿鎶� NAN 閿欒鐨凚ug
+## 2.0.18锛�2021-08-05锛�
+- 淇 type 灞炴�у姩鎬佽祴鍊兼棤鏁堢殑Bug
+- 淇 鈥樼‘璁も�欐寜閽 tabbar 閬洊 bug
+- 淇 缁勪欢鏈祴鍊兼椂鑼冨洿閫夊乏銆佸彸鏃ュ巻鐩稿悓鐨凚ug
+## 2.0.17锛�2021-08-04锛�
+- 淇 鑼冨洿閫夋湭姝ｇ‘鏄剧ず褰撳墠鍊肩殑Bug
+- 淇 h5 骞冲彴锛堢Щ鍔ㄧ锛夋姤閿� 'cale' of undefined 鐨凚ug
+## 2.0.16锛�2021-07-21锛�
+- 鏂板 return-type 灞炴�ф敮鎸佽繑鍥� date 鏃ユ湡瀵硅薄
+## 2.0.15锛�2021-07-14锛�
+- 淇 鍗曢�夋棩鏈熺被鍨嬶紝鍒濆璧嬪�煎悗涓嶅湪褰撳墠鏃ュ巻鐨凚ug
+- 鏂板 clearIcon 灞炴�э紝鏄剧ず妗嗙殑娓呯┖鎸夐挳鍙厤缃樉绀洪殣钘忥紙浠� pc 鏈夋晥锛�
+- 浼樺寲 绉诲姩绔Щ闄ゆ樉绀烘鐨勬竻绌烘寜閽紝鏃犲疄闄呯敤閫�
+## 2.0.14锛�2021-07-14锛�
+- 淇 缁勪欢璧嬪�间负绌猴紝鐣岄潰鏈洿鏂扮殑Bug
+- 淇 start 鍜� end 涓嶈兘鍔ㄦ�佽祴鍊肩殑Bug
+- 淇 鑼冨洿閫夌被鍨嬶紝鐢ㄦ埛閫夋嫨鍚庡啀娆￠�夋嫨鍙充晶鏃ュ巻锛堢粨鏉熸棩鏈燂級鏄剧ず涓嶆纭殑Bug
+## 2.0.13锛�2021-07-08锛�
+- 淇 鑼冨洿閫夋嫨涓嶈兘鍔ㄦ�佽祴鍊肩殑Bug
+## 2.0.12锛�2021-07-08锛�
+- 淇 鑼冨洿閫夋嫨鐨勫垵濮嬫椂闂村湪涓�涓湀鍐呮椂锛岄�犳垚鏃犳硶閫夋嫨鐨刡ug
+## 2.0.11锛�2021-07-08锛�
+- 浼樺寲 寮瑰嚭灞傚湪瓒呭嚭瑙嗙獥杈圭紭瀹氫綅涓嶅噯纭殑闂
+## 2.0.10锛�2021-07-08锛�
+- 淇 鑼冨洿璧峰鐐规牱寮忕殑鑳屾櫙鑹蹭笌浠婃棩鏍峰紡鐨勫瓧浣撳墠鏅壊铻嶅悎锛屽鑷存棩鏈熷瓧浣撶湅涓嶆竻鐨凚ug
+- 浼樺寲 寮瑰嚭灞傚湪瓒呭嚭瑙嗙獥杈圭紭琚伄鐩栫殑闂
+## 2.0.9锛�2021-07-07锛�
+- 鏂板 maskClick 浜嬩欢
+- 淇 鐗规畩鎯呭喌鏃ュ巻 rpx 甯冨眬閿欒鐨凚ug锛宺px -> px
+- 淇 鑼冨洿閫夋嫨鏃舵竻绌鸿繑鍥炲�间笉鍚堢悊鐨刡ug锛孾'', ''] -> []
+## 2.0.8锛�2021-07-07锛�
+- 鏂板 鏃ユ湡鏃堕棿鏄剧ず妗嗘敮鎸佹彃妲�
+## 2.0.7锛�2021-07-01锛�
+- 浼樺寲 娣诲姞 uni-icons 渚濊禆
+## 2.0.6锛�2021-05-22锛�
+- 淇 鍥炬爣鍦ㄥ皬绋嬪簭涓婁笉鏄剧ず鐨凚ug
+- 浼樺寲 閲嶅懡鍚嶅紩鐢ㄧ粍浠讹紝閬垮厤娼滃湪缁勪欢鍛藉悕鍐茬獊
+## 2.0.5锛�2021-05-20锛�
+- 浼樺寲 浠ｇ爜鐩綍鎵佸钩鍖�
+## 2.0.4锛�2021-05-12锛�
+- 鏂板 缁勪欢绀轰緥鍦板潃
+## 2.0.3锛�2021-05-10锛�
+- 淇 ios 涓嬩笉璇嗗埆 '-' 鏃ユ湡鏍煎紡鐨凚ug
+- 浼樺寲 pc 涓嬪脊鍑哄眰娣诲姞杈规鍜岄槾褰�
+## 2.0.2锛�2021-05-08锛�
+- 淇 鍦� admin 涓幏鍙栧脊鍑哄眰瀹氫綅閿欒鐨刡ug
+## 2.0.1锛�2021-05-08锛�
+- 淇 type 灞炴�у悜涓嬪吋瀹癸紝榛樿鍊间粠 date 鍙樻洿涓� datetime
+## 2.0.0锛�2021-04-30锛�
+- 鏀寔鏃ュ巻褰㈠紡鐨勬棩鏈�+鏃堕棿鐨勮寖鍥撮�夋嫨
+ > 娉ㄦ剰锛氭鐗堟湰涓嶅悜鍚庡吋瀹癸紝涓嶅啀鏀寔鍗曠嫭鏃堕棿閫夋嫨锛坱ype=time锛夊強鐩稿叧鐨� hide-second 灞炴�э紙鏃堕棿閫夊彲浣跨敤鍐呯疆缁勪欢 picker锛�
+## 1.0.6锛�2021-03-18锛�
+- 鏂板 hide-second 灞炴�э紝鏃堕棿鏀寔浠呴�夋嫨鏃躲�佸垎
+- 淇 閫夋嫨璺熸樉绀虹殑鏃ユ湡涓嶄竴鏍风殑Bug
+- 淇 chang浜嬩欢瑙﹀彂2娆＄殑Bug
+- 淇 鍒嗐�佺 end 鑼冨洿閿欒鐨凚ug
+- 浼樺寲 鏇村ソ鐨� nvue 閫傞厤
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/calendar-item.vue b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/calendar-item.vue
new file mode 100644
index 0000000..dba9887
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/calendar-item.vue
@@ -0,0 +1,177 @@
+<template>
+ <view class="uni-calendar-item__weeks-box" :class="{
+ 'uni-calendar-item--disable':weeks.disable,
+ 'uni-calendar-item--before-checked-x':weeks.beforeMultiple,
+ 'uni-calendar-item--multiple': weeks.multiple,
+ 'uni-calendar-item--after-checked-x':weeks.afterMultiple,
+ }" @click="choiceDate(weeks)" @mouseenter="handleMousemove(weeks)">
+ <view class="uni-calendar-item__weeks-box-item" :class="{
+ 'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && (calendar.userChecked || !checkHover),
+ 'uni-calendar-item--checked-range-text': checkHover,
+ 'uni-calendar-item--before-checked':weeks.beforeMultiple,
+ 'uni-calendar-item--multiple': weeks.multiple,
+ 'uni-calendar-item--after-checked':weeks.afterMultiple,
+ 'uni-calendar-item--disable':weeks.disable,
+ }">
+ <text v-if="selected && weeks.extraInfo" class="uni-calendar-item__weeks-box-circle"></text>
+ <text class="uni-calendar-item__weeks-box-text uni-calendar-item__weeks-box-text-disable uni-calendar-item--checked-text">{{weeks.date}}</text>
+ </view>
+ <view :class="{'uni-calendar-item--today': weeks.isToday}"></view>
+ </view>
+</template>
+
+<script>
+ export default {
+ props: {
+ weeks: {
+ type: Object,
+ default () {
+ return {}
+ }
+ },
+ calendar: {
+ type: Object,
+ default: () => {
+ return {}
+ }
+ },
+ selected: {
+ type: Array,
+ default: () => {
+ return []
+ }
+ },
+ checkHover: {
+ type: Boolean,
+ default: false
+ }
+ },
+ methods: {
+ choiceDate(weeks) {
+ this.$emit('change', weeks)
+ },
+ handleMousemove(weeks) {
+ this.$emit('handleMouse', weeks)
+ }
+ }
+ }
+</script>
+
+<style lang="scss" >
+ $uni-primary: #007aff !default;
+
+ .uni-calendar-item__weeks-box {
+ flex: 1;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ margin: 1px 0;
+ position: relative;
+ }
+
+ .uni-calendar-item__weeks-box-text {
+ font-size: 14px;
+ // font-family: Lato-Bold, Lato;
+ font-weight: bold;
+ color: darken($color: $uni-primary, $amount: 40%);
+ }
+
+ .uni-calendar-item__weeks-box-item {
+ position: relative;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ width: 40px;
+ height: 40px;
+ /* #ifdef H5 */
+ cursor: pointer;
+ /* #endif */
+ }
+
+
+ .uni-calendar-item__weeks-box-circle {
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ width: 8px;
+ height: 8px;
+ border-radius: 8px;
+ background-color: #dd524d;
+
+ }
+
+ .uni-calendar-item__weeks-box .uni-calendar-item--disable {
+ cursor: default;
+ }
+
+ .uni-calendar-item--disable .uni-calendar-item__weeks-box-text-disable {
+ color: #D1D1D1;
+ }
+
+ .uni-calendar-item--today {
+ position: absolute;
+ top: 10px;
+ right: 17%;
+ background-color: #dd524d;
+ width:6px;
+ height: 6px;
+ border-radius: 50%;
+ }
+
+ .uni-calendar-item--extra {
+ color: #dd524d;
+ opacity: 0.8;
+ }
+
+ .uni-calendar-item__weeks-box .uni-calendar-item--checked {
+ background-color: $uni-primary;
+ border-radius: 50%;
+ box-sizing: border-box;
+ border: 3px solid #fff;
+ }
+
+ .uni-calendar-item--checked .uni-calendar-item--checked-text {
+ color: #fff;
+ }
+
+ .uni-calendar-item--multiple .uni-calendar-item--checked-range-text {
+ color: #333;
+ }
+
+ .uni-calendar-item--multiple {
+ background-color: #F6F7FC;
+ // color: #fff;
+ }
+
+ .uni-calendar-item--multiple .uni-calendar-item--before-checked,
+ .uni-calendar-item--multiple .uni-calendar-item--after-checked {
+ background-color: $uni-primary;
+ border-radius: 50%;
+ box-sizing: border-box;
+ border: 3px solid #F6F7FC;
+ }
+
+ .uni-calendar-item--before-checked .uni-calendar-item--checked-text,
+ .uni-calendar-item--after-checked .uni-calendar-item--checked-text {
+ color: #fff;
+ }
+
+ .uni-calendar-item--before-checked-x {
+ border-top-left-radius: 50px;
+ border-bottom-left-radius: 50px;
+ box-sizing: border-box;
+ background-color: #F6F7FC;
+ }
+
+ .uni-calendar-item--after-checked-x {
+ border-top-right-radius: 50px;
+ border-bottom-right-radius: 50px;
+ background-color: #F6F7FC;
+ }
+</style>
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/calendar.vue b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/calendar.vue
new file mode 100644
index 0000000..0f9e121
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/calendar.vue
@@ -0,0 +1,947 @@
+<template>
+ <view class="uni-calendar" @mouseleave="leaveCale">
+
+ <view v-if="!insert && show" class="uni-calendar__mask" :class="{'uni-calendar--mask-show':aniMaskShow}"
+ @click="maskClick"></view>
+
+ <view v-if="insert || show" class="uni-calendar__content"
+ :class="{'uni-calendar--fixed':!insert,'uni-calendar--ani-show':aniMaskShow, 'uni-calendar__content-mobile': aniMaskShow}">
+ <view class="uni-calendar__header" :class="{'uni-calendar__header-mobile' :!insert}">
+
+ <view class="uni-calendar__header-btn-box" @click.stop="changeMonth('pre')">
+ <view class="uni-calendar__header-btn uni-calendar--left"></view>
+ </view>
+
+ <picker mode="date" :value="date" fields="month" @change="bindDateChange">
+ <text
+ class="uni-calendar__header-text">{{ (nowDate.year||'') + yearText + ( nowDate.month||'') + monthText}}</text>
+ </picker>
+
+ <view class="uni-calendar__header-btn-box" @click.stop="changeMonth('next')">
+ <view class="uni-calendar__header-btn uni-calendar--right"></view>
+ </view>
+
+ <view v-if="!insert" class="dialog-close" @click="maskClick">
+ <view class="dialog-close-plus" data-id="close"></view>
+ <view class="dialog-close-plus dialog-close-rotate" data-id="close"></view>
+ </view>
+ </view>
+ <view class="uni-calendar__box">
+
+ <view v-if="showMonth" class="uni-calendar__box-bg">
+ <text class="uni-calendar__box-bg-text">{{nowDate.month}}</text>
+ </view>
+
+ <view class="uni-calendar__weeks" style="padding-bottom: 7px;">
+ <view class="uni-calendar__weeks-day">
+ <text class="uni-calendar__weeks-day-text">{{SUNText}}</text>
+ </view>
+ <view class="uni-calendar__weeks-day">
+ <text class="uni-calendar__weeks-day-text">{{MONText}}</text>
+ </view>
+ <view class="uni-calendar__weeks-day">
+ <text class="uni-calendar__weeks-day-text">{{TUEText}}</text>
+ </view>
+ <view class="uni-calendar__weeks-day">
+ <text class="uni-calendar__weeks-day-text">{{WEDText}}</text>
+ </view>
+ <view class="uni-calendar__weeks-day">
+ <text class="uni-calendar__weeks-day-text">{{THUText}}</text>
+ </view>
+ <view class="uni-calendar__weeks-day">
+ <text class="uni-calendar__weeks-day-text">{{FRIText}}</text>
+ </view>
+ <view class="uni-calendar__weeks-day">
+ <text class="uni-calendar__weeks-day-text">{{SATText}}</text>
+ </view>
+ </view>
+
+ <view class="uni-calendar__weeks" v-for="(item,weekIndex) in weeks" :key="weekIndex">
+ <view class="uni-calendar__weeks-item" v-for="(weeks,weeksIndex) in item" :key="weeksIndex">
+ <calendar-item class="uni-calendar-item--hook" :weeks="weeks" :calendar="calendar" :selected="selected"
+ :checkHover="range" @change="choiceDate" @handleMouse="handleMouse">
+ </calendar-item>
+ </view>
+ </view>
+ </view>
+
+ <view v-if="!insert && !range && hasTime" class="uni-date-changed uni-calendar--fixed-top"
+ style="padding: 0 80px;">
+ <view class="uni-date-changed--time-date">{{tempSingleDate ? tempSingleDate : selectDateText}}</view>
+ <time-picker type="time" :start="timepickerStartTime" :end="timepickerEndTime" v-model="time"
+ :disabled="!tempSingleDate" :border="false" :hide-second="hideSecond" class="time-picker-style">
+ </time-picker>
+ </view>
+
+ <view v-if="!insert && range && hasTime" class="uni-date-changed uni-calendar--fixed-top">
+ <view class="uni-date-changed--time-start">
+ <view class="uni-date-changed--time-date">{{tempRange.before ? tempRange.before : startDateText}}
+ </view>
+ <time-picker type="time" :start="timepickerStartTime" v-model="timeRange.startTime" :border="false"
+ :hide-second="hideSecond" :disabled="!tempRange.before" class="time-picker-style">
+ </time-picker>
+ </view>
+ <view style="line-height: 50px;">
+ <uni-icons type="arrowthinright" color="#999"></uni-icons>
+ </view>
+ <view class="uni-date-changed--time-end">
+ <view class="uni-date-changed--time-date">{{tempRange.after ? tempRange.after : endDateText}}</view>
+ <time-picker type="time" :end="timepickerEndTime" v-model="timeRange.endTime" :border="false"
+ :hide-second="hideSecond" :disabled="!tempRange.after" class="time-picker-style">
+ </time-picker>
+ </view>
+ </view>
+
+ <view v-if="!insert" class="uni-date-changed uni-date-btn--ok">
+ <view class="uni-datetime-picker--btn" @click="confirm">{{confirmText}}</view>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ import {
+ Calendar,
+ getDate,
+ getTime
+ } from './util.js';
+ import calendarItem from './calendar-item.vue'
+ import timePicker from './time-picker.vue'
+
+ import {
+ initVueI18n
+ } from '@dcloudio/uni-i18n'
+ import i18nMessages from './i18n/index.js'
+ const {
+ t
+ } = initVueI18n(i18nMessages)
+
+ /**
+ * Calendar 鏃ュ巻
+ * @description 鏃ュ巻缁勪欢鍙互鏌ョ湅鏃ユ湡锛岄�夋嫨浠绘剰鑼冨洿鍐呯殑鏃ユ湡锛屾墦鐐规搷浣溿�傚父鐢ㄥ満鏅锛氶厭搴楁棩鏈熼璁€�佺伀杞︽満绁ㄩ�夋嫨璐拱鏃ユ湡銆佷笂涓嬬彮鎵撳崱绛�
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=56
+ * @property {String} date 鑷畾涔夊綋鍓嶆椂闂达紝榛樿涓轰粖澶�
+ * @property {String} startDate 鏃ユ湡閫夋嫨鑼冨洿-寮�濮嬫棩鏈�
+ * @property {String} endDate 鏃ユ湡閫夋嫨鑼冨洿-缁撴潫鏃ユ湡
+ * @property {Boolean} range 鑼冨洿閫夋嫨
+ * @property {Boolean} insert = [true|false] 鎻掑叆妯″紡,榛樿涓篺alse
+ * @value true 寮圭獥妯″紡
+ * @value false 鎻掑叆妯″紡
+ * @property {Boolean} clearDate = [true|false] 寮圭獥妯″紡鏄惁娓呯┖涓婃閫夋嫨鍐呭
+ * @property {Array} selected 鎵撶偣锛屾湡寰呮牸寮廩{date: '2019-06-27', info: '绛惧埌', data: { custom: '鑷畾涔変俊鎭�', name: '鑷畾涔夋秷鎭ご',xxx:xxx... }}]
+ * @property {Boolean} showMonth 鏄惁閫夋嫨鏈堜唤涓鸿儗鏅�
+ * @property {[String} defaultValue 閫夋嫨鍣ㄦ墦寮�鏃堕粯璁ゆ樉绀虹殑鏃堕棿
+ * @event {Function} change 鏃ユ湡鏀瑰彉锛宍insert :ture` 鏃剁敓鏁�
+ * @event {Function} confirm 纭閫夋嫨`insert :false` 鏃剁敓鏁�
+ * @event {Function} monthSwitch 鍒囨崲鏈堜唤鏃惰Е鍙�
+ * @example <uni-calendar :insert="true" :start-date="'2019-3-2'":end-date="'2019-5-20'"@change="change" />
+ */
+ export default {
+ components: {
+ calendarItem,
+ timePicker
+ },
+
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ props: {
+ date: {
+ type: String,
+ default: ''
+ },
+ defTime: {
+ type: [String, Object],
+ default: ''
+ },
+ selectableTimes: {
+ type: [Object],
+ default () {
+ return {}
+ }
+ },
+ selected: {
+ type: Array,
+ default () {
+ return []
+ }
+ },
+ startDate: {
+ type: String,
+ default: ''
+ },
+ endDate: {
+ type: String,
+ default: ''
+ },
+ startPlaceholder: {
+ type: String,
+ default: ''
+ },
+ endPlaceholder: {
+ type: String,
+ default: ''
+ },
+ range: {
+ type: Boolean,
+ default: false
+ },
+ hasTime: {
+ type: Boolean,
+ default: false
+ },
+ insert: {
+ type: Boolean,
+ default: true
+ },
+ showMonth: {
+ type: Boolean,
+ default: true
+ },
+ clearDate: {
+ type: Boolean,
+ default: true
+ },
+ checkHover: {
+ type: Boolean,
+ default: true
+ },
+ hideSecond: {
+ type: [Boolean],
+ default: false
+ },
+ pleStatus: {
+ type: Object,
+ default () {
+ return {
+ before: '',
+ after: '',
+ data: [],
+ fulldate: ''
+ }
+ }
+ },
+ defaultValue: {
+ type: [String, Object, Array],
+ default: ''
+ }
+ },
+ data() {
+ return {
+ show: false,
+ weeks: [],
+ calendar: {},
+ nowDate: {},
+ aniMaskShow: false,
+ firstEnter: true,
+ time: '',
+ timeRange: {
+ startTime: '',
+ endTime: ''
+ },
+ tempSingleDate: '',
+ tempRange: {
+ before: '',
+ after: ''
+ }
+ }
+ },
+ watch: {
+ date: {
+ immediate: true,
+ handler(newVal) {
+ if (!this.range) {
+ this.tempSingleDate = newVal
+ setTimeout(() => {
+ this.init(newVal)
+ }, 100)
+ }
+ }
+ },
+ defTime: {
+ immediate: true,
+ handler(newVal) {
+ if (!this.range) {
+ this.time = newVal
+ } else {
+ this.timeRange.startTime = newVal.start
+ this.timeRange.endTime = newVal.end
+ }
+ }
+ },
+ startDate(val) {
+ // 瀛楄妭灏忕▼搴� watch 鏃╀簬 created
+ if (!this.cale) {
+ return
+ }
+ this.cale.setStartDate(val)
+ this.cale.setDate(this.nowDate.fullDate)
+ this.weeks = this.cale.weeks
+ },
+ endDate(val) {
+ // 瀛楄妭灏忕▼搴� watch 鏃╀簬 created
+ if (!this.cale) {
+ return
+ }
+ this.cale.setEndDate(val)
+ this.cale.setDate(this.nowDate.fullDate)
+ this.weeks = this.cale.weeks
+ },
+ selected(newVal) {
+ // 瀛楄妭灏忕▼搴� watch 鏃╀簬 created
+ if (!this.cale) {
+ return
+ }
+ this.cale.setSelectInfo(this.nowDate.fullDate, newVal)
+ this.weeks = this.cale.weeks
+ },
+ pleStatus: {
+ immediate: true,
+ handler(newVal) {
+ const {
+ before,
+ after,
+ fulldate,
+ which
+ } = newVal
+ this.tempRange.before = before
+ this.tempRange.after = after
+ setTimeout(() => {
+ if (fulldate) {
+ this.cale.setHoverMultiple(fulldate)
+ if (before && after) {
+ this.cale.lastHover = true
+ if (this.rangeWithinMonth(after, before)) return
+ this.setDate(before)
+ } else {
+ this.cale.setMultiple(fulldate)
+ this.setDate(this.nowDate.fullDate)
+ this.calendar.fullDate = ''
+ this.cale.lastHover = false
+ }
+ } else {
+ // 瀛楄妭灏忕▼搴� watch 鏃╀簬 created
+ if (!this.cale) {
+ return
+ }
+
+ this.cale.setDefaultMultiple(before, after)
+ if (which === 'left' && before) {
+ this.setDate(before)
+ this.weeks = this.cale.weeks
+ } else if (after) {
+ this.setDate(after)
+ this.weeks = this.cale.weeks
+ }
+ this.cale.lastHover = true
+ }
+ }, 16)
+ }
+ }
+ },
+ computed: {
+ timepickerStartTime() {
+ const activeDate = this.range ? this.tempRange.before : this.calendar.fullDate
+ return activeDate === this.startDate ? this.selectableTimes.start : ''
+ },
+ timepickerEndTime() {
+ const activeDate = this.range ? this.tempRange.after : this.calendar.fullDate
+ return activeDate === this.endDate ? this.selectableTimes.end : ''
+ },
+ /**
+ * for i18n
+ */
+ selectDateText() {
+ return t("uni-datetime-picker.selectDate")
+ },
+ startDateText() {
+ return this.startPlaceholder || t("uni-datetime-picker.startDate")
+ },
+ endDateText() {
+ return this.endPlaceholder || t("uni-datetime-picker.endDate")
+ },
+ okText() {
+ return t("uni-datetime-picker.ok")
+ },
+ yearText() {
+ return t("uni-datetime-picker.year")
+ },
+ monthText() {
+ return t("uni-datetime-picker.month")
+ },
+ MONText() {
+ return t("uni-calender.MON")
+ },
+ TUEText() {
+ return t("uni-calender.TUE")
+ },
+ WEDText() {
+ return t("uni-calender.WED")
+ },
+ THUText() {
+ return t("uni-calender.THU")
+ },
+ FRIText() {
+ return t("uni-calender.FRI")
+ },
+ SATText() {
+ return t("uni-calender.SAT")
+ },
+ SUNText() {
+ return t("uni-calender.SUN")
+ },
+ confirmText() {
+ return t("uni-calender.confirm")
+ },
+ },
+ created() {
+ // 鑾峰彇鏃ュ巻鏂规硶瀹炰緥
+ this.cale = new Calendar({
+ selected: this.selected,
+ startDate: this.startDate,
+ endDate: this.endDate,
+ range: this.range,
+ })
+ // 閫変腑鏌愪竴澶�
+ this.init(this.date)
+ },
+ methods: {
+ leaveCale() {
+ this.firstEnter = true
+ },
+ handleMouse(weeks) {
+ if (weeks.disable) return
+ if (this.cale.lastHover) return
+ let {
+ before,
+ after
+ } = this.cale.multipleStatus
+ if (!before) return
+ this.calendar = weeks
+ // 璁剧疆鑼冨洿閫�
+ this.cale.setHoverMultiple(this.calendar.fullDate)
+ this.weeks = this.cale.weeks
+ // hover鏃讹紝杩涘叆涓�涓棩鍘嗭紝鏇存柊鍙︿竴涓�
+ if (this.firstEnter) {
+ this.$emit('firstEnterCale', this.cale.multipleStatus)
+ this.firstEnter = false
+ }
+ },
+ rangeWithinMonth(A, B) {
+ const [yearA, monthA] = A.split('-')
+ const [yearB, monthB] = B.split('-')
+ return yearA === yearB && monthA === monthB
+ },
+ // 钂欑増鐐瑰嚮浜嬩欢
+ maskClick() {
+ this.close()
+ this.$emit('maskClose')
+ },
+
+ clearCalender() {
+ if (this.range) {
+ this.timeRange.startTime = ''
+ this.timeRange.endTime = ''
+ this.tempRange.before = ''
+ this.tempRange.after = ''
+ this.cale.multipleStatus.before = ''
+ this.cale.multipleStatus.after = ''
+ this.cale.multipleStatus.data = []
+ this.cale.lastHover = false
+ } else {
+ this.time = ''
+ this.tempSingleDate = ''
+ }
+ this.calendar.fullDate = ''
+ this.setDate(new Date())
+ },
+
+ bindDateChange(e) {
+ const value = e.detail.value + '-1'
+ this.setDate(value)
+ },
+ /**
+ * 鍒濆鍖栨棩鏈熸樉绀�
+ * @param {Object} date
+ */
+ init(date) {
+ // 瀛楄妭灏忕▼搴� watch 鏃╀簬 created
+ if (!this.cale) {
+ return
+ }
+ this.cale.setDate(date || new Date())
+ this.weeks = this.cale.weeks
+ this.nowDate = this.cale.getInfo(date)
+ this.calendar = {
+ ...this.nowDate
+ }
+ if (!date) {
+ // 浼樺寲date涓虹┖榛樿涓嶉�変腑浠婂ぉ
+ this.calendar.fullDate = ''
+ if (this.defaultValue && !this.range) {
+ // 鏆傛椂鍙敮鎸佺Щ鍔ㄧ闈炶寖鍥撮�夋嫨
+ const defaultDate = new Date(this.defaultValue)
+ const fullDate = getDate(defaultDate)
+ const year = defaultDate.getFullYear()
+ const month = defaultDate.getMonth() + 1
+ const date = defaultDate.getDate()
+ const day = defaultDate.getDay()
+ this.calendar = {
+ fullDate,
+ year,
+ month,
+ date,
+ day
+ },
+ this.tempSingleDate = fullDate
+ this.time = getTime(defaultDate, this.hideSecond)
+ }
+ }
+ },
+ /**
+ * 鎵撳紑鏃ュ巻寮圭獥
+ */
+ open() {
+ // 寮圭獥妯″紡骞朵笖娓呯悊鏁版嵁
+ if (this.clearDate && !this.insert) {
+ this.cale.cleanMultipleStatus()
+ this.init(this.date)
+ }
+ this.show = true
+ this.$nextTick(() => {
+ setTimeout(() => {
+ this.aniMaskShow = true
+ }, 50)
+ })
+ },
+ /**
+ * 鍏抽棴鏃ュ巻寮圭獥
+ */
+ close() {
+ this.aniMaskShow = false
+ this.$nextTick(() => {
+ setTimeout(() => {
+ this.show = false
+ this.$emit('close')
+ }, 300)
+ })
+ },
+ /**
+ * 纭鎸夐挳
+ */
+ confirm() {
+ this.setEmit('confirm')
+ this.close()
+ },
+ /**
+ * 鍙樺寲瑙﹀彂
+ */
+ change(isSingleChange) {
+ if (!this.insert && !isSingleChange) return
+ this.setEmit('change')
+ },
+ /**
+ * 閫夋嫨鏈堜唤瑙﹀彂
+ */
+ monthSwitch() {
+ let {
+ year,
+ month
+ } = this.nowDate
+ this.$emit('monthSwitch', {
+ year,
+ month: Number(month)
+ })
+ },
+ /**
+ * 娲惧彂浜嬩欢
+ * @param {Object} name
+ */
+ setEmit(name) {
+ if (!this.range) {
+ if (!this.calendar.fullDate) {
+ this.calendar = this.cale.getInfo(new Date())
+ this.tempSingleDate = this.calendar.fullDate
+ }
+ if (this.hasTime && !this.time) {
+ this.time = getTime(new Date(), this.hideSecond)
+ }
+ }
+ let {
+ year,
+ month,
+ date,
+ fullDate,
+ extraInfo
+ } = this.calendar
+ this.$emit(name, {
+ range: this.cale.multipleStatus,
+ year,
+ month,
+ date,
+ time: this.time,
+ timeRange: this.timeRange,
+ fulldate: fullDate,
+ extraInfo: extraInfo || {}
+ })
+ },
+ /**
+ * 閫夋嫨澶╄Е鍙�
+ * @param {Object} weeks
+ */
+ choiceDate(weeks) {
+ if (weeks.disable) return
+ this.calendar = weeks
+ this.calendar.userChecked = true
+ // 璁剧疆澶氶��
+ this.cale.setMultiple(this.calendar.fullDate, true)
+ this.weeks = this.cale.weeks
+ this.tempSingleDate = this.calendar.fullDate
+ const beforeDate = new Date(this.cale.multipleStatus.before).getTime()
+ const afterDate = new Date(this.cale.multipleStatus.after).getTime()
+ if (beforeDate > afterDate && afterDate) {
+ this.tempRange.before = this.cale.multipleStatus.after
+ this.tempRange.after = this.cale.multipleStatus.before
+ } else {
+ this.tempRange.before = this.cale.multipleStatus.before
+ this.tempRange.after = this.cale.multipleStatus.after
+ }
+ this.change(true)
+ },
+ changeMonth(type) {
+ let newDate
+ if (type === 'pre') {
+ newDate = this.cale.getPreMonthObj(this.nowDate.fullDate).fullDate
+ } else if (type === 'next') {
+ newDate = this.cale.getNextMonthObj(this.nowDate.fullDate).fullDate
+ }
+
+ this.setDate(newDate)
+ this.monthSwitch()
+ },
+ /**
+ * 璁剧疆鏃ユ湡
+ * @param {Object} date
+ */
+ setDate(date) {
+ this.cale.setDate(date)
+ this.weeks = this.cale.weeks
+ this.nowDate = this.cale.getInfo(date)
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ $uni-primary: #007aff !default;
+
+ .uni-calendar {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: column;
+ }
+
+ .uni-calendar__mask {
+ position: fixed;
+ bottom: 0;
+ top: 0;
+ left: 0;
+ right: 0;
+ background-color: rgba(0, 0, 0, 0.4);
+ transition-property: opacity;
+ transition-duration: 0.3s;
+ opacity: 0;
+ /* #ifndef APP-NVUE */
+ z-index: 99;
+ /* #endif */
+ }
+
+ .uni-calendar--mask-show {
+ opacity: 1
+ }
+
+ .uni-calendar--fixed {
+ position: fixed;
+ bottom: calc(var(--window-bottom));
+ left: 0;
+ right: 0;
+ transition-property: transform;
+ transition-duration: 0.3s;
+ transform: translateY(460px);
+ /* #ifndef APP-NVUE */
+ z-index: 99;
+ /* #endif */
+ }
+
+ .uni-calendar--ani-show {
+ transform: translateY(0);
+ }
+
+ .uni-calendar__content {
+ background-color: #fff;
+ }
+
+ .uni-calendar__content-mobile {
+ border-top-left-radius: 10px;
+ border-top-right-radius: 10px;
+ box-shadow: 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
+ }
+
+ .uni-calendar__header {
+ position: relative;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ height: 50px;
+ }
+
+ .uni-calendar__header-mobile {
+ padding: 10px;
+ padding-bottom: 0;
+ }
+
+ .uni-calendar--fixed-top {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ justify-content: space-between;
+ border-top-color: rgba(0, 0, 0, 0.4);
+ border-top-style: solid;
+ border-top-width: 1px;
+ }
+
+ .uni-calendar--fixed-width {
+ width: 50px;
+ }
+
+ .uni-calendar__backtoday {
+ position: absolute;
+ right: 0;
+ top: 25rpx;
+ padding: 0 5px;
+ padding-left: 10px;
+ height: 25px;
+ line-height: 25px;
+ font-size: 12px;
+ border-top-left-radius: 25px;
+ border-bottom-left-radius: 25px;
+ color: #fff;
+ background-color: #f1f1f1;
+ }
+
+ .uni-calendar__header-text {
+ text-align: center;
+ width: 100px;
+ font-size: 15px;
+ color: #666;
+ }
+
+ .uni-calendar__button-text {
+ text-align: center;
+ width: 100px;
+ font-size: 14px;
+ color: $uni-primary;
+ /* #ifndef APP-NVUE */
+ letter-spacing: 3px;
+ /* #endif */
+ }
+
+ .uni-calendar__header-btn-box {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ width: 50px;
+ height: 50px;
+ }
+
+ .uni-calendar__header-btn {
+ width: 9px;
+ height: 9px;
+ border-left-color: #808080;
+ border-left-style: solid;
+ border-left-width: 1px;
+ border-top-color: #555555;
+ border-top-style: solid;
+ border-top-width: 1px;
+ }
+
+ .uni-calendar--left {
+ transform: rotate(-45deg);
+ }
+
+ .uni-calendar--right {
+ transform: rotate(135deg);
+ }
+
+
+ .uni-calendar__weeks {
+ position: relative;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ }
+
+ .uni-calendar__weeks-item {
+ flex: 1;
+ }
+
+ .uni-calendar__weeks-day {
+ flex: 1;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ height: 40px;
+ border-bottom-color: #F5F5F5;
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ }
+
+ .uni-calendar__weeks-day-text {
+ font-size: 12px;
+ color: #B2B2B2;
+ }
+
+ .uni-calendar__box {
+ position: relative;
+ // padding: 0 10px;
+ padding-bottom: 7px;
+ }
+
+ .uni-calendar__box-bg {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ justify-content: center;
+ align-items: center;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ }
+
+ .uni-calendar__box-bg-text {
+ font-size: 200px;
+ font-weight: bold;
+ color: #999;
+ opacity: 0.1;
+ text-align: center;
+ /* #ifndef APP-NVUE */
+ line-height: 1;
+ /* #endif */
+ }
+
+ .uni-date-changed {
+ padding: 0 10px;
+ // line-height: 50px;
+ text-align: center;
+ color: #333;
+ border-top-color: #DCDCDC;
+ ;
+ border-top-style: solid;
+ border-top-width: 1px;
+ flex: 1;
+ }
+
+ .uni-date-btn--ok {
+ padding: 20px 15px;
+ }
+
+ .uni-date-changed--time-start {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ align-items: center;
+ }
+
+ .uni-date-changed--time-end {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ align-items: center;
+ }
+
+ .uni-date-changed--time-date {
+ color: #999;
+ line-height: 50px;
+ /* #ifdef MP-TOUTIAO */
+ font-size: 16px;
+ /* #endif */
+ margin-right: 5px;
+ // opacity: 0.6;
+ }
+
+ .time-picker-style {
+ // width: 62px;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ justify-content: center;
+ align-items: center
+ }
+
+ .mr-10 {
+ margin-right: 10px;
+ }
+
+ .dialog-close {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ align-items: center;
+ padding: 0 25px;
+ margin-top: 10px;
+ }
+
+ .dialog-close-plus {
+ width: 16px;
+ height: 2px;
+ background-color: #737987;
+ border-radius: 2px;
+ transform: rotate(45deg);
+ }
+
+ .dialog-close-rotate {
+ position: absolute;
+ transform: rotate(-45deg);
+ }
+
+ .uni-datetime-picker--btn {
+ border-radius: 100px;
+ height: 40px;
+ line-height: 40px;
+ background-color: $uni-primary;
+ color: #fff;
+ font-size: 16px;
+ letter-spacing: 2px;
+ }
+
+ /* #ifndef APP-NVUE */
+ .uni-datetime-picker--btn:active {
+ opacity: 0.7;
+ }
+
+ /* #endif */
+</style>
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/en.json b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/en.json
new file mode 100644
index 0000000..024f22f
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/en.json
@@ -0,0 +1,22 @@
+{
+ "uni-datetime-picker.selectDate": "select date",
+ "uni-datetime-picker.selectTime": "select time",
+ "uni-datetime-picker.selectDateTime": "select date and time",
+ "uni-datetime-picker.startDate": "start date",
+ "uni-datetime-picker.endDate": "end date",
+ "uni-datetime-picker.startTime": "start time",
+ "uni-datetime-picker.endTime": "end time",
+ "uni-datetime-picker.ok": "ok",
+ "uni-datetime-picker.clear": "clear",
+ "uni-datetime-picker.cancel": "cancel",
+ "uni-datetime-picker.year": "-",
+ "uni-datetime-picker.month": "",
+ "uni-calender.MON": "MON",
+ "uni-calender.TUE": "TUE",
+ "uni-calender.WED": "WED",
+ "uni-calender.THU": "THU",
+ "uni-calender.FRI": "FRI",
+ "uni-calender.SAT": "SAT",
+ "uni-calender.SUN": "SUN",
+ "uni-calender.confirm": "confirm"
+}
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/index.js b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/index.js
new file mode 100644
index 0000000..de7509c
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/index.js
@@ -0,0 +1,8 @@
+import en from './en.json'
+import zhHans from './zh-Hans.json'
+import zhHant from './zh-Hant.json'
+export default {
+ en,
+ 'zh-Hans': zhHans,
+ 'zh-Hant': zhHant
+}
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/zh-Hans.json b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/zh-Hans.json
new file mode 100644
index 0000000..d2df5e7
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/zh-Hans.json
@@ -0,0 +1,22 @@
+{
+ "uni-datetime-picker.selectDate": "閫夋嫨鏃ユ湡",
+ "uni-datetime-picker.selectTime": "閫夋嫨鏃堕棿",
+ "uni-datetime-picker.selectDateTime": "閫夋嫨鏃ユ湡鏃堕棿",
+ "uni-datetime-picker.startDate": "寮�濮嬫棩鏈�",
+ "uni-datetime-picker.endDate": "缁撴潫鏃ユ湡",
+ "uni-datetime-picker.startTime": "寮�濮嬫椂闂�",
+ "uni-datetime-picker.endTime": "缁撴潫鏃堕棿",
+ "uni-datetime-picker.ok": "纭畾",
+ "uni-datetime-picker.clear": "娓呴櫎",
+ "uni-datetime-picker.cancel": "鍙栨秷",
+ "uni-datetime-picker.year": "骞�",
+ "uni-datetime-picker.month": "鏈�",
+ "uni-calender.SUN": "鏃�",
+ "uni-calender.MON": "涓�",
+ "uni-calender.TUE": "浜�",
+ "uni-calender.WED": "涓�",
+ "uni-calender.THU": "鍥�",
+ "uni-calender.FRI": "浜�",
+ "uni-calender.SAT": "鍏�",
+ "uni-calender.confirm": "纭"
+}
\ No newline at end of file
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/zh-Hant.json b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/zh-Hant.json
new file mode 100644
index 0000000..d23fa3c
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/i18n/zh-Hant.json
@@ -0,0 +1,22 @@
+{
+ "uni-datetime-picker.selectDate": "閬告搰鏃ユ湡",
+ "uni-datetime-picker.selectTime": "閬告搰鏅傞枔",
+ "uni-datetime-picker.selectDateTime": "閬告搰鏃ユ湡鏅傞枔",
+ "uni-datetime-picker.startDate": "闁嬪鏃ユ湡",
+ "uni-datetime-picker.endDate": "绲愭潫鏃ユ湡",
+ "uni-datetime-picker.startTime": "闁嬪鏃堕棿",
+ "uni-datetime-picker.endTime": "绲愭潫鏃堕棿",
+ "uni-datetime-picker.ok": "纰哄畾",
+ "uni-datetime-picker.clear": "娓呴櫎",
+ "uni-datetime-picker.cancel": "鍙栨秷",
+ "uni-datetime-picker.year": "骞�",
+ "uni-datetime-picker.month": "鏈�",
+ "uni-calender.SUN": "鏃�",
+ "uni-calender.MON": "涓�",
+ "uni-calender.TUE": "浜�",
+ "uni-calender.WED": "涓�",
+ "uni-calender.THU": "鍥�",
+ "uni-calender.FRI": "浜�",
+ "uni-calender.SAT": "鍏�",
+ "uni-calender.confirm": "纰鸿獚"
+}
\ No newline at end of file
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/time-picker.vue b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/time-picker.vue
new file mode 100644
index 0000000..1817692
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/time-picker.vue
@@ -0,0 +1,940 @@
+<template>
+ <view class="uni-datetime-picker">
+ <view @click="initTimePicker">
+ <slot>
+ <view class="uni-datetime-picker-timebox-pointer"
+ :class="{'uni-datetime-picker-disabled': disabled, 'uni-datetime-picker-timebox': border}">
+ <text class="uni-datetime-picker-text">{{time}}</text>
+ <view v-if="!time" class="uni-datetime-picker-time">
+ <text class="uni-datetime-picker-text">{{selectTimeText}}</text>
+ </view>
+ </view>
+ </slot>
+ </view>
+ <view v-if="visible" id="mask" class="uni-datetime-picker-mask" @click="tiggerTimePicker"></view>
+ <view v-if="visible" class="uni-datetime-picker-popup" :class="[dateShow && timeShow ? '' : 'fix-nvue-height']"
+ :style="fixNvueBug">
+ <view class="uni-title">
+ <text class="uni-datetime-picker-text">{{selectTimeText}}</text>
+ </view>
+ <view v-if="dateShow" class="uni-datetime-picker__container-box">
+ <picker-view class="uni-datetime-picker-view" :indicator-style="indicatorStyle" :value="ymd"
+ @change="bindDateChange">
+ <picker-view-column>
+ <view class="uni-datetime-picker-item" v-for="(item,index) in years" :key="index">
+ <text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
+ </view>
+ </picker-view-column>
+ <picker-view-column>
+ <view class="uni-datetime-picker-item" v-for="(item,index) in months" :key="index">
+ <text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
+ </view>
+ </picker-view-column>
+ <picker-view-column>
+ <view class="uni-datetime-picker-item" v-for="(item,index) in days" :key="index">
+ <text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
+ </view>
+ </picker-view-column>
+ </picker-view>
+ <!-- 鍏煎 nvue 涓嶆敮鎸佷吉绫� -->
+ <text class="uni-datetime-picker-sign sign-left">-</text>
+ <text class="uni-datetime-picker-sign sign-right">-</text>
+ </view>
+ <view v-if="timeShow" class="uni-datetime-picker__container-box">
+ <picker-view class="uni-datetime-picker-view" :class="[hideSecond ? 'time-hide-second' : '']"
+ :indicator-style="indicatorStyle" :value="hms" @change="bindTimeChange">
+ <picker-view-column>
+ <view class="uni-datetime-picker-item" v-for="(item,index) in hours" :key="index">
+ <text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
+ </view>
+ </picker-view-column>
+ <picker-view-column>
+ <view class="uni-datetime-picker-item" v-for="(item,index) in minutes" :key="index">
+ <text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
+ </view>
+ </picker-view-column>
+ <picker-view-column v-if="!hideSecond">
+ <view class="uni-datetime-picker-item" v-for="(item,index) in seconds" :key="index">
+ <text class="uni-datetime-picker-item">{{lessThanTen(item)}}</text>
+ </view>
+ </picker-view-column>
+ </picker-view>
+ <!-- 鍏煎 nvue 涓嶆敮鎸佷吉绫� -->
+ <text class="uni-datetime-picker-sign" :class="[hideSecond ? 'sign-center' : 'sign-left']">:</text>
+ <text v-if="!hideSecond" class="uni-datetime-picker-sign sign-right">:</text>
+ </view>
+ <view class="uni-datetime-picker-btn">
+ <view @click="clearTime">
+ <text class="uni-datetime-picker-btn-text">{{clearText}}</text>
+ </view>
+ <view class="uni-datetime-picker-btn-group">
+ <view class="uni-datetime-picker-cancel" @click="tiggerTimePicker">
+ <text class="uni-datetime-picker-btn-text">{{cancelText}}</text>
+ </view>
+ <view @click="setTime">
+ <text class="uni-datetime-picker-btn-text">{{okText}}</text>
+ </view>
+ </view>
+ </view>
+ </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 鍙互鍚屾椂閫夋嫨鏃ユ湡鍜屾椂闂寸殑閫夋嫨鍣�
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=xxx
+ * @property {String} type = [datetime | date | time] 鏄剧ず妯″紡
+ * @property {Boolean} multiple = [true|false] 鏄惁澶氶��
+ * @property {String|Number} value 榛樿鍊�
+ * @property {String|Number} start 璧峰鏃ユ湡鎴栨椂闂�
+ * @property {String|Number} end 璧峰鏃ユ湡鎴栨椂闂�
+ * @property {String} return-type = [timestamp | string]
+ * @event {Function} change 閫変腑鍙戠敓鍙樺寲瑙﹀彂
+ */
+
+ export default {
+ name: 'UniDatetimePicker',
+ data() {
+ return {
+ indicatorStyle: `height: 50px;`,
+ visible: false,
+ fixNvueBug: {},
+ dateShow: true,
+ timeShow: true,
+ title: '鏃ユ湡鍜屾椂闂�',
+ // 杈撳叆妗嗗綋鍓嶆椂闂�
+ time: '',
+ // 褰撳墠鐨勫勾鏈堟棩鏃跺垎绉�
+ year: 1920,
+ month: 0,
+ day: 0,
+ hour: 0,
+ minute: 0,
+ second: 0,
+ // 璧峰鏃堕棿
+ startYear: 1920,
+ startMonth: 1,
+ startDay: 1,
+ startHour: 0,
+ startMinute: 0,
+ startSecond: 0,
+ // 缁撴潫鏃堕棿
+ endYear: 2120,
+ endMonth: 12,
+ endDay: 31,
+ endHour: 23,
+ endMinute: 59,
+ endSecond: 59,
+ }
+ },
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ props: {
+ type: {
+ type: String,
+ default: 'datetime'
+ },
+ value: {
+ type: [String, Number],
+ default: ''
+ },
+ modelValue: {
+ type: [String, Number],
+ default: ''
+ },
+ start: {
+ type: [Number, String],
+ default: ''
+ },
+ end: {
+ type: [Number, String],
+ default: ''
+ },
+ returnType: {
+ type: String,
+ default: 'string'
+ },
+ disabled: {
+ type: [Boolean, String],
+ default: false
+ },
+ border: {
+ type: [Boolean, String],
+ default: true
+ },
+ hideSecond: {
+ type: [Boolean, String],
+ default: false
+ }
+ },
+ watch: {
+ // #ifndef VUE3
+ value: {
+ handler(newVal) {
+ if (newVal) {
+ this.parseValue(fixIosDateFormat(newVal))
+ this.initTime(false)
+ } else {
+ this.time = ''
+ this.parseValue(Date.now())
+ }
+ },
+ immediate: true
+ },
+ // #endif
+ // #ifdef VUE3
+ modelValue: {
+ handler(newVal) {
+ if (newVal) {
+ this.parseValue(fixIosDateFormat(newVal))
+ this.initTime(false)
+ } else {
+ this.time = ''
+ this.parseValue(Date.now())
+ }
+ },
+ immediate: true
+ },
+ // #endif
+ type: {
+ handler(newValue) {
+ if (newValue === 'date') {
+ this.dateShow = true
+ this.timeShow = false
+ this.title = '鏃ユ湡'
+ } else if (newValue === 'time') {
+ this.dateShow = false
+ this.timeShow = true
+ this.title = '鏃堕棿'
+ } else {
+ this.dateShow = true
+ this.timeShow = true
+ this.title = '鏃ユ湡鍜屾椂闂�'
+ }
+ },
+ immediate: true
+ },
+ start: {
+ handler(newVal) {
+ this.parseDatetimeRange(fixIosDateFormat(newVal), 'start')
+ },
+ immediate: true
+ },
+ end: {
+ handler(newVal) {
+ this.parseDatetimeRange(fixIosDateFormat(newVal), 'end')
+ },
+ immediate: true
+ },
+
+ // 鏈堛�佹棩銆佹椂銆佸垎銆佺鍙�夎寖鍥村彉鍖栧悗锛屾鏌ュ綋鍓嶅�兼槸鍚﹀湪鑼冨洿鍐咃紝涓嶅湪鍒欏綋鍓嶅�奸噸缃负鍙�夎寖鍥寸涓�椤�
+ months(newVal) {
+ this.checkValue('month', this.month, newVal)
+ },
+ days(newVal) {
+ this.checkValue('day', this.day, newVal)
+ },
+ hours(newVal) {
+ this.checkValue('hour', this.hour, newVal)
+ },
+ minutes(newVal) {
+ this.checkValue('minute', this.minute, newVal)
+ },
+ seconds(newVal) {
+ this.checkValue('second', this.second, newVal)
+ }
+ },
+ computed: {
+ // 褰撳墠骞淬�佹湀銆佹棩銆佹椂銆佸垎銆佺閫夋嫨鑼冨洿
+ 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]
+ },
+ 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
+ },
+ maxYear() {
+ return this.endYear
+ },
+ minMonth() {
+ if (this.year === this.startYear) {
+ return this.startMonth
+ } else {
+ return 1
+ }
+ },
+ maxMonth() {
+ if (this.year === this.endYear) {
+ return this.endMonth
+ } else {
+ return 12
+ }
+ },
+ minDay() {
+ if (this.year === this.startYear && this.month === this.startMonth) {
+ return this.startDay
+ } else {
+ return 1
+ }
+ },
+ maxDay() {
+ if (this.year === this.endYear && this.month === this.endMonth) {
+ return this.endDay
+ } else {
+ return this.daysInMonth(this.year, this.month)
+ }
+ },
+ minHour() {
+ if (this.type === 'datetime') {
+ if (this.currentDateIsStart) {
+ return this.startHour
+ } else {
+ return 0
+ }
+ }
+ if (this.type === 'time') {
+ return this.startHour
+ }
+ },
+ maxHour() {
+ if (this.type === 'datetime') {
+ if (this.currentDateIsEnd) {
+ return this.endHour
+ } else {
+ return 23
+ }
+ }
+ if (this.type === 'time') {
+ return this.endHour
+ }
+ },
+ minMinute() {
+ if (this.type === 'datetime') {
+ if (this.currentDateIsStart && this.hour === this.startHour) {
+ return this.startMinute
+ } else {
+ return 0
+ }
+ }
+ if (this.type === 'time') {
+ if (this.hour === this.startHour) {
+ return this.startMinute
+ } else {
+ return 0
+ }
+ }
+ },
+ maxMinute() {
+ if (this.type === 'datetime') {
+ if (this.currentDateIsEnd && this.hour === this.endHour) {
+ return this.endMinute
+ } else {
+ return 59
+ }
+ }
+ if (this.type === 'time') {
+ if (this.hour === this.endHour) {
+ return this.endMinute
+ } else {
+ return 59
+ }
+ }
+ },
+ minSecond() {
+ if (this.type === 'datetime') {
+ if (this.currentDateIsStart && this.hour === this.startHour && this.minute === this.startMinute) {
+ return this.startSecond
+ } else {
+ return 0
+ }
+ }
+ if (this.type === 'time') {
+ if (this.hour === this.startHour && this.minute === this.startMinute) {
+ return this.startSecond
+ } else {
+ return 0
+ }
+ }
+ },
+ maxSecond() {
+ if (this.type === 'datetime') {
+ if (this.currentDateIsEnd && this.hour === this.endHour && this.minute === this.endMinute) {
+ return this.endSecond
+ } else {
+ return 59
+ }
+ }
+ if (this.type === 'time') {
+ if (this.hour === this.endHour && this.minute === this.endMinute) {
+ return this.endSecond
+ } else {
+ return 59
+ }
+ }
+ },
+
+ /**
+ * for i18n
+ */
+ selectTimeText() {
+ return t("uni-datetime-picker.selectTime")
+ },
+ okText() {
+ return t("uni-datetime-picker.ok")
+ },
+ clearText() {
+ return t("uni-datetime-picker.clear")
+ },
+ cancelText() {
+ return t("uni-datetime-picker.cancel")
+ }
+ },
+
+ mounted() {
+ // #ifdef APP-NVUE
+ const res = uni.getSystemInfoSync();
+ this.fixNvueBug = {
+ top: res.windowHeight / 2,
+ left: res.windowWidth / 2
+ }
+ // #endif
+ },
+
+ methods: {
+ /**
+ * @param {Object} item
+ * 灏忎簬 10 鍦ㄥ墠闈㈠姞涓� 0
+ */
+
+ lessThanTen(item) {
+ return item < 10 ? '0' + item : item
+ },
+
+ /**
+ * 瑙ｆ瀽鏃跺垎绉掑瓧绗︿覆锛屼緥濡傦細00:00:00
+ * @param {String} timeString
+ */
+ parseTimeType(timeString) {
+ if (timeString) {
+ let timeArr = timeString.split(':')
+ this.hour = Number(timeArr[0])
+ this.minute = Number(timeArr[1])
+ this.second = Number(timeArr[2])
+ }
+ },
+
+ /**
+ * 瑙ｆ瀽閫夋嫨鍣ㄥ垵濮嬪�硷紝绫诲瀷鍙互鏄瓧绗︿覆銆佹椂闂存埑锛屼緥濡傦細2000-10-02銆�'08:30:00'銆� 1610695109000
+ * @param {String | Number} datetime
+ */
+ initPickerValue(datetime) {
+ let defaultValue = null
+ if (datetime) {
+ defaultValue = this.compareValueWithStartAndEnd(datetime, this.start, this.end)
+ } else {
+ defaultValue = Date.now()
+ defaultValue = this.compareValueWithStartAndEnd(defaultValue, this.start, this.end)
+ }
+ this.parseValue(defaultValue)
+ },
+
+ /**
+ * 鍒濆鍊艰鍒欙細
+ * - 鐢ㄦ埛璁剧疆鍒濆鍊� value
+ * - 璁剧疆浜嗚捣濮嬫椂闂� start銆佺粓姝㈡椂闂� end锛屽苟 start < value < end锛屽垵濮嬪�间负 value锛� 鍚﹀垯鍒濆鍊间负 start
+ * - 鍙缃簡璧峰鏃堕棿 start锛屽苟 start < value锛屽垵濮嬪�间负 value锛屽惁鍒欏垵濮嬪�间负 start
+ * - 鍙缃簡缁堟鏃堕棿 end锛屽苟 value < end锛屽垵濮嬪�间负 value锛屽惁鍒欏垵濮嬪�间负 end
+ * - 鏃犺捣濮嬬粓姝㈡椂闂达紝鍒欏垵濮嬪�间负 value
+ * - 鏃犲垵濮嬪�� value锛屽垯鍒濆鍊间负褰撳墠鏈湴鏃堕棿 Date.now()
+ * @param {Object} value
+ * @param {Object} dateBase
+ */
+ compareValueWithStartAndEnd(value, start, end) {
+ let winner = null
+ value = this.superTimeStamp(value)
+ start = this.superTimeStamp(start)
+ end = this.superTimeStamp(end)
+
+ if (start && end) {
+ if (value < start) {
+ winner = new Date(start)
+ } else if (value > end) {
+ winner = new Date(end)
+ } else {
+ winner = new Date(value)
+ }
+ } else if (start && !end) {
+ winner = start <= value ? new Date(value) : new Date(start)
+ } else if (!start && end) {
+ winner = value <= end ? new Date(value) : new Date(end)
+ } else {
+ winner = new Date(value)
+ }
+
+ return winner
+ },
+
+ /**
+ * 杞崲涓哄彲姣旇緝鐨勬椂闂存埑锛屾帴鍙楁棩鏈熴�佹椂鍒嗙銆佹椂闂存埑
+ * @param {Object} value
+ */
+ superTimeStamp(value) {
+ let dateBase = ''
+ if (this.type === 'time' && value && typeof value === 'string') {
+ const now = new Date()
+ const year = now.getFullYear()
+ const month = now.getMonth() + 1
+ const day = now.getDate()
+ dateBase = year + '/' + month + '/' + day + ' '
+ }
+ if (Number(value)) {
+ value = parseInt(value)
+ dateBase = 0
+ }
+ return this.createTimeStamp(dateBase + value)
+ },
+
+ /**
+ * 瑙ｆ瀽榛樿鍊� value锛屽瓧绗︿覆銆佹椂闂存埑
+ * @param {Object} defaultTime
+ */
+ parseValue(value) {
+ if (!value) {
+ return
+ }
+ if (this.type === 'time' && typeof value === "string") {
+ this.parseTimeType(value)
+ } else {
+ let defaultDate = null
+ defaultDate = new Date(value)
+ if (this.type !== 'time') {
+ this.year = defaultDate.getFullYear()
+ this.month = defaultDate.getMonth() + 1
+ this.day = defaultDate.getDate()
+ }
+ if (this.type !== 'date') {
+ this.hour = defaultDate.getHours()
+ this.minute = defaultDate.getMinutes()
+ this.second = defaultDate.getSeconds()
+ }
+ }
+ if (this.hideSecond) {
+ this.second = 0
+ }
+ },
+
+ /**
+ * 瑙ｆ瀽鍙�夋嫨鏃堕棿鑼冨洿 start銆乪nd锛屽勾鏈堟棩瀛楃涓层�佹椂闂存埑
+ * @param {Object} defaultTime
+ */
+ parseDatetimeRange(point, pointType) {
+ // 鏃堕棿涓虹┖锛屽垯閲嶇疆涓哄垵濮嬪��
+ if (!point) {
+ if (pointType === 'start') {
+ this.startYear = 1920
+ this.startMonth = 1
+ this.startDay = 1
+ this.startHour = 0
+ this.startMinute = 0
+ this.startSecond = 0
+ }
+ if (pointType === 'end') {
+ this.endYear = 2120
+ this.endMonth = 12
+ this.endDay = 31
+ this.endHour = 23
+ this.endMinute = 59
+ this.endSecond = 59
+ }
+ return
+ }
+ if (this.type === 'time') {
+ const pointArr = point.split(':')
+ this[pointType + 'Hour'] = Number(pointArr[0])
+ this[pointType + 'Minute'] = Number(pointArr[1])
+ this[pointType + 'Second'] = Number(pointArr[2])
+ } else {
+ if (!point) {
+ pointType === 'start' ? this.startYear = this.year - 60 : this.endYear = this.year + 60
+ return
+ }
+ if (Number(point)) {
+ point = parseInt(point)
+ }
+ // datetime 鐨� end 娌℃湁鏃跺垎绉�, 鍒欎笉闄愬埗
+ const hasTime = /[0-9]:[0-9]/
+ if (this.type === 'datetime' && pointType === 'end' && typeof point === 'string' && !hasTime.test(
+ point)) {
+ point = point + ' 23:59:59'
+ }
+ const pointDate = new Date(point)
+ this[pointType + 'Year'] = pointDate.getFullYear()
+ this[pointType + 'Month'] = pointDate.getMonth() + 1
+ this[pointType + 'Day'] = pointDate.getDate()
+ if (this.type === 'datetime') {
+ this[pointType + 'Hour'] = pointDate.getHours()
+ this[pointType + 'Minute'] = pointDate.getMinutes()
+ this[pointType + 'Second'] = pointDate.getSeconds()
+ }
+ }
+ },
+
+ // 鑾峰彇 骞淬�佹湀銆佹棩銆佹椂銆佸垎銆佺 褰撳墠鍙�夎寖鍥�
+ getCurrentRange(value) {
+ const range = []
+ for (let i = this['min' + this.capitalize(value)]; i <= this['max' + this.capitalize(value)]; i++) {
+ range.push(i)
+ }
+ 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();
+ },
+
+ /**
+ * 鐢熸垚鏃堕棿鎴�
+ * @param {Object} time
+ */
+ createTimeStamp(time) {
+ if (!time) return
+ if (typeof time === "number") {
+ return time
+ } else {
+ time = time.replace(/-/g, '/')
+ if (this.type === 'date') {
+ time = time + ' ' + '00:00:00'
+ }
+ 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') {
+ return hhmmss
+ } else {
+ return yymmdd + ' ' + hhmmss
+ }
+ },
+
+ /**
+ * 鍒濆鍖栬繑鍥炲�硷紝骞舵姏鍑� change 浜嬩欢
+ */
+ initTime(emit = true) {
+ this.time = this.createDomSting()
+ if (!emit) return
+ if (this.returnType === 'timestamp' && this.type !== 'time') {
+ this.$emit('change', this.createTimeStamp(this.time))
+ this.$emit('input', this.createTimeStamp(this.time))
+ this.$emit('update:modelValue', this.createTimeStamp(this.time))
+ } else {
+ this.$emit('change', this.time)
+ this.$emit('input', this.time)
+ this.$emit('update:modelValue', this.time)
+ }
+ },
+
+ /**
+ * 鐢ㄦ埛閫夋嫨鏃ユ湡鎴栨椂闂存洿鏂� data
+ * @param {Object} e
+ */
+ bindDateChange(e) {
+ const val = e.detail.value
+ this.year = this.years[val[0]]
+ this.month = this.months[val[1]]
+ this.day = this.days[val[2]]
+ },
+ bindTimeChange(e) {
+ const val = e.detail.value
+ this.hour = this.hours[val[0]]
+ this.minute = this.minutes[val[1]]
+ this.second = this.seconds[val[2]]
+ },
+
+ /**
+ * 鍒濆鍖栧脊鍑哄眰
+ */
+ initTimePicker() {
+ if (this.disabled) return
+ const value = fixIosDateFormat(this.time)
+ this.initPickerValue(value)
+ this.visible = !this.visible
+ },
+
+ /**
+ * 瑙﹀彂鎴栧叧闂脊妗�
+ */
+ tiggerTimePicker(e) {
+ this.visible = !this.visible
+ },
+
+ /**
+ * 鐢ㄦ埛鐐瑰嚮鈥滄竻绌衡�濇寜閽紝娓呯┖褰撳墠鍊�
+ */
+ clearTime() {
+ this.time = ''
+ this.$emit('change', this.time)
+ this.$emit('input', this.time)
+ this.$emit('update:modelValue', this.time)
+ this.tiggerTimePicker()
+ },
+
+ /**
+ * 鐢ㄦ埛鐐瑰嚮鈥滅‘瀹氣�濇寜閽�
+ */
+ setTime() {
+ this.initTime()
+ this.tiggerTimePicker()
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ $uni-primary: #007aff !default;
+
+ .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: $uni-primary;
+ }
+
+ .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>
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue
new file mode 100644
index 0000000..6cec558
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue
@@ -0,0 +1,1073 @@
+<template>
+ <view class="uni-date">
+ <view class="uni-date-editor" @click="show">
+ <slot>
+ <view class="uni-date-editor--x"
+ :class="{'uni-date-editor--x__disabled': disabled,'uni-date-x--border': border}">
+ <view v-if="!isRange" class="uni-date-x uni-date-single">
+ <uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons>
+ <view class="uni-date__x-input">{{ displayValue || singlePlaceholderText }}</view>
+ </view>
+
+ <view v-else class="uni-date-x uni-date-range">
+ <uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons>
+ <view class="uni-date__x-input text-center">{{ displayRangeValue.startDate || startPlaceholderText }}</view>
+
+ <view class="range-separator">{{rangeSeparator}}</view>
+
+ <view class="uni-date__x-input text-center">{{ displayRangeValue.endDate || endPlaceholderText }}</view>
+ </view>
+
+ <view v-if="showClearIcon" class="uni-date__icon-clear" @click.stop="clear">
+ <uni-icons type="clear" color="#c0c4cc" size="22"></uni-icons>
+ </view>
+ </view>
+ </slot>
+ </view>
+
+ <view v-show="pickerVisible" class="uni-date-mask--pc" @click="close"></view>
+
+ <view v-if="!isPhone" v-show="pickerVisible" ref="datePicker" class="uni-date-picker__container">
+ <view v-if="!isRange" class="uni-date-single--x" :style="pickerPositionStyle">
+ <view class="uni-popper__arrow"></view>
+
+ <view v-if="hasTime" class="uni-date-changed popup-x-header">
+ <input class="uni-date__input text-center" type="text" v-model="inputDate" :placeholder="selectDateText" />
+
+ <time-picker type="time" v-model="pickerTime" :border="false" :disabled="!inputDate"
+ :start="timepickerStartTime" :end="timepickerEndTime" :hideSecond="hideSecond" style="width: 100%;">
+ <input class="uni-date__input text-center" type="text" v-model="pickerTime" :placeholder="selectTimeText"
+ :disabled="!inputDate" />
+ </time-picker>
+ </view>
+
+ <Calendar ref="pcSingle" :showMonth="false" :start-date="calendarRange.startDate"
+ :end-date="calendarRange.endDate" :date="calendarDate" @change="singleChange" :default-value="defaultValue"
+ style="padding: 0 8px;" />
+
+ <view v-if="hasTime" class="popup-x-footer">
+ <text class="confirm-text" @click="confirmSingleChange">{{okText}}</text>
+ </view>
+ </view>
+
+ <view v-else class="uni-date-range--x" :style="pickerPositionStyle">
+ <view class="uni-popper__arrow"></view>
+ <view v-if="hasTime" class="popup-x-header uni-date-changed">
+ <view class="popup-x-header--datetime">
+ <input class="uni-date__input uni-date-range__input" type="text" v-model="tempRange.startDate"
+ :placeholder="startDateText" />
+
+ <time-picker type="time" v-model="tempRange.startTime" :start="timepickerStartTime" :border="false"
+ :disabled="!tempRange.startDate" :hideSecond="hideSecond">
+ <input class="uni-date__input uni-date-range__input" type="text" v-model="tempRange.startTime"
+ :placeholder="startTimeText" :disabled="!tempRange.startDate" />
+ </time-picker>
+ </view>
+
+ <uni-icons type="arrowthinright" color="#999" style="line-height: 40px;"></uni-icons>
+
+ <view class="popup-x-header--datetime">
+ <input class="uni-date__input uni-date-range__input" type="text" v-model="tempRange.endDate"
+ :placeholder="endDateText" />
+
+ <time-picker type="time" v-model="tempRange.endTime" :end="timepickerEndTime" :border="false"
+ :disabled="!tempRange.endDate" :hideSecond="hideSecond">
+ <input class="uni-date__input uni-date-range__input" type="text" v-model="tempRange.endTime"
+ :placeholder="endTimeText" :disabled="!tempRange.endDate" />
+ </time-picker>
+ </view>
+ </view>
+
+ <view class="popup-x-body">
+ <Calendar ref="left" :showMonth="false" :start-date="calendarRange.startDate"
+ :end-date="calendarRange.endDate" :range="true" :pleStatus="endMultipleStatus" @change="leftChange"
+ @firstEnterCale="updateRightCale" style="padding: 0 8px;"/>
+ <Calendar ref="right" :showMonth="false" :start-date="calendarRange.startDate"
+ :end-date="calendarRange.endDate" :range="true" @change="rightChange" :pleStatus="startMultipleStatus"
+ @firstEnterCale="updateLeftCale" style="padding: 0 8px;border-left: 1px solid #F1F1F1;" />
+ </view>
+
+ <view v-if="hasTime" class="popup-x-footer">
+ <text @click="clear">{{clearText}}</text>
+ <text class="confirm-text" @click="confirmRangeChange">{{okText}}</text>
+ </view>
+ </view>
+ </view>
+
+ <Calendar v-if="isPhone" ref="mobile" :clearDate="false" :date="calendarDate" :defTime="mobileCalendarTime"
+ :start-date="calendarRange.startDate" :end-date="calendarRange.endDate" :selectableTimes="mobSelectableTime"
+ :startPlaceholder="startPlaceholder" :endPlaceholder="endPlaceholder" :default-value="defaultValue"
+ :pleStatus="endMultipleStatus" :showMonth="false" :range="isRange" :hasTime="hasTime" :insert="false"
+ :hideSecond="hideSecond" @confirm="mobileChange" @maskClose="close" @change="calendarClick"/>
+ </view>
+</template>
+<script>
+ /**
+ * DatetimePicker 鏃堕棿閫夋嫨鍣�
+ * @description 鍚屾椂鏀寔 PC 鍜岀Щ鍔ㄧ浣跨敤鏃ュ巻閫夋嫨鏃ユ湡鍜屾棩鏈熻寖鍥�
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=3962
+ * @property {String} type 閫夋嫨鍣ㄧ被鍨�
+ * @property {String|Number|Array|Date} value 缁戝畾鍊�
+ * @property {String} placeholder 鍗曢�夋嫨鏃剁殑鍗犱綅鍐呭
+ * @property {String} start 璧峰鏃堕棿
+ * @property {String} end 缁堟鏃堕棿
+ * @property {String} start-placeholder 鑼冨洿閫夋嫨鏃跺紑濮嬫棩鏈熺殑鍗犱綅鍐呭
+ * @property {String} end-placeholder 鑼冨洿閫夋嫨鏃剁粨鏉熸棩鏈熺殑鍗犱綅鍐呭
+ * @property {String} range-separator 閫夋嫨鑼冨洿鏃剁殑鍒嗛殧绗�
+ * @property {Boolean} border = [true|false] 鏄惁鏈夎竟妗�
+ * @property {Boolean} disabled = [true|false] 鏄惁绂佺敤
+ * @property {Boolean} clearIcon = [true|false] 鏄惁鏄剧ず娓呴櫎鎸夐挳锛堜粎PC绔�傜敤锛�
+ * @property {[String} defaultValue 閫夋嫨鍣ㄦ墦寮�鏃堕粯璁ゆ樉绀虹殑鏃堕棿
+ * @event {Function} change 纭畾鏃ユ湡鏃惰Е鍙戠殑浜嬩欢
+ * @event {Function} maskClick 鐐瑰嚮閬僵灞傝Е鍙戠殑浜嬩欢
+ * @event {Function} show 鎵撳紑寮瑰嚭灞�
+ * @event {Function} close 鍏抽棴寮瑰嚭灞�
+ * @event {Function} clear 娓呴櫎涓婃閫変腑鐨勭姸鎬佸拰鍊�
+ **/
+ import Calendar from './calendar.vue'
+ import TimePicker from './time-picker.vue'
+ import {
+ initVueI18n
+ } from '@dcloudio/uni-i18n'
+ import i18nMessages from './i18n/index.js'
+ import {
+ getDateTime,
+ getDate,
+ getTime,
+ getDefaultSecond,
+ dateCompare,
+ checkDate,
+ fixIosDateFormat
+ } from './util'
+
+ export default {
+ name: 'UniDatetimePicker',
+
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ components: {
+ Calendar,
+ TimePicker
+ },
+ data() {
+ return {
+ isRange: false,
+ hasTime: false,
+ displayValue: '',
+ inputDate: '',
+ calendarDate: '',
+ pickerTime: '',
+ calendarRange: {
+ startDate: '',
+ startTime: '',
+ endDate: '',
+ endTime: ''
+ },
+ displayRangeValue: {
+ startDate: '',
+ endDate: '',
+ },
+ tempRange: {
+ startDate: '',
+ startTime: '',
+ endDate: '',
+ endTime: ''
+ },
+ // 宸﹀彸鏃ュ巻鍚屾鏁版嵁
+ startMultipleStatus: {
+ before: '',
+ after: '',
+ data: [],
+ fulldate: ''
+ },
+ endMultipleStatus: {
+ before: '',
+ after: '',
+ data: [],
+ fulldate: ''
+ },
+ pickerVisible: false,
+ pickerPositionStyle: null,
+ isEmitValue: false,
+ isPhone: false,
+ isFirstShow: true,
+ i18nT: () => {}
+ }
+ },
+ props: {
+ type: {
+ type: String,
+ default: 'datetime'
+ },
+ value: {
+ type: [String, Number, Array, Date],
+ default: ''
+ },
+ modelValue: {
+ type: [String, Number, Array, Date],
+ default: ''
+ },
+ start: {
+ type: [Number, String],
+ default: ''
+ },
+ end: {
+ type: [Number, String],
+ default: ''
+ },
+ returnType: {
+ type: String,
+ default: 'string'
+ },
+ placeholder: {
+ type: String,
+ default: ''
+ },
+ startPlaceholder: {
+ type: String,
+ default: ''
+ },
+ endPlaceholder: {
+ type: String,
+ default: ''
+ },
+ rangeSeparator: {
+ type: String,
+ default: '-'
+ },
+ border: {
+ type: [Boolean],
+ default: true
+ },
+ disabled: {
+ type: [Boolean],
+ default: false
+ },
+ clearIcon: {
+ type: [Boolean],
+ default: true
+ },
+ hideSecond: {
+ type: [Boolean],
+ default: false
+ },
+ defaultValue: {
+ type: [String, Object, Array],
+ default: ''
+ }
+ },
+ watch: {
+ type: {
+ immediate: true,
+ handler(newVal) {
+ this.hasTime = newVal.indexOf('time') !== -1
+ this.isRange = newVal.indexOf('range') !== -1
+ }
+ },
+ // #ifndef VUE3
+ value: {
+ immediate: true,
+ handler(newVal) {
+ if (this.isEmitValue) {
+ this.isEmitValue = false
+ return
+ }
+ this.initPicker(newVal)
+ }
+ },
+ // #endif
+ // #ifdef VUE3
+ modelValue: {
+ immediate: true,
+ handler(newVal) {
+ if (this.isEmitValue) {
+ this.isEmitValue = false
+ return
+ }
+ this.initPicker(newVal)
+ }
+ },
+ // #endif
+ start: {
+ immediate: true,
+ handler(newVal) {
+ if (!newVal) return
+ this.calendarRange.startDate = getDate(newVal)
+ if (this.hasTime) {
+ this.calendarRange.startTime = getTime(newVal)
+ }
+ }
+ },
+ end: {
+ immediate: true,
+ handler(newVal) {
+ if (!newVal) return
+ this.calendarRange.endDate = getDate(newVal)
+ if (this.hasTime) {
+ this.calendarRange.endTime = getTime(newVal, this.hideSecond)
+ }
+ }
+ },
+ },
+ computed: {
+ timepickerStartTime() {
+ const activeDate = this.isRange ? this.tempRange.startDate : this.inputDate
+ return activeDate === this.calendarRange.startDate ? this.calendarRange.startTime : ''
+ },
+ timepickerEndTime() {
+ const activeDate = this.isRange ? this.tempRange.endDate : this.inputDate
+ return activeDate === this.calendarRange.endDate ? this.calendarRange.endTime : ''
+ },
+ mobileCalendarTime() {
+ const timeRange = {
+ start: this.tempRange.startTime,
+ end: this.tempRange.endTime
+ }
+ return this.isRange ? timeRange : this.pickerTime
+ },
+ mobSelectableTime() {
+ return {
+ start: this.calendarRange.startTime,
+ end: this.calendarRange.endTime
+ }
+ },
+ datePopupWidth() {
+ // todo
+ return this.isRange ? 653 : 301
+ },
+
+ /**
+ * for i18n
+ */
+ singlePlaceholderText() {
+ return this.placeholder || (this.type === 'date' ? this.selectDateText : this.selectDateTimeText)
+ },
+ startPlaceholderText() {
+ return this.startPlaceholder || this.startDateText
+ },
+ endPlaceholderText() {
+ return this.endPlaceholder || this.endDateText
+ },
+ selectDateText() {
+ return this.i18nT("uni-datetime-picker.selectDate")
+ },
+ selectDateTimeText() {
+ return this.i18nT("uni-datetime-picker.selectDateTime")
+ },
+ selectTimeText() {
+ return this.i18nT("uni-datetime-picker.selectTime")
+ },
+ startDateText() {
+ return this.startPlaceholder || this.i18nT("uni-datetime-picker.startDate")
+ },
+ startTimeText() {
+ return this.i18nT("uni-datetime-picker.startTime")
+ },
+ endDateText() {
+ return this.endPlaceholder || this.i18nT("uni-datetime-picker.endDate")
+ },
+ endTimeText() {
+ return this.i18nT("uni-datetime-picker.endTime")
+ },
+ okText() {
+ return this.i18nT("uni-datetime-picker.ok")
+ },
+ clearText() {
+ return this.i18nT("uni-datetime-picker.clear")
+ },
+ showClearIcon() {
+ return this.clearIcon && !this.disabled && (this.displayValue || (this.displayRangeValue.startDate && this
+ .displayRangeValue.endDate))
+ }
+ },
+ created() {
+ this.initI18nT()
+ this.platform()
+ },
+ methods: {
+ initI18nT() {
+ const vueI18n = initVueI18n(i18nMessages)
+ this.i18nT = vueI18n.t
+ },
+ initPicker(newVal) {
+ if ((!newVal && !this.defaultValue) || Array.isArray(newVal) && !newVal.length) {
+ this.$nextTick(() => {
+ this.clear(false)
+ })
+ return
+ }
+
+ if (!Array.isArray(newVal) && !this.isRange) {
+ if (newVal) {
+ this.displayValue = this.inputDate = this.calendarDate = getDate(newVal)
+ if (this.hasTime) {
+ this.pickerTime = getTime(newVal, this.hideSecond)
+ this.displayValue = `${this.displayValue} ${this.pickerTime}`
+ }
+ } else if (this.defaultValue) {
+ this.inputDate = this.calendarDate = getDate(this.defaultValue)
+ if (this.hasTime) {
+ this.pickerTime = getTime(this.defaultValue, this.hideSecond)
+ }
+ }
+ } else {
+ const [before, after] = newVal
+ if (!before && !after) return
+ const beforeDate = getDate(before)
+ const beforeTime = getTime(before, this.hideSecond)
+
+ const afterDate = getDate(after)
+ const afterTime = getTime(after, this.hideSecond)
+ const startDate = beforeDate
+ const endDate = afterDate
+ this.displayRangeValue.startDate = this.tempRange.startDate = startDate
+ this.displayRangeValue.endDate = this.tempRange.endDate = endDate
+
+ if (this.hasTime) {
+ this.displayRangeValue.startDate = `${beforeDate} ${beforeTime}`
+ this.displayRangeValue.endDate = `${afterDate} ${afterTime}`
+ this.tempRange.startTime = beforeTime
+ this.tempRange.endTime = afterTime
+ }
+ const defaultRange = {
+ before: beforeDate,
+ after: afterDate
+ }
+ this.startMultipleStatus = Object.assign({}, this.startMultipleStatus, defaultRange, {
+ which: 'right'
+ })
+ this.endMultipleStatus = Object.assign({}, this.endMultipleStatus, defaultRange, {
+ which: 'left'
+ })
+ }
+ },
+ updateLeftCale(e) {
+ const left = this.$refs.left
+ // 璁剧疆鑼冨洿閫�
+ left.cale.setHoverMultiple(e.after)
+ left.setDate(this.$refs.left.nowDate.fullDate)
+ },
+ updateRightCale(e) {
+ const right = this.$refs.right
+ // 璁剧疆鑼冨洿閫�
+ right.cale.setHoverMultiple(e.after)
+ right.setDate(this.$refs.right.nowDate.fullDate)
+ },
+ platform() {
+ if (typeof navigator !== "undefined") {
+ this.isPhone = navigator.userAgent.toLowerCase().indexOf('mobile') !== -1
+ return
+ }
+ // #ifdef MP-WEIXIN
+ const {
+ windowWidth
+ } = uni.getWindowInfo()
+ // #endif
+ // #ifndef MP-WEIXIN
+ const {
+ windowWidth
+ } = uni.getSystemInfoSync()
+ // #endif
+ this.isPhone = windowWidth <= 500
+ this.windowWidth = windowWidth
+ },
+ show() {
+ this.$emit("show")
+ if (this.disabled) {
+ return
+ }
+ this.platform()
+ if (this.isPhone) {
+ setTimeout(() => {
+ this.$refs.mobile.open()
+ }, 0);
+ return
+ }
+ this.pickerPositionStyle = {
+ top: '10px'
+ }
+ const dateEditor = uni.createSelectorQuery().in(this).select(".uni-date-editor")
+ dateEditor.boundingClientRect(rect => {
+ if (this.windowWidth - rect.left < this.datePopupWidth) {
+ this.pickerPositionStyle.right = 0
+ }
+ }).exec()
+ setTimeout(() => {
+ this.pickerVisible = !this.pickerVisible
+ if (!this.isPhone && this.isRange && this.isFirstShow) {
+ this.isFirstShow = false
+ const {
+ startDate,
+ endDate
+ } = this.calendarRange
+ if (startDate && endDate) {
+ if (this.diffDate(startDate, endDate) < 30) {
+ this.$refs.right.changeMonth('pre')
+ }
+ } else {
+ // this.$refs.right.changeMonth('next')
+ if (this.isPhone) {
+ this.$refs.right.cale.lastHover = false;
+ }
+ }
+ }
+
+ }, 50)
+ },
+ close() {
+ setTimeout(() => {
+ this.pickerVisible = false
+ this.$emit('maskClick', this.value)
+ this.$refs.mobile && this.$refs.mobile.close()
+ }, 20)
+ },
+ setEmit(value) {
+ if (this.returnType === "timestamp" || this.returnType === "date") {
+ if (!Array.isArray(value)) {
+ if (!this.hasTime) {
+ value = value + ' ' + '00:00:00'
+ }
+ value = this.createTimestamp(value)
+ if (this.returnType === "date") {
+ value = new Date(value)
+ }
+ } else {
+ if (!this.hasTime) {
+ value[0] = value[0] + ' ' + '00:00:00'
+ value[1] = value[1] + ' ' + '00:00:00'
+ }
+ value[0] = this.createTimestamp(value[0])
+ value[1] = this.createTimestamp(value[1])
+ if (this.returnType === "date") {
+ value[0] = new Date(value[0])
+ value[1] = new Date(value[1])
+ }
+ }
+ }
+
+ this.$emit('update:modelValue', value)
+ this.$emit('input', value)
+ this.$emit('change', value)
+ this.isEmitValue = true
+ },
+ createTimestamp(date) {
+ date = fixIosDateFormat(date)
+ return Date.parse(new Date(date))
+ },
+ singleChange(e) {
+ this.calendarDate = this.inputDate = e.fulldate
+ if (this.hasTime) return
+ this.confirmSingleChange()
+ },
+ confirmSingleChange() {
+ if (!checkDate(this.inputDate)) {
+ const now = new Date()
+ this.calendarDate = this.inputDate = getDate(now)
+ this.pickerTime = getTime(now, this.hideSecond)
+ }
+
+ let startLaterInputDate = false
+ let startDate, startTime
+ if (this.start) {
+ let startString = this.start
+ if (typeof this.start === 'number') {
+ startString = getDateTime(this.start, this.hideSecond)
+ }
+ [startDate, startTime] = startString.split(' ')
+ if (this.start && !dateCompare(startDate, this.inputDate)) {
+ startLaterInputDate = true
+ this.inputDate = startDate
+ }
+ }
+
+ let endEarlierInputDate = false
+ let endDate, endTime
+ if (this.end) {
+ let endString = this.end
+ if (typeof this.end === 'number') {
+ endString = getDateTime(this.end, this.hideSecond)
+ }
+ [endDate, endTime] = endString.split(' ')
+ if (this.end && !dateCompare(this.inputDate, endDate)) {
+ endEarlierInputDate = true
+ this.inputDate = endDate
+ }
+ }
+ if (this.hasTime) {
+ if (startLaterInputDate) {
+ this.pickerTime = startTime || getDefaultSecond(this.hideSecond)
+ }
+ if (endEarlierInputDate) {
+ this.pickerTime = endTime || getDefaultSecond(this.hideSecond)
+ }
+ if (!this.pickerTime) {
+ this.pickerTime = getTime(Date.now(), this.hideSecond)
+ }
+ this.displayValue = `${this.inputDate} ${this.pickerTime}`
+ } else {
+ this.displayValue = this.inputDate
+ }
+ this.setEmit(this.displayValue)
+ this.pickerVisible = false
+ },
+ leftChange(e) {
+ const {
+ before,
+ after
+ } = e.range
+ this.rangeChange(before, after)
+ const obj = {
+ before: e.range.before,
+ after: e.range.after,
+ data: e.range.data,
+ fulldate: e.fulldate
+ }
+ this.startMultipleStatus = Object.assign({}, this.startMultipleStatus, obj)
+ this.$emit('calendarClick', e)
+ },
+ rightChange(e) {
+ const {
+ before,
+ after
+ } = e.range
+ this.rangeChange(before, after)
+ const obj = {
+ before: e.range.before,
+ after: e.range.after,
+ data: e.range.data,
+ fulldate: e.fulldate
+ }
+ this.endMultipleStatus = Object.assign({}, this.endMultipleStatus, obj)
+ this.$emit('calendarClick', e)
+ },
+ mobileChange(e) {
+ if (this.isRange) {
+ const {
+ before,
+ after
+ } = e.range
+ if (!before) {
+ return;
+ }
+
+ this.handleStartAndEnd(before, after, true)
+ if (this.hasTime) {
+ const {
+ startTime,
+ endTime
+ } = e.timeRange
+ this.tempRange.startTime = startTime
+ this.tempRange.endTime = endTime
+ }
+ this.confirmRangeChange()
+ } else {
+ if (this.hasTime) {
+ this.displayValue = e.fulldate + ' ' + e.time
+ } else {
+ this.displayValue = e.fulldate
+ }
+ this.setEmit(this.displayValue)
+ this.calendarDate = this.displayValue;
+ }
+ this.$refs.mobile.close()
+ },
+ rangeChange(before, after) {
+ if (!(before && after)) return
+ this.handleStartAndEnd(before, after, true)
+ if (this.hasTime) return
+ this.confirmRangeChange()
+ },
+ confirmRangeChange() {
+ if (!this.tempRange.startDate || !this.tempRange.endDate) {
+ this.pickerVisible = false
+ return
+ }
+ if (!checkDate(this.tempRange.startDate)) {
+ this.tempRange.startDate = getDate(Date.now())
+ }
+ if (!checkDate(this.tempRange.endDate)) {
+ this.tempRange.endDate = getDate(Date.now())
+ }
+
+ let start, end
+
+ let startDateLaterRangeStartDate = false
+ let startDateLaterRangeEndDate = false
+ let startDate, startTime
+
+ let compareStartDateString = this.tempRange.startDate
+ let compareEndDateString = this.tempRange.endDate
+ if (this.hasTime) {
+ compareStartDateString = `${this.tempRange.startDate} ${this.tempRange.startTime}`
+ compareEndDateString = `${this.tempRange.endDate} ${this.tempRange.endTime}`
+ }
+
+ if (this.start) {
+ let startString = this.start
+ if (typeof this.start === 'number') {
+ startString = getDateTime(this.start, this.hideSecond)
+ }
+ [startDate, startTime] = startString.split(' ')
+ if (this.start && !dateCompare(this.start, compareStartDateString)) {
+ startDateLaterRangeStartDate = true
+ this.tempRange.startDate = startDate
+ }
+ if (this.start && !dateCompare(this.start, compareEndDateString)) {
+ startDateLaterRangeEndDate = true
+ this.tempRange.endDate = startDate
+ }
+ }
+ let endDateEarlierRangeStartDate = false
+ let endDateEarlierRangeEndDate = false
+ let endDate, endTime
+ if (this.end) {
+ let endString = this.end
+ if (typeof this.end === 'number') {
+ endString = getDateTime(this.end, this.hideSecond)
+ }
+ [endDate, endTime] = endString.split(' ')
+
+ if (this.end && !dateCompare(compareStartDateString, this.end)) {
+ endDateEarlierRangeStartDate = true
+ this.tempRange.startDate = endDate
+ }
+ if (this.end && !dateCompare(compareEndDateString, this.end)) {
+ endDateEarlierRangeEndDate = true
+ this.tempRange.endDate = endDate
+ }
+ }
+ if (!this.hasTime) {
+ start = this.displayRangeValue.startDate = this.tempRange.startDate
+ end = this.displayRangeValue.endDate = this.tempRange.endDate
+ } else {
+ if (startDateLaterRangeStartDate) {
+ this.tempRange.startTime = startTime || getDefaultSecond(this.hideSecond)
+ } else if (endDateEarlierRangeStartDate) {
+ this.tempRange.startTime = endTime || getDefaultSecond(this.hideSecond)
+ }
+ if (!this.tempRange.startTime) {
+ this.tempRange.startTime = getTime(Date.now(), this.hideSecond)
+ }
+
+ if (startDateLaterRangeEndDate) {
+ this.tempRange.endTime = startTime || getDefaultSecond(this.hideSecond)
+ } else if (endDateEarlierRangeEndDate) {
+ this.tempRange.endTime = endTime || getDefaultSecond(this.hideSecond)
+ }
+ if (!this.tempRange.endTime) {
+ this.tempRange.endTime = getTime(Date.now(), this.hideSecond)
+ }
+ start = this.displayRangeValue.startDate = `${this.tempRange.startDate} ${this.tempRange.startTime}`
+ end = this.displayRangeValue.endDate = `${this.tempRange.endDate} ${this.tempRange.endTime}`
+ }
+ if (!dateCompare(start, end)) {
+ [start, end] = [end, start]
+ }
+ this.displayRangeValue.startDate = start
+ this.displayRangeValue.endDate = end
+ const displayRange = [start, end]
+ this.setEmit(displayRange)
+ this.pickerVisible = false
+ },
+ handleStartAndEnd(before, after, temp = false) {
+ if (!before) return
+ if (!after) after = before;
+ const type = temp ? 'tempRange' : 'range'
+ const isStartEarlierEnd = dateCompare(before, after)
+ this[type].startDate = isStartEarlierEnd ? before : after
+ this[type].endDate = isStartEarlierEnd ? after : before
+ },
+ /**
+ * 姣旇緝鏃堕棿澶у皬
+ */
+ dateCompare(startDate, endDate) {
+ // 璁＄畻鎴鏃堕棿
+ startDate = new Date(startDate.replace('-', '/').replace('-', '/'))
+ // 璁＄畻璇︾粏椤圭殑鎴鏃堕棿
+ endDate = new Date(endDate.replace('-', '/').replace('-', '/'))
+ return startDate <= endDate
+ },
+
+ /**
+ * 姣旇緝鏃堕棿宸�
+ */
+ diffDate(startDate, endDate) {
+ // 璁＄畻鎴鏃堕棿
+ startDate = new Date(startDate.replace('-', '/').replace('-', '/'))
+ // 璁＄畻璇︾粏椤圭殑鎴鏃堕棿
+ endDate = new Date(endDate.replace('-', '/').replace('-', '/'))
+ const diff = (endDate - startDate) / (24 * 60 * 60 * 1000)
+ return Math.abs(diff)
+ },
+
+ clear(needEmit = true) {
+ if (!this.isRange) {
+ this.displayValue = ''
+ this.inputDate = ''
+ this.pickerTime = ''
+ if (this.isPhone) {
+ this.$refs.mobile && this.$refs.mobile.clearCalender()
+ } else {
+ this.$refs.pcSingle && this.$refs.pcSingle.clearCalender()
+ }
+ if (needEmit) {
+ this.$emit('change', '')
+ this.$emit('input', '')
+ this.$emit('update:modelValue', '')
+ }
+ } else {
+ this.displayRangeValue.startDate = ''
+ this.displayRangeValue.endDate = ''
+ this.tempRange.startDate = ''
+ this.tempRange.startTime = ''
+ this.tempRange.endDate = ''
+ this.tempRange.endTime = ''
+ if (this.isPhone) {
+ this.$refs.mobile && this.$refs.mobile.clearCalender()
+ } else {
+ this.$refs.left && this.$refs.left.clearCalender()
+ this.$refs.right && this.$refs.right.clearCalender()
+ this.$refs.right && this.$refs.right.changeMonth('next')
+ }
+ if (needEmit) {
+ this.$emit('change', [])
+ this.$emit('input', [])
+ this.$emit('update:modelValue', [])
+ }
+ }
+ },
+
+ calendarClick(e) {
+ this.$emit('calendarClick', e)
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ $uni-primary: #007aff !default;
+
+ .uni-date {
+ width: 100%;
+ flex: 1;
+ }
+
+ .uni-date-x {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ border-radius: 4px;
+ background-color: #fff;
+ color: #666;
+ font-size: 14px;
+ flex: 1;
+
+ .icon-calendar {
+ padding-left: 3px;
+ }
+
+ .range-separator {
+ height: 35px;
+ /* #ifndef MP */
+ padding: 0 2px;
+ /* #endif */
+ line-height: 35px;
+ }
+ }
+
+ .uni-date-x--border {
+ box-sizing: border-box;
+ border-radius: 4px;
+ border: 1px solid #e5e5e5;
+ }
+
+ .uni-date-editor--x {
+ display: flex;
+ align-items: center;
+ position: relative;
+ }
+
+ .uni-date-editor--x .uni-date__icon-clear {
+ padding-right: 3px;
+ display: flex;
+ align-items: center;
+ /* #ifdef H5 */
+ cursor: pointer;
+ /* #endif */
+ }
+
+ .uni-date__x-input {
+ width: auto;
+ height: 35px;
+ /* #ifndef MP */
+ padding-left: 5px;
+ /* #endif */
+ position: relative;
+ flex: 1;
+ line-height: 35px;
+ font-size: 14px;
+ overflow: hidden;
+ }
+
+ .text-center {
+ text-align: center;
+ }
+
+ .uni-date__input {
+ height: 40px;
+ width: 100%;
+ line-height: 40px;
+ font-size: 14px;
+ }
+
+ .uni-date-range__input {
+ text-align: center;
+ max-width: 142px;
+ }
+
+ .uni-date-picker__container {
+ position: relative;
+ }
+
+ .uni-date-mask--pc {
+ position: fixed;
+ bottom: 0px;
+ top: 0px;
+ left: 0px;
+ right: 0px;
+ background-color: rgba(0, 0, 0, 0);
+ transition-duration: 0.3s;
+ z-index: 996;
+ }
+
+ .uni-date-single--x {
+ background-color: #fff;
+ position: absolute;
+ top: 0;
+ z-index: 999;
+ border: 1px solid #EBEEF5;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+ border-radius: 4px;
+ }
+
+ .uni-date-range--x {
+ background-color: #fff;
+ position: absolute;
+ top: 0;
+ z-index: 999;
+ border: 1px solid #EBEEF5;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+ border-radius: 4px;
+ }
+
+ .uni-date-editor--x__disabled {
+ opacity: 0.4;
+ cursor: default;
+ }
+
+ .uni-date-editor--logo {
+ width: 16px;
+ height: 16px;
+ vertical-align: middle;
+ }
+
+ /* 娣诲姞鏃堕棿 */
+ .popup-x-header {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ }
+
+ .popup-x-header--datetime {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ flex: 1;
+ }
+
+ .popup-x-body {
+ display: flex;
+ }
+
+ .popup-x-footer {
+ padding: 0 15px;
+ border-top-color: #F1F1F1;
+ border-top-style: solid;
+ border-top-width: 1px;
+ line-height: 40px;
+ text-align: right;
+ color: #666;
+ }
+
+ .popup-x-footer text:hover {
+ color: $uni-primary;
+ cursor: pointer;
+ opacity: 0.8;
+ }
+
+ .popup-x-footer .confirm-text {
+ margin-left: 20px;
+ color: $uni-primary;
+ }
+
+ .uni-date-changed {
+ text-align: center;
+ color: #333;
+ border-bottom-color: #F1F1F1;
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ }
+
+ .uni-date-changed--time text {
+ height: 50px;
+ line-height: 50px;
+ }
+
+ .uni-date-changed .uni-date-changed--time {
+ flex: 1;
+ }
+
+ .uni-date-changed--time-date {
+ color: #333;
+ opacity: 0.6;
+ }
+
+ .mr-50 {
+ margin-right: 50px;
+ }
+
+ /* picker 寮瑰嚭灞傞�氱敤鐨勬寚绀哄皬涓夎, todo锛氭墿灞曡嚦涓婁笅宸﹀彸鏂瑰悜瀹氫綅 */
+ .uni-popper__arrow,
+ .uni-popper__arrow::after {
+ position: absolute;
+ display: block;
+ width: 0;
+ height: 0;
+ border: 6px solid transparent;
+ border-top-width: 0;
+ }
+
+ .uni-popper__arrow {
+ filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
+ top: -6px;
+ left: 10%;
+ margin-right: 3px;
+ border-bottom-color: #EBEEF5;
+ }
+
+ .uni-popper__arrow::after {
+ content: " ";
+ top: 1px;
+ margin-left: -6px;
+ border-bottom-color: #fff;
+ }
+</style>
diff --git a/uni_modules/uni-datetime-picker/components/uni-datetime-picker/util.js b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/util.js
new file mode 100644
index 0000000..6e9f47d
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/components/uni-datetime-picker/util.js
@@ -0,0 +1,421 @@
+class Calendar {
+ constructor({
+ selected,
+ startDate,
+ endDate,
+ range,
+ } = {}) {
+ // 褰撳墠鏃ユ湡
+ this.date = this.getDateObj(new Date()) // 褰撳墠鍒濆叆鏃ユ湡
+ // 鎵撶偣淇℃伅
+ this.selected = selected || [];
+ // 璧峰鏃堕棿
+ this.startDate = startDate
+ // 缁堟鏃堕棿
+ this.endDate = endDate
+ // 鏄惁鑼冨洿閫夋嫨
+ this.range = range
+ // 澶氶�夌姸鎬�
+ this.cleanMultipleStatus()
+ // 姣忓懆鏃ユ湡
+ this.weeks = {}
+ this.lastHover = false
+ }
+ /**
+ * 璁剧疆鏃ユ湡
+ * @param {Object} date
+ */
+ setDate(date) {
+ const selectDate = this.getDateObj(date)
+ this.getWeeks(selectDate.fullDate)
+ }
+
+ /**
+ * 娓呯悊澶氶�夌姸鎬�
+ */
+ cleanMultipleStatus() {
+ this.multipleStatus = {
+ before: '',
+ after: '',
+ data: []
+ }
+ }
+
+ setStartDate(startDate) {
+ this.startDate = startDate
+ }
+
+ setEndDate(endDate) {
+ this.endDate = endDate
+ }
+
+ getPreMonthObj(date) {
+ date = fixIosDateFormat(date)
+ date = new Date(date)
+
+ const oldMonth = date.getMonth()
+ date.setMonth(oldMonth - 1)
+ const newMonth = date.getMonth()
+ if (oldMonth !== 0 && newMonth - oldMonth === 0) {
+ date.setMonth(newMonth - 1)
+ }
+ return this.getDateObj(date)
+ }
+ getNextMonthObj(date) {
+ date = fixIosDateFormat(date)
+ date = new Date(date)
+
+ const oldMonth = date.getMonth()
+ date.setMonth(oldMonth + 1)
+ const newMonth = date.getMonth()
+ if (newMonth - oldMonth > 1) {
+ date.setMonth(newMonth - 1)
+ }
+ return this.getDateObj(date)
+ }
+
+ /**
+ * 鑾峰彇鎸囧畾鏍煎紡Date瀵硅薄
+ */
+ getDateObj(date) {
+ date = fixIosDateFormat(date)
+ date = new Date(date)
+
+ return {
+ fullDate: getDate(date),
+ year: date.getFullYear(),
+ month: addZero(date.getMonth() + 1),
+ date: addZero(date.getDate()),
+ day: date.getDay()
+ }
+ }
+
+ /**
+ * 鑾峰彇涓婁竴涓湀鏃ユ湡闆嗗悎
+ */
+ getPreMonthDays(amount, dateObj) {
+ const result = []
+ for (let i = amount - 1; i >= 0; i--) {
+ const month = dateObj.month - 1
+ result.push({
+ date: new Date(dateObj.year, month, -i).getDate(),
+ month,
+ disable: true
+ })
+ }
+ return result
+ }
+ /**
+ * 鑾峰彇鏈湀鏃ユ湡闆嗗悎
+ */
+ getCurrentMonthDays(amount, dateObj) {
+ const result = []
+ const fullDate = this.date.fullDate
+ for (let i = 1; i <= amount; i++) {
+ const currentDate = `${dateObj.year}-${dateObj.month}-${addZero(i)}`
+ const isToday = fullDate === currentDate
+ // 鑾峰彇鎵撶偣淇℃伅
+ const info = this.selected && this.selected.find((item) => {
+ if (this.dateEqual(currentDate, item.date)) {
+ return item
+ }
+ })
+
+ // 鏃ユ湡绂佺敤
+ let disableBefore = true
+ let disableAfter = true
+ if (this.startDate) {
+ disableBefore = dateCompare(this.startDate, currentDate)
+ }
+
+ if (this.endDate) {
+ disableAfter = dateCompare(currentDate, this.endDate)
+ }
+
+ let multiples = this.multipleStatus.data
+ let multiplesStatus = -1
+ if (this.range && multiples) {
+ multiplesStatus = multiples.findIndex((item) => {
+ return this.dateEqual(item, currentDate)
+ })
+ }
+ const checked = multiplesStatus !== -1
+
+ result.push({
+ fullDate: currentDate,
+ year: dateObj.year,
+ date: i,
+ multiple: this.range ? checked : false,
+ beforeMultiple: this.isLogicBefore(currentDate, this.multipleStatus.before, this.multipleStatus.after),
+ afterMultiple: this.isLogicAfter(currentDate, this.multipleStatus.before, this.multipleStatus.after),
+ month: dateObj.month,
+ disable: (this.startDate && !dateCompare(this.startDate, currentDate)) || (this.endDate && !dateCompare(
+ currentDate, this.endDate)),
+ isToday,
+ userChecked: false,
+ extraInfo: info
+ })
+ }
+ return result
+ }
+ /**
+ * 鑾峰彇涓嬩竴涓湀鏃ユ湡闆嗗悎
+ */
+ _getNextMonthDays(amount, dateObj) {
+ const result = []
+ const month = dateObj.month + 1
+ for (let i = 1; i <= amount; i++) {
+ result.push({
+ date: i,
+ month,
+ disable: true
+ })
+ }
+ return result
+ }
+
+ /**
+ * 鑾峰彇褰撳墠鏃ユ湡璇︽儏
+ * @param {Object} date
+ */
+ getInfo(date) {
+ if (!date) {
+ date = new Date()
+ }
+ const res = this.calendar.find(item => item.fullDate === this.getDateObj(date).fullDate)
+ return res ? res : this.getDateObj(date)
+ }
+
+ /**
+ * 姣旇緝鏃堕棿鏄惁鐩哥瓑
+ */
+ dateEqual(before, after) {
+ before = new Date(fixIosDateFormat(before))
+ after = new Date(fixIosDateFormat(after))
+ return before.valueOf() === after.valueOf()
+ }
+
+ /**
+ * 姣旇緝鐪熷疄璧峰鏃ユ湡
+ */
+
+ isLogicBefore(currentDate, before, after) {
+ let logicBefore = before
+ if (before && after) {
+ logicBefore = dateCompare(before, after) ? before : after
+ }
+ return this.dateEqual(logicBefore, currentDate)
+ }
+
+ isLogicAfter(currentDate, before, after) {
+ let logicAfter = after
+ if (before && after) {
+ logicAfter = dateCompare(before, after) ? after : before
+ }
+ return this.dateEqual(logicAfter, currentDate)
+ }
+
+ /**
+ * 鑾峰彇鏃ユ湡鑼冨洿鍐呮墍鏈夋棩鏈�
+ * @param {Object} begin
+ * @param {Object} end
+ */
+ geDateAll(begin, end) {
+ var arr = []
+ var ab = begin.split('-')
+ var ae = end.split('-')
+ var db = new Date()
+ db.setFullYear(ab[0], ab[1] - 1, ab[2])
+ var de = new Date()
+ de.setFullYear(ae[0], ae[1] - 1, ae[2])
+ var unixDb = db.getTime() - 24 * 60 * 60 * 1000
+ var unixDe = de.getTime() - 24 * 60 * 60 * 1000
+ for (var k = unixDb; k <= unixDe;) {
+ k = k + 24 * 60 * 60 * 1000
+ arr.push(this.getDateObj(new Date(parseInt(k))).fullDate)
+ }
+ return arr
+ }
+
+ /**
+ * 鑾峰彇澶氶�夌姸鎬�
+ */
+ setMultiple(fullDate) {
+ if (!this.range) return
+
+ let {
+ before,
+ after
+ } = this.multipleStatus
+ if (before && after) {
+ if (!this.lastHover) {
+ this.lastHover = true
+ return
+ }
+ this.multipleStatus.before = fullDate
+ this.multipleStatus.after = ''
+ this.multipleStatus.data = []
+ this.multipleStatus.fulldate = ''
+ this.lastHover = false
+ } else {
+ if (!before) {
+ this.multipleStatus.before = fullDate
+ this.multipleStatus.after = undefined;
+ this.lastHover = false
+ } else {
+ this.multipleStatus.after = fullDate
+ if (dateCompare(this.multipleStatus.before, this.multipleStatus.after)) {
+ this.multipleStatus.data = this.geDateAll(this.multipleStatus.before, this.multipleStatus
+ .after);
+ } else {
+ this.multipleStatus.data = this.geDateAll(this.multipleStatus.after, this.multipleStatus
+ .before);
+ }
+ this.lastHover = true
+ }
+ }
+ this.getWeeks(fullDate)
+ }
+
+ /**
+ * 榧犳爣 hover 鏇存柊澶氶�夌姸鎬�
+ */
+ setHoverMultiple(fullDate) {
+ //鎶栭煶灏忕▼搴忕偣鍑讳細瑙﹀彂hover浜嬩欢锛岄渶瑕侀伩鍏嶄竴涓�
+ // #ifndef MP-TOUTIAO
+ if (!this.range || this.lastHover) return
+ const {
+ before
+ } = this.multipleStatus
+
+ if (!before) {
+ this.multipleStatus.before = fullDate
+ } else {
+ this.multipleStatus.after = fullDate
+ if (dateCompare(this.multipleStatus.before, this.multipleStatus.after)) {
+ this.multipleStatus.data = this.geDateAll(this.multipleStatus.before, this.multipleStatus.after);
+ } else {
+ this.multipleStatus.data = this.geDateAll(this.multipleStatus.after, this.multipleStatus.before);
+ }
+ }
+ this.getWeeks(fullDate)
+ // #endif
+
+ }
+
+ /**
+ * 鏇存柊榛樿鍊煎閫夌姸鎬�
+ */
+ setDefaultMultiple(before, after) {
+ this.multipleStatus.before = before
+ this.multipleStatus.after = after
+ if (before && after) {
+ if (dateCompare(before, after)) {
+ this.multipleStatus.data = this.geDateAll(before, after);
+ this.getWeeks(after)
+ } else {
+ this.multipleStatus.data = this.geDateAll(after, before);
+ this.getWeeks(before)
+ }
+ }
+ }
+
+ /**
+ * 鑾峰彇姣忓懆鏁版嵁
+ * @param {Object} dateData
+ */
+ getWeeks(dateData) {
+ const {
+ year,
+ month,
+ } = this.getDateObj(dateData)
+
+ const preMonthDayAmount = new Date(year, month - 1, 1).getDay()
+ const preMonthDays = this.getPreMonthDays(preMonthDayAmount, this.getDateObj(dateData))
+
+ const currentMonthDayAmount = new Date(year, month, 0).getDate()
+ const currentMonthDays = this.getCurrentMonthDays(currentMonthDayAmount, this.getDateObj(dateData))
+
+ const nextMonthDayAmount = 42 - preMonthDayAmount - currentMonthDayAmount
+ const nextMonthDays = this._getNextMonthDays(nextMonthDayAmount, this.getDateObj(dateData))
+
+ const calendarDays = [...preMonthDays, ...currentMonthDays, ...nextMonthDays]
+
+ const weeks = new Array(6)
+ for (let i = 0; i < calendarDays.length; i++) {
+ const index = Math.floor(i / 7)
+ if (!weeks[index]) {
+ weeks[index] = new Array(7)
+ }
+ weeks[index][i % 7] = calendarDays[i]
+ }
+
+ this.calendar = calendarDays
+ this.weeks = weeks
+ }
+}
+
+function getDateTime(date, hideSecond) {
+ return `${getDate(date)} ${getTime(date, hideSecond)}`
+}
+
+function getDate(date) {
+ date = fixIosDateFormat(date)
+ date = new Date(date)
+ const year = date.getFullYear()
+ const month = date.getMonth() + 1
+ const day = date.getDate()
+ return `${year}-${addZero(month)}-${addZero(day)}`
+}
+
+function getTime(date, hideSecond) {
+ date = fixIosDateFormat(date)
+ date = new Date(date)
+ const hour = date.getHours()
+ const minute = date.getMinutes()
+ const second = date.getSeconds()
+ return hideSecond ? `${addZero(hour)}:${addZero(minute)}` : `${addZero(hour)}:${addZero(minute)}:${addZero(second)}`
+}
+
+function addZero(num) {
+ if (num < 10) {
+ num = `0${num}`
+ }
+ return num
+}
+
+function getDefaultSecond(hideSecond) {
+ return hideSecond ? '00:00' : '00:00:00'
+}
+
+function dateCompare(startDate, endDate) {
+ startDate = new Date(fixIosDateFormat(startDate))
+ endDate = new Date(fixIosDateFormat(endDate))
+ return startDate <= endDate
+}
+
+function checkDate(date) {
+ const dateReg = /((19|20)\d{2})(-|\/)\d{1,2}(-|\/)\d{1,2}/g
+ return date.match(dateReg)
+}
+//ios浣庣増鏈�15鍙婁互涓嬶紝鏃犳硶鍖归厤 娌℃湁 鈥欑鈥� 鏃剁殑鎯呭喌锛屾墍浠ラ渶瑕佸湪鏈熬 绉� 鍔犱笂 闂彿
+const dateTimeReg = /^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])( [0-5]?[0-9]:[0-5]?[0-9](:[0-5]?[0-9])?)?$/;
+
+function fixIosDateFormat(value) {
+ if (typeof value === 'string' && dateTimeReg.test(value)) {
+ value = value.replace(/-/g, '/')
+ }
+ return value
+}
+
+export {
+ Calendar,
+ getDateTime,
+ getDate,
+ getTime,
+ addZero,
+ getDefaultSecond,
+ dateCompare,
+ checkDate,
+ fixIosDateFormat
+}
diff --git a/uni_modules/uni-datetime-picker/package.json b/uni_modules/uni-datetime-picker/package.json
new file mode 100644
index 0000000..dc83890
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/package.json
@@ -0,0 +1,90 @@
+{
+ "id": "uni-datetime-picker",
+ "displayName": "uni-datetime-picker 鏃ユ湡閫夋嫨鍣�",
+ "version": "2.2.40",
+ "description": "uni-datetime-picker 鏃ユ湡鏃堕棿閫夋嫨鍣紝鏀寔鏃ュ巻锛屾敮鎸佽寖鍥撮�夋嫨",
+ "keywords": [
+ "uni-datetime-picker",
+ "uni-ui",
+ "uniui",
+ "鏃ユ湡鏃堕棿閫夋嫨鍣�",
+ "鏃ユ湡鏃堕棿"
+],
+ "repository": "https://github.com/dcloudio/uni-ui",
+ "engines": {
+ "HBuilderX": ""
+ },
+ "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"
+ },
+ "uni_modules": {
+ "dependencies": [
+ "uni-scss",
+ "uni-icons"
+ ],
+ "encrypt": [],
+ "platforms": {
+ "cloud": {
+ "tcb": "y",
+ "aliyun": "y",
+ "alipay": "n"
+ },
+ "client": {
+ "App": {
+ "app-vue": "y",
+ "app-nvue": "n",
+ "app-harmony": "u",
+ "app-uvue": "u"
+ },
+ "H5-mobile": {
+ "Safari": "y",
+ "Android Browser": "y",
+ "寰俊娴忚鍣�(Android)": "y",
+ "QQ娴忚鍣�(Android)": "y"
+ },
+ "H5-pc": {
+ "Chrome": "y",
+ "IE": "y",
+ "Edge": "y",
+ "Firefox": "y",
+ "Safari": "y"
+ },
+ "灏忕▼搴�": {
+ "寰俊": "y",
+ "闃块噷": "y",
+ "鐧惧害": "y",
+ "瀛楄妭璺冲姩": "y",
+ "QQ": "y"
+ },
+ "蹇簲鐢�": {
+ "鍗庝负": "u",
+ "鑱旂洘": "u"
+ },
+ "Vue": {
+ "vue2": "y",
+ "vue3": "y"
+ }
+ }
+ }
+ }
+}
diff --git a/uni_modules/uni-datetime-picker/readme.md b/uni_modules/uni-datetime-picker/readme.md
new file mode 100644
index 0000000..162fbef
--- /dev/null
+++ b/uni_modules/uni-datetime-picker/readme.md
@@ -0,0 +1,21 @@
+
+
+> `閲嶈閫氱煡锛氱粍浠跺崌绾ф洿鏂� 2.0.0 鍚庯紝鏀寔鏃ユ湡+鏃堕棿鑼冨洿閫夋嫨锛岀粍浠� ui 灏嗕娇鐢ㄦ棩鍘嗛�夋嫨鏃ユ湡锛寀i 鍙樺寲杈冨ぇ锛屽悓鏃舵敮鎸� PC 鍜� 绉诲姩绔�傛鐗堟湰涓嶅悜鍚庡吋瀹癸紝涓嶅啀鏀寔鍗曠嫭鐨勬椂闂撮�夋嫨锛坱ype=time锛夊強鐩稿叧鐨� hide-second 灞炴�э紙鏃堕棿閫夊彲浣跨敤鍐呯疆缁勪欢 picker锛夈�傝嫢浠嶉渶浣跨敤鏃х増鏈紝鍙湪鎻掍欢甯傚満涓嬭浇*闈瀠ni_modules鐗堟湰*锛屾棫鐗堟湰灏嗕笉鍐嶇淮鎶
+
+## DatetimePicker 鏃堕棿閫夋嫨鍣�
+
+> **缁勪欢鍚嶏細uni-datetime-picker**
+> 浠ｇ爜鍧楋細 `uDatetimePicker`
+
+
+璇ョ粍浠剁殑浼樺娍鏄紝鏀寔**鏃堕棿鎴�**杈撳叆鍜岃緭鍑猴紙璧峰鏃堕棿銆佺粓姝㈡椂闂翠篃鏀寔鏃堕棿鎴筹級锛屽彲**鍚屾椂閫夋嫨**鏃ユ湡鍜屾椂闂淬��
+
+鑻ュ彧鏄渶瑕佸崟鐙�夋嫨鏃ユ湡鍜屾椂闂达紝涓嶉渶瑕佹椂闂存埑杈撳叆鍜岃緭鍑猴紝鍙娇鐢ㄥ師鐢熺殑 picker 缁勪欢銆�
+
+**_鐐瑰嚮 picker 榛樿鍊艰鍒欙細_**
+
+- 鑻ヨ缃垵濮嬪�� value, 浼氭樉绀哄湪 picker 鏄剧ず妗嗕腑
+- 鑻ユ棤鍒濆鍊� value锛屽垯鍒濆鍊� value 涓哄綋鍓嶆湰鍦版椂闂� Date.now()锛� 浣嗕笉浼氭樉绀哄湪 picker 鏄剧ず妗嗕腑
+
+### [鏌ョ湅鏂囨。](https://uniapp.dcloud.io/component/uniui/uni-datetime-picker)
+#### 濡備娇鐢ㄨ繃绋嬩腑鏈変换浣曢棶棰橈紝鎴栬�呮偍瀵箄ni-ui鏈変竴浜涘ソ鐨勫缓璁紝娆㈣繋鍔犲叆 uni-ui 浜ゆ祦缇わ細871950839
\ No newline at end of file
diff --git a/uni_modules/uni-table/changelog.md b/uni_modules/uni-table/changelog.md
new file mode 100644
index 0000000..811250e
--- /dev/null
+++ b/uni_modules/uni-table/changelog.md
@@ -0,0 +1,35 @@
+## 1.2.9锛�2025-04-14锛�
+- 淇锛� 涓嬫媺绛涢�変腑 toISOString() 寮曞彂鐨勬椂鍖洪棶棰�
+## 1.2.8锛�2024-10-15锛�
+- 淇 杩愯鍒版姈闊冲皬绋嬪簭涓婂嚭鐜扮殑闂
+## 1.2.7锛�2024-10-15锛�
+- 淇 寰俊灏忕▼搴忎腑鐨刧etSystemInfo璀﹀憡
+## 1.2.4锛�2023-12-19锛�
+- 淇 uni-tr鍙湁涓�鍒楁椂minWidth璁＄畻閿欒锛屽垪鍙樺寲瀹炴椂璁＄畻鏇存柊
+## 1.2.3锛�2023-03-28锛�
+- 淇 鍦╲ue3妯″紡涓嬪彲鑳戒細鍑虹幇閿欒鐨勯棶棰�
+## 1.2.2锛�2022-11-29锛�
+- 浼樺寲 涓婚鏍峰紡
+## 1.2.1锛�2022-06-06锛�
+- 淇 寰俊灏忕▼搴忓瓨鍦ㄦ棤浣跨敤缁勪欢鐨勯棶棰�
+## 1.2.0锛�2021-11-19锛�
+- 浼樺寲 缁勪欢UI锛屽苟鎻愪緵璁捐璧勬簮锛岃瑙�:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
+- 鏂囨。杩佺Щ锛岃瑙�:[https://uniapp.dcloud.io/component/uniui/uni-table](https://uniapp.dcloud.io/component/uniui/uni-table)
+## 1.1.0锛�2021-07-30锛�
+- 缁勪欢鍏煎 vue3锛屽浣曞垱寤簐ue3椤圭洰锛岃瑙� [uni-app 椤圭洰鏀寔 vue3 浠嬬粛](https://ask.dcloud.net.cn/article/37834)
+## 1.0.7锛�2021-07-08锛�
+- 鏂板 uni-th 鏀寔 date 鏃ユ湡绛涢�夎寖鍥�
+## 1.0.6锛�2021-07-05锛�
+- 鏂板 uni-th 鏀寔 range 绛涢�夎寖鍥�
+## 1.0.5锛�2021-06-28锛�
+- 鏂板 uni-th 绛涢�夊姛鑳�
+## 1.0.4锛�2021-05-12锛�
+- 鏂板 绀轰緥鍦板潃
+- 淇 绀轰緥椤圭洰缂哄皯缁勪欢鐨凚ug
+## 1.0.3锛�2021-04-16锛�
+- 鏂板 sortable 灞炴�э紝鏄惁寮�鍚崟鍒楁帓搴�
+- 浼樺寲 琛ㄦ牸澶氶�夐�昏緫
+## 1.0.2锛�2021-03-22锛�
+- uni-tr 娣诲姞 disabled 灞炴�э紝鐢ㄤ簬 type=selection 鏃讹紝璁剧疆鏌愯鏄惁鍙敱鍏ㄩ�夋寜閽帶鍒�
+## 1.0.1锛�2021-02-05锛�
+- 璋冩暣涓簎ni_modules鐩綍瑙勮寖
diff --git a/uni_modules/uni-table/components/uni-table/uni-table.vue b/uni_modules/uni-table/components/uni-table/uni-table.vue
new file mode 100644
index 0000000..3ab0496
--- /dev/null
+++ b/uni_modules/uni-table/components/uni-table/uni-table.vue
@@ -0,0 +1,460 @@
+<template>
+ <view class="uni-table-scroll" :class="{ 'table--border': border, 'border-none': !noData }">
+ <!-- #ifdef H5 -->
+ <table class="uni-table" border="0" cellpadding="0" cellspacing="0" :class="{ 'table--stripe': stripe }" :style="{ 'min-width': minWidth + 'px' }">
+ <slot></slot>
+ <tr v-if="noData" class="uni-table-loading">
+ <td class="uni-table-text" :class="{ 'empty-border': border }">{{ emptyText }}</td>
+ </tr>
+ <view v-if="loading" class="uni-table-mask" :class="{ 'empty-border': border }"><div class="uni-table--loader"></div></view>
+ </table>
+ <!-- #endif -->
+ <!-- #ifndef H5 -->
+ <view class="uni-table" :style="{ 'min-width': minWidth + 'px' }" :class="{ 'table--stripe': stripe }">
+ <slot></slot>
+ <view v-if="noData" class="uni-table-loading">
+ <view class="uni-table-text" :class="{ 'empty-border': border }">{{ emptyText }}</view>
+ </view>
+ <view v-if="loading" class="uni-table-mask" :class="{ 'empty-border': border }"><div class="uni-table--loader"></div></view>
+ </view>
+ <!-- #endif -->
+ </view>
+</template>
+
+<script>
+/**
+ * Table 琛ㄦ牸
+ * @description 鐢ㄤ簬灞曠ず澶氭潯缁撴瀯绫讳技鐨勬暟鎹�
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=3270
+ * @property {Boolean} border 鏄惁甯︽湁绾靛悜杈规
+ * @property {Boolean} stripe 鏄惁鏄剧ず鏂戦┈绾�
+ * @property {Boolean} type 鏄惁寮�鍚閫�
+ * @property {String} emptyText 绌烘暟鎹椂鏄剧ず鐨勬枃鏈唴瀹�
+ * @property {Boolean} loading 鏄剧ず鍔犺浇涓�
+ * @event {Function} selection-change 寮�鍚閫夋椂锛屽綋閫夋嫨椤瑰彂鐢熷彉鍖栨椂浼氳Е鍙戣浜嬩欢
+ */
+export default {
+ name: 'uniTable',
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ emits:['selection-change'],
+ props: {
+ data: {
+ type: Array,
+ default() {
+ return []
+ }
+ },
+ // 鏄惁鏈夌珫绾�
+ border: {
+ type: Boolean,
+ default: false
+ },
+ // 鏄惁鏄剧ず鏂戦┈绾�
+ stripe: {
+ type: Boolean,
+ default: false
+ },
+ // 澶氶��
+ type: {
+ type: String,
+ default: ''
+ },
+ // 娌℃湁鏇村鏁版嵁
+ emptyText: {
+ type: String,
+ default: '娌℃湁鏇村鏁版嵁'
+ },
+ loading: {
+ type: Boolean,
+ default: false
+ },
+ rowKey: {
+ type: String,
+ default: ''
+ }
+ },
+ data() {
+ return {
+ noData: true,
+ minWidth: 0,
+ multiTableHeads: []
+ }
+ },
+ watch: {
+ loading(val) {},
+ data(newVal) {
+ let theadChildren = this.theadChildren
+ let rowspan = 1
+ if (this.theadChildren) {
+ rowspan = this.theadChildren.rowspan
+ }
+
+ // this.trChildren.length - rowspan
+ this.noData = false
+ // this.noData = newVal.length === 0
+ }
+ },
+ created() {
+ // 瀹氫箟tr鐨勫疄渚嬫暟缁�
+ this.trChildren = []
+ this.thChildren = []
+ this.theadChildren = null
+ this.backData = []
+ this.backIndexData = []
+ },
+
+ methods: {
+ isNodata() {
+ let theadChildren = this.theadChildren
+ let rowspan = 1
+ if (this.theadChildren) {
+ rowspan = this.theadChildren.rowspan
+ }
+ this.noData = this.trChildren.length - rowspan <= 0
+ },
+ /**
+ * 閫変腑鎵�鏈�
+ */
+ selectionAll() {
+ let startIndex = 1
+ let theadChildren = this.theadChildren
+ if (!this.theadChildren) {
+ theadChildren = this.trChildren[0]
+ } else {
+ startIndex = theadChildren.rowspan - 1
+ }
+ let isHaveData = this.data && this.data.length > 0
+ theadChildren.checked = true
+ theadChildren.indeterminate = false
+ this.trChildren.forEach((item, index) => {
+ if (!item.disabled) {
+ item.checked = true
+ if (isHaveData && item.keyValue) {
+ const row = this.data.find(v => v[this.rowKey] === item.keyValue)
+ if (!this.backData.find(v => v[this.rowKey] === row[this.rowKey])) {
+ this.backData.push(row)
+ }
+ }
+ if (index > (startIndex - 1) && this.backIndexData.indexOf(index - startIndex) === -1) {
+ this.backIndexData.push(index - startIndex)
+ }
+ }
+ })
+ // this.backData = JSON.parse(JSON.stringify(this.data))
+ this.$emit('selection-change', {
+ detail: {
+ value: this.backData,
+ index: this.backIndexData
+ }
+ })
+ },
+ /**
+ * 鐢ㄤ簬澶氶�夎〃鏍硷紝鍒囨崲鏌愪竴琛岀殑閫変腑鐘舵�侊紝濡傛灉浣跨敤浜嗙浜屼釜鍙傛暟锛屽垯鏄缃繖涓�琛岄�変腑涓庡惁锛坰elected 涓� true 鍒欓�変腑锛�
+ */
+ toggleRowSelection(row, selected) {
+ // if (!this.theadChildren) return
+ row = [].concat(row)
+
+ this.trChildren.forEach((item, index) => {
+ // if (item.keyValue) {
+
+ const select = row.findIndex(v => {
+ //
+ if (typeof v === 'number') {
+ return v === index - 1
+ } else {
+ return v[this.rowKey] === item.keyValue
+ }
+ })
+ let ischeck = item.checked
+ if (select !== -1) {
+ if (typeof selected === 'boolean') {
+ item.checked = selected
+ } else {
+ item.checked = !item.checked
+ }
+ if (ischeck !== item.checked) {
+ this.check(item.rowData||item, item.checked, item.rowData?item.keyValue:null, true)
+ }
+ }
+ // }
+ })
+ this.$emit('selection-change', {
+ detail: {
+ value: this.backData,
+ index:this.backIndexData
+ }
+ })
+ },
+
+ /**
+ * 鐢ㄤ簬澶氶�夎〃鏍硷紝娓呯┖鐢ㄦ埛鐨勯�夋嫨
+ */
+ clearSelection() {
+ let theadChildren = this.theadChildren
+ if (!this.theadChildren) {
+ theadChildren = this.trChildren[0]
+ }
+ // if (!this.theadChildren) return
+ theadChildren.checked = false
+ theadChildren.indeterminate = false
+ this.trChildren.forEach(item => {
+ // if (item.keyValue) {
+ item.checked = false
+ // }
+ })
+ this.backData = []
+ this.backIndexData = []
+ this.$emit('selection-change', {
+ detail: {
+ value: [],
+ index: []
+ }
+ })
+ },
+ /**
+ * 鐢ㄤ簬澶氶�夎〃鏍硷紝鍒囨崲鎵�鏈夎鐨勯�変腑鐘舵��
+ */
+ toggleAllSelection() {
+ let list = []
+ let startIndex = 1
+ let theadChildren = this.theadChildren
+ if (!this.theadChildren) {
+ theadChildren = this.trChildren[0]
+ } else {
+ startIndex = theadChildren.rowspan - 1
+ }
+ this.trChildren.forEach((item, index) => {
+ if (!item.disabled) {
+ if (index > (startIndex - 1) ) {
+ list.push(index-startIndex)
+ }
+ }
+ })
+ this.toggleRowSelection(list)
+ },
+
+ /**
+ * 閫変腑\鍙栨秷閫変腑
+ * @param {Object} child
+ * @param {Object} check
+ * @param {Object} rowValue
+ */
+ check(child, check, keyValue, emit) {
+ let theadChildren = this.theadChildren
+ if (!this.theadChildren) {
+ theadChildren = this.trChildren[0]
+ }
+
+
+
+ let childDomIndex = this.trChildren.findIndex((item, index) => child === item)
+ if(childDomIndex < 0){
+ childDomIndex = this.data.findIndex(v=>v[this.rowKey] === keyValue) + 1
+ }
+ const dataLen = this.trChildren.filter(v => !v.disabled && v.keyValue).length
+ if (childDomIndex === 0) {
+ check ? this.selectionAll() : this.clearSelection()
+ return
+ }
+
+ if (check) {
+ if (keyValue) {
+ this.backData.push(child)
+ }
+ this.backIndexData.push(childDomIndex - 1)
+ } else {
+ const index = this.backData.findIndex(v => v[this.rowKey] === keyValue)
+ const idx = this.backIndexData.findIndex(item => item === childDomIndex - 1)
+ if (keyValue) {
+ this.backData.splice(index, 1)
+ }
+ this.backIndexData.splice(idx, 1)
+ }
+
+ const domCheckAll = this.trChildren.find((item, index) => index > 0 && !item.checked && !item.disabled)
+ if (!domCheckAll) {
+ theadChildren.indeterminate = false
+ theadChildren.checked = true
+ } else {
+ theadChildren.indeterminate = true
+ theadChildren.checked = false
+ }
+
+ if (this.backIndexData.length === 0) {
+ theadChildren.indeterminate = false
+ }
+
+ if (!emit) {
+ this.$emit('selection-change', {
+ detail: {
+ value: this.backData,
+ index: this.backIndexData
+ }
+ })
+ }
+ }
+ }
+}
+</script>
+
+<style lang="scss">
+$border-color: #ebeef5;
+
+.uni-table-scroll {
+ width: 100%;
+ /* #ifndef APP-NVUE */
+ overflow-x: auto;
+ /* #endif */
+}
+
+.uni-table {
+ position: relative;
+ width: 100%;
+ border-radius: 5px;
+ // box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.1);
+ background-color: #fff;
+ /* #ifndef APP-NVUE */
+ box-sizing: border-box;
+ display: table;
+ overflow-x: auto;
+ ::v-deep .uni-table-tr:nth-child(n + 2) {
+ &:hover {
+ background-color: #f5f7fa;
+ }
+ }
+ ::v-deep .uni-table-thead {
+ .uni-table-tr {
+ // background-color: #f5f7fa;
+ &:hover {
+ background-color:#fafafa;
+ }
+ }
+ }
+ /* #endif */
+}
+
+.table--border {
+ border: 1px $border-color solid;
+ border-right: none;
+}
+
+.border-none {
+ /* #ifndef APP-NVUE */
+ border-bottom: none;
+ /* #endif */
+}
+
+.table--stripe {
+ /* #ifndef APP-NVUE */
+ ::v-deep .uni-table-tr:nth-child(2n + 3) {
+ background-color: #fafafa;
+ }
+ /* #endif */
+}
+
+/* 琛ㄦ牸鍔犺浇銆佹棤鏁版嵁鏍峰紡 */
+.uni-table-loading {
+ position: relative;
+ /* #ifndef APP-NVUE */
+ display: table-row;
+ /* #endif */
+ height: 50px;
+ line-height: 50px;
+ overflow: hidden;
+ box-sizing: border-box;
+}
+.empty-border {
+ border-right: 1px $border-color solid;
+}
+.uni-table-text {
+ position: absolute;
+ right: 0;
+ left: 0;
+ text-align: center;
+ font-size: 14px;
+ color: #999;
+}
+
+.uni-table-mask {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ background-color: rgba(255, 255, 255, 0.8);
+ z-index: 99;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ margin: auto;
+ transition: all 0.5s;
+ /* #endif */
+ justify-content: center;
+ align-items: center;
+}
+
+.uni-table--loader {
+ width: 30px;
+ height: 30px;
+ border: 2px solid #aaa;
+ // border-bottom-color: transparent;
+ border-radius: 50%;
+ /* #ifndef APP-NVUE */
+ animation: 2s uni-table--loader linear infinite;
+ /* #endif */
+ position: relative;
+}
+
+@keyframes uni-table--loader {
+ 0% {
+ transform: rotate(360deg);
+ }
+
+ 10% {
+ border-left-color: transparent;
+ }
+
+ 20% {
+ border-bottom-color: transparent;
+ }
+
+ 30% {
+ border-right-color: transparent;
+ }
+
+ 40% {
+ border-top-color: transparent;
+ }
+
+ 50% {
+ transform: rotate(0deg);
+ }
+
+ 60% {
+ border-top-color: transparent;
+ }
+
+ 70% {
+ border-left-color: transparent;
+ }
+
+ 80% {
+ border-bottom-color: transparent;
+ }
+
+ 90% {
+ border-right-color: transparent;
+ }
+
+ 100% {
+ transform: rotate(-360deg);
+ }
+}
+</style>
diff --git a/uni_modules/uni-table/components/uni-tbody/uni-tbody.vue b/uni_modules/uni-table/components/uni-tbody/uni-tbody.vue
new file mode 100644
index 0000000..130f626
--- /dev/null
+++ b/uni_modules/uni-table/components/uni-tbody/uni-tbody.vue
@@ -0,0 +1,34 @@
+<template>
+ <!-- #ifdef H5 -->
+ <tbody>
+ <slot></slot>
+ </tbody>
+ <!-- #endif -->
+ <!-- #ifndef H5 -->
+ <view><slot></slot></view>
+ <!-- #endif -->
+</template>
+
+<script>
+export default {
+ name: 'uniBody',
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ data() {
+ return {
+
+ }
+ },
+ created() {},
+ methods: {}
+}
+</script>
+
+<style>
+</style>
diff --git a/uni_modules/uni-table/components/uni-td/uni-td.vue b/uni_modules/uni-table/components/uni-td/uni-td.vue
new file mode 100644
index 0000000..69e5e8a
--- /dev/null
+++ b/uni_modules/uni-table/components/uni-td/uni-td.vue
@@ -0,0 +1,95 @@
+<template>
+ <!-- #ifdef H5 -->
+ <td class="uni-table-td" :rowspan="rowspan" :colspan="colspan" :class="{'table--border':border}" :style="{width:width + 'px','text-align':align}">
+ <slot></slot>
+ </td>
+ <!-- #endif -->
+ <!-- #ifndef H5 -->
+ <!-- :class="{'table--border':border}" -->
+ <view class="uni-table-td" :class="{'table--border':border}" :style="{width:width + 'px','text-align':align}">
+ <slot></slot>
+ </view>
+ <!-- #endif -->
+
+</template>
+
+<script>
+ /**
+ * Td 鍗曞厓鏍�
+ * @description 琛ㄦ牸涓殑鏍囧噯鍗曞厓鏍肩粍浠�
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=3270
+ * @property {Number} align = [left|center|right] 鍗曞厓鏍煎榻愭柟寮�
+ */
+ export default {
+ name: 'uniTd',
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ props: {
+ width: {
+ type: [String, Number],
+ default: ''
+ },
+ align: {
+ type: String,
+ default: 'left'
+ },
+ rowspan: {
+ type: [Number,String],
+ default: 1
+ },
+ colspan: {
+ type: [Number,String],
+ default: 1
+ }
+ },
+ data() {
+ return {
+ border: false
+ };
+ },
+ created() {
+ this.root = this.getTable()
+ this.border = this.root.border
+ },
+ methods: {
+ /**
+ * 鑾峰彇鐖跺厓绱犲疄渚�
+ */
+ getTable() {
+ let parent = this.$parent;
+ let parentName = parent.$options.name;
+ while (parentName !== 'uniTable') {
+ parent = parent.$parent;
+ if (!parent) return false;
+ parentName = parent.$options.name;
+ }
+ return parent;
+ },
+ }
+ }
+</script>
+
+<style lang="scss">
+ $border-color:#EBEEF5;
+
+ .uni-table-td {
+ display: table-cell;
+ padding: 8px 10px;
+ font-size: 14px;
+ border-bottom: 1px $border-color solid;
+ font-weight: 400;
+ color: #606266;
+ line-height: 23px;
+ box-sizing: border-box;
+ }
+
+ .table--border {
+ border-right: 1px $border-color solid;
+ }
+</style>
diff --git a/uni_modules/uni-table/components/uni-th/filter-dropdown.vue b/uni_modules/uni-table/components/uni-th/filter-dropdown.vue
new file mode 100644
index 0000000..6f29b3b
--- /dev/null
+++ b/uni_modules/uni-table/components/uni-th/filter-dropdown.vue
@@ -0,0 +1,511 @@
+<template>
+ <view class="uni-filter-dropdown">
+ <view class="dropdown-btn" @click="onDropdown">
+ <view class="icon-select" :class="{active: canReset}" v-if="isSelect || isRange"></view>
+ <view class="icon-search" :class="{active: canReset}" v-if="isSearch">
+ <view class="icon-search-0"></view>
+ <view class="icon-search-1"></view>
+ </view>
+ <view class="icon-calendar" :class="{active: canReset}" v-if="isDate">
+ <view class="icon-calendar-0"></view>
+ <view class="icon-calendar-1"></view>
+ </view>
+ </view>
+ <view class="uni-dropdown-cover" v-if="isOpened" @click="handleClose"></view>
+ <view class="dropdown-popup dropdown-popup-right" v-if="isOpened" @click.stop>
+ <!-- select-->
+ <view v-if="isSelect" class="list">
+ <label class="flex-r a-i-c list-item" v-for="(item,index) in dataList" :key="index"
+ @click="onItemClick($event, index)">
+ <check-box class="check" :checked="item.checked" />
+ <view class="checklist-content">
+ <text class="checklist-text" :style="item.styleIconText">{{item[map.text]}}</text>
+ </view>
+ </label>
+ </view>
+ <view v-if="isSelect" class="flex-r opera-area">
+ <view class="flex-f btn btn-default" :class="{disable: !canReset}" @click="handleSelectReset">
+ {{resource.reset}}</view>
+ <view class="flex-f btn btn-submit" @click="handleSelectSubmit">{{resource.submit}}</view>
+ </view>
+ <!-- search -->
+ <view v-if="isSearch" class="search-area">
+ <input class="search-input" v-model="filterValue" />
+ </view>
+ <view v-if="isSearch" class="flex-r opera-area">
+ <view class="flex-f btn btn-submit" @click="handleSearchSubmit">{{resource.search}}</view>
+ <view class="flex-f btn btn-default" :class="{disable: !canReset}" @click="handleSearchReset">
+ {{resource.reset}}</view>
+ </view>
+ <!-- range -->
+ <view v-if="isRange">
+ <view class="input-label">{{resource.gt}}</view>
+ <input class="input" v-model="gtValue" />
+ <view class="input-label">{{resource.lt}}</view>
+ <input class="input" v-model="ltValue" />
+ </view>
+ <view v-if="isRange" class="flex-r opera-area">
+ <view class="flex-f btn btn-default" :class="{disable: !canReset}" @click="handleRangeReset">
+ {{resource.reset}}</view>
+ <view class="flex-f btn btn-submit" @click="handleRangeSubmit">{{resource.submit}}</view>
+ </view>
+ <!-- date -->
+ <view v-if="isDate">
+ <uni-datetime-picker ref="datetimepicker" :value="dateRange" type="datetimerange" return-type="timestamp" @change="datetimechange" @maskClick="timepickerclose">
+ <view></view>
+ </uni-datetime-picker>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ import checkBox from '../uni-tr/table-checkbox.vue'
+
+ const resource = {
+ "reset": "閲嶇疆",
+ "search": "鎼滅储",
+ "submit": "纭畾",
+ "filter": "绛涢��",
+ "gt": "澶т簬绛変簬",
+ "lt": "灏忎簬绛変簬",
+ "date": "鏃ユ湡鑼冨洿"
+ }
+
+ const DropdownType = {
+ Select: "select",
+ Search: "search",
+ Range: "range",
+ Date: "date",
+ Timestamp: "timestamp"
+ }
+
+ export default {
+ name: 'FilterDropdown',
+ emits:['change'],
+ components: {
+ checkBox
+ },
+ options: {
+ virtualHost: true
+ },
+ props: {
+ filterType: {
+ type: String,
+ default: DropdownType.Select
+ },
+ filterData: {
+ type: Array,
+ default () {
+ return []
+ }
+ },
+ mode: {
+ type: String,
+ default: 'default'
+ },
+ map: {
+ type: Object,
+ default () {
+ return {
+ text: 'text',
+ value: 'value'
+ }
+ }
+ },
+ filterDefaultValue: {
+ type: [Array,String],
+ default () {
+ return ""
+ }
+ }
+ },
+ computed: {
+ canReset() {
+ if (this.isSearch) {
+ return this.filterValue.length > 0
+ }
+ if (this.isSelect) {
+ return this.checkedValues.length > 0
+ }
+ if (this.isRange) {
+ return (this.gtValue.length > 0 && this.ltValue.length > 0)
+ }
+ if (this.isDate) {
+ return this.dateSelect.length > 0
+ }
+ return false
+ },
+ isSelect() {
+ return this.filterType === DropdownType.Select
+ },
+ isSearch() {
+ return this.filterType === DropdownType.Search
+ },
+ isRange() {
+ return this.filterType === DropdownType.Range
+ },
+ isDate() {
+ return (this.filterType === DropdownType.Date || this.filterType === DropdownType.Timestamp)
+ }
+ },
+ watch: {
+ filterData(newVal) {
+ this._copyFilters()
+ },
+ indeterminate(newVal) {
+ this.isIndeterminate = newVal
+ }
+ },
+ data() {
+ return {
+ resource,
+ enabled: true,
+ isOpened: false,
+ dataList: [],
+ filterValue: this.filterDefaultValue,
+ checkedValues: [],
+ gtValue: '',
+ ltValue: '',
+ dateRange: [],
+ dateSelect: []
+ };
+ },
+ created() {
+ this._copyFilters()
+ },
+ methods: {
+ _copyFilters() {
+ let dl = JSON.parse(JSON.stringify(this.filterData))
+ for (let i = 0; i < dl.length; i++) {
+ if (dl[i].checked === undefined) {
+ dl[i].checked = false
+ }
+ }
+ this.dataList = dl
+ },
+ openPopup() {
+ this.isOpened = true
+ if (this.isDate) {
+ this.$nextTick(() => {
+ if (!this.dateRange.length) {
+ this.resetDate()
+ }
+ this.$refs.datetimepicker.show()
+ })
+ }
+ },
+ closePopup() {
+ this.isOpened = false
+ },
+ handleClose(e) {
+ this.closePopup()
+ },
+ resetDate() {
+ let date = new Date()
+ let dateText = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`
+ this.dateRange = [dateText + ' 0:00:00', dateText + ' 23:59:59']
+ },
+ onDropdown(e) {
+ this.openPopup()
+ },
+ onItemClick(e, index) {
+ let items = this.dataList
+ let listItem = items[index]
+ if (listItem.checked === undefined) {
+ items[index].checked = true
+ } else {
+ items[index].checked = !listItem.checked
+ }
+
+ let checkvalues = []
+ for (let i = 0; i < items.length; i++) {
+ const item = items[i]
+ if (item.checked) {
+ checkvalues.push(item.value)
+ }
+ }
+ this.checkedValues = checkvalues
+ },
+ datetimechange(e) {
+ this.closePopup()
+ this.dateRange = e
+ this.dateSelect = e
+ this.$emit('change', {
+ filterType: this.filterType,
+ filter: e
+ })
+ },
+ timepickerclose(e) {
+ this.closePopup()
+ },
+ handleSelectSubmit() {
+ this.closePopup()
+ this.$emit('change', {
+ filterType: this.filterType,
+ filter: this.checkedValues
+ })
+ },
+ handleSelectReset() {
+ if (!this.canReset) {
+ return;
+ }
+ var items = this.dataList
+ for (let i = 0; i < items.length; i++) {
+ let item = items[i]
+ this.$set(item, 'checked', false)
+ }
+ this.checkedValues = []
+ this.handleSelectSubmit()
+ },
+ handleSearchSubmit() {
+ this.closePopup()
+ this.$emit('change', {
+ filterType: this.filterType,
+ filter: this.filterValue
+ })
+ },
+ handleSearchReset() {
+ if (!this.canReset) {
+ return;
+ }
+ this.filterValue = ''
+ this.handleSearchSubmit()
+ },
+ handleRangeSubmit(isReset) {
+ this.closePopup()
+ this.$emit('change', {
+ filterType: this.filterType,
+ filter: isReset === true ? [] : [parseInt(this.gtValue), parseInt(this.ltValue)]
+ })
+ },
+ handleRangeReset() {
+ if (!this.canReset) {
+ return;
+ }
+ this.gtValue = ''
+ this.ltValue = ''
+ this.handleRangeSubmit(true)
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ $uni-primary: #1890ff !default;
+
+ .flex-r {
+ display: flex;
+ flex-direction: row;
+ }
+
+ .flex-f {
+ flex: 1;
+ }
+
+ .a-i-c {
+ align-items: center;
+ }
+
+ .j-c-c {
+ justify-content: center;
+ }
+
+ .icon-select {
+ width: 14px;
+ height: 16px;
+ border: solid 6px transparent;
+ border-top: solid 6px #ddd;
+ border-bottom: none;
+ background-color: #ddd;
+ background-clip: content-box;
+ box-sizing: border-box;
+ }
+
+ .icon-select.active {
+ background-color: $uni-primary;
+ border-top-color: $uni-primary;
+ }
+
+ .icon-search {
+ width: 12px;
+ height: 16px;
+ position: relative;
+ }
+
+ .icon-search-0 {
+ border: 2px solid #ddd;
+ border-radius: 8px;
+ width: 7px;
+ height: 7px;
+ }
+
+ .icon-search-1 {
+ position: absolute;
+ top: 8px;
+ right: 0;
+ width: 1px;
+ height: 7px;
+ background-color: #ddd;
+ transform: rotate(-45deg);
+ }
+
+ .icon-search.active .icon-search-0 {
+ border-color: $uni-primary;
+ }
+
+ .icon-search.active .icon-search-1 {
+ background-color: $uni-primary;
+ }
+
+ .icon-calendar {
+ color: #ddd;
+ width: 14px;
+ height: 16px;
+ }
+
+ .icon-calendar-0 {
+ height: 4px;
+ margin-top: 3px;
+ margin-bottom: 1px;
+ background-color: #ddd;
+ border-radius: 2px 2px 1px 1px;
+ position: relative;
+ }
+ .icon-calendar-0:before, .icon-calendar-0:after {
+ content: '';
+ position: absolute;
+ top: -3px;
+ width: 4px;
+ height: 3px;
+ border-radius: 1px;
+ background-color: #ddd;
+ }
+ .icon-calendar-0:before {
+ left: 2px;
+ }
+ .icon-calendar-0:after {
+ right: 2px;
+ }
+
+ .icon-calendar-1 {
+ height: 9px;
+ background-color: #ddd;
+ border-radius: 1px 1px 2px 2px;
+ }
+
+ .icon-calendar.active {
+ color: $uni-primary;
+ }
+
+ .icon-calendar.active .icon-calendar-0,
+ .icon-calendar.active .icon-calendar-1,
+ .icon-calendar.active .icon-calendar-0:before,
+ .icon-calendar.active .icon-calendar-0:after {
+ background-color: $uni-primary;
+ }
+
+ .uni-filter-dropdown {
+ position: relative;
+ font-weight: normal;
+ }
+
+ .dropdown-popup {
+ position: absolute;
+ top: 100%;
+ background-color: #fff;
+ box-shadow: 0 3px 6px -4px #0000001f, 0 6px 16px #00000014, 0 9px 28px 8px #0000000d;
+ min-width: 150px;
+ z-index: 1000;
+ }
+
+ .dropdown-popup-left {
+ left: 0;
+ }
+
+ .dropdown-popup-right {
+ right: 0;
+ }
+
+ .uni-dropdown-cover {
+ position: fixed;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ background-color: transparent;
+ z-index: 100;
+ }
+
+ .list {
+ margin-top: 5px;
+ margin-bottom: 5px;
+ }
+
+ .list-item {
+ padding: 5px 10px;
+ text-align: left;
+ }
+
+ .list-item:hover {
+ background-color: #f0f0f0;
+ }
+
+ .check {
+ margin-right: 5px;
+ }
+
+ .search-area {
+ padding: 10px;
+ }
+
+ .search-input {
+ font-size: 12px;
+ border: 1px solid #f0f0f0;
+ border-radius: 3px;
+ padding: 2px 5px;
+ min-width: 150px;
+ text-align: left;
+ }
+
+ .input-label {
+ margin: 10px 10px 5px 10px;
+ text-align: left;
+ }
+
+ .input {
+ font-size: 12px;
+ border: 1px solid #f0f0f0;
+ border-radius: 3px;
+ margin: 10px;
+ padding: 2px 5px;
+ min-width: 150px;
+ text-align: left;
+ }
+
+ .opera-area {
+ cursor: default;
+ border-top: 1px solid #ddd;
+ padding: 5px;
+ }
+
+ .opera-area .btn {
+ font-size: 12px;
+ border-radius: 3px;
+ margin: 5px;
+ padding: 4px 4px;
+ }
+
+ .btn-default {
+ border: 1px solid #ddd;
+ }
+
+ .btn-default.disable {
+ border-color: transparent;
+ }
+
+ .btn-submit {
+ background-color: $uni-primary;
+ color: #ffffff;
+ }
+</style>
diff --git a/uni_modules/uni-table/components/uni-th/uni-th.vue b/uni_modules/uni-table/components/uni-th/uni-th.vue
new file mode 100644
index 0000000..a39ae6c
--- /dev/null
+++ b/uni_modules/uni-table/components/uni-th/uni-th.vue
@@ -0,0 +1,295 @@
+<template>
+ <!-- #ifdef H5 -->
+ <th :rowspan="rowspan" :colspan="colspan" class="uni-table-th" :class="{ 'table--border': border }" :style="{ width: customWidth + 'px', 'text-align': align }">
+ <view class="uni-table-th-row">
+ <view class="uni-table-th-content" :style="{ 'justify-content': contentAlign }" @click="sort">
+ <slot></slot>
+ <view v-if="sortable" class="arrow-box">
+ <text class="arrow up" :class="{ active: ascending }" @click.stop="ascendingFn"></text>
+ <text class="arrow down" :class="{ active: descending }" @click.stop="descendingFn"></text>
+ </view>
+ </view>
+ <dropdown v-if="filterType || filterData.length" :filterDefaultValue="filterDefaultValue" :filterData="filterData" :filterType="filterType" @change="ondropdown"></dropdown>
+ </view>
+ </th>
+ <!-- #endif -->
+ <!-- #ifndef H5 -->
+ <view class="uni-table-th" :class="{ 'table--border': border }" :style="{ width: customWidth + 'px', 'text-align': align }"><slot></slot></view>
+ <!-- #endif -->
+</template>
+
+<script>
+ // #ifdef H5
+ import dropdown from './filter-dropdown.vue'
+ // #endif
+/**
+ * Th 琛ㄥご
+ * @description 琛ㄦ牸鍐呯殑琛ㄥご鍗曞厓鏍肩粍浠�
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=3270
+ * @property {Number | String} width 鍗曞厓鏍煎搴︼紙鏀寔绾暟瀛椼�佹惡甯﹀崟浣峱x鎴杛px锛�
+ * @property {Boolean} sortable 鏄惁鍚敤鎺掑簭
+ * @property {Number} align = [left|center|right] 鍗曞厓鏍煎榻愭柟寮�
+ * @value left 鍗曞厓鏍兼枃瀛楀乏渚у榻�
+ * @value center 鍗曞厓鏍兼枃瀛楀眳涓�
+ * @value right 鍗曞厓鏍兼枃瀛楀彸渚у榻�
+ * @property {Array} filterData 绛涢�夋暟鎹�
+ * @property {String} filterType [search|select] 绛涢�夌被鍨�
+ * @value search 鍏抽敭瀛楁悳绱�
+ * @value select 鏉′欢閫夋嫨
+ * @event {Function} sort-change 鎺掑簭瑙﹀彂浜嬩欢
+ */
+export default {
+ name: 'uniTh',
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ components: {
+ // #ifdef H5
+ dropdown
+ // #endif
+ },
+ emits:['sort-change','filter-change'],
+ props: {
+ width: {
+ type: [String, Number],
+ default: ''
+ },
+ align: {
+ type: String,
+ default: 'left'
+ },
+ rowspan: {
+ type: [Number, String],
+ default: 1
+ },
+ colspan: {
+ type: [Number, String],
+ default: 1
+ },
+ sortable: {
+ type: Boolean,
+ default: false
+ },
+ filterType: {
+ type: String,
+ default: ""
+ },
+ filterData: {
+ type: Array,
+ default () {
+ return []
+ }
+ },
+ filterDefaultValue: {
+ type: [Array,String],
+ default () {
+ return ""
+ }
+ }
+ },
+ data() {
+ return {
+ border: false,
+ ascending: false,
+ descending: false
+ }
+ },
+ computed: {
+ // 鏍规嵁props涓殑width灞炴�� 鑷姩鍖归厤褰撳墠th鐨勫搴�(px)
+ customWidth(){
+ if(typeof this.width === 'number'){
+ return this.width
+ } else if(typeof this.width === 'string') {
+ let regexHaveUnitPx = new RegExp(/^[1-9][0-9]*px$/g)
+ let regexHaveUnitRpx = new RegExp(/^[1-9][0-9]*rpx$/g)
+ let regexHaveNotUnit = new RegExp(/^[1-9][0-9]*$/g)
+ if (this.width.match(regexHaveUnitPx) !== null) { // 鎼哄甫浜� px
+ return this.width.replace('px', '')
+ } else if (this.width.match(regexHaveUnitRpx) !== null) { // 鎼哄甫浜� rpx
+ let numberRpx = Number(this.width.replace('rpx', ''))
+ // #ifdef MP-WEIXIN
+ let widthCoe = uni.getWindowInfo().screenWidth / 750
+ // #endif
+ // #ifndef MP-WEIXIN
+ let widthCoe = uni.getSystemInfoSync().screenWidth / 750
+ // #endif
+ return Math.round(numberRpx * widthCoe)
+ } else if (this.width.match(regexHaveNotUnit) !== null) { // 鏈惡甯� rpx鎴杙x 鐨勭函鏁板瓧 String
+ return this.width
+ } else { // 涓嶇鍚堟牸寮�
+ return ''
+ }
+ } else {
+ return ''
+ }
+ },
+ contentAlign() {
+ let align = 'left'
+ switch (this.align) {
+ case 'left':
+ align = 'flex-start'
+ break
+ case 'center':
+ align = 'center'
+ break
+ case 'right':
+ align = 'flex-end'
+ break
+ }
+ return align
+ }
+ },
+ created() {
+ this.root = this.getTable('uniTable')
+ this.rootTr = this.getTable('uniTr')
+ this.rootTr.minWidthUpdate(this.customWidth ? this.customWidth : 140)
+ this.border = this.root.border
+ this.root.thChildren.push(this)
+ },
+ methods: {
+ sort() {
+ if (!this.sortable) return
+ this.clearOther()
+ if (!this.ascending && !this.descending) {
+ this.ascending = true
+ this.$emit('sort-change', { order: 'ascending' })
+ return
+ }
+ if (this.ascending && !this.descending) {
+ this.ascending = false
+ this.descending = true
+ this.$emit('sort-change', { order: 'descending' })
+ return
+ }
+
+ if (!this.ascending && this.descending) {
+ this.ascending = false
+ this.descending = false
+ this.$emit('sort-change', { order: null })
+ }
+ },
+ ascendingFn() {
+ this.clearOther()
+ this.ascending = !this.ascending
+ this.descending = false
+ this.$emit('sort-change', { order: this.ascending ? 'ascending' : null })
+ },
+ descendingFn() {
+ this.clearOther()
+ this.descending = !this.descending
+ this.ascending = false
+ this.$emit('sort-change', { order: this.descending ? 'descending' : null })
+ },
+ clearOther() {
+ this.root.thChildren.map(item => {
+ if (item !== this) {
+ item.ascending = false
+ item.descending = false
+ }
+ return item
+ })
+ },
+ ondropdown(e) {
+ this.$emit("filter-change", e)
+ },
+ /**
+ * 鑾峰彇鐖跺厓绱犲疄渚�
+ */
+ getTable(name) {
+ let parent = this.$parent
+ let parentName = parent.$options.name
+ while (parentName !== name) {
+ parent = parent.$parent
+ if (!parent) return false
+ parentName = parent.$options.name
+ }
+ return parent
+ }
+ }
+}
+</script>
+
+<style lang="scss">
+$border-color: #ebeef5;
+$uni-primary: #007aff !default;
+
+.uni-table-th {
+ padding: 12px 10px;
+ /* #ifndef APP-NVUE */
+ display: table-cell;
+ box-sizing: border-box;
+ /* #endif */
+ font-size: 14px;
+ font-weight: bold;
+ color: #909399;
+ border-bottom: 1px $border-color solid;
+}
+
+.uni-table-th-row {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+}
+
+.table--border {
+ border-right: 1px $border-color solid;
+}
+.uni-table-th-content {
+ display: flex;
+ align-items: center;
+ flex: 1;
+}
+.arrow-box {
+}
+.arrow {
+ display: block;
+ position: relative;
+ width: 10px;
+ height: 8px;
+ // border: 1px red solid;
+ left: 5px;
+ overflow: hidden;
+ cursor: pointer;
+}
+.down {
+ top: 3px;
+ ::after {
+ content: '';
+ width: 8px;
+ height: 8px;
+ position: absolute;
+ left: 2px;
+ top: -5px;
+ transform: rotate(45deg);
+ background-color: #ccc;
+ }
+ &.active {
+ ::after {
+ background-color: $uni-primary;
+ }
+ }
+}
+.up {
+ ::after {
+ content: '';
+ width: 8px;
+ height: 8px;
+ position: absolute;
+ left: 2px;
+ top: 5px;
+ transform: rotate(45deg);
+ background-color: #ccc;
+ }
+ &.active {
+ ::after {
+ background-color: $uni-primary;
+ }
+ }
+}
+</style>
diff --git a/uni_modules/uni-table/components/uni-thead/uni-thead.vue b/uni_modules/uni-table/components/uni-thead/uni-thead.vue
new file mode 100644
index 0000000..53b5c4c
--- /dev/null
+++ b/uni_modules/uni-table/components/uni-thead/uni-thead.vue
@@ -0,0 +1,137 @@
+<template>
+ <!-- #ifdef H5 -->
+ <thead class="uni-table-thead">
+ <tr class="uni-table-tr">
+ <th :rowspan="rowspan" colspan="1" class="checkbox" :class="{ 'tr-table--border': border }">
+ <table-checkbox :indeterminate="indeterminate" :checked="checked"
+ @checkboxSelected="checkboxSelected"></table-checkbox>
+ </th>
+ </tr>
+ <slot></slot>
+ </thead>
+ <!-- #endif -->
+ <!-- #ifndef H5 -->
+ <view class="uni-table-thead">
+ <slot></slot>
+ </view>
+ <!-- #endif -->
+</template>
+
+<script>
+ import tableCheckbox from '../uni-tr/table-checkbox.vue'
+ export default {
+ name: 'uniThead',
+ components: {
+ tableCheckbox
+ },
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ data() {
+ return {
+ border: false,
+ selection: false,
+ rowspan: 1,
+ indeterminate: false,
+ checked: false
+ }
+ },
+ created() {
+ this.root = this.getTable()
+ // #ifdef H5
+ this.root.theadChildren = this
+ // #endif
+ this.border = this.root.border
+ this.selection = this.root.type
+ },
+ methods: {
+ init(self) {
+ this.rowspan++
+ },
+ checkboxSelected(e) {
+ this.indeterminate = false
+ const backIndexData = this.root.backIndexData
+ const data = this.root.trChildren.filter(v => !v.disabled && v.keyValue)
+ if (backIndexData.length === data.length) {
+ this.checked = false
+ this.root.clearSelection()
+ } else {
+ this.checked = true
+ this.root.selectionAll()
+ }
+ },
+ /**
+ * 鑾峰彇鐖跺厓绱犲疄渚�
+ */
+ getTable(name = 'uniTable') {
+ let parent = this.$parent
+ let parentName = parent.$options.name
+ while (parentName !== name) {
+ parent = parent.$parent
+ if (!parent) return false
+ parentName = parent.$options.name
+ }
+ return parent
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ $border-color: #ebeef5;
+
+ .uni-table-thead {
+ display: table-header-group;
+ }
+
+ .uni-table-tr {
+ /* #ifndef APP-NVUE */
+ display: table-row;
+ transition: all 0.3s;
+ box-sizing: border-box;
+ /* #endif */
+ border: 1px red solid;
+ background-color: #fafafa;
+ }
+
+ .checkbox {
+ padding: 0 8px;
+ width: 26px;
+ padding-left: 12px;
+ /* #ifndef APP-NVUE */
+ display: table-cell;
+ vertical-align: middle;
+ /* #endif */
+ color: #333;
+ font-weight: 500;
+ border-bottom: 1px $border-color solid;
+ font-size: 14px;
+ // text-align: center;
+ }
+
+ .tr-table--border {
+ border-right: 1px $border-color solid;
+ }
+
+ /* #ifndef APP-NVUE */
+ .uni-table-tr {
+ ::v-deep .uni-table-th {
+ &.table--border:last-child {
+ // border-right: none;
+ }
+ }
+
+ ::v-deep .uni-table-td {
+ &.table--border:last-child {
+ // border-right: none;
+ }
+ }
+ }
+
+ /* #endif */
+</style>
diff --git a/uni_modules/uni-table/components/uni-tr/table-checkbox.vue b/uni_modules/uni-table/components/uni-tr/table-checkbox.vue
new file mode 100644
index 0000000..1089187
--- /dev/null
+++ b/uni_modules/uni-table/components/uni-tr/table-checkbox.vue
@@ -0,0 +1,179 @@
+<template>
+ <view class="uni-table-checkbox" @click="selected">
+ <view v-if="!indeterminate" class="checkbox__inner" :class="{'is-checked':isChecked,'is-disable':isDisabled}">
+ <view class="checkbox__inner-icon"></view>
+ </view>
+ <view v-else class="checkbox__inner checkbox--indeterminate">
+ <view class="checkbox__inner-icon"></view>
+ </view>
+ </view>
+</template>
+
+<script>
+ export default {
+ name: 'TableCheckbox',
+ emits:['checkboxSelected'],
+ props: {
+ indeterminate: {
+ type: Boolean,
+ default: false
+ },
+ checked: {
+ type: [Boolean,String],
+ default: false
+ },
+ disabled: {
+ type: Boolean,
+ default: false
+ },
+ index: {
+ type: Number,
+ default: -1
+ },
+ cellData: {
+ type: Object,
+ default () {
+ return {}
+ }
+ }
+ },
+ watch:{
+ checked(newVal){
+ if(typeof this.checked === 'boolean'){
+ this.isChecked = newVal
+ }else{
+ this.isChecked = true
+ }
+ },
+ indeterminate(newVal){
+ this.isIndeterminate = newVal
+ }
+ },
+ data() {
+ return {
+ isChecked: false,
+ isDisabled: false,
+ isIndeterminate:false
+ }
+ },
+ created() {
+ if(typeof this.checked === 'boolean'){
+ this.isChecked = this.checked
+ }
+ this.isDisabled = this.disabled
+ },
+ methods: {
+ selected() {
+ if (this.isDisabled) return
+ this.isIndeterminate = false
+ this.isChecked = !this.isChecked
+ this.$emit('checkboxSelected', {
+ checked: this.isChecked,
+ data: this.cellData
+ })
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ $uni-primary: #007aff !default;
+ $border-color: #DCDFE6;
+ $disable:0.4;
+
+ .uni-table-checkbox {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ position: relative;
+ margin: 5px 0;
+ cursor: pointer;
+
+ // 澶氶�夋牱寮�
+ .checkbox__inner {
+ /* #ifndef APP-NVUE */
+ flex-shrink: 0;
+ box-sizing: border-box;
+ /* #endif */
+ position: relative;
+ width: 16px;
+ height: 16px;
+ border: 1px solid $border-color;
+ border-radius: 2px;
+ background-color: #fff;
+ z-index: 1;
+
+ .checkbox__inner-icon {
+ position: absolute;
+ /* #ifdef APP-NVUE */
+ top: 2px;
+ /* #endif */
+ /* #ifndef APP-NVUE */
+ top: 2px;
+ /* #endif */
+ left: 5px;
+ height: 7px;
+ width: 3px;
+ border: 1px solid #fff;
+ border-left: 0;
+ border-top: 0;
+ opacity: 0;
+ transform-origin: center;
+ transform: rotate(45deg);
+ box-sizing: content-box;
+ }
+
+ &.checkbox--indeterminate {
+ border-color: $uni-primary;
+ background-color: $uni-primary;
+
+ .checkbox__inner-icon {
+ position: absolute;
+ opacity: 1;
+ transform: rotate(0deg);
+ height: 2px;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ left: 0px;
+ right: 0px;
+ bottom: 0;
+ width: auto;
+ border: none;
+ border-radius: 2px;
+ transform: scale(0.5);
+ background-color: #fff;
+ }
+ }
+ &:hover{
+ border-color: $uni-primary;
+ }
+ // 绂佺敤
+ &.is-disable {
+ /* #ifdef H5 */
+ cursor: not-allowed;
+ /* #endif */
+ background-color: #F2F6FC;
+ border-color: $border-color;
+ }
+
+ // 閫変腑
+ &.is-checked {
+ border-color: $uni-primary;
+ background-color: $uni-primary;
+
+ .checkbox__inner-icon {
+ opacity: 1;
+ transform: rotate(45deg);
+ }
+
+ // 閫変腑绂佺敤
+ &.is-disable {
+ opacity: $disable;
+ }
+ }
+
+ }
+ }
+</style>
diff --git a/uni_modules/uni-table/components/uni-tr/uni-tr.vue b/uni_modules/uni-table/components/uni-tr/uni-tr.vue
new file mode 100644
index 0000000..3fb76f4
--- /dev/null
+++ b/uni_modules/uni-table/components/uni-tr/uni-tr.vue
@@ -0,0 +1,184 @@
+<template>
+ <!-- #ifdef H5 -->
+ <tr class="uni-table-tr">
+ <th v-if="selection === 'selection' && ishead" class="checkbox" :class="{ 'tr-table--border': border }">
+ <table-checkbox :checked="checked" :indeterminate="indeterminate" :disabled="disabled"
+ @checkboxSelected="checkboxSelected"></table-checkbox>
+ </th>
+ <slot></slot>
+ <!-- <uni-th class="th-fixed">123</uni-th> -->
+ </tr>
+ <!-- #endif -->
+ <!-- #ifndef H5 -->
+ <view class="uni-table-tr">
+ <view v-if="selection === 'selection' " class="checkbox" :class="{ 'tr-table--border': border }">
+ <table-checkbox :checked="checked" :indeterminate="indeterminate" :disabled="disabled"
+ @checkboxSelected="checkboxSelected"></table-checkbox>
+ </view>
+ <slot></slot>
+ </view>
+ <!-- #endif -->
+</template>
+
+<script>
+ import tableCheckbox from './table-checkbox.vue'
+ /**
+ * Tr 琛ㄦ牸琛岀粍浠�
+ * @description 琛ㄦ牸琛岀粍浠� 浠呭寘鍚� th,td 缁勪欢
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=
+ */
+ export default {
+ name: 'uniTr',
+ components: {
+ tableCheckbox
+ },
+ props: {
+ disabled: {
+ type: Boolean,
+ default: false
+ },
+ keyValue: {
+ type: [String, Number],
+ default: ''
+ }
+ },
+ options: {
+ // #ifdef MP-TOUTIAO
+ virtualHost: false,
+ // #endif
+ // #ifndef MP-TOUTIAO
+ virtualHost: true
+ // #endif
+ },
+ data() {
+ return {
+ value: false,
+ border: false,
+ selection: false,
+ widthThArr: [],
+ ishead: true,
+ checked: false,
+ indeterminate: false
+ }
+ },
+ created() {
+ this.root = this.getTable()
+ this.head = this.getTable('uniThead')
+ if (this.head) {
+ this.ishead = false
+ this.head.init(this)
+ }
+ this.border = this.root.border
+ this.selection = this.root.type
+ this.root.trChildren.push(this)
+ const rowData = this.root.data.find(v => v[this.root.rowKey] === this.keyValue)
+ if (rowData) {
+ this.rowData = rowData
+ }
+ this.root.isNodata()
+ },
+ mounted() {
+ if (this.widthThArr.length > 0) {
+ const selectionWidth = this.selection === 'selection' ? 50 : 0
+ this.root.minWidth = Number(this.widthThArr.reduce((a, b) => Number(a) + Number(b))) + selectionWidth;
+ }
+ },
+ // #ifndef VUE3
+ destroyed() {
+ const index = this.root.trChildren.findIndex(i => i === this)
+ this.root.trChildren.splice(index, 1)
+ this.root.isNodata()
+ },
+ // #endif
+ // #ifdef VUE3
+ unmounted() {
+ const index = this.root.trChildren.findIndex(i => i === this)
+ this.root.trChildren.splice(index, 1)
+ this.root.isNodata()
+ },
+ // #endif
+ methods: {
+ minWidthUpdate(width) {
+ this.widthThArr.push(width)
+ if (this.widthThArr.length > 0) {
+ const selectionWidth = this.selection === 'selection' ? 50 : 0;
+ this.root.minWidth = Number(this.widthThArr.reduce((a, b) => Number(a) + Number(b))) + selectionWidth;
+ }
+ },
+ // 閫変腑
+ checkboxSelected(e) {
+ let rootData = this.root.data.find(v => v[this.root.rowKey] === this.keyValue)
+ this.checked = e.checked
+ this.root.check(rootData || this, e.checked, rootData ? this.keyValue : null)
+ },
+ change(e) {
+ this.root.trChildren.forEach(item => {
+ if (item === this) {
+ this.root.check(this, e.detail.value.length > 0 ? true : false)
+ }
+ })
+ },
+ /**
+ * 鑾峰彇鐖跺厓绱犲疄渚�
+ */
+ getTable(name = 'uniTable') {
+ let parent = this.$parent
+ let parentName = parent.$options.name
+ while (parentName !== name) {
+ parent = parent.$parent
+ if (!parent) return false
+ parentName = parent.$options.name
+ }
+ return parent
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ $border-color: #ebeef5;
+
+ .uni-table-tr {
+ /* #ifndef APP-NVUE */
+ display: table-row;
+ transition: all 0.3s;
+ box-sizing: border-box;
+ /* #endif */
+ }
+
+ .checkbox {
+ padding: 0 8px;
+ width: 26px;
+ padding-left: 12px;
+ /* #ifndef APP-NVUE */
+ display: table-cell;
+ vertical-align: middle;
+ /* #endif */
+ color: #333;
+ font-weight: 500;
+ border-bottom: 1px $border-color solid;
+ font-size: 14px;
+ // text-align: center;
+ }
+
+ .tr-table--border {
+ border-right: 1px $border-color solid;
+ }
+
+ /* #ifndef APP-NVUE */
+ .uni-table-tr {
+ ::v-deep .uni-table-th {
+ &.table--border:last-child {
+ // border-right: none;
+ }
+ }
+
+ ::v-deep .uni-table-td {
+ &.table--border:last-child {
+ // border-right: none;
+ }
+ }
+ }
+
+ /* #endif */
+</style>
diff --git a/uni_modules/uni-table/i18n/en.json b/uni_modules/uni-table/i18n/en.json
new file mode 100644
index 0000000..e32023c
--- /dev/null
+++ b/uni_modules/uni-table/i18n/en.json
@@ -0,0 +1,9 @@
+{
+ "filter-dropdown.reset": "Reset",
+ "filter-dropdown.search": "Search",
+ "filter-dropdown.submit": "Submit",
+ "filter-dropdown.filter": "Filter",
+ "filter-dropdown.gt": "Greater or equal to",
+ "filter-dropdown.lt": "Less than or equal to",
+ "filter-dropdown.date": "Date"
+}
diff --git a/uni_modules/uni-table/i18n/es.json b/uni_modules/uni-table/i18n/es.json
new file mode 100644
index 0000000..9afd04b
--- /dev/null
+++ b/uni_modules/uni-table/i18n/es.json
@@ -0,0 +1,9 @@
+{
+ "filter-dropdown.reset": "Reiniciar",
+ "filter-dropdown.search": "B煤squeda",
+ "filter-dropdown.submit": "Entregar",
+ "filter-dropdown.filter": "Filtrar",
+ "filter-dropdown.gt": "Mayor o igual a",
+ "filter-dropdown.lt": "Menos que o igual a",
+ "filter-dropdown.date": "Fecha"
+}
diff --git a/uni_modules/uni-table/i18n/fr.json b/uni_modules/uni-table/i18n/fr.json
new file mode 100644
index 0000000..b006237
--- /dev/null
+++ b/uni_modules/uni-table/i18n/fr.json
@@ -0,0 +1,9 @@
+{
+ "filter-dropdown.reset": "R茅initialiser",
+ "filter-dropdown.search": "Chercher",
+ "filter-dropdown.submit": "Soumettre",
+ "filter-dropdown.filter": "Filtre",
+ "filter-dropdown.gt": "Sup茅rieur ou 茅gal 脿",
+ "filter-dropdown.lt": "Inf茅rieur ou 茅gal 脿",
+ "filter-dropdown.date": "Date"
+}
diff --git a/uni_modules/uni-table/i18n/index.js b/uni_modules/uni-table/i18n/index.js
new file mode 100644
index 0000000..2469dd0
--- /dev/null
+++ b/uni_modules/uni-table/i18n/index.js
@@ -0,0 +1,12 @@
+import en from './en.json'
+import es from './es.json'
+import fr from './fr.json'
+import zhHans from './zh-Hans.json'
+import zhHant from './zh-Hant.json'
+export default {
+ en,
+ es,
+ fr,
+ 'zh-Hans': zhHans,
+ 'zh-Hant': zhHant
+}
diff --git a/uni_modules/uni-table/i18n/zh-Hans.json b/uni_modules/uni-table/i18n/zh-Hans.json
new file mode 100644
index 0000000..862af17
--- /dev/null
+++ b/uni_modules/uni-table/i18n/zh-Hans.json
@@ -0,0 +1,9 @@
+{
+ "filter-dropdown.reset": "閲嶇疆",
+ "filter-dropdown.search": "鎼滅储",
+ "filter-dropdown.submit": "纭畾",
+ "filter-dropdown.filter": "绛涢��",
+ "filter-dropdown.gt": "澶т簬绛変簬",
+ "filter-dropdown.lt": "灏忎簬绛変簬",
+ "filter-dropdown.date": "鏃ユ湡鑼冨洿"
+}
diff --git a/uni_modules/uni-table/i18n/zh-Hant.json b/uni_modules/uni-table/i18n/zh-Hant.json
new file mode 100644
index 0000000..64f8061
--- /dev/null
+++ b/uni_modules/uni-table/i18n/zh-Hant.json
@@ -0,0 +1,9 @@
+{
+ "filter-dropdown.reset": "閲嶇疆",
+ "filter-dropdown.search": "鎼滅储",
+ "filter-dropdown.submit": "纰哄畾",
+ "filter-dropdown.filter": "绡╅伕",
+ "filter-dropdown.gt": "澶ф柤绛夋柤",
+ "filter-dropdown.lt": "灏忔柤绛夋柤",
+ "filter-dropdown.date": "鏃ユ湡绡勫湇"
+}
diff --git a/uni_modules/uni-table/package.json b/uni_modules/uni-table/package.json
new file mode 100644
index 0000000..f581f43
--- /dev/null
+++ b/uni_modules/uni-table/package.json
@@ -0,0 +1,86 @@
+{
+ "id": "uni-table",
+ "displayName": "uni-table 琛ㄦ牸",
+ "version": "1.2.9",
+ "description": "琛ㄦ牸缁勪欢锛屽鐢ㄤ簬灞曠ず澶氭潯缁撴瀯绫讳技鐨勬暟鎹紝濡�",
+ "keywords": [
+ "uni-ui",
+ "uniui",
+ "table",
+ "琛ㄦ牸"
+],
+ "repository": "https://github.com/dcloudio/uni-ui",
+ "engines": {
+ "HBuilderX": ""
+ },
+ "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"
+ },
+ "uni_modules": {
+ "dependencies": ["uni-scss","uni-datetime-picker"],
+ "encrypt": [],
+ "platforms": {
+ "cloud": {
+ "tcb": "y",
+ "aliyun": "y",
+ "alipay": "n"
+ },
+ "client": {
+ "App": {
+ "app-vue": "y",
+ "app-nvue": "n",
+ "app-harmony": "u",
+ "app-uvue": "u"
+ },
+ "H5-mobile": {
+ "Safari": "y",
+ "Android Browser": "y",
+ "寰俊娴忚鍣�(Android)": "y",
+ "QQ娴忚鍣�(Android)": "y"
+ },
+ "H5-pc": {
+ "Chrome": "y",
+ "IE": "y",
+ "Edge": "y",
+ "Firefox": "y",
+ "Safari": "y"
+ },
+ "灏忕▼搴�": {
+ "寰俊": "y",
+ "闃块噷": "y",
+ "鐧惧害": "y",
+ "瀛楄妭璺冲姩": "n",
+ "QQ": "y"
+ },
+ "蹇簲鐢�": {
+ "鍗庝负": "n",
+ "鑱旂洘": "n"
+ },
+ "Vue": {
+ "vue2": "y",
+ "vue3": "y"
+ }
+ }
+ }
+ }
+}
diff --git a/uni_modules/uni-table/readme.md b/uni_modules/uni-table/readme.md
new file mode 100644
index 0000000..bb08c79
--- /dev/null
+++ b/uni_modules/uni-table/readme.md
@@ -0,0 +1,13 @@
+
+
+## Table 琛ㄥ崟
+> 缁勪欢鍚嶏細``uni-table``锛屼唬鐮佸潡锛� `uTable`銆�
+
+鐢ㄤ簬灞曠ず澶氭潯缁撴瀯绫讳技鐨勬暟鎹�
+
+### [鏌ョ湅鏂囨。](https://uniapp.dcloud.io/component/uniui/uni-table)
+#### 濡備娇鐢ㄨ繃绋嬩腑鏈変换浣曢棶棰橈紝鎴栬�呮偍瀵箄ni-ui鏈変竴浜涘ソ鐨勫缓璁紝娆㈣繋鍔犲叆 uni-ui 浜ゆ祦缇わ細871950839
+
+
+
+
--
Gitblit v1.8.0