Browse Source

chore(timeselect): modify class name

eiinu 3 years ago
parent
commit
d66748f132

+ 2 - 2
src/packages/__VUE/timedetail/index.scss

@@ -1,5 +1,5 @@
 .nut-theme-dark {
-  .nut-timedetail {
+  .nut-time-detail {
     background-color: $dark-background2;
     &__detail {
       &__list {
@@ -14,7 +14,7 @@
     }
   }
 }
-.nut-timedetail {
+.nut-time-detail {
   display: flex;
   width: 100%;
   padding: $timeselect-timedetail-padding;

+ 6 - 6
src/packages/__VUE/timedetail/index.taro.vue

@@ -1,8 +1,8 @@
 <template>
   <view :class="classes">
-    <view class="nut-timedetail__detail nut-timedetail__detail--moring">
-      <!-- <view class="nut-timedetail__detail__time">上午</view> -->
-      <view class="nut-timedetail__detail__list">
+    <view class="nut-time-detail__detail nut-time-detail__detail--moring">
+      <!-- <view class="nut-time-detail__detail__time">上午</view> -->
+      <view class="nut-time-detail__detail__list">
         <view :class="getClass(item)" v-for="item in renderData" :key="item" @click="handleTime(item)">{{ item }}</view>
       </view>
     </view>
@@ -39,7 +39,7 @@ export default create({
     });
 
     const classes = computed(() => {
-      const prefixCls = 'nut-timedetail';
+      const prefixCls = componentName;
       return {
         [prefixCls]: true
       };
@@ -49,8 +49,8 @@ export default create({
       let find = state.currentTime.find((item: any) => item.key == state.currentKey);
       if (find) {
         return {
-          'nut-timedetail__detail__list__item': true,
-          'nut-timedetail__detail__list__item--curr': find.list.filter((value: string) => value === item).length > 0
+          'nut-time-detail__detail__list__item': true,
+          'nut-time-detail__detail__list__item--curr': find.list.filter((value: string) => value === item).length > 0
         };
       }
     };

+ 5 - 5
src/packages/__VUE/timedetail/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view :class="classes">
-    <view class="nut-timedetail__detail nut-timedetail__detail--moring">
-      <view class="nut-timedetail__detail__list">
+    <view class="nut-time-detail__detail nut-time-detail__detail--moring">
+      <view class="nut-time-detail__detail__list">
         <view :class="getClass(item)" v-for="item in renderData" :key="item" @click="handleTime(item)">{{ item }}</view>
       </view>
     </view>
@@ -37,7 +37,7 @@ export default create({
     });
 
     const classes = computed(() => {
-      const prefixCls = 'nut-timedetail';
+      const prefixCls = componentName;
       return {
         [prefixCls]: true
       };
@@ -47,8 +47,8 @@ export default create({
       let find = state.currentTime.find((item: any) => item.key == state.currentKey);
       if (find) {
         return {
-          'nut-timedetail__detail__list__item': true,
-          'nut-timedetail__detail__list__item--curr': find.list.filter((value: string) => value === item).length > 0
+          'nut-time-detail__detail__list__item': true,
+          'nut-time-detail__detail__list__item--curr': find.list.filter((value: string) => value === item).length > 0
         };
       }
     };

+ 2 - 2
src/packages/__VUE/timepannel/index.scss

@@ -1,5 +1,5 @@
 .nut-theme-dark {
-  .nut-timepannel {
+  .nut-time-pannel {
     background-color: $dark-background3;
     color: $dark-color-gray;
     &--curr {
@@ -8,7 +8,7 @@
     }
   }
 }
-.nut-timepannel {
+.nut-time-pannel {
   display: flex;
   width: $timeselect-timepannel-width;
   height: $timeselect-timepannel-height;

+ 2 - 2
src/packages/__VUE/timepannel/index.taro.vue

@@ -27,10 +27,10 @@ export default create({
     });
 
     const classes = computed(() => {
-      const prefixCls = 'nut-timepannel';
+      const prefixCls = componentName;
       return {
         [prefixCls]: true,
-        'nut-timepannel--curr': state.currentKey == props.pannelKey
+        'nut-time-pannel--curr': state.currentKey == props.pannelKey
       };
     });
 

+ 2 - 2
src/packages/__VUE/timepannel/index.vue

@@ -27,10 +27,10 @@ export default create({
     });
 
     const classes = computed(() => {
-      const prefixCls = 'nut-timepannel';
+      const prefixCls = componentName;
       return {
         [prefixCls]: true,
-        'nut-timepannel--curr': state.currentKey == props.pannelKey
+        'nut-time-pannel--curr': state.currentKey == props.pannelKey
       };
     });
 

+ 9 - 9
src/packages/__VUE/timeselect/__tests__/timeselect.spec.ts

@@ -108,23 +108,23 @@ test('props test', async () => {
   // height test
   expect(popup.element.style.height).toEqual('50%');
   // title test
-  expect(wrapper.find('.nut-timeselect__title__fixed').html()).toContain('标题测试');
+  expect(wrapper.find('.nut-time-select__title__fixed').html()).toContain('标题测试');
 
   // current-key test
-  const leftPannel = wrapper.findAll('.nut-timepannel');
+  const leftPannel = wrapper.findAll('.nut-time-pannel');
   await leftPannel[1].trigger('click');
-  expect(leftPannel[1].find('.nut-timepannel--curr')).toBeTruthy();
+  expect(leftPannel[1].find('.nut-time-pannel--curr')).toBeTruthy();
 
   // current-time test
-  const rightPannel = wrapper.findAll('.nut-timedetail__detail__list__item');
+  const rightPannel = wrapper.findAll('.nut-time-detail__detail__list__item');
   await rightPannel[1].trigger('click');
-  expect(rightPannel[1].find('.nut-timedetail__detail__list__item--curr')).toBeTruthy();
+  expect(rightPannel[1].find('.nut-time-detail__detail__list__item--curr')).toBeTruthy();
 
   // timepannel name test
-  expect(wrapper.find('.nut-timepannel').html()).toContain('2月23日(今天)');
+  expect(wrapper.find('.nut-time-pannel').html()).toContain('2月23日(今天)');
 
   // timedetail times test, 2 月 24 日的取件时间有两个,长度应该为 2
-  expect(wrapper.findAll('.nut-timedetail__detail__list__item').length).toEqual(2);
+  expect(wrapper.findAll('.nut-time-detail__detail__list__item').length).toEqual(2);
 });
 
 test('Events test', async () => {
@@ -207,7 +207,7 @@ test('Events test', async () => {
 
   // event test
   await nextTick();
-  const timepannel = wrapper.find('.nut-timeselect__content__pannel').findAll('.nut-timepannel')[1];
+  const timepannel = wrapper.find('.nut-time-select__content__pannel').findAll('.nut-time-pannel')[1];
   await timepannel.trigger('click');
-  expect(timepannel.classes()).toContain('nut-timepannel--curr');
+  expect(timepannel.classes()).toContain('nut-time-pannel--curr');
 });

+ 2 - 2
src/packages/__VUE/timeselect/index.scss

@@ -1,5 +1,5 @@
 .nut-theme-dark {
-  .nut-timeselect {
+  .nut-time-select {
     background-color: $dark-background2;
     &__title {
       background-color: $dark-background2;
@@ -16,7 +16,7 @@
     }
   }
 }
-.nut-timeselect {
+.nut-time-select {
   width: 100%;
   height: 100%;
   position: relative;

+ 6 - 6
src/packages/__VUE/timeselect/index.taro.vue

@@ -10,17 +10,17 @@
     @click-close-icon="close"
   >
     <view :class="classes">
-      <view class="nut-timeselect__title">
-        <view class="nut-timeselect__title__fixed">
+      <view class="nut-time-select__title">
+        <view class="nut-time-select__title__fixed">
           <span v-if="!$slots.title">{{ title || translate('pickupTime') }}</span>
           <slot name="title" v-else></slot>
         </view>
       </view>
-      <view class="nut-timeselect__content">
-        <view class="nut-timeselect__content__pannel">
+      <view class="nut-time-select__content">
+        <view class="nut-time-select__content__pannel">
           <slot name="pannel"></slot>
         </view>
-        <view class="nut-timeselect__content__detail">
+        <view class="nut-time-select__content__detail">
           <slot name="detail"></slot>
         </view>
       </view>
@@ -67,7 +67,7 @@ export default create({
   emits: ['update:visible', 'select'],
   setup: (props: any, context: any) => {
     const classes = computed(() => {
-      const prefixCls = 'nut-timeselect';
+      const prefixCls = componentName;
       return {
         [prefixCls]: true
       };

+ 6 - 6
src/packages/__VUE/timeselect/index.vue

@@ -11,17 +11,17 @@
     @click-close-icon="close"
   >
     <view :class="classes">
-      <view class="nut-timeselect__title">
-        <view class="nut-timeselect__title__fixed">
+      <view class="nut-time-select__title">
+        <view class="nut-time-select__title__fixed">
           <span v-if="!$slots.title">{{ title || translate('pickupTime') }}</span>
           <slot name="title" v-else></slot>
         </view>
       </view>
-      <view class="nut-timeselect__content">
-        <view class="nut-timeselect__content__pannel">
+      <view class="nut-time-select__content">
+        <view class="nut-time-select__content__pannel">
           <slot name="pannel"></slot>
         </view>
-        <view class="nut-timeselect__content__detail">
+        <view class="nut-time-select__content__detail">
           <slot name="detail"></slot>
         </view>
       </view>
@@ -68,7 +68,7 @@ export default create({
   emits: ['update:visible', 'select'],
   setup: (props: any, context: any) => {
     const classes = computed(() => {
-      const prefixCls = 'nut-timeselect';
+      const prefixCls = componentName;
       return {
         [prefixCls]: true
       };