From 52e3cfc5c8267a079ed0d3c32758124fc74ea8ea Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期四, 13 二月 2025 15:42:10 +0800
Subject: [PATCH] Merge branch 'master' of http://120.26.58.240:8888/r/flexJobMiniApp
---
apps/bMiniApp/src/assets/mine/icon-finance.png | 0
apps/bMiniApp/src/subpackages/mine/mineFavorites/InnerPage.vue | 55 ++++++
apps/bMiniApp/src/components/Chunk/CellChunk.vue | 38 ++++
apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.config.ts | 3
apps/bMiniApp/src/constants/router.ts | 1
apps/bMiniApp/src/assets/mine/icon-setting.png | 0
apps/bMiniApp/project.private.config.json | 2
apps/bMiniApp/src/app.config.ts | 2
apps/bMiniApp/src/assets/mine/icon-realname.png | 0
packages/components/src/index.ts | 1
apps/bMiniApp/src/pages/mine/index.vue | 63 ++++++-
apps/bMiniApp/src/pages/mine/index.scss | 54 ++++++
apps/bMiniApp/src/components/Chunk/Cell.vue | 16 +
packages/components/src/Card/FlexJobCard.vue | 175 +++++++++++++++++++++
apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.vue | 17 ++
15 files changed, 405 insertions(+), 22 deletions(-)
diff --git a/apps/bMiniApp/project.private.config.json b/apps/bMiniApp/project.private.config.json
index 9ac13a2..032a8e1 100644
--- a/apps/bMiniApp/project.private.config.json
+++ b/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
diff --git a/apps/bMiniApp/src/app.config.ts b/apps/bMiniApp/src/app.config.ts
index a02abda..4c6fef8 100644
--- a/apps/bMiniApp/src/app.config.ts
+++ b/apps/bMiniApp/src/app.config.ts
@@ -68,7 +68,7 @@
},
{
root: 'subpackages/mine',
- pages: ['setting/setting'],
+ pages: ['setting/setting', 'mineFavorites/mineFavorites'],
},
{
root: 'subpackages/city',
diff --git a/apps/bMiniApp/src/assets/mine/Group 304226@2x.png b/apps/bMiniApp/src/assets/mine/icon-finance.png
similarity index 100%
rename from apps/bMiniApp/src/assets/mine/Group 304226@2x.png
rename to apps/bMiniApp/src/assets/mine/icon-finance.png
Binary files differ
diff --git a/apps/bMiniApp/src/assets/mine/Group 304225@2x.png b/apps/bMiniApp/src/assets/mine/icon-realname.png
similarity index 100%
rename from apps/bMiniApp/src/assets/mine/Group 304225@2x.png
rename to apps/bMiniApp/src/assets/mine/icon-realname.png
Binary files differ
diff --git a/apps/bMiniApp/src/assets/mine/Group 304224@2x.png b/apps/bMiniApp/src/assets/mine/icon-setting.png
similarity index 100%
rename from apps/bMiniApp/src/assets/mine/Group 304224@2x.png
rename to apps/bMiniApp/src/assets/mine/icon-setting.png
Binary files differ
diff --git a/apps/bMiniApp/src/components/Chunk/Cell.vue b/apps/bMiniApp/src/components/Chunk/Cell.vue
index 81a39f9..1a63c89 100644
--- a/apps/bMiniApp/src/components/Chunk/Cell.vue
+++ b/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;
}
}
diff --git a/apps/bMiniApp/src/components/Chunk/CellChunk.vue b/apps/bMiniApp/src/components/Chunk/CellChunk.vue
new file mode 100644
index 0000000..138267f
--- /dev/null
+++ b/apps/bMiniApp/src/components/Chunk/CellChunk.vue
@@ -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>
diff --git a/apps/bMiniApp/src/constants/router.ts b/apps/bMiniApp/src/constants/router.ts
index 38645d3..0228ee4 100644
--- a/apps/bMiniApp/src/constants/router.ts
+++ b/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',
}
diff --git a/apps/bMiniApp/src/pages/mine/index.scss b/apps/bMiniApp/src/pages/mine/index.scss
index 05c7818..a42a18d 100644
--- a/apps/bMiniApp/src/pages/mine/index.scss
+++ b/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;
+ }
}
diff --git a/apps/bMiniApp/src/pages/mine/index.vue b/apps/bMiniApp/src/pages/mine/index.vue
index ab21c15..48b1eca 100644
--- a/apps/bMiniApp/src/pages/mine/index.vue
+++ b/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">
diff --git a/apps/bMiniApp/src/subpackages/mine/mineFavorites/InnerPage.vue b/apps/bMiniApp/src/subpackages/mine/mineFavorites/InnerPage.vue
new file mode 100644
index 0000000..033f7ca
--- /dev/null
+++ b/apps/bMiniApp/src/subpackages/mine/mineFavorites/InnerPage.vue
@@ -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>
diff --git a/apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.config.ts b/apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.config.ts
new file mode 100644
index 0000000..305fdb1
--- /dev/null
+++ b/apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.config.ts
@@ -0,0 +1,3 @@
+export default definePageConfig({
+ disableScroll: true,
+});
diff --git a/apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.vue b/apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.vue
new file mode 100644
index 0000000..a3fb0b6
--- /dev/null
+++ b/apps/bMiniApp/src/subpackages/mine/mineFavorites/mineFavorites.vue
@@ -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>
diff --git a/packages/components/src/Card/FlexJobCard.vue b/packages/components/src/Card/FlexJobCard.vue
new file mode 100644
index 0000000..9f30459
--- /dev/null
+++ b/packages/components/src/Card/FlexJobCard.vue
@@ -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>
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 5d66333..5db4afc 100644
--- a/packages/components/src/index.ts
+++ b/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';
--
Gitblit v1.9.1