提交 ecfcf86a 编写于 作者: 张敬贤's avatar 张敬贤

Feature/zjx

上级 648873e1
...@@ -15,7 +15,8 @@ module.exports = { ...@@ -15,7 +15,8 @@ module.exports = {
'gdp': true, 'gdp': true,
'uni': true, 'uni': true,
'wx': true, 'wx': true,
'qq':true 'qq': true,
'$':true
}, },
// add your custom rules here // add your custom rules here
//it is base on https://github.com/vuejs/eslint-config-vue //it is base on https://github.com/vuejs/eslint-config-vue
......
...@@ -37,6 +37,7 @@ ...@@ -37,6 +37,7 @@
"vue-fragment": "^1.5.1", "vue-fragment": "^1.5.1",
"vue-router": "^3.3.1", "vue-router": "^3.3.1",
"vuescroll": "^4.15.1", "vuescroll": "^4.15.1",
"jsencrypt": "^3.2.0",
"vuex": "^3.1.1" "vuex": "^3.1.1"
}, },
"devDependencies": { "devDependencies": {
...@@ -55,6 +56,7 @@ ...@@ -55,6 +56,7 @@
"babel-eslint": "^10.1.0", "babel-eslint": "^10.1.0",
"babel-plugin-import": "^1.13.0", "babel-plugin-import": "^1.13.0",
"colors-console": "^1.0.3", "colors-console": "^1.0.3",
"crypto-js": "^4.1.1",
"dotenv": "^8.2.0", "dotenv": "^8.2.0",
"draw-page-structure": "^1.0.8", "draw-page-structure": "^1.0.8",
"eslint": "^6.7.2", "eslint": "^6.7.2",
...@@ -76,7 +78,7 @@ ...@@ -76,7 +78,7 @@
"webpack-bundle-analyzer": "^4.4.2", "webpack-bundle-analyzer": "^4.4.2",
"pdfjs-dist": "2.4.456", "pdfjs-dist": "2.4.456",
"storejs": "2.0.1", "storejs": "2.0.1",
"js-cookie":"3.0.1" "js-cookie": "3.0.1"
}, },
"eslintConfig": { "eslintConfig": {
"root": true, "root": true,
......
...@@ -19,6 +19,8 @@ ...@@ -19,6 +19,8 @@
</noscript> </noscript>
<div id="app"></div> <div id="app"></div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
<script src="<%= VUE_APP_OSS_URL %>static/js/jquery-2.1.1.min.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/vue-2.6.11.js"></script> <script src="<%= VUE_APP_OSS_URL %>static/js/vue-2.6.11.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/vuex-3.4.0.js"></script> <script src="<%= VUE_APP_OSS_URL %>static/js/vuex-3.4.0.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/vue-router-3.3.2.js"></script> <script src="<%= VUE_APP_OSS_URL %>static/js/vue-router-3.3.2.js"></script>
......
import request from 'mn-template/plugins/http';
// 判断是否需要触发拼图风控
export const checkNeedImgCode = (data) => {
return request({
url: '/account/jigsawCode',
method: 'post',
data: data,
headers: {
sourcetype: 4,
},
});
};
// 获取短信验证码
export const getMessageCode = (data) => {
return request({
url: '/account/H5/authCode',
method: 'post',
data: data,
headers: {
sourcetype: 4,
},
});
};
// 获取RSA public key
export const getPubKey = (param) => {
return request({
url: '/account/cipher/key',
method: 'get',
params: param,
headers: {
sourcetype: 4,
},
});
};
// /tis/insurance / login
export const insuranceLogin = (data) => {
return request({
method: 'post',
url: '/tis/insurance/login',
data: data,
withCredentials: true,
});
};
// / 获取type=的协议名称
export const getProtocolContentByType = (type) => {
return request({
method: 'get',
url: `/smartcontract/protocol/content?type=${type}`,
withCredentials: true,
});
};
// 获取type=的协议内容
export const getProtocolNameByType = (type) => {
return request({
method: 'get',
url: `/smartcontract/protocol/name?type=${type}`,
withCredentials: true,
});
};
//
export const getPrototypes = (projectEquityNo) => {
return request({
method: 'get',
url: `tis/insurance/prototypes?projectEquityNo=${projectEquityNo}`,
withCredentials: true,
});
};
<template>
<div class="slide-check-wrap">
<!-- <p class="slide-text">向右滑动完成验证</p>
<SlideToCheck @slideCallback="slideCallback"/>-->
<div id="imgScode" />
</div>
</template>
<script>
import { checkNeedImgCode, getMessageCode } from '@/api/login';
import { mapState, mapActions } from 'vuex';
import { sendEncryptRequest } from '@/utils/encrypt';
export default {
name: 'SlideCheck',
props: {
mobile: {
type: String,
default: ''
},
},
computed: {
...mapState('home', {
imgCodeData: state => state.imgCodeData
})
},
mounted() {
console.log(this.imgCodeData);
// const {slidingImage, backImage, yHeight} = this.imgCodeData;
this.initImgCode(this.imgCodeData);
},
methods: {
...mapActions('home', ['setNeedTimer']),
getImg(type) {
const data = {
mobile: this.mobile,
jigsawVersion: 'v1'
};
sendEncryptRequest(data, params => {
checkNeedImgCode(params).then(res => {
this.initImgCode(res.data, type);
});
});
},
initImgCode(data, type) {
const _this = this;
$('#imgScode').imgcode({
frontimg: 'data:image/png;base64,' + data.slidingImage,
backimg: 'data:image/png;base64,' + data.backImage,
yHeight:data.yHeight,
refreshcallback: function () {
// 刷新验证码
_this.getImg(type);
},
closecallback: function () {
// 关闭弹框
_this.$emit('closeSlideCheckpageDialog');
},
callback: function (msg) {
_this.getMsgCode(_this, msg, data, type);
}
});
},
refreshImg(type) {
// const _this = this;
const data = {
mobile: this.mobile,
jigsawVersion: 'v1'
};
sendEncryptRequest(data, params => {
checkNeedImgCode(params).then(res => {
// eslint-disable-next-line
this.initImgCode(res.data, type);
// $('#imgScode').imgcode({
// frontimg: 'data:image/png;base64,' + res.data.slidingImage,
// backimg: 'data:image/png;base64,' + res.data.backImage,
// yHeight: res.data.yHeight,
// refreshcallback: function () {
// // 刷新验证码
// _this.getImg(type);
// },
// closecallback: function () {
// // 关闭弹框
// _this.$emit('closeSlideCheckpageDialog');
// },
// callback: function (msg) {
// const $this = this;
// _this.getMsgCode($this, msg, res.data, type);
// }
// });
});
});
},
// eslint-disable-next-line
getMsgCode($this, msg, data, type) {
const data1 = {
mobile: this.mobile,
flag: this.fromType, // 0登录(默认)1注册 2微信登录绑定手机 3修改手机 4重置密码
capCode: data.capCode,
xpos: msg.xpos,
imageW: msg.imageW
};
sendEncryptRequest(data1, params => {
getMessageCode(params).then(res => {
if (res.code == '000000') {
this.$emit('closeSlideCheckpageDialog');
// 如果是从验证码页面进来,直接关闭页面,开始倒计时
this.$emit('refreshGetMsg');
this.setNeedTimer();
} else {
$this.getfail(res.message);
}
});
});
this.$sendBuriedData({
component_tag: '905#905001'
});
}
}
};
</script>
<style lang="scss">
.slide-check-wrap {
width: auto;
height: auto;
margin: 0 auto;
.slide-text {
width: 100%;
color: #373839;
font-size: 20px;
font-weight: 700;
padding: 30px 0 20px;
}
}
.code-k-div {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(55, 56, 57, 0.6);
z-index: 999;
display: flex;
display: -webkit-flex;
justify-content: center;
-webkit-justify-content: center;
align-items: center;
}
.icon-login-bg {
background-image: url('~@/assets/images/loginicon.png');
background-repeat: no-repeat;
}
.code-con {
width: 330px;
background-color: #fff;
z-index: 1000;
-moz-user-select: none;
/* -webkit-user-select: none;
align-self: flex-start;
-webkit-align-self: flex-start; */
/* margin-top: 30px; */
border-radius: 6px;
}
.close-dialog {
text-align: right;
}
.close-dialog-img {
width: 25px;
height: 25px;
margin-right: 15px;
}
.code-img {
margin: 5px auto;
padding: 5px 0;
width: 300px;
background-color: #f5f6f7;
}
.code-back-img {
width: 100%;
}
.code-img img {
display: block;
}
.icon-w-25 {
display: inline-block;
width: 25px;
height: 25px;
text-indent: -9999px;
}
.icon-push {
background-position: 81% 75%;
}
.code-push {
height: 25px;
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-items: center;
}
.code-btn {
position: relative;
height: 30px;
text-align: center;
color: #999;
margin: 16px 10px 24px 10px;
box-sizing: border-box;
background-color: #f5f6f7;
border-radius: 15px;
border: 1px solid #e1e1e1;
}
.code-btn-m {
position: absolute;
width: 35px;
height: 35px;
border-radius: 50%;
background-color: #f5f6f7;
border: 1px solid #e1e1e1;
z-index: 5;
top: -4px;
left: 5px;
box-shadow: 0 0 3px #ccc;
cursor: pointer;
background-position: 39.5% 50%;
}
.code-btn-img {
background-image: url('~@/assets/images/arrow.png');
background-repeat: no-repeat;
}
.code-btn-img.active {
background-position: 82% 50%;
}
.code-span {
display: block;
height: 100%;
font-size: 14px;
line-height: 30px;
}
.code-btn-img.error {
background-position: 6px 50%;
}
.code-img-con {
position: relative;
}
.code-mask {
width: 60px;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}
.code-front-img {
width: 100%;
}
.code-tip {
padding-left: 10px;
font-size: 12px;
color: #999;
margin-top: 4px;
}
.code-tip-red {
color: red;
}
.code-tip-green {
color: green;
}
</style>
<template>
<div
ref="dragDiv"
class="slide-to-check-wrap"
:class="{ 'slide-ok': confirmSuccess }"
>
<div class="drag_bg" />
<div
ref="moveDiv"
class="handler handler_bg"
:class="{ handler_ok_bg: confirmSuccess }"
@touchstart="mousedownFn($event)"
>
>
</div>
</div>
</template>
<script>
export default {
name: 'SlideToCheck',
data() {
return {
beginClientX: 0, // 距离屏幕左端距离
mouseMoveStata: false, // 触发拖动状态 判断
maxwidth: '', // 拖动最大宽度,依据滑块宽度算出来的
confirmSuccess: false // 验证成功判断
};
},
mounted() {
const htmlEle = document.getElementsByTagName('html')[0];
this.maxwidth =
this.$refs.dragDiv.clientWidth - this.$refs.moveDiv.clientWidth - 4;
htmlEle.addEventListener('touchmove', this.mouseMoveFn);
htmlEle.addEventListener('touchend', this.moseUpFn);
},
methods: {
mousedownFn: function (evt) {
if (!this.confirmSuccess) {
evt.preventDefault && evt.preventDefault(); // 阻止文字选中等默认事件
this.mouseMoveStata = true;
this.beginClientX = evt.changedTouches[0].clientX;
}
},
mouseMoveFn(evt) {
if (this.mouseMoveStata) {
const width = evt.changedTouches[0].clientX - this.beginClientX;
if (width > 0 && width <= this.maxwidth) {
document.getElementsByClassName('handler')[0].style.left =
width + 'px';
document.getElementsByClassName('drag_bg')[0].style.width =
width + 'px';
} else if (width > this.maxwidth) {
this.successHandle();
}
}
},
successHandle() {
this.confirmSuccess = true;
const htmlEle = document.getElementsByTagName('html')[0];
if (window.addEventListener) {
htmlEle.removeEventListener('touchmove', this.mouseMoveFn);
htmlEle.removeEventListener('touchend', this.moseUpFn);
} else {
htmlEle.removeEventListener('touchend', () => {});
}
document.getElementsByClassName('handler')[0].style.left =
this.maxwidth + 'px';
document.getElementsByClassName('drag_bg')[0].style.width =
this.maxwidth + 'px';
this.$emit('slideCallback');
},
moseUpFn(evt) {
this.mouseMoveStata = false;
const width = evt.changedTouches[0].clientX - this.beginClientX;
if (width < this.maxwidth) {
document.getElementsByClassName('handler')[0].style.left = 0 + 'px';
document.getElementsByClassName('drag_bg')[0].style.width = 0 + 'px';
}
}
}
};
</script>
<style lang="scss">
.slide-to-check-wrap {
position: relative;
background-color: #e7e8e9;
margin: 0 auto;
width: 325px;
height: 40px;
border-radius: 4px;
line-height: 40px;
text-align: center;
&.slide-ok {
background: #449284;
}
.handler {
width: 36px;
height: 36px;
position: absolute;
top: 0px;
left: 0px;
cursor: move;
margin: 2px;
}
.handler_bg {
background: url('~@/assets/images/slide-icon.png') no-repeat center;
background-size: 100% 100%;
}
.handler_ok_bg {
background: url('~@/assets/images/slide-ok.png') no-repeat center;
background-size: 100% 100%;
}
.drag_bg {
background-color: #449284;
border-radius: 4px 0 0 4px;
height: 40px;
width: 0px;
}
}
</style>
...@@ -5,8 +5,12 @@ console.log('router, store, vueApp: ', router, store, vueApp); ...@@ -5,8 +5,12 @@ console.log('router, store, vueApp: ', router, store, vueApp);
import '@/assets/js/flexible'; import '@/assets/js/flexible';
import {isWeixin } from './utils/index'; import {isWeixin } from './utils/index';
import Loading from '@/components/loading/loading.js'; import Loading from '@/components/loading/loading.js';
import CryptoJS from 'crypto-js/crypto-js';
import JsEncrypt from 'jsencrypt/bin/jsencrypt';
// 禁用双指放大 // 禁用双指放大
window.JSEncrypt = JsEncrypt;
window.CryptoJS = CryptoJS;
var lastTouchEnd = 0; var lastTouchEnd = 0;
document.addEventListener('touchstart', function (event) { document.addEventListener('touchstart', function (event) {
if (event.touches.length > 1) { if (event.touches.length > 1) {
......
/**
* 图片验证码
*/
(function ($) {
$.fn.imgcode = function (options) {
// 初始化参数
var defaults = {
frontimg: '',
backimg: '',
refreshImg: '',
getsuccess: '',
getfail: '',
maskclose: true,
callback: '',
// 回调函数
refreshcallback: '',
yHeight: 1,
closecallback: ''
};
var opts = $.extend(defaults, options);
return this.each(function () {
var $this = $(this); // 获取当前对象
var html =
'<div class="code-k-div">' +
'<div class="code-con">' +
'<div class="close-dialog"><img class="close-dialog-img" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAABx0lEQVRoQ+2YMU7EMBBFZ4iAIqEGiY5my0hxBVwAagrgAHAoOABQUMMFgMqRUqahQ4KapAAUjII2UhQt8Ti747CWt7U9nve/Z7wxgiM/dIQDPMh/c9I74h1hUsAfLSZhB4f1jgyWjmmhd4Qo7IoQ4kgptY6IN1LKL+K63mlCiFWl1DEifkgpbwHgm9URIcQFAJxNs3ooiuIwz/P3eWAmk8lGFEV3ALA/jXMppTznBnkFgM0mcaXUY1mWB0NhaogwDO8Rca8lxpuUcosVJEmSK0Q8aTswFOYPCFBKXadpesoK0rO5kTOUOKwgtROUJPpqhrqeHWQeGCpEvYcVkCEwJhBWQUxgTCGsg1Bg6jkzWmzdnXobhLWj1S7oHsWfftVF3DVt2aOA9DnT7WA6J5r5o4FQYKgQo9RIV/E4jreDIHhGxLXOcfqsqmony7IXyn8z7whFpSE39lLViBNdS3fZLcU9ooNovlOo89rH0FqxmyZnOt8KiGlSjdIm69hBTJKZ1eWo61lBqEnoWjklDiuIM9/sQgg3XlGcedcCADdeGnVFvMhx1mJfZKK6WB5Ep5Dtce+IbcV1+3lHdArZHveO2FZct58zjvwAy/P8Qikq2y8AAAAASUVORK5CYII="></div>' +
'<div class="code-img">' +
'<div class="code-img-con">' +
'<div class="code-mask"><img class="code-front-img" src="' +
opts.frontimg +
'"></div>' +
'<img id="BigImg" class="code-back-img" src="' +
opts.backimg +
'"></div>' +
'<div class="code-push"><i class="icon-login-bg icon-w-25 icon-push">刷新</i><span class="code-tip"></span></div>' +
'</div>' +
'<div class="code-btn">' +
'<div class="code-btn-img code-btn-m"></div>' +
'<span class="code-span">按住滑块,拖动完成上方拼图</span>' +
'</div></div></div>';
$this.html(html);
// $('.code-mask').css('margin-top', `${(opts.yHeight * 2) / 75}rem`);
$('.code-mask').css('margin-top', `${opts.yHeight}px`);
// 定义拖动参数
var $divMove = $(this).find('.code-btn-img'); // 拖动按钮
var $divWrap = $(this).find('.code-btn'); // 鼠标可拖拽区域
var mX = 0;
mY = 0; // 定义鼠标X轴Y轴
var dX = 0,
dY = 0; // 定义滑动区域左、上位置
var isDown = false; // touchmove标记
if (document.attachEvent) {
// ie的事件监听,拖拽div时禁止选中内容,firefox与chrome已在css中设置过-moz-user-select:
// none; -webkit-user-select:
// none;
$divMove[0].attachEvent('onselectstart', function () {
return false;
});
}
// 按钮拖动事件
$divMove.on('touchstart', function (e) {
// 清除提示信息
$this.find('.code-tip').html('');
var event = e || window.event;
mX = event.originalEvent.touches[0].pageX;
dX = $divWrap.offset().left;
dY = $divWrap.offset().top;
console.log('event', mX, dX, dY);
isDown = true; // 鼠标拖拽启
$(this).addClass('active');
// 修改按钮阴影
$divMove.css({
'box-shadow': '0 0 8px #666'
});
});
/* // 点击背景关闭
if (opts.maskclose) {
$this.find(".code-k-div").unbind('click').click(function() {
$this.html("");
})
}*/
// 关闭按钮事件
$this
.find('.close-dialog')
.unbind('click')
.click(function () {
opts.closecallback();
});
// 刷新code码
$this
.find('.icon-push')
.unbind('click')
.click(function () {
opts.refreshcallback();
});
// 鼠标点击松手事件
$divMove.on('touchend', function (e) {
var lastX = $this.find('.code-mask').offset().left - dX - 1;
isDown = false; // 鼠标拖拽启
$divMove.removeClass('active');
// 还原按钮阴影
$divMove.css({
'box-shadow': '0 0 3px #ccc'
});
var imgW = $('#BigImg').width();
returncode(lastX, imgW);
});
// 滑动事件
$divWrap.on('touchmove', function (event) {
var event = event || window.event;
var x = event.originalEvent.touches[0].pageX; // 鼠标滑动时的X轴
if (isDown) {
if (x > dX + 30 && x < dX + $(this).width() - 20) {
$divMove.css({
left: x - dX - 20 + 'px'
}); // div动态位置赋值
$this.find('.code-mask').css({
left: x - dX - 30 + 'px'
});
}
}
event.preventDefault();
});
// 返回坐标系
function returncode(xpos, imageW) {
opts.callback({
xpos: xpos,
imageW: imageW
});
}
// 验证数据
function checkcode(code) {
var iscur = true;
// 模拟ajax
setTimeout(function () {
if (iscur) {
checkcoderesult(1, '验证通过');
$this.find('.code-k-div').remove();
opts.callback({
code: 1000,
msg: '验证通过',
msgcode: '23dfdf123'
});
} else {
$divMove.addClass('error');
checkcoderesult(0, '验证不通过');
opts.callback({
code: 1001,
msg: '验证不通过'
});
setTimeout(function () {
$divMove.removeClass('error');
$this.find('.code-mask').animate(
{
left: '0px'
},
200
);
$divMove.animate(
{
left: '10px'
},
200
);
}, 300);
}
}, 500);
}
// 刷新图标
opts.refreshImg = function (data) {
console.log(data);
// $this.find(".code-img-con .code-front-img").attr("src", data.frontImg);
// $this.find(".code-img-con .code-back-img").attr("src", data.backGoundImg);
};
// 验证成功
opts.getsuccess = function () {
checkcoderesult(1, '验证通过');
setTimeout(function () {
$this.find('.code-k-div').remove();
}, 800);
};
// 验证失败
opts.getfail = function (txt) {
$divMove.addClass('error');
checkcoderesult(0, txt);
setTimeout(function () {
$divMove.removeClass('error');
$this.find('.code-mask').animate(
{
left: '0px'
},
200
);
$divMove.animate(
{
left: '10px'
},
200
);
}, 400);
};
// 验证结果
function checkcoderesult(i, txt) {
if (i == 0) {
$this.find('.code-tip').addClass('code-tip-red');
} else {
$this.find('.code-tip').addClass('code-tip-green');
}
$this.find('.code-tip').html(txt);
}
});
};
})(jQuery);
...@@ -121,17 +121,20 @@ const routerConfig = [ ...@@ -121,17 +121,20 @@ const routerConfig = [
name: 'sz-home', name: 'sz-home',
component: () => import('@/views/sz-home/index.vue'), component: () => import('@/views/sz-home/index.vue'),
}, },
{
path: '/login',
name: 'login',
component: () => import('@/views/login/index.vue'),
meta: {
keepAlive: true,
},
},
{
path: '/protocol',
name: 'protocol',
component: () => import('@/views/login/protocol.vue'),
},
]; ];
// // 无问卷-0001 有问卷未填写-0101 已填写问卷未出结果-0102 已出结果无需领用-0401 已出结果未预约-0201 已预约未采样-0301 已预约已采样-0302
// const routerMap = {
// '0001': null,
// '0101': null,
// '0102': null,
// '0401': null,
// '0201': '/appoint',
// '0301': null,
// '0302': null,
// };
router.beforeEach(async (to, from, next) => { router.beforeEach(async (to, from, next) => {
headerConfigByMeta(to); headerConfigByMeta(to);
next(); next();
......
...@@ -4,7 +4,9 @@ export default { ...@@ -4,7 +4,9 @@ export default {
namespaced: true, namespaced: true,
state: { state: {
insuranceInfo: {}, insuranceInfo: {},
orderInfo:{} orderInfo: {},
imgCodeData: '',
needTimer:null
}, },
mutations: { mutations: {
// 存值 // 存值
...@@ -13,7 +15,13 @@ export default { ...@@ -13,7 +15,13 @@ export default {
}, },
SET_ORDER_INFO(state, val = {}) { SET_ORDER_INFO(state, val = {}) {
state.orderInfo = val; state.orderInfo = val;
} },
SET_IMGDATA: (state, imgCodeData) => {
state.imgCodeData = imgCodeData;
},
SET_NEEDTIMER: (state, needTimer) => {
state.needTimer = needTimer;
},
}, },
actions: { actions: {
// 暂存保险订单信息 // 暂存保险订单信息
...@@ -26,6 +34,13 @@ export default { ...@@ -26,6 +34,13 @@ export default {
console.log('SET_ORDER_INFO', data); console.log('SET_ORDER_INFO', data);
store.set('orderInfo', data); store.set('orderInfo', data);
}, },
setNeedTimer({ commit }) {
commit('SET_NEEDTIMER', true);
},
setImgCodeData({ commit }, imgCodeData) {
console.log(22334);
commit('SET_IMGDATA', imgCodeData);
},
}, },
getters: { getters: {
// 获取 insuranceInfo 的值 // 获取 insuranceInfo 的值
......
此差异已折叠。
import { Toast } from 'vant';
// import { CryptoJS } from './aes';
// import { JSEncrypt } from 'jsencrypt';
// if (process.client) {
// require('jsencrypt');
// }
import { getPubKey } from '@/api/login';
let pubKey = '';
// generate key
function getAesKey(len) {
len = len || 16;
var aesKey = '';
var strList =
'0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
var strLen = strList.length;
for (var i = 0; i < len; i++) {
aesKey += strList.charAt(Math.floor(Math.random() * strLen));
}
return aesKey;
}
// 加密传参,发送请求
async function sendEncryptRequest(content, cb) {
console.log('content', content);
content = JSON.stringify(content); // 后端要求转 string
const params = null;
if (pubKey) {
// pubKey获取过就不用再获取了
const params = formatContent(content, pubKey);
cb && cb(params);
} else {
handleGetPubKey(content, cb);
}
return params;
}
// get public key
function handleGetPubKey(content, cb) {
// debugger;
getPubKey().then((res) => {
// console.log('>>>>>>>>>>>>>>>>>>>> publicKey: ', res);
/* if(res.status && res.status === 200) {
res = res.data;
}*/
console.log('res------', res);
// debugger;
if (res.code == '000000') {
pubKey = res.data;
if (cb) {
const params = formatContent(content, pubKey);
cb && cb(params);
}
} else {
Toast({
message: (res && res.message) || '接口出错',
duration: 1500,
});
}
});
}
// format account params
function formatContent(content, pubKey) {
// obj为具体的json传参
const aesKey = getAesKey(16);
const params = {
key: '',
content: '',
};
params.content = AesEncrypt(content, aesKey);
params.key = RsaEncrypt(aesKey, pubKey);
return params;
}
// AES encrypt
function AesEncrypt(content, aesKey) {
const sKey = CryptoJS.enc.Utf8.parse(aesKey);
const sContent = CryptoJS.enc.Utf8.parse(content);
const encrypted = CryptoJS.AES.encrypt(sContent, sKey, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7,
});
return encrypted.toString();
}
// RSA encrypt
function RsaEncrypt(aesKey, pubKey) {
const _encrypt = new JSEncrypt();
const boss_public_key = pubKey;
_encrypt.setPublicKey(boss_public_key);
const encrypted = _encrypt.encrypt(aesKey);
return encrypted;
}
export {
getAesKey,
sendEncryptRequest,
handleGetPubKey,
formatContent,
AesEncrypt,
RsaEncrypt,
};
此差异已折叠。
<template>
<div class="protocol">
<div class="protocol-name">
{{ name }}
</div>
<div
class="protocol-content"
v-html="content"
/>
</div>
</template>
<script>
import { getProtocolContentByType, getProtocolNameByType} from '@/api/login';
export default {
data() {
return {
name: '',
content: '',
title:''
};
},
mounted() {
const { type } = this.$route.query;
this.title = type == 5 ? '云鹊隐私声明' : '云鹊健康用户协议';
document.querySelector('title').innerHTML = this.title;
this.getProtocolNameByType(type);
this.getProtocolContentByType(type);
},
methods: {
getProtocolContentByType(type) {
getProtocolContentByType(type).then(res => {
console.log(res);
this.content = res.data;
console.log('1 ', this.content);
});
},
getProtocolNameByType(type) {
getProtocolNameByType(type).then(res => {
console.log(res);
this.name = res.data;
});
},
}
};
</script>
<style lang="scss" scoped>
.protocol{
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #fff;
}
.protocol-name{
height: 20px;
font-size: 20px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 600;
color: #02120F;
line-height: 20px;
text-align: center;
margin: 15px 0;
}
.protocol-content{
font-size: 15px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #02120F;
line-height: 23px;
width: 345px;
margin: 0 auto 50px auto;
}
</style>
...@@ -23,6 +23,7 @@ module.exports = { ...@@ -23,6 +23,7 @@ module.exports = {
vuex: 'Vuex', vuex: 'Vuex',
'vue-router': 'VueRouter', 'vue-router': 'VueRouter',
'vconsole': 'VConsole', 'vconsole': 'VConsole',
jqery: 'jQuery',
axios: 'axios', axios: 'axios',
vant: 'vant', vant: 'vant',
'crypto-js/crypto-js': 'CryptoJS', 'crypto-js/crypto-js': 'CryptoJS',
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册