Merge branch 'master' of http://120.26.58.240:8888/r/flexJobMiniApp

zhengyiming

2025-02-13 52e3cfc5c8267a079ed0d3c32758124fc74ea8ea

Merge branch 'master' of http://120.26.58.240:8888/r/flexJobMiniApp

 apps/bMiniApp/project.private.config.json

@@ -10,7 +10,7 @@
            "list": [
                {
                    "name": "",
                    "pathName": "pages/mine/index",
                    "pathName": "subpackages/mine/mineFavorites/mineFavorites",
                    "query": "",
                    "launchMode": "default",
                    "scene": null

 apps/bMiniApp/src/app.config.ts

@@ -68,7 +68,7 @@
    },
    {
      root: 'subpackages/mine',
      pages: ['setting/setting'],
      pages: ['setting/setting', 'mineFavorites/mineFavorites'],
    },
    {
      root: 'subpackages/city',

 apps/bMiniApp/src/assets/mine/icon-finance.png

 apps/bMiniApp/src/assets/mine/icon-realname.png

 apps/bMiniApp/src/assets/mine/icon-setting.png

 apps/bMiniApp/src/components/Chunk/Cell.vue

@@ -1,6 +1,6 @@
<template>
  <div class="bole-cell-wrapper">
    <div class="cell-title-wrapper">
  <div class="bole-cell-wrapper" v-bind="$attrs">
    <div class="cell-title-wrapper" v-if="showTitle">
      <slot name="title">
        <div :class="titleSize === 'normal' ? 'cell-title' : 'cell-title-large'">{{ title }}</div>
        <slot name="title-right"></slot>
@@ -18,10 +18,12 @@
type Props = {
  title?: string;
  titleSize?: 'large' | 'normal';
  showTitle?: boolean;
};

const props = withDefaults(defineProps<Props>(), {
  titleSize: 'normal',
  showTitle: true,
});
</script>

@@ -30,9 +32,9 @@

.bole-cell-wrapper {
  background: #ffffff;
  border-radius: 8px;
  padding: 24px 28px;
  margin-bottom: 24px;
  border-radius: 12px;
  padding: 36px 34px;
  margin-bottom: 20px;

  .cell-title-wrapper {
    display: flex;
@@ -64,9 +66,9 @@

    .cell-title-large {
      font-weight: 600;
      font-size: 32px;
      font-size: 30px;
      color: boleGetCssVar('text-color', 'primary');
      line-height: 44px;
      line-height: 42px;
      @include ellipsis;
    }
  }

 apps/bMiniApp/src/components/Chunk/CellChunk.vue

New file
@@ -0,0 +1,38 @@
<template>
  <div class="cell-chunk-wrapper">
    <div class="cell-title-wrapper">
      <slot name="title">
        <div :class="titleSize === 'normal' ? 'cell-title' : 'cell-title-large'">{{ title }}</div>
        <slot name="title-right"></slot>
      </slot>
    </div>
    <slot></slot>
  </div>
</template>

<script setup lang="ts">
defineOptions({
  name: 'CellChunk',
});

type Props = {
  title?: string;
  titleSize?: 'large' | 'normal';
};

const props = withDefaults(defineProps<Props>(), {
  titleSize: 'normal',
});
</script>

<style lang="scss">
@import '@/styles/common.scss';

.cell-chunk-wrapper {
  margin-bottom: 20px;

  &:last-child {
    margin-bottom: 0;
  }
}
</style>

 apps/bMiniApp/src/constants/router.ts

@@ -23,4 +23,5 @@
  citySelect = '/subpackages/city/citySelect/citySelect',

  setting = '/subpackages/mine/setting/setting',
  mineFavorites = '/subpackages/mine/mineFavorites/mineFavorites',
}

 apps/bMiniApp/src/pages/mine/index.scss

@@ -122,13 +122,29 @@
  .mine-content-record {
    display: flex;
    justify-content: space-between;
    margin-top: 24px;

    .mine-content-record-item {
      background-color: #ffffff;
      border-radius: 8px;
      padding: 40px 45px;
      display: flex;
      flex: 1;
      min-width: 0;
      align-items: center;
      justify-content: center;

      & + .mine-content-record-item {
        margin-left: 30px;
      }

      .mine-content-record-item-text {
        font-weight: 400;
        font-size: 28px;
        line-height: 33px;
        color: boleGetCssVar('text-color', 'primary');
      }

      .mine-content-record-item-icon {
        width: 72px;
        height: 72px;
@@ -136,4 +152,42 @@
      }
    }
  }

  .mine-content-service {
    margin-top: 24px;
    margin-bottom: 48px;

    .cell-title-wrapper {
      margin-bottom: 40px;
    }

    .mine-content-service-list {
      display: flex;

      .mine-content-service--list-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-right: 60px;

        .mine-content-service--list-item-icon {
          width: 72px;
          height: 72px;
          margin-bottom: 24px;
        }

        .mine-content-service--list-item-text {
          font-size: 24px;
          line-height: 36px;
          color: boleGetCssVar('text-color', 'regular');
        }
      }
    }
  }

  .mine-content-logout {
    width: 100%;
    height: 88px;
  }
}

 apps/bMiniApp/src/pages/mine/index.vue

@@ -53,38 +53,62 @@
        </div> -->
      </UserHomeTopView>
      <div class="mine-content-record">
        <div class="mine-content-record-item">
        <div class="mine-content-record-item" @click="goMineFavorites">
          <img class="mine-content-record-item-icon" :src="IconCollect" alt="" />
          <div class="mine-content-record-item-text">我的收藏</div>
          <nut-badge top="0" right="0" :value="8" color="#FF7D00">
            <div class="mine-content-record-item-text">我的收藏</div>
          </nut-badge>
        </div>
        <div class="mine-content-record-item">
          <img class="mine-content-record-item-icon" :src="IconCollect" alt="" />
          <div class="mine-content-record-item-text">联系记录</div>
          <img class="mine-content-record-item-icon" :src="IconRecord" alt="" />
          <nut-badge top="0" right="0" :value="8" color="#FF7D00">
            <div class="mine-content-record-item-text">联系记录</div>
          </nut-badge>
        </div>
      </div>
      <div class="mine-content"></div>
      <Cell :title="'更多服务'" class="mine-content-service">
        <div class="mine-content-service-list">
          <div class="mine-content-service--list-item">
            <img class="mine-content-service--list-item-icon" :src="IconFinance" alt="" />
            <div class="mine-content-service--list-item-text">财务管理</div>
          </div>
          <div class="mine-content-service--list-item">
            <img class="mine-content-service--list-item-icon" :src="IconRealName" alt="" />
            <div class="mine-content-service--list-item-text">企业实名</div>
          </div>
          <div class="mine-content-service--list-item" @click="goSetting">
            <img class="mine-content-service--list-item-icon" :src="IconSetting" alt="" />
            <div class="mine-content-service--list-item-text">设置</div>
          </div>
        </div>
      </Cell>
      <nut-button type="info" class="mine-content-logout" @click="handleLoginout"
        >退出登录</nut-button
      >
    </ContentView>
    <ContentScrollView v-if="isLogin" class="mine-content-scroll-view"> </ContentScrollView>
  </PageLayoutWithBg>
</template>

<script setup lang="ts">
import {
  PageLayoutWithBg,
  TransparentNavigationBar,
  ContentScrollView,
  UserHomeTopView,
} from '@/components';
import { PageLayoutWithBg, TransparentNavigationBar, UserHomeTopView } from '@/components';
import IconBusinessCard from '@/assets/mine/icon-business-card.png';
import IconCollect from '@/assets/mine/icon-collect.png';
import IconRecord from '@/assets/mine/icon-record.png';
import IconMale from '@/assets/mine/icon-male.png';
import IconFemale from '@/assets/mine/icon-female.png';
import IconFinance from '@/assets/mine/icon-finance.png';
import IconRealName from '@/assets/mine/icon-realname.png';
import IconSetting from '@/assets/mine/icon-setting.png';
import { useUser, useIsLogin, useGoLogin } from '@/hooks';
import Taro from '@tarojs/taro';
import { RouterPath, OssAssets } from '@/constants';
import { useSystemStore } from '@/stores/modules/system';
import { Message } from '@12333/utils';
import { useUserStore } from '@/stores/modules/user';
import { useQueryClient } from '@tanstack/vue-query';

const userStore = useUserStore();
const queryClient = useQueryClient();
const { userDetail, isCertified } = useUser();
const isLogin = useIsLogin();
const systemStore = useSystemStore();
@@ -105,7 +129,7 @@
}

function goSetting() {
  // goPage(RouterPath.setting);
  goPage(RouterPath.setting);
}

Taro.showShareMenu({
@@ -123,6 +147,19 @@
function goAuthentication() {
  goPage(RouterPath.authenticationHome);
}
function goMineFavorites() {
  goPage(RouterPath.mineFavorites);
}

async function handleLoginout() {
  try {
    await Message.confirm({
      message: '确定要退出登录吗？',
    });
    userStore.logoutAndToHome();
    queryClient.removeQueries();
  } catch (error) {}
}
</script>

<style lang="scss">

 apps/bMiniApp/src/subpackages/mine/mineFavorites/InnerPage.vue

New file
@@ -0,0 +1,55 @@
<template>
  <InfiniteLoading
    scrollViewClassName="common-infinite-scroll-list home-list"
    v-bind="infiniteLoadingProps"
  >
    <template #renderItem="{ item }">
      <FlexJobCard> </FlexJobCard>
    </template>
  </InfiniteLoading>
</template>

<script setup lang="ts">
import { FlexJobCard } from '@12333/components';
import { useUserStore } from '@/stores/modules/user';
import { useInfiniteLoading } from '@12333/hooks';
import { OrderInputType } from '@12333/constants';
import * as orderServices from '@12333/services/api/Order';

defineOptions({
  name: 'InnerPage',
});

const userStore = useUserStore();

const { infiniteLoadingProps } = useInfiniteLoading(
  ({ pageParam }) => {
    let params: API.FrontOrderListInput = {
      pageModel: {
        rows: 20,
        page: pageParam,
        orderInput: [{ property: 'isRecommend', order: OrderInputType.Desc }],
      },
    };

    return orderServices.getFrontOrderList(params, {
      showLoading: false,
    });
  },
  {
    queryKey: ['orderServices/getFrontOrderList'],
  }
);
</script>

<style lang="scss">
@import '@/styles/common.scss';

.mineFavorites-page-wrapper {
  .task-card-actions-text {
    font-size: 24px;
    line-height: 42px;
    color: #9fa4ac;
  }
}
</style>

 apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.config.ts

New file
@@ -0,0 +1,3 @@
export default definePageConfig({
  disableScroll: true,
});

 apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.vue

New file
@@ -0,0 +1,17 @@
<template>
  <PageLayoutWithBg class="mineFavorites-page-wrapper" :title="'我的收藏'">
    <InnerPage></InnerPage>
  </PageLayoutWithBg>
</template>

<script setup lang="ts">
import InnerPage from './InnerPage.vue';

defineOptions({
  name: 'mineFavorites',
});
</script>

<style lang="scss">
@import '@/styles/common.scss';
</style>

 packages/components/src/Card/FlexJobCard.vue

New file
@@ -0,0 +1,175 @@
<template>
  <div class="flexJob-card-wrapper">
    <div class="flexJob-card-top-wrapper">
      <UserAvatar :size="60" class="flexJob-card-top-avatar" />
      <div class="flexJob-card-top-info">
        <div class="flexJob-card-top-info-item">
          <div class="flexJob-card-top-info-name">{{ '洋洋' }}</div>
          <div class="flexJob-card-top-info-gender">
            <img v-if="1" :src="IconMale" class="flexJob-card-top-info-gender-icon" />
            <img v-else :src="IconFemale" class="flexJob-card-top-info-gender-icon" />
          </div>
          <div class="flexJob-card-top-info-auth">{{ '已实名' }}</div>
        </div>
        <div class="flexJob-card-top-info-detail">{{ '26岁 | 非学生 | 本科 | 上岗121次' }}</div>
      </div>
    </div>
    <div class="flexJob-card-done-list">
      {{
        '做过：客房服务员、客房服务员、客房客房服务员、客房做过：客房服务员、客房服务员、客房客房服务员、客房'
      }}
    </div>
    <div class="flexJob-card-done-detail">
      <div class="flexJob-card-done-detail-item">
        {{ '在「宁波雷迪森酒店」，做过客房服务员在「宁波雷迪森酒店」，做过客房服务员' }}
      </div>
      <div class="flexJob-card-done-detail-item">{{ '在「宁波雷迪森酒店」，做过客房服务员' }}</div>
    </div>
    <div class="flexJob-card-footer">
      <div class="flexJob-card-footer-left" v-if="showFooterLeft">
        <slot name="footerLeft">
          <div class="flexJob-card-footer-text">取消收藏</div>
        </slot>
      </div>
      <div class="flexJob-card-footer-right" v-if="showFooterRight">
        <slot name="footerRight">
          <nut-button type="primary">立即联系</nut-button>
        </slot>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import IconMale from '@/assets/mine/icon-male.png';
import IconFemale from '@/assets/mine/icon-female.png';
import { CommonTaskCardProps } from './card';

defineOptions({
  name: 'FlexJobCard',
});

type Props = CommonTaskCardProps & {
  showFooterLeft?: boolean;
  showFooterRight?: boolean;
};

const props = withDefaults(defineProps<Props>(), {
  showFooterLeft: true,
  showFooterRight: true,
});
</script>

<style lang="scss">
@import '@/styles/common.scss';

.flexJob-card-wrapper {
  padding: 32px 24px 20px;
  margin-bottom: 24px;
  background-color: #fff;
  border-radius: 12px;

  &:last-child {
    margin-bottom: 0;
  }

  .flexJob-card-top-wrapper {
    display: flex;
    align-items: center;
    margin-bottom: 38px;

    .flexJob-card-top-avatar {
      margin-right: 30px;
    }

    .flexJob-card-top-info {
      display: flex;
      flex-direction: column;

      .flexJob-card-top-info-item {
        display: flex;
        align-items: center;

        .flexJob-card-top-info-name {
          font-size: 34px;
          line-height: 34px;
          font-weight: bold;
          color: boleGetCssVar('text-color', 'primary');
        }

        .flexJob-card-top-info-gender {
          display: inline-flex;
          align-items: center;
          height: 34px;
          margin: 0 10px;

          .flexJob-card-top-info-gender-icon {
            width: 24px;
            height: 24px;
          }
        }

        .flexJob-card-top-info-auth {
          font-size: 28px;
          line-height: 34px;
        }
      }

      .flexJob-card-top-info-detail {
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        margin-top: 12px;
        color: boleGetCssVar('text-color', 'secondary');
      }
    }
  }

  .flexJob-card-done-list {
    font-size: 24px;
    line-height: 36px;
    color: boleGetCssVar('text-color', 'primary');
    margin-bottom: 12px;
    @include ellipsis;
  }

  .flexJob-card-done-detail {
    display: flex;
    flex-direction: column;

    .flexJob-card-done-detail-item {
      font-size: 22px;
      line-height: 36px;
      color: boleGetCssVar('text-color', 'secondary');
      @include ellipsis;
      margin-bottom: 12px;

      &:last-child {
        margin-bottom: 0;
      }
    }
  }

  .flexJob-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: #d9d9d9 1px solid;
    padding-top: 24px;
    margin-top: 18px;

    .flexJob-card-footer-left {
      .flexJob-card-footer-text {
        font-size: 24px;
        line-height: 36px;
        color: boleGetCssVar('color', 'primary');
      }
    }

    .flexJob-card-footer-right {
      --nut-button-default-font-size: 24px;
      --nut-button-default-height: 52px;
    }
  }
}
</style>

 packages/components/src/index.ts

@@ -21,6 +21,7 @@
export { default as TaskCard } from './Card/TaskCard.vue';
export { default as MineAgreementSignCard } from './Card/MineAgreementSignCard.vue';
export { default as MyTaskCard } from './Card/MyTaskCard.vue';
export { default as FlexJobCard } from './Card/FlexJobCard.vue';
export { default as TaskPrice } from './Card/TaskPrice.vue';
export { default as QueryMenuView } from './Menu/QueryMenuView.vue';
export { default as QueryMenuItem } from './Menu/QueryMenuItem.vue';