324 lines
11 KiB
Vue
324 lines
11 KiB
Vue
<template>
|
|
<div class="layout-padding">
|
|
<div class="layout-padding-auto layout-padding-view">
|
|
<el-form v-show="showSearch" ref="queryRef" :inline="true" :model="state.queryForm"
|
|
@keyup.enter="getDataList">
|
|
<el-row>
|
|
<el-form-item style="width: 300px" label="用户" prop="userIds">
|
|
<select-user v-model="state.queryForm.userIds" placeholder="用户" />
|
|
</el-form-item>
|
|
<el-form-item style="width: 200px" label="饭卡类型" prop="walletTypeId">
|
|
<select-wallet-type v-model="state.queryForm.walletTypeId" placeholder="饭卡类型" clearable />
|
|
</el-form-item>
|
|
<el-form-item style="width: 200px" label="充值类型" prop="bizType">
|
|
<dict-select v-model="state.queryForm.bizType" dict-code="wallet_biz_recharge"
|
|
placeholder="充值类型" />
|
|
</el-form-item>
|
|
<el-form-item style="width: 450px" label="创建时间" prop="createTimeList">
|
|
<el-date-picker v-model="state.queryForm.createTimeList" value-format="YYYY-MM-DD HH:mm:ss"
|
|
type="datetimerange" />
|
|
</el-form-item>
|
|
<el-form-item style="width: 450px" label="审核时间" prop="processTimeList">
|
|
<el-date-picker v-model="state.queryForm.processTimeList" value-format="YYYY-MM-DD HH:mm:ss"
|
|
type="datetimerange" />
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button icon="Search" type="primary" @click="getDataList">{{ $t("common.queryBtn")
|
|
}}</el-button>
|
|
<el-button icon="Refresh" @click="resetQuery">{{ $t("common.resetBtn") }}</el-button>
|
|
</el-form-item>
|
|
</el-row>
|
|
</el-form>
|
|
<el-row>
|
|
<div class="mb8" style="width: 100%">
|
|
<el-button icon="folder-add" type="primary" class="ml10" @click="uploadExcelRef.show()"
|
|
v-auth="'wallet_walletRechargeApply_add'">
|
|
导 入
|
|
</el-button>
|
|
<el-button v-if="false" plain :disabled="multiple" icon="Delete" type="primary"
|
|
v-auth="'wallet_walletRechargeApply_del'" @click="handleDelete(selectObjs)">
|
|
删除
|
|
</el-button>
|
|
|
|
<div class="flex justify-between items-center">
|
|
<el-tabs class="flex-1" v-model="activeName" @tab-click="handleClickTabItem">
|
|
<el-tab-pane v-for="v in tabItems" :key="v.id" :label="v.label" :name="v.value" />
|
|
</el-tabs>
|
|
<right-toolbar v-model:showSearch="showSearch" :export="'wallet_walletRechargeApply_export'"
|
|
@exportExcel="exportExcel" class="ml10 mr20" style="float: right"
|
|
@queryTable="getDataList" />
|
|
</div>
|
|
</div>
|
|
</el-row>
|
|
<el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
|
|
:header-cell-style="tableStyle.headerCellStyle" @selection-change="selectionChangHandle"
|
|
@sort-change="sortChangeHandle">
|
|
<el-table-column type="selection" width="40" align="center" />
|
|
<el-table-column type="index" label="#" width="80" />
|
|
<el-table-column prop="username" label="申请人" />
|
|
<el-table-column prop="bizType" width="120" label="充值类型">
|
|
<template #default="{ row }">
|
|
<dict-tag :options="wallet_biz_recharge" :value="row.bizType" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="walletTypeId" width="200" label="饭卡类型">
|
|
<template #default="{ row }">
|
|
<div class="flex items-center justify-center">
|
|
<div class="color-primary">{{ row.walletTypeName }}</div>
|
|
<div class="flex items-center just ml5">
|
|
<dict-tag :options="wallet_type" :value="row.walletTypeUniqueCode" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="deptName" width="200" label="部门" />
|
|
<el-table-column prop="importTime" width="100" label="充值月">
|
|
<template #default="{ row }">
|
|
{{ row.importTime?.substring(0, 7) }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="processStatus" width="100" label="审核状态">
|
|
<template #default="{ row }">
|
|
<dict-tag :options="check_status" :value="row.processStatus" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="remark" width="300" label="备注" />
|
|
<el-table-column width="250" label="时间">
|
|
<template #default="{ row }">
|
|
<div v-if="false" class="status">
|
|
<span>创建时间</span>
|
|
<span>{{ row.createTime }} </span>
|
|
</div>
|
|
<div class="status">
|
|
<span>申请时间</span>
|
|
<span>{{ row.applyTime ?? "--" }} </span>
|
|
</div>
|
|
<div class="status">
|
|
<span>审批时间</span>
|
|
<span>{{ row.processTime ?? "--" }} </span>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" v-auths="[
|
|
'wallet_walletRechargeApply_view',
|
|
'wallet_walletRechargeApply_apply',
|
|
'wallet_walletRechargeApply_edit',
|
|
'wallet_walletRechargeApply_del',
|
|
'wallet_walletRechargeApply_check',
|
|
]" width="300" fixed="right">
|
|
<template #default="{ row }">
|
|
<el-button v-if="row.importTime" icon="Document" text type="primary"
|
|
v-auth="'wallet_walletRechargeApply_view'" @click="doInfo(row)">
|
|
数据
|
|
</el-button>
|
|
<el-button v-if="row.importTime && !row.processId" icon="Connection" text type="primary"
|
|
v-auth="'wallet_walletRechargeApply_apply'" @click="doApply(row)">
|
|
申请
|
|
</el-button>
|
|
<el-button v-if="!row.processId" icon="edit-pen" text type="primary"
|
|
v-auth="'wallet_walletRechargeApply_edit'" @click="formDialogRef.openDialog(row.id)">
|
|
编辑
|
|
</el-button>
|
|
<el-button v-if="row.isCheckUser && row.processStatus == '1'" type="primary" size="small" link
|
|
icon="VideoPlay" @click="deal(row)" v-auth="'wallet_walletRechargeApply_check'">
|
|
开始处理
|
|
</el-button>
|
|
<el-button
|
|
v-if="row.userId == userInfos?.user?.userId && [null, '1'].includes(row.processStatus)"
|
|
icon="delete" text type="primary" v-auth="'wallet_walletRechargeApply_del'"
|
|
@click="handleDelete([row.id])">
|
|
删除
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
|
|
v-bind="state.pagination" />
|
|
</div>
|
|
|
|
<!-- 编辑、新增 -->
|
|
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
|
|
|
<upload-excel ref="uploadExcelRef" title="用户信息导入" url="/wallet/wallet-recharge-apply/read-excel"
|
|
temp-url="/admin/sys-file/local/file/wallet_recharge.xlsx" @refreshDataList="getDataList(false)" />
|
|
|
|
<!-- 审批抽屉 -->
|
|
<process-drawer ref="processDrawerRef" @task-submit-event="taskSubmitEvent" />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts" name="systemWalletRechargeApply">
|
|
import { BasicTableProps, useTable } from "/@/hooks/table"
|
|
import * as walletRechargeApplyApi from "/@/api/wallet/wallet-recharge-apply"
|
|
import { useMessage, useMessageBox } from "/@/hooks/message"
|
|
import { useDict } from "/@/hooks/dict"
|
|
import { ElLoading, ElMessage } from "element-plus"
|
|
import ProcessDrawer from "/@/components/processDrawer/index.vue"
|
|
import { getDicts } from "/@/api/admin/dict"
|
|
import { useUserInfo } from "/@/stores/userInfo"
|
|
|
|
const { push } = useRouter()
|
|
|
|
// 引入组件
|
|
const FormDialog = defineAsyncComponent(() => import("./form.vue"))
|
|
// 定义查询字典
|
|
const { wallet_biz_recharge, wallet_type, check_status } = useDict("wallet_biz_recharge", "wallet_type", "check_status")
|
|
// store
|
|
const stores = useUserInfo()
|
|
const { userInfos } = storeToRefs(stores)
|
|
|
|
// 定义变量内容
|
|
const formDialogRef = ref()
|
|
const uploadExcelRef = ref()
|
|
// 搜索变量
|
|
const queryRef = ref()
|
|
const showSearch = ref(true)
|
|
// 多选变量
|
|
const selectObjs = ref([]) as any
|
|
const multiple = ref(true)
|
|
const activeName = ref()
|
|
const tabItems = ref<any>([{}])
|
|
const processDrawerRef = ref()
|
|
|
|
const state: BasicTableProps = reactive<BasicTableProps>({
|
|
queryForm: {},
|
|
pageList: walletRechargeApplyApi.pageJoin,
|
|
})
|
|
|
|
// table hook
|
|
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
|
|
|
|
// 清空搜索条件
|
|
const resetQuery = () => {
|
|
// 清空搜索条件
|
|
queryRef.value?.resetFields()
|
|
// 清空多选
|
|
selectObjs.value = []
|
|
getDataList()
|
|
}
|
|
|
|
// 导出excel
|
|
const exportExcel = () => {
|
|
downBlobFile("/wallet/walletRechargeApply/export", Object.assign(state.queryForm, { ids: selectObjs }), "充值/扣款申请.xlsx")
|
|
}
|
|
|
|
const doApply = async (row: any) => {
|
|
let loading: any = null
|
|
try {
|
|
await useMessage().delConfirm("是否提交审批")
|
|
loading = ElLoading.service({
|
|
lock: true,
|
|
text: "提交中",
|
|
background: "rgba(0, 0, 0, 0.7)",
|
|
})
|
|
await walletRechargeApplyApi.apply({ id: row.id })
|
|
useMessage().success("提交成功")
|
|
getDataList()
|
|
setTimeout(() => loading.close(), 500)
|
|
} catch (error: any) {
|
|
loading.close()
|
|
if (error && error.code != 0) {
|
|
// useMessage().error(error.msg)
|
|
ElMessage({
|
|
message: h("div", { style: { maxHeight: "80vh", overflow: "auto", marginRight: "20px" } }, [
|
|
h(
|
|
"table",
|
|
{ style: { color: "#7f7f7f" } },
|
|
error.msg.split("\n").map((item: string) => {
|
|
return h("tr", {}, [
|
|
// h("td", { style: { padding: "0 4px", border: "1px solid #7f7f7f77", textAlign: "center" } }, index),
|
|
item.split(",").map((i: string) => {
|
|
return h("td", { style: { padding: "0 4px", border: "1px solid #7f7f7f77" } }, i)
|
|
}),
|
|
])
|
|
}),
|
|
),
|
|
]),
|
|
showClose: true,
|
|
duration: 10000,
|
|
type: "error",
|
|
})
|
|
}
|
|
}
|
|
}
|
|
|
|
// 多选事件
|
|
const selectionChangHandle = (objs: { id: string }[]) => {
|
|
selectObjs.value = objs.map(({ id }) => id)
|
|
multiple.value = !objs.length
|
|
}
|
|
|
|
onMounted(async () => {
|
|
const { data } = await getDicts("check_status")
|
|
data.unshift({ label: "全部", value: null })
|
|
tabItems.value = data
|
|
})
|
|
|
|
// tab点击切换
|
|
const handleClickTabItem = (e: any) => {
|
|
state.queryForm.processStatus = tabItems.value[e.index].value
|
|
getDataList()
|
|
}
|
|
|
|
const doInfo = (row: any) => {
|
|
push({ path: "/wallet/wallet-recharge-apply/preview-excel", query: { id: row.id } })
|
|
}
|
|
|
|
// 删除操作
|
|
const handleDelete = async (ids: string[]) => {
|
|
try {
|
|
await useMessageBox().confirm("此操作将永久删除")
|
|
} catch {
|
|
return
|
|
}
|
|
|
|
try {
|
|
await walletRechargeApplyApi.delObjs(ids)
|
|
getDataList()
|
|
useMessage().success("删除成功")
|
|
} catch (err: any) {
|
|
useMessage().error(err.msg)
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 点击开始处理
|
|
* @param row
|
|
*/
|
|
const deal = (row: any) => {
|
|
if (!row.processId) return useMessage().info("流程id不存在")
|
|
processDrawerRef.value.openProcessDrawer(row)
|
|
}
|
|
|
|
// 任务提交事件
|
|
const taskSubmitEvent = () => {
|
|
getDataList()
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.status {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 2px;
|
|
|
|
span {
|
|
display: inline-block;
|
|
}
|
|
|
|
span:nth-child(1) {
|
|
min-width: 60px;
|
|
max-width: 100px;
|
|
text-align: left;
|
|
}
|
|
|
|
span:nth-child(2) {
|
|
flex: 1;
|
|
min-width: 50px;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
}
|
|
</style>
|