办结及工作台
This commit is contained in:
parent
8a96904fa7
commit
2872fe834c
@ -205,7 +205,7 @@
|
||||
<i class="f24 el-icon-wallet color-4E5969"></i>
|
||||
<div class="pl-4 f14">类案</div>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between align-items-center cursor-pointer bottom-case-btn">
|
||||
<div class="flex-row justify-content-between align-items-center cursor-pointer bottom-case-btn" @click="handleChangeCaseStatus()">
|
||||
<i class="f24 el-icon-document-checked color-4E5969"></i>
|
||||
<div class="pl-4 f14">办结</div>
|
||||
</div>
|
||||
@ -571,16 +571,31 @@ export default {
|
||||
}).then(() => {
|
||||
if(!this.$clickThrottle()) { return }//防止重复点击
|
||||
api.updateResultStatus(data).then(res => {
|
||||
this.getCaseInfoById()
|
||||
this.$message({message: '案件标记成功', type: "success",customClass:'messageZindex'})
|
||||
thiis.getCaseInfoById()
|
||||
this.$refs.layoutContent.getCaseInfoById();
|
||||
})
|
||||
|
||||
}).catch(() => {});
|
||||
},
|
||||
// 办结
|
||||
async handleChangeCaseStatus(){
|
||||
let data={
|
||||
id:this.caseId,
|
||||
caseStatus:2
|
||||
}
|
||||
this.$confirm("请确定是否将案件办结?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
if(!this.$clickThrottle()) { return }//防止重复点击
|
||||
api.updateResultStatus(data).then(res => {
|
||||
this.$message({message: '案件办结成功', type: "success",customClass:'messageZindex'})
|
||||
})
|
||||
|
||||
}).catch(() => {});
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
async callingInfo() {
|
||||
try {
|
||||
let res = await api.callingInfo({})
|
||||
|
||||
@ -6,112 +6,113 @@
|
||||
<span>你好，{{userInfo.realName || userInfo.showName ||'-'}}</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between work-main p-16">
|
||||
<div class="border-radius-4 flex-column casework1">
|
||||
<div class="flex-row justify-content-between case-title">
|
||||
<span>案件进展情况</span>
|
||||
<span>
|
||||
<el-select v-model="queryParamJZ.id"
|
||||
placeholder="请选择案件包"
|
||||
class="width100" size="mini" @change="JZChange">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.id"
|
||||
:label="item.pkgName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
<div class="flex-column ">
|
||||
<div class="border-radius-4 flex-column casework1">
|
||||
<div class="flex-row justify-content-between case-title">
|
||||
<span>案件进展情况</span>
|
||||
<span>
|
||||
<el-select v-model="queryParamJZ.id"
|
||||
placeholder="请选择案件包"
|
||||
class="width100" size="mini" @change="JZChange">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.id"
|
||||
:label="item.pkgName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
</div>
|
||||
<div class="p-16 case-progress-cont">
|
||||
<div class="case-progress">
|
||||
<span class="case-pro1">
|
||||
<p>案件总量</p>
|
||||
<p><a>{{caseprogressObj.caseTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>已办结案件</p>
|
||||
<p><a>{{caseprogressObj.finishTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro3">
|
||||
<p>未触达</p>
|
||||
<p><a>{{caseprogressObj.notReachTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro1">
|
||||
<p>调解中</p>
|
||||
<p><a>{{caseprogressObj.mediatingTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>调解成功</p>
|
||||
<p><a>{{caseprogressObj.mediateSuccess}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro3">
|
||||
<p>已签署协议</p>
|
||||
<p><a>{{caseprogressObj.signTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro1">
|
||||
<p>已司法确认</p>
|
||||
<p><a>{{caseprogressObj.judicialTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>已赋强公证</p>
|
||||
<p><a>{{caseprogressObj.notarizationTotal}}</a>件</p>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-16 case-progress-cont">
|
||||
<div class="case-progress">
|
||||
<span class="case-pro1">
|
||||
<p>案件总量</p>
|
||||
<p><a>{{caseprogressObj.caseTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>已办结案件</p>
|
||||
<p><a>{{caseprogressObj.finishTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro3">
|
||||
<p>未触达</p>
|
||||
<p><a>{{caseprogressObj.notReachTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro1">
|
||||
<p>调解中</p>
|
||||
<p><a>{{caseprogressObj.mediatingTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>调解成功</p>
|
||||
<p><a>{{caseprogressObj.mediateSuccess}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro3">
|
||||
<p>已签署协议</p>
|
||||
<p><a>{{caseprogressObj.signTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro1">
|
||||
<p>已司法确认</p>
|
||||
<p><a>{{caseprogressObj.judicialTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>已赋强公证</p>
|
||||
<p><a>{{caseprogressObj.notarizationTotal}}</a>件</p>
|
||||
</span>
|
||||
<div class="flex-column casework-1 p-16">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span class="f18 f-weight500">本人触达率</span>
|
||||
</div>
|
||||
<div class="case-pk-cont flex-row">
|
||||
<div>
|
||||
<div id="echartsReachrate" style="width: 254px; height: 264px; ">
|
||||
|
||||
</div>
|
||||
<span class="resultplan" >
|
||||
<p><a class="color-000 f22">0</a>人</p>
|
||||
<p>触达率<a class="color-000">0</a>%</p>
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex-column justify-content-center">
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">0</a><a>已触达债务人数</a></span>
|
||||
<span class="flex-column align-items-center color-86909C mt-16"><a class="color-000 f16">0</a><a>未触达债务人数</a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-radius-4 flex-column casework2">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>待办案件跟进状态</span>
|
||||
<div class="casework2">
|
||||
<div class="border-radius-4 flex-column casework2-1">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>待办案件跟进状态</span>
|
||||
</div>
|
||||
<div class="case-follow-cont flex-row ">
|
||||
<div class="donotfollowup1">
|
||||
<span class="flex-column cursor-pointer" @click="jumpUrl('/mediation-management')"><a class="f20 mb-32">今日待跟进案件</a><a class="f48">{{statisticCasesData.todayCasesToFollowUp == undefined ? 0 : statisticCasesData.todayCasesToFollowUp}}</a></span>
|
||||
</div>
|
||||
<div class="donotfollowup2">
|
||||
<span class="flex-column cursor-pointer" @click="jumpUrl('/mediation-management')"><a class="f20 mb-32">超3天未跟进案件</a><a class="f48">{{statisticCasesData.overThreeDaysUnfollowedCases == undefined ? 0 : statisticCasesData.overThreeDaysUnfollowedCases}}</a></span>
|
||||
</div>
|
||||
<div class="donotfollowup3">
|
||||
<span class="flex-column cursor-pointer" @click="jumpUrl('/mediation-management')"><a class="f20 mb-32">超5天未跟进案件</a><a class="f48">{{statisticCasesData.overFiveDaysUnfollowedCases == undefined ? 0 : statisticCasesData.overFiveDaysUnfollowedCases}}</a></span>
|
||||
</div>
|
||||
<div class="donotfollowup4">
|
||||
<span class="flex-column cursor-pointer" @click="jumpUrl('/mediation-management')"><a class="f20 mb-32">新案未跟进案件</a><a class="f48">{{statisticCasesData.newUnfollowedCases == undefined ? 0 : statisticCasesData.newUnfollowedCases}}</a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-follow-cont">
|
||||
<div class="donotfollowup1">
|
||||
<span class="flex-column cursor-pointer" @click="jumpUrl('/mediation-management')"><a class="f48">{{statisticCasesData.todayCasesToFollowUp}}</a><a class="f16">今日待跟进案件</a></span>
|
||||
<div class="border-radius-4 flex-column casework2-2 p-16">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span class="f18 f-weight500">预约回款情况</span>
|
||||
</div>
|
||||
<div class="donotfollowup2">
|
||||
<span class="flex-column cursor-pointer" @click="jumpUrl('/mediation-management')"><a class="f48">{{statisticCasesData.overThreeDaysUnfollowedCases}}</a><a class="f16">超3天未跟进案件</a></span>
|
||||
</div>
|
||||
<div class="donotfollowup3">
|
||||
<span class="flex-column cursor-pointer" @click="jumpUrl('/mediation-management')"><a class="f48">{{statisticCasesData.overFiveDaysUnfollowedCases}}</a><a class="f16">超5天未跟进案件</a></span>
|
||||
</div>
|
||||
<div class="donotfollowup4">
|
||||
<span class="flex-column cursor-pointer" @click="jumpUrl('/mediation-management')"><a class="f48">{{statisticCasesData.newUnfollowedCases}}</a><a class="f16">新案未跟进案件</a></span>
|
||||
<div class="case-pk-cont flex-column">
|
||||
<div id="echartsCaserefund" style="width: 100%; height: 285px; ">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-radius-4 flex-column casework3">
|
||||
<div class="flex-column pie-chart">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>调解成功率</span>
|
||||
<div class="flex-row">
|
||||
<span>
|
||||
<el-select v-model="queryParamCGL.id"
|
||||
placeholder="请选择案件包"
|
||||
class="width100" size="mini" @change="SuccessRateChange">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.id"
|
||||
:label="item.pkgName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-pk-cont flex-column">
|
||||
<div>
|
||||
<div id="echartsSankey" style="width: 370px; height: 270px; margin-left: 10px">
|
||||
|
||||
</div>
|
||||
<span class="resultplan" v-if="mediation_success_rate.caseTotal > 0 ">{{ (mediation_success_rate.mediateSuccess/mediation_success_rate.caseTotal).toFixed(2) }} %</span>
|
||||
<span class="resultplan" v-else>0 %</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between">
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.caseTotal}}</a><a>总案件数</a></span>
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.mediateSuccess}}</a><a>调解成功</a></span>
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.mediateFail}}</a><a>调解失败</a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-column item-trace">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>事项追踪</span>
|
||||
@ -143,6 +144,41 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-column pie-chart">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>调解成功率</span>
|
||||
<div class="flex-row">
|
||||
<span>
|
||||
<el-select v-model="queryParamCGL.id"
|
||||
placeholder="请选择案件包"
|
||||
class="width100" size="mini" @change="SuccessRateChange">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.id"
|
||||
:label="item.pkgName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-pk-cont flex-column">
|
||||
<div>
|
||||
<div id="echartsSankey" style="width: 370px; height: 215px; margin-left: 10px">
|
||||
|
||||
</div>
|
||||
<span class="resultplan" v-if="mediation_success_rate.caseTotal > 0 ">{{ (mediation_success_rate.mediateSuccess/mediation_success_rate.caseTotal).toFixed(2) }} %</span>
|
||||
<span class="resultplan" v-else>0 %</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between">
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.caseTotal}}</a><a>总案件数</a></span>
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.mediateSuccess}}</a><a>调解成功</a></span>
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.mediateFail}}</a><a>调解失败</a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -265,6 +301,8 @@
|
||||
this.getCaseapkList()
|
||||
this.getstatisticcases()
|
||||
this.getstatistic_trace()
|
||||
this.ReachrateCharts()
|
||||
this.CaserefundCharts()
|
||||
|
||||
},
|
||||
methods: {
|
||||
@ -313,49 +351,6 @@
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
|
||||
// 导入
|
||||
handleImport(){
|
||||
this.importCaseDialog={
|
||||
title:'批量导入案件',
|
||||
}
|
||||
},
|
||||
// 案件分配
|
||||
handleCaseAllocation(row){
|
||||
if((row.caseTotal - row.assignTotal) <= 0)
|
||||
{
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '该案件包没有待分配的案件！',
|
||||
type: 'warning'
|
||||
});
|
||||
return false
|
||||
}
|
||||
|
||||
|
||||
this.caseAllocationDialog={
|
||||
title:'案件分配',
|
||||
ObjectInfo:row
|
||||
}
|
||||
},
|
||||
// 单条删除
|
||||
handleDelete(row){
|
||||
this.$confirm("请确定是否删除此条数据?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
if(!this.$clickThrottle()) { return }//防止重复点击
|
||||
pkapi.CasePkgdeleteById({id:row.id}).then((res) => {
|
||||
|
||||
this.$message.success("删除成功");
|
||||
this.getCaseInfoList(1)
|
||||
|
||||
});
|
||||
}).catch(() => {});
|
||||
},
|
||||
SuccessRateChange(){
|
||||
this.drawCharts()
|
||||
},
|
||||
@ -387,7 +382,7 @@
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: ['40%', '70%'],
|
||||
radius: ['60%', '85%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
@ -413,6 +408,109 @@
|
||||
_that.myEcharts.setOption(option, true);
|
||||
|
||||
},
|
||||
|
||||
// 本人触达率
|
||||
async ReachrateCharts () {
|
||||
if (this.myEchartsReachrate) {
|
||||
this.myEchartsReachrate.clear();
|
||||
}
|
||||
this.myEchartsReachrate = this.$echarts.init(
|
||||
document.getElementById("echartsReachrate")
|
||||
);
|
||||
let _that = this;
|
||||
var option = {
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
axisPointer: {
|
||||
type: "shadow",
|
||||
},
|
||||
textStyle: {
|
||||
fontSize: 22,
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
top: "5%",
|
||||
left: "center",
|
||||
show: false, //取消显示图例
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: ['60%', '85%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
emphasis: {
|
||||
label: {
|
||||
show: false, //hover圆环中的列子
|
||||
fontSize: 40,
|
||||
fontWeight: 'bold'
|
||||
}
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{ value: 0, name: '未触达债务人数',itemStyle:{color:'#E1EDF4'} },
|
||||
{ value: 0, name: '已触达债务人数' ,itemStyle:{color:'#E4F3CE'}},
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
_that.myEchartsReachrate.setOption(option, true);
|
||||
|
||||
},
|
||||
// 预约回款情况
|
||||
async CaserefundCharts () {
|
||||
let case_rank_rate = [0,0,0,0,0,0,0]
|
||||
if (this.myEchartsCaseRefund) {
|
||||
this.myEchartsCaseRefund.clear();
|
||||
}
|
||||
this.myEchartsCaseRefund = this.$echarts.init(
|
||||
document.getElementById("echartsCaserefund")
|
||||
);
|
||||
let _that = this;
|
||||
var option = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '2%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
legend: {},
|
||||
series: [
|
||||
{
|
||||
data: [120, 200, 150, 80, 70, 110, 130],
|
||||
type: 'bar',
|
||||
name:'预约回款金额',
|
||||
color:'#FBA440'
|
||||
},
|
||||
{
|
||||
data: [120, 200, 150, 80, 70, 110, 130],
|
||||
type: 'bar',
|
||||
name:'回款金额',
|
||||
color:'#4091FB'
|
||||
}
|
||||
]
|
||||
};
|
||||
_that.myEchartsCaseRefund.setOption(option, true);
|
||||
|
||||
},
|
||||
},
|
||||
|
||||
};
|
||||
@ -439,7 +537,7 @@
|
||||
padding: 20px;
|
||||
.case-title{
|
||||
height: 60px;
|
||||
padding-top: 10px;
|
||||
// padding-top: 10px;
|
||||
font-size: 18px;
|
||||
color:#1D2129;
|
||||
font-weight: 500;
|
||||
@ -470,79 +568,123 @@
|
||||
}
|
||||
.case-pro1{width: 155px;height: 105px;}
|
||||
}
|
||||
.casework2{
|
||||
background-color: #E1EDF4;
|
||||
min-height:496px;
|
||||
margin:4px 0 0 0;
|
||||
width: calc(100% - 830px);
|
||||
padding: 18px;
|
||||
color: #4E5969;
|
||||
.casework-1{
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
|
||||
.case-pk-title{
|
||||
span:first-child{
|
||||
font-size: 18px;
|
||||
color:#1D2129;
|
||||
font-weight: 500;
|
||||
}
|
||||
.case-pk-btn{
|
||||
width: 90px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
}
|
||||
.case-follow-cont{
|
||||
.donotfollowup1{
|
||||
background:url(../../../assets/image/workbench/donotfollowup1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: calc(50% - 10px);
|
||||
height: 400px;
|
||||
padding-top: 140px;
|
||||
.case-pk-cont{
|
||||
padding: 10px 0;
|
||||
position: relative;
|
||||
.resultplan{
|
||||
color: #86909C;
|
||||
font-size: 16px;
|
||||
position: absolute;
|
||||
left: 65px;
|
||||
top: 110px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 125px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.donotfollowup2{
|
||||
background:url(../../../assets/image/workbench/donotfollowup2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: calc(50% - 10px);
|
||||
height: 400px;
|
||||
padding-top: 140px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.donotfollowup3{
|
||||
background:url(../../../assets/image/workbench/donotfollowup3.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: calc(50% - 10px);
|
||||
height: 400px;
|
||||
padding-top: 140px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.donotfollowup4{
|
||||
background:url(../../../assets/image/workbench/donotfollowup4.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: calc(50% - 10px);
|
||||
height: 400px;
|
||||
padding-top: 140px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
margin-top: 20px;
|
||||
p{padding: 0;margin: 0;}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
.casework2{
|
||||
width: calc(100% - 830px);
|
||||
.casework2-1{
|
||||
background-color: #E1EDF4;
|
||||
min-height:496px;
|
||||
margin:4px 0 0 0;
|
||||
|
||||
padding: 18px;
|
||||
color: #4E5969;
|
||||
|
||||
|
||||
.case-pk-title{
|
||||
span:first-child{
|
||||
font-size: 18px;
|
||||
color:#1D2129;
|
||||
font-weight: 500;
|
||||
}
|
||||
.case-pk-btn{
|
||||
width: 90px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
}
|
||||
.case-follow-cont{
|
||||
padding: 15px 0 30px 0;
|
||||
.donotfollowup1{
|
||||
background:url(../../../assets/image/workbench/donotfollowup1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: calc(50% - 10px);
|
||||
height: 462px;
|
||||
padding-top: 140px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.donotfollowup2{
|
||||
background:url(../../../assets/image/workbench/donotfollowup2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: calc(50% - 10px);
|
||||
height: 462px;
|
||||
padding-top: 140px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
margin-left: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.donotfollowup3{
|
||||
background:url(../../../assets/image/workbench/donotfollowup4.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: calc(50% - 10px);
|
||||
height: 462px;
|
||||
padding-top: 140px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
margin-left: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.donotfollowup4{
|
||||
background:url(../../../assets/image/workbench/donotfollowup3.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: calc(50% - 10px);
|
||||
height: 462px;
|
||||
padding-top: 140px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
margin-left: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
.casework2-2{
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
.casework3{
|
||||
min-height:496px;
|
||||
@ -550,6 +692,7 @@
|
||||
margin:4px 0 0 0;
|
||||
color: #4E5969;
|
||||
.pie-chart{
|
||||
margin-top: 18px;
|
||||
padding: 18px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
@ -563,13 +706,13 @@
|
||||
|
||||
}
|
||||
.case-pk-cont{
|
||||
padding: 20px 0;
|
||||
padding: 10px 0 10px 0;
|
||||
position: relative;
|
||||
.resultplan{
|
||||
font-size: 32px;
|
||||
position: absolute;
|
||||
left: 115px;
|
||||
top: 130px;
|
||||
top: 100px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
@ -582,7 +725,6 @@
|
||||
}
|
||||
|
||||
.item-trace{
|
||||
margin-top: 20px;
|
||||
padding: 18px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
@ -595,7 +737,7 @@
|
||||
|
||||
}
|
||||
.case-pk-cont{
|
||||
padding: 10px 0 0px 0;
|
||||
padding: 21px 0 0px 0;
|
||||
position: relative;
|
||||
.resultplan{
|
||||
font-size: 32px;
|
||||
@ -610,11 +752,11 @@
|
||||
text-align: center;
|
||||
}
|
||||
div{
|
||||
margin-top:5px;
|
||||
margin-bottom:10px;
|
||||
margin-top:10px;
|
||||
margin-bottom:15px;
|
||||
color: #4E5969;
|
||||
background-color:#F7F8FA ;
|
||||
padding: 12px;
|
||||
padding: 14px 12px;
|
||||
border-radius: 2px;
|
||||
a{
|
||||
font-weight: 600;
|
||||
|
||||
@ -6,153 +6,144 @@
|
||||
<span>你好，{{userInfo.realName || userInfo.showName ||'-'}}</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between work-main p-16">
|
||||
<div class="border-radius-4 flex-column casework1">
|
||||
<div class="flex-row justify-content-between case-title">
|
||||
<span>案件进展情况</span>
|
||||
<span>
|
||||
<el-select v-model="queryParamJZ.id"
|
||||
placeholder="请选择案件包"
|
||||
class="width100" size="mini" @change="progressChange">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.id"
|
||||
:label="item.pkgName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
</div>
|
||||
<div class="p-16 case-progress-cont">
|
||||
<div class="case-progress">
|
||||
<span class="case-pro1">
|
||||
<p>案件总量</p>
|
||||
<p><a>{{caseprogressObj.caseTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>案件待分</p>
|
||||
<p><a>{{caseprogressObj.unassignTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro3">
|
||||
<p>未触达</p>
|
||||
<p><a>{{caseprogressObj.notReachTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro1">
|
||||
<p>调解中</p>
|
||||
<p><a>{{caseprogressObj.mediatingTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>调解成功</p>
|
||||
<p><a>{{caseprogressObj.mediateSuccess}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro3">
|
||||
<p>已签署协议</p>
|
||||
<p><a>{{caseprogressObj.signTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro1">
|
||||
<p>已司法确认</p>
|
||||
<p><a>{{caseprogressObj.judicialTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>已赋强公证</p>
|
||||
<p><a>{{caseprogressObj.notarizationTotal}}</a>件</p>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-radius-4 flex-column casework2">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>待分配案件包</span>
|
||||
<div class="flex-row">
|
||||
<div class="flex-column ">
|
||||
<div class="border-radius-4 flex-column casework1">
|
||||
<div class="flex-row justify-content-between case-title">
|
||||
<span>案件进展情况</span>
|
||||
<span>
|
||||
<el-select v-model="queryParamFP.pkgName"
|
||||
clearable placeholder="请选择案件包"
|
||||
@change="handleSearch()"
|
||||
class="width100" size="mini">
|
||||
<el-select v-model="queryParamJZ.id"
|
||||
placeholder="请选择案件包"
|
||||
class="width100" size="mini" @change="progressChange">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.pkgName"
|
||||
:key="item.id"
|
||||
:label="item.pkgName"
|
||||
:value="item.pkgName">
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
<span class="case-pk-btn ml-16" @click="handleImport"><i class="el-icon-upload2"></i>批量导入</span>
|
||||
<!-- <span class="case-pk-btn"><i class="el-icon-plus"></i>添加案件</span> -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="case-pk-cont flex-column">
|
||||
<el-scrollbar :style="'height:'+`${leftContentHeight}`+'px'">
|
||||
<div v-for="(item,index) in tableData" :key="index" class="case-pk-list">
|
||||
<div class="flex-row justify-content-between mb-8">
|
||||
<span class="f20 f-weight500">{{item.pkgName}}</span>
|
||||
<span class="cursor-pointer" @click="jumpUrl(`/case-management?dataKey=casepack&pkgId=${item.id}`)">查看详情 ></span>
|
||||
</div>
|
||||
<div class="flex-row mb-16">
|
||||
<span>{{item.entrustingAgencyName}}</span>
|
||||
<span class="ml-16">委案日期：{{item.planStartTime | formaDate('yyyy-MM-dd')}}</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between case-pk-num mb-16">
|
||||
<span>
|
||||
<p><a>{{item.caseTotal}}</a>件</p>
|
||||
案件总量
|
||||
</span>
|
||||
<span>
|
||||
<p><a>{{item.assignTotal}}</a>件</p>
|
||||
已分案件数
|
||||
</span>
|
||||
<span>
|
||||
<p><a>{{item.caseTotal - item.assignTotal}}</a>件</p>
|
||||
待分案件数
|
||||
</span>
|
||||
<span>
|
||||
<p><a>{{item.months}}</a>个月</p>
|
||||
委案期限
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-end mb-8">
|
||||
<el-button size="mini" type="primary" @click="handleCaseAllocation(item)">案件分配</el-button>
|
||||
<!-- <el-button size="mini" @click="handleEdit(scope)">预设还款方案</el-button> -->
|
||||
<!-- <el-button size="mini" @click="handleDelete(item)">删除</el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-radius-4 flex-column casework3">
|
||||
<div class="flex-column pie-chart">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>调解成功率</span>
|
||||
<div class="flex-row">
|
||||
<span>
|
||||
<el-select v-model="queryParamCGL.id"
|
||||
placeholder="请选择案件包"
|
||||
class="width100" size="mini" @change="SuccessRateChange">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.id"
|
||||
:label="item.pkgName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div class="p-16 case-progress-cont">
|
||||
<div class="case-progress">
|
||||
<span class="case-pro1">
|
||||
<p>案件总量</p>
|
||||
<p><a>{{caseprogressObj.caseTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>案件待分</p>
|
||||
<p><a>{{caseprogressObj.unassignTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro3">
|
||||
<p>未触达</p>
|
||||
<p><a>{{caseprogressObj.notReachTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro1">
|
||||
<p>调解中</p>
|
||||
<p><a>{{caseprogressObj.mediatingTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>调解成功</p>
|
||||
<p><a>{{caseprogressObj.mediateSuccess}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro3">
|
||||
<p>已签署协议</p>
|
||||
<p><a>{{caseprogressObj.signTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro1">
|
||||
<p>已司法确认</p>
|
||||
<p><a>{{caseprogressObj.judicialTotal}}</a>件</p>
|
||||
</span>
|
||||
<span class="case-pro2">
|
||||
<p>已赋强公证</p>
|
||||
<p><a>{{caseprogressObj.notarizationTotal}}</a>件</p>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-column casework-1 p-16">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span class="f18 f-weight500">办案量排行榜</span>
|
||||
</div>
|
||||
<div class="case-pk-cont flex-column">
|
||||
<div>
|
||||
<div id="echartsSankey" style="width: 370px; height: 270px; margin-left: 10px">
|
||||
<div id="echartsCaserank" style="width: 370px; height: 285px; ">
|
||||
|
||||
</div>
|
||||
<span class="resultplan" v-if="mediation_success_rate.caseTotal > 0 ">{{ (mediation_success_rate.mediateSuccess/mediation_success_rate.caseTotal).toFixed(2) }} %</span>
|
||||
<span class="resultplan" v-else>0 %</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between">
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.caseTotal}}</a><a>总案件数</a></span>
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.mediateSuccess}}</a><a>调解成功</a></span>
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.mediateFail}}</a><a>调解失败</a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="casework2">
|
||||
<div class="border-radius-4 flex-column casework2-1">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>待办案件包</span>
|
||||
<div class="flex-row">
|
||||
<span>
|
||||
<el-select v-model="queryParamFP.pkgName"
|
||||
clearable placeholder="请选择案件包"
|
||||
@change="handleSearch()"
|
||||
class="width100" size="mini">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.pkgName"
|
||||
:label="item.pkgName"
|
||||
:value="item.pkgName">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
<span class="case-pk-btn ml-16" @click="handleImport"><i class="el-icon-upload2"></i>批量导入</span>
|
||||
<!-- <span class="case-pk-btn"><i class="el-icon-plus"></i>添加案件</span> -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="case-pk-cont flex-column">
|
||||
<el-scrollbar :style="'height:'+`${leftContentHeight}`+'px'">
|
||||
<div v-for="(item,index) in tableData" :key="index" class="case-pk-list">
|
||||
<div class="flex-row justify-content-between mb-8">
|
||||
<span class="f20 f-weight500">{{item.pkgName}}</span>
|
||||
<span class="cursor-pointer" @click="jumpUrl(`/case-management?dataKey=casepack&pkgName=${item.pkgName}`)">查看详情 ></span>
|
||||
</div>
|
||||
<div class="flex-row mb-16">
|
||||
<span>{{item.entrustingAgencyName}}</span>
|
||||
<span class="ml-16">委案日期：{{item.planStartTime | formaDate('yyyy-MM-dd')}}</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between case-pk-num mb-16">
|
||||
<span>
|
||||
<p><a>{{item.caseTotal}}</a>件</p>
|
||||
案件总量
|
||||
</span>
|
||||
<span>
|
||||
<p><a>{{item.assignTotal}}</a>件</p>
|
||||
已分案件数
|
||||
</span>
|
||||
<span>
|
||||
<p><a>{{item.caseTotal - item.assignTotal}}</a>件</p>
|
||||
待分案件数
|
||||
</span>
|
||||
<span>
|
||||
<p><a>{{item.months}}</a>个月</p>
|
||||
委案期限
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-end mb-8">
|
||||
<el-button size="mini" type="primary" @click="handleCaseAllocation(item)">案件分配</el-button>
|
||||
<!-- <el-button size="mini" @click="handleEdit(scope)">预设还款方案</el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-radius-4 flex-column casework2-2 p-16">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span class="f18 f-weight500">预约回款情况</span>
|
||||
</div>
|
||||
<div class="case-pk-cont flex-column">
|
||||
<div id="echartsCaserefund" style="width: 100%; height: 285px; ">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="border-radius-4 flex-column casework3">
|
||||
<div class="flex-column item-trace">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>事项追踪</span>
|
||||
@ -184,6 +175,39 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-column pie-chart">
|
||||
<div class="flex-row justify-content-between case-pk-title">
|
||||
<span>调解成功率</span>
|
||||
<div class="flex-row">
|
||||
<span>
|
||||
<el-select v-model="queryParamCGL.id"
|
||||
placeholder="请选择案件包"
|
||||
class="width100" size="mini" @change="SuccessRateChange">
|
||||
<el-option
|
||||
v-for="item in casePkOptions"
|
||||
:key="item.id"
|
||||
:label="item.pkgName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-pk-cont flex-column">
|
||||
<div>
|
||||
<div id="echartsSankey" style="width: 370px; height: 216px; margin-left: 10px">
|
||||
|
||||
</div>
|
||||
<span class="resultplan" v-if="mediation_success_rate.caseTotal > 0 ">{{ (mediation_success_rate.mediateSuccess/mediation_success_rate.caseTotal).toFixed(2) }} %</span>
|
||||
<span class="resultplan" v-else>0 %</span>
|
||||
</div>
|
||||
<div class="flex-row justify-content-between">
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.caseTotal}}</a><a>总案件数</a></span>
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.mediateSuccess}}</a><a>调解成功</a></span>
|
||||
<span class="flex-column align-items-center color-86909C"><a class="color-000 f16">{{mediation_success_rate.mediateFail}}</a><a>调解失败</a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -204,7 +228,7 @@
|
||||
import api from "@/services/caseManagement";
|
||||
import workApi from "@/services/workbenchApi";
|
||||
import pkapi from "@/services/casePackageManagement";
|
||||
import { color } from "echarts";
|
||||
import { color } from "echarts";
|
||||
export default {
|
||||
components: {
|
||||
importPackageDialog: () => import('../case-package/components/importPackageDialog'),//导入
|
||||
@ -288,9 +312,9 @@ import { color } from "echarts";
|
||||
},
|
||||
// 获取抽屉drawer的内容高度
|
||||
leftContentHeight(){
|
||||
let oh = document.documentElement.clientHeight;
|
||||
if(oh > 971){oh = 971}
|
||||
return oh-256
|
||||
// let oh = document.documentElement.clientHeight;
|
||||
// if(oh > 971){oh = 971}
|
||||
return 510
|
||||
|
||||
}
|
||||
},
|
||||
@ -315,6 +339,8 @@ import { color } from "echarts";
|
||||
this.getCaseInfoList()
|
||||
this.getstatisticcases()
|
||||
this.getstatistic_trace()
|
||||
this.CaseloadrankCharts()
|
||||
this.CaserefundCharts()
|
||||
},
|
||||
methods: {
|
||||
jumpUrl (url) {
|
||||
@ -402,22 +428,6 @@ import { color } from "echarts";
|
||||
ObjectInfo:row
|
||||
}
|
||||
},
|
||||
// 单条删除
|
||||
handleDelete(row){
|
||||
this.$confirm("请确定是否删除此条数据?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(() => {
|
||||
if(!this.$clickThrottle()) { return }//防止重复点击
|
||||
pkapi.CasePkgdeleteById({id:row.id}).then((res) => {
|
||||
|
||||
this.$message.success("删除成功");
|
||||
this.getCaseInfoList(1)
|
||||
|
||||
});
|
||||
}).catch(() => {});
|
||||
},
|
||||
SuccessRateChange(){
|
||||
this.drawCharts()
|
||||
},
|
||||
@ -449,7 +459,7 @@ import { color } from "echarts";
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: ['40%', '70%'],
|
||||
radius: ['60%', '85%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
@ -475,6 +485,112 @@ import { color } from "echarts";
|
||||
_that.myEcharts.setOption(option, true);
|
||||
|
||||
},
|
||||
// 办案量排行榜
|
||||
async CaseloadrankCharts () {
|
||||
let operateMethodOptions=[]
|
||||
await api.getCurrGroupUserList().then(res => {
|
||||
if (!res.code) {
|
||||
res.forEach(element => {
|
||||
operateMethodOptions.push(element.realName)
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
let case_rank_rate = [0,0,0,0,0,0,0]
|
||||
if (this.myEchartsCaseRank) {
|
||||
this.myEchartsCaseRank.clear();
|
||||
}
|
||||
this.myEchartsCaseRank = this.$echarts.init(
|
||||
document.getElementById("echartsCaserank")
|
||||
);
|
||||
let _that = this;
|
||||
var option = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
show: false, //取消显示图例
|
||||
},
|
||||
grid: {
|
||||
top:'5%',
|
||||
left: '1%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'value',
|
||||
boundaryGap: [0, 1]
|
||||
},
|
||||
yAxis: {
|
||||
type: 'category',
|
||||
data: operateMethodOptions,
|
||||
},
|
||||
series: [
|
||||
{
|
||||
itemStyle: {
|
||||
color: '#FBA440'
|
||||
},
|
||||
type: 'bar',
|
||||
data: case_rank_rate
|
||||
}
|
||||
]
|
||||
};
|
||||
_that.myEchartsCaseRank.setOption(option, true);
|
||||
|
||||
},
|
||||
// 预约回款情况
|
||||
async CaserefundCharts () {
|
||||
let case_rank_rate = [0,0,0,0,0,0,0]
|
||||
if (this.myEchartsCaseRefund) {
|
||||
this.myEchartsCaseRefund.clear();
|
||||
}
|
||||
this.myEchartsCaseRefund = this.$echarts.init(
|
||||
document.getElementById("echartsCaserefund")
|
||||
);
|
||||
let _that = this;
|
||||
var option = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '2%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
legend: {},
|
||||
series: [
|
||||
{
|
||||
data: [120, 200, 150, 80, 70, 110, 130],
|
||||
type: 'bar',
|
||||
name:'预约回款金额',
|
||||
color:'#FBA440'
|
||||
},
|
||||
{
|
||||
data: [120, 200, 150, 80, 70, 110, 130],
|
||||
type: 'bar',
|
||||
name:'回款金额',
|
||||
color:'#4091FB'
|
||||
}
|
||||
]
|
||||
};
|
||||
_that.myEchartsCaseRefund.setOption(option, true);
|
||||
|
||||
},
|
||||
},
|
||||
|
||||
};
|
||||
@ -497,11 +613,10 @@ import { color } from "echarts";
|
||||
background:url(../../assets/image/workbench/work-left-bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
// min-height:496px;
|
||||
width: 400px;
|
||||
width: 412px;
|
||||
padding: 20px;
|
||||
.case-title{
|
||||
height: 60px;
|
||||
padding-top: 10px;
|
||||
height: 50px;
|
||||
font-size: 18px;
|
||||
color:#1D2129;
|
||||
font-weight: 500;
|
||||
@ -532,59 +647,72 @@ import { color } from "echarts";
|
||||
}
|
||||
.case-pro1{width: 155px;height: 105px;}
|
||||
}
|
||||
.casework-1{
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.casework2{
|
||||
background-color: #E1EDF4;
|
||||
min-height:496px;
|
||||
margin:4px 0 0 0;
|
||||
width: calc(100% - 830px);
|
||||
padding: 18px;
|
||||
color: #4E5969;
|
||||
.case-pk-title{
|
||||
span:first-child{
|
||||
font-size: 18px;
|
||||
color:#1D2129;
|
||||
font-weight: 500;
|
||||
}
|
||||
.case-pk-btn{
|
||||
width: 90px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
width: calc(100% - 850px);
|
||||
.casework2-1{
|
||||
background-color: #E1EDF4;
|
||||
height:578px;
|
||||
margin:4px 0 0 0;
|
||||
|
||||
}
|
||||
}
|
||||
.case-pk-cont{
|
||||
.case-pk-list{
|
||||
background-color: #fff;
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
margin-top: 20px;
|
||||
.case-pk-num{
|
||||
background-color: #F7F8FA;
|
||||
height:85px ;
|
||||
padding-top: 20px;
|
||||
span{
|
||||
padding: 18px;
|
||||
color: #4E5969;
|
||||
.case-pk-title{
|
||||
span:first-child{
|
||||
font-size: 18px;
|
||||
color:#1D2129;
|
||||
font-weight: 500;
|
||||
}
|
||||
.case-pk-btn{
|
||||
width: 90px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
border-right: solid 2px #e5e6e8;
|
||||
height: 45px;
|
||||
p{margin: 0;
|
||||
a{
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
span:last-child{border-right: 0;}
|
||||
}
|
||||
}
|
||||
.case-pk-cont{
|
||||
.case-pk-list{
|
||||
background-color: #fff;
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
margin-top: 20px;
|
||||
.case-pk-num{
|
||||
background-color: #F7F8FA;
|
||||
height:85px ;
|
||||
padding-top: 20px;
|
||||
span{
|
||||
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
border-right: solid 2px #e5e6e8;
|
||||
height: 45px;
|
||||
p{margin: 0;
|
||||
a{
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
span:last-child{border-right: 0;}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.casework2-2{
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
.casework3{
|
||||
min-height:496px;
|
||||
@ -592,6 +720,7 @@ import { color } from "echarts";
|
||||
margin:4px 0 0 0;
|
||||
color: #4E5969;
|
||||
.pie-chart{
|
||||
margin-top: 18px;
|
||||
padding: 18px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
@ -605,13 +734,13 @@ import { color } from "echarts";
|
||||
|
||||
}
|
||||
.case-pk-cont{
|
||||
padding: 20px 0;
|
||||
padding: 10px 0 10px 0;
|
||||
position: relative;
|
||||
.resultplan{
|
||||
font-size: 32px;
|
||||
position: absolute;
|
||||
left: 115px;
|
||||
top: 130px;
|
||||
top: 100px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
@ -624,7 +753,6 @@ import { color } from "echarts";
|
||||
}
|
||||
|
||||
.item-trace{
|
||||
margin-top: 20px;
|
||||
padding: 18px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
@ -652,11 +780,11 @@ import { color } from "echarts";
|
||||
text-align: center;
|
||||
}
|
||||
div{
|
||||
margin-top:5px;
|
||||
margin-bottom:10px;
|
||||
margin-top:10px;
|
||||
margin-bottom:15px;
|
||||
color: #4E5969;
|
||||
background-color:#F7F8FA ;
|
||||
padding: 12px;
|
||||
padding: 14px 12px;
|
||||
border-radius: 2px;
|
||||
a{
|
||||
font-weight: 600;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user