|
|
|
@ -4,111 +4,52 @@
|
|
|
|
|
<!-- <h2>单据上传统计</h2>-->
|
|
|
|
|
<!-- <el-divider/>-->
|
|
|
|
|
<el-card>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-form v-if="queryList && queryList.length > 0" :model="filterQuery" class="query-form"
|
|
|
|
|
size="mini" label-width="100px"
|
|
|
|
|
>
|
|
|
|
|
<el-row style=" display:flex; flex-wrap: wrap; ">
|
|
|
|
|
<template v-for="(item, index) in queryList">
|
|
|
|
|
<div v-if="showSearch || item.isImport">
|
|
|
|
|
<el-form-item v-if="item.columnType == 'input' && executeEval(row,item.expression,true)"
|
|
|
|
|
class="query-form-item"
|
|
|
|
|
:label="item.columnDesc+`:`" :key="item.id"
|
|
|
|
|
>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="filterQuery[item.columnName]"
|
|
|
|
|
:placeholder="item.columnDesc == '模糊查询' ? '单据号/来源系统/收货方/发货方' : item.columnDesc"
|
|
|
|
|
:disabled="executeEval(null,item.disabledFuc,false)"
|
|
|
|
|
@keyup.enter.native="executeFuc($event,'5',item.clickFuc)"
|
|
|
|
|
clearable
|
|
|
|
|
></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item v-if="item.columnType == 'select' && executeEval(row,item.expression,true)"
|
|
|
|
|
class="query-form-item"
|
|
|
|
|
:label="item.columnDesc+`:`"
|
|
|
|
|
>
|
|
|
|
|
<el-select v-model="filterQuery[item.columnName]"
|
|
|
|
|
:placeholder="item.columnDesc"
|
|
|
|
|
:disabled="executeEval(null,item.disabledFuc,false)"
|
|
|
|
|
clearable
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="dict in item.lableRuleObj"
|
|
|
|
|
:key="dict.value"
|
|
|
|
|
:label="dict.label"
|
|
|
|
|
:value="dict.value"
|
|
|
|
|
/>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item v-if="item.columnType == 'selectServer' && executeEval(row,item.expression,true)"
|
|
|
|
|
class="query-form-item"
|
|
|
|
|
:label="item.columnDesc+`:`"
|
|
|
|
|
>
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="filterQuery[item.columnName]"
|
|
|
|
|
:placeholder="item.columnDesc"
|
|
|
|
|
@change="executeFuc($event,'5',item.checkRules)"
|
|
|
|
|
:disabled="executeEval(null,item.disabledFuc,false)"
|
|
|
|
|
filterable
|
|
|
|
|
remote
|
|
|
|
|
:remote-method="(query) => executeFuc(query,'5',item.clickFuc)"
|
|
|
|
|
clearable
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in options[item.clickFuc]"
|
|
|
|
|
:key="item.code"
|
|
|
|
|
:label="item.label"
|
|
|
|
|
:value="item.code"
|
|
|
|
|
/>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item v-if="item.columnType == 'datePicker' && executeEval(row,item.expression,true)"
|
|
|
|
|
class="query-form-item"
|
|
|
|
|
:label="item.columnDesc+`:`"
|
|
|
|
|
<el-row >
|
|
|
|
|
<el-col :span="8">
|
|
|
|
|
<el-form-item label="时间统计:">
|
|
|
|
|
<el-date-picker
|
|
|
|
|
|
|
|
|
|
:picker-options="pickerOptions"
|
|
|
|
|
v-model="actDateRange"
|
|
|
|
|
type="daterange"
|
|
|
|
|
format="yyyy 年 MM 月 dd 日"
|
|
|
|
|
style="width: 90%"
|
|
|
|
|
value-format="yyyy-MM-dd"
|
|
|
|
|
range-separator="至"
|
|
|
|
|
start-placeholder="开始日期"
|
|
|
|
|
end-placeholder="结束日期"
|
|
|
|
|
>
|
|
|
|
|
<el-date-picker
|
|
|
|
|
:picker-options="pickerOptions"
|
|
|
|
|
v-model="actDateRange"
|
|
|
|
|
type="daterange"
|
|
|
|
|
format="yyyy 年 MM 月 dd 日"
|
|
|
|
|
value-format="yyyy-MM-dd"
|
|
|
|
|
range-separator="至"
|
|
|
|
|
start-placeholder="开始日期"
|
|
|
|
|
end-placeholder="结束日期"
|
|
|
|
|
></el-date-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item v-if="item.columnType == 'date' && executeEval(row,item.expression,true)"
|
|
|
|
|
class="query-form-item"
|
|
|
|
|
:label="item.columnDesc+`:`"
|
|
|
|
|
</el-date-picker>
|
|
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-form-item >
|
|
|
|
|
|
|
|
|
|
<el-button-group>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-refresh"
|
|
|
|
|
@click="onReset"
|
|
|
|
|
>重置
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button type="primary" icon="el-icon-search" @click="onSubmit(this)"
|
|
|
|
|
>查询
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-date-picker
|
|
|
|
|
v-model="filterQuery[item.columnName]"
|
|
|
|
|
:style="`width:${item.width+'px'}`"
|
|
|
|
|
value-format="yyyy-MM-dd"
|
|
|
|
|
:disabled="executeEval(null,item.disabledFuc,false)"
|
|
|
|
|
type="date"
|
|
|
|
|
:placeholder="item.columnDesc"
|
|
|
|
|
></el-date-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-button-group>
|
|
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-row>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div class="top-right-btn">
|
|
|
|
|
<el-button-group>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-refresh"
|
|
|
|
|
@click="onReset"
|
|
|
|
|
>重置
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button type="primary" icon="el-icon-search" @click="onSubmit(this)"
|
|
|
|
|
>查询
|
|
|
|
|
</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-button-group>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</el-card>
|
|
|
|
|
<div class="mt10 grid-container grid-container3" style="height: 15%">
|
|
|
|
|
<div class="mt10 grid-container grid-container3" style="height: 20%">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-card class="grid-item" body-style="padding:0px;height:100%" >
|
|
|
|
@ -178,6 +119,57 @@
|
|
|
|
|
</el-row>
|
|
|
|
|
</el-card>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mt10 grid-container grid-container3" style="height: 500px">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-card class="grid-item" body-style="padding:0px;height:100%" >
|
|
|
|
|
|
|
|
|
|
<el-row >
|
|
|
|
|
<div style="width: 100%; height: 100%;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;">
|
|
|
|
|
|
|
|
|
|
<!-- <ItemWrap-->
|
|
|
|
|
<!-- title="医保上传统计">-->
|
|
|
|
|
<Echart
|
|
|
|
|
:options="statsChart1"
|
|
|
|
|
></Echart>
|
|
|
|
|
<!-- </ItemWrap>-->
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</el-row>
|
|
|
|
|
</el-card>
|
|
|
|
|
|
|
|
|
|
<el-card class="grid-item" body-style="padding:0px;height:100%" >
|
|
|
|
|
|
|
|
|
|
<el-row >
|
|
|
|
|
<div style="width: 100%; height:100%;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;">
|
|
|
|
|
|
|
|
|
|
<Echart
|
|
|
|
|
:options="statsChart2"
|
|
|
|
|
></Echart>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</el-row>
|
|
|
|
|
</el-card>
|
|
|
|
|
<el-card class="grid-item" body-style="padding:0px;height:100%" >
|
|
|
|
|
|
|
|
|
|
<el-row >
|
|
|
|
|
<div style="width: 100%; height:100%;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<Echart
|
|
|
|
|
:options="statsChart3"
|
|
|
|
|
></Echart>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</el-row>
|
|
|
|
|
</el-card>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 分割线 -->
|
|
|
|
|
<!-- <div class="m0 grid-container grid-container1" style="height: 100%; display: flex; flex-wrap: wrap;">-->
|
|
|
|
@ -209,61 +201,7 @@
|
|
|
|
|
<!-- ></Echart>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<template>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="left">
|
|
|
|
|
<div style="width: 100%; height: 500px;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;">
|
|
|
|
|
<Echart
|
|
|
|
|
:options="statsChart1"
|
|
|
|
|
></Echart>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="middle">
|
|
|
|
|
<div style="width: 100%; height: 500px;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;">
|
|
|
|
|
<Echart
|
|
|
|
|
:options="statsChart2"
|
|
|
|
|
></Echart>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="right">
|
|
|
|
|
<div style="width: 100%; height: 500px;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;">
|
|
|
|
|
<Echart
|
|
|
|
|
:options="statsChart3"
|
|
|
|
|
></Echart>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<!-- <div class="mt10 grid-container grid-container3" style="height: 15%" >-->
|
|
|
|
|
<!-- <div style="width: 100%; height: 500px;-->
|
|
|
|
|
<!-- justify-content: center;-->
|
|
|
|
|
<!-- align-items: center;">-->
|
|
|
|
|
<!-- <Echart-->
|
|
|
|
|
<!-- :options="statsChart1"-->
|
|
|
|
|
<!-- ></Echart>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
|
|
|
|
|
<!-- <div style="width: 100%; height: 500px;-->
|
|
|
|
|
<!-- justify-content: center;-->
|
|
|
|
|
<!-- align-items: center;">-->
|
|
|
|
|
<!-- <Echart-->
|
|
|
|
|
<!-- :options="statsChart2"-->
|
|
|
|
|
<!-- ></Echart>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- <div style="width: 100%; height: 500px;-->
|
|
|
|
|
<!-- justify-content: center;-->
|
|
|
|
|
<!-- align-items: center;">-->
|
|
|
|
|
<!-- <Echart-->
|
|
|
|
|
<!-- :options="statsChart3"-->
|
|
|
|
|
<!-- ></Echart>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -311,7 +249,6 @@ export default {
|
|
|
|
|
salesScanCount: 0,
|
|
|
|
|
fifoSplitOneCount:0,
|
|
|
|
|
fifoSplitTwoCount:0,
|
|
|
|
|
fifoSplitThreeCount:0,
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
@ -435,7 +372,6 @@ export default {
|
|
|
|
|
salesScanCount: res.data.salesScanCount,
|
|
|
|
|
fifoSplitOneCount:res.data.fifoSplitOneCount,
|
|
|
|
|
fifoSplitTwoCount:res.data.fifoSplitTwoCount,
|
|
|
|
|
fifoSplitThreeCount:res.data.fifoSplitThreeCount,
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -464,8 +400,8 @@ export default {
|
|
|
|
|
initStatsChart1(){
|
|
|
|
|
const dataArr = [
|
|
|
|
|
this.stats.buyerScanCount,this.stats.salesScanCount
|
|
|
|
|
]
|
|
|
|
|
console.log('dataArr',dataArr)
|
|
|
|
|
];
|
|
|
|
|
console.log('dataArr',dataArr);
|
|
|
|
|
this.statsChart1 = {
|
|
|
|
|
color: ['#01c6fd'],
|
|
|
|
|
grid: {
|
|
|
|
@ -516,7 +452,8 @@ export default {
|
|
|
|
|
color: '#000000'
|
|
|
|
|
},
|
|
|
|
|
formatter: function (value) {
|
|
|
|
|
return value + ""
|
|
|
|
|
// 这里修改 y 轴的数值显示,可以通过乘以一个倍数来增大显示的值
|
|
|
|
|
return (value * 10) + "";
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
@ -529,21 +466,19 @@ export default {
|
|
|
|
|
data: dataArr,
|
|
|
|
|
label: {
|
|
|
|
|
normal: {
|
|
|
|
|
show: true,//开启显示
|
|
|
|
|
position: 'top',//柱形上方
|
|
|
|
|
textStyle: { //数值样式
|
|
|
|
|
show: true, // 开启显示
|
|
|
|
|
position: 'top', // 柱形上方
|
|
|
|
|
textStyle: { // 数值样式
|
|
|
|
|
color: '#000000'
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
initStatsChart2(){
|
|
|
|
|
let colors = ["#ff0000","#ffca29", "#01c6fd"];
|
|
|
|
|
let colors = ["#d30101","#ffca29", "#01c6fd"];
|
|
|
|
|
let piedata = {
|
|
|
|
|
name: "医保上传率",
|
|
|
|
|
type: "pie",
|
|
|
|
@ -629,11 +564,11 @@ export default {
|
|
|
|
|
lineHeight: 26,
|
|
|
|
|
},
|
|
|
|
|
c: {
|
|
|
|
|
color: "#31ABE3",
|
|
|
|
|
color: "#2b91c2",
|
|
|
|
|
fontSize: 14,
|
|
|
|
|
},
|
|
|
|
|
per: {
|
|
|
|
|
color: "#31ABE3",
|
|
|
|
|
color: "#2b91c2",
|
|
|
|
|
fontSize: 14,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
@ -678,7 +613,7 @@ export default {
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
initStatsChart3(){
|
|
|
|
|
let colors = ["#ff0000","#ffca29", "#01c6fd"];
|
|
|
|
|
let colors = ["#d30101", "#01c6fd"];
|
|
|
|
|
let piedata = {
|
|
|
|
|
name: "赋码方式",
|
|
|
|
|
type: "pie",
|
|
|
|
@ -693,25 +628,19 @@ export default {
|
|
|
|
|
data: [
|
|
|
|
|
{
|
|
|
|
|
value: this.stats.fifoSplitOneCount ,
|
|
|
|
|
name: "自动拆零赋码数",
|
|
|
|
|
name: "拆零赋码数",
|
|
|
|
|
label: {
|
|
|
|
|
shadowColor: colors[0],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: this.stats.fifoSplitTwoCount,
|
|
|
|
|
name: "自动整取赋码数",
|
|
|
|
|
name: "整取赋码数",
|
|
|
|
|
label: {
|
|
|
|
|
shadowColor: colors[1],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: this.stats.fifoSplitThreeCount,
|
|
|
|
|
name: "手动赋码数",
|
|
|
|
|
label: {
|
|
|
|
|
shadowColor: colors[2],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
};
|
|
|
|
|
this.statsChart3 = {
|
|
|
|
@ -764,11 +693,11 @@ export default {
|
|
|
|
|
lineHeight: 26,
|
|
|
|
|
},
|
|
|
|
|
c: {
|
|
|
|
|
color: "#31ABE3",
|
|
|
|
|
color: "#2b91c2",
|
|
|
|
|
fontSize: 14,
|
|
|
|
|
},
|
|
|
|
|
per: {
|
|
|
|
|
color: "#31ABE3",
|
|
|
|
|
color: "#2b91c2",
|
|
|
|
|
fontSize: 14,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
@ -991,5 +920,11 @@ export default {
|
|
|
|
|
float: left;
|
|
|
|
|
width: 37.5%;
|
|
|
|
|
}
|
|
|
|
|
//左右两侧 三个块
|
|
|
|
|
.contetn_lr-item {
|
|
|
|
|
height: 282px;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|