|
|
|
@ -0,0 +1,320 @@
|
|
|
|
|
|
|
|
<!-- 每日数据：拆分准确、未拆分、少拆分、多拆分、逾期、拒付-->
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
|
|
|
<div id="contain_jm" style="width:100%;height: 400px;position: inherit">
|
|
|
|
|
|
|
|
<div style="max-height: 85%;width: 100%">
|
|
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
|
|
:data="tableData"
|
|
|
|
|
|
|
|
v-loading="isLoading"
|
|
|
|
|
|
|
|
highlight-current-row=true,
|
|
|
|
|
|
|
|
show-summary="true"
|
|
|
|
|
|
|
|
style="width: 100%;height: 380px">
|
|
|
|
|
|
|
|
<el-table-column prop="CLASSDATE" label="日期" resizable align="center" :formatter="dateFormatter" fixed="left" width="140" />
|
|
|
|
|
|
|
|
<el-table-column label="免费应收/拆分" width="300" resizable align="center" fixed="left">
|
|
|
|
|
|
|
|
<el-table-column prop="JTYSMONEY" label="应收(元)" resizable align="center" width="130" />
|
|
|
|
|
|
|
|
<el-table-column prop="JTCFMONEY"label="拆分(元)" resizable align="center"width="130" />
|
|
|
|
|
|
|
|
<el-table-column prop="JTYSFLOW" label="流量(辆)" resizable align="center" width="130" />
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="逾期" width="200" resizable align="center" fixed="left">
|
|
|
|
|
|
|
|
<el-table-column prop="YQMONEY" label="金额(元)" resizable align="center" width="130" />
|
|
|
|
|
|
|
|
<el-table-column prop="YQFLOW" label="流量(辆)" resizable align="center" width="100" />
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="拒付" width="200" resizable align="center" fixed="left">
|
|
|
|
|
|
|
|
<el-table-column prop="JFMONEY" label="金额(元)" resizable align="center" width="130" />
|
|
|
|
|
|
|
|
<el-table-column prop="JFFLOW" label="流量(辆)" resizable align="center" width="100" />
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="未拆分" width="200" resizable align="center" fixed="left">
|
|
|
|
|
|
|
|
<el-table-column prop="NODIVMONEY" label="金额(元)" resizable align="center" width="130"/>
|
|
|
|
|
|
|
|
<el-table-column prop="NODIVFLOW" label="流量(辆)" resizable align="center" width="100" />
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="拆分准确" width="200" resizable align="center">
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="RIGHTMONEY"
|
|
|
|
|
|
|
|
label="金额(元)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="130">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="RIGHTFLOW"
|
|
|
|
|
|
|
|
label="流量(辆)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="100">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="未计费" width="200" resizable align="center">
|
|
|
|
|
|
|
|
<el-table-column prop="NOFEEMONEY" label="金额(元)" resizable align="center" width="130"/>
|
|
|
|
|
|
|
|
<el-table-column prop="NOFEEFLOW" label="流量(辆)" resizable align="center" width="100"/>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="少拆分" width="200" resizable align="center">
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="LESSDIVMONEYGPA"
|
|
|
|
|
|
|
|
label="计费金额(元)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="130">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="LESSDIVMONEYDIV"
|
|
|
|
|
|
|
|
label="拆分金额(元)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="130">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="LESSDIVMONEY"
|
|
|
|
|
|
|
|
label="金额(元)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="130">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="LESSDIVFLOW"
|
|
|
|
|
|
|
|
label="流量(辆)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="100">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="多拆分" width="200" resizable align="center">
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="MOREDIVMONEYGPA"
|
|
|
|
|
|
|
|
label="计费金额(元)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="130">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="MOREDIVMONEYDIV"
|
|
|
|
|
|
|
|
label="拆分金额(元)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="130">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="MOREDIVMONEY"
|
|
|
|
|
|
|
|
label="金额(元)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="130">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
|
|
|
prop="MOREDIVFLOW"
|
|
|
|
|
|
|
|
label="流量(辆)"
|
|
|
|
|
|
|
|
resizable align="center"
|
|
|
|
|
|
|
|
width="100">
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="操作" width="280" resizable align="center" fixed="right">
|
|
|
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
|
|
|
<el-button type="primary" round size="small" style="background-color: #1da1f2" @click="getSubTableData(scope.row)">分公司</el-button>
|
|
|
|
|
|
|
|
<el-button type="primary" round size="small" style="background-color: #5db479" @click="getRoadTableData(scope.row)">路段</el-button>
|
|
|
|
|
|
|
|
<el-button type="primary" round size="small" style="background-color: #5a5b85" @click="getVehTypeTableData(scope.row)">车型</el-button>
|
|
|
|
|
|
|
|
<el-button type="primary" round size="small" style="background-color: #c48ed9" @click="getTableData(scope.row)">明细</el-button>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<!-- <div style="height: 80px;width: 100%">
|
|
|
|
|
|
|
|
<el-pagination
|
|
|
|
|
|
|
|
@size-change="handleSizeChange"
|
|
|
|
|
|
|
|
@current-change="handleCurrentChange"
|
|
|
|
|
|
|
|
:current-page="currentPage"
|
|
|
|
|
|
|
|
:page-sizes="[15, 30,50,100]"
|
|
|
|
|
|
|
|
:page-size="pageSize"
|
|
|
|
|
|
|
|
:total="totalCount"
|
|
|
|
|
|
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
|
|
|
|
|
|
style="width: 90%;height:50px;padding: 0;position:relative;margin-top:10px;bottom: 0;font-size: x-small">
|
|
|
|
|
|
|
|
</el-pagination>
|
|
|
|
|
|
|
|
</div>-->
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- <el-dialog id="detail_dialog" v-model="isShowDivDetail" title="" draggable >
|
|
|
|
|
|
|
|
<detailTab ref="detailTab" :key="new Date().getTime()" :beginDate="querybeginDate" :dataType="dataType" ></detailTab>
|
|
|
|
|
|
|
|
</el-dialog>-->
|
|
|
|
|
|
|
|
<el-dialog id="detail_dialog" v-model="isShowSubComDetail" title="分公司信息" draggable >
|
|
|
|
|
|
|
|
<detailDataSubCom ref="detailDataSubCom" :key="updateSubCom" :beginDate="querybeginDate" :dataType="dataType" ></detailDataSubCom>
|
|
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
<el-dialog id="detail_dialog" v-model="isShowDetailRoad" title="路段信息" draggable >
|
|
|
|
|
|
|
|
<detailDataRoad ref="detailDataRoad" :key="updateRoad" :beginDate="querybeginDate" :dataType="dataType" ></detailDataRoad>
|
|
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
<el-dialog id="detail_dialog" v-model="isShowDetailVehType" title="车型信息" draggable >
|
|
|
|
|
|
|
|
<detailDataVehType ref="detailDataVehType" :key="updateVehType" :beginDate="querybeginDate" :dataType="dataType" ></detailDataVehType>
|
|
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
<el-dialog id="detail_dialog" v-model="isShowDetail" title="明细" draggable >
|
|
|
|
|
|
|
|
<stanDataDialog ref="stanDataDialog" :key="updateDetail" :classDate="querybeginDate" :dataType="dataType" :detailType="detailType"></stanDataDialog>
|
|
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
|
|
|
body{
|
|
|
|
|
|
|
|
width: 100% !important;
|
|
|
|
|
|
|
|
height: 100% !important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
#contain_jm{
|
|
|
|
|
|
|
|
height: 100% ;
|
|
|
|
|
|
|
|
width:100% ;
|
|
|
|
|
|
|
|
margin: 0px;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
#detail_dialog{
|
|
|
|
|
|
|
|
height:90% !important;
|
|
|
|
|
|
|
|
width: 90% !important;
|
|
|
|
|
|
|
|
margin-top: 2% !important;
|
|
|
|
|
|
|
|
margin-left: 5% !important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
<script >
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
import {Filter,Search} from '@element-plus/icons-vue'
|
|
|
|
|
|
|
|
import {getDivPassidAllJTDataList} from "@/util/api/api.js"
|
|
|
|
|
|
|
|
import detailTab from "@/views/dev/detail/detailTab.vue";
|
|
|
|
|
|
|
|
import detailDataSubCom from '@/views/dev/detail/detailDataSubCom.vue'
|
|
|
|
|
|
|
|
import detailDataRoad from '@/views/dev/detail/detailDataRoad.vue'
|
|
|
|
|
|
|
|
import detailDataVehType from '@/views/dev/detail/detailDataVehType.vue'
|
|
|
|
|
|
|
|
import stanDataDialog from '@/views/dev/detail/stanDataDialog.vue'
|
|
|
|
|
|
|
|
var _this;
|
|
|
|
|
|
|
|
export default{
|
|
|
|
|
|
|
|
data(){
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
|
|
|
tableData:[],
|
|
|
|
|
|
|
|
currentPage: 1,
|
|
|
|
|
|
|
|
pageSize: 20,
|
|
|
|
|
|
|
|
querybeginDate:'',
|
|
|
|
|
|
|
|
totalCount:500,
|
|
|
|
|
|
|
|
isLoading:false,
|
|
|
|
|
|
|
|
isShowSubComDetail:false,
|
|
|
|
|
|
|
|
isShowDetailRoad:false,
|
|
|
|
|
|
|
|
isShowDetailVehType:false,
|
|
|
|
|
|
|
|
isShowDetail:false,
|
|
|
|
|
|
|
|
updateSubCom:0,
|
|
|
|
|
|
|
|
updateRoad:0,
|
|
|
|
|
|
|
|
updateVehType:0,
|
|
|
|
|
|
|
|
detailType:'mainType',
|
|
|
|
|
|
|
|
updateDetail:0,
|
|
|
|
|
|
|
|
toolTip:true,
|
|
|
|
|
|
|
|
dataType:'MF',
|
|
|
|
|
|
|
|
beginDate:"",
|
|
|
|
|
|
|
|
endDate:"",
|
|
|
|
|
|
|
|
inject: ['tableVariable','tableUpdateVariable']
|
|
|
|
|
|
|
|
}},
|
|
|
|
|
|
|
|
methods:{
|
|
|
|
|
|
|
|
refreshData(beginDate,endDate){
|
|
|
|
|
|
|
|
console.log("刷新减免数据");
|
|
|
|
|
|
|
|
this.beginDate=beginDate ;
|
|
|
|
|
|
|
|
this.endDate=endDate ;
|
|
|
|
|
|
|
|
getTableData(beginDate,endDate,this.dataType);
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
handleSizeChange(val) {
|
|
|
|
|
|
|
|
this.pageSize = val;
|
|
|
|
|
|
|
|
this.isLoding=true;
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
handleCurrentChange(val) {
|
|
|
|
|
|
|
|
this.currentPage = val;
|
|
|
|
|
|
|
|
this.isLoading=true;
|
|
|
|
|
|
|
|
}, dateFormatter(row, column, cellValue){
|
|
|
|
|
|
|
|
if(cellValue==null || cellValue=="" || cellValue==undefined){
|
|
|
|
|
|
|
|
return "";
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const date = new Date(cellValue);
|
|
|
|
|
|
|
|
// 格式化日期，并返回字符串
|
|
|
|
|
|
|
|
//return `${date.toLocaleDateString()}`;
|
|
|
|
|
|
|
|
return formatDate(cellValue,"YYYY-MM-DD");
|
|
|
|
|
|
|
|
},getSubTableData(row){
|
|
|
|
|
|
|
|
this.querybeginDate=formatDate(row.CLASSDATE,"YYYY-MM-DD");
|
|
|
|
|
|
|
|
this.isShowSubComDetail=true;
|
|
|
|
|
|
|
|
this.isShowDetailRoad=false;
|
|
|
|
|
|
|
|
this.isShowDetailVehType=false;
|
|
|
|
|
|
|
|
this.isShowDetail=false;
|
|
|
|
|
|
|
|
this.updateSubCom= this.updateSubCom+1
|
|
|
|
|
|
|
|
},getRoadTableData(row){
|
|
|
|
|
|
|
|
this.querybeginDate=formatDate(row.CLASSDATE,"YYYY-MM-DD");
|
|
|
|
|
|
|
|
this.isShowSubComDetail=false;
|
|
|
|
|
|
|
|
this.isShowDetailRoad=true;
|
|
|
|
|
|
|
|
this.isShowDetailVehType=false;
|
|
|
|
|
|
|
|
this.isShowDetail=false;
|
|
|
|
|
|
|
|
this.updateRoad= this.updateRoad+1;
|
|
|
|
|
|
|
|
},getVehTypeTableData(row){
|
|
|
|
|
|
|
|
this.querybeginDate=formatDate(row.CLASSDATE,"YYYY-MM-DD");
|
|
|
|
|
|
|
|
this.isShowSubComDetail=false;
|
|
|
|
|
|
|
|
this.isShowDetailRoad=false;
|
|
|
|
|
|
|
|
this.isShowDetailVehType=true;
|
|
|
|
|
|
|
|
this.isShowDetail=false;
|
|
|
|
|
|
|
|
this.updateVehType= this.updateVehType+1;
|
|
|
|
|
|
|
|
},getTableData(row){
|
|
|
|
|
|
|
|
this.querybeginDate=formatDate(row.CLASSDATE,"YYYY-MM-DD");
|
|
|
|
|
|
|
|
this.isShowSubComDetail=false;
|
|
|
|
|
|
|
|
this.isShowDetailRoad=false;
|
|
|
|
|
|
|
|
this.isShowDetailVehType=false;
|
|
|
|
|
|
|
|
this.isShowDetail=true;
|
|
|
|
|
|
|
|
this.updateDetail= this.updateDetail+1;
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
},components:{
|
|
|
|
|
|
|
|
detailTab,
|
|
|
|
|
|
|
|
detailDataSubCom,
|
|
|
|
|
|
|
|
detailDataRoad,
|
|
|
|
|
|
|
|
detailDataVehType,
|
|
|
|
|
|
|
|
stanDataDialog,
|
|
|
|
|
|
|
|
Search
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
mounted(){
|
|
|
|
|
|
|
|
_this=this;
|
|
|
|
|
|
|
|
/* this.tableData=[{"classDate":"2024-10-31","rightMoney":"100000","rightFlow":"203010","noDivMoney":"10000","noDivFlow":"10000","lessDivMoney":"1000","lessDivFlow":"30","moreDivMoney":"10000","moreDivFlow":"50","YQMoney":"1001.21","YQFlow":"20","JFMoney":"1568","JFFlow":"23"},
|
|
|
|
|
|
|
|
{"classDate":"2024-10-30","rightMoney":"195000","rightFlow":"253010","noDivMoney":"55000","noDivFlow":"25102","lessDivMoney":"15230","lessDivFlow":"2510","moreDivMoney":"5201","moreDivFlow":"500","YQMoney":"1895","YQFlow":"28","JFMoney":"4500","JFFlow":"39"}
|
|
|
|
|
|
|
|
]*/
|
|
|
|
|
|
|
|
/* this.$nextTick(
|
|
|
|
|
|
|
|
getTableData(this.beginDate,this.endDate,this.dataType)
|
|
|
|
|
|
|
|
)*/
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function getTableData(beginDate,endDate,dataType){
|
|
|
|
|
|
|
|
_this.isLoading=true;
|
|
|
|
|
|
|
|
var paramsObj={
|
|
|
|
|
|
|
|
"beginDate":beginDate,
|
|
|
|
|
|
|
|
"endDate":endDate,
|
|
|
|
|
|
|
|
"dataType":dataType
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
getDivPassidAllJTDataList(paramsObj).then(
|
|
|
|
|
|
|
|
res=>{
|
|
|
|
|
|
|
|
if (res.code > 0) {
|
|
|
|
|
|
|
|
let _data = res.data;
|
|
|
|
|
|
|
|
if (_data.length > 0) {
|
|
|
|
|
|
|
|
_this.tableData = _data;
|
|
|
|
|
|
|
|
// const updateVariable = inject('tableUpdateVariable');
|
|
|
|
|
|
|
|
//_this.$updateGlobalVar(_data);
|
|
|
|
|
|
|
|
//const { globalVar, setGlobalVar } = toRefs(globalSymbol);
|
|
|
|
|
|
|
|
//updateVariable(_data);
|
|
|
|
|
|
|
|
// console.log("全局变量======="+ _this.$globalState.globalVar)
|
|
|
|
|
|
|
|
// console.log( _this.$globalState.globalVar)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
_this.isLoading=false;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function formatDate(dateString,format) {
|
|
|
|
|
|
|
|
const date = new Date(dateString);
|
|
|
|
|
|
|
|
const year = date.getFullYear();
|
|
|
|
|
|
|
|
const month = (date.getMonth() + 1).toString().padStart(2, '0');
|
|
|
|
|
|
|
|
const day = date.getDate().toString().padStart(2, '0');
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
let hour=date.getHours();
|
|
|
|
|
|
|
|
let minute=date.getMinutes();
|
|
|
|
|
|
|
|
let second=date.getSeconds();
|
|
|
|
|
|
|
|
if(hour<10){
|
|
|
|
|
|
|
|
hour ="0"+hour;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if(minute<10){
|
|
|
|
|
|
|
|
minute ="0"+minute;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if(second<10){
|
|
|
|
|
|
|
|
second ="0"+second;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const milSecond=date.getMilliseconds();
|
|
|
|
|
|
|
|
if(format=="YYYY-MM-DD"){
|
|
|
|
|
|
|
|
return `${year}-${month}-${day}`;
|
|
|
|
|
|
|
|
}else if(format=="YYYY-MM-DD HH:MM:SS"){
|
|
|
|
|
|
|
|
return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
|
|
|
|
|
|
|
|
}else if(format=="YYYY-MM-DD HH:MM:SS:SSS"){
|
|
|
|
|
|
|
|
return `${year}-${month}-${day} ${hour}:${minute}:${second}:${milSecond}`;
|
|
|
|
|
|
|
|
}else if(format=="HH:MM:SS"){
|
|
|
|
|
|
|
|
return `${hour}:${minute}:${second}:${milSecond}`;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
return "";
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</script>
|
