cloudroam
2024-12-31 2eeea7a6431f0b5fb25b338e2512c48deab8652e
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<template>
  <div class="base-page-wrapper coupon-detail">
    <el-bus-title title="基本信息" size="small" />
    <!-- <el-bus-form ref="form" label-width="auto" :content="formContent" readonly class="readonly-form" /> -->
    <el-form ref="form" label-width="100px">
      <el-form-item label="模板名称:"> {{ statisticsData.smsTaskName || '' }} </el-form-item>
      <el-form-item label="号码数量:"> {{ statisticsData.phoneNum || 0 }} </el-form-item>
    </el-form>
 
    <div class="base-page-wrapper__line"></div>
    <el-bus-title title="发送结果" size="small" />
    <div><el-row :gutter="20">
        <el-col :span="3" class="mb-2">
          <el-card>
            <div class="statistic-title">发送号码数量</div>
            <div class="statistic-num">{{ statisticsData.totalNum || 0 }}</div>
          </el-card>
        </el-col>
        <el-col :span="3" class="mb-2">
          <el-card>
            <div class="statistic-title">成功</div>
            <div class="statistic-num">{{ statisticsData.successNum || 0 }}</div>
          </el-card>
        </el-col>
        <el-col :span="3" class="mb-2">
          <el-card>
            <div class="statistic-title">失败</div>
            <div class="statistic-num">{{ statisticsData.failureNum || 0 }}</div>
          </el-card>
        </el-col>
        <el-col :span="3" class="mb-2">
          <el-card>
            <div class="statistic-title">发送中</div>
            <div class="statistic-num"> {{ statisticsData.sendingNum || 0 }} </div>
          </el-card>
        </el-col>
 
      </el-row></div>
    <div class="base-page-wrapper__line"></div>
    <el-bus-title title="发放记录" size="small" />
    <el-bus-crud v-bind="recordTableConfig" />
    <!-- <div class="text-center mt-20">
      <el-button class="min-w-100" @click="goBack">返回</el-button>
    </div> -->
  </div>
</template>
 
<script>
export default {
  data() {
    return {
      statisticsData:{},
      recordTableConfig: {
        url: `flower/v2/sms-task-detail/list`,
        hasOperation: false,
        hasNew: false,
        extraQuery: {
          smsTaskId: this.$route.params.id,
        },
        columns: [
          { label: '接收号码', prop: 'phone' },
          { label: '发送时间', prop: 'createTime' },
          { label: '发送结果', prop: 'resultStr' },
          { label: '失败原因', prop: 'failReason' },
        ],
        searchForm: [
          {
            type: 'row',
            items: [
              { label: '接收号码', id: 'phone', type: 'input', searchImmediately: true, },
              {
                label: '发送结果',
                id: 'result',
                type: 'bus-select-dict',
                el: {
                  code: 'SMS_SEND_RESULT',
                  multiple: false,
                  style: 'width:100%',
                  clearable: true,
                },
                searchImmediately: true,
              },
            ],
          },
        ],
      },
    }
  },
  head() {
    return {
      title: '批量发送短信详情',
    }
  },
  mounted() {
    this.getInitData()
  },
  methods: {
    async getInitData() {
      const { code, data } = await this.$elBusHttp.request(
            `flower/v2/sms-task-detail/taskStatistics/${this.$route.params.id}`,
            {
              method: 'get',
              // params: {
              //   id: this.$route.params.id
              // }
            }
          )
          if (code === 0) {
            console.log("data")
            console.log(data)
            this.statisticsData = data
          }
    },
  },
}
</script>
 
<style lang="scss" scoped>
@import '@/assets/coupon/detail.scss';
@import '@/assets/statistic/index.scss';
 
.statistic-title {
  text-align: center;
  font-size: 16px;
  color: $main-title-color;
  font-weight: bold;
  margin-bottom: 6px;
}
 
.statistic-num {
  text-align: center;
  font-size: 16px;
  color: $primary-color;
}
</style>