Commit a8a5f8ab authored by duxinyuan's avatar duxinyuan

办公楼界面

parent e8b7eaa8
<template>
<div>
<!--<header-pulic :data="headerData" v-on:lisentenStatus="lisentenStatus"></header-pulic>-->
<!--<header-persional :data="headerData" v-on:lisentenStatus="lisentenStatus"></header-persional>-->
<div class="search_area" style="padding-left:.1rem;margin-top:0.1rem;">
<myDatepicker @change="changeTime" :date="startTime" :option="multiOption" :limit="limit"></myDatepicker>
<!--<myDatepicker @change="changeTime1" :date="endtime" :option="timeoption" :limit="limit"></myDatepicker>-->
<!--@change="changeStr2"-->
<input v-model="input1" style="padding:.1rem .05rem ;line-height: 1;border :1px solid #eeeeee;width :1.7rem"placeholder="客户ID">
<input v-model="input2" style="padding:.1rem .05rem ;line-height: 1;border :1px solid #eeeeee;width :1.7rem"placeholder="房东编号">
<div style="color : #ffffff; border-radius:.05rem;width :.88rem ;height : 0.35rem;background-color : #ff8018;float:right;margin-right:.25rem;text-align:center;padding:.1rem .05rem ;">
<span @click="searchInfo">筛选</span>
</div>
</div>
<div ref="list" @scroll="handleScroll">
<div v-for="(item,index) in items " :key = "index" class="border_line_bottom" style="width:7.5rem;">
<div class="border_line_bottom" v-if="index==0 " style="margin-top:.3rem;border-top:1px solid #eeeeee;width:7.5rem;">
<div class="border_line_right left" style="width:1.46rem;" v-if="index==0 ">
<span>通话ID</span>
</div>
<div class="border_line_right left" style="width:1.46rem;" v-if="index==0 ">
<span>通话时间</span>
</div>
<div class="border_line_right left" style="width:1.46rem;" v-if="index==0 ">
<span>经纪人</span>
</div>
<div class="border_line_right left" style="width:1.46rem;" v-if="index==0 ">
<span>{{ userType == 0 ? "客户ID" : "房东编号"}}</span>
</div>
<div class="left" style="width:1.46rem" v-if="index==0 ">
<span>通话时长</span>
</div>
</div>
<div >
<div class="border_line_right left" style="width:1.46rem;">
<span>{{item.id}}</span>
</div>
<div class="border_line_right left" style="width:1.46rem;">
<span>{{item.call_time}}</span>
</div>
<div class="border_line_right left" style="width:1.46rem;">
<span>{{item.name}}</span>
</div>
<div class="border_line_right left" style="width:1.4rem;">
<span>{{item.users_id}}</span>
</div>
<div class="left" style="width:1.46rem">
<span>{{item.time}}</span>
</div>
</div>
</div>
</div>
<div style="text-align:center ;margin-top:0.2rem;" v-if = " items.length == 0 && !itemsta " >
<span style=" color :#999999">请输入筛选项,点击筛选按钮获取数据</span>
</div>
<div style="text-align:center ;margin-top:0.2rem;" v-if = " items.length == 0 && itemsta ">
<span style=" color :#999999">暂无数据</span>
</div>
<build-search @backSearchData="backSearchData" style="height:1.3rem;"></build-search>
</div>
</template>
<script>
import myDatepicker from 'vue-datepicker/vue-datepicker-es6.vue';
import headerPersional from '@/components/phoneDetail/headPersional.vue'
import buildSearch from '@/components/office_building/buildSearch.vue';
export default {
name: '',
components:{
myDatepicker
},
props: {
data: {
type: Object,
default: () => ({
message: 'hello'
})
},
dataindex: {
type: [Number, String],
default: 0
},
},
components : {
'header-persional' : headerPersional
},
data() {
let _this = this;
let _token = _this.$route.query.token;
if(!_token) {
layer.tipsX('token获取出错');
return false;
};
var date = new Date();
date.setTime( date.getTime() + 86400000) ;
var time1 = this.initThisDay(new Date());
var time2 = this.initThisDay(date);
console.log(time1)
return {
agent_status : 0 ,
items : [],
itemsta : false ,
headerData: {
'title': "通话记录",
'noborder': false,
'isBack': false
},
token: _token,
seatH: 1.58*4,//占位高度
pageSize: 10,
initTabNumMain: 0,
isLoading: false,//是否正在加载
show : true ,
heightBefor : 0 ,
mainData: [{
'dataList': [],
'page': 1,//页码
'isLoadOnce': false,//是否请求过一次数据
'isStop': false,//是否所有页的数据加载完毕
'noDataFlag': false,//是否是无数据
'label': {
'icon': 'icon_all@2x.png',
'id': 0,
'label_name': '全部'
}
}],
data : ()=>({
startTime: { // 相当于变量
time: time1
},
endtime: { // 相当于变量
time: time1
},
timeoption: {
type: 'day', // day , multi-day
week: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
month: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
format: 'YYYY-MM-DD', // YYYY-MM-DD 日期
inputStyle: { // input 样式
'display': 'inline-block',
'padding': '.1rem .05rem ',
'line-height': '1',
'width':'2.5rem',
'font-size': '14px',
'border': '1px solid #eeeeee',
'border-radius': '2px',
},
color: { // 字体颜色
header: '#35acff', // 头部
headerText: '#fff', // 头部文案
},
buttons: { // button 文案
ok: '确定',
cancel: '取消'
},
overlayOpacity: 0.5, // 遮罩透明度
placeholder: '请选时间', // 提示日期
dismissible: false // 默认true 待定
},
multiOption: {
type: 'day',
week: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
month: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
format:"YYYY-MM-DD",
inputStyle: { // input 样式
'display': 'inline-block',
'padding': '.1rem .05rem ',
'line-height': '1',
'width':'2rem',
'font-size': '14px',
'border': '1px solid #eeeeee',
'border-radius': '2px',
},
color: { // 字体颜色
header: '#35acff', // 头部
headerText: '#fff', // 头部文案
},
buttons: { // button 文案
ok: '确定',
cancel: '取消'
},
placeholder: '请选时间',
dismissible: true,
},
limit: [{
type: 'weekday',
available: [1, 2, 3, 4, 5,6,0]
},
{
type: 'fromto',
from: '2016-02-01',
to: time2
}],
thisday :'' ,
startTime0 : '',
endTime0 : '',
intoID : '' ,
userType : 0,
i:0,
pageNo : 1,
allow : true ,
input1 : "",
input2 : ""
}
},
created() {
let _this = this;
_this.urlParams = _this.$route.query;
_this.initThisDay( new Date() );
// _this.initData();
}),
components: {
'build-search': buildSearch,
},
mounted () {
this.a=document.body.scrollHeight||document.documentElement.scrollHeight;
this.c = document.documentElement.clientHeight;
window.addEventListener('scroll', this.handleScroll, true);
// 监听(绑定)滚轮 滚动事件
},
methods: {
lisentenStatus : function(status){
let that = this ;
console.log(status);
that.agent_status = status ;
},
handleScroll(){
this.a = document.body.scrollHeight || document.documentElement.scrollHeight;
this.b = document.body.scrollTop || document.documentElement.scrollTop;
//通过判断滚动条的top位置与可视网页之和与整个网页的高度是否相等来决定是否加载内容;
if (this.b + this.c > this.a - 20) {
// this.$router.push('./intelligenceb');
setTimeout(()=> {
console.log("滚动到底了");
this.pageNo = this.pageNo+1
this.initData();
},800);
}
},
searchInfo : function(){
var that = this ;
this.pageNo = 1 ;
that.items = [] ;
that.initData();
},
initThisDay : function(date){
var that = this ;
// var date = new Date();
var day = date.getDate();
var month = date.getMonth()+1;
var year = date.getFullYear();
var time = year + "-" + (month<9?"0"+month : month) + "-" + (day<9 ? "0"+day : day) ;
that.thisday = time ;
that.endTime0 = time ;
that.startTime0 = time ;
return time ;
},
changeTime : function(a,b,c){
var that = this ;
that.startTime0 = a
},
changeTime1 : function(a,b,c){
var that = this ;
that.endTime0 = a
},
changeStr1 : function(a,b,c){
var that = this ;
if ( that.userType == 1 && that.intoID != "") {
layer.tipsX("仅可以填写客户ID或房东编号");
that.allow = false;
return false ;
}
that.userType = 0 ;
if( a.path[0].value == "" ){
that.userType = 0 ;
// that.allow = false;
// return false ;
}
if (that.intoID == "" && a.path[0].value== "") {
that.allow = true ;
}
that.allow = true ;
that.intoID = a.path[0].value;
},
changeStr2 : function(a,b,c){
var that = this ;
if ( that.userType == 0 && that.intoID != "") {
layer.tipsX("仅可以填写客户ID或房东编号");
that.allow = false;
return false ;
}
if( a.path[0].value == "" ){
that.userType = 0 ;
// that.allow = false ;
// return false ;
}
if (that.intoID == "" && a.path[0].value== "") {
that.allow = true ;
}
that.allow = true ;
that.userType = 1 ;
that.intoID = a.path[0].value
},
initData : function(){
var that = this ;
var inp1 = that.input1;
var inp2 = that.input2;
console.log(inp1);
console.log(inp2);
if (inp1 == "" && inp2 == "") {
var status = 0;
var id = "";
} else if (inp1 == "" && inp2 != "") {
var status = 1;
var id = inp2;
} else if (inp1 != "" && inp2 == "") {
var status = 0;
var id = inp1;
} else if (inp1 != "" && inp2 != "") {
layer.tipsX("仅可以填写客户ID或房东编号");
return false ;
} else {
var status =0
var id = "";
}
this.isLoading = false ;
var startTime = that.startTime0 ;
// var endTime = that.endTime0;
// var id = that.intoID;
// var startTimeArr = startTime.split("-");
// var startTimeStr = startTimeArr[0]+startTimeArr[1]+startTimeArr[2]-0;
// var endTimeArr = endTime.split("-");
// var endTimeStr = endTimeArr[0]+endTimeArr[1]+endTimeArr[2]-0;
var pageNo = this.pageNo;
// if (startTimeStr-endTimeStr > 0 ){
// layer.tipsX("开始时间不能大于终止时间");
// return false
// }
var params = {
'start_date' : startTime ,
// 'end_date' : endTime,
"agents_id" : that.urlParams.agents_id ,
'AuthToken' : that.urlParams.token,
"users_id" : id,
"users_type" : status,//that.userType,
'pageNo' : pageNo,
"pageSize" : 30
backSearchData (data){
console.log(data);
}
console.log(params);
that.axios({
method: 'get',
url: 'broker/getCallLog',
responseType: 'json',
data: params
})
.then(function(res) {
if(res.data.code == 200) {
console.log(res);
var list = res.data.data.list ;
var items = that.items ;
for ( var i = 0 ; i < list.length ; i++ ){
items.push(list[i]);
}
that.items = items;
that.itemsta = true ;
} else {
layer.tipsX(res.data.msg);
}
})
.catch(function(error) {
console.log(error)
layer.tipsX(error);
});
}
},
computed: {
......@@ -378,74 +31,5 @@
</script>
<style scoped>
.mainArea {
width : 7.5rem ;
padding : .32rem 0rem 0rem ;
overflow:hidden;
}
.nextTab {
width : 5rem ;
margin-left:1.25rem;
text-align:center ;
/*overflow:hidden;*/
}
.half {
width: 50%;
float:left ;
}
.nextTab span {
font-family: PingFangSC-Regular;
font-size:.26rem;
color: #1A1A1A;
text-align: center;
}
.active {
color: #FF9318;
}
.border_line {
width : 40%;
height : 3px;
background-color :#ff9318;
border-radius :2.5px;
text-align:center ;
margin-left : .75rem ;
position:relative;
top:0.1rem;
}
.tableArea{
width:7.5rem;
overflow:hidden ;
margin-top:.8rem;
border-top : 1px solid #eeeeee;
}
.border_line_bottom {
border-bottom : 1px solid #eeeeee;
overflow:hidden;
}
.border_line_right {
border-right : 1px solid #eeeeee;
}
.left{
text-align:center ;
float:left;
padding : .11rem 0rem ;
}
.left span {
text-align:center ;
font-size:.22rem;
}
.all {
width : 7.5rem ;
overflow:hidden ;
text-align:center ;
padding : .11rem 0rem ;
}
.cont{
font-size:.24rem; color : #999999;
}
</style>
\ No newline at end of file
http://localhost:8080/#/priceReport?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJkYXRhIjp7ImlkIjo1NzM5LCJuYW1lIjoiXHU2MDNiXHU2ZDRiXHU4YmQ1MSIsInBob25lIjoiMTU2MDE2NTIzNTMiLCJsZXZlbCI6MzB9LCJ0aW1lU3RhbXBfIjoxNTMwNjA2ODU4fQ.8jL49CjtBMV6BqmaKdJfd4pkGBazrAgQQrutb53Z3mY-->
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
<template>
<div>
</div>
</template>
<script>
export default {
name: '',
data : ()=>({
}),
mounted () {
let that = this ;
},
methods: {
},
computed: {
}
}
</script>
<style>
<style scoped>
</style>
\ No newline at end of file
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