From bc03876a7ea6b8d430ad626a1373ff2d7ae287b5 Mon Sep 17 00:00:00 2001
From: gyq <875626088@qq.com>
Date: Wed, 25 Dec 2024 14:39:57 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=85=91=E5=A5=96=E8=AE=B0?=
 =?UTF-8?q?=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                |   4 +
 src/api/renwu-record.js                     |  27 +++
 src/api/renwu.js                            |  61 +++---
 src/views/renwu/components/pop-add-gift.vue |  52 +++--
 src/views/renwu/components/record.vue       | 221 ++++++++++++++++++++
 src/views/renwu/index.vue                   | 196 ++++++++---------
 6 files changed, 409 insertions(+), 152 deletions(-)
 create mode 100644 src/api/renwu-record.js
 create mode 100644 src/views/renwu/components/record.vue

diff --git a/package.json b/package.json
index ad2ceee..1bff302 100644
--- a/package.json
+++ b/package.json
@@ -29,12 +29,16 @@
     "lodash": "^4.17.21",
     "mockjs": "^1.1.0",
     "npm": "^6.9.0",
+    "qs": "^6.13.1",
+    "quill": "^2.0.3",
+    "svg-baker-runtime": "^1.4.7",
     "svg-sprite-loader": "3.7.3",
     "video.js": "^8.20.0",
     "videojs-contrib-hls": "^5.15.0",
     "vue": "2.5.16",
     "vue-baidu-map": "^0.21.22",
     "vue-cookie": "1.1.4",
+    "vue-hot-reload-api": "^2.3.4",
     "vue-jsonp": "^2.0.0",
     "vue-quill-editor": "^3.0.6",
     "vue-router": "3.0.1",
diff --git a/src/api/renwu-record.js b/src/api/renwu-record.js
new file mode 100644
index 0000000..e468e22
--- /dev/null
+++ b/src/api/renwu-record.js
@@ -0,0 +1,27 @@
+import $http from "@/utils/httpRequest";
+
+/**
+ * 兑换记录
+ * @param {*} params
+ * @returns
+ */
+export function userPrizeExchangePage(params) {
+	return $http({
+		url: "/userPrizeExchange/page",
+		method: "get",
+		params
+	});
+}
+
+/**
+ * 管理端-发放奖品
+ * @param {*} params
+ * @returns
+ */
+export function userPrizeExchangeDeliver(data) {
+	return $http({
+		url: "/userPrizeExchange/deliver",
+		method: "POST",
+		data
+	});
+}
diff --git a/src/api/renwu.js b/src/api/renwu.js
index a62fff3..72759e3 100644
--- a/src/api/renwu.js
+++ b/src/api/renwu.js
@@ -1,41 +1,42 @@
-import $http from '@/utils/httpRequest'
+import $http from "@/utils/httpRequest";
 function add(data) {
-    return $http({
-        url: 'taskCenter/insertTaskCenter',
-        method: 'post',
-        data: data
-    })
+	return $http({
+		url: "taskCenter/insertTaskCenter",
+		method: "post",
+		data: data
+	});
 }
 function del(id) {
-    return $http({
-        url: 'taskCenter/deleteTaskCenter?id='+id,
-        method: 'post'
-    })
+	return $http({
+		url: "taskCenter/deleteTaskCenter?id=" + id,
+		method: "post"
+	});
 }
 function getList(data) {
-    return $http({
-        url: 'taskCenter/selectTaskCenter',
-        method: 'get',
-        params: data
-    })
+	return $http({
+		url: "taskCenter/selectTaskCenter",
+		method: "get",
+		params: data
+	});
 }
 function get(id) {
-    return $http({
-        url: 'taskCenter' + id,
-        method: 'get',
-        params: data
-    })
+	return $http({
+		url: "taskCenter" + id,
+		method: "get",
+		params: data
+	});
 }
 function update(data) {
-    return $http({
-        url: 'taskCenter/updateTaskCenter',
-        method: 'post',
-        data: data
-    })
+	return $http({
+		url: "taskCenter/updateTaskCenter",
+		method: "post",
+		data: data
+	});
 }
 export default {
-    add
-    , del,
-    get, getList,
-    update
-}
\ No newline at end of file
+	add,
+	del,
+	get,
+	getList,
+	update
+};
diff --git a/src/views/renwu/components/pop-add-gift.vue b/src/views/renwu/components/pop-add-gift.vue
index 2531315..0f3af00 100644
--- a/src/views/renwu/components/pop-add-gift.vue
+++ b/src/views/renwu/components/pop-add-gift.vue
@@ -1,12 +1,6 @@
 <template>
-  <el-dialog
-    :title="title"
-    width="800px"
-    top="20px"
-    :visible.sync="dialogVisible"
-    @close="diaClose"
-    :close-on-click-modal="true"
-  >
+  <el-dialog :title="title" width="800px" top="20px" :visible.sync="dialogVisible" @close="diaClose"
+    :close-on-click-modal="true">
     <div style="max-height: 70vh; overflow-y: scroll">
       <el-form ref="table" :rules="rules" :model="form" label-width="100px">
         <el-form-item label="奖励名称" required>
@@ -16,16 +10,33 @@
           <el-radio-group v-model="form.type">
             <el-radio :label="1">金币</el-radio>
             <el-radio :label="2">现金</el-radio>
+            <el-radio :label="3">虚拟物品</el-radio>
             <el-radio :label="9">大转盘抽奖次数</el-radio>
           </el-radio-group>
         </el-form-item>
+        <el-form-item label="奖励图标">
+          <el-upload
+            class="avatar-uploader"
+            v-model="form.img"
+            :action="$http.adornUrl('alioss/upload')"
+            :show-file-list="false"
+            :on-success="uploadSuccess"
+          >
+            <div class="upload-file-box">
+              <img v-if="form.img" :src="form.img" class="avatar" />
+              <i v-else class="el-icon-plus avatar-uploader-icon iconss"></i>
+            </div>
+          </el-upload>
+        </el-form-item>
         <el-form-item label="数量" required>
-          <el-input-number
-            :min="0"
-            :step="1"
-            :step-strictly="form.type == 9 ? true : false"
-            v-model="form.number"
-          ></el-input-number>
+          <el-input-number :min="0" :step="1" :step-strictly="form.type == 9 ? true : false"
+            v-model="form.number"></el-input-number>
+        </el-form-item>
+        <el-form-item label="剩余数量" required>
+          <el-input-number :min="0" :step="1" v-model="form.surplusNumber"></el-input-number>
+        </el-form-item>
+        <el-form-item label="总数量" required>
+          <el-input-number :min="0" :step="1" v-model="form.totalNumber"></el-input-number>
         </el-form-item>
       </el-form>
     </div>
@@ -54,13 +65,16 @@ export default {
         name: "",
         number: "",
         type: "",
+        img: '',
+        surplusNumber: '',
+        totalNumber: '',
+        
       },
     };
   },
   methods: {
     uploadSuccess(file) {
-      this.form.rewardImg = file.data;
-      console.log(this.form.rewardImg);
+      this.form.img = file.data;
     },
     open(item, renwu) {
       console.log(item);
@@ -77,7 +91,7 @@ export default {
         number: "",
         type: "",
       };
-      this.renwu={}
+      this.renwu = {}
     },
     async confirm() {
       if (!this.form.name) {
@@ -120,12 +134,15 @@ export default {
 .el-form-item__label {
   text-align: left;
 }
+
 ::v-deep .el-form-item__label {
   text-align: left;
 }
+
 .dialog-footer {
   padding-top: 20px;
 }
+
 .upload-file-box {
   border-radius: 6px;
   width: 148px;
@@ -135,6 +152,7 @@ export default {
   align-items: center;
   overflow: hidden;
   border: 1px solid #c0c4cc;
+
   img {
     width: 100%;
     height: 100%;
diff --git a/src/views/renwu/components/record.vue b/src/views/renwu/components/record.vue
new file mode 100644
index 0000000..19a5388
--- /dev/null
+++ b/src/views/renwu/components/record.vue
@@ -0,0 +1,221 @@
+<template>
+	<div>
+		<el-form inline>
+			<el-form-item label="用户ID">
+				<el-input v-model="query.userId" placeholder="请输入用户ID" />
+			</el-form-item>
+			<el-form-item label="记录ID">
+				<el-input v-model="query.discSpinningRecordId" placeholder="请输入抽奖记录id" />
+			</el-form-item>
+			<el-form-item label="用户名">
+				<el-input v-model="query.userName" placeholder="请输入用户名" />
+			</el-form-item>
+			<el-form-item label="手机号">
+				<el-input v-model="query.phone" placeholder="手机号" />
+			</el-form-item>
+			<el-form-item label="奖品名称">
+				<el-input v-model="query.prizeName" placeholder="请输入奖品名称" />
+			</el-form-item>
+			<el-form-item label="状态">
+				<el-select v-model="query.status">
+					<el-option label="全部" value=""></el-option>
+					<el-option label="待发放" value="0"></el-option>
+					<el-option label="已发放" value="1"></el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item label="日期">
+				<el-date-picker v-model="timeValue" type="datetimerange" range-separator="至" start-placeholder="开始日期"
+					end-placeholder="结束日期" @change="changeTime">
+				</el-date-picker>
+			</el-form-item>
+			<el-form-item>
+				<el-button type="primary" @click="queryHandle">查询</el-button>
+				<el-button @click="resetHandle">重置</el-button>
+			</el-form-item>
+		</el-form>
+		<el-table v-loading="tableData.loading" :data="tableData.list" border stripe>
+			<el-table-column label="用户ID" prop="userId"></el-table-column>
+			<el-table-column label="记录ID" prop="discSpinningRecordId"></el-table-column>
+			<el-table-column label="用户名" prop="userName"></el-table-column>
+			<el-table-column label="手机号" prop="phone"></el-table-column>
+			<el-table-column label="奖品名称" prop="prizeName"></el-table-column>
+			<el-table-column label="状态" prop="status">
+				<template slot-scope="scope">
+					<el-tag type="success" v-if="scope.row.status == 1" disable-transitions>
+						已发放
+					</el-tag>
+					<el-tag type="warning" v-if="scope.row.status == 0" disable-transitions>
+						待发放
+					</el-tag>
+				</template>
+			</el-table-column>
+			<el-table-column label="创建时间" prop="createTime"></el-table-column>
+			<el-table-column label="操作">
+				<template slot-scope="scope">
+					<el-button type="text" size="mini" @click="deliverHandle(scope.row)" v-if="scope.row.status == 0">
+						发放
+					</el-button>
+					<span v-else>已发放</span>
+				</template>
+			</el-table-column>
+		</el-table>
+		<div class="pagination">
+			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+				:page-sizes="[10, 20, 30, 40]" :page-size="tableData.limit" :current-page="tableData.page"
+				layout="total,sizes, prev, pager, next,jumper" :total="tableData.total">
+			</el-pagination>
+		</div>
+		<el-dialog title="发放奖品" width="600px" :visible.sync="visible" @close="onClose">
+			<el-form :model="form" :rules="rules" ref="form">
+				<el-form-item label="地址" prop="address">
+					<el-input v-model="form.address" placeholder="请输入地址"></el-input>
+				</el-form-item>
+				<el-form-item label="手机号" prop="phone">
+					<el-input v-model="form.phone" placeholder="请输入手机号"></el-input>
+				</el-form-item>
+				<el-form-item label="备注" prop="remark">
+					<el-input v-model="form.remark" placeholder="请输入备注"></el-input>
+				</el-form-item>
+			</el-form>
+			<template #footer>
+				<div class="dialog-footer" style="display: flex; justify-content: flex-end;">
+					<el-button size="small" @click="visible = false"> 取 消 </el-button>
+					<el-button size="small" type="primary" :loading="confirmLoading"
+						@click="confirmHandle">确定</el-button>
+				</div>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+import {
+	userPrizeExchangePage,
+	userPrizeExchangeDeliver
+} from "@/api/renwu-record.js";
+export default {
+	data() {
+		return {
+			timeValue: [],
+			query: {
+				userId: "",
+				discSpinningRecordId: "",
+				userName: "",
+				prizeName: "",
+				status: "",
+				phone: "",
+				beginDate: "",
+				endDate: ""
+			},
+			resetQuery: {},
+			tableData: {
+				page: 1,
+				limit: 10,
+				total: 0,
+				list: [],
+				loading: false
+			},
+			visible: false,
+			confirmLoading: false,
+			form: {
+				id: "",
+				address: "",
+				remark: "",
+				phone: ""
+			},
+			rules: {
+				address: [
+					{ required: true, message: "请输入地址", trigger: "blur" }
+				],
+				phone: [
+					{ required: true, message: "请输入正确的手机号", trigger: "blur", pattern: /^(?:(?:\+|00)86)?1\d{10}$/ }
+				]
+			}
+		};
+	},
+	mounted() {
+		this.resetQuery = { ...this.query };
+		this.userPrizeExchangePage();
+	},
+	methods: {
+		// 关闭弹窗, 重置表单
+		onClose() {
+			this.$refs.form.resetFields();
+		},
+		// 打开发放奖品弹窗
+		deliverHandle(row) {
+			this.form.id = row.id;
+			this.visible = true;
+		},
+		// 提交发放奖品
+		confirmHandle() {
+			this.$refs.form.validate(async valid => {
+				if (valid) {
+					this.confirmLoading = true;
+					try {
+						const { data } = await userPrizeExchangeDeliver(this.form);
+						if (data.code == 0) {
+							this.$message.success("发放成功");
+							this.visible = false;
+							this.userPrizeExchangePage();
+						} else {
+							this.$message.error(data.msg || "发放失败");
+						}
+					} catch (error) {
+						console.log(error);
+					}
+					this.confirmLoading = false;
+				}
+			});
+		},
+		// 开始查询
+		queryHandle() {
+			this.page = 1;
+			this.userPrizeExchangePage();
+		},
+		// 重置查询
+		resetHandle() {
+			this.query = { ...this.resetQuery };
+			this.timeValue = [];
+			this.userPrizeExchangePage();
+		},
+		// 确认选择日期
+		changeTime() {
+			if (this.timeValue.length == 2) {
+				this.query.beginDate = this.timeValue[0];
+				this.query.endDate = this.timeValue[1];
+			} else {
+				this.query.beginDate = "";
+				this.query.endDate = "";
+			}
+		},
+		// 分页数量
+		handleSizeChange(size) {
+			this.tableData.limit = size;
+			this.userPrizeExchangePage();
+		},
+		// 分页
+		handleCurrentChange(val) {
+			this.tableData.page = val;
+			this.userPrizeExchangePage();
+		},
+		// 获取列表
+		async userPrizeExchangePage() {
+			try {
+				this.tableData.loading = true;
+				const { data } = await userPrizeExchangePage({
+					...this.query,
+					page: this.tableData.page,
+					limit: this.tableData.limit
+				});
+				this.tableData.loading = false;
+				this.tableData.list = data.page.list;
+				this.tableData.total = data.page.totalCount;
+			} catch (error) {
+				this.tableData.loading = false;
+				console.log(error);
+			}
+		}
+	}
+};
+</script>
diff --git a/src/views/renwu/index.vue b/src/views/renwu/index.vue
index 4a22357..91f7e11 100644
--- a/src/views/renwu/index.vue
+++ b/src/views/renwu/index.vue
@@ -1,97 +1,86 @@
 <template>
   <div class="">
-    <el-button type="primary" @click="openAddZhuanpan">添加任务</el-button>
-    <div class="zhanwei"></div>
-    <el-table :border="true" :data="tableData">
-      <el-table-column
-      prop="sort"
-      label="排序"
-      sortable
-      width="50">
-    </el-table-column>
-      <el-table-column label="标题" prop="title"></el-table-column>
+    <el-tabs v-model="tabActive">
+      <el-tab-pane label="任务" name="renwu"></el-tab-pane>
+      <el-tab-pane label="兑换" name="exchang"></el-tab-pane>
+    </el-tabs>
+    <div v-if="tabActive == 'renwu'">
+      <el-button type="primary" @click="openAddZhuanpan">添加任务</el-button>
+      <div class="zhanwei"></div>
+      <el-table :border="true" :data="tableData">
+        <el-table-column prop="sort" label="排序" sortable width="50">
+        </el-table-column>
+        <el-table-column label="标题" prop="title"></el-table-column>
 
-      <el-table-column label="任务类型">
-        <template slot-scope="scope">
-          <span>{{ returnTypeName(scope.row.type) }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="详情描述">
-        <template slot-scope="scope">
-          <span>{{ scope.row.detail }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="奖励设置">
-        <template slot-scope="scope">
-          <div class="flex flex-center">
-            <el-button type="text" size="mini" @click="opengiftList(scope.row)"
-            >编辑</el-button
-          >
-          </div>
-          
-          <!-- <span>{{ scope.row.rewardDetail }}</span> -->
-        </template>
-      </el-table-column>
-      <el-table-column label="奖励描述">
-        <template slot-scope="scope">
-          <span>{{ scope.row.rewardDetail }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="奖励图片">
-        <template slot-scope="scope">
-          <img
-            style="width: 50px; height: 50px"
-            v-if="scope.row.rewardImg"
-            :src="scope.row.rewardImg"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="达标次数">
-        <template slot-scope="scope">
-          <span v-if="scope.row.type == 2">{{ scope.row.number }}</span>
-        </template>
-      </el-table-column>
- 
-      <el-table-column label="跳转类型">
-        <template slot-scope="scope">
-          <span>{{ returnJumpTypeName(scope.row.jumpType) }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="跳转路径">
-        <template slot-scope="scope">
-          <span>{{ scope.row.buttonUrl  }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="是否展示">
-        <template slot-scope="scope">
-          <el-switch @change="showsChange($event,scope.row)" v-model="scope.row.shows" :inactive-value="0" :active-value="1"></el-switch>
-        </template>
-      </el-table-column>
-      <el-table-column label="编辑">
-        <template slot-scope="scope">
-          <el-button type="text" size="mini" @click="openAddZhuanpan(scope.row)"
-            >编辑</el-button
-          >
-          <el-button type="text" size="mini" @click="del(scope.row)"
-            >删除</el-button
-          >
-        </template>
-      </el-table-column>
-    </el-table>
-    <div class="pagination">
-      <el-pagination
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        :page-sizes="[10, 20, 30, 40]"
-        :page-size="limit"
-        :current-page="page"
-        layout="total,sizes, prev, pager, next,jumper"
-        :total="total"
-      >
-      </el-pagination>
+        <el-table-column label="任务类型">
+          <template slot-scope="scope">
+            <span>{{ returnTypeName(scope.row.type) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="详情描述">
+          <template slot-scope="scope">
+            <span>{{ scope.row.detail }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="奖励设置">
+          <template slot-scope="scope">
+            <div class="flex flex-center">
+              <el-button type="text" size="mini" @click="opengiftList(scope.row)">编辑</el-button>
+            </div>
+
+            <!-- <span>{{ scope.row.rewardDetail }}</span> -->
+          </template>
+        </el-table-column>
+        <el-table-column label="奖励描述">
+          <template slot-scope="scope">
+            <span>{{ scope.row.rewardDetail }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="奖励图片">
+          <template slot-scope="scope">
+            <img style="width: 50px; height: 50px" v-if="scope.row.rewardImg" :src="scope.row.rewardImg" />
+          </template>
+        </el-table-column>
+        <el-table-column label="达标次数">
+          <template slot-scope="scope">
+            <span v-if="scope.row.type == 2">{{ scope.row.number }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="跳转类型">
+          <template slot-scope="scope">
+            <span>{{ returnJumpTypeName(scope.row.jumpType) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="跳转路径">
+          <template slot-scope="scope">
+            <span>{{ scope.row.buttonUrl }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="是否展示">
+          <template slot-scope="scope">
+            <el-switch @change="showsChange($event, scope.row)" v-model="scope.row.shows" :inactive-value="0"
+              :active-value="1"></el-switch>
+          </template>
+        </el-table-column>
+        <el-table-column label="编辑">
+          <template slot-scope="scope">
+            <el-button type="text" size="mini" @click="openAddZhuanpan(scope.row)">编辑</el-button>
+            <el-button type="text" size="mini" @click="del(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="pagination">
+        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+          :page-sizes="[10, 20, 30, 40]" :page-size="limit" :current-page="page"
+          layout="total,sizes, prev, pager, next,jumper" :total="total">
+        </el-pagination>
+      </div>
+      <add-renwu ref="refRenwu" @refresh="init"></add-renwu>
+      <gift-list ref="giftList" @refresh="init"></gift-list>
+    </div>
+    <div v-if="tabActive == 'exchang'">
+      <record ref="record" />
     </div>
-    <add-renwu ref="refRenwu" @refresh="init"></add-renwu>
-    <gift-list ref="giftList" @refresh="init"></gift-list>
   </div>
 </template>
 
@@ -99,12 +88,14 @@
 import $api from "@/api/renwu.js";
 import addRenwu from "./components/pop-add-renwu.vue";
 import giftList from "./components/pop-gift-list.vue";
-import {$renwuType,$jumpType} from './data.js'
+import record from "./components/record.vue";
+import { $renwuType, $jumpType } from './data.js'
 
 export default {
-  components: { addRenwu,giftList },
+  components: { addRenwu, giftList, record },
   data() {
     return {
+      tabActive: 'renwu',
       total: 0,
       tableData: [],
       page: 1,
@@ -114,16 +105,16 @@ export default {
     };
   },
   methods: {
-    opengiftList(item){
+    opengiftList(item) {
       this.$refs.giftList.open(item)
     },
-    async showsChange(e,item){
+    async showsChange(e, item) {
       console.log(e)
-      const res=await $api.update({...item,shows:e})
-      if(res.data.code==0){
+      const res = await $api.update({ ...item, shows: e })
+      if (res.data.code == 0) {
         this.$message.success('修改成功')
         this.init()
-      }else{
+      } else {
         this.$message.error(res.data.msg || '修改失败')
       }
     },
@@ -169,7 +160,7 @@ export default {
             }
           });
         })
-        .catch(() => {});
+        .catch(() => { });
     },
     openAddZhuanpan(item) {
       this.$refs.refRenwu.open(item);
@@ -180,19 +171,14 @@ export default {
   },
 };
 </script>
+
 <style scoped lang="scss">
 .zhanwei {
   height: 20px;
 }
+
 .pagination {
   margin-top: 20px;
   display: flex;
 }
-// .flex{
-//   display: flex;
-// } 
-// .flex-center{
-//   justify-content: center;
-// }
-
 </style>
\ No newline at end of file