|
|
@@ -75,6 +75,23 @@
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label-width="0">
|
|
|
+ <span></span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="统计维度:">
|
|
|
+ <el-select v-model="summaryType" placeholder="请选择统计维度" size="small" style="width: 140px; margin-bottom: 10px; margin-left: 10px;">
|
|
|
+ <el-option
|
|
|
+ v-for="item in summaryTypes"
|
|
|
+ :key="item.dictLabel"
|
|
|
+ :label="item.dictLabel"
|
|
|
+ :value="item.dictValue">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
@@ -123,7 +140,17 @@
|
|
|
<el-col :span="6">
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" icon="el-icon-search" plain @click="storeOrderStatistics">搜索</el-button>
|
|
|
+
|
|
|
+
|
|
|
+ <el-button type="primary" icon="el-icon-download" plain style="margin-left: 10px;margin-right: 10px;" @click="exportExcel">导出</el-button>
|
|
|
+ <!-- 是否展示统计图 -->
|
|
|
+ <el-switch
|
|
|
+ v-model="showChart"
|
|
|
+ active-color="#13ce66"
|
|
|
+ inactive-color="#ff4949">
|
|
|
+ </el-switch>
|
|
|
</el-form-item>
|
|
|
+
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
|
|
|
@@ -131,21 +158,28 @@
|
|
|
|
|
|
|
|
|
</el-form>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
<div class="data-box">
|
|
|
- <!-- <div class="echart-box">
|
|
|
- <div id="echart-customer"></div>
|
|
|
- </div> -->
|
|
|
+
|
|
|
|
|
|
<!-- 新增的数据表格 -->
|
|
|
<div class="table-container">
|
|
|
<!-- 使用组件替换原有表格 -->
|
|
|
<order-summary-table
|
|
|
- title="员工下单汇总"
|
|
|
+ :title="tableTiele"
|
|
|
:table-data="tableData"
|
|
|
- nameLable="员工姓名" />
|
|
|
+ :nameLable="nameLable" />
|
|
|
|
|
|
</div>
|
|
|
+
|
|
|
+
|
|
|
</div>
|
|
|
+
|
|
|
+ <div class="echart-box" v-if="showChart">
|
|
|
+ <div id="echart-customer"></div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
@@ -155,7 +189,7 @@
|
|
|
import OrderSummaryTable from '../components/OrderSummaryTable';
|
|
|
import { storeOrderStatistics } from "@/api/hisStore/statistics";
|
|
|
import { getUserListByDeptId} from "@/api/company/companyUser";
|
|
|
-// import echarts from 'echarts'
|
|
|
+import echarts from 'echarts'
|
|
|
import resize from '../../dashboard/mixins/resize'
|
|
|
import { treeselect } from "@/api/company/companyDept";
|
|
|
import Treeselect from "@riophae/vue-treeselect";
|
|
|
@@ -167,10 +201,18 @@ export default {
|
|
|
components: { Treeselect,OrderSummaryTable },
|
|
|
watch: {
|
|
|
// 监听deptId
|
|
|
- 'deptId': 'currDeptChange'
|
|
|
+ 'deptId': 'currDeptChange',
|
|
|
+ // 监听 summaryType
|
|
|
+ 'summaryType': 'summaryTypeChange',
|
|
|
+
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ showChart:false, // 是否展示统计图
|
|
|
+ summaryType:1,// 默认员工
|
|
|
+ summaryTypes: [{dictLabel: '员工', dictValue: 1},
|
|
|
+ {dictLabel: '部门', dictValue: 2},
|
|
|
+ {dictLabel: '公司', dictValue: 3}],
|
|
|
queryTypes:[
|
|
|
{ dictLabel: '下单时间', dictValue: 1 },
|
|
|
{ dictLabel: '发货时间', dictValue: 2 }
|
|
|
@@ -230,9 +272,12 @@ export default {
|
|
|
orderCount: [],
|
|
|
payPrice: [],
|
|
|
// 新增表格数据
|
|
|
- tableData: [], // 员工下单汇总
|
|
|
+ tableData: [], // 汇总
|
|
|
+ tableTiele: '员工下单汇总',
|
|
|
+ nameLable: '员工姓名',
|
|
|
companyTableData: [], // 公司下单汇总
|
|
|
- deptTableData: [] // 部门下单汇总
|
|
|
+ deptTableData: [], // 部门下单汇总
|
|
|
+ userTableData:[] // 员工下单汇总
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
@@ -253,6 +298,21 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
methods: {
|
|
|
+ summaryTypeChange(){
|
|
|
+ if (this.summaryType == 1) {
|
|
|
+ this.tableTiele = '员工下单汇总';
|
|
|
+ this.nameLable = '员工姓名';
|
|
|
+ this.tableData = this.userTableData;
|
|
|
+ } else if (this.summaryType == 2) {
|
|
|
+ this.tableTiele = '部门下单汇总';
|
|
|
+ this.nameLable = '部门名称';
|
|
|
+ this.tableData = this.deptTableData;
|
|
|
+ }else if (this.summaryType == 3) {
|
|
|
+ this.tableTiele = '公司下单汇总';
|
|
|
+ this.nameLable = '公司名称';
|
|
|
+ this.tableData = this.deptTableData;
|
|
|
+ }
|
|
|
+ },
|
|
|
companyChange(val) {
|
|
|
console.log(val);
|
|
|
this.companyId = val;
|
|
|
@@ -305,6 +365,10 @@ export default {
|
|
|
data.companyUserId = this.userIds
|
|
|
}
|
|
|
|
|
|
+ if(this.summaryType){
|
|
|
+ data.summaryType = this.summaryType
|
|
|
+ }
|
|
|
+
|
|
|
if(this.queryType){
|
|
|
data.queryType = this.queryType
|
|
|
}
|
|
|
@@ -334,13 +398,15 @@ export default {
|
|
|
this.orderCount = response.orderCount;
|
|
|
this.payPrice = response.payPrice;
|
|
|
//表格数据
|
|
|
- this.tableData = response.userTableData || [];
|
|
|
+ this.userTableData = response.userTableData || [];
|
|
|
this.companyTableData = response.companyTableData || [];
|
|
|
this.deptTableData = response.deptTableData || [];
|
|
|
|
|
|
- // setTimeout(() => {
|
|
|
- // this.initEchart();
|
|
|
- // }, 500);
|
|
|
+ this.summaryTypeChange();
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ this.initEchart();
|
|
|
+ }, 500);
|
|
|
});
|
|
|
},
|
|
|
initEchart() {
|
|
|
@@ -434,6 +500,11 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+#echart-customer {
|
|
|
+ width: 100%;
|
|
|
+ height: 320px
|
|
|
+}
|
|
|
+
|
|
|
.app-container {
|
|
|
border: 1px solid #e6e6e6;
|
|
|
padding: 12px;
|
|
|
@@ -471,7 +542,7 @@ export default {
|
|
|
padding: 5px;
|
|
|
background-color: rgb(255, 255, 255);
|
|
|
flex: 1;
|
|
|
- // overflow-y: auto; // 添加垂直滚动条
|
|
|
+ overflow-y: auto; // 添加垂直滚动条
|
|
|
height: 100%;
|
|
|
|
|
|
.echart-box {
|