|
@@ -1,258 +0,0 @@
|
|
-<script setup>
|
|
|
|
-import { Search,Switch } from '@element-plus/icons-vue'
|
|
|
|
-import { apiCustomerStatistic } from '@/api/customer'
|
|
|
|
-import UserStatisticDetail from './components/UserStatisticDetail.vue'
|
|
|
|
-import { useRouter } from 'vue-router'
|
|
|
|
-import { apiCustomerUser } from '@/api/customer'
|
|
|
|
-
|
|
|
|
-const router=useRouter()
|
|
|
|
-
|
|
|
|
-const emits=defineEmits(['change'])
|
|
|
|
-
|
|
|
|
-const filterState=reactive({
|
|
|
|
- keyword: '',
|
|
|
|
- SellerDepartmentId: '',
|
|
|
|
- status: '',
|
|
|
|
- register: '',
|
|
|
|
- subscribe: '',
|
|
|
|
- regsiterTime: [],
|
|
|
|
- createTime: []
|
|
|
|
-})
|
|
|
|
-
|
|
|
|
-const tableColOpt = [
|
|
|
|
- {
|
|
|
|
- label: '姓名',
|
|
|
|
- key: 'RealName'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- label: '手机号',
|
|
|
|
- key: 'Phone'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- label: '邮箱',
|
|
|
|
- key: 'Email'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- label: '营业部',
|
|
|
|
- key: 'SellerDepartmentName'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- label: '用户状态',
|
|
|
|
- key: 'Status'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- label: '最近一次阅读时间',
|
|
|
|
- key: 'LastUpdateTime',
|
|
|
|
- sort: true
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- label: '累计阅读次数',
|
|
|
|
- key: 'ReadCnt',
|
|
|
|
- sort: true
|
|
|
|
- }
|
|
|
|
-]
|
|
|
|
-const userList = ref([])
|
|
|
|
-const departmentList = ref([]) // 营业部列表
|
|
|
|
-const page = ref(1)
|
|
|
|
-const pageSize = ref(10)
|
|
|
|
-const tableLoading = ref(false)
|
|
|
|
-const totals = ref(0)
|
|
|
|
-async function getUserList() {
|
|
|
|
- tableLoading.value = true
|
|
|
|
- const res = await apiCustomerStatistic.readRecordList({
|
|
|
|
- PageSize: pageSize.value,
|
|
|
|
- CurrentIndex: page.value,
|
|
|
|
- KeyWord: filterState.keyword,
|
|
|
|
- SellerDepartmentId: filterState.SellerDepartmentId,
|
|
|
|
- Status: filterState.status,
|
|
|
|
- IsRegistered: filterState.register,
|
|
|
|
- IsSubscribed: filterState.subscribe,
|
|
|
|
- RegisterStartDate: filterState.regsiterTime ? filterState.regsiterTime[0] : '',
|
|
|
|
- RegisterEndDate: filterState.regsiterTime ? filterState.regsiterTime[1] : '',
|
|
|
|
- CreateStartDate: filterState.createTime ? filterState.createTime[0] : '',
|
|
|
|
- CreateEndDate: filterState.createTime ? filterState.createTime[1] : '',
|
|
|
|
- SortParam:filterState.sortType,
|
|
|
|
- SortType:filterState.sortVal
|
|
|
|
- })
|
|
|
|
- tableLoading.value = false
|
|
|
|
- if (res.Ret === 200) {
|
|
|
|
- userList.value = res.Data.List || []
|
|
|
|
- totals.value = res.Data.Paging.Totals
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-getUserList()
|
|
|
|
-getSellerDepartment()
|
|
|
|
-function handlePageChange(e) {
|
|
|
|
- page.value = e
|
|
|
|
- getUserList()
|
|
|
|
-}
|
|
|
|
-async function getSellerDepartment() {
|
|
|
|
- tableLoading.value = true
|
|
|
|
- const res = await apiCustomerUser.sellerDepartmentList()
|
|
|
|
- tableLoading.value = false
|
|
|
|
- if (res.Ret === 200) {
|
|
|
|
- departmentList.value = res.Data || []
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-function handleTableSort(e) {
|
|
|
|
- // console.log(e);
|
|
|
|
- const { order, prop } = e//order:"descending",prop: "RegisterTime"
|
|
|
|
- filterState.sortType=prop
|
|
|
|
- if(!order){
|
|
|
|
- filterState.sortVal=''
|
|
|
|
- }else{
|
|
|
|
- filterState.sortVal=order==='descending'?'desc':'asc'
|
|
|
|
- }
|
|
|
|
- handleFilterList()
|
|
|
|
-}
|
|
|
|
-function handleFilterList() {
|
|
|
|
- page.value = 1
|
|
|
|
- getUserList()
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-const showDetail=ref(false)
|
|
|
|
-const activeUserId=ref(0)
|
|
|
|
-const activeUserName=ref('')
|
|
|
|
-function handleShowDetail(e){
|
|
|
|
- activeUserId.value=e.UserId
|
|
|
|
- activeUserName.value=e.RealName
|
|
|
|
- showDetail.value=true
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-// 跳转详情
|
|
|
|
-function handleGoDetail(e){
|
|
|
|
- const link=router.resolve({
|
|
|
|
- path:'/customer/userDetail',
|
|
|
|
- query:{
|
|
|
|
- id:e.UserId
|
|
|
|
- }
|
|
|
|
- }).href
|
|
|
|
- window.open(link,'__blank')
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-</script>
|
|
|
|
-
|
|
|
|
-<template>
|
|
|
|
- <div class="user-report-statistic-page">
|
|
|
|
- <div class="flex filter-wrap">
|
|
|
|
- <el-button type="primary" :icon="Switch" link @click="emits('change','list')">统计图</el-button>
|
|
|
|
- <el-select
|
|
|
|
- placeholder="请选择营业部"
|
|
|
|
- v-model="filterState.SellerDepartmentId"
|
|
|
|
- style="width: 165px"
|
|
|
|
- clearable
|
|
|
|
- @change="handleFilterList"
|
|
|
|
- >
|
|
|
|
- <el-option v-for="(item, index) in departmentList" :key="index" :label="item.SysDepartmentName" :value="item.SysDepartmentId"></el-option>
|
|
|
|
- </el-select>
|
|
|
|
- <el-select
|
|
|
|
- placeholder="用户状态"
|
|
|
|
- v-model="filterState.status"
|
|
|
|
- style="width: 165px"
|
|
|
|
- @change="handleFilterList"
|
|
|
|
- >
|
|
|
|
- <el-option label="启用" :value="1"></el-option>
|
|
|
|
- <el-option label="禁用" :value="0"></el-option>
|
|
|
|
- </el-select>
|
|
|
|
- <el-select
|
|
|
|
- placeholder="注册状态"
|
|
|
|
- v-model="filterState.register"
|
|
|
|
- style="width: 165px"
|
|
|
|
- @change="handleFilterList"
|
|
|
|
- >
|
|
|
|
- <el-option label="是" value="是"></el-option>
|
|
|
|
- <el-option label="否" value="否"></el-option>
|
|
|
|
- </el-select>
|
|
|
|
- <el-select
|
|
|
|
- placeholder="是否关注公众号"
|
|
|
|
- v-model="filterState.register"
|
|
|
|
- style="width: 165px"
|
|
|
|
- @change="handleFilterList"
|
|
|
|
- >
|
|
|
|
- <el-option label="是" value="是"></el-option>
|
|
|
|
- <el-option label="否" value="否"></el-option>
|
|
|
|
- </el-select>
|
|
|
|
- <span style="width: 235px">
|
|
|
|
- <el-date-picker
|
|
|
|
- style="width: 235px"
|
|
|
|
- v-model="filterState.regsiterTime"
|
|
|
|
- type="daterange"
|
|
|
|
- range-separator="至"
|
|
|
|
- start-placeholder="注册时间"
|
|
|
|
- end-placeholder="注册时间"
|
|
|
|
- value-format="YYYY-MM-DD"
|
|
|
|
- @change="handleFilterList"
|
|
|
|
- />
|
|
|
|
- </span>
|
|
|
|
- <span style="width: 235px">
|
|
|
|
- <el-date-picker
|
|
|
|
- style="width: 235px"
|
|
|
|
- v-model="filterState.createTime"
|
|
|
|
- type="daterange"
|
|
|
|
- range-separator="至"
|
|
|
|
- start-placeholder="创建时间"
|
|
|
|
- end-placeholder="创建时间"
|
|
|
|
- value-format="YYYY-MM-DD"
|
|
|
|
- @change="handleFilterList"
|
|
|
|
- />
|
|
|
|
- </span>
|
|
|
|
- <el-input
|
|
|
|
- placeholder="姓名/手机号/邮箱"
|
|
|
|
- v-model="filterState.keyword"
|
|
|
|
- :prefix-icon="Search"
|
|
|
|
- clearable
|
|
|
|
- style="max-width: 359px;margin-left:auto"
|
|
|
|
- @input="handleFilterList"
|
|
|
|
- />
|
|
|
|
- </div>
|
|
|
|
- <div class="userlist-wrap" style="margin-top: 20px">
|
|
|
|
- <el-table
|
|
|
|
- :data="userList"
|
|
|
|
- border
|
|
|
|
- stripe
|
|
|
|
- highlight-current-row
|
|
|
|
- element-loading-text="数据加载中..."
|
|
|
|
- v-loading="tableLoading"
|
|
|
|
- @sort-change="handleTableSort"
|
|
|
|
- @row-click="handleGoDetail"
|
|
|
|
- >
|
|
|
|
- <el-table-column
|
|
|
|
- v-for="column in tableColOpt"
|
|
|
|
- :key="column.key"
|
|
|
|
- :prop="column.key"
|
|
|
|
- :label="column.label"
|
|
|
|
- :sortable="column.sort ? 'custom' : false"
|
|
|
|
- >
|
|
|
|
- <template #default="{ row }">
|
|
|
|
- <span
|
|
|
|
- v-if="column.key === 'Status'"
|
|
|
|
- :style="{ color: !row.Status ? '#f00' : '' }"
|
|
|
|
- >{{ row.Status ? "启用" : "禁用" }}</span
|
|
|
|
- >
|
|
|
|
- <el-button v-else-if="column.key === 'ReadCnt'&&row.ReadCnt>0" link type="primary" @click.stop="handleShowDetail(row)">{{row.ReadCnt}}</el-button>
|
|
|
|
- <span v-else>{{ row[column.key] }}</span>
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
- <el-pagination
|
|
|
|
- background
|
|
|
|
- layout="total,prev,pager,next"
|
|
|
|
- :current-page="page"
|
|
|
|
- :page-size="pageSize"
|
|
|
|
- :total="totals"
|
|
|
|
- @current-change="handlePageChange"
|
|
|
|
- style="margin-top: 30px;justify-content: flex-end;"
|
|
|
|
- />
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
- <UserStatisticDetail v-model:show="showDetail" :userId="activeUserId" :userName="activeUserName"/>
|
|
|
|
-</template>
|
|
|
|
-
|
|
|
|
-<style lang="scss" scoped>
|
|
|
|
-.filter-wrap{
|
|
|
|
- gap: 10px;
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
-}
|
|
|
|
-</style>
|
|
|