@tplc/business 0.0.17 → 0.0.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,30 +1,32 @@
1
1
  <template>
2
- <lcb-block
3
- v-bind="{
4
- marginTop,
5
- marginBottom,
6
- }"
7
- >
8
- <wd-swiper
9
- value-key="url"
2
+ <view class="lcb-banner">
3
+ <lcb-block
10
4
  v-bind="{
11
- list: items,
12
- loop,
13
- height: transformValueUnit(height),
14
- radius: transformValueUnit(radius),
15
- autoplay: Boolean(interval),
16
- direction,
17
- itemPadding,
18
- imageRadius: transformValueUnit(imageRadius),
19
- indicatorPosition,
20
- displayMultipleItems,
21
- customNextImageClass,
22
- interval,
23
- indicator: indicator ? { type: indicator } : false,
24
- ...supplementProps,
5
+ marginTop,
6
+ marginBottom,
25
7
  }"
26
- />
27
- </lcb-block>
8
+ >
9
+ <wd-swiper
10
+ value-key="url"
11
+ v-bind="{
12
+ list: items,
13
+ loop,
14
+ height: transformValueUnit(height),
15
+ imgWidth: imgWidth && transformValueUnit(imgWidth),
16
+ radius: transformValueUnit(radius),
17
+ autoplay: Boolean(interval),
18
+ direction,
19
+ imageRadius: transformValueUnit(imageRadius),
20
+ indicatorPosition,
21
+ displayMultipleItems,
22
+ customNextImageClass,
23
+ interval,
24
+ indicator: indicator ? { type: indicator } : false,
25
+ ...supplementProps,
26
+ }"
27
+ />
28
+ </lcb-block>
29
+ </view>
28
30
  </template>
29
31
 
30
32
  <script setup lang="ts">
@@ -49,13 +51,21 @@ const supplementProps = computed(() => {
49
51
  return {
50
52
  nextMargin: transformValueUnit(props.previousMargin ?? 24),
51
53
  previousMargin: transformValueUnit(props.previousMargin ?? 24),
52
- itemPadding: `0px ${transformValueUnit(props.itemPadding ?? 10)}`,
53
- imageRadius: transformValueUnit(props.imageRadius ?? 12),
54
- customPrevImageHeight: props.slidingStyle === 2 ? (props.height ?? 24) * 0.8 : undefined,
55
- customNextImageHeight: props.slidingStyle === 2 ? (props.height ?? 24) * 0.8 : undefined,
54
+ itemPadding: `${transformValueUnit(props.itemPadding ?? 10)}`,
55
+ customPrevImageHeight:
56
+ props.slidingStyle === 2 ? transformValueUnit((props.height ?? 24) * 0.9) : undefined,
57
+ customNextImageHeight:
58
+ props.slidingStyle === 2 ? transformValueUnit((props.height ?? 24) * 0.9) : undefined,
59
+ customImageClass: 'card-shadow',
56
60
  } as any
57
61
  }
58
62
  return {}
59
63
  })
60
64
  </script>
61
- <style lang="scss" scoped></style>
65
+ <style lang="scss" scoped>
66
+ .lcb-banner {
67
+ :deep(.card-shadow) {
68
+ box-shadow: 0px 4rpx 10rpx 0px rgba(51, 51, 51, 0.1);
69
+ }
70
+ }
71
+ </style>
@@ -1,4 +1,5 @@
1
1
  import { ActionView } from 'action'
2
+ import { CSSProperties } from 'vue'
2
3
 
3
4
  export interface LcbBannerProps {
4
5
  items?: Partial<ActionView>[]
@@ -14,6 +15,7 @@ export interface LcbBannerProps {
14
15
  duration?: number
15
16
  /** 轮播图高度 默认192 */
16
17
  height?: number
18
+ imgWidth?: number
17
19
  /** 轮播间隔时间 5000ms */
18
20
  interval?: number
19
21
  /** 是否循环播放 默认 true */
@@ -5,38 +5,54 @@
5
5
  marginTop,
6
6
  marginBottom,
7
7
  backgroundColor,
8
- marginLeft: 12,
9
- marginRight: 12,
8
+ marginLeft: 24,
9
+ marginRight: 24,
10
10
  paddingBottom: styleGroup === 2 ? 0 : 24,
11
11
  }"
12
12
  card
13
13
  >
14
- <view
15
- class="py-2 px-3 text-3.5 text-#333 flex justify-between items-center"
16
- v-if="styleGroup === 1"
17
- >
18
- <view class="flex-1 flex items-center">
19
- <wd-icon name="github-filled" size="30" />
20
- <view class="ml-3">
21
- <view class="text-#333 text-lg">{{ title }}</view>
22
- <view class="text-#999 text-sm">即刻成为开成尊享会员</view>
14
+ <view v-if="styleGroup === 1" class="pl-32rpx">
15
+ <view class="py-42rpx pr-26rpx flex justify-between items-center" v-if="styleGroup === 1">
16
+ <view class="flex-1 flex items-center">
17
+ <img :src="logo" class="w-60rpx h-60rpx" mode="aspectFit" />
18
+ <view class="ml-32rpx leading-none">
19
+ <view class="text-#000 text-28rpx font-500">{{ title }}</view>
20
+ <view class="text-#999 text-22rpx mt-2">{{ hint }}</view>
21
+ </view>
23
22
  </view>
23
+ <wd-icon class-prefix="iconfont" name="a-xingzhuang97" size="24rpx" color="#666666" />
24
24
  </view>
25
- <wd-icon name="arrow-right1" size="24" />
26
- </view>
27
- <lcb-banner
28
- v-bind="bannerProps"
29
- :items="items"
30
- :height="height"
31
- :interval="styleGroup === 1 ? undefined : 2000"
32
- />
33
- <view
34
- class="py-2 px-3 text-3.5 text-#333 flex justify-between items-center"
35
- v-if="styleGroup === 2"
36
- >
37
- <view>{{ title }}</view>
38
- <wd-icon name="arrow-right1" size="24" />
25
+ <scroll-view scroll-x class="w-full whitespace-nowrap">
26
+ <img
27
+ v-for="(item, index) in items"
28
+ :key="index"
29
+ :src="item.url"
30
+ class="inline-block"
31
+ :style="{
32
+ height: transformValueUnit(height),
33
+ width: transformValueUnit(imgWidth),
34
+ marginRight: transformValueUnit(itemPadding),
35
+ }"
36
+ />
37
+ </scroll-view>
39
38
  </view>
39
+ <template v-if="styleGroup === 2">
40
+ <lcb-banner
41
+ v-bind="{
42
+ ...bannerProps,
43
+ items,
44
+ height,
45
+ itemPadding,
46
+ imageRadius,
47
+ }"
48
+ :imgWidth="(imgWidth || 0) + (itemPadding || 0)"
49
+ :interval="2000"
50
+ />
51
+ <view class="p-24rpx text-30rpx text-#333 flex justify-between items-center">
52
+ <view>{{ title }}</view>
53
+ <wd-icon class-prefix="iconfont" name="a-xingzhuang103" size="30rpx" color="#666" />
54
+ </view>
55
+ </template>
40
56
  </lcb-block>
41
57
  </template>
42
58
 
@@ -44,6 +60,7 @@
44
60
  import { LcbBannerListProps } from './types'
45
61
  import { computed } from 'vue'
46
62
  import { LcbBannerProps } from '../lcb-banner/types'
63
+ import { transformValueUnit } from '../../utils/transform'
47
64
  defineOptions({
48
65
  name: 'LcbBannerBlock',
49
66
  options: {
@@ -53,7 +70,8 @@ defineOptions({
53
70
  },
54
71
  })
55
72
  const props = withDefaults(defineProps<LcbBannerListProps>(), {
56
- borderRadius: 12,
73
+ borderRadius: 16,
74
+ imageRadius: 0,
57
75
  backgroundColor: '#ffffff',
58
76
  })
59
77
  const bannerProps = computed(() => {
@@ -6,8 +6,13 @@ export interface LcbBannerListProps extends LcbBlockProps {
6
6
  styleGroup?: 1 | 2
7
7
  /** 轮播图高度 默认192 */
8
8
  height?: number
9
+ /** 轮播图宽度 */
10
+ imgWidth?: number
9
11
  title: string
10
12
  hint?: string
13
+ logo?: string
11
14
  rightIcon?: string
12
15
  leftIcon?: string
16
+ itemPadding?: number
17
+ imageRadius?: number
13
18
  }
@@ -50,6 +50,6 @@ withDefaults(defineProps<LcbBlockProps>(), {
50
50
  </script>
51
51
  <style lang="scss" scoped>
52
52
  .card {
53
- box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.1);
53
+ box-shadow: 0px 4rpx 10rpx 0px rgba(51, 51, 51, 0.1);
54
54
  }
55
55
  </style>
@@ -1,6 +1,18 @@
1
1
  <template>
2
- <view>
3
- <wd-slider hide-label :max="max" :min="min" v-model="innerValue" @dragend="onDragend" />
2
+ <view class="filter-slider">
3
+ <wd-slider
4
+ hide-label
5
+ :max="max"
6
+ :min="min"
7
+ :minText="`${unit}${min}`"
8
+ :maxText="`${unit}${max}+`"
9
+ v-model="innerValue"
10
+ @dragend="onDragend"
11
+ ref="slider"
12
+ custom-class="px-4"
13
+ custom-min-class="left-0 slider-text"
14
+ custom-max-class="right--2 slider-text"
15
+ />
4
16
  <view class="grid grid-cols-4 gap-4 mt-2">
5
17
  <SelectTagView
6
18
  v-for="item in options"
@@ -17,7 +29,8 @@
17
29
  <script setup lang="ts">
18
30
  import { FilterSliderProps } from './types'
19
31
  import SelectTagView from '../SelectTagView/index.vue'
20
- import { ref, watch } from 'vue'
32
+ import { onMounted, onUnmounted, ref, watch } from 'vue'
33
+ import type { SliderInstance } from '@tplc/wot/components/wd-slider/types'
21
34
  defineOptions({
22
35
  name: 'FilterSlider',
23
36
  options: {
@@ -26,6 +39,7 @@ defineOptions({
26
39
  styleIsolation: 'shared',
27
40
  },
28
41
  })
42
+ const slider = ref<SliderInstance>()
29
43
  const props = defineProps<FilterSliderProps>()
30
44
  const model = defineModel<number[]>()
31
45
  const innerValue = ref<number[]>()
@@ -38,6 +52,17 @@ const onItemClick = (value) => {
38
52
  }
39
53
  }
40
54
  }
55
+
56
+ const onDropOpened = () => {
57
+ slider.value?.initSlider()
58
+ }
59
+
60
+ onMounted(() => {
61
+ uni.$on('drop-opened', onDropOpened)
62
+ })
63
+ onUnmounted(() => {
64
+ uni.$off('drop-opened', onDropOpened)
65
+ })
41
66
  watch(
42
67
  () => model.value,
43
68
  (val) => {
@@ -67,4 +92,15 @@ const getChecked = (value) => {
67
92
  }
68
93
  }
69
94
  </script>
70
- <style lang="scss" scoped></style>
95
+ <style lang="scss">
96
+ .filter-slider {
97
+ position: relative;
98
+ padding-top: 24rpx;
99
+ :deep(.slider-text) {
100
+ color: #999 !important;
101
+ font-size: 24rpx !important;
102
+ position: absolute;
103
+ margin-bottom: 100rpx;
104
+ }
105
+ }
106
+ </style>
@@ -5,7 +5,7 @@
5
5
  <view
6
6
  v-for="(item, index) in options"
7
7
  :key="item.label"
8
- @click="currentCategory = index"
8
+ @click="onCategoryClick(index)"
9
9
  class="filter-select flex justify-between items-center"
10
10
  :class="currentCategory === index ? 'filter-select__choose' : ''"
11
11
  >
@@ -24,8 +24,15 @@
24
24
  <wd-icon name="check" custom-class="choose_icon" v-if="innerValue === item.value" />
25
25
  </view>
26
26
  </view>
27
- <view class="flex-1 w-0 bg-#FAFAFA pl-4 scroll-view" v-else>
28
- <view v-for="item in options" :key="item.label">
27
+ <scroll-view
28
+ scroll-y
29
+ :scroll-into-view="toView"
30
+ scroll-with-animation
31
+ class="flex-1 w-0 bg-#FAFAFA pl-4 scroll-view pt-32rpx"
32
+ @scroll="onGridScroll"
33
+ v-else
34
+ >
35
+ <view v-for="(item, index) in options" :key="item.label" :id="`grid_${index}`">
29
36
  <view class="filter-select__title">
30
37
  {{ item.label }}
31
38
  </view>
@@ -40,7 +47,7 @@
40
47
  />
41
48
  </view>
42
49
  </view>
43
- </view>
50
+ </scroll-view>
44
51
  </view>
45
52
  <ActionView
46
53
  :disabled="!Boolean(innerValue)"
@@ -51,7 +58,7 @@
51
58
  </template>
52
59
 
53
60
  <script setup lang="ts">
54
- import { computed, nextTick, ref } from 'vue'
61
+ import { computed, getCurrentInstance, nextTick, watch, ref } from 'vue'
55
62
  import { TreeSelectProps } from './type'
56
63
  import useSelect from '../../hooks/useSelect'
57
64
  import SelectTagView from '../SelectTagView/index.vue'
@@ -68,6 +75,8 @@ const props = defineProps<TreeSelectProps>()
68
75
  const model = defineModel<string | string[]>()
69
76
  const modelTitle = defineModel<string>('title')
70
77
  const innerValue = ref(model.value)
78
+ const toView = ref('')
79
+ const itemTopPositions = ref<{ top: number; bottom: number }[]>([])
71
80
  const emits = defineEmits(['submit'])
72
81
  const { onItemClick, options, getChecked } = useSelect(props, { model: innerValue })
73
82
  const currentCategory = ref(0)
@@ -91,6 +100,37 @@ const onSubmit = () => {
91
100
  emits('submit')
92
101
  })
93
102
  }
103
+ const onCategoryClick = (index: number) => {
104
+ currentCategory.value = index
105
+ toView.value = `grid_${index}`
106
+ }
107
+ const { proxy } = getCurrentInstance() as any
108
+ watch(
109
+ () => options.value,
110
+ () => {
111
+ nextTick(() => {
112
+ const query = uni.createSelectorQuery().in(proxy)
113
+ options.value.forEach((_, index) => {
114
+ query.select(`#grid_${index}`).boundingClientRect()
115
+ })
116
+ query.exec((res) => {
117
+ console.log(res)
118
+ itemTopPositions.value = res.map((rect) => ({ top: rect.top, bottom: rect.bottom }))
119
+ })
120
+ })
121
+ },
122
+ {
123
+ immediate: true,
124
+ },
125
+ )
126
+ const onGridScroll = (e) => {
127
+ const scrollTop = e.detail.scrollTop
128
+ itemTopPositions.value.forEach((pos, index) => {
129
+ if (pos.top <= scrollTop + 100) {
130
+ currentCategory.value = index
131
+ }
132
+ })
133
+ }
94
134
  </script>
95
135
  <style lang="scss" scoped>
96
136
  @import '@tplc/wot/components/common/abstracts/variable';
@@ -112,6 +152,9 @@ const onSubmit = () => {
112
152
  font-size: 30rpx;
113
153
  color: $-color-theme;
114
154
  margin-bottom: 30rpx;
155
+ &:first-child {
156
+ margin-top: 0;
157
+ }
115
158
  }
116
159
  &__choose {
117
160
  color: $-color-theme;
@@ -9,6 +9,7 @@
9
9
  icon-size="26px"
10
10
  :selected="getSelect(item)"
11
11
  ref="dropMenu"
12
+ @opened="handleOpened"
12
13
  >
13
14
  <view class="lcb-filter__popup">
14
15
  <FilterSelect
@@ -118,6 +119,9 @@ const getSelect = (item: FilterComponent) => {
118
119
  return Boolean(filter.value[item.valueName])
119
120
  }
120
121
  }
122
+ const handleOpened = () => {
123
+ uni.$emit('drop-opened')
124
+ }
121
125
  </script>
122
126
 
123
127
  <style lang="scss" scoped>
@@ -0,0 +1,23 @@
1
+ <template>
2
+ <wd-gap
3
+ :height="transformValueUnit(height)"
4
+ :safe-area-bottom="safeAreaBottom"
5
+ :bg-color="bgColor"
6
+ />
7
+ </template>
8
+
9
+ <script setup lang="ts">
10
+ import { LcbGapProps } from './types'
11
+ import { transformValueUnit } from '../../utils/transform'
12
+ defineOptions({
13
+ name: 'LcbGap',
14
+ options: {
15
+ addGlobalClass: true,
16
+ virtualHost: true,
17
+ styleIsolation: 'shared',
18
+ },
19
+ })
20
+ withDefaults(defineProps<LcbGapProps>(), {})
21
+ </script>
22
+
23
+ <style lang="scss" scoped></style>
@@ -0,0 +1,5 @@
1
+ export interface LcbGapProps {
2
+ height?: number
3
+ safeAreaBottom?: boolean
4
+ bgColor?: string
5
+ }
@@ -3,8 +3,8 @@
3
3
  v-bind="{
4
4
  marginTop,
5
5
  marginBottom,
6
- marginLeft: 12,
7
- marginRight: 12,
6
+ marginLeft: 24,
7
+ marginRight: 24,
8
8
  }"
9
9
  >
10
10
  <view
@@ -17,8 +17,8 @@
17
17
  v-for="(item, index) in items"
18
18
  :key="index"
19
19
  :src="item.url"
20
- :height="height"
21
- :radius="radius"
20
+ :height="transformValueUnit(height)"
21
+ :radius="transformValueUnit(radius)"
22
22
  mode="aspectFill"
23
23
  />
24
24
  </view>
@@ -27,6 +27,7 @@
27
27
 
28
28
  <script setup lang="ts">
29
29
  import { LcbGridProps } from './types'
30
+ import { transformValueUnit } from '../../utils/transform'
30
31
  defineOptions({
31
32
  name: 'LcbGrid',
32
33
  options: {
@@ -1,8 +1,8 @@
1
1
  <template>
2
2
  <lcb-block
3
- :marginLeft="12"
4
- :marginRight="12"
5
- :radius="12"
3
+ :marginLeft="24"
4
+ :marginRight="24"
5
+ :radius="16"
6
6
  backgroundColor="#fff"
7
7
  :marginTop="-(marginTop || 0)"
8
8
  >
@@ -19,19 +19,21 @@
19
19
  {{ item }}
20
20
  </view>
21
21
  </view>
22
- <view class="box-border px-3">
23
- <view class="flex items-center justify-center mt-3 text-#333 gap-2">
24
- <view class="text-4">义乌</view>
25
- <wd-icon name="chevron-down-circle" size="22px"></wd-icon>
26
- <view class="h-24px w-1rpx bg-#f4f4f4"></view>
27
- <view class="text-#999 text-4">位置|酒店|关键词</view>
22
+ <view class="box-border px-3 leading-none">
23
+ <view class="flex items-center justify-center mt-3 text-#333 gap-16rpx">
24
+ <view class="text-30rpx font-bold">义乌</view>
25
+ <wd-icon name="chevron-down-circle" size="30rpx"></wd-icon>
26
+ <view class="h-42rpx w-1px bg-#F1F1F1"></view>
27
+ <view class="text-#999 text-28rpx">{{ placeholder }}</view>
28
28
  <view class="flex-1"></view>
29
29
  <view class="justify-center flex flex-col items-center">
30
- <view><wd-icon name="play-circle-stroke" size="22px"></wd-icon></view>
31
- <view>当前位置</view>
30
+ <view>
31
+ <wd-icon name="play-circle-stroke" size="30rpx"></wd-icon>
32
+ </view>
33
+ <view class="text-26rpx text-#333 mt-12rpx">当前位置</view>
32
34
  </view>
33
35
  </view>
34
- <view class="w-full h-1rpx bg-#f4f4f4 my-3"></view>
36
+ <view class="w-full h-1px bg-#F1F1F1 mt-26rpx mb-44rpx"></view>
35
37
  <view class="flex items-center">
36
38
  <view class="title">6月12日</view>
37
39
  <view class="hint ml-1">今天入住</view>
@@ -40,14 +42,27 @@
40
42
  <view class="hint ml-1 flex-1">明天离店</view>
41
43
  <view class="tag">共1晚</view>
42
44
  </view>
43
- <wd-button type="primary" customClass="!w-full my-5" size="large">搜索酒店</wd-button>
44
- <view></view>
45
+ <wd-button type="primary" customClass="!w-full my-42rpx" size="large">搜索酒店</wd-button>
46
+ <view
47
+ class="px-50rpx flex justify-between items-center mb-42rpx text-#000 text-28rpx"
48
+ v-if="items?.length"
49
+ >
50
+ <view
51
+ v-for="item in items"
52
+ :key="item.title"
53
+ class="flex justify-center items-center gap-16rpx"
54
+ >
55
+ <img :src="item.url" class="w-36rpx h-36rpx" />
56
+ {{ item.title }}
57
+ </view>
58
+ </view>
45
59
  </view>
46
60
  </lcb-block>
47
61
  </template>
48
62
 
49
63
  <script setup lang="ts">
50
64
  import { ref } from 'vue'
65
+ import { LcbHomeSearch } from './types'
51
66
 
52
67
  defineOptions({
53
68
  name: 'LcbHomeSearch',
@@ -58,7 +73,7 @@ defineOptions({
58
73
  },
59
74
  })
60
75
 
61
- defineProps<{ marginTop?: number }>()
76
+ withDefaults(defineProps<LcbHomeSearch>(), { placeholder: '位置|酒店|关键词' })
62
77
  const tabs = ['全部', '酒店', '民宿']
63
78
  const current = ref(0)
64
79
  </script>
@@ -66,29 +81,29 @@ const current = ref(0)
66
81
  .search-tab {
67
82
  flex: 1;
68
83
  text-align: center;
69
- font-size: 32rpx;
70
- padding: 16rpx 0;
84
+ font-size: 30rpx;
85
+ padding: 24rpx 0;
71
86
  color: #999;
72
87
  }
73
88
  .active {
74
89
  background-color: #fff;
75
- color: #333;
90
+ color: #000;
76
91
  font-weight: bold;
77
92
  }
78
93
  .title {
79
- font-weight: 600;
80
- font-size: 30rpx;
81
- color: #333;
94
+ font-weight: bold;
95
+ font-size: 32rpx;
96
+ color: #000;
82
97
  }
83
98
  .hint {
84
- font-size: 26rpx;
99
+ font-size: 24rpx;
85
100
  color: #999;
86
101
  }
87
102
  .tag {
88
- padding: 4rpx 20rpx;
89
- font-size: 24rpx;
103
+ padding: 5rpx 12rpx;
104
+ font-size: 20rpx;
90
105
  color: #999;
91
106
  background-color: #f1f1f1;
92
- border-radius: 24rpx;
107
+ border-radius: 16rpx;
93
108
  }
94
109
  </style>
@@ -0,0 +1,7 @@
1
+ import { ActionView } from 'action'
2
+
3
+ export interface LcbHomeSearch {
4
+ marginTop?: number
5
+ placeholder?: string
6
+ items?: Partial<ActionView>[]
7
+ }
@@ -12,25 +12,31 @@
12
12
  :class="[styleGroup === 2 ? 'mutil' : 'single']"
13
13
  >
14
14
  <view v-for="item in items" :key="item.title" class="flex flex-col justify-center items-center">
15
- <div
15
+ <view
16
16
  class="overflow-hidden"
17
17
  :style="{
18
- height: iconSize + 'rpx',
19
- width: iconSize + 'rpx',
20
- borderRadius: (iconType === 1 ? iconRadius : 0) + 'rpx',
21
- color: iconColor,
22
18
  marginBottom: iconTextMargin + 'rpx',
23
- backgroundImage: iconType === 1 ? 'url(' + item.url + ')' : '',
24
- backgroundSize: '100% 100%',
25
- }"
26
- :class="{
27
- imageNav: iconType === 1,
28
19
  }"
29
20
  >
30
21
  <div v-if="iconType === 0" class="flex justify-center items-center">
31
- <wd-icon class-prefix="iconfont" :name="item.icon!" size="36" />
22
+ <wd-icon
23
+ class-prefix="iconfont"
24
+ :name="item.icon!"
25
+ :size="iconSize + 'rpx'"
26
+ :color="iconColor"
27
+ />
32
28
  </div>
33
- </div>
29
+ <img
30
+ v-else
31
+ class="block"
32
+ :style="{
33
+ borderRadius: iconRadius + 'rpx',
34
+ height: iconSize + 'rpx',
35
+ width: iconSize + 'rpx',
36
+ }"
37
+ :src="item.url"
38
+ />
39
+ </view>
34
40
  <view class="title">{{ item.title }}</view>
35
41
  </view>
36
42
  </view>
@@ -57,7 +63,7 @@ withDefaults(defineProps<LcbImgNavProps>(), {
57
63
  bottomMargin: 36,
58
64
  iconSize: 80,
59
65
  leftRightMargin: 0,
60
- iconTextMargin: 8,
66
+ iconTextMargin: 4,
61
67
  pictureDistribution: 4,
62
68
  })
63
69
  </script>
@@ -77,12 +83,6 @@ withDefaults(defineProps<LcbImgNavProps>(), {
77
83
  display: grid;
78
84
  row-gap: 36rpx;
79
85
  }
80
- .imageNav {
81
- box-sizing: content-box;
82
- background-repeat: no-repeat;
83
- background-position: center;
84
- background-size: cover;
85
- }
86
86
  .title {
87
87
  width: 68px;
88
88
  overflow: hidden;
@@ -41,11 +41,16 @@
41
41
  :key="item.icon"
42
42
  :class="[capsuleList.length === 1 ? 'px-2' : 'px-2.5']"
43
43
  >
44
- <wd-icon class-prefix="iconfont" :name="item.icon" size="20" />
44
+ <wd-icon class-prefix="iconfont" :name="item.icon" size="36rpx" :color="contentColor" />
45
45
  </view>
46
46
  </view>
47
47
  <template v-else-if="back">
48
- <wd-icon class-prefix="iconfont" name="dingdanliebiao" @click="toBack" />
48
+ <wd-icon
49
+ class-prefix="iconfont"
50
+ name="dingdanliebiao"
51
+ @click="toBack"
52
+ :color="contentColor"
53
+ />
49
54
  </template>
50
55
  <view class="ml-2" v-if="titleLocation === 'left'">
51
56
  <Search
@@ -219,11 +224,10 @@ onPageScroll(({ scrollTop: top }) => {
219
224
  @extend %action;
220
225
  .navbar-capsule {
221
226
  margin: auto 20rpx auto 0;
222
- height: 29px;
223
227
  content: '';
224
- border: 1rpx solid rgba(0, 0, 0, 0.1);
228
+ border: 1px solid rgba(0, 0, 0, 0.1);
225
229
  border-radius: 82rpx;
226
- padding: 0px;
230
+ padding: 10rpx 0px;
227
231
  background-color: rgba(255, 255, 255, 0.6);
228
232
  // 不等于最后一个儿子
229
233
  > view {
@@ -234,7 +238,7 @@ onPageScroll(({ scrollTop: top }) => {
234
238
  top: 50%;
235
239
  transform: translateY(-50%);
236
240
  content: ' ';
237
- width: 1rpx;
241
+ width: 1px;
238
242
  height: 18px;
239
243
  background: rgba(0, 0, 0, 0.1);
240
244
  }
@@ -4,8 +4,8 @@
4
4
  ...$props,
5
5
  title: undefined,
6
6
  }"
7
- :marginLeft="12"
8
- :marginRight="12"
7
+ :marginLeft="24"
8
+ :marginRight="24"
9
9
  >
10
10
  <text
11
11
  :style="{
package/global.d.ts CHANGED
@@ -5,6 +5,7 @@ declare module 'vue' {
5
5
  'lcb-banner-block': (typeof import('./types/components/lcb-banner-block/lcb-banner-block.vue'))['default']
6
6
  'lcb-block': (typeof import('./types/components/lcb-block/lcb-block.vue'))['default']
7
7
  'lcb-filter': (typeof import('./types/components/lcb-filter/lcb-filter.vue'))['default']
8
+ 'lcb-gap': (typeof import('./types/components/lcb-gap/lcb-gap.vue'))['default']
8
9
  'lcb-grid': (typeof import('./types/components/lcb-grid/lcb-grid.vue'))['default']
9
10
  'lcb-home-search': (typeof import('./types/components/lcb-home-search/lcb-home-search.vue'))['default']
10
11
  'lcb-img-nav': (typeof import('./types/components/lcb-img-nav/lcb-img-nav.vue'))['default']
@@ -1,12 +1,11 @@
1
1
  @font-face {
2
2
  font-family: 'iconfont'; /* Project id 4652744 */
3
3
  src:
4
- url('//at.alicdn.com/t/c/font_4652744_o8lyw0d70s.woff2?t=1724428388776') format('woff2'),
5
- url('//at.alicdn.com/t/c/font_4652744_o8lyw0d70s.woff?t=1724428388776') format('woff'),
6
- url('//at.alicdn.com/t/c/font_4652744_o8lyw0d70s.ttf?t=1724428388776') format('truetype'),
7
- url('//at.alicdn.com/t/c/font_4652744_o8lyw0d70s.svg?t=1724428388776#iconfont') format('svg');
4
+ url('//at.alicdn.com/t/c/font_4652744_bhoie787kfq.woff2?t=1726152120892') format('woff2'),
5
+ url('//at.alicdn.com/t/c/font_4652744_bhoie787kfq.woff?t=1726152120892') format('woff'),
6
+ url('//at.alicdn.com/t/c/font_4652744_bhoie787kfq.ttf?t=1726152120892') format('truetype'),
7
+ url('//at.alicdn.com/t/c/font_4652744_bhoie787kfq.svg?t=1726152120892#iconfont') format('svg');
8
8
  }
9
-
10
9
  .iconfont {
11
10
  font-family: 'iconfont' !important;
12
11
  font-size: 16px;
@@ -15,6 +14,26 @@
15
14
  -moz-osx-font-smoothing: grayscale;
16
15
  }
17
16
 
17
+ .iconfont-a-xingzhuang23kaobei:before {
18
+ content: '\e60f';
19
+ }
20
+
21
+ .iconfont-a-xingzhuang103:before {
22
+ content: '\e610';
23
+ }
24
+
25
+ .iconfont-a-xingzhuang22:before {
26
+ content: '\e611';
27
+ }
28
+
29
+ .iconfont-a-xingzhuang97:before {
30
+ content: '\e612';
31
+ }
32
+
33
+ .iconfont-a-xingzhuang106:before {
34
+ content: '\e613';
35
+ }
36
+
18
37
  .iconfont-dingdanliebiao:before {
19
38
  content: '\e662';
20
39
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tplc/business",
3
- "version": "0.0.17",
3
+ "version": "0.0.18",
4
4
  "keywords": [
5
5
  "业务组件"
6
6
  ],
@@ -11,7 +11,7 @@
11
11
  },
12
12
  "peerDependencies": {
13
13
  "vue": ">=3.2.47",
14
- "@tplc/wot": "0.1.5"
14
+ "@tplc/wot": "0.1.6"
15
15
  },
16
16
  "engines": {
17
17
  "node": ">=18",
@@ -13,6 +13,7 @@ export interface LcbBannerProps {
13
13
  duration?: number
14
14
  /** 轮播图高度 默认192 */
15
15
  height?: number
16
+ imgWidth?: number
16
17
  /** 轮播间隔时间 5000ms */
17
18
  interval?: number
18
19
  /** 是否循环播放 默认 true */
@@ -4,6 +4,7 @@ declare const _default: import('vue').DefineComponent<
4
4
  __VLS_TypePropsToOption<LcbBannerListProps>,
5
5
  {
6
6
  borderRadius: number
7
+ imageRadius: number
7
8
  backgroundColor: string
8
9
  }
9
10
  >,
@@ -22,12 +23,14 @@ declare const _default: import('vue').DefineComponent<
22
23
  __VLS_TypePropsToOption<LcbBannerListProps>,
23
24
  {
24
25
  borderRadius: number
26
+ imageRadius: number
25
27
  backgroundColor: string
26
28
  }
27
29
  >
28
30
  >
29
31
  >,
30
32
  {
33
+ imageRadius: number
31
34
  backgroundColor: string
32
35
  },
33
36
  {}
@@ -6,8 +6,13 @@ export interface LcbBannerListProps extends LcbBlockProps {
6
6
  styleGroup?: 1 | 2
7
7
  /** 轮播图高度 默认192 */
8
8
  height?: number
9
+ /** 轮播图宽度 */
10
+ imgWidth?: number
9
11
  title: string
10
12
  hint?: string
13
+ logo?: string
11
14
  rightIcon?: string
12
15
  leftIcon?: string
16
+ itemPadding?: number
17
+ imageRadius?: number
13
18
  }
@@ -0,0 +1,42 @@
1
+ import { LcbGapProps } from './types'
2
+ declare const _default: import('vue').DefineComponent<
3
+ __VLS_WithDefaults<__VLS_TypePropsToOption<LcbGapProps>, {}>,
4
+ {},
5
+ unknown,
6
+ {},
7
+ {},
8
+ import('vue').ComponentOptionsMixin,
9
+ import('vue').ComponentOptionsMixin,
10
+ {},
11
+ string,
12
+ import('vue').PublicProps,
13
+ Readonly<
14
+ import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<LcbGapProps>, {}>>
15
+ >,
16
+ {},
17
+ {}
18
+ >
19
+ export default _default
20
+ type __VLS_WithDefaults<P, D> = {
21
+ [K in keyof Pick<P, keyof P>]: K extends keyof D
22
+ ? __VLS_Prettify<
23
+ P[K] & {
24
+ default: D[K]
25
+ }
26
+ >
27
+ : P[K]
28
+ }
29
+ type __VLS_Prettify<T> = {
30
+ [K in keyof T]: T[K]
31
+ } & {}
32
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T
33
+ type __VLS_TypePropsToOption<T> = {
34
+ [K in keyof T]-?: {} extends Pick<T, K>
35
+ ? {
36
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>
37
+ }
38
+ : {
39
+ type: import('vue').PropType<T[K]>
40
+ required: true
41
+ }
42
+ }
@@ -0,0 +1,5 @@
1
+ export interface LcbGapProps {
2
+ height?: number
3
+ safeAreaBottom?: boolean
4
+ bgColor?: string
5
+ }
@@ -1,7 +1,11 @@
1
+ import { LcbHomeSearch } from './types'
1
2
  declare const _default: import('vue').DefineComponent<
2
- __VLS_TypePropsToOption<{
3
- marginTop?: number
4
- }>,
3
+ __VLS_WithDefaults<
4
+ __VLS_TypePropsToOption<LcbHomeSearch>,
5
+ {
6
+ placeholder: string
7
+ }
8
+ >,
5
9
  {},
6
10
  unknown,
7
11
  {},
@@ -13,15 +17,32 @@ declare const _default: import('vue').DefineComponent<
13
17
  import('vue').PublicProps,
14
18
  Readonly<
15
19
  import('vue').ExtractPropTypes<
16
- __VLS_TypePropsToOption<{
17
- marginTop?: number
18
- }>
20
+ __VLS_WithDefaults<
21
+ __VLS_TypePropsToOption<LcbHomeSearch>,
22
+ {
23
+ placeholder: string
24
+ }
25
+ >
19
26
  >
20
27
  >,
21
- {},
28
+ {
29
+ placeholder: string
30
+ },
22
31
  {}
23
32
  >
24
33
  export default _default
34
+ type __VLS_WithDefaults<P, D> = {
35
+ [K in keyof Pick<P, keyof P>]: K extends keyof D
36
+ ? __VLS_Prettify<
37
+ P[K] & {
38
+ default: D[K]
39
+ }
40
+ >
41
+ : P[K]
42
+ }
43
+ type __VLS_Prettify<T> = {
44
+ [K in keyof T]: T[K]
45
+ } & {}
25
46
  type __VLS_NonUndefinedable<T> = T extends undefined ? never : T
26
47
  type __VLS_TypePropsToOption<T> = {
27
48
  [K in keyof T]-?: {} extends Pick<T, K>
@@ -0,0 +1,6 @@
1
+ import { ActionView } from 'action'
2
+ export interface LcbHomeSearch {
3
+ marginTop?: number
4
+ placeholder?: string
5
+ items?: Partial<ActionView>[]
6
+ }
@@ -45,8 +45,8 @@ declare const _default: import('vue').DefineComponent<
45
45
  >,
46
46
  {
47
47
  iconSize: number
48
- textColor: string
49
48
  bgColor: string
49
+ textColor: string
50
50
  iconColor: string
51
51
  topMargin: 0 | 24 | 36
52
52
  bottomMargin: 0 | 24 | 36
@@ -1,3 +1,3 @@
1
- export const transformValueUnit = (value?: number, uni = 'px') => {
1
+ export const transformValueUnit = (value?: number, uni = 'rpx') => {
2
2
  return typeof value === 'number' ? value + uni : value
3
3
  }