7.13(优化
This commit is contained in:
Hong
301
src/views/maintain/auth_lxk/index.vue
Normal file
301
src/views/maintain/auth_lxk/index.vue
Normal file
@@ -0,0 +1,301 @@
|
||||
<template>
|
||||
<div class="divBox">
|
||||
<el-card class="box-card">
|
||||
<div class="auth acea-row row-between-wrapper">
|
||||
<div class="acea-row row-middle">
|
||||
<div v-if="status === 1" class="text">
|
||||
<div>商业授权</div>
|
||||
<div class="code">授权码：{{ authCode }}</div>
|
||||
</div>
|
||||
<div v-if="status === -1" class="text">请申请授权</div>
|
||||
</div>
|
||||
<div>
|
||||
<el-button v-if="status === 1" @click="toLxk()">进入官网</el-button>
|
||||
<el-button v-else-if="status === -1" type="primary" @click="applyAuth('java_mer')">申请授权</el-button>
|
||||
<el-button v-else-if="status === 2" type="primary" @click="applyAuth('java_mer')">重新申请</el-button>
|
||||
<el-button v-else-if="status === 0" class="grey">审核中</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card v-if="!copyright && status == 1" class="box-card" style="margin-top: 15px">
|
||||
<div class="auth acea-row row-between-wrapper">
|
||||
<div class="acea-row row-middle">
|
||||
<i class="el-icon-s-help iconIos blue" />
|
||||
<div class="text">
|
||||
<div>去版权服务</div>
|
||||
<div class="code">购买之后可以设置</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="primary" @click="applyAuth('copyright')">去版权</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card v-if="copyright" style="margin-top: 15px">
|
||||
<el-form :model="copyForm" :rules="rules" ref="copyForm" label-width="100px" class="demo-ruleForm">
|
||||
<el-form-item label="修改授权信息" prop="name">
|
||||
<el-input v-model.trim="copyForm.companyName"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="上传授权图片" prop="region">
|
||||
<div class="authorized" @click="modalPicTap()">
|
||||
<div class="uploadPictrue" v-if="copyForm.companyImage">
|
||||
<img v-lazy="copyForm.companyImage" />
|
||||
</div>
|
||||
<div class="upload" v-else>
|
||||
<div class="iconfont">+</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="prompt">建议尺寸：宽290px*高100px</div>
|
||||
</el-form-item>
|
||||
<el-form-item v-hasPermi="['platform:copyright:update:company:info']">
|
||||
<el-button type="primary" @click="saveCopyRight('copyForm')">保存</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-dialog
|
||||
v-if="isTemplate"
|
||||
v-model="isTemplate"
|
||||
:visible.sync="isTemplate"
|
||||
:close-on-click-modal="false"
|
||||
:before-close="handleClose"
|
||||
width="440px"
|
||||
:title="title"
|
||||
close-on-click-modal
|
||||
class="mapBox"
|
||||
custom-class="dialog-scustom"
|
||||
style="padding: 0"
|
||||
>
|
||||
<iframe :src="iframeUrl" style="width: 400px; height: 600px" frameborder="0" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { copyrightInfoApi } from '@/api/authInformation';
|
||||
import { Debounce } from '@/utils/validate';
|
||||
import { checkPermi } from '@/utils/permission'; // 权限判断函数
|
||||
export default {
|
||||
name: 'index',
|
||||
data() {
|
||||
return {
|
||||
baseUrl: '',
|
||||
iframeUrl: '',
|
||||
captchs: '',
|
||||
authCode: '',
|
||||
status: null,
|
||||
dayNum: 0,
|
||||
copyright: '',
|
||||
isTemplate: false,
|
||||
price: '',
|
||||
proPrice: '',
|
||||
productStatus: false,
|
||||
copyForm: {
|
||||
companyName: '',
|
||||
companyImage: '',
|
||||
},
|
||||
success: false,
|
||||
payType: '',
|
||||
disabled: false,
|
||||
isShow: false, // 验证码模态框是否出现
|
||||
active: 0,
|
||||
timer: null,
|
||||
version: '',
|
||||
label: '',
|
||||
productType: '',
|
||||
modalPic: false,
|
||||
isChoice: '单选',
|
||||
gridPic: {
|
||||
xl: 6,
|
||||
lg: 8,
|
||||
md: 12,
|
||||
sm: 12,
|
||||
xs: 12,
|
||||
},
|
||||
gridBtn: {
|
||||
xl: 4,
|
||||
lg: 8,
|
||||
md: 8,
|
||||
sm: 8,
|
||||
xs: 8,
|
||||
},
|
||||
title: '',
|
||||
rules: {
|
||||
companyName: [{ required: true, message: '请输入修改授权信息', trigger: 'blur' }],
|
||||
companyImage: [{ required: true, message: '请上传授权图片', trigger: 'change' }],
|
||||
},
|
||||
loading: false,
|
||||
domainUrl: '',
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
if (checkPermi(['platform:copyright:get:info'])) this.getAuth();
|
||||
window.addEventListener('message', (e) => {
|
||||
if (e.data.type == 'onComplete') {
|
||||
this.handleClose();
|
||||
}
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
checkPermi,
|
||||
// 选择图片
|
||||
modalPicTap() {
|
||||
const _this = this;
|
||||
this.$modalUpload(function (img) {
|
||||
_this.copyForm.companyImage = img[0].sattDir;
|
||||
});
|
||||
},
|
||||
toLxk() {
|
||||
window.open('');
|
||||
},
|
||||
handleClose() {
|
||||
this.getAuth();
|
||||
this.iframeUrl = '';
|
||||
this.isTemplate = false;
|
||||
},
|
||||
// 申请授权
|
||||
applyAuth(product) {
|
||||
this.productType = product;
|
||||
this.title = product === 'copyright' ? '去版权' : '商业授权';
|
||||
let host = location.host;
|
||||
let hostData = host.split('.');
|
||||
if (hostData[0] === 'test' && hostData.length === 4) {
|
||||
host = host.replace('test.', '');
|
||||
} else if (hostData[0] === 'www' && hostData.length === 3) {
|
||||
host = host.replace('www.', '');
|
||||
}
|
||||
this.iframeUrl =
|
||||
this.baseUrl +
|
||||
'?url=' +
|
||||
this.domainUrl +
|
||||
'&product=' +
|
||||
product +
|
||||
'&version=' +
|
||||
this.version +
|
||||
'&label=' +
|
||||
this.label;
|
||||
this.isTemplate = true;
|
||||
},
|
||||
getAuth() {
|
||||
copyrightInfoApi().then((res) => {
|
||||
const data = res || {};
|
||||
this.label = data.label;
|
||||
this.version = data.version;
|
||||
this.authCode = data.authCode || '';
|
||||
this.status = data.status;
|
||||
this.copyright = data.copyright;
|
||||
this.copyForm.companyName = data.companyName;
|
||||
this.copyForm.companyImage = data.companyImage;
|
||||
this.domainUrl = data.domainUrl.indexOf('https://') !== -1 ? data.domainUrl.slice(8) : data.domainUrl;
|
||||
});
|
||||
},
|
||||
//保存版权信息
|
||||
saveCopyRight: Debounce(function (form) {
|
||||
this.$refs[form].validate((valid) => {
|
||||
if (!valid) return;
|
||||
saveLxkCopyRight(this.copyForm).then((res) => {
|
||||
this.$message.success('保存成功');
|
||||
this.getAuth();
|
||||
});
|
||||
});
|
||||
}),
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.auth {
|
||||
padding: 9px 16px 9px 10px;
|
||||
}
|
||||
.auth .iconIos {
|
||||
font-size: 40px;
|
||||
margin-right: 10px;
|
||||
color: #001529;
|
||||
}
|
||||
.auth .text {
|
||||
font-weight: 400;
|
||||
color: rgba(0, 0, 0, 1);
|
||||
font-size: 18px;
|
||||
}
|
||||
.auth .price {
|
||||
color: red;
|
||||
font-size: 18px;
|
||||
}
|
||||
.auth .text .code {
|
||||
font-size: 14px;
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
margin-top: 5px;
|
||||
}
|
||||
.auth .blue {
|
||||
color: #1890ff !important;
|
||||
}
|
||||
.auth .red {
|
||||
color: #ed4014 !important;
|
||||
}
|
||||
.grey {
|
||||
background-color: #999999;
|
||||
border-color: #999999;
|
||||
color: #fff;
|
||||
}
|
||||
.update {
|
||||
font-size: 13px;
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
padding-right: 12px;
|
||||
}
|
||||
.prompt {
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
.code .input .ivu-input {
|
||||
border-radius: 4px 0 0 4px !important;
|
||||
}
|
||||
.code .pictrue {
|
||||
height: 32px;
|
||||
width: 17%;
|
||||
}
|
||||
.submit {
|
||||
width: 100%;
|
||||
}
|
||||
.code .input {
|
||||
width: 83%;
|
||||
}
|
||||
.authorized {
|
||||
display: flex;
|
||||
margin-bottom: 14px;
|
||||
.upload {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
background: rgba(0, 0, 0, 0.02);
|
||||
border-radius: 4px;
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
}
|
||||
.upload .iconfont {
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
}
|
||||
.uploadPictrue {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border: 1px dotted rgba(0, 0, 0, 0.1);
|
||||
margin-right: 10px;
|
||||
}
|
||||
.uploadPictrue img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.customer {
|
||||
border-right: 0;
|
||||
}
|
||||
.customer a {
|
||||
font-size: 12px;
|
||||
}
|
||||
.ivu-input-group-prepend,
|
||||
.ivu-input-group-append {
|
||||
background-color: #fff;
|
||||
}
|
||||
.ivu-input-group .ivu-input {
|
||||
border-right: 0 !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user