xiaozhiyong
/
refinery-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:财务中心-公司账户管理-账户管理 分页查询

Browse Source
pull/1/head
douqi 2 years ago
parent b1c894f96c
commit 6dd00a42b1
3 changed files with 421 additions and 403 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 31
      src/api/financialCenter/accountManagement.js
  2. 81
      src/views/financialCenter/accountManagement/components/recharge.vue
  3. 712
      src/views/financialCenter/accountManagement/index.vue

31
src/api/financialCenter/accountManagement.js
Unescape View File

@ -0,0 +1,31 @@
import request from "utils/axios.js";
// table
const getByPage = (params) => {
return request.postJson(
"/oil-finance/oilCompanyAccount/getByPage",
params
);
};
//修改账户状态
const updateAccountState = (params) => {
return request.postJson(
"/oil-finance/oilCompanyAccount/getByPage",
params
);
};
//详情
const get = (id) => {
return request.get(`/oil-finance/oilCompanyAccount/get/${id}`);
};
// //详情
// const getCompanyAccountRecord = (params) => {
// return request.postJson(
// "oil-finance/oilCompanyAccountRecord/getCompanyAccountRecord",
// params
// );
// };
export default {
getByPage,
updateAccountState,
get
};

81
src/views/financialCenter/accountManagement/components/recharge.vue
Unescape View File

@ -0,0 +1,81 @@
<template>
<el-dialog
title="充值"
:visible="controlWindows.recharge"
width="30%"
:before-close="closeWindow"
@opened="openDrawer"
>
<div class="recharge.vue">
<el-form ref="form" :rules="rules" :model="form" label-width="120px">
<el-form-item label="成本价" prop="floorPrice">
<el-input
maxlength="50"
v-checkNum
v-model="form.floorPrice"
placeholder="请输入成本价"
></el-input>
</el-form-item>
<el-form-item label="企业销售价" prop="salePrice2company">
<el-input
maxlength="50"
v-checkNum
v-model="form.salePrice2company"
placeholder="请输入企业销售价"
></el-input>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="controlWindows.recharge = false">取 消</el-button>
<el-button type="primary" @click="submit">确 定</el-button>
</span>
</el-dialog>
</template>
<script>
import serve from "api/financialCenter/accountManagement.js";
export default {
props: {
controlWindows: Object,
},
data() {
return {
form: {},
rules: {
floorPrice: [
{ required: true, message: "请输入成本价", trigger: "blur" },
],
salePrice2company: [
{ required: true, message: "请输入企业销售价", trigger: "blur" },
],
},
};
},
methods: {
openDrawer() {},
submit() {
this.$refs["form"].validate((valid) => {
if (valid) {
Object.assign(this.form, this.controlWindows.addInfo);
serve.modifyPrice(this.form).then((res) => {
this.$message.success(res.msg);
this.closeWindow();
});
}
});
},
closeWindow() {
this.form = {};
this.$emit("closeWindow");
this.$nextTick(() => {
this.$refs.form.clearValidate();
this.controlWindows.recharge = false;
});
},
},
};
</script>
</style>

712
src/views/financialCenter/accountManagement/index.vue
Unescape View File

@ -2,25 +2,29 @@
<div class="bill-details">
<div class="frame">
<!-- 公司名称 -->
<autocomplete
class="mr20"
:params="parameter.params"
:config="configAutocomplete"
/>
<autocomplete class="mr20" :params="parameter.params" :config="configAutocomplete"/>
<!-- 总公司名称 -->
<autocomplete class="mr20" :params="parameter.params" :config="configAutocompleteSec"/>
<el-select
v-model="parameter.params.billType"
placeholder="交易类型"
clearable
>
<el-select v-model="parameter.params.accountState" placeholder="账户状态" clearable>
<el-option
v-for="(item, index) in rechargeTypeEnum"
v-for="(item, index) in accountStateEnum"
:key="index"
:label="item.label"
:value="item.value"
>
</el-option>
/>
</el-select>
<el-select v-model="parameter.params.companyNature" placeholder="企业性质" clearable>
<el-option
v-for="(item, index) in companyNatureEnum"
:key="index"
:label="item.label"
:value="item.value"
/>
</el-select>
<!-- 业务负责人 -->
<autocomplete :params="parameter.params" :config="configAutocompleteBusinessLeader"/>
<div class="buttons">
<el-button icon="el-icon-search" @click="search">查询</el-button>
@ -29,7 +33,9 @@
</div>
<div class="table">
<div class="operation">
<el-button @click="addition">新增产品</el-button>
<el-button @click="accountTypeHandler(0)">禁用</el-button>
<el-button @click="accountTypeHandler(1)">启用</el-button>
<el-button @click="accountTypeHandler(-1)">冻结</el-button>
</div>
<el-table
v-if="tableHeight"
@ -39,436 +45,336 @@
style="width: 100%"
>
>
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column prop="name" label="公司名称" show-overflow-tooltip>
</el-table-column>
<el-table-column label="交易类型/发生金额">
<template slot-scope="{ row }">
<p v-if="!/\W+/.test(row.billType)">
{{
rechargeTypeEnum.find((item) => item.value === row.billType)
.label
}}
</p>
<p v-else>{{ row.billType }}</p>
<p>{{ row.occurTotalAmount }}</p>
</template>
</el-table-column>
<el-table-column label="账户余额">
<template slot-scope="{ row }">
<p>
上次 <span>{{ row.lastBalance }}</span>
</p>
<p>
本次 <span>{{ row.currentBalance }}</span>
</p>
</template>
</el-table-column>
<el-table-column label="充值余额">
<template slot-scope="{ row }">
<p>
上次 <span>{{ row.lastRechargeBalance }}</span>
</p>
<p>
本次 <span>{{ row.currentRechargeBalance }}</span>
</p>
</template>
</el-table-column>
<el-table-column label="赊销余额">
<el-table-column type="selection" width="55"/>
<el-table-column prop="companyName" label="公司名称" minWidth="300">
<template slot-scope="{ row }">
<p>
上次 <span>{{ row.lastChargeRechargeBalance }}</span>
</p>
<p>
本次 <span>{{ row.currentChargeRechargeBalance }}</span>
</p>
<span style='padding-left:8px;'>{{row.companyName}}</span>
<br/>
<span style='padding-left:8px;'>业务负责人:{{row.businessLeader}}</span>
</template>
</el-table-column>
<el-table-column label="充值返利余额">
<el-table-column label="企业性质" minWidth="120">
<template slot-scope="{ row }">
<p>
上次 <span>{{ row.lastRechargeRebateBalance }}</span>
</p>
<p>
本次 <span>{{ row.currentRechargeRebateBalance }}</span>
</p>
{{companyNatureEnum.find((item) => item.value === row.companyNature).label}}
</template>
</el-table-column>
<el-table-column label="消费返利余额">
<el-table-column prop="totalBalance" label="公司企业总余额" minWidth="120"/>
<el-table-column label="司机油卡余额" minWidth="130">
<template slot-scope="{ row }">
<p>
上次 <span>{{ row.lastConsumeRebateAmount }}</span>
</p>
<p>
本次 <span>{{ row.currentConsumeRebateAmount }}</span>
</p>
<span>外:{{row.outCountBalance}}</span>
<br/>
<span>自:{{row.inCountBalance}}</span>
</template>
</el-table-column>
<el-table-column prop="balance" label="账户总余额" minWidth="120"/>
<el-table-column prop="rechargeBalance" label="充值余额" minWidth="120"/>
<el-table-column prop="chargeRechargeBalance" label="赊销充值余额" minWidth="120"/>
<el-table-column prop="rechargeRebateBalance" label="充值返利余额" minWidth="120"/>
<el-table-column prop="consumeRebateBalance" label="消费返利余额" minWidth="120"/>
<el-table-column prop="totalChargeAmount" label="赊销待还" minWidth="120"/>
<el-table-column prop="createTime" label="创建时间" minWidth="200"/>
<el-table-column prop="createTime" label="创建时间"> </el-table-column>
<el-table-column label="操作">
<el-table-column fixed="right" label="操作" width="150px">
<template slot-scope="{ row }">
<span class="el-dropdown-link" @click="detail(row)">详情</span>
<el-dropdown>
<el-button type="text">
更多<i class="el-icon-arrow-down el-icon--right"/>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item
@click.native="toRecharge(row.id)"
>
<el-button
:size="$store.getters.size"
type="text"
>
<svg-icon icon-class="iconicon-"/>
充值
</el-button>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<pagination :parameter="parameter" @searchAgain="getByPage" />
<pagination :parameter="parameter" @searchAgain="getByPage"/>
</div>
<!-- 详情 -->
<el-drawer
title="详情"
direction="ltr"
size="60%"
:withHeader="false"
:visible="controlWindows.detail"
>
<general-details
title="详情"
:isHeader="true"
v-if="controlWindows.detail"
:sourceData="oilCompanyMatch"
:mappingData="mappingData"
@close="controlWindows.detail = false"
>
<template #balance>
<p class="ft14">
上次:<span>{{ oilCompanyMatch.lastBalance }}</span>
</p>
<p class="ft14">
本次:<span>{{ oilCompanyMatch.currentBalance }}</span>
</p>
</template>
<template #rechargeBalance>
<p class="ft14">
上次:<span>{{ oilCompanyMatch.lastRechargeBalance }}</span>
</p>
<p class="ft14">
本次:<span>{{ oilCompanyMatch.currentRechargeBalance }}</span>
</p>
</template>
<template #chargeRechargeBalance>
<p class="ft14">
上次:<span>{{ oilCompanyMatch.lastChargeRechargeBalance }}</span>
</p>
<p class="ft14">
本次:<span>{{ oilCompanyMatch.currentChargeRechargeBalance }}</span>
</p>
</template>
<template #rechargeRebateBalance>
<p class="ft14">
上次:<span>{{ oilCompanyMatch.lastRechargeRebateBalance }}</span>
</p>
<p class="ft14">
本次:<span>{{ oilCompanyMatch.currentRechargeRebateBalance }}</span>
</p>
</template>
<template #consumeRebateAmount>
<p class="ft14">
上次:<span>{{ oilCompanyMatch.lastConsumeRebateAmount }}</span>
</p>
<p class="ft14">
本次:<span>{{ oilCompanyMatch.currentConsumeRebateAmount }}</span>
</p>
</template>
<template #table>
<el-table :data="tableDataSec" style="width: 100%">
<el-table-column
prop="businessOrderId"
label="关联订单"
></el-table-column>
<el-table-column label="交易类型">
<template slot-scope="{ row }">
<p v-if="!/\W+/.test(row.billType)">
{{
rechargeTypeEnum.find(
(item) => item.value === row.billTypes
).label
}}
</p>
<p v-else>
{{ row.billTypes }}
</p>
</template>
</el-table-column>
<el-table-column prop="nickName" label="司机"></el-table-column>
<el-table-column
prop="plateNumber"
label="车牌号"
></el-table-column>
<el-table-column
prop="payRealAmount"
label="订单金额"
></el-table-column>
<el-table-column
prop="createTime"
label="创建时间"
></el-table-column>
</el-table>
</template>
</general-details>
</el-drawer>
<!-- 添加充值 -->
<recharge :controlWindows="controlWindows" @closeWindow="closeDialog" />
</div>
</template>
<script>
import serve from "api/financialCenter/billDetails.js";
import commonServe from "api/common.js";
import serve from 'api/financialCenter/accountManagement.js'
import commonServe from 'api/common.js'
import autocomplete from "components/autocomplete/index.vue";
import pagination from "components/pagination/index.vue";
import generalDetails from "components/generalDetails/index.vue";
export default {
components: {
pagination,
autocomplete,
generalDetails,
},
data() {
return {
controlWindows: {
detail: false,
},
tableDataSec: [],
tableHeight: 0,
tableData: [],
configAutocomplete: {
serveTarget: commonServe.getRefineryCompanyList,
autocompleteKey: "name",
labelKey: "name",
valueKey: "id",
placeholder: "企业名称",
querykey: "companyId",
},
parameter: {
currentPage: 1,
pageSize: 10,
total: 0,
params: {},
},
rechargeTypeEnum: [
{
label: "分油",
value: "SEPARATION_OIL",
},
{
label: "充值",
value: "RECHARGE",
},
{
label: "圈回",
value: "TURN",
},
{
label: "销账",
value: "REVOKE",
import recharge from "./components/recharge.vue";
import autocomplete from 'components/autocomplete/index.vue'
import pagination from 'components/pagination/index.vue'
import generalDetails from 'components/generalDetails/index.vue'
export default {
components: {
recharge,
pagination,
autocomplete,
generalDetails
},
data() {
return {
oilCompanyAccount: {},
controlWindows: {
detail: false,
recharge:false // 充值弹窗
},
{
label: "赊销",
value: "CHARGE_SALES",
tableDataSec: [],
tableHeight: 0,
tableData: [],
multipleSelection: [],// 选择表格数据集合
configAutocomplete: {
serveTarget: commonServe.getRefineryCompanyList,
autocompleteKey: 'name',
labelKey: 'name',
valueKey: 'id',
placeholder: '企业名称',
querykey: 'companyId'
},
{
label: "充值返利",
value: "RECHARGE_REBETE",
configAutocompleteSec: {
serveTarget: commonServe.getRefineryCompanyList,
autocompleteKey: 'name',
labelKey: 'name',
valueKey: 'id',
placeholder: '总公司名称',
querykey: 'name'
},
{
label: "消费返利",
value: "CONSUME_REBATE",
configAutocompleteBusinessLeader: {
serveTarget: commonServe.liekQuery,
autocompleteKey: '',
labelKey: 'nickName',
valueKey: 'id',
placeholder: '业务负责人',
querykey: 'businessLeader'
},
],
oilCompanyMatch: {},
mappingData: [
{
carTitle: "企业账单明细详情",
carItems: [
{ label: "企业名称", value: "name" },
{ label: "发生金额", value: "occurTotalAmount" },
{ label: "交易类型", value: "billType" },
{ label: "交易时间", value: "createTime" },
{ label: "账户余额（元）", value: "balance" },
{ label: "充值余额（元）", value: "rechargeBalance" },
{ label: "赊销余额（元）", value: "chargeRechargeBalance" },
{ label: "充值返利余额（元）", value: "rechargeRebateBalance" },
{ label: "消费返利余额（元）", value: "consumeRebateAmount" },
{
label: "赊销待还款金额（元）",
value: "currentTotalChargeAmount",
},
{
label: "累计返利总金额（元）",
value: "currentTotalRebateAmount",
},
{
label: "累计充值返利总金额（元）",
value: "currentTotalRechargeRebateAmount",
},
{
label: "累计消费返利总金额（元）",
value: "currentTotalConsumeRebateAmount",
},
],
parameter: {
currentPage: 1,
pageSize: 10,
total: 0,
params: {}
},
{
carTitle: "账单关联订单",
carItems: [
{
value: "table",
},
],
},
],
};
},
created() {
this.getByPage();
},
updated() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout();
});
},
mounted() {
this.$nextTick(() => {
this.heightHandle();
});
window.addEventListener(
"resize",
this.$utils.debounce(this.heightHandle, 500)
);
},
methods: {
search() {
this.parameter.currentPage = 1;
this.getByPage();
},
//table list
getByPage() {
serve.getByPage(this.parameter).then((res) => {
this.tableData = res.data.list;
this.parameter.total = res.data.totalCount;
});
accountStateEnum: [
{
label: '禁用',
value: 0
},
{
label: '启用',
value: 1
},
{
label: '冻结',
value: -1
}
],
companyNatureEnum: [
{
label: '零售客户',
value: 0
},
{
label: '外请客户',
value: 1
},
{
label: '渠道客户',
value: 2
},
{
label: '存量客户',
value: 3
},
{
label: '批发客户',
value: 4
},
{
label: 'LNG客户',
value: 5
}
,
{
label: '推广业务',
value: 6
}
]
}
},
//新增
addition() {
this.controlWindows.addInfo.title = "产品新增";
this.controlWindows.add = true;
created() {
this.getByPage()
},
detail(row) {
let params = {
businessOrderId: row.businessOrderId,
billType:
row.billType == "分油" || row.billType == "SEPARATION_OIL"
? "SEPARATION_OIL"
: "TURN",
};
serve.getCompanyAccountRecord(params).then((res) => {
this.tableDataSec = [];
this.oilCompanyMatch = row;
this.controlWindows.detail = true;
});
updated() {
this.$nextTick(() => {
this.$refs.multipleTable && this.$refs.multipleTable.doLayout()
})
},
//重置
reset() {
this.parameter = {
currentPage: 1,
pageSize: 10,
total: 0,
params: {},
};
mounted() {
this.$nextTick(() => {
this.heightHandle()
})
window.addEventListener(
'resize',
this.$utils.debounce(this.heightHandle, 500)
)
},
methods: {
search() {
this.parameter.currentPage = 1
this.getByPage()
},
//table list
getByPage() {
serve.getByPage(this.parameter).then((res) => {
this.tableData = res.data.list
this.parameter.total = res.data.totalCount
})
},
// table height
heightHandle() {
let bodyHeight = document.body.clientHeight;
let frameHeight = this.obtainElement(".frame").clientHeight;
let operationHeight = this.obtainElement(".operation").clientHeight;
let paginationHeight = this.obtainElement(".el-pagination").clientHeight;
this.tableHeight =
bodyHeight - frameHeight - operationHeight - paginationHeight - 145;
},
obtainElement(className) {
return document.documentElement.querySelector(className);
},
},
};
//修改账户状态
accountTypeHandler(type) {
//0:禁用 1:启用 -1:冻结
if (!this.multipleSelection || this.multipleSelection.length < 1) {
this.$message.error('请选择需要操作的数据')
return
}
this.multipleSelection.forEach(item => {
item.accountState = type
})
serve.updateAccountState(this.multipleSelection).then(res => {
if (res.code === 20000) {
this.$message.success(res.msg)
}
this.getByPage()
})
},
detail(row) {
//TODO
},
toRecharge(id) {
// 跳转到充值
serve.get(id).then(res => {
this.oilCompanyAccount = res.data
this.controlWindows.recharge = true
})
},
//重置
reset() {
this.parameter = {
currentPage: 1,
pageSize: 10,
total: 0,
params: {}
}
},
closeDialog() {
this.controlWindows.recharge = false
},
// table height
heightHandle() {
let bodyHeight = document.body.clientHeight
let frameHeight = this.obtainElement('.frame').clientHeight
let operationHeight = this.obtainElement('.operation').clientHeight
let paginationHeight = this.obtainElement('.el-pagination').clientHeight
this.tableHeight =
bodyHeight - frameHeight - operationHeight - paginationHeight - 145
},
obtainElement(className) {
return document.documentElement.querySelector(className)
}
}
}
</script>
<style lang="scss" scoped>
.bill-details {
.frame {
margin: 20px;
padding: 20px;
border-radius: 6px;
border: 1px solid #e3e3e5;
background: #fff;
.el-input,
.el-select {
width: 183px;
height: 40px;
}
.el-autocomplete + .el-input,
.el-input + .el-autocomplete,
.el-autocomplete + .el-select,
.el-input + .el-input,
.el-input + .el-select,
.el-select + .el-select,
.el-select + .el-input {
margin-right: 20px;
margin-bottom: 15px;
}
.mr20 {
margin-right: 20px;
}
.buttons {
text-align: right;
}
}
.bill-details {
.frame {
margin: 20px;
padding: 20px;
border-radius: 6px;
border: 1px solid #e3e3e5;
background: #fff;
.table {
overflow: hidden;
margin: 0 20px;
padding-bottom: 20px;
background: #fff;
border-radius: 6px;
border: 1px solid #e3e3e5;
> .operation {
box-sizing: content-box;
padding: 15px;
}
.gray {
color: #999;
span {
color: #333;
.el-input,
.el-select {
width: 183px;
height: 40px;
}
.el-autocomplete + .el-input,
.el-input + .el-autocomplete,
.el-autocomplete + .el-select,
.el-input + .el-input,
.el-input + .el-select,
.el-select + .el-select,
.el-select + .el-input {
margin-right: 20px;
margin-bottom: 15px;
}
.mr20 {
margin-right: 20px;
}
.buttons {
text-align: right;
}
}
.el-table {
margin-bottom: 20px;
border-radius: 10px 10px 0px 0px;
}
.el-dropdown-link {
margin-right: 10px;
cursor: pointer;
color: #409eff;
&.special {
margin-right: 0;
.table {
overflow: hidden;
margin: 0 20px;
padding-bottom: 20px;
background: #fff;
border-radius: 6px;
border: 1px solid #e3e3e5;
> .operation {
box-sizing: content-box;
padding: 15px;
}
.gray {
color: #999;
span {
color: #333;
}
}
.el-table {
margin-bottom: 20px;
border-radius: 10px 10px 0px 0px;
}
.el-dropdown-link {
margin-right: 10px;
cursor: pointer;
color: #409eff;
&.special {
margin-right: 0;
}
}
.el-icon-arrow-down {
font-size: 12px;
}
}
.el-icon-arrow-down {
font-size: 12px;
.ft14 {
font-size: 14px;
}
}
.ft14 {
font-size: 14px;
}
}
</style>

Write Preview
Loading…
Cancel
Save