You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
393 lines
12 KiB
393 lines
12 KiB
<template>
|
|
<div>
|
|
<div class="breadcrumb">
|
|
<a-breadcrumb>
|
|
<a-breadcrumb-item>资金结算分账管理</a-breadcrumb-item>
|
|
<a-breadcrumb-item>分账比例设置</a-breadcrumb-item>
|
|
</a-breadcrumb>
|
|
</div>
|
|
<div class="body">
|
|
<div class="query">
|
|
<a-row justify="space-between" >
|
|
<a-col :lg="8" :xl="8" :xxl="6" class="query_item">
|
|
<span>规则名称：</span>
|
|
<a-input v-model="query.rule_name"/>
|
|
</a-col>
|
|
<a-col :lg="8" :xl="8" :xxl="6" class="query_item" >
|
|
<span>创建人员：</span>
|
|
<a-select v-model="query.user_id">
|
|
<a-select-option :value="item.id" v-for="(item,index) in userList" :key="index">
|
|
{{item.account_name}}
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-col>
|
|
|
|
<a-col :lg="8" :xl="8" :xxl="6" class="query_item">
|
|
<span>使用状态：</span>
|
|
<a-select default-value="" v-model="query.status">
|
|
<a-select-option value="">全部</a-select-option>
|
|
<a-select-option value="0">禁用</a-select-option>
|
|
<a-select-option value="1">启用</a-select-option>
|
|
</a-select>
|
|
</a-col>
|
|
<a-col :lg="12" :xl="12" :xxl="6" class="query_item query_item2">
|
|
<span>创建时间：</span>
|
|
<a-range-picker v-model="query.createtime" valueFormat="YYYY-MM-DD"/>
|
|
</a-col>
|
|
<a-col :lg="12" :xl="12" :xxl="24" class="query_item query_item1">
|
|
<a-space :size="21">
|
|
<a-button type="primary" class="query_button" @click="getList(1)">查 询</a-button>
|
|
<a-button class="query_button" @click="resetQurey">重 置</a-button>
|
|
</a-space>
|
|
</a-col>
|
|
</a-row>
|
|
</div>
|
|
<div class="table">
|
|
<div class="table_title">
|
|
<span>查询结果</span>
|
|
<a-button type="primary" class="query_button" @click="visible2=true">创 建</a-button>
|
|
</div>
|
|
<a-table :columns="columns" :data-source="data" bordered :pagination="false">
|
|
<template slot="status" slot-scope="status">
|
|
<span >{{status==0?'禁用':'启用'}}</span>
|
|
</template>
|
|
<template slot="operation" slot-scope="item">
|
|
<a-space :size="24">
|
|
<span class="table_operation" @click="ratioStatus(item.id)">{{item.status==0?'启用':'禁用'}}</span>
|
|
<span class="table_operation" @click="ratioDetail(item.id)">查看</span>
|
|
</a-space>
|
|
</template>
|
|
</a-table>
|
|
<a-pagination
|
|
class="pagination"
|
|
size="small"
|
|
:total="total"
|
|
v-model="page"
|
|
:page-size="limit"
|
|
:show-total="total => `第 ${startTotal} - ${endTotal} 条 / 总共 ${total} 条`"
|
|
:page-size-options="pageSizeOptions"
|
|
@showSizeChange="onShowSizeChange"
|
|
@change="changePage"
|
|
show-size-changer >
|
|
<template slot="buildOptionText" slot-scope="props">
|
|
<span >{{ props.value }}条/页</span>
|
|
</template>
|
|
</a-pagination>
|
|
</div>
|
|
</div>
|
|
<!-- 创建规则 -->
|
|
<a-modal v-model="visible2" title="创建规则" width="1186px" :bodyStyle="modeStyle">
|
|
<div >
|
|
<div class="query_item rule_item rule_item2">
|
|
<!-- <a-col :span="5" > -->
|
|
<span>规则名称：</span>
|
|
<a-input v-model="query1.rule_name"/>
|
|
<!-- </a-col> -->
|
|
</div>
|
|
<a-row justify="space-between" class="modal_select" v-for="(item,index) in query1.ratio" :key="index">
|
|
<a-col :span="5" class="query_item rule_item">
|
|
<span>角色名称：</span>
|
|
<a-select v-model="item.role_type">
|
|
<a-select-option value="1">授权方</a-select-option>
|
|
<a-select-option value="2">被授权方</a-select-option>
|
|
<a-select-option value="3">平台方</a-select-option>
|
|
<!-- <a-select-option value="4">区域中心</a-select-option>
|
|
<a-select-option value="5">第三方服务机构</a-select-option> -->
|
|
</a-select>
|
|
</a-col>
|
|
<a-col :span="6" class="query_item rule_item">
|
|
<span>费用名称：</span>
|
|
<a-select v-model="item.cost_type">
|
|
<!-- <a-select-option value="1">委托服务费用</a-select-option>
|
|
<a-select-option value="2">交易服务费用</a-select-option>
|
|
<a-select-option value="3">认证服务费用</a-select-option> -->
|
|
<a-select-option value="1">{{item.role_type==2?'交易佣金':'交易结算'}}</a-select-option>
|
|
</a-select>
|
|
</a-col>
|
|
<a-col :span="7" class="query_item rule_item">
|
|
<span>计算方式：</span>
|
|
<a-select v-model="item.calculate">
|
|
<!-- <a-select-option value="2">固定</a-select-option> -->
|
|
<a-select-option value="1">比例</a-select-option>
|
|
</a-select>
|
|
<a-input v-model="item.amount" v-if="item.calculate==2"/>
|
|
<a-input v-model="item.ratio" v-if="item.calculate==1"/>
|
|
<span class="rule_item_span">%</span>
|
|
</a-col>
|
|
<!-- <a-col :span="6" class="query_item rule_item" >
|
|
<span>结算周期：</span>
|
|
<a-select default-value="1" v-model="query1.show">
|
|
<a-select-option value="1">3天</a-select-option>
|
|
<a-select-option value="2">5天</a-select-option>
|
|
<a-select-option value="3">7天</a-select-option>
|
|
<a-select-option value="4">10天</a-select-option>
|
|
<a-select-option value="5">14天</a-select-option>
|
|
<a-select-option value="6">15天</a-select-option>
|
|
<a-select-option value="7">20天</a-select-option>
|
|
<a-select-option value="8">30天</a-select-option>
|
|
</a-select>
|
|
</a-col> -->
|
|
</a-row>
|
|
<!-- <div class="caozuo">
|
|
<img src="../../../assets/img/add.svg" alt="">
|
|
<img src="../../../assets/img/jian.svg" alt="">
|
|
</div> -->
|
|
</div>
|
|
<template slot="footer">
|
|
<div>
|
|
<a-button type="white" @click="visible2=false">返 回</a-button>
|
|
<a-button type="primary" @click="addRule">创 建</a-button>
|
|
</div>
|
|
</template>
|
|
</a-modal>
|
|
<!-- 查看规则 -->
|
|
<a-modal v-model="visible" title="查看规则" width="570px" :bodyStyle="{'height':'300px'}">
|
|
<div class="rule_item1" v-for="(item,i) in ruleList" :key="i">
|
|
<span>{{item.role_type==1?'授权方':item.role_type==2?'被授权方':'平台方'}}：</span>
|
|
<span class="rule_item1_span">{{item.role_type==2?'交易佣金':'交易结算'}}（{{item.calculate==1?'比例':'固定'}}）</span>
|
|
<span v-if="item.calculate==1">{{item.ratio}}%</span>
|
|
<span v-if="item.calculate==2">{{item.amount}}%</span>
|
|
</div>
|
|
<template slot="footer">
|
|
<div>
|
|
<a-button type="white" @click="visible=false">返 回</a-button>
|
|
</div>
|
|
</template>
|
|
</a-modal>
|
|
</div>
|
|
|
|
</template>
|
|
<script>
|
|
import Operation from '../../Operation.vue'
|
|
import {ratioList,getUser,ratioStatus,setRatio,ratioDetail}from '../../../api/index'
|
|
export default {
|
|
data() {
|
|
return{
|
|
query1:{
|
|
ratio:[
|
|
{role_type:'2',cost_type:'1',calculate:'1',amount:'',ratio:null,},
|
|
{role_type:'1',cost_type:'1',calculate:'1',amount:'',ratio:null,},
|
|
{role_type:'3',cost_type:'1',calculate:'1',amount:'',ratio:null,},
|
|
],
|
|
rule_name:''
|
|
},
|
|
pageSizeOptions: ['10', '20', '30', '40', '50'],
|
|
//一页多少条
|
|
pageSize:10,
|
|
total:500,
|
|
startTotal:1,
|
|
endTotal:10,
|
|
limit:10,
|
|
// 当前页数
|
|
page:1,
|
|
query:{
|
|
rule_name:'',
|
|
user_id:'',
|
|
status:'',
|
|
createtime:[],
|
|
type:''
|
|
},
|
|
visible:false,
|
|
visible2:false,
|
|
modeStyle:{
|
|
'height':'240px'
|
|
},
|
|
data:[],
|
|
columns:[
|
|
// {
|
|
// title: '序号',
|
|
// dataIndex: 'id',
|
|
// width:'65px',
|
|
// align:'center'
|
|
// },
|
|
{
|
|
title: '创建时间',
|
|
dataIndex: 'createtime',
|
|
// align:'center'
|
|
},
|
|
{
|
|
title: '规则名称',
|
|
dataIndex: 'rule_name',
|
|
// align:'center'
|
|
},
|
|
{
|
|
title: '使用状态',
|
|
dataIndex: 'status',
|
|
scopedSlots: { customRender: 'status' },
|
|
// align:'center'
|
|
},
|
|
{
|
|
title: '创建人员',
|
|
dataIndex: 'username',
|
|
// align:'center'
|
|
},
|
|
{
|
|
title: '操作',
|
|
scopedSlots: { customRender: 'operation' },
|
|
// align:'center'
|
|
},
|
|
],
|
|
userList:[],
|
|
ruleList:[]
|
|
}
|
|
},
|
|
components:{
|
|
Operation
|
|
},
|
|
created(){
|
|
this.getList()
|
|
this.getUser()
|
|
},
|
|
methods:{
|
|
ratioDetail(val){
|
|
let data={id:val}
|
|
ratioDetail(data).then(res=>{
|
|
if(res.code==200){
|
|
this.visible=true
|
|
this.ruleList=res.data
|
|
this.ruleList.splice(
|
|
1,
|
|
1,
|
|
...this.ruleList.splice(1 - 1, 1, this.ruleList[1])
|
|
);
|
|
|
|
}else{
|
|
this.$message.error(res.msg);
|
|
}
|
|
})
|
|
},
|
|
ratioStatus(val){
|
|
let data={id:val}
|
|
ratioStatus(data).then(res=>{
|
|
if(res.code==200){
|
|
this.$message.success('修改状态成功！');
|
|
this.getList()
|
|
}else{
|
|
this.$message.error(res.msg);
|
|
}
|
|
})
|
|
},
|
|
// 获取用户
|
|
getUser(){
|
|
getUser().then(res=>{
|
|
if(res.code==200){
|
|
this.userList=res.data
|
|
}else{
|
|
this.$message.error(res.msg);
|
|
}
|
|
})
|
|
},
|
|
getList(type){
|
|
let data=this.query
|
|
data.limit=this.limit
|
|
if(type==1){
|
|
data.page=1
|
|
this.page=1
|
|
}else{
|
|
data.page=this.page
|
|
}
|
|
ratioList(data).then(res=>{
|
|
if(res.code==200){
|
|
this.data=res.data.data
|
|
this.startTotal=res.data.start
|
|
this.endTotal=res.data.end
|
|
this.total=res.data.total
|
|
}else{
|
|
this.$message.error(res.msg);
|
|
}
|
|
})
|
|
},
|
|
// 重置query
|
|
resetQurey(){
|
|
Object.assign(this.query, this.$options.data().query)
|
|
this.getList()
|
|
},
|
|
// 重置query
|
|
resetQurey1(){
|
|
for(let i=0;i<this.query1.ratio.length;i++){
|
|
this.query1.ratio[i].ratio=''
|
|
}
|
|
this.query1.rule_name=''
|
|
},
|
|
addRule(){
|
|
if(parseFloat(this.query1.ratio[0].ratio)+parseFloat(this.query1.ratio[2].ratio)!=100){
|
|
this.$message.error('授权方和平台方的加起来比列要等于100');
|
|
return
|
|
}
|
|
let data=this.query1
|
|
setRatio(data).then(res=>{
|
|
if(res.code==200){
|
|
this.$message.success('创建成功！');
|
|
this.getList()
|
|
this.resetQurey1()
|
|
}else{
|
|
this.$message.error(res.msg);
|
|
}
|
|
})
|
|
},
|
|
// 切换一页显示多少条
|
|
onShowSizeChange(current, pageSize){
|
|
this.limit = pageSize;
|
|
this.getList()
|
|
},
|
|
// 切换页数
|
|
changePage(page, pageSize){
|
|
this.page=page
|
|
this.getList()
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
.rule_item >span{
|
|
min-width: 80px;
|
|
}
|
|
.rule_item .ant-input{
|
|
width: 60px;
|
|
margin-left: 15px;
|
|
}
|
|
.rule_item .ant-select{
|
|
width: 140px;
|
|
}
|
|
.caozuo{
|
|
margin-top: 5px;
|
|
}
|
|
.caozuo img{
|
|
margin-right: 10px;
|
|
}
|
|
/deep/ .ant-modal-header{
|
|
border-bottom: none;
|
|
|
|
}
|
|
/deep/ .ant-modal-footer{
|
|
border-top: none;
|
|
padding: 10px 16px;
|
|
}
|
|
/deep/ .ant-modal-body{
|
|
padding: 12px 24px;
|
|
}
|
|
.rule_item1{
|
|
margin-bottom: 22px;
|
|
padding-bottom: 10px;
|
|
border-bottom: 1px solid rgb(153, 153, 153);
|
|
}
|
|
.rule_item1 span{
|
|
display: inline-block;
|
|
}
|
|
.rule_item1 span:first-child{
|
|
min-width:140px;
|
|
}
|
|
.rule_item1_span{
|
|
margin-left: 80px;
|
|
margin-right: 70px;
|
|
}
|
|
.rule_item_span{
|
|
display: inline-block;
|
|
margin-left: 10px;
|
|
min-width: auto !important;
|
|
}
|
|
.rule_item2 .ant-input{
|
|
margin-left: 0;
|
|
width: auto;
|
|
}
|
|
</style>
|
|
|