改造企业微信会议通知

2021-11-19 09:41:22 +08:00
parent b1faa6ec9e
commit ac77c19ea8
3 changed files with 95 additions and 75 deletions
--- a/src/apps/AppMeetingNotice/AppMeetingNotice.vue
+++ b/src/apps/AppMeetingNotice/AppMeetingNotice.vue
@@ -1,47 +1,51 @@
 <template>
  <div class="meeting">
-    <ai-top-fixed>
-      <u-grid :col="3" :border="false">
-        <u-grid-item v-for="(item,index) in grid" :key="index" :custom-style="{padding:'14px 0'}" @click="handleClick(index)">
-          <u-icon :name="item.icon" :size="64"></u-icon>
-          <view class="label">{{item.label}}</view>
-        </u-grid-item>
-      </u-grid>
-    </ai-top-fixed>
-    <div class="body">
-      <header>待参加的会议</header>
-      <template v-if="meetingList.length">
-        <div class="card" v-for="(item,index) in meetingList" :key="index" @click="detail(item)">
-          <header>{{item.title}}</header>
-          <u-row justify="between">
-            <div class="time">
-              <span>{{item.startTime|format}}</span>
-              <span>{{item.startTime|formatDate(0)}}年{{item.startTime|formatDate(1)}}月{{item.startTime|formatDate(2)}}日 周{{item.startTime|formatWeek}}</span>
-            </div>
-            <div class="arrow"></div>
-            <div class="time">
-              <span>{{item.endTime|format}}</span>
-              <span>{{item.endTime|formatDate(0)}}年{{item.endTime|formatDate(1)}}月{{item.endTime|formatDate(2)}}日 周{{item.endTime|formatWeek}}</span>
-            </div>
-          </u-row>
-          <u-row class="info">
-            <span>发起人员：</span>
-            <span>{{item.userName}}</span>
-          </u-row>
-          <u-gap height="20"></u-gap>
-          <u-row class="info">
-            <span>会议地点：</span>
-            <span>{{item.address}}</span>
-          </u-row>
-          <div class="tag" :style="{background:'url(' + $cdn + tag(item.joinStatus) + ')'}"></div>
-        </div>
-      </template>
-      <template v-else>
-        <ai-empty/>
-      </template>
-    </div>
-    <u-divider bg-color="#F5F5F5" v-if="meetingList.length">已经到底啦</u-divider>
-    <ai-add @add="add"/>
+    <template v-if="isList">
+      <ai-top-fixed>
+        <u-grid :col="3" :border="false">
+          <u-grid-item v-for="(item,index) in grid" :key="index" :custom-style="{padding:'14px 0'}"
+                       @click="handleClick(index)">
+            <u-icon :name="item.icon" :size="64"></u-icon>
+            <view class="label">{{item.label}}</view>
+          </u-grid-item>
+        </u-grid>
+      </ai-top-fixed>
+      <div class="body">
+        <header>待参加的会议</header>
+        <template v-if="meetingList.length">
+          <div class="card" v-for="(item,index) in meetingList" :key="index" @click="detail(item)">
+            <header>{{item.title}}</header>
+            <u-row justify="between">
+              <div class="time">
+                <span>{{item.startTime|format}}</span>
+                <span>{{item.startTime|formatDate(0)}}年{{item.startTime|formatDate(1)}}月{{item.startTime|formatDate(2)}}日 周{{item.startTime|formatWeek}}</span>
+              </div>
+              <div class="arrow"></div>
+              <div class="time">
+                <span>{{item.endTime|format}}</span>
+                <span>{{item.endTime|formatDate(0)}}年{{item.endTime|formatDate(1)}}月{{item.endTime|formatDate(2)}}日 周{{item.endTime|formatWeek}}</span>
+              </div>
+            </u-row>
+            <u-row class="info">
+              <span>发起人员：</span>
+              <span>{{item.userName}}</span>
+            </u-row>
+            <u-gap height="20"></u-gap>
+            <u-row class="info">
+              <span>会议地点：</span>
+              <span>{{item.address}}</span>
+            </u-row>
+            <div class="tag" :style="{background:'url(' + $cdn + tag(item.joinStatus) + ')'}"></div>
+          </div>
+        </template>
+        <template v-else>
+          <ai-empty/>
+        </template>
+      </div>
+      <u-divider bg-color="#F5F5F5" v-if="meetingList.length">已经到底啦</u-divider>
+      <ai-add @add="add"/>
+    </template>
+    <component v-else :is="comp" :params="params"></component>
  </div>
 </template>

@@ -49,14 +53,18 @@
  import AiEmpty from "../../components/AiEmpty/AiEmpty";
  import AiTopFixed from "../../components/AiTopFixed";
  import AiAdd from "../../components/AiAdd";
+  import {addMeeting, belongToMe, detail, meetingList} from './components'

  export default {
    name: "AppMeetingNotice",
    appName: "会议通知",
-    components: {AiEmpty, AiTopFixed, AiAdd},
+    components: {AiEmpty, AiTopFixed, AiAdd, addMeeting, belongToMe, detail, meetingList},
    data() {
      return {
-        meetingList:[]
+        meetingList: [],
+        isList: true,
+        comp: "",
+        params: null,
      }
    },
    computed: {
@@ -78,16 +86,16 @@
      }
    },
    methods: {
-      tag(status){
+      tag(status) {
        return {
-          "0":"common/1wqr.png",
-          "1":"common/1yqr.png",
-          "2":"common/1yqj.png",
+          "0": "common/1wqr.png",
+          "1": "common/1yqr.png",
+          "2": "common/1yqj.png",
        }[status]
      },
-      detail({id}){
+      detail({id}) {
        uni.navigateTo({
-          url:"/pages/meetingNotice/components/detail?id=" + id
+          url: "/pages/meetingNotice/components/detail?id=" + id
        })
      },
      getData() {
@@ -97,42 +105,44 @@
            meetingStatus: "1|2",
            size: 999
          }
-        }).then(res=>{
-          if(res && res.data){
+        }).then(res => {
+          if (res && res.data) {
            this.meetingList = res.data.records
          }
        })
      },
-      handleClick(index){
+      handleClick(index) {
        let url
-        if(index==0 || index==2){
-          url="/pages/meetingNotice/components/meetingList?index=" + index
-        }else if(index==1){
-          url="/pages/meetingNotice/components/belongToMe"
+        if (index == 0 || index == 2) {
+          this.comp = "meetingList";
+          this.params = index;
+          this.isList = false;
+        } else if (index == 1) {
+          url = "/pages/meetingNotice/components/belongToMe"
        }
        uni.navigateTo({url})
      },
      add() {
        uni.navigateTo({
-          url:"/pages/meetingNotice/components/addMeeting"
+          url: "/pages/meetingNotice/components/addMeeting"
        })
      }
    },

-    filters:{
-      format(date){
-        return date.split(" ")[1].substr(0,5)
+    filters: {
+      format(date) {
+        return date.split(" ")[1].substr(0, 5)
      },
-      formatDate(date,index){
+      formatDate(date, index) {
        return date.split(" ")[0].split("-")[index]
      },
-      formatWeek(date){
+      formatWeek(date) {
        return "日一二三四五六".charAt((new Date(date.split(" ")[0]).getDay()))
      }
    },

-    onShow(){
-     this.getData()
+    onShow() {
+      this.getData()
    }
  }
 </script>
@@ -212,6 +222,7 @@
            position: absolute;
            transform: scaleY(1.3) translate(30%, -40px) rotate(45deg);
          }
+
          &:before {
            top: 59px;
            background-color: #CCCCCC;
@@ -236,7 +247,7 @@
          }
        }

-        .tag{
+        .tag {
          width: 112px;
          height: 112px;
          background-repeat: no-repeat !important;
@@ -248,7 +259,7 @@
      }
    }

-    ::v-deep .content{
+    ::v-deep .content {
      padding: 0 !important;
    }
  }
--- a/src/apps/AppMeetingNotice/components/index.js
+++ b/src/apps/AppMeetingNotice/components/index.js
@@ -0,0 +1,4 @@
+export {default as addMeeting} from './addMeeting'
+export {default as belongToMe} from './belongToMe'
+export {default as detail} from './detail'
+export {default as meetingList} from './meetingList'
--- a/src/apps/AppMeetingNotice/components/meetingList.vue
+++ b/src/apps/AppMeetingNotice/components/meetingList.vue
@@ -27,7 +27,7 @@
        <span>会议地点：</span>
        <span>{{item.address}}</span>
      </u-row>
-        <div class="tag" v-if="item.status!=0" :style="{background:'url(' + $cdn + tag(item.status) +')'}"></div>
+      <div class="tag" v-if="item.status!=0" :style="{background:'url(' + $cdn + tag(item.status) +')'}"></div>
    </div>
    <u-loadmore :status="status" v-if="list.length"/>
    <AiEmpty v-if="!list.length"></AiEmpty>
@@ -42,9 +42,14 @@
  export default {
    name: "meetingList",
    components: {AiBack, AiEmpty},
+    props: {
+      params: {
+        type: String,
+        default: ""
+      }
+    },
    data() {
      return {
-        index: null,
        list: [],
        current: 1,
        status: "加载更多",
@@ -52,16 +57,15 @@
    },

    onLoad(opt) {
-      this.index = opt.index
      uni.setNavigationBarTitle({
-        title: opt.index == 0 ? "历史会议" : "草稿箱"
+        title: this.params == 0 ? "历史会议" : "草稿箱"
      });
    },

    methods: {
      detail({id}) {
        let url
-        if (this.index == 2) {
+        if (this.params == 2) {
          url = "/pages/meetingNotice/components/addMeeting?id=" + id
        } else {
          url = "/pages/meetingNotice/components/detail?id=" + id
@@ -79,8 +83,8 @@
      getData() {
        this.$http.post("/app/appmeetinginfo/list", null, {
          params: {
-            listType: this.index == 0 ? "2" : '0',
-            meetingStatus: this.index == 0 ? "4" : "0",
+            listType: this.params == 0 ? "2" : '0',
+            meetingStatus: this.params == 0 ? "4" : "0",
            size: 10,
            current: this.current,
          }
@@ -107,7 +111,7 @@
      }
    },

-    onShow(){
+    onShow() {
      this.getData()
    },

@@ -199,6 +203,7 @@

      .info {
        flex-wrap: nowrap;
+
        & > span:first-child {
          flex-shrink: 0;
          font-size: 30px;