Selaa lähdekoodia

Merge remote-tracking branch 'origin/master'

吴树波 1 kuukausi sitten
vanhempi
commit
4275d875c0

+ 12 - 2
src/api/company/companyVoiceApi.js

@@ -17,11 +17,21 @@ export function callOffMobile(voiceId) {
     method: 'get'
   })
 }
-export function getSipAccount() {
+export function getSipAccount(query) {
 
   return request({
     url: '/company/voiceApi/getSipAccount' ,
-    method: 'get'
+    method: 'get',
+    params:query
+  })
+}
+
+export function getCallerApiList(query) {
+
+  return request({
+    url: '/company/voiceApi/list' ,
+    method: 'get',
+    params:query
   })
 }
 

+ 12 - 2
src/api/company/companyVoiceCaller.js

@@ -9,6 +9,15 @@ export function listCompanyVoiceCaller(query) {
   })
 }
 
+// 查询我的企业用户坐席列表
+export function getMyCallerApiList(query) {
+  return request({
+    url: '/company/companyVoiceCaller/myList',
+    method: 'get',
+    params: query
+  })
+}
+
 // 查询企业用户坐席详细
 export function getCompanyVoiceCaller(callerId) {
   return request({
@@ -52,10 +61,11 @@ export function exportCompanyVoiceCaller(query) {
   })
 }
 
-export function getCallerList() {
+export function getCallerList(query) {
   return request({
     url: '/company/companyVoiceCaller/getCallerList' ,
-    method: 'get'
+    method: 'get',
+    params: query
   })
 }
 export function bindCallerNo(data) {

+ 75 - 0
src/api/system/employeeStats.js

@@ -0,0 +1,75 @@
+import request from '@/utils/request'
+
+// 查询员工完成统计列表
+export function listEmployeeStats(query) {
+  return request({
+    url: '/stats/seller/pageList',
+    method: 'post',
+    data: query
+  })
+}
+
+export function listPeriodList(query) {
+  return request({
+    url: '/stats/period/pageList',
+    method: 'post',
+    data: query
+  })
+}
+
+export function listTodayList(query) {
+  return request({
+    url: '/stats/everyDay/pageList',
+    method: 'post',
+    data: query
+  })
+}
+
+// 查询员工完成统计详细
+export function getEmployeeStats(id) {
+  return request({
+    url: '/system/employeeStats/' + id,
+    method: 'get'
+  })
+}
+
+// 获取员工列表
+export function getEmployeeList() {
+  return request({
+    url: '/system/employee/list',
+    method: 'get'
+  })
+}
+
+// 获取频道列表
+export function getChannelList() {
+  return request({
+    url: '/system/channel/list',
+    method: 'get'
+  })
+}
+
+// 导出员工完成统计
+export function exportEmployeeStats(query) {
+  return request({
+    url: '/system/employeeStats/export',
+    method: 'post',
+    data: query
+  })
+}
+
+// 获取SOP任务数据
+export function getSOPTaskData(param){
+  return request({
+    url: '/stats/sopTaskData',
+    method: 'get'
+  })
+}
+
+// 获取部门数据
+export function getDeptData(){
+  return request({
+    url: '/stats/getDeptData',
+    method: 'get'
+  })
+}

+ 590 - 0
src/components/TreeSelect/index.vue

@@ -0,0 +1,590 @@
+<template>
+  <div class="task-select-tree" :style="{ width: componentWidth }">
+    <el-popover
+      ref="popover"
+      placement="bottom-start"
+      :width="popoverComputedWidth"
+      trigger="click"
+      v-model="popoverVisible"
+      popper-class="task-select-tree-popper"
+      :disabled="disabled"
+      @show="onPopoverShow"
+    >
+      <div class="popover-content-wrapper">
+        <el-input
+          v-if="filterable"
+          placeholder="输入关键字过滤"
+          v-model="filterText"
+          size="mini"
+          clearable
+          class="filter-input"
+        >
+        </el-input>
+        <el-scrollbar :style="{ height: treeHeight + 'px' }" class="tree-scrollbar">
+          <el-tree
+            ref="taskTree"
+            :data="processedTreeData"
+            :props="treeProps"
+            show-checkbox
+            :node-key="nodeKey"
+            :default-expand-all="defaultExpandAll"
+            :expand-on-click-node="false"
+            :check-strictly="checkStrictly"
+            :filter-node-method="filterNode"
+            @check="handleTreeCheck"
+            :default-checked-keys="tempCheckedKeys"
+            class="task-tree-in-popover"
+          >
+            <span class="custom-tree-node" slot-scope="{ node, data }">
+              <span>{{ node.label }}</span>
+              <span v-if="!data.isParent && showNodeDetail" class="node-detail-text">
+                (ID: {{ data.originalData.qwUserId}} {{ data.originalData.taskExecDate }})
+              </span>
+            </span>
+          </el-tree>
+        </el-scrollbar>
+        <div class="popover-footer">
+          <el-button size="mini" @click="handleClearInPopover">清空</el-button>
+          <el-button type="primary" size="mini" @click="handleConfirm">确定</el-button>
+        </div>
+      </div>
+
+      <div
+        slot="reference"
+        :class="['select-trigger-wrapper', { 'is-disabled': disabled, 'is-active': popoverVisible }]"
+        @mouseenter="inputHovering = true"
+        @mouseleave="inputHovering = false"
+      >
+        <div class="tags-or-value-container">
+          <template v-if="multiple && currentSelectedDisplayNodes.length > 0">
+            <el-tag
+              v-for="node in currentSelectedDisplayNodes"
+              :key="node[nodeKey]"
+              type="info"
+              size="small"
+              closable
+              :disable-transitions="true"
+              @close.stop="removeTag(node)"
+              class="trigger-tag"
+            >
+              {{ node[treeProps.label] }}
+            </el-tag>
+            <el-tag
+              v-if="currentSelectedNodes.length > maxDisplayTags"
+              type="info"
+              size="small"
+              class="trigger-tag"
+            >
+              + {{ currentSelectedNodes.length - maxDisplayTags }}
+            </el-tag>
+          </template>
+          <span v-else-if="!multiple && currentSelectedNodes.length > 0" class="single-value-display">
+            {{ currentSelectedNodes[0][treeProps.label] }}
+            </span>
+          <span v-else class="placeholder-text">{{ placeholder }}</span>
+        </div>
+
+        <span class="icons-container">
+            <i
+              v-if="showClearIcon"
+              class="el-icon-circle-close clear-icon"
+              @click.stop="handleClearOnTrigger"
+            ></i>
+            <i :class="['el-icon-arrow-up', 'arrow-icon', { 'is-reverse': !popoverVisible }]"></i>
+        </span>
+      </div>
+    </el-popover>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'SelectTree',
+  props: {
+    value: {
+      type: Array,
+      default: () => []
+    },
+    rawData: {
+      type: Array,
+      required: true
+    },
+    placeholder: {
+      type: String,
+      default: '请选择'
+    },
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    checkStrictly: {
+      type: Boolean,
+      default: false
+    },
+    filterable: {
+      type: Boolean,
+      default: true
+    },
+    maxDisplayTags: {
+      type: Number,
+      default: 2
+    },
+    componentWidth: {
+      type: String,
+      default: '100%'
+    },
+    popoverWidth: {
+      type: [String, Number],
+      default: 'auto'
+    },
+    treeProps: {
+      type: Object,
+      default: () => ({
+        children: 'children',
+        label: 'label',
+        isLeaf: 'isLeaf'
+      })
+    },
+    nodeKey: {
+      type: String,
+      default: 'id'
+    },
+    defaultExpandAll: {
+      type: Boolean,
+      default: false
+    },
+    showNodeDetail: {
+      type: Boolean,
+      default: true
+    },
+    treeHeight: {
+      type: Number,
+      default: 280
+    },
+    returnLeafOnly: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      popoverVisible: false,
+      filterText: '',
+      processedTreeData: [],
+      nodeMap: {},
+      tempCheckedKeys: [...this.value],
+      currentSelectedNodes: [],
+      inputHovering: false,
+      triggerElRect: null
+    };
+  },
+  computed: {
+    popoverComputedWidth() {
+      if (this.popoverWidth === 'auto') {
+        return this.triggerElRect ? this.triggerElRect.width : 250;
+      }
+      return parseInt(this.popoverWidth, 10);
+    },
+    currentSelectedDisplayNodes() {
+      if (!this.multiple) return [];
+      return this.currentSelectedNodes.slice(0, this.maxDisplayTags);
+    },
+    showClearIcon() {
+      return (
+        !this.disabled &&
+        this.inputHovering &&
+        this.currentSelectedNodes.length > 0 &&
+        !this.multiple
+      );
+    }
+  },
+  watch: {
+    rawData: {
+      immediate: true,
+      handler(newData) {
+        this.processRawData(newData);
+        // 过滤掉父节点,只保留子节点
+        const leafOnlyKeys = this.value.filter(key => {
+          const node = this.nodeMap[key];
+          return node && !node.isParent;
+        });
+        this.updateCurrentSelectedNodesFromKeys(leafOnlyKeys, true);
+      }
+    },
+    value: {
+      handler(newVal) {
+        // 过滤掉父节点,只保留子节点
+        const leafOnlyKeys = newVal.filter(key => {
+          const node = this.nodeMap[key];
+          return node && !node.isParent;
+        });
+
+        const validKeysFromNewVal = leafOnlyKeys.filter(key => this.nodeMap[key] !== undefined);
+        const sortedNewValStr = JSON.stringify([...leafOnlyKeys].sort());
+        const sortedValidKeysFromNewValStr = JSON.stringify([...validKeysFromNewVal].sort());
+        const currentInternalNodeKeys = this.currentSelectedNodes.map(n => n[this.nodeKey]);
+        const sortedCurrentInternalNodeKeysStr = JSON.stringify([...currentInternalNodeKeys].sort());
+
+        if (sortedNewValStr !== sortedValidKeysFromNewValStr) {
+          this.$emit('input', [...validKeysFromNewVal]);
+          return;
+        }
+
+        if (sortedNewValStr !== sortedCurrentInternalNodeKeysStr) {
+          this.tempCheckedKeys = [...leafOnlyKeys];
+          this.updateCurrentSelectedNodesFromKeys(validKeysFromNewVal, true);
+        }
+      },
+      deep: true
+    },
+    filterText(val) {
+      if (this.$refs.taskTree) {
+        this.$refs.taskTree.filter(val);
+      }
+    },
+    popoverVisible(isVisible) {
+      if (isVisible) {
+        if (this.$refs.popover && this.$refs.popover.$refs.reference) {
+          this.triggerElRect = this.$refs.popover.$refs.reference.getBoundingClientRect();
+        }
+        this.tempCheckedKeys = [...this.value];
+        this.$nextTick(() => {
+          if (this.$refs.taskTree) {
+            this.$refs.taskTree.setCheckedKeys(this.tempCheckedKeys);
+          }
+        });
+      } else {
+        this.filterText = '';
+      }
+    }
+  },
+  mounted() {
+    // 过滤掉父节点,只保留子节点
+    const leafOnlyKeys = this.value.filter(key => {
+      const node = this.nodeMap[key];
+      return node && !node.isParent;
+    });
+    this.updateCurrentSelectedNodesFromKeys(leafOnlyKeys, true);
+  },
+  methods: {
+    processRawData(data) {
+      if (!data || !Array.isArray(data)) {
+        this.processedTreeData = [];
+        this.nodeMap = {};
+        return;
+      }
+      const newMap = {};
+      const mapNode = (node) => {
+        newMap[node[this.nodeKey]] = node;
+        if (node[this.treeProps.children] && node[this.treeProps.children].length) {
+          node[this.treeProps.children].forEach(mapNode);
+        }
+      };
+
+      this.processedTreeData = data.map(mainTask => {
+        const children = (mainTask.taskDetailList || []).map(detail => ({
+          [this.nodeKey]: detail.taskId,
+          [this.treeProps.label]: `${detail.qwUserId || '未命名子任务'}`,
+          isParent: false,
+          [this.treeProps.isLeaf]: true,
+          disabled: false, // 子节点可以选择
+          originalData: { ...detail, parentTaskId: mainTask.taskId }
+        }));
+
+        const parentNode = {
+          [this.nodeKey]: mainTask.taskId,
+          [this.treeProps.label]: mainTask.taskName,
+          isParent: true,
+          [this.treeProps.isLeaf]: children.length === 0,
+          disabled: true, // 父节点不可选择
+          [this.treeProps.children]: children,
+          originalData: { taskId: mainTask.taskId, taskName: mainTask.taskName }
+        };
+        mapNode(parentNode); // Add parent and its children to map
+        return parentNode;
+      });
+      this.nodeMap = newMap;
+    },
+    updateCurrentSelectedNodesFromKeys(keys, updateTreeVisualState = false) {
+      const newSelectedNodes = [];
+      const actualFoundKeys = [];
+
+      if (keys && Array.isArray(keys)) {
+        keys.forEach(key => {
+          const node = this.nodeMap[key];
+          // 只添加子节点到选中列表
+          if (node && !node.isParent) {
+            newSelectedNodes.push(node);
+            actualFoundKeys.push(key);
+          }
+        });
+      }
+
+      this.currentSelectedNodes = newSelectedNodes;
+
+      if (updateTreeVisualState && this.$refs.taskTree) {
+        this.$refs.taskTree.setCheckedKeys([...actualFoundKeys]);
+      }
+    },
+    filterNode(value, data) {
+      if (!value) return true;
+      return data[this.treeProps.label].toLowerCase().indexOf(value.toLowerCase()) !== -1;
+    },
+    handleTreeCheck(nodeData, checkStatus) {
+      // 如果是父节点,不允许选择
+      if (nodeData.isParent) {
+        // 恢复之前的选中状态
+        this.$refs.taskTree.setCheckedKeys(this.tempCheckedKeys);
+        return;
+      }
+
+      if (!this.multiple) {
+        const isNodeChecked = checkStatus.checkedKeys.includes(nodeData[this.nodeKey]);
+        if (isNodeChecked) {
+          this.tempCheckedKeys = [nodeData[this.nodeKey]];
+          this.$refs.taskTree.setCheckedKeys([nodeData[this.nodeKey]]); // Visually enforce single check
+        } else {
+          this.tempCheckedKeys = [];
+        }
+      } else {
+        // 只保留子节点的选中状态
+        const leafKeys = checkStatus.checkedKeys.filter(key => {
+          const node = this.nodeMap[key];
+          return node && !node.isParent;
+        });
+        this.tempCheckedKeys = leafKeys;
+        // 更新树的选中状态,确保只显示子节点被选中
+        this.$refs.taskTree.setCheckedKeys(leafKeys);
+      }
+    },
+    handleConfirm() {
+      let finalSelectedKeys = [];
+      let finalSelectedNodes = [];
+
+      if (this.$refs.taskTree) {
+        // 获取所有选中的节点
+        const allCheckedNodes = this.$refs.taskTree.getCheckedNodes();
+        // 只保留子节点(叶子节点)
+        finalSelectedNodes = allCheckedNodes.filter(node => !node.isParent);
+        finalSelectedKeys = finalSelectedNodes.map(node => node[this.nodeKey]);
+
+        if(!this.multiple) {
+          // 单选模式下,确保只选择子节点
+          const leafKeys = this.tempCheckedKeys.filter(key => {
+            const node = this.nodeMap[key];
+            return node && !node.isParent;
+          });
+          finalSelectedKeys = leafKeys;
+          finalSelectedNodes = finalSelectedKeys.map(key => this.nodeMap[key]).filter(Boolean);
+        }
+      }
+
+      this.$emit('input', finalSelectedKeys);
+      this.$emit('change', finalSelectedKeys, finalSelectedNodes);
+      this.updateCurrentSelectedNodesFromKeys(finalSelectedKeys, true);
+      this.popoverVisible = false;
+    },
+    handleClearInPopover() {
+      this.tempCheckedKeys = [];
+      if (this.$refs.taskTree) {
+        this.$refs.taskTree.setCheckedKeys([]);
+      }
+    },
+    handleClearOnTrigger() {
+      if (this.disabled) return;
+      this.tempCheckedKeys = [];
+      this.$emit('input', []);
+      this.$emit('change', [], []);
+      this.updateCurrentSelectedNodesFromKeys([], true);
+      if (this.$refs.taskTree) {
+        this.$refs.taskTree.setCheckedKeys([]);
+      }
+      this.popoverVisible = false;
+    },
+    removeTag(nodeToRemove) {
+      if (this.disabled) return;
+      const newKeys = this.value.filter(key => key !== nodeToRemove[this.nodeKey]);
+
+      this.$emit('input', newKeys);
+      this.$emit('change', newKeys, newKeys.map(k => this.nodeMap[k]).filter(Boolean));
+
+      this.tempCheckedKeys = [...newKeys];
+      this.updateCurrentSelectedNodesFromKeys(newKeys, true);
+      if (this.$refs.taskTree) {
+        this.$refs.taskTree.setCheckedKeys(newKeys);
+      }
+    },
+    onPopoverShow() {
+      if (this.$refs.popover && this.$refs.popover.$refs.reference) {
+        this.triggerElRect = this.$refs.popover.$refs.reference.getBoundingClientRect();
+      }
+      this.tempCheckedKeys = [...this.value];
+      this.$nextTick(() => {
+        if (this.$refs.taskTree) {
+          this.$refs.taskTree.setCheckedKeys(this.tempCheckedKeys);
+        }
+        if (this.filterable && this.$refs.popover && this.$refs.popover.$el) {
+          const inputEl = this.$refs.popover.$el.querySelector('.filter-input input');
+          if (inputEl) inputEl.focus();
+        }
+      });
+    }
+  }
+};
+</script>
+
+<style scoped>
+.task-select-tree {
+  display: inline-block;
+  position: relative;
+  font-size: 14px;
+}
+
+.select-trigger-wrapper {
+  background-color: #fff;
+  border-radius: 4px;
+  border: 1px solid #dcdfe6;
+  box-sizing: border-box;
+  color: #606266;
+  display: flex; /* Use flex for alignment */
+  align-items: center; /* Vertically align items */
+  min-height: 32px; /* Element UI default input height (small) or 40px (default) */
+  /* Adjust line-height or padding if min-height is larger */
+  padding: 0 30px 0 10px; /* Space for text/tags and icons */
+  position: relative;
+  transition: border-color .2s cubic-bezier(.645,.045,.355,1);
+  width: 100%;
+  cursor: pointer;
+  overflow: hidden; /* Hide overflow from tags */
+}
+.select-trigger-wrapper.is-disabled {
+  background-color: #f5f7fa;
+  border-color: #e4e7ed;
+  color: #c0c4cc;
+  cursor: not-allowed;
+}
+.select-trigger-wrapper.is-disabled .trigger-tag {
+  background-color: #f0f2f5;
+  border-color: #e9e9eb;
+  color: #909399;
+}
+.select-trigger-wrapper.is-disabled .trigger-tag .el-tag__close {
+  color: #909399;
+}
+.select-trigger-wrapper:hover:not(.is-disabled) {
+  border-color: #c0c4cc;
+}
+.select-trigger-wrapper.is-active:not(.is-disabled) {
+  border-color: #409eff;
+}
+
+.tags-or-value-container {
+  flex-grow: 1; /* Allow this container to take available space */
+  display: flex;
+  flex-wrap: wrap; /* For multiple tags */
+  gap: 5px; /* Space between tags */
+  align-items: center;
+  overflow: hidden; /* Prevent content from pushing icons */
+  padding: 2px 0; /* Small padding for tags not to touch border */
+}
+
+.trigger-tag {
+  /* margin-right: 5px; /* Use gap if supported, otherwise this */
+  /* margin-bottom: 2px;
+  margin-top: 2px; */
+}
+
+.single-value-display {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #606266;
+  line-height: 30px; /* Adjust if trigger height changes */
+}
+
+.placeholder-text {
+  color: #c0c4cc;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  line-height: 30px; /* Adjust if trigger height changes */
+}
+
+.icons-container {
+  position: absolute;
+  right: 5px;
+  top: 50%;
+  transform: translateY(-50%);
+  display: flex;
+  align-items: center;
+  color: #c0c4cc;
+}
+.icons-container .clear-icon {
+  cursor: pointer;
+  margin-right: 5px;
+  display: none;
+  font-size: 14px;
+}
+.select-trigger-wrapper:hover .clear-icon {
+  /* Only show if showClearIcon is true (handled by v-if) */
+  display: inline-block;
+}
+.icons-container .arrow-icon {
+  transition: transform .3s;
+  font-size: 14px;
+}
+.icons-container .arrow-icon.is-reverse {
+  transform: rotate(180deg);
+}
+
+/* Popover Content */
+.popover-content-wrapper {
+  display: flex;
+  flex-direction: column;
+}
+.filter-input {
+  margin-bottom: 8px;
+}
+.tree-scrollbar {
+  /* height is set by prop */
+  border: 1px solid #ebeef5;
+  border-radius: 2px;
+}
+.el-scrollbar__wrap { /* Make sure scrollbar wrap doesn't add extra space */
+  overflow-x: hidden;
+}
+.task-tree-in-popover {
+  min-height: 50px; /* Prevent collapse if empty */
+}
+.custom-tree-node {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 14px;
+  padding-right: 8px;
+}
+.node-detail-text {
+  font-size: 12px;
+  color: #909399;
+  margin-left: 8px;
+}
+
+.popover-footer {
+  text-align: right;
+  padding-top: 10px;
+  border-top: 1px solid #ebeef5;
+  margin-top: 10px;
+}
+</style>
+
+<style>
+/* Global style for popper to customize padding */
+.task-select-tree-popper.el-popover {
+  padding: 12px; /* Adjust padding of the popper itself */
+}
+</style>

+ 2 - 2
src/store/modules/user.js

@@ -84,9 +84,9 @@ const user = {
       })
     },
 
-    GetSipAccount({ commit, state }) {
+    GetSipAccount({ commit, state },param) {
       return new Promise((resolve, reject) => {
-        getSipAccount().then(res => {
+        getSipAccount(param).then(res => {
           console.log(res)
           if(res.code==200){
             commit('SET_CALL_USER', res.data.data.response.data.user)

+ 4 - 2
src/utils/call.js

@@ -25,7 +25,7 @@ function webphoneHandle(type, data, options) {
 	
 }
 
-export function callNumber(customerId,contactsId,orderId){
+export function callNumber(customerId,contactsId,orderId,callerLine){
 	
 	const callUser = store.getters && store.getters.callUser
 	const callRealm = store.getters && store.getters.callRealm
@@ -70,7 +70,9 @@ export function callNumber(customerId,contactsId,orderId){
 			})
 			_phone.start({});
 	}
-	var data={customerId:customerId,contactsId:contactsId,orderId:orderId};
+	
+	var data={customerId:customerId,contactsId:contactsId,orderId:orderId,callerId:callerLine};
+	
 	this.callMobile(data).then(response => {
         if(response.code==200){
 			_phone.call(response.mobile,{userdata:response.logs.sessionId});

+ 32 - 3
src/views/company/companyVoiceCaller/index.vue

@@ -72,6 +72,7 @@
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="ID" align="center" prop="callerId" />
       <el-table-column label="员工姓名" align="center" prop="companyUserNickName" />
+      <el-table-column label="线路" align="center" prop="callerLine" />
       <el-table-column label="坐席号" align="center" prop="callerNo" />
       <el-table-column label="手机号" align="center" prop="mobile" />
       <!-- <el-table-column label="状态" align="center" prop="status" >
@@ -116,7 +117,17 @@
               />
           </el-select>
         </el-form-item>
-        <el-form-item label="坐席" prop="callerId">
+        <el-form-item label="线路" prop="callerLine">
+          <el-select v-model="form.callerLine"  @change="handleCallerLineChange"  placeholder="请选择线路" clearable size="small">
+              <el-option
+                v-for="item in callerApis"
+                :key="item.apiId"
+                :label="item.apiName"
+                :value="item.apiId"
+              />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="坐席" prop="callerId" v-if="form.callerLine != null">
           <el-select v-model="form.callerId"    placeholder="请选择坐席" clearable size="small">
               <el-option
                 v-for="item in callers"
@@ -163,12 +174,14 @@
 import { bindCallerNo,listCompanyVoiceCaller, getCompanyVoiceCaller, delCompanyVoiceCaller, addCompanyVoiceCaller, updateCompanyVoiceCaller, exportCompanyVoiceCaller } from "@/api/company/companyVoiceCaller";
 import { getUserList } from "@/api/company/companyUser";
 import { getCallerList } from "@/api/company/companyVoiceCaller";
+import {getCallerApiList} from "@/api/company/companyVoiceApi"
 
 import { sendSmsCode } from "@/api/common";
 export default {
   name: "CompanyCaller",
   data() {
     return {
+      callerApis:[],
       callers:[],
       // codeShow: true, // 获取验证码样式
       // codeFlag:true,
@@ -217,6 +230,9 @@ export default {
         callerId: [
           { required: true, message: "坐席编号不能为空", trigger: "blur" }
         ],
+        callerLine:[
+          { required: true, message: "线路不能为空", trigger: "blur" }
+        ]
         
         // code: [
         //   { required: true, message: "验证码不能为空", trigger: "blur" }
@@ -281,11 +297,23 @@ export default {
     userChange(e){
       console.log(e)
     },
+    handleCallerLineChange(){
+      this.getCallerList();
+    },
+
     getCallerList() {
-      getCallerList().then(response => {
+      console.log("-------------------" + JSON.stringify(this.form))
+      const param = {callerLine :this.form.callerLine}
+      getCallerList(param).then(response => {
         this.callers = response.data;
       });
     },
+    getCallerApiList() {
+      const param = {status:1}
+      getCallerApiList(param).then(response => {
+        this.callerApis = response.rows;
+      });
+    },
     getUserList() {
       getUserList().then(response => {
         this.users = response.data;
@@ -338,7 +366,8 @@ export default {
       this.reset();
       this.open = true;
       this.title = "员工坐席绑定";
-      this.getCallerList();
+      this.getCallerApiList();
+      // this.getCallerList();
     },
     /** 修改按钮操作 */
     // handleUpdate(row) {

+ 46 - 8
src/views/crm/customer/my.vue

@@ -122,7 +122,7 @@
           size="mini"
           :disabled="multiple"
           @click="handleAssist"
-          v-hasPermi="['crm:customer:assistToUser']"
+         
         >客户协作</el-button>
       </el-col>  
       <el-col :span="1.5">
@@ -175,12 +175,6 @@
               </el-button>
             </span>
         </el-dropdown>
-
-<!--        <el-button-->
-<!--          type="success"-->
-<!--          size="mini"-->
-<!--          @click="addPackageOrder"-->
-<!--        >创建订单</el-button>-->
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -200,6 +194,24 @@
           v-hasPermi="['crm:customer:export']"
         >导出</el-button>
       </el-col>
+     
+       <!-- 新增选择外呼线路的下拉框 -->
+      <el-col :span="2">
+        <el-select
+          v-model="selectedCallerLine"
+          placeholder="外呼线路"
+          size="mini"
+          style="width: 100%;"
+          @change="changeCallerLine"
+        >
+        <el-option
+          v-for="item in callerApis"
+          :key="item.callerId"
+          :label="item.callerLine"
+          :value="item.callerId"
+        />
+        </el-select>
+      </el-col>
 	  <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
@@ -214,7 +226,7 @@
       <el-table-column  label="手机" width="120px"  align="center" prop="mobile"   >
         <template slot-scope="scope">
           {{scope.row.mobile}}
-          <el-button type="text"    size="mini" @click="callNumber(scope.row.customerId,null)">拨号</el-button>
+          <el-button type="text"    size="mini" @click="callNumber(scope.row.customerId,null,null,selectedCallerLine)">拨号</el-button>
           <el-button v-hasPermi="['crm:customer:addVisit']"  type="text" size="mini" @click="handleAddVisit(scope.row)">写跟进</el-button>
           <el-button type="text"    size="mini" @click="addPackageOrder()" style="margin-right: 15px;">创建订单</el-button>
         </template>
@@ -357,11 +369,15 @@ import addCustomerType from '../components/addCustomerType.vue';
 import addVisitStatus from '../components/addVisitStatus.vue';
 import addPackage from "@/views/store/components/addOrder";
 import addOrderOffline from "@/views/store/components/addOrderOffline";
+import {getMyCallerApiList} from "@/api/company/companyVoiceCaller"
+import { getSipAccount } from "@/api/company/companyVoiceApi"
 export default {
   name: "Customer",
   components: {addPackage,addOrderOffline,addVisitStatus,addCustomerType,addRemark,addTag,assignUser,assistUser,addOrEditCustomer,editSource, addBatchSms,customerDetails,addVisit },
   data() {
     return {
+      selectedCallerLine:null,
+      callerApis:[], //我的线路
       addOfflineOrder:{
         open:false,
       },
@@ -440,6 +456,10 @@ export default {
         title:"客户详情",
         open:false,
       },
+      callerShow:{
+        title:"外呼线路",
+        open:false,
+      },
       // 选中数组
       ids: [],
       // 非单个禁用
@@ -527,8 +547,26 @@ export default {
     });
     this.getCitys();
     this.getList();
+    this.getCallerApiList();
   },
   methods: {
+    getCallerApiList() {
+      getMyCallerApiList().then(response => {
+        this.callerApis = response.rows;
+        this.selectedCallerLine = this.callerApis[0].callerId
+        this.changeCallerLine();
+      });
+    },
+    changeCallerLine(){
+      const param = {callerId:this.selectedCallerLine}
+      // getSipAccount(param)
+      this.$store.dispatch('GetSipAccount',param).then(() => {
+
+      }).catch(err => {
+
+      });
+
+    },
     handleCommand(command){
       if (command==="1"){
         this.addOfflineOrder.open = true

+ 16 - 25
src/views/qw/qwChat/qq.vue

@@ -43,10 +43,18 @@
             />
           </div>
         </template>
-        <template #message-title>
+        <template #message-title="contact">
 <!--          <div @click="openDrawer('right')" style="position: absolute;right: 14px;top: 10px;">-->
 <!--            <i class="el-icon-more" style="cursor: pointer"/>-->
 <!--          </div>-->
+          <div>
+            <el-button
+              type="primary"
+              size="small"
+              style="position: absolute;right: 14px;top: 10px;z-index: 1000"
+              @click="showDetail(contact.extId)"
+            >详情</el-button>
+          </div>
         </template>
       </lemon-imui>
     </div>
@@ -187,7 +195,6 @@ export default {
     },
     shareCourse(nv) {
       if (nv) {
-        console.log('shareCourse', nv)
         // 发送小程序卡片消息
         const IMUI = this.$refs.IMUI;
         const contact = IMUI.currentContact;
@@ -197,28 +204,14 @@ export default {
 
         // 创建消息对象
         let message = {
-          id: generateUUID(),
-          status: 'going',
           type: 'miniprogram',
-          sendTime: Date.now(),
-          content: {
-            appid: nv.miniprogramAppid,
-            pagepath: nv.miniprogramPage,
-            title: nv.miniprogramTitle,
-            thumbnail: nv.miniprogramPicUrl
-          },
+          content: nv,
           toContactId: contact.conversationId,
-          fromUser: {
-            id: this.qwUser.id,
-            displayName: this.qwUser.qwUserName,
-            avatar: "https://cos.his.cdwjyyh.com/fs/20241231/22a765a96da247d1b83ea94fef438a41.png"
-          },
         };
 
         this.detail.open = false
         this.$store.dispatch('qwIm/shareCourse', null)
 
-        this.appendRemoteMessage(message)
         // 使用handleSend方法发送消息
         this.handleSend(
           message,
@@ -399,7 +392,7 @@ export default {
             this.appendRemoteMessage(data)
             let conversation = IMUI.findConversation(message.toContactId);
             conversation.lastSendTime = message.sendTime;
-            conversation.lastContent = message.content;
+            conversation.lastContent = IMUI.lastContentRender(message)
             IMUI.topPopConversations(conversation);
             next();
           } else {
@@ -420,7 +413,7 @@ export default {
               if(code === 200){
                 let conversation = IMUI.findConversation(message.toContactId);
                 conversation.lastSendTime = message.sendTime;
-                conversation.lastContent = message.content;
+                conversation.lastContent = IMUI.lastContentRender(message)
                 IMUI.topPopConversations(conversation);
                 next();
               } else {
@@ -436,19 +429,17 @@ export default {
         params = {
           "sessionId": message.toContactId,
           "appKey": this.qwUser.appKey,
-          "content": JSON.stringify(message.content),
+          "content": message.content,
           "msgType": 5 // 小程序消息类型
         };
         sendMsg(params).then(response => {
-          const {code} = response
+          const {code, data} = response
           if(code === 200){
+            this.appendRemoteMessage(data)
             let conversation = IMUI.findConversation(message.toContactId);
             conversation.lastSendTime = message.sendTime;
-            conversation.lastContent = "小程序";
+            conversation.lastContent = IMUI.lastContentRender(message)
             IMUI.topPopConversations(conversation);
-            next && next();
-          } else {
-            next && next({status:'failed'})
           }
         });
       }

+ 5 - 23
src/views/qw/qwChat/userDetail/index.vue

@@ -102,8 +102,11 @@
         </div>
         <!-- 近七天看课记录 -->
         <div>
-          <div class="section-title">
-            近七天看课记录
+          <div style="display: flex;justify-content: space-between;align-items: center;flex-direction: row;background: #FFF;padding: 10px 0 20px 0">
+            <div class="section-title">
+              近七天看课记录
+            </div>
+            <el-button size="mini" round @click="courseManage">课程管理</el-button>
           </div>
           <div class="course-record-container">
             <div
@@ -125,27 +128,6 @@
         </div>
       </div>
 
-      <!-- 按钮 -->
-      <div>
-        <div style="display: flex;justify-content: space-evenly;align-items: center;flex-direction: row;background: #FFF;padding: 10px 0 20px 0">
-          <div>
-            <el-button style="width: 150px;height: 35px;background-color: #1890ff;color: #fff;border: none;
-              border-radius: 22px;
-              font-size: 12px;
-              cursor: pointer;
-              transition: background 0.2s;"
-              @click="courseManage">课程管理</el-button>
-          </div>
-          <div>
-            <el-button style="width: 150px;height: 35px;background-color: #1890ff;color: #fff;border: none;
-              border-radius: 22px;
-              font-size: 12px;
-              cursor: pointer;
-              transition: background 0.2s;"
-              @click="remindCourseManage">催课管理</el-button>
-          </div>
-        </div>
-      </div>
     </div>
 
     <!-- 修改用户信息 -->

+ 290 - 0
src/views/statistics/section/channel.vue

@@ -0,0 +1,290 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="公司名" prop="companyId">
+        <el-select filterable style="width: 220px" v-model="queryParams.companyId" @change="handleSeller" placeholder="请选择公司名" clearable size="small">
+          <el-option
+            v-for="item in companys"
+            :key="item.companyId"
+            :label="item.companyName"
+            :value="item.companyId"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="销售" prop="nickName" v-if="queryParams.companyId">
+        <el-select v-model="queryParams.companyUserId" remote
+                   placeholder="请选择"
+                   filterable clearable
+                   style="width: 100%;"
+                   @keyup.enter.native="handleQuery"
+                   @change="handleCompanyUserId"
+        >
+          <el-option
+            v-for="dict in companyUserList"
+            :key="`${dict.nickName} - ${dict.userName}`"
+            :label="`${dict.nickName} - ${dict.userName}`"
+            :value="dict.userId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="时间范围" prop="dateRange">
+        <el-date-picker
+          v-model="dateRange"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="SOP任务" prop="channel" label-width="70px">
+        <select-tree
+          v-model="selectedMultipleTasks"
+          :raw-data="channelList"
+          placeholder="请选择多个任务"
+          :multiple="true"
+          component-width="300px"
+          :max-display-tags="3"
+          :check-strictly="false"
+          :return-leaf-only="false"
+          @change="handleMultiChange"
+        ></select-tree>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['system:stats:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <!-- 警告提示 -->
+    <el-alert
+      title="待激活人数依赖进粉时的自动标记和员工手动标记是可变的,相应的目标人数和进线完播率受此影响;为了不受进粉期人数变化影响,第二天新进报名产生的观后数据不做统计;辅助工作台人数不一致可能是受进粉影响,也有可能是员工删除了好友或者取消了客户频道报名。"
+      type="warning"
+      :closable="false"
+      show-icon
+      class="mb8">
+    </el-alert>
+
+    <el-table border v-loading="loading" :data="statsList" @selection-change="handleSelectionChange" show-summary>
+      <!-- 未上线部分 -->
+      <el-table-column prop="periodName" label="sop营期" width="180" align="center"/>
+<!--      <el-table-column prop="deptName" label="所属部门" width="180" align="center"/>-->
+<!--      <el-table-column prop="companyUserName" label="员工"  />-->
+      <el-table-column prop="trainCampNum" label="营期人数"  align="center" />
+      <el-table-column prop="notRegisteredNum" label="待看课"  align="center" />
+      <el-table-column prop="registeredNum" label="看课中断"  align="center" />
+      <el-table-column prop="registeredNum" label="已完课"  align="center" />
+      <el-table-column prop="regRate" label="报名率"  align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.regRate }}%</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="finishedRate" label="完课率"  align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.finishedRate }}%</span>
+        </template>
+      </el-table-column>
+      <!--        汇总-->
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+import { listEmployeeStats, getEmployeeList, getChannelList, exportEmployeeStats,getSOPTaskData,listPeriodList} from "@/api/system/employeeStats";
+import {getCompanyList} from "@/api/company/company";
+import {getUserList} from "@/api/company/companyUser";
+import SelectTree from "@/components/TreeSelect/index.vue";
+
+export default {
+  name: "EmployeeStats",
+  components: {SelectTree},
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      companys:[],
+      selectedMultipleTasks: [],
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 员工统计表格数据
+      statsList: [],
+      // 员工列表
+      employeeList: [],
+      companyUserList: [],
+      // 频道列表
+      channelList: [],
+      // 日期范围
+      dateRange: [],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        channel: null,
+        startDate: null,
+        endDate: null,
+        companyId: null,
+        periodList: []
+      },
+      // 总体统计
+      totalStats: {
+        totalEmployees: 0,
+        onlineEmployees: 0,
+        offlineEmployees: 0,
+        completionRate: '0.00'
+      }
+    };
+  },
+  created() {
+    this.getList();
+
+    getCompanyList().then(response => {
+      this.companys = response.data;
+    });
+
+    getSOPTaskData().then(response => {
+      this.channelList = response.data;
+    });
+
+  },
+  methods: {
+    handleCompanyUserId(val){
+      if(val == null || val === '') {
+        this.queryParams.companyUserId = null;
+        this.queryParams.userIds = [];
+      }
+    },
+    handleMultiChange(e){
+
+    },
+    handleSeller(){
+      if(this.queryParams.companyId != null) {
+        getUserList(this.queryParams.companyId).then(res=>{
+          if(res.code === 200) {
+            this.companyUserList = res.data
+          }
+        })
+      } else {
+        this.queryParams.companyUserId = null;
+      }
+    },
+    /** 查询员工统计列表 */
+    getList() {
+      this.loading = true;
+      if (this.dateRange && this.dateRange.length === 2) {
+        this.queryParams.startDate = this.dateRange[0];
+        this.queryParams.endDate = this.dateRange[1];
+      } else {
+        this.queryParams.startDate = null;
+        this.queryParams.endDate = null;
+      }
+
+      listPeriodList(this.queryParams).then(response => {
+        console.log(response)
+        this.statsList = response.data;
+        this.loading = false;
+      });
+    },
+    /** 获取员工列表 */
+    getEmployeeList() {
+      listPeriodList().then(response => {
+        this.employeeList = response.data || [];
+      });
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.queryParams.periodList = this.selectedMultipleTasks;
+      if(this.queryParams.companyUserId) {
+        this.queryParams.userIds = [this.queryParams.companyUserId];
+      }
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.dateRange = [];
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id);
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('system/employeeStats/export', {
+        ...this.queryParams
+      }, `员工完成统计_${new Date().getTime()}.xlsx`);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.stats-card {
+  text-align: center;
+  margin-bottom: 16px;
+
+  .stats-number {
+    font-size: 24px;
+    font-weight: bold;
+    color: #409EFF;
+
+    &.online {
+      color: #67C23A;
+    }
+
+    &.offline {
+      color: #F56C6C;
+    }
+
+    &.rate {
+      color: #E6A23C;
+    }
+  }
+}
+
+.mb8 {
+  margin-bottom: 8px;
+}
+
+::v-deep .el-table .el-table__header th {
+  background-color: #f5f7fa;
+}
+
+::v-deep .el-alert {
+  margin-bottom: 16px;
+}
+</style>

+ 289 - 0
src/views/statistics/section/index.vue

@@ -0,0 +1,289 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="公司名" prop="companyId">
+        <el-select filterable style="width: 220px" v-model="queryParams.companyId" @change="handleSeller" placeholder="请选择公司名" clearable size="small">
+          <el-option
+            v-for="item in companys"
+            :key="item.companyId"
+            :label="item.companyName"
+            :value="item.companyId"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="销售" prop="nickName" v-if="queryParams.companyId">
+        <el-select v-model="queryParams.companyUserId" remote
+                   placeholder="请选择"
+                   filterable clearable
+                   style="width: 100%;"
+                   @keyup.enter.native="handleQuery"
+                   @change="handleCompanyUserId"
+        >
+          <el-option
+            v-for="dict in companyUserList"
+            :key="`${dict.nickName} - ${dict.userName}`"
+            :label="`${dict.nickName} - ${dict.userName}`"
+            :value="dict.userId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="时间范围" prop="dateRange">
+        <el-date-picker
+          v-model="dateRange"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="SOP任务" prop="channel" label-width="70px">
+        <select-tree
+          v-model="selectedMultipleTasks"
+          :raw-data="channelList"
+          placeholder="请选择多个任务"
+          :multiple="true"
+          component-width="300px"
+          :max-display-tags="3"
+          :check-strictly="false"
+          :return-leaf-only="false"
+        @change="handleMultiChange"
+        ></select-tree>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['system:stats:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <!-- 警告提示 -->
+    <el-alert
+      title="待激活人数依赖进粉时的自动标记和员工手动标记是可变的,相应的目标人数和进线完播率受此影响;为了不受进粉期人数变化影响,第二天新进报名产生的观后数据不做统计;辅助工作台人数不一致可能是受进粉影响,也有可能是员工删除了好友或者取消了客户频道报名。"
+      type="warning"
+      :closable="false"
+      show-icon
+      class="mb8">
+    </el-alert>
+
+    <el-table border v-loading="loading" :data="statsList" @selection-change="handleSelectionChange" show-summary>
+      <!-- 未上线部分 -->
+        <el-table-column prop="deptName" label="所属部门" width="180" align="center"/>
+        <el-table-column prop="companyUserName" label="员工"  />
+        <el-table-column prop="trainCampNum" label="营期人数"  align="center" />
+        <el-table-column prop="notRegisteredNum" label="待看课"  align="center" />
+        <el-table-column prop="registeredNum" label="看课中断"  align="center" />
+        <el-table-column prop="registeredNum" label="已完课"  align="center" />
+        <el-table-column prop="regRate" label="报名率"  align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.regRate }}%</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="finishedRate" label="完课率"  align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.finishedRate }}%</span>
+          </template>
+        </el-table-column>
+<!--        汇总-->
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+import { listEmployeeStats, getEmployeeList, getChannelList, exportEmployeeStats,getSOPTaskData} from "@/api/system/employeeStats";
+import {getCompanyList} from "@/api/company/company";
+import {getUserList} from "@/api/company/companyUser";
+import SelectTree from "@/components/TreeSelect/index.vue";
+
+export default {
+  name: "EmployeeStats",
+  components: {SelectTree},
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      companys:[],
+      selectedMultipleTasks: [],
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 员工统计表格数据
+      statsList: [],
+      // 员工列表
+      employeeList: [],
+      companyUserList: [],
+      // 频道列表
+      channelList: [],
+      // 日期范围
+      dateRange: [],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        channel: null,
+        startDate: null,
+        endDate: null,
+        companyId: null,
+        periodList: []
+      },
+      // 总体统计
+      totalStats: {
+        totalEmployees: 0,
+        onlineEmployees: 0,
+        offlineEmployees: 0,
+        completionRate: '0.00'
+      }
+    };
+  },
+  created() {
+    this.getList();
+
+    getCompanyList().then(response => {
+      this.companys = response.data;
+    });
+
+    getSOPTaskData().then(response => {
+      this.channelList = response.data;
+    });
+
+  },
+  methods: {
+    handleCompanyUserId(val){
+      if(val == null || val === '') {
+        this.queryParams.companyUserId = null;
+        this.queryParams.userIds = [];
+      }
+    },
+    handleMultiChange(e){
+
+    },
+    handleSeller(){
+      if(this.queryParams.companyId != null) {
+        getUserList(this.queryParams.companyId).then(res=>{
+          if(res.code === 200) {
+            this.companyUserList = res.data
+          }
+        })
+      } else {
+        this.queryParams.companyUserId = null;
+      }
+    },
+    /** 查询员工统计列表 */
+    getList() {
+      this.loading = true;
+      if (this.dateRange && this.dateRange.length === 2) {
+        this.queryParams.startDate = this.dateRange[0];
+        this.queryParams.endDate = this.dateRange[1];
+      } else {
+        this.queryParams.startDate = null;
+        this.queryParams.endDate = null;
+      }
+
+      listEmployeeStats(this.queryParams).then(response => {
+        console.log(response)
+        this.statsList = response.data;
+        this.loading = false;
+      });
+    },
+    /** 获取员工列表 */
+    getEmployeeList() {
+      getEmployeeList().then(response => {
+        this.employeeList = response.data || [];
+      });
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.queryParams.periodList = this.selectedMultipleTasks;
+      if(this.queryParams.companyUserId) {
+        this.queryParams.userIds = [this.queryParams.companyUserId];
+      }
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.dateRange = [];
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id);
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('system/employeeStats/export', {
+        ...this.queryParams
+      }, `员工完成统计_${new Date().getTime()}.xlsx`);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.stats-card {
+  text-align: center;
+  margin-bottom: 16px;
+
+  .stats-number {
+    font-size: 24px;
+    font-weight: bold;
+    color: #409EFF;
+
+    &.online {
+      color: #67C23A;
+    }
+
+    &.offline {
+      color: #F56C6C;
+    }
+
+    &.rate {
+      color: #E6A23C;
+    }
+  }
+}
+
+.mb8 {
+  margin-bottom: 8px;
+}
+
+::v-deep .el-table .el-table__header th {
+  background-color: #f5f7fa;
+}
+
+::v-deep .el-alert {
+  margin-bottom: 16px;
+}
+</style>

+ 288 - 0
src/views/statistics/section/today.vue

@@ -0,0 +1,288 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="公司名" prop="companyId">
+        <el-select filterable style="width: 220px" v-model="queryParams.companyId" @change="handleSeller" placeholder="请选择公司名" clearable size="small">
+          <el-option
+            v-for="item in companys"
+            :key="item.companyId"
+            :label="item.companyName"
+            :value="item.companyId"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="销售" prop="nickName" v-if="queryParams.companyId">
+        <el-select v-model="queryParams.companyUserId" remote
+                   placeholder="请选择"
+                   filterable clearable
+                   style="width: 100%;"
+                   @keyup.enter.native="handleQuery"
+                   @change="handleCompanyUserId"
+        >
+          <el-option
+            v-for="dict in companyUserList"
+            :key="`${dict.nickName} - ${dict.userName}`"
+            :label="`${dict.nickName} - ${dict.userName}`"
+            :value="dict.userId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="时间范围" prop="dateRange">
+        <el-date-picker
+          v-model="dateRange"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="SOP任务" prop="channel" label-width="70px">
+        <select-tree
+          v-model="selectedMultipleTasks"
+          :raw-data="channelList"
+          placeholder="请选择多个任务"
+          :multiple="true"
+          component-width="300px"
+          :max-display-tags="3"
+          :check-strictly="false"
+          :return-leaf-only="false"
+          @change="handleMultiChange"
+        ></select-tree>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['system:stats:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <!-- 警告提示 -->
+    <el-alert
+      title="待激活人数依赖进粉时的自动标记和员工手动标记是可变的,相应的目标人数和进线完播率受此影响;为了不受进粉期人数变化影响,第二天新进报名产生的观后数据不做统计;辅助工作台人数不一致可能是受进粉影响,也有可能是员工删除了好友或者取消了客户频道报名。"
+      type="warning"
+      :closable="false"
+      show-icon
+      class="mb8">
+    </el-alert>
+
+    <el-table border v-loading="loading" :data="statsList" @selection-change="handleSelectionChange" show-summary>
+      <!-- 未上线部分 -->
+      <el-table-column prop="dataDate" label="日期" width="180" align="center"/>
+      <el-table-column prop="trainCampNum" label="营期人数"  align="center" />
+      <el-table-column prop="notRegisteredNum" label="待看课"  align="center" />
+      <el-table-column prop="registeredNum" label="看课中断"  align="center" />
+      <el-table-column prop="registeredNum" label="已完课"  align="center" />
+      <el-table-column prop="regRate" label="报名率"  align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.regRate }}%</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="finishedRate" label="完课率"  align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.finishedRate }}%</span>
+        </template>
+      </el-table-column>
+      <!--        汇总-->
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+import { listTodayList, getEmployeeList, getChannelList, exportEmployeeStats,getSOPTaskData} from "@/api/system/employeeStats";
+import {getCompanyList} from "@/api/company/company";
+import {getUserList} from "@/api/company/companyUser";
+import SelectTree from "@/components/TreeSelect/index.vue";
+
+export default {
+  name: "EmployeeStats",
+  components: {SelectTree},
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      companys:[],
+      selectedMultipleTasks: [],
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 员工统计表格数据
+      statsList: [],
+      // 员工列表
+      employeeList: [],
+      companyUserList: [],
+      // 频道列表
+      channelList: [],
+      // 日期范围
+      dateRange: [],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        channel: null,
+        startDate: null,
+        endDate: null,
+        companyId: null,
+        periodList: []
+      },
+      // 总体统计
+      totalStats: {
+        totalEmployees: 0,
+        onlineEmployees: 0,
+        offlineEmployees: 0,
+        completionRate: '0.00'
+      }
+    };
+  },
+  created() {
+    this.getList();
+
+    getCompanyList().then(response => {
+      this.companys = response.data;
+    });
+
+    getSOPTaskData().then(response => {
+      this.channelList = response.data;
+    });
+
+  },
+  methods: {
+    handleCompanyUserId(val){
+      if(val == null || val === '') {
+        this.queryParams.companyUserId = null;
+        this.queryParams.userIds = [];
+      }
+    },
+    handleMultiChange(e){
+
+    },
+    handleSeller(){
+      if(this.queryParams.companyId != null) {
+        getUserList(this.queryParams.companyId).then(res=>{
+          if(res.code === 200) {
+            this.companyUserList = res.data
+          }
+        })
+      } else {
+        this.queryParams.companyUserId = null;
+      }
+    },
+    /** 查询员工统计列表 */
+    getList() {
+      this.loading = true;
+      if (this.dateRange && this.dateRange.length === 2) {
+        this.queryParams.startDate = this.dateRange[0];
+        this.queryParams.endDate = this.dateRange[1];
+      } else {
+        this.queryParams.startDate = null;
+        this.queryParams.endDate = null;
+      }
+
+      listTodayList(this.queryParams).then(response => {
+        console.log(response)
+        this.statsList = response.data;
+        this.loading = false;
+      });
+    },
+    /** 获取员工列表 */
+    getEmployeeList() {
+      getEmployeeList().then(response => {
+        this.employeeList = response.data || [];
+      });
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.queryParams.periodList = this.selectedMultipleTasks;
+      if(this.queryParams.companyUserId) {
+        this.queryParams.userIds = [this.queryParams.companyUserId];
+      }
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.dateRange = [];
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id);
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('system/employeeStats/export', {
+        ...this.queryParams
+      }, `员工完成统计_${new Date().getTime()}.xlsx`);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.stats-card {
+  text-align: center;
+  margin-bottom: 16px;
+
+  .stats-number {
+    font-size: 24px;
+    font-weight: bold;
+    color: #409EFF;
+
+    &.online {
+      color: #67C23A;
+    }
+
+    &.offline {
+      color: #F56C6C;
+    }
+
+    &.rate {
+      color: #E6A23C;
+    }
+  }
+}
+
+.mb8 {
+  margin-bottom: 8px;
+}
+
+::v-deep .el-table .el-table__header th {
+  background-color: #f5f7fa;
+}
+
+::v-deep .el-alert {
+  margin-bottom: 16px;
+}
+</style>