Commit 1e4e41ea authored by 赵茹林's avatar 赵茹林

实时数据基本信息

通话次数
parent 5792c118
......@@ -432,7 +432,7 @@
color: #666;
}
</style>
<style>
<style lang="less" scoped>
.disabled .el-upload--picture-card {
display: none !important;
}
......
......@@ -571,6 +571,9 @@
goToTeacherDetail(row){
// this.$router.push('/teacher/'+ row.id);
this.dialogDetail.id = row.id;
this.dialogDetail.alias = row.alias;
this.dialogDetail.name = row.name;
this.dialogDetail.adviser = row.adviser;
this.dialogDetail.show = true
}
......
<template>
<div class="customer">
<el-row :gutter="20">
<el-col :span="24">
<el-card v-loading="infoLoading">
<div slot="header" class="clearfix">
<span style="font-size: 18px;font-weight: bold;padding-right: 20px;">今日实时数据</span>
<el-button size="mini" type="primary" @click="getData">刷新</el-button>
</div>
<div>
<el-breadcrumb style="padding-bottom: 30px;">
<el-breadcrumb-item class="hand" @click.native="customerNum('查看', 2)">
通次:<span>{{infoData.phone_counts}}</span>
</el-breadcrumb-item>
<el-breadcrumb-item>通时:{{infoData.phone_total_time}}min</el-breadcrumb-item>
<el-breadcrumb-item>聊天次数:{{infoData.chat_counts}}</el-breadcrumb-item>
<el-breadcrumb-item>沟通人数:{{infoData.chat_contact_count}}</el-breadcrumb-item>
<el-breadcrumb-item class="hand" @click.native="customerNum('查看聊天记录', 1)">
有效沟通:<span>{{infoData.valid_chat_contact_count}}</span>
</el-breadcrumb-item>
</el-breadcrumb>
<el-breadcrumb>
<el-breadcrumb-item class="hand">总好友:<span>{{infoData.wechat_friend_total}}</span></el-breadcrumb-item>
<el-breadcrumb-item class="hand">添加好友:<span>{{infoData.add_friend}}</span></el-breadcrumb-item>
<el-breadcrumb-item class="hand">待添加好友:<span>{{infoData.wait_add_friend}}</span></el-breadcrumb-item>
<el-breadcrumb-item>好友处理率:{{ infoData.wait_add_friend ? parseInt(strip(infoData.add_friend*100/infoData.wait_add_friend)) + '%' : '-' }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</el-card>
</el-col>
</el-row>
<el-dialog
append-to-body :visible.sync="dialogTableVisible"
width="90%" top="5vh" :title="dialogTitle">
<div class="block">
<el-date-picker v-model="realTime" type="date" placeholder="选择日期"></el-date-picker>
</div>
<!--<div style="font-weight: 600;padding-top: 14px;">老师名:小磊老师 销售顾问:张新月 T4</div>-->
<table class="custom-table">
<thead>
<tr>
<th v-for="th in table.th">{{th}}</th>
</tr>
</thead>
<tbody>
<tr v-if="table.td1.length">
<td v-for="td in table.td1">{{td}}</td>
</tr>
<tr v-if="table.td2.length">
<td v-for="td in table.td2">{{td}}</td>
</tr>
<tr v-if="table.td3.length">
<td v-for="td in table.td3">{{td}}</td>
</tr>
<!--<tr>
<td v-for="td in table.td1">{{td}}</td>
</tr>-->
</tbody>
</table>
<el-table :data="gridData" v-show="" border>
<el-table-column property="date" label=""></el-table-column>
<el-table-column property="name" label="姓名"></el-table-column>
<el-table-column property="address" label="地址"></el-table-column>
</el-table>
<!-- <div slot="header" class="clearfix">-->
<div style="font-weight: 600;padding: 30px 0 10px 10px;">任务1:好友添加</div>
<!-- </div>-->
<el-table :data="tableData" style="width: 100%" :header-cell-class-name="tableRowClassName" border>
<el-table-column prop="date" label="时间"></el-table-column>
<el-table-column prop="name" label="当天进班人数"></el-table-column>
<el-table-column prop="name" label="未通过人数"></el-table-column>
<el-table-column prop="name" label="需要还有人数"></el-table-column>
<el-table-column prop="address" label="完成情况" width="250">
<template slot-scope="scope">
<div>
好友通过率:
<el-progress
style="display: inline-block;width: calc(80% - 50px)" :text-inside="true" :stroke-width="16"
:color="'#f00'" :percentage="70"></el-progress>
</div>
<div>
任务处理率:
<el-progress
style="display: inline-block;width: calc(80% - 50px)" :text-inside="true" :stroke-width="16"
:color="'rgb(103, 194, 58)'" :percentage="70"></el-progress>
</div>
</template>
</el-table-column>
</el-table>
<el-table class="tr-bg" :data="gridData1" style="margin-top: 50px;" border>
<el-table-column property="date" label="序号"></el-table-column>
<el-table-column property="name" label="老师"></el-table-column>
<el-table-column property="address" label="客户电话"></el-table-column>
<el-table-column property="address" label="呼出时间"></el-table-column>
<el-table-column property="address" label="通话时长"></el-table-column>
<el-table-column property="address" label="备注信息"></el-table-column>
<el-table-column property="address" label="下次回访"></el-table-column>
<el-table-column property="address" label="操作">
<template slot-scope="scope">
<el-button v-show="infoShow === 2" type="text" size="small">{{ infoText }}</el-button>
<el-button v-show="infoShow === 1" @click="chatRecord" type="text" size="small">{{ infoText }}</el-button>
</template>
</el-table-column>
</el-table>
</el-dialog>
<el-dialog append-to-body :visible.sync="dialogTable">
<div class="chat-record">
<div class="le">
<div class="le-content">
<div class="le-content-image">
<img src="" alt="">
</div>
<div class="le-content-box">
<div class="le-content-box-title">阿斯顿发射点阿斯顿发射点阿斯顿发</div>
<div class=""></div>
</div>
</div>
</div>
<div class="ri">zvczv</div>
</div>
</el-dialog>
</div>
</template>
<script>
import { getRealTimeDataApi, getPhoneRecordApi } from "../../service/api";
export default {
name: "customer",
props: {
customerObj: {
type: Object,
default () {
return {}
}
},
},
data() {
return {
infoData: {
add_friend: '',
chat_contact_count: '',
chat_counts: '',
phone_counts: '',
phone_total_time: '',
valid_chat_contact_count: '',
wait_add_friend: '',
wechat_friend_total: '',
},
infoLoading: true,
table: {
th: [],
td1: [],
td2: [],
td3: [],
},
dialogTitle: '',
dialogTableVisible: false,
dialogTable: false,
gridData: [
{
date: '小磊老师',
name: '3分钟+',
address: '10分钟+'
}, {
date: '3分钟+',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '10分钟+',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}
],
gridData1: [
{
date: '小磊老师',
name: '3分钟+',
address: '+',
address: '54+',
address: '10分钟+',
address: '34+',
address: '23+',
address: '12+',
address: '112分钟+',
}, {
date: '3分钟+',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '10分钟+',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}
],
infoText: '',
infoShow: '',
tableData: [
{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄',
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄',
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}],
realTime: ''
}
},
mounted() {
this.getData();
},
methods: {
strip(num) {
return +parseFloat(num.toPrecision(12));
},
getData() {
if (this.customerObj.alias) {
this.infoLoading = true;
//getRealTimeDataApi(this.customerObj.alias).then(res => {
getRealTimeDataApi('15316027945').then(res => {
this.infoData = res;
this.infoLoading = false;
})
}
},
/**
* 改变图片header颜色
* @param row
* @param rowIndex
* @returns {string}
*/
tableRowClassName({row, rowIndex}) {
if (rowIndex === 0) {
return 'warning-row';
}
return ''
},
/**
* 点击出现弹框
* @param infoText
* @param infoShow
*/
customerNum(infoText, infoShow) {
this.dialogTableVisible = true;
this.infoText = infoText;
this.infoShow = infoShow;
if (infoShow == 2) {
this.dialogTitle = '老师名:' + this.customerObj.name + ' 销售顾问:' + this.customerObj.adviser;
getPhoneRecordApi(15316027945).then(res=>{
console.log(res, 10000000);
res.time.unshift(' ');
res.time.push('合计');
this.table.th = res.time;
res.min_count.unshift(this.customerObj.name + '(总)');
res.min_count.push(res.min_count_total);
this.table.td1 = res.min_count;
res.one_min.unshift('1分钟+');
res.one_min.push(res.one_min_total);
this.table.td2 = res.one_min;
res.three_min.unshift('3分钟+');
res.three_min.push(res.three_min_total);
this.table.td3 = res.three_min;
})
}
},
chatRecord() {
this.dialogTable = true
},
}
}
</script>
<style lang="less">
.custom-table {
margin-top: 20px;
width: 100%;
border: solid 1px #EBEEF5;
border-spacing: 0;
border-collapse: collapse;
thead {
color: #909399;
font-weight: 500;
th {
padding: 12px 10px;
border: 1px solid #EBEEF5;
}
}
tbody {
td {
padding: 12px 10px;
border: 1px solid #EBEEF5;
}
}
}
.el-breadcrumb__item.hand {
cursor: pointer;
display: inline-block;
&:hover {
.el-breadcrumb__inner {
span {
color: #409EFF;
}
}
}
.el-breadcrumb__inner {
cursor: pointer !important;
span {
text-decoration: underline;
}
}
}
.el-table .warning-row {
background: rgb(228, 239, 247);
text-align: center;
}
.chat-record {
width: 100%;
.le {
text-align: left;
// 右边的样式
.le-content {
width: 70%;
.le-content-image {
width: 30px;
height: 30px;
background: red;
float: left;
img {
width: 100%;
height: 100%;
}
}
.le-content-box {
float: left;
width: calc(100% - 40px);
padding-left: 10px;
.le-content-box-title {
font-size: 12px;
color: #d8d8d8;
}
}
}
}
.ri {
text-align: right;
}
}
</style>
......@@ -71,6 +71,9 @@
</el-card>
</div>
<el-tabs type="border-card" v-model="tabs">
<el-tab-pane label="客户管理" name="customer">
<customerDetail :customerObj="customerObj"></customerDetail>
</el-tab-pane>
<el-tab-pane label="今日任务" name="task">
<task :parentDetail="parentDetail"></task>
</el-tab-pane>
......@@ -505,6 +508,7 @@
import AddressArray from '../framework/address-picker/addr'
import task from './task'
import page from '../framework/page'
import customerDetail from './customer'
import sourceDialog from './sourceDialog'
import couponDialog from './couponDialog'
import refundDetail from './refundDetail'
......@@ -524,7 +528,8 @@
chooseGoodDialog,
couponDialog,
refundDetail,
sourceDialog
sourceDialog,
customerDetail
},
data() {
let nowDate = new Date();
......@@ -549,7 +554,7 @@
postModularParams: {},
modularList: [],
modularContent: [],
tabs: 'task',
tabs: 'customer',
nowDate: nowDate,
yunjiList: [],
searchFrom: {
......@@ -581,6 +586,11 @@
total: 0,
limit: 10,
nowPage: 1,
customerObj: {
alias: '',
name: '',
adviser: ''
},
userObj: {
classId: '',
title: '',
......@@ -1049,7 +1059,11 @@
return studentSource[val]
}
},
created() {
this.customerObj.alias = this.parentDetail ? this.parentDetail.alias : this.$route.params.alias;
this.customerObj.name = this.parentDetail ? this.parentDetail.name : this.$route.params.name;
this.customerObj.adviser = this.parentDetail ? this.parentDetail.adviser : this.$route.params.adviser;
},
mounted() {
this.id = this.parentDetail ? this.parentDetail.id : this.$route.params.id;
this.getTask4();
......
......@@ -95,6 +95,10 @@ export const postTransferTeacherApi = function (json) {
export const getRealTimeDataApi = function (data) {
return Vue.prototype.$fetch(`${_baseUrl}api/admin/teacher/todaydata/${data}`)
};
// 通话次数
export const getPhoneRecordApi = function (data) {
return Vue.prototype.$fetch(`${_baseUrl}api/admin/teacher/phonerecord/${data}`)
};
//获取课程列表
const getLessonUrl = `${_baseUrl}api/admin/course/list`;
export const getLessonApi = function (json) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment