Selaa lähdekoodia

feat(login): 增加登录页头部导航栏及三方主题支持

- 在manifest.json和pages.json中添加自定义导航样式配置
- 登录页新增wd-navbar组件,实现自定义透明头部导航栏
- 登录页H5端使用三方名称及logo替换默认内容
- 登录逻辑中增加输出redirectName调试信息
- my页退出登录时调用async $reset方法重置用户状态
- sys仓库新增thirdPartyName和thirdPartyLogo状态字段及获取逻辑
- 调用接口获取三方名称和logo并保存到状态中
- 购物车组件中删除按钮颜色改为白色,提高可见性
zhangtao 6 päivää sitten
vanhempi
commit
f42abcf5de

+ 2 - 1
src/pages.json

@@ -39,7 +39,8 @@
       "name": "smqjh-login",
       "islogin": false,
       "style": {
-        "navigationBarTitleText": "市民请集合"
+        "navigationBarTitleText": "市民请集合",
+        "navigationStyle": "custom"
       }
     },
     {

+ 18 - 1
src/pages/login/index.vue

@@ -8,9 +8,11 @@ definePage({
   islogin: false,
   style: {
     navigationBarTitleText: '市民请集合',
+    navigationStyle: 'custom',
   },
 })
 const { token, redirectName, userInfo } = storeToRefs(useUserStore())
+const { thirdPartyName, thirdPartyLogo } = storeToRefs(useSysStore())
 const { data, send } = useRequest((code, phoneCode) => Apis.sys.auth({ params: {
   grant_type: 'wechat',
   code,
@@ -23,6 +25,9 @@ const code = ref('')
 // 验证码倒计时
 const countdown = ref(0)
 const isSending = ref(false)
+onMounted(() => {
+  console.log(redirectName.value, '==================================')
+})
 // 发送验证码
 async function handleSendCode() {
   if (!phone.value) {
@@ -71,6 +76,8 @@ async function handleLogin() {
     useGlobalToast().show('登录成功')
     const user = await Apis.general.get_smqjh_system_app_api_v1_members_me()
     userInfo.value = user.data as Api.userInfo
+    console.log(redirectName.value, '==========redirectName.value')
+
     setTimeout(() => {
       if (tabList.includes(redirectName.value)) {
         router.pushTab({ path: redirectName.value })
@@ -121,6 +128,11 @@ function goBack() {
   <view>
     <!-- #ifdef MP-WEIXIN -->
     <view class="header px24rpx">
+      <wd-navbar
+        title="市民请集合" custom-style="background-color:transparent !important" :bordered="false" :z-index="99"
+
+        safe-area-inset-top placeholder fixed
+      />
       <view class="pt150rpx">
         <view class="w-full flex items-center justify-center">
           <image
@@ -144,9 +156,14 @@ function goBack() {
     <!-- #endif -->
     <!-- #ifdef H5 -->
     <view class="login-page min-h-100vh px48rpx">
+      <wd-navbar
+        :title="thirdPartyName" custom-style="background-color:transparent !important" :bordered="false" :z-index="99"
+
+        safe-area-inset-top placeholder fixed
+      />
       <view class="w-full flex items-center justify-center pt40rpx">
         <image
-          :src="`${StaticUrl}/smqjh-logo.png`"
+          :src="`${thirdPartyLogo}`"
           class="h120rpx w120rpx"
         />
       </view>

+ 1 - 1
src/pages/my/index.vue

@@ -27,7 +27,7 @@ function handleLoginOut() {
     title: '提示',
     msg: '确定要退出登录吗?',
     success: async () => {
-      useUserStore().$reset()
+      await useUserStore().$reset()
       useSmqjhCartStore().$reset()
       useAddressStore().$reset()
       useTabbar().setTabbarItem('smqjh-cart', 0)

+ 12 - 0
src/store/sys.ts

@@ -36,6 +36,14 @@ interface SysState {
    * 如果是组件模式加tabbar,从订单详情返回订单列表页面需要刷新,监听此字段刷新页面
    */
   refreshOrderList: boolean
+  /**
+   * 第三方名称
+   */
+  thirdPartyName: string
+  /**
+   * 三方logo
+   */
+  thirdPartyLogo: string
 
 }
 export const useSysStore = defineStore('system', {
@@ -48,6 +56,8 @@ export const useSysStore = defineStore('system', {
     opcity: 0,
     isOnlineAudit: true,
     refreshOrderList: false,
+    thirdPartyName: '',
+    thirdPartyLogo: '',
   }),
   actions: {
     getSystemData() {
@@ -103,6 +113,8 @@ export const useSysStore = defineStore('system', {
      */
     async getThirdPartyThemeColor() {
       const res = await Apis.sys.appAccess({ pathParams: { accessId: 'ch_001' } })
+      this.thirdPartyName = res.data.accessName
+      this.thirdPartyLogo = res.data.logoUrl
       useManualThemeStore().setCurrentThemeColor({ name: '三方主题色', value: 'blue', primary: res.data.themeMainColor })
     },
 

+ 2 - 2
src/subPack-xsb/commonTab/components/cart.vue

@@ -36,8 +36,8 @@ onMounted(async () => {
     <view class="-mt220rpx">
       <view class="content px24rpx">
         <view v-if="cartList.length" class="mb20rpx flex items-center justify-end">
-          <view class="text-24rpx text-[#AAAAAA]" @click="cartStore.cartDeleteGoods">
-            <wd-icon name="delete" size="24rpx" /> 清空购物车
+          <view class="text-24rpx text-[#fff]" @click="cartStore.cartDeleteGoods">
+            <wd-icon name="delete" size="24rpx" color="#fff" /> 清空购物车
           </view>
         </view>
         <scroll-view scroll-y class="content">