|
|
@@ -2,123 +2,167 @@
|
|
|
<div class="ele-body">
|
|
|
<el-card shadow="never">
|
|
|
<div class="payment">
|
|
|
- 银行卡绑定(开启核单 12 张)
|
|
|
+ 银行卡绑定(开启核单 {{counts.type1}} 张)
|
|
|
</div>
|
|
|
- <el-row :gutter="15">
|
|
|
- <el-col :sm="6">
|
|
|
- <div class="el-info">
|
|
|
- <div class="head">
|
|
|
- <span class="name">浙江网商银行</span>
|
|
|
- <span class="icon">
|
|
|
- <i class="el-icon-delete"></i>
|
|
|
- <i class="el-icon-edit"></i>
|
|
|
+ <el-row :gutter="15" class="payment-box">
|
|
|
+ <el-col :sm="6" class="payment-item" v-for="(v,k) in payments.list1" :key="k">
|
|
|
+ <div class="el-info">
|
|
|
+ <div class="head">
|
|
|
+ <span class="name">
|
|
|
+ <img v-if="v.logo" :src="v.logo" alt="">
|
|
|
+ <span v-else>{{v.bank_name}}</span>
|
|
|
+ </span>
|
|
|
+ <span class="icon">
|
|
|
+ <i class="el-icon-delete" @click="remove(v)"></i>
|
|
|
+ <i class="el-icon-edit" @click="edit(v)"></i>
|
|
|
</span>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <div class="info">
|
|
|
+ <div class="text"><span>持卡人姓名:</span>{{v.real_name}}</div>
|
|
|
+ <div class="text"><span>支行:</span>{{v.branch_name}}</div>
|
|
|
+ <div class="text"><span>卡号:</span>
|
|
|
+ <el-tooltip placement="top">
|
|
|
+ <div slot="content">{{v.bank_card}}</div>
|
|
|
+ <span>{{v.bank_card_text}}</span>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ <div class="text"><span>已用/当日限额:</span>¥{{v.used_quota}}/{{v.trade_quota}}</div>
|
|
|
+ <div class="text"><span>接单数/上限:</span>{{v.used_num}}/{{v.trade_num}}</div>
|
|
|
+ <div class="text"><span>接单状态:</span> <el-switch inactive-color="#ff4d4f" :value="v.status" :active-value="1" :width="40" :inactive-value="2" @change="editStatus(v,k)"></el-switch> </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :sm="6" class="payment-item add">
|
|
|
+ <div class="el-info">
|
|
|
+ <div class="add-btn" v-if="permission.includes('sys:payment:add')" @click="(showEdit=true) && (editForm.type = '1')" title="点击添加您的收款方式"><i class="el-icon-plus"></i></div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-card>
|
|
|
<!-- 编辑弹窗 -->
|
|
|
- <el-dialog :title="editForm.id?'修改通知':'修改通知'" :visible.sync="showEdit" width="600px"
|
|
|
- @closed="editForm={}" :destroy-on-close="true" custom-class="ele-dialog-form" :lock-scroll="false">
|
|
|
- <el-form :model="editForm" ref="editForm" :rules="editRules" label-width="82px">
|
|
|
+ <el-dialog :title="editForm.id?'修改收款方式':'添加收款方式'" :visible.sync="showEdit" width="600px"
|
|
|
+ @closed="editForm={type: '1',status: 1, is_default: 2}" :destroy-on-close="true" custom-class="ele-dialog-form" :lock-scroll="false">
|
|
|
+ <el-form :model="editForm" ref="editForm" :rules="editRules" label-width="100px">
|
|
|
<el-row :gutter="15">
|
|
|
<el-col :sm="12">
|
|
|
- <el-form-item label="通知标题:" prop="title">
|
|
|
- <el-input v-model="editForm.title" placeholder="请输入通知标题" clearable/>
|
|
|
+ <el-form-item v-if="editForm.type == 1" label="银行LOGO:" prop="logo">
|
|
|
+ <uploadImage v-if="loaded" :limit="1" v-model="editForm.logo"></uploadImage>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="类型:" prop="type">
|
|
|
+ <el-select v-model="editForm.type" placeholder="请选择收款方式类型" class="ele-fluid">
|
|
|
+ <el-option label="银行卡" :value="1"/>
|
|
|
+ <el-option label="微信" :value="2" disabled/>
|
|
|
+ <el-option label="支付宝" :value="3" disabled/>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <template v-if="editForm.type == 1">
|
|
|
+ <el-form-item label="收款人姓名:" prop="real_name">
|
|
|
+ <el-input v-model="editForm.real_name" placeholder="请输入收款人姓名" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="银行名称:" prop="bank_name">
|
|
|
+ <el-input v-model="editForm.bank_name" placeholder="请输入银行名称" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="支行名称:" prop="branch_name">
|
|
|
+ <el-input v-model="editForm.branch_name" placeholder="请输入支行名称" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="银行卡号:" prop="bank_card">
|
|
|
+ <el-input v-model="editForm.bank_card" placeholder="请输入银行卡号" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ </template>
|
|
|
+ </el-col>
|
|
|
+ <el-col :sm="12">
|
|
|
+ <el-form-item label="收款每日限额:" prop="trade_quota">
|
|
|
+ <el-input v-model="editForm.trade_quota" placeholder="请输入收款每日限额" clearable/>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="通知状态:">
|
|
|
+ <el-form-item label="使用次数限制:" prop="trade_num">
|
|
|
+ <el-input v-model="editForm.trade_num" placeholder="请输入使用次数限制" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="是否默认:">
|
|
|
+ <el-radio-group v-model="editForm.is_default">
|
|
|
+ <el-radio :label="1">是</el-radio>
|
|
|
+ <el-radio :label="2">否</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="收款状态:">
|
|
|
<el-radio-group v-model="editForm.status">
|
|
|
<el-radio :label="1">正常</el-radio>
|
|
|
<el-radio :label="2">禁用</el-radio>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :sm="12">
|
|
|
- <el-form-item label="是否置顶:">
|
|
|
- <el-radio-group v-model="editForm.is_top">
|
|
|
- <el-radio :label="1">置顶</el-radio>
|
|
|
- <el-radio :label="2">不置顶</el-radio>
|
|
|
- </el-radio-group>
|
|
|
+ <el-form-item label="谷歌验证码:" prop="google_code">
|
|
|
+ <el-input v-model="editForm.google_code" placeholder="请输入谷歌验证码" clearable/>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
- <!-- 富文本编辑器 -->
|
|
|
- <tinymce-editor v-model="editForm.content" :init="editContent"/>
|
|
|
</el-form>
|
|
|
<div slot="footer">
|
|
|
<el-button @click="showEdit=false">取消</el-button>
|
|
|
- <el-button type="primary" v-if="permission.includes('sys:notice:edit')" @click="save">保存</el-button>
|
|
|
+ <el-button type="primary" v-if="editForm.id && permission.includes('sys:payment:edit')" @click="save">保存</el-button>
|
|
|
+ <el-button type="primary" v-else-if="permission.includes('sys:payment:add')" @click="save">确定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import TinymceEditor from '@/components/TinymceEditor'
|
|
|
+import uploadImage from '@/components/uploadImage'
|
|
|
import {mapGetters} from "vuex";
|
|
|
|
|
|
export default {
|
|
|
name: "SysNotice",
|
|
|
- components: {TinymceEditor},
|
|
|
+ components: {uploadImage},
|
|
|
data() {
|
|
|
return {
|
|
|
- table: {url: '/notice/index', where: {}}, // 表格配置
|
|
|
+ loaded: false,
|
|
|
+ counts: {
|
|
|
+ type1: 0,
|
|
|
+ type2: 0,
|
|
|
+ type3: 0,
|
|
|
+ },
|
|
|
+ payments: {
|
|
|
+ list1: [], // 银行卡
|
|
|
+ list2: [], // 微信
|
|
|
+ list3: [], // 支付宝
|
|
|
+ },
|
|
|
choose: [], // 表格选中数据
|
|
|
showEdit: false, // 是否显示表单弹窗
|
|
|
- editForm: {source: 1, status: 1, is_top: 2}, // 表单数据
|
|
|
+ editForm: {
|
|
|
+ type: '1',
|
|
|
+ status: 2,
|
|
|
+ is_default: 2,
|
|
|
+ }, // 表单数据
|
|
|
editRules: { // 表单验证规则
|
|
|
- title: [
|
|
|
- {required: true, message: '请输入通知标题', trigger: 'blur'}
|
|
|
+ type: [
|
|
|
+ {required: true, message: '请选择收款方式类型', trigger: 'blur'}
|
|
|
],
|
|
|
- status: [
|
|
|
- {required: true, message: '请输入选择通知状态', trigger: 'blur'}
|
|
|
+ real_name: [
|
|
|
+ {required: true, message: '请输入收款人姓名', trigger: 'blur'}
|
|
|
],
|
|
|
- is_top: [
|
|
|
- {required: true, message: '请输入选择是否置顶', trigger: 'blur'}
|
|
|
+ bank_name: [
|
|
|
+ {required: true, message: '请输入银行名称', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ bank_card: [
|
|
|
+ {required: true, message: '请输入银行卡号', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ branch_name: [
|
|
|
+ {required: true, message: '请输入支行名称', trigger: 'blur'}
|
|
|
],
|
|
|
- },
|
|
|
- // 自定义文件上传(这里使用把选择的文件转成blob演示)
|
|
|
- file_picker_callback: (callback, value, meta) => {
|
|
|
- let input = document.createElement('input');
|
|
|
- input.setAttribute('type', 'file');
|
|
|
- // 设定文件可选类型
|
|
|
- if (meta.filetype === 'image') {
|
|
|
- input.setAttribute('accept', 'image/*');
|
|
|
- } else if (meta.filetype === 'media') {
|
|
|
- input.setAttribute('accept', 'video/*');
|
|
|
- }
|
|
|
- input.onchange = () => {
|
|
|
- let file = input.files[0];
|
|
|
- let reader = new FileReader();
|
|
|
- reader.onload = (e) => {
|
|
|
- let blob = new Blob([e.target.result], {type: file.type});
|
|
|
- callback(URL.createObjectURL(blob));
|
|
|
- };
|
|
|
- reader.readAsArrayBuffer(file);
|
|
|
- }
|
|
|
- input.click();
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
...mapGetters(["permission"]),
|
|
|
-
|
|
|
- editContent() {
|
|
|
- return {
|
|
|
- menubar: false,
|
|
|
- file_picker_callback: this.file_picker_callback,
|
|
|
- skin_url: this.$store.state.theme.theme === 'dark' ? '/tinymce/skins/ui/oxide-dark' : '/tinymce/skins/ui/oxide',
|
|
|
- content_css: this.$store.state.theme.theme === 'dark' ? '/tinymce/skins/content/dark/content.css' : '/tinymce/skins/content/default/content.css'
|
|
|
- };
|
|
|
- }
|
|
|
},
|
|
|
mounted() {
|
|
|
+ this.getData(1)
|
|
|
},
|
|
|
methods: {
|
|
|
/* 显示编辑 */
|
|
|
edit(row) {
|
|
|
this.editForm = Object.assign({}, row);
|
|
|
+ this.editForm.status = this.editForm.status? 1 : 2
|
|
|
+ this.editForm.is_default = this.editForm.is_default? 1 : 2
|
|
|
this.showEdit = true;
|
|
|
},
|
|
|
/* 保存编辑 */
|
|
|
@@ -126,19 +170,38 @@ export default {
|
|
|
this.$refs['editForm'].validate((valid) => {
|
|
|
if (valid) {
|
|
|
const loading = this.$loading({lock: true});
|
|
|
- this.$http.post('/notice/edit', this.editForm).then(res => {
|
|
|
- loading.close();
|
|
|
- if (res.data.code === 0) {
|
|
|
- this.showEdit = false;
|
|
|
- this.$message({type: 'success', message: res.data.msg});
|
|
|
- this.$refs.table.reload();
|
|
|
- } else {
|
|
|
- this.$message.error(res.data.msg);
|
|
|
- }
|
|
|
- }).catch(e => {
|
|
|
- loading.close();
|
|
|
- this.$message.error(e.message);
|
|
|
- });
|
|
|
+ if(this.editForm.real_name != this.$store.state.user.user.realname){
|
|
|
+ this.$confirm('您当前添加的收款方式,收款人姓名本人账号姓名不一致,请确认是否继续添加?', '提示', {type: 'warning'}).then(() => {
|
|
|
+ this.$http.post('/payment/edit', this.editForm).then(res => {
|
|
|
+ loading.close();
|
|
|
+ if (res.data.success === true) {
|
|
|
+ this.showEdit = false;
|
|
|
+ this.$message({type: 'success', message: res.data.msg});
|
|
|
+ this.getData(this.editForm.type)
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.data.msg);
|
|
|
+ }
|
|
|
+ }).catch(e => {
|
|
|
+ loading.close();
|
|
|
+ this.$message.error(e.message);
|
|
|
+ });
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ this.$http.post('/payment/edit', this.editForm).then(res => {
|
|
|
+ loading.close();
|
|
|
+ if (res.data.success === true) {
|
|
|
+ this.showEdit = false;
|
|
|
+ this.$message({type: 'success', message: res.data.msg});
|
|
|
+ this.getData(this.editForm.type)
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.data.msg);
|
|
|
+ }
|
|
|
+ }).catch(e => {
|
|
|
+ loading.close();
|
|
|
+ this.$message.error(e.message);
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
} else {
|
|
|
return false;
|
|
|
}
|
|
|
@@ -149,9 +212,9 @@ export default {
|
|
|
if (!row) { // 批量删除
|
|
|
if (this.choose.length === 0) return this.$message.error('请至少选择一条数据');
|
|
|
let ids = this.choose.map(d => d.id);
|
|
|
- this.$confirm('确定要删除选中的通知吗?', '提示', {type: 'warning'}).then(() => {
|
|
|
+ this.$confirm('确定要删除选中的收款方式吗?', '提示', {type: 'warning'}).then(() => {
|
|
|
const loading = this.$loading({lock: true});
|
|
|
- this.$http.post('/notice/delete', {id: ids}).then(res => {
|
|
|
+ this.$http.post('/payment/delete', {id: ids}).then(res => {
|
|
|
loading.close();
|
|
|
if (res.data.code === 0) {
|
|
|
this.$message({type: 'success', message: res.data.msg});
|
|
|
@@ -166,7 +229,7 @@ export default {
|
|
|
}).catch(() => 0);
|
|
|
} else { // 单个删除
|
|
|
const loading = this.$loading({lock: true});
|
|
|
- this.$http.post('/notice/delete', {id: row.id}).then(res => {
|
|
|
+ this.$http.post('/payment/delete', {id: row.id}).then(res => {
|
|
|
loading.close();
|
|
|
if (res.data.code === 0) {
|
|
|
this.$message({type: 'success', message: res.data.msg});
|
|
|
@@ -181,32 +244,42 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
/* 更改状态 */
|
|
|
- editStatus(row) {
|
|
|
- const loading = this.$loading({lock: true});
|
|
|
- let params = Object.assign({}, row);
|
|
|
- this.$http.post('/notice/status', params).then(res => {
|
|
|
- loading.close();
|
|
|
- if (res.data.code === 0) {
|
|
|
- this.$message({type: 'success', message: res.data.msg});
|
|
|
- } else {
|
|
|
- row.status = !row.status ? 2 : 1;
|
|
|
- this.$message.error(res.data.msg);
|
|
|
- }
|
|
|
- }).catch(e => {
|
|
|
- loading.close();
|
|
|
- this.$message.error(e.message);
|
|
|
+ editStatus(row,index) {
|
|
|
+ let _this = this
|
|
|
+ this.$message.closeAll()
|
|
|
+ this.$confirm('确定'+(row.status==1?'关闭':'打开')+'该收款方式?', '提示', {type: 'warning'}).then(() => {
|
|
|
+ let params = Object.assign({}, row);
|
|
|
+ params.status = params.status==1? 2 : 1;
|
|
|
+ this.$http.post('/payment/status', params).then(res => {
|
|
|
+ if (res.data.success === true) {
|
|
|
+ _this.payments['list' + row.type][index].status = !row.status ? 1 : 2;
|
|
|
+ this.$message({type: 'success', message: res.data.msg});
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.data.msg);
|
|
|
+ }
|
|
|
+ }).catch(e => {
|
|
|
+ this.$message.error(e.message);
|
|
|
+ });
|
|
|
});
|
|
|
},
|
|
|
- /* 是否置顶 */
|
|
|
- editIsTop(row) {
|
|
|
+ /* 获取列表 */
|
|
|
+ getData(type) {
|
|
|
const loading = this.$loading({lock: true});
|
|
|
- let params = Object.assign({}, row);
|
|
|
- this.$http.post('/notice/setIsTop', params).then(res => {
|
|
|
+ this.$http.get('/payment/index?type='+type+'&limit='+999).then(res => {
|
|
|
loading.close();
|
|
|
+ this.loaded = true;
|
|
|
if (res.data.code === 0) {
|
|
|
- this.$message({type: 'success', message: res.data.msg});
|
|
|
+ this.payments['list'+type] = res.data.data
|
|
|
+ if(this.payments['list'+type].length>0){
|
|
|
+ this.counts['type'+type] = 0;
|
|
|
+ this.payments['list'+type].forEach(item=>{
|
|
|
+ if(item.status == 1){
|
|
|
+ this.counts['type'+type]++;
|
|
|
+ }
|
|
|
+ return item;
|
|
|
+ })
|
|
|
+ }
|
|
|
} else {
|
|
|
- row.isTop = !row.isTop ? 2 : 1;
|
|
|
this.$message.error(res.data.msg);
|
|
|
}
|
|
|
}).catch(e => {
|
|
|
@@ -222,4 +295,66 @@ export default {
|
|
|
.ele-block >>> .el-upload, .ele-block >>> .el-upload-dragger {
|
|
|
width: 100%;
|
|
|
}
|
|
|
+.payment {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-bottom: 14px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ border-bottom: 1px solid #ccc;
|
|
|
+}
|
|
|
+.payment-box {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.payment-item {
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+.el-info .add-btn {
|
|
|
+ height: 245px;
|
|
|
+ line-height: 245px;
|
|
|
+ background-color: #f1f1f1;
|
|
|
+ padding: 8px 10px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 36px;
|
|
|
+ color: #ccc;
|
|
|
+}
|
|
|
+.el-info .add-btn i {
|
|
|
+ /*color: #666;*/
|
|
|
+}
|
|
|
+.el-info .head {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ padding: 4px 15px;
|
|
|
+ height: 36px;
|
|
|
+ line-height: 36px;
|
|
|
+ border-bottom: 1px solid #d3d4d3;
|
|
|
+ background-color: #f1f1f1;
|
|
|
+}
|
|
|
+
|
|
|
+.el-info .head img {
|
|
|
+ width: 60px;
|
|
|
+ height: 28px;
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: middle;
|
|
|
+ margin-right: 4px;
|
|
|
+}
|
|
|
+.el-info .head .icon {
|
|
|
+ float: right;
|
|
|
+}
|
|
|
+.el-info .head .icon i {
|
|
|
+ margin-left: 5px;
|
|
|
+}
|
|
|
+.el-info .info {
|
|
|
+ height: 200px;
|
|
|
+ background-color: #f1f1f1;
|
|
|
+
|
|
|
+ padding: 8px 10px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-info .info .text {
|
|
|
+ padding: 4px 0;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
</style>
|