Browse Source

到此更改框架

ming 3 years ago
parent
commit
1b1d63dc90
1 changed files with 153 additions and 2 deletions
  1. 153 2
      src/views/operManage/workStatistics/index.vue

+ 153 - 2
src/views/operManage/workStatistics/index.vue

@@ -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>