显示导航条

src/views/mall/components/details.vue

@@ -1,13 +1,7 @@
 <!-- 商品详情 -->
 <template>
-  <div class="default-width py-5" v-if="state.goodsInfo && Object.keys(state.goodsInfo).length">
-    <div class="d-flex justify-space-between">
-      <v-btn class="mb-3" size="large" color="primary" variant="text" @click="goBack"><v-icon size="24" class="mt-1 mr-1">mdi-chevron-triple-left</v-icon>返回商城</v-btn>
-      <div v-if="getToken()">
-        <v-btn class="mb-3" size="large" color="primary" variant="text" prepend-icon="mdi-account-circle-outline" to="/mall/user/order">我的订单</v-btn>
-        <v-btn class="mb-3 ml-1" size="large" color="primary" variant="text" prepend-icon="mdi-cart-outline" to="/mall/cart">购物车</v-btn>
-      </div>
-    </div>
+  <Navbar class="mb-3" hideSearch />
+  <div class="default-width pb-5" v-if="state.goodsInfo && Object.keys(state.goodsInfo).length">
     <v-card class="carousel border-radius-8 white-bgc pa-5" style="width: 100%;">
       <div class=" d-flex">
         <!-- 图片展示-轮播 -->
@@ -85,6 +79,7 @@
 
 <script setup>
 defineOptions({name: 'goods-details'})
+import Navbar from '@/views/mall/components/navbar.vue'
 import { getProductDetail } from '@/api/mall/product'
 import { addCart } from '@/api/mall/cart'
 import selectSku from './details/s-select-sku.vue'
@@ -221,11 +216,6 @@ const loginClose = () => {
   Snackbar.warning('您已取消登录')
 }
 
-const goBack = () => {
-  // router.go(-1)
-  router.push('/mall')
-}
-
 </script>
 <style lang="scss" scoped>
 .border-radius-8 {

src/views/mall/components/navbar.vue

@@ -23,7 +23,7 @@
           购物车
         </span>
       </div>
-      <div class="search d-flex align-center">
+      <div v-if="!props.hideSearch" class="search d-flex align-center">
         <v-text-field
           v-model="inputVal"
           placeholder="请输入关键词"
@@ -48,6 +48,12 @@ import { computed, ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { getToken } from '@/utils/auth'
 import Snackbar from '@/plugins/snackbar'
+const props = defineProps({
+  hideSearch: {
+    type: Boolean,
+    default: false,
+  },
+})
 
 const emit = defineEmits(['login', 'pointExchange'])
 const router = useRouter()