czg_team
/
cashier-admin
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

新增添加支付方式类型枚举

This commit is contained in:
gyq 2024-03-04 15:53:44 +08:00
parent 0c795bee95
commit 799ee9a5b5
4 changed files with 75 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.env.development
View File

@ -2,6 +2,7 @@ ENV = 'development'
# 接口地址
VUE_APP_BASE_API = 'http://192.168.2.128:8000'
# VUE_APP_BASE_API = 'http://192.168.2.16:8000'
VUE_APP_WS_API = 'ws://192.168.2.128:8000'
# 是否启用 babel-plugin-dynamic-import-node插件

49
src/views/systemMerchant/components/addPayType.vue
View File

@ -1,12 +1,18 @@
<template>
<el-dialog title="添加支付方式" :visible.sync="dialogVisible" :show-close="false" @close="reset">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
<el-form-item label="支付方式" prop="payName">
<el-input v-model="form.payName" placeholder="请输入商户号"></el-input>
<el-form-item label="支付类型" prop="payType">
<el-select v-model="form.payType" placeholder="请选择支付类型" @change="typeChange">
<el-option :label="item.lable" :value="item.key" v-for="item in payTypes"
:key="item.key"></el-option>
</el-select>
</el-form-item>
<el-form-item label="图标" prop="icon">
<el-form-item label="支付方式" prop="payName" v-if="form.payType == 'virtual'">
<el-input v-model="form.payName" placeholder="请输入自定义支付方式"></el-input>
</el-form-item>
<!-- <el-form-item label="图标" prop="icon">
<uploadImg ref="uploadImg" :limit="9" @success="e => form.icon = e[0]" />
</el-form-item>
</el-form-item> -->
<el-form-item label="是否虚拟">
<el-radio-group v-model="form.isIdeal">
<el-radio :label="1">虚拟</el-radio>
@ -37,6 +43,8 @@
<script>
import uploadImg from '@/components/uploadImg'
import { tbShopPayType } from '@/api/setting'
import payTypes from '../payTypes'
export default ({
components: { uploadImg },
data() {
@ -48,6 +56,7 @@ export default ({
}
}
return {
payTypes,
dialogVisible: false,
formLoading: false,
resetForm: '',
@ -55,6 +64,7 @@ export default ({
id: '',
icon: '',
shopId: localStorage.getItem('shopId'),
payType: '',
payName: '',
isIdeal: 1,
isOpenCashDrawer: 1,
@ -62,6 +72,13 @@ export default ({
sorts: 0
},
rules: {
payType: [
{
required: true,
message: ' ',
triiger: 'blur'
}
],
payName: [
{
required: true,
@ -83,6 +100,14 @@ export default ({
this.resetForm = { ...this.form }
},
methods: {
typeChange(e) {
this.form.icon = payTypes.find(item => item.key == e).icon
if (e == 'virtual') {
this.form.payName = ''
} else {
this.form.payName = payTypes.find(item => item.key == e).lable
}
},
// 保存
submitHandle() {
this.$refs.form.validate(async valid => {
@ -110,7 +135,7 @@ export default ({
},
reset() {
this.form = { ...this.resetForm }
this.$refs.uploadImg.fileList = []
// this.$refs.uploadImg.fileList = []
},
show(obj) {
this.dialogVisible = true
@ -123,13 +148,13 @@ export default ({
this.form.isDisplay = obj.isDisplay
this.form.sorts = obj.sorts
if (obj.icon) {
setTimeout(() => {
this.$refs.uploadImg.fileList = [{
url: obj.icon
}]
}, 100);
}
// if (obj.icon) {
// setTimeout(() => {
// this.$refs.uploadImg.fileList = [{
// url: obj.icon
// }]
// }, 100);
// }
}
}
}

8
src/views/systemMerchant/index.vue
View File

@ -4,26 +4,28 @@
<el-button type="primary" icon="el-icon-plus" @click="$refs.addPayType.show()">添加支付方式</el-button>
</div>
<div class="head-container">
<el-table :data="tableData.list" v-loading="tableData.loading">
<el-table-column prop="payName" label="支付方式"></el-table-column>
<el-table-column prop="icon" label="图标">
<el-table :data="tableData.list" v-loading="tableData.loading"><el-table-column prop="icon" label="图标">
<template v-slot="scope">
<el-image :src="scope.row.icon" style="width: 40px;height: 40px;"></el-image>
</template>
</el-table-column>
<el-table-column prop="payName" label="支付方式"></el-table-column>
<el-table-column prop="payType" label="类型"></el-table-column>
<el-table-column prop="isOpenCashDrawer" label="开钱箱权限">
<template v-slot="scope">
<el-switch v-model="scope.row.isOpenCashDrawer" :active-value="1" :inactive-value="0" disabled></el-switch>
</template>
</el-table-column>
<el-table-column prop="isDisplay" label="是否生效">
<template v-slot="scope">
<el-switch v-model="scope.row.isDisplay" :active-value="1" :inactive-value="0" disabled></el-switch>
</template>
</el-table-column>
<el-table-column prop="sorts" label="条件排序"></el-table-column>
<el-table-column label="操作" width="150">
<template v-slot="scope">
<el-button type="text" icon="el-icon-edit" @click="$refs.addPayType.show(scope.row)">编辑</el-button>
</template>

32
src/views/systemMerchant/payTypes.js Normal file
View File

@ -0,0 +1,32 @@
export default [
{
lable: '现金',
key: 'cash',
icon: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/20240302/2dab947729d640fba7709b7c0b42bfef.png'
},
{
lable: '银行卡',
key: 'bank',
icon: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/20240302/14b20cf721304b7fa2f01e6e75fab403.png'
},
{
lable: '扫码支付',
key: 'scanCode',
icon: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/20240302/9ff08224680446c8b3978844da99bbaa.png'
},
{
lable: '储值卡',
key: 'deposit',
icon: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/20240302/18d40f471a924d55b4eb13e5f553734d.png'
},
{
lable: '挂单',
key: 'arrears',
icon: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/20240304/fcf337b999f14a12ad75f76e74fcb344.png'
},
{
lable: '自定义',
key: 'virtual',
icon: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/20240304/6702fbf953504f89aa6a3db1f33d49b6.png'
}
]