11b31c5e by simon

1.表单功能

2.打点统计
1 parent 1c64b1c0
<!DOCTYPE html>
<html>
<head>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>天宝公众号</title>
</head>
<body>
</head>
<body>
<script src="./static/js/weixin-1.1.0.js"></script>
<script src="./static/js/hdp-4.4.0.min.js"></script>
<script src="./static/js/as.js"></script>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</body>
</html>
......
......@@ -9,3 +9,66 @@ export default {
name: 'App'
}
</script>
<style lang="scss">
// @import "./styles/common";
// @import "./styles/vars";
body {
margin: 0px;
padding: 0px;
// background: @color-primary;
// font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
// Microsoft YaHei, SimSun, sans-serif;
// font-size: 14px;
// -webkit-font-smoothing: antialiased;
}
#app {
position: absolute;
top: 0px;
bottom: 0px;
width: 100%;
}
.el-submenu [class^="fa"] {
vertical-align: baseline;
margin-right: 10px;
}
.el-menu-item [class^="fa"] {
vertical-align: baseline;
margin-right: 10px;
}
.toolbar {
background: #f2f2f2;
padding: 10px;
margin: 10px 0px;
.el-form-item {
margin-bottom: 10px;
}
}
.fade-enter-active,
.fade-leave-active {
transition: all 0.2s ease;
}
.fade-enter,
.fade-leave-active {
opacity: 0;
}
.avatar-wrap {
display: flex;
justify-content: flex-start;
align-items: center;
.avatar {
width: 40px;
height: 40px;
}
}
</style>
......
module.exports = {
testListGet: '/xxx/xxx/list'
testListGet: '/xxx/xxx/list',
exportTable: exportTable,
}
function exportTable(params) {
let url = 'https://api.k.wxpai.cn/awp/plugins/export/' + params.func + '?id=' + params.appId + '&key=' + params.appKey + '&val=' + params.data;
console.log("url:", url);
window.open(url)
}
......
/**
* 获取当前链接参数
* @param {*} name
*/
export const getLinkParam = name => {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
};
/**
* 去掉字符串两端空格 trim
* @param {string} str
*/
export const trim = str => {
return str.replace(/(^\s*)|(\s*$)/g, '');
}
/**
* 验证邮箱
* @param {string} str
*/
export const checkEmail = str => {
let re = /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/;
if (re.test(str)) {
return true;
} else {
return false;
}
}
/**
* 验证手机 1开头+10位数
* @param {string} str
*/
export const checkMobile = str => {
let re = /^1\d{10}$/;
// let re = /^(13[0-9]|14[57]|15[0-9]|17[0-9]|18[0-9])\d{8}$/; //严格模式
if (re.test(str)) {
return true;
} else {
return false;
}
}
/**
* 获取Uuid
*/
export const uuid = () => {
var s = [];
var hexDigits = "0123456789abcdef";
for (var i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
s[8] = s[13] = s[18] = s[23] = "-";
var uuid = s.join("");
return uuid;
}
/**
* 设置cookies
* @param {*} name
* @param {*} value
* @param {*} Days
*/
export const setCookie = (name, value, Days = 0) => {
if (Days <= 0) Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000);
document.cookie = name + "=" + encodeURI(value) + ";expires=" + exp.toUTCString();
}
/**
* 获取cookies
* @param {*} name
* @param {*} value
* @param {*} Days
*/
export const getCookie = (name) => {
var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
if (arr = document.cookie.match(reg)) {
return decodeURI(arr[2]);
} else {
return "";
}
}
/**
* 删除cookies
* @param {*} name
*/
export const deleteCookie = (name) => {
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval = getCookie(name);
if (cval != null)
document.cookie = name + "=" + cval + ";expires=" + exp.toUTCString();
}
/**
* 判断是否微信客户端
* @param {*} name
*/
export const isWeiXin = () => {
var ua = window.navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == 'micromessenger') {
return true;
} else {
return false;
}
}
/**
* 时间戳格式化(yyyy-MM-dd hh:mm:ss)
* @param {*} timestamp
* @param {*} format
*/
export const timestampFormat = (timestamp, format) => {
Date.prototype.Format = function (fmt) {
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours(), //小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
return fmt;
}
if (timestamp && timestamp.length == 10) timestamp += "000";
var date = new Date();
if (timestamp) date.setTime(timestamp);
if (format == null || format == "") {
format = "yyyy-MM-dd hh:mm:ss";
}
return date.Format(format);
};
/**
* 日期转时间戳
* @param {*} stringTime
*/
export const dateParse = stringTime => {
if (stringTime) {
var date = new Date(stringTime);
} else {
var date = new Date();
}
return Date.parse(date);
};
/**
* 生成指定范围内的随机数
* @param {*} min
* @param {*} max
*/
export const getRandom = (min, max) => {
var c = max - min + 1;
return Math.floor(Math.random() * c + min);
};
/**
* 日期格式化
*/
export const formatDate = {
SIGN_REGEXP: /([yMdhsm])(\1*)/g,
DEFAULT_PATTERN: 'yyyy-MM-dd',
padding: function (s, len) {
var len = len - (s + '').length;
for (var i = 0; i < len; i++) {
s = '0' + s;
}
return s;
},
format: function (date, pattern) {
pattern = pattern || formatDate.DEFAULT_PATTERN;
return pattern.replace(formatDate.SIGN_REGEXP, function ($0) {
switch ($0.charAt(0)) {
case 'y':
return formatDate.padding(date.getFullYear(), $0.length);
case 'M':
return formatDate.padding(date.getMonth() + 1, $0.length);
case 'd':
return formatDate.padding(date.getDate(), $0.length);
case 'w':
return date.getDay() + 1;
case 'h':
return formatDate.padding(date.getHours(), $0.length);
case 'm':
return formatDate.padding(date.getMinutes(), $0.length);
case 's':
return formatDate.padding(date.getSeconds(), $0.length);
}
});
},
parse: function (dateString, pattern) {
var matchs1 = pattern.match(formatDate.SIGN_REGEXP);
var matchs2 = dateString.match(/(\d)+/g);
if (matchs1.length == matchs2.length) {
var _date = new Date(1970, 0, 1);
for (var i = 0; i < matchs1.length; i++) {
var _int = parseInt(matchs2[i]);
var sign = matchs1[i];
switch (sign.charAt(0)) {
case 'y':
_date.setFullYear(_int);
break;
case 'M':
_date.setMonth(_int - 1);
break;
case 'd':
_date.setDate(_int);
break;
case 'h':
_date.setHours(_int);
break;
case 'm':
_date.setMinutes(_int);
break;
case 's':
_date.setSeconds(_int);
break;
}
}
return _date;
}
return null;
}
}
......@@ -22,22 +22,29 @@ import Layout from '../views/layout/Layout'
breadcrumb: false if false, the item will hidden in breadcrumb(default is true)
}
**/
export const constantRouterMap = [
{ path: '/login', component: () => import('@/views/login/index'), hidden: true },
{ path: '/404', component: () => import('@/views/404'), hidden: true },
export const constantRouterMap = [{
path: '/login',
component: () => import('@/views/login/index'),
hidden: true
},
{
path: '/',
component: Layout,
redirect: '/dashboard',
name: 'Dashboard',
hidden: true,
children: [{
path: 'dashboard',
component: () => import('@/views/dashboard/index')
}]
path: '/404',
component: () => import('@/views/404'),
hidden: true
},
/* {
// {
// path: '/',
// component: Layout,
// redirect: '/dashboard',
// name: 'Dashboard',
// hidden: true,
// children: [{
// path: 'dashboard',
// component: () => import('@/views/dashboard/index')
// }]
// },
/* {
path: '/form',
component: Layout,
children: [
......@@ -49,104 +56,179 @@ export const constantRouterMap = [
}
]
},*/
{
path: '/qrcode',
path: '/',
component: Layout,
children: [
{
path: 'index',
name: 'Qrcode',
component: () => import('@/views/scene/index'),
meta: { title: '订阅信息', icon: 'form' }
redirect: '/dictionary/reservation',
name: 'dictionary',
meta: {
title: '天宝宝典',
icon: 'nested'
},
children: [{
path: '/dictionary/reservation',
name: 'reservation',
component: () => import('@/views/dictionary/reservation'),
meta: {
title: '预约明细',
icon: ''
}
]
},
/*{
path: '/example',
component: Layout,
redirect: '/example/table',
name: 'Example',
meta: { title: 'Example', icon: 'example' },
children: [
{
path: 'table',
name: 'Table',
component: () => import('@/views/table/index'),
meta: { title: 'Table', icon: 'table' }
path: '/dictionary/pvpage',
name: 'pvpage',
component: () => import('@/views/dictionary/pvpage'),
meta: {
title: '页面访问明细',
icon: ''
}
},
{
path: 'tree',
name: 'Tree',
component: () => import('@/views/tree/index'),
meta: { title: 'Tree', icon: 'tree' }
path: '/dictionary/pvproduct',
name: 'pvproduct',
component: () => import('@/views/dictionary/pvproduct'),
meta: {
title: '产品访问明细',
icon: ''
}
},
]
},*/
/*
},
{
path: '/nested',
path: '/calculator',
component: Layout,
redirect: '/nested/menu1',
name: 'Nested',
redirect: '/calculator/pvpage',
name: 'dictionary',
meta: {
title: 'Nested',
title: '天宝计算器',
icon: 'nested'
},
children: [
{
path: 'menu1',
component: () => import('@/views/nested/menu1/index'), // Parent router-view
name: 'Menu1',
meta: { title: 'Menu1' },
children: [
{
path: 'menu1-1',
component: () => import('@/views/nested/menu1/menu1-1'),
name: 'Menu1-1',
meta: { title: 'Menu1-1' }
},
{
path: 'menu1-2',
component: () => import('@/views/nested/menu1/menu1-2'),
name: 'Menu1-2',
meta: { title: 'Menu1-2' },
children: [
{
path: 'menu1-2-1',
component: () => import('@/views/nested/menu1/menu1-2/menu1-2-1'),
name: 'Menu1-2-1',
meta: { title: 'Menu1-2-1' }
},
{
path: 'menu1-2-2',
component: () => import('@/views/nested/menu1/menu1-2/menu1-2-2'),
name: 'Menu1-2-2',
meta: { title: 'Menu1-2-2' }
path: '/calculator/pvpage',
name: 'pvpage',
component: () => import('@/views/calculator/pvpage'),
meta: {
title: '页面访问明细',
icon: ''
}
]
},
{
path: 'menu1-3',
component: () => import('@/views/nested/menu1/menu1-3'),
name: 'Menu1-3',
meta: { title: 'Menu1-3' }
path: '/calculator/pvfunc',
name: 'pvfunc',
component: () => import('@/views/calculator/pvfunc'),
meta: {
title: '功能访问明细',
icon: ''
}
},
]
},
{
path: 'menu2',
component: () => import('@/views/nested/menu2/index'),
meta: { title: 'menu2' }
path: '/qrcode',
component: Layout,
children: [{
path: 'index',
name: 'Qrcode',
component: () => import('@/views/scene/index'),
meta: {
title: '订阅信息',
icon: 'form'
}
]
}]
},
*/
// {
// path: '/example',
// component: Layout,
// redirect: '/example/table',
// name: 'Example',
// meta: {
// title: 'Example',
// icon: 'example'
// },
// children: [{
// path: 'table',
// name: 'Table',
// component: () => import('@/views/table/index'),
// meta: {
// title: 'Table',
// icon: 'table'
// }
// },
// {
// path: 'tree',
// name: 'Tree',
// component: () => import('@/views/tree/index'),
// meta: {
// title: 'Tree',
// icon: 'tree'
// }
// }
// ]
// },
// {
// path: '/nested',
// component: Layout,
// redirect: '/nested/menu1',
// name: 'Nested',
// meta: {
// title: 'Nested',
// icon: 'nested'
// },
// children: [
// {
// path: 'menu1',
// component: () => import('@/views/nested/menu1/index'), // Parent router-view
// name: 'Menu1',
// meta: { title: 'Menu1' },
// children: [
// {
// path: 'menu1-1',
// component: () => import('@/views/nested/menu1/menu1-1'),
// name: 'Menu1-1',
// meta: { title: 'Menu1-1' }
// },
// {
// path: 'menu1-2',
// component: () => import('@/views/nested/menu1/menu1-2'),
// name: 'Menu1-2',
// meta: { title: 'Menu1-2' },
// children: [
// {
// path: 'menu1-2-1',
// component: () => import('@/views/nested/menu1/menu1-2/menu1-2-1'),
// name: 'Menu1-2-1',
// meta: { title: 'Menu1-2-1' }
// },
// {
// path: 'menu1-2-2',
// component: () => import('@/views/nested/menu1/menu1-2/menu1-2-2'),
// name: 'Menu1-2-2',
// meta: { title: 'Menu1-2-2' }
// }
// ]
// },
// {
// path: 'menu1-3',
// component: () => import('@/views/nested/menu1/menu1-3'),
// name: 'Menu1-3',
// meta: { title: 'Menu1-3' }
// }
// ]
// },
// {
// path: 'menu2',
// component: () => import('@/views/nested/menu2/index'),
// meta: { title: 'menu2' }
// }
// ]
// },
// {
// path: 'external-link',
......@@ -159,11 +241,17 @@ export const constantRouterMap = [
// ]
// },
{ path: '*', redirect: '/404', hidden: true }
{
path: '*',
redirect: '/404',
hidden: true
}
]
export default new Router({
// mode: 'history', //后端支持可开
scrollBehavior: () => ({ y: 0 }),
scrollBehavior: () => ({
y: 0
}),
routes: constantRouterMap
})
......
<template>
<div class="page-container">
<div class="tool-wrap">
<div>
<el-form :inline="true" :model="filters">
<el-form-item>
<el-input @change="changeHandler()" v-model="filters.mobilePhone" placeholder="请输入使用功能"></el-input>
</el-form-item>
<el-form-item>
<el-date-picker @change="changeHandler()" v-model="filters.date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="reqQuery">查询</el-button>
</el-form-item>
</el-form>
</div>
<div>
<el-button class="reset-btn" @click="showDialog()">导出数据</el-button>
</div>
</div>
<el-table :data="totalData.reservationList" highlight-current-row v-loading="listLoading" style="width: 100%;">
<el-table-column prop="func_name" label="使用功能">
</el-table-column>
<el-table-column prop="hdp_created" :formatter="formatTableDate" label="访问时间">
</el-table-column>
<el-table-column prop="nickname" label="微信昵称">
</el-table-column>
<el-table-column label="微信头像">
<template slot-scope="scope">
<div class="avatar-wrap">
<img class="avatar" :src="scope.row.avatar" alt="">
</div>
</template>
</el-table-column>
<el-table-column prop="openid" label="openid">
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<div class="page-tips">总共{{total}}条记录,每页{{pageSize}}条,总共{{pageNum}}页</div>
<el-pagination layout="prev, pager, next,jumper" @current-change="handleCurrentChange" :page-size="pageSize" :total="total" style="float:right;">
</el-pagination>
</el-col>
<el-dialog class="dialog" center title="导出数据设定" :visible.sync="exportDialogVisible" :close-on-click-modal="false">
<span class="tips">导出日期</span>
<el-date-picker v-model="exportDate" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
<div slot="footer" class="dialog-footer">
<el-button style="width:120px;" @click.native="exportDialogVisible = false">取消</el-button>
<el-button style="width:120px;" type="primary" @click.native="exportHandler()">导出</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { Base64 } from "js-base64";
import { exportTable } from "./../../api/api.js";
import { formatDate } from "./../../common/utils.js";
export default {
data() {
return {
exportDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date().getTime()
],
exportDialogVisible: false,
listLoading: false,
page: 1,
pageSize: 10,
total: 0,
totalData: {
reservationList: []
},
selDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date()
],
pickerOptions2: {
disabledDate(time) {
return time.getTime() > Date.now();
}
},
filters: {
mobilePhone: "",
date: ""
}
};
},
computed: {
pageNum() {
return Math.ceil(this.total / this.pageSize);
},
startTime() {
let date = this.filters.date;
let result = (date && date[0]) || "";
if (result) {
result = date[0].getTime();
}
return result;
},
endTime() {
let date = this.filters.date;
let result = (date && date[1]) || "";
if (result) {
result = date[1].getTime() + 1000 * 60 * 60 * 24;
}
return result;
}
},
methods: {
changeHandler() {
this.reqQuery();
},
exportHandler() {
let data = {
start_time: new Date(this.exportDate[0]).getTime(),
end_time: new Date(this.exportDate[1]).getTime() + 1000 * 60 * 60 * 24,
mobile_phone: "",
startIndex: 0,
size: 1000000
};
var encoder = HDP.getEncoder();
var encrypted = encoder.encode(JSON.stringify(data));
let params = {
appId: "0489fba68acd11e98c527cd30aeb749e",
appKey: "9524a3c59a5d4460bd141a2a93a5db17",
func: "queryStatFuncListAppjqos",
data: encrypted
};
exportTable(params);
},
showDialog() {
this.exportDialogVisible = true;
},
formatTableDate(row, column) {
return formatDate.format(new Date(row.hdp_created), "yyyy-MM-dd hh:mm");
},
handleCurrentChange(val) {
this.page = val;
this.reqQuery();
},
reqQuery() {
let _this = this;
_this.listLoading = true;
let data = {
startIndex: (this.page - 1) * this.pageSize,
size: this.pageSize,
query: this.filters.mobilePhone,
start_time: this.startTime,
end_time: this.endTime
};
as.queryFunV2("queryStatFuncListAppjqos", data, res => {
_this.page = 1;
_this.listLoading = false;
if (res) {
let reservationList = res[0];
let total = res[1][0].total;
_this.total = total;
_this.$set(_this.totalData, "reservationList", reservationList);
}
});
}
},
mounted() {
this.reqQuery();
},
created() {}
};
</script>
<style lang="scss" scoped>
.page-container {
padding: 20px;
}
.tool-wrap {
padding: 24px 0;
display: flex;
border-bottom: solid 1px #cccccc;
justify-content: space-between;
}
.toolbar {
display: flex;
justify-content: space-between;
.page-tips {
height: 32px;
line-height: 32px;
color: #333333;
}
}
.dialog {
.tips {
margin-right: 24px;
}
}
</style>
<template>
<div class="page-container">
<div class="tool-wrap">
<div>
<el-form :inline="true" :model="filters">
<el-form-item>
<el-input @change="changeHandler()" v-model="filters.mobilePhone" placeholder="请输入访问页面"></el-input>
</el-form-item>
<el-form-item>
<el-date-picker @change="changeHandler()" v-model="filters.date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="reqQuery">查询</el-button>
</el-form-item>
</el-form>
</div>
<div>
<el-button class="reset-btn" @click="showDialog()">导出数据</el-button>
</div>
</div>
<el-table :data="totalData.reservationList" highlight-current-row v-loading="listLoading" style="width: 100%;">
<el-table-column prop="page_name" label="访问页面">
</el-table-column>
<el-table-column prop="hdp_created" :formatter="formatTableDate" label="访问时间">
</el-table-column>
<el-table-column prop="nickname" label="微信昵称">
</el-table-column>
<el-table-column label="微信头像">
<template slot-scope="scope">
<div class="avatar-wrap">
<img class="avatar" :src="scope.row.avatar" alt="">
</div>
</template>
</el-table-column>
<el-table-column prop="openid" label="openid">
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<div class="page-tips">总共{{total}}条记录,每页{{pageSize}}条,总共{{pageNum}}页</div>
<el-pagination layout="prev, pager, next,jumper" @current-change="handleCurrentChange" :page-size="pageSize" :total="total" style="float:right;">
</el-pagination>
</el-col>
<el-dialog class="dialog" center title="导出数据设定" :visible.sync="exportDialogVisible" :close-on-click-modal="false">
<span class="tips">导出日期</span>
<el-date-picker v-model="exportDate" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
<div slot="footer" class="dialog-footer">
<el-button style="width:120px;" @click.native="exportDialogVisible = false">取消</el-button>
<el-button style="width:120px;" type="primary" @click.native="exportHandler()">导出</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { Base64 } from "js-base64";
import { exportTable } from "./../../api/api.js";
import { formatDate } from "./../../common/utils.js";
export default {
data() {
return {
exportDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date().getTime()
],
exportDialogVisible: false,
listLoading: false,
page: 1,
pageSize: 10,
total: 0,
totalData: {
reservationList: []
},
selDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date()
],
pickerOptions2: {
disabledDate(time) {
return time.getTime() > Date.now();
}
},
filters: {
mobilePhone: "",
date: ""
}
};
},
computed: {
pageNum() {
return Math.ceil(this.total / this.pageSize);
},
startTime() {
let date = this.filters.date;
let result = (date && date[0]) || "";
if (result) {
result = date[0].getTime();
}
return result;
},
endTime() {
let date = this.filters.date;
let result = (date && date[1]) || "";
if (result) {
result = date[1].getTime() + 1000 * 60 * 60 * 24;
}
return result;
}
},
methods: {
changeHandler() {
this.reqQuery();
},
exportHandler() {
let data = {
start_time: new Date(this.exportDate[0]).getTime(),
end_time: new Date(this.exportDate[1]).getTime() + 1000 * 60 * 60 * 24,
mobile_phone: "",
startIndex: 0,
size: 1000000
};
var encoder = HDP.getEncoder();
var encrypted = encoder.encode(JSON.stringify(data));
let params = {
appId: "0489fba68acd11e98c527cd30aeb749e",
appKey: "9524a3c59a5d4460bd141a2a93a5db17",
func: "queryStatPageListAppjqos",
data: encrypted
};
exportTable(params);
},
showDialog() {
this.exportDialogVisible = true;
},
formatTableDate(row, column) {
return formatDate.format(new Date(row.hdp_created), "yyyy-MM-dd hh:mm");
},
handleCurrentChange(val) {
this.page = val;
this.reqQuery();
},
reqQuery() {
let _this = this;
_this.listLoading = true;
let data = {
startIndex: (this.page - 1) * this.pageSize,
size: this.pageSize,
query: this.filters.mobilePhone,
start_time: this.startTime,
end_time: this.endTime
};
as.queryFunV2("queryStatPageListAppjqos", data, res => {
_this.page = 1;
_this.listLoading = false;
if (res) {
let reservationList = res[0];
let total = res[1][0].total;
_this.total = total;
_this.$set(_this.totalData, "reservationList", reservationList);
}
});
}
},
mounted() {
this.reqQuery();
},
created() {}
};
</script>
<style lang="scss" scoped>
.page-container {
padding: 20px;
}
.tool-wrap {
padding: 24px 0;
display: flex;
border-bottom: solid 1px #cccccc;
justify-content: space-between;
}
.toolbar {
display: flex;
justify-content: space-between;
.page-tips {
height: 32px;
line-height: 32px;
color: #333333;
}
}
.dialog {
.tips {
margin-right: 24px;
}
}
</style>
<template>
<div class="page-container">
<div class="tool-wrap">
<div>
<el-form :inline="true" :model="filters">
<el-form-item>
<el-input @change="changeHandler()" v-model="filters.mobilePhone" placeholder="请输入访问页面"></el-input>
</el-form-item>
<el-form-item>
<el-date-picker @change="changeHandler()" v-model="filters.date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="reqQuery">查询</el-button>
</el-form-item>
</el-form>
</div>
<div>
<el-button class="reset-btn" @click="showDialog()">导出数据</el-button>
</div>
</div>
<el-table :data="totalData.reservationList" highlight-current-row v-loading="listLoading" style="width: 100%;">
<el-table-column prop="page_name" label="访问页面">
</el-table-column>
<el-table-column prop="hdp_created" :formatter="formatTableDate" label="访问时间">
</el-table-column>
<el-table-column prop="nickname" label="微信昵称">
</el-table-column>
<el-table-column label="微信头像">
<template slot-scope="scope">
<div class="avatar-wrap">
<img class="avatar" :src="scope.row.avatar" alt="">
</div>
</template>
</el-table-column>
<el-table-column prop="openid" label="openid">
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<div class="page-tips">总共{{total}}条记录,每页{{pageSize}}条,总共{{pageNum}}页</div>
<el-pagination layout="prev, pager, next,jumper" @current-change="handleCurrentChange" :page-size="pageSize" :total="total" style="float:right;">
</el-pagination>
</el-col>
<el-dialog class="dialog" center title="导出数据设定" :visible.sync="exportDialogVisible" :close-on-click-modal="false">
<span class="tips">导出日期</span>
<el-date-picker v-model="exportDate" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
<div slot="footer" class="dialog-footer">
<el-button style="width:120px;" @click.native="exportDialogVisible = false">取消</el-button>
<el-button style="width:120px;" type="primary" @click.native="exportHandler()">导出</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { Base64 } from "js-base64";
import { exportTable } from "./../../api/api.js";
import { formatDate } from "./../../common/utils.js";
export default {
data() {
return {
exportDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date().getTime()
],
exportDialogVisible: false,
listLoading: false,
page: 1,
pageSize: 10,
total: 0,
totalData: {
reservationList: []
},
selDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date()
],
pickerOptions2: {
disabledDate(time) {
return time.getTime() > Date.now();
}
},
filters: {
mobilePhone: "",
date: ""
}
};
},
computed: {
pageNum() {
return Math.ceil(this.total / this.pageSize);
},
startTime() {
let date = this.filters.date;
let result = (date && date[0]) || "";
if (result) {
result = date[0].getTime();
}
return result;
},
endTime() {
let date = this.filters.date;
let result = (date && date[1]) || "";
if (result) {
result = date[1].getTime() + 1000 * 60 * 60 * 24;
}
return result;
}
},
methods: {
changeHandler() {
this.reqQuery();
},
exportHandler() {
let data = {
start_time: new Date(this.exportDate[0]).getTime(),
end_time: new Date(this.exportDate[1]).getTime() + 1000 * 60 * 60 * 24,
mobile_phone: "",
startIndex: 0,
size: 1000000
};
var encoder = HDP.getEncoder();
var encrypted = encoder.encode(JSON.stringify(data));
let params = {
appId: "0489fba68acd11e98c527cd30aeb749e",
appKey: "9524a3c59a5d4460bd141a2a93a5db17",
func: "queryStatPageList",
data: encrypted
};
exportTable(params);
},
showDialog() {
this.exportDialogVisible = true;
},
formatTableDate(row, column) {
return formatDate.format(new Date(row.hdp_created), "yyyy-MM-dd hh:mm");
},
handleCurrentChange(val) {
this.page = val;
this.reqQuery();
},
reqQuery() {
let _this = this;
_this.listLoading = true;
let data = {
startIndex: (this.page - 1) * this.pageSize,
size: this.pageSize,
mobile_phone: this.filters.mobilePhone,
start_time: this.startTime,
end_time: this.endTime
};
as.queryFunV2("queryStatPageList", data, res => {
_this.page = 1;
_this.listLoading = false;
if (res) {
let reservationList = res[0];
let total = res[1][0].total;
_this.total = total;
_this.$set(_this.totalData, "reservationList", reservationList);
}
});
}
},
mounted() {
this.reqQuery();
},
created() {}
};
</script>
<style lang="scss" scoped>
.page-container {
padding: 20px;
}
.tool-wrap {
padding: 24px 0;
display: flex;
border-bottom: solid 1px #cccccc;
justify-content: space-between;
}
.toolbar {
display: flex;
justify-content: space-between;
.page-tips {
height: 32px;
line-height: 32px;
color: #333333;
}
}
.dialog {
.tips {
margin-right: 24px;
}
}
</style>
<template>
<div class="page-container">
<div class="tool-wrap">
<div>
<el-form :inline="true" :model="filters">
<el-form-item>
<el-input @change="changeHandler()" v-model="filters.mobilePhone" placeholder="请输入访问产品"></el-input>
</el-form-item>
<el-form-item>
<el-date-picker @change="changeHandler()" v-model="filters.date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="reqQuery">查询</el-button>
</el-form-item>
</el-form>
</div>
<div>
<el-button class="reset-btn" @click="showDialog()">导出数据</el-button>
</div>
</div>
<el-table :data="totalData.reservationList" highlight-current-row v-loading="listLoading" style="width: 100%;">
<el-table-column prop="product_name" label="访问产品">
</el-table-column>
<el-table-column prop="hdp_created" :formatter="formatTableDate" label="访问时间">
</el-table-column>
<el-table-column prop="nickname" label="微信昵称">
</el-table-column>
<el-table-column label="微信头像">
<template slot-scope="scope">
<div class="avatar-wrap">
<img class="avatar" :src="scope.row.avatar" alt="">
</div>
</template>
</el-table-column>
<el-table-column prop="openid" label="openid">
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<div class="page-tips">总共{{total}}条记录,每页{{pageSize}}条,总共{{pageNum}}页</div>
<el-pagination layout="prev, pager, next,jumper" @current-change="handleCurrentChange" :page-size="pageSize" :total="total" style="float:right;">
</el-pagination>
</el-col>
<el-dialog class="dialog" center title="导出数据设定" :visible.sync="exportDialogVisible" :close-on-click-modal="false">
<span class="tips">导出日期</span>
<el-date-picker v-model="exportDate" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
<div slot="footer" class="dialog-footer">
<el-button style="width:120px;" @click.native="exportDialogVisible = false">取消</el-button>
<el-button style="width:120px;" type="primary" @click.native="exportHandler()">导出</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { Base64 } from "js-base64";
import { exportTable } from "./../../api/api.js";
import { formatDate } from "./../../common/utils.js";
export default {
data() {
return {
exportDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date().getTime()
],
exportDialogVisible: false,
listLoading: false,
page: 1,
pageSize: 10,
total: 0,
totalData: {
reservationList: []
},
selDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date()
],
pickerOptions2: {
disabledDate(time) {
return time.getTime() > Date.now();
}
},
filters: {
mobilePhone: "",
date: ""
}
};
},
computed: {
pageNum() {
return Math.ceil(this.total / this.pageSize);
},
startTime() {
let date = this.filters.date;
let result = (date && date[0]) || "";
if (result) {
result = date[0].getTime();
}
return result;
},
endTime() {
let date = this.filters.date;
let result = (date && date[1]) || "";
if (result) {
result = date[1].getTime() + 1000 * 60 * 60 * 24;
}
return result;
}
},
methods: {
changeHandler() {
this.reqQuery();
},
exportHandler() {
let data = {
start_time: new Date(this.exportDate[0]).getTime(),
end_time: new Date(this.exportDate[1]).getTime() + 1000 * 60 * 60 * 24,
mobile_phone: "",
startIndex: 0,
size: 1000000
};
var encoder = HDP.getEncoder();
var encrypted = encoder.encode(JSON.stringify(data));
let params = {
appId: "0489fba68acd11e98c527cd30aeb749e",
appKey: "9524a3c59a5d4460bd141a2a93a5db17",
func: "queryStatProductList",
data: encrypted
};
exportTable(params);
},
showDialog() {
this.exportDialogVisible = true;
},
formatTableDate(row, column) {
return formatDate.format(new Date(row.hdp_created), "yyyy-MM-dd hh:mm");
},
handleCurrentChange(val) {
this.page = val;
this.reqQuery();
},
reqQuery() {
let _this = this;
_this.listLoading = true;
let data = {
startIndex: (this.page - 1) * this.pageSize,
size: this.pageSize,
mobile_phone: this.filters.mobilePhone,
start_time: this.startTime,
end_time: this.endTime
};
as.queryFunV2("queryStatProductList", data, res => {
_this.page = 1;
_this.listLoading = false;
if (res) {
let reservationList = res[0];
let total = res[1][0].total;
_this.total = total;
_this.$set(_this.totalData, "reservationList", reservationList);
}
});
}
},
mounted() {
this.reqQuery();
},
created() {}
};
</script>
<style lang="scss" scoped>
.page-container {
padding: 20px;
}
.tool-wrap {
padding: 24px 0;
display: flex;
border-bottom: solid 1px #cccccc;
justify-content: space-between;
}
.toolbar {
display: flex;
justify-content: space-between;
.page-tips {
height: 32px;
line-height: 32px;
color: #333333;
}
}
.dialog {
.tips {
margin-right: 24px;
}
}
</style>
<template>
<div class="page-container">
<div class="tool-wrap">
<div>
<el-form :inline="true" :model="filters">
<el-form-item>
<el-input @change="changeHandler()" v-model="filters.mobilePhone" placeholder="请输入手机号"></el-input>
</el-form-item>
<el-form-item>
<el-date-picker @change="changeHandler()" v-model="filters.date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="reqQuery">查询</el-button>
</el-form-item>
</el-form>
</div>
<div>
<el-button class="reset-btn" @click="showDialog()">导出数据</el-button>
</div>
</div>
<el-table :data="totalData.reservationList" highlight-current-row v-loading="listLoading" style="width: 100%;">
<el-table-column prop="product_name" label="产品名称">
</el-table-column>
<el-table-column prop="advisory" label="申请类型">
</el-table-column>
<el-table-column prop="name" label="姓名">
</el-table-column>
<el-table-column prop="mobile" label="联系方式">
</el-table-column>
<el-table-column prop="office" label="单位">
</el-table-column>
<el-table-column prop="province" label="省份">
</el-table-column>
<el-table-column prop="hdp_created" :formatter="formatTableDate" label="申请时间">
</el-table-column>
<el-table-column prop="nickname" label="微信昵称">
</el-table-column>
<el-table-column label="微信头像">
<template slot-scope="scope">
<div class="avatar-wrap">
<img class="avatar" :src="scope.row.avatar" alt="">
</div>
</template>
</el-table-column>
<el-table-column prop="openid" label="openid">
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<div class="page-tips">总共{{total}}条记录,每页{{pageSize}}条,总共{{pageNum}}页</div>
<el-pagination layout="prev, pager, next,jumper" @current-change="handleCurrentChange" :page-size="pageSize" :total="total" style="float:right;">
</el-pagination>
</el-col>
<el-dialog class="dialog" center title="导出数据设定" :visible.sync="exportDialogVisible" :close-on-click-modal="false">
<span class="tips">导出日期</span>
<el-date-picker v-model="exportDate" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
</el-date-picker>
<div slot="footer" class="dialog-footer">
<el-button style="width:120px;" @click.native="exportDialogVisible = false">取消</el-button>
<el-button style="width:120px;" type="primary" @click.native="exportHandler()">导出</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { Base64 } from "js-base64";
import { exportTable } from "./../../api/api.js";
import { formatDate } from "./../../common/utils.js";
export default {
data() {
return {
exportDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date().getTime()
],
exportDialogVisible: false,
listLoading: false,
page: 1,
pageSize: 10,
total: 0,
totalData: {
reservationList: []
},
selDate: [
new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 7),
new Date()
],
pickerOptions2: {
disabledDate(time) {
return time.getTime() > Date.now();
}
},
filters: {
mobilePhone: "",
date: ""
}
};
},
computed: {
pageNum() {
return Math.ceil(this.total / this.pageSize);
},
startTime() {
let date = this.filters.date;
let result = (date && date[0]) || "";
if (result) {
result = date[0].getTime();
}
return result;
},
endTime() {
let date = this.filters.date;
let result = (date && date[1]) || "";
if (result) {
result = date[1].getTime() + 1000 * 60 * 60 * 24;
}
return result;
}
},
methods: {
changeHandler() {
this.reqQuery();
},
exportHandler() {
let data = {
start_time: new Date(this.exportDate[0]).getTime(),
end_time: new Date(this.exportDate[1]).getTime() + 1000 * 60 * 60 * 24,
mobile_phone: "",
startIndex: 0,
size: 1000000
};
var encoder = HDP.getEncoder();
var encrypted = encoder.encode(JSON.stringify(data));
let params = {
appId: "0489fba68acd11e98c527cd30aeb749e",
appKey: "9524a3c59a5d4460bd141a2a93a5db17",
func: "queryInquiryList",
data: encrypted
};
exportTable(params);
},
showDialog() {
this.exportDialogVisible = true;
},
formatTableDate(row, column) {
return formatDate.format(new Date(row.hdp_created), "yyyy-MM-dd hh:mm");
},
handleCurrentChange(val) {
this.page = val;
this.reqQuery();
},
reqQuery() {
let _this = this;
_this.listLoading = true;
let data = {
startIndex: (this.page - 1) * this.pageSize,
size: this.pageSize,
mobile_phone: this.filters.mobilePhone,
start_time: this.startTime,
end_time: this.endTime
};
as.queryFunV2("queryInquiryList", data, res => {
console.log("queryInquiryList res:", res);
_this.page = 1;
_this.listLoading = false;
if (res) {
let reservationList = res[0];
let total = res[1][0].total;
_this.total = total;
_this.$set(_this.totalData, "reservationList", reservationList);
}
});
}
},
mounted() {
this.reqQuery();
},
created() {}
};
</script>
<style lang="scss" scoped>
.page-container {
padding: 20px;
}
.tool-wrap {
padding: 24px 0;
display: flex;
border-bottom: solid 1px #cccccc;
justify-content: space-between;
}
.toolbar {
display: flex;
justify-content: space-between;
.page-tips {
height: 32px;
line-height: 32px;
color: #333333;
}
}
.dialog {
.tips {
margin-right: 24px;
}
}
</style>
......@@ -97,6 +97,7 @@ export default {
.then(() => {
this.loading = false
this.$router.push({ path: this.redirect || '/' })
// this.$router.push({ path: '/dictionary/pv' })
})
.catch(() => {
this.loading = false
......
This diff could not be displayed because it is too large.