@tplc/business 0.0.27 → 0.0.28

package/components/lcb-city-select/lcb-city-select.vue

@@ -5,47 +5,50 @@
   <wd-popup
     v-model="show"
     position="bottom"
+    @after-enter="isOver = true"
+    custom-class="lcb-city__p"
     custom-style="height: 90vh;border-top-left-radius: 24rpx;border-top-right-radius: 24rpx;"
     :safe-area-inset-bottom="true"
   >
     <view class="flex flex-col h-full">
-      <wd-search hide-cancel :placeholder="placeholder" />
-      <view class="h-0 flex-1" v-if="addressRef.length > 0">
-        <wd-index-bar>
-          <view
-            v-for="item in [...locationAddress, ...historyList, ...addressRef]"
-            :key="item.categoryName"
-          >
-            <wd-index-anchor
-              :index="item.categoryName"
-              :hint="item.hint"
-              customClass="!bg-transparent !pb-0 font-bold !text-28rpx !pl-4"
-            />
-            <view class="grid grid-cols-4 gap-3 py-3 pl-4 pr-10 box-border">
-              <view
-                class="address-tag"
-                :class="{
-                  'current-address':
-                    currentAddress && currentAddress.hotAddressId === city.hotAddressId,
-                }"
-                v-for="city in item.childHotAddress"
-                :key="city.addr"
-                @click="onAddrClick(city)"
-              >
-                {{ city.addr }}
-              </view>
-            </view>
-          </view>
-        </wd-index-bar>
+      <view class="top-search">
+        <view class="text-28rpx text-#333 text-center mt-28rpx mb-2 font-500">选择所在地区</view>
+        <wd-icon
+          custom-class="absolute top-0 right-0 mt-28rpx mr-5"
+          name="close-circle"
+          @click="show = false"
+          size="40rpx"
+          color="#999"
+        />
+        <wd-search
+          :hide-cancel="!showList"
+          :placeholder="placeholder"
+          placeholder-left
+          v-model="searchValue"
+          @focus="onFocus"
+          @cancel="onCancel"
+        />
       </view>
+      <lcb-city-list
+        v-show="showList"
+        :list="lcbAddress"
+        :keyword="searchValue"
+        @click="onAddressClick"
+      />
+
+      <lcb-city-letter v-show="!showList && isOver" v-bind="$props" v-model="modelValue" />
     </view>
   </wd-popup>
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, ref, watch } from 'vue'
-import { ChildHotAddress, getHotAddress, HotAddress } from './api'
+import { ref, watch } from 'vue'
+import { ChildHotAddress, getAddressList, LcbAddress } from './api'
+import LcbCityLetter from './components/lcb-city-letter/index.vue'
+import LcbCityList from './components/lcb-city-list/index.vue'
 import { LcbCitySelectProps } from './types'
+import { debounce } from '@tplc/wot/components/common/util'
+import qs from 'qs'
 defineOptions({
   name: 'LcbCitySelect',
   options: {
@@ -57,56 +60,43 @@ defineOptions({
 const props = withDefaults(defineProps<LcbCitySelectProps>(), {
   placeholder: '搜索城市/区域/景点',
 })
-const addressRef = ref<HotAddress[]>([])
-const historyAddress = ref<ChildHotAddress[]>([])
-const currentAddress = ref<ChildHotAddress | undefined>(
-  props.location
-    ? ({
-        addressInfo: props.location.addressInfo,
-        addr: props.location.cityName,
-        hotAddressId: props.location.cityId,
-      } as ChildHotAddress)
-    : undefined,
-)
+const modelValue = defineModel<ChildHotAddress>()
+const isOver = ref(false)
+const searchValue = ref('')
 const show = ref(false)
-onMounted(async () => {
-  const { data } = await getHotAddress()
-  addressRef.value = data
-})
-const locationAddress = computed<HotAddress[]>(() => {
-  return props.location
-    ? ([
-        {
-          categoryName: '定位',
-          hint: '当前定位',
-          childHotAddress: [
-            {
-              addressInfo: props.location.addressInfo,
-              addr: props.location.cityName,
-              hotAddressId: props.location.cityId,
-            },
-          ],
-        },
-      ] as HotAddress[])
-    : []
-})
+const lcbAddress = ref<LcbAddress[]>([])
+const showList = ref(false)
 
-const historyList = computed<HotAddress[]>(() => {
-  return historyAddress.value.length
-    ? [
-        {
-          categoryName: '历史',
-          hint: '历史记录',
-          childHotAddress: historyAddress.value,
-        },
-      ]
-    : []
-})
+const onFocus = () => {
+  showList.value = true
+}
+
+const onCancel = () => {
+  showList.value = false
+  searchValue.value = ''
+  lcbAddress.value = []
+}
+
+const onAddressClick = (item: LcbAddress) => {
+  if (item.addrFlag) {
+    modelValue.value = item as ChildHotAddress
+  } else {
+    uni.navigateTo({
+      url: `/pages/residentialHotel/index?${qs.stringify(item)}`,
+    })
+  }
+  onCancel()
+  show.value = false
+}
 watch(
-  () => show.value,
+  () => props.location,
   (val) => {
-    if (val) {
-      historyAddress.value = JSON.parse(uni.getStorageSync('historyAddress') || '[]')
+    if (val && !modelValue.value) {
+      modelValue.value = {
+        addressInfo: val.addressInfo,
+        addr: val.cityName,
+        hotAddressId: val.cityId,
+      } as ChildHotAddress
     }
   },
   {
@@ -115,54 +105,41 @@ watch(
 )
 
 watch(
-  () => historyAddress.value,
+  () => modelValue.value,
+  () => {
+    show.value = false
+  },
+)
+
+watch(
+  () => show.value,
   (val) => {
-    if (val.length) {
-      uni.setStorageSync('historyAddress', JSON.stringify(val))
+    if (!val) {
+      onCancel()
     }
   },
 )
-const onAddrClick = (city: ChildHotAddress) => {
-  currentAddress.value = city
-  show.value = false
-  historyAddress.value = historyAddress.value.filter(
-    (item) => item.hotAddressId !== city.hotAddressId,
-  )
-  if (historyAddress.value.length === 8) {
-    historyAddress.value = [city, ...historyAddress.value.slice(0, 7)]
-  } else {
-    historyAddress.value = [city, ...historyAddress.value]
-  }
-}
+
+watch(
+  () => searchValue.value,
+  () => {
+    if (!searchValue.value) {
+      lcbAddress.value = []
+      return
+    }
+    search()
+  },
+)
+
+const search = debounce(async () => {
+  const { data } = await getAddressList(searchValue.value)
+  lcbAddress.value = data
+}, 200)
 </script>
 
 <style lang="scss" scoped>
-@import '@tplc/wot/components/common/abstracts/variable';
-.address-tag {
-  background: #f7f7f7;
-  height: 80rpx;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0 16rpx;
-  border-radius: 10rpx;
-  font-size: 24rpx;
-  text-align: center;
-  overflow: hidden;
-}
-.current-address {
-  color: $-color-theme;
-  position: relative;
-  &::after {
-    content: '';
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    z-index: 1;
-    background: $-color-theme;
-    opacity: 0.15;
-  }
+.top-search {
+  background: #ffffff;
+  box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(243, 245, 249, 0.94);
 }
 </style>

package/components/lcb-dynamic-data/lcb-dynamic-data.vue

@@ -0,0 +1,25 @@
+<template>
+  <lcb-block v-bind="$props">
+    <view class="flex">
+      <view v-for="item in items" :key="item.title">
+        <view>{{ item.unit }} {{ item.key }}</view>
+        <view>{{ item.title }}</view>
+      </view>
+    </view>
+  </lcb-block>
+</template>
+
+<script setup lang="ts">
+import { LcbDynamicDataProps } from './types'
+defineOptions({
+  name: 'LcbDynamicData',
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    styleIsolation: 'shared',
+  },
+})
+withDefaults(defineProps<LcbDynamicDataProps>(), {})
+</script>
+
+<style lang="scss" scoped></style>

package/components/lcb-dynamic-data/types.ts

@@ -0,0 +1,7 @@
+export interface LcbDynamicDataProps {
+  items: {
+    title: string
+    unit?: string
+    key?: string
+  }[]
+}

package/components/lcb-home-search/lcb-home-search.vue

@@ -17,12 +17,19 @@
     </view>
     <view class="box-border px-3 leading-none">
       <view class="flex items-center justify-center mt-3 text-#333 gap-16rpx">
-        <view class="text-30rpx font-bold">义乌</view>
-        <img
-          class="w-30rpx h-30rpx"
-          mode="aspectFit"
-          src="https://ddll-lycs.oss-cn-hangzhou.aliyuncs.com/default/1/20240914164446/%E5%BD%A2%E7%8A%B6%2092%402x.png"
-        />
+        <lcb-city-select :location="userLocation" v-model="addressCity">
+          <view class="flex items-center gap-16rpx">
+            <view class="text-30rpx font-bold max-w-13 truncate">
+              {{ addressCity?.addr || '附近' }}
+            </view>
+            <img
+              class="w-30rpx h-30rpx"
+              mode="aspectFit"
+              src="https://ddll-lycs.oss-cn-hangzhou.aliyuncs.com/default/1/20240914164446/%E5%BD%A2%E7%8A%B6%2092%402x.png"
+            />
+          </view>
+        </lcb-city-select>
+
         <view class="h-42rpx w-1px bg-#F1F1F1"></view>
         <view class="text-#999 text-28rpx">{{ placeholder }}</view>
         <view class="flex-1"></view>
@@ -78,9 +85,11 @@ import { LcbHomeSearch } from './types'
 import dayjs from 'dayjs/esm'
 import useLocation from '../../hooks/useLocation'
 import { useTranslate } from '@tplc/wot'
+import { ChildHotAddress } from '../lcb-city-select/api'
 const dayRange = ref([dayjs().valueOf(), dayjs().add(1, 'day').valueOf()])
 const { translate } = useTranslate()
-const { getLocation, locationIng } = useLocation()
+const { getLocation, userLocation, locationIng } = useLocation()
+const addressCity = ref<ChildHotAddress>()
 getLocation()
 const nightCount = computed(() => {
   return dayjs(dayRange.value[1]).diff(dayRange.value[0], 'day')

package/components/lcb-img-nav/lcb-img-nav.vue

@@ -1,33 +1,61 @@
 <template>
   <lcb-block v-bind="$props">
-    <lcb-title v-if="showTitle" v-bind="{
-      title,
-      marginHorizontal: 0,
-      paddingHorizontal: titlePadding,
-      paddingBottom: 25,
-      fontSize,
-      fontWeight,
-      color,
-    }" />
-    <view :style="{
-      gridTemplateColumns: `repeat(${pictureDistribution}, minmax(0, 1fr))`,
-    }" :class="[styleGroup === 2 ? 'mutil' : 'single']">
-      <lcb-action-view v-for="item in items" :key="item.title" v-bind="item.link"
-        custom-class="!flex flex-col justify-center items-center">
-        <view class="overflow-hidden" :style="{
-          marginBottom: iconTextMargin + 'rpx',
-        }">
-          <!-- <div v-if="iconType === 0" class="flex justify-center items-center"> -->
-          <wd-icon v-if="iconType === 0" class-prefix="iconfont" :name="item.icon!" :size="iconSize + 'rpx'"
-            :color="iconColor" />
-          <!-- </div> -->
-          <img v-else class="block" :style="{
-            borderRadius: iconRadius + 'rpx',
-            height: iconSize + 'rpx',
-            width: iconSize + 'rpx',
-          }" :src="item.url" />
+    <lcb-title
+      v-if="showTitle"
+      v-bind="{
+        title,
+        marginHorizontal: 0,
+        paddingHorizontal: titlePadding,
+        paddingBottom: 25,
+        fontSize,
+        fontWeight,
+        color,
+      }"
+    />
+    <view
+      :style="{
+        gridTemplateColumns: `repeat(${pictureDistribution}, minmax(0, 1fr))`,
+      }"
+      :class="[
+        {
+          1: 'single',
+          2: 'mutil',
+          3: 'cell',
+        }[styleGroup!],
+      ]"
+    >
+      <lcb-action-view
+        v-for="item in items"
+        :key="item.title"
+        v-bind="item.link"
+        custom-class="!flex flex-col justify-center items-center item"
+      >
+        <view
+          class="overflow-hidden"
+          :style="{
+            marginBottom: iconTextMargin + 'rpx',
+          }"
+        >
+          <wd-icon
+            v-if="iconType === 0"
+            class-prefix="lcb"
+            :name="item.icon!"
+            :size="iconSize + 'rpx'"
+            :color="iconColor"
+          />
+          <img
+            v-else
+            class="block"
+            :style="{
+              borderRadius: iconRadius + 'rpx',
+              height: iconSize + 'rpx',
+              width: iconSize + 'rpx',
+            }"
+            :src="item.url"
+          />
         </view>
         <view class="title">{{ item.title }}</view>
+        <wd-icon v-if="styleGroup === 3" name="chevron-right" size="22"></wd-icon>
       </lcb-action-view>
     </view>
   </lcb-block>
@@ -65,7 +93,7 @@ withDefaults(defineProps<LcbImgNavProps>(), {
   overflow-x: auto;
   white-space: nowrap;
 
-  >view {
+  > view {
     display: inline-flex;
   }
 }
@@ -74,12 +102,24 @@ withDefaults(defineProps<LcbImgNavProps>(), {
   display: grid;
   row-gap: 36rpx;
 }
-
+.cell {
+  display: flex;
+  flex-direction: column;
+  gap: 40rpx;
+  .item {
+    flex-direction: row;
+  }
+  .title {
+    flex: 1;
+    text-align: start;
+    margin-left: 24rpx;
+  }
+}
 .title {
   width: 68px;
   overflow: hidden;
-  font-size: 24rpx;
-  line-height: 14px;
+  font-size: 28rpx;
+  line-height: 1;
   text-align: center;
   letter-spacing: 0;
   white-space: nowrap;

package/components/lcb-img-nav/types.ts

@@ -2,8 +2,8 @@ import { ActionView } from 'action'
 import { LcbBlockProps } from '../lcb-block/types'
 
 export interface LcbImgNavProps extends LcbBlockProps {
-  /** 模式 1.单行 2.多行 */
-  styleGroup?: 1 | 2
+  /** 模式 1.单行 2.多行 3.cell */
+  styleGroup?: 1 | 2 | 3
   /** 文字颜色 #212121 */
   textColor?: string
   /** 背景图片 */
@@ -23,7 +23,7 @@ export interface LcbImgNavProps extends LcbBlockProps {
   /** 文字与图标距离 */
   iconTextMargin?: number
 
-  //是否显示标题
+  // 是否显示标题
   showTitle?: boolean
   title?: string
   fontWeight?: number

package/components/{lcb-filter → lcb-list}/api.ts

@@ -1,8 +1,13 @@
 import { Option } from './types'
+export interface LcbListInfo {
+  url: string
+  baseParam: Record<string, unknown>
+}
 export interface LcbFilterResult {
   btnComponent: BtnComponent
   filterTags: FilterTags
   filterComponent: FilterComponent[]
+  listInfo: LcbListInfo
 }
 
 export interface FilterComponent {
@@ -51,6 +56,6 @@ interface BtnComponent {
 }
 
 export const getFilterDetail = (val: string) =>
-  uni.$lcb.http.post<LcbFilterResult>('/pageDecoration/filter/detail', {
-    pageFilterType: val,
+  uni.$lcb.http.post<LcbFilterResult>('/pageDecoration/list//detail', {
+    pageListType: val,
   })

package/components/lcb-list/components/FilterList/index.vue

@@ -0,0 +1,78 @@
+<template>
+  <z-paging ref="paging" :auto="true" v-model="dataList" @query="queryList" use-page-scroll>
+    <lcb-product v-bind="{ ...productProps }" :items="dataList" />
+  </z-paging>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+import useZPaging from 'z-paging/components/z-paging/js/hooks/useZPaging'
+import { LcbFilterListProps } from './type'
+
+defineOptions({
+  name: 'FilterList',
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    styleIsolation: 'shared',
+  },
+})
+const props = defineProps<LcbFilterListProps>()
+const dataList = ref<unknown[]>([])
+const paging = ref()
+useZPaging(paging)
+watch(
+  () => props.url,
+  async (val) => {
+    if (val) {
+      paging.value?.reload()
+    }
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+watch(
+  () => props.filter,
+  async (val) => {
+    if (val) {
+      paging.value?.reload()
+    }
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+const queryList = async (pageNo: number, pageSize: number) => {
+  try {
+    const { data } = await uni.$lcb.http.post(props.url, {
+      ...props.baseParam,
+      ...props.filter,
+      pageNo,
+      pageSize,
+    })
+    paging.value.complete(data)
+  } catch (error) {
+    paging.value.complete(false)
+  }
+}
+</script>
+<style lang="scss" scoped>
+.action-view {
+  width: 100%;
+  height: 118rpx;
+  background: #ffffff;
+  box-shadow: 0rpx 0rpx 6rpx 0rpx rgba(0, 0, 0, 0.04);
+  gap: 50rpx;
+  padding: 20rpx 52rpx;
+  box-sizing: border-box;
+  :deep(.wd-button) {
+    height: 100%;
+    line-height: 100%;
+    font-size: 30rpx;
+    border-radius: 40rpx;
+  }
+}
+</style>

package/components/lcb-list/components/FilterList/type.ts

@@ -0,0 +1,9 @@
+import { LcbListInfo } from '../../api'
+import { LcbProductProps } from '../../../lcb-product/types'
+export interface PageListProps {
+  emptyImage?: string
+  productProps?: LcbProductProps
+}
+export interface LcbFilterListProps extends PageListProps, LcbListInfo {
+  filter?: Record<string, any>
+}

package/components/{lcb-filter → lcb-list}/components/FilterSlider/index.vue

@@ -13,7 +13,7 @@
       custom-min-class="left-0  slider-text"
       custom-max-class="right--2 slider-text"
     />
-    <view class="grid grid-cols-4 gap-4 mt-2">
+    <view class="grid grid-cols-4 gap-4 mt-2" v-if="options.length">
       <SelectTagView
         v-for="item in options"
         :key="item.label"
@@ -51,6 +51,7 @@ const onItemClick = (value) => {
       innerValue.value = [value[0], value[0]]
     }
   }
+  model.value = innerValue.value
 }
 
 const onDropOpened = () => {

package/components/{lcb-filter → lcb-list}/index.scss

@@ -9,6 +9,9 @@
     color: $-color-theme !important;
   }
 
+  &__border-top {
+    border-top: 1px solid #F3F5F9;
+  }
 
 }