第一次上传

This commit is contained in:
dt_2916866708
2024-01-11 09:33:24 +08:00
commit b59bab8e90
822 changed files with 105065 additions and 0 deletions

View File

@@ -0,0 +1,134 @@
<template>
<div id="container" :style="{height:chartHieght+'px'}" style="width:100%"/>
</template>
<script>
// 引入基本模板
let echarts = require('echarts/lib/echarts')
require("echarts/lib/chart/line")
require('echarts/lib/component/tooltip')
require("echarts/lib/component/legend")
export default {
props:{
EchartsData:{
type:Object,
default(){
return {
consumption:[0,0, 0,0, 0,0,0],
income:[0, 0, 0,0,0, 0,0],
title:['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
}
}
},
chartHieght:{
type:Number ,
default: 400
}
},
mounted(){
this.chartsInit(this.EchartsData)
},
methods:{
chartsInit(obj){
console.log(obj)
let Echarts = echarts.init(document.getElementById('container'))
Echarts.setOption({
color: ['#80FFA5','#00DDFF' ],
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#6a7985'
}
}
},
legend: {
data: ['消费', '收入' ]
},
toolbox: {
feature: { }
},
grid: {
left: '0%',
right: '0%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: obj.title}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '消费',
type: 'line',
stack: 'Total',
smooth: true,
lineStyle: {
width: 0
},
showSymbol: false,
areaStyle: {
opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: 'rgb(128, 255, 165)'
},
{
offset: 1,
color: 'rgb(1, 191, 236)'
}
])
},
emphasis: {
focus: 'series'
},
data: obj.consumption
},
{
name: '收入',
type: 'line',
stack: 'Total',
smooth: true,
lineStyle: {
width: 0
},
showSymbol: false,
areaStyle: {
opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: 'rgb(0, 221, 255)'
},
{
offset: 1,
color: 'rgb(77, 119, 255)'
}
])
},
emphasis: {
focus: 'series'
},
data: obj.income
}
]
})
window.addEventListener("resize",function (){
Echarts.resize();
});
}
}
}
</script>
<style scoped>
</style>

View File

@@ -0,0 +1,569 @@
<template>
<div class="page">
<div class="EnterpriseFunds" ref="top">
<div class="EnterpriseFunds_title">
<div>
企业资金
</div>
<div class="chooesCompanyList">
<el-select v-model="activeCompany"
filterable
clearable
@change="changeCustomerId"
style="width: 350px;"
placeholder="请输入公司名/公司id检索">
<el-option
v-for="item in selectCompanyList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</div>
</div>
<div class="EnterpriseFunds_listBox">
<div class="EnterpriseFunds_listBox_total">
<div class="EnterpriseFunds_listBox_total_title color-w">
客户账户总余额
</div>
<div class="EnterpriseFunds_listBox_total_money color-w">
{{EnterpriseFunds.balance}} <span class="money_Img_box"> <svg-icon class="hamburger money_icon" icon-class="iconmeiyuan" /></span>
</div>
</div>
<div class="EnterpriseFunds_listBox_total_item">
<div class="EnterpriseFunds_listBox_total_item_box">
<div class="EnterpriseFunds_listBox_total_item_box_title color-grey">
充值金额 <span class="money_Img_box_sm"><svg-icon class="hamburger money_icon" icon-class="iconmeiyuan-copy" /></span>
</div>
<div class="EnterpriseFunds_listBox_total_item_box_money color-black">
{{EnterpriseFunds.rechargeBalance}}
</div>
</div>
<div class="EnterpriseFunds_listBox_total_item_box">
<div class="EnterpriseFunds_listBox_total_item_box_title color-grey">
赊销金额 <span class="money_Img_box_sm"><svg-icon class="hamburger money_icon" icon-class="iconmeiyuan-copy" /></span>
</div>
<div class="EnterpriseFunds_listBox_total_item_box_money color-grey">
{{EnterpriseFunds.chargeRechargeBalance}}
</div>
</div>
<div class="EnterpriseFunds_listBox_total_item_box">
<div class="EnterpriseFunds_listBox_total_item_box_title color-grey">
充值返利金额 <span class="money_Img_box_sm"><svg-icon class="hamburger money_icon" icon-class="iconmeiyuan-copy" /></span>
</div>
<div class="EnterpriseFunds_listBox_total_item_box_money color-black">
{{EnterpriseFunds.rechargeRebateBalance}}
</div>
</div>
<div class="EnterpriseFunds_listBox_total_item_box">
<div class="EnterpriseFunds_listBox_total_item_box_title color-grey">
消费返利金额 <span class="money_Img_box_sm"><svg-icon class="hamburger money_icon" icon-class="iconmeiyuan-copy" /></span>
</div>
<div class="EnterpriseFunds_listBox_total_item_box_money color-black">
{{EnterpriseFunds.consumeRebateBalance}}
</div>
</div>
<div class="EnterpriseFunds_listBox_total_item_box">
<div class="EnterpriseFunds_listBox_total_item_box_title color-grey">
赊销待还款总额 <span class="money_Img_box_sm"><svg-icon class="hamburger money_icon" icon-class="iconmeiyuan-copy-copy" /></span>
</div>
<div class="EnterpriseFunds_listBox_total_item_box_money color-red">
{{EnterpriseFunds.totalChargeAmount}}
</div>
</div>
</div>
</div>
</div>
<div class="enterpriseData" ref="main">
<div class="enterpriseData_head">
<div v-for="(list,index) in enterpriseList" :key='index' class="enterpriseData_head_list" :style="{color:(index == enterpriseList_curr ? '#474A61':'#bdbec4')}" @click="changeEnterprise(index)">
{{list.title}}
</div>
</div>
<div class="enterpriseData_main">
<div class="enterpriseData_main_left">
<div class="enterpriseData_main_left_box">
<div class="enterpriseData_main_left_box_title">
企业充值总金额
</div>
<div class="enterpriseData_main_left_box_money">
{{dataList.recharge}}
</div>
<div>
<img src="../../../assets/img/bottom_border_1.svg" alt="">
</div>
</div>
<div class="enterpriseData_main_left_box">
<div class="enterpriseData_main_left_box_title">
赊销总金额
</div>
<div class="enterpriseData_main_left_box_money">
{{dataList.chargeSales}}
</div>
<div>
<img src="../../../assets/img/bottom_border_2.svg" alt="">
</div>
</div>
<div class="enterpriseData_main_left_box">
<div class="enterpriseData_main_left_box_title">
赊销还款总金额
</div>
<div class="enterpriseData_main_left_box_money">
{{dataList.revoke}}
</div>
<div>
<img src="../../../assets/img/bottom_border_3.svg" alt="">
</div>
</div>
<div class="enterpriseData_main_left_box">
<div class="enterpriseData_main_left_box_title">
企业消费总金额
</div>
<div class="enterpriseData_main_left_box_money">
{{dataList.payAmt}}
</div>
<div>
<img src="../../../assets/img/bottom_border_4.svg" alt="">
</div>
</div>
</div>
<div class="enterpriseData_main_right">
<div class="enterpriseData_main_right_text">
<div class="enterpriseData_main_left_box_title">
企业打款总金额
</div>
<div class="enterpriseData_main_left_box_money_right">
{{dataList.totalPaymentAmount}}
</div>
</div>
<div class="enterpriseData_main_right_icon">
<div class="enterpriseData_main_right_icon_1">
<img src="../../../assets/img/yijia_svg.svg" alt="">
</div>
<div class="enterpriseData_main_right_icon_2">
<img src="../../../assets/img/border_svg.svg" alt="">
</div>
</div>
</div>
</div>
</div>
<div class="statisticalData">
<div class="enterpriseData_head">
<div v-for="(list,index) in statisticalList" :key='index' class="enterpriseData_head_list" :style="{color:(index == statisticalListr_curr ? '#474A61':'#bdbec4')}" @click="changeStatistical(index,list.value)">
{{list.title}}
</div>
</div>
<div>
<customerCharts :EchartsData='activeData' :key='times' :chartHieght='chartHieght'></customerCharts>
</div>
</div>
</div>
</template>
<script>
import customerCharts from './components/customerCharts'
import oilCompanyInfoApi from '@/api/user/oilCompanyInfo'
import CustomerMarket from '@/api/finance/CustomerMarket'
export default {
components: {
customerCharts
},
filters: {
// today(time) {
// var year = time.getFullYear()
// var month = time.getMonth() + 1
// var date = time.getDate() + 1
// var yyyyMMdd = year + '年' + month + '月' + date + '日'
// return yyyyMMdd
// }
},
data() {
return {
chartHieght:0,
activeCompany:'',//选中企业
selectCompanyList:[],//企业list
times:new Date().getTime(),
// 公司list
companyList:[
{
title:'合肥公司列表'
},
{
title:'合肥公司列表1'
},
{
title:'合肥公司列表测试公司'
},
{
title:'合肥公司列表测试公司合肥公司列表测试公司'
},
],
enterpriseList_curr:0,
statisticalListr_curr:0,
enterpriseList:[
{
title:'今日数据'
},{
title:'月度数据'
},{
title:'年度数据'
}
],
statisticalList:[
{
title:'月度数据',
value:2
},{
title:'年度数据' ,
value:3
}
],
activeData:{
consumption:[0,0, 0,0, 0,0,0],
income:[0, 0, 0,0,0, 0,0],
title:['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
},
EnterpriseFunds:{},
dataList:{},
oneHeight:0,
twoHeight:0
}
},
created() {
this.getCompanyList() // 首页进入时获取公司列表
this.changeCustomerId()
},
mounted() {
this.oneHeight = this.$refs.top.offsetHeight
this.twoHeight = this.$refs.main.offsetHeight
let boxHeight = document.documentElement.clientHeight
this.chartHieght = boxHeight - this.oneHeight -this.twoHeight
console.log(this.oneHeight,this.twoHeight ,boxHeight, this.chartHieght)
},
methods: {
promptBox(msg,type){
// success | warning | info | error
this.$message({
message: msg,
type: type
})
},
changeCustomerId(){
let obj = {
companyId:this.activeCompany
}
CustomerMarket.getCompanyAcct(obj).then(res=>{
console.log(res)
if(res.code == 20000){
this.EnterpriseFunds = res.data
this.getDataList(this.activeCompany,0)
this.changeStatistical(0,2)
}else{
this.promptBox(res.msg,'error')
}
})
},
getDataList(Id,type){ //月日年数据
let obj = {
companyId:Id,
chooseTime:type
}
CustomerMarket.getCompanyAcctCount(obj).then(res => {
console.log(res)
if(res.code == 20000){
this.dataList = res.data
}else{
this.promptBox(res.msg,'error')
}
})
},
getChartsData(Id,type,i){
let obj = {
companyId:Id,
chooseTime:type
}
CustomerMarket.getCompanyYearAndMonth(obj).then(res => {
console.log(res)
if(res.code == 20000){
this.activeData.consumption = this.ProcessingArray(res.data.list1,false)
this.activeData.income = this.ProcessingArray(res.data.list2,false)
this.activeData.title = this.ProcessingArray(res.data.list2,true)
this.times = new Date().getTime()
this.statisticalListr_curr = i
}else{
this.promptBox(res.msg,'error')
}
})
},
ProcessingArray(data,t){
var dataList=[]
if(t){
data.map(item =>{
dataList.push(item.tim)
})
}else{
data.map(item =>{
dataList.push(item.amt)
})
}
return dataList
},
getCompanyList(){
oilCompanyInfoApi.getCompanyList().then(res => {
console.log(res)
this.selectCompanyList = res.data
})
},
changeStatistical(i,v){
let id = this.activeCompany
this.getChartsData(id,v,i)
},
changeEnterprise(i){
let id = this.activeCompany
if(i==0 ){
this.getDataList(id,i)
this.enterpriseList_curr = i
}else{
this.enterpriseList_curr = i
this.getDataList(id,i+1)
}
}
}
}
</script>
<style scoped>
.page{
background-color: #ffff;
}
.enterpriseData_main_right .enterpriseData_main_right_text .enterpriseData_main_left_box_title{
text-align: left;
}
.money_Img_box_sm .icon{
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
width: 1.6em;
height:1.6em;
}
.page{
padding: 2% 3%;
}
.color-w{
color: #fff !important;
}
.color-grey{
color: #95AAC9;
}
.color-black{
color: #3333;
}
.color-red{
color: #e63757 !important;
}
.enterpriseData_main_left_box_money_right{
font-family: 'Arial-BoldMT', 'Arial Bold', 'Arial', sans-serif;
font-weight: 700;
font-style: normal;
font-size: 48px;
color: #2D3440;
}
.enterpriseData_main_right_icon{
position: relative;
width: 28%;
height: 100%;
}
.enterpriseData_main_right_icon_1{
position: absolute;
left:30px;
top: 30%;
}
.enterpriseData_main_right_icon_2{
position: absolute;
left:3px;
top: 10%;
}
.enterpriseData_main_right_text{
width: 73%;
flex: 0 0 auto;
}
.enterpriseData_main_left_box_title{
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
font-weight: 650;
font-style: normal;
font-size: 14px;
color: #BDBEC4;
margin-bottom: 20px;
text-align: center;
}
.enterpriseData_main_left_box_money{
font-family: 'Arial-BoldMT', 'Arial Bold', 'Arial', sans-serif;
font-weight: 700;
font-style: normal;
color: #474A61;
text-align: center;
font-size: 32px;
}
.enterpriseData_main_left_box{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.enterpriseData_main{
margin-top: 30px;
height: 201px;
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.enterpriseData_main_left{
box-shadow:0 0 17px 1px #efefef;
border-radius: 4px;
padding: 33px 43px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: center;
width: 70%;
flex: 0 0 auto;
}
.enterpriseData_main_left:hover{
box-shadow:0 0 18px 4px #ccd1ff;
transition: all linear .4s;
}
.enterpriseData_main_right{
width: 24%;
flex: 0 0 auto;
height: 201px;
padding: 33px 36px;
box-shadow: 0 0 17px 1px #efefef;
border-radius: 4px;
display: flex;
justify-content: space-between;
align-items: flex-start;
padding-right: 20px;
}
.enterpriseData_main_right:hover{
box-shadow:0 0 18px 4px #ccd1ff;
transition: all linear .4s;
}
.money_icon{
width: 21px;
height: 19px;
}
.EnterpriseFunds_listBox_total_item_box_title {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 12px;
margin-bottom: 23px;
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.enterpriseData_head{
display: flex;
justify-content: flex-start;
align-items: center;
}
.enterpriseData_head_list{
font-family: 'Arial-BoldMT', 'Arial Bold', 'Arial', sans-serif;
font-weight: 700;
font-style: normal;
font-size: 20px;
margin-right: 30px;
cursor: pointer;
}
.EnterpriseFunds_listBox_total_item_box{
box-shadow:0 0 17px 1px #efefef;
border-radius: 4px;
padding:26px;
box-sizing: border-box;
margin-right:4%;
width: 20%;
position: relative;
}
.EnterpriseFunds_listBox_total_item_box:hover{
box-shadow:0 0 18px 4px #ccd1ff;
transition: all linear .4s;
}
.EnterpriseFunds_title{
color: #333;
font-size: 20px;
margin-bottom: 30px;
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
font-weight: 650;
display: flex;
flex: 0 0 auto;
justify-content: space-between;
align-items: center;
}
.EnterpriseFunds_listBox_total_item_box_money{
font-family: 'ArialMT', 'Arial', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 18px;
color: #12263F;
}
.money_Img_box{
margin-left: 20px;
position: absolute;
right:4%;
top: 46%;
}
.EnterpriseFunds_listBox_total_item_box_title .money_Img_box{
margin-left: 20px;
position: absolute;
right: 20px;
top: 24px;
}
.EnterpriseFunds_listBox_total_money{
font-size: 24px;
font-weight: 700;
}
.EnterpriseFunds_listBox_total_title{
font-size: 14px;
margin-bottom: 24px;
}
.EnterpriseFunds_listBox{
display: flex;
justify-content: flex-start;
align-items: flex-end;
}
.EnterpriseFunds_listBox_total{
width:16%;
background-color: #646dc8;
border-radius: 4px;
padding: 24px 33px 44px 33px;
margin-right: 4%;
flex: 0 0 auto;
position: relative;
}
.chooesCompanyList{
width: 50%;
display: flex;
justify-content: flex-end;
align-items: center;
flex-direction: row;
flex: 0 0 auto;
}
.EnterpriseFunds_listBox_total_item{
width: 80%;
display: flex;
justify-content: flex-start;
align-items: center;
flex: 0 0 auto;
}
.EnterpriseFunds_listBox_total_item .EnterpriseFunds_listBox_total_item_box:last-child {
margin: 0;
}
.enterpriseData{
padding: 40px 0;
box-sizing: border-box;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,430 @@
<template>
<div id="oilSiteUser">
<div class="table-header table-div el-scrollbar table-div-box">
<ListLayout :table-columns="tableColumns">
<div slot="search" style="margin-top:5px">
<!--这里放顶部搜索-->
<!-- 搜索部分开始 -->
<el-form label-width="90px" :inline="true" :model="page" class="search-form" :size="$store.getters.size">
<el-form-item style="width:20%">
<el-input
v-model="page.params.bankName"
placeholder="请输入支行名称模糊搜索"
clearable
@keyup.enter.native="getByPage"
/>
</el-form-item>
<el-form-item style="width:20%">
<el-input
v-model="page.params.cnaps"
placeholder="请输入联行号精确搜索"
clearable
@keyup.enter.native="getByPage"
/>
</el-form-item>
</el-form>
<!-- 搜索部分结束 -->
</div>
<el-row slot="button-group" style="margin-top:5px">
<el-col :span="4" style="text-align: left;">
<el-button
class="group-item"
:size="$store.getters.size"
type="primary"
@click="toAdd"
><svg-icon icon-class="iconyinhang" /> 新增银行</el-button>
</el-col>
<el-col :span="20">
<el-button
type="primary"
:size="$store.getters.size"
icon="el-icon-search"
@click="search"
>查询</el-button>
<el-button
:size="$store.getters.size"
icon="el-icon-refresh"
type="info"
@click="page.params={}"
>重置</el-button>
</el-col>
</el-row>
<div slot="table">
<!--这里放表格和分页-->
<!-- 列表开始 -->
<el-table
:max-height="tableHeight"
stripe
:data="dataPage.list"
fit
style="width: 100%"
:size="$store.getters.size"
@sort-change="sortHandler"
@selection-change="handleSelectionChange"
>
<el-table-column
type="selection"
width="55"
/>
<el-table-column
label="序号"
type="index"
:index="indexMethod"
/>
<template v-for="(item, index) in tableColumns">
<el-table-column
v-if="item.show"
:key="index"
:fixed="item.fixed"
:align="item.align"
:show-overflow-tooltip="true"
:min-width="item.minWidth"
:width="item.width"
:prop="item.prop"
:sortable="item.sortable"
:label="item.label"
:formatter="item.render"
/>
</template>
<el-table-column fixed="right" label="操作" width="100px">
<template slot-scope="scope">
<el-button
:size="$store.getters.size"
type="text"
@click="update(scope.row.id)"
>
<svg-icon icon-class="iconxiangqing1" />修改
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 列表结束 -->
<!-- 分页组件开始 -->
<div class="page-div">
<el-pagination
:current-page="page.currentPage"
:page-sizes="[10,15,20,30]"
:page-size="page.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="page.totalCount"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
<!-- 分页组件结束 -->
</div>
</ListLayout>
<!-- 添加企业用户 -->
<el-drawer
:visible.sync="addDialog"
size="40%"
direction="rtl"
>
<interBankOutAdd @getByPage='getByPage' v-if="addDialog" @closeDialog="closeDialog"/>
</el-drawer>
<!-- 修改企业用户 -->
<el-drawer
:visible.sync="updateDialog"
size="40%"
direction="rtl"
>
<interBankOutAdd @getByPage='getByPage' :import-data='importData' @closeDialog="closeDialog"/>
</el-drawer>
</div>
</div>
</template>
<script>
import interBank from '@/api/dict/interBank'
import oilCustomerCompanyAccountApi from '@/api/finance/oilCustomerCompanyAccount'
import interBankOutAdd from './interBankOutAdd'
import { mapGetters } from 'vuex'
import sysCustomerInfoApi from '@/api/user/sysCustomerInfo'
import oilCompanyInfoApi from '@/api/user/oilCompanyInfo'
export default {
components: {
interBankOutAdd
},
data() {
return {
row:[{a:1,b:2},{a:1,b:2}],
output: {
outputType: 1, // 导出方式1导出选中2导出本页3条件导出4导出全部
startPage: 1, // 导出开始页
endPage: 1, // 导出结束页
pageSize: 10 // 每页条数
},
companyId: '',
typeDialog: false,
distributeReverseData: {},
userList: [],
queryCompanyList: [],
multipleSelection: [], // 选择表格数据集合
importDialog: false, // 导入弹窗
outPutDialog: false, // 导出弹窗
showTableDrawer: false,
oilCompanyDistributeReverse: {},
companyList: [],
sysCustomerList: [], // 用户集合
page: {
pageSize: 10, // 每页显示条数
currentPage: 1, // 默认页
params: {}, // 查询参数
sorted: {
id:"desc"
},
columns: [
]
},
tableHeight: document.documentElement.clientHeight - 300 -50,
filters: this.$options.filters,
dataPage: { // 分页显示page
pageSize: 10, // 每页显示条数
currentPage: 1, // 默认页
params: { // 查询参数
},
sorted: {}
},
tableColumns: [
{ prop: 'id', width: 150, label: '编号', show: true, render: (row, column, cell) => {
return cell
} },
{ prop: 'cnaps', width: 250, label: '联行号', show: true, render: (row, column, cell) => {
return cell
} },
{ prop: 'bankName',fixed:"right", label: '支行名称', show: true, render: (row, column, cell) => {
return cell
} }
],
addDialog: false, // 添加弹窗
updateDialog: false, // 修改弹窗
sysSheet: {},
importData:{},
companyAccountRecordsDataPage: { // 公司明细分页显示page
pageSize: 20, // 每页显示条数
currentPage: 1, // 默认页
params: { // 查询参数
},
sorted: {}
},
}
},
computed: {
...mapGetters(['sysUserList'])
},
created() {
this.getByPage()
// 增加监听事件,窗口变化时得到高度。
window.addEventListener('resize', this.getHeight, false)
},
// activated() {
// this.getByPage()
// // 增加监听事件,窗口变化时得到高度。
// window.addEventListener('resize', this.getHeight, false)
// },
methods: {
changeEditor(row, r) { // 修改是否允许修改标识
this.$set(row, 'editor', true)
this.$nextTick(() => {
// console.log(this.$refs[r])
this.$refs[r].focus()
})
this.plateNumberCompany= row.plateNumberCompany
},
toggleDialog(row, disType) {
this.distributeReverseData = row
this.distributeReverseData.disType = disType
this.typeDialog = true
},
update(id) {
// 跳转到修改
interBank.get(id).then(res => {
this.importData = res.data
this.updateDialog = true
})
},
searchCompanyInfo(info) {
const oilSiteInfo = {}
oilSiteInfo.name = info
if (info && info !== '') {
oilCompanyInfoApi.getLikeByNameOrId(oilSiteInfo).then(res => {
this.companyList = res.data
})
}
},
searchUserInfo(info) {
if (info && info !== '') {
sysCustomerInfoApi.searchInfo(info).then(res => {
this.sysCustomerList = res.data
})
}
},
// handleDetail(row) {
// // 查看行 详情
// // oilCustomerCompanyAccountApi.get(id).then((res) => {
// // this.oilCustomerCompanyAccount = res.data;
// // this.showTableDrawer = true;
// // });
// this.companyAccountRecordsDataPage.params = {
// customerId: row.customerId
// }
// // 获取明细
// oilCustomerCompanyAccountRecordApi.getByCustomPage(this.companyAccountRecordsDataPage).then(res => {
// console.log('获取明细')
// console.log(res.data)
// this.companyAccountRecordsDataPage = res.data
// this.showTableDrawer = true
// })
// // 获取明细
// },
indexMethod(index) {
return (index + 1) * 1
},
handleSelectionChange(val) { // 选择表格数据
this.multipleSelection = val
},
toForbid() { // 禁用
if (!this.multipleSelection || this.multipleSelection.length < 1) {
this.$message.error('请选择需要操作的数据')
return
}
},
toStartUsing() { // 启用
if (!this.multipleSelection || this.multipleSelection.length < 1) {
this.$message.error('请选择需要操作的数据')
return
}
},
handleDetail(id) {
console.log(id)
// 查看行 详情
oilCustomerCompanyAccountRecordApi.getById(id).then(res => {
this.importData = res.data
this.showTableDrawer = true
})
},
getHeight() {
// 获取浏览器高度并计算得到表格所用高度。
this.tableHeight = document.documentElement.clientHeight - 300 - 60
},
search() {
// 搜索
this.page.currentPage = 1
this.getByPage()
},
handleSizeChange(val) {
this.page.pageSize = val
this.getByPage()
},
handleCurrentChange(val) {
this.page.currentPage = val
this.getByPage()
},
sortHandler(column) {
// 排序查询
console.log(column)
const key = column.prop
const value = column.order
this.page.sorted = {}
this.page.sorted[key] = value
this.getByPage()
},
toAdd() {
// 跳转到添加
this.importData = {
id:"",
cnaps:"",
bankName:""
}
this.addDialog = true
},
toUpdate(id) {
// 跳转到更新
oilCustomerCompanyAccountApi.get(id).then(res => {
this.sysSeh = res.data
this.updateDialog = true
})
},
getByPage() {
// 分页查询
this.addDialog = false
interBank.getByPage(this.page).then(res => {
this.dataPage = res.data
console.log(this.dataPage)
this.page.totalCount = this.dataPage.totalCount
this.page.totalPage = this.dataPage.totalPage
console.log(this.dataPage,'list')
this.dataPage.list.forEach(item => {
item.roles=item.role.split(',')
});
})
// },500)
// })
},
closeDialog() {
this.importDialog = false
this.addDialog = false
this.updateDialog = false
this.typeDialog = false
}
}
}
</script>
<style scoped>
.table-detail-drawer{
width: 135%;
}
.handle-button-group {
margin-bottom: 10px;
}
.table-div {
min-height: calc(100vh - 150px);
max-height: calc(100vh - 110px);
position: relative;
margin-bottom: 20px;
}
.table-div >>> .header-container {
position: sticky;
top: 0rem;
min-height: 110px;
z-index: 4;
background: #fff;
}
.table-div .el-table__footer-wrapper {
position: fixed !important;
}
.page-div {
position: fixed;
background: #fff;
bottom: 0rem;
z-index: 4;
min-width: 100%;
}
.el-icon-check{
color:#46a6ff
}
</style>
<style>
.table-div-box .el-form-item__content .el-input{
box-shadow: none !important;
}
.table-div-box .el-form-item--medium .el-form-item__content{
width: 100%;
}
#oilSiteUser .el-badge__content {
right: 15px;
top: 5px;
}
</style>

View File

@@ -0,0 +1,265 @@
<template>
<div style="padding:30px 75px 50px;">
<div style="width:100%;position: absolute;top: 15px;left: 0;">
<div style="display: flex;
align-items: center;padding-left: 20px;">
<svg-icon
icon-class="iconsiji2"
style="font-size: 30px;margin-right: 10px;"
/>
<span>{{importData.id?'修改支行联行号信息':'添加支行联行号信息'}}</span>
</div>
<el-divider style="width:100%"></el-divider>
</div>
<el-row>
<el-form ref="form" :rules="rules" :model="importData" label-width="80px" size="mini">
<el-row :gutter="gridNum.row.gutter">
<el-col :span="24">
<el-form-item label="id" prop="id">
<el-input @blur="phonejy" disabled v-model="importData.id" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="联行号" prop="cnaps">
<el-input v-model="importData.cnaps" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="支行名称" prop="bankName">
<el-input v-model="importData.bankName" clearable/>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-row>
<div :span="24" style="margin-top:20px;text-align:right;width:100%;position: absolute;bottom: 15px;left: 0;">
<el-divider style="width:100%"></el-divider>
<el-button @click="close">取消</el-button>
<el-button
type="primary"
@click="submit"
style="margin-right:20px;"
>保存</el-button>
</div>
</div>
</template>
<script>
import interBank from '@/api/dict/interBank'
import oilCompanyInfoApi from '@/api/user/oilCompanyInfo'
// import oilDicMarkApi from '@/api/dict/oilDicMark'
import oilOmsRoleApi from '@/api/auth/oilOmsRole'
import { imgCompress } from '@/utils'
import utils from '@/utils/encode'
const JSESSIONID = utils.uuid()
export default {
props:{
importData:{
type:Object,
default:()=> {
return {
id:'',
cnaps:'',
bankName:''
}
}
}
},
data() {
// var timeNO =0
// const chekPhone = (rule, value, callback) => { // 检查手机号是否存在
// // timeNO+=1
// console.log()
// }
return {
imgCompress,
companyList: [],
roleList: [],
roleTypeList: [],
gridNum: {
row: {
gutter: 50
},
cols: {
xs: 24,
sm: 24,
md: 12,
lg: 12,
xl: 6
}
},
updateFileUrl: process.env.VUE_APP_UPLOAD_URL,
rules: {
// phone: [
// { required: true, message: '请输入手机号', trigger: 'blur' },
// { pattern: /^(13[0-9]|14[579]|15[0-3,5-9]|16[0-9]|17[0135678]|18[0-9]|19[0-9])\d{8}$/, message: '目前只支持中国大陆的手机号码' },
// // { validator: chekPhone,}
// ],
phone: [{ required: true, message: '数据不能为空', trigger: 'blur' }, { pattern: /^1[3|5|7|8|9|6]\d{9}$/, message: '请输入正确手机号', trigger: 'blur' }],
userName: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
],
companyIds: [
{ required: true, message: '请选择企业', trigger: 'change' }
],
roleIds: [
{ required: true, message: '请分配权限', trigger: 'change' }
],
// roleId: [
// { required: true, message: '请选择角色', trigger: 'change' }
// ],
},
}
},
created() {
console.log("aaaa",this.importData)
},
methods: {
phonejy(){
this.$refs.form.validateField('phone', (errMsg) => {
if (errMsg) {
console.log('校验失败')
}else{
//...
console.log('成功')
var data ={
phone :this.importData.phone
}
oilCompanyInfoApi.validatePhoneUserRolePermissions(data).then(res => {
if (res.data!==null && res.data!=='') {
this.importData.userName = res.data.userName
this.importData.companyIds = res.data.companyIds
this.importData.roleIds = res.data.roleIds
}else{
this.importData.userName = null
this.importData.companyIds = []
this.importData.roleIds = []
}
})
}
})
// if (this.importData.phone.length === 11) {
// var data ={
// phone :this.importData.phone
// }
// oilCompanyInfoApi.validatePhoneUserRolePermissions(data).then(res => {
// // if(timeNO!==0){
// // timeNO=0
// // return
// // }
// // if(timeNO===0){
// this.importData.companyIds = res.data.companyIds
// this.importData.roleIds = res.data.roleIds
// // timeNO+=1
// // console.log('666666666666')
// // }
// // if (res.data) {
// // return callback()
// // } else {
// // return callback()
// // }
// })
// }
},
systemSourceChange(system) { // 系统发送改变
console.log(system,'打印系统')
oilOmsRoleApi.getByRoleType(system).then(res => {
this.roleList = res.data
})
},
submit() {
this.$refs['form'].validate((valid) => {
if (valid) {
this.save(this.importData)
console.log(this.importData,'999999')
}
})
},
save() {
const importData = { ...this.importData }
// importData.nickName = md5(this.importData.nickName)
// 保存
console.log(this.importData,'9999')
interBank.save(importData).then(res => {
console.log(res.data,'保存数据')
this.$message.success(res.msg)
this.$emit('closeDialog')
this.$emit('getByPage')
})
},
close() {
this.$emit('closeDialog')
}
}
}
</script>
<style>
#uurll .el-upload-list__item, #uurll .el-upload--picture-card{
width: 100px !important;
height: 100px !important;
}
#uurll .el-upload--picture-card{
line-height: 110px;
}
#uurll .el-dialog{
width: 500px;
}
</style>
<style scoped>
.el-divider--horizontal{
margin: 10px 0;
}
.el-form-item__content >>> .el-date-editor.el-input{
width: 100%;
}
.clocdiv{
line-height: 20px;
display: block;
background: #aab2bc13;
border-radius: 5px;
padding: 10px;
font-size: 12px;
}
.addra{
color: #1BCE50;
}
.addra1{
color: #E60F0F;
}
.el-upload-list--picture-card >>> .el-upload-list__item{
width: 100px;
height: 100px;
}
.el-form-item__content >>> .el-upload--picture-card{
width: 100px;
height: 100px;
}
.el-divider--horizontal{
margin: 10px 0;
}
.addborder{
box-shadow: 0px 0px 3px 0px #c1c1c1;
padding: 20px 15px;
margin-bottom: 30px;
}
.remark{
margin: 0 0px 10px;
}
.remark span{
display: block;
padding-left: 50px;
font-size: 12px;
margin: 5px;
}
</style>