huangqizhen
/
gold-vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'lihuilin/feature-20250815155204-金币优化' into milestone-20250815-金币优化

zhangyong/feature-20250815160302-金币优化
lhl 2 months ago
parent
de733fcccf 509ba436d8
commit
f176dfe431
2 changed files with 234 additions and 214 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 185
      src/views/permissions/userPermission.vue
  2. 61
      src/views/workspace/index.vue

185
src/views/permissions/userPermission.vue
View File

@ -1,7 +1,7 @@
<script setup> <script setup>
import {computed, onMounted, ref} from 'vue'
import {ElMessage, ElMessageBox} from 'element-plus'
import {InfoFilled} from '@element-plus/icons-vue'
import { computed, onMounted, ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { InfoFilled } from '@element-plus/icons-vue'
import _ from 'lodash' import _ from 'lodash'
import request from '@/util/http' import request from '@/util/http'
import API from '@/util/http' import API from '@/util/http'
@ -26,27 +26,37 @@ const getObj = ref({
pageNum: 1, pageNum: 1,
pageSize: 10 pageSize: 10
}) })
// 修改状态确认
const ackVisible = ref(false)
const currentStatusRow = ref(null)
const statusLoading = ref({})
const showStatusConfirm = (row, targetStatus) => {
currentStatusRow.value = {
...row,// 当前行数据
targetStatus// 目标状态
}
ackVisible.value = true
}
// 规则 // 规则
const addUserRules = { const addUserRules = {
account: [ account: [
{required: true, message: '请输入OA号', trigger: 'blur'},
{pattern: /^\d+$/, message: 'OA号必须为数字', trigger: 'blur'},
{max: 20, message: '长度不能超过20位', trigger: 'blur'}
{ required: true, message: '请输入OA号', trigger: 'blur' },
{ pattern: /^\d+$/, message: 'OA号必须为数字', trigger: 'blur' },
{ max: 20, message: '长度不能超过20位', trigger: 'blur' }
], ],
name: [ name: [
{required: true, message: '请输入用户名', trigger: 'blur'},
{max: 20, message: '长度不能超过20位', trigger: 'blur'}
{ required: true, message: '请输入用户名', trigger: 'blur' },
{ max: 20, message: '长度不能超过20位', trigger: 'blur' }
], ],
market: [ market: [
{required: true, message: '请选择所属地区', trigger: 'change'}
{ required: true, message: '请选择所属地区', trigger: 'change' }
], ],
permission: [ permission: [
{required: true, message: '请选择角色名称', trigger: 'change'}
{ required: true, message: '请选择角色名称', trigger: 'change' }
], ],
postiton: [ postiton: [
{required: true, message: '请输入职位', trigger: 'blur'},
{max: 20, message: '长度不能超过20位', trigger: 'blur'}
{ required: true, message: '请输入职位', trigger: 'blur' },
{ max: 20, message: '长度不能超过20位', trigger: 'blur' }
], ],
machineIds: [ machineIds: [
{ {
@ -93,7 +103,7 @@ const adminData = ref({})
// todo 之后优化掉 // todo 之后优化掉
const getAdminData = async function () { const getAdminData = async function () {
try { try {
const result = await API({url: '/admin/userinfo', data: {}})
const result = await API({ url: '/admin/userinfo', data: {} })
adminData.value = result adminData.value = result
// console.log('请求成功', result) // console.log('请求成功', result)
console.log('管理员用户信息', adminData.value) console.log('管理员用户信息', adminData.value)
@ -320,7 +330,7 @@ const permissionList = ref([])
const getRoles = async function () { const getRoles = async function () {
try { try {
const res = await API({url: '/role/selectAll'})
const res = await API({ url: '/role/selectAll' })
permissionList.value = res.data.map(item => ({ permissionList.value = res.data.map(item => ({
label: item.roleName, label: item.roleName,
value: item.id value: item.id
@ -436,7 +446,7 @@ const getUserLists = async function (selectedRoleId) {
parentRoleTip.value = ''; parentRoleTip.value = '';
const parentRes = await request({ const parentRes = await request({
url: '/role/selectFather', url: '/role/selectFather',
data: {id: selectedRoleId} // 用选中的角色ID请求
data: { id: selectedRoleId } // 用选中的角色ID请求
}); });
const parentId = parentRes.data.fatherId; const parentId = parentRes.data.fatherId;
const parentName = parentRes.data.parentName; const parentName = parentRes.data.parentName;
@ -454,7 +464,7 @@ const getUserLists = async function (selectedRoleId) {
// } // }
const res = await API({ const res = await API({
url: '/menu/tree', url: '/menu/tree',
data: {id: roleId}
data: { id: roleId }
}) })
data.value = processTreeData(res.data) data.value = processTreeData(res.data)
permissionEditObj.value.checkedKeys = collectIds(res.data) || []; permissionEditObj.value.checkedKeys = collectIds(res.data) || [];
@ -469,11 +479,11 @@ const getUserLists = async function (selectedRoleId) {
//编辑用户表单校验 //编辑用户表单校验
const editAdminRules = { const editAdminRules = {
market: [ market: [
{required: true, message: '请选择所属地区', trigger: 'change'}
{ required: true, message: '请选择所属地区', trigger: 'change' }
], ],
postiton: [ postiton: [
{required: true, message: '请输入职位', trigger: ['blur', 'change']},
{max: 20, message: '长度不能超过20位', trigger: ['blur', 'change']}
{ required: true, message: '请输入职位', trigger: ['blur', 'change'] },
{ max: 20, message: '长度不能超过20位', trigger: ['blur', 'change'] }
], ],
machineIds: [ machineIds: [
{ {
@ -494,7 +504,7 @@ const editAdminRules = {
}; };
// 编辑用户权限提交 // 编辑用户权限提交
const permissionEdit = async function () { const permissionEdit = async function () {
let {adminName: userName, roleName: oldRole, roleId: newRoleId} = permissionEditObj.value;
let { adminName: userName, roleName: oldRole, roleId: newRoleId } = permissionEditObj.value;
if (oldRole == null) { if (oldRole == null) {
oldRole = '暂未分配角色' oldRole = '暂未分配角色'
} }
@ -584,13 +594,16 @@ const delConfirm = async function () {
} }
// 禁用启用用户权限 // 禁用启用用户权限
const editStatus = async function (row) { const editStatus = async function (row) {
const { id, account, targetStatus, ...restRow } = currentStatusRow.value
try { try {
console.log(row)
statusLoading.value[id] = true
console.log(row)
permissionEditObj.value = {} permissionEditObj.value = {}
permissionEditObj.value.id = row.id
permissionEditObj.value.account = row.account
permissionEditObj.value.adminStatus = row.adminStatus
permissionEditObj.value.id = id
permissionEditObj.value.account = account
permissionEditObj.value.adminStatus = targetStatus
console.log('修改用户权限状态', permissionEditObj.value) console.log('修改用户权限状态', permissionEditObj.value)
const result = await request({ const result = await request({
@ -598,9 +611,12 @@ const editStatus = async function (row) {
data: permissionEditObj.value data: permissionEditObj.value
}) })
console.log('请求成功2', result) console.log('请求成功2', result)
if (result.code === 200) {
ElMessage.success( ElMessage.success(
permissionEditObj.value.adminStatus === 1 ? '启用成功' : '禁用成功' permissionEditObj.value.adminStatus === 1 ? '启用成功' : '禁用成功'
) )
statusLoading.value[id] = false
}
permissionEditObj.value = {} permissionEditObj.value = {}
getPermission() getPermission()
} catch (error) { } catch (error) {
@ -885,24 +901,18 @@ onMounted(async function () {
<div class="head-card"> <div class="head-card">
<div class="head-card-element"> <div class="head-card-element">
<el-text class="mx-1" size="large">OA号：</el-text> <el-text class="mx-1" size="large">OA号：</el-text>
<el-input v-model="admin.account" style="width: 240px" placeholder="请输入OA号" clearable/>
<el-input v-model="admin.account" style="width: 240px" placeholder="请输入OA号" clearable />
</div> </div>
<div class="head-card-element" style="margin-left: 50px"> <div class="head-card-element" style="margin-left: 50px">
<el-text class="mx-1" size="large">所属地区：</el-text> <el-text class="mx-1" size="large">所属地区：</el-text>
<el-cascader
v-model="admin.market"
:options="marketsTree"
placeholder="请选择所属地区"
clearable
style="width:180px"
@change="handleMarketChange"
/>
<el-cascader v-model="admin.market" :options="marketsTree" placeholder="请选择所属地区" clearable style="width:180px"
@change="handleMarketChange" />
</div> </div>
<div class="head-card-element" style="margin-left: 50px"> <div class="head-card-element" style="margin-left: 50px">
<el-text class="mx-1" size="large">职位名称：</el-text> <el-text class="mx-1" size="large">职位名称：</el-text>
<el-select v-model="admin.postiton" placeholder="请选择职位名称" style="width: 240px" clearable> <el-select v-model="admin.postiton" placeholder="请选择职位名称" style="width: 240px" clearable>
<el-option v-for="item in postiton" :key="item" :label="item" :value="item"/>
<el-option v-for="item in postiton" :key="item" :label="item" :value="item" />
</el-select> </el-select>
</div> </div>
@ -928,13 +938,13 @@ onMounted(async function () {
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="account" label="OA号"/>
<el-table-column prop="name" label="姓名"/>
<el-table-column prop="market" label="所属地区"/>
<el-table-column prop="postiton" label="职位"/>
<el-table-column prop="account" label="OA号" />
<el-table-column prop="name" label="姓名" />
<el-table-column prop="market" label="所属地区" />
<el-table-column prop="postiton" label="职位" />
<el-table-column prop="roleName" label="部门权限"> <el-table-column prop="roleName" label="部门权限">
</el-table-column> </el-table-column>
<el-table-column prop="remark" label="备注"/>
<el-table-column prop="remark" label="备注" />
<el-table-column prop="operation" label="操作" width="280px"> <el-table-column prop="operation" label="操作" width="280px">
<template #default="scope"> <template #default="scope">
<el-button type="warning" text @click="resetPassword(scope.row)"> <el-button type="warning" text @click="resetPassword(scope.row)">
@ -962,11 +972,12 @@ onMounted(async function () {
</el-table-column> </el-table-column>
<el-table-column prop="adminStatus" label="状态"> <el-table-column prop="adminStatus" label="状态">
<template #default="scope"> <template #default="scope">
<el-switch v-model="scope.row.adminStatus" :active-value="1" :inactive-value="0" size="large"
:disabled="scope.row.account === adminData.account" @change="editStatus(scope.row)" style="
<el-switch :model-value="scope.row.adminStatus" :active-value="1" :inactive-value="0" size="large"
:disabled="scope.row.account === adminData.account || statusLoading[scope.row.id]"
@change="(targetStatus) => showStatusConfirm(scope.row, targetStatus)" style="
--el-switch-on-color: #13ce66; --el-switch-on-color: #13ce66;
--el-switch-off-color: #ff4949; --el-switch-off-color: #ff4949;
" active-text="启用" inactive-text="禁用" inline-prompt/>
" active-text="启用" inactive-text="禁用" inline-prompt />
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -975,8 +986,7 @@ onMounted(async function () {
<!-- 分页 --> <!-- 分页 -->
<div class="pagination" style="margin-top: 20px"> <div class="pagination" style="margin-top: 20px">
<el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]" <el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper" :total="total"
@size-change="handlePageSizeChange"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange"
@current-change="handleCurrentChange"></el-pagination> @current-change="handleCurrentChange"></el-pagination>
</div> </div>
</el-card> </el-card>
@ -989,27 +999,17 @@ onMounted(async function () {
<el-form ref="Ref" :rules="addUserRules" :model="addAdmin" label-width="auto" <el-form ref="Ref" :rules="addUserRules" :model="addAdmin" label-width="auto"
style="max-width: 600px; align-items: center"> style="max-width: 600px; align-items: center">
<el-form-item prop="account" label="OA号:" required clearable> <el-form-item prop="account" label="OA号:" required clearable>
<el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px"/>
<el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px" />
</el-form-item> </el-form-item>
<el-form-item prop="name" label="用户名:" required clearable> <el-form-item prop="name" label="用户名:" required clearable>
<el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px"/>
<el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px" />
</el-form-item> </el-form-item>
<el-form-item prop="market" label="所属地区:" required clearable> <el-form-item prop="market" label="所属地区:" required clearable>
<el-cascader
v-model="addAdmin.market"
:options="marketsTree"
placeholder="请选择所属地区"
clearable
collapse-tags
collapse-tags-tooltip
style="width:220px"
@change="handleMarketChangeAddUser"
:max-collapse-tags="2"
:props="addUserProps"
/>
<el-cascader v-model="addAdmin.market" :options="marketsTree" placeholder="请选择所属地区" clearable collapse-tags
collapse-tags-tooltip style="width:220px" @change="handleMarketChangeAddUser" :max-collapse-tags="2"
:props="addUserProps" />
</el-form-item> </el-form-item>
<el-form-item prop="permission" label="角色名称:" required> <el-form-item prop="permission" label="角色名称:" required>
<el-select v-model="addAdmin.permission" placeholder="请选择角色名称" style="width: 220px" clearable> <el-select v-model="addAdmin.permission" placeholder="请选择角色名称" style="width: 220px" clearable>
@ -1018,21 +1018,21 @@ onMounted(async function () {
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="postiton" label="职位:" required> <el-form-item prop="postiton" label="职位:" required>
<el-input v-model="addAdmin.postiton" placeholder="请输入职位" style="width: 220px" clearable/>
<el-input v-model="addAdmin.postiton" placeholder="请输入职位" style="width: 220px" clearable />
</el-form-item> </el-form-item>
<el-form-item prop="machineIds" label="机器码:" required> <el-form-item prop="machineIds" label="机器码:" required>
<div style="display: flex; align-items: center; flex-wrap: wrap; gap: 10px;"> <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 10px;">
<!-- 动态添加的机器码输入框 --> <!-- 动态添加的机器码输入框 -->
<div v-for="(item, index) in addAdmin.machineIds" :key="index"> <div v-for="(item, index) in addAdmin.machineIds" :key="index">
<el-input v-model="addAdmin.machineIds[index]" placeholder="请输入机器码" <el-input v-model="addAdmin.machineIds[index]" placeholder="请输入机器码"
style="width: 220px; margin-right: 10px;"/>
style="width: 220px; margin-right: 10px;" />
</div> </div>
<el-button type="primary" @click="addMachineIdInput">添加</el-button> <el-button type="primary" @click="addMachineIdInput">添加</el-button>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item prop="remark" label="备注"> <el-form-item prop="remark" label="备注">
<el-input v-model="addAdmin.remark" style="width: 300px" :rows="2" maxlength="100" show-word-limit <el-input v-model="addAdmin.remark" style="width: 300px" :rows="2" maxlength="100" show-word-limit
type="textarea"/>
type="textarea" />
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -1050,32 +1050,21 @@ onMounted(async function () {
<el-form ref="Ref" :rules="editAdminRules" :model="permissionEditObj" label-width="auto" <el-form ref="Ref" :rules="editAdminRules" :model="permissionEditObj" label-width="auto"
style="max-width: 600px; align-items: center"> style="max-width: 600px; align-items: center">
<el-form-item prop="account" label="用户账号:" clearable> <el-form-item prop="account" label="用户账号:" clearable>
<el-input v-model="permissionEditObj.account" placeholder="请输入OA号" style="width: 220px" disabled/>
<el-input v-model="permissionEditObj.account" placeholder="请输入OA号" style="width: 220px" disabled />
</el-form-item> </el-form-item>
<el-form-item prop="name" label="用户名称:"> <el-form-item prop="name" label="用户名称:">
<el-input v-model="permissionEditObj.adminName" placeholder="请输入用户名" style="width: 220px" disabled/>
<el-input v-model="permissionEditObj.adminName" placeholder="请输入用户名" style="width: 220px" disabled />
</el-form-item> </el-form-item>
<el-form-item prop="market" label="所属地区:" clearable> <el-form-item prop="market" label="所属地区:" clearable>
<el-cascader
v-model="permissionEditObj.market"
:options="marketsTree"
placeholder="请选择所属地区"
clearable
collapse-tags
collapse-tags-tooltip
style="width:220px"
@change="handleMarketChangeEditUser"
:max-collapse-tags="2"
:props="editUserProps"
/>
<el-cascader v-model="permissionEditObj.market" :options="marketsTree" placeholder="请选择所属地区" clearable
collapse-tags collapse-tags-tooltip style="width:220px" @change="handleMarketChangeEditUser"
:max-collapse-tags="2" :props="editUserProps" />
</el-form-item> </el-form-item>
<el-form-item prop="postiton" label="职位:"> <el-form-item prop="postiton" label="职位:">
<el-input v-model="permissionEditObj.postiton" placeholder="请输入职位" style="width: 220px" clearable/>
<el-input v-model="permissionEditObj.postiton" placeholder="请输入职位" style="width: 220px" clearable />
</el-form-item> </el-form-item>
<el-form-item prop="roleName" label="角色名称:"> <el-form-item prop="roleName" label="角色名称:">
<el-select v-model="permissionEditObj.roleId" placeholder="请选择角色" style="width: 220px"
@change="getUserLists">
<el-select v-model="permissionEditObj.roleId" placeholder="请选择角色" style="width: 220px" @change="getUserLists">
<el-option v-for="item in permissionList" :key="item.value" :label="item.label" <el-option v-for="item in permissionList" :key="item.value" :label="item.label"
:value="item.value"></el-option> :value="item.value"></el-option>
</el-select> </el-select>
@ -1083,15 +1072,14 @@ onMounted(async function () {
<el-form-item prop="parentName" label="上级角色:"> <el-form-item prop="parentName" label="上级角色:">
<el-select v-model="permissionEditObj.parentId" placeholder="无上级角色" :disabled="!!parentRoleTip" <el-select v-model="permissionEditObj.parentId" placeholder="无上级角色" :disabled="!!parentRoleTip"
style="width: 220px"> style="width: 220px">
<el-option v-if="parentRoleTip" :key="0" :label="parentRoleTip" :value="null" disabled/>
<el-option v-if="parentRoleTip" :key="0" :label="parentRoleTip" :value="null" disabled />
<el-option v-else v-for="item in permissionList" :key="item.value" :label="item.label" disabled <el-option v-else v-for="item in permissionList" :key="item.value" :label="item.label" disabled
:value="item.value"></el-option> :value="item.value"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="permissionSelect" label="权限列表:"> <el-form-item prop="permissionSelect" label="权限列表:">
<el-tree v-if="data.length > 0" :data="data" :disabled="true" show-checkbox node-key="id" <el-tree v-if="data.length > 0" :data="data" :disabled="true" show-checkbox node-key="id"
:props="{ label: 'menuName', children: 'children' }"
:default-checked-keys="permissionEditObj.checkedKeys">
:props="{ label: 'menuName', children: 'children' }" :default-checked-keys="permissionEditObj.checkedKeys">
</el-tree> </el-tree>
<div v-else style="display: flex; align-items: center; gap: 8px;"> <div v-else style="display: flex; align-items: center; gap: 8px;">
<span style="color: #999;">暂无数据</span> <span style="color: #999;">暂无数据</span>
@ -1102,7 +1090,7 @@ onMounted(async function () {
<!-- 动态添加的机器码输入框 --> <!-- 动态添加的机器码输入框 -->
<div v-for="(item, index) in permissionEditObj.machineIds" :key="index"> <div v-for="(item, index) in permissionEditObj.machineIds" :key="index">
<el-input v-model="permissionEditObj.machineIds[index]" placeholder="" <el-input v-model="permissionEditObj.machineIds[index]" placeholder=""
style="width: 220px; margin-right: 10px;"/>
style="width: 220px; margin-right: 10px;" />
</div> </div>
<el-button type="primary" @click="UseraddMachineIdInput">添加</el-button> <el-button type="primary" @click="UseraddMachineIdInput">添加</el-button>
</div> </div>
@ -1126,7 +1114,7 @@ onMounted(async function () {
<el-row> <el-row>
<el-col :span="4" style="margin-top: 20px"> <el-col :span="4" style="margin-top: 20px">
<el-icon class="dialog-icon" color="#10AEFF" size="50"> <el-icon class="dialog-icon" color="#10AEFF" size="50">
<InfoFilled/>
<InfoFilled />
</el-icon> </el-icon>
</el-col> </el-col>
<el-col :span="20"> <el-col :span="20">
@ -1143,7 +1131,30 @@ onMounted(async function () {
</template> </template>
</el-dialog> </el-dialog>
<el-dialog v-model="ackVisible" :title="currentStatusRow?.adminStatus === 1 ? '确认禁用' : '确认启用'" width="300px"
:close-on-click-modal="false"
@close="() => { if (currentStatusRow) currentStatusRow.adminStatus = currentStatusRow.adminStatus === 1 ? 0 : 1 }">
<div class="status-confirm-content">
确定要{{ currentStatusRow?.adminStatus === 1 ? '禁用' : '启用' }}该用户吗？
<br>
</div>
<template #footer>
<div style="display: flex;">
<el-button @click="() => {
currentStatusRow.adminStatus = currentStatusRow.adminStatus === 1 ? 0 : 1
ackVisible = false
}">
取消
</el-button>
<el-button type="primary" @click="() => {
editStatus(currentStatusRow)
ackVisible = false
}">
确认
</el-button>
</div>
</template>
</el-dialog>
</template> </template>
<style scoped> <style scoped>

61
src/views/workspace/index.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div class="top"> <div class="top">
<el-card style="width:20%" class="center-card">数据总览</el-card>
<el-card style="width:10vw" class="center-card">数据总览</el-card>
<span class="text"> <span class="text">
最后更新时间：{{ 最后更新时间：{{
workDataUpdateTime && workDataUpdateTime !== '1970-01-01 08:00:00' ? workDataUpdateTime : '该地区暂无数据' workDataUpdateTime && workDataUpdateTime !== '1970-01-01 08:00:00' ? workDataUpdateTime : '该地区暂无数据'
@ -115,7 +115,7 @@
</div> </div>
<div class="graph"> <div class="graph">
<el-card style="width:100%;">
<el-card style="width:84vw;">
<div> <div>
<el-tabs v-model="activeTab" @tab-change="handleTabChange"> <el-tabs v-model="activeTab" @tab-change="handleTabChange">
<el-tab-pane label="金币充值" name="recharge"></el-tab-pane> <el-tab-pane label="金币充值" name="recharge"></el-tab-pane>
@ -123,29 +123,29 @@
</el-tabs> </el-tabs>
</div> </div>
<div class="condition"> <div class="condition">
<div style="display:flex;">合计&nbsp;&nbsp;
<span>永久金币：</span> {{ activeTab === 'recharge' ? sumRechargePermanent / 100 : sumConsumePermanent / 100 }}&nbsp;&nbsp;
<span>免费金币：</span> {{ activeTab === 'recharge' ? sumRechargeFree / 100 : sumConsumeFree / 100 }}&nbsp;&nbsp;
<span>任务金币：</span> {{ activeTab === 'recharge' ? sumRechargeTask / 100 : sumConsumeTask / 100 }}&nbsp;&nbsp;
<div class="stats">合计&nbsp;&nbsp;
<span>永久金币:</span> {{ activeTab === 'recharge' ? sumRechargePermanent / 100 : sumConsumePermanent / 100 }}&nbsp;&nbsp;
<span>免费金币:</span> {{ activeTab === 'recharge' ? sumRechargeFree / 100 : sumConsumeFree / 100 }}&nbsp;&nbsp;
<span>任务金币:</span> {{ activeTab === 'recharge' ? sumRechargeTask / 100 : sumConsumeTask / 100 }}&nbsp;&nbsp;
<div v-if="activeTab === 'consume'">合计 {{ sumConsume / 100 }}</div> <div v-if="activeTab === 'consume'">合计 {{ sumConsume / 100 }}</div>
</div> </div>
<div style="margin-left:auto;margin-right: 0.5%;">
<el-button @click="getYes()" :type="activeTimeRange === 'yes' ? 'primary' : ''">昨天
<div>
<el-button @click="getYes()" size="small" :type="activeTimeRange === 'yes' ? 'primary' : ''">昨天
</el-button> </el-button>
<el-button @click="getToday()" :type="activeTimeRange === 'today' ? 'primary' : ''">今天
<el-button @click="getToday()" size="small" :type="activeTimeRange === 'today' ? 'primary' : ''">今天
</el-button> </el-button>
<el-button @click="getWeek()" :type="activeTimeRange === 'week' ? 'primary' : ''">本周
<el-button @click="getWeek()" size="small" :type="activeTimeRange === 'week' ? 'primary' : ''">本周
</el-button> </el-button>
<el-button @click="getMonth()" :type="activeTimeRange === 'month' ? 'primary' : ''">本月
<el-button @click="getMonth()" size="small" :type="activeTimeRange === 'month' ? 'primary' : ''">本月
</el-button> </el-button>
<el-button @click="getYear()" :type="activeTimeRange === 'year' ? 'primary' : ''">本年
<el-button @click="getYear()" size="small" :type="activeTimeRange === 'year' ? 'primary' : ''">本年
</el-button> </el-button>
</div> </div>
<div> <div>
<el-date-picker v-model="dateRange" type="datetimerange" range-separator="→" start-placeholder="开始时间"
end-placeholder="结束时间" format="YYYY-MM-DD HH:mm:ss" style="width:20vw" value-format="YYYY-MM-DD HH:mm:ss"
<el-date-picker size="small" v-model="dateRange" type="datetimerange" range-separator="→" start-placeholder="开始时间"
end-placeholder="结束时间" format="YYYY-MM-DD HH:mm:ss" style="width:20vw;margin-left:0.5vw;" value-format="YYYY-MM-DD HH:mm:ss"
:default-time="defaultTime" :disabled-date="disabledDate" @change="handleDatePickerChange"/> :default-time="defaultTime" :disabled-date="disabledDate" @change="handleDatePickerChange"/>
<el-button type="primary" style="margin-left: 5px" @click="getChartData">查询</el-button>
<el-button type="primary" size="small" style="margin-left: 0.5vw" @click="getChartData">查询</el-button>
</div> </div>
</div> </div>
@ -807,13 +807,13 @@ onUnmounted(() => {
<style scoped> <style scoped>
.top { .top {
height: 5.5%;
width:100%;
height: 5.5vh;
width:80vw;
display: flex; display: flex;
margin-bottom: 0.2%;
margin-bottom: 0.5vh;
.text{ .text{
margin-left:0.2%;
width:50%;
margin-left:2vw;
width:20vw;
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 18px; font-size: 18px;
@ -821,7 +821,8 @@ onUnmounted(() => {
} }
.card { .card {
height: 28%;
height: 28vh;
margin-bottom: 0.5vh;
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
@ -836,21 +837,29 @@ onUnmounted(() => {
height: 1%; height: 1%;
display: flex; display: flex;
align-items: center; align-items: center;
.stats{
display:flex;
align-items:center;
width:35vw;
font-size: 15px;
}
} }
.graph-content { .graph-content {
flex: 1; flex: 1;
height: auto; height: auto;
display: flex; display: flex;
background-color: antiquewhite;
.left { .left {
width: 70%; width: 70%;
height: auto; height: auto;
background-color: aquamarine;
} }
.right { .right {
flex: 1; flex: 1;
padding: 0.5% 2%;
padding: 0.5vw 2vh;
} }
} }
} }
@ -862,21 +871,21 @@ onUnmounted(() => {
} }
.margin-bottom { .margin-bottom {
margin-bottom: 0.5%;
margin-bottom: 0.5vh;
} }
.card-item { .card-item {
width: 25%; width: 25%;
height: 98%;
height: 28vh;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
margin-right: 0.25%;
margin-right: 0.25vw;
} }
.card-title { .card-title {
font-weight: bold; font-weight: bold;
margin-bottom: 10px;
margin-bottom: 1vh;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

Write Preview
Loading…
Cancel
Save