新增许愿之星

This commit is contained in:
Dragon
2024-02-22 20:15:22 +08:00
parent 74b32be861
commit b38614c45e
4 changed files with 829 additions and 0 deletions

View File

@@ -0,0 +1,38 @@
import request from '@/utils/request';
import qs from 'qs';
// ==================================许愿礼物配置====================================
// 表单
export const promiseStarConfigList = query => {
return request({
url: '/admin/promiseStarConfig/list',
method: 'get',
params: query
});
};
// 新增弹窗列表数据
export const giftGetAll = query => {
return request({
url: '/admin/gift/getAll',
method: 'get',
params: query
});
};
// 新增
export const promiseStarConfigSave = query => {
return request({
url: '/admin/promiseStarConfig/save',
headers:{"Content-Type": 'application/x-www-form-urlencoded'},
method: 'post',
data: query
});
};
// 下线
export const promiseStarConfigUpdateEnable = query => {
return request({
url: '/admin/promiseStarConfig/updateEnable',
headers:{"Content-Type": 'application/x-www-form-urlencoded'},
method: 'post',
data: query
});
};

View File

@@ -0,0 +1,127 @@
<template>
<div class="box">
<!-- 查询 -->
<div class="inquire">
<span>轮次ID </span>
<el-input v-model="inquire.turnId" placeholder="" class="input"></el-input>
</div>
<div class="inquire">
<span>礼物ID </span>
<el-input v-model="inquire.giftId" placeholder="" class="input"></el-input>
</div>
<div class="inquire">
<span>用户ID</span>
<el-input v-model="inquire.userId" placeholder="" class="input"></el-input>
</div>
<div class="inquire">
<div class="block">
<span class="demonstration">轮次时间</span>
<el-date-picker
v-model="inquire.time"
type="daterange"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</div>
<!-- 查询按钮 -->
<el-button type="primary" @click="getDatas()">查询</el-button>
<el-button type="primary" @click="derive()">导出</el-button>
<!-- 表格 -->
<el-table
v-loading="loading"
:data="tableData"
border
style="width: 100%; margin-top: 25px"
>
<el-table-column prop="x" align="center" label="参与时间" />
<el-table-column prop="x" align="center" label="用户id" />
<el-table-column prop="x" align="center" label="用户昵称" />
<el-table-column align="center" label="轮次信息">
<template v-slot="scope">
<div>轮次id: {{ scope.row.x }}</div>
<div>轮次礼物: {{ scope.row.x }}</div>
<div>需要魔法棒: {{ scope.row.x }}</div>
<div>{{ scope.row.x == 0 ? "轮次进行中" : "轮次已结束" }}</div>
</template>
</el-table-column>
<el-table-column prop="x" align="center" label="参与魔法棒数量" />
<el-table-column prop="x" align="center" label="该用户本轮是否中奖" />
</el-table>
<!-- 分页 -->
<el-pagination
style="margin-top: 10px"
class="paginationClass"
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[10, 20, 30, 40, 50, 100, 200, 300, 400, 500, 999999999]"
:small="small"
:disabled="disabled"
:background="background"
layout="sizes, prev, pager, next"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</template>
<script>
import { ElMessage } from "element-plus";
export default {
name: "userParticipationRecord",
data() {
return {
//查询所需条件对象
inquire: {
turnId: "",
giftId: "",
userId: "",
time: "",
},
// 表格
tableData: [{ x: 1 }],
// 分页
total: 10, //总页数
currentPage: 1, //页码
pageSize: 10, //条数
};
},
created() {},
methods: {
// 导出按钮
derive() {},
// 分页导航
handleSizeChange(val) {},
handleCurrentChange(val) {},
},
};
</script>
<style lang="less" scoped>
.box {
padding-top: 20px;
background: #ecf0f5;
.inquire {
display: inline-block;
margin-right: 20px;
span {
margin-right: 10px;
}
.input {
width: 180px;
margin-right: 10px;
}
}
.dialogTableVisibleBut {
display: block;
margin: 30px 0 0 830px;
}
.paginationClass {
margin: 15px 0 5px 0px;
}
}
</style>

View File

@@ -0,0 +1,185 @@
<template>
<div class="box">
<!-- 查询 -->
<div class="inquire">
<span>轮次ID </span>
<el-input v-model="inquire.turnId" placeholder="" class="input"></el-input>
</div>
<div class="inquire">
<span>礼物ID </span>
<el-input v-model="inquire.giftId" placeholder="" class="input"></el-input>
</div>
<div class="inquire">
<span>用户ID</span>
<el-input v-model="inquire.userId" placeholder="" class="input"></el-input>
</div>
<div class="inquire">
<div class="block">
<span class="demonstration">轮次时间</span>
<el-date-picker
v-model="inquire.time"
type="daterange"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</div>
<!-- 查询按钮 -->
<el-button type="primary" @click="getDatas()">查询</el-button>
<!-- 外层表格 -->
<el-table :data="tableData" border style="margin-top: 25px; width: 100%">
<el-table-column align="center" fixed prop="x" label="轮次id"> </el-table-column>
<el-table-column align="center" fixed prop="x" label="轮次开始时间">
</el-table-column>
<el-table-column align="center" fixed prop="x" label="轮次结束时间">
</el-table-column>
<el-table-column align="center" fixed prop="x" label="礼物信息">
<template v-slot="scope">
<div>id:{{ scope.row.x }}</div>
<div>名称:{{ scope.row.x }}</div>
<div>价值:{{ scope.row.x }}</div>
<!-- 礼物图片 -->
<el-image
style="width: 100px; height: 100px"
:src="scope.row.giftImg"
:zoom-rate="1.1"
:preview-src-list="[scope.row.giftImg]"
fit="cover"
preview-teleported="true"
hide-on-click-modal="true"
/>
</template>
</el-table-column>
<el-table-column align="center" fixed prop="x" label="状态"> </el-table-column>
<el-table-column align="center" fixed label="参与用户数">
<template v-slot="scope">
<el-button @click="button(scope.row, 1)" type="text" size="small"
>人数: {{ scope.row.x }}</el-button
>
<div>白名单:{{ scope.row.x }}</div>
</template>
</el-table-column>
<el-table-column align="center" fixed label="进度">
<template v-slot="scope">
<div>{{ scope.row.x }}/{{ scope.row.x }}</div>
</template>
</el-table-column>
<el-table-column align="center" fixed label="奖励获得者">
<template v-slot="scope">
<div>用户id:{{ scope.row.x }}</div>
<div>用户昵称:{{ scope.row.x }}</div>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination
style="margin-top: 10px"
class="paginationClass"
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[10, 20, 30, 40, 50, 100, 200, 300, 400, 500, 999999999]"
:small="small"
:disabled="disabled"
:background="background"
layout="sizes, prev, pager, next"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
<!-- 内表单弹窗 -->
<el-dialog v-model="dialogTableVisible" :title="dialogTableVisibleTitle">
<el-table style="width: 100%" :data="dialogTableData" border>
<el-table-column align="center" fixed property="x" label="用户id" />
<el-table-column align="center" fixed property="x" label="用户昵称" />
<el-table-column align="center" fixed property="x" label="参与魔法棒数量" />
<el-table-column align="center" fixed label="操作">
<template v-slot="scope">
<el-button @click="white(scope.row)" type="primary" size="small"
>设为白名单</el-button
>
</template>
</el-table-column>
</el-table>
<el-button
class="dialogTableVisibleBut"
type="primary"
@click="dialogTableVisible = false"
>
关闭
</el-button>
</el-dialog>
</div>
</template>
<script>
import { ElMessage } from "element-plus";
export default {
name: "wishingRound",
data() {
return {
//查询所需条件对象
inquire: {
turnId: "",
giftId: "",
userId: "",
time: "",
},
// 外层表格
tableData: [{ x: 1 }],
// 分页
total: 10, //总页数
currentPage: 1, //页码
pageSize: 10, //条数
// 内表格
dialogTableVisible: false, //控制内表单
dialogTableVisibleTitle: "轮次idxxx的参与情况", //控制内表单
dialogTableData: [{ x: "1" }], //内表单数据
};
},
created() {},
methods: {
// 外层表格按钮
button(res) {
console.log(res);
this.dialogTableVisible = true;
},
// 设置白名单按钮
white(res) {
console.log(res);
},
// 分页导航
handleSizeChange(val) {},
handleCurrentChange(val) {},
},
};
</script>
<style lang="less" scoped>
.box {
padding-top: 20px;
background: #ecf0f5;
.inquire {
display: inline-block;
margin-right: 20px;
span {
margin-right: 10px;
}
.input {
width: 180px;
margin-right: 10px;
}
}
.dialogTableVisibleBut {
display: block;
margin: 30px 0 0 830px;
}
.paginationClass {
margin: 15px 0 5px 0px;
}
}
</style>

View File

@@ -0,0 +1,479 @@
<template>
<div class="outer">
<!-- 按钮 -->
<div class="buttonBox">
<el-button class="primary" type="primary" size="default" @click="add()"
>新增</el-button
>
</div>
<!-- 列表 -->
<el-table
v-loading="loading"
:data="tableData"
border
style="width: 100%; margin-top: 25px"
>
<el-table-column prop="giftId" align="center" label="礼物id" />
<el-table-column prop="giftName" align="center" label="礼物名称" />
<el-table-column align="center" prop="icon" label="礼物图片">
<template v-slot="scope">
<el-image
style="width: 100px; height: 100px"
:src="scope.row.giftUrl"
:zoom-rate="1.1"
:preview-src-list="[scope.row.giftUrl]"
fit="cover"
preview-teleported="true"
hide-on-click-modal="true"
/>
</template>
</el-table-column>
<el-table-column prop="createTime" align="center" label="添加时间" />
<el-table-column prop="giftPrice" align="center" label="礼物价值" />
<el-table-column prop="stickNum" align="center" label="需要魔法棒数量" />
<el-table-column prop="promiseCount" align="center" label="累计许愿出次数" />
<el-table-column prop="stockNum" align="center" label="库存" />
<!-- <el-table-column prop="isEnabled" align="center" label="是否可见" /> -->
<el-table-column align="center" label="是否可见">
<template v-slot="scope">
<div>{{ scope.row.isEnabled == 0 ? "否" : "是" }}</div>
</template>
</el-table-column>
<el-table-column prop="seqNo" align="center" label="排序" />
<el-table-column align="center" label="操作" width="300">
<template v-slot="scope">
<el-button @click="edi(scope.row)" class="primary" type="primary" size="default"
>编辑</el-button
>
<el-button
@click="controls(scope.row)"
:class="scope.row.isEnabled == 1 ? 'danger' : 'primary'"
:type="scope.row.isEnabled == 1 ? 'danger' : 'primary'"
size="default"
><div>{{ scope.row.isEnabled == 1 ? "下线" : "上线" }}</div></el-button
>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination
style="margin-top: 10px; display: none"
class="paginationClass"
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[10, 20, 30, 40, 50, 100, 200, 300, 400, 500, 999999999]"
:small="small"
:disabled="disabled"
:background="background"
layout="sizes, prev, pager, next"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
<!-- 新增弹窗 -->
<el-dialog v-model="addDialog" title="新增" width="28%" center>
<div style="margin-bottom: 25px; margin-top: 10px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>许愿礼物</span
>
<el-select
filterable
v-model="resource.index"
@change="giftOptionsChange"
style="width: 75%"
placeholder="请选择"
>
<el-option
v-for="(item, i) in giftOptions"
:key="i"
:label="item.giftName"
:value="i"
></el-option>
</el-select>
</div>
<div style="margin-bottom: 25px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>礼物价值</span
>
<el-input
v-model="resource.goldPrice"
style="width: 75%"
class="input"
:placeholder="先选择许愿礼物"
disabled
></el-input>
</div>
<div style="margin-bottom: 25px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>魔法棒数量</span
>
<el-input v-model="resource.stickNum" style="width: 75%" class="input"></el-input>
</div>
<div style="margin-bottom: 25px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>库存</span
>
<el-input v-model="resource.stockNum" style="width: 75%" class="input"></el-input>
</div>
<div style="margin-bottom: 25px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>排序</span
>
<el-input v-model="resource.seqNo" style="width: 75%" class="input"></el-input>
</div>
<div style="margin-bottom: 25px; margin-top: 0px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>是否可见</span
>
<el-select v-model="resource.isEnabled" style="width: 75%" placeholder="请选择">
<el-option
v-for="item in showOptions"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="addDialog = false">取消</el-button>
<el-button type="primary" @click="addDialogClick()"> 确认 </el-button>
</span>
</template>
</el-dialog>
<!-- 编辑弹窗 -->
<el-dialog v-model="editDialog" title="编辑" width="28%" center>
<div style="margin-bottom: 25px; margin-top: 10px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>许愿礼物</span
>
<el-select
disabled
v-model="editresource.giftName"
style="width: 75%"
placeholder="请选择"
>
<el-option
v-for="item in editGiftOptions"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</div>
<div style="margin-bottom: 25px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>礼物价值</span
>
<el-input
v-model="editresource.goldPrice"
style="width: 75%"
class="input"
:placeholder="先选择许愿礼物"
disabled
></el-input>
</div>
<div style="margin-bottom: 25px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>魔法棒数量</span
>
<el-input
v-model="editresource.stickNum"
style="width: 75%"
class="input"
></el-input>
</div>
<div style="margin-bottom: 25px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>库存</span
>
<el-input
v-model="editresource.stockNum"
style="width: 75%"
class="input"
></el-input>
</div>
<div style="margin-bottom: 25px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>排序</span
>
<el-input
v-model="editresource.seqNo"
style="width: 75%"
class="input"
></el-input>
</div>
<div style="margin-bottom: 25px; margin-top: 0px">
<span
style="display: inline-block; margin-right: 20px"
class="col-sm-2 control-label"
>是否可见</span
>
<el-select
v-model="editresource.isEnabled"
style="width: 75%"
placeholder="请选择"
>
<el-option
v-for="item in editShowOptions"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="editDialog = false">取消</el-button>
<el-button type="primary" @click="editDialogClick()"> 确认 </el-button>
</span>
</template>
</el-dialog>
<!-- 二次确认删除弹窗 -->
<el-dialog v-model="delDialog" title="提示" width="30%" center>
<span> {{ delDialogText }}</span>
<template #footer>
<span class="dialog-footer">
<el-button @click="delDialog = false">取消</el-button>
<el-button type="primary" @click="delClick()"> 确认 </el-button>
</span>
</template>
</el-dialog>
</div>
</template>
<script>
import {
promiseStarConfigList,
giftGetAll,
promiseStarConfigSave,
promiseStarConfigUpdateEnable,
} from "@/api/wishingStar/wishingStar";
import { ElMessage } from "element-plus";
export default {
name: "wishingStarSet",
data() {
return {
loading: false,
tableData: [],
total: 10, //总页数
currentPage: 1, //页码
pageSize: 10, //条数
addDialog: false, //控制新增弹窗
resource: {
//新增弹窗所需对象
index: null,
giftId: null,
goldPrice: "",
stickNum: null,
stockNum: null,
seqNo: null,
isEnabled: null,
},
giftOptions: [
//新增弹窗礼物筛选
],
showOptions: [
//新增弹窗是否可见筛选
{
value: 0,
label: "否",
},
{
value: 1,
label: "是",
},
],
editDialog: false, //控制编辑弹窗
editresource: {
//编辑弹窗所需对象
id: null,
giftId: null,
goldPrice: null,
stickNum: null,
stockNum: null,
seqNo: null,
isEnabled: null,
},
editGiftOptions: [
//编辑弹窗礼物筛选
{
value: 0,
label: "选择许愿礼物",
},
],
editShowOptions: [
//编辑弹窗是否可见筛选
{
value: 0,
label: "否",
},
{
value: 1,
label: "是",
},
],
delDialog: false, //控制删除弹窗
delDialogText: "确认吗?", //删除弹窗提示
// 删除要用的数据对象
promiseStarConfigUpdateEnableObj: {
isEnabled: null,
id: null,
},
};
},
created() {
this.getData();
giftGetAll({
giftType: 2,
}).then((res) => {
this.giftOptions = res.data;
});
},
methods: {
// 初始化数据
getData() {
this.loading = true;
promiseStarConfigList().then((res) => {
this.tableData = res.data;
this.loading = false;
});
},
// 新增
add() {
this.addDialog = true;
},
// 监听新增礼物价值
giftOptionsChange(e) {
this.resource.giftId = this.giftOptions[e].giftId;
this.resource.giftName = this.giftOptions[e].giftName;
this.resource.goldPrice = this.giftOptions[e].goldPrice;
},
// 表单编辑
edi(res) {
console.log("编辑按钮当前一行的数据", res);
this.editresource.id = res.id;
this.editresource.giftId = res.giftId;
this.editresource.stickNum = res.stickNum;
this.editresource.stockNum = res.stockNum;
this.editresource.seqNo = res.seqNo;
this.editresource.isEnabled = res.isEnabled;
this.editDialog = true;
},
// 表单上线下线按钮
controls(res) {
console.log(res);
this.promiseStarConfigUpdateEnableObj.isEnabled = res.isEnabled == 1 ? 0 : 1;
this.promiseStarConfigUpdateEnableObj.id = res.id;
this.delDialog = true;
},
// 新增弹窗确认按钮
addDialogClick() {
promiseStarConfigSave({
giftId: this.resource.giftId,
stickNum: this.resource.stickNum,
stockNum: this.resource.stockNum,
seqNo: this.resource.seqNo,
isEnabled: this.resource.isEnabled,
}).then((res) => {
this.getData();
});
this.addDialog = false;
},
// 编辑弹窗确认按钮
editDialogClick() {
console.log(this.editresource);
promiseStarConfigSave(this.editresource).then((res) => {
this.getData();
});
this.editDialog = false;
},
// 删除弹窗确认按钮
delClick() {
console.log(this.promiseStarConfigUpdateEnableObj);
promiseStarConfigUpdateEnable({
isEnabled: this.promiseStarConfigUpdateEnableObj.isEnabled,
id: this.promiseStarConfigUpdateEnableObj.id,
}).then((res) => {
this.getData();
});
this.delDialog = false;
},
// 分页导航
handleSizeChange(val) {},
handleCurrentChange(val) {},
},
};
</script>
<style lang="less" scoped>
.outer {
padding-top: 20px;
background: #ecf0f5;
border-top: 3px solid #d2d6de;
.search {
width: 100%;
height: 41px;
.searchLeft,
.searchRight {
width: 20%;
float: left;
span {
margin-right: 10px;
}
.input {
width: 75%;
}
}
}
.buttonBox {
margin-top: 10px;
}
.authorityBox {
.authoritySpan {
margin-right: 20px;
}
.authorityInpput {
width: 50%;
}
}
.dialogTableVisibleBut {
margin: -25px 0 20px 0px;
}
}
</style>