Skip to content

Commit

Permalink
chore(dentry): move to setup sugar (#2634)
Browse files Browse the repository at this point in the history
  • Loading branch information
@eiinu
eiinu authored Nov 6, 2023
1 parent 085022b commit b14edf1
Show file tree
Hide file tree
Showing 62 changed files with 7,998 additions and 10,633 deletions.
266 changes: 118 additions & 148 deletions packages/nutui-taro-demo/src/dentry/pages/calendar/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,13 @@
<nut-cell
:show-icon="true"
title="选择单个日期"
:desc="date ? `${date} ${dateWeek}` : '请选择'"
:desc="state.date ? `${state.date} ${state.dateWeek}` : '请选择'"
@click="openSwitch('isVisible')"
>
</nut-cell>
<nut-calendar
v-model:visible="isVisible"
:default-value="date"
v-model:visible="state.isVisible"
:default-value="state.date"
@close="closeSwitch('isVisible')"
@choose="setChooseValue"
:start-date="`2022-01-11`"
Expand All @@ -25,13 +25,13 @@
<nut-cell
:show-icon="true"
title="选择日期区间"
:desc="date1 ? `${date1[0]}至${date1[1]}` : '请选择'"
:desc="state.date1 ? `${state.date1[0]}至${state.date1[1]}` : '请选择'"
@click="openSwitch('isVisible1')"
>
</nut-cell>
<nut-calendar
v-model:visible="isVisible1"
:default-value="date1"
v-model:visible="state.isVisible1"
:default-value="state.date1"
type="range"
:start-date="`2019-12-22`"
:end-date="`2021-01-08`"
Expand All @@ -46,13 +46,13 @@
<nut-cell
:show-icon="true"
title="选择多个日期"
:desc="date7 && date7.length ? `已选择${date7.length}个日期` : '请选择'"
:desc="state.date7 && state.date7.length ? `已选择${state.date7.length}个日期` : '请选择'"
@click="openSwitch('isVisible7')"
>
</nut-cell>
<nut-calendar
v-model:visible="isVisible7"
:default-value="date7"
v-model:visible="state.isVisible7"
:default-value="state.date7"
type="multiple"
:start-date="`2022-01-01`"
:end-date="`2022-09-10`"
Expand All @@ -65,13 +65,13 @@
<nut-cell
:show-icon="true"
title="周选择"
:desc="date9 ? `${date9[0]}${'至'}${date9[1]}` : '请选择'"
:desc="state.date9 ? `${state.date9[0]}${'至'}${state.date9[1]}` : '请选择'"
@click="openSwitch('isVisible9')"
>
</nut-cell>
<nut-calendar
v-model:visible="isVisible9"
:default-value="date9"
v-model:visible="state.isVisible9"
:default-value="state.date9"
type="week"
:start-date="`2019-12-22`"
:end-date="`2021-01-08`"
Expand All @@ -87,15 +87,15 @@
<nut-cell
:show-icon="true"
title="选择单个日期"
:desc="date3 ? date3 : '请选择'"
:desc="state.date3 ? state.date3 : '请选择'"
@click="openSwitch('isVisible3')"
>
</nut-cell>
<nut-calendar
v-model:visible="isVisible3"
v-model:visible="state.isVisible3"
@close="closeSwitch('isVisible3')"
@choose="setChooseValue3"
:default-value="date3"
:default-value="state.date3"
:is-auto-back-fill="true"
>
</nut-calendar>
Expand All @@ -104,13 +104,13 @@
<nut-cell
:show-icon="true"
title="选择日期范围"
:desc="date4 ? `${date4[0]}至${date4[1]}` : '请选择'"
:desc="state.date4 ? `${state.date4[0]}至${state.date4[1]}` : '请选择'"
@click="openSwitch('isVisible4')"
>
</nut-cell>
<nut-calendar
v-model:visible="isVisible4"
:default-value="date4"
v-model:visible="state.isVisible4"
:default-value="state.date4"
type="range"
:start-date="`2022-01-01`"
:end-date="`2022-12-31`"
Expand All @@ -125,14 +125,14 @@
<nut-cell
:show-icon="true"
title="自定义按钮"
:desc="date5 && date5[0] ? `${date5[0]}至${date5[1]}` : '请选择'"
:desc="state.date5 && state.date5[0] ? `${state.date5[0]}至${state.date5[1]}` : '请选择'"
@click="openSwitch('isVisible5')"
>
</nut-cell>
<nut-calendar
ref="calendarRef"
v-model:visible="isVisible5"
:default-value="date5"
v-model:visible="state.isVisible5"
:default-value="state.date5"
type="range"
@close="closeSwitch('isVisible5')"
@choose="setChooseValue5"
Expand All @@ -153,13 +153,13 @@
<nut-cell
:show-icon="true"
title="自定义时间文案"
:desc="date6 && date6[0] ? `${date6[0]}至${date6[1]}` : '请选择'"
:desc="state.date6 && state.date6[0] ? `${state.date6[0]}至${state.date6[1]}` : '请选择'"
@click="openSwitch('isVisible6')"
>
</nut-cell>
<nut-calendar
v-model:visible="isVisible6"
:default-value="date6"
v-model:visible="state.isVisible6"
:default-value="state.date6"
type="range"
@close="closeSwitch('isVisible6')"
@choose="setChooseValue6"
Expand All @@ -183,13 +183,13 @@
<nut-cell
:showIcon="true"
title="自定义周起始日"
:desc="date8 ? `${date8}` : '请选择'"
:desc="state.date8 ? `${state.date8}` : '请选择'"
@click="openSwitch('isVisible8')"
>
</nut-cell>
<nut-calendar
v-model:visible="isVisible8"
:default-value="date8"
v-model:visible="state.isVisible8"
:default-value="state.date8"
@close="closeSwitch('isVisible8')"
@choose="setChooseValue8"
:first-day-of-week="2"
Expand All @@ -200,7 +200,7 @@
<div class="test-calendar-wrapper">
<nut-calendar
:poppable="false"
:default-value="date2"
:default-value="state.date2"
:is-auto-back-fill="true"
@choose="setChooseValue2"
:start-date="`2020-02-01`"
Expand All @@ -211,136 +211,106 @@
</div>
</template>

<script lang="ts">
import { reactive, toRefs, ref } from 'vue';
<script setup lang="ts">
import { reactive, ref } from 'vue';
import Taro from '@tarojs/taro';
import Header from '../../../components/header.vue';
import Utils from '@/packages/utils/date';
const env = Taro.getEnv();
export default {
props: {},
components: {
Header
},
setup() {
const env = Taro.getEnv();
const calendarRef = ref<any>(null);
const state = reactive({
isVisible: false,
date: '2022-02-01',
dateWeek: '',
date1: ['2020-01-23', '2020-01-26'],
date2: '2020-07-08',
date3: '',
date4: ['2022-02-23', '2022-04-26'],
date5: [],
date6: [],
date7: [],
date8: '',
date9: ['2020-01-23', '2020-01-26'],
isVisible1: false,
isVisible2: false,
isVisible3: false,
isVisible4: false,
isVisible5: false,
isVisible6: false,
isVisible7: false,
isVisible8: false,
isVisible9: false
});
const openSwitch = (param: string) => {
state[`${param}`] = true;
};
const calendarRef = ref<any>(null);
const state = reactive({
isVisible: false,
date: '2022-02-01',
dateWeek: '',
date1: ['2020-01-23', '2020-01-26'],
date2: '2020-07-08',
date3: '',
date4: ['2022-02-23', '2022-04-26'],
date5: [] as string[],
date6: [] as string[],
date7: [] as string[],
date8: '',
date9: ['2020-01-23', '2020-01-26'],
isVisible1: false,
isVisible2: false,
isVisible3: false,
isVisible4: false,
isVisible5: false,
isVisible6: false,
isVisible7: false,
isVisible8: false,
isVisible9: false
});
const openSwitch = (param: string) => {
state[`${param}`] = true;
};
const closeSwitch = (param: string) => {
state[`${param}`] = false;
};
const closeSwitch = (param: string) => {
state[`${param}`] = false;
};
const setChooseValue = (param: string) => {
state.date = param[3];
state.dateWeek = param[4];
};
const setChooseValue = (param: string) => {
state.date = param[3];
state.dateWeek = param[4];
};
const select = (param: string) => {
console.log(param);
};
const setChooseValue1 = (param: string) => {
state.date1 = [...[param[0][3], param[1][3]]];
};
const select = (param: string) => {
console.log(param);
};
const setChooseValue1 = (param: string) => {
state.date1 = [...[param[0][3], param[1][3]]];
};
const setChooseValue2 = (param: string) => {
state.date2 = param[3];
};
const setChooseValue2 = (param: string) => {
state.date2 = param[3];
};
const setChooseValue3 = (param: string) => {
state.date3 = param[3];
};
const setChooseValue4 = (param: string) => {
state.date4 = [...[param[0][3], param[1][3]]];
};
const setChooseValue3 = (param: string) => {
state.date3 = param[3];
};
const setChooseValue4 = (param: string) => {
state.date4 = [...[param[0][3], param[1][3]]];
};
const setChooseValue5 = (param: string) => {
state.date5 = [...[param[0][3], param[1][3]]];
};
const setChooseValue6 = (param: string) => {
state.date6 = [...[param[0][3], param[1][3]]];
};
const setChooseValue7 = (chooseData: any) => {
let dateArr = chooseData.map((item: any) => {
return item[3];
});
console.log('changevalue 7 ', chooseData, dateArr);
state.date7 = [...dateArr];
};
const setChooseValue8 = (param: string) => {
state.date8 = param[3];
};
const setChooseValue9 = (param: any) => {
let { weekDate } = param;
state.date9 = [weekDate[0].date[3], weekDate[1].date[3]];
};
const clickBtn = () => {
let date = [Utils.date2Str(new Date()), Utils.getDay(6)];
state.date5 = date;
};
const clickBtn1 = () => {
let date = new Date();
let year = date.getFullYear();
let month: any = date.getMonth() + 1;
month = month < 10 ? '0' + month : month + '';
let yearMonth = `${year}-${month}`;
let currMonthDays = Utils.getMonthDays(year + '', month + '');
state.date5 = [`${yearMonth}-01`, `${yearMonth}-${currMonthDays}`];
};
const goDate = () => {
if (calendarRef.value) {
var date1 = new Date();
date1.setDate(date1.getDate() + 30);
calendarRef.value.scrollToDate(Utils.date2Str(date1));
}
};
return {
...toRefs(state),
openSwitch,
closeSwitch,
setChooseValue,
setChooseValue1,
setChooseValue2,
setChooseValue3,
setChooseValue4,
setChooseValue5,
setChooseValue6,
clickBtn,
clickBtn1,
setChooseValue7,
setChooseValue8,
setChooseValue9,
goDate,
calendarRef,
select,
env
};
const setChooseValue5 = (param: string) => {
state.date5 = [...[param[0][3], param[1][3]]];
};
const setChooseValue6 = (param: string) => {
state.date6 = [...[param[0][3], param[1][3]]];
};
const setChooseValue7 = (chooseData: any) => {
let dateArr = chooseData.map((item: any) => {
return item[3];
});
console.log('changevalue 7 ', chooseData, dateArr);
state.date7 = [...dateArr];
};
const setChooseValue8 = (param: string) => {
state.date8 = param[3];
};
const setChooseValue9 = (param: any) => {
let { weekDate } = param;
state.date9 = [weekDate[0].date[3], weekDate[1].date[3]];
};
const clickBtn = () => {
let date = [Utils.date2Str(new Date()), Utils.getDay(6)];
state.date5 = date;
};
const clickBtn1 = () => {
let date = new Date();
let year = date.getFullYear();
let month: any = date.getMonth() + 1;
month = month < 10 ? '0' + month : month + '';
let yearMonth = `${year}-${month}`;
let currMonthDays = Utils.getMonthDays(year + '', month + '');
state.date5 = [`${yearMonth}-01`, `${yearMonth}-${currMonthDays}`];
};
const goDate = () => {
if (calendarRef.value) {
var date1 = new Date();
date1.setDate(date1.getDate() + 30);
calendarRef.value.scrollToDate(Utils.date2Str(date1));
}
};
</script>
Expand Down
Loading

0 comments on commit b14edf1

Please sign in to comment.