Browse Source

chore(fixed-nav): rname edit, use icons-vue

richard1015 3 years ago
parent
commit
8e95c6874b

+ 3 - 3
src/packages/__VUE/fixednav/common.ts

@@ -1,6 +1,6 @@
 import { computed, PropType, ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
-const { componentName, translate } = createComponent('fixednav');
+const { componentName, translate } = createComponent('fixed-nav');
 export const component = (components: any) => {
   return {
     components,
@@ -47,7 +47,7 @@ export const component = (components: any) => {
 
     setup(props: any, { emit }: any) {
       const classes = computed(() => {
-        const prefixCls = componentName;
+        const prefixCls = 'nut-fixednav';
         return {
           [prefixCls]: true,
           active: props.visible,
@@ -71,4 +71,4 @@ export const component = (components: any) => {
       return { classes, updateValue, selected, translate, current };
     }
   };
-}
+};

+ 6 - 6
src/packages/__VUE/fixednav/demo.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="demo">
-    <nut-fixednav
+    <nut-fixed-nav
       :active-text="translate('basic')"
       :position="{ top: '70px' }"
       v-model:visible="visible"
       :nav-list="navList"
       @selected="selected"
     />
-    <nut-fixednav
+    <nut-fixed-nav
       type="left"
       :position="{ top: '140px' }"
       v-model:visible="visible1"
@@ -16,14 +16,14 @@
       :nav-list="navList"
       @selected="selected"
     />
-    <nut-fixednav
+    <nut-fixed-nav
       :position="{ top: '210px' }"
       :overlay="false"
       v-model:visible="visible2"
       :nav-list="navList"
       @selected="selected"
     />
-    <nut-fixednav :position="{ top: '280px' }" type="left" v-model:visible="myActive" @selected="selected">
+    <nut-fixed-nav :position="{ top: '280px' }" type="left" v-model:visible="myActive" @selected="selected">
       <template v-slot:list>
         <ul class="nut-fixednav__list">
           <li class="nut-fixednav__list-item">1</li>
@@ -37,11 +37,11 @@
         <nut-icon name="retweet" color="#fff"> </nut-icon>
         <span class="text">{{ myActive ? translate('cus1') : translate('cus2') }}</span>
       </template>
-    </nut-fixednav>
+    </nut-fixed-nav>
 
     <!-- 配合 Drag 支持拖拽 ,小程序暂不支持 -->
     <nut-drag direction="y" :style="{ right: '0px', bottom: '240px' }">
-      <nut-fixednav
+      <nut-fixed-nav
         :un-active-text="translate('drag')"
         v-model:visible="visible3"
         :nav-list="navList"

+ 6 - 6
src/packages/__VUE/fixednav/doc.en-US.md

@@ -25,7 +25,7 @@ app.use(Overlay);
 :::demo
 ```html
 <template>
-  <nut-fixednav :position="{top:'70px' }" v-model:visible="visible" :nav-list="navList" />
+  <nut-fixed-nav :position="{top:'70px' }" v-model:visible="visible" :nav-list="navList" />
 </template>
 <script lang="ts">
 import { ref,reactive } from 'vue';
@@ -68,21 +68,21 @@ export default {
 ### Left effect
 
 ``` html
-<nut-fixednav type="left" :position="{top:'140px' }" v-model:visible="visible" :nav-list="navList" />
+<nut-fixed-nav type="left" :position="{top:'140px' }" v-model:visible="visible" :nav-list="navList" />
 ```
 
 
 ### Unmask background
 
 ``` html
-<nut-fixednav :overlay="false"  :position="{top:'210px' }" v-model:visible="visible" :nav-list="navList" />
+<nut-fixed-nav :overlay="false"  :position="{top:'210px' }" v-model:visible="visible" :nav-list="navList" />
 ```
 
 ### Support drag and drop with drag
 
 ``` html
 <nut-drag direction="y" :style="{right:'0px',bottom:'240px'}">
-  <nut-fixednav un-active-text="drag" v-model:visible="visible" :nav-list="navList" />
+  <nut-fixed-nav un-active-text="drag" v-model:visible="visible" :nav-list="navList" />
 </nut-drag>
 ```
 
@@ -91,7 +91,7 @@ export default {
 :::demo
 ```html
 <template>
-<nut-fixednav :position="{top:'280px' }" type="left" v-model:visible="myActive">
+<nut-fixed-nav :position="{top:'280px' }" type="left" v-model:visible="myActive">
     <template v-slot:list>
         <ul class="nut-fixednav__list">
             <li class="nut-fixednav__list-item">1</li>
@@ -106,7 +106,7 @@ export default {
     </nut-icon>
     <span class="text">{{ myActive ? 'Open' : 'Close' }}</span>
 </template>
-</nut-fixednav>
+</nut-fixed-nav>
 </template>
 <script lang="ts">
 import { ref,reactive } from 'vue';

+ 6 - 6
src/packages/__VUE/fixednav/doc.md

@@ -25,7 +25,7 @@ app.use(Overlay);
 :::demo
 ```html
 <template>
-  <nut-fixednav :position="{top:'70px' }" v-model:visible="visible" :nav-list="navList" />
+  <nut-fixed-nav :position="{top:'70px' }" v-model:visible="visible" :nav-list="navList" />
 </template>
 <script lang="ts">
 import { ref,reactive } from 'vue';
@@ -68,21 +68,21 @@ export default {
 ### 左侧效果
 
 ``` html
-<nut-fixednav type="left" :position="{top:'140px' }" v-model:visible="visible" :nav-list="navList" />
+<nut-fixed-nav type="left" :position="{top:'140px' }" v-model:visible="visible" :nav-list="navList" />
 ```
 
 
 ### 取消背景遮罩
 
 ``` html
-<nut-fixednav :overlay="false"  :position="{top:'210px' }" v-model:visible="visible" :nav-list="navList" />
+<nut-fixed-nav :overlay="false"  :position="{top:'210px' }" v-model:visible="visible" :nav-list="navList" />
 ```
 
 ### 配合 Drag 支持拖拽 , 小程序暂不支持
 
 ``` html
 <nut-drag direction="y" :style="{right:'0px',bottom:'240px'}">
-  <nut-fixednav un-active-text="支持拖拽" v-model:visible="visible" :nav-list="navList" />
+  <nut-fixed-nav un-active-text="支持拖拽" v-model:visible="visible" :nav-list="navList" />
 </nut-drag>
 ```
 
@@ -91,7 +91,7 @@ export default {
 :::demo
 ```html
 <template>
-<nut-fixednav :position="{top:'280px' }" type="left" v-model:visible="myActive">
+<nut-fixed-nav :position="{top:'280px' }" type="left" v-model:visible="myActive">
     <template v-slot:list>
         <ul class="nut-fixednav__list">
             <li class="nut-fixednav__list-item">1</li>
@@ -106,7 +106,7 @@ export default {
     </nut-icon>
     <span class="text">{{ myActive ? '自定义开' : '自定义关' }}</span>
 </template>
-</nut-fixednav>
+</nut-fixed-nav>
 </template>
 <script lang="ts">
 import { ref,reactive } from 'vue';

+ 8 - 4
src/packages/__VUE/fixednav/index.taro.vue

@@ -3,8 +3,12 @@
 import { createComponent } from '@/packages/utils/create';
 import { component } from './common';
 import OverLay from '../overlay/index.taro.vue';
-const { create } = createComponent('fixednav');
-export default create(component({
-  [OverLay.name]: OverLay
-}));
+const { create } = createComponent('fixed-nav');
+import { Left } from '@nutui/icons-vue';
+export default create(
+  component({
+    [OverLay.name]: OverLay,
+    Left
+  })
+);
 </script>

+ 8 - 4
src/packages/__VUE/fixednav/index.vue

@@ -3,8 +3,12 @@
 import { createComponent } from '@/packages/utils/create';
 import { component } from './common';
 import OverLay from '../overlay/index.vue';
-const { create } = createComponent('fixednav');
-export default create(component({
-  [OverLay.name]: OverLay
-}));
+const { create } = createComponent('fixed-nav');
+import { Left } from '@nutui/icons-vue';
+export default create(
+  component({
+    [OverLay.name]: OverLay,
+    Left
+  })
+);
 </script>

+ 1 - 1
src/packages/__VUE/fixednav/template.html

@@ -12,7 +12,7 @@
     </slot>
     <div class="nut-fixednav__btn" @click="updateValue()">
         <slot name="btn">
-            <nut-icon name="left" color="#fff" />
+            <Left color="#fff" />
             <view class="text">{{ visible ? activeText || translate('activeText') : unActiveText ||
                 translate('unActiveText') }}
             </view>