社区讯息

src/assets/css/index.less

@@ -162,6 +162,7 @@ body #app {
 // 相对定位
 .required{
   position: relative;
+  
 }
 
 .required::after{
@@ -171,7 +172,9 @@ body #app {
   top: 0;
   color: red;
 }
-
+.absolute{
+  position: absolute;
+}
 .mr10 {
   margin-right: 10px;
 }
@@ -215,7 +218,10 @@ body #app {
   font-size: 13px;
 }
 .font-size14{
-  font-size: 13px;
+  font-size: 14px;
+}
+.font-size15{
+  font-size: 15px;
 }
 .font-size18{
   font-size: 18px;

src/router/router.config.js

@@ -95,6 +95,12 @@ export const constantRouterMap = [
     component: () => import('@/views/discussion'),
     meta: { title: '社区议事', keepAlive: false }
   },
+  {
+    path: '/comMessages',
+    name: 'comMessages',
+    component: () => import('@/views/comMessages'),
+    meta: { title: '社区讯息', keepAlive: false }
+  },
   {
     path: '/activityDetail',
     name: 'activityDetail',
@@ -106,5 +112,11 @@ export const constantRouterMap = [
     name: 'discusionDetail',
     component: () => import('@/views/discussion/discusionDetail'),
     meta: { title: '详情', keepAlive: false }
+  },
+  {
+    path: '/detail',
+    name: 'detail',
+    component: () => import('@/views/comMessages/detail'),
+    meta: { title: '详情', keepAlive: false }
   }
 ]

src/views/comMessages/detail.vue

@@ -0,0 +1,78 @@
+<template>
+    <div>
+        <div class="container">
+            <div class="card">
+                <div class="flex flex-y">
+                    <div class="font-size18 font-bold m-top12">{{ discussionList.title }}</div>
+                    <div class="flex flex-x flex-end font-size13 AAA m-top5">
+                        <div class="font-size13 AAA">{{ discussionList.address }}</div>
+                        <div class="font-size13 AAA">{{ discussionList.dataTime }}</div>
+                    </div>
+                    <img src="../../assets/images/comMessages/1718095003122.png" alt="" class="img_100">
+                    <div class="">{{ discussionList.content }}</div>
+                </div>
+                <div class="bot_btn flex flex-x flex-mean m-bot50 back_color">
+                    <van-button icon="https://img01.yzcdn.cn/vant/user-active.png" color="white" @button-danger-color="black" type="info">
+                        按钮
+                    </van-button>
+
+                </div>
+            </div>
+        </div>
+    </div>
+
+
+</template>
+
+<script>
+
+export default {
+    data() {
+        return {
+
+            labelList: ["最新", "通知公告", "社区新闻", "政策发布", "生活"],
+            discussionList:
+                { title: '嘉定山社区育龄妇女免费体检通知', address: "嘉定山社区", content: '   为了使生殖健康优质服务惠及更多已婚育龄 妇女，按照区卫健局统一部署，街道卫生和计 划生育综合管理办公室联系庙后街卫生服务', imge: "@/assets/images/comMessages/1.png", likeCount: 1111, dataTime: '2022-05-06 12:00:00' },
+            pageSize: 5,
+            pageNo: 1,
+            agencyId: null,
+            finished: false,
+            loading: true,
+            showRegister: false,
+            searchValue: ""
+        };
+    },
+    created() {
+        this.agencyId = this.$store.state.app.agencyId;
+
+    },
+    methods: {
+
+    },
+    components: {},
+    computed: {},
+    watch: {},
+}
+</script>
+
+<style lang='less' scoped>
+.custom-button {
+    width: 60px;
+    height: 33px;
+}
+
+.activity_content {
+    padding-bottom: 10px;
+    box-sizing: border-box;
+    width: 100%;
+    border-bottom: 1px solid #EAEAEA;
+    margin-top: 14px;
+    min-height: 50px;
+}
+
+.imge_100 {
+    width: 250px;
+    height: 128px;
+
+}
+</style>

src/views/comMessages/index.vue

@@ -0,0 +1,109 @@
+<template>
+    <div>
+        <div class="flex flex-y" style="background-color: #FFFFFF;">
+            <div class="flex flex-mean">
+                <van-search class=".flex flex-1" v-model="searchValue" left-icon="" shape="round"
+                    placeholder="请输入搜索关键词" />
+                <van-button round type="info" class="custom-button font-size13 m-top10 m-right12 ">查询</van-button>
+            </div>
+        </div>
+        <van-tabs v-model="active" scrollspy sticky>
+            <van-tab v-for="item in labelList" :title="item">
+            </van-tab>
+        </van-tabs>
+        <div class="container">
+            <van-list class="card" :finished="finished" finished-text="没有更多了" @load="onLoad">
+                <div v-for="item in discussionList" :key="item" :title="item" class="activity_content"    @click="$router.push({ path: `/detail` })">
+                    <div v-if="!item.imge" class="flex flex-y">
+                        <div class="  m-bottom10">{{ item.title }}</div>
+                        <div class="font-size15 gray">{{ item.content }}</div>
+                        <div class="flex flex-x flex-end m-top10">
+                            <div class="flex flex-x">
+                                <img src="@/assets/images/icons/support.png" class="img_16">
+                                <div class="gray font-size13">{{ item.likeCount }}</div>
+                            </div>
+                            <div class="gray font-size13">{{ item.dataTime }}</div>
+                        </div>
+                    </div>
+                    <div v-if="item.imge" class="flex flex-y">
+                        <div class="flex flex-x">
+                            <div class="flex flex-y" style="width: 212px; height: 80px;">
+                                <div class="m-bottom10">{{ item.title }}</div>
+                                <div class="font-size15 gray van-ellipsis">{{ item.content }}</div>
+                            </div>
+                            <img src="@/assets/images/comMessages/1.png" class="imge_100">                           
+                        </div>
+
+                        <div class="flex flex-x flex-end m-top10">
+                            <div class="flex flex-x">
+                                <img src="@/assets/images/icons/support.png" class="img_16">
+                                <div class="gray font-size13">{{ item.likeCount }}</div>
+                            </div>
+                            <div class="gray font-size13">{{ item.dataTime }}</div>
+                        </div>
+                    </div>
+                </div>
+            </van-list>
+        </div>
+
+    </div>
+
+
+</template>
+
+<script>
+import registerDialog from '@/components/registerDialog';
+
+export default {
+    data() {
+        return {
+
+            labelList: ["最新", "通知公告", "社区新闻", "政策发布", "生活"],
+            discussionList: [
+                { title: '重庆南路暖气管道施工通知', content: '从5月7日到6月1日，重庆南路需要进行暖气管道 施工改造，请大家提前做好出行准备。', imge: "@/assets/images/comMessages/1.png", likeCount: 1111, dataTime: '2022-05-06 12:00:00' },
+                { title: '嘉定山社区育龄妇女免费体检通知', content: '从5月7日到6月1日，重庆南路需要进行暖气管道 施工改造，请大家提前做好出行准备。', imge: "@/assets/images/comMessages/1.png", likeCount: 1111, dataTime: '2022-05-06 12:00:00' },
+                { title: '社区组织志愿者为社区高龄老人提供上门理发服务', content: '从5月7日到6月1日，重庆南路需要进行暖气管道 施工改造，请大家提前做好出行准备。', imge: "", likeCount: 1111, dataTime: '2022-05-06 12:00:00' },
+            ],
+            pageSize: 5,
+            pageNo: 1,
+            agencyId: null,
+            finished: false,
+            loading: true,
+            showRegister: false,
+            searchValue: ""
+        };
+    },
+    created() {
+        this.agencyId = this.$store.state.app.agencyId;
+
+    },
+    methods: {
+
+    },
+    components: { registerDialog },
+    computed: {},
+    watch: {},
+}
+</script>
+
+<style lang='less' scoped>
+.custom-button {
+    width: 60px;
+    height: 33px;
+}
+
+.activity_content {
+    padding-bottom: 10px;
+    box-sizing: border-box;
+    width: 100%;
+    border-bottom: 1px solid #EAEAEA;
+    margin-top: 14px;
+    min-height: 50px;
+}
+.imge_100{
+    width: 100px;
+    height:60px ;
+
+}
+
+</style>

src/views/discussion/index.vue

@@ -12,7 +12,7 @@
                     <div class="van-multi-ellipsis--l2 m-bottom10">
                         {{ item.title }}
                     </div>
-                    <div class="  flex flex-end">
+                    <div class="flex flex-end">
                         <div class=""><img src="@/assets/images/icons/resi.png" class="img_17"> 参加{{ item.content }}
                         </div>
                         <div><img src="@/assets/images/icons/support.png" class="img_17">支持{{ item.time }}</div>

src/views/home/index.vue

@@ -112,7 +112,7 @@ export default {
                 {
                     imgSrc: require('@/assets/images/nav/1.png'),
                     title: '社区讯息',
-                    path: 'notice'
+                    path: 'comMessages'
                 },
                 {
                     imgSrc: require('@/assets/images/nav/2.png'),
@@ -122,7 +122,7 @@ export default {
                 {
                     imgSrc: require('@/assets/images/nav/3.png'),
                     title: '居民议事',
-                    path: 'notice'
+                    path: 'discussion'
                 },
                 {
                     imgSrc: require('@/assets/images/nav/4.png'),