157 lines
4.2 KiB
Vue
157 lines
4.2 KiB
Vue
<template>
|
||
<div class="container">
|
||
<!-- <p>width:{{ width }}</p>
|
||
<p>height: {{ height }}</p> -->
|
||
<div class="content">
|
||
<h1>天能涂板暂存库可视化看板</h1>
|
||
<div class="login_wrap">
|
||
<h2>系统配置</h2>
|
||
<div class="zd-row item_wrap">
|
||
<div class="zd-col-8 label">域名地址</div>
|
||
<input type="text" class="input" v-model="baseUrl">
|
||
</div>
|
||
<div class="zd-row item_wrap">
|
||
<div class="zd-col-8 label">刷新时间(秒)</div>
|
||
<input type="number" class="input" v-model="setTime">
|
||
</div>
|
||
<!-- <div class="zd-row item_wrap">
|
||
<div class="zd-col-6 label">设备看板</div>
|
||
<el-select v-model="index" placeholder="请选择">
|
||
<el-option
|
||
v-for="item in options"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
</div> -->
|
||
<div class="zd-row">
|
||
<button class="zd-col-24 btn" @click="_config">配置</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data () {
|
||
return {
|
||
// options: [{value: '1', label: '新-左'}],
|
||
// index: this.$store.getters.equipId,
|
||
baseUrl: this.$store.getters.baseUrl,
|
||
setTime: this.$store.getters.setTime / 1000,
|
||
fullscreen: false,
|
||
width: '',
|
||
height: ''
|
||
}
|
||
},
|
||
methods: {
|
||
checkWH () {
|
||
setTimeout(() => {
|
||
this.width = document.body.clientWidth
|
||
this.height = document.body.clientHeight
|
||
}, 8000)
|
||
},
|
||
_config () {
|
||
if (this.setTime > 10800) {
|
||
this.$message({
|
||
message: '刷新时间设置过长',
|
||
type: 'warning'
|
||
})
|
||
return
|
||
}
|
||
let obj = {
|
||
baseUrl: this.baseUrl,
|
||
setTime: this.setTime * 1000,
|
||
equipId: this.index
|
||
}
|
||
this.$store.dispatch('setConfig', obj)
|
||
this.$router.push('/index')
|
||
// let element = document.documentElement
|
||
// if (this.fullscreen) {
|
||
// if (document.exitFullscreen) {
|
||
// document.exitFullscreen()
|
||
// } else if (document.webkitCancelFullScreen) {
|
||
// document.webkitCancelFullScreen()
|
||
// } else if (document.mozCancelFullScreen) {
|
||
// document.mozCancelFullScreen()
|
||
// } else if (document.msExitFullscreen) {
|
||
// document.msExitFullscreen()
|
||
// }
|
||
// } else {
|
||
// if (element.requestFullscreen) {
|
||
// element.requestFullscreen()
|
||
// } else if (element.webkitRequestFullScreen) {
|
||
// element.webkitRequestFullScreen()
|
||
// } else if (element.mozRequestFullScreen) {
|
||
// element.mozRequestFullScreen()
|
||
// } else if (element.msRequestFullscreen) {
|
||
// // IE11
|
||
// element.msRequestFullscreen()
|
||
// }
|
||
// }
|
||
// this.fullscreen = !this.fullscreen
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="stylus" scoped>
|
||
@import '~@style/mixin'
|
||
.container
|
||
_wh(100%, 100%)
|
||
background center / 100% 100% url('../images/bg.jpg') no-repeat
|
||
p
|
||
_font(12px, 12px ,#fff,,)
|
||
.content
|
||
position relative
|
||
z-index 1
|
||
top 50%
|
||
left 50%
|
||
width 25%
|
||
min-width 890px
|
||
transform translateX(-50%) translateY(-50%)
|
||
h1
|
||
font-size .3rem
|
||
font-family: 'YouSheBiaoTiHei';
|
||
font-weight: 400;
|
||
color: transparent;
|
||
line-height .3rem
|
||
opacity: 0.89;
|
||
background: linear-gradient(0deg, #AAD0F6 0%, #D7E7F5 53.3154296875%, #E0EAF6 100%);
|
||
filter: drop-shadow(#092F6D 1px 4px 1px);
|
||
-webkit-background-clip: text;
|
||
background-clip: text;
|
||
text-align center
|
||
margin-bottom 5%
|
||
.login_wrap
|
||
width 100%
|
||
background #103170 center / 100% 100% url('../images/bg-m_2.png') no-repeat
|
||
padding 3% 10% 6% 10%
|
||
h2
|
||
_font(.15rem, .15rem, #9BB9DD,700,center)
|
||
margin-bottom 4%
|
||
.item_wrap
|
||
background linear-gradient(to bottom, #081438, #0c205a)
|
||
border 1px solid #4a61a5
|
||
padding 2% 2%
|
||
margin-bottom 3%
|
||
.label
|
||
_font(.12rem, .25rem, #fff,,left)
|
||
.input
|
||
width 100%
|
||
_font(.12rem, .25rem, #fff,,left)
|
||
background-color transparent
|
||
.btn
|
||
background-color #2778f3
|
||
border-radius 6px
|
||
height .4rem
|
||
font-size .17rem
|
||
color #fff
|
||
letter-spacing .05rem
|
||
line-height .4rem
|
||
outline none
|
||
border none
|
||
</style>
|