sdz/qingdao-employment-service
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

flat: 优化，还是使用原生Tabbar,empty优化

Browse Source
This commit is contained in:
Apcallover
2025-11-30 14:08:16 +08:00
parent 63d0cdb5ad
commit 0dec1618fa
23 changed files with 229 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
App.vue
View File

@@ -124,11 +124,22 @@ function loginCallback(userInfo) {
/*每个页面公共css */
@import '@/common/animation.css';
@import '@/common/common.css';
/* 修改pages tabbar样式 H5有效 */
/* 修改pages tabbar样式 H5才有效 */
.uni-tabbar .uni-tabbar__item:nth-child(4) .uni-tabbar__bd .uni-tabbar__icon {
height: 110rpx !important;
width: 122rpx !important;
margin-top: 6rpx;
width: 108rpx !important;
height: 98rpx !important;
margin-top: 0rpx;
transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
transform-origin: center center;
/* transition: transform 0.15s ease-in-out; */
/* transform-origin: center center; */
}
.uni-tabbar .uni-tabbar__item:nth-child(4) .uni-tabbar__bd .uni-tabbar__icon:active {
transform: scale(0.8);
transition: transform 0.1s ease-out;
/* animation: jelly 0.5s; */
}
.uni-tabbar-border {

34
common/animation.css
View File

@@ -191,3 +191,37 @@
-webkit-animation-name: tada;
animation-name: tada
}
@keyframes jelly {
0% {
transform: scale(1);
}
30% {
transform: scale(1.25, 0.75);
}
/* 压扁 */
40% {
transform: scale(0.75, 1.25);
}
/* 拉长 */
50% {
transform: scale(1.15, 0.85);
}
/* 稍微压扁 */
65% {
transform: scale(0.95, 1.05);
}
/* 稍微拉长 */
75% {
transform: scale(1.05, 0.95);
}
100% {
transform: scale(1);
}
}

4
common/common.css
View File

@@ -469,3 +469,7 @@ html {
.grayscale {
filter: grayscale(100%) opacity(0.6);
}
.height-100 {
height: 100%;
}

43
components/empty/empty.vue
View File

@@ -1,5 +1,9 @@
<template>
<view class="empty" :style="{ background: bgcolor, marginTop: mrTop + 'rpx' }">
<view
class="empty"
:class="{ 'position-center': isPosition }"
:style="{ background: bgcolor, marginTop: mrTop + 'rpx' }"
>
<view class="ty_content" :style="{ paddingTop: pdTop + 'rpx' }">
<view class="content_top">
<!-- <view class="content_top btn-shaky"> -->
@@ -30,18 +34,23 @@ export default {
pdTop: {
type: String,
required: false,
default: '80',
default: '0',
},
mrTop: {
type: String,
required: false,
default: '20',
default: '0',
},
pictrue: {
type: String,
required: false,
default: '',
},
isPosition: {
type: Boolean,
required: false,
default: false,
},
},
methods: {},
};
@@ -52,19 +61,33 @@ image {
width: 100%;
height: 100%;
}
.empty {
width: 100%;
min-height: 100vh;
position: relative;
.ty_content {
.position-center {
position: absolute;
left: 50%;
top: 0;
transform: translate(-50%, 0);
top: 50%;
transform: translate(-50%, -50%);
}
.empty {
width: 100%;
height: 100%;
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
// min-height: 100vh;
// height: 400rpx;
// position: relative;
.ty_content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
// position: absolute;
// left: 50%;
// top: 0;
// transform: translate(-50%, 0);
.content_top {
width: 450rpx;
height: 322rpx;

9
packageA/pages/Intendedposition/Intendedposition.vue
View File

@@ -5,9 +5,9 @@
seeDate="applyTime"
:list="pageState.list"
:longitude="longitudeVal"
:latitude="latitudeVal">
</renderDeliveryRecord>
<empty v-else pdTop="200"></empty>
:latitude="latitudeVal"
></renderDeliveryRecord>
<empty v-else :is-position="true"></empty>
</view>
</template>
@@ -75,7 +75,8 @@ function getJobList(type = 'add') {
.collection-content{
padding: 1rpx 28rpx 20rpx 28rpx;
background: #F4F4F4;
height: 100%
height: 100%;
min-height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
position: relative;
}
</style>

10
packageA/pages/UnitDetails/UnitDetails.vue
View File

@@ -62,7 +62,7 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="200"></empty>
<empty v-else :is-position="true"></empty>
</view>
</scroll-view>
</view>
@@ -184,10 +184,12 @@ function getThirdPartyJobsList(type = 'add') {
pageSize: pageState.pageSize,
};
$api.createRequest(`/app/internal/jobThirdPart?gsID=${companyId}&gsmc=${companyName}&zphID=${zphId}`, params).then((resData) => {
$api.createRequest(`/app/internal/jobThirdPart?gsID=${companyId}&gsmc=${companyName}&zphID=${zphId}`, params).then(
(resData) => {
const { rows, total } = resData;
handleJobsListResponse(type, rows, total, 'current');
});
}
);
}
function getOriginalJobsList(type = 'add') {
@@ -322,6 +324,8 @@ image {
background: #F4F4F4;
.views{
padding: 28rpx
min-height: calc(100% - 56rpx)
position: relative
.Detail-title{
font-weight: 600;
font-size: 32rpx;

7
packageA/pages/browseJob/browseJob.vue
View File

@@ -30,9 +30,8 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobViewRecord>
<empty v-else pdTop="200"></empty>
<empty v-else></empty>
<!-- <loadmore ref="loadmoreRef"></loadmore> -->
</view>
</scroll-view>
</view>
@@ -87,8 +86,6 @@ function toSelectDate() {
});
}
function searchCollection(e) {
const value = e.detail.value;
pageState.search.jobTitle = value;
@@ -216,6 +213,6 @@ image {
.one-cards{
padding: 0 20rpx 20rpx 20rpx;
background: #f4f4f4
height: 100%
}
</style>

6
packageA/pages/choicenessList/choicenessList.vue
View File

@@ -27,7 +27,7 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderCompanys>
<empty v-else pdTop="200"></empty>
<empty v-else is-position></empty>
</view>
</AppLayout>
</template>
@@ -151,6 +151,8 @@ image {
}
.main-list{
background-color: #F4F4F4;
padding: 1rpx 28rpx 28rpx 28rpx
padding: 1rpx 28rpx 28rpx 28rpx;
min-height: calc(100% - 29rpx);
position: relative
}
</style>

5
packageA/pages/collection/collection.vue
View File

@@ -26,7 +26,7 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobCollectionRecord>
<empty v-else pdTop="200"></empty>
<empty v-else></empty>
</view>
</scroll-view>
</swiper-item>
@@ -44,7 +44,7 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderCompanyCollectionRecord>
<empty v-else pdTop="200"></empty>
<empty v-else></empty>
</view>
</scroll-view>
</swiper-item>
@@ -262,6 +262,7 @@ function getCompanyList(type = 'add') {
.swiper{
height: 100%
.mian{
height: 100%
padding: 0 28rpx 28rpx 28rpx
}
}

4
packageA/pages/exhibitors/exhibitors.vue
View File

@@ -83,7 +83,7 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderCompanysOutData>
<empty v-else pdTop="200"></empty>
<empty v-else is-position></empty>
</view>
</scroll-view>
</view>
@@ -433,6 +433,8 @@ image {
background: #F4F4F4;
.views{
padding: 28rpx
min-height: calc(100% - 56rpx);
position: relative
.Detail-title{
font-weight: 600;
font-size: 32rpx;

23
packageA/pages/reservation/reservation.vue
View File

@@ -12,10 +12,19 @@
</view>
</view>
<view class="main">
<scroll-view scroll-y>
<scroll-view class="height-100" scroll-y>
<view v-if="pageState.list.length">
<view class="card" v-for="(item, index) in pageState.list" :key="index">
<view @click="navTo('/packageA/pages/exhibitors/exhibitors?jobFairId=' + item.zphID + '&jobFairName=' + item.zphmc)">
<view
@click="
navTo(
'/packageA/pages/exhibitors/exhibitors?jobFairId=' +
item.zphID +
'&jobFairName=' +
item.zphmc
)
"
>
<view class="card-row">
<Countdown :startTime="item.zphjbsj" :endTime="item.zphjzsj" />
</view>
@@ -37,7 +46,7 @@
</view>
</view>
</view>
<empty v-else pdTop="200"></empty>
<empty v-else></empty>
</scroll-view>
</view>
</view>
@@ -72,7 +81,7 @@ const ranOptions = ref([
]);
function isTimePassed(timeStr) {
if(!timeStr) return false
if (!timeStr) return false;
const targetTime = new Date(timeStr.replace(/-/g, '/')).getTime(); // 兼容格式
const now = Date.now();
return now < targetTime;
@@ -101,10 +110,8 @@ function updateCancel(item) {
$api.msg('取消预约成功');
});
}
}
})
},
});
}
function getList(type = 'add', loading = true) {

4
pages.json
View File

@@ -227,8 +227,8 @@
]
}],
"tabBar": {
"custom": true,
"display": "none",
// "custom": true,
// "display": "none",
"color": "#5E5F60",
"selectedColor": "#256BFA",
"borderStyle": "black",

7
pages/careerfair/careerfair copy.vue
View File

@@ -122,7 +122,7 @@ onLoad(() => {
startDate: currentDate,
});
weekList.value = result;
currentDay.value.fullDate = result[0].fullDate
currentDay.value.fullDate = result[0].fullDate;
getFair('refresh');
});
@@ -162,12 +162,11 @@ function seemsg(index) {
}
const handleScrollToLower = () => {
return
return;
getFair();
console.log('触底');
};
function getFair(type = 'add') {
if (type === 'refresh') {
pageState.page = 1;
@@ -194,7 +193,7 @@ function getFair(type = 'add') {
// const end = fairList.value.length;
// const reslist = rows;
// fairList.value.splice(str, end, ...reslist);
fairList.value = rows
fairList.value = rows;
} else {
fairList.value = rows;
}

4
pages/careerfair/careerfair.vue
View File

@@ -94,10 +94,10 @@
<view class="card-footer">内容简介：{{ item.zphjj }}</view>
</view>
</view>
<empty v-else pdTop="200"></empty>
<empty v-else></empty>
</scroll-view>
</view>
<Tabbar :currentpage="1"></Tabbar>
<!-- <Tabbar :currentpage="1"></Tabbar> -->
</view>
</view>
</template>

65
pages/chat/chat.vue
View File

@@ -63,9 +63,9 @@
<ai-paging ref="paging"></ai-paging>
</view>
<!-- 自定义tabbar -->
<view class="chatmain-footer" v-show="!isDrawerOpen">
<!-- <view class="chatmain-footer" v-show="!isDrawerOpen">
<Tabbar :currentpage="2"></Tabbar>
</view>
</view> -->
</view>
</view>
</template>
@@ -213,27 +213,48 @@ footer-height = 98rpx
background: #FFFFFF;
display: flex
flex-direction: column
.drawer-user
border-top: 1rpx solid rgba(0,0,0,.1);
padding: 20rpx 28rpx
display: flex
.drawer-user {
display: flex;
align-items: center;
width: 100%;
box-sizing: border-box;
padding: 24rpx 32rpx;
padding-bottom: calc(24rpx + constant(safe-area-inset-bottom));
padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
border-top: 1rpx solid rgba(0, 0, 0, 0.06);
background-color: #ffffff;
color: #333333;
font-weight: 500;
align-items: center
position: relative
margin-bottom: calc( 32rpx + var(--window-bottom)); /*兼容 IOS<11.2*/
margin-bottom: calc( 32rpx +var(--window-bottom)); /*兼容 IOS>11.2*/
color: #000000
.drawer-user-img
width: 57.2rpx;
height: 57.2rpx
margin-right: 20rpx
.drawer-user-setting
width: 48rpx
height: 48rpx
position: absolute
top: 50%
right: 28rpx
transform: translate(0,-50%)
font-size: 28rpx;
&:active {
background-color: #f9f9f9;
}
.drawer-user-img {
width: 60rpx;
height: 60rpx;
border-radius: 50%;
margin-right: 24rpx;
background-color: #eee;
flex-shrink: 0;
}
.user-name {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 30rpx;
}
.drawer-user-setting {
width: 48rpx;
height: 48rpx;
margin-left: auto;
opacity: 0.8;
}
}
.drawer-title
height: header-height;
line-height: header-height;

2
pages/index/components/index-one.vue
View File

@@ -142,7 +142,7 @@
</custom-waterfalls-flow>
<loadmore ref="loadmoreRef"></loadmore>
</view>
<empty v-else pdTop="200"></empty>
<empty v-else></empty>
</scroll-view>
</view>
<!-- 筛选 -->

2
pages/index/index.vue
View File

@@ -41,7 +41,7 @@
</swiper>
</view>
<Tabbar v-show="showTabbar" :currentpage="0"></Tabbar>
<!-- <Tabbar v-show="showTabbar" :currentpage="0"></Tabbar> -->
<!-- maskFristEntry -->
<view class="maskFristEntry" v-if="maskFristEntry">

4
pages/mine/mine.vue
View File

@@ -95,9 +95,9 @@
></uni-popup-dialog>
</uni-popup>
</view>
<template #footer>
<!-- <template #footer>
<Tabbar :currentpage="4"></Tabbar>
</template>
</template> -->
</AppLayout>
</template>

2
pages/msglog/msglog.vue
View File

@@ -40,7 +40,7 @@
</swiper>
</view>
<Tabbar :currentpage="3"></Tabbar>
<!-- <Tabbar :currentpage="3"></Tabbar> -->
</view>
</view>
</template>

10
pages/nearby/components/four.vue
View File

@@ -75,8 +75,8 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="60"></empty>
<loadmore ref="loadmoreRef"></loadmore>
<empty v-else></empty>
<loadmore v-show="list.length > pageState.pageSize" ref="loadmoreRef"></loadmore>
</view>
</view>
<!-- 筛选 -->
@@ -340,6 +340,7 @@ defineExpose({ loadData, handleFilterConfirm });
color: #4778EC !important
.nearby-scroll
overflow: hidden;
height: 100%;
.two-head
margin: 22rpx;
display: flex;
@@ -380,8 +381,10 @@ defineExpose({ loadData, handleFilterConfirm });
border-radius: 12rpx 12rpx 12rpx 12rpx;
.nearby-list
border-top: 2rpx solid #EBEBEB;
height: 100%
height: calc(100% - 140rpx)
background: #f4f4f4
.one-cards{
height: 100%
display: flex;
flex-direction: column;
padding: 0 20rpx 20rpx 20rpx;
@@ -389,6 +392,7 @@ defineExpose({ loadData, handleFilterConfirm });
}
.nav-filter
padding: 16rpx 28rpx 0 28rpx
background: #ffffff
.filter-top
display: flex
justify-content: space-between;

8
pages/nearby/components/one.vue
View File

@@ -80,8 +80,8 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="60"></empty>
<loadmore ref="loadmoreRef"></loadmore>
<empty v-else></empty>
<loadmore v-show="list.length > pageState.pageSize" ref="loadmoreRef"></loadmore>
</view>
</view>
<!-- 筛选 -->
@@ -364,11 +364,14 @@ defineExpose({ loadData, handleFilterConfirm });
}
.nearby-scroll
overflow: hidden;
height: 100%;
.nearby-map
height: 767rpx;
background: #e8e8e8;
overflow: hidden
.nearby-list
height: calc(100% - 384rpx)
background: #f4f4f4
.one-cards{
display: flex;
flex-direction: column;
@@ -378,6 +381,7 @@ defineExpose({ loadData, handleFilterConfirm });
}
.nav-filter
padding: 16rpx 28rpx 0 28rpx
background: #ffffff
.filter-top
display: flex
justify-content: space-between;

11
pages/nearby/components/three.vue
View File

@@ -101,8 +101,8 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="60"></empty>
<loadmore ref="loadmoreRef"></loadmore>
<empty v-else></empty>
<loadmore v-show="list.length > pageState.pageSize" ref="loadmoreRef"></loadmore>
</view>
</view>
<!-- 筛选 -->
@@ -359,8 +359,9 @@ defineExpose({ loadData, handleFilterConfirm });
color: #4778EC !important;
.nearby-scroll
overflow: hidden;
height: 100%
.three-head
margin: 24rpx 0 0 0;
// margin: 24rpx 0 0 0;
padding: 26rpx 0 0 0;
border-radius: 17rpx 17rpx 17rpx 17rpx;
.one-picker
@@ -482,7 +483,10 @@ defineExpose({ loadData, handleFilterConfirm });
z-index: 1;
.nearby-list
border-top: 2rpx solid #EBEBEB;
height: calc(100% - 222rpx)
background: #f4f4f4
.one-cards{
height: 100%
display: flex;
flex-direction: column;
padding: 0 20rpx 20rpx 20rpx;
@@ -490,6 +494,7 @@ defineExpose({ loadData, handleFilterConfirm });
}
.nav-filter
padding: 16rpx 28rpx 0 28rpx
background: #ffffff
.filter-top
display: flex
justify-content: space-between;

9
pages/nearby/components/two.vue
View File

@@ -71,8 +71,8 @@
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="60"></empty>
<loadmore ref="loadmoreRef"></loadmore>
<empty v-else></empty>
<loadmore v-show="list.length > pageState.pageSize" ref="loadmoreRef"></loadmore>
</view>
</view>
<!-- 筛选 -->
@@ -255,6 +255,7 @@ defineExpose({ loadData, handleFilterConfirm });
color: #4778EC !important
.nearby-scroll
overflow: hidden;
height: 100%;
.two-head
margin: 22rpx;
display: flex;
@@ -284,14 +285,18 @@ defineExpose({ loadData, handleFilterConfirm });
border-radius: 12rpx 12rpx 12rpx 12rpx;
.nearby-list
border-top: 2rpx solid #EBEBEB;
height: calc(100% - 252rpx)
background: #f4f4f4
.one-cards{
display: flex;
flex-direction: column;
padding: 0 20rpx 20rpx 20rpx;
background: #f4f4f4
height: 100%
}
.nav-filter
padding: 16rpx 28rpx 0 28rpx
background: #ffffff
.filter-top
display: flex
justify-content: space-between;