From 6a00b39ef5de18aab2baf47db37a9ec947109755 Mon Sep 17 00:00:00 2001
From: whycq <913841844@qq.com>
Date: 星期五, 13 十月 2023 18:04:52 +0800
Subject: [PATCH] #
---
uni_modules/uni-calendar/components/uni-calendar/uni-calendar-item.vue | 181 +++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 181 insertions(+), 0 deletions(-)
diff --git a/uni_modules/uni-calendar/components/uni-calendar/uni-calendar-item.vue b/uni_modules/uni-calendar/components/uni-calendar/uni-calendar-item.vue
new file mode 100644
index 0000000..0353011
--- /dev/null
+++ b/uni_modules/uni-calendar/components/uni-calendar/uni-calendar-item.vue
@@ -0,0 +1,181 @@
+<template>
+ <view class="uni-calendar-item__weeks-box" :class="{
+ 'uni-calendar-item--disable':weeks.disable,
+ 'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
+ 'uni-calendar-item--checked':(calendar.fullDate === weeks.fullDate && !weeks.isDay) ,
+ 'uni-calendar-item--before-checked':weeks.beforeMultiple,
+ 'uni-calendar-item--multiple': weeks.multiple,
+ 'uni-calendar-item--after-checked':weeks.afterMultiple,
+ }"
+ @click="choiceDate(weeks)">
+ <view class="uni-calendar-item__weeks-box-item">
+ <text v-if="selected&&weeks.extraInfo" class="uni-calendar-item__weeks-box-circle"></text>
+ <text class="uni-calendar-item__weeks-box-text" :class="{
+ 'uni-calendar-item--isDay-text': weeks.isDay,
+ 'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
+ 'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
+ '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,
+ }">{{weeks.date}}</text>
+ <text v-if="!lunar&&!weeks.extraInfo && weeks.isDay" class="uni-calendar-item__weeks-lunar-text" :class="{
+ 'uni-calendar-item--isDay-text':weeks.isDay,
+ 'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
+ 'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
+ 'uni-calendar-item--before-checked':weeks.beforeMultiple,
+ 'uni-calendar-item--multiple': weeks.multiple,
+ 'uni-calendar-item--after-checked':weeks.afterMultiple,
+ }">{{todayText}}</text>
+ <text v-if="lunar&&!weeks.extraInfo" class="uni-calendar-item__weeks-lunar-text" :class="{
+ 'uni-calendar-item--isDay-text':weeks.isDay,
+ 'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
+ 'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
+ '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,
+ }">{{weeks.isDay ? todayText : (weeks.lunar.IDayCn === '鍒濅竴'?weeks.lunar.IMonthCn:weeks.lunar.IDayCn)}}</text>
+ <text v-if="weeks.extraInfo&&weeks.extraInfo.info" class="uni-calendar-item__weeks-lunar-text" :class="{
+ 'uni-calendar-item--extra':weeks.extraInfo.info,
+ 'uni-calendar-item--isDay-text':weeks.isDay,
+ 'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
+ 'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
+ '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,
+ }">{{weeks.extraInfo.info}}</text>
+ </view>
+ </view>
+</template>
+
+<script>
+ import {
+ initVueI18n
+ } from '@dcloudio/uni-i18n'
+ import messages from './i18n/index.js'
+ const { t } = initVueI18n(messages)
+ export default {
+ emits:['change'],
+ props: {
+ weeks: {
+ type: Object,
+ default () {
+ return {}
+ }
+ },
+ calendar: {
+ type: Object,
+ default: () => {
+ return {}
+ }
+ },
+ selected: {
+ type: Array,
+ default: () => {
+ return []
+ }
+ },
+ lunar: {
+ type: Boolean,
+ default: false
+ }
+ },
+ computed: {
+ todayText() {
+ return t("uni-calender.today")
+ },
+ },
+ methods: {
+ choiceDate(weeks) {
+ this.$emit('change', weeks)
+ }
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .uni-calendar-item__weeks-box {
+ flex: 1;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ }
+
+ .uni-calendar-item__weeks-box-text {
+ font-size: $uni-font-size-base;
+ color: $uni-text-color;
+ }
+
+ .uni-calendar-item__weeks-lunar-text {
+ font-size: $uni-font-size-sm;
+ color: $uni-text-color;
+ }
+
+ .uni-calendar-item__weeks-box-item {
+ position: relative;
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ width: 100rpx;
+ height: 100rpx;
+ }
+
+ .uni-calendar-item__weeks-box-circle {
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ width: 8px;
+ height: 8px;
+ border-radius: 8px;
+ background-color: $uni-color-error;
+
+ }
+
+ .uni-calendar-item--disable {
+ background-color: rgba(249, 249, 249, $uni-opacity-disabled);
+ color: $uni-text-color-disable;
+ }
+
+ .uni-calendar-item--isDay-text {
+ color: $uni-color-primary;
+ }
+
+ .uni-calendar-item--isDay {
+ background-color: $uni-color-primary;
+ opacity: 0.8;
+ color: #fff;
+ }
+
+ .uni-calendar-item--extra {
+ color: $uni-color-error;
+ opacity: 0.8;
+ }
+
+ .uni-calendar-item--checked {
+ background-color: $uni-color-primary;
+ color: #fff;
+ opacity: 0.8;
+ }
+
+ .uni-calendar-item--multiple {
+ background-color: $uni-color-primary;
+ color: #fff;
+ opacity: 0.8;
+ }
+ .uni-calendar-item--before-checked {
+ background-color: #ff5a5f;
+ color: #fff;
+ }
+ .uni-calendar-item--after-checked {
+ background-color: #ff5a5f;
+ color: #fff;
+ }
+</style>
--
Gitblit v1.9.1