YoGo/SFH5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

顺丰H5提交页面

Browse Source
This commit is contained in:
有果 2026-04-03 17:31:02 +08:00
parent 70f375c3f1
commit b7db466328
8 changed files with 194 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
App.vue
View File

@ -86,7 +86,12 @@ export default {
this.globalData.statusBarHeight = statusBarHeight || 20;
// #endif
// authCode url 存在 就直接登陆
console.log(window.location.href,"window.location.href")
const authCode = getQueryParam('authCode');
const sfId = getQueryParam('sfId');
if(sfId) {
uni.setStorageSync("sfId", sfId);
}
if(authCode){
let source = window.sf.isSfApp() ? 2 : 1;
getApi.ShunFengLogin({
@ -207,7 +212,7 @@ text {
.uni-tabbar__label {
color: #000;
font-size: 24rpx !important;
margin-top: 12rpx;
margin-top: 4rpx;
}
.uni-tabbar__item.call-phone-item {

2
index.html
View File

@ -12,7 +12,7 @@
<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" /> -->
<link rel="icon" href="/favicon.ico" />
<script src="/client/config.js"></script>
<script src="./config.js"></script>
<script src="https://ucmp-static.sf-express.com/assets/sdks/microservice-1.0.4.min.js"></script>
<script>
const sf = new SFUIP.SfMicroservice(window?.config?.ENV??'sit')

2
manifest.json
View File

@ -75,7 +75,7 @@
"vueVersion" : "3",
"h5" : {
"router" : {
"base" : "/client/"
"base" : "./"
},
"devServer" : {
"port" : 8999,

193
pages/index/index.vue
View File

@ -31,19 +31,19 @@
<text class="address font26 fontb textGary">{{ unitTypeData[0]?.sitdAddress }}</text>
</view>
</view>
<view class="unitType card">
<view class="unitType card" v-if="unitTypeData.length">
<view class="title font32 fontb mgb20">
仓型选择
</view>
<view class="swiper">
<view class="swiper" >
<view class="info">
<view class="left arrow">
<view class="arrowIcon" @click="prev" v-if="unitTypeData.length > 1">
<image src="/static/home/jiantouleft.svg" style="width: 64rpx;height: 64rpx;" class="icon"></image>
</view>
</view>
<view class="swiper-container">
<swiper class="warehouse-detail" circular style="height: 300rpx;" :indicator-dots="false"
<view class="swiper-container" >
<swiper class="warehouse-detail" circular style="height: 300rpx;" :indicator-dots="false"
:autoplay="false" @change="changeMove" :current="state.active">
<swiper-item v-for="(item, index) in unitTypeData" :key="index">
<view class="warehouse-detail-items">
@ -52,6 +52,7 @@
</view>
</swiper-item>
</swiper>
</view>
<view class="right arrow">
<view class="arrowIcon" @click="next" v-if="unitTypeData.length > 1">
@ -70,6 +71,9 @@
<view class="font26 fontb textGary">({{ unitTypeData[state.active].description }})</view>
</view>
</view>
<view class="empt font32 fontb" v-if="unitTypeData.length === 0" style="text-align: center;margin-top: 20rpx;">
暂无可用仓型，请选择其他门店～
</view>
<view class="orderInfo sflist card" v-if="unitTypeData.length">
<ul>
<li @click="showUnitPopup">
@ -89,6 +93,12 @@
<image src="/static/home/jiantou.svg" style="width: 24rpx;height: 24rpx;" class="icon"></image>
</view>
</li>
<!-- <li @click="showCalendar">
<view class="left"><text class="font32 fontb">开始时间</text></view>
<view class="right font26 fontb"><text>{{ dayjs(state.startDate).format("YYYY/MM/DD") }}</text>
<image src="/static/home/jiantou.svg" style="width: 24rpx;height: 24rpx;" class="icon"></image>
</view>
</li> -->
<li>
<view class="left"><text class="font32 fontb">租金</text></view>
<view class="right font26 fontb" :class="{textGary:!state.priceData?.price}"><text>{{ state.priceData?.price ? `￥ ${state.priceData?.price}` :
@ -125,8 +135,8 @@
<view class="left " >
<text class="price fontb" :class="{ overMaxFont: String(state.priceData?.expense).length>6 }"> {{ state.priceData.expense ? `￥${state.priceData.expense}` : '￥--'
}}</text>
<view class="detail" v-if="state.priceData.expense" @click="showPayPopup"><text style="margin-right: 10rpx;font-weight: 600;" :class="{ overMaxFont:String(state.priceData?.expense).length>6 }" v-if="state.priceData?.expense">￥{{ state.priceData.leaseOriginalPrice }}</text><text>明细</text>
<image src="/static/home/jiantouup.svg" style="height: 12rpx;margin-left: 10rpx;" mode="heightFix" class="icon"></image>
<view class="detail" v-if="state.priceData.expense" @click="showPayPopup"><text class="detail1" :class="{ overMaxFont:String(state.priceData?.expense).length>6 }" v-if="state.priceData?.expense">￥{{ state.priceData.leaseOriginalPrice }}</text><text class="detail2">明细</text>
<image src="/static/home/jiantouup.svg" style="height: 10rpx;margin-left: 10rpx;" mode="heightFix" class="icon"></image>
</view>
</view>
<view class="right">
@ -142,10 +152,6 @@
</view>
</view>
</view>
<view class="empt font32 fontb" v-if="unitTypeData.length === 0" style="text-align: center;margin-top: 20rpx;">
暂无可用仓型，请选择其他门店～
</view>
</template>
<template v-else>
@ -348,7 +354,7 @@
<view class="left font28">
<text class="price fontb" :class="{ overMaxFont: String(state.priceData?.expense).length>6 }"> {{ state.priceData.expense ? `￥${state.priceData.expense}` : '--'
}}</text>
<view class="detail" v-if="state.priceData.expense" @click="hidePayPopup"><text style="margin-right: 10rpx;font-weight: 600;" :class="{ overMaxFont: String(state.priceData?.expense).length>6 }" v-if="state.priceData?.expense">￥{{ state.priceData.leaseOriginalPrice }}</text><text class="font28">明细</text>
<view class="detail" v-if="state.priceData.expense" @click="hidePayPopup"><text class="detail1" :class="{ overMaxFont: String(state.priceData?.expense).length>6 }" v-if="state.priceData?.expense">￥{{ state.priceData.leaseOriginalPrice }}</text><text class="detail2">明细</text>
<image src="/static/home/jiantouup.svg" style="height: 12rpx;margin-left: 10rpx;" mode="heightFix" class="icon"></image>
</view>
</view>
@ -422,6 +428,17 @@
</view>
</view>
</uv-popup>
<uv-calendars
customStyle="width: 710rpx; border-radius: 24rpx;"
:safeAreaInsetBottom="false" :closeOnClickOverlay="false"
ref="calendars"
:start-date="state.minDate"
:date = "state.startDate"
confirmText="Confirm"
cancelText="Cancel"
:end-date="state.maxDate"
@confirm="calendarConfirm"
/>
</view>
</template>
@ -467,6 +484,7 @@ const openPopupRef = ref(null);
const unitPopupRef = ref(null);
const monthPopupRef = ref(null);
const payPopupRef = ref(null);
const calendars = ref(null);
// 导航栏高度
const navHeight = ref(0);
const language = ref("");
@ -511,6 +529,31 @@ const state = ref({
p: 'margin: 0.8rem 0;',
},
});
const showCalendar = () => {
calendars.value.open();
};
const calendarConfirm = (e) => {
const fullDate = dayjs(e.fulldate); // 保持 dayjs 对象
if (state.value.zhuangxiuzhong) {
const limitDate = dayjs(state.value.lockData.preSaleTime);
if (fullDate.isBefore(limitDate)) {
uni.showModal({
title: t("common.title"),
content: t("storeRenovationNotice", {
limitDate: limitDate.format("YYYY/MM/DD")
}),
showCancel: false,
});
return;
} else {
state.value.startDate = fullDate.format("YYYY/MM/DD");
}
} else {
state.value.startDate = fullDate.format("YYYY/MM/DD");
}
};
const closePopup = () => {
openPopupRef.value.close();
@ -524,6 +567,8 @@ const callPhone = ()=>{
closePopup();
}
const goOrder = async () => {
if (!state.value.lockerId) {
return uni.showToast({
@ -570,7 +615,8 @@ const goOrder = async () => {
lockerId: state.value.lockerId,
startTime,
month: state.value.month,
source
source,
sfId: uni.getStorageSync("sfId"),
})
.then((res) => {
uni.hideLoading();
@ -811,6 +857,7 @@ const prev = () => {
} else {
state.value.active = unitTypeData.value.length - 1; // 如果是第一张，跳到最后一张
}
state.value.unitTypeId = unitTypeData.value[state.value.active].id;
}
// 切换到下一张
const next = () => {
@ -819,6 +866,7 @@ const next = () => {
} else {
state.value.active = 0; // 如果是最后一张，跳到第一张
}
state.value.unitTypeId = unitTypeData.value[state.value.active].id;
}
onShareAppMessage((res) => {
@ -882,7 +930,7 @@ const getSiteDetail = () => {
district,
}).then(res => {
if (res.code === 200) {
list = mergeFiveGoatStores(res.data);
list = mergeFiveGoatStores(res.data.filter(item => !item.isSoldOut && item.city.indexOf("广州") !== -1));
if (locationState?.latitude && locationState?.longitude) {
const { latitude, longitude } = locationState;
list.forEach(item => {
@ -1123,11 +1171,10 @@ const gotoPage = (url) => {
// tab
const current = ref(0);
const unitTypeData = ref([]);
const tabs = ref([]);
function changeMove(event) {
current.value = event.detail.current;
state.value.unitTypeId = unitTypeData.value[current.value].id;
state.value.active = event.detail.current;
state.value.unitTypeId = unitTypeData.value[state.value.active].id;
}
</script>
@ -1229,32 +1276,60 @@ function changeMove(event) {
color: #FFFFFF;
.left {
color: #E9CBA1;
color: #E9CBA1;
display: flex;
align-items: center;
font-size: 38rpx;
.price {
font-size: 38rpx;
&::first-letter{
font-size: 30rpx;
}
&.overMaxFont{
font-size: 30rpx;
&::first-letter{
font-size: 28rpx;
font-weight: normal;
}
}
}
.detail {
display: flex;
align-items: center;
font-size: 38rpx;
.price {
&.overMaxFont{
font-size: 32rpx;
}
}
.detail {
display: flex;
align-items: center;
margin-left: 16rpx;
color: #FFFFFF;
font-size: 28rpx;
.overMaxFont{
font-size: 24rpx;
}
image {
margin-left: 10rpx;
transform: rotate(180deg);
}
}
color: #d0d1d2;
margin-left: 16rpx;
font-size: 28rpx;
font-weight: normal;
// .overMaxFont{
// font-size: 24rpx;
// }
.detail1{
font-size: 28rpx;
}
.detail2{
padding-left: 10rpx;
font-size: 26rpx;
display: flex;
align-items: center;
// border-left:1px solid #4a4d51;
&::before{
content: '';
display: block;
width: 1px;
height: 30rpx;
border-radius: 50%;
background-color: #4a4d51;
margin-right: 10rpx;
}
}
image{
margin-left: 10rpx;
transform: rotate(180deg);
}
}
}
.right {
display: flex;
@ -1447,7 +1522,7 @@ function changeMove(event) {
display: flex;
width: 100%;
padding-bottom: 16rpx;
padding-left: 40rpx;
padding-left: 36rpx;
.check-wrap {
pointer-events: none;
@ -1540,21 +1615,51 @@ function changeMove(event) {
align-items: center;
font-size: 38rpx;
.price {
font-size: 38rpx;
&::first-letter{
font-size: 30rpx;
}
&.overMaxFont{
font-size: 32rpx;
font-size: 30rpx;
&::first-letter{
font-size: 28rpx;
font-weight: normal;
}
}
}
.detail {
display: flex;
align-items: center;
color: #FFFFFF;
color: #d0d1d2;
margin-left: 16rpx;
font-size: 28rpx;
.overMaxFont{
font-size: 24rpx;
font-weight: normal;
// .overMaxFont{
// font-size: 24rpx;
// }
.detail1{
font-size: 28rpx;
}
.detail2{
padding-left: 10rpx;
font-size: 26rpx;
display: flex;
align-items: center;
// border-left:1px solid #4a4d51;
&::before{
content: '';
display: block;
width: 1px;
height: 30rpx;
border-radius: 50%;
background-color: #4a4d51;
margin-right: 10rpx;
}
}
image{
margin-left: 10rpx;
transform: rotate(180deg);
}
}

7
pages/site/index.vue
View File

@ -122,7 +122,7 @@ onLoad((params) => {
const getCityData = () => {
getApi.GetCityAll().then(res => {
if(res.code === 200) {
state.value.cityData = res.data;
state.value.cityData = res.data.filter(item=>item.indexOf("广州") !== -1);
state.value.cityData.unshift("全部");
// 首次直接选择全部
state.value.city = state.value.cityData[0];
@ -161,7 +161,7 @@ const getCityData = () => {
district,
}).then(res => {
if (res.code === 200) {
siteData.list = mergeFiveGoatStores(res.data);
siteData.list = mergeFiveGoatStores(res.data.filter(item => !item.isSoldOut && item.city.indexOf("广州") !== -1));
if (locationState?.latitude && locationState?.longitude) {
const { latitude, longitude } = locationState;
siteData.list.forEach(item => {
@ -205,6 +205,9 @@ onShow(() => {
height: 100vh;
padding-bottom: 100rpx;
position: relative;
.content{
padding-bottom: 200rpx;
}
}
.selectSite {

12
pages/unlock/index.vue
View File

@ -1,6 +1,6 @@
<template>
<view class="header">
<uv-tabs @change="handleChange" :current="state.current" :activeStyle="{fontWeight:600}" lineWidth="80rpx" lineHeight="6rpx"
<uv-tabs @change="handleChange" :current="state.current" :activeStyle="{fontWeight:600,color: '#000000',fontSize: '32rpx'}" :inactiveStyle="{ color: '#000000',fontSize: '32rpx' }" lineWidth="80rpx" lineHeight="6rpx"
lineColor="#FF1E2E" :scrollable="false" :list="list">
</uv-tabs>
</view>
@ -99,14 +99,14 @@
</view>
<view class="empt font32 fontb"
style="text-align: center;position: absolute; top: 50%;left: 50%;transform: translate(-50%, -50%);"
v-if="state.orderList.length === 0">
v-if="currentOrderList.length === 0">
暂无订单
</view>
<view class="footer">
<myCustomtTabBar direction="horizontal" :show-icon="true" :selected="1" @onTabItemTap="onTabItemTap">
</myCustomtTabBar>
</view>
<uv-popup ref="detailPopupRef" zIndex="999" round="24px">
<uv-popup ref="detailPopupRef" zIndex="999" round="24px" :safeAreaInsetBottom="false">
<view class="popupBox popupBoxW710">
<view class="orderList">
<view class="orderInfo">
@ -354,7 +354,7 @@
state.priceData.expense ? `￥${state.priceData.expense}`
: '--' }}</text>
<view class="detail" v-if="state.priceData.expense" @click="hidePayPopup"><text
style="margin-right: 10rpx;font-weight: 600;"
class="detail1"
:class="{ overMaxFont: String(state.priceData?.expense).length > 6 }"
v-if="state.priceData?.expense">￥{{ state.priceData.leaseOriginalPrice }}</text>
<!-- <text
@ -1363,7 +1363,7 @@ onShow(() => {
border-radius: 999rpx;
display: flex;
justify-content: space-between;
align-items: center;
// align-items: center;
background-color: #0D1118;
color: #FFFFFF;
@ -1383,7 +1383,7 @@ onShow(() => {
display: flex;
align-items: center;
margin-left: 20rpx;
color: #FFFFFF;
color: #d0d1d2;
font-size: 28rpx;
.overMaxFont {

7
pagesb/validationInfo/index.vue
View File

@ -17,7 +17,7 @@
<uv-input placeholder="请选择" placeholderStyle="font-weight: 600;font-size: 28rpx;color:#A8AAAC;" v-model="state.cardTypeText" disabled disabledColor="#ffffff"
border="none"></uv-input>
<template #right>
<image src="/static/home/jiantou.svg" style="width: 44rpx;height: 24rpx;" class="icon"></image>
<image src="/static/home/jiantou.svg" style="width: 22rpx;height: 24rpx;" class="icon"></image>
</template>
</uv-form-item>
@ -512,7 +512,7 @@ const updateAuthInfo = () => {
state.showAuthModal = true;
if (res.data && requestData.type !== 2) {
if (pages.length >= 2) {
if (pages[pages.length - 2].route == 'pages/setOrder/index') {
if (pages[pages.length - 2].route == 'pages/index/index') {
navigateBack()
return
}
@ -564,7 +564,8 @@ const updateAuthInfo = () => {
}
:deep(.uv-form-item__body) {
padding: 20rpx;
padding: 20rpx 0;
}
.ImgUpload{
// margin-left: auto; /* 左边自动占满 → 右对齐 */

26
utils/common.js
View File

@ -261,10 +261,17 @@ export const parseUrlParams = (url) => {
// 顺丰参数
export const shunfenLogin = async (code) => {
// 授权参数（请根据实际情况修改）reserved 传原参
const authOptions = {
let successUrl = window?.config?.BACK_URL ?? "https://uat.kingkongcang.com/client/"
// 如果顺丰员工Id 存在 就把sfId 传过去 怕授权的时候url参数丢失
const sfId = uni.getStorageSync("sfId");
if(sfId){
successUrl = successUrl+"?sfId="+sfId
}
console.log(successUrl,"successUrl")
const authOptions = {
appId: window?.config?.SF_APP_ID ??"202603041358374970", // 第三方接入ID
scope: ["sf_userinfo", "sf_mobile", "sf_base", "sf_emp", "sf_channelId"],
successUrl: window?.config?.BACK_URL ?? "https://uat.kingkongcang.com/client/", // 当前页面地址
successUrl, // 当前页面地址
};
window.sf.getAuthCode({
...authOptions,
@ -307,6 +314,17 @@ const authOptions = {
}
// 获取url 参数
export const getQueryParam = (name, url = window.location.href) => {
const params = new URL(url).searchParams;
return params.get(name);
const u = new URL(url)
// 优先从正常 query 取
let params = new URLSearchParams(u.search)
let value = params.get(name)
if (value) return value
// 再从 hash 取
const hash = u.hash.split('?')[1]
if (!hash) return null
params = new URLSearchParams(hash)
return params.get(name)
}