Commit c10ae35b authored by “yiyousong”'s avatar “yiyousong”

pref:修改易政秀报表

parent 619b968b
<template> <template>
<div class="PoliticsShow-Container"> <div class="PoliticsShow-Container">
<div class="header_box"> <div class="header_box">
<div> <div>
<a-button <a-button
:loading="btnLoading" :loading="btnLoading"
type="primary" class="addclass" type="primary"
@click="handleExportTable" class="addclass"
> @click="handleExportTable"
<span>{{ tableSelectedRows.length ? "导出" : "导出全部" }}</span> >
</a-button> <span>{{ tableSelectedRows.length ? "导出" : "导出全部" }}</span>
<b>用户总数:<i>{{tableData.total}}</i></b> </a-button>
<b>试用客户:<i>{{tableData.trial}}</i></b> <b
<b>VIP:<i>{{tableData.vip}}</i></b> >用户总数:<i>{{ tableData.total }}</i></b
<b>设计师:<i>{{tableData.designer}}</i></b> >
<b>图片作品数:<i>{{tableData.picturesCount}}</i></b> <b
<b>视频作品数:<i>{{tableData.videosCount}}</i></b> >试用客户:<i>{{ tableData.trial }}</i></b
</div> >
<span class="topBoxFlex"> <!-- <b>VIP:<i>{{tableData.vip}}</i></b> -->
<a-input allowClear v-model="searchForm.query" placeholder="请输入用户姓名/手机号搜索"> <b
<a-icon slot="prefix" type="search" /> >设计师:<i>{{ tableData.designer }}</i></b
</a-input> >
<a-select v-model="searchForm.memberLevel"> <b
<a-select-option value=""> 全部 </a-select-option> >图片作品数:<i>{{ tableData.picturesCount }}</i></b
<a-select-option v-for="(item, index) of levelList" :key="index" :value="index"> >
{{ item }} <b
</a-select-option> >视频作品数:<i>{{ tableData.videosCount }}</i></b
</a-select> >
<a-button type="primary" class="addclass" @click="getList">搜索</a-button> </div>
</span> <span class="topBoxFlex">
</div> <a-space>
<div class="main"> <a-input
<a-table size="small" bordered :row-key="(record) => record.id" :row-selection="{ allowClear
selectedRowKeys: tableSelectedKeys, v-model="searchForm.query"
onChange: onSelectChange, placeholder="请输入用户姓名/手机号搜索"
}" :scroll="{ y: 590 }" :pagination="tablePagination" @change="pagTableChange" :loading="tableLoading" >
:columns="tableHeaders" :dataSource="tableList"> <a-icon slot="prefix" type="search" />
<template slot="zhenshixingming" slot-scope="text, record, index"> </a-input>
<a-button type="link" @click="openUserDetails(record)">{{ text?text:'--' }}</a-button> <a-select v-model="searchForm.memberLevel">
</template> <a-select-option value=""> 全部 </a-select-option>
<template slot="tupianzuopinshuliang" slot-scope="text, record, index"> <a-select-option
<a-button type="link" @click="openPicWorks(record.id)">{{ (text || text==0)?text:'--' }}</a-button> v-for="(item, index) of levelList"
</template> :key="index"
</a-table> :value="index"
<PicWorks ref="PicWorks" /> >
<UserDetails ref="UserDetails" @openPicWorks="openPicWorks" /> {{ item }}
</div> </a-select-option>
</div> </a-select>
<a-button type="primary" class="addclass" @click="getList"
>搜索</a-button
>
</a-space>
</span>
</div>
<div class="main">
<a-table
size="small"
bordered
:row-key="(record) => record.id"
:row-selection="{
selectedRowKeys: tableSelectedKeys,
onChange: onSelectChange,
}"
:scroll="{ y: 590 }"
:pagination="tablePagination"
@change="pagTableChange"
:loading="tableLoading"
:columns="tableHeaders"
:dataSource="tableList"
>
<template slot="zhenshixingming" slot-scope="text">
<a-button type="link" @click="openUserDetails(record)">{{
text ? text : "--"
}}</a-button>
</template>
<template slot="tupianzuopinshuliang" slot-scope="text">
<a-button type="link" @click="openPicWorks(record.id)">{{
text || text == 0 ? text : "--"
}}</a-button>
</template>
</a-table>
<PicWorks ref="PicWorks" />
<UserDetails ref="UserDetails" @openPicWorks="openPicWorks" />
</div>
</div>
</template> </template>
<script> <script>
...@@ -53,244 +90,240 @@ import table from "@/mixins/table"; ...@@ -53,244 +90,240 @@ import table from "@/mixins/table";
import UserDetails from "./components/UserDetails.vue"; import UserDetails from "./components/UserDetails.vue";
import PicWorks from "./components/PicWorks.vue"; import PicWorks from "./components/PicWorks.vue";
import { export2Excel } from "@/utils/js/exportExcel"; import { export2Excel } from "@/utils/js/exportExcel";
import { import { getCustomer } from "@/api/customer";
getCustomer
} from "@/api/customer";
const levelList = { const levelList = {
0: '未开启', 0: "未开启",
1: '试用客户', 1: "试用客户",
2: 'VIP', // 2: "VIP",
3: '设计师' 3: "设计师",
} };
export default { export default {
mixins: [table], mixins: [table],
name: "PortalAdminVuePoliticsShow", name: "PortalAdminVuePoliticsShow",
data() { data() {
return { return {
btnLoading: false, btnLoading: false,
levelList: levelList, levelList: levelList,
tableList: [], tableList: [],
tableData:{}, tableData: {},
searchForm: { searchForm: {
query: "",//姓名手机号查询条件 query: "", //姓名手机号查询条件
memberLevel: "",//会员等级查询条件 memberLevel: "", //会员等级查询条件
customerSrc: "",//客户来源查询条件 customerSrc: "", //客户来源查询条件
}, },
tableHeaders: [{ tableHeaders: [
title: "序号", {
dataIndex: "index", title: "序号",
width: "60px", dataIndex: "index",
key: "index", width: "60px",
align: "center", key: "index",
customRender: (text, record, index) => `${index + 1}`, align: "center",
}, customRender: (text, record, index) =>
{ (this.tablePagination.current - 1) * this.tablePagination.pageSize +
title: "真实姓名", index +
align: "center", 1,
dataIndex: "custName", },
scopedSlots: { {
customRender: "zhenshixingming", title: "真实姓名",
}, align: "center",
}, dataIndex: "custName",
{ scopedSlots: {
title: "联系电话", customRender: "zhenshixingming",
align: "center", },
dataIndex: "contactTelphone", },
customRender: (text) => `${text?text:'--'}`, {
}, title: "联系电话",
{ align: "center",
title: "单位名称", dataIndex: "contactTelphone",
align: "center", customRender: (text) => `${text ? text : "--"}`,
dataIndex: "organization", },
customRender: (text) => `${text?text:'--'}`, {
}, title: "单位名称",
{ align: "center",
title: "图片作品数量", dataIndex: "organization",
align: "center", customRender: (text) => `${text ? text : "--"}`,
dataIndex: "customerDesignPictures", },
scopedSlots: { {
customRender: "tupianzuopinshuliang", title: "图片作品数量",
}, align: "center",
}, dataIndex: "customerDesignPictures",
{ scopedSlots: {
title: "视频作品数量", customRender: "tupianzuopinshuliang",
align: "center", },
dataIndex: "customerDesignVideos", },
customRender: (text) => `${(text || text==0)?text:'--'}`, {
}, title: "视频作品数量",
{ align: "center",
title: "会员等级", dataIndex: "customerDesignVideos",
align: "center", customRender: (text) => `${text || text == 0 ? text : "--"}`,
dataIndex: "memberLevel", },
customRender: (text, record, index) => levelList[text], {
}, title: "会员等级",
{ align: "center",
title: "最近登录时间", dataIndex: "memberLevel",
align: "center", customRender: (text, record, index) => levelList[text],
dataIndex: "lastLoginTime", },
customRender: (text) => `${text?text:'--'}`, {
}, title: "最近登录时间",
{ align: "center",
title: "使用状态", dataIndex: "lastLoginTime",
align: "center", customRender: (text) => `${text ? text : "--"}`,
dataIndex: "status", },
customRender: (text, record, index) => text == 1 ? '正常' : '禁用', {
}, title: "使用状态",
], align: "center",
searchName: undefined, dataIndex: "status",
tablePagination:{ customRender: (text, record, index) => (text == 1 ? "正常" : "禁用"),
current:1, },
pageSize:10 ],
}, searchName: undefined,
tableSelectedKeys:[], tablePagination: {
tableSelectedRows:[], current: 1,
tHeader: [ pageSize: 10,
// 导出的表头名信息 },
"真实姓名", tableSelectedKeys: [],
"联系电话", tableSelectedRows: [],
"单位名称", tHeader: [
"图片作品数量", // 导出的表头名信息
"视频作品数量", "真实姓名",
"会员等级", "联系电话",
"最近登录时间", "单位名称",
"使用状态", "图片作品数量",
], "视频作品数量",
filterVal: [ "会员等级",
// 导出的表头字段名,需要导出表格字段名 "最近登录时间",
"custName", "使用状态",
"contactTelphone", ],
"organization", filterVal: [
"customerDesignPictures", // 导出的表头字段名,需要导出表格字段名
"customerDesignVideos", "custName",
"memberLevel", "contactTelphone",
"lastLoginTime", "organization",
"status" "customerDesignPictures",
], "customerDesignVideos",
}; "memberLevel",
}, "lastLoginTime",
components: { "status",
UserDetails, ],
PicWorks, };
}, },
mounted() { components: {
this.setMoment(); UserDetails,
}, PicWorks,
created() { },
this.getList(); mounted() {
}, this.setMoment();
methods: { },
// 获取列表数据 created() {
async getList(search = {}) { this.getList();
let res = await getCustomer({ },
page: this.tablePagination.current, methods: {
size: this.tablePagination.pageSize, // 获取列表数据
...this.searchForm, async getList(search = {}) {
...search, let res = await getCustomer({
}); page: this.tablePagination.current,
if (res.code == 1) { size: this.tablePagination.pageSize,
let { ...this.searchForm,
data, ...search,
total, });
pageInfo if (res.code == 1) {
} = res.data; let { data, total, pageInfo } = res.data;
this.tableList = data; this.tableList = data;
this.tableData = res.data this.tableData = res.data;
this.tablePagination.total = total; this.tablePagination.total = total;
return data return data;
} }
}, },
//分页 //分页
pagTableChange(page) { pagTableChange(page) {
this.tablePagination.current = page.current this.tablePagination.current = page.current;
this.tablePagination.pageSize = page.pageSize this.tablePagination.pageSize = page.pageSize;
this.getList(); this.getList();
}, },
// 选中 // 选中
onSelectChange(keys, rows) { onSelectChange(keys, rows) {
this.tableSelectedKeys = keys; this.tableSelectedKeys = keys;
const res = new Map(); const res = new Map();
this.tableSelectedRows = [...this.tableSelectedRows, ...rows] this.tableSelectedRows = [...this.tableSelectedRows, ...rows]
.filter((v) => { .filter((v) => {
return !res.has(v.id) && res.set(v.id, 1); return !res.has(v.id) && res.set(v.id, 1);
}) })
.filter((v) => { .filter((v) => {
return this.tableSelectedKeys.some((val) => v.id == val); return this.tableSelectedKeys.some((val) => v.id == val);
}); });
}, },
// 导出 // 导出
async handleExportTable() { async handleExportTable() {
this.btnLoading = true; this.btnLoading = true;
let obj = { let obj = {
1: "正常", 1: "正常",
2: "禁用", 2: "禁用",
}; };
let data = [] let data = [];
if (this.tableSelectedKeys.length && this.tableSelectedRows.length) { if (this.tableSelectedKeys.length && this.tableSelectedRows.length) {
// 深度克隆避免影响页面表格展示 // 深度克隆避免影响页面表格展示
data = this.$_.cloneDeep(this.tableSelectedRows); data = this.$_.cloneDeep(this.tableSelectedRows);
data.forEach((item) => { data.forEach((item) => {
Object.keys(obj).forEach((keys) => { Object.keys(obj).forEach((keys) => {
if (item.status == keys) { if (item.status == keys) {
item.status = obj[keys]; item.status = obj[keys];
} }
}); });
}); });
export2Excel( export2Excel(
this.tHeader, this.tHeader,
this.filterVal, this.filterVal,
data, data,
"易政秀报表" + this.$moment().format("YYYYMMDDHHmmss") "易政秀报表" + this.$moment().format("YYYYMMDDHHmmss")
); );
} else { } else {
data = this.$_.cloneDeep( data = this.$_.cloneDeep(await this.getList({ page: 1, size: -1 }));
await this.getList({ page: 1, size: -1 }) if (!data.length) return;
); for (let item of data) {
if (!data.length) return; Object.keys(obj).forEach((key) => {
for (let item of data) { if (item.status == key) {
Object.keys(obj).forEach((key) => { item.status = obj[key];
if (item.status == key) { }
item.status = obj[key]; });
} }
}); export2Excel(
} this.tHeader,
export2Excel( this.filterVal,
this.tHeader, data,
this.filterVal, "易政秀报表" + this.$moment().format("YYYYMMDDHHmmss")
data, );
"易政秀报表" + this.$moment().format("YYYYMMDDHHmmss") }
); this.btnLoading = false;
} },
this.btnLoading = false; QueueState(type) {
}, switch (type) {
QueueState(type) { case 0:
switch (type) { return "type1";
case 0: case 1:
return "type1"; return "type2";
case 1:
return "type2";
default: default:
return "type0"; return "type0";
} }
}, },
openPicWorks(id) { openPicWorks(id) {
this.$refs.PicWorks.modalInfo.title = "作品数量"; this.$refs.PicWorks.modalInfo.title = "作品数量";
this.$refs.PicWorks.modalInfo.visible = true; this.$refs.PicWorks.modalInfo.visible = true;
this.$refs.PicWorks.modalInfo.width = "32%"; this.$refs.PicWorks.modalInfo.width = "32%";
this.$refs.PicWorks.modalInfo.id = id this.$refs.PicWorks.modalInfo.id = id;
}, },
openUserDetails(record) { openUserDetails(record) {
this.$refs.UserDetails.modalInfo.title = "客户详情"; this.$refs.UserDetails.modalInfo.title = "客户详情";
this.$refs.UserDetails.modalInfo.visible = true; this.$refs.UserDetails.modalInfo.visible = true;
this.$refs.UserDetails.modalInfo.record = record; this.$refs.UserDetails.modalInfo.record = record;
}, },
}, },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
/deep/.ant-spin-container { /deep/.ant-spin-container {
display: block; display: block;
} }
</style> </style>
\ No newline at end of file
...@@ -2,29 +2,48 @@ ...@@ -2,29 +2,48 @@
<div class="callRecord-Container"> <div class="callRecord-Container">
<div class="header_box"> <div class="header_box">
<div> <div>
<a-button type="primary" class="addclass" @click="handleExportTable" :loading="btnLoading"> <a-button
type="primary"
class="addclass"
@click="handleExportTable"
:loading="btnLoading"
>
<span>{{ tableSelectedRows.length ? "导出" : "导出全部" }}</span> <span>{{ tableSelectedRows.length ? "导出" : "导出全部" }}</span>
</a-button> </a-button>
<b>叫号次数:<i>{{ tablePagination.total }}</i></b> <b
>叫号次数:<i>{{ tablePagination.total }}</i></b
>
<sub>统计时间段:{{ searchForm.time[0] }}~{{ searchForm.time[1] }}</sub> <sub>统计时间段:{{ searchForm.time[0] }}~{{ searchForm.time[1] }}</sub>
</div> </div>
<span> <span>
<a-space> <a-space>
<a-select v-model="searchForm.hallid"> <a-select v-model="searchForm.hallid">
<a-select-option value=""> 全部大厅 </a-select-option> <a-select-option value=""> 全部大厅 </a-select-option>
<a-select-option v-for="item in datingList" :key="item.id" :value="item.id"> <a-select-option
v-for="item in datingList"
:key="item.id"
:value="item.id"
>
{{ item.hallName }} {{ item.hallName }}
</a-select-option> </a-select-option>
</a-select> </a-select>
<a-select v-model="searchForm.sectionid"> <a-select v-model="searchForm.sectionid">
<a-select-option value=""> 全部部门 </a-select-option> <a-select-option value=""> 全部部门 </a-select-option>
<a-select-option v-for="item in bumenList" :key="item.id" :value="item.id"> <a-select-option
v-for="item in bumenList"
:key="item.id"
:value="item.id"
>
{{ item.name }} {{ item.name }}
</a-select-option> </a-select-option>
</a-select> </a-select>
<a-select v-model="searchForm.id"> <a-select v-model="searchForm.id">
<a-select-option value=""> 全部设备 </a-select-option> <a-select-option value=""> 全部设备 </a-select-option>
<a-select-option v-for="item in deviceData" :key="item.id" :value="item.id"> <a-select-option
v-for="item in deviceData"
:key="item.id"
:value="item.id"
>
{{ item.name }} {{ item.name }}
</a-select-option> </a-select-option>
</a-select> </a-select>
...@@ -36,20 +55,36 @@ ...@@ -36,20 +55,36 @@
</a-select> </a-select>
<a-range-picker valueFormat="YYYY-MM-DD" v-model="searchForm.time"> <a-range-picker valueFormat="YYYY-MM-DD" v-model="searchForm.time">
</a-range-picker> </a-range-picker>
<a-input v-model="searchForm.flownum" placeholder="请输入排队编号搜索" @pressEnter="handleSearch"> <a-input
v-model="searchForm.flownum"
placeholder="请输入排队编号搜索"
@pressEnter="handleSearch"
>
<a-icon slot="prefix" type="search" /> <a-icon slot="prefix" type="search" />
</a-input> </a-input>
<a-button type="primary" class="addclass" @click="handleSearch">搜索</a-button> <a-button type="primary" class="addclass" @click="handleSearch"
>搜索</a-button
>
<a-button @click="resetBtn">重置</a-button> <a-button @click="resetBtn">重置</a-button>
</a-space> </a-space>
</span> </span>
</div> </div>
<div class="main"> <div class="main">
<a-table size="small" bordered :row-key="(record) => record.id" :row-selection="{ <a-table
selectedRowKeys: tableSelectedKeys, size="small"
onChange: onSelectChange, bordered
}" :scroll="{ y: 590 }" :pagination="tablePagination" @change="changeTablePage" :loading="tableLoading" :row-key="(record) => record.id"
:columns="tableHeaders" :dataSource="tableList"> :row-selection="{
selectedRowKeys: tableSelectedKeys,
onChange: onSelectChange,
}"
:scroll="{ y: 590 }"
:pagination="tablePagination"
@change="changeTablePage"
:loading="tableLoading"
:columns="tableHeaders"
:dataSource="tableList"
>
<!-- 序号 --> <!-- 序号 -->
<span slot="num" slot-scope="text, record, index">{{ <span slot="num" slot-scope="text, record, index">{{
(tablePagination.current - 1) * tablePagination.pageSize + index + 1 (tablePagination.current - 1) * tablePagination.pageSize + index + 1
...@@ -71,7 +106,11 @@ ...@@ -71,7 +106,11 @@
</template> </template>
<!-- 办理业务 --> <!-- 办理业务 -->
<template slot="business" slot-scope="text"> <template slot="business" slot-scope="text">
<a v-if="text.business" @click="openBusiness(text.business, text.businessid)">{{ text.business }}</a> <a
v-if="text.business"
@click="openBusiness(text.business, text.businessid)"
>{{ text.business }}</a
>
<span v-else>--</span> <span v-else>--</span>
</template> </template>
<!-- 办理开始时间 --> <!-- 办理开始时间 -->
...@@ -91,8 +130,8 @@ ...@@ -91,8 +130,8 @@
<template slot="window_name" slot-scope="text"> <template slot="window_name" slot-scope="text">
{{ {{
text.window_name text.window_name
? text.window_name + "-" + text.window_fromnum ? text.window_name + "-" + text.window_fromnum
: "--" : "--"
}} }}
</template> </template>
<!-- 工作人员 --> <!-- 工作人员 -->
...@@ -112,11 +151,13 @@ ...@@ -112,11 +151,13 @@
</template> </template>
<!-- 状态 --> <!-- 状态 -->
<template slot="style" slot-scope="text"> <template slot="style" slot-scope="text">
<span :class="{ <span
'stand-line': text.style === 0, :class="{
'on-transact': text.style === 1, 'stand-line': text.style === 0,
'on-end': text.style === 4, 'on-transact': text.style === 1,
}"> 'on-end': text.style === 4,
}"
>
{{ $codeMap.queueState[text.style] }} {{ $codeMap.queueState[text.style] }}
</span> </span>
</template> </template>
...@@ -280,7 +321,7 @@ export default { ...@@ -280,7 +321,7 @@ export default {
time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")], // 时间区间 time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")], // 时间区间
flownum: "", // 排号编码 flownum: "", // 排号编码
hallid: "", hallid: "",
sectionid: "" sectionid: "",
}, },
// 大厅列表 // 大厅列表
datingList: [], datingList: [],
...@@ -354,7 +395,7 @@ export default { ...@@ -354,7 +395,7 @@ export default {
this.getCalllistArr(); this.getCalllistArr();
this.getCallQueListArr(); this.getCallQueListArr();
}, },
mounted() { }, mounted() {},
methods: { methods: {
// 获取大厅列表 // 获取大厅列表
async getDatingListArr() { async getDatingListArr() {
...@@ -379,7 +420,7 @@ export default { ...@@ -379,7 +420,7 @@ export default {
time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")], // 时间区间 time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")], // 时间区间
flownum: "", // 排号编码 flownum: "", // 排号编码
hallid: "", hallid: "",
sectionid: "" sectionid: "",
}; };
this.getCallQueListArr(); this.getCallQueListArr();
}, },
...@@ -408,7 +449,7 @@ export default { ...@@ -408,7 +449,7 @@ export default {
let { data, total } = res.data; let { data, total } = res.data;
this.tableList = data; this.tableList = data;
this.tablePagination.total = total; this.tablePagination.total = total;
console.log(this.tableList) console.log(this.tableList);
return data; return data;
} }
}, },
......
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