Browse Source

style: 通过驳回通用样式

milestone-20250913-现金管理
lihui 13 hours ago
parent
commit
faa39fe03c
  1. 9
      src/css/btn.css
  2. 205
      src/views/audit/gold/rechargeAudit.vue
  3. 2
      src/views/consume/gold/coinConsume.vue

9
src/css/btn.css

@ -37,3 +37,12 @@ v-if="hasRecharge"
border-color: transparent;
}
}
.pass-btn {
color: #2741DE ;
margin-right: 5px
}
.reject-btn {
color: #2741DE ;
margin-left: 5px
}

205
src/views/audit/gold/rechargeAudit.vue

@ -4,24 +4,24 @@
<div class="select">
<div class="selectRow">
<el-text class="text" size="large">精网号</el-text>
<el-input class="selectContent" v-model="rechargeAudit.jwcode" placeholder="请输入精网号" clearable />
<el-input class="selectContent" v-model="rechargeAudit.jwcode" placeholder="请输入精网号" clearable/>
</div>
<div class="selectRow">
<el-text class="text" size="large">活动名称</el-text>
<el-select class="selectContent" v-model="rechargeAudit.activity" placeholder="请选择活动名称" clearable>
<el-option v-for="item in activity" :key="item" :label="item" :value="item" />
<el-option v-for="item in activity" :key="item" :label="item" :value="item"/>
</el-select>
</div>
<div class="selectRow">
<el-text class="text" size="large">支付方式</el-text>
<el-select class="selectContent" v-model="rechargeAudit.payModel" placeholder="请选择支付方式" clearable>
<el-option v-for="item in payModel" :key="item.value" :label="item.label" :value="item.value" />
<el-option v-for="item in payModel" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</div>
<div class="selectRow">
<el-text class="text" size="large">所属地区</el-text>
<el-cascader class="selectContent" v-model="selectedMarketPath" :options="market" placeholder="请选择所属地区"
clearable @change="handleMarketChange" />
clearable @change="handleMarketChange"/>
</div>
</div>
</el-col>
@ -32,8 +32,8 @@
{{ activeName === 'wait' ? '提交时间:' : '审核时间:' }}
</el-text>
<el-date-picker class="selectContent" v-model="getTime" type="datetimerange" range-separator=""
start-placeholder="起始时间" end-placeholder="结束时间" style="margin-right:1vw;width:25vw"
@change="handleDatePickerChange" :default-time="defaultTime" :disabled-date="disabledDate" />
start-placeholder="起始时间" end-placeholder="结束时间" style="margin-right:1vw;width:25vw"
@change="handleDatePickerChange" :default-time="defaultTime" :disabled-date="disabledDate"/>
<div v-if="false">
<el-button @click="getToday()" :type="activeTimeRange === 'today' ? 'primary' : ''"></el-button>
<el-button @click="getYesterday()" :type="activeTimeRange === 'yesterday' ? 'primary' : ''"></el-button>
@ -48,7 +48,7 @@
</el-col>
</el-card>
<el-card class="card2">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="待审核" name="wait" v-if="hasrechargeWait&&hasrechargeWaitShow"></el-tab-pane>
<el-tab-pane label="已通过" name="pass" v-if="hasrechargeThrough"></el-tab-pane>
<el-tab-pane label="已驳回" name="reject" v-if="hasrechargeReject"></el-tab-pane>
@ -56,24 +56,25 @@
<!-- 总条数{{ format3(stats.totalNum) }}&nbsp;&nbsp;&nbsp;&nbsp;-->
充值新币{{ format3(stats.permanentGolds) }}新币&nbsp;&nbsp;&nbsp;&nbsp;
总金币数{{ format3((stats.permanentGolds + stats.freeGolds + stats.taskGolds).toFixed(2))
总金币数{{
format3((stats.permanentGolds + stats.freeGolds + stats.taskGolds).toFixed(2))
}}金币&nbsp;&nbsp;&nbsp;&nbsp;
永久金币{{ format3(stats.permanentGolds.toFixed(2)) }}金币&nbsp;&nbsp;&nbsp;&nbsp;
免费金币{{ format3(stats.freeGolds.toFixed(2)) }}金币&nbsp;&nbsp;&nbsp;&nbsp;
</div>
</el-tabs>
<el-table :data="tableData" style="width: 82vw;height:54vh" @sort-change="handleSortChange"
:row-style="{ height: '50px' }">
:row-style="{ height: '50px' }">
<el-table-column type="index" label="序号" width="100px" fixed="left">
<template #default="scope">
<span>{{ scope.$index + 1 + (getObj.pageNum - 1) * getObj.pageSize }}</span>
</template>
</el-table-column>
<el-table-column fixed="left" prop="name" label="姓名" width="150px" show-overflow-tooltip />
<el-table-column fixed="left" prop="jwcode" label="精网号" width="110px" />
<el-table-column prop="market" label="所属地区" width="100px" />
<el-table-column prop="activity" label="活动名称" width="100px" show-overflow-tooltip />
<el-table-column prop="rateName" label="货币名称" width="110px" />
<el-table-column fixed="left" prop="name" label="姓名" width="150px" show-overflow-tooltip/>
<el-table-column fixed="left" prop="jwcode" label="精网号" width="110px"/>
<el-table-column prop="market" label="所属地区" width="100px"/>
<el-table-column prop="activity" label="活动名称" width="100px" show-overflow-tooltip/>
<el-table-column prop="rateName" label="货币名称" width="110px"/>
<el-table-column prop="money" label="充值金额" sortable="custom" width="110px">
<template #default="scope">{{ scope.row.money / 100 }}</template>
</el-table-column>
@ -83,22 +84,22 @@
<el-table-column prop="freeGold" label="免费金币" sortable="custom" width="110px">
<template #default="scope">{{ (scope.row.freeGold) / 100 }}</template>
</el-table-column>
<el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip />
<el-table-column prop="payModel" label="支付方式" width="110px" />
<el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip/>
<el-table-column prop="payModel" label="支付方式" width="110px"/>
<el-table-column prop="voucher" label="支付凭证" width="110px">
<template #default="scope">
<div v-if="scope.row.voucher"
style="display: flex; justify-content: center; align-items: center; cursor: pointer;"
@click="previewImage(scope.row.voucher)">
style="display: flex; justify-content: center; align-items: center; cursor: pointer;"
@click="previewImage(scope.row.voucher)">
<img :src="scope.row.voucher" alt="支付凭证" style="width: auto; height: 40px;">
</div>
<div v-else style="display: flex; justify-content: center; align-items: center; height: 40px;">--</div>
</template>
</el-table-column>
<el-table-column prop="adminName" label="提交人" width="100px" />
<el-table-column prop="adminName" label="提交人" width="100px"/>
<el-table-column prop="rejectReason" v-if="activeName === 'reject'" label="驳回理由" width="200px"
show-overflow-tooltip />
<el-table-column v-if="activeName !== 'wait'" prop="auditName" label="审核人" width="100px" />
show-overflow-tooltip/>
<el-table-column v-if="activeName !== 'wait'" prop="auditName" label="审核人" width="100px"/>
<el-table-column prop="payTime" sortable="custom" label="交款时间" width="200px">
<template #default="scope">
{{ moment(scope.row.payTime).format('YYYY-MM-DD HH:mm:ss') }}
@ -109,8 +110,8 @@
<!-- {{ moment(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss') }}-->
{{
activeName === 'wait'
? moment(scope.row.auditTime).format('YYYY-MM-DD HH:mm:ss')
: moment(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss')
? moment(scope.row.auditTime).format('YYYY-MM-DD HH:mm:ss')
: moment(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss')
}}
</template>
</el-table-column>
@ -119,14 +120,16 @@
{{ moment(scope.row.auditTime).format('YYYY-MM-DD HH:mm:ss') }}
</template>
</el-table-column>
<el-table-column v-if="activeName === 'wait'&&(hasrechargeWaitThough||hasrechargeWaitReject)&&hasrechargeWaitShow" fixed="right" prop="operation" label="操作" width="150px">
<el-table-column v-if="activeName === 'wait'&&(hasrechargeWaitThough||hasrechargeWaitReject)&&hasrechargeWaitShow"
fixed="right" prop="operation" label="操作" width="150px">
<template #default="scope">
<div class="operation">
<el-popconfirm title="确定要通过此条记录吗?" @confirm="handleApprove(scope.row)">
<template #reference>
<el-button v-if="hasrechargeWaitThough" :disabled="clicked || cancelClicked" type="primary" text>
<el-link :underline="false" class="pass-btn" v-if="hasrechargeWaitThough"
:disabled="clicked || cancelClicked">
通过
</el-button>
</el-link>
</template>
<template #actions="{ confirm, cancel }">
<el-button size="small" @click="cancel">取消</el-button>
@ -135,17 +138,20 @@
</el-button>
</template>
</el-popconfirm>
<el-button v-if="hasrechargeWaitReject" :disabled="clicked || cancelClicked" type="primary" text @click="showRejectDialog(scope.row)">
<el-link :underline="false" class="reject-btn" v-if="hasrechargeWaitReject"
:disabled="clicked || cancelClicked" type="primary"
@click="showRejectDialog(scope.row)">
驳回
</el-button>
</el-link>
</div>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePagination('size', $event)"
@current-change="handlePagination('page', $event)"></el-pagination>
layout="total, sizes, prev, pager, next, jumper" :total="total"
@size-change="handlePagination('size', $event)"
@current-change="handlePagination('page', $event)"></el-pagination>
</div>
</el-card>
@ -153,7 +159,7 @@
<el-form>
<el-form-item label="驳回理由" required>
<el-input v-model="rejectReason" type="textarea" :rows="4" placeholder="请输入驳回理由" maxlength="200"
show-word-limit />
show-word-limit/>
</el-form-item>
</el-form>
<template #footer>
@ -166,17 +172,17 @@
</template>
<script setup>
import { onMounted, reactive, ref } from 'vue'
import { ElMessage } from 'element-plus'
import {onMounted, reactive, ref} from 'vue'
import {ElMessage} from 'element-plus'
import request from '@/util/http.js'
import API from '@/util/http.js'
import moment from 'moment'
import { useAdminStore } from "@/store/index.js";
import { storeToRefs } from "pinia";
import {useAdminStore} from "@/store/index.js";
import {storeToRefs} from "pinia";
const adminStore = useAdminStore();
const { adminData, menuTree } = storeToRefs(adminStore);
import { permissionMapping, hasMenuPermission } from "@/utils/menuTreePermission.js"
const {adminData, menuTree} = storeToRefs(adminStore);
import {permissionMapping, hasMenuPermission} from "@/utils/menuTreePermission.js"
import dayjs from "dayjs";
@ -189,7 +195,7 @@ const hasrechargeWaitThough = ref(false) // 充值审核通过
const hasrechargeWaitReject = ref(false) //
//
const initPermissions = async() => {
const initPermissions = async () => {
if (!menuTree.value || !menuTree.value.length) return;
hasrechargeThrough.value = hasMenuPermission(menuTree.value, permissionMapping.rechargeThrough);
hasrechargeReject.value = hasMenuPermission(menuTree.value, permissionMapping.rechargeReject);
@ -245,7 +251,6 @@ const getObj = ref({
})
//
const payModel = [
{
@ -303,7 +308,7 @@ const stats = ref({
})
//
const rules = reactive({
rejectReason: [{ required: true, message: '请输入驳回理由', trigger: 'blur' }]
rejectReason: [{required: true, message: '请输入驳回理由', trigger: 'blur'}]
})
//
const getRecharge = async function (val) {
@ -354,7 +359,7 @@ const getRecharge = async function (val) {
}
const getStats = async () => {
if (!hasrechargeWaitShow) {
if (!hasrechargeWaitShow) {
return
}
try {
@ -480,21 +485,21 @@ const adminReject = async function () {
const handleClick = function (tab, event) {
activeName.value = tab.props.name
if (tab.props.name === 'wait') {
if(!hasrechargeWait){
if (!hasrechargeWait) {
ElMessage.error('暂无权限')
return
}
if(hasrechargeWaitShow){
if (hasrechargeWaitShow) {
adminWait()
}
} else if (tab.props.name === 'pass') {
if(!hasrechargeThrough){
if (!hasrechargeThrough) {
ElMessage.error('暂无权限')
return
}
adminPass()
} else if (tab.props.name === 'reject') {
if(!hasrechargeReject){
if (!hasrechargeReject) {
ElMessage.error('暂无权限')
return
}
@ -525,35 +530,35 @@ const handlePagination = (type, val) => {
const clicked = ref(false);
//
const handleApprove = async (row) => {
if(!hasrechargeWaitThough){
ElMessage.error('暂无权限')
return
}
if (!hasrechargeWaitThough) {
ElMessage.error('暂无权限')
return
}
clicked.value = true
try {
const params = {
orderCode: row.orderCode,
auditId: adminData.value.id,
action: 1,
rejectReason: ''
}
await request({ url: '/audit/audit', data: params })
ElMessage.success('审核通过成功')
await getRecharge()
clicked.value = false
await getStats()
} catch (error) {
console.error('审核通过失败', error)
ElMessage.error('操作失败')
try {
const params = {
orderCode: row.orderCode,
auditId: adminData.value.id,
action: 1,
rejectReason: ''
}
await request({url: '/audit/audit', data: params})
ElMessage.success('审核通过成功')
await getRecharge()
clicked.value = false
await getStats()
} catch (error) {
console.error('审核通过失败', error)
ElMessage.error('操作失败')
}
}
const showRejectDialog = (row) => {
if(!hasrechargeWaitReject){
ElMessage.error('暂无权限')
return
}
if (!hasrechargeWaitReject) {
ElMessage.error('暂无权限')
return
}
currentRecord.value = row
rejectReason.value = ''
rejectDialogVisible.value = true
@ -562,34 +567,34 @@ const showRejectDialog = (row) => {
const cancelClicked = ref(false)
//
const handleReject = async () => {
if(!hasrechargeWaitReject){
ElMessage.error('暂无权限')
return
}
if (!hasrechargeWaitReject) {
ElMessage.error('暂无权限')
return
}
cancelClicked.value = true
if (!rejectReason.value.trim()) {
ElMessage.warning('请输入驳回理由')
return
if (!rejectReason.value.trim()) {
ElMessage.warning('请输入驳回理由')
return
}
try {
const params = {
orderCode: currentRecord.value.orderCode,
auditId: adminData.value.id,
action: 2,
rejectReason: rejectReason.value
}
try {
const params = {
orderCode: currentRecord.value.orderCode,
auditId: adminData.value.id,
action: 2,
rejectReason: rejectReason.value
}
await request({ url: '/audit/audit', data: params })
ElMessage.success('驳回操作成功')
rejectDialogVisible.value = false
await getRecharge()
cancelClicked.value = false
await getStats()
} catch (error) {
console.error('驳回操作失败', error)
ElMessage.error('操作失败')
}
await request({url: '/audit/audit', data: params})
ElMessage.success('驳回操作成功')
rejectDialogVisible.value = false
await getRecharge()
cancelClicked.value = false
await getStats()
} catch (error) {
console.error('驳回操作失败', error)
ElMessage.error('操作失败')
}
}
//
const handleSortChange = (column) => {
@ -649,7 +654,7 @@ const handleMarketChange = (value) => {
}
}
const props = { multiple: true }
const props = {multiple: true}
//
const getMarket = async function () {
try {
@ -663,8 +668,8 @@ const getMarket = async function () {
const allChildren = nodes.flatMap(node => node.children || []);
return allChildren.map(child => {
const grandchildren = child.children && child.children.length
? transformTree([child]) //
: null;
? transformTree([child]) //
: null;
return {
value: child.name,
label: child.name,
@ -700,11 +705,11 @@ const formatTime = (val) => val ? moment(val).format('YYYY-MM-DD HH:mm:ss') : ''
//
onMounted(async function () {
await initPermissions()
if(hasrechargeWaitShow.value){
if (hasrechargeWaitShow.value) {
rechargeAudit.value.auditStatus = '0'
}else if(hasrechargeThrough.value){
} else if (hasrechargeThrough.value) {
rechargeAudit.value.auditStatus = '1'
}else if(hasrechargeReject){
} else if (hasrechargeReject) {
rechargeAudit.value.auditStatus = '2'
}
await getActivity()
@ -751,7 +756,7 @@ onMounted(async function () {
:deep(.el-table__header-wrapper),
:deep(.el-table__body-wrapper),
:deep(.el-table__cell),
/* 表格 */
/* 表格 */
:deep(.el-table__body td) {
background-color: #F3FAFE !important;
}

2
src/views/consume/gold/coinConsume.vue

@ -9,7 +9,7 @@
@click="navigateTo('coinConsumeDetail')"
v-if="hasDetail"
>
充值审核
金币消耗明细
</el-button>
<el-button

Loading…
Cancel
Save