Browse Source
feat 直播liveStream 铁粉dieHardFan all的接口interface and 文章视频articleVideo optimize
zhangrenyuan/feature-20250728113353-金币前端三期
feat 直播liveStream 铁粉dieHardFan all的接口interface and 文章视频articleVideo optimize
zhangrenyuan/feature-20250728113353-金币前端三期
zhangrenyuan
2 weeks ago
4 changed files with 647 additions and 592 deletions
-
256src/views/consume/addBeanConsume.vue
-
133src/views/consume/articleVideo.vue
-
455src/views/consume/dieHardFan.vue
-
395src/views/consume/liveStream.vue
@ -1,11 +1,259 @@ |
|||||
<script setup lang="ts"> |
|
||||
|
<script setup> |
||||
|
import { ref, onMounted, reactive, computed, watch, nextTick } from 'vue' |
||||
|
import { ElMessage } from 'element-plus' |
||||
|
import { Plus } from '@element-plus/icons-vue' |
||||
|
import axios from 'axios' |
||||
|
import { ElMessageBox } from 'element-plus' |
||||
|
import API from '@/util/http' |
||||
|
import { uploadFile } from '@/util/request'; |
||||
|
import request from '@/util/http' |
||||
|
import moment from 'moment' |
||||
|
import { e, range, re } from 'mathjs' |
||||
|
import { utils, read } from 'xlsx' |
||||
|
import throttle from 'lodash/throttle' |
||||
|
import { useAdminStore } from "@/store/index.js"; |
||||
|
import { storeToRefs } from "pinia"; |
||||
|
const user = ref({}) |
||||
|
const getUser = async function (jwcode) { |
||||
|
if (addForm.value.jwcode) { |
||||
|
addForm.value.jwcode = addForm.value.jwcode.replace(/\s/g, ''); |
||||
|
} else { |
||||
|
ElMessage.error('请先输入精网号') |
||||
|
return false |
||||
|
} |
||||
|
try { |
||||
|
const result = await API({ |
||||
|
url: '/beanUser/userCard', |
||||
|
data: { |
||||
|
jwcode: addForm.value.jwcode |
||||
|
} |
||||
|
}) |
||||
|
if (result.code === 0) { |
||||
|
ElMessage.error(result.msg); |
||||
|
} else if (result.data === null) { |
||||
|
ElMessage.error("用户不存在"); |
||||
|
} else { |
||||
|
user.value = result.data; |
||||
|
console.log("用户信息", user.value); |
||||
|
ElMessage.success("查询成功"); |
||||
|
} |
||||
|
} catch (error) { |
||||
|
console.log("请求失败", error); |
||||
|
ElMessage.error("精网号错误"); |
||||
|
} |
||||
|
} |
||||
|
const addForm = ref({ |
||||
|
jwcode: '', |
||||
|
gode: '', |
||||
|
freeGode: '', |
||||
|
remark: '', |
||||
|
adminId: '' |
||||
|
}) |
||||
|
const formRef = ref(null) |
||||
|
const adminStore = useAdminStore() |
||||
|
const { adminData } = storeToRefs(adminStore) |
||||
|
const rules = reactive({ |
||||
|
jwcode: [ |
||||
|
{ required: true, message: '请输入精网号', trigger: 'blur' }, |
||||
|
{ |
||||
|
validator: (rule, value, callback) => { |
||||
|
if (!value) { |
||||
|
callback(new Error('精网号不能为空')); |
||||
|
return; |
||||
|
} |
||||
|
if (/[^0-9]/.test(value)) { |
||||
|
callback(new Error('精网号只能包含数字')); |
||||
|
return; |
||||
|
} |
||||
|
callback(); |
||||
|
}, trigger: 'blur' |
||||
|
}], |
||||
|
gode: [ |
||||
|
{ required: true, message: '请输入永久金豆数', trigger: 'blur' }, |
||||
|
{ |
||||
|
validator: (rule, value, callback) => { |
||||
|
// 检查是否为非负整数 |
||||
|
if (!/^\d+$/.test(value)) { |
||||
|
callback(new Error('请输入非负整数')); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
</script> |
|
||||
|
// 检查位数 |
||||
|
if (value.length > 6) { |
||||
|
callback(new Error('整数位数不能超过6位')); |
||||
|
return; |
||||
|
} |
||||
|
callback(); |
||||
|
}, |
||||
|
|
||||
|
trigger: 'blur' |
||||
|
} |
||||
|
], |
||||
|
freeGode: [ |
||||
|
{ required: true, message: '请输入免费金豆数', trigger: 'blur' }, |
||||
|
{ |
||||
|
validator: (rule, value, callback) => { |
||||
|
// 检查是否为非负整数 |
||||
|
if (!/^\d+$/.test(value)) { |
||||
|
callback(new Error('请输入非负整数')); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
// 检查位数 |
||||
|
if (value.length > 6) { |
||||
|
callback(new Error('整数位数不能超过6位')); |
||||
|
return; |
||||
|
} |
||||
|
callback(); |
||||
|
}, |
||||
|
trigger: 'blur' |
||||
|
} |
||||
|
], |
||||
|
remark: [ |
||||
|
{ required: true, message: '请输入备注', trigger: 'blur' } |
||||
|
] |
||||
|
}); |
||||
|
|
||||
|
//重置表单 |
||||
|
const deleteAddForm = function () { |
||||
|
addForm.value = { |
||||
|
jwcode: '', |
||||
|
gode: '', |
||||
|
freeGode: '', |
||||
|
remark: '', |
||||
|
adminId: '' |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
const handleAddForm = async () => { |
||||
|
try { |
||||
|
await new Promise((resolve, reject) => { |
||||
|
formRef.value.validate((valid) => { |
||||
|
if (valid) { |
||||
|
if (Number(addForm.value.gode) === 0 && Number(addForm.value.freeGode) === 0) { |
||||
|
reject(new Error('永久金豆和付费金豆不能同时为0')); |
||||
|
} |
||||
|
resolve(); // 验证通过，继续执行后续代码 |
||||
|
} else { |
||||
|
reject(new Error('请检查并完善表单信息')); // 验证失败，抛出错误 |
||||
|
} |
||||
|
}); |
||||
|
}); |
||||
|
console.log('adminData', adminData.value); |
||||
|
|
||||
|
const result = await request({ |
||||
|
url: '/bean/add', |
||||
|
data: { |
||||
|
jwcode: addForm.value.jwcode, |
||||
|
gode: addForm.value.gode, |
||||
|
freeGode: addForm.value.freeGode, |
||||
|
remark: addForm.value.remark, |
||||
|
adminId: adminData.adminId |
||||
|
} |
||||
|
}) |
||||
|
} catch (error) { |
||||
|
console.log('金豆新增充值失败'); |
||||
|
ElMessage.error(error.message || '操作失败'); |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
<template> |
<template> |
||||
<div>addBeanConsume</div> |
|
||||
</template> |
|
||||
|
<div> |
||||
|
<el-form :model="addForm" :rules="rules" ref="formRef" label-width="auto" style="max-width: 600px" class="add-form"> |
||||
|
<el-form-item prop="jwcode" label="精网号" label-position="left"> |
||||
|
<el-input v-model="addForm.jwcode" style="width: 220px" /> |
||||
|
<el-button type="primary" @click="getUser(addForm.jwcode)" style="margin-left: 20px">查询</el-button> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="gode" label="付费金豆" label-position="left"> |
||||
|
<el-input v-model="addForm.gode" style="width: 100px" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="freeGode" label="免费金豆" label-position="left"> |
||||
|
<el-input v-model="addForm.freeGode" style="width: 100px" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="remark" label="备注" label-position="left"> |
||||
|
<el-input v-model="addForm.remark" style="width: 300px" :rows="5" maxlength="100" show-word-limit |
||||
|
type="textarea" /> |
||||
|
</el-form-item> |
||||
|
<!-- <el-form-item prop="adminId" label="提交人"> |
||||
|
<el-input style="width: 300px" :value="adminData.adminName" disabled placeholder="提交人姓名" /> |
||||
|
</el-form-item> --> |
||||
|
<el-button @click="deleteAddForm" style="margin-left: 280px" type="success">重置</el-button> |
||||
|
<el-button type="primary" @click="handleAddForm"> 提交 </el-button> |
||||
|
</el-form> |
||||
|
|
||||
|
<!-- 客户信息栏 --> |
||||
|
<el-card v-if="user.jwcode" style="width: 800px; float: right" class="customer-info"> |
||||
|
<el-form :model="user" label-width="auto" style="max-width: 1000px" label-position="left"> |
||||
|
<el-text size="large" style="margin-left: 20px">客户信息</el-text> |
||||
|
|
||||
|
<!-- 第一行：姓名 + 当前付费金豆 --> |
||||
|
<el-row style="margin-top: 20px"> |
||||
|
<el-col :span="9"> |
||||
|
<el-form-item label="姓名:"> |
||||
|
<p style="color: #2fa1ff; margin-right: 5px">{{ user.name }}</p> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="14"> |
||||
|
<el-form-item label="当前付费金豆:"> |
||||
|
<p style="color: #2fa1ff; margin-right: 5px" v-if="!isNaN(Number(user.permanentBean))"> |
||||
|
{{ Number(user.permanentBean) }} |
||||
|
</p> |
||||
|
<!-- 如果不是有效的数字，显示默认值 --> |
||||
|
<p v-else></p> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
|
||||
|
<!-- 第二行：精网号 + 免费金豆 --> |
||||
|
<el-row > |
||||
|
<el-col :span="9"> |
||||
|
<el-form-item label="精网号"> |
||||
|
<p style="color: #2fa1ff; margin-right: 5px">{{ user.jwcode }}</p> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="14"> |
||||
|
<el-form-item label="当前免费金豆:"> |
||||
|
<span style="color: #2fa1ff; margin-right: 5px" v-if="user.freeBean !== undefined">{{ user.freeBean }} |
||||
|
</span> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<!-- 第三行：消费次数 + 所属门店 --> |
||||
|
<el-row> |
||||
|
<el-col :span="9"> |
||||
|
<el-form-item label="所属门店"> |
||||
|
<p style="color: #2fa1ff">{{ user.market }}</p> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="9"> |
||||
|
<el-form-item label="消费次数"> |
||||
|
<p style="color: #2fa1ff; margin-right: 5px" v-if="user.consumeNum!=null">{{ user.consumeNum }}</p> |
||||
|
<p style="color: #2fa1ff; margin-right: 5px" v-else>{{ 0 }}</p> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</el-form> |
||||
|
</el-card> |
||||
|
|
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
<style scoped> |
<style scoped> |
||||
|
.add-form { |
||||
|
margin-top: 50px; |
||||
|
max-width: 50%; |
||||
|
float: left; |
||||
|
} |
||||
|
|
||||
|
.customer-info { |
||||
|
max-width: 60%; |
||||
|
} |
||||
|
|
||||
|
p { |
||||
|
margin: 0px; |
||||
|
} |
||||
|
|
||||
|
.el-form-item { |
||||
|
margin-left: 50px; |
||||
|
} |
||||
</style> |
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue