提交 15b95e8c 编写于 作者: S suzigang

style(timeselect): 修改配送时间组件 style

上级 22413d32
.nut-timedetail {
display: flex;
width: 100%;
height: 100%;
overflow: auto;
padding: 0 5px 50px 13px;
&__detail {
width: 100%;
......
......@@ -9,19 +9,11 @@
height="50%"
:current-key="currentKey1"
:current-time="currentTime1"
@selected="handleSelected1"
@select="handleSelected1"
>
<template #pannel>
<nut-timepannel
name="2月23日(今天)"
pannel-key="0"
@change="handleChange1"
></nut-timepannel>
<nut-timepannel
name="2月24日(星期三)"
pannel-key="1"
@change="handleChange1"
></nut-timepannel>
<nut-timepannel name="2月23日(今天)" pannel-key="0" @change="handleChange1"></nut-timepannel>
<nut-timepannel name="2月24日(星期三)" pannel-key="1" @change="handleChange1"></nut-timepannel>
</template>
<template #detail>
<nut-timedetail :times="times1" @select="selectTime1"></nut-timedetail>
......@@ -36,19 +28,11 @@
height="50%"
:current-key="currentKey2"
:current-time="currentTime2"
@selected="handleSelected2"
@select="handleSelected2"
>
<template #pannel>
<nut-timepannel
name="2月23日(今天)"
pannel-key="0"
@change="handleChange2"
></nut-timepannel>
<nut-timepannel
name="2月24日(星期三)"
pannel-key="1"
@change="handleChange2"
></nut-timepannel>
<nut-timepannel name="2月23日(今天)" pannel-key="0" @change="handleChange2"></nut-timepannel>
<nut-timepannel name="2月24日(星期三)" pannel-key="1" @change="handleChange2"></nut-timepannel>
</template>
<template #detail>
<nut-timedetail :times="times2" @select="selectTime2"></nut-timedetail>
......@@ -107,9 +91,7 @@ export default createDemo({
};
const selectTime1 = (item: string) => {
let curTimeIndex = state.currentTime1[0]['list'].findIndex(
(time: string) => time === item
);
let curTimeIndex = state.currentTime1[0]['list'].findIndex((time: string) => time === item);
if (curTimeIndex === -1) {
state.currentTime1[0]['list'].push(item);
} else {
......@@ -118,14 +100,13 @@ export default createDemo({
};
const handleSelected1 = (obj: any) => {
console.log(123);
proxy.$toast.text(`您选择了:${JSON.stringify(obj)}`);
};
const handleChange2 = (pannelKey: number) => {
state.currentKey2 = pannelKey;
let curTime = state.currentTime2.find(
(item: any) => item.key == pannelKey
);
let curTime = state.currentTime2.find((item: any) => item.key == pannelKey);
if (!curTime) {
state.currentTime2.push({
key: pannelKey,
......@@ -139,12 +120,8 @@ export default createDemo({
};
const selectTime2 = (item: string) => {
let findIndex = state.currentTime2.findIndex(
(item: any) => item.key == state.currentKey2
);
let curTimeIndex = state.currentTime2[findIndex]['list'].findIndex(
(time: string) => time === item
);
let findIndex = state.currentTime2.findIndex((item: any) => item.key == state.currentKey2);
let curTimeIndex = state.currentTime2[findIndex]['list'].findIndex((time: string) => time === item);
if (curTimeIndex === -1) {
state.currentTime2[findIndex]['list'].push(item);
} else {
......
......@@ -4,6 +4,7 @@
position: relative;
overflow: hidden;
&__title {
display: flex;
width: 100%;
height: 50px;
line-height: 50px;
......@@ -29,6 +30,8 @@
&__detail {
width: calc(100% - 140px);
height: 308px;
overflow-y: auto;
overflow-x: hidden;
}
}
}
......@@ -58,7 +58,7 @@ export default create({
default: false
}
},
emits: ['update:visible', 'selected'],
emits: ['update:visible', 'select'],
setup: (props: any, context: any) => {
const classes = computed(() => {
const prefixCls = componentName;
......@@ -82,7 +82,7 @@ export default create({
const close = () => {
context.emit('update:visible', false);
context.emit('selected', currentTime.value);
context.emit('select', currentTime.value);
};
provide('currentKey', currentKey);
......
......@@ -280,7 +280,7 @@ $noticeBar-left-icon-width: 16px !default;
$noticeBar-right-icon-width: 16px !default;
// TimeSelect
$timeselect-title-font-size: $font-size-1 !default;
$timeselect-title-font-size: $font-size-2 !default;
$timeselect-title-color: $title-color !default;
$timeselect-pannel-bg-color: #f6f7f9 !default;
......
......@@ -9,19 +9,11 @@
height="50%"
:current-key="currentKey1"
:current-time="currentTime1"
@selected="handleSelected1"
@select="handleSelected1"
>
<template #pannel>
<nut-timepannel
name="2月23日(今天)"
pannel-key="0"
@change="handleChange1"
></nut-timepannel>
<nut-timepannel
name="2月24日(星期三)"
pannel-key="1"
@change="handleChange1"
></nut-timepannel>
<nut-timepannel name="2月23日(今天)" pannel-key="0" @change="handleChange1"></nut-timepannel>
<nut-timepannel name="2月24日(星期三)" pannel-key="1" @change="handleChange1"></nut-timepannel>
</template>
<template #detail>
<nut-timedetail :times="times1" @select="selectTime1"></nut-timedetail>
......@@ -36,19 +28,11 @@
height="50%"
:current-key="currentKey2"
:current-time="currentTime2"
@selected="handleSelected2"
@select="handleSelected2"
>
<template #pannel>
<nut-timepannel
name="2月23日(今天)"
pannel-key="0"
@change="handleChange2"
></nut-timepannel>
<nut-timepannel
name="2月24日(星期三)"
pannel-key="1"
@change="handleChange2"
></nut-timepannel>
<nut-timepannel name="2月23日(今天)" pannel-key="0" @change="handleChange2"></nut-timepannel>
<nut-timepannel name="2月24日(星期三)" pannel-key="1" @change="handleChange2"></nut-timepannel>
</template>
<template #detail>
<nut-timedetail :times="times2" @select="selectTime2"></nut-timedetail>
......@@ -112,9 +96,7 @@ export default defineComponent({
};
const selectTime1 = (item: string) => {
let curTimeIndex = state.currentTime1[0]['list'].findIndex(
(time: string) => time === item
);
let curTimeIndex = state.currentTime1[0]['list'].findIndex((time: string) => time === item);
if (curTimeIndex === -1) {
state.currentTime1[0]['list'].push(item);
} else {
......@@ -131,9 +113,7 @@ export default defineComponent({
const handleChange2 = (pannelKey: number) => {
state.currentKey2 = pannelKey;
let curTime = state.currentTime2.find(
(item: any) => item.key == pannelKey
);
let curTime = state.currentTime2.find((item: any) => item.key == pannelKey);
if (!curTime) {
state.currentTime2.push({
key: pannelKey,
......@@ -147,12 +127,8 @@ export default defineComponent({
};
const selectTime2 = (item: string) => {
let findIndex = state.currentTime2.findIndex(
(item: any) => item.key == state.currentKey2
);
let curTimeIndex = state.currentTime2[findIndex]['list'].findIndex(
(time: string) => time === item
);
let findIndex = state.currentTime2.findIndex((item: any) => item.key == state.currentKey2);
let curTimeIndex = state.currentTime2[findIndex]['list'].findIndex((time: string) => time === item);
if (curTimeIndex === -1) {
state.currentTime2[findIndex]['list'].push(item);
} else {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册