修改

src/api/users/user.js

@@ -259,6 +259,19 @@ export function RemoveEnterprise(data) {
   })
 }
 
+/**
+ * 获取统计数据
+ * @param {查询参数} data
+ */
+export function MarketChannelStudentStatic(data) {
+  return request({
+    url: '/UserCenter/MarketChannelStudentStatic',
+    method: 'post',
+    data
+  })
+}
+
+
 
 
 

src/pages/sale/makeupRate.vue

+<style>
+  .makeTable {
+    text-align: center;
+    overflow: scroll;
+  }
+
+  .makeTable tr td {
+    height: 40px;
+    min-width: 150px;
+    color: #000;
+    border: 1px solid #d1d1d1;
+  }
+
+  .makeTable tr th {
+    height: 40px;
+    background-color: rgb(238, 238, 239);
+    min-width: 150px;
+  }
+
+  .makeTable th:first-child {
+    /* td第一个粘性定位 */
+    position: sticky;
+    left: 0;
+  }
+
+  .makeTable td:first-child {
+    /* td第一个粘性定位 */
+    position: sticky;
+    left: 0;
+    background: #fff;
+  }
+
+  .makeTable th:last-child {
+    /* td第一个粘性定位 */
+    position: sticky;
+    right: 0;
+  }
+
+  .makeTable td:last-child {
+    /* td第一个粘性定位 */
+    position: sticky;
+    right: 0;
+    background: #fff;
+  }
+
+  .makeOutDiv {
+    position: relative;
+    width: 100%;
+    overflow-y: auto;
+  }
+
+  .makeOutDiv::-webkit-scrollbar {
+    width: 3px;
+    height: 8px;
+    background-color: #F5F5F5;
+  }
+
+  /*!*定义滚动条轨道 内阴影+圆角*!*/
+  .makeOutDiv::-webkit-scrollbar-track {
+    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
+    border-radius: 10px;
+    background-color: #F5F5F5;
+  }
+
+  /*!*定义滑块 内阴影+圆角*!*/
+  .makeOutDiv::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    -webkit-box-shadow: -webkit-gradient(linear, 0 0, 0 100%, color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.5, transparent), to(transparent));
+    background-color: #0ae;
+  }
+
+  .Sysuser_Date .el-input__inner {
+    background: transparent !important;
+    border: 0 !important;
+  }
+  .Sysuser_Date .el-range-editor .el-range-input{
+    background: transparent !important;
+  }
+</style>
+<template>
+  <div class="page-body">
+    <div class="page-search row items-center">
+      <div class="col row wrap q-mr-lg q-col-gutter-md">
+        <div class="col-3 Sysuser_Date">
+          <q-field filled>
+             <template v-slot:control>
+              <el-date-picker v-model="dateList" type="daterange" :picker-options="pickerOptions0" align="right"
+                value-format="yyyy-MM-dd" @change="getData" unlink-panels range-separator="至" start-placeholder="开始日期"
+                end-placeholder="结束日期">
+              </el-date-picker>
+            </template>
+          </q-field>
+        </div>
+        <div class="col-3 Sysuser_Date">
+          <q-field filled>
+             <template v-slot:control>
+              <el-select class="topselect" v-model="msg.empList" @change="getData" style="width:100%;" collapse-tags
+                multiple filterable placeholder="请选择">
+                <el-option v-for="item in EmployeeList" :key="item.Id" :label="item.EmployeeName" :value="item.Id">
+                </el-option>
+              </el-select>
+            </template>
+          </q-field>
+        </div>
+      </div>
+    </div>
+    <div class="makeOutDiv">
+      <table class="makeTable" style="border-collapse:collapse;">
+        <tr>
+          <th>员工</th>
+          <template v-for="(item,index) in dataList[0].subList">
+            <th>
+              {{item.ChannelName}}
+            </th>
+            <th>
+              {{item.ChannelName}}到访
+            </th>
+            <th>
+              {{item.ChannelName}}转化率
+            </th>
+          </template>
+        </tr>
+        <tr v-for="(cItem,cIndex) in dataList" :key="cIndex">
+          <td>{{cItem.EmployeeName}}</td>
+          <template v-for="(sItem,sIndex) in cItem.subList">
+            <td>
+              {{sItem.VisitCount}}
+            </td>
+            <td>{{sItem.ClueCount}}</td>
+            <td>{{getStatical(sItem)}}%</td>
+          </template>
+        </tr>
+      </table>
+    </div>
+  </div>
+</template>
+<script>
+  import {
+    MarketChannelStudentStatic
+  } from '../../api/users/user'
+  import {
+    queryEmployee
+  } from "../../api/users/user";
+  export default {
+    data() {
+      return {
+        msg: {
+          startTime: "",
+          endTime: "",
+          empList: []
+        },
+        dateList: [],
+        dataList: [],
+        EmployeeList: [],
+      };
+    },
+    created() {
+
+    },
+    mounted() {
+      this.getEmployeeList();
+      this.getData();
+    },
+    methods: {
+      //获取数据
+      getData() {
+        if (this.dateList && this.dateList.length > 0) {
+          this.msg.startTime = this.dateList[0];
+          this.msg.endTime = this.dateList[1];
+        } else {
+          this.msg.startTime = "";
+          this.msg.endTime = "";
+        }
+        MarketChannelStudentStatic(this.msg).then(res => {
+          console.log(res, '数据');
+          if (res.Code == 1) {
+            this.dataList = res.Data;
+          }
+        });
+      },
+      //获取统计
+      getStatical(item) {
+        let num = parseFloat(item.VisitCount);
+        let total = parseFloat(item.ClueCount);
+        if (isNaN(num) || isNaN(total)) {
+          return "-";
+        }
+        return total <= 0 ? "0" : (Math.round(num / total * 10000) / 100.00);
+      },
+      //获取员工列表
+      getEmployeeList() {
+        var qMsg = {
+          IsLeave: 1,
+          Dept_Id: 0,
+        };
+        queryEmployee(qMsg).then(res => {
+          this.EmployeeList = res.Data;
+        });
+      },
+    }
+  }
+
+</script>

src/router/routes.js

@@ -1025,6 +1025,11 @@ const routes = [{
     component: () =>
       import("pages/sale/mystu.vue")
   },
+  {
+    path: "/sale/makeupRate", //转化率
+    component: () =>
+      import("pages/sale/makeupRate.vue")
+  },
   {
     path: "/sale/auditionList", //试听列表
     component: () =>