Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

docs: 文档修改 #2040

Merged
merged 4 commits into from
Jan 11, 2023
Merged

docs: 文档修改 #2040

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
63a97cc
feat: tour更新
yangxiaolu1993 Jan 11, 2023
88ec556
Merge branch 'jdf2e:v4' into v4
yangxiaolu1993 Jan 11, 2023
0734bc6
Merge branch 'jdf2e:v4' into v4
yangxiaolu1993 Jan 11, 2023
ed5b3bd
feat: 文档修改
yangxiaolu1993 Jan 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/packages/__VUE/comment/doc.taro.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ app.use(Comment);
>
<template #comment-labels>
<img
class="nut-comment-header__labels--item"
style="height:15px;width:50px"
src="https://img11.360buyimg.com/imagetools/jfs/t1/211858/17/4258/12101/618e6f78Ed0edcadc/e83a673555edf59f.jpg"
/>
</template>
Expand Down
1 change: 0 additions & 1 deletion src/packages/__VUE/noticebar/demo.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -157,7 +157,6 @@ export default createDemo({
padding-bottom: 30px !important;

.interstroll-list {
padding: 0 10px;
background: rgba(251, 248, 220, 1);
color: #d9500b;
}
Expand Down
10 changes: 4 additions & 6 deletions src/packages/__VUE/noticebar/doc.en-US.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -223,7 +223,7 @@ When text is long, you can enable multi-line display by setting the wrapable pro
| direction | Rolling direction | string | `across` |
| text | Notice text content | string | - |
| close-mode | Whether to enable the off mode | boolean | `false` |
| left-icon | Left Icon | string | - |
| left-icon | Show left Icon | boolean, Scroll direction 'across' takes effect | `true` |
| color | Text Color | string | - |
| background | Background | string | - |
| delay | Delay time | string \| number | `1` |
Expand All @@ -248,7 +248,7 @@ When text is long, you can enable multi-line display by setting the wrapable pro
|-------------------|----------------------------------|
| default | Notice text content |
| right-icon | Custom right icon |
| left-icon | Custom left icon |
| left-icon | Custom left icon, Scroll direction 'across' takes effect |

### Events

Expand All @@ -268,10 +268,8 @@ The component provides the following CSS variables, which can be used to customi
| --nut-noticebar-background| _rgba(251, 248, 220, 1)_ |
| --nut-noticebar-color| _#d9500b_ |
| --nut-noticebar-font-size| _14px_ |
| --nut-noticebar-height| _40px_ |
| --nut-noticebar-line-height| _24px_ |
| --nut-noticebar-left-icon-width| _16px_ |
| --nut-noticebar-right-icon-width| _16px_ |
| --nut-noticebar-across-height| _40px_ |
| --nut-noticebar-across-line-height| _24px_ |
| --nut-noticebar-box-padding| _0 16px_ |
| --nut-noticebar-wrapable-padding| _16px_ |
| --nut-noticebar-lefticon-margin| _0px 10px_ |
Expand Down
10 changes: 4 additions & 6 deletions src/packages/__VUE/noticebar/doc.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,7 @@ app.use(Noticebar);
| direction | 滚动的方向，可选 `across`、`vertical` | string | `across` |
| text | 提示的信息 | string | - |
| close-mode | 是否启用关闭模式 | boolean | `false` |
| left-icon | `close` 为没有左边 `icon`,其他为自定义的图片链接，没有为默认图片 | string | - |
| left-icon | 是否展示左侧图标, 滚动方向为 `across` 生效 | boolean | `true` |
| color | 导航栏的文字颜色 | string | - |
| background | 导航栏的背景颜色 | string | - |
| delay | 延时多少秒 | string \| number | `1` |
Expand All @@ -250,7 +250,7 @@ app.use(Noticebar);
|--------------|----------------------------------|
| default | 通知文本的内容 |
| right-icon | 自定义右侧图标 |
| left-icon | 自定义左侧图标 |
| left-icon | 自定义左侧图标, 滚动方向为 `across` 生效 |
### Events

| 事件名 | 说明 | 回调参数 |
Expand All @@ -269,10 +269,8 @@ app.use(Noticebar);
| --nut-noticebar-background| _rgba(251, 248, 220, 1)_ |
| --nut-noticebar-color| _#d9500b_ |
| --nut-noticebar-font-size| _14px_ |
| --nut-noticebar-height| _40px_ |
| --nut-noticebar-line-height| _24px_ |
| --nut-noticebar-left-icon-width| _16px_ |
| --nut-noticebar-right-icon-width| _16px_ |
| --nut-noticebar-across-height| _40px_ |
| --nut-noticebar-across-line-height| _24px_ |
| --nut-noticebar-box-padding| _0 16px_ |
| --nut-noticebar-wrapable-padding| _16px_ |
| --nut-noticebar-lefticon-margin| _0px 10px_ |
Expand Down
12 changes: 5 additions & 7 deletions src/packages/__VUE/noticebar/doc.taro.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,7 @@ app.use(Noticebar);
| direction | 滚动的方向，可选 `across`、`vertical ` | string | `across` |
| text | 提示的信息 | string | - |
| close-mode | 是否启用关闭模式 | boolean | `false` |
| left-icon | `close` 为没有左边 `icon` ,其他为自定义的图片链接，没有为默认图片 | string | - |
| left-icon | 是否展示左侧图标, 滚动方向为 `across` 生效 | boolean | `true` |
| color | 导航栏的文字颜色 | string | - |
| background | 导航栏的背景颜色 | string | - |
| delay | 延时多少秒 | string \| number | `1` |
Expand All @@ -238,7 +238,7 @@ app.use(Noticebar);
| 参数 | 说明 | 类型 | 默认值 |
|--------------|----------------------------------|--------|------------------|
| list | 纵向滚动数据列表 | array | `[]` |
| speed | 滚动的速度 | `number` | `50` |
| speed | 滚动的速度 | number | `50` |
| stand-time | 停留时间(毫秒) | number | `1000` |
| complex-am | 稍复杂的动画，耗能会高 | boolean | `false` |
| height | 每一个滚动列的高度(px)，注意：在使用 slot 插槽定义滚动单元时，按照实际高度修改此值 | number | `40` |
Expand All @@ -250,7 +250,7 @@ app.use(Noticebar);
|--------------|----------------------------------|
| default | 通知文本的内容 |
| right-icon | 自定义右侧图标 |
| left-icon | 自定义左侧图标 |
| left-icon | 自定义左侧图标, 滚动方向为 `across` 生效 |
### Events

| 事件名 | 说明 | 回调参数 |
Expand All @@ -270,10 +270,8 @@ app.use(Noticebar);
| --nut-noticebar-background| _rgba(251, 248, 220, 1)_ |
| --nut-noticebar-color| _#d9500b_ |
| --nut-noticebar-font-size| _14px_ |
| --nut-noticebar-height| _40px_ |
| --nut-noticebar-line-height| _24px_ |
| --nut-noticebar-left-icon-width| _16px_ |
| --nut-noticebar-right-icon-width| _16px_ |
| --nut-noticebar-across-height| _40px_ |
| --nut-noticebar-across-line-height| _24px_ |
| --nut-noticebar-box-padding| _0 16px_ |
| --nut-noticebar-wrapable-padding| _16px_ |
| --nut-noticebar-lefticon-margin| _0px 10px_ |
Expand Down
18 changes: 9 additions & 9 deletions src/packages/__VUE/noticebar/index.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
.nut-noticebar__page {
display: flex;
padding: $noticebar-box-padding;
height: $noticebar-height;
height: $noticebar-across-height;
font-size: $noticebar-font-size;
position: relative;
align-items: center;
Expand All @@ -39,23 +39,20 @@
.nut-noticebar__page-lefticon {
display: flex;
align-items: center;
height: $noticebar-left-icon-width;
min-width: $noticebar-left-icon-width;
margin: $noticebar-lefticon-margin;
background-size: 100% 100%;
}
.nut-noticebar__page-righticon {
display: flex;
align-items: center;
justify-content: center;
width: $noticebar-right-icon-width;
margin: $noticebar-righticon-margin;
}
.nut-noticebar__page-wrap {
display: flex;
flex: 1;
height: $noticebar-line-height;
line-height: $noticebar-line-height;
height: $noticebar-across-line-height;
line-height: $noticebar-across-line-height;
overflow: hidden;
position: relative;
}
Expand Down Expand Up @@ -96,7 +93,7 @@
// 垂直方向的滚动
@keyframes nut-notice-bar-play-vertical {
to {
transform: translateY($noticebar-height);
transform: translateY($noticebar-across-height);
}
}

Expand All @@ -105,10 +102,12 @@
position: relative;
display: flex;
justify-content: space-between;
height: $noticebar-height;
height: $noticebar-across-height;
font-size: $noticebar-font-size;
overflow: hidden;
padding: $noticebar-box-padding;
background: $noticebar-background;
color: $noticebar-color;

.nut-noticebar__vertical-list {
margin: 0;
Expand All @@ -118,11 +117,12 @@
.nut-noticebar__vertical-item {
display: flex;
align-items: center;
height: $noticebar-height;
height: $noticebar-across-height;
}
}

.go {
margin: $noticebar-righticon-margin;
align-self: center;
display: flex;
}
Expand Down
10 changes: 7 additions & 3 deletions src/packages/__VUE/noticebar/index.taro.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,9 @@
v-if="direction == 'across'"
>
<view class="nut-noticebar__page-lefticon">
<slot name="left-icon" v-if="$slots['left-icon']"> </slot>
<component :is="renderIcon(leftIcon)" v-else></component>
<slot name="left-icon">
<Notice v-if="leftIcon" size="16px"></Notice>
</slot>
</view>
<view ref="wrap" :class="`nut-noticebar__page-wrap wrap${id}`">
<view
Expand Down Expand Up @@ -131,7 +132,10 @@ export default create({
type: Boolean,
default: false
},
leftIcon: { type: Object || String, default: () => Notice },
leftIcon: {
type: Boolean,
default: true
},
color: {
type: String,
default: '#F9911B'
Expand Down
12 changes: 6 additions & 6 deletions src/packages/__VUE/noticebar/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,9 @@
v-if="direction == 'across'"
>
<view class="nut-noticebar__page-lefticon">
<slot name="left-icon" v-if="$slots['left-icon']"> </slot>
<component :is="renderIcon(leftIcon)" v-else></component>
<slot name="left-icon">
<Notice size="16px" v-if="leftIcon"></Notice>
</slot>
</view>
<view ref="wrap" class="nut-noticebar__page-wrap">
<view
Expand Down Expand Up @@ -85,7 +86,7 @@ import {
Slots
} from 'vue';
import { Notice, CircleClose } from '@nutui/icons-vue';
import { createComponent, renderIcon } from '@/packages/utils/create';
import { createComponent } from '@/packages/utils/create';
const { componentName, create } = createComponent('noticebar');
import { pxCheck } from '@/packages/utils/pxCheck';

Expand Down Expand Up @@ -141,7 +142,7 @@ export default create({
type: Boolean,
default: false
},
leftIcon: { type: Object || String, default: () => Notice },
leftIcon: { type: Boolean, default: true },
color: {
type: String,
default: ''
Expand Down Expand Up @@ -410,8 +411,7 @@ export default create({
handleClickIcon,
slots,
pxCheck,
wrapContentClass,
renderIcon
wrapContentClass
};
}
});
Expand Down
6 changes: 2 additions & 4 deletions src/packages/styles/variables-jdb.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -532,10 +532,8 @@ $fixednav-item-active-color: $primary-color !default;
$noticebar-background: rgba(251, 248, 220, 1) !default;
$noticebar-color: #d9500b !default;
$noticebar-font-size: 14px !default;
$noticebar-height: 40px !default;
$noticebar-line-height: 24px !default;
$noticebar-left-icon-width: 16px !default;
$noticebar-right-icon-width: 16px !default;
$noticebar-across-height: 40px !default;
$noticebar-across-line-height: 24px !default;
$noticebar-box-padding: 0 16px !default;
$noticebar-wrapable-padding: 16px !default;
$noticebar-lefticon-margin: 0px 10px !default;
Expand Down
6 changes: 2 additions & 4 deletions src/packages/styles/variables-jddkh.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -464,10 +464,8 @@ $fixednav-item-active-color: $primary-color !default;
$noticebar-background: rgba(255, 252, 217, 1) !default;
$noticebar-color: #d9500b !default;
$noticebar-font-size: $font-size-1 !default;
$noticebar-height: 40px !default;
$noticebar-line-height: 24px !default;
$noticebar-left-icon-width: 12px !default;
$noticebar-right-icon-width: 10px !default;
$noticebar-across-height: 40px !default;
$noticebar-across-line-height: 24px !default;
$noticebar-box-padding: 0 12px !default;
$noticebar-wrapable-padding: 16px !default;
$noticebar-lefticon-margin: 0 6px 0 0 !default;
Expand Down
6 changes: 2 additions & 4 deletions src/packages/styles/variables-jdt.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -472,10 +472,8 @@ $fixednav-item-active-color: var(--nut-fixednav-item-active-color, $primary-colo
$noticebar-background: var(--nut-noticebar-background, #f2f8ff) !default;
$noticebar-color: var(--nut-noticebar-color, #2c68ff) !default;
$noticebar-font-size: var(--nut-noticebar-font-size, 14px) !default;
$noticebar-height: var(--nut-noticebar-height, 40px) !default;
$noticebar-line-height: var(--nut-noticebar-line-height, 24px) !default;
$noticebar-left-icon-width: var(--nut-noticebar-left-icon-width, 16px) !default;
$noticebar-right-icon-width: var(--nut-noticebar-right-icon-width, 16px) !default;
$noticebar-across-height: var(--nut-noticebar-across-height, 40px) !default;
$noticebar-across-line-height: var(--nut-noticebar-across-line-height, 24px) !default;
$noticebar-box-padding: var(--nut-noticebar-box-padding, 0 16px) !default;
$noticebar-wrapable-padding: var(--nut-noticebar-wrapable-padding, 16px) !default;
$noticebar-lefticon-margin: var(--nut-noticebar-lefticon-margin, 0px 10px) !default;
Expand Down
6 changes: 2 additions & 4 deletions src/packages/styles/variables.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -510,10 +510,8 @@ $fixednav-item-active-color: var(--nut-fixednav-item-active-color, $primary-colo
$noticebar-background: var(--nut-noticebar-background, rgba(251, 248, 220, 1)) !default;
$noticebar-color: var(--nut-noticebar-color, #d9500b) !default;
$noticebar-font-size: var(--nut-noticebar-font-size, 14px) !default;
$noticebar-height: var(--nut-noticebar-height, 40px) !default;
$noticebar-line-height: var(--nut-noticebar-line-height, 24px) !default;
$noticebar-left-icon-width: var(--nut-noticebar-left-icon-width, 16px) !default;
$noticebar-right-icon-width: var(--nut-noticebar-right-icon-width, 16px) !default;
$noticebar-across-height: var(--nut-noticebar-across-height, 40px) !default;
$noticebar-across-line-height: var(--nut-noticebar-across-line-height, 24px) !default;
$noticebar-box-padding: var(--nut-noticebar-box-padding, 0 16px) !default;
$noticebar-wrapable-padding: var(--nut-noticebar-wrapable-padding, 16px) !default;
$noticebar-lefticon-margin: var(--nut-noticebar-lefticon-margin, 0px 10px) !default;
Expand Down
35 changes: 33 additions & 2 deletions src/sites/mobile-taro/vue/src/business/pages/address/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,19 @@
:default-icon="defaultIcon"
:selected-icon="selectedIcon"
:close-btn-icon="closeBtnIcon"
></nut-address>
>
<template #unselectedIcon>
<Heart1 style="margin-right: 8px"></Heart1>
</template>
<template #icon>
<HeartFill style="margin-right: 8px" color="#f00"></HeartFill>
</template>
<template #bottom>
<div class="nut-address-custom-buttom">
<div class="btn">自定义按钮</div>
</div>
</template>
</nut-address>

<h2>自定义地址与已有地址切换</h2>
<nut-cell title="选择地址" :desc="four" is-link @click="showAddressOther"></nut-cell>
Expand All @@ -99,6 +111,7 @@
import { reactive, ref, toRefs, defineComponent } from 'vue';
import Taro from '@tarojs/taro';
import Header from '../../../components/header.vue';
import { HeartFill, Heart1, Close } from '@nutui/icons-vue-taro';
interface CalBack {
next: string;
value: string;
Expand Down Expand Up @@ -130,7 +143,7 @@ interface AddressResult extends AddressList {
town: RegionData[];
}
export default defineComponent({
components: { Header },
components: { Header, HeartFill, Heart1, Close },
setup() {
const env = Taro.getEnv();
const address = reactive({
Expand Down Expand Up @@ -354,5 +367,23 @@ export default defineComponent({
margin-right: 8px;
}
}

.nut-address-custom-buttom {
width: 100%;
height: 54px;
padding: 6px 0px 0;
border-top: 1px solid #f2f2f2;
.btn {
width: 90%;
height: 42px;
line-height: 42px;
margin: auto;
text-align: center;
background: $button-primary-background-color;
border-radius: 21px;
font-size: 15px;
color: $white;
}
}
}
</style>