Skip to content

V
vue-gic-header
Commit 2a9cc050 by zhu_yu_dan
Options

add:头部增加数据模式

parent e15beb92
Showing with 397 additions and 11 deletions
.babelrc
......@@ -2,5 +2,8 @@
"presets": [
["env", { "modules": false }],
"stage-3"
]
],
"plugins": ["transform-runtime"]
}
dist/vue-gic-header.js
This source diff could not be displayed because it is too large. You can view the blob instead.
dist/vue-gic-header.js.map
This source diff could not be displayed because it is too large. You can view the blob instead.
package-lock.json
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json
{
"_from": "@gic-test/vue-gic-header",
"_from": "@gic-test/vue-gic-header@1.3.36",
"_id": "@gic-test/vue-gic-header@1.3.36",
"_inBundle": false,
"_integrity": "sha1-O/dJHter2FxrYs2EGFMG+gWD+FM=",
"_location": "/@gic-test/vue-gic-header",
"_phantomChildren": {},
"_requested": {
"type": "tag",
"type": "version",
"registry": true,
"raw": "@gic-test/vue-gic-header",
"raw": "@gic-test/vue-gic-header@1.3.36",
"name": "@gic-test/vue-gic-header",
"escapedName": "@gic-test%2fvue-gic-header",
"scope": "@gic-test",
"rawSpec": "",
"rawSpec": "1.3.36",
"saveSpec": null,
"fetchSpec": "latest"
"fetchSpec": "1.3.36"
},
"_requiredBy": [
"#USER",
......@@ -22,8 +22,8 @@
],
"_resolved": "http://www.gicdev.com:7001/@gic-test/vue-gic-header/download/@gic-test/vue-gic-header-1.3.36.tgz",
"_shasum": "3bf7491ed7abd85c6b62cd84185306fa0583f853",
"_spec": "@gic-test/vue-gic-header",
"_where": "/Users/maydays/damo/plugin-test",
"_spec": "@gic-test/vue-gic-header@1.3.36",
"_where": "D:\\my\\git\\gic-web",
"author": {
"name": "fairyly",
"email": "498745097@qq.com"
......@@ -43,6 +43,7 @@
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.6.0",
"babel-preset-stage-3": "^6.24.1",
"cross-env": "^5.0.5",
......@@ -65,5 +66,5 @@
"build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
"dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot"
},
"version": "1.3.37"
"version": "1.3.38"
}
src/lib/dataType.vue 0 → 100644
<template>
<el-dialog
title="申请风险模式"
class="apply-danger-wrap"
:visible.sync="dialogVisible"
:modal-append-to-body="false"
@close="sendTypeToFar"
width="800px">
<div class="apply-danger-content">
<div class="lt-content">
<div class="question-wrap">
<p class="question">Q：什么是风险模式？</p>
<p class="answer">风险模式即可查看完整的会员卡号和会同手机号码，GIC不会在页面中对数据做加密处理。</p>
</div>
<div class="use-time-wrap">
<p>选择风险模式的使用时间：</p>
<el-radio-group v-model="useTime">
<el-radio :label="1">5分钟</el-radio>
<el-radio :label="2">15分钟</el-radio>
<el-radio :label="3">1小时</el-radio>
<el-radio :label="4">6小时</el-radio>
<el-radio :label="5">24小时</el-radio>
</el-radio-group>
</div>
<div class="use-time-wrap">
<p>申请理由：</p>
<el-input
type="textarea"
placeholder="请输入申请理由"
resize="none"
v-model="textarea">
</el-input>
</div>
<div class="btn">
<el-button @click="sureApplyBtn" type="primary" :disabled="textarea==''?true:false">确认申请</el-button>
</div>
</div>
<div class="rt-content">
<ul>
<li v-for="item in tableData" :key="item.auditorId">
<p class="checker-name">{{ item.auditorName }}</p>
<p>{{ item.mobilePhone }}</p>
</li>
</ul>
<div v-if="tableData && tableData.length<1" class="no-data-wrap">
<div class="no_checker_icon" >
<img src="./no_checker_icon.png" alt="">
</div>
<p>暂无审核人员</p>
</div>
</div>
</div>
</el-dialog>
</template>
<script>
import qs from 'qs';
export default {
name: "dataType",
props:{
dataType:{
type:String,
default:'0'
}
},
data () {
return {
repProjectName: 'gic-web', // 项目名
dialogVisible:false,
useTime:1,
textarea:'',
btnBool:true,
baseUrl: '',
tableData: [],
}
},
beforeMount() {
var host = window.location.origin;
if (host.indexOf('localhost') != '-1') {
this.baseUrl = 'http://gicdev.demogic.com';
}else {
this.baseUrl = host
}
},
created(){
this.init();
},
mounted(){
},
methods:{
async init(){
if(this.dataType == '1'){
let res = await this.axios.post(this.baseUrl+'/api-admin/check-risk-mode',qs.stringify({
requestProject:this.repProjectName,
}))
var data = res.data;
if(data.errorCode==0){
this.tableData = await this.getCheckerList();
this.dialogVisible = true;
}else if(data.errorCode==1){ // 缺少审核员
var html = '<p style="font-size:14px;color:#606266;line-height:20px;margin-bottom:4px;">该商户还没有审核员，请联系超级管理员新增审核员！</p>';
html += '<p style="font-size:13px;color:#606266;line-height:18px;">超级管理员：<span style="color:#1890ff;">13267666789</span></p>';
this.$confirm(html, '提示', {
confirmButtonText: '知道了',
cancelButtonText: '取消',
showCancelButton:false,
type: 'warning',
dangerouslyUseHTMLString: true
}).then(() => {
this.sendTypeToFar();
}).catch(() => {
this.sendTypeToFar();
});
}else if(data.errorCode==2){ // 已提交，不能重复提交
let total = data.result;
let second = (total % 60 < 10)? '0' + total % 60 : total % 60;
this.timeValue = Math.floor(total / 60) + ':' + second;
this.$message.warning('请勿重复申请，请在'+ this.timeValue +'分钟后重试');
this.sendTypeToFar();
}else if(data.errorCode==3){ // 当前已是风险模式
var html = '<p style="font-size:14px;color:#606266;">当前已经是风险模式</p>';;
this.$confirm(html, '提示', {
confirmButtonText: '刷新页面',
cancelButtonText: '取消',
// showCancelButton:false,
// closeOnClickModal:false,
// showClose:false,
dangerouslyUseHTMLString: true,
type: 'warning',
}).then(() => {
location.reload(); // 强制刷新页面
}).catch(() => {
this.sendTypeToFar();
});
}else if(data.errorCode==4){ // 商户审核员没有绑定openid
this.$message.warning('审核员未绑定达摩网络公众号');
this.sendTypeToFar();
}else{
this.$message.error(data.message);
}
}
},
getCheckerList(){ // 获取审核员列表
return new Promise((resolve,reject)=>{
this.axios.post(this.baseUrl+'/api-admin/list-auditor',qs.stringify({
requestProject:this.repProjectName
})).then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
var dataArr = resData.result?resData.result:[];
resolve(dataArr);
}else{
reject([])
this.$message.error({
duration: 1000,
message: resData.message
});
}
})
})
},
sendTypeToFar(){ // 给父组件传值 0 安全模式
this.$emit('sendDataType','0')
},
sureApplyBtn(){ // 弹框按钮 确认申请
if(this.btnBool){
this.btnBool = false;
this.sendTypeToFar(); // 刚申请时 转回安全模式
this.axios.post(this.baseUrl+'/api-admin/apply-risk-mode',qs.stringify({
requestProject:this.repProjectName,
duration:this.useTime,
applyReason:this.textarea,
})).then((res)=>{
var data = res.data;
this.btnBool = true;
if(data.errorCode==0){
this.$message.success("风险模式申请提交成功");
this.dialogVisible = false;
}else{
this.$message.error(data.message);
}
})
}
},
}
}
</script>
<style lang="less" scoped>
.apply-danger-content{
display: flex;
.lt-content{
padding: 20px 20px 0 20px;
flex: 0 0 540px;
width: 540px;
border-right: 1px solid #dcdfe6;
.question-wrap{
padding: 13px 20px;
background: #F4F4F5;
border-radius: 6px;
color: #606266;
margin-bottom: 50px;
.question{
font-size: 14px;
line-height: 20px;
margin-bottom: 10px;
}
.answer{
font-size: 13px;
line-height: 18px;
}
}
.use-time-wrap{
line-height: 1;
margin-bottom: 24px;
position: relative;
p{
color: #303133;
font-size: 14px;
line-height: 20px;
margin-bottom: 17px;
}
}
.btn{
text-align: center;
margin: 45px 0 30px 0;
}
}
.rt-content{
flex: 1;
overflow-y: auto;
height: 470px;
li{
padding: 13px 0 13px 20px;
border-bottom: 1px solid #dcdfe6;
font-size: 14px;
color: #606266;
line-height: 20px;
&:last-child{
margin-top: 4px;
}
.checker-name{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
}
}
.no-data-wrap{
text-align: center;
padding: 40px 0 0 0;
line-height: 1;
.no_checker_icon{
width: 80px;
height: 56px;
margin: 0 auto;
margin-bottom: 22px;
img{
width: 100%;
}
}
p{
color: #909399;
}
}
.apply-danger-wrap /deep/ .el-dialog__header{
padding: 0 20px;
height: 54px;
border-bottom: 1px solid #dcdfe6;
}
.apply-danger-wrap /deep/ .el-dialog__body{
padding: 0;
}
</style>
src/lib/vue-gic-header.vue
......@@ -57,7 +57,23 @@
<el-button size="medium" :type="accountStatus === 2 ? 'warning' : 'danger'" plain round @click="toRecharge">{{accountStatus === 2 ?'账户已欠费':'账户异常'}}</el-button>
</el-tooltip>
</div>
<!-- 模式 -->
<div class="data-type-wrap fr">
<span class="safe-type" @click="changeDataType('0')">
<span class="el-radio__input" :class="dataType == '0' ? 'is-checked' : ''">
<span class="el-radio__inner"></span>
</span><span class="el-radio__label">安全模式</span>
</span>
<span class="danger-type" @click="changeDataType('1')">
<span class="el-radio__input" :class="dataType == '1' ? 'is-checked' : ''">
<span class="el-radio__inner"></span>
</span><span class="el-radio__label">风险模式<span v-show="total>0" style="margin-left:4px">{{ timeValue }}</span></span>
</span>
</div>
</div>
<!-- 申请模式弹框 -->
<dataType ref="dataTypeWrap" :dataType="dataType" @sendDataType="getDataType"></dataType>
<!-- 修改用户信息 -->
<el-dialog title="账户信息" class="user-form-dialog" :visible="userFormVisible" width="425px" :modal-append-to-body="false" :before-close="userFormClose">
......@@ -121,6 +137,7 @@
<script>
// import { getRequest } from './api';
import qs from 'qs';
import dataType from './dataType';
export default {
name: 'vue-gic-header',
props: ['menuRouter','collapseFlag','projectName'],
......@@ -205,6 +222,11 @@
routePathName: '', // 当前路由值
accountStatus:1, // 账户状态
// 模式 安全 or 风险
dataType:'0',
timeValue:'',
total:0,
}
},
beforeMount() {
......@@ -594,6 +616,60 @@
},
toRecharge() {
window.location.href = "/marketing/#/recharge/do";
},
// 刚进页面时判断是什么模式
initDataType(){
var that = this;
that.axios.post(that.baseUrl+'/api-admin/time-risk-mode',qs.stringify({
requestProject:that.repProjectName,
})).then((res)=>{
var data = res.data;
if(data.errorCode==0){
that.dataType = data.result?"1":"0";
if(data.result){
that.total = data.result;
let timer = window.setInterval(() => {
that.total--;
let second = (that.total % 60 < 10)? '0' + that.total % 60 : that.total % 60;
that.timeValue = Math.floor(that.total / 60) + ':' + second;
if(that.total<=0){
window.clearInterval(timer);
var html = '<p style="font-size:14px;color:#606266;">风险模式已到时</p>';;
that.$confirm(html, '提示', {
confirmButtonText: '刷新页面',
cancelButtonText: '取消',
showCancelButton:false,
closeOnClickModal:false,
showClose:false,
dangerouslyUseHTMLString: true,
type: 'warning',
}).then(() => {
location.reload(); // 强制刷新页面
}).catch(() => {
});
}
},1000)
}
}else{
that.$message.error(data.message);
}
})
},
// 切换数据模式
changeDataType(type){
this.dataType = type;
this.$nextTick(_ => {
if(this.dataType=="1"){
this.$refs.dataTypeWrap.init();
}
});
},
// 获取子组件的数据模式
getDataType(val){
// console.log(val);
this.dataType = val;
}
},
watch: {
......@@ -654,8 +730,13 @@
// 获取头部菜单
this.getMenu();
this.getAccountStateInfo();
},
// 获取初始数据模式
this.initDataType();
},
components:{
dataType
}
}
</script>
......@@ -983,7 +1064,31 @@
.el-popover.user-header-pop {
min-width: 95px;
}
// 数据模式
.data-type-wrap{
margin-right: 30px;
color: #606266;
.safe-type{
margin-right: 15px;
}
}
.safe-type,.danger-type{
cursor: pointer;
}
.safe-type /deep/ .el-radio__input.is-checked .el-radio__inner{
border-color: #52C41A;
background: #52C41A;
}
.safe-type /deep/ .el-radio__input.is-checked+.el-radio__label{
color: #52C41A;
}
.danger-type /deep/ .el-radio__input.is-checked .el-radio__inner{
border-color: #FAAD14;
background: #FAAD14;
}
.danger-type /deep/ .el-radio__input.is-checked+.el-radio__label{
color: #FAAD14;
}
/*弹窗*/
/*.user-dialog-wrap /deep/ {
position: relative;*/
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment