mirror of
https://gitee.com/bootx/dax-pay-ui.git
synced 2025-08-29 09:03:55 +00:00
feat 商户管理对接
This commit is contained in:
bootx
20
.env.admin-build
Normal file
20
.env.admin-build
Normal file
@@ -0,0 +1,20 @@
|
||||
# 名称
|
||||
VITE_GLOB_APP_TITLE=DaxPay运营端
|
||||
|
||||
# 压缩方式
|
||||
VITE_BUILD_COMPRESS='gzip'
|
||||
|
||||
# 发布路径
|
||||
VITE_PUBLIC_PATH=/
|
||||
|
||||
# 接口地址
|
||||
VITE_GLOB_API_URL=/admin
|
||||
|
||||
# 接口前缀
|
||||
VITE_GLOB_API_URL_PREFIX =
|
||||
|
||||
# 终端类型
|
||||
VITE_GLOB_APP_CLIENT=dax-pay-admin
|
||||
|
||||
# 超时时间
|
||||
VITE_GLOB_API_TIMEOUT=30000
|
||||
20
.env.merchant-build
Normal file
20
.env.merchant-build
Normal file
@@ -0,0 +1,20 @@
|
||||
# 名称
|
||||
VITE_GLOB_APP_TITLE=DaxPay商户管理端
|
||||
|
||||
# 压缩方式
|
||||
VITE_BUILD_COMPRESS='gzip'
|
||||
|
||||
# 发布路径
|
||||
VITE_PUBLIC_PATH=/
|
||||
|
||||
# 接口地址
|
||||
VITE_GLOB_API_URL=/merchant
|
||||
|
||||
# 接口前缀
|
||||
VITE_GLOB_API_URL_PREFIX=
|
||||
|
||||
# 终端类型
|
||||
VITE_GLOB_APP_CLIENT=dax-pay-merchant
|
||||
|
||||
# 超时时间
|
||||
VITE_GLOB_API_TIMEOUT=30000
|
||||
12
README.md
12
README.md
@@ -1 +1,13 @@
|
||||
# DaxPay多商户前端
|
||||
|
||||
## 简绍
|
||||
vite5 + vue3.4 + vben admin2 + antd vue4 搭建
|
||||
|
||||
## 启动命令
|
||||
|
||||
```shell
|
||||
# 运营管理端
|
||||
pnpm vite --mode admin
|
||||
# 商户端
|
||||
pnpm vite --mode merchant
|
||||
```
|
||||
|
||||
@@ -6,9 +6,9 @@
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"bootstrap": "pnpm install",
|
||||
"build:analyze": "cross-env NODE_OPTIONS=--max-old-space-size=8192 pnpm vite build --mode admin",
|
||||
"build:analyze": "cross-env NODE_OPTIONS=--max-old-space-size=8192 pnpm vite build --mode admin-build",
|
||||
"build:admin": "cross-env NODE_OPTIONS=--max-old-space-size=8192 pnpm vite build --mode admin",
|
||||
"build:merchant": "cross-env NODE_OPTIONS=--max-old-space-size=8192 pnpm vite build --mode merchant",
|
||||
"build:merchant": "cross-env NODE_OPTIONS=--max-old-space-size=8192 pnpm vite build --mode merchant-build",
|
||||
"dev:admin": "pnpm vite --mode admin",
|
||||
"dev:merchant": "pnpm vite --mode merchant",
|
||||
"preinstall": "npx only-allow pnpm",
|
||||
|
||||
@@ -1,30 +0,0 @@
|
||||
import type { AppRouteModule } from '@/router/types'
|
||||
|
||||
import { LAYOUT } from '@/router/constant'
|
||||
|
||||
const about: AppRouteModule = {
|
||||
path: '/about',
|
||||
name: 'About',
|
||||
component: LAYOUT,
|
||||
redirect: '/about/index',
|
||||
meta: {
|
||||
hideChildrenMenu: true,
|
||||
icon: 'simple-icons:aboutdotme',
|
||||
title: '关于',
|
||||
orderNo: 100000,
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'AboutPage',
|
||||
component: () => import('@/views/sys/about/index.vue'),
|
||||
meta: {
|
||||
title: '关于',
|
||||
icon: 'simple-icons:aboutdotme',
|
||||
hideMenu: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
}
|
||||
|
||||
export default about
|
||||
@@ -1,7 +1,6 @@
|
||||
import { AppRouteModule } from '@/router/types'
|
||||
import { LAYOUT } from '@/router/constant'
|
||||
|
||||
const IFrame = () => import('@/views/sys/iframe/FrameBlank.vue')
|
||||
/**
|
||||
* 位于主框架内的页面, 通常需要登录
|
||||
*/
|
||||
@@ -21,16 +20,7 @@ export const INTERNAL: AppRouteModule = {
|
||||
// meta: { title: '个人设置' },
|
||||
// },
|
||||
{
|
||||
path: '/antv',
|
||||
name: 'Antv',
|
||||
component: IFrame,
|
||||
meta: {
|
||||
frameSrc: 'https://www.antdv.com/docs/vue/introduce-cn/',
|
||||
title: 'antv',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/about',
|
||||
path: '/about/index',
|
||||
name: 'AboutPage',
|
||||
component: () => import('@/views/sys/about/index.vue'),
|
||||
meta: { title: '关于' },
|
||||
|
||||
@@ -41,7 +41,7 @@ export interface OperateLog extends BaseEntity {
|
||||
// 操作人员id
|
||||
operateId?: number
|
||||
// 操作人员账号
|
||||
username?: string
|
||||
account?: string
|
||||
// 业务类型
|
||||
businessType?: string
|
||||
// 请求方法
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
let confirmLoading = ref(false)
|
||||
let schema = [
|
||||
{ field: 'id', label: '主键' },
|
||||
{ field: 'username', label: '操作人员账号' },
|
||||
{ field: 'account', label: '操作账号' },
|
||||
{ field: 'title', label: '操作模块' },
|
||||
{
|
||||
field: 'client',
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
<vxe-table row-id="id" ref="xTable" :data="pagination.records" :loading="loading">
|
||||
<vxe-column type="seq" width="60" />
|
||||
<vxe-column field="operateId" title="操作人员id" />
|
||||
<vxe-column field="username" title="操作人员账号" />
|
||||
<vxe-column field="account" title="操作账号" />
|
||||
<vxe-column field="title" title="操作模块" />
|
||||
<vxe-column field="success" title="是否成功">
|
||||
<template #default="{ row }">
|
||||
|
||||
74
src/views/daxpay/admin/merchant/app/MchApp.api.ts
Normal file
74
src/views/daxpay/admin/merchant/app/MchApp.api.ts
Normal file
@@ -0,0 +1,74 @@
|
||||
import { defHttp } from '@/utils/http/axios'
|
||||
import { PageResult, Result } from '#/axios'
|
||||
import { BaseEntity } from '#/web'
|
||||
|
||||
/**
|
||||
* 分页
|
||||
*/
|
||||
export const page = (params) => {
|
||||
return defHttp.get<Result<PageResult<MchApp>>>({
|
||||
url: '/mch/app/page',
|
||||
params,
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 详情
|
||||
*/
|
||||
export const get = (id) => {
|
||||
return defHttp.get<Result<MchApp>>({
|
||||
url: '/mch/app/findById',
|
||||
params: { id },
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 新增
|
||||
*/
|
||||
export const add = (obj) => {
|
||||
return defHttp.post<Result<void>>({
|
||||
url: '/mch/app/save',
|
||||
data: obj,
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 更新
|
||||
*/
|
||||
export const update = (obj) => {
|
||||
return defHttp.post<Result<void>>({
|
||||
url: '/mch/app/update',
|
||||
data: obj,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
export const del = (id) => {
|
||||
return defHttp.post<Result<void>>({
|
||||
url: '/mch/app/delete',
|
||||
params: { id },
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 商户应用
|
||||
*/
|
||||
export interface MchApp extends BaseEntity {
|
||||
// 商户号
|
||||
mchNo: string
|
||||
// 应用号
|
||||
appId: string
|
||||
// 应用名称
|
||||
appName: string
|
||||
// 签名方式
|
||||
signType: string
|
||||
// 公钥
|
||||
publicKey: string
|
||||
// 私钥
|
||||
privateKey: string
|
||||
// 异步消息通知类型
|
||||
notifyType: string
|
||||
// 状态
|
||||
notifyUrl: string
|
||||
// 通知地址, http/WebSocket 需要配置
|
||||
status: string
|
||||
}
|
||||
150
src/views/daxpay/admin/merchant/app/MchAppEdit.vue
Normal file
150
src/views/daxpay/admin/merchant/app/MchAppEdit.vue
Normal file
@@ -0,0 +1,150 @@
|
||||
<template>
|
||||
<basic-modal
|
||||
:loading="confirmLoading"
|
||||
v-bind="$attrs"
|
||||
:width="750"
|
||||
:title="title"
|
||||
:open="visible"
|
||||
:mask-closable="showable"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<a-form
|
||||
class="small-from-item"
|
||||
:model="form"
|
||||
ref="formRef"
|
||||
validate-trigger="['blur', 'change']"
|
||||
:rules="rules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
<a-form-item label="主键" name="id" :hidden="true">
|
||||
<a-input v-model:value="form.id" :disabled="showable" />
|
||||
</a-form-item>
|
||||
<a-form-item label="商户号" name="mchNo" v-show="!addable">
|
||||
<a-input v-model:value="form.mchNo" disabled />
|
||||
</a-form-item>
|
||||
<a-form-item label="商户名称" name="mchName">
|
||||
<a-input v-model:value="form.mchName" :disabled="showable" placeholder="请输入商户名称" />
|
||||
</a-form-item>
|
||||
<a-form-item label="公司名称" name="companyName">
|
||||
<a-input v-model:value="form.mchName" :disabled="showable" placeholder="请输入公司名称" />
|
||||
</a-form-item>
|
||||
<a-form-item label="证件类型" name="idType">
|
||||
<a-input v-model:value="form.idType" :disabled="showable" placeholder="请输入证件类型" />
|
||||
</a-form-item>
|
||||
<a-form-item label="证件号" name="idNo">
|
||||
<a-input v-model:value="form.idNo" :disabled="showable" placeholder="请输入证件号" />
|
||||
</a-form-item>
|
||||
<a-form-item label="联系方式" name="contact">
|
||||
<a-input v-model:value="form.contact" :disabled="showable" placeholder="请输入联系方式" />
|
||||
</a-form-item>
|
||||
<a-form-item label="法人名称" name="legalPerson">
|
||||
<a-input
|
||||
v-model:value="form.legalPerson"
|
||||
:disabled="showable"
|
||||
placeholder="请输入法人名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="法人证件号码" name="legalPersonIdNo">
|
||||
<a-input
|
||||
v-model:value="form.legalPersonIdNo"
|
||||
:disabled="showable"
|
||||
placeholder="请输入法人证件号码"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template #footer>
|
||||
<a-space>
|
||||
<a-button key="cancel" @click="handleCancel">取消</a-button>
|
||||
<a-button
|
||||
v-if="!showable"
|
||||
key="forward"
|
||||
:loading="confirmLoading"
|
||||
type="primary"
|
||||
@click="handleOk"
|
||||
>保存</a-button
|
||||
>
|
||||
</a-space>
|
||||
</template>
|
||||
</basic-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { nextTick, reactive, ref, unref } from 'vue'
|
||||
import useFormEdit from '@/hooks/bootx/useFormEdit'
|
||||
import { add, get, MchApp, update } from './MchApp.api'
|
||||
import { FormInstance, Rule } from 'ant-design-vue/lib/form'
|
||||
import { FormEditType } from '@/enums/formTypeEnum'
|
||||
import { BasicModal } from '@/components/Modal'
|
||||
|
||||
const {
|
||||
initFormEditType,
|
||||
handleCancel,
|
||||
labelCol,
|
||||
wrapperCol,
|
||||
title,
|
||||
confirmLoading,
|
||||
visible,
|
||||
addable,
|
||||
showable,
|
||||
formEditType,
|
||||
} = useFormEdit()
|
||||
|
||||
// 表单
|
||||
const formRef = ref<FormInstance>()
|
||||
let form = ref<MchApp>({})
|
||||
|
||||
// 校验
|
||||
const rules = reactive({
|
||||
mchName: [{ required: true, message: '请输入商户名称' }],
|
||||
companyName: [{ required: true, message: '请输入公司名称' }],
|
||||
} as Record<string, Rule[]>)
|
||||
// 事件
|
||||
const emits = defineEmits(['ok'])
|
||||
// 入口
|
||||
function init(id, editType: FormEditType) {
|
||||
initFormEditType(editType)
|
||||
resetForm()
|
||||
getInfo(id, editType)
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取信息
|
||||
*/
|
||||
function getInfo(id, editType: FormEditType) {
|
||||
if ([FormEditType.Edit, FormEditType.Show].includes(editType)) {
|
||||
confirmLoading.value = true
|
||||
get(id).then(({ data }) => {
|
||||
form.value = data
|
||||
confirmLoading.value = false
|
||||
})
|
||||
} else if (editType === FormEditType.Add) {
|
||||
confirmLoading.value = false
|
||||
}
|
||||
}
|
||||
// 保存
|
||||
function handleOk() {
|
||||
formRef.value?.validate().then(async () => {
|
||||
confirmLoading.value = true
|
||||
if (formEditType.value === FormEditType.Add) {
|
||||
await add(unref(form)).finally(() => (confirmLoading.value = false))
|
||||
} else if (formEditType.value === FormEditType.Edit) {
|
||||
await update(unref(form)).finally(() => (confirmLoading.value = false))
|
||||
}
|
||||
handleCancel()
|
||||
emits('ok')
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 重置表单的校验
|
||||
*/
|
||||
function resetForm() {
|
||||
nextTick(() => formRef.value?.resetFields())
|
||||
}
|
||||
defineExpose({
|
||||
init,
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
145
src/views/daxpay/admin/merchant/app/MchAppList.vue
Normal file
145
src/views/daxpay/admin/merchant/app/MchAppList.vue
Normal file
@@ -0,0 +1,145 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="m-3 p-3 pt-5 bg-white">
|
||||
<b-query
|
||||
:query-params="model.queryParam"
|
||||
:fields="fields"
|
||||
@query="queryPage"
|
||||
@reset="resetQueryParams"
|
||||
/>
|
||||
</div>
|
||||
<div class="m-3 p-3 bg-white">
|
||||
<vxe-toolbar ref="xToolbar" custom :refresh="{ queryMethod: queryPage }">
|
||||
<template #buttons>
|
||||
<a-space>
|
||||
<a-button type="primary" pre-icon="ant-design:plus-outlined" @click="add"
|
||||
>新建</a-button
|
||||
>
|
||||
</a-space>
|
||||
</template>
|
||||
</vxe-toolbar>
|
||||
<vxe-table ref="xTable" key-field="id" :data="pagination.records" :loading="loading">
|
||||
<vxe-column type="seq" width="60" />
|
||||
<vxe-column field="mchNo" title="编码" />
|
||||
<vxe-column field="mchName" title="名称" />
|
||||
<vxe-column field="companyName" title="公司名称" />
|
||||
<vxe-column field="idType" title="证件类型">
|
||||
<template #default="{ row }">
|
||||
<a-tag v-if="row.idType === '0'" color="green">身份证</a-tag>
|
||||
<a-tag v-else-if="row.idType === '1'" color="blue">护照</a-tag>
|
||||
<a-tag v-else-if="row.idType === '2'" color="red">港澳通行证</a-tag>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="tel" title="联系方式" />
|
||||
<vxe-column field="legalPerson" title="法人名称" />
|
||||
<vxe-column field="tel" title="联系方式" />
|
||||
<vxe-column field="createTime" title="创建时间" />
|
||||
<vxe-column fixed="right" width="150" :showOverflow="false" title="操作">
|
||||
<template #default="{ row }">
|
||||
<span>
|
||||
<a-link @click="show(row)">查看</a-link>
|
||||
</span>
|
||||
<a-divider type="vertical" />
|
||||
<span>
|
||||
<a-link @click="edit(row)">编辑</a-link>
|
||||
</span>
|
||||
<a-divider type="vertical" />
|
||||
<a-link danger @click="remove(row)">删除</a-link>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<vxe-pager
|
||||
size="medium"
|
||||
:loading="loading"
|
||||
:current-page="pagination.current"
|
||||
:page-size="pagination.size"
|
||||
:total="pagination.total"
|
||||
@page-change="handleTableChange"
|
||||
/>
|
||||
<MchAppEdit ref="mchApp" @ok="queryPage" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { del, page } from './MchApp.api'
|
||||
import useTablePage from '@/hooks/bootx/useTablePage'
|
||||
import MchAppEdit from './MchAppEdit.vue'
|
||||
import BQuery from '@/components/Bootx/Query/BQuery.vue'
|
||||
import { STRING } from '@/components/Bootx/Query/Query'
|
||||
import { FormEditType } from '@/enums/formTypeEnum'
|
||||
import { useMessage } from '@/hooks/web/useMessage'
|
||||
import { VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
|
||||
import ALink from '@/components/Link/Link.vue'
|
||||
|
||||
// 使用hooks
|
||||
const {
|
||||
handleTableChange,
|
||||
pageQueryResHandel,
|
||||
resetQueryParams,
|
||||
pagination,
|
||||
pages,
|
||||
model,
|
||||
loading,
|
||||
} = useTablePage(queryPage)
|
||||
const { createMessage, createConfirm } = useMessage()
|
||||
// 查询条件
|
||||
const fields = [
|
||||
{ field: 'code', formType: STRING, name: '编码', placeholder: '请输入终端编码' },
|
||||
{ field: 'name', formType: STRING, name: '名称', placeholder: '请输入终端名称' },
|
||||
]
|
||||
const xTable = ref<VxeTableInstance>()
|
||||
const xToolbar = ref<VxeToolbarInstance>()
|
||||
const mchApp: any = ref()
|
||||
|
||||
onMounted(() => {
|
||||
vxeBind()
|
||||
queryPage()
|
||||
})
|
||||
|
||||
function vxeBind() {
|
||||
xTable.value?.connect(xToolbar.value as VxeToolbarInstance)
|
||||
}
|
||||
|
||||
// 分页查询
|
||||
function queryPage() {
|
||||
loading.value = true
|
||||
page({
|
||||
...model.queryParam,
|
||||
...pages,
|
||||
}).then(({ data }) => {
|
||||
pageQueryResHandel(data)
|
||||
})
|
||||
return Promise.resolve()
|
||||
}
|
||||
// 新增
|
||||
function add() {
|
||||
mchApp.value.init(null, FormEditType.Add)
|
||||
}
|
||||
// 查看
|
||||
function edit(record) {
|
||||
mchApp.value.init(record.id, FormEditType.Edit)
|
||||
}
|
||||
// 查看
|
||||
function show(record) {
|
||||
mchApp.value.init(record.id, FormEditType.Show)
|
||||
}
|
||||
|
||||
// 删除
|
||||
function remove(record) {
|
||||
createConfirm({
|
||||
iconType: 'warning',
|
||||
title: '警告',
|
||||
content: '是否删除该条数据',
|
||||
onOk: () => {
|
||||
del(record.id).then(() => {
|
||||
createMessage.success('删除成功')
|
||||
queryPage()
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
74
src/views/daxpay/admin/merchant/info/Merchant.api.ts
Normal file
74
src/views/daxpay/admin/merchant/info/Merchant.api.ts
Normal file
@@ -0,0 +1,74 @@
|
||||
import { defHttp } from '@/utils/http/axios'
|
||||
import { PageResult, Result } from '#/axios'
|
||||
import { BaseEntity } from '#/web'
|
||||
|
||||
/**
|
||||
* 分页
|
||||
*/
|
||||
export const page = (params) => {
|
||||
return defHttp.get<Result<PageResult<Merchant>>>({
|
||||
url: '/merchant/page',
|
||||
params,
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 详情
|
||||
*/
|
||||
export const get = (id) => {
|
||||
return defHttp.get<Result<Merchant>>({
|
||||
url: '/merchant/findById',
|
||||
params: { id },
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 新增
|
||||
*/
|
||||
export const add = (obj) => {
|
||||
return defHttp.post<Result<void>>({
|
||||
url: '/merchant/save',
|
||||
data: obj,
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 更新
|
||||
*/
|
||||
export const update = (obj) => {
|
||||
return defHttp.post<Result<void>>({
|
||||
url: '/merchant/update',
|
||||
data: obj,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
export const del = (id) => {
|
||||
return defHttp.post<Result<void>>({
|
||||
url: '/merchant/delete',
|
||||
params: { id },
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 商户
|
||||
*/
|
||||
export interface Merchant extends BaseEntity {
|
||||
// 商户号
|
||||
mchNo: string
|
||||
// 商户名称
|
||||
mchName: string
|
||||
// 公司名称
|
||||
companyName: string
|
||||
// 证件类型
|
||||
idType: string
|
||||
// 证件号
|
||||
idNo: string
|
||||
// 联系方式
|
||||
contact: string
|
||||
// 法人名称
|
||||
legalPerson: string
|
||||
// 法人证件号码
|
||||
legalPersonIdNo: string
|
||||
// 状态
|
||||
status: string
|
||||
}
|
||||
150
src/views/daxpay/admin/merchant/info/MerchantEdit.vue
Normal file
150
src/views/daxpay/admin/merchant/info/MerchantEdit.vue
Normal file
@@ -0,0 +1,150 @@
|
||||
<template>
|
||||
<basic-modal
|
||||
:loading="confirmLoading"
|
||||
v-bind="$attrs"
|
||||
:width="750"
|
||||
:title="title"
|
||||
:open="visible"
|
||||
:mask-closable="showable"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<a-form
|
||||
class="small-from-item"
|
||||
:model="form"
|
||||
ref="formRef"
|
||||
validate-trigger="['blur', 'change']"
|
||||
:rules="rules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
<a-form-item label="主键" name="id" :hidden="true">
|
||||
<a-input v-model:value="form.id" :disabled="showable" />
|
||||
</a-form-item>
|
||||
<a-form-item label="商户号" name="mchNo" v-show="!addable">
|
||||
<a-input v-model:value="form.mchNo" disabled />
|
||||
</a-form-item>
|
||||
<a-form-item label="商户名称" name="mchName">
|
||||
<a-input v-model:value="form.mchName" :disabled="showable" placeholder="请输入商户名称" />
|
||||
</a-form-item>
|
||||
<a-form-item label="公司名称" name="companyName">
|
||||
<a-input v-model:value="form.mchName" :disabled="showable" placeholder="请输入公司名称" />
|
||||
</a-form-item>
|
||||
<a-form-item label="证件类型" name="idType">
|
||||
<a-input v-model:value="form.idType" :disabled="showable" placeholder="请输入证件类型" />
|
||||
</a-form-item>
|
||||
<a-form-item label="证件号" name="idNo">
|
||||
<a-input v-model:value="form.idNo" :disabled="showable" placeholder="请输入证件号" />
|
||||
</a-form-item>
|
||||
<a-form-item label="联系方式" name="contact">
|
||||
<a-input v-model:value="form.contact" :disabled="showable" placeholder="请输入联系方式" />
|
||||
</a-form-item>
|
||||
<a-form-item label="法人名称" name="legalPerson">
|
||||
<a-input
|
||||
v-model:value="form.legalPerson"
|
||||
:disabled="showable"
|
||||
placeholder="请输入法人名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="法人证件号码" name="legalPersonIdNo">
|
||||
<a-input
|
||||
v-model:value="form.legalPersonIdNo"
|
||||
:disabled="showable"
|
||||
placeholder="请输入法人证件号码"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template #footer>
|
||||
<a-space>
|
||||
<a-button key="cancel" @click="handleCancel">取消</a-button>
|
||||
<a-button
|
||||
v-if="!showable"
|
||||
key="forward"
|
||||
:loading="confirmLoading"
|
||||
type="primary"
|
||||
@click="handleOk"
|
||||
>保存</a-button
|
||||
>
|
||||
</a-space>
|
||||
</template>
|
||||
</basic-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { nextTick, reactive, ref, unref } from 'vue'
|
||||
import useFormEdit from '@/hooks/bootx/useFormEdit'
|
||||
import { add, get, Merchant, update } from './Merchant.api'
|
||||
import { FormInstance, Rule } from 'ant-design-vue/lib/form'
|
||||
import { FormEditType } from '@/enums/formTypeEnum'
|
||||
import { BasicModal } from '@/components/Modal'
|
||||
|
||||
const {
|
||||
initFormEditType,
|
||||
handleCancel,
|
||||
labelCol,
|
||||
wrapperCol,
|
||||
title,
|
||||
confirmLoading,
|
||||
visible,
|
||||
addable,
|
||||
showable,
|
||||
formEditType,
|
||||
} = useFormEdit()
|
||||
|
||||
// 表单
|
||||
const formRef = ref<FormInstance>()
|
||||
let form = ref<Merchant>({})
|
||||
|
||||
// 校验
|
||||
const rules = reactive({
|
||||
mchName: [{ required: true, message: '请输入商户名称' }],
|
||||
companyName: [{ required: true, message: '请输入公司名称' }],
|
||||
} as Record<string, Rule[]>)
|
||||
// 事件
|
||||
const emits = defineEmits(['ok'])
|
||||
// 入口
|
||||
function init(id, editType: FormEditType) {
|
||||
initFormEditType(editType)
|
||||
resetForm()
|
||||
getInfo(id, editType)
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取信息
|
||||
*/
|
||||
function getInfo(id, editType: FormEditType) {
|
||||
if ([FormEditType.Edit, FormEditType.Show].includes(editType)) {
|
||||
confirmLoading.value = true
|
||||
get(id).then(({ data }) => {
|
||||
form.value = data
|
||||
confirmLoading.value = false
|
||||
})
|
||||
} else if (editType === FormEditType.Add) {
|
||||
confirmLoading.value = false
|
||||
}
|
||||
}
|
||||
// 保存
|
||||
function handleOk() {
|
||||
formRef.value?.validate().then(async () => {
|
||||
confirmLoading.value = true
|
||||
if (formEditType.value === FormEditType.Add) {
|
||||
await add(unref(form)).finally(() => (confirmLoading.value = false))
|
||||
} else if (formEditType.value === FormEditType.Edit) {
|
||||
await update(unref(form)).finally(() => (confirmLoading.value = false))
|
||||
}
|
||||
handleCancel()
|
||||
emits('ok')
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 重置表单的校验
|
||||
*/
|
||||
function resetForm() {
|
||||
nextTick(() => formRef.value?.resetFields())
|
||||
}
|
||||
defineExpose({
|
||||
init,
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
145
src/views/daxpay/admin/merchant/info/MerchantList.vue
Normal file
145
src/views/daxpay/admin/merchant/info/MerchantList.vue
Normal file
@@ -0,0 +1,145 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="m-3 p-3 pt-5 bg-white">
|
||||
<b-query
|
||||
:query-params="model.queryParam"
|
||||
:fields="fields"
|
||||
@query="queryPage"
|
||||
@reset="resetQueryParams"
|
||||
/>
|
||||
</div>
|
||||
<div class="m-3 p-3 bg-white">
|
||||
<vxe-toolbar ref="xToolbar" custom :refresh="{ queryMethod: queryPage }">
|
||||
<template #buttons>
|
||||
<a-space>
|
||||
<a-button type="primary" pre-icon="ant-design:plus-outlined" @click="add"
|
||||
>新建</a-button
|
||||
>
|
||||
</a-space>
|
||||
</template>
|
||||
</vxe-toolbar>
|
||||
<vxe-table ref="xTable" key-field="id" :data="pagination.records" :loading="loading">
|
||||
<vxe-column type="seq" width="60" />
|
||||
<vxe-column field="mchNo" title="编码" />
|
||||
<vxe-column field="mchName" title="名称" />
|
||||
<vxe-column field="companyName" title="公司名称" />
|
||||
<vxe-column field="idType" title="证件类型">
|
||||
<template #default="{ row }">
|
||||
<a-tag v-if="row.idType === '0'" color="green">身份证</a-tag>
|
||||
<a-tag v-else-if="row.idType === '1'" color="blue">护照</a-tag>
|
||||
<a-tag v-else-if="row.idType === '2'" color="red">港澳通行证</a-tag>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="tel" title="联系方式" />
|
||||
<vxe-column field="legalPerson" title="法人名称" />
|
||||
<vxe-column field="tel" title="联系方式" />
|
||||
<vxe-column field="createTime" title="创建时间" />
|
||||
<vxe-column fixed="right" width="150" :showOverflow="false" title="操作">
|
||||
<template #default="{ row }">
|
||||
<span>
|
||||
<a-link @click="show(row)">查看</a-link>
|
||||
</span>
|
||||
<a-divider type="vertical" />
|
||||
<span>
|
||||
<a-link @click="edit(row)">编辑</a-link>
|
||||
</span>
|
||||
<a-divider type="vertical" />
|
||||
<a-link danger @click="remove(row)">删除</a-link>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<vxe-pager
|
||||
size="medium"
|
||||
:loading="loading"
|
||||
:current-page="pagination.current"
|
||||
:page-size="pagination.size"
|
||||
:total="pagination.total"
|
||||
@page-change="handleTableChange"
|
||||
/>
|
||||
<MerchantEdit ref="merchantEdit" @ok="queryPage" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { del, page } from './Merchant.api'
|
||||
import useTablePage from '@/hooks/bootx/useTablePage'
|
||||
import MerchantEdit from './MerchantEdit.vue'
|
||||
import BQuery from '@/components/Bootx/Query/BQuery.vue'
|
||||
import { STRING } from '@/components/Bootx/Query/Query'
|
||||
import { FormEditType } from '@/enums/formTypeEnum'
|
||||
import { useMessage } from '@/hooks/web/useMessage'
|
||||
import { VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
|
||||
import ALink from '@/components/Link/Link.vue'
|
||||
|
||||
// 使用hooks
|
||||
const {
|
||||
handleTableChange,
|
||||
pageQueryResHandel,
|
||||
resetQueryParams,
|
||||
pagination,
|
||||
pages,
|
||||
model,
|
||||
loading,
|
||||
} = useTablePage(queryPage)
|
||||
const { createMessage, createConfirm } = useMessage()
|
||||
// 查询条件
|
||||
const fields = [
|
||||
{ field: 'code', formType: STRING, name: '编码', placeholder: '请输入终端编码' },
|
||||
{ field: 'name', formType: STRING, name: '名称', placeholder: '请输入终端名称' },
|
||||
]
|
||||
const xTable = ref<VxeTableInstance>()
|
||||
const xToolbar = ref<VxeToolbarInstance>()
|
||||
const merchantEdit: any = ref()
|
||||
|
||||
onMounted(() => {
|
||||
vxeBind()
|
||||
queryPage()
|
||||
})
|
||||
|
||||
function vxeBind() {
|
||||
xTable.value?.connect(xToolbar.value as VxeToolbarInstance)
|
||||
}
|
||||
|
||||
// 分页查询
|
||||
function queryPage() {
|
||||
loading.value = true
|
||||
page({
|
||||
...model.queryParam,
|
||||
...pages,
|
||||
}).then(({ data }) => {
|
||||
pageQueryResHandel(data)
|
||||
})
|
||||
return Promise.resolve()
|
||||
}
|
||||
// 新增
|
||||
function add() {
|
||||
merchantEdit.value.init(null, FormEditType.Add)
|
||||
}
|
||||
// 查看
|
||||
function edit(record) {
|
||||
merchantEdit.value.init(record.id, FormEditType.Edit)
|
||||
}
|
||||
// 查看
|
||||
function show(record) {
|
||||
merchantEdit.value.init(record.id, FormEditType.Show)
|
||||
}
|
||||
|
||||
// 删除
|
||||
function remove(record) {
|
||||
createConfirm({
|
||||
iconType: 'warning',
|
||||
title: '警告',
|
||||
content: '是否删除该条数据',
|
||||
onOk: () => {
|
||||
del(record.id).then(() => {
|
||||
createMessage.success('删除成功')
|
||||
queryPage()
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@@ -88,6 +88,8 @@
|
||||
model,
|
||||
loading,
|
||||
} = useTablePage(queryPage)
|
||||
const { createMessage, createConfirm } = useMessage()
|
||||
|
||||
// 查询条件
|
||||
const fields = [
|
||||
{ field: 'code', formType: STRING, name: '编码', placeholder: '请输入终端编码' },
|
||||
@@ -106,7 +108,9 @@
|
||||
xTable.value?.connect(xToolbar.value as VxeToolbarInstance)
|
||||
}
|
||||
|
||||
// 分页查询
|
||||
/**
|
||||
* 分页查询
|
||||
*/
|
||||
function queryPage() {
|
||||
loading.value = true
|
||||
page({
|
||||
@@ -117,25 +121,40 @@
|
||||
})
|
||||
return Promise.resolve()
|
||||
}
|
||||
// 新增
|
||||
/**
|
||||
* 新增
|
||||
*/
|
||||
function add() {
|
||||
clientEdit.value.init(null, FormEditType.Add)
|
||||
}
|
||||
// 查看
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
function edit(record) {
|
||||
clientEdit.value.init(record.id, FormEditType.Edit)
|
||||
}
|
||||
// 查看
|
||||
/**
|
||||
* 查看
|
||||
*/
|
||||
function show(record) {
|
||||
clientEdit.value.init(record.id, FormEditType.Show)
|
||||
}
|
||||
|
||||
// 删除
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
const { notification } = useMessage()
|
||||
function remove(record) {
|
||||
del(record.id).then(() => {
|
||||
notification.success({ message: '删除成功' })
|
||||
queryPage()
|
||||
createConfirm({
|
||||
iconType: 'warning',
|
||||
title: '警告',
|
||||
content: '是否删除该条数据',
|
||||
onOk: () => {
|
||||
del(record.id).then(() => {
|
||||
notification.success({ message: '删除成功' })
|
||||
queryPage()
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -264,7 +264,7 @@
|
||||
*/
|
||||
function resetPwdBatch() {
|
||||
const userIds = xTable.value?.getCheckboxRecords().map((o) => o.id)
|
||||
userResetPwd.value.init(true,userIds)
|
||||
userResetPwd.value.init(true, userIds)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -54,9 +54,10 @@
|
||||
/**
|
||||
* 初始化
|
||||
*/
|
||||
function init(batch: boolean, userIdOrIds: string | string[]) {
|
||||
function init(b: boolean, userIdOrIds: string | string[]) {
|
||||
visible.value = true
|
||||
if (!batch) {
|
||||
batch.value = b
|
||||
if (!b) {
|
||||
userId.value = userIdOrIds as string
|
||||
} else {
|
||||
userIds.value = userIdOrIds as never[]
|
||||
@@ -72,9 +73,13 @@
|
||||
onOk: async () => {
|
||||
confirmLoading.value = true
|
||||
if (batch.value) {
|
||||
await restartPasswordBatch(userIds.value, form.value.newPassword)
|
||||
await restartPasswordBatch(userIds.value, form.value.newPassword).finally(
|
||||
() => (confirmLoading.value = false),
|
||||
)
|
||||
} else {
|
||||
await restartPassword(userId.value, form.value.newPassword)
|
||||
await restartPassword(userId.value, form.value.newPassword).finally(
|
||||
() => (confirmLoading.value = false),
|
||||
)
|
||||
}
|
||||
createMessage.success('保存成功')
|
||||
handleCancel()
|
||||
|
||||
Reference in New Issue
Block a user