From 5a3de91621a323bdfc2ac00458424dc25d30412a Mon Sep 17 00:00:00 2001
From: hongxilin <17663930442@163.com>
Date: Thu, 28 Nov 2024 19:49:12 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=A2=E6=88=B7=E9=87=91=E5=B8=81=E6=98=8E?=
 =?UTF-8?q?=E7=BB=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/managerecharge/activity.vue          | 104 +++--------
 .../src/views/recharge/adminRecharge.vue           | 141 ++++++++++----
 vue/gold-system/src/views/recharge/allRecharge.vue |  97 ++++++----
 vue/gold-system/src/views/usergold/index.vue       | 202 ++++++++++++++++++++-
 4 files changed, 396 insertions(+), 148 deletions(-)

diff --git a/vue/gold-system/src/views/managerecharge/activity.vue b/vue/gold-system/src/views/managerecharge/activity.vue
index be19c56..790b7a3 100644
--- a/vue/gold-system/src/views/managerecharge/activity.vue
+++ b/vue/gold-system/src/views/managerecharge/activity.vue
@@ -1,64 +1,10 @@
 <script setup>
 import { ref, onMounted, reactive, computed } from "vue";
 import ElementPlus from "element-plus";
-
-const tableData = [
-    {
-        activityName: '这是活动名称',
-        startTime: '2023-12-22 00:00:00',
-        endTime: '2024-12-22 23:59:59',
-        rechargeRatio: '10:1',
-        status: '进行中',
-        adminName: '张三',
-        createTime: '2023-01-01 00:00:00',
-    },
-    {
-        activityName: '这是活动名称2',
-        startTime: '2023-12-22 00:00:00',
-        endTime: '2024-12-22 23:59:59',
-        rechargeRatio: '5:1',
-        status: '进行中',
-        adminName: '张三',
-        createTime: '2023-01-01 00:00:00',
-    },
-    {
-        activityName: '这是活动名称3',
-        startTime: '2024-12-22 00:00:00',
-        endTime: '2025-12-22 23:59:59',
-        rechargeRatio: '10:1',
-        status: '未开始',
-        adminName: '张三',
-        createTime: '2023-01-01 00:00:00',
-    },
-    {
-        activityName: '这是活动名称4',
-        startTime: '2024-12-22 00:00:00',
-        endTime: '2025-12-22 23:59:59',
-        rechargeRatio: '5:1',
-        status: '未开始',
-        adminName: '张三',
-        createTime: '2023-01-01 00:00:00',
-    },
-    {
-        activityName: '这是活动名称5',
-        startTime: '2023-01-01 00:00:00',
-        endTime: '2023-12-22 23:59:59',
-        rechargeRatio: '10:1',
-        status: '已结束',
-        adminName: '张三',
-        createTime: '2023-01-01 00:00:00',
-    },
-    {
-        activityName: '这是活动名称6',
-        startTime: '2023-01-01 00:00:00',
-        endTime: '2023-12-22 23:59:59',
-        rechargeRatio: '5:1',
-        status: '已结束',
-        adminName: '张三',
-        createTime: '2023-01-01 00:00:00',
-    },
-
-]
+import axios from 'axios';
+//变量
+//活动表格数据
+const tableData = ref[{}];
 
 //搜索对象
 const getObj = ref({
@@ -67,15 +13,10 @@ const getObj = ref({
 })
 //分页总条目
 const total = ref(100)
-// 添加对象
-const addObj = ref({
-    activityName: '',
-    freeGold: '',
-    rechargeRatio: '',
-    startTime: '',
-    endTime: '',
-    adminName: '',
-})
+
+
+//方法
+//搜索方法
 
 //新增活动弹出框
 const addActivityVisible = ref(false)
@@ -92,7 +33,8 @@ const addActicity = function () {
     openAddActivityVisible();
 }
 
-const form = reactive({
+// 添加对象
+const addObj = reactive({
     activityName: '',
     freeGold: '',
     rechargeRatio: '',
@@ -193,34 +135,34 @@ const Delete = function (index, row) {
     <el-dialog v-model="addActivityVisible" title="新增活动" width="500" :before-close="closeAddActivityVisible">
         <template #footer>
 
-            <el-form :model="form" label-width="auto" style="max-width: 600px">
+            <el-form :model="addObj" label-width="auto" style="max-width: 600px">
 
-                <el-form-item label="活动名称">
-                    <el-input v-model="form.activityName" placeholder="请输入活动名称" />
+                <el-form-item label="活动名称:">
+                    <el-input v-model="addObj.activityName" placeholder="请输入活动名称" style="width: 220px;"/>
                 </el-form-item>
 
-                <el-form-item label="免费金币">
-                    <el-radio-group v-model="form.freeGold">
+                <el-form-item label="免费金币:">
+                    <el-radio-group v-model="addObj.freeGold">
                         <el-radio value="0">无赠送</el-radio>
                         <el-radio value="1">有赠送</el-radio>
                     </el-radio-group>
                 </el-form-item>
 
-                <el-form-item label="免费金币兑换比">
-                    <el-input v-model="form.rechargeRatio" placeholder="请输入" style="width: 80px;" />：1
+                <el-form-item label="免费金币兑换比:">
+                    <el-input v-model="addObj.rechargeRatio" placeholder="请输入" style="width: 80px;" />：1
                     <div style="color: grey;">(提示：当前规则每10新币可兑换1免费金币)</div>
                 </el-form-item>
 
-                <el-form-item label="开始时间">
-                    <el-time-picker v-model="form.startTime" />
+                <el-form-item label="开始时间:">
+                    <el-time-picker v-model="addObj.startTime" />
                 </el-form-item>
 
-                <el-form-item label="结束时间">
-                    <el-time-picker v-model="form.endTime" />
+                <el-form-item label="结束时间:">
+                    <el-time-picker v-model="addObj.endTime" />
                 </el-form-item>
 
-                <el-form-item label="添加人">
-                    <el-input v-model="form.adminName" disabled />
+                <el-form-item label="添加人:">
+                    <el-input v-model="addObj.adminName" disabled style="width: 220px;"/>
                 </el-form-item>
 
             </el-form>
diff --git a/vue/gold-system/src/views/recharge/adminRecharge.vue b/vue/gold-system/src/views/recharge/adminRecharge.vue
index e936ce0..36753ba 100644
--- a/vue/gold-system/src/views/recharge/adminRecharge.vue
+++ b/vue/gold-system/src/views/recharge/adminRecharge.vue
@@ -5,7 +5,7 @@ import { AiFillRead } from "vue-icons-plus/ai";
 
 const tableData = [
     {
-        userName: '梁凡',
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -22,7 +22,7 @@ const tableData = [
         createTime: '2023-01-01 00:00:00',
     },
     {
-        userName: '梁凡',
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -37,8 +37,8 @@ const tableData = [
         reason: '原因',
         rechargeTime: '2023-12-22 00:00:00',
         createTime: '2023-01-01 00:00:00',
-    },{
-        userName: '梁凡',
+    }, {
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -53,8 +53,8 @@ const tableData = [
         reason: '原因',
         rechargeTime: '2023-12-22 00:00:00',
         createTime: '2023-01-01 00:00:00',
-    },{
-        userName: '梁凡',
+    }, {
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -69,8 +69,8 @@ const tableData = [
         reason: '原因',
         rechargeTime: '2023-12-22 00:00:00',
         createTime: '2023-01-01 00:00:00',
-    },{
-        userName: '梁凡',
+    }, {
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -89,6 +89,31 @@ const tableData = [
 
 ]
 
+//下拉框
+const value = ref('')
+const options = [
+    {
+        value: 'Option1',
+        label: 'Option1',
+    },
+    {
+        value: 'Option2',
+        label: 'Option2',
+    },
+    {
+        value: 'Option3',
+        label: 'Option3',
+    },
+    {
+        value: 'Option4',
+        label: 'Option4',
+    },
+    {
+        value: 'Option5',
+        label: 'Option5',
+    },
+]
+
 //分页对象
 const getObj = ref({
     page: 1,
@@ -129,9 +154,9 @@ const handleClick = function (tab, event) {
 }
 
 
-    const Delete = function (index, row) {
-        console.log(index, row)
-    }
+const Delete = function (index, row) {
+    console.log(index, row)
+}
 
 </script>
 
@@ -143,20 +168,29 @@ const handleClick = function (tab, event) {
                     <el-col :span="8">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">活动名称：</el-text>
-                            <el-input v-model="input" style="width: 240px" clearable />
+                            <el-select v-model="value" placeholder="请选择活动名称" size="large" style="width: 240px">
+                                <el-option v-for="item in options" :key="item.value" :label="item.label"
+                                    :value="item.value" />
+                            </el-select>
                         </div>
                     </el-col>
                     <el-col :span="8">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">充值方式：</el-text>
-                            <el-input v-model="input" style="width: 240px" clearable />
+                            <el-select v-model="value" placeholder="请选择充值方式" size="large" style="width: 240px">
+                                <el-option v-for="item in options" :key="item.value" :label="item.label"
+                                    :value="item.value" />
+                            </el-select>
                         </div>
 
                     </el-col>
                     <el-col :span="8">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">所属地区：</el-text>
-                            <el-input v-model="input" style="width: 240px" placeholder="请输入活动名称" clearable />
+                            <el-select v-model="value" placeholder="请选择所属地区" size="large" style="width: 240px">
+                                <el-option v-for="item in options" :key="item.value" :label="item.label"
+                                    :value="item.value" />
+                            </el-select>
                         </div>
                     </el-col>
                 </el-row>
@@ -185,24 +219,24 @@ const handleClick = function (tab, event) {
         <el-col>
             <el-card>
                 <el-tabs v-model="activeName" type="card" class="demo-tabs" @tab-click="handleClick">
-                    <el-tab-pane label="全部" name="all" ></el-tab-pane>
-                    <el-tab-pane label="待审核" name="wait" ></el-tab-pane>
-                    <el-tab-pane label="已通过" name="pass" ></el-tab-pane>
+                    <el-tab-pane label="全部" name="all"></el-tab-pane>
+                    <el-tab-pane label="待审核" name="wait"></el-tab-pane>
+                    <el-tab-pane label="已通过" name="pass"></el-tab-pane>
                     <el-tab-pane label="已驳回" name="reject"></el-tab-pane>
                 </el-tabs>
                 <div>
                     <el-table :data="tableData" style="width: 100%">
-                        <el-table-column prop="userName" label="姓名" width="100px"/>
-                        <el-table-column prop="homilyId" label="精网号" width="150px"/>
-                        <el-table-column prop="area" label="所属地区" width="100px"/>
-                        <el-table-column prop="activityName" label="活动名称" width="150px"/>
-                        <el-table-column prop="rechargeGold" label="充值金额"  width="100px"/>
-                        <el-table-column prop="paidGold" label="充值金币" width="100px"/>
-                        <el-table-column prop="freeGold" label="免费金币" width="100px"/>
-                        <el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip/>
-                        <el-table-column prop="rechargeWay" label="支付方式" width="100px"/>
-                        <el-table-column prop="rechargeVoucher" label="支付凭证" width="150px"/>
-                        <el-table-column prop="adminName" label="提交人" width="100px"/>
+                        <el-table-column prop="name" label="姓名" width="100px" />
+                        <el-table-column prop="homilyId" label="精网号" width="150px" />
+                        <el-table-column prop="area" label="所属地区" width="100px" />
+                        <el-table-column prop="activityName" label="活动名称" width="150px" />
+                        <el-table-column prop="rechargeGold" label="充值金额" width="100px" />
+                        <el-table-column prop="paidGold" label="充值金币" width="100px" />
+                        <el-table-column prop="freeGold" label="免费金币" width="100px" />
+                        <el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip />
+                        <el-table-column prop="rechargeWay" label="支付方式" width="100px" />
+                        <el-table-column prop="rechargeVoucher" label="支付凭证" width="150px" />
+                        <el-table-column prop="adminName" label="提交人" width="100px" />
                         <el-table-column prop="status" label="状态" width="100px">
                             <template #default="scope">
                                 <div class="status">
@@ -219,9 +253,9 @@ const handleClick = function (tab, event) {
                                 </div>
                             </template>
                         </el-table-column>
-                        <el-table-column prop="reason" label="驳回理由" width="200px" show-overflow-tooltip/>
-                        <el-table-column prop="rechargeTime" label="交款时间" width="200px"/>
-                        <el-table-column prop="createTime" label="提交时间" width="200px"/>
+                        <el-table-column prop="reason" label="驳回理由" width="200px" show-overflow-tooltip />
+                        <el-table-column prop="rechargeTime" label="交款时间" width="200px" />
+                        <el-table-column prop="createTime" label="提交时间" width="200px" />
                         <el-table-column fixed="right" prop="operation" label="操作" width="150px">
                             <template #default="scope">
                                 <el-popconfirm title="确定将此条活动删除吗？">
@@ -250,6 +284,51 @@ const handleClick = function (tab, event) {
         </el-col>
     </el-row>
 
+    <!-- 编辑弹窗 -->
+    <el-dialog v-model="editRechargeVisible" title="新增活动" width="500" :before-close="closeEditRechargeVisible">
+        <template #footer>
+
+            <el-form :model="editObj" label-width="auto" style="max-width: 600px">
+
+                <el-form-item label="活动名称:">
+                    <el-input v-model="addObj.activityName" placeholder="请输入活动名称" style="width: 220px;"/>
+                </el-form-item>
+
+                <el-form-item label="免费金币:">
+                    <el-radio-group v-model="addObj.freeGold">
+                        <el-radio value="0">无赠送</el-radio>
+                        <el-radio value="1">有赠送</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+
+                <el-form-item label="免费金币兑换比:">
+                    <el-input v-model="addObj.rechargeRatio" placeholder="请输入" style="width: 80px;" />：1
+                    <div style="color: grey;">(提示：当前规则每10新币可兑换1免费金币)</div>
+                </el-form-item>
+
+                <el-form-item label="开始时间:">
+                    <el-time-picker v-model="addObj.startTime" />
+                </el-form-item>
+
+                <el-form-item label="结束时间:">
+                    <el-time-picker v-model="addObj.endTime" />
+                </el-form-item>
+
+                <el-form-item label="添加人:">
+                    <el-input v-model="addObj.adminName" disabled style="width: 220px;"/>
+                </el-form-item>
+
+            </el-form>
+
+            <div class="dialog-footer">
+                <el-button @click="closeAddActivityVisible">取消</el-button>
+                <el-button type="primary" @click="closeAddActivityVisible">
+                    提交
+                </el-button>
+            </div>
+        </template>
+    </el-dialog>
+
 </template>
 
 <style scoped>
diff --git a/vue/gold-system/src/views/recharge/allRecharge.vue b/vue/gold-system/src/views/recharge/allRecharge.vue
index 00f9b58..f789890 100644
--- a/vue/gold-system/src/views/recharge/allRecharge.vue
+++ b/vue/gold-system/src/views/recharge/allRecharge.vue
@@ -5,7 +5,7 @@ import { AiFillRead } from "vue-icons-plus/ai";
 
 const tableData = [
     {
-        userName: '梁凡',
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -22,7 +22,7 @@ const tableData = [
         createTime: '2023-01-01 00:00:00',
     },
     {
-        userName: '梁凡',
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -37,8 +37,8 @@ const tableData = [
         reason: '原因',
         rechargeTime: '2023-12-22 00:00:00',
         createTime: '2023-01-01 00:00:00',
-    },{
-        userName: '梁凡',
+    }, {
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -53,8 +53,8 @@ const tableData = [
         reason: '原因',
         rechargeTime: '2023-12-22 00:00:00',
         createTime: '2023-01-01 00:00:00',
-    },{
-        userName: '梁凡',
+    }, {
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -69,8 +69,8 @@ const tableData = [
         reason: '原因',
         rechargeTime: '2023-12-22 00:00:00',
         createTime: '2023-01-01 00:00:00',
-    },{
-        userName: '梁凡',
+    }, {
+        name: '梁凡',
         homilyId: '123456',
         area: '北京',
         activityName: '这是活动名称',
@@ -89,6 +89,30 @@ const tableData = [
 
 ]
 
+const value = ref('')
+const options = [
+    {
+        value: 'Option1',
+        label: 'Option1',
+    },
+    {
+        value: 'Option2',
+        label: 'Option2',
+    },
+    {
+        value: 'Option3',
+        label: 'Option3',
+    },
+    {
+        value: 'Option4',
+        label: 'Option4',
+    },
+    {
+        value: 'Option5',
+        label: 'Option5',
+    },
+]
+
 //分页对象
 const getObj = ref({
     page: 1,
@@ -129,9 +153,9 @@ const handleClick = function (tab, event) {
 }
 
 
-    const Delete = function (index, row) {
-        console.log(index, row)
-    }
+const Delete = function (index, row) {
+    console.log(index, row)
+}
 
 </script>
 
@@ -143,20 +167,29 @@ const handleClick = function (tab, event) {
                     <el-col :span="8">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">活动名称：</el-text>
-                            <el-input v-model="input" style="width: 240px" clearable />
+                            <el-select v-model="value" placeholder="请选择活动名称" size="large" style="width: 240px">
+                                <el-option v-for="item in options" :key="item.value" :label="item.label"
+                                    :value="item.value" />
+                            </el-select>
                         </div>
                     </el-col>
                     <el-col :span="8">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">充值方式：</el-text>
-                            <el-input v-model="input" style="width: 240px" clearable />
+                            <el-select v-model="value" placeholder="请选择充值方式" size="large" style="width: 240px">
+                                <el-option v-for="item in options" :key="item.value" :label="item.label"
+                                    :value="item.value" />
+                            </el-select>
                         </div>
 
                     </el-col>
                     <el-col :span="8">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">所属地区：</el-text>
-                            <el-input v-model="input" style="width: 240px" placeholder="请输入活动名称" clearable />
+                            <el-select v-model="value" placeholder="请选择所属地区" size="large" style="width: 240px">
+                                <el-option v-for="item in options" :key="item.value" :label="item.label"
+                                    :value="item.value" />
+                            </el-select>
                         </div>
                     </el-col>
                 </el-row>
@@ -185,24 +218,24 @@ const handleClick = function (tab, event) {
         <el-col>
             <el-card>
                 <el-tabs v-model="activeName" type="card" class="demo-tabs" @tab-click="handleClick">
-                    <el-tab-pane label="全部" name="all" @click="adminAll()"></el-tab-pane>
-                    <el-tab-pane label="待审核" name="wait" @click="adminWait()"></el-tab-pane>
-                    <el-tab-pane label="已通过" name="pass" @click="adminPass()"></el-tab-pane>
-                    <el-tab-pane label="已驳回" name="reject" @click="adminReject()"></el-tab-pane>
+                    <el-tab-pane label="全部" name="all"></el-tab-pane>
+                    <el-tab-pane label="待审核" name="wait"></el-tab-pane>
+                    <el-tab-pane label="已通过" name="pass"></el-tab-pane>
+                    <el-tab-pane label="已驳回" name="reject"></el-tab-pane>
                 </el-tabs>
                 <div>
                     <el-table :data="tableData" style="width: 100%">
-                        <el-table-column prop="userName" label="姓名" width="100px"/>
-                        <el-table-column prop="homilyId" label="精网号" width="150px"/>
-                        <el-table-column prop="area" label="所属地区" width="100px"/>
-                        <el-table-column prop="activityName" label="活动名称" width="150px"/>
-                        <el-table-column prop="rechargeGold" label="充值金额"  width="100px"/>
-                        <el-table-column prop="paidGold" label="充值金币" width="100px"/>
-                        <el-table-column prop="freeGold" label="免费金币" width="100px"/>
-                        <el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip/>
-                        <el-table-column prop="rechargeWay" label="支付方式" width="100px"/>
-                        <el-table-column prop="rechargeVoucher" label="支付凭证" width="150px"/>
-                        <el-table-column prop="adminName" label="提交人" width="100px"/>
+                        <el-table-column prop="name" label="姓名" width="100px" />
+                        <el-table-column prop="homilyId" label="精网号" width="150px" />
+                        <el-table-column prop="area" label="所属地区" width="100px" />
+                        <el-table-column prop="activityName" label="活动名称" width="150px" />
+                        <el-table-column prop="rechargeGold" label="充值金额" width="100px" />
+                        <el-table-column prop="paidGold" label="充值金币" width="100px" />
+                        <el-table-column prop="freeGold" label="免费金币" width="100px" />
+                        <el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip />
+                        <el-table-column prop="rechargeWay" label="支付方式" width="100px" />
+                        <el-table-column prop="rechargeVoucher" label="支付凭证" width="150px" />
+                        <el-table-column prop="adminName" label="提交人" width="100px" />
                         <el-table-column prop="status" label="状态" width="100px">
                             <template #default="scope">
                                 <div class="status">
@@ -219,9 +252,9 @@ const handleClick = function (tab, event) {
                                 </div>
                             </template>
                         </el-table-column>
-                        <el-table-column prop="reason" label="驳回理由" width="200px" show-overflow-tooltip/>
-                        <el-table-column prop="rechargeTime" label="交款时间" width="200px"/>
-                        <el-table-column prop="createTime" label="提交时间" width="200px"/>
+                        <el-table-column prop="reason" label="驳回理由" width="200px" show-overflow-tooltip />
+                        <el-table-column prop="rechargeTime" label="交款时间" width="200px" />
+                        <el-table-column prop="createTime" label="提交时间" width="200px" />
                         <el-table-column fixed="right" prop="operation" label="操作" width="150px">
                             <template #default="scope">
                                 <el-popconfirm title="确定将此条活动删除吗？">
diff --git a/vue/gold-system/src/views/usergold/index.vue b/vue/gold-system/src/views/usergold/index.vue
index 2cd2a17..f9be8a3 100644
--- a/vue/gold-system/src/views/usergold/index.vue
+++ b/vue/gold-system/src/views/usergold/index.vue
@@ -1,13 +1,207 @@
 <script setup>
-    
+import { ref, onMounted, reactive, computed } from "vue";
+import ElementPlus from "element-plus";
+
+const tableData = [
+    {
+        activityName: '这是活动名称',
+        startTime: '2023-12-22 00:00:00',
+        endTime: '2024-12-22 23:59:59',
+        rechargeRatio: '10:1',
+        status: '进行中',
+        adminName: '张三',
+        createTime: '2023-01-01 00:00:00',
+    },
+    {
+        activityName: '这是活动名称2',
+        startTime: '2023-12-22 00:00:00',
+        endTime: '2024-12-22 23:59:59',
+        rechargeRatio: '5:1',
+        status: '进行中',
+        adminName: '张三',
+        createTime: '2023-01-01 00:00:00',
+    },
+    {
+        activityName: '这是活动名称3',
+        startTime: '2024-12-22 00:00:00',
+        endTime: '2025-12-22 23:59:59',
+        rechargeRatio: '10:1',
+        status: '未开始',
+        adminName: '张三',
+        createTime: '2023-01-01 00:00:00',
+    },
+    {
+        activityName: '这是活动名称4',
+        startTime: '2024-12-22 00:00:00',
+        endTime: '2025-12-22 23:59:59',
+        rechargeRatio: '5:1',
+        status: '未开始',
+        adminName: '张三',
+        createTime: '2023-01-01 00:00:00',
+    },
+    {
+        activityName: '这是活动名称5',
+        startTime: '2023-01-01 00:00:00',
+        endTime: '2023-12-22 23:59:59',
+        rechargeRatio: '10:1',
+        status: '已结束',
+        adminName: '张三',
+        createTime: '2023-01-01 00:00:00',
+    },
+    {
+        activityName: '这是活动名称6',
+        startTime: '2023-01-01 00:00:00',
+        endTime: '2023-12-22 23:59:59',
+        rechargeRatio: '5:1',
+        status: '已结束',
+        adminName: '张三',
+        createTime: '2023-01-01 00:00:00',
+    },
+
+]
+
+//下拉框
+const value = ref('')
+const options = [
+    {
+        value: 'Option1',
+        label: 'Option1',
+    },
+    {
+        value: 'Option2',
+        label: 'Option2',
+    },
+    {
+        value: 'Option3',
+        label: 'Option3',
+    },
+    {
+        value: 'Option4',
+        label: 'Option4',
+    },
+    {
+        value: 'Option5',
+        label: 'Option5',
+    },
+]
+
+
+//搜索对象
+const getObj = ref({
+    page: 1,
+    size: 10,
+})
+//分页总条目
+const total = ref(100)
+
+//新增活动弹出框
+const addActivityVisible = ref(false)
+//打开新增活动弹出框
+const openAddActivityVisible = function () {
+    addActivityVisible.value = true
+}
+//关闭新增窗口弹出框
+const closeAddActivityVisible = function () {
+    addActivityVisible.value = false
+}
+//添加活动按钮
+const addActicity = function () {
+    openAddActivityVisible();
+}
+
+// 添加对象
+const addObj = reactive({
+    activityName: '',
+    freeGold: '',
+    rechargeRatio: '',
+    startTime: '',
+    endTime: '',
+    adminName: '',
+})
+
+
+const Delete = function (index, row) {
+    console.log(index, row)
+}
+
 </script>
 
 <template>
-    <div>
-        <h1>User Gold</h1>
-    </div>
+    <el-row>
+        <el-col>
+            <el-card style="margin-bottom: 20px">
+                <div class="head-card">
+                    <div class="head-card-element">
+                        <el-text class="mx-1" size="large">精网号：</el-text>
+                        <el-input v-model="input" style="width: 240px" placeholder="请输入活动名称" clearable />
+                    </div>
+                    <div class="head-card-element">
+                        <el-text class="mx-1" size="large">更新类型：</el-text>
+                        <el-select v-model="value" placeholder="请选择活动名称" size="large" style="width: 240px">
+                                <el-option v-for="item in options" :key="item.value" :label="item.label"
+                                    :value="item.value" />
+                            </el-select>
+                    </div>
+                    <div class="head-card-element">
+                        <el-text class="mx-1" size="large">更新时间：</el-text>
+                        <el-time-picker v-model="value1" is-range range-separator="至" start-placeholder="起始时间"
+                            end-placeholder="结束时间" />
+                    </div>
+                    <div class="head-card-btn">
+                        <el-button>重置</el-button>
+                        <el-button type="primary">查询</el-button>
+                    </div>
+                </div>
+            </el-card>
+        </el-col>
+    </el-row>
+    <el-row>
+        <el-col>
+            <el-card>
+                <div>
+                    现有金币：免费金币：（），充值金币：（），任务金币：（）
+                </div>
+                <div>
+                    <el-table :data="tableData" style="width: 100%">
+                        <el-table-column prop="name" label="姓名" />
+                        <el-table-column prop="homilyId" label="精网号" />
+                        <el-table-column prop="area" label="所属地区" />
+                        <el-table-column prop="gold" label="更新数量" />
+                        <el-table-column prop="updateType" label="更新类型" />
+                        <el-table-column prop="freeCoin" label="免费金币" />
+                        <el-table-column prop="rechargeCoin" label="充值金币" />
+                        <el-table-column prop="taskCoin" label="任务金币" />
+                        <el-table-column prop="commitName" label="提交人" />
+                        <el-table-column prop="createTime" label="更新时间" />
+                    </el-table>
+                </div>
+
+                <!-- 分页 -->
+                <el-pagination background
+                    layout="prev, pager, next" :total="total" />
+
+            </el-card>
+        </el-col>
+    </el-row>
+
 </template>
 
 <style scoped>
 
+
+.status {
+    display: flex;
+}
+
+.head-card {
+    display: flex;
+}
+
+.head-card-element {
+    margin-right: 20px;
+}
+
+.head-card-btn {
+    margin-left: auto;
+}
 </style>
\ No newline at end of file