|
@@ -1,7 +1,7 @@
|
|
|
<template>
|
|
|
<div class="app-container" style="padding: 0 20px 20px 20px">
|
|
|
<!-- 顶部操作区域 -->
|
|
|
- <date-picker @prev-month="handlePrevMonth" @next-month="handleNextMonth" />
|
|
|
+ <!-- <date-picker @prev-month="handlePrevMonth" @next-month="handleNextMonth" /> -->
|
|
|
<!-- 筛选项 -->
|
|
|
<div class="filter-container">
|
|
|
<div class="filter-control">
|
|
@@ -10,6 +10,7 @@
|
|
|
v-model="listQuery.remarks"
|
|
|
placeholder="标签词"
|
|
|
clearable
|
|
|
+ style="width: 150px"
|
|
|
@keyup.enter.native="getList"
|
|
|
@clear="getList"
|
|
|
/>
|
|
@@ -26,14 +27,14 @@
|
|
|
</div>
|
|
|
<div class="filter-control">
|
|
|
<span>咨询类别:</span>
|
|
|
- <el-select v-model="listQuery.consult" clearable @change="getList">
|
|
|
+ <el-select v-model="listQuery.consult" clearable style="width: 120px" @change="getList">
|
|
|
<el-option value="" label="请选择" />
|
|
|
<el-option v-for="(item, index) in categoryList" :key="index" :label="item.className" :value="item.id" />
|
|
|
</el-select>
|
|
|
</div>
|
|
|
<div class="filter-control">
|
|
|
<span>是否注册:</span>
|
|
|
- <el-select v-model="listQuery.isRegister" clearable @change="getList">
|
|
|
+ <el-select v-model="listQuery.isRegister" clearable style="width: 120px" @change="getList">
|
|
|
<el-option value="" label="请选择" />
|
|
|
<el-option :value="1" label="未注册" />
|
|
|
<el-option :value="2" label="已注册" />
|
|
@@ -41,31 +42,45 @@
|
|
|
</div>
|
|
|
<div class="filter-control">
|
|
|
<span>新分配机构:</span>
|
|
|
- <el-select v-model="listQuery.newDeal" clearable @change="getList">
|
|
|
+ <el-select v-model="listQuery.newDeal" clearable style="width: 120px" @change="getList">
|
|
|
<el-option value="" label="请选择" />
|
|
|
<el-option :value="1" label="是" />
|
|
|
<el-option :value="2" label="否" />
|
|
|
</el-select>
|
|
|
</div>
|
|
|
+ <div class="filter-control">
|
|
|
+ <span>提交时间:</span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="time"
|
|
|
+ type="daterange"
|
|
|
+ unlink-panels
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ :picker-options="pickerOptions"
|
|
|
+ @change="handleDatePick"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
<div class="filter-control">
|
|
|
<el-button type="primary" @click="getList"> 查询 </el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="filter-container">
|
|
|
<span class="span-labels">
|
|
|
- 当日咨询客户总数:
|
|
|
+ 【查询时间内】咨询客户总数:
|
|
|
<el-tag type="primary" size="small">
|
|
|
{{ totalInfo.number }}
|
|
|
</el-tag>
|
|
|
</span>
|
|
|
<span class="span-labels">
|
|
|
- 已注册客户:
|
|
|
+ 已注册客户总数:
|
|
|
<el-tag type="primary" size="small">
|
|
|
{{ totalInfo.registeredNumber }}
|
|
|
</el-tag>
|
|
|
</span>
|
|
|
<span class="span-labels">
|
|
|
- 未注册客户:
|
|
|
+ 未注册客户总数:
|
|
|
<el-tag type="primary" size="small">
|
|
|
{{ totalInfo.unRegisteredNumber }}
|
|
|
</el-tag>
|
|
@@ -87,19 +102,19 @@
|
|
|
<div class="filter-container">
|
|
|
<span class="span-labels">
|
|
|
<el-tag type="primary" size="small">{{ sellerTabsInfo.linkMan }}</el-tag>
|
|
|
- 当日咨询客户总数:
|
|
|
+ 【查询时间内】咨询客户总数:
|
|
|
<el-tag type="primary" size="small">
|
|
|
{{ sellerTabsInfo.registeredNumber + sellerTabsInfo.unregisteredNumber }}
|
|
|
</el-tag>
|
|
|
</span>
|
|
|
<span class="span-labels">
|
|
|
- 已注册客户:
|
|
|
+ 已注册客户总数:
|
|
|
<el-tag type="primary" size="small">
|
|
|
{{ sellerTabsInfo.registeredNumber }}
|
|
|
</el-tag>
|
|
|
</span>
|
|
|
<span class="span-labels">
|
|
|
- 未注册客户:
|
|
|
+ 未注册客户总数:
|
|
|
<el-tag type="primary" size="small">
|
|
|
{{ sellerTabsInfo.unregisteredNumber }}
|
|
|
</el-tag>
|
|
@@ -117,7 +132,7 @@
|
|
|
</div>
|
|
|
<div v-for="(item, index) in list" v-else :key="index" class="list-main">
|
|
|
<div class="list-main-item consult-list">
|
|
|
- <span class="list-time">{{ item.divisionTime }}</span>
|
|
|
+ <span class="list-time">{{ item.addTime }}</span>
|
|
|
<el-row :gutter="24" class="box-row">
|
|
|
<el-col v-if="item.clubName" :span="6"><b>机构:</b> {{ item.clubName }}</el-col>
|
|
|
<el-col :span="6"><b>咨询人:</b> {{ item.questionMan }}</el-col>
|
|
@@ -224,7 +239,16 @@
|
|
|
</el-col>
|
|
|
<el-col v-if="item.consultType" :span="12">
|
|
|
<b>咨询类别:</b>
|
|
|
- <el-tag type="success" size="small"> {{ item.consultType }} </el-tag>
|
|
|
+ <el-tag
|
|
|
+ v-for="(consultType, consultTypeIndex) in item.consultType.split(',')"
|
|
|
+ :key="consultTypeIndex"
|
|
|
+ style="margin: 0 1px"
|
|
|
+ type="info"
|
|
|
+ size="small"
|
|
|
+ effect="dark"
|
|
|
+ >
|
|
|
+ {{ consultType }}
|
|
|
+ </el-tag>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row :gutter="24" class="box-row">
|
|
@@ -244,7 +268,16 @@
|
|
|
<el-row v-if="item.remarks" :gutter="24" class="box-row">
|
|
|
<el-col :span="24">
|
|
|
<b>标签词:</b>
|
|
|
- <el-tag type="success" size="small"> {{ item.remarks }} </el-tag>
|
|
|
+ <el-tag
|
|
|
+ v-for="(remarks, remarksIndex) in item.remarks.split(',')"
|
|
|
+ :key="remarksIndex"
|
|
|
+ style="margin: 0 1px"
|
|
|
+ type="success"
|
|
|
+ size="small"
|
|
|
+ effect="dark"
|
|
|
+ >
|
|
|
+ {{ remarks }}
|
|
|
+ </el-tag>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row v-if="item.extra" :gutter="24" class="box-row">
|
|
@@ -307,12 +340,13 @@
|
|
|
import { downloadWithUrl } from '@/utils'
|
|
|
import openWindow from '@/utils/open-window'
|
|
|
import { getClassName, getServiceList, getRemarksRegistList } from '@/api/user/consult/consult'
|
|
|
-import DatePicker from './components/datePicker'
|
|
|
+// import DatePicker from './components/datePicker'
|
|
|
+import pickerOptions from '@/utils/time-picker.js'
|
|
|
|
|
|
export default {
|
|
|
name: 'ConsultList',
|
|
|
components: {
|
|
|
- DatePicker
|
|
|
+ // DatePicker
|
|
|
},
|
|
|
filters: {
|
|
|
followupFilters(value) {
|
|
@@ -348,12 +382,15 @@ export default {
|
|
|
// 客户来源
|
|
|
console.log('value', value)
|
|
|
const map = {
|
|
|
- 0: '网站',
|
|
|
+ 0: '搜素引擎',
|
|
|
1: '小程序',
|
|
|
2: '公众号',
|
|
|
3: '小红书',
|
|
|
4: '微博',
|
|
|
5: '搜狐',
|
|
|
+ 7: '抖音',
|
|
|
+ 8: '视频号',
|
|
|
+ 9: '朋友推荐',
|
|
|
6: '其他'
|
|
|
}
|
|
|
return map[value]
|
|
@@ -361,6 +398,8 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ time: '',
|
|
|
+ pickerOptions,
|
|
|
isLoading: true,
|
|
|
listQuery: {
|
|
|
remarks: '', // 标签词
|
|
@@ -368,7 +407,8 @@ export default {
|
|
|
clubName: '', // 机构名称
|
|
|
newDeal: '', // 新分配机构状态 0 全部 1 是 2否
|
|
|
isRegister: '', // 是否注册 0 全部 1 未注册 2已注册
|
|
|
- todayTime: '', // 时间
|
|
|
+ startTime: '', // 开始时间
|
|
|
+ endTime: '', // 结束时间
|
|
|
serviceProviderId: '', // 协销Id
|
|
|
pageNum: 1,
|
|
|
pageSize: 20
|
|
@@ -391,44 +431,20 @@ export default {
|
|
|
methods: {
|
|
|
initDate() {
|
|
|
// 初始化获取当前年月
|
|
|
- const date = new Date()
|
|
|
this.getClassName()
|
|
|
- this.listQuery.todayTime = this.formattedDateFn(new Date(date - 86400000))
|
|
|
- this.getServiceList(this.listQuery.todayTime)
|
|
|
- console.log('todayTime', this.listQuery.todayTime)
|
|
|
- },
|
|
|
- formattedDateFn(dateString) {
|
|
|
- // 创建一个Date对象,将字符串解析为日期和时间
|
|
|
- const date = new Date(dateString)
|
|
|
- // 使用toISOString()方法将Date对象转换为ISO格式的字符串
|
|
|
- const isoString = date.toISOString()
|
|
|
- // 从ISO格式字符串中提取日期部分
|
|
|
- const dateOnly = isoString.substring(0, isoString.indexOf('T'))
|
|
|
- // 将日期格式化为"YYYY-MM-DD"格式
|
|
|
- const formattedDate = dateOnly.replace(/-/g, '-')
|
|
|
- return formattedDate
|
|
|
- },
|
|
|
- handleNextMonth(value) {
|
|
|
- // 加日期
|
|
|
- this.listQuery.todayTime = value
|
|
|
- this.getServiceList(this.listQuery.todayTime)
|
|
|
+ this.getServiceList(this.listQuery.startTime, this.listQuery.endTime)
|
|
|
this.getList()
|
|
|
- console.log('todayTime', this.listQuery.todayTime)
|
|
|
},
|
|
|
- handlePrevMonth(value) {
|
|
|
- // 减日期
|
|
|
- this.listQuery.todayTime = value
|
|
|
- this.getServiceList(this.listQuery.todayTime)
|
|
|
- this.getList()
|
|
|
- console.log('todayTime', this.listQuery.todayTime)
|
|
|
- },
|
|
|
- handeleTabsClick(item, index) {
|
|
|
- // 切换协销
|
|
|
- console.log('item', item)
|
|
|
- this.sellerTabsIndex = index
|
|
|
- this.sellerTabsInfo = item
|
|
|
- this.listQuery.serviceProviderId = item.serviceProviderId
|
|
|
- this.listQuery.pageNum = 1
|
|
|
+ // 选择时间
|
|
|
+ handleDatePick() {
|
|
|
+ if (this.time && this.time.length > 0) {
|
|
|
+ this.listQuery.startTime = this.time[0]
|
|
|
+ this.listQuery.endTime = this.time[1]
|
|
|
+ } else {
|
|
|
+ this.listQuery.startTime = ''
|
|
|
+ this.listQuery.endTime = ''
|
|
|
+ }
|
|
|
+ this.getServiceList(this.listQuery.startTime, this.listQuery.endTime)
|
|
|
this.getList()
|
|
|
},
|
|
|
// 获取行为记录列表
|
|
@@ -446,9 +462,10 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
// 获取当天协销咨询记录信息
|
|
|
- async getServiceList(accessDate) {
|
|
|
+ async getServiceList(startTime, endTime) {
|
|
|
try {
|
|
|
- const res = await getServiceList({ accessDate: accessDate })
|
|
|
+ this.sellerTabsIndex = 0
|
|
|
+ const res = await getServiceList({ startTime: startTime, endTime: endTime })
|
|
|
this.serviceList = res.data.serviceList
|
|
|
this.totalInfo = { ...this.totalInfo, ...res.data }
|
|
|
this.sellerTabsInfo = this.serviceList[0]
|
|
@@ -462,6 +479,13 @@ export default {
|
|
|
async getRemarksRegistList() {
|
|
|
try {
|
|
|
this.isLoading = true
|
|
|
+ if (this.time && this.time.length > 0) {
|
|
|
+ this.listQuery.startTime = this.time[0]
|
|
|
+ this.listQuery.endTime = this.time[1]
|
|
|
+ } else {
|
|
|
+ this.listQuery.startTime = ''
|
|
|
+ this.listQuery.endTime = ''
|
|
|
+ }
|
|
|
const res = await getRemarksRegistList(this.listQuery)
|
|
|
this.list = res.data.results
|
|
|
this.total = res.data.totalRecord
|
|
@@ -498,6 +522,40 @@ export default {
|
|
|
path: '/user/detail-list',
|
|
|
query: { ip: row.ip, accessDate: row.accessDate, userId: row.userId }
|
|
|
})
|
|
|
+ },
|
|
|
+ formattedDateFn(dateString) {
|
|
|
+ // 创建一个Date对象,将字符串解析为日期和时间
|
|
|
+ const date = new Date(dateString)
|
|
|
+ // 使用toISOString()方法将Date对象转换为ISO格式的字符串
|
|
|
+ const isoString = date.toISOString()
|
|
|
+ // 从ISO格式字符串中提取日期部分
|
|
|
+ const dateOnly = isoString.substring(0, isoString.indexOf('T'))
|
|
|
+ // 将日期格式化为"YYYY-MM-DD"格式
|
|
|
+ const formattedDate = dateOnly.replace(/-/g, '-')
|
|
|
+ return formattedDate
|
|
|
+ },
|
|
|
+ handleNextMonth(value) {
|
|
|
+ // 加日期
|
|
|
+ this.listQuery.todayTime = value
|
|
|
+ this.getServiceList(this.listQuery.todayTime)
|
|
|
+ this.getList()
|
|
|
+ console.log('todayTime', this.listQuery.todayTime)
|
|
|
+ },
|
|
|
+ handlePrevMonth(value) {
|
|
|
+ // 减日期
|
|
|
+ this.listQuery.todayTime = value
|
|
|
+ this.getServiceList(this.listQuery.todayTime)
|
|
|
+ this.getList()
|
|
|
+ console.log('todayTime', this.listQuery.todayTime)
|
|
|
+ },
|
|
|
+ handeleTabsClick(item, index) {
|
|
|
+ // 切换协销
|
|
|
+ console.log('item', item)
|
|
|
+ this.sellerTabsIndex = index
|
|
|
+ this.sellerTabsInfo = item
|
|
|
+ this.listQuery.serviceProviderId = item.serviceProviderId
|
|
|
+ this.listQuery.pageNum = 1
|
|
|
+ this.getList()
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -589,9 +647,11 @@ export default {
|
|
|
font-size: 20px;
|
|
|
color: #333333;
|
|
|
position: absolute;
|
|
|
- top: 26px;
|
|
|
- left: -110px;
|
|
|
+ top: 7px;
|
|
|
+ left: -164px;
|
|
|
font-weight: bold;
|
|
|
+ width: 120px;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
.box-row {
|
|
|
margin-bottom: 14px;
|