You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
119 lines
4.1 KiB
119 lines
4.1 KiB
<template>
|
|
<div ref="appbase">
|
|
<el-dialog
|
|
title="绑定下载页域名"
|
|
:close-on-click-modal="false"
|
|
:close-on-press-escape="false"
|
|
:visible.sync="bind_domain_sure"
|
|
width="666px">
|
|
<bind-domain transitionName="bind-user-domain"/>
|
|
</el-dialog>
|
|
<canvas ref="canvas" class="canvas" @mousemove="canvas_move" @mouseleave="canvas_leave"/>
|
|
<el-container>
|
|
<div style="margin: -5px 20px" v-if="$store.state.show_domain_msg">
|
|
<el-alert
|
|
center
|
|
type="error"
|
|
:closable="false"
|
|
effect="dark">
|
|
<div slot="title">
|
|
<span :underline="false"
|
|
class="domian-tip-bar">应用分发请绑定您自己的域名,平台分发域名可能因不可违因素更换,将导致您的应用无法访问</span>
|
|
<el-button size="medium" @click="bind_domain_sure=true">立即绑定</el-button>
|
|
</div>
|
|
</el-alert>
|
|
</div>
|
|
<el-header>
|
|
<FirHeader/>
|
|
</el-header>
|
|
<div class="pbody">
|
|
<router-view/>
|
|
</div>
|
|
<el-footer>
|
|
<el-divider/>
|
|
<FirFooter/>
|
|
</el-footer>
|
|
<el-tooltip placement="top" content="回到顶部">
|
|
<back-to-top :custom-style="myBackToTopStyle" :visibility-height="300" :back-position="50"
|
|
transition-name="fade"/>
|
|
</el-tooltip>
|
|
</el-container>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import FirHeader from "@/components/FirHeader";
|
|
import FirFooter from "@/components/FirFooter";
|
|
import BackToTop from "@/components/base/BackToTop";
|
|
import BindDomain from "@/components/base/BindDomain";
|
|
import {show_beautpic,} from "@/utils";
|
|
|
|
export default {
|
|
name: "FirBase",
|
|
components: {FirFooter, FirHeader, BackToTop, BindDomain},
|
|
data() {
|
|
return {
|
|
mousePosition: {},
|
|
bind_domain_sure: false,
|
|
active: 1,
|
|
domain_name: '',
|
|
bind_status: false,
|
|
domain_tData: [{'type': 'CNAME', 'host': 'xxx', 'dns': 'demo.xxx.cn'}],
|
|
myBackToTopStyle: {
|
|
right: '80px',
|
|
bottom: '100px',
|
|
width: '40px',
|
|
height: '40px',
|
|
'border-radius': '4px',
|
|
'line-height': '45px',
|
|
background: '#e7eaf1'
|
|
}
|
|
}
|
|
},
|
|
mounted() {
|
|
let canvas = this.$refs.canvas;
|
|
show_beautpic(this, canvas, 200);
|
|
}, watch: {
|
|
'$store.state.userinfo.domain_name': function () {
|
|
if (this.$store.state.userinfo.domain_name) {
|
|
this.$store.dispatch("dodomainshow", false);
|
|
} else {
|
|
this.$store.dispatch("dodomainshow", true);
|
|
}
|
|
},
|
|
'$store.state.domain_action': function () {
|
|
if (this.$store.state.domain_action) {
|
|
this.$store.dispatch("dodomainaction", false);
|
|
this.bind_domain_sure = true;
|
|
}
|
|
},
|
|
}
|
|
, methods: {
|
|
canvas_move(e) {
|
|
this.mousePosition.x = e.pageX;
|
|
this.mousePosition.y = e.pageY;
|
|
},
|
|
// eslint-disable-next-line no-unused-vars
|
|
canvas_leave(e) {
|
|
let canvas = this.$refs.canvas;
|
|
this.mousePosition.x = canvas.width / 2;
|
|
this.mousePosition.y = canvas.height / 2;
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.pbody {
|
|
padding-top: 30px;
|
|
}
|
|
|
|
.domian-tip-bar {
|
|
line-height: 43px;
|
|
color: #fff;
|
|
font-weight: 500;
|
|
font-size: medium;
|
|
margin-right: 20px;
|
|
}
|
|
</style>
|
|
|