详情部分

2023-07-20 19:03:08 +08:00
parent 4adeb65dbd
commit 8cc4549dca
14 changed files with 331 additions and 24 deletions
--- a/src/components/detail/breadcrumb.vue
+++ b/src/components/detail/breadcrumb.vue
@@ -0,0 +1,180 @@
+<template>
+    <div class="title-top-box">
+        <div class="breadcrumb-box">
+            <el-breadcrumb :separator-icon="ArrowRight">
+                <el-breadcrumb-item v-for="(item, i) in storeData" :key="i" :to="{ path: item.path }">
+                    <span class="breadcrumb-text">
+                        {{ item.title }}
+                    </span>
+                </el-breadcrumb-item>
+            </el-breadcrumb>
+        </div>
+        <div class="dis-f al-item jus-bet title-box">
+            <div class="detail-title">
+                房东直租 | 中城浸教公大理公，近地铁，新装修，两房一厅，采光通风好，设备齐全拎包入住
+            </div>
+            <div class="tool-btn-box dis-f al-item">
+                <div class="btn-s dis-f al-item jus-x">
+                    <img src="../../assets/img/detail/collect.png" class="img" alt="">
+                    <img src="../../assets/img/detail/collectT.png" v-show="false" class="img" alt="">
+                    <span class="mg-l-5">
+                        {{'收藏'}}
+                    </span>
+                </div>
+                <div class="line">
+
+                </div>
+                <div class="btn-s dis-f al-item jus-x">
+                    <img src="../../assets/img/detail/forward.png" class="img" alt="">
+                    <span class="mg-l-5">
+                        转发
+                    </span>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+  
+<script setup>
+import { ArrowRight } from '@element-plus/icons-vue'
+import { reactive, onMounted, ref, defineProps } from 'vue'
+import store from '@/store'
+
+defineProps({
+    data: {
+        type: Array,
+        default: function () {
+            return []
+        }
+    }
+})
+
+//导航数据
+let storeData = store.state.routeList
+console.log(storeData)
+
+</script>
+<style scoped>
+img {
+    object-fit: contain;
+}
+
+.dis-f {
+    display: flex;
+}
+
+.jus-x {
+    justify-content: center;
+}
+
+.al-item {
+    align-items: center;
+}
+
+.pos-r {
+    position: relative;
+}
+
+.body-maxWidth {
+    width: 1200px;
+    min-width: 1200px;
+}
+
+.s-w-100 {
+    width: 100%;
+}
+
+.jus-bet {
+    justify-content: space-between;
+}
+
+.title-top-box {
+    width: 1200px;
+    height: 186px;
+    background: inherit;
+    background-color: rgba(255, 255, 255, 1);
+    box-sizing: border-box;
+    border-width: 1px;
+    border-style: solid;
+    border-color: rgba(235, 235, 235, 1);
+    border-radius: 16px;
+    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+    font-size: 14px;
+    transform: translateY(-38px);
+
+    .breadcrumb-box {
+        padding: 20px;
+        border-bottom: 1px solid #ebebeb;
+
+        .breadcrumb-text {
+            font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+            font-weight: 400;
+            font-style: normal;
+            color: #AAAAAA;
+        }
+    }
+
+    .title-box {
+        padding: 20px 20px 25px 20px;
+
+        .detail-title {
+            font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+            font-weight: 400;
+            font-style: normal;
+            font-size: 24px;
+            color: #000000;
+            line-height: 35px;
+            width: 820px;
+        }
+
+        .tool-btn-box {
+            width: 244px;
+            height: 48px;
+            background: inherit;
+            background-color: rgba(246, 246, 246, 1);
+            box-sizing: border-box;
+            border-width: 1px;
+            border-style: solid;
+            border-color: rgba(235, 235, 235, 1);
+            border-radius: 9px;
+            -moz-box-shadow: none;
+            -webkit-box-shadow: none;
+            box-shadow: none;
+            font-size: 14px;
+            justify-content: center;
+
+            .mg-l-5{
+                margin-left: 5px;
+            }
+
+            .btn-s {
+                color: #333333;
+                font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+                font-weight: 400;
+                font-style: normal;
+                text-align: center;
+                width:80px;
+                height:40px;
+                line-height:40px;
+                cursor: pointer;
+                .img{
+                    width:20px;
+                    height:20px;
+                }
+            }
+
+            .line {
+                width: 1px;
+                height: 21px;
+                background: #d7d7d7;
+                margin:0 15px;
+            }
+        }
+    }
+
+
+}
+</style>
+  
--- a/src/components/pageTopBar/pageTopBar.vue
+++ b/src/components/pageTopBar/pageTopBar.vue
@@ -1,6 +1,6 @@
 <template>
  <div class="top-bg-img-box pos-r" :style="{ 'height': routePath === '/' ? '568px' : '260px' }">
-    <img src="../../assets/homeImage/indexBg.png" class="bg-img" alt="">
+    <img src="../../assets/img/edit/bj-img1920.png" class="bg-img" alt="">
    <div class="info-box">
      <!-- 顶部导航 -->
      <div class="dis-f jus-x al-item index-top-navigation-box">
--- a/src/components/seachModule/seachModule.vue
+++ b/src/components/seachModule/seachModule.vue
@@ -143,7 +143,7 @@ let getLocationData = (data) => {
 const route = useRouter()
 let routePath = ref('')
 routePath.value = route.currentRoute.value.path
-console.log(route)
+// console.log(route)

 watchEffect(() => {
    seachSchoolBtn.data = store.state.seachTypeData[0] ? store.state.seachTypeData[0].where : []
@@ -159,7 +159,7 @@ historyArr.data = JSON.parse(localStorage.getItem('historyArr')) || []

 //搜索数据
 let seachList = (item) => {
-    console.log(123)
+    // console.log(123)
    let string=seachAllType.keyword
    if (!string.replace(/\s/g, "")) return
    if (historyArr.data.indexOf(seachAllType.keyword) === -1) {
--- a/src/components/selectTabBox/selectTabBox.vue
+++ b/src/components/selectTabBox/selectTabBox.vue
@@ -426,6 +426,9 @@ let selectSeach = (data = []) => {
    if (data.length === 0 && selectTabCheck.id) {
        data.push(selectTabCheck.id)
    }
+    // console.log(selectData,selectTabCheck)
+    // store.state.routeList['hireTypeObj']=JSON.parse(JSON.stringify(hireTypeObj))
+    // return
    setSeachCondition('location', data)
 }

@@ -478,6 +481,7 @@ let setHireId = (item) => {
 let dropdownCommand = (obj) => {
    hireTypeObj.id = obj.id
    hireTypeObj.title = obj.title
+    store.state.routeList['hireTypeObj']=JSON.parse(JSON.stringify(hireTypeObj))
    setSeachCondition('types', obj.id)
 }

@@ -555,7 +559,7 @@ let cleanSelect = () => {
 //根据路由设置参数
 let setRouterQuerySet = ref(true)
 let routerQuerySet = () => {
-    console.log(setRouterQuerySet.value)
+    // console.log(setRouterQuerySet.value)
    if (!setRouterQuerySet.value) return
    //路由参数设置
    if (Object.keys(routeQuery.data).length > 0) {