|
@@ -1,5 +1,156 @@
|
|
|
<template>
|
|
|
- <div style="padding:30px;">
|
|
|
- 工作量统计
|
|
|
+ <div class="app-container">
|
|
|
+ <!-- 筛选start -->
|
|
|
+ <div class="filter-container mb-20">
|
|
|
+ <div class="left">
|
|
|
+ <div class="filter-item">
|
|
|
+ 时间:
|
|
|
+ <el-date-picker
|
|
|
+ v-model="value1"
|
|
|
+ type="datetimerange"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ style="width:auto"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ </div>
|
|
|
+ <div class="filter-item">
|
|
|
+ 站点:
|
|
|
+ <el-select
|
|
|
+ v-model="region"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 200px"
|
|
|
+ >
|
|
|
+ <el-option label="站点一" value="1"></el-option>
|
|
|
+ <el-option label="站点二" value="2"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-button type="primary" icon="el-icon-search" class="search-button"
|
|
|
+ >搜索</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="right">
|
|
|
+ <el-button type="primary">导出</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 筛选end -->
|
|
|
+
|
|
|
+ <!-- 表格start -->
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ stripe
|
|
|
+ :header-cell-style="headClass"
|
|
|
+ :cell-style="cellStyle"
|
|
|
+ >
|
|
|
+ <el-table-column fixed prop="workerNum" label="员工账号" width="">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="workerName" label="员工名称" width="">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="orderQuality" label="接单量" width="">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="completedQuantity" label="完单量" width="">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="incomplete" label="未完成" width="">
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column prop="orderQuality" label="响应时间/小时" width="">
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column prop="handlingTime" label="处理时间/小时" width="">
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column prop="evaluation" label="客户评价" width="">
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </el-table>
|
|
|
+ <!-- 表格end -->
|
|
|
</div>
|
|
|
</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+// import DialogComponent from "./dialogComponent";
|
|
|
+// import { mapGetters } from "vuex";
|
|
|
+
|
|
|
+export default {
|
|
|
+ // name: "Dashboard",
|
|
|
+ // computed: {
|
|
|
+ // ...mapGetters(["name"]),
|
|
|
+ // },
|
|
|
+
|
|
|
+ // components: { DialogComponent },
|
|
|
+
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ showDialog: false,
|
|
|
+ value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
|
|
|
+ region: "",
|
|
|
+ tableData: [
|
|
|
+ {
|
|
|
+ workerNum: "8081",
|
|
|
+ workerName: "张三",
|
|
|
+ orderQuality: "0",
|
|
|
+ completedQuantity:'0',
|
|
|
+ incomplete:'0',
|
|
|
+ responseTime:'0',
|
|
|
+ handlingTime:'0',
|
|
|
+ evaluation: "",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ workerNum: "8081",
|
|
|
+ workerName: "张三",
|
|
|
+ orderQuality: "0",
|
|
|
+ completedQuantity:'0',
|
|
|
+ incomplete:'0',
|
|
|
+ responseTime:'0',
|
|
|
+ handlingTime:'0',
|
|
|
+ evaluation: "",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ workerNum: "8081",
|
|
|
+ workerName: "张三",
|
|
|
+ orderQuality: "0",
|
|
|
+ completedQuantity:'0',
|
|
|
+ incomplete:'0',
|
|
|
+ responseTime:'0',
|
|
|
+ handlingTime:'0',
|
|
|
+ evaluation: "",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ workerNum: "8081",
|
|
|
+ workerName: "张三",
|
|
|
+ orderQuality: "0",
|
|
|
+ completedQuantity:'0',
|
|
|
+ incomplete:'0',
|
|
|
+ responseTime:'0',
|
|
|
+ handlingTime:'0',
|
|
|
+ evaluation: "",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 表头样式设置
|
|
|
+ headClass() {
|
|
|
+ return "background:#FAFAFA;";
|
|
|
+ },
|
|
|
+
|
|
|
+ //自定义列样式
|
|
|
+ // cellStyle({ row, column, rowIndex, columnIndex }) {
|
|
|
+ // if (columnIndex === 3) {
|
|
|
+ // return `color:#0284E8;`;
|
|
|
+ // } else {
|
|
|
+ // return "";
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+</style>
|