Skip to content

P
pica-risk-admin
提交 19a466a1 编写于 作者: huangwensu's avatar huangwensu
浏览文件
操作

创建风控系统

上级 3d2a4329
展开全部 隐藏空白字符变更
内嵌 并排
正在显示 包含 506 行增加 和 1133 行删除
index.html
浏览文件 @ 19a466a1
......@@ -2,7 +2,7 @@
<html>
<head>
<meta charset="utf-8">
<title>数据服务</title>
<title>风控系统</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name ="viewport" content ="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta content="" name="description"/>
......
src/components/common/Header.vue
浏览文件 @ 19a466a1
<template>
<div class="header">
<div class="logo">数据服务</div>
<div class="logo">风控系统</div>
<div class="user-info">
<el-dropdown trigger="click" @command="handleCommand">
<span class="el-dropdown-link">
......
src/router/index.js
浏览文件 @ 19a466a1
......@@ -18,37 +18,18 @@ export default new Router({
children: [
{
path: '/',
redirect: '/data-view',
redirect: '/doctor-black',
},{ // 数据导入
path: '/data-in',
component: resolve => require(['../views/sensitive-control/data-in.vue'], resolve),
}, { // 数据统计
path: '/data-statistic',
component: resolve => require(['../views/sensitive-control/data-statistic.vue'], resolve),
},{ // 数据查看
path: '/data-view',
component: resolve => require(['../views/sensitive-control/data-view.vue'], resolve)
},
{ // 用户路径分析
path: '/user-path',
component: resolve => require(['../views/user-path/funnel.vue'], resolve)
},
{ // 用户路径分析--新增转化漏斗
path: '/add-funnel',
component: resolve => require(['../views/user-path/add-funnel.vue'], resolve)
},
{ // 用户路径分析--查看数据
path: '/path-data',
component: resolve => require(['../views/user-path/funnel-data.vue'], resolve)
},{
path: '/doctor-black',
component: resolve => require(['../views/black-list/doctor-black.vue'], resolve),
},{
path: '/empty-phone',
component: resolve => require(['../views/black-list/empty-phone.vue'], resolve),
},
]
},
{ // 短信中的 数据查看页面
path: '/data-view-message',
component: resolve => require(['../views/sensitive-control/data-view-message.vue'], resolve)
},
]
......
src/views/black-list/doctor-black.vue 0 → 100644
浏览文件 @ 19a466a1
<template>
<div class="black-container">
<el-row :gutter="30" class="row search" type="flex" style="margin-bottom:0;">
<el-form ref="form" :model="searchParam" label-suffix=":" style="width:100%;">
<el-col :span="18">
<el-form-item label="名称">
<el-input v-model="searchParam.searchName" maxlength="20" placeholder="请输入黑名单中的名称" style="width:288px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="6" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="search(1)">查询</el-button>
<el-button type="primary" size="small" @click="importBatch">批量导入</el-button>
<el-button type="primary" size="small" @click="addBlackList">新增黑名单</el-button>
</el-col>
</el-form>
</el-row>
<el-table
class="search-table"
:data="tableData"
style="width: 100%">
<el-table-column prop="searchName" label="名称" min-width="140" align="center"></el-table-column>
<el-table-column prop="time" label="添加时间" min-width="140" align="center"></el-table-column>
<el-table-column prop="remark" label="添加理由" min-width="150" align="center"></el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="removeFromBlack(scope.row)">从黑名单移除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
<!-- 将手机号加入黑名单 -->
<el-dialog
title="提示"
:visible.sync="addDialogVisible"
width="30%"
center>
<el-form ref="importForm" :model="addParam" label-suffix=":" label-width="80px">
<el-form-item label="手机号">
<el-input v-model="addParam.mobilePhone" style="width: 300px;"></el-input>
</el-form-item>
<el-form-item label="添加理由">
<el-input v-model="addParam.remark" style="width: 300px;"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="addDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmAdd">确 定</el-button>
</span>
</el-dialog>
<!-- 从黑名单移除二次确认 -->
<el-dialog
title="提示"
:visible.sync="removeDialogVisible"
width="30%"
center>
<span>您确定将{{removeTel}}移除黑名单？</span>
<span slot="footer" class="dialog-footer">
<el-button @click="removeDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmRemove">确 定</el-button>
</span>
</el-dialog>
<!-- 批量导入 -->
<el-dialog
title="提示"
:visible.sync="importDialogVisible"
width="30%"
center>
<el-form ref="importForm" :model="searchParam" label-suffix=":" style="width:100%;">
<el-form-item label="上传文件">
<el-upload
class="upload-demo"
accept=".xlsx"
action="#"
v-model="importFileName"
:before-upload="uploadImportFile">
<el-input class="upload-input" v-model="importFileName" autocomplete="off"></el-input>
</el-upload>
</el-form-item>
<div class="el-upload__tip" @click="download">下载导入模板</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="importDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmImport">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { doUpload, getFilePath } from "../../common/qiniuUtil";
import { openLoading, closeLoading } from "../../common/utils";
export default {
data() {
return {
addDialogVisible: false,
removeDialogVisible: false,
importDialogVisible: false,
searchParam: {
searchName: '',
pageSize: 15,
pageNo: 1
},
totalRows: 0,
tableData: [],
addParam: {
mobilePhone: '',
remark: ''
},
removeId: '',
removeTel: '',
acceptValue: '*/*',
importFileName: ''
}
},
mounted() {
this.search();
},
methods: {
// 封装一下请求通用的方法
getData(type, url, req, callback) {
openLoading(this);
this.$axios[type](localStorage.getItem("lectureUrl") + url, req)
.then(res => {
closeLoading(this);
let data = res.data;
if (data.code == "000000") {
if (callback) callback(data);
} else {
this.$message.error(data.message);
}
})
.catch(error => {
closeLoading(this);
this.$message.error("网络出现点问题");
});
},
search(param) {
if(param) this.searchParam.pageNo = 1;
this.getData(
"get", `/riskcontrol/blacklist/list?searchName=${this.searchParam.searchName}&pageNo=${this.searchParam.pageNo}&pageSize=${this.searchParam.pageSize}`, {},
data => {
this.tableData = data.data.list;
this.totalRows = data.data.totalRows;
}
);
},
// 批量导入
importBatch() {
this.importDialogVisible = true;
},
confirmImport() {
},
// 上传文件
uploadImportFile(file) {
console.log(file)
let self = this;
this.importFileName = file.name;
let arr = file.type.split('/');
let ext = "." + arr[1];
let reader = new FileReader();
reader.onload = function (e) {
let fileJson = {
fileName: file.name,
file: e.target.result.substr(e.target.result.indexOf("base64,") + 7),
ext: ext
};
self.base64 = fileJson;
console.log('fileJson',self.base64);
};
reader.readAsDataURL(file);
this.getData(
"post", `/riskcontrol/blacklist/import`, {base64Str: self.base64.file},
data => {
if(data.code == '000000') {
}
}
);
},
// 下载导入模板
download() {
console.log('下载模板');
setTimeout(() => {
window.open(''); // 后台给的导入Excel地址
}, 500);
},
// 新增黑名单
addBlackList() {
this.addDialogVisible = true;
},
confirmAdd() {
let req = this.addParam;
this.getData(
"post", `/riskcontrol/blacklist/create`, req,
data => {
if(data.code == '000000') {
this.addDialogVisible = false;
this.search();
}
}
);
},
// 从黑名单移除
removeFromBlack(row) {
this.removeId = row.id;
this.removeTel = row.mobilePhone;
this.removeDialogVisible = true;
},
confirmRemove() {
this.getData(
"delete", `/riskcontrol/blacklist/remove${this.removeId}`, {},
data => {
if(data.code == '000000') {
this.removeDialogVisible = false;
this.search();
}
}
);
},
handleSizeChange(value) {
this.searchParam.pageSize = value;
this.search();
},
handleCurrentChange(value) {
this.searchParam.pageNo = value;
this.search();
}
}
}
</script>
<style lang="less" scoped>
.black-container {
.upload-input {
width: 300px;
}
}
</style>
\ No newline at end of file
src/views/black-list/empty-phone.vue 0 → 100644
浏览文件 @ 19a466a1
<template>
<div class="black-container">
<el-row :gutter="30" class="row search" type="flex" style="margin-bottom:0;">
<el-form ref="form" :model="searchParam" label-suffix=":" style="width:100%;">
<el-col :span="18">
<el-form-item label="名称">
<el-input v-model="searchParam.searchName" maxlength="20" placeholder="请输入黑名单中的名称" style="width:288px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="6" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="search(1)">查询</el-button>
<el-button type="primary" size="small" @click="importBatch">批量导入</el-button>
<el-button type="primary" size="small" @click="addBlackList">新增黑名单</el-button>
</el-col>
</el-form>
</el-row>
<el-table
class="search-table"
:data="tableData"
style="width: 100%">
<el-table-column prop="searchName" label="名称" min-width="140" align="center"></el-table-column>
<el-table-column prop="time" label="添加时间" min-width="140" align="center"></el-table-column>
<el-table-column prop="remark" label="添加理由" min-width="150" align="center"></el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="removeFromBlack(scope.row)">从黑名单移除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
<!-- 将手机号加入黑名单 -->
<el-dialog
title="提示"
:visible.sync="addDialogVisible"
width="30%"
center>
<el-form ref="importForm" :model="addParam" label-suffix=":" style="width:100%;">
<el-form-item label="手机号">
<el-input v-model="addParam.mobilePhone"></el-input>
</el-form-item>
<el-form-item label="添加理由">
<el-input v-model="addParam.remark"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="addDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmAdd">确 定</el-button>
</span>
</el-dialog>
<!-- 从黑名单移除二次确认 -->
<el-dialog
title="提示"
:visible.sync="removeDialogVisible"
width="30%"
center>
<span>您确定将{{removeTel}}移除黑名单？</span>
<span slot="footer" class="dialog-footer">
<el-button @click="removeDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmRemove">确 定</el-button>
</span>
</el-dialog>
<!-- 批量导入 -->
<el-dialog
title="提示"
:visible.sync="importDialogVisible"
width="30%"
center>
<el-form ref="importForm" :model="searchParam" label-suffix=":" style="width:100%;">
<el-form-item label="上传文件">
<el-upload
class="upload-demo"
accept=".xlsx"
action="#"
v-model="importFileName"
:before-upload="uploadImportFile">
<el-input class="update-input" v-model="importFileName" autocomplete="off"></el-input>
</el-upload>
</el-form-item>
<div class="el-upload__tip" @click="download">下载导入模板</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="importDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmImport">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { doUpload, getFilePath } from "../../common/qiniuUtil";
import { openLoading, closeLoading } from "../../common/utils";
export default {
data() {
return {
addDialogVisible: false,
removeDialogVisible: false,
importDialogVisible: false,
searchParam: {
searchName: '',
pageSize: 15,
pageNo: 1
},
totalRows: 0,
tableData: [],
addParam: {
mobilePhone: '',
remark: ''
},
removeId: '',
removeTel: '',
acceptValue: '*/*',
importFileName: ''
}
},
mounted() {
this.search();
},
methods: {
// 封装一下请求通用的方法
getData(type, url, req, callback) {
openLoading(this);
this.$axios[type](localStorage.getItem("lectureUrl") + url, req)
.then(res => {
closeLoading(this);
let data = res.data;
if (data.code == "000000") {
if (callback) callback(data);
} else {
this.$message.error(data.message);
}
})
.catch(error => {
closeLoading(this);
this.$message.error("网络出现点问题");
});
},
search(param) {
if(param) this.searchParam.pageNo = 1;
this.getData(
"get", `/riskcontrol/blacklist/list?searchName=${this.searchParam.searchName}&pageNo=${this.searchParam.pageNo}&pageSize=${this.searchParam.pageSize}`, {},
data => {
this.tableData = data.data.list;
this.totalRows = data.data.totalRows;
}
);
},
// 批量导入
importBatch() {
this.importDialogVisible = true;
},
confirmImport() {
},
// 上传文件
uploadImportFile(file) {
console.log(file)
let self = this;
this.importFileName = file.name;
let arr = file.type.split('/');
let ext = "." + arr[1];
let reader = new FileReader();
reader.onload = function (e) {
let fileJson = {
fileName: file.name,
file: e.target.result.substr(e.target.result.indexOf("base64,") + 7),
ext: ext
};
self.base64 = fileJson;
console.log('fileJson',self.base64);
};
reader.readAsDataURL(file);
this.getData(
"post", `/riskcontrol/blacklist/import`, {base64Str: self.base64.file},
data => {
if(data.code == '000000') {
}
}
);
},
// 下载导入模板
download() {
console.log('下载模板');
setTimeout(() => {
window.open(''); // 后台给的导入Excel地址
}, 500);
},
// 新增黑名单
addBlackList() {
this.addDialogVisible = true;
},
confirmAdd() {
let req = this.addParam;
this.getData(
"post", `/riskcontrol/blacklist/create`, req,
data => {
if(data.code == '000000') {
this.addDialogVisible = false;
this.search();
}
}
);
},
// 从黑名单移除
removeFromBlack(row) {
this.removeId = row.id;
this.removeTel = row.mobilePhone;
this.removeDialogVisible = true;
},
confirmRemove() {
this.getData(
"delete", `/riskcontrol/blacklist/remove${this.removeId}`, {},
data => {
if(data.code == '000000') {
this.removeDialogVisible = false;
this.search();
}
}
);
},
handleSizeChange(value) {
this.searchParam.pageSize = value;
this.search();
},
handleCurrentChange(value) {
this.searchParam.pageNo = value;
this.search();
}
}
}
</script>
<style lang="less" scoped>
.black-container {
}
</style>
\ No newline at end of file
src/views/user-path/add-funnel.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
此差异已折叠。
src/views/user-path/funnel-data.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
此差异已折叠。
src/views/user-path/funnel.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="funnel-container">
<div class="funnel-title">漏斗分析</div>
<div class="funnel-content">
<div class="con">
<el-row :gutter="30" class="row search" type="flex" style="margin-bottom:0;">
<el-form ref="form" :model="searchParam" label-suffix=":" style="width:100%;">
<el-col :span="21">
<el-form-item label="漏斗名称">
<el-input v-model="searchParam.searchName" maxlength="20" placeholder="请输入漏斗名称" style="width:288px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="3" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="search(1)">搜索</el-button>
</el-col>
</el-form>
</el-row>
<div class="search-table-con">
<el-row :gutter="10" class="row create-button" style="margin-right:0;">
<el-button type="primary" size="small" @click="addData">+新增转化漏斗</el-button>
</el-row>
<!-- 表格 -->
<el-table
class="search-table"
:data="tableData"
style="width: 100%"
:empty-text="tableText">
<el-table-column prop="name" label="漏斗名称" min-width="140" align="center"></el-table-column>
<el-table-column prop="stepStartName" label="起始步骤" min-width="140" align="center"></el-table-column>
<el-table-column prop="stepEndName" label="转化目标" min-width="150" align="center"></el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="visitData(scope.row)">查看数据</el-button>
<el-button type="primary" size="small" @click="editColumn(scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="deleteConfirm(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
<!-- 删除确认框 -->
<el-dialog
class="delete-dialog"
:visible.sync="dialogVisible"
width="30%">
<span><i class="el-icon-circle-close" style="color: red"></i>确认要删除这条转化漏斗吗？</span>
<span class="tip">删除该转化漏斗数据将不会保留</span>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirm">确 定</el-button>
</span>
</el-dialog>
</div>
</div>
</div>
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../common/utils";
export default {
data() {
return {
tableText: '暂未创建漏斗',
searchParam: {
searchName: '',
pageNo: 1,
pageSize: 15
},
totalRows: 0,
tableData: [],
dialogVisible: false,
deleteId: ''
}
},
mounted() {
this.search();
},
methods: {
// 封装一下请求通用的方法
getData(type, url, req, callback) {
openLoading(this);
this.$axios[type](localStorage.getItem("lectureUrl") + url, req)
.then(res => {
closeLoading(this);
let data = res.data;
if (data.code == "000000") {
if (callback) callback(data);
} else {
this.$message.error(data.message);
}
})
},
search(param) {
if(param) this.searchParam.pageNo = 1;
let req = this.searchParam;
this.getData(
"get", `/session/funnel/list?searchName=${this.searchParam.searchName}&pageNo=${this.searchParam.pageNo}&pageSize=${this.searchParam.pageSize}`, {},
res => {
this.tableData = res.data.data;
this.totalRows = res.data.totalRows;
if(this.tableData.length == 0) {
this.tableText = param ? "暂无数据" : '暂未创建漏斗';
}
}
);
},
// 新增漏斗
addData() {
this.$router.push({ path: 'add-funnel' });
},
// 查看数据
visitData(row) {
this.$router.push({ path: 'path-data', query: {id: row.id, name: row.name} });
},
// 编辑
editColumn(row) {
this.$router.push({ path: 'add-funnel',query: {id: row.id}});
},
// 删除确认框
deleteConfirm(row) {
this.dialogVisible = true;
this.deleteId = row.id;
},
confirm() {
this.getData(
"delete", `/session/funnel/remove/${this.deleteId}`, {},
res => {
if(res.code == '000000') {
this.dialogVisible = false;
this.$message.success('删除成功');
this.search();
}
}
);
},
handleSizeChange(value) {
this.searchParam.pageSize = value;
this.search();
},
handleCurrentChange(value) {
this.searchParam.pageNo = value;
this.search();
}
}
}
</script>
<style lang="less" scoped>
.funnel-container {
margin: -20px -40px;
.funnel-title {
height: 60px;
line-height: 60px;
padding-left: 40px;
}
.funnel-content {
background: #F2F2F4;
padding: 20px 0 20px 20px;
min-height: 83vh;
.con {
padding-bottom: 30px;
background: #fff;
min-height: 80vh;
.search {
padding: 20px 20px 0;
margin: 0 !important;
border-bottom: 1px solid #EDEDEE;
}
.search-table-con {
padding: 0 40px;
.create-button {
margin-top: 20px;
}
}
.delete-dialog {
span{
display: block;
font-size: 16px;
font-weight: 700;
margin-left: 40px;
i {
display: inline-block;
font-size: 20px;
color: red;
margin-right: 10px;
}
}
span.tip {
font-size: 14px;
font-weight: 400;
color: #aaa;
margin: 15px 0 0 70px;
}
}
}
}
}
</style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或