增加页面

src/components/offlineService/appointmentBoard.vue

+<style>
+  .appointTable {
+    width: 100%;
+    border-collapse: collapse;
+    margin-top: 20px;
+  }
+
+  .appointTable tr th {
+    height: 50px;
+    font-size: 14px;
+    color: #111111;
+    font-weight: bold;
+    border: 1px solid #E6E6E6
+  }
+
+  .appointTable tr {
+    background: #fff;
+    text-align: center;
+    height: 40px;
+  }
+
+  .appointTable tr td {
+    font-size: 12px;
+    height:60px;
+    color:#333333;
+    border: 1px solid #E5E5E5;
+  }
+
+  .appointmentBoard .content .searchInput {
+    border: 1px solid #DCDFE6;
+    border-radius: 4px;
+    display: inline-block;
+  }
+
+  .appointmentBoard .content .searchInput .el-input__inner {
+    border: none;
+    outline: none;
+    height: 30px;
+    line-height: 30px;
+  }
+
+  .appointmentBoard .content .searchInput {
+    line-height: normal;
+    display: inline-table;
+    width: 100%;
+    border-collapse: separate;
+    border-spacing: 0;
+    width: 250px;
+  }
+  .posi{
+    position: relative;
+  }
+  .abso{
+    position: absolute;
+    left:0;
+    top:0;
+    width:3px;
+    height:100%;
+    background: #409EFF;
+  }
+  .abso2{
+    position: absolute;
+    left:0;
+    top:0;
+    width:3px;
+    height:100%;
+    background: #67C23A;
+
+  }
+</style>
+<template>
+  <div class="appointmentBoard">
+    <div class="content">
+      <div>
+        <div class="searchInput">
+          <el-input style="display:inline-block;width:225px;height:30px" placeholder="请输入搜索内容" v-model="msg.Name"
+            size="small" clearable @keyup.enter.native="msg.pageIndex=1,getList()">
+          </el-input>
+          <span class="el-icon-search" style="color:#979dad;font-size:14px;position:relative;top:1px"
+            @click="msg.pageIndex=1,getList()"> </span>
+        </div>
+        <div style="display:inline-block;">
+          <el-date-picker v-model="msg.date" size="small" type="date" placeholder="选择日期">
+          </el-date-picker>
+        </div>
+      </div>
+      <table class="appointTable" border="0" cellspacing="0" cellpadding="0">
+        <tr>
+          <th style="width:100px;">服务</th>
+          <th>高晶晶</th>
+          <th>张三丰</th>
+        </tr>
+        <tr>
+          <td>09:30</td>
+          <td class="posi">
+            <div class="abso"></div>
+          </td>
+          <td rowspan="2" class="posi">
+            <div class="abso2"></div>
+          </td>
+        </tr>
+        <tr>
+          <td>10:00</td>
+          <td></td>
+          <!-- <td></td> -->
+        </tr>
+      </table>
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    data() {
+      return {
+        dataList: [],
+        msg: {
+          Name: '', //门店名
+          date: '' //日期
+        }
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+    mounted() {}
+  };
+
+</script>
+<style>
+  .appointmentBoard .content {
+    background: #fff;
+    margin-top: 10px;
+    padding: 20px;
+    box-sizing: border-box;
+  }
+
+</style>

src/components/offlineService/offlineIndex.vue

@@ -187,6 +187,12 @@
           <li class="menu_item" :class="{'Fchecked':isChecked=='/ServiceMannage'}"  @click="isChecked='/ServiceMannage',CommonJump('ServiceMannage')">
             <i class="el-icon-menu"></i><span>服务人员管理</span>
           </li>
+          <li class="menu_item" :class="{'Fchecked':isChecked=='/performanceStatics'}"  @click="isChecked='/performanceStatics',CommonJump('performanceStatics')">
+            <i class="el-icon-menu"></i><span>服务人绩效统计</span>
+          </li>
+          <li class="menu_item" :class="{'Fchecked':isChecked=='/appointmentBoard'}"  @click="isChecked='/appointmentBoard',CommonJump('appointmentBoard')">
+            <i class="el-icon-menu"></i><span>预约看板</span>
+          </li>
         </ul>
       </div>
     </div>

src/router/index.js

@@ -421,6 +421,18 @@ export default new Router({
           name: 'storesManage',
           component: resolve => require(['@/components/offlineService/storesManage'], resolve),
         },
+        //线下 预约看板
+        {
+          path: '/appointmentBoard',
+          name: 'appointmentBoard',
+          component: resolve => require(['@/components/offlineService/appointmentBoard'], resolve),
+        },
+        //线下 服务人员绩效统计
+        {
+          path: '/performanceStatics',
+          name: 'performanceStatics',
+          component: resolve => require(['@/components/offlineService/performanceStatics'], resolve),
+        }
       ]
     },