宣发

2022-07-18 10:55:29 +08:00
parent 74466bf775
commit 1f729bf860
3 changed files with 243 additions and 139 deletions
--- a/src/project/saas/AppCooperationPropaganda/cooperationDetail.vue
+++ b/src/project/saas/AppCooperationPropaganda/cooperationDetail.vue
@@ -2,35 +2,54 @@
  <div class="cooperationDetail">
    <AiTopFixed>
      <div class="tab-select">
-        <div class="item" :class="tabIndex == index ? 'active' : ''" v-for="(item, index) in tabs" :key="index" @click="tabClick(index)">{{ item }}<span></span>
+        <div
+          class="item"
+          :class="tabIndex == index ? 'active' : ''"
+          v-for="(item, index) in tabs"
+          :key="index"
+          @click="tabClick(index)"
+        >
+          {{ item }}<span></span>
        </div>
      </div>
    </AiTopFixed>
-    
-    <div class="content">

+    <div class="content">
      <div class="header">
        <div class="header_left">
          <div>防疫宣传群发通知</div>
-          <div>创建时间: <span>{{ createTime }}</span></div>
+          <div>
+            创建时间: <span>{{ createTime }}</span>
+          </div>
        </div>
        <div class="header_right" @click="toDetail">查看详情</div>
      </div>

      <div class="pieEcharts">
        <div class="pie_info">
-          <div class="tips">数据更新于<span>{{ info.remindTime }}</span></div>
+          <div class="tips">
+            数据更新于<span>{{ info.remindTime }}</span>
+          </div>
          <div class="pie_card">
-            <div v-if="info.executedCount!=null" id="pieEcharts"></div>
+            <div v-if="info.executedCount != null" id="pieEcharts"></div>
            <AiEmpty description="暂无数据" v-else />
            <div class="pie_right">
-              <div>计划送达居民群: <span>{{ info.planCount || 0 }}</span></div>
-              <div>未送达居民群: <span>{{ info.unExecutedCount || 0 }}</span></div>
-              <div>已送达居民群: <span>{{ info.executedCount || 0 }}</span></div>
-              <div>无法送达居民群: <span>{{ info.cannotExecuteCount || 0 }}</span></div>
+              <div>
+                计划送达居民群: <span>{{ info.planCount || 0 }}</span>
+              </div>
+              <div>
+                未送达居民群: <span>{{ info.unExecutedCount || 0 }}</span>
+              </div>
+              <div>
+                已送达居民群: <span>{{ info.executedCount || 0 }}</span>
+              </div>
+              <div>
+                无法送达居民群: <span>{{ info.cannotExecuteCount || 0 }}</span>
+              </div>
            </div>
          </div>
-          <div class="btn" v-if="info.status == 4" @click="remindSend">提醒成员发送</div>
+          <!-- v-if="info.status == 4" -->
+          <div class="btn" @click="remindSend">提醒成员发送</div>
        </div>
      </div>

@@ -39,8 +58,16 @@
          <div class="tab">
            <u-subsection :list="subsection" :current="subIndex"></u-subsection>
          </div>
-          <AiTable :data="tableData" :colConfigs="colConfigs0" v-if="tabIndex == 0"/>
-          <AiTable :data="tableData" :colConfigs="colConfigs1" v-if="tabIndex == 1"/>
+          <AiTable
+            :data="tableData"
+            :colConfigs="colConfigs0"
+            v-if="tabIndex == 0"
+          />
+          <AiTable
+            :data="tableData"
+            :colConfigs="colConfigs1"
+            v-if="tabIndex == 1"
+          />
        </div>
      </div>
    </div>
@@ -48,143 +75,174 @@
 </template>

 <script>
-import echarts from 'echarts'
+import echarts from "echarts";
 export default {
  data() {
    return {
-      tabs: ['成员统计', '居民群统计'],
+      tabs: ["成员统计", "居民群统计"],
      tabIndex: 0,
      pieEcharts: null,
      subsection: [
-        {name: '未送达'}, 
-        {name: '已送达'},
-        {name: '无法送达'}
+        { name: "未送达" },
+        { name: "已送达" },
+        { name: "无法送达" },
      ],
      subIndex: 0,
      tableData: [],
-      createTime: '',
-      id: '',
+      createTime: "",
+      id: "",
      info: {},
      current: 1,
-    }
+      firstClickTime: "",
+      currentClickTime: "",
+      flag: true,
+    };
  },
  computed: {
    colConfigs0() {
      return [
-        { label: '成员', prop: 'groupOwnerId', width: '240rpx', dict: 'householdRelation' },
-        { label: '预计未送达居民', prop: 'groupCount'},
-      ]
+        {
+          label: "成员",
+          prop: "groupOwnerId",
+          width: "240rpx",
+          dict: "householdRelation",
+        },
+        { label: "预计未送达居民", prop: "groupCount" },
+      ];
    },
    colConfigs1() {
      return [
-        { label: '居民群', prop: 'groupName', width: '240rpx', dict: 'householdRelation' },
-        { label: '群人数', prop: 'memberCount', width: '200rpx' },
-        { label: '群主', prop: 'groupOwnerId', dict: 'sex' },
-      ]
+        {
+          label: "居民群",
+          prop: "groupName",
+          width: "240rpx",
+          dict: "householdRelation",
+        },
+        { label: "群人数", prop: "memberCount", width: "200rpx" },
+        { label: "群主", prop: "groupOwnerId", dict: "sex" },
+      ];
    },
  },
  onLoad(o) {
-    this.id = o.id
-    this.createTime = o.time
-    this.getStatistics()
+    this.id = o.id;
+    this.createTime = o.time;
  },
  methods: {
    tabClick(index) {
-      this.tabIndex = index
+      this.tabIndex = index;
    },

    toDetail() {
-      uni.navigateTo({url: `./detail?id=${this.id}`})
+      uni.navigateTo({ url: `./detail?id=${this.id}` });
    },
    // 提醒发送
    remindSend() {
-      var timer = null
-      var num = 60 * 60 * 1000
-      this.$http.post('/app/appmasssendingtask/remindSend',null,{
-        params: {
-          id: this.id
-        }
-      }).then(res => {
-        if(res?.code==0) {
-          this.$u.toast('已提醒成员发送')
-          timer = setInterval(()=>{
-            if(this.num == 0) {
-              clearInterval(timer)
+      this.firstClickTime = this.firstClickTime || +new Date();
+      this.currentClickTime = +new Date();
+      let time = this.currentClickTime - this.firstClickTime;
+      if (time >= 60 * 60 * 1000 || this.flag) {
+        this.$http
+          .post("/app/appmasssendingtask/remindSend", null, {
+            params: {
+              id: this.id,
+            },
+          })
+          .then((res) => {
+            if (res?.code == 0) {
+              this.$u.toast("已提醒成员发送");
+              this.flag = false;
            }
-            num = num - 1 
-          }, 60 * 60 * 1000)
-        } else {
-          this.$u.toast(res.msg)
+          })
+          .catch((err) => {
+            console.log(err);
+          });
+      } else {
+        time = 60 * 60 * 1000 - time;
+        const min = Math.floor(time / 1000 / 60); // 分钟
+        const second = Math.floor(time / 1000);
+        second %= 60;
+        let msg = ``;
+        if (min > 0 && second > 0) {
+          msg = `${min}分钟${second}秒后可以再次点击`;
+        } else if (min > 0 && second <= 0) {
+          msg = `${min}分钟后可以再次点击`;
+        } else if (min <= 0 && second > 0) {
+          msg = `${second}秒后可以再次点击`;
        }
-      }).catch(() => {
-        this.$u.toast(`${num}s后可再次提醒发送`)
-      })
+        this.$u.toast(msg);
+      }
    },

    getStatistics() {
-      this.$http.post(`/app/appmasssendingtask/detailStatistics`, null, {
-        params: {
-          type: this.tabIndex,
-          sendStatus: this.subIndex,
-          taskId: this.id,
-          current: this.current
-        }
-      }).then(res => {
-        if(res?.data) {
-          this.tableData = res.data.executedList
-        }
-      })
+      this.$http
+        .post(`/app/appmasssendingtask/detailStatistics`, null, {
+          params: {
+            type: this.tabIndex,
+            sendStatus: this.subIndex,
+            taskId: this.id,
+            current: this.current,
+          },
+        })
+        .then((res) => {
+          if (res?.data) {
+            this.tableData = res.data.executedList;
+          }
+        });
    },

    // 带百分比饼图
    getPieEcharts() {
-      this.pieEcharts = echarts.init(document.getElementById('pieEcharts'))
-      this.pieEcharts.setOption( {
+      this.pieEcharts = echarts.init(document.getElementById("pieEcharts"));
+      this.pieEcharts.setOption({
        tooltip: {
-            trigger: 'item',
-            formatter: '{a} <br/>{b}: {c} ({d}%)'
+          trigger: "item",
+          formatter: "{a} <br/>{b}: {c} ({d}%)",
        },
-        color:['#1684fc','#ccc'], 
+        color: ["#1684fc", "#ccc"],
        series: [
          {
-            name: '群发送达率',
-            type: 'pie',
-            radius: ['65', '50%'],
+            name: "群发送达率",
+            type: "pie",
+            radius: ["65", "50%"],
            avoidLabelOverlap: false,
            label: {
              normal: {
                show: false,
-                position: 'center'
+                position: "center",
              },
            },
            labelLine: {
-              show: false
+              show: false,
            },
            data: [
-              {value: 10, name: '群发送达率', label:{
-                normal:{ 
-                  show:true,
-                  formatter: `{d}%\n群发居民群`,
-                  textStyle: {
-                    fontSize: 16,
+              {
+                value: 10,
+                name: "群发送达率",
+                label: {
+                  normal: {
+                    show: true,
+                    formatter: `{d}%\n群发居民群`,
+                    textStyle: {
+                      fontSize: 16,
+                    },
                  },
-                }}
+                },
              },
-              {value: 120,}
-            ]
-          }
-        ]
-      })
-    }
+              { value: 120 },
+            ],
+          },
+        ],
+      });
+    },
  },
  onShow() {
-    document.title = "群发居民群统计"
+    document.title = "群发居民群统计";
+    this.getStatistics();
  },
  mounted() {
-    this.getPieEcharts()
-  }
-
-}
+    this.getPieEcharts();
+  },
+};
 </script>

 <style lang="scss" scoped>
@@ -196,7 +254,7 @@ export default {
    width: 100%;
    height: 96px;
    line-height: 96px;
-    background: #3975C6;
+    background: #3975c6;
    display: flex;

    .item {
@@ -204,7 +262,7 @@ export default {
      text-align: center;
      font-size: 28px;
      font-family: PingFangSC-Regular, PingFang SC;
-      color: #CDDCF0;
+      color: #cddcf0;
    }

    .active {
@@ -216,7 +274,7 @@ export default {
      span {
        width: 48px;
        height: 4px;
-        background: #FFF;
+        background: #fff;
        position: absolute;
        bottom: 14px;
        left: 50%;
@@ -229,7 +287,7 @@ export default {
    height: 160px;
    padding: 32px;
    box-sizing: border-box;
-    background: #FFF;
+    background: #fff;
    display: flex;
    align-items: center;
    .header_left {
@@ -246,7 +304,7 @@ export default {
    }
    .header_right {
      width: 120px;
-      color: #5297FF;
+      color: #5297ff;
    }
  }

@@ -255,7 +313,7 @@ export default {
    padding: 32px;
    box-sizing: border-box;
    .pie_info {
-      background: #FFF;
+      background: #fff;
      border-radius: 16px;
      padding-bottom: 20px;
      box-sizing: border-box;
@@ -288,8 +346,8 @@ export default {
        height: 80px;
        line-height: 80px;
        text-align: center;
-        color: #FFF;
-        background: #3AA0FF;
+        color: #fff;
+        background: #3aa0ff;
        border-radius: 8px;
      }
    }
@@ -300,7 +358,7 @@ export default {
    box-sizing: border-box;

    .list_card {
-      background: #FFF;
+      background: #fff;
      border-radius: 16px;
      padding: 30px 30px;

@@ -309,7 +367,5 @@ export default {
      }
    }
  }
-
-
 }
 </style>