first commit

2026-06-03 10:09:03 +08:00
commit 81f5039458
6266 changed files with 188236 additions and 0 deletions
@@ -0,0 +1,188 @@
+<template>
+  <div class="container-box">
+    <div class="header-bar">
+      <h2>短信任务列表</h2>
+      <div>
+        <el-button type="primary" @click="handleSearch">
+          搜索
+        </el-button>
+        <el-button @click="fetchTasks" :loading="loading">
+          <el-icon><Refresh /></el-icon>
+          刷新
+        </el-button>
+      </div>
+    </div>
+
+    <el-divider />
+
+    <div class="search-bar">
+      <el-form :inline="true" :model="searchForm">
+        <el-form-item label="手机号">
+          <el-input
+            v-model="searchForm.phone"
+            placeholder="请输入手机号关键词"
+            style="width: 220px"
+          />
+        </el-form-item>
+
+        <el-form-item label="状态">
+          <el-select v-model="searchForm.status" placeholder="全部" style="width: 160px">
+            <el-option label="全部" value="" />
+            <el-option label="待发送" :value="0" />
+            <el-option label="处理中" :value="1" />
+            <el-option label="失败" :value="2" />
+            <el-option label="已上报" :value="3" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item>
+          <el-button @click="resetSearch">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <el-table v-loading="loading" :data="pagedList" style="width: 100%" border>
+      <el-table-column prop="id" label="ID" width="80" />
+      <el-table-column prop="phone" label="手机号" min-width="150" />
+      <el-table-column
+        prop="content"
+        label="短信内容"
+        min-width="260"
+        show-overflow-tooltip
+      />
+      <el-table-column prop="code" label="验证码" width="120" />
+      <el-table-column prop="status" label="状态" width="130">
+        <template #default="{ row }">
+          <el-tag :type="getStatusTagType(row.status)">
+            {{ getStatusText(row.status) }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column prop="create_time" label="创建时间" width="180" />
+    </el-table>
+
+    <div class="pagination" v-if="total > 0">
+      <el-pagination
+        v-model:current-page="pagination.current"
+        v-model:page-size="pagination.size"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="total"
+        :page-sizes="[10, 20, 50, 100]"
+        @size-change="applyPagination"
+        @current-change="applyPagination"
+      />
+    </div>
+
+  </div>
+</template>
+
+<script setup lang="ts">
+import { reactive, ref, onMounted } from "vue";
+import { Refresh } from "@element-plus/icons-vue";
+import { ElMessage } from "element-plus";
+import { getSmsTaskList } from "../../../api/sms";
+
+const loading = ref(false);
+
+const searchForm = reactive({
+  phone: "",
+  status: "",
+});
+
+const tasks = ref<any[]>([]);
+const pagedList = ref<any[]>([]);
+
+const pagination = reactive({
+  current: 1,
+  size: 10,
+});
+
+const total = ref(0);
+
+const getStatusTagType = (status: any) => {
+  const map: Record<string | number, string> = {
+    0: "info",
+    1: "warning",
+    2: "danger",
+    3: "success",
+  };
+  return map[status] || "info";
+};
+
+const getStatusText = (status: any) => {
+  const map: Record<string | number, string> = {
+    0: "待发送",
+    1: "发送中",
+    2: "发送失败",
+    3: "发送成功",
+  };
+  return map[status] || String(status ?? "");
+};
+
+const applyPagination = () => {
+  total.value = tasks.value.length;
+  const start = (pagination.current - 1) * pagination.size;
+  const end = start + pagination.size;
+  pagedList.value = tasks.value.slice(start, end);
+};
+
+const fetchTasks = async () => {
+  loading.value = true;
+  try {
+    const res = await getSmsTaskList({
+      status: searchForm.status,
+      phone: searchForm.phone,
+    });
+    if (res.code === 200) {
+      tasks.value = res.list || [];
+      pagination.current = 1;
+      applyPagination();
+    } else {
+      ElMessage.error(res.msg || "获取短信任务列表失败");
+    }
+  } catch (error: any) {
+    ElMessage.error(error?.message || "获取短信任务列表失败，请稍后重试");
+  } finally {
+    loading.value = false;
+  }
+};
+
+const handleSearch = () => {
+  pagination.current = 1;
+  fetchTasks();
+};
+
+const resetSearch = () => {
+  searchForm.phone = "";
+  searchForm.status = "";
+  pagination.current = 1;
+  fetchTasks();
+};
+
+onMounted(() => {
+  fetchTasks();
+});
+</script>
+
+<style scoped lang="less">
+.container-box {
+  padding: 20px;
+}
+
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.search-bar {
+  margin-bottom: 16px;
+}
+
+.pagination {
+  margin-top: 16px;
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
+