fix(timeselect): 第一次渲染样式问题以及样式不全问题修复(#1257 #1253)

Author: szg2008

src/packages/__VUE/timeselect/doc.en-US.md

@@ -37,7 +37,7 @@ app.use(TimeSelect).use(TimePannel).use(TimeDetail).use(Popup);
   </nut-timeselect>
 </template>
 <script lang="ts">
-  import { reactive, toRefs, getCurrentInstance } from 'vue';
+  import { reactive, toRefs, getCurrentInstance, onMounted } from 'vue';
   export default {
     props: {},
     setup() {
@@ -84,6 +84,13 @@ app.use(TimeSelect).use(TimePannel).use(TimeDetail).use(Popup);
         proxy.$toast.text(`Your choose：${JSON.stringify(obj)}`);
       };
 
+      onMounted(() => {
+        state.currentTime1.push({
+          key: state.currentKey1,
+          list: []
+        });
+      });
+
       return { 
         ...toRefs(state), 
         handleChange1,
@@ -118,7 +125,7 @@ app.use(TimeSelect).use(TimePannel).use(TimeDetail).use(Popup);
   </nut-timeselect>
 </template>
 <script lang="ts">
-  import { reactive, toRefs, getCurrentInstance } from 'vue';
+  import { reactive, toRefs, getCurrentInstance, onMounted } from 'vue';
   export default {
     props: {},
     setup() {
@@ -168,6 +175,13 @@ app.use(TimeSelect).use(TimePannel).use(TimeDetail).use(Popup);
         proxy.$toast.text(`Your choose：${JSON.stringify(obj)}`);
       };
 
+      onMounted(() => {
+        state.currentTime2.push({
+          key: state.currentKey2,
+          list: []
+        });
+      });
+
       return { 
         ...toRefs(state), 
         handleChange2,

src/packages/__VUE/timeselect/doc.md

@@ -37,7 +37,7 @@ app.use(TimeSelect).use(TimePannel).use(TimeDetail).use(Popup);
   </nut-timeselect>
 </template>
 <script lang="ts">
-  import { reactive, toRefs, getCurrentInstance } from 'vue';
+  import { reactive, toRefs, getCurrentInstance, onMounted } from 'vue';
   export default {
     props: {},
     setup() {
@@ -84,6 +84,13 @@ app.use(TimeSelect).use(TimePannel).use(TimeDetail).use(Popup);
         proxy.$toast.text(`您选择了：${JSON.stringify(obj)}`);
       };
 
+      onMounted(() => {
+        state.currentTime1.push({
+          key: state.currentKey1,
+          list: []
+        });
+      });
+
       return { 
         ...toRefs(state), 
         handleChange1,
@@ -118,7 +125,7 @@ app.use(TimeSelect).use(TimePannel).use(TimeDetail).use(Popup);
   </nut-timeselect>
 </template>
 <script lang="ts">
-  import { reactive, toRefs, getCurrentInstance } from 'vue';
+  import { reactive, toRefs, getCurrentInstance, onMounted } from 'vue';
   export default {
     props: {},
     setup() {
@@ -168,6 +175,13 @@ app.use(TimeSelect).use(TimePannel).use(TimeDetail).use(Popup);
         proxy.$toast.text(`您选择了：${JSON.stringify(obj)}`);
       };
 
+      onMounted(() => {
+        state.currentTime2.push({
+          key: state.currentKey2,
+          list: []
+        });
+      });
+
       return { 
         ...toRefs(state), 
         handleChange2,

src/packages/__VUE/timeselect/index.scss

@@ -20,16 +20,17 @@
   }
   &__content {
     width: 100%;
+    height: calc(100% - $timeselect-title-height - 10px);
     display: flex;
     &__pannel {
       width: 140px;
-      height: 308px;
+      height: 100%;
       overflow: auto;
       background-color: $timeselect-pannel-bg-color;
     }
     &__detail {
       width: calc(100% - 140px);
-      height: 308px;
+      height: 100%;
       overflow-y: auto;
       overflow-x: hidden;
     }