@tplc/business 0.0.26 → 0.0.28

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

@@ -0,0 +1,127 @@
+<template>
+  <view class="p-3 box-border flex-1 overflow-y-auto h-0">
+    <view v-for="item in list" :key="item.hotAddressId" @click="onItemClick(item)">
+      <view class="flex">
+        <view class="tag">{{ item.categoryName }}</view>
+        <view class="content">
+          <rich-text :nodes="getText(item.addr)" />
+          <view>{{ item.provinceCityName || item.area }}</view>
+        </view>
+      </view>
+    </view>
+    <view v-if="!list.length">
+      <view v-if="historyList.length">
+        <view class="flex justify-between items-center">
+          <view class="text-28rpx text-#333 font-500x">历史搜索</view>
+          <wd-icon name="delete" size="30rpx" color="#999" @click="onClear" />
+        </view>
+        <view class="flex gap-2 flex-wrap">
+          <view
+            v-for="item in historyList"
+            :key="item.hotAddressId"
+            @click="emits('click', item)"
+            class="history-tag"
+          >
+            {{ item.addr }},
+            {{ item.area || item.provinceCityName }}
+          </view>
+        </view>
+      </view>
+      <wd-status-tip
+        v-else-if="keyword"
+        image="search"
+        tip="当前搜索无结果"
+        custom-class="!mt-20"
+      />
+    </view>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { LcbAddress } from '../../../lcb-city-select/api'
+import { LcbCityListProps } from './types'
+import { ref } from 'vue'
+
+defineOptions({
+  name: 'LcbCityList',
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    styleIsolation: 'shared',
+  },
+})
+const emits = defineEmits(['click'])
+const historyList = ref<LcbAddress[]>(uni.getStorageSync('lcb_city_select_history') || [])
+const props = withDefaults(defineProps<LcbCityListProps>(), {})
+const getText = (text: string) => {
+  const str = text.replace(props.keyword, `<div class="text-light">${props.keyword}</div>`)
+  return `<div class="flex">${str}</div>`
+}
+const onItemClick = (item: LcbAddress) => {
+  if (historyList.value.some((historyItem) => historyItem.hotAddressId === item.hotAddressId)) {
+    historyList.value = historyList.value.filter(
+      (historyItem) => historyItem.hotAddressId !== item.hotAddressId,
+    )
+  }
+  historyList.value.unshift(item)
+  uni.setStorageSync('lcb_city_select_history', historyList.value)
+  emits('click', item)
+}
+const onClear = () => {
+  historyList.value = []
+  uni.removeStorageSync('lcb_city_select_history')
+}
+</script>
+<style lang="scss" scoped>
+@import '@tplc/wot/components/common/abstracts/variable';
+.tag {
+  width: 80rpx;
+  height: 34rpx;
+  line-height: 34rpx;
+  text-align: center;
+  color: #fff;
+  font-size: 20rpx;
+  border-radius: 4rpx;
+  background-color: $-color-theme;
+}
+.content {
+  flex: 1;
+  display: flex;
+  margin-left: 16rpx;
+  flex-direction: column;
+  justify-content: center;
+  border-bottom: 1px solid #eee;
+  padding-bottom: 20rpx;
+  font-size: 24rpx;
+  color: #999;
+  > rich-text {
+    &:first-child {
+      font-size: 30rpx;
+      line-height: 34rpx;
+      font-weight: bold;
+      color: #333;
+      margin-bottom: 12rpx;
+    }
+  }
+  .text-light {
+    color: $-color-theme;
+  }
+}
+.history-tag {
+  background: #f7f7f7;
+  height: 50rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 24rpx;
+  border-radius: 2rpx;
+  font-size: 24rpx;
+  text-align: center;
+  overflow: hidden;
+  margin-top: 12rpx;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  color: #333;
+}
+</style>

package/components/lcb-city-select/components/lcb-city-list/types.ts

@@ -0,0 +1,6 @@
+import { LcbAddress } from '../../../lcb-city-select/api'
+
+export interface LcbCityListProps {
+  list: LcbAddress[]
+  keyword: string
+}

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

@@ -0,0 +1,145 @@
+<template>
+  <view @click="show = true">
+    <slot />
+  </view>
+  <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">
+      <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 { 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: {
+    addGlobalClass: true,
+    virtualHost: true,
+    styleIsolation: 'shared',
+  },
+})
+const props = withDefaults(defineProps<LcbCitySelectProps>(), {
+  placeholder: '搜索城市/区域/景点',
+})
+const modelValue = defineModel<ChildHotAddress>()
+const isOver = ref(false)
+const searchValue = ref('')
+const show = ref(false)
+const lcbAddress = ref<LcbAddress[]>([])
+const showList = ref(false)
+
+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(
+  () => props.location,
+  (val) => {
+    if (val && !modelValue.value) {
+      modelValue.value = {
+        addressInfo: val.addressInfo,
+        addr: val.cityName,
+        hotAddressId: val.cityId,
+      } as ChildHotAddress
+    }
+  },
+  {
+    immediate: true,
+  },
+)
+
+watch(
+  () => modelValue.value,
+  () => {
+    show.value = false
+  },
+)
+
+watch(
+  () => show.value,
+  (val) => {
+    if (!val) {
+      onCancel()
+    }
+  },
+)
+
+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>
+.top-search {
+  background: #ffffff;
+  box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(243, 245, 249, 0.94);
+}
+</style>

package/components/lcb-city-select/types.ts

@@ -0,0 +1,7 @@
+import { UserLocation } from '../../hooks/useLocation.api'
+
+export interface LcbCitySelectProps {
+  // Define the component's prop types here
+  location?: UserLocation
+  placeholder?: string
+}

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,33 +17,47 @@
     </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>
-        <view class="justify-center flex flex-col items-center">
+        <view class="justify-center flex flex-col items-center" @click="getLocation">
+          <wd-loading size="30rpx" v-if="locationIng" />
           <img
             class="w-30rpx h-30rpx"
             mode="aspectFit"
             src="https://ddll-lycs.oss-cn-hangzhou.aliyuncs.com/default/1/20240914164707/%E5%BD%A2%E7%8A%B6%2095%402x.png"
+            v-else
           />
-          <view class="text-26rpx text-#333 mt-12rpx">当前位置</view>
+          <view class="text-26rpx text-#333 mt-12rpx">
+            {{ locationIng ? translate('定位中...') : translate('当前位置') }}
+          </view>
         </view>
       </view>
       <view class="w-full h-1px bg-#F1F1F1 mt-26rpx mb-44rpx"></view>
-      <view class="flex items-center">
-        <view class="title">{{ dayRange[0].format('MM月DD日') }}</view>
-        <view class="hint ml-1">今天入住</view>
-        <view class="title mx-1">——</view>
-        <view class="title">{{ dayRange[1].format('MM月DD日') }}</view>
-        <view class="hint ml-1 flex-1">明天离店</view>
-        <view class="tag">共{{ nightCount }}晚</view>
-      </view>
+      <lcb-calendar v-model="dayRange">
+        <view class="flex items-center">
+          <view class="title">{{ dayjs(dayRange[0]).format('MM月DD日') }}</view>
+          <view class="hint ml-1">{{ getDayName(dayRange[0]) }}{{ translate('入住') }}</view>
+          <view class="title mx-1">——</view>
+          <view class="title">{{ dayjs(dayRange[1]).format('MM月DD日') }}</view>
+
+          <view class="hint ml-1 flex-1">{{ getDayName(dayRange[1]) }}{{ translate('离店') }}</view>
+          <view class="tag">{{ translate('共') }}{{ nightCount }}{{ translate('晚') }}</view>
+        </view>
+      </lcb-calendar>
       <wd-button type="primary" customClass="!w-full my-42rpx" size="large">
         {{ btnText }}
       </wd-button>
@@ -69,9 +83,16 @@
 import { computed, ref } from 'vue'
 import { LcbHomeSearch } from './types'
 import dayjs from 'dayjs/esm'
-const dayRange = ref([dayjs(), dayjs().add(1, 'day')])
+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, userLocation, locationIng } = useLocation()
+const addressCity = ref<ChildHotAddress>()
+getLocation()
 const nightCount = computed(() => {
-  return dayRange.value[1].diff(dayRange.value[0], 'day')
+  return dayjs(dayRange.value[1]).diff(dayRange.value[0], 'day')
 })
 defineOptions({
   name: 'LcbHomeSearch',
@@ -91,6 +112,19 @@ withDefaults(defineProps<LcbHomeSearch>(), {
 })
 const tabs = ['全部', '酒店', '民宿']
 const current = ref(0)
+// 今天 明天 后天  周...
+const getDayName = (time: number) => {
+  const day = dayjs(time).day()
+  if (day === dayjs().day()) {
+    return '今天'
+  } else if (day === dayjs().add(1, 'day').day()) {
+    return '明天'
+  } else if (day === dayjs().add(2, 'day').day()) {
+    return '后天'
+  } else {
+    return `周${'日一二三四五六'[day]}`
+  }
+}
 </script>
 <style lang="scss" scoped>
 .search-view {

package/components/lcb-image/Image/index.vue

@@ -1,31 +1,52 @@
 <template>
-  <view v-for="(item, index) in items" :key="index" :class="styleGroup == 2 ? 'flex-1' : ''" :style="{
-    marginLeft: transformValueUnit(styleGroup != 1 && index > 0 ? imageMargin : 0),
-    marginTop: transformValueUnit(styleGroup == 1 && index > 0 ? imageMargin : 0),
-    // marginLeft: transformValueUnit(styleGroup == 2 && index > 0 ? imageMargin : 0),
-    width: styleGroup == 3 ? transformValueUnit(imageSize) : 'auto',
-  }">
+  <view
+    v-for="(item, index) in items"
+    :key="index"
+    :class="styleGroup == 2 ? 'flex-1' : ''"
+    :style="{
+      marginLeft: transformValueUnit(styleGroup != 1 && index > 0 ? imageMargin : 0),
+      marginTop: transformValueUnit(styleGroup == 1 && index > 0 ? imageMargin : 0),
+      // marginLeft: transformValueUnit(styleGroup == 2 && index > 0 ? imageMargin : 0),
+      width: styleGroup == 3 ? transformValueUnit(imageSize) : 'auto',
+    }"
+  >
     <view class="relative overflow-hidden">
-      <wd-img v-if="!!item.url" :width="`${styleGroup == 3 ? transformValueUnit(imageSize) : '100%'}`"
-        @click="item.mode == 1 && onClickItem(item)" :src="item.url" :enable-preview="enablePreview" mode="widthFix"
-        :class="`${styleGroup == 3 ? 'overflow-hidden' : 'overflow-hidden block'}`" :style="{
+      <wd-img
+        v-if="!!item.url"
+        :width="`${styleGroup == 3 ? transformValueUnit(imageSize) : '100%'}`"
+        @click="item.mode == 1 && onClickItem(item)"
+        :src="item.url"
+        :enable-preview="enablePreview"
+        mode="widthFix"
+        :class="`${styleGroup == 3 ? 'overflow-hidden' : 'overflow-hidden block'}`"
+        :style="{
           borderRadius: transformValueUnit(imageRadius),
           display: 'block',
-        }" />
+        }"
+      />
 
-      <view v-if="!item.url" class="flex justify-center items-center bg-light color-gray overflow-hidden" :style="{
-        height: transformValueUnit(styleGroup == 3 ? 300 : 400),
-        borderRadius: transformValueUnit(imageRadius),
-      }">
+      <view
+        v-if="!item.url"
+        class="flex justify-center items-center bg-light color-gray overflow-hidden"
+        :style="{
+          height: transformValueUnit(styleGroup == 3 ? 300 : 400),
+          borderRadius: transformValueUnit(imageRadius),
+        }"
+      >
         <wd-icon name="image" size="50px"></wd-icon>
       </view>
 
-      <view v-for="(each, edx) in item.hotSpot" :key="edx" class="link absolute" :style="{
-        width: transformValueUnit(getRealSize(each.width)),
-        height: transformValueUnit(getRealSize(each.height)),
-        left: transformValueUnit(getRealSize(each.x)),
-        top: transformValueUnit(getRealSize(each.y)),
-      }">
+      <view
+        v-for="(each, edx) in item.hotSpot"
+        :key="edx"
+        class="link absolute"
+        :style="{
+          width: transformValueUnit(getRealSize(each.width)),
+          height: transformValueUnit(getRealSize(each.height)),
+          left: transformValueUnit(getRealSize(each.x)),
+          top: transformValueUnit(getRealSize(each.y)),
+        }"
+      >
         <lcb-action-view v-bind="each.urlObj" customClass="link" />
       </view>
     </view>

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,
   })