Skip to content

C
confucius
Commit f26eedde authored by zhengke's avatar zhengke
Browse files
Options

增加详情

parent 50e6dcae
Hide whitespace changes
Inline Side-by-side
Showing with 277 additions and 255 deletions
src/pages/stuMan/visitorRecord.vue
View file @ f26eedde
<template> <template>
<div class="page-body visitorRecord"> <div class="page-body visitorRecord">
<div class="page-search row items-center"> <div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md"> <div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3"> <div class="col-3">
<q-input @input="resetSearch" clearable standout="bg-primary text-white" v-model="msg.KeyWords" label="关键字" <q-input @input="resetSearch" clearable standout="bg-primary text-white" v-model="msg.KeyWords" label="关键字"
@clear="resetSearch" maxlength="20" /> @clear="resetSearch" maxlength="20" />
</div> </div>
<div class="col-3"> <div class="col-3">
<q-select @input="resetSearch" standout="bg-primary text-white" option-value="Id" clearable <q-select @input="resetSearch" standout="bg-primary text-white" option-value="Id" clearable
option-label="EmployeeName" v-model="msg.CreateBy" :options="EmployeeList" emit-value map-options label="业务员" use-input @filter="filterFn2"/> option-label="EmployeeName" v-model="msg.CreateBy" :options="EmployeeList" emit-value map-options
</div> label="业务员" use-input @filter="filterFn2" />
<div class="col-3"> </div>
<q-field filled> <div class="col-3">
 <template v-slot:control> <q-field filled>
<el-date-picker v-model="dateList2" @change="resetSearch()" value-format="yyyy-MM-dd" type="daterange" style="border:none;" :picker-options="option"  <template v-slot:control>
 range-separator="至"  start-placeholder="开班开始时间"  end-placeholder="开班结束时间"> <el-date-picker v-model="dateList2" @change="resetSearch()" value-format="yyyy-MM-dd" type="daterange" style="border:none;"
 </el-date-picker>        :picker-options="option"  range-separator="至"  start-placeholder="开班开始时间"  end-placeholder="开班结束时间">
</template>  </el-date-picker>       
</q-field> </template>
</div> </q-field>
</div> </div>
</div> </div>
<div class="page-content">
<q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat
class="sticky-column-table sticky-right-column-table" separator="none" :data="dataList" :columns="columns"
row-key="name">
<template v-slot:top="props">
<div class="col-2 q-table__title">访问记录</div>
<q-space />
</template>
<template v-slot:body-cell-VisitorStatus="props">
<q-td :props="props">
<img v-if="props.row.VisitorStatus==1" title="正常" src="../../assets/images/normal.png" />
<img v-if="props.row.VisitorStatus==2" title="贵宾" src="../../assets/images/vip.png" />
<img v-if="props.row.VisitorStatus==3" title="黑名单" src="../../assets/images/blackList.png" />
</q-td>
</template>
<template v-slot:body-cell-Evaluate="props">
<q-td :props="props">
{{getRemarks(props.row.Evaluate)}}
</q-td>
</template>
<template v-slot:body-cell-Remark="props">
<q-td :props="props">
{{getRemarks(props.row.Remark)}}
</q-td>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
:input="true" @input="changePage" />
</template>
</q-table>
</div>
</div> </div>
</template> <div class="page-content">
<q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat
<script> class="sticky-column-table sticky-right-column-table" separator="none" :data="dataList" :columns="columns"
import { row-key="name">
getVisitorAllPageList, <template v-slot:top="props">
} from '../../api/stuMan/index' <div class="col-2 q-table__title">访问记录</div>
import { queryEmployee } from '../../api/users/user'; <q-space />
export default { </template>
meta: { <template v-slot:body-cell-Name="props">
title: "访问记录" <q-td>
}, <span style="color:#2961FE;cursor:pointer;" @click="getDetail(props.row)">{{props.row.Name}}</span>
</q-td>
data() { </template>
return { <template v-slot:body-cell-VisitorStatus="props">
msg: { <q-td :props="props">
pageIndex: 1, <img v-if="props.row.VisitorStatus==1" title="正常" src="../../assets/images/normal.png" />
pageSize: 10, <img v-if="props.row.VisitorStatus==2" title="贵宾" src="../../assets/images/vip.png" />
rowsPerPage: 10, <img v-if="props.row.VisitorStatus==3" title="黑名单" src="../../assets/images/blackList.png" />
KeyWords: "", </q-td>
CreateBy:'', </template>
StartTime:'', <template v-slot:body-cell-Evaluate="props">
EndTime:'', <q-td :props="props">
{{getRemarks(props.row.Evaluate)}}
</q-td>
</template>
<template v-slot:body-cell-Remark="props">
<q-td :props="props">
{{getRemarks(props.row.Remark)}}
</q-td>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
:input="true" @input="changePage" />
</template>
</q-table>
</div>
<schedulFanke v-if="isShowDetail" @close="closeDetail" :save-obj="sendObj"></schedulFanke>
</div>
</template>
<script>
import {
getVisitorAllPageList,
} from '../../api/stuMan/index'
import {
queryEmployee
} from '../../api/users/user';
import schedulFanke from '../../components/schedul/schedul-fanke'
export default {
meta: {
title: "访问记录"
},
components: {
schedulFanke
},
data() {
return {
msg: {
pageIndex: 1,
pageSize: 10,
rowsPerPage: 10,
KeyWords: "",
CreateBy: '',
StartTime: '',
EndTime: '',
},
pageCount: 0,
dataList: [],
dateList2: [],
loading: false,
columns: [{
name: 'Name',
label: '姓名',
required: true,
field: 'Name',
align: 'left'
},
{
name: 'Age',
field: 'Age',
label: '年龄',
align: 'left',
},
{
name: 'Tel',
field: 'Tel',
label: '电话',
align: 'left',
},
{
name: 'WeChatNum',
field: 'WeChatNum',
label: '微信',
align: 'left'
}, },
pageCount: 0, {
dataList: [], name: 'CourseName',
dateList2:[], label: '兴趣课程',
loading: false, field: 'CourseName',
columns: [{ align: 'left'
name: 'Name',
label: '姓名',
required: true,
field: 'Name',
align: 'left'
},
{
name: 'Age',
field: 'Age',
label: '年龄',
align: 'left',
},
{
name: 'Tel',
field: 'Tel',
label: '电话',
align: 'left',
},
{
name: 'WeChatNum',
field: 'WeChatNum',
label: '微信',
align: 'left'
},
{
name: 'CourseName',
label: '兴趣课程',
field: 'CourseName',
align: 'left'
},
{
name: 'StudyTime',
label: '学习时间',
field: 'StudyTime',
align: 'left'
},
{
name: 'LevelType',
label: '当前水平',
field: 'LevelType',
align: 'left'
},
{
name: 'CreateByName',
label: '关联人员',
field: 'CreateByName',
align: 'left'
},
{
name: 'VisitorStatus',
label: '状态',
field: 'VisitorStatus',
align: 'left'
},
{
name: 'Evaluate',
label: '意向评估',
field: 'Evaluate',
align: 'left'
},
{
name: 'CreateTimeStr',
label: '到访时间',
field: 'CreateTimeStr',
align: 'left'
},
{
name: 'VisitTimes',
label: '到访次数',
field: 'VisitTimes',
align: 'left'
},
{
name: 'Remark',
label: '备注',
field: 'Remark',
align: 'left'
},
],
option:{
disabledDate:(time)=> {
return time.getTime() > Date.now()
}
}, },
EmployeeList:[],//业务员 {
AllemployeeList:[], name: 'StudyTime',
label: '学习时间',
field: 'StudyTime',
align: 'left'
},
{
name: 'LevelType',
label: '当前水平',
field: 'LevelType',
align: 'left'
},
{
name: 'CreateByName',
label: '关联人员',
field: 'CreateByName',
align: 'left'
},
{
name: 'VisitorStatus',
label: '状态',
field: 'VisitorStatus',
align: 'left'
},
{
name: 'Evaluate',
label: '意向评估',
field: 'Evaluate',
align: 'left'
},
{
name: 'CreateTimeStr',
label: '到访时间',
field: 'CreateTimeStr',
align: 'left'
},
{
name: 'VisitTimes',
label: '到访次数',
field: 'VisitTimes',
align: 'left'
},
{
name: 'Remark',
label: '备注',
field: 'Remark',
align: 'left'
},
],
option: {
disabledDate: (time) => {
return time.getTime() > Date.now()
}
},
EmployeeList: [], //业务员
AllemployeeList: [],
isShowDetail:false,
sendObj: {},
}
},
mounted() {
this.getList();
this.getEmployee()
},
created() {
},
methods: {
//关闭
closeDetail() {
this.isShowDetail = false;
},
//获取详情
getDetail(obj) {
this.sendObj = obj;
this.isShowDetail = true;
},
getList() {
this.loading = true;
if (this.dateList2 && this.dateList2.length > 0) {
this.msg.StartTime = this.dateList2[0];
this.msg.EndTime = this.dateList2[1];
} else {
this.msg.StartTime = '';
this.msg.EndTime = '';
} }
getVisitorAllPageList(this.msg).then(res => {
this.loading = false;
this.dataList = res.Data.PageData;
this.pageCount = res.Data.PageCount;
}).catch(() => {
this.loading = false;
})
}, },
mounted() { resetSearch() {
this.msg.pageIndex = 1;
this.getList(); this.getList();
this.getEmployee()
}, },
created() { changePage(val) {
this.msg.pageIndex = val;
this.getList();
}, },
methods: { //过滤备注显示
getRemarks(remark) {
getList() { if (remark.length > 10) {
this.loading = true; return remark.substring(0, 10) + '...';
if (this.dateList2 && this.dateList2.length > 0) { } else {
this.msg.StartTime = this.dateList2[0]; return remark;
this.msg.EndTime = this.dateList2[1]; }
} else { },
this.msg.StartTime = ''; //业务员
this.msg.EndTime = ''; getEmployee(id) {
var qMsg = {
Dept_Id: 0
}
qMsg.Dept_Id = id;
queryEmployee(qMsg).then(res => {
if (res.Code == 1) {
this.EmployeeList = res.Data;
let obj = {
Id: "",
EmployeeName: "不限"
} }
getVisitorAllPageList(this.msg).then(res => { this.EmployeeList.unshift(obj)
this.loading = false; this.AllemployeeList = JSON.parse(JSON.stringify(this.EmployeeList));
this.dataList = res.Data.PageData; }
this.pageCount = res.Data.PageCount; }).catch(() => {
}).catch(() => {
this.loading = false; })
}) },
}, //筛选业务员
resetSearch() { filterFn2(val, update) {
this.msg.pageIndex = 1; update(() => {
this.getList(); if (val === '') {
}, this.EmployeeList = JSON.parse(JSON.stringify(this.AllemployeeList))
changePage(val) {
this.msg.pageIndex = val;
this.getList();
},
//过滤备注显示
getRemarks(remark) {
if (remark.length > 10) {
return remark.substring(0, 10) + '...';
} else { } else {
return remark; const needle = val.toLowerCase()
this.EmployeeList = this.AllemployeeList.filter(v => v.EmployeeName.toLowerCase().indexOf(needle) > -1)
} }
}, })
//业务员 },
getEmployee(id) {
var qMsg = {
Dept_Id: 0
}
qMsg.Dept_Id=id;
queryEmployee(qMsg).then(res => {
if(res.Code==1){
this.EmployeeList = res.Data;
let obj={
Id:"",
EmployeeName:"不限"
}
this.EmployeeList.unshift(obj)
this.AllemployeeList = JSON.parse(JSON.stringify(this.EmployeeList));
}
}).catch(() => {
})
},
//筛选业务员
filterFn2(val, update) {
update(() => {
if (val === '') {
this.EmployeeList = JSON.parse(JSON.stringify(this.AllemployeeList))
} else {
const needle = val.toLowerCase()
this.EmployeeList = this.AllemployeeList.filter(v => v.EmployeeName.toLowerCase().indexOf(needle) > -1)
}
})
},
}
}
</script>
<style >
.visitorRecord .border-bottom {
border-bottom: 1px dashed #EEE;
padding-bottom: 5px;
margin-bottom: 5px;
} }
.visitorRecord .el-input { }
</script>
<style>
.visitorRecord .border-bottom {
border-bottom: 1px dashed #EEE;
padding-bottom: 5px;
margin-bottom: 5px;
}
.visitorRecord .el-input {
width: 100%; width: 100%;
border: none; border: none;
background-color: transparent; background-color: transparent;
...@@ -271,15 +295,13 @@ ...@@ -271,15 +295,13 @@
border: none; border: none;
background-color: transparent; background-color: transparent;
} }
.visitorRecord .el-range-input {
.visitorRecord .el-range-input {
background-color: transparent !important; background-color: transparent !important;
} }
</style>
<style lang="sass">
</style> @import url('~assets/css/table.sass')
<style lang="sass">
@import url('~assets/css/table.sass') </style>
</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