<template>
|
<view class="content">
|
<uni-nav-bar left-icon="back" left-text="返回" @clickLeft="goBack" title="通用设置" statusBar="true"></uni-nav-bar>
|
<view class="setting-content">
|
<view class="title">
|
服务器设置
|
</view>
|
<view class="uni-form-item uni-column">
|
<view class="title">IP</view>
|
<!-- <input class="uni-input" focus placeholder="IP地址" /> -->
|
<IPInput :ip="sys_ip" @on-blur="sys_ip= arguments[0]"></IPInput>
|
</view>
|
<view class="uni-form-item uni-column">
|
<view class="title">端口</view>
|
<input class="uni-input" v-model="port" placeholder="" />
|
</view>
|
</view>
|
<button type="default" @tap="commit">确认</button>
|
<!-- <uni-popup ref="popup" type="center" background-color="#fff" :animation="false">中间弹出 Popup</uni-popup> -->
|
<uni-popup ref="popup" type="message">
|
<uni-popup-message type="success" message="修改成功" :duration="2000"></uni-popup-message>
|
</uni-popup>
|
</view>
|
</template>
|
|
<script>
|
import imagePopper from "@/components/imagePopper.vue"
|
import IPInput from "@/components/IPInput.vue"
|
export default {
|
components: {
|
imagePopper,
|
IPInput
|
},
|
data() {
|
return {
|
sys_ip: "",
|
port: ""
|
}
|
},
|
mounted() {},
|
onBackPress(e) {
|
console.log(e);
|
uni.navigateTo({
|
url: '/pages/index/index'
|
})
|
// return true
|
},
|
|
methods: {
|
goBack() {
|
uni.navigateTo({
|
url: "../index/index"
|
})
|
},
|
commit() {
|
// console.log(`${this.sys_ip}`,`${this.port}`)
|
// this.$mqtt.options.host = `${this.sys_ip}:${this.port}`
|
// this.$mqtt.options.href = "ws://192.168.20.189:15672/ws";
|
// this.$mqtt.options.hostname = `${this.sys_ip}`
|
// this.$mqtt.options.port = `${this.port}`;
|
// this.$mqtt.reconnect()
|
|
|
this.$refs.popup.open('top')
|
// setImmediate(()=>{
|
// console.log(this.$mqtt)
|
// },1000)
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.uni-input {
|
border: 1px solid black;
|
}
|
page {
|
background-color: rgba(243, 244, 246, 1);
|
}
|
.uni-form-item {
|
display: flex;
|
align-items: center;
|
// justify-content: space-around;
|
margin-top: 20px;
|
}
|
.setting-content{
|
padding: 40rpx 40rpx;
|
.title{
|
min-width: 80rpx;
|
}
|
.uni-input[data-v-9543fcb0] {
|
border: 1px solid #dcdfe6;
|
background: #fff;
|
}
|
|
uni-input {
|
display: block;
|
font-size: 16px;
|
line-height: 1.8em;
|
height: 1.8em;
|
min-height: 1.8em;
|
overflow: hidden;
|
}
|
.uni-input-input{
|
padding-left: 20rpx;
|
}
|
}
|
uni-button[type=default] {
|
color: #fff;
|
|
background-color: rgba(239, 128, 72, 1);
|
/* position: absolute; */
|
/* bottom: 0; */
|
position: absolute;
|
bottom: 50px;
|
left: calc(50% - 40%);
|
width: 80%;
|
}
|
|
uni-button:after {
|
border: 0;
|
}
|
|
uni-button {
|
font-size: 16px;
|
line-height: 2.4;
|
border-radius: 15px;
|
}
|
</style>
|
