消息通知

src/apps/AppDataScreening/AppDataScreening.vue

@@ -0,0 +1,138 @@
+<template>
+  <div class="AppDataScreening">
+    <div class="header">
+      <div class="title" @click="linkTo('./userDetail')">
+        <span>居民群</span>
+        <u-icon name="arrow-right" color="#ddd" size="32"></u-icon>
+      </div>
+      <div class="num"><span>12</span>个</div>
+      <p class="text">共201位群成员</p>
+    </div>
+    <div class="list">
+      <div class="title">
+        <span>组织信息</span>
+        <i>共72人</i>
+      </div>
+      <div class="item" @click="linkTo('./orgDetail')">
+        <div class="left">
+          <img src="./img/gird--select-icon.png" alt="">
+          <span>曼城去应急管理处曼城去应急管理处曼城去应急管理处曼城去应急管理处</span>
+        </div>
+        <u-icon name="arrow-right" color="#ddd" size="32"></u-icon>
+      </div>
+      <div class="item">
+        <div class="left">
+          <img src="./img/gird--select-icon.png" alt="">
+          <span>曼城去应急管理处曼城</span>
+        </div>
+        <u-icon name="arrow-right" color="#ddd" size="32"></u-icon>
+      </div>
+      <!-- <p class="total">组织内共72人</p> -->
+    </div>
+  </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+
+export default {
+  name: "AppDataScreening",
+  appName: "数据总览",
+  data() {
+    return {
+
+    }
+  },
+  computed: {...mapState(['user'])},
+  created() {
+  },
+  onShow() {
+    document.title = '数据总览'
+  },
+  methods: {
+    linkTo(url) {
+      uni.navigateTo({ url })
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppDataScreening {
+  padding-top: 32px;
+  .header{
+    margin-bottom: 32px;
+    padding: 0 32px 32px 32px;
+    background-color: #fff;
+    .num{
+      text-align: center;
+      color: #333;
+      font-size: 30px;
+      margin: 20px 0 24px 0;
+      span{
+        display: inline-block;
+        font-size: 56px;
+        font-weight: 600;
+        margin-right: 8px;
+      }
+    }
+    .text{
+      color: #666;
+      font-size: 28px;
+      line-height: 44px;
+      text-align: center;
+    }
+  }
+  .list{
+    padding-left: 32px;
+    background-color: #fff;
+    .item{
+      padding: 34px 32px 34px 0;
+      display: flex;
+      justify-content: space-between;
+      box-sizing: border-box;
+      border-bottom: 1px solid #ddd;
+      .left{
+        width: 600px;
+        img{
+          width: 56px;
+          height: 56px;
+          vertical-align: bottom;
+          margin-right: 14px;
+        }
+        span{
+          display: inline-block;
+          width: calc(100% - 70px);
+          word-break: break-all;
+          line-height: 44px;
+          font-size: 30px;
+          color: #333;
+        }
+      }
+    }
+    .total{
+      line-height: 44px;
+      font-size: 28px;
+      color: #666;
+      padding: 40px 32px 24px 0;
+      text-align: center;
+    }
+  }
+  .title{
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    font-size: 32px;
+    font-weight: 500;
+    line-height: 88px;
+    color: #333;
+    font-family: PingFangSC-Regular, PingFang SC;
+    i{
+      font-style: normal;
+      padding-right: 32px;
+      font-size: 28px;
+      color: #666;
+    }
+  }
+}
+</style>

src/apps/AppDataScreening/orgDetail.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="orgDetail">
+    <p class="total">组织内共72人</p>
+    <div class="list">
+      <div class="item">
+        <div class="left">
+          <img src="./img/gird--select-icon.png" alt="">
+          <span>曼城去应急管理处曼城去应急管理处曼城去应急管理处曼城去应急管理处</span>
+        </div>
+      </div>
+      <div class="item">
+        <div class="left">
+          <img src="./img/gird--select-icon.png" alt="">
+          <span>曼城去应急管理处曼城</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+
+export default {
+  name: "orgDetail",
+  data() {
+    return {
+
+    }
+  },
+  computed: {...mapState(['user'])},
+  created() {
+  },
+  onShow() {
+    document.title = '组织详情'
+  },
+  methods: {
+    
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.orgDetail {
+   .list{
+    padding-left: 32px;
+    background-color: #fff;
+    .item{
+      padding: 34px 32px 34px 0;
+      box-sizing: border-box;
+      border-bottom: 1px solid #ddd;
+      .left{
+        width: 100%;
+        img{
+          width: 56px;
+          height: 56px;
+          vertical-align: bottom;
+          margin-right: 14px;
+        }
+        span{
+          display: inline-block;
+          width: calc(100% - 70px);
+          word-break: break-all;
+          line-height: 44px;
+          font-size: 30px;
+          color: #333;
+        }
+      }
+    }
+  }
+  .total{
+    line-height: 44px;
+    font-size: 30px;
+    color: #666;
+    padding: 32px 32px 24px 32px;
+  }
+}
+</style>

src/apps/AppDataScreening/userDetail.vue

@@ -0,0 +1,85 @@
+<template>
+  <div class="userDetail">
+    <div class="list">
+      <div class="item">
+        <div class="left">
+          <img src="./img/user-img.png" alt="">
+        </div>
+        <div class="right">
+          <p>群聊</p>
+          <div>3人 | 群主：张三</div>
+        </div>
+      </div>
+      <div class="item">
+        <div class="left">
+          <img src="./img/user-img.png" alt="">
+        </div>
+        <div class="right">
+          <p>群聊群聊群聊群聊群聊群聊群聊群聊群聊群聊群聊群聊群聊群聊群聊群聊</p>
+          <div>3人 | 群主：张三</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+
+export default {
+  name: "userDetail",
+  data() {
+    return {
+
+    }
+  },
+  computed: {...mapState(['user'])},
+  created() {
+  },
+  onShow() {
+    document.title = '居民群详情'
+  },
+  methods: {
+    
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.userDetail {
+  .list{
+    background-color: #fff;
+    padding-left: 32px;
+    .item{
+      padding: 34px 32px 34px 0;
+      display: flex;
+      box-sizing: border-box;
+      border-bottom: 1px solid #ddd;
+      .left{
+        width: 110px;
+        img{
+          width: 88px;
+          height: 88px;
+          vertical-align: bottom;
+          margin-right: 22px;
+        }
+      }
+      .right{
+        width: calc(100% - 110px);
+        p{
+          line-height: 44px;
+          margin-bottom: 8px;
+          color: #333;
+          font-size: 30px;
+          word-break: break-all;
+        }
+        div{
+          font-size: 28px;
+          color: #999;
+          line-height: 34px;
+        }
+      }
+    }
+  }
+}
+</style>

src/apps/AppPageMessage/AppPageMessage.vue

@@ -0,0 +1,45 @@
+<template>
+  <div class="AppPageMessage">
+    <AiListPage :label="label" :appList="appList" :headerBg="headerBg" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AppPageMessage',
+  appName: '工作台(数据总览)',
+  data() {
+    return {
+      label: '数据总览',
+      appList: [
+        {
+          name: '数据总览',
+          icon: require('./img/shgk.png'),
+           url: '../AppDataScreening/AppDataScreening'
+        },
+        {
+          name: '群发通知',
+          icon: require('./img/hytz.png'),
+          url: '../AppMessageNotification/AppMessageNotification'
+        },
+      ],
+      headerBg: require('./img/header-bg.png'),
+    }
+  },
+  onShow() {
+    document.title = '数据总览'
+  },
+  methods: {
+    
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+uni-page-body{
+  height: 100%;
+}
+.AppPageMessage{
+  height: 100%;
+}
+</style>