185 lines
5.2 KiB
Vue
185 lines
5.2 KiB
Vue
<script>
|
||
export default {
|
||
name: "beforeff",
|
||
data() {
|
||
return {
|
||
|
||
tableData: [{
|
||
price:2000,
|
||
yprice:2500,
|
||
date: '2016-05-02',
|
||
name: '王小虎',
|
||
address: '上海市普陀区金沙江路 1518 弄',
|
||
status:'进行中',
|
||
upadate: '2016-05-02',
|
||
}, ],
|
||
form: {
|
||
deductionRate: '',
|
||
transactionFlow: '',
|
||
systemFee: '',
|
||
systemFeeLimit: ''
|
||
},
|
||
form2: {
|
||
form: {
|
||
deductionRate: 1, // 扣点费率
|
||
transactionVolume: '', // 已发生交易流量
|
||
systemServiceFee: 0, // 系统服务费统计(这里假设为0,实际可能需要计算)
|
||
serviceFeeLimit: 5000, // 系统服务费限制
|
||
receiptAmount: '', // 收款金额
|
||
},
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
|
||
cancel() {
|
||
// 取消操作逻辑
|
||
console.log('取消操作');
|
||
},
|
||
save() {
|
||
// 保存操作逻辑
|
||
console.log('保存操作', this.form);
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<div>
|
||
<el-table
|
||
:data="tableData"
|
||
border
|
||
style="width: 100%;margin-left: 55px ">
|
||
<el-table-column
|
||
prop="price"
|
||
align="center"
|
||
label="扣点税率(元)">
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="yprice"
|
||
align="center"
|
||
label="易发生交易流量(元)">
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="address"
|
||
align="center"
|
||
label="系统服务费统计">
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="status"
|
||
align="center"
|
||
label="系统服务费限制(元)">
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="upadate"
|
||
align="center"
|
||
label="收款金额">
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="name"
|
||
align="center"
|
||
label="状态">
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="name"
|
||
align="center"
|
||
label="创建时间">
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="name"
|
||
align="center"
|
||
label="创建人">
|
||
</el-table-column>
|
||
<el-table-column
|
||
align="center">
|
||
<template slot="header" slot-scope="scope">
|
||
<el-button
|
||
size="mini"
|
||
@click="handleUpdate1(scope.row)"
|
||
>新增</el-button>
|
||
</template>
|
||
<template slot-scope="scope">
|
||
<el-button
|
||
size="mini"
|
||
@click="handleEdit(scope.$index, scope.row)">修改</el-button>
|
||
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
<el-dialog
|
||
title="新增"
|
||
:visible.sync="dialogVisible"
|
||
width="30%">
|
||
<!-- 表头插入按钮 -->
|
||
<el-form :model="form" label-width="120px">
|
||
<el-form-item label="扣点费率">
|
||
<el-input v-model="form.deductionRate" placeholder="请输入扣点费率" suffix="%"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="已发生交易流量">
|
||
<el-input v-model="form.transactionFlow" placeholder="请输入已发生交易流量" suffix="万元"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="系统服务费">
|
||
<el-input v-model="form.systemFee" placeholder="请输入系统服务费" suffix="万元"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="系统服务费限制">
|
||
<el-input v-model="form.systemFeeLimit" placeholder="请输入系统服务费限制" suffix="万元"></el-input>
|
||
</el-form-item>
|
||
</el-form>
|
||
<div class="button-group">
|
||
<el-button type="danger" @click="cancel">取消</el-button>
|
||
<el-button type="primary" @click="save">保存</el-button>
|
||
</div>
|
||
</el-dialog
|
||
>
|
||
<el-dialog
|
||
title="新增"
|
||
:visible.sync="dialogVisible2"
|
||
width="30%">
|
||
<el-form :model="form" label-width="120px">
|
||
<el-form-item label="扣点费率">
|
||
<!-- 假设扣点费率是固定的,这里仅显示 -->
|
||
<span>{{ form.deductionRate }}%</span>
|
||
</el-form-item>
|
||
<el-form-item label="已发生交易流量">
|
||
<el-input v-model="form.transactionVolume" placeholder="请输入交易流量"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="系统服务费统计">
|
||
<!-- 假设这是计算得出的,这里仅显示 -->
|
||
<span>{{ form.systemServiceFee }}万元</span>
|
||
</el-form-item>
|
||
<el-form-item label="系统服务费限制">
|
||
<!-- 假设这是固定的,这里仅显示 -->
|
||
<span>{{ form.serviceFeeLimit }}万元</span>
|
||
</el-form-item>
|
||
<el-form-item label="收款金额">
|
||
<el-input v-model="form.receiptAmount" placeholder="请输入收款金额"></el-input>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button type="primary" @click="submitForm('form')">保存</el-button>
|
||
<el-button @click="resetForm('form')">取消</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</el-dialog>
|
||
</div>
|
||
|
||
</template>
|
||
|
||
<style scoped lang="scss">
|
||
.fee-form {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
height: 100%;
|
||
padding: 20px;
|
||
}
|
||
|
||
.button-group {
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.el-button {
|
||
margin-right: 10px;
|
||
}
|
||
</style>
|