系统通知

2023-07-14 17:21:53 +08:00
parent fbfae2d4fc
commit 89d8462f7b
21 changed files with 492 additions and 104 deletions
--- a/src/views/detail.vue
+++ b/src/views/detail.vue
@@ -0,0 +1,11 @@
+<template>
+    详情页
+</template>
+
+<script setup>
+import { useRoute } from 'vue-router';
+const route = useRoute()
+const uniqid = route.query.uniqid
+</script>
+
+<style lang="less" scoped></style>
--- a/src/views/edit.vue
+++ b/src/views/edit.vue
@@ -293,7 +293,7 @@
                                            <div class="semicircle-outside"></div>
                                        </div>
                                    </div>
-                                    <div class="area-right flex1">
+                                    <div class="area-right flex1 scrollbar">
                                        <div class="area-item flexacenter"
                                            :class="{ 'pitchpitch': info['location'] == index }"
                                            v-for="(item, index) in locationData[locationValue].data" :key="index"
@@ -371,7 +371,7 @@

                            </template>

-                            <div class="residential-area">
+                            <div class="residential-area scrollbar">
                                <div class="residential-item flexacenter" v-for="item in communityList" :key="item.id"
                                    @click="clickResidentialArea(item.id, item.name)">
                                    <div class="residential-dot"></div>
@@ -547,7 +547,7 @@
        <div class="pop area-pop-box radius16 target-area" @click.stop="">
            <div class="area-pop-header">目标区域</div>
            <div class="area-box flexflex">
-                <div class="target-area-left flex1">
+                <div class="target-area-left flex1 scrollbar">

                    <div class="target-area-item" v-for="(item, index) in locationData" :key="index">
                        <div class="target-area-head">{{ item.name }}</div>
@@ -2321,14 +2321,12 @@ export default {
    &.type-pop-box {
        width: 640px;
        height: 181px;
-        background: inherit;
        background-color: rgba(255, 255, 255, 1);
        border: 1px solid rgba(235, 235, 235, 1);
        -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
        -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
        box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
        padding: 30px;
-
        position: absolute;
        top: 58px;

@@ -2479,37 +2477,18 @@ export default {
            overflow: auto;
            padding-top: 16px;

-            /*滚动条样式*/
-            &::-webkit-scrollbar {
-                width: 8px;
-            }
-
-            &::-webkit-scrollbar-thumb {
-                border-radius: 10px;
-                box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
-                background: rgba(242, 242, 242, 1);
-            }
-
-            &::-webkit-scrollbar-track {
-                box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
-                border-radius: 0;
-                background: transparent;
-            }
-
            .area-item {
                height: 70px;
-
                cursor: pointer;
-
-                &:not(:last-of-type) {
-                    border-bottom: 1px solid rgba(242, 242, 242, 1);
-                }
-
                margin-right: 5px;
                color: #555;
                font-size: 16px;
                justify-content: space-between;

+                &:not(:last-of-type) {
+                    border-bottom: 1px solid rgba(242, 242, 242, 1);
+                }
+
                &.pitchpitch {
                    color: #62B1FF;

@@ -2558,23 +2537,6 @@ export default {
                background-color: red;
            }

-            /*滚动条样式*/
-            &::-webkit-scrollbar {
-                width: 8px;
-            }
-
-            &::-webkit-scrollbar-thumb {
-                border-radius: 10px;
-                box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
-                background: rgba(242, 242, 242, 1);
-            }
-
-            &::-webkit-scrollbar-track {
-                box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
-                border-radius: 0;
-                background: transparent;
-            }
-
            .target-area-item {
                margin-bottom: 20px;

@@ -2596,8 +2558,6 @@ export default {
                        border-radius: 4px;
                        background-color: rgba(255, 215, 82, 1);
                    }
-
-
                }

                .box {
@@ -2723,23 +2683,6 @@ export default {
    padding: 10px 30px;
    overflow: auto;

-    /*滚动条样式*/
-    &::-webkit-scrollbar {
-        width: 8px;
-    }
-
-    &::-webkit-scrollbar-thumb {
-        border-radius: 10px;
-        box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
-        background: rgba(242, 242, 242, 1);
-    }
-
-    &::-webkit-scrollbar-track {
-        box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
-        border-radius: 0;
-        background: transparent;
-    }
-
    .residential-item {
        height: 60px;
        cursor: pointer;
--- a/src/views/user.vue
+++ b/src/views/user.vue
@@ -23,7 +23,7 @@
                </div>
            </div>
            <div class="info-right flexacenter">
-                <div class="operate-item message flexcenter">
+                <div class="operate-item message flexcenter" @click="systematicState = true">
                    <div class="operate-item-shell flexcenter">
                        <div class="newmessagenum flexcenter" v-if="newmessagenum > 0">{{ newmessagenum }}</div>
                        <img class="operate-icon" src="@/assets/img/publicImage/message-icon.svg">
@@ -59,18 +59,30 @@
        </div>

        <div class="tab-box flexacenter">
-            <div class="tab-item flexcenter pitch">我的收藏</div>
-            <div class="tab-item flexcenter">我的发布</div>
+            <div class="tab-item flexcenter" :class="{ 'pitch': tabState == 'fav' }" @click="cutTab('fav')">我的收藏</div>
+            <div class="tab-item flexcenter" :class="{ 'pitch': tabState == 'publish' }" @click="cutTab('publish')">我的发布
+            </div>
+        </div>
+    </div>
+
+    <div class="quantity wid1200" v-if="tabState == 'fav'">共收藏 <b>{{ count['fav'] }}</b> 个房源</div>
+    <div class="quantity wid1200" v-else>共 <b>{{ count['publish'] }}</b> 条房源（上架 {{ stat['listing'] }} | 草稿 {{ stat['draft']
+    }} | 下架 {{ stat['offshelf'] }}）</div>
+
+    <div class="list wid1200 flexflex">
+        <div class="item" v-for="item in 10">
+            <biserial-list-item></biserial-list-item>
        </div>
    </div>

    <!-- 有疑问 -->
    <have-questions></have-questions>

+    <!-- 页底 -->
    <page-footer></page-footer>

    <!-- 系统通知弹窗 -->
-    <systematic-notification-pop></systematic-notification-pop>
+    <systematic-notification-pop v-if="systematicState" @close="systematicState = false"></systematic-notification-pop>
 </template>

 <script setup>
@@ -78,19 +90,21 @@ import headerNav from '@/components/public/head.vue'
 import systematicNotificationPop from '@/components/user/systematic-notification-pop.vue'
 import haveQuestions from '@/components/public/have-questions.vue'
 import pageFooter from '@/components/footer/footer.vue'
+import biserialListItem from '@/components/biserialListItem/biserialListItem.vue'
 import { ref, reactive, onMounted, getCurrentInstance } from 'vue'
 const { proxy } = getCurrentInstance()

-console.log("proxy", proxy);

 onMounted(() => {
    init()
 })

+let systematicState = ref(false) // 系统通知
 let user = ref({})
-let count = ref({})
+let count = ref({}) // 发布和收藏的数量
 let newmessagenum = ref(0)
 let validityidentity = ref('')
+let tabState = ref('publish') // fav  publish

 const identityObj = {
    1: "中介认证",
@@ -101,22 +115,72 @@ async function init() {
    proxy.$post("/tenement/v2/api/user").then(res => {
        if (res.code != 200) return
        let data = res.data
-        // data.user['identity'] = 1
+
+        if (data.count['publish'] > 0) {
+            tabState.value = 'publish'
+            getPublishData()
+        } else {
+            tabState.value = 'fav'
+            getFavData()
+        }
+
        user.value = data.user
        count.value = data.count
        newmessagenum.value = data.newmessagenum
        validityidentity.value = data.validityidentity
-
    });
 }

+let publishData = ref({
+    page: 1,
+    list: []
+})
+
+let stat = ref({}) // 我的发布的详细数量
+// 获取发布数据
+const getPublishData = () => {
+    proxy.$post("/tenement/pc/api/user/publishList", {
+        page: publishData['page']
+    }).then(res => {
+        if (res.code != 200) return
+        let data = res.data
+        stat.value = data['stat']
+        publishData.value['page'] = data['page'] * data['limit'] >= data['count'] ? 0 : data['page'] + 1
+        publishData.value['list'] = publishData.value['list'].concat(data['data'])
+    })
+}
+
+let favData = ref({
+    page: 1,
+    list: []
+})
+
+// 获取收藏数据
+const getFavData = () => {
+    proxy.$post("/tenement/pc/api/user/favList", {
+        page: favData['page']
+    }).then(res => {
+        if (res.code != 200) return
+        let data = res.data
+        favData.value['page'] = data['page'] * data['limit'] >= data['count'] ? 0 : data['page'] + 1
+        favData.value['list'] = favData.value['list'].concat(data['data'])
+    })
+}
+
+// 切换 tab 
+const cutTab = (value) => {
+    tabState.value = value
+    if (tabState.value == 'publish' && publishData.value['list'].length == 0) getPublishData()
+    else if (tabState.value == 'fav' && favData.value['list'].length == 0) getFavData()
+}
+
 </script>

 <style lang="less">
 .user-box {
    width: 1200px;
    height: 238px;
-    margin: 30px auto 0;
+    margin: 30px auto 26px;
    font-size: 14px;
    background: linear-gradient(0deg, rgba(214, 236, 255, 1) -4%, rgba(232, 244, 255, 1) 34%, rgba(176, 216, 255, 1) 131%);
    border-radius: 16px;
@@ -289,11 +353,42 @@ async function init() {
                font-style: normal;
                font-size: 18px;
                color: #FFFFFF;
+                position: relative;
+
+                &::after {
+                    content: "";
+                    position: absolute;
+                    bottom: -5px;
+                    width: 14px;
+                    height: 8px;
+                    background-image: url('@/assets/img/publicImage/green-arrow-below.svg');
+                }
+
            }
        }
    }
 }

+.quantity {
+    margin: 0 auto;
+    font-size: 14px;
+    color: #555;
+    margin-bottom: 24px;
+
+    b {
+        color: #000;
+    }
+}
+
+.list {
+    margin: 0 auto;
+    flex-wrap: wrap;
+    justify-content: space-between;
+
+    .item {
+        margin-bottom: 20px;
+    }
+}


 .have-questions {