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
Unified 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. 474
      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>

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

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

Write Preview
Loading…
Cancel
Save