Skip to content

P
pica-risk-admin
提交 efe087b8 编写于 作者: 张平's avatar 张平
浏览文件
操作

Merge branch 'dev-risk-20201204' into 'release' 

风控系统   code reviewer: 张平

风控系统

See merge request !1
上级 3d2a4329 52fc6dd3
隐藏空白字符变更
内嵌 并排
正在显示 包含 1391 行增加 和 6421 行删除
config/index.js
浏览文件 @ efe087b8
...@@ -7,7 +7,7 @@ module.exports = { ...@@ -7,7 +7,7 @@ module.exports = {
index: path.resolve(__dirname, '../dist/index.html'), index: path.resolve(__dirname, '../dist/index.html'),
assetsRoot: path.resolve(__dirname, '../dist'), assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static', assetsSubDirectory: 'static',
assetsPublicPath: '/sensitive/', // 上线前改为相应的路径名称 assetsPublicPath: '/pica_risk/', // 上线前改为相应的路径名称
productionSourceMap: false, productionSourceMap: false,
// Gzip off by default as many popular static hosts such as // Gzip off by default as many popular static hosts such as
// Surge or Netlify already gzip all static assets for you. // Surge or Netlify already gzip all static assets for you.
......
index.html
浏览文件 @ efe087b8
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>数据服务</title> <title>风控系统</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <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 name ="viewport" content ="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta content="" name="description"/> <meta content="" name="description"/>
......
package-lock.json
浏览文件 @ efe087b8
...@@ -8223,6 +8223,22 @@ ...@@ -8223,6 +8223,22 @@
"dev": true, "dev": true,
"optional": true "optional": true
}, },
"v-viewer": {
"version": "1.5.1",
"resolved": "http://192.168.110.93:4873/v-viewer/-/v-viewer-1.5.1.tgz",
"integrity": "sha512-Q5ICKzmYQD0qTf+hti2Lhgy6UYY2zgFr+YrN9a3yPgr7pOjYrG405Pz4+6Z6FXlhdhGysCWFJUNCI2tsIyvjWQ==",
"requires": {
"throttle-debounce": "^2.0.1",
"viewerjs": "^1.5.0"
},
"dependencies": {
"throttle-debounce": {
"version": "2.3.0",
"resolved": "http://192.168.110.93:4873/throttle-debounce/-/throttle-debounce-2.3.0.tgz",
"integrity": "sha1-/TGGXmZQIHHkEYF+JBRls+nDcuI="
}
}
},
"validate-npm-package-license": { "validate-npm-package-license": {
"version": "3.0.3", "version": "3.0.3",
"resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.3.tgz", "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.3.tgz",
...@@ -8257,6 +8273,11 @@ ...@@ -8257,6 +8273,11 @@
"extsprintf": "^1.2.0" "extsprintf": "^1.2.0"
} }
}, },
"viewerjs": {
"version": "1.9.0",
"resolved": "http://192.168.110.93:4873/viewerjs/-/viewerjs-1.9.0.tgz",
"integrity": "sha1-bfr1REDDsvdpG4Vma6bSdwjtlZI="
},
"vm-browserify": { "vm-browserify": {
"version": "0.0.4", "version": "0.0.4",
"resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz", "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
......
package.json
浏览文件 @ efe087b8
...@@ -24,7 +24,9 @@ ...@@ -24,7 +24,9 @@
"vue-table-with-tree-grid": "^0.2.4", "vue-table-with-tree-grid": "^0.2.4",
"vue-xlsx-table": "^1.2.8", "vue-xlsx-table": "^1.2.8",
"vuedraggable": "^2.16.0", "vuedraggable": "^2.16.0",
"vuex": "^3.0.1" "vuex": "^3.0.1",
"v-viewer": "^1.2.1",
"viewerjs": "^1.3.0"
}, },
"devDependencies": { "devDependencies": {
"autoprefixer": "^6.7.2", "autoprefixer": "^6.7.2",
......
src/common/env.js
浏览文件 @ efe087b8
...@@ -54,7 +54,7 @@ export const getAddress = () => { ...@@ -54,7 +54,7 @@ export const getAddress = () => {
Url = ipAddress + "/ADMIN_CMS_FE/rest/"; Url = ipAddress + "/ADMIN_CMS_FE/rest/";
//msUrl = "http://10.177.15.117:10201" + "/contents/"; //msUrl = "http://10.177.15.117:10201" + "/contents/";
// msUrl = "http://10.177.15.154:10203" + "/contents/"; // msUrl = "http://10.177.15.154:10203" + "/contents/";
msUrl = "http://dev-sc.yunqueyi.com" + "/contents/"; msUrl = "https://dev-sc.yunqueyi.com" + "/contents/";
lectureUrl = "https://dev-sc.yunqueyi.com" lectureUrl = "https://dev-sc.yunqueyi.com"
liveUrl = "https://dev-sc.yunqueyi.com/campaign/"; liveUrl = "https://dev-sc.yunqueyi.com/campaign/";
kfUrl = "http://test1-kf.yunqueyi.com" + "/api/"; kfUrl = "http://test1-kf.yunqueyi.com" + "/api/";
...@@ -63,7 +63,7 @@ export const getAddress = () => { ...@@ -63,7 +63,7 @@ export const getAddress = () => {
// qiniuUrl = "http://10.177.15.154:10203/contents/admin/qiniu/token"; //不再使用middle服务获取七牛token // qiniuUrl = "http://10.177.15.154:10203/contents/admin/qiniu/token"; //不再使用middle服务获取七牛token
qiniuUrl = "https://dev-sc.yunqueyi.com/contents/admin/qiniu/token"; qiniuUrl = "https://dev-sc.yunqueyi.com/contents/admin/qiniu/token";
// qiniuFileUrl = "http://10.177.15.154:10203/contents/admin/qiniu/token1"; // qiniuFileUrl = "http://10.177.15.154:10203/contents/admin/qiniu/token1";
qiniuFileUrl = "http://dev-sc.yunqueyi.com/contents/admin/qiniu/token1"; qiniuFileUrl = "https://dev-sc.yunqueyi.com/contents/admin/qiniu/token1";
qiniuResourceUrl = "https://test1-videos.yunqueyi.com"; qiniuResourceUrl = "https://test1-videos.yunqueyi.com";
} else if (isNotEmptyUtils(env)) {//测试test1 test2 uat } else if (isNotEmptyUtils(env)) {//测试test1 test2 uat
versionUrl = 'https://' + env + '-dev.yunqueyi.com'; versionUrl = 'https://' + env + '-dev.yunqueyi.com';
......
src/common/index.js
浏览文件 @ efe087b8
...@@ -102,4 +102,22 @@ export function getStrCodeNum(str) { ...@@ -102,4 +102,22 @@ export function getStrCodeNum(str) {
return false return false
} }
return true return true
}
// 封装一下请求通用的方法
export function getData(context, type, url, req, callback) {
openLoading(context);
context.$axios[type](localStorage.getItem("lectureUrl") + url, req)
.then(res => {
closeLoading(context);
let data = res.data;
if (data.code == "000000") {
if (callback) callback(data);
} else {
context.$message.error(data.message);
}
}).catch(error => {
closeLoading(this);
this.$message.error("网络出现点问题");
});
} }
\ No newline at end of file
src/components/common/Header.vue
浏览文件 @ efe087b8
<template> <template>
<div class="header"> <div class="header">
<div class="logo">数据服务</div> <div class="logo">风控系统</div>
<div class="user-info"> <div class="user-info">
<el-dropdown trigger="click" @command="handleCommand"> <el-dropdown trigger="click" @command="handleCommand">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
......
src/components/common/Sidebar.vue
浏览文件 @ efe087b8
...@@ -3,14 +3,14 @@ ...@@ -3,14 +3,14 @@
<el-menu :default-active="onRoutes" class="el-menu-vertical-demo" theme="dark" unique-opened router> <el-menu :default-active="onRoutes" class="el-menu-vertical-demo" theme="dark" unique-opened router>
<template v-for="(item, index) in items"> <template v-for="(item, index) in items">
<template v-if="item.subs"> <template v-if="item.subs">
<el-submenu :index="'index_' + index"> <el-submenu :index="'index_' + index" :key="index">
<template slot="title"><i :class="item.icon"></i>{{ item.title }}</template> <template slot="title"><i :class="item.icon"></i>{{ item.title }}</template>
<el-menu-item v-for="(subItem,i) in item.subs" :key="i" :index="subItem.index">{{ subItem.title}} <el-menu-item v-for="(subItem,i) in item.subs" :key="i" :index="subItem.index">{{ subItem.title}}
</el-menu-item> </el-menu-item>
</el-submenu> </el-submenu>
</template> </template>
<template v-else> <template v-else>
<el-menu-item :index="item.index"> <el-menu-item :index="item.index" :key="index">
<i :class="item.icon"></i>{{ item.title }} <i :class="item.icon"></i>{{ item.title }}
</el-menu-item> </el-menu-item>
</template> </template>
...@@ -20,7 +20,16 @@ ...@@ -20,7 +20,16 @@
</template> </template>
<script> <script>
import {isEmptyUtils, isNotEmptyUtils, errorResponseCheck, responseCheck, openLoading, closeLoading, messageBox, getConstantList, isNotEmptyList} from '../../common/utils'; import {
isEmptyUtils,
isNotEmptyUtils,
errorResponseCheck,
responseCheck,
openLoading,
closeLoading,
messageBox,
getConstantList,
isNotEmptyList } from '../../common/utils';
import menuApi from '../../api/menu' import menuApi from '../../api/menu'
...@@ -56,19 +65,6 @@ ...@@ -56,19 +65,6 @@
responseCheck(res, self); responseCheck(res, self);
// console.log("获取菜单成功===========",res); // console.log("获取菜单成功===========",res);
self.items = res.data.data.picapMenuModels; self.items = res.data.data.picapMenuModels;
// 敏感数据查看系统 测试 Start <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< 开发前期写死的，后续改成接口获取
// self.items = [{
// icon: null,
// index: "#",
// subs: [
// {icon: null, index: "data-in", title: "数据导入", subs: []},
// {icon: null, index: "data-view", title: "数据查看", subs: []},
// ],
// title: "敏感数据",
// }]
// 敏感数据查看系统 测试 End <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
let data = JSON.parse(JSON.stringify(res.data.data));//通过这个实现深拷贝 let data = JSON.parse(JSON.stringify(res.data.data));//通过这个实现深拷贝
localStorage.setItem("privilege_data", JSON.stringify(data.picapMenuModels)); localStorage.setItem("privilege_data", JSON.stringify(data.picapMenuModels));
localStorage.setItem("user_name", data.user_name); localStorage.setItem("user_name", data.user_name);
...@@ -84,7 +80,7 @@ ...@@ -84,7 +80,7 @@
}, },
computed: { computed: {
onRoutes() { onRoutes() {
return this.$route.path.replace('/', ''); return this.$route.path;
} }
} }
} }
......
src/components/page/createData.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<el-dialog :title="title" :visible.sync="showModal" width="700px" @close="close" center>
<el-form ref="form" :model="form" label-width="150px" size="medium " :rules="rules">
<el-form-item label="项目名称" prop="projectMainId">
<el-select v-model="form.projectMainId" placeholder="请选择项目名称">
<el-option v-for="item in pNameList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="审批编号" prop="dingdingNumber">
<el-input
style="width:220px"
:disabled="handleType=='2'"
:maxlength="21"
v-model="form.dingdingNumber"
placeholder="请输入内容"
></el-input>
</el-form-item>
<el-form-item label="申请日期" prop="dingdingDate">
<el-date-picker
v-model="form.dingdingDate"
:disabled="handleType=='2'"
value-format="yyyy-MM-dd"
type="date"
placeholder="选择日期"
></el-date-picker>
</el-form-item>
<el-form-item label="sheet名称" prop="dataSheetName">
<el-input
style="width:220px"
:disabled="handleType=='2'"
v-model="form.dataSheetName"
placeholder="请输入sheet名称"
></el-input>
</el-form-item>
<el-form-item label="数据需求方类型" prop="dataType">
<el-radio-group v-model="form.dataType" :disabled="handleType=='2'" @change="changeinout">
<el-radio :label="1" style="margin-right:50px">内部</el-radio>
<el-radio :label="2">外部</el-radio>
</el-radio-group>
</el-form-item>
<div class="insiders-wrap">
<template v-if="form.dataType == 1">
<el-form-item label="数据需求方姓名" prop="needIds">
<el-select v-model="form.needIds" multiple filterable placeholder="请选择">
<el-option
v-for="item in needIdsList"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</template>
<template v-if="form.dataType == 2">
<el-form-item label="数据需求方姓名" prop="name">
<el-input style="width:200px" v-model="form.name" placeholder="请输入内容"></el-input>
</el-form-item>
<el-form-item label="数据需求方手机号" prop="mobilePhone">
<el-input style="width:200px" v-model="form.mobilePhone" placeholder="请输入内容"></el-input>
</el-form-item>
</template>
<el-form-item label="敏感信息查看" prop="sensitiveDataType">
<el-radio-group v-model="form.sensitiveDataType">
<el-radio :label="1" style="margin-right:50px">是</el-radio>
<el-radio :label="2">否</el-radio>
</el-radio-group>
</el-form-item>
<!-- 新增 导出次数 -->
<el-form-item label="导出次数" prop="exportCount">
<div>
<el-input style="width:200px" v-model="form.exportCount" placeholder="请输入导出次数"></el-input>
</div>
<div>备注：0代表没有导出权限</div>
</el-form-item>
<el-form-item label="数据需求角色" prop="dataRole">
<el-radio-group v-model="form.dataRole" :disabled="disableAdmintype">
<el-radio :label="1">管理员</el-radio>
<el-radio :label="2">普通用户</el-radio>
</el-radio-group>
</el-form-item>
<template v-if="form.dataRole==1">
<el-form-item label="数据分发人员" prop="ids">
<el-select v-model="form.ids" multiple filterable placeholder="请选择">
<el-option v-for="item in idsList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<!-- 新增 分发人员导出次数 -->
<el-form-item label="分发人员导出次数" prop="distributeExportCount">
<div>
<el-input
style="width:200px"
v-model="form.distributeExportCount"
placeholder="请输入分发人员导出次数"
></el-input>
</div>
<div>备注：0代表没有导出权限</div>
</el-form-item>
</template>
</div>
<template v-if="handleType=='1'">
<el-form-item label="文件上传" prop="fileId">
<el-upload
v-model="form.fileId"
drag
:action="returnActionUrl()"
:limit="1"
:headers="uploadHeaders"
:on-success="uploadSuccess"
:before-upload="beforeUpload"
class="upload-demo"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
<em>点击上传</em>
</div>
</el-upload>
</el-form-item>
</template>
<template v-if="handleType=='2'">
<el-form-item label="文件上传">
<span>{{form.fileName}}</span>
</el-form-item>
</template>
<p class="txt-center">请确保第一列为手机号</p>
<el-form-item label="数据有效期" prop="dataTermValidity">
<el-date-picker
v-model="form.dataTermValidity"
value-format="yyyy-MM-dd"
type="date"
placeholder="选择日期"
></el-date-picker>
</el-form-item>
<el-form-item label="数据访问次数" prop="dataCount">
<div>
<el-input style="width:200px" v-model="form.dataCount" placeholder="请输入内容"></el-input>
</div>
<div>备注：0表示无限制</div>
</el-form-item>
<el-form-item label="敏感信息所在位置" prop="sensitiveDataColumn">
<div>
<el-input style="width:200px" v-model="form.sensitiveDataColumn" placeholder="请输入内容"></el-input>
</div>
<div>备注：多个以英文分号隔开</div>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="showModal=false">取 消</el-button>
<el-button type="primary" @click="submitForm('form')">确 定</el-button>
</span>
</el-dialog>
</template>
<script>
import { baseUrl } from "../../api/hostconfig";
import { openLoading, closeLoading } from "../../common/utils";
export default {
props: {
form: Object,
rules: Object,
handleType: String,
},
data() {
return {
title: "", // 表单title
baseUrl,
pNameList: [],
disableAdmintype: false,
needIdsList: [],
idsList: [],
showModal: true,
uploadHeaders: {
token: window.localStorage.getItem('token')
// token: "587657450F884CAAA62B3B39106B64E7",
},
};
},
created() {
// 获取数据需求方类型为内部时的需求方姓名列表
this.getData("get", `/sensitive/info/employee`, {}, (data) => {
this.needIdsList = data.data;
this.idsList = data.data;
});
// 数据导入时，获取项目名称列表
this.getData("get", `/sensitive/projectMain/getAll`, {}, (data) => {
this.pNameList = data.data;
});
this.title = this.handleType == "1" ? "数据导入" : "数据修改";
},
watch: {
"form.dataType"(val) {
if (val == 2) {
this.form.dataRole = 2;
this.disableAdmintype = true;
} else if (val == 1) {
}
},
"form.dataRole"(val) {
this.form.dataRole = val;
if (val == 1) {
this.disableAdmintype = false;
// 获取数据分发人员
this.getData("get", `/sensitive/info/employee`, {}, (data) => {
this.idsList = data.data;
});
} else {
if (this.form.dataType == 2) {
this.disableAdmintype = true;
}
}
},
},
methods: {
// 切换数据需求方类型为【内部】【外部】
changeinout(value) {
console.log("handle value: ", value);
},
returnActionUrl() {
return localStorage.getItem("lectureUrl") + "/sensitive/import/file";
},
// 上传成功
uploadSuccess(res, file, fileList) {
this.form.fileId = res.data;
this.$refs.form.validateField("fileId");
},
beforeUpload(file) {
var FileExt = file.name.replace(/.+\./, "");
if (["xls", "xlsx"].indexOf(FileExt.toLowerCase()) === -1) {
this.$message({
type: "warning",
message: "请上传后缀名为xls,xlsx的原文件！",
});
return false;
}
},
close() {
this.$emit("close");
},
submitForm(formName) {
console.log("createData.submitForm() : formName = " + formName);
this.$refs[formName].validate((valid) => {
if (valid) {
if (this.handleType == "1") {
this.getData(
"post",
"/sensitive/import/data",
this.form,
(data) => {
setTimeout(() => {
this.$emit("saveSuccess");
this.$emit("close");
}, 300);
}
);
} else {
console.log("createData.submitForm() : this.form = " + this.form);
this.getData("put", "/sensitive/import/data", this.form, (data) => {
setTimeout(() => {
this.$emit("saveSuccess");
this.$emit("close");
}, 300);
});
}
} else {
this.$message.error("请正确填写信息");
return false;
}
});
},
// 封装一下请求通用的方法
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("网络出现点问题");
});
},
},
};
</script>
<style scoped>
.txt-center {
/* text-align: center; */
margin-left: 170px;
margin-bottom: 20px;
color: red;
}
</style>
\ No newline at end of file
src/components/page/modifyData.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<el-dialog title="数据修改" :visible.sync="showModal" width="750px" @close="close" center>
<el-form ref="form" :model="form">
<el-form-item label="审批编号">
<el-input style="width:220px" v-model="form.dingdingNumber" placeholder="请输入内容" required></el-input>
</el-form-item>
<el-form-item label="申请日期">
<el-date-picker v-model="form.dingdingDate" type="date" placeholder="选择日期"></el-date-picker>
</el-form-item>
<el-form-item label="sheet名称">
<el-select v-model="form.dataSheetName" placeholder="请选择">
<el-option
v-for="item in options"
:key="item"
:label="item"
:value="item"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="数据需求方类型">
<el-radio-group v-model="form.dataType" @change="changeinout">
<el-radio :label="1">内部</el-radio>
<el-radio :label="2">外部</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="数据需求方姓名">
<el-input style="width:200px" v-model="form.reviseName" placeholder="请输入内容"></el-input>
</el-form-item>
<el-form-item label="数据需求方手机号">
<el-input style="width:200px" v-model="form.revisePhone" placeholder="请输入内容"></el-input>
</el-form-item>
<el-form-item label="敏感信息查看">
<el-radio v-model="form.warning_radio" label="1">是&#12288;&#12288;</el-radio>
<el-radio v-model="form.warning_radio" label="2">否</el-radio>
</el-form-item>
<el-form-item label="分发人员">
<el-select v-model="form.revisemsgSend" filterable placeholder="请选择">
<el-option
v-for="item in options"
:key="item.revisemsgSend"
:label="item.label"
:value="item.revisemsgSend"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="数据有效期">
<el-date-picker
v-model="form.reviseUsefulDate"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item label="数据访问次数">
<!-- <span>数据访问次数&#12288;&#12288;</span> -->
<el-input style="width:200px" v-model="form.dataCount" placeholder="请输入内容"></el-input>
</el-form-item>
<el-form-item label="敏感信息所在位置">
<!-- <span>敏感信息所在位置</span> -->
<el-input style="width:200px" v-model="form.reviseSensitivePosition" placeholder="请输入内容"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="showModal=false">取 消</el-button>
<el-button type="primary" @click="submitForm('form')">确 定</el-button>
</span>
</el-dialog>
</template>
<script>
export default{
props: {
form: Object,
rules: Object
},
data(){
return {
options: [
{
value: "选项1",
label: "黄金糕"
},
{
value: "选项2",
label: "双皮奶"
},
{
value: "选项3",
label: "蚵仔煎"
},
{
value: "选项4",
label: "龙须面"
}
],
showModal: true
}
},
methods: {
// 切换数据需求方类型为【内部】【外部】
changeinout(value) {
console.log("handle value: ", value);
},
beforeUpload(file) {
var FileExt = file.name.replace(/.+\./, "");
if (["xls", "xlsx"].indexOf(FileExt.toLowerCase()) === -1) {
this.$message({
type: "warning",
message: "请上传后缀名为xls,xlsx的原文件！"
});
return false;
}
},
close(){
this.$emit('close')
},
submitForm(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
alert("submit!");
} else {
console.log("error submit!!");
return false;
}
});
console.log("submitform触发");
},
}
}
</script>
\ No newline at end of file
src/main.js
浏览文件 @ efe087b8
...@@ -10,12 +10,16 @@ import 'element-ui/lib/theme-chalk/index.css'; // 默认主题 ...@@ -10,12 +10,16 @@ import 'element-ui/lib/theme-chalk/index.css'; // 默认主题
import {getAddress, loadCommonFilter} from './common/env' import {getAddress, loadCommonFilter} from './common/env'
import vueFilter from './common/filter'; import vueFilter from './common/filter';
import vViewer from 'v-viewer';
import 'viewerjs/dist/viewer.css';
//加载环境变量 //加载环境变量
getAddress(); getAddress();
loadCommonFilter(); loadCommonFilter();
//加载elementUi //加载elementUi
Vue.use(ElementUI); Vue.use(ElementUI);
Vue.use(vViewer);
Vue.prototype.$echarts = echarts; Vue.prototype.$echarts = echarts;
// Vue.use(vueXlsxTable, {rABS: false}) // Vue.use(vueXlsxTable, {rABS: false})
......
src/router/index.js
浏览文件 @ efe087b8
...@@ -18,37 +18,30 @@ export default new Router({ ...@@ -18,37 +18,30 @@ export default new Router({
children: [ children: [
{ {
path: '/', path: '/',
redirect: '/data-view', redirect: '/doctor-black',
},{ // 数据导入 },{
path: '/data-in', path: '/doctor-black', // 医生黑名单
component: resolve => require(['../views/sensitive-control/data-in.vue'], resolve), component: resolve => require(['../views/black-list/doctor-black.vue'], resolve),
}, { // 数据统计 },{
path: '/data-statistic', path: '/empty-phone', // 居民假空号
component: resolve => require(['../views/sensitive-control/data-statistic.vue'], resolve), component: resolve => require(['../views/black-list/empty-phone.vue'], resolve),
},{
},{ // 数据查看 path: '/strategy-list', // 策略管理
path: '/data-view', component: resolve => require(['../views/strategy-data/strategy-list.vue'], resolve),
component: resolve => require(['../views/sensitive-control/data-view.vue'], resolve) },{
}, path: '/strategy-edit',
{ // 用户路径分析 component: resolve => require(['../views/strategy-data/strategy-edit.vue'], resolve),
path: '/user-path', },{
component: resolve => require(['../views/user-path/funnel.vue'], resolve) path: '/order-list', // 云药房订单
}, component: resolve => require(['../views/order-list/order-list.vue'], resolve),
{ // 用户路径分析--新增转化漏斗 },{
path: '/add-funnel', path: '/order-detail',
component: resolve => require(['../views/user-path/add-funnel.vue'], resolve) component: resolve => require(['../views/order-list/order-detail.vue'], resolve),
},
{ // 用户路径分析--查看数据
path: '/path-data',
component: resolve => require(['../views/user-path/funnel-data.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
浏览文件 @ efe087b8
<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="16">
<el-form-item label="名称">
<el-input v-model="searchParam.searchName" clearable maxlength="20" placeholder="请输入黑名单中的名称" style="width:288px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="8" 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="mobilePhone" label="手机号" min-width="140" align="center"></el-table-column>
<el-table-column prop="createTimestamp" label="添加时间" min-width="140" align="center">
<template slot-scope="scope">
<span>{{ scope.row.createTimestamp | timeFilter}}</span>
</template>
</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="danger" 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="手机号" required>
<el-input v-model="addParam.mobilePhone" style="width: 70%"></el-input>
</el-form-item>
<el-form-item label="添加理由">
<el-input v-model="addParam.remark" style="width: 70%"></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="#"
:before-upload="uploadImportFile"
>
<el-button type="default">点击上传</el-button>
</el-upload>
<p>{{importFileName.name}}</p>
<span class="el-upload__tip down-file" v-if="importError" @click="downloadError">导入的Excel有问题，点击下载查看具体问题</span>
</el-form-item>
<span class="el-upload__tip down-file" @click="download">下载导入模板</span>
</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";
import { getData } from "../../common";
export default {
data() {
return {
addDialogVisible: false,
removeDialogVisible: false,
importDialogVisible: false,
searchParam: {
searchName: '',
pageSize: 15,
pageNo: 1
},
totalRows: 0,
tableData: [],
addParam: {
mobilePhone: '',
remark: ''
},
removeId: '',
removeTel: '',
importFile: {},
uploadHeaders: {
token: window.localStorage.getItem('token')
},
importFileName: {},
importError: false,
importErrorFileUrl: '',
filePath: ''
}
},
filters: {
timeFilter: function timeFilter(val) {
return new Date(val).format("yyyy-MM-dd hh:mm:ss")
}
},
mounted() {
// 1 黑名单 2 空号
this.search();
},
methods: {
search(param) {
if(param) this.searchParam.pageNo = 1;
getData(this,
"get", `/riskcontrol/blacklist/list?searchName=${this.searchParam.searchName}&pageNo=${this.searchParam.pageNo}&pageSize=${this.searchParam.pageSize}`, {},
data => {
this.tableData = data.data.blackListResps;
this.totalRows = data.data.total;
}
);
},
// 批量导入
importBatch() {
this.importDialogVisible = true;
this.importError = false;
this.importFileName = '';
},
// 判断有没有导入文件
confirmImport() {
let req = {
file: this.filePath
};
getData(this,
"post", `/riskcontrol/blacklist/import`, req,
data => {
if(!data.data) {
this.importDialogVisible = false;
this.$message.success("导入成功");
this.search();
}else {
this.importError = true;
this.importErrorFileUrl = data.data;
}
}
);
},
// 上传文件
uploadImportFile(file) {
let _this = this;
let FileExt = file.name.replace(/.+\./, "");
if (["xls", "xlsx"].indexOf(FileExt.toLowerCase()) === -1) {
_this.$message({
type: "warning",
message: "请上传后缀名为xls,xlsx的原文件！",
});
return false;
}
_this.importFileName = file;
doUpload(_this, file, getFilePath(file,null), 'preview4', 'progress1', 1).then( path => {
_this.filePath = path.fullPath;
});
},
// uploadSuccess(res, file, fileList) {
// if(res.data) { // 导入的Excel有问题
// this.importError = true;
// this.importErrorFileUrl = res.data;
// }
// },
// 下载查看导入的有问题Excel
downloadError() {
let a = document.createElement('a');
a.setAttribute('href', this.importErrorFileUrl);
a.click();
},
// 下载导入模板
download() {
let a = document.createElement('a');
a.setAttribute('href', 'https://file.yunqueyi.com/risk/template.xlsx');
a.click();
},
// 新增黑名单
addBlackList() {
this.addDialogVisible = true;
this.addParam.mobilePhone = '';
this.addParam.remark = '';
},
confirmAdd() {
let req = this.addParam;
getData(this,
"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() {
getData(this,
"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;
}
.down-file {
color: #3a8ee6;
text-decoration: underline;
}
}
</style>
\ No newline at end of file
src/views/black-list/empty-phone.vue 0 → 100644
浏览文件 @ efe087b8
<template>
<div class="empty-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="16">
<el-form-item label="手机号">
<el-input v-model="searchParam.searchName" clearable maxlength="20" placeholder="请输入手机号" style="width:288px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="8" 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="mobilePhone" label="手机号" min-width="140" align="center"></el-table-column>
<el-table-column prop="createTimestamp" label="添加时间" min-width="140" align="center">
<template slot-scope="scope">
<span>{{ scope.row.createTimestamp | timeFilter}}</span>
</template>
</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="danger" 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="手机号" required>
<el-input v-model="addParam.mobilePhone" style="width: 70%;"></el-input>
</el-form-item>
<el-form-item label="添加理由">
<el-input v-model="addParam.remark" style="width: 70%;"></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="#"
:before-upload="uploadImportFile">
<el-button type="default">点击上传</el-button>
</el-upload>
<p>{{importFileName.name}}</p>
<span class="el-upload__tip down-file" v-if="importError" @click="downloadError">导入的Excel有问题，点击下载查看具体问题</span>
</el-form-item>
<span class="el-upload__tip down-file" @click="download">下载导入模板</span>
</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";
import { getData } from "../../common";
export default {
data() {
return {
addDialogVisible: false,
removeDialogVisible: false,
importDialogVisible: false,
searchParam: {
searchName: '',
pageSize: 15,
pageNo: 1
},
totalRows: 0,
tableData: [],
addParam: {
mobilePhone: '',
remark: ''
},
removeId: '',
removeTel: '',
importFileName: {},
uploadHeaders: {
token: window.localStorage.getItem('token'),
'Content-Type': 'multipart/form-data'
},
importError: false,
importErrorFileUrl: '',
filePath: ''
}
},
filters: {
timeFilter: function timeFilter(val) {
return new Date(val).format("yyyy-MM-dd hh:mm:ss");
}
},
mounted() {
this.search();
},
methods: {
search(param) {
if(param) this.searchParam.pageNo = 1;
getData(this,
"get", `/riskcontrol/emptyNumber/list?searchName=${this.searchParam.searchName}&pageNo=${this.searchParam.pageNo}&pageSize=${this.searchParam.pageSize}`, {},
data => {
this.tableData = data.data.blackListResps;
this.totalRows = data.data.total;
}
);
},
// 新增假空号
addBlackList() {
this.addDialogVisible = true;
this.addParam.mobilePhone = '';
this.addParam.remark = '';
},
confirmAdd() {
let req = this.addParam;
getData(this,
"post", `/riskcontrol/emptyNumber/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() {
getData(this,
"delete", `/riskcontrol/emptyNumber/remove/${this.removeId}`, {},
data => {
if(data.code == '000000') {
this.removeDialogVisible = false;
this.search();
}
}
);
},
// 批量导入
importBatch() {
this.importDialogVisible = true;
this.importError = false;
this.importFileName = '';
},
// 判断有没有导入文件
confirmImport() {
let req = {
file: this.filePath
};
getData(this,
"post", `/riskcontrol/emptyNumber/import`, req,
data => {
console.log("ddddddddddd",data)
if(!data.data) {
this.importDialogVisible = false;
this.$message.success("导入成功");
this.search();
}else {
this.importError = true;
this.importErrorFileUrl = data.data;
}
}
);
},
// 上传文件
uploadImportFile(file) {
let _this = this;
var FileExt = file.name.replace(/.+\./, "");
if (["xls", "xlsx"].indexOf(FileExt.toLowerCase()) === -1) {
_this.$message({
type: "warning",
message: "请上传后缀名为xls,xlsx的原文件！",
});
return false;
}
_this.importFileName = file;
doUpload(_this, file, getFilePath(file,null), 'preview4', 'progress1', 1).then( path => {
_this.filePath = path.fullPath;
});
},
// 下载查看导入的有问题Excel
downloadError() {
let a = document.createElement('a');
a.setAttribute('href',this.importErrorFileUrl);
a.click();
},
// 下载导入模板
download() {
let a = document.createElement('a');
a.setAttribute('href', 'https://file.yunqueyi.com/risk/template.xlsx');
a.click();
},
handleSizeChange(value) {
this.searchParam.pageSize = value;
this.search();
},
handleCurrentChange(value) {
this.searchParam.pageNo = value;
this.search();
}
}
}
</script>
<style lang="less" scoped>
.empty-container {
.upload-input {
width: 300px;
}
.down-file {
color: #3a8ee6;
text-decoration: underline;
}
}
</style>
\ No newline at end of file
src/views/order-list/order-detail.vue 0 → 100644
浏览文件 @ efe087b8
<template>
<div class="order-detail-container">
<div class="title">
<el-breadcrumb separator="/">
<el-breadcrumb-item :to="{ path: '/order-list' }">订单列表</el-breadcrumb-item>
<el-breadcrumb-item>订单详情</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="order">
<p>订单信息</p>
<div>
<span class="label">订单ID：</span><span class="con">{{rowId}}</span>
<span class="label">下单时间：</span><span class="con">{{detailData.orderTime}}</span>
<span class="label">订单金额：</span><span class="con">{{detailData.totalPrice}}</span>
<span class="label">支付方式：</span><span class="con">{{payTypeText}}</span>
</div>
<div class="info">
<span v-for="(item, index) in detailData.goodsRespList" :key="index">
<span class="label">商品{{index + 1}}：</span><span class="con">{{item.goodsName}}*{{item.purchaseNum}}__{{item.purchasingPrice}}</span>
</span>
</div>
</div>
<div class="order">
<p>开单店铺信息</p>
<span class="label">店铺名称：</span><span class="con">{{detailData.storeName}}</span>
<span class="label">店铺所在区：</span><span class="con">{{detailData.storeAddress}}</span>
</div>
<div class="order">
<p>下单人信息</p>
<span class="label">下单人姓名：</span><span class="con">{{detailData.placeOrderName}}</span>
<span class="label">手机号：</span><span class="con">{{detailData.placeOrderMobile}}</span>
<span class="label">地区归属：</span><span class="con">{{detailData.placeOrderAddress}}</span>
</div>
<div class="order">
<p>处方信息</p>
<div class="">暂无处方信息/处方图片：</div>
<div class="approveImg images order-img" v-viewer="{movable: true}">
<img v-for="(item, index) in detailData.recipeUrlList" :key="index" :src="item"/>
</div>
</div>
<div class="order">
<p>收货人信息</p>
<span class="label">姓名：</span><span class="con">{{detailData.receiverName}}</span>
<span class="label">手机号：</span><span class="con">{{detailData.receiverMobile}}</span>
<span class="label">详细地址：</span><span class="con">{{detailData.receiverAddress}}</span>
</div>
</div>
</template>
<script>
// import { openLoading, closeLoading } from "../../common/utils";
import { getData } from "../../common";
export default {
data() {
return {
rowId: '',
detailData: {},
payTypeText: ''
}
},
created() {
this.rowId = this.$route.query.id;
},
mounted() {
this.getDetailData();
},
methods: {
getDetailData() {
getData(this,
"get", `/riskcontrol/tradeOrder/info/${this.rowId}`, {},
data => {
this.detailData = data.data;
this.payTypeText = this.detailData.payType == 1 ? "医生支付" : "医生代付"
}
);
}
}
}
</script>
<style lang="less" scoped>
.order-detail-container {
.title {
margin-bottom: 30px;
}
.order {
border-bottom: 1px solid #efefef;
padding-bottom: 20px;
p {
padding: 20px 0px 20px;
font-size: 16px;
font-weight: 700;
}
span.label {
display: inline-block;
width: 9%;
color: #606266;
font-size: 14px;
}
.info {
margin-top: 20px;
}
.con {
display: inline-block;
width: 15%;
color: #606266;
font-size: 14px;
}
.order-img {
display: inline-block;
img {
width: 200px;
display: inline-block;
padding-right: 20px;
}
}
}
}
</style>
\ No newline at end of file
src/views/order-list/order-list.vue 0 → 100644
浏览文件 @ efe087b8
<template>
<div class="order-container">
<el-row :gutter="30" class="row search" type="flex" style="margin-bottom:0;">
<el-form ref="form" :model="searchParam" label-suffix=":" label-width="80px" style="width: 100%;">
<el-col :span="5">
<el-form-item label="订单信息">
<el-input v-model="searchParam.searchName" clearable placeholder="请输入订单信息"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="时间">
<el-date-picker
v-model="searchParam.date"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="风险定级">
<el-select
clearable
v-model="searchParam.riskLevel"
placeholder="请选择风险等级">
<el-option
v-for="item in riskSelectData"
:key="item.level"
:label="item.level"
:value="item.level"
></el-option>
</el-select>
</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>
<el-table
class="search-table"
:data="tableData"
style="width: 100%">
<el-table-column prop="strOrderId" label="订单ID" min-width="140" align="center"></el-table-column>
<el-table-column prop="storeName" label="店铺名称" min-width="140" align="center"></el-table-column>
<el-table-column prop="prescriberName" label="开单人" min-width="150" align="center"></el-table-column>
<el-table-column prop="placeOrderName" label="下单人" min-width="150" align="center"></el-table-column>
<el-table-column prop="orderTime" label="下单时间" min-width="150" align="center"></el-table-column>
<el-table-column prop="riskLevel" label="风险定级" min-width="150" align="center"></el-table-column>
<el-table-column prop="riskStrategy" 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="reviewDetail(scope.row)">查看详情</el-button>
<el-button :disabled="scope.row.orderTimeType != 1" type="primary" size="small" @click="changeRisk(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="changeDialogVisible"
width="30%"
center>
<el-form ref="importForm" :model="addParam" label-suffix=":" label-width="80px">
<el-form-item label="风险定级">
<el-select v-model="addParam.riskLevel" placeholder="请选择风险等级">
<el-option
v-for="item in riskSelectData"
:key="item.level"
:label="item.level"
:value="item.level"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="变更理由">
<el-input v-model="addParam.riskLevelRemark" style="width: 300px;"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="changeDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmChange">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { getData } from "../../common";
export default {
data() {
return {
changeDialogVisible: false,
searchParam: {
searchName: '',
date: '',
riskLevel: '',
pageNo: 1,
pageSize: 15
},
addParam: {
riskLevel: '',
riskLevelRemark: ''
},
riskSelectData: [],
tableData: [],
totalRows: 0,
base64: '',
orderId: ''
}
},
mounted() {
this.search();
this.getRiskLeverData();
},
methods: {
// 获取风险等级数据
getRiskLeverData() {
getData(this,
"get", `/riskcontrol/tradeOrder/riskLevel`, {},
data => {
let arr = data.data;
arr.forEach((element, index) => {
this.riskSelectData.push({
level: element
})
});
}
);
},
search(param) {
if(param) this.searchParam.pageNo = 1;
if(!this.searchParam.date) this.searchParam.date = '';
getData(this,
"get", `/riskcontrol/tradeOrder/list?searchName=${this.searchParam.searchName}&pageNo=${this.searchParam.pageNo}&pageSize=${this.searchParam.pageSize}&date=${this.searchParam.date}&riskLevel=${this.searchParam.riskLevel}`, {},
data => {
this.tableData = data.data.tradeOrders;
this.totalRows = data.data.total;
}
);
},
// 查看详情
reviewDetail(row) {
this.$router.push({path: 'order-detail',query: {id: row.strOrderId}})
},
// 调整定级
changeRisk(row) {
this.changeDialogVisible = true;
this.orderId = row.strOrderId;
this.addParam.riskLevel = '';
this.addParam.riskLevelRemark = '';
},
confirmChange() {
let req = {
orderId: this.orderId,
riskLevel: this.addParam.riskLevel,
riskLevelRemark: this.addParam.riskLevelRemark
};
getData(this,
"post", `/riskcontrol/tradeOrder/changeRiskLevel`, req,
data => {
if(data.code == '000000') {
this.changeDialogVisible = false;
this.search();
}
}
);
},
handleSizeChange(value) {
this.searchParam.pageSize = value;
this.search();
},
handleCurrentChange(value) {
this.searchParam.pageNo = value;
this.search();
}
}
}
</script>
<style lang="less" scoped>
</style>
\ No newline at end of file
src/views/sensitive-control/data-in.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="data-in-wrap">
<el-form ref="form" :model="queryParams" label-width="100px" :inline="true" :rules="rules">
<el-form-item label="审批编号" prop="dingdingNumber">
<el-input
v-model="queryParams.dingdingNumber"
size="small"
style="width:220px"
class="input"
placeholder="审批编号查询"
clearable
@input="handleIdChange"
@keydown.native="numInputLimit"
maxlength="21"
></el-input>
</el-form-item>
<el-form-item label="申请日期" prop="dingdingDate">
<el-select v-model="queryParams.dingdingDate" placeholder="请选择" @change="handleDatechange" clearable>
<el-option v-for="item in dingdingDateList" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="sheet名称" prop="dataSheetName">
<el-select
v-model="queryParams.dataSheetName"
placeholder="请选择"
@change="handleSheetchange"
clearable
>
<el-option v-for="item in sheetList" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
</el-form>
<div class="block" style="margin-bottom:20px">
<el-button @click="createDataHandle">数据导入</el-button>
<el-button @click="queryDataListByClick">数据查询</el-button>
<el-button @click="addproject">添加项目</el-button>
</div>
<template>
<el-table :data="dataList" style="width: 100%">
<el-table-column label="审批编号" prop="dingdingNumber" width="180"></el-table-column>
<el-table-column label="人员姓名" prop="name" width="120"></el-table-column>
<el-table-column label="申请日期" prop="dingdingDate"></el-table-column>
<el-table-column label="sheet名称" prop="dataSheetName"></el-table-column>
<el-table-column label="附件名称" prop="fileName"></el-table-column>
<el-table-column label="状态" prop="status" :formatter="formatStatus"></el-table-column>
<el-table-column label="通知状态" prop="sendType" :formatter="formatSendType"></el-table-column>
<el-table-column label="操作" fixed="right" width="200">
<template slot-scope="scope">
<el-button @click="dataview(scope.row)" type="text" size="small">查看</el-button>
<template v-if="scope.row.status==1">
<el-button @click="modifyDataHandle(scope.row.id)" type="text" size="small">修改</el-button>
<el-button @click="notifyDingHandle(scope.row)" type="text" size="small">通知</el-button>
<el-button @click="closeDingHandle(scope.row.userId)" type="text" size="small">关闭</el-button>
</template>
</template>
</el-table-column>
</el-table>
<el-pagination
v-if="dataList && dataList.length > 0"
class="pagination-style"
@size-change="handleSizeChange"
@current-change="dataListChange"
:total="total"
:current-page="currentPage"
:page-sizes="[15, 50, 100, 200, 300]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
></el-pagination>
</template>
<!-- 数据导入 page -->
<createData
v-if="centerDialogVisible"
:form="form"
:rules="rules"
:handleType="handleType"
@close="closeCreate"
@saveSuccess="saveSuccess"
/>
<!-- 数据修改 page -->
<!-- <modifyData
v-if="reviseDialogVisible"
:form="form"
:rules="rules"
@close="closeModify"
/>-->
<el-dialog
:title="dialogTitle"
:visible.sync="addProjectVisible"
:close-on-click-modal="false"
style="text-align: center"
>
<el-row style="margin-top: 20px;" type="flex">
<el-col :span="3" style="margin-left: 70px;">
<label style="font-size: 18px;">项目名称</label>
</el-col>
<el-col :span="12" style="margin-left: 20px;">
<el-input v-model="projectName" size="small" />
</el-col>
</el-row>
<div slot="footer" style="text-align: center">
<el-button type="primary" @click="dialogSave">确认</el-button>
<el-button @click="addProjectVisible = false">取消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import createData from "../../components/page/createData";
// import modifyData from '../../components/page/modifyData';
import { baseUrl } from "../../api/hostconfig";
import { openLoading, closeLoading } from "../../common/utils";
export default {
components: {
createData
// modifyData
},
data() {
var checkNumLength = (rule, value, callback) => {
if (!value) {
return callback(new Error("请输入审批单号"));
} else if (value && (value + "").length != 21) {
callback(new Error("审批单号必须为21位数字值"));
} else {
callback();
}
};
return {
handleType: "1", // 表单操作类型，1.新增 2.修改
currentPage: 1,
pageSize: 15,
total: 50, // 默认分页总数
dataList: [], // 初始化数据列表
centerDialogVisible: false, // 是否显示数据导入（新增）
reviseDialogVisible: false, // 是否显示数据导入（修改）
sheetList: [], // 被搜索出来的sheet列表
dingdingDateList: [], //申请日期列表
// 查询的字段
queryParams: {
dingdingNumber: "", // 审批编号
dingdingDate: "", // 申请日期
dataSheetName: "" // sheet名称
},
form: {
status: 1,
projectMainId: [], //项目名称
dingdingNumber: "", // 审批编号
dingdingDate: "", // 申请日期
dataSheetName: "", //sheet名称
dataType: "", // 数据需求方类型 1.内部 2.外部
needIds: [], // 数据需求方id集合 需求方类型选择为 dataType【内部】
mobilePhone: "", // 数据需求方类型为【外部】需要传递 dataType【外部】
name: "", // 数据需求方类型为【外部】需要传递 dataType【外部】
sensitiveDataType: "", // 敏感信息查看权限 1是，2否
dataRole: "", //数据需求角色 1管理员，2普通用户
ids: [], // 数据分发人员数组
fileId: "", // 文件上传id
dataTermValidity: "", // 数据有效期 - 日期
dataCount: "", // 数据访问次数限制
sensitiveDataColumn: "" // 敏感信息列所在位置
},
rules: {
projectMainId: [
{ required: true, message: "请选择项目名称", trigger: "blur" }
],
dingdingNumber: [
{
required: true,
validator: checkNumLength,
message: "请输入正确格式的审批编号",
trigger: ["blur", "change"]
},
{
pattern: /^[5A-Za-z0-9-\_]+$/,
message: "只能输入英文，数字，下划线，横线"
}
],
dingdingDate: [
{ required: true, message: "请选择日期", trigger: "change" }
],
dataSheetName: [
{ required: true, message: "请输入sheet名称", trigger: "change" }
],
dataType: [
{
required: true,
message: "请至少选择一个数据方类型",
trigger: "change"
}
],
needIds: [
{
required: true,
message: "请输入内部数据需求方姓名",
trigger: "blur"
}
],
mobilePhone: [
{
required: true,
message: "请输入内部数据需求方手机号",
trigger: "blur"
},
{ pattern: /^1[345789]\d{9}$/, message: "输入正确格式的手机号" }
],
name: [
{
required: true,
message: "请输入外部数据需求方姓名",
trigger: "blur"
}
],
sensitiveDataType: [
{ required: true, message: "请确定敏感信息", trigger: "change" }
],
exportCount: [
{ required: true, message: "请确定导出次数", trigger: "blur" },
{ pattern: /^\+?[0-9][0-9]*$/, message: "导出次数只能是正整数" }
],
dataRole: [
{
required: true,
message: "请选择一个数据需求角色",
trigger: "change"
}
],
ids: [
{ required: true, message: "请选择数据分发人员", trigger: "blur" }
],
distributeExportCount: [
{ required: true, message: "请确定导出次数", trigger: "blur" },
{ pattern: /^\+?[0-9][0-9]*$/, message: "导出次数只能是正整数" }
],
fileId: [{ required: true, message: "请上传文件", trigger: "change" }],
dataTermValidity: [
{ required: true, message: "请填写数据有效期", trigger: "blur" }
],
dataCount: [
{ required: true, message: "请填写数据访问次数", trigger: "blur" },
{ pattern: /^\+?[0-9][0-9]*$/, message: "访问次数只能是正整数" }
],
sensitiveDataColumn: [
{ required: true, message: "请填写敏感信息所在位置", trigger: "blur" }
]
},
addProjectVisible: false,
dialogTitle: "添加项目",
projectName: ""
};
},
created() {
// 初始化获取数据列表
this.getDataList(this.currentPage, {});
},
methods: {
// 根据审批编号查询申请日期操作
handleIdChange(value) {
if (value.length == 21) {
this.getData(
"get",
`/sensitive/visit/date?dingdingNumber=${value}`,
{},
data => {
this.dingdingDateList = data.data;
}
);
} else {
this.dingdingDateList = [];
this.sheetList = [];
this.queryParams.dingdingDate = "";
this.queryParams.dataSheetName = "";
}
},
// 根据审批编号和日期搜索sheet
handleDatechange(val) {
this.sheetList = [];
this.queryParams.dataSheetName = "";
this.getData(
"get",
`/sensitive/visit/sheet?dingdingNumber=${this.queryParams.dingdingNumber}&dingdingDate=${val}`,
{},
data => {
this.sheetList = data.data;
}
);
},
// 选中sheet
handleSheetchange(val) {},
queryDataListByClick() {
this.currentPage = 1;
this.queryDataList();
},
// 数据查询
queryDataList() {
this.getDataList(this.currentPage, this.queryParams);
},
// 获取全部分页数据
getDataList(pageNum, queryData) {
this.getData(
"post",
"/sensitive/visit",
{
pageNum: pageNum,
pageSize: this.pageSize,
...queryData
},
data => {
this.dataList = data.data.list;
this.total = data.data.total;
}
);
},
// 根据页码获取数据
handleSizeChange(size) {
this.pageSize = size;
this.getDataList(this.currentPage, this.queryParams);
},
// 根据分页获取数据
dataListChange(num) {
console.log("dataListChange() : num = " + num);
this.currentPage = num;
this.getDataList(num, this.queryParams);
},
// 过滤状态显示
formatStatus(row, column) {
let value;
if (row.status == 1) {
value = "正常";
} else if (row.status == 2) {
value = "关闭";
}
return value;
},
// 过滤同志状态显示
formatSendType(row, column) {
let value;
if (row.sendType == 1) {
value = "已通知";
} else if (row.sendType == 2) {
value = "未通知";
}
return value;
},
// 新增数据-数据导入
createDataHandle() {
this.centerDialogVisible = true;
this.handleType = "1";
this.form = {
status: 1,
projectMainId: [], //项目名称
dingdingNumber: "", // 审批编号
dingdingDate: "", // 申请日期
dataSheetName: "", //sheet名称
dataType: "", // 数据需求方类型 1.内部 2.外部
needIds: [], // 数据需求方id集合 需求方类型选择为 dataType【内部】
mobilePhone: "", // 数据需求方类型为【外部】需要传递 dataType【外部】
name: "", // 数据需求方类型为【外部】需要传递 dataType【外部】
sensitiveDataType: "", // 敏感信息查看权限 1是，2否
dataRole: "", //数据需求角色 1管理员，2普通用户
ids: [], // 数据分发人员数组
fileId: "", // 文件上传id
dataTermValidity: "", // 数据有效期 - 日期
dataCount: "", // 数据访问次数限制
sensitiveDataColumn: "" // 敏感信息列所在位置
};
},
//添加项目
addproject() {
this.addProjectVisible = true;
},
dialogSave() {
this.getData(
"get", `/sensitive/projectMain/add?projectName=${this.projectName}`, {},
data => {
this.$message({
type: "success",
message: "项目添加成功"
});
this.addProjectVisible = false;
}
);
},
// 修改数据
modifyDataHandle(id) {
console.log("modifyDataHandle() : id = " + id)
// 为了方便测试，这里写一个有效的dev环境的id值!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!切记删除
// 为了方便测试，这里写一个有效的dev环境的id值!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!切记删除
// id = 60;
// 为了方便测试，这里写一个有效的dev环境的id值!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!切记删除
// 为了方便测试，这里写一个有效的dev环境的id值!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!切记删除
this.centerDialogVisible = true;
this.handleType = "2";
this.getData("get", `/sensitive/import/data?id=${id}`, {}, data => {
const form = data.data;
if (!form.needIds) form.needIds = [];
if (!form.ids) form.ids = [];
form.id = id;
this.form = form;
});
},
// 列表关闭操作
closeDingHandle(userId) {
this.$confirm("确定关闭？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
center: true,
customClass: "close-msg-box"
}).then(() => {
this.getData(
"put",
`/sensitive/visit/status?userId=${userId}`,
{},
data => {
this.$message({
type: "success",
message: "关闭成功!"
});
this.getDataList(this.currentPage, this.queryParams);
}
);
});
},
// 列表通知操作
notifyDingHandle(obj) {
const {
dataSheetName,
dingdingDate,
dingdingNumber,
mobilePhone,
userId
} = obj;
this.$confirm("确定通知该用户？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
center: true,
customClass: "close-msg-box"
}).then(() => {
this.getData(
"put",
"/sensitive/visit/notice",
{
dataSheetName,
dingdingDate,
dingdingNumber,
mobilePhone,
userId
},
data => {
this.$message({
type: "success",
message: "通知成功!"
});
this.getDataList(this.currentPage, this.queryParams);
}
);
});
},
// 查看个人审批编号页面
dataview(row) {
this.$router.push("/data-view");
this.$router.push({
path: "/data-view",
query: {
dingdingNumber: row.dingdingNumber,
dingdingDate: row.dingdingDate,
sheet: row.dataSheetName
}
});
},
numInputLimit(e) {
let key = e.key;
// 不允许输入'e'和'.'
if (key === "e" || key === ".") {
e.returnValue = false;
return false;
}
return true;
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
closeCreate() {
this.centerDialogVisible = false;
},
closeModify() {
this.reviseDialogVisible = false;
},
// 数据导入成功之后的通知方法
saveSuccess() {
this.getDataList(this.currentPage, this.queryParams);
},
// 封装一下请求通用的方法
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("网络出现点问题");
});
}
}
};
</script>
<style lang="less">
.data-in-wrap {
.pagination-style {
margin-top: 30px;
float: right;
}
}
.close-msg-box {
width: 280px;
}
</style>
src/views/sensitive-control/data-statistic.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="data-in-wrap">
<el-form ref="form" :model="queryParams" label-width="100px" :inline="true" :rules="rules">
<el-form-item label="项目名称" prop="projectMainId">
<el-select v-model="queryParams.projectMainId" placeholder="请选择项目" clearable>
<el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="审批编号" prop="dingdingNumber">
<el-input
v-model="queryParams.dingdingNumber"
size="small"
style="width:220px"
class="input"
placeholder="审批编号查询"
clearable
@input="handleIdChange"
@keydown.native="numInputLimit"
maxlength="21"
></el-input>
</el-form-item>
<el-form-item label="申请日期" prop="dingdingDate">
<el-select
v-model="queryParams.dingdingDate"
placeholder="请选择"
@change="handleDatechange"
clearable
>
<el-option v-for="item in dingdingDateList" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="sheet名称" prop="dataSheetName">
<el-select
v-model="queryParams.dataSheetName"
placeholder="请选择"
@change="handleSheetchange"
clearable
>
<el-option v-for="item in sheetList" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
</el-form>
<div class="block" style="margin-bottom:20px;display: flex;">
<el-button @click="showProjectTag">项目标签设置</el-button>
<el-button @click="showProjectStatus">项目标记状态设置</el-button>
<el-button @click="queryDataListByClick">数据查询</el-button>
<el-button @click="showExportModal">导出</el-button>
<div style="margin-left:20px;margin-top:5px">备注：请使用谷歌浏览器导出</div>
<a :href="'http://www.google.cn/chrome/'" class="href-link">点击下载</a>
</div>
<template>
<el-table :data="dataList" style="width: 100%">
<el-table-column label="项目名称" prop="projectMainName"></el-table-column>
<el-table-column label="钉钉编号" prop="dingdingNumber" width="180"></el-table-column>
<el-table-column label="申请日期" prop="dingdingDate"></el-table-column>
<el-table-column label="文件sheet名" prop="dataSheetName"></el-table-column>
<el-table-column label="总数据量" prop="dataSum"></el-table-column>
<el-table-column label="已处理数据量" prop="processedSum"></el-table-column>
<el-table-column label="操作" fixed="right" width="200">
<template slot-scope="scope">
<el-button @click="dataview(scope.row)" type="text" size="small">查看</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
v-if="dataList && dataList.length > 0"
class="pagination-style"
@size-change="handleSizeChange"
@current-change="dataListChange"
:total="total"
:current-page="currentPage"
:page-sizes="[15, 50, 100, 200, 300]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
></el-pagination>
</template>
<el-dialog :visible.sync="setTagVisible" :close-on-click-modal="false" width="500px">
<p class="dialog-title">项目标签设置</p>
<el-select
v-model="labelProjectMainId"
@change="handleLabelchange"
placeholder="请选择项目"
style="margin-left: 110px"
>
<el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
<div>
<div v-for="(u,i) in labelList" style="margin-top: 20px; margin-left: 110px">
<el-select v-model="labelList[i]" placeholder="请选择标签">
<el-option
v-for="item in allLabelList"
:key="item.code"
:label="item.value"
:value="item.code"
></el-option>
</el-select>
<el-button v-if="i==labelList.length-1 && i<19" @click="addTagNew">+</el-button>
<el-button v-if="labelList.length>1" @click="deleteTag(i)">-</el-button>
</div>
</div>
<div slot="footer" style="text-align: center">
<el-button type="primary" @click="setTagSave">确认</el-button>
<el-button @click="setTagVisible = false;clearLabelData();">取消</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="setStatusVisible" :close-on-click-modal="false" width="500px">
<p class="dialog-title">项目标记状态设置</p>
<el-select
v-model="statusProjectMainId"
placeholder="请选择项目"
@change="handleStatuschange"
style="margin-left: 110px"
>
<el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
<div style="margin-top: 20px; margin-left: 110px">
<el-input
v-model="status01.value"
style="width:180px;"
class="input"
placeholder="标记状态"
clearable
maxlength="10"
></el-input>
<el-button v-if="statusCount==1" @click="addStatusNew">+</el-button>
<el-button v-if="statusCount>1" @click="deleteStatus(1)">-</el-button>
</div>
<div v-if="statusCount>1" style="margin-top: 20px; margin-left: 110px">
<el-input
v-model="status02.value"
style="width:180px;"
class="input"
placeholder="标记状态"
clearable
maxlength="10"
></el-input>
<el-button v-if="statusCount==2" @click="addStatusNew">+</el-button>
<el-button @click="deleteStatus(2)">-</el-button>
</div>
<div v-if="statusCount>2" style="margin-top: 20px; margin-left: 110px">
<el-input
v-model="status03.value"
style="width:180px;"
class="input"
placeholder="标记状态"
clearable
maxlength="10"
></el-input>
<el-button v-if="statusCount==3" @click="addStatusNew">+</el-button>
<el-button @click="deleteStatus(3)">-</el-button>
</div>
<div v-if="statusCount>3" style="margin-top: 20px; margin-left: 110px">
<el-input
v-model="status04.value"
style="width:180px;"
class="input"
placeholder="标记状态"
clearable
maxlength="10"
></el-input>
<el-button v-if="statusCount==4" @click="addStatusNew">+</el-button>
<el-button @click="deleteStatus(4)">-</el-button>
</div>
<div v-if="statusCount>4" style="margin-top: 20px; margin-left: 110px">
<el-input
v-model="status05.value"
style="width:180px;"
class="input"
placeholder="标记状态"
clearable
maxlength="10"
></el-input>
<el-button @click="deleteStatus(5)">-</el-button>
</div>
<div slot="footer" style="text-align: center">
<el-button type="primary" @click="setStatusSave">确认</el-button>
<el-button @click="setStatusVisible = false; clearStatusData();">取消</el-button>
</div>
</el-dialog>
<!-- 导出弹窗 -->
<el-dialog title="导出" :visible.sync="exportModalVisible" width="300px" center>
<p>您当前数据总导出次数为：{{checkExportData.dataExportTotal}}次</p>
<p>剩余导出次数为：{{checkExportData.dataExportCount}}次</p>
<span slot="footer" class="dialog-footer">
<el-button @click="exportModalVisible = false">取 消</el-button>
<el-button type="primary" @click="handleExport">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { baseUrl } from "../../api/hostconfig";
import { openLoading, closeLoading } from "../../common/utils";
export default {
components: {},
data() {
var checkNumLength = (rule, value, callback) => {
if (!value) {
return callback(new Error("请输入审批单号"));
} else if (value && (value + "").length != 21) {
callback(new Error("审批单号必须为21位数字值"));
} else {
callback();
}
};
return {
setTagVisible: false,
setStatusVisible: false,
labelProjectMainId: "",
// tag01: "",
// tag02: "",
// tag03: "",
// tag04: "",
// tag05: "",
labelCount: 1,
labelList: [],
allLabelList: [],
statusProjectMainId: "",
status01: {},
status02: {},
status03: {},
status04: {},
status05: {},
statusCount: 1,
statusList: [],
handleType: "1", // 表单操作类型，1.新增 2.修改
currentPage: 1,
pageSize: 15,
total: 50, // 默认分页总数
dataList: [], // 初始化数据列表
centerDialogVisible: false, // 是否显示数据导入（新增）
reviseDialogVisible: false, // 是否显示数据导入（修改）
projectList: [],
sheetList: [], // 被搜索出来的sheet列表
dingdingDateList: [], //申请日期列表
// 查询的字段
queryParams: {
projectMainId: "", //项目id
dingdingNumber: "", // 审批编号
dingdingDate: "", // 申请日期
dataSheetName: "", // sheet名称
},
exportModalVisible: false, // 导出弹窗
//导出数据量
checkExportData: {
dataExportTotal: 0, // 总的
dataExportCount: 0, // 剩余的
},
rules: {
pName: [{ required: true, message: "请选择项目名称", trigger: "blur" }],
labelProjectMainId: [
{ required: true, message: "请选择项目名称", trigger: "blur" },
],
dingdingNumber: [
{
required: false,
validator: checkNumLength,
message: "请输入正确格式的审批编号",
trigger: ["blur", "change"],
},
{
pattern: /^[5A-Za-z0-9-\_]+$/,
message: "只能输入英文，数字，下划线，横线",
},
],
// dingdingDate: [
// { required: true, message: "请选择日期", trigger: "change" },
// ],
// dataSheetName: [
// { required: true, message: "请输入sheet名称", trigger: "change" },
// ],
dataType: [
{
required: true,
message: "请至少选择一个数据方类型",
trigger: "change",
},
],
needIds: [
{
required: true,
message: "请输入内部数据需求方姓名",
trigger: "blur",
},
],
mobilePhone: [
{
required: true,
message: "请输入内部数据需求方手机号",
trigger: "blur",
},
{ pattern: /^1[345789]\d{9}$/, message: "输入正确格式的手机号" },
],
name: [
{
required: true,
message: "请输入外部数据需求方姓名",
trigger: "blur",
},
],
sensitiveDataType: [
{ required: true, message: "请确定敏感信息", trigger: "change" },
],
exportCount: [
{ required: true, message: "请确定导出次数", trigger: "blur" },
{ pattern: /^\+?[0-9][0-9]*$/, message: "导出次数只能是正整数" },
],
dataRole: [
{
required: true,
message: "请选择一个数据需求角色",
trigger: "change",
},
],
ids: [
{ required: true, message: "请选择数据分发人员", trigger: "blur" },
],
distributeExportCount: [
{ required: true, message: "请确定导出次数", trigger: "blur" },
{ pattern: /^\+?[0-9][0-9]*$/, message: "导出次数只能是正整数" },
],
fileId: [{ required: true, message: "请上传文件", trigger: "change" }],
dataTermValidity: [
{ required: true, message: "请填写数据有效期", trigger: "blur" },
],
dataCount: [
{ required: true, message: "请填写数据访问次数", trigger: "blur" },
{ pattern: /^\+?[0-9][0-9]*$/, message: "访问次数只能是正整数" },
],
sensitiveDataColumn: [
{
required: true,
message: "请填写敏感信息所在位置",
trigger: "blur",
},
],
},
};
},
created() {
//获取项目名称列表
console.log("created() : enter");
this.getProjectNameList();
// 初始化获取数据列表
// this.getDataList(this.currentPage, {});
},
methods: {
//获取项目名称列表
getProjectNameList() {
this.getData(
"get",
`/sensitive/dataStatistics/getProject`,
{},
(data) => {
this.projectList = data.data;
}
);
},
//项目标签设置
showProjectTag() {
this.setTagVisible = true;
this.getHistoryLabel();
this.getAllLabel();
},
getAllLabel() {
this.getData(
"post",
"/sensitive/dataStatistics/getAllLabel",
{},
(data) => {
this.allLabelList = data.data;
}
);
},
getHistoryLabel() {
this.getData(
"get",
`/sensitive/dataStatistics/getLabel?projectMainId=${this.labelProjectMainId}`,
{},
(data) => {
this.labelList = data.data;
if (this.labelList.length <= 0) {
this.labelList = [""];
}
}
);
},
handleLabelchange() {
this.clearLabelData();
this.getHistoryLabel();
},
addTagNew() {
this.labelList.push("");
},
deleteTag(index) {
this.labelList.splice(index, 1);
},
setTagSave() {
if (this.labelProjectMainId == null || this.labelProjectMainId == "") {
this.$message.error("请选择项目名称");
return;
}
let checkTagValid = false;
for (let item = 0; item < this.labelList.length; item++) {
if (this.labelList[item] != null && this.labelList[item] != "") {
checkTagValid = true;
break;
}
}
console.log("setTagSave() : checkTagValid = " + checkTagValid);
if (!checkTagValid) {
this.$message.error("标签不可为空");
return;
}
for (let item = 0; item < this.labelList.length; item++) {
console.log("setTagSave() : item = " + item);
if (this.labelList[item] == "") {
this.deleteTag(item);
if (item != 0) {
item--;
}
}
}
let req = {
codes: this.labelList,
projectMainId: this.labelProjectMainId,
};
this.getData(
"post",
`/sensitive/dataStatistics/setLabel`,
req,
(data) => {
this.$message({
type: "success",
message: "项目标签设置成功",
});
this.clearLabelData();
this.setTagVisible = false;
}
);
},
clearLabelData() {
// this.tag01 = "";
// this.tag02 = "";
// this.tag03 = "";
// this.tag04 = "";
// this.tag05 = "";
this.labelList = [];
},
//项目标记状态设置
showProjectStatus() {
this.setStatusVisible = true;
this.getHistoryStatus();
},
addStatusNew() {
this.statusCount++;
},
deleteStatus(index) {
this.recodeStatus(index);
this.statusCount--;
},
recodeStatus(index) {
if (index == 1) {
this.status01 = this.status02;
this.status02 = this.status03;
this.status03 = this.status04;
this.status04 = this.status05;
} else if (index == 2) {
this.status02 = this.status03;
this.status03 = this.status04;
this.status04 = this.status05;
} else if (index == 3) {
this.status03 = this.status04;
this.status04 = this.status05;
} else if (index == 4) {
this.status04 = this.status05;
} else if (index == 5) {
this.status05 = "";
}
},
getHistoryStatus() {
this.getData(
"get",
`/sensitive/dataStatistics/getState?projectMainId=${this.statusProjectMainId}`,
{},
(data) => {
this.statusList = data.data;
if (this.statusList && this.statusList.length > 0) {
this.statusCount = this.statusList.length;
console.log(
"getHistoryStatus() : this.statusCount = " + this.statusCount
);
if (this.statusCount > 0) {
for (let item in this.statusList) {
if (item == 0) {
this.status01 = this.statusList[item];
} else if (item == 1) {
this.status02 = this.statusList[item];
} else if (item == 2) {
this.status03 = this.statusList[item];
} else if (item == 3) {
this.status04 = this.statusList[item];
} else if (item == 4) {
this.status05 = this.statusList[item];
}
}
}
} else {
this.statusCount = 1;
}
}
);
},
handleStatuschange() {
this.clearStatusData();
this.getHistoryStatus();
},
clearStatusData() {
this.status01 = {};
this.status02 = {};
this.status03 = {};
this.status04 = {};
this.status05 = {};
this.statusList = [];
},
setStatusSave() {
if (this.statusProjectMainId == null || this.statusProjectMainId == "") {
this.$message.error("请选择项目名称");
return;
}
this.statusList = [
// { id: 0, value: this.status01 },
// { id: 1, value: this.status02 },
// { id: 2, value: this.status03 },
// { id: 3, value: this.status04 },
// { id: 4, value: this.status05 },
{ id: this.status01.id, value: this.status01.value },
{ id: this.status02.id, value: this.status02.value },
{ id: this.status03.id, value: this.status03.value },
{ id: this.status04.id, value: this.status04.value },
{ id: this.status05.id, value: this.status05.value },
];
let checkStatusValid = false;
for (let item = 0; item < this.statusList.length; item++) {
console.log(
"setStatusSave() : this.statusList[item].value = " +
this.statusList[item].value
);
if (
this.statusList[item].value != null &&
this.statusList[item].value != "" &&
this.statusList[item].value != undefined
) {
checkStatusValid = true;
break;
}
}
console.log("setStatusSave() : checkStatusValid = " + checkStatusValid);
if (!checkStatusValid) {
this.$message.error("标记状态不可为空");
return;
}
let req = {
list: this.statusList,
projectMainId: this.statusProjectMainId,
};
this.getData(
"post",
`/sensitive/dataStatistics/setState`,
req,
(data) => {
this.$message({
type: "success",
message: "项目标记状态设置成功",
});
this.clearStatusData();
this.setStatusVisible = false;
}
);
},
queryDataListByClick() {
this.currentPage = 1;
this.queryDataList();
},
// 数据查询
queryDataList() {
this.getDataList(this.currentPage, this.queryParams);
},
//导出
showExportModal() {
console.log("导出。。。。。");
// 待接口提供后 请求接口获取excel, 再出发下载
// this.checkExport();
this.handleExport();
},
checkExport() {
let data = {
dingdingNum: this.queryParams.dingdingNumber,
dingdingDate: this.queryParams.dingdingDate,
dataSheetName: this.queryParams.dataSheetName,
};
let callback = (res) => {
if (res.code == "000000") {
console.log("导出前校验》》》》 ", res);
this.checkExportData.dataExportTotal = res.data.dataExportTotal;
this.checkExportData.dataExportCount = res.data.dataExportCount;
this.exportModalVisible = true;
} else {
vm.$message.error(res.message);
}
};
this.getData(
"post",
`/sensitive/dataSearch/check/export`,
// this.queryParams,
data,
callback
);
},
handleExport() {
let callback = (res) => {
if (res.code == "000000") {
console.log("正式导出》》》》 ", res);
// 执行下载excel
this.downloadFile(res.data.path, res.data.fileName);
this.exportModalVisible = false;
} else {
this.$message.error(res.message);
}
};
this.getData(
"post",
`/sensitive/dataStatistics/exportDataStatistic`,
this.queryParams,
callback
);
},
downloadFile(base64, fileName) {
let a = document.createElement("a");
let uploadHref = "data:application/xls;base64," + base64;
a.setAttribute("href", uploadHref);
let exportFileName = fileName;
a.setAttribute("download", exportFileName);
a.click();
},
// 根据审批编号查询申请日期操作
handleIdChange(value) {
if (value.length == 21) {
this.getData(
"get",
`/sensitive/visit/date?dingdingNumber=${value}`,
{},
(data) => {
this.dingdingDateList = data.data;
}
);
} else {
this.dingdingDateList = [];
// this.projectList = [];
this.sheetList = [];
this.queryParams.dingdingDate = "";
this.queryParams.dataSheetName = "";
}
},
// 根据审批编号和日期搜索sheet
handleDatechange(val) {
this.sheetList = [];
this.queryParams.dataSheetName = "";
this.getData(
"get",
`/sensitive/visit/sheet?dingdingNumber=${this.queryParams.dingdingNumber}&dingdingDate=${val}`,
{},
(data) => {
this.sheetList = data.data;
}
);
},
// 选中sheet
handleSheetchange(val) {},
// 获取全部分页数据
getDataList(pageNum, queryData) {
this.getData(
"post",
"/sensitive/dataStatistics/queryData",
{
pageNum: pageNum,
pageSize: this.pageSize,
...queryData,
},
(data) => {
this.dataList = data.data.list;
this.total = data.data.total;
}
);
},
// 根据页码获取数据
handleSizeChange(size) {
this.pageSize = size;
this.getDataList(this.currentPage, {});
},
// 根据分页获取数据
dataListChange(num) {
this.currentPage = num;
this.getDataList(num, {});
},
// 查看个人审批编号页面
dataview(row) {
// this.$router.push("/data-view");
this.$router.push({
path: "/data-view",
query: {
dingdingNumber: row.dingdingNumber,
dingdingDate: row.dingdingDate,
sheet: row.dataSheetName,
},
});
},
numInputLimit(e) {
let key = e.key;
// 不允许输入'e'和'.'
if (key === "e" || key === ".") {
e.returnValue = false;
return false;
}
return true;
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
closeCreate() {
this.centerDialogVisible = false;
},
closeModify() {
this.reviseDialogVisible = false;
},
// 数据导入成功之后的通知方法
saveSuccess() {
this.getDataList(this.currentPage, {});
},
// 封装一下请求通用的方法
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) => {
console.log("getData() : error = " + error);
closeLoading(this);
this.$message.error("网络出现点问题");
});
},
},
};
</script>
<style lang="less">
.data-in-wrap {
.pagination-style {
margin-top: 30px;
float: right;
}
}
.close-msg-box {
width: 280px;
}
.tag-select {
width: 100px;
}
.dialog-title {
margin-bottom: 25px;
font-weight: bold;
text-align: center;
font-size: 18px;
}
.href-link {
color: red;
margin-top:5px;
margin-left:10px;
}
</style>
\ No newline at end of file
src/views/sensitive-control/data-view-message.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="data-view-message-wrap">
<template v-if="searchTableVisible">
<div class="class-top-row">
<el-row class="button-wrap">
<el-col :span="1" style="margin-left: 20px;width: 70px;margin-top: 4px">
<label style="font-size: 16px;">标记状态</label>
</el-col>
<el-select
v-model="labelStatus"
size="small"
placeholder="请选择"
clearable
style="margin-left: 0px;width:180px"
>
<el-option
v-for="item in dataProjectStates"
:key="item.id"
:label="item.value"
:value="item.id"
></el-option>
</el-select>
<el-link style="margin-left:40px">备注</el-link>
<el-input
v-model="remark"
size="small"
style="width:180px;"
class="input"
placeholder
clearable
></el-input>
</el-row>
<el-row class="button-wrap">
<el-button class="each-button" type="primary" @click="labelVisible=true">添加标签筛选</el-button>
<el-button class="each-button" type="primary" @click="handleSearchByClick">查询</el-button>
<el-button
class="each-button"
type="primary"
@click="showExportModal"
v-if="showExportBtn"
>导出</el-button>
<el-button class="each-button" type="primary" @click="showAddConditionModal(true)">添加筛选条件</el-button>
</el-row>
</div>
<template
v-if="tableDataList && tableDataList.outModels && tableDataList.outModels.length > 0"
>
<el-table
:data="tableDataList.outModels"
:row-style="getRowClass"
:header-row-style="getRowClass"
:header-cell-style="getRowClass"
border
style="width: 100%; flex:1; overflow: scroll;"
>
<template
v-if="tableDataList && tableDataList.columnList"
v-for="item in tableDataList.columnList"
>
<el-table-column
:prop="item.key"
align="center"
:label="item.value"
show-overflow-tooltip
></el-table-column>
</template>
<el-table-column label="备注" prop="remark" align="center" width="120"></el-table-column>
<el-table-column label="标记状态" prop="statusValue" align="center" width="100"></el-table-column>
<el-table-column align="center" label="操作" width="220">
<template slot-scope="scope">
<el-button @click="showRemarkModal(scope.row)" type="text" size="small">备注</el-button>
<el-button
@click="handleTagClick(scope.row)"
type="text"
size="small"
:disabled="scope.row.status == 1"
>{{ scope.row.status == 1 ? '已处理' : '标记处理' }}</el-button>
<el-button @click="handleSetLabelClick(scope.row)" type="text" size="small">标签</el-button>
<el-button @click="dialPhone(scope.row)" type="text" size="small">拨号</el-button>
</template>
<!-- <template slot-scope="scope">
<el-select
v-model="labelStatus"
size="small"
placeholder="请选择"
style="margin-left: 0px;"
@click.native="dealOperationClick(scope.row)"
@change="dealOperationChanged">
<el-option
v-for="item in operationList"
:key="item.id"
:label="item.value"
:value="item.id"
></el-option>
</el-select>
</template>-->
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination
class="pagination-style"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="tableDataList.total"
:current-page="pageNo"
:page-sizes="[15, 50, 100, 200, 300]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
></el-pagination>
</template>
<div class="no-table-data" v-else>暂无数据</div>
</template>
<!-- 验证弹窗 -->
<el-dialog
title
:close-on-click-modal="false"
class="check-modal-box"
:visible.sync="centerDialogVisible"
width="300px"
center
>
<p
style="word-break: break-all"
>该数据的审批单号为 {{dingdingNum}}，短信将发送至 {{mobilePhone}} 的手机上，如果手机已停用，请联系管理员。</p>
<div class="captcha-wrap">
<el-input v-model="captchaCode" size="small" placeholder="请输入图形验证码"></el-input>
<img :src="captchaImg" alt @click="handleImgClick" />
</div>
<div class="sms-wrap">
<el-input v-model="smsCode" size="small" placeholder="请输入短信验证码"></el-input>
<div :class="getSMSClass" @click="getSMSCode">{{SMSTips}}</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="handleCheckConfirm">确 定</el-button>
</span>
</el-dialog>
<!-- 添加筛选条件弹窗 -->
<el-dialog
:show-close="false"
@close="showAddConditionModal(false)"
:close-on-click-modal="false"
title="添加筛选条件"
class="condition-dialog-wrap"
:visible="addConditioDialogVisible"
width="300px"
center
>
<el-form ref="form" :model="conditionForm" label-width="80px">
<template
v-if="tableDataList && tableDataList.columnList"
v-for="item in tableDataList.columnList"
>
<el-form-item :label="item.value" style="width:400px;">
<el-input v-model="conditionForm[item.key]" size="small" style="width: 150px;"></el-input>
</el-form-item>
</template>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClearCondition">清 空</el-button>
<el-button type="primary" @click="handleAddConditionConfirm">确 定</el-button>
</span>
</el-dialog>
<!-- 标记处理弹窗 -->
<el-dialog title="标记状态" :visible.sync="tagVisible" width="300px" center>
<el-select
v-model="tagStatus"
size="small"
placeholder="请选择"
clearable
style="margin-left: 20px"
>
<el-option
v-for="item in dataProjectStates"
:key="item.id"
:label="item.value"
:value="item.id"
></el-option>
</el-select>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="dealTagClick">确 定</el-button>
<el-button @click="tagVisible = false">取 消</el-button>
</span>
</el-dialog>
<!-- 添加标签筛选条件弹窗 -->
<el-dialog title="标签筛选条件" :visible.sync="labelVisible" width="300px" center>
<div style="display: flex;margin-top:10px;" v-if="dataProjectLabels" v-for="(item,i) in dataProjectLabels">
<div class="same-line-class" style="margin-right:10px;margin-top:10px;">{{item.labelValue}}</div>
<div class="input-comp">
<el-input v-model="dataProjectContents[i]" size="small" />
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleLabelClick">确 定</el-button>
<el-button @click="labelVisible = false">取 消</el-button>
</span>
</el-dialog>
<!-- 添加设置标签弹窗 -->
<el-dialog title="设置标签" :visible.sync="setLabelVisible" width="300px" center>
<div style="display: flex;margin-top:10px;" v-if="dataProjectLabels" v-for="(item, i) in dataProjectLabels" align="center">
<div class="same-line-class" style="margin-right:10px;margin-top:10px;">{{item.labelValue}}</div>
<div class="input-comp">
<el-input v-model="setLabelList[i]" size="small" />
</div>
</div>
<el-table
v-if="historyLabelList && historyLabelList.menus && historyLabelList.menus.length > 0"
ref="multipleTable"
:data="historyLabelList.datas"
:row-style="getRowClass"
:header-row-style="getRowClass"
:header-cell-style="getRowClass"
border
tooltip-effect="dark"
style="width: 100%;margin-top: 20px"
>
<template
v-if="historyLabelList && historyLabelList.menus"
v-for="item in historyLabelList.menus"
>
<el-table-column :prop="item.key" :label="item.value" :value="item.value" align="center"></el-table-column>
</template>
</el-table>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="dealSetLabelClick">确 定</el-button>
<el-button @click="setLabelVisible = false">取 消</el-button>
</span>
</el-dialog>
<!-- 备注 弹窗 -->
<el-dialog
title="备注"
@close="handleRemarkClose"
:close-on-click-modal="false"
class="remark-modal"
:visible.sync="remarkDialogVisible"
width="300px"
center
>
<el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="newRemark"></el-input>
<el-button type="primary" class="remark-confirm-btn" @click="confirmSendRemark">确 定</el-button>
<ul class="history-list">
<li v-for="item in remarkHistory">
<p class="date">{{ item.createdTime }}</p>
<p class="text">{{ item.remark }}</p>
</li>
</ul>
</el-dialog>
<!-- 拨号弹窗 -->
<el-dialog title="拨号" :visible.sync="dialVisible" width="300px" center>
<a :href="'tel:' + dialPhoneNum">拨打电话给： {{dialPhoneNum}}</a>
<span slot="footer" class="dialog-footer">
<!-- <el-button type="primary" @click="gotoDialPhone">确 定</el-button> -->
<el-button @click="dialVisible = false">取 消</el-button>
</span>
</el-dialog>
<!-- 导出弹窗 -->
<el-dialog title="导出" :visible.sync="exportModalVisible" width="300px" center>
<p>您当前数据总导出次数为：{{checkExportData.dataExportTotal}}次</p>
<p>剩余导出次数为：{{checkExportData.dataExportCount}}次</p>
<span slot="footer" class="dialog-footer">
<el-button @click="exportModalVisible = false">取 消</el-button>
<el-button type="primary" @click="handleExport">确 定</el-button>
</span>
</el-dialog>
<!-- 浏览器检测弹窗 -->
<el-dialog title="当前不是chome浏览器，去下载？" :visible.sync="browserVisible" width="300px">
<span slot="footer" class="dialog-footer">
<el-button @click="down">确定</el-button>
<el-button @click="browserVisible = false">取 消</el-button>
</span>
</el-dialog>
<!-- 提醒去电脑弹窗 -->
<el-dialog title="提示" :visible.sync="phoneModalVisible" width="300px" center>
<p>请用电脑浏览器进行导出操作</p>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="phoneModalVisible = false">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
let vm = null;
import { openLoading, closeLoading } from "../../common/utils";
export default {
computed: {
getSMSClass() {
if (vm.countDownNum == 60) {
return "button";
} else {
return "button gray";
}
},
},
created() {
vm = this;
// url的?后面有参数，则可调接口获取手机号及审批单号;
let params = window.location.href.split("?");
if (params && params.length > 1) {
vm.afterParam = params[1];
// console.log('afterParam: ', vm.afterParam)
vm.getPhoneNum();
vm.getLabelStatus();
} else {
alert("访问的网页地址无效！");
}
// 获取图片验证码
vm.getCaptcha();
},
mounted() {
vm.handleForbid(); // 禁止默认事件
},
data() {
return {
waterMark: "", // 水印图片地址
searchTableVisible: true, // 弹窗下面的 搜索按钮及表格等 是否显示
remarkDialogVisible: false, // 备注弹窗
newRemark: "",
remarkHistory: [], // 历史备注列表
SMSTips: "获取短信验证码",
countDownNum: 60, // 倒计时
timer: null, // 倒计时定时器
afterParam: "",
dingdingNum: "",
mobilePhone: "",
captchaImg: "", // 图片验证码 url
captchaToken: "", // 图片验证码 token
addConditioDialogVisible: false, // 添加筛选条件
conditionForm: {},
tableDataList: {},
centerDialogVisible: true, // 验证弹窗
tableData: [],
captchaCode: "", // 图形验证码
smsCode: "", // 短信验证码
pageNo: 1,
pageSize: 15,
operationList: [
{ id: 0, value: "备注" },
{ id: 1, value: "标记" },
{ id: 2, value: "标签" },
{ id: 3, value: "拨号" },
],
dataProjectStates: [],
dataProjectLabels: [],
dataProjectContents: [],
labelStatus: "",
remark: "",
tagVisible: false, //标记处理弹窗
tagStatus: "",
labelVisible: false, //添加标签筛选弹窗
setLabelVisible: false, //添加设置标签弹窗
setLabelList: [],
uploadLabelList: [],
historyLabelList: {},
dialVisible: false, //拨号弹窗
dialPhoneNum: "",
showExportBtn: false, // 是否显示 导出按钮
exportModalVisible: false, // 导出弹窗
checkExportData: {
dataExportTotal: 0, // 总的
dataExportCount: 0, // 剩余的
},
phoneModalVisible: false,
browserVisible: false,
};
},
methods: {
handleForbid() {
document.oncontextmenu = function () {
return false;
};
document.oncopy = function () {
return false;
};
document.onpaste = function () {
return false;
};
document.onselectstart = function () {
return false;
};
},
handleRemarkClose() {
vm.newRemark = "";
vm.remarkHistory = [];
},
getWaterMark() {
let data = {
parame: vm.afterParam,
};
let callback = (res) => {
if (res.code == "000000") {
// debugger;
if (res.data) {
vm.waterMark = res.data;
vm.setWaterMark(); // 设置水印背景
} else {
vm.$message.error("网络出现点问题");
}
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("post", `/sensitive/image`, data, callback);
},
setWaterMark() {
let bg = document.getElementsByClassName("data-view-message-wrap")[0];
// bg.style.background = `url(${vm.waterMark}) repeat`;
bg.style.background = "url('" + vm.waterMark + "') repeat";
bg.style.backgroundSize = "300px auto";
},
getRowClass({ row, column, rowIndex, columnIndex }) {
return "background: rgba(255,255,255,0.2)";
},
confirmSendRemark() {
// 添加备注信息
if (vm.newRemark.trim() == "") {
vm.$message.error("请先输入备注信息！");
return;
}
let data = {
dataContentId: vm.currentRow.contentId,
dataUserContentId: vm.currentRow.dataUserContentId,
remark: vm.newRemark.trim(),
};
let callback = (res) => {
if (res.code == "000000") {
vm.remarkDialogVisible = false;
vm.handleSearch();
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("post", `/sensitive/dataRemark`, data, callback);
},
handleSizeChange(val) {
console.log("size change .......");
vm.pageSize = val;
vm.handleSearch();
},
handleCurrentChange(val) {
console.log("currentPage change .......");
vm.pageNo = val;
vm.handleSearch();
},
// 获取编号和手机号
getPhoneNum() {
// 请求查询接口
let data = {
parame: vm.afterParam,
};
let callback = (res) => {
if (res.code == "000000") {
vm.dingdingNum = res.data.dingdingNum;
vm.mobilePhone = res.data.mobilePhone;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"post",
`/sensitive/mobileCheck/num/mobile`,
data,
callback
);
},
// 获取图形验证码
getCaptcha() {
let callback = (res) => {
if (res.code === "000000") {
vm.captchaImg = `data:image/png;base64,${res.data.content}`;
vm.captchaToken = res.data.token;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("get", `/account/account/captcha`, {}, callback);
},
// 图片验证码点击
handleImgClick() {
vm.getCaptcha();
},
// 获取短信验证码
getSMSCode() {
if (vm.captchaCode == "") {
vm.$message.error("请输入图形验证码");
return;
}
// 倒计时过程中不可点
if (vm.countDownNum != 60) {
// console.log('现在倒计时过程中...不可点击')
return;
}
// 获取短信验证码
let data = {
parame: vm.afterParam,
pictureCode: vm.captchaCode,
captchaToken: vm.captchaToken,
};
let callback = (res) => {
if (res.code == "000000") {
vm.timeCount();
} else {
vm.$message.error(res.message);
vm.getCaptcha();
}
};
vm.sendRequest(
"post",
`/sensitive/mobileCheck/check/picturecode`,
data,
callback
);
},
timeCount() {
clearInterval(vm.timer);
vm.countDownNum -= 1;
vm.SMSTips = `${vm.countDownNum}秒后重试`;
vm.timer = setInterval(function () {
vm.countDownNum -= 1;
vm.SMSTips = `${vm.countDownNum}秒后重试`;
if (vm.countDownNum == 0) {
vm.SMSTips = "获取短信验证码";
clearInterval(vm.timer);
vm.countDownNum = 60;
}
}, 1000);
},
handleCheckConfirm() {
if (vm.captchaCode == "") {
vm.$message.error("请输入图形验证码");
return;
}
if (vm.smsCode == "") {
vm.$message.error("请输入短信验证码");
return;
}
// 调用 /mobileCheck/check/mobilecode 接口
// 校验 短信验证码
let data = {
parame: vm.afterParam,
mobileCode: vm.smsCode,
};
let callback = (res) => {
if (res.code == "000000") {
vm.searchTableVisible = true; // 短信验证码校验成功，显示背后的内容
vm.getTableList();
} else {
vm.$message.error(res.message);
vm.getCaptcha();
vm.captchaCode = "";
}
};
vm.sendRequest(
"post",
`/sensitive/mobileCheck/check/mobilecode`,
data,
callback
);
},
getTableList(isManualClick) {
// debugger;
let data = {
columnMap: {},
labelMap: {},
parame: vm.afterParam,
pageNo: vm.pageNo,
pageSize: vm.pageSize,
projectStateId: vm.labelStatus,
remark: vm.remark,
};
if (isManualClick) {
// 如果添加了筛选条件，则将其合并到 查询接口的传参中
let stringData = JSON.stringify(vm.conditionForm);
if (stringData != "{}") {
let condition = JSON.parse(stringData);
for (let key in condition) {
data.columnMap[key] = condition[key];
}
}
if (vm.dataProjectLabels.length > 0) {
for (let i = 0; i < vm.dataProjectLabels.length; i++) {
console.log(
"getTableList() : key = " +
vm.dataProjectLabels[i].labelCode +
", value = " +
vm.dataProjectContents[i]
);
data.labelMap[vm.dataProjectLabels[i].labelCode] =
vm.dataProjectContents[i];
}
}
}
let callback = (res) => {
if (res.code == "000000") {
vm.centerDialogVisible = false;
vm.captchaCode = "";
vm.smsCode = "";
vm.tableDataList = res.data;
if (
typeof res.data.dataExportCount != "undefined" &&
res.data.dataExportCount > 0
) {
vm.showExportBtn = true;
}
vm.$nextTick(() => {
if (vm.afterParam) {
vm.getWaterMark(); // 获取水印
}
});
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("post", `/sensitive/dataSearch/searchWeb`, data, callback);
},
showAddConditionModal(status) {
vm.addConditioDialogVisible = status ? true : false;
},
handleClearCondition() {
vm.conditionForm = {};
vm.addConditioDialogVisible = false;
},
handleSearch() {
vm.getTableList(true);
},
handleSearchByClick() {
vm.pageNo = 1;
vm.handleSearch();
},
//下拉操作列表点击
dealOperationClick(row) {
// console.log("dealOperationClick() : row.remark = " + row.remark);
vm.currentRow = row;
},
dealOperationChanged(item) {
console.log("dealOperationChanged() : item = " + item.value);
},
showRemarkModal(row) {
vm.remarkDialogVisible = true;
vm.currentRow = row;
// 获取备注信息
let callback = (res) => {
if (res.code == "000000") {
vm.remarkHistory = res.data.remarks;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"get",
`/sensitive/dataRemark?dataContentId=${row.contentId}`,
{},
callback
);
},
// 标记处理点击
handleTagClick(row) {
vm.currentRow = row;
this.tagVisible = true;
},
dealTagClick() {
let callback = (res) => {
if (res.code == "000000") {
this.$message({
type: "success",
message: "标记状态设置成功",
});
vm.handleSearch();
} else {
vm.$message.error(res.message);
}
vm.tagVisible = false;
};
vm.sendRequest(
"get",
`/sensitive/dataSearch/changeStatus?dataUserContentId=${vm.currentRow.dataUserContentId}
&dataContentId=${vm.currentRow.contentId}&projectStateId=${vm.tagStatus}`,
{},
callback
);
},
//每一项的标签点击
handleSetLabelClick(row) {
vm.currentRow = row;
vm.setLabelVisible = true;
// 获取历史标签信息
let callback = (res) => {
if (res.code == "000000") {
vm.historyLabelList = res.data;
// console.log(
// "handleSetLabelClick() : vm.historyLabelList = " +
// vm.historyLabelList.menus.length
// );
if (vm.dataProjectLabels == null || vm.dataProjectLabels == "") {
vm.$message.info("未设置过标签");
}
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"get",
`/sensitive/dataSearch/labels?dataContentId=${row.contentId}`,
{},
callback
);
},
dealSetLabelClick() {
let tmpList = [];
if (vm.dataProjectLabels && vm.dataProjectLabels.length > 0) {
for (let i = 0; i < vm.dataProjectLabels.length; i++) {
let obj = {
labelCode: vm.dataProjectLabels[i].labelCode,
labelValue: vm.setLabelList[i],
};
tmpList.push(obj);
}
} else {
vm.setLabelVisible = false;
return;
}
let data = {
contentId: vm.currentRow.contentId,
dataUserContentId: vm.currentRow.dataUserContentId,
list: tmpList,
projectMainId: 0,
};
let callback = (res) => {
if (res.code == "000000") {
// vm.peopleList = res.data;
this.$message({
type: "success",
message: "设置标签成功",
});
} else {
vm.$message.error(res.message);
}
vm.setLabelVisible = false;
};
vm.sendRequest("post", `/sensitive/dataSearch/labels`, data, callback);
},
//拨号
dialPhone(row) {
console.log("tableDataList.columnList() : " + row.column1);
vm.dialPhoneNum = row.column1;
vm.dialVisible = true;
},
handleAddConditionConfirm() {
vm.addConditioDialogVisible = false;
vm.pageNo = 1;
},
showExportModal() {
if (vm.checkChrome()) {
console.log("导出检测，是chome");
vm.browserVisible = false;
} else {
console.log("导出检测，是其它浏览器");
vm.browserVisible = true;
return;
}
let phoneStatus = vm.isCellphone();
if (phoneStatus) {
vm.phoneModalVisible = true;
vm.exportModalVisible = false;
return;
}
// 待接口提供后 请求接口获取excel, 再出发下载
vm.checkExport();
},
// 导出前的check
checkExport() {
let data = {
parame: vm.afterParam,
};
let callback = (res) => {
if (res.code == "000000") {
console.log("导出前校验》》》》 ", res);
vm.checkExportData.dataExportTotal = res.data.dataExportTotal;
vm.checkExportData.dataExportCount = res.data.dataExportCount;
vm.exportModalVisible = true;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"post",
`/sensitive/dataSearch/check/exportWeb`,
data,
callback
);
},
// 确定导出
handleExport() {
let data = {
parame: vm.afterParam,
};
let callback = (res) => {
if (res.code == "000000") {
console.log("正式导出》》》》 ", res);
// 执行下载excel
vm.downloadFile(res.data.path, res.data.fileName);
vm.exportModalVisible = false;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("post", `/sensitive/dataSearch/exportWeb`, data, callback);
},
isCellphone() {
let ua = window.navigator.userAgent.toLowerCase();
let ios = /(iphone|ipad|ipod|ios)/i.test(ua);
let android = /(android)/i.test(ua);
return ios || android;
},
downloadFile(base64, fileName) {
let a = document.createElement("a");
let uploadHref = "data:application/xls;base64," + base64;
a.setAttribute("href", uploadHref);
let exportFileName = fileName;
a.setAttribute("download", exportFileName);
a.click();
},
checkChrome() {
// return (navigator.appVersion.indexOf('Chrome') || navigator.appVersion.indexOf('chrome')) != -1;
return this.getBroswer().broswer == "Chrome";
},
getBroswer() {
let sys = {};
let ua = navigator.userAgent.toLowerCase();
let s;
(s = ua.match(/edge\/([\d.]+)/))
? (sys.edge = s[1])
: (s = ua.match(/rv:([\d.]+)\) like gecko/))
? (sys.ie = s[1])
: (s = ua.match(/msie ([\d.]+)/))
? (sys.ie = s[1])
: (s = ua.match(/firefox\/([\d.]+)/))
? (sys.firefox = s[1])
: (s = ua.match(/chrome\/([\d.]+)/))
? (sys.chrome = s[1])
: (s = ua.match(/opera.([\d.]+)/))
? (sys.opera = s[1])
: (s = ua.match(/version\/([\d.]+).*safari/))
? (sys.safari = s[1])
: 0;
if (sys.edge) return { broswer: "Edge", version: sys.edge };
if (sys.ie) return { broswer: "IE", version: sys.ie };
if (sys.firefox) return { broswer: "Firefox", version: sys.firefox };
if (sys.chrome) return { broswer: "Chrome", version: sys.chrome };
if (sys.opera) return { broswer: "Opera", version: sys.opera };
if (sys.safari) return { broswer: "Safari", version: sys.safari };
return { broswer: "", version: "0" };
},
down() {
window.location.href = "http://www.google.cn/chrome/";
},
sendRequest(type, url, params, callback) {
openLoading(vm);
url = localStorage.getItem("lectureUrl") + url;
vm.$axios[type](url, params)
.then((res) => {
closeLoading(vm);
res = res.data;
callback(res);
})
.catch((error) => {
vm.$message.error("网络出现点问题");
});
},
getLabelStatus() {
let callback = (res) => {
if (res.code == "000000") {
vm.dataProjectStates = res.data.dataProjectStates;
vm.dataProjectLabels = res.data.dataProjectLabels;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"get",
`/sensitive/visit/statusWeb?patame=${vm.afterParam}`,
{},
callback
);
},
handleLabelClick() {
this.labelVisible = false;
},
},
};
</script>
<style lang="less">
.header {
height: 0 !important;
overflow: hidden;
left: 0 !important;
}
.sidebar {
width: 0;
overflow: hidden;
}
.content {
left: 0 !important;
top: 0 !important;
}
.el-message {
min-width: 310px !important;
width: 310px !important;
max-width: 310px !important;
}
.data-view-message-wrap {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
user-select: none;
.no-table-data {
width: 100%;
height: 400px;
line-height: 400px;
text-align: center;
color: #606266;
font-size: 14px;
}
.class-top-row {
overflow-x: scroll;
.button-wrap {
margin: 20px 0;
width: 600px;
.each-button {
// float: right;
margin: 0px 0px 0 20px;
}
}
}
.el-table {
-webkit-overflow-scrolling: touch;
}
.check-modal-box {
.el-dialog__header {
display: none;
}
.el-dialog__body {
padding: 15px 15px 30px !important;
}
.captcha-wrap {
margin-top: 24px;
overflow: hidden;
.el-input {
width: 150px;
float: left;
}
img {
float: left;
cursor: pointer;
display: block;
border: none;
width: 100px;
height: 32px;
margin-left: 10px;
background: #fff;
}
}
.sms-wrap {
margin-top: 14px;
overflow: hidden;
.el-input {
width: 150px;
float: left;
}
.button {
float: left;
cursor: default;
width: 100px;
height: 32px;
margin-left: 10px;
font-size: 13px;
text-align: center;
line-height: 32px;
color: #409eff;
&.gray {
color: #606266;
}
}
}
}
ul,
li {
list-style: none;
}
.remark-modal {
.el-dialog__body {
overflow: hidden;
padding: 0 10px 30px !important;
.remark-confirm-btn {
float: right;
margin-top: 10px;
}
.history-list {
margin-top: 60px;
li {
margin-bottom: 5px;
line-height: 20px;
.text {
word-break: break-all;
text-indent: 12px;
line-height: 22px;
}
}
}
}
}
.pagination-style {
margin: 20px 0;
float: right;
width: 100%;
text-align: right;
overflow: hidden;
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
.el-pagination__total {
margin-left: 25px;
}
.el-pagination__jump {
padding-right: 25px;
}
}
.tebale_card {
background: rgba(255, 255, 255, 0.2);
}
.el-table,
.el-table__expanded-cell {
background: rgba(255, 255, 255, 0.2);
}
.same-line-class {
// margin-top: 10px;
display: inline-block;
.input-comp {
width: 100px;
}
}
}
</style>
src/views/sensitive-control/data-view.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="data-view-wrap">
<h2 class="top-title">数据查看</h2>
<el-form :inline="true" :model="ruleForm" :rules="rules" ref="ruleForm" class="search-ruleForm">
<el-form-item label="钉钉流程审批单号" prop="dingdingNumber">
<el-input
v-model="ruleForm.dingdingNumber"
size="small"
class="input"
clearable
@input="handleDingNumChange"
@clear="handleDingNumClear"
@keydown.native="numInputLimit"
maxlength="21"
></el-input>
</el-form-item>
<el-form-item label="数据申请日期" prop="dingdingDate">
<el-select
v-model="ruleForm.dingdingDate"
size="small"
placeholder="请选择"
clearable
@change="handleApplyDateChange"
@clear="handleApplyDateClear"
>
<el-option v-for="item in applyDateList" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="sheet名" prop="sheet">
<el-select v-model="ruleForm.sheet" size="small" placeholder="请选择" clearable>
<el-option v-for="item in sheetsList" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="标记状态">
<el-select v-model="ruleForm.labelStatus" size="small" placeholder="请选择" clearable>
<el-option
v-for="item in dataProjectStates"
:key="item.id"
:label="item.value"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
v-model="ruleForm.remark"
size="small"
style="width:220px"
class="input"
placeholder
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" style="margin-left: 50px;" @click="showAddConditionModal">添加筛选条件</el-button>
<el-button type="primary" @click="labelVisible=true">添加标签筛选</el-button>
<el-button type="primary" @click="handleSend" v-if="showSendBtn">分发</el-button>
<el-button type="primary" @click="checkExport" v-if="showExportBtn">导出</el-button>
<el-button type="primary" @click="exportNormalModalVisible=true" v-if="showNormalExportBtn">常规导出</el-button>
<el-button type="primary" @click="ruleForm.pageNo=1;submitForm('ruleForm')">查询</el-button>
</el-form-item>
</el-form>
<template v-if="isSearchSend">
<el-table
v-if="tableDataList && tableDataList.outModels && tableDataList.outModels.length > 0"
ref="multipleTable"
:data="tableDataList.outModels"
:row-style="getRowClass"
:header-row-style="getRowClass"
:header-cell-style="getRowClass"
border
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" align="center" width="55"></el-table-column>
<template
v-if="tableDataList && tableDataList.columnList"
v-for="item in tableDataList.columnList"
>
<el-table-column
:prop="item.key"
align="center"
:label="item.value"
show-overflow-tooltip
></el-table-column>
</template>
<el-table-column
v-if="tableDataList && tableDataList.columnList"
prop="userName"
align="center"
label="数据查看人员"
show-overflow-tooltip
></el-table-column>
<el-table-column label="备注" prop="remark" align="center"></el-table-column>
<el-table-column label="标记状态" prop="statusValue" align="center"></el-table-column>
<el-table-column fixed="right" align="center" label="操作" width="200">
<template slot-scope="scope">
<el-button @click="handleRemarkClick(scope.row)" type="text" size="small">备注</el-button>
<el-button
@click="handleTagClick(scope.row)"
type="text"
size="small"
:disabled="scope.row.status == 1"
>{{ scope.row.status == 1 ? '已处理' : '标记处理' }}</el-button>
<el-button @click="handleSetLabelClick(scope.row)" type="text" size="small">标签</el-button>
</template>
</el-table-column>
</el-table>
<div class="no-table-data" v-else>暂无数据</div>
<!-- 分页 -->
<el-pagination
v-if="tableDataList && tableDataList.outModels && tableDataList.outModels.length > 0"
class="pagination-style"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="tableDataList.total"
:current-page="ruleForm.pageNo"
:page-sizes="[15, 30, 50, 100]"
:page-size="ruleForm.pageSize"
layout="total, sizes, prev, pager, next, jumper"
></el-pagination>
</template>
<!-- 添加筛选条件 弹窗 -->
<el-dialog
title="添加筛选条件"
class="condition-dialog-wrap"
:visible.sync="addConditioDialogVisible"
:show-close="false"
width="500px"
center
>
<el-form ref="form" :model="conditionForm" label-width="100px">
<template
v-if="tableDataList && tableDataList.columnList"
v-for="item in tableDataList.columnList"
>
<el-form-item :label="item.value" style="width:400px;">
<el-input v-model="conditionForm[item.key]" size="small"></el-input>
</el-form-item>
</template>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClearCondition">清 空</el-button>
<el-button type="primary" @click="handleAddConditionConfirm">确 定</el-button>
</span>
</el-dialog>
<!-- 分发 弹窗 -->
<el-dialog
title="分发"
:close-on-click-modal="false"
class="send-modal-box"
:visible.sync="sendDialogVisible"
width="500px"
center
>
<div class="name-list">
<p class="name">{{selectedNameList}}</p>
<p class="after-text">{{ "共" + multipleSelection.length + '人' }}</p>
</div>
<div class="people-choose">
<p class="title">人员选择</p>
<el-select
v-model="dataUserDiss"
multiple
collapse-tags
placeholder="请选择"
class="people-select-comp"
>
<el-option v-for="item in peopleList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="sendDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="handleConfirmSend">确 定</el-button>
</span>
</el-dialog>
<!-- 备注 弹窗 -->
<el-dialog
title="备注"
@close="handleRemarkClose"
:close-on-click-modal="false"
class="remark-modal"
:visible.sync="remarkDialogVisible"
width="500px"
center
>
<el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="newRemark"></el-input>
<el-button type="primary" class="remark-confirm-btn" @click="confirmSendRemark">确 定</el-button>
<ul class="history-list">
<li v-for="item in remarkHistory">
<p class="date">{{ item.createdTime }}</p>
<p class="text">{{ item.name + "-" + item.remark }}</p>
</li>
</ul>
</el-dialog>
<!-- 导出弹窗 -->
<el-dialog title="导出" :visible.sync="exportModalVisible" width="300px" center>
<p>您当前数据总导出次数为：{{checkExportData.dataExportTotal}}次</p>
<p>剩余导出次数为：{{checkExportData.dataExportCount}}次</p>
<p style="margin-top: 10px;margin-bottom: 5px">备注：请使用谷歌浏览器导出</p>
<a :href ="'http://www.google.cn/chrome/'" class="href-link">点击下载</a>
<span slot="footer" class="dialog-footer">
<el-button @click="exportModalVisible = false">取 消</el-button>
<el-button type="primary" @click="handleExport">确 定</el-button>
</span>
</el-dialog>
<!-- 常规导出弹窗 -->
<el-dialog title="导出" :visible.sync="exportNormalModalVisible" width="300px" center>
<p>只能导出已修改过标记状态的数据，</p>
<p>其它数据不可导出</p>
<p style="margin-top: 10px;margin-bottom: 5px">备注：请使用谷歌浏览器导出</p>
<a :href ="'http://www.google.cn/chrome/'" class="href-link">点击下载</a>
<span slot="footer" class="dialog-footer">
<el-button @click="exportNormalModalVisible = false">取 消</el-button>
<el-button type="primary" @click="handleNormalExport">确 定</el-button>
</span>
</el-dialog>
<!-- 浏览器检测弹窗 -->
<el-dialog
title="当前不是chome浏览器，去下载？"
:visible.sync="browserVisible"
width="300px"
>
<span slot="footer" class="dialog-footer">
<el-button @click="down">确定</el-button>
<el-button @click="browserVisible = false">取 消</el-button>
</span>
</el-dialog>
<!-- 标记处理弹窗 -->
<el-dialog title="标记状态" :visible.sync="tagVisible" width="300px" center>
<el-select
v-model="tagStatus"
size="small"
placeholder="请选择"
clearable
style="margin-left: 20px"
>
<el-option
v-for="item in dataProjectStates"
:key="item.id"
:label="item.value"
:value="item.id"
></el-option>
</el-select>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="dealTagClick">确 定</el-button>
<el-button @click="tagVisible = false">取 消</el-button>
</span>
</el-dialog>
<!-- 添加标签筛选条件弹窗 -->
<el-dialog title="标签筛选条件" :visible.sync="labelVisible" width="400px" center>
<div v-if="dataProjectLabels" v-for="(item,i) in dataProjectLabels" align="center">
<div class="same-line-class" style="margin-right:20px;">{{item.labelValue}}</div>
<div class="same-line-class">
<el-input v-model="dataProjectContents[i]" size="small" />
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleLabelClick">确 定</el-button>
<el-button @click="labelVisible = false">取 消</el-button>
</span>
</el-dialog>
<!-- 添加设置标签弹窗 -->
<el-dialog title="设置标签" :visible.sync="setLabelVisible" min-width="500px" center>
<div v-if="dataProjectLabels" v-for="(item, i) in dataProjectLabels" align="center">
<div class="same-line-class" style="margin-right:20px;">{{item.labelValue}}</div>
<div class="same-line-class">
<el-input v-model="setLabelList[i]" size="small" />
</div>
</div>
<el-table
v-if="historyLabelList && historyLabelList.menus && historyLabelList.menus.length > 0"
ref="multipleTable"
:data="historyLabelList.datas"
:row-style="getRowClass"
:header-row-style="getRowClass"
:header-cell-style="getRowClass"
border
tooltip-effect="dark"
style="width: 100%;margin-top: 20px"
>
<template
v-if="historyLabelList && historyLabelList.menus"
v-for="item in historyLabelList.menus"
>
<el-table-column :prop="item.key" :label="item.value" :value="item.value" align="center"></el-table-column>
</template>
</el-table>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="dealSetLabelClick">确 定</el-button>
<el-button @click="setLabelVisible = false">取 消</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
let vm = null;
import { openLoading, closeLoading } from "../../common/utils";
export default {
data() {
var checkNumLength = (rule, value, callback) => {
if (!value) {
return callback(new Error("请输入审批单号"));
} else if (value && (value + "").length != 21) {
callback(new Error("审批单号必须为21位数字值"));
} else {
callback();
}
};
return {
selectedNameList: "",
waterMark: "", // 水印图片地址
isSearchSend: false, // 是否有效查询过
showSendBtn: false, // 是否显示 分发按钮
showExportBtn: false, // 是否显示 导出按钮
showNormalExportBtn: false, // 是否显示 常规导出按钮
remarkHistory: [], // 历史备注列表
ruleForm: {
columnMap: {},
dingdingNumber: "",
dingdingDate: "",
sheet: "",
labelStatus: "",
labelMap: {},
remark: "",
pageNo: 1,
pageSize: 15,
},
rules: {
dingdingNumber: [
{ required: true, message: "请输入审批单号", trigger: "blur" },
{ validator: checkNumLength, trigger: ["blur", "change"] },
],
dingdingDate: [
{ required: true, message: "请选择数据申请日期", trigger: "change" },
],
sheet: [
{ required: true, message: "请选择sheet名", trigger: "change" },
],
},
tableDataList: {},
addConditioDialogVisible: false, // 添加筛选条件
conditionForm: {},
applyDateList: [],
sheetsList: [],
dataProjectStates: [],
dataProjectLabels: [],
dataProjectContents: [],
sendDialogVisible: false, //分发弹窗
dataUserDiss: [],
peopleList: [],
remarkDialogVisible: false, //备注弹窗
newRemark: "",
multipleSelection: [],
exportModalVisible: false, // 导出弹窗
checkExportData: {
dataExportTotal: 0, // 总的
dataExportCount: 0, // 剩余的
},
exportNormalModalVisible: false, // 常规导出弹窗
tagVisible: false, //标记处理弹窗
tagStatus: "",
labelVisible: false, //添加标签筛选弹窗
setLabelVisible: false, //添加设置标签弹窗
setLabelList: [],
uploadLabelList: [],
historyLabelList: {},
browserVisible: false,
};
},
created() {
vm = this;
if (vm.$route.query.dingdingNumber) {
// data-in 页面点击查看进来时，页面地址不变
// console.log('do nothing')
} else {
vm.$router.replace("/data-view");
}
},
mounted() {
vm.getUrlQuery();
vm.getWaterMark(); // 获取水印
vm.handleForbid(); // 禁止默认事件
},
methods: {
handleForbid() {
document.oncontextmenu = function () {
return false;
};
document.oncopy = function () {
return false;
};
// document.onpaste = function(){
// return false;
// }
document.onselectstart = function () {
return false;
};
},
getLabelStatus() {
console.log("vm.ruleForm.dingdingNumber = " + vm.ruleForm.dingdingNumber);
let callback = (res) => {
if (res.code == "000000") {
vm.dataProjectStates = res.data.dataProjectStates;
vm.dataProjectLabels = res.data.dataProjectLabels;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"get",
`/sensitive/visit/status?dingdingNumber=${vm.ruleForm.dingdingNumber}&dingdingDate=${vm.ruleForm.dingdingDate}&dingdingSheet=${encodeURI(vm.ruleForm.sheet)}`,//${vm.ruleForm.sheet}
{},
callback
);
},
getUrlQuery() {
let query = vm.$route.query;
if (query && query.dingdingNumber) {
vm.ruleForm.dingdingNumber = query.dingdingNumber || "";
vm.ruleForm.dingdingDate = query.dingdingDate || "";
vm.ruleForm.sheet = query.sheet || "";
vm.submitForm("ruleForm");
}
},
sendRequest(type, url, params, callback) {
openLoading(vm);
url = localStorage.getItem("lectureUrl") + url;
vm.$axios[type](url, params)
.then((res) => {
closeLoading(vm);
res = res.data;
callback(res);
})
.catch((error) => {
vm.$message.error("网络出现点问题");
});
},
getRowClass({ row, column, rowIndex, columnIndex }) {
return "background: rgba(255,255,255,0.2)";
},
getWaterMark() {
let callback = (res) => {
if (res.code == "000000") {
if (res.data) {
vm.waterMark = res.data;
vm.setWaterMark(); // 设置水印背景
} else {
vm.$message.error("网络出现点问题");
}
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest( 'post', `/sensitive/image`, {}, callback );
},
setWaterMark() {
let bg = document.getElementById("bodyContent");
// bg.style.background = `url(${vm.waterMark}) repeat`;
bg.style.background = "url('" + vm.waterMark + "') repeat";
bg.style.backgroundSize = "300px auto";
},
handleClearCondition() {
// debugger;
vm.conditionForm = {};
vm.addConditioDialogVisible = false;
},
handleDingNumChange(val) {
vm.ruleForm.dingdingDate = "";
vm.ruleForm.sheet = "";
vm.applyDateList = [];
vm.sheetsList = [];
if (val && val.length == 21) {
vm.getApplyDateList();
} else if (val && val.length > 21) {
val = val.slice(0, 21);
vm.ruleForm.dingdingNumber = val;
}
},
numInputLimit(e) {
let key = e.key;
// 不允许输入'e'和'.'
if (key === "e" || key === ".") {
e.returnValue = false;
return false;
}
return true;
},
getApplyDateList() {
//获取 数据申请日期
let callback = (res) => {
if (res.code == "000000") {
if (res.data && res.data.length > 0) {
vm.applyDateList = res.data;
} else {
vm.applyDateList = [];
}
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"get",
`/sensitive/visit/date?dingdingNumber=${vm.ruleForm.dingdingNumber}`,
{},
callback
);
},
handleApplyDateChange(val) {
vm.ruleForm.sheet = "";
vm.sheetsList = [];
if (val) {
vm.getSheets();
}
},
handleDingNumClear() {
vm.ruleForm.dingdingDate = "";
vm.applyDateList = [];
vm.handleApplyDateClear();
},
handleApplyDateClear() {
vm.ruleForm.sheet = "";
vm.sheetsList = [];
},
getSheets() {
// 获取 Sheets名
let callback = (res) => {
if (res.code == "000000") {
if (res.data && res.data.length > 0) {
vm.sheetsList = res.data;
} else {
vm.sheetsList = [];
}
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"get",
`/sensitive/visit/sheet?dingdingNumber=${vm.ruleForm.dingdingNumber}&dingdingDate=${vm.ruleForm.dingdingDate}`,
{},
callback
);
},
confirmSendRemark() {
// 添加备注信息
if (vm.newRemark.trim() == "") {
vm.$message.error("请先输入备注信息！");
return;
}
// vm.currentRow
let data = {
dataContentId: vm.currentRow.contentId,
dataUserContentId: vm.currentRow.dataUserContentId,
remark: vm.newRemark.trim(),
};
let callback = (res) => {
if (res.code == "000000") {
vm.remarkDialogVisible = false;
vm.submitForm("ruleForm");
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("post", `/sensitive/dataRemark`, data, callback);
},
showAddConditionModal() {
vm.addConditioDialogVisible = true;
},
handleSend() {
if (vm.multipleSelection && vm.multipleSelection.length == 0) {
vm.$message.error("请先勾选表格！");
return;
}
vm.dataUserDiss = [];
vm.sendDialogVisible = true;
vm.getUserList();
},
showExportModal() {
if (vm.checkChrome()) {
console.log("导出检测，是chome");
vm.browserVisible = false;
} else {
console.log("导出检测，是其它浏览器");
vm.browserVisible = true;
return;
}
// 待接口提供后 请求接口获取excel, 再出发下载
vm.checkExport();
},
checkExport() {
vm.exportModalVisible = true;
// /dataSearch/searchUserDis
// 查询分发人员列表
let data = {
dingdingNum: vm.ruleForm.dingdingNumber,
dingdingDate: vm.ruleForm.dingdingDate,
dataSheetName: vm.ruleForm.sheet,
};
let callback = (res) => {
if (res.code == "000000") {
console.log("导出前校验》》》》 ", res);
vm.checkExportData.dataExportTotal = res.data.dataExportTotal;
vm.checkExportData.dataExportCount = res.data.dataExportCount;
// vm.exportModalVisible = true;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"post",
`/sensitive/dataSearch/check/export`,
data,
callback
);
},
handleExport() {
let data = {
dingdingNum: vm.ruleForm.dingdingNumber,
dingdingDate: vm.ruleForm.dingdingDate,
dataSheetName: vm.ruleForm.sheet,
};
let callback = (res) => {
if (res.code == "000000") {
console.log("正式导出》》》》 ", res);
// 执行下载excel
vm.downloadFile(res.data.path, res.data.fileName);
vm.exportModalVisible = false;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("post", `/sensitive/dataSearch/export`, data, callback);
},
downloadFile(base64, fileName) {
let a = document.createElement("a");
let uploadHref = "data:application/xls;base64," + base64;
a.setAttribute("href", uploadHref);
let exportFileName = fileName;
a.setAttribute("download", exportFileName);
a.click();
},
handleNormalExport() {
let data = {
dingdingNum: vm.ruleForm.dingdingNumber,
dingdingDate: vm.ruleForm.dingdingDate,
dataSheetName: vm.ruleForm.sheet,
};
let callback = (res) => {
if (res.code == "000000") {
console.log("常规导出》》》》 ", res);
// 执行下载excel
vm.downloadFile(res.data.path, res.data.fileName);
vm.exportNormalModalVisible = false;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("post", `/sensitive/dataSearch/export/common`, data, callback);
},
checkChrome() {
// return (navigator.appVersion.indexOf('Chrome') || navigator.appVersion.indexOf('chrome')) != -1;
return this.getBroswer().broswer=='Chrome'
},
getBroswer() {
let sys = {};
let ua = navigator.userAgent.toLowerCase();
let s;
(s = ua.match(/edge\/([\d.]+)/)) ? sys.edge = s[1] :
(s = ua.match(/rv:([\d.]+)\) like gecko/)) ? sys.ie = s[1] :
(s = ua.match(/msie ([\d.]+)/)) ? sys.ie = s[1] :
(s = ua.match(/firefox\/([\d.]+)/)) ? sys.firefox = s[1] :
(s = ua.match(/chrome\/([\d.]+)/)) ? sys.chrome = s[1] :
(s = ua.match(/opera.([\d.]+)/)) ? sys.opera = s[1] :
(s = ua.match(/version\/([\d.]+).*safari/)) ? sys.safari = s[1] : 0;
if (sys.edge) return { broswer : "Edge", version : sys.edge };
if (sys.ie) return { broswer : "IE", version : sys.ie };
if (sys.firefox) return { broswer : "Firefox", version : sys.firefox };
if (sys.chrome) return { broswer : "Chrome", version : sys.chrome };
if (sys.opera) return { broswer : "Opera", version : sys.opera };
if (sys.safari) return { broswer : "Safari", version : sys.safari };
return { broswer : "", version : "0" };
},
down() {
window.location.href = 'http://www.google.cn/chrome/';
},
getUserList() {
// /dataSearch/searchUserDis
// 查询分发人员列表
let data = {
dingdingNum: vm.ruleForm.dingdingNumber,
dingdingDate: vm.ruleForm.dingdingDate,
dataSheetName: vm.ruleForm.sheet,
};
let callback = (res) => {
if (res.code == "000000") {
vm.peopleList = res.data;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"post",
`/sensitive/dataSearch/searchUserDis`,
data,
callback
);
},
submitForm(formName) {
vm.$refs[formName].validate((valid) => {
if (valid) {
let data = {
columnMap: {},
labelMap: {},
dingdingNum: vm.ruleForm.dingdingNumber,
dingdingDate: vm.ruleForm.dingdingDate,
dataSheetName: vm.ruleForm.sheet,
projectStateId: vm.ruleForm.labelStatus,
remark: vm.ruleForm.remark,
pageNo: vm.ruleForm.pageNo,
pageSize: vm.ruleForm.pageSize,
};
// 如果添加了筛选条件，则将其合并到 查询接口的传参中
let stringData = JSON.stringify(vm.conditionForm);
if (stringData != "{}") {
let condition = JSON.parse(stringData);
console.log("submitForm() : condition = " + condition);
for (let key in condition) {
console.log("submitForm() : key = " + key);
data.columnMap[key] = condition[key];
}
}
if (vm.dataProjectLabels.length > 0) {
for (let i = 0; i < vm.dataProjectLabels.length; i++) {
console.log(
"dataProjectLabels() : key = " +
vm.dataProjectLabels[i].labelCode +
", value = " +
vm.dataProjectContents[i]
);
data.labelMap[vm.dataProjectLabels[i].labelCode] =
vm.dataProjectContents[i];
}
}
let callback = (res) => {
if (res.code == "000000") {
vm.isSearchSend = true;
vm.tableDataList = res.data;
if (
typeof res.data.dataRole != "undefined" &&
res.data.dataRole == 1
) {
vm.showSendBtn = true;
}
if (
typeof res.data.dataExportCount != "undefined" &&
res.data.dataExportCount > 0
) {
vm.showExportBtn = true;
}
if (res.data.distributeRole == 2) {
vm.showNormalExportBtn = true;
}
vm.getLabelStatus();
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"post",
`/sensitive/dataSearch/search`,
data,
callback
);
} else {
console.log("error submit!!");
return false;
}
});
},
handleSizeChange(val) {
console.log("size change .......");
vm.ruleForm.pageSize = val;
vm.submitForm("ruleForm");
},
handleCurrentChange(val) {
console.log("currentPage change .......");
vm.ruleForm.pageNo = val;
vm.submitForm("ruleForm");
},
handleSelectionChange(val) {
vm.multipleSelection = val;
// debugger;
let firstColumn = vm.tableDataList.columnList[0].key || "column1";
let str = "";
let tempNameList = [];
vm.multipleSelection.map(function (value, index, arr) {
tempNameList.push(value[firstColumn]);
});
str = tempNameList.join("，");
vm.selectedNameList = str;
},
handleRemarkClick(row) {
vm.remarkDialogVisible = true;
vm.currentRow = row;
// 获取备注信息
let callback = (res) => {
if (res.code == "000000") {
vm.remarkHistory = res.data.remarks;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"get",
`/sensitive/dataRemark?dataContentId=${row.contentId}`,
{},
callback
);
},
handleSetLabelClick(row) {
vm.currentRow = row;
vm.setLabelVisible = true;
// 获取历史标签信息
let callback = (res) => {
if (res.code == "000000") {
vm.historyLabelList = res.data;
// console.log(
// "handleSetLabelClick() : vm.historyLabelList = " +
// vm.historyLabelList.menus.length
// );
if (vm.dataProjectLabels == null || vm.dataProjectLabels == "") {
vm.$message.info("未设置过标签")
}
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest(
"get",
`/sensitive/dataSearch/labels?dataContentId=${row.contentId}`,
{},
callback
);
},
dealSetLabelClick() {
let tmpList = [];
if (vm.dataProjectLabels && vm.dataProjectLabels.length > 0) {
for (let i = 0; i < vm.dataProjectLabels.length; i++) {
let obj = {
labelCode: vm.dataProjectLabels[i].labelCode,
labelValue: vm.setLabelList[i]
};
tmpList.push(obj);
}
} else {
vm.setLabelVisible = false;
return;
}
let data = {
contentId: vm.currentRow.contentId,
dataUserContentId: vm.currentRow.dataUserContentId,
list: tmpList,
projectMainId: 0,
};
let callback = (res) => {
if (res.code == "000000") {
// vm.peopleList = res.data;
this.$message({
type: "success",
message: "设置标签成功",
});
} else {
vm.$message.error(res.message);
}
vm.setLabelVisible = false;
};
vm.sendRequest("post", `/sensitive/dataSearch/labels`, data, callback);
},
handleTagClick(row) {
vm.currentRow = row;
this.tagVisible = true;
},
dealTagClick() {
let callback = (res) => {
if (res.code == "000000") {
this.$message({
type: "success",
message: "标记状态设置成功",
});
vm.submitForm("ruleForm");
} else {
vm.$message.error(res.message);
}
vm.tagVisible = false;
};
vm.sendRequest(
"get",
`/sensitive/dataSearch/changeStatus?dataUserContentId=${vm.currentRow.dataUserContentId}
&dataContentId=${vm.currentRow.contentId}&projectStateId=${vm.tagStatus}`,
{},
callback
);
},
handleLabelClick() {
this.labelVisible = false;
},
handleRemarkClose() {
vm.newRemark = "";
vm.remarkHistory = [];
},
handleConfirmSend() {
if (vm.dataUserDiss && vm.dataUserDiss.length == 0) {
vm.$message.error("请先勾选人员！");
return;
}
let selectListIds = [];
vm.multipleSelection.map(function (value, index, arr) {
selectListIds.push(value.contentId);
});
let data = {
dataUserDiss: vm.dataUserDiss,
dataCountIds: selectListIds,
dataInfoId: vm.tableDataList.dataInfoId,
};
let callback = (res) => {
if (res.code == "000000") {
vm.sendDialogVisible = false;
} else {
vm.$message.error(res.message);
}
};
vm.sendRequest("post", `/sensitive/dataSearch/postUser`, data, callback);
},
handleAddConditionConfirm() {
vm.addConditioDialogVisible = false;
vm.ruleForm.pageNo = 1;
},
},
};
</script>
<style lang="less">
.data-view-wrap {
// 处理input type = number的上下箭头
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
input[type="number"] {
-moz-appearance: textfield;
}
user-select: none;
ul,
li {
list-style: none;
}
.top-title {
color: #333333;
}
.search-ruleForm {
margin-top: 20px;
.input {
width: 215px;
}
.add-icon {
font-size: 40px;
font-weight: 700;
color: #606266;
vertical-align: middle;
margin-left: 10px;
&:hover {
cursor: pointer;
}
}
}
.condition-dialog-wrap {
.el-form-item__label {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.remark-modal {
.el-dialog__body {
overflow: hidden;
.remark-confirm-btn {
float: right;
margin-top: 10px;
}
.history-list {
margin-top: 60px;
li {
margin-bottom: 5px;
line-height: 20px;
.text {
line-height: 22px;
text-indent: 12px;
word-break: break-all;
}
}
}
}
}
.send-modal-box {
.people-choose {
margin-top: 30px;
.title {
display: inline-block;
}
.people-select-comp {
margin-left: 20px;
}
}
.name-list {
width: 450px;
height: 24px;
line-height: 24px;
.name {
max-width: 385px;
float: left;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.after-text {
float: left;
display: block;
width: 55px;
margin-left: 5px;
}
}
}
.no-table-data {
width: 100%;
height: 400px;
line-height: 400px;
text-align: center;
color: #606266;
font-size: 14px;
}
.pagination-style {
margin-top: 30px;
float: right;
}
.tebale_card {
background: rgba(255, 255, 255, 0.2);
}
.el-table,
.el-table__expanded-cell {
background: rgba(255, 255, 255, 0.2);
}
.el-table {
.el-table__fixed-right {
background: #fff;
}
}
.same-line-class {
margin-top: 20px;
display: inline-block;
}
.href-link {
color: red;
}
}
</style>
\ No newline at end of file
src/views/strategy-data/strategy-edit.vue 0 → 100644
浏览文件 @ efe087b8
<template>
<div class="startegy-edit-container">
<el-row :gutter="30" class="row edit" type="flex" style="margin-bottom:0;">
<el-form ref="form" :model="searchParam" label-suffix=":" style="width:100%;">
<el-col :span="24">
<el-form-item label="策略名称" required>
<el-input v-model="searchParam.name" maxlength="20" placeholder="请输入策略名称" style="width:30%;"></el-input>
</el-form-item>
<el-form-item label="策略分类" required>
<el-select v-model="searchParam.bizTypeId" @change="changeStrategy" style="width:30%;" placeholder="请选择策略分类">
<el-option
v-for="item in strategyData"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="选择策略" required>
<el-select v-model="searchParam.libraryId" @change="changeSelectStrategy" style="width:30%;" placeholder="请选择策略">
<el-option
v-for="item in strategySelect"
:key="item.libraryId"
:label="item.name"
:value="item.libraryId"
></el-option>
</el-select>
</el-form-item>
<div class="strategy-param-con">
<p>注：对于一个对象，只会击中下列策略中一个版本，一旦击中，后续顺位上的版本不再执行</p>
<div class="version-con" v-for="(itemV, indexV) in versionArray" :key="indexV">
<p>版本{{indexV + 1}}：</p>
<div class="params-con" v-for="(item,index) in itemV.paramArray" :key="index">
<span>参数{{index+1}}：</span>
<el-input
class="param-input"
v-model="item.params"
placeholder="请输入参数"></el-input>
</div>
<span style="padding-left: 20px;">击中分值：</span>
<el-input class="score-input" v-model="itemV.score" maxlength="20" placeholder="请输入击中分值"></el-input>
<i v-if="indexV > 0" class="el-icon-remove-outline delete-step" @click="deleteSteps(indexV)"></i>
<i class="el-icon-circle-plus-outline add-step" @click="addSteps"></i>
</div>
</div>
<el-form-item label="策略定义">
<div>{{paramsStyleText}}<span v-if="versionArray.length == 2">，</span></div>
<div v-if="versionArray.length == 2" style="margin-left: 70px;">{{paramsStyleText1}}<span v-if="versionArray.length == 3">，</span></div>
<div v-if="versionArray.length == 3" style="margin-left: 70px;">{{paramsStyleText1}}</div>
</el-form-item>
</el-col>
</el-form>
</el-row>
<el-button type="primary" @click="save">保存</el-button>
</div>
</template>
<script>
import { getData } from "../../common";
export default {
data() {
return {
strategyId: '',
searchParam: {
bizTypeId: ''
},
strategyData: [],
strategySelect: [],
versionArray: [{
params: '',
score: 0
}],
paramArray: [],
paramsStyleText: '',
paramsStyleText1: '',
paramsStyleText2: ''
}
},
created() {
this.strategyId = this.$route.query.id;
},
mounted() {
this.getCategyData();
if(this.strategyId) this.getStrategyDetail();
},
methods: {
// 删除版本
deleteSteps(i) {
this.versionArray.splice(i,1);
},
// 增加版本
addSteps() {
let arr = [];
this.versionArray.push({
score: ''
})
if(this.versionArray[0].paramArray) {
for(let i = 0; i < this.versionArray[0].paramArray.length; i++) {
arr.push({
params: ''
})
}
this.$set(this.versionArray[this.versionArray.length - 1], 'paramArray', arr);
}
},
// 获取策略下拉数据
getCategyData() {
getData(this,
"get", `/riskcontrol/strategy/listBizType`, {},
data => {
this.strategyData = data.data;
}
);
},
// 获取策略详情
getStrategyDetail() {
getData(this,
"get", `/riskcontrol/strategy/detail?id=${this.strategyId}`, {},
data => {
this.searchParam = data.data;
this.changeStrategy(this.searchParam.bizTypeId);
this.versionArray = this.searchParam.versionParamList;
for(let i = 0; i < this.versionArray.length; i++) {
let arr = [], parr = [];
if(this.versionArray[i].params) {
arr = this.versionArray[i].params.split(",");
arr.forEach(el => {
parr.push({
params: el
})
})
this.$set(this.versionArray[i], 'paramArray', parr);
}
// 处理策略定义中的参数
if(i == 0) {
this.paramsStyleText = this.showParamStyle(this.paramsStyleText, arr);
}else if(i == 1) {
this.paramsStyleText1 = this.showParamStyle(this.paramsStyleText1, arr);
}else if(i == 2) {
this.paramsStyleText2 = this.showParamStyle(this.paramsStyleText2, arr);
}
}
}
);
},
showParamStyle(t, arr) {
if(arr.length == 1) {
t = this.searchParam.paramsStyle.replace('{param1}',arr[0]);
}else if(arr.length == 2) {
t = this.searchParam.paramsStyle.replace('{param1}',arr[0]);
t = t.replace('{param2}',arr[1]);
}else if(arr.length == 3) {
t = this.searchParam.paramsStyle.replace('{param1}',arr[0]);
t = t.replace('{param2}',arr[1]);
t = t.replace('{param3}',arr[2]);
}
return t
},
// 修改策略分类
changeStrategy(val) {
getData(this,
"get", `/riskcontrol/strategy/listStrategyLibrary?bizTypeId=${val}`, {},
data => {
this.strategySelect = data.data;
}
);
},
// 修改选择策略
changeSelectStrategy(val) {
let arr = [];
this.versionArray = [{
score: 0
}];
this.strategySelect.forEach(element => {
if(val == element.libraryId) {
this.searchParam.paramsStyle = element.paramsStyle;
this.paramsStyleText = this.searchParam.paramsStyle;
if(element.params) {
for(let i = 0; i < element.params; i++) {
arr.push({
params: ''
})
}
this.$set(this.versionArray[0], 'paramArray', arr)
}
}
});
},
// 保存
save() {
this.searchParam.versionParamList = [];
for(let i = 0; i < this.versionArray.length; i++) {
let arr = [];
if(this.versionArray[i].paramArray) {
this.versionArray[i].paramArray.forEach(el => {
arr.push(el.params);
})
}
this.searchParam.versionParamList.push({
params: arr.join(","),
score: this.versionArray[i].score
})
}
if(this.strategyId) this.searchParam.id = this.strategyId;
let req = this.searchParam;
if(!req.name) {
this.$message.info("请输入策略名称");
return;
}
if(!req.bizTypeId) {
this.$message.info("请选择策略分类");
return;
}
if(!req.libraryId) {
this.$message.info("请选择策略");
return;
}
for(let i = 0; i < this.versionArray.length; i++) {
if(this.versionArray[i].paramArray && this.versionArray[i].paramArray.length > 0) {
for(let j = 0; j < this.versionArray[i].paramArray.length; j++) {
if(!this.versionArray[i].paramArray[j].params) {
this.$message.info(`请输入版本${i + 1}的参数${j +1}`);
return;
}
}
}
if(!this.versionArray[i].score) {
this.$message.info(`请输入版本${i + 1}的分值`);
return;
}
}
getData(this,
"post", `/riskcontrol/strategy/save`, req,
data => {
if(data.code == '000000') {
this.$router.push('strategy-list');
}
}
);
}
}
}
</script>
<style lang="less" scoped>
.startegy-edit-container {
.strategy-param-con {
padding: 20px 40px;
.version-con {
margin: 20px 0;
}
p, span {
display: inline-block;
font-size: 12px;
}
.params-con {
display: inline-block;
padding-left: 20px;
}
.param-input {
display: inline-block;
width: 60%;
}
.score-input {
display: inline-block;
width: 20%;
}
}
}
</style>
\ No newline at end of file
src/views/strategy-data/strategy-list.vue 0 → 100644
浏览文件 @ efe087b8
<template>
<div class="strategy-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-select
v-model="searchParam.bizTypeId"
size="small"
placeholder="请选择策略分类"
clearable
style="margin-left: 20px"
>
<el-option
v-for="item in strategyData"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</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="addStrategy">新增策略</el-button>
</el-col>
</el-form>
</el-row>
<el-table
class="search-table"
:data="tableData"
style="width: 100%">
<el-table-column prop="name" label="策略名称" min-width="140" align="center"></el-table-column>
<el-table-column prop="bizTypeName" label="策略分类" min-width="140" align="center"></el-table-column>
<el-table-column prop="paramsStyle" label="策略定义" min-width="150" align="center"></el-table-column>
<el-table-column prop="score" label="击中分值" min-width="150" align="center"></el-table-column>
<el-table-column prop="type" label="策略状态" min-width="150" align="center">
<template slot-scope="scope">
<span>{{scope.row.publishFlag | statusFilter}}</span>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button v-if="scope.row.publishFlag == 1" :disabled="scope.row.type == 1 || scope.row.type == 2" type="primary" size="small" @click="actived(scope.row)">激活</el-button>
<el-button v-if="scope.row.publishFlag == 2" :disabled="scope.row.type == 1 || scope.row.type == 2" type="danger" size="small" @click="downLine(scope.row)">下线</el-button>
<el-button :disabled="scope.row.type == 1 || scope.row.type == 2" type="primary" size="small" @click="reviewData(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="downDialogVisible"
width="30%"
center>
<span>一旦下线后，后续该业务分类订单将不执行本策略检查，请记得同步完成风险定级变更</span>
<span slot="footer" class="dialog-footer">
<el-button @click="downDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmDown">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { getData } from "../../common";
export default {
data() {
return {
downDialogVisible: false,
searchParam: {
bizTypeId: '',
pageNo: 1,
pageSize: 15
},
totalRows: 0,
tableData: [],
strategyData: [],
downLineId: '',
downLineFlag: 0
}
},
mounted() {
this.getCategyData();
this.search();
},
filters: {
statusFilter: function statusFilter(value) {
if (!value) return '';
let hash = {
1: '未激活',
2: '已激活',
};
return hash[value];
}
},
methods: {
search(param) {
if(param) this.searchParam.pageNo = 1;
getData(this,
"get", `/riskcontrol/strategy/list?bizTypeId=${this.searchParam.bizTypeId}&pageNo=${this.searchParam.pageNo}&pageSize=${this.searchParam.pageSize}`, {},
data => {
this.tableData = data.data.data;
this.totalRows = data.data.totalRows;
}
);
},
// 获取策略下拉数据
getCategyData() {
getData(this,
"get", `/riskcontrol/strategy/listBizType`, {},
data => {
this.strategyData = data.data;
}
);
},
// 新增策略
addStrategy() {
this.$router.push({ path: 'strategy-edit' })
},
// 激活
actived(row) {
let req = {
id: row.id,
publishFlag: 2 // 1 下线 2 激活
}
getData(this,
"post", `/riskcontrol/strategy/deploy`, req,
data => {
if(data.code == '000000') {
this.search();
}
}
);
},
// 下线
downLine(row) {
this.downDialogVisible = true;
this.downLineId = row.id;
},
confirmDown() {
let req = {
id: this.downLineId,
publishFlag: 1 // 1 下线 2 激活
}
getData(this,
"post", `/riskcontrol/strategy/deploy`, req,
data => {
if(data.code == '000000') {
this.downDialogVisible = false;
this.search();
}
}
);
},
// 编辑
reviewData(row) {
this.$router.push({ path: 'strategy-edit', query: {id: row.id} })
},
handleSizeChange(value) {
this.searchParam.pageSize = value;
this.search();
},
handleCurrentChange(value) {
this.searchParam.pageNo = value;
this.search();
}
}
}
</script>
<style lang="less" scoped>
</style>
\ No newline at end of file
src/views/user-path/add-funnel.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="add-funnel-container">
<el-breadcrumb separator="/" class="add-title">
<el-breadcrumb-item :to="{ path: '/user-path' }">漏斗分析</el-breadcrumb-item>
<el-breadcrumb-item>新增转化漏斗</el-breadcrumb-item>
</el-breadcrumb>
<div class="add-content">
<div class="con">
<el-row :gutter="30" class="row save" 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
:class="{'red-b': disabledSave}"
v-model="searchParam.name"
maxlength="30"
placeholder="请输入漏斗名称"
style="width:430px;"
@blur="validValue"></el-input>
<span v-show="disabledSave" style="color: red; font-size: 12px;">{{nameTip}}</span>
</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="saveAddAndEdit">保存</el-button>
</el-col>
</el-form>
</el-row>
<div class="add-step">
<p>请以用户逐步触发的事件为依据，构造漏斗、系统会自动计算整个过程的转化率。如果事件之间不连续，转化率为0！</p>
</div>
<div class="step-content" v-for="(item,index) in searchParam.actionModelList" :key="index">
<span class="st">步骤{{index + 1}}</span>
<el-form
ref="form"
class="step-form"
:model="item"
label-suffix=":"
style="width:100%;">
<el-col :span="11">
<el-form-item label="步骤名称">
<el-input
:class="{'red-b': item.nameCheck && item.actionName}"
v-model="item.actionName"
@input="nameChange(item, index)"
maxlength="30"
placeholder="请输入步骤名称"
style="width:70%"></el-input>
<p v-show="item.nameCheck && !item.actionName" style="color: red; font-size: 12px;">名称重复，请重新输入</p>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="触发事件">
<el-input
v-show="!showEvent"
:class="{'red-b': item.unchecked}"
@focus="getEventData"
v-model="item.eventName"
style="width:75%;"
:title="item.eventName"
placeholder="请选择用户触发事件"></el-input>
<el-select
v-show="showEvent"
v-model="item.eventId"
filterable
placeholder="请选择用户触发事件"
:class="{'red-b': item.unchecked}"
@blur="selectValid(item, index)"
@change="eventChange(item, index)"
style="width:75%;"
>
<el-option
v-for="(eItem,eIndex) in eventSelect"
:key="eIndex"
:label="eItem.eventName"
:value="eItem.eventId"
>
</el-option>
</el-select>
<p v-show="item.unchecked" style="color: red; font-size: 12px;">请选择一个触发事件</p>
<p v-show="item.repChecked" style="color: red; font-size: 12px;">触发事件重复，请重新选择</p>
</el-form-item>
</el-col>
</el-form>
<i v-if="index == 0" class="el-icon-remove-outline disable-step"></i>
<i v-if="index > 0" class="el-icon-remove-outline delete-step" @click="deleteSteps(index)"></i>
<i class="el-icon-circle-plus-outline add-step" @click="addSteps"></i>
</div>
</div>
</div>
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../common/utils";
export default {
data() {
return {
showEvent: false, // 编辑回显时不显示触发事件下拉数据
disabledSave: false,
funnelId: '',
searchParam: {
name: '',
actionModelList: [
{
actionName: '',
eventId: ''
}]
},
eventSelect: [],
tipText: '名称重复，请重新输入',
nameTip: '请输入漏斗名称',
repIndex: 0,
flag: false
}
},
created() {
this.funnelId = this.$route.query.id;
},
mounted() {
if(this.funnelId) { // 编辑
this.getFunnelDetail();
}else { // 新增
this.getEventList();
}
},
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 if(data.code == '227002' || data.code == '227003'){
this.disabledSave = true;
this.nameTip = '名称重复，请重新输入';
}
})
},
// 获取触发事件列表
getEventList(item) {
this.getData(
"get", `/session/funnel/eventList`, {},
res => {
this.eventSelect = res.data;
}
);
},
getEventData() {
this.showEvent = true;
this.getEventList();
},
// 编辑获取漏斗详情
getFunnelDetail() {
this.getData(
"get", `/session/funnel/detail/${this.funnelId}`, {},
res => {
if(res.code == '000000') {
this.searchParam = res.data;
}
}
);
},
// 漏斗名称是否有值判断
validValue() {
if(this.searchParam.name) {
this.disabledSave = false;
}
},
// 步骤名称不重复
nameChange(item, index) {
this.$set(this.searchParam.actionModelList[index], 'nameCheck', false);
if(!item.actionName) return;
for(let i = 0; i < this.searchParam.actionModelList.length; i++) {
if(i == index) continue;
if(item.actionName == this.searchParam.actionModelList[i].actionName) {
setTimeout(() => {
this.searchParam.actionModelList[index].actionName = '';
this.$set(this.searchParam.actionModelList[index], 'nameCheck', true);
},500)
}
}
},
// 触发事件选择时重复判断
eventChange(item, index) {
this.$set(this.searchParam.actionModelList[index], 'repChecked', false);
for(let i = 0; i < this.searchParam.actionModelList.length; i++) {
if(index != i) {
if(item.eventId == this.searchParam.actionModelList[i].eventId) {
this.$set(this.searchParam.actionModelList[index], 'repChecked', true);
this.searchParam.actionModelList[index].eventId = '';
}
}
}
},
// 触发事件是否为空样式
selectValid(item, index) {
this.$set(this.searchParam.actionModelList[index], 'unchecked', false);
// if(!item.eventId) return;
// for(let i = 0; i < this.searchParam.actionModelList.length; i++) {
// this.$set(this.searchParam.actionModelList[i], 'repChecked', false);
// if(index != i) {
// if(item.eventId == this.searchParam.actionModelList[i].eventId) {
// this.searchParam.actionModelList[index].eventId = '';
// this.$set(this.searchParam.actionModelList[index], 'repChecked', true);
// }
// }
// }
},
// 保存
saveAddAndEdit() {
if(!this.searchParam.name) {
this.disabledSave = true;
this.nameTip = '请输入漏斗名称';
return;
}
for(let i = 0; i < this.searchParam.actionModelList.length; i++) {
if(!this.searchParam.actionModelList[i].eventId) {
this.$set(this.searchParam.actionModelList[i], 'unchecked', true); // 事件名称为空
this.$set(this.searchParam.actionModelList[i], 'repChecked', false); //事件重复
return;
}
if((this.searchParam.actionModelList[i].nameCheck && this.searchParam.actionModelList[i].actionName) || this.searchParam.actionModelList[i].unchecked || this.searchParam.actionModelList[i].repChecked) { // 有步骤名称重复
return;
}
this.eventSelect.forEach(item => {
if(this.searchParam.actionModelList[i].eventId == item.eventId) {
this.$set(this.searchParam.actionModelList[i], 'eventName', item.eventName);
}
});
}
let req = this.searchParam;
for(let i = 0; i < req.actionModelList.length; i++) {
if(!req.actionModelList[i].actionName) {
req.actionModelList[i].actionName = req.actionModelList[i].eventName;
req.actionModelList[i].nameCheck = false;
}
}
this.getData(
"post", `/session/funnel/save`, req,
res => {
if(res.code == '000000') {
this.$message.success('转化漏斗保存成功');
this.$router.push({ path: 'path-data', query: {id: res.data.id, name: res.data.name} });
}
}
);
},
// 删除步骤
deleteSteps(i) {
this.$message.success('删除成功');
this.searchParam.actionModelList.splice(i,1);
},
// 增加步骤
addSteps() {
this.searchParam.actionModelList.push({
actionName: '',
eventId: ''
});
}
}
}
</script>
<style lang="less" scoped>
.add-funnel-container {
margin: -20px -40px;
.red-b {
border: 1px solid red;
}
.add-title {
height: 60px;
line-height: 60px;
padding-left: 40px;
}
.add-content {
background: #F2F2F4;
padding: 20px 0 20px 20px;
min-height: 83vh;
.con {
padding-bottom: 30px;
background: #fff;
min-height: 80vh;
.save {
padding: 20px 20px 0;
margin: 0 !important;
border-bottom: 1px solid #EDEDEE;
}
.add-step {
padding: 30px 40px 0;
font-size: 14px;
color: #4D4C4F;
}
.step-content {
overflow: hidden;
margin: 30px 40px 0px;
border: 1px solid #EDEDEE;
span.st {
float: left;
font-size: 14px;
color: #58ADE8;
padding: 5px;
margin: 20px 20px 0 20px;
border: 1px solid #58ADE8;
border-radius: 3px;
}
.step-form {
width: 80% !important;
padding: 15px 0 0 30px;
}
i {
padding: 10px 20px;
font-size: 20px;
}
.disable-step {
color: #D2D2D3;
}
.delete-step {
color: #58ADE8;
}
.add-step {
color: #58ADE8;
}
}
}
}
}
</style>
\ No newline at end of file
src/views/user-path/funnel-data.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="data-container">
<el-breadcrumb separator="/" class="data-title">
<el-breadcrumb-item :to="{ path: '/user-path' }">漏斗分析</el-breadcrumb-item>
<el-breadcrumb-item>{{name}}详情</el-breadcrumb-item>
</el-breadcrumb>
<div class="data-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="12">
<el-form-item label="时间" required>
<el-date-picker
type="date"
placeholder="开始时间"
v-model="searchParam.startDate"
style="width: 200px;"
:picker-options="endDateOpt"
value-format="yyyy-MM-dd"
>
</el-date-picker>
<span>-</span>
<el-date-picker
type="date"
placeholder="结束时间"
v-model="searchParam.endDate"
style="width: 200px;"
:picker-options="endDateOpt1"
value-format="yyyy-MM-dd"
>
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="版本">
<el-select v-model="searchParam.version" placeholder="请选择版本" style="width:200px">
<el-option
v-for="(eItem,eIndex) in versionSelect"
:key="eIndex"
:label="eItem"
:value="eItem">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="default" size="small" @click="reset">重置</el-button>
<el-button type="primary" size="small" @click="getAnalysisData(searchParam)">筛选</el-button>
</el-col>
</el-form>
</el-row>
<div class="data-num">
<div class="num-text first-num">
<span>总人数</span>
<p>{{funnelData.userCountTotal}}<span>人</span></p>
</div>
<div class="num-text">
<span>总转化率</span>
<p>{{funnelData.inversionRateTotal}}</p>
</div>
<div class="num-text">
<span>达成目标人数</span>
<p>{{funnelData.userCountLast}}<span>人</span></p>
</div>
<div class="num-text num">
<span>转化率最低步骤</span>
<p>{{funnelData.funnelNameLast}}</p>
</div>
</div>
<div class="data-analysis">
<div class="map-title">转化漏斗详情</div>
<div ref="chart" class="echart"></div>
<el-table
class="data-table"
:data="funnelData.funnelReportModels"
style="width: 100%">
<el-table-column prop="funnel" label="步骤" min-width="140" align="center"></el-table-column>
<el-table-column prop="funnelName" label="步骤名称" min-width="140" align="center"></el-table-column>
<el-table-column prop="userCount" label="用户数" min-width="150" align="center"></el-table-column>
<el-table-column prop="inversionRate" label="较上一步转化率" min-width="150" align="center"></el-table-column>
<el-table-column prop="inversionRateTotal" label="总转化率" min-width="150" align="center"></el-table-column>
</el-table>
</div>
</div>
</div>
</div>
</template>
<script>
let url = 'image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAARCAMAAACLgl7OAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAaVBMVEUAAADBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcEAAAD45xibAAAAInRSTlMAmT6WJYwSfBMGZAFHmEgtkBeCCW0KAlI1k5QeiA10A1tc7ah1owAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAB7SURBVCjPtZDZDoAgDAQXvA+8bwX1/3/SGKIBEd+cx07TdgtIiAF0/mygDvnAoYDr2b3nnjP8wOaDUG6J4ncfR9cdScpMzbJECZEXT1/kesyy0n1VPv6AulF908Kg6+9DWN/hjWGUfhpgYV5Ov8ywwgUhguODddtXvXIAjuUEs/70/t4AAAAldEVYdGRhdGU6Y3JlYXRlADIwMTktMTItMTZUMTU6MzM6MDkrMDg6MDCzL2BEAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDE5LTEyLTE2VDE1OjMzOjA5KzA4OjAwwnLY+AAAAABJRU5ErkJggg==';
import { openLoading, closeLoading } from "../../common/utils";
export default {
data() {
return {
funnelId: '',
name: '',
searchParam: {
endDate: '',
startDate: '',
version: ''
},
versionSelect: [], // 版本下拉数据
funnelData: {},
endDateOpt: {
disabledData: (time) => {
if ( this.searchParam.endDate != "" && this.searchParam.endDate != null) {
return (
time.getTime() > new Date(this.searchParam.endDate).getTime()
);
}
}
},
endDateOpt1: {
disabledDate: time => {
return (
time.getTime() < (new Date(this.searchParam.startDate).getTime() - 3600 * 1000 * 24 * 1) || time.getTime() > (new Date(this.searchParam.startDate).getTime() + 3600 * 1000 * 24 * 29)
);
}
},
beginTime: '',
endTime: ''
}
},
created() {
this.funnelId = this.$route.query.id;
this.name = this.$route.query.name;
},
mounted() {
//this.searchParam.endDate = new Date().format("yyyy-MM-dd");
let date1 = new Date();
let date2 = new Date(date1);
let date3 = new Date(date1);
date2.setDate(date1.getDate() - 7);
date3.setDate(date1.getDate() - 1);
let dt = date2.getDate() > 10 ? date2.getDate() : '0' + date2.getDate();
let dt1 = date3.getDate() > 10 ? date3.getDate() : '0' + date3.getDate();
this.searchParam.startDate = date2.getFullYear() + "-" + (date2.getMonth() + 1) + "-" + dt;
this.searchParam.endDate = date3.getFullYear() + "-" + (date3.getMonth() + 1) + "-" + dt1;
this.beginTime = date2.getFullYear() + "-" + (date2.getMonth() + 1) + "-" + dt;
this.endTime = date3.getFullYear() + "-" + (date3.getMonth() + 1) + "-" + dt1;
this.getVersionData();
},
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);
}
})
},
// 获取版本号数据
getVersionData() {
this.getData(
"get", `/session/funnel/version/list`, {},
res => {
if(res.code == '000000') {
this.versionSelect = res.data;
this.searchParam.version = this.versionSelect[0];
this.getAnalysisData(this.searchParam);
}
}
);
},
// 获取漏斗分析数据
getAnalysisData(req) {
if(!req.startDate || !req.endDate) {
this.$message.info('请选择时间');
return;
}
this.getData(
"get", `/session/funnel/report?endDate=${req.endDate}&funnelId=${this.funnelId}&startDate=${req.startDate}&version=${req.version}`, {},
res => {
if(res.code == '000000') {
this.funnelData = res.data;
this.initCharts();
//this.initEchart();
}
}
);
},
// 初始化图标--漏斗图
initCharts() {
let lineargroup = this.funnelData.funnelReportModels;
let len = lineargroup.length;
let colorObj = {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: '#1cd389' // 0% 处的颜色
}, {
offset: 1,
color: '#668eff' // 100% 处的颜色
}],
global: false // 缺省为 false
};
let myChart = {}, data1 = [], dataArr = [], valueArr = [], lineArr = [], linksArr = [], arrowTop = 0, arrowH = 0, lineTop = 0, lineLeft = 0, lineHeight = 0, blackH;
if(len == 2) {
blackH = 300;
arrowTop = 105;
arrowH = 130;
lineTop = 50;
lineLeft = '4%';
lineHeight = 306;
}else if(len == 3) {
blackH = 300;
arrowTop = 115;
arrowH = 130;
lineTop = 30;
lineLeft = '30%';
lineHeight = 306;
}else if(len == 4) {
blackH = 300;
arrowTop = 88;
arrowH = 210;
lineTop = 30;
lineLeft = '45%';
lineHeight = 306;
}else if(len == 5) {
blackH = 300;
arrowTop = 70;
arrowH = 260;
lineTop = 20;
lineLeft = '42%';
lineHeight = 346;
}else if(len == 6) {
blackH = 300;
arrowTop = 60;
arrowH = 300;
lineTop = 20;
lineLeft = '40%';
lineHeight = 366;
}else if(len == 7) {
blackH = 360;
arrowTop = 60;
arrowH = 390;
lineTop = 20;
lineLeft = '35%';
lineHeight = 456;
}else {
blackH = 340;
arrowTop = 50;
arrowH = 400;
lineTop = 10;
lineLeft = '35%';
lineHeight = 466;
}
for (let i = 0; i < lineargroup.length; i++) {
let obj1 = {
value: 200 - i * 40,
num: lineargroup[i].userCount,
name: lineargroup[i].funnelName
};
data1.push(obj1);
if(i != (lineargroup.length - 1)) {
dataArr.push('转化率');
valueArr.push({value: '100'}); // 步骤箭头
linksArr.push({ // 转化率线
source: lineargroup[i].funnelName,
target: lineargroup[i + 1].funnelName,
value: lineargroup[i + 1].inversionRate,
lineStyle: {
normal: {
curveness: parseInt(len - i) + 4,
color: colorObj
}
}
})
}
lineArr.push({
name: lineargroup[i].funnelName,
x: 400,
y: 0 + i*15
});
}
let option = {
backgroundColor: '#ffffff',
grid: {
top: arrowTop, // 箭头距离顶部高度 3-115 4-
left: "-44%",
right: 20,
height: arrowH, // 箭头之间的距离 3-145 4-
bottom: '0'
},
xAxis: {
show: false
},
yAxis: [{
show: false,
boundaryGap: false,
type: "category",
data: dataArr
}],
series: [{ // 内容块
top: 0,
type: 'funnel',
height: blackH + len * 20, // 块高度
gap: 40, // 块间距
minSize: 300, // 块两边斜度
left: '5%', // 块左边距离
width: '45%', // 块宽度
label: {
show: true,
position: 'inside',
fontSize: '14',
formatter: function(d) {
var newParamsName = "";
var paramsNameNumber = d.name.length;
var provideNumber = 30; //一行显示几个字
var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
if (paramsNameNumber > provideNumber) {
for (var p = 0; p < rowNumber; p++) {
var tempStr = "";
var start = p * provideNumber;
var end = start + provideNumber;
if (p == rowNumber - 1) {
tempStr = d.name.substring(start, paramsNameNumber);
} else {
tempStr = d.name.substring(start, end) + "\n";
}
newParamsName += tempStr;
}
} else {
newParamsName = d.name;
}
return newParamsName + '{aa|}\n' + d.data.num
},
rich: {
aa: {
padding: [8, 0, 6, 0]
}
}
},
data: data1
},
{
type: 'pictorialBar', // 步骤箭头
name: '',
symbolSize: ['32', '17'],
symbolPosition: 'center',
symbol: url,
animation: true,
symbolClip: true,
z: 10,
data: valueArr
},
{ // 转化率线
z: 1,
top: lineTop,
left: lineLeft,
height: lineHeight,
type: 'graph',
layout: 'none',
symbolSize: 0,
roam: false,
edgeSymbol: ['circle', 'arrow'],
lineStyle: {
normal: {
width: 4,
}
},
edgeLabel: { // 转化率数字
normal: {
show: true,
rotate: 90,
position: 'middle',
borderRadius: 4,
color: '#333',
verticalAlign: 'middle',
fontSize: 14,
legendHoverLink: true,
padding: [30, 20, 5, 10],
formatter: function(d) {
if (d.value) {
var ins = '{img1|} ' + '{words|' + d.value + '}';
return ins;
}
},
rich: {
img1: {
width: 18,
height: 16
},
words: {
color: '#333',
position: 'right',
fontSize: 14,
lineHeight: 20,
padding: [0, 0, 5, 0],
}
}
}
},
data: lineArr,
links: linksArr
}
]
};
myChart = this.$echarts.init(this.$refs.chart);
myChart.setOption(option);
},
// 初始化图--柱状图
initEchart() {
let dataX = [], dataY = [];
let lineargroup = this.funnelData.funnelReportModels;
for(let i = 0; i < lineargroup.length; i++) {
dataX.push(lineargroup[i].funnelName);
dataY.push(lineargroup[i].inversionRate);
}
let option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
}
},
xAxis: [
{
type: 'category',
data: dataX,
axisPointer: {
type: 'shadow'
}
}
],
yAxis: [
{
type: 'value',
name: '',
min: 0,
max: 100,
interval: 25,
axisLabel: {
formatter: '{value} %'
}
}
],
series: [
{
type: 'bar',
barWidth: 30,
data: [80,60,20], // dataY
itemStyle: {
normal: {
label: {
show: true, //开启显示
position: 'top', //在上方显示
textStyle: { //数值样式
color: 'black',
fontSize: 16
}
},
color: function(params) {
return '#58ADE8'
}
}
}
},
{
name:'折线',
type:'line',
itemStyle : { /*设置折线颜色*/
normal : {
color:'#58ADE8'
}
},
data: [80,60,20] // dataY
}
]
};
let myChart = this.$echarts.init(this.$refs.chart);
myChart.setOption(option);
},
reset() {
this.searchParam = {
endDate: this.endTime,
startDate: this.beginTime,
version: this.versionSelect[0]
};
this.getAnalysisData(this.searchParam);
}
}
}
</script>
<style lang="less" scoped>
.data-container {
margin: -20px -40px;
.data-title {
height: 60px;
line-height: 60px;
padding-left: 40px;
}
.data-content {
background: #F2F2F4;
padding: 20px 0 20px 20px;
.con {
background: #fff;
padding-bottom: 50px;
.search {
padding: 20px 20px 0;
margin: 0 !important;
border-bottom: 1px solid #EDEDEE;
}
.data-num {
display: flex;
padding: 20px 20px 0 30px;
.num-text {
width: 15%;
border-right: 1px solid #EDEDEE;
text-align: center;
span {
font-size: 12px;
color: #b2b2b3;
}
p {
padding-top: 8px;
}
}
.first-num {
width: 10%;
text-align: left;
}
.num {
width: 20%;
border: none;
}
}
.data-analysis {
// overflow: hidden;
margin: 20px 20px 0 30px;
padding: 0px 20px 30px;
border: 1px solid #EDEDEE;
box-shadow: 5px 0px 30px #EDEDEE;
.map-title {
height: 60px;
line-height: 60px;
border-bottom: 1px solid #EDEDEE;
}
.echart {
padding-top: 20px;
width: 100%;
min-height: 550px;
}
.data-table {
margin-top: 20px;
}
}
}
}
}
</style>
\ No newline at end of file
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
src/views/will-delete/layoutConst.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="layout-const-wrap">
<el-collapse v-model="activeNames" @change="handleChange">
<el-collapse-item name="1">
<template slot="title">
查询条件<span style="float:right;">{{collapseFlag}}</span>
</template>
<el-row :gutter="30" class="row" type="flex" style="margin-bottom:0;">
<el-form ref="form" :model="searchParam" label-suffix=":" label-width="130px" style="width:100%;">
<el-col :span="10">
<el-form-item label="楼层code">
<el-input v-model="searchParam.floorCode" placeholder="请输入楼层code" style="width:288px;"></el-input>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="楼层名称">
<el-input v-model="searchParam.floorName" 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">查询</el-button>
<el-button type="default" size="small" @click="reset" style="margin-left:0;">重置</el-button>
</el-col>
</el-form>
</el-row>
</el-collapse-item>
</el-collapse>
<el-row :gutter="10" class="row create-button" style="margin-right:0;">
<el-button type="primary" size="small" @click="create">新建楼层常量</el-button>
</el-row>
<!-- 表格 -->
<el-table
:data="tableData"
style="width: 100%">
<el-table-column prop="seqNo" label="楼层常量排序" min-width="150" align="center"></el-table-column>
<el-table-column prop="floorCode" label="楼层code" min-width="140" align="center"></el-table-column>
<el-table-column label="楼层名称" prop="floorName" min-width="200" align="center"></el-table-column>
<el-table-column prop="floorDesc" label="楼层描述" min-width="200" 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="editColumn(scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="deleteLayout(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="img-edit" :title="dialogTitle" :visible.sync="createActivityVisible" :close-on-click-modal="false">
<el-form ref="form" :model="contentTemplate" label-suffix=":" :rules="rules" label-width="130px" style="width:100%;">
<el-form-item label="楼层code" prop="floorCode">
<el-input v-model="contentTemplate.floorCode" placeholder="请输入楼层code" style="width:288px;"></el-input>
</el-form-item>
<el-form-item label="楼层名称" prop="floorName">
<el-input v-model="contentTemplate.floorName" placeholder="请输入楼层名称" style="width:288px;"></el-input>
</el-form-item>
<el-form-item label="楼层常量排序" prop="seqNo">
<el-input v-model="contentTemplate.seqNo" placeholder="请输入楼层常量排序" style="width:288px;"></el-input>
</el-form-item>
<el-form-item label="楼层描述" prop="floorDesc">
<el-input v-model="contentTemplate.floorDesc" placeholder="请输入楼层描述" style="width:288px;"></el-input>
</el-form-item>
<el-form-item label="楼层关系" prop="relationCode">
<el-input v-model="contentTemplate.relationCode" placeholder="请输入楼层关系" style="width:288px;"></el-input>
</el-form-item>
<el-form-item label="楼层图片" prop="imageUrl">
<el-upload
v-model="contentTemplate.imageUrl"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="layoutImgUrl">
<img v-show="contentTemplate.imageUrl" :src="contentTemplate.imageUrl" class="bg-img">
<img v-show="!contentTemplate.imageUrl" class="bg-img" src="../../../static/img/small.png">
</el-upload>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="createSave">保存</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { doUpload, getFilePath } from "../../common/qiniuUtil";
import {setOptionLabel,
initDepartment,
isEmptyUtils,
errorResponseCheck,
openLoading,
closeLoading,
messageBox,
getConstantList,getPositionList, isNotEmptyList} from '../../common/utils'
let vm = null
export default {
data() {
return {
collapseFlag: '收起',
dialogTitle: '新增楼层',
activeNames: ['1'],
createActivityVisible: false,
escPressFlg: false,//弹出层是否可以按ESC关闭
totalRows: 0,
searchParam: {
floorCode: '',
floorName: '',
pageNo: 1,
pageSize: 15
},
tableData: [],
contentTemplate: {
id: '',
floorCode: '',
floorName: '',
floorDesc: '',
seqNo: '',
relationCode: '',
imageUrl: ''
},
rules: {
"floorCode": [
{ required: true, message: '请输入楼层code', trigger: 'blur' }
],
"floorName": [
{ required: true, message: '请输入楼层名称', trigger: 'blur' }
],
"imageUrl": [
{ required: true, message: '请输入楼层图片', trigger: 'blur' }
]
}
}
},
created() {
vm = this
vm.search()
},
methods: {
//展开 收起
handleChange(arr) {
vm.collapseFlag = arr.length > 0 ? "收起" : "展开"
},
// 查询按钮
search() {
openLoading(vm);
let req = {
params: {
floorCode: vm.searchParam.floorCode,
floorName: vm.searchParam.floorName,
pageNo: vm.searchParam.pageNo,
pageSize: vm.searchParam.pageSize
},
};
vm.$axios.get(localStorage.getItem("msUrl") + 'homeFloorConstants/queryConstants'
, req).then(function (res) {
closeLoading(vm);
let data = JSON.parse(JSON.stringify(res.data.data));//通过这个实现深拷贝
vm.tableData = data.ConstantsList;
vm.totalRows = data.totalRows;
}).catch(function (error) {
errorResponseCheck(error, vm);
});
},
// 重置按钮
reset() {
vm.searchParam.floorCode = ''
vm.searchParam.floorName = ''
vm.searchParam.id = ''
vm.search()
},
// 新建楼层常量
create() {
vm.dialogTitle = '新增楼层常量'
vm.createActivityVisible = true
vm.contentTemplate.id = ''
vm.contentTemplate.floorCode = ''
vm.contentTemplate.floorName = ''
vm.contentTemplate.floorDesc = ''
vm.contentTemplate.seqNo = ''
vm.contentTemplate.relationCode = ''
vm.contentTemplate.imageUrl = ''
},
// 编辑楼层常量
editColumn(row) {
vm.$nextTick(() => {
vm.$refs.form.resetFields()
})
vm.dialogTitle = '编辑楼层常量'
vm.createActivityVisible = true
vm.contentTemplate = Object.assign({},row)
},
// 新增(修改)楼层常量信息
createSave() {
vm.$refs.form.validate((valid) => {
if (valid) {
vm.$axios.post(localStorage.getItem("msUrl") + 'homeFloorConstants/insertOrUpdate'
, vm.contentTemplate).then(function (res) {
if(res.data.code == "000000") {
vm.createActivityVisible = false
vm.$message({
type: 'success',
message: '保存成功!'
})
vm.search()
}
}).catch(function (error) {
vm.$message.error('保存失败')
})
} else {
return false;
}
});
},
// 删除楼层
deleteLayout(row) {
let req = {
params: {
id: row.id
}
}
vm.$axios.get(localStorage.getItem("msUrl") + 'homeFloorConstants/deleteById',req).then((res)=> {
if(res.data.code == "000000") {
vm.$message({
type: 'success',
message: '删除成功!'
})
vm.search()
}
}).catch((error) => {
vm.$message.error('删除失败')
})
},
// 上传楼层图片
layoutImgUrl(file) {
if (isEmptyUtils(file)) {
return;
}
vm.$message.info('开始上传');
doUpload(vm,file, getFilePath(file,null), 'preview4', 'progress1', 1).then(function (path) {
vm.contentTemplate.imageUrl = path.fullPath
vm.$message.success('上传成功')
});
// return false;
},
// 修改分页
handleSizeChange(value) {
vm.searchParam.pageSize = value
vm.search()
},
handleCurrentChange(value) {
vm.searchParam.pageNo = value
vm.search()
}
}
}
</script>
<style>
.layout-const-wrap .el-collapse {
border-top: 0;
}
.layout-const-wrap .el-collapse-item__wrap {
border-bottom: 0;
}
.layout-const-wrap .el-collapse-item__content {
padding-bottom: 0;
}
.acilayout-consttvity-wrap .el-collapse-item__header {
color: #409EFF;
}
.layout-const-wrap .el-collapse-item__wrap {
border-top: 1px solid #dcdfe6;
}
.layout-const-wrap .row {
margin-top: 20px;
margin-bottom:20px;
}
.layout-const-wrap .item-label {
white-space: nowrap;
}
.layout-const-wrap .label-row {
padding-top: 10px;
}
.layout-const-wrap .search-button {
text-align: right;
margin-top:20px;
}
.layout-const-wrap .create-button {
padding-top: 20px;
margin-top: 0 !important;
border-top: 1px solid #dcdfe6;
text-align: right;
}
.layout-const-wrap .el-table__header thead tr th {
background: #fafafa !important;
}
.layout-const-wrap .creat-form {
height: 550px;
overflow-y: auto;
overflow-x: hidden;
}
.layout-const-wrap .dialog-footer {
text-align: center;
}
.layout-const-wrap .dialog-footer button {
width: 150px;
height: 30px;
line-height: 8px;
}
.layout-const-wrap .el-table th>.cell{
color: #000;
}
.layout-const-wrap .el-form {
overflow: hidden;
}
.layout-const-wrap .bg-img {
width:80px;
height:80px;
}
</style>
src/views/will-delete/layoutList.vue 已删除 100644 → 0
浏览文件 @ 3d2a4329
<template>
<div class="layout-wrap">
<el-row :gutter="30" class="content-title" type="flex">
<el-col :span="4" class="name-label">
<h5>楼层管理</h5>
</el-col>
</el-row>
<el-row :gutter="30" class="row" type="flex" style="margin-bottom:0;display:none">
<el-form ref="form" :model="searchParam" label-suffix=":" label-width="130px" style="width:100%;">
<el-col :span="10">
<el-form-item label="" prop="shareFlag">
<el-radio-group v-model="webAndnativeLable" @change="webAndnative">
<el-radio label="native"></el-radio>
<el-radio label="h5"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-form>
</el-row>
<el-row :gutter="10" class="row create-button" style="margin-right:0;">
<el-button type="primary" size="small" @click="createLayout">新建楼层</el-button>
</el-row>
<!-- 表格 -->
<el-table :data="tableData" style="width: 100%">
<el-table-column label="楼层排序" width="200">
<template slot-scope="scope">
<input type="text" v-model="scope.row.seqNo" size="small">
</template>
</el-table-column>
<el-table-column prop="floorName" label="楼层名称" min-width="200" align="center"></el-table-column>
<el-table-column label="支持版本" min-width="200" align="center">
<template slot-scope="scope">
<span>{{ scope.row | getVersion }}</span>
</template>
</el-table-column>
<el-table-column prop="createdTime" label="最后修改时间" min-width="200" align="center"></el-table-column>
<el-table-column label="是否支持下拉刷新" min-width="120" align="center">
<template slot-scope="scope">
<span>{{ scope.row.freshFlag | refreshType}}</span>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="left" min-width="200">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="editColumn(scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="deleteControl(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="save-btn">
<el-button size="small" type="primary" @click="editTabSave">保 存</el-button>
</div>
<!-- 新建楼层 -->
<el-dialog class="img-edit" :title="dialogTitle" :visible.sync="createActivityVisible" :close-on-click-modal="false">
<el-form ref="form" :model="submitLayout" label-suffix=":" label-width="130px" style="width:100%;">
<el-form-item prop="shareFlag" v-if="addLayout">
<el-radio-group v-model="shareLable" @change="isSelect">
<div class="layout-content" v-for="(item,index) in allLayoutList" :key="index">
<el-radio :label="item.floorCode + '&' + item.floorName">
<div class="layout-text">{{item.floorDesc}}</div>
<img class="bg-img" :src="item.imageUrl">
</el-radio>
</div>
</el-radio-group>
</el-form-item>
<el-form-item label="是否支持下拉刷新" prop="shareFlag">
<el-radio-group v-model="isResearchLable" @change="refleshSelect">
<el-radio label="支持"></el-radio>
<el-radio label="不支持"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="支持版本">
<el-col :span="5">
<el-select v-model="submitLayout.appVersion" placeholder="请选择">
<el-option
v-for="item in versionList"
:key="item"
:label="item"
:value="item">
</el-option>
</el-select>
</el-col>
<el-col :span="1"> &nbsp </el-col>
<el-col :span="12">
<el-radio-group v-model="submitLayout.range">
<el-radio :label=1>向上支持</el-radio>
<el-radio :label=2>向下支持</el-radio>
</el-radio-group>
</el-col>
</el-form-item>
<el-form-item label="是否显示图片" >
<el-radio-group v-model="submitLayout.isShow" @change="refleshSelect">
<el-radio :label='1'>显示</el-radio>
<el-radio :label='2'>不显示</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item v-if="submitLayout.isShow == 1" label="图片" >
<el-upload
v-model="submitLayout.imgUrl"
class="bg-uploader"
action="#"
accept="image/jpeg,image/jpg,image/png"
:show-file-list="false"
:before-upload="layoutImgUrl">
<img v-show="submitLayout.imgUrl" :src="submitLayout.imgUrl" class="bg-img">
<img v-show="!submitLayout.imgUrl" class="bg-img" src="../../../static/img/small.png">
</el-upload>
<div class="img-p">
<p>高度36px</p>
</div>
</el-form-item>
<el-form-item label="链接" prop="linkUrl" v-if="isWebLayout">
<el-input v-model="submitLayout.linkUrl" placeholder="" style="width:84%"></el-input>
</el-form-item>
<div v-if="submitLayout.isShow == 1">
<el-form-item label="“更多”文案">
<el-input v-model="submitLayout.content" placeholder="" style="width:84%"></el-input>
</el-form-item>
<el-form-item label="更多跳转">
</el-form-item>
<el-form-item label="链接类型">
<el-select v-model="submitLayout.linkType" placeholder="请选择" @change="linkChange" style="width:84%">
<el-option
v-for="item in linkSelect"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="选择模块" v-if="submitLayout.linkType == 4">
<el-select v-model="submitLayout.name" placeholder="请选择" @change="moduleChange" style="width:84%">
<el-option
v-for="item in modelList"
:key="item.id"
:label="item.name"
:value="item.name">
</el-option>
</el-select>
</el-form-item>
<div v-for="(i,j) in paramList2" :key="j" >
<el-form-item label="选择参数" v-if="submitLayout.linkType == 4 && paramFlagStatus == 1">
<el-select v-model="submitLayout.parameter[j]" filterable placeholder="请选择参数" style="width:84%">
<el-option
v-for="(item3,index3) in i"
:key="index3"
:label="item3.name"
:value="item3.id + '&'+ item3.name">
</el-option>
</el-select>
</el-form-item>
</div>
</div>
<el-form-item label="资源关联" >
<el-select v-model="submitLayout.templateCode" placeholder="请选择" style="width:84%">
<el-option
v-for="item in templateList"
:key="item.templateCode"
:label="item.name"
:value="item.templateCode">
</el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="createSave">提交</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { doUpload, getFilePath } from "../../common/qiniuUtil";
import {setOptionLabel,
initDepartment,
isEmptyUtils,
errorResponseCheck,
openLoading,
closeLoading,
messageBox,
getConstantList,getPositionList, isNotEmptyList} from '../../common/utils'
let vm = null
export default {
data() {
return {
dialogTitle: '新增楼层',
editLayout: '编辑楼层',
createActivityVisible: false,
addLayout: false,
isWebLayout: false,
showType: '',
searchParam: {},
tableData: [],
allLayoutList: [],
webAndnativeLable: '',
isResearchLable: '',
shareLable: '',
isNativeorH5: '',
listId: '',
submitLayout: {
id: '',
floorCode: '',
floorName: '',
freshFlag: '',
seqNo: '',
linkUrl: '',
imgUrl: '',
isShow: 1,
appVersion: '',
range: 1,
content: '',
linkType: 8,
name: '',
parameter: [],
templateCode: '',
},
versionList: [],
linkSelect: [],
modelList: [],
paramList2: [],
chooseModel: {
code: null,
type: null,
paramFlag: 1,
},
selectParamData: {},
floorModel: {},
templateList: [],
paramFlagStatus: '',
optionStatus: '',
}
},
created() {
vm = this
vm.search()
vm.getAppVersion()
vm.getLinkType()
vm.getModuleData()
vm.queryResourceList()
},
methods: {
// 查询楼层信息
search() {
openLoading(vm);
vm.$axios.get(localStorage.getItem("msUrl") + 'homeFloor/queryList').then(function (res) {
closeLoading(vm);
let data = JSON.parse(JSON.stringify(res.data.data));//通过这个实现深拷贝
if(data.typeConfig) {
vm.isNativeorH5 = data.typeConfig.showType
vm.listId = data.typeConfig.id
if(vm.isNativeorH5 == 1) {
vm.webAndnativeLable = "native"
vm.showType = 1
}else{
vm.webAndnativeLable = "h5"
vm.showType = 2
}
}else{
vm.webAndnativeLable = ''
}
vm.tableData = data.floorList
}).catch(function (error) {
errorResponseCheck(error, vm);
});
},
// 上传楼层图片
layoutImgUrl(file) {
if (isEmptyUtils(file)) {
return;
}
var _img = new FileReader()
_img.readAsDataURL(file)
_img.onload = function(theFile) {
let image = new Image()
image.src = theFile.target.result
image.onload = function() {
let _this = this
if(_this.height != 36) {
vm.$message.info("上传图片尺寸大小不合适，请重新上传")
}else {
vm.$message.info('开始上传');
openLoading(vm)
doUpload(vm,file, getFilePath(file,null), 'preview4', 'progress1', 1).then(function (path) {
closeLoading(vm)
vm.submitLayout.imgUrl = path.fullPath
vm.$message.success('上传成功')
});
}
}
}
// return false;
},
// 选择native or h5
webAndnative(value) {
if(value == 'native') {
vm.showType = 1
}else if(value == 'h5') {
vm.showType = 2
}
},
//查询所有楼层常量信息
getAllLayout() {
vm.$axios.get(localStorage.getItem("msUrl") + 'homeFloorConstants/queryAllConstants').then(function (res) {
closeLoading(vm);
let data = JSON.parse(JSON.stringify(res.data.data));//通过这个实现深拷贝
vm.allLayoutList = data
}).catch(function (error) {
errorResponseCheck(error, vm);
});
},
// 新建楼层
createLayout() {
vm.dialogTitle = '新增楼层'
vm.optionStatus = 'create'
vm.createActivityVisible = true
vm.addLayout = true
vm.submitLayout.seqNo = vm.tableData.length
vm.submitLayout.floorCode = ''
vm.submitLayout.floorName = ''
vm.submitLayout.freshFlag = 1
vm.submitLayout.isShow = 1
vm.submitLayout.imgUrl = ''
// vm.submitLayout.appVersion = vm.versionList[0]
vm.submitLayout.appVersion = '3.0.4'
vm.submitLayout.range = 1
vm.submitLayout.content = ''
vm.submitLayout.linkType = 8
vm.submitLayout.name = ''
vm.submitLayout.parameter = [],
vm.submitLayout.templateCode = '',
vm.isResearchLable = '支持'
// vm.linkSelect = [];
vm.getAllLayout()
// vm.getLinkType()
// vm.getModuleData();
},
// 编辑模板内容
editColumn(row) {
vm.dialogTitle = '编辑楼层'
vm.optionStatus = 'edit'
vm.createActivityVisible = true
vm.addLayout = false
vm.submitLayout.id = row.id
vm.submitLayout.seqNo = row.seqNo
vm.submitLayout.floorCode = row.floorCode
vm.submitLayout.floorName = row.floorName
vm.submitLayout.freshFlag = row.freshFlag
vm.submitLayout.isShow = row.isShow
vm.submitLayout.imgUrl = row.imgUrl
if(row.freshFlag == 1) {
vm.isResearchLable = '支持'
}else{
vm.isResearchLable = '不支持'
}
if(row.floorCode == 'H000') {
vm.isWebLayout = true
vm.submitLayout.linkUrl = row.linkUrl
}else{
vm.isWebLayout = false
}
// vm.linkSelect = [];
this.selectFloorById(row.id);
// vm.getLinkType()
// vm.getModuleData();
},
// 选中楼层
isSelect(value) {
let floorInfo = value.split('&')
vm.submitLayout.floorCode = floorInfo[0]
vm.submitLayout.floorName = floorInfo[1]
if(floorInfo[0] == 'H000') {
vm.isWebLayout = true
}else{
vm.isWebLayout = false
}
},
// 是否支持下拉刷新
refleshSelect(value) {
if(value == '支持') {
vm.submitLayout.freshFlag = 1
}else if(value == '不支持') {
vm.submitLayout.freshFlag = 2
}
},
// 提交新增楼层
createSave() {
if(vm.addLayout){
if(!vm.submitLayout.floorCode) {
vm.$message.info("请选择楼层")
return
}
if(!vm.submitLayout.freshFlag) {
vm.$message.info("请选择是否支持下拉刷新")
return
}
if(vm.isWebLayout) {
if(!vm.submitLayout.linkUrl) {
vm.$message.info("请输入链接")
return
}
}
}else{
if(!vm.submitLayout.freshFlag) {
vm.$message.info("请选择是否支持下拉刷新")
return
}
if(vm.isWebLayout) {
if(!vm.submitLayout.linkUrl) {
vm.$message.info("请输入链接")
return
}
}
}
if(vm.submitLayout.isShow == 1) {
if(vm.submitLayout.imgUrl == '' || vm.submitLayout.imgUrl == null) {
vm.$message.info("请上传图片")
return
}
}
if(vm.submitLayout.isShow == 2) {
vm.submitLayout.imgUrl = '';
}
if(vm.submitLayout.content.length > 0) {
if(vm.submitLayout.content.length > 6) {
vm.$message.info("“更多”文案 限6字")
return
}
if(vm.submitLayout.linkType != 4) {
vm.$message.info("填写“更多”文案后，必须选择模块")
return
}
}
if(vm.submitLayout.linkType == 4) {
if(vm.submitLayout.content.length == 0) {
vm.$message.info("选择模块后，必须填写“更多”文案")
return
}
}
let submitData = this.setSubmitData();
// console.log('submitData:',submitData);
openLoading(vm);
vm.$axios.post(localStorage.getItem("msUrl") + 'homeFloor/insertOrUpdateFloorDetail'
, submitData).then(function (res) {
closeLoading(vm);
if(res.data.code == "000000") {
vm.createActivityVisible = false
vm.$message({
type: 'success',
message: '保存成功!'
})
vm.search()
}
}).catch(function (error) {
vm.$message.error('保存失败')
})
},
// 下线(删除)
deleteControl(row) {
this.$confirm('此操作将删除该楼层, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
let req = {
params: {
id: row.id
}
}
vm.$axios.get(localStorage.getItem("msUrl") + 'homeFloor/deleteFloorById'
, req).then(function (res) {
if(res.data.code == '000000') {
vm.$message({
type: 'success',
message: '删除成功!'
})
vm.search()
}
}).catch(function (error) {
errorResponseCheck(error, vm);
});
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
// 保存
editTabSave() {
let data = {
typeConfig: {
showType: vm.showType,
id: vm.listId
},
detailConfig: vm.tableData
}
if(!data.typeConfig.showType) {
vm.$message.info("请选择native或者h5")
return
}
// 楼层不可重复判断
let seqNoArray = []
let nary = []
for(let i=0;i<data.detailConfig.length;i++) {
seqNoArray.push(parseInt(data.detailConfig[i].seqNo))
}
nary = seqNoArray.slice().sort();
for(let i=0;i<seqNoArray.length;i++){
if (nary[i]==nary[i+1]){
vm.$message.info("楼层排序重复内容："+nary[i])
return
}
}
openLoading(vm);
vm.$axios.post(localStorage.getItem("msUrl") + 'homeFloor/deploy'
, data).then(function (res) {
closeLoading(vm);
if(res.data.code == "000000") {
vm.$message({
type: 'success',
message: '保存成功!'
})
vm.search()
}
}).catch(function (error) {
vm.$message.error('保存失败')
})
},
// 新增功能
setSubmitData() {
let submitData = {};
vm.submitParam();
// console.log('提交表单optionStatus：',vm.optionStatus)
if(vm.optionStatus == 'edit') {
submitData = {
model:{
tHomeFloorDetailConfig:{
id: vm.submitLayout.id,
floorCode: vm.submitLayout.floorCode,
floorName: vm.submitLayout.floorName,
freshFlag: vm.submitLayout.freshFlag,
seqNo: vm.submitLayout.seqNo,
linkUrl: vm.submitLayout.linkUrl,
status: 1,
imgUrl: vm.submitLayout.imgUrl,
isShow: vm.submitLayout.isShow,
appVersion: vm.submitLayout.appVersion,
range: vm.submitLayout.range,
content: vm.submitLayout.content,
templateCode: vm.submitLayout.templateCode,
},
contentAppModule:{
code: vm.chooseModel.code,//
type: vm.chooseModel.type,//
name: vm.submitLayout.name,
linkType: vm.submitLayout.linkType,
paramFlag: vm.chooseModel.paramFlag,
status: vm.floorModel.tHomeFloorDetailConfig.status,//
deleteFlag: vm.floorModel.tHomeFloorDetailConfig.deleteFlag,
createdId: vm.floorModel.tHomeFloorDetailConfig.createdId,
createdTime: vm.floorModel.tHomeFloorDetailConfig.createdTime,
modifiedId: vm.floorModel.tHomeFloorDetailConfig.modifiedId,
modifiedTime: vm.floorModel.tHomeFloorDetailConfig.modifiedTime
},
paramList:[]
}
}
let configData = vm.selectParamData.config;
for(let j=0;j<vm.submitLayout.parameter.length;j++) {
submitData.model.paramList[j] = {};
submitData.model.paramList[j].id = configData[j].id;
submitData.model.paramList[j].moduleId = configData[j].moduleId;
submitData.model.paramList[j].key = configData[j].paramKey;
submitData.model.paramList[j].value = vm.submitLayout.parameter[j];
submitData.model.paramList[j].type = configData[j].type;
submitData.model.paramList[j].seqNo = configData[j].seqNo;
submitData.model.paramList[j].status = configData[j].status;
submitData.model.paramList[j].deleteFlag = vm.floorModel.tHomeFloorDetailConfig.deleteFlag;
submitData.model.paramList[j].createdId = configData[j].createdId;
submitData.model.paramList[j].createdTime = configData[j].createdTime;
submitData.model.paramList[j].modifiedId = configData[j].modifiedId;
submitData.model.paramList[j].modifiedTime = configData[j].modifiedTime;
}
} else {
submitData = {
model:{
tHomeFloorDetailConfig:{
floorCode: vm.submitLayout.floorCode,
floorName: vm.submitLayout.floorName,
freshFlag: vm.submitLayout.freshFlag,
seqNo: vm.submitLayout.seqNo,
linkUrl: vm.submitLayout.linkUrl,
status: 1,
imgUrl: vm.submitLayout.imgUrl,
isShow: vm.submitLayout.isShow,
appVersion: vm.submitLayout.appVersion,
range: vm.submitLayout.range,
content: vm.submitLayout.content,
templateCode: vm.submitLayout.templateCode,
},
contentAppModule:{
code: vm.chooseModel.code,//
type: vm.chooseModel.type,//
name: vm.submitLayout.name,
linkType: vm.submitLayout.linkType,
paramFlag: vm.chooseModel.paramFlag,
status: '',
deleteFlag: 1,
createdId: '',
createdTime: '',
modifiedId: '',
modifiedTime: '',
},
paramList:[]
}
}
let configData = vm.selectParamData.config;
for(let j=0;j<vm.submitLayout.parameter.length;j++) {
submitData.model.paramList[j] = {};
submitData.model.paramList[j].id = configData[j].id;
submitData.model.paramList[j].moduleId = configData[j].moduleId;
submitData.model.paramList[j].key = configData[j].paramKey;
submitData.model.paramList[j].value = vm.submitLayout.parameter[j];
submitData.model.paramList[j].type = configData[j].type;
submitData.model.paramList[j].seqNo = configData[j].seqNo;
submitData.model.paramList[j].status = configData[j].status;
submitData.model.paramList[j].deleteFlag = 1;
submitData.model.paramList[j].createdId = configData[j].createdId;
submitData.model.paramList[j].createdTime = configData[j].createdTime;
submitData.model.paramList[j].modifiedId = configData[j].modifiedId;
submitData.model.paramList[j].modifiedTime = configData[j].modifiedTime;
}
}
return submitData;
},
setFloor(data) {
// console.log(data);
this.submitLayout.appVersion = data.tHomeFloorDetailConfig.appVersion;
this.submitLayout.range = data.tHomeFloorDetailConfig.range;
this.submitLayout.content = data.tHomeFloorDetailConfig.content;
this.submitLayout.linkType = data.contentAppModule.linkType;
this.submitLayout.name = data.contentAppModule.name;
this.submitLayout.templateCode = data.tHomeFloorDetailConfig.templateCode;
this.initParam();
vm.submitLayout.parameter = [];
for(let j=0;j<vm.floorModel.paramList.length;j++) {
vm.submitLayout.parameter[j] = vm.floorModel.paramList[j].value;
}
//编辑时候linkType为空赋值8（无跳转）
if(vm.submitLayout.linkType == null) {
vm.submitLayout.linkType = 8;
}
},
// new-根据ID查询楼层信息
selectFloorById(id) {
vm.$axios.get(localStorage.getItem("msUrl") + 'homeFloor/selectFloorById?id='+id).then(function (res) {
if(res.data.code == "000000") {
vm.floorModel = res.data.data.model;
vm.setFloor(res.data.data.model);
vm.initParamFlag();
}
}).catch(function (error) {
vm.$message.error(error);
});
},
// 获取APP版本号
getAppVersion() {
vm.$axios.get(localStorage.getItem("msUrl") + 'version/versionList').then(function (res) {
if(res.data.code == "000000") {
vm.versionList = res.data.data.versionName
}
}).catch(function (error) {
vm.$message.error(error);
});
},
// 获取链接类型下拉数据
getLinkType() {
let req = {
params: {
code: 'C005'
},
};
vm.$axios.get(localStorage.getItem("msUrl") + 'commonComstant/selectByTypeCode'
, req).then(function (res) {
if(res.data.code == "000000") {
let linkObject = JSON.parse(JSON.stringify(res.data.data));//通过这个实现深拷贝
let keys = Object.keys(linkObject);
for(var i=0;i<keys.length;i++) {
vm.linkSelect.push({
label: linkObject[keys[i]],
value: keys[i] - 0
})
}
}
}).catch(function (error) {
vm.$message.error(error);
});
},
// 获取模块下拉数据
getModuleData() {
vm.$axios.get(localStorage.getItem("msUrl") + 'moduleConfig/selectName').then(function (res) {
if(res.data.code == "000000") {
let moduleArray = JSON.parse(JSON.stringify(res.data.data))
vm.modelList = moduleArray.nameList;
}
}).catch(function (error) {
vm.$message.error(error);
});
},
// change链接类型
linkChange(value) {
this.submitLayout.name = '';
},
initParamFlag() {
for(let i = 0; i < vm.modelList.length; i++) {
if(vm.submitLayout.name == vm.modelList[i].name) {
// console.log('initParamFlag:',vm.modelList[i])
vm.paramFlagStatus = vm.modelList[i].paramFlag;
}
}
},
// change模块选择数据
moduleChange(value) {
for(let z=0;z<vm.submitLayout.parameter.length;z++) {
vm.submitLayout.parameter[z] = '';
}
for(let i = 0; i < vm.modelList.length; i++) {
if(value == vm.modelList[i].name) {
console.log('moduleChange',vm.modelList[i])
vm.paramFlagStatus = vm.modelList[i].paramFlag
vm.getParamData(vm.modelList[i].id,vm.modelList[i].paramFlag,2)
break
}
}
},
initParam() {
if(vm.modelList.length == 0) {
return;
}
for(let i=0;i<vm.modelList.length;i++) {
if(vm.modelList[i].name == vm.submitLayout.name) {
console.log('modelList:',vm.modelList[i]);
vm.chooseModel = vm.modelList[i];
vm.getParamData(vm.modelList[i].id,vm.modelList[i].paramFlag,1)
}
}
},
submitParam() {
for(let i=0;i<vm.modelList.length;i++) {
if(vm.modelList[i].name == vm.submitLayout.name) {
console.log('submitParam:',vm.modelList[i]);
vm.chooseModel = vm.modelList[i];
}
}
},
getParamData(id,flag,enter) {
console.log('flag值：',flag);
if(flag == 1) { // 是否有参数
let req = {
params: { id: id }
}
vm.$axios.get(localStorage.getItem("msUrl") + 'moduleConfig/selectParam'
, req).then(function (res) {
if(res.data.code == "000000") {
vm.paramList2 = res.data.data.paramList;
if(enter == 2) {
vm.submitLayout.parameter = [];
for(let j=0;j<vm.paramList2.length;j++) {
vm.submitLayout.parameter[j] = '';
}
}
vm.selectParamData = res.data.data;
}
}).catch(function (error) {
vm.$message.error(error);
})
}else{
return false
}
},
//查询资源名称和templateCode
queryResourceList() {
vm.$axios.get(localStorage.getItem("msUrl") + 'contentResourceField/queryResourceList').then(function (res) {
if(res.data.code == "000000") {
vm.templateList = res.data.data;
}
}).catch(function (error) {
vm.$message.error(error);
});
},
}
}
</script>
<style>
.layout-wrap .row {
margin-top: 20px;
margin-bottom:20px;
}
.layout-wrap .item-label {
white-space: nowrap;
}
.layout-wrap .label-row {
padding-top: 10px;
}
.layout-wrap .search-button {
text-align: right;
margin-top:20px;
}
.layout-wrap .create-button {
padding-top: 20px;
margin-top: 0 !important;
/* border-top: 1px solid #dcdfe6; */
text-align: right;
}
.layout-wrap .el-table__header thead tr th {
background: #fafafa !important;
}
.layout-wrap .creat-form {
height: 550px;
overflow-y: auto;
overflow-x: hidden;
}
.layout-wrap .course .el-upload{
border: 1px solid #71AEED;
border-radius: 2px;
}
.layout-wrap .bg-uploader {
float: left;
}
.layout-wrap .bg-img {
width:80px;
height:80px;
}
.layout-wrap .el-upload {
position: relative;
}
.layout-wrap .el-upload .info-img{
width: 73px;
position: absolute;
left: 2px;
top: -5px;
opacity: 0;
}
.layout-wrap .el-upload .info-img:hover{
opacity: 1;
}
.layout-wrap .img-size p{
font-size: 12px;
}
.layout-wrap .img-size p:nth-child(1){
margin-top: 45px;
}
.layout-wrap .dialog-footer {
text-align: center;
}
.layout-wrap .dialog-footer button {
width: 150px;
height: 30px;
line-height: 8px;
}
.layout-wrap .el-table th>.cell{
color: #000;
}
.layout-wrap .el-upload-list--text li {
min-width: 250px;
max-width: 60%;
}
.layout-wrap .el-form {
overflow: hidden;
}
.layout-wrap .save-btn {
text-align: center;
margin-top: 20px;
}
.layout-wrap .layout-content {
display: inline-block;
width: 33%;
margin-bottom: 20px;
}
.layout-wrap .el-table__row input {
border: none;
}
/* .layout-wrap .img-edit .el-radio__label {
display: block;
} */
.layout-wrap .layout-text {
width:150px;
padding: 10px 0;
}
.layout-wrap .img-p {
margin: 30px 0 0 20px;
float:left;
}
</style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或