wupengfei
2025-03-21 1bbd7061dac79cacf5513234a04cac8ba0be5c6f
apps/cMiniApp/src/subpackages/city/citySelect/citySelect.vue
@@ -1,7 +1,16 @@
<template>
  <PageLayout title="选择城市" class="citySelect-page-wrapper" :need-auth="false">
    <ContentView class="citySelect-content-wrapper">
      <div class="current-city">当前城市:{{ locationCity }}</div>
      <!-- <div class="current-city">当前城市:{{ locationCity }}</div> -->
      <div class="home-searchbar-wrapper">
        <div class="city-btn-wrapper">
          <div class="city-btn">
            <img :src="IconLocaltion" class="city-btn-icon" />
            <div class="city-btn-text">当前定位:{{ locationCity }}</div>
          </div>
        </div>
        <div class="reset-localtion" @click="resetLocation">重新定位</div>
      </div>
      <Elevator :index-list="elevatorData" :height="'100%'" @click-item="clickItem" />
    </ContentView>
  </PageLayout>
@@ -15,6 +24,8 @@
import { groupBy, sortBy } from 'lodash';
import { useUserStore } from '@/stores/modules/user';
import { Elevator } from '@12333/components';
import IconLocaltion from '@/assets/task/icon-localtion.png';
import { setLocationCity } from '@/utils';
defineOptions({
  name: 'citySelect',
@@ -56,12 +67,54 @@
  console.log('item: ', item, getAreaByAreaCode(item.parentId).areaName);
  userStore.setLocationCity(item.name, getAreaByAreaCode(item.parentId).areaName);
};
async function resetLocation() {
  try {
    await setLocationCity();
  } catch (error) {}
}
</script>
<style lang="scss">
@import '@/styles/common.scss';
.citySelect-page-wrapper {
  .home-searchbar-wrapper {
    padding: 32px 0 28px;
    display: flex;
    align-items: center;
    .city-btn-wrapper {
      flex: 1;
      min-width: 0;
      .city-btn {
        display: flex;
        align-items: center;
        padding-right: 36px;
        color: boleGetCssVar('text-color', 'primary');
        .city-btn-icon {
          width: 40px;
          height: 40px;
        }
        .city-btn-text {
          @include ellipsis;
          margin-left: 12px;
          font-size: 30px;
        }
      }
    }
    .reset-localtion {
      font-weight: 400;
      font-size: 24px;
      color: boleGetCssVar('color', 'primary');
      line-height: 28px;
    }
  }
  .current-city {
    padding: 20px 0;
    color: boleGetCssVar('text-color', 'primary');