From 813b4f9738bb5516b82c39c0b3df601deb919f51 Mon Sep 17 00:00:00 2001
From: KeiferJu <jkf19980216@qq.com>
Date: Tue, 24 Mar 2020 09:45:37 +0800
Subject: [PATCH] =?UTF-8?q?=E6=97=B6=E9=97=B4=E6=97=A5=E6=9C=9F=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E6=B7=BB=E5=8A=A0=E5=A4=B1=E5=8E=BB=E7=84=A6=E7=82=B9?=
 =?UTF-8?q?=E5=85=B3=E9=97=AD=E4=BA=8B=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Datepicker/DatePicker.svelte | 14 ++++++++++----
 src/components/Timepicker/TimePicker.svelte | 11 ++++++++---
 2 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/src/components/Datepicker/DatePicker.svelte b/src/components/Datepicker/DatePicker.svelte
index 5762011..ba2bc35 100644
--- a/src/components/Datepicker/DatePicker.svelte
+++ b/src/components/Datepicker/DatePicker.svelte
@@ -138,6 +138,10 @@
     date = e.detail.timeStamp
     dispatch('dateChecked', e.detail)
   }
+
+  function windowClick(){
+    visible = false;
+  }
 </script>
 
 <style>
@@ -202,13 +206,14 @@
     box-shadow: none !important;
   } */
 </style>
-
+<svelte:window on:click={windowClick}></svelte:window>
 <div style="width: {width};position: relative">
   {#if !calendar}
     {#if pickerRule === 'rangeChoice'}
       <div
         style="position: relative;margin: 5px 0 0 0;"
-        on:click={() => {
+        on:click={(e) => {
+          e.stopPropagation()
           visible = !visible
         }}>
       <Input type="text" class={inputClass} bind:value={rangePickerResult} readonly iconPack="fa" icon="{icon? 'calendar': ''}" />
@@ -216,7 +221,8 @@
     {:else}
       <div
         style="position: relative;margin: 5px 0 0 0;"
-        on:click={() => {
+        on:click={(e) => {
+          e.stopPropagation()
           visible = !visible
         }}>
         <Input type="text" class={inputClass} bind:value={pickerResult} readonly iconPack="fa" icon="{icon? 'calendar': ''}" />
@@ -225,7 +231,7 @@
     {/if}
   {/if}
   {#if visible || calendar}
-    <div class={'calendar_' + theme} style="left: {left}">
+    <div class={'calendar_' + theme} style="left: {left}"  on:click={(e)=>e.stopPropagation()}>
       <Selector />
       {#if $view === 'y'}
         <YearView />
diff --git a/src/components/Timepicker/TimePicker.svelte b/src/components/Timepicker/TimePicker.svelte
index 3965418..33416f0 100755
--- a/src/components/Timepicker/TimePicker.svelte
+++ b/src/components/Timepicker/TimePicker.svelte
@@ -132,6 +132,10 @@
     }
     dispatch('timeChecked', data)
   }
+
+  function windowClick(){
+    visible = false;
+  }
 </script>
 
 <style>
@@ -199,9 +203,10 @@
     line-height: 40px;
   } */
 </style>
-
+<svelte:window on:click={windowClick}></svelte:window>
 <div style="width: {width};position: relative">
-  <div style="position: relative" on:click={() => {
+  <div style="position: relative" on:click={(e) => {
+        e.stopPropagation()
         visible = !visible
       }} >
     <!-- <input
@@ -216,7 +221,7 @@
     <Input type="text" class={inputClass} bind:value={_time} readonly iconPack="fa" icon="{icon? 'clock': ''}" />
   </div>
    {#if visible}
-      <div class="touch-time-wrapper"  style="left: {left}">
+      <div class="touch-time-wrapper"  style="left: {left}" on:click={(e)=>e.stopPropagation()}>
         <div class="touch-time">{_time}</div>
         <div class="touch-time-picker">
           <Switcher type="hours" data={HOURS} selected={selectedHour} on:timeChange={timeChanged} } {hour12} />