|
|
@@ -0,0 +1,346 @@
|
|
|
+<template>
|
|
|
+ <view class="container">
|
|
|
+ <view class="setting">
|
|
|
+
|
|
|
+ <view class="prop-item">
|
|
|
+ <view class="prop-title">充电电流</view>
|
|
|
+ <view class="prop-value">
|
|
|
+ <view :style="item.style" class="value-tag" @click="checkItem(current,item)" v-for="item in current.items">
|
|
|
+ {{ item.text }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="prop-input" v-if="current.custom">
|
|
|
+ <input v-model="current.customValue" class="input" placeholder="请输入电流"/>
|
|
|
+ <view style="color: #0E9F9B">A</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ <view class="bottom-area">
|
|
|
+
|
|
|
+ <view class="btn" @click="confirm">确认</view>
|
|
|
+
|
|
|
+
|
|
|
+ <view class="areas">
|
|
|
+ <view class="areas-item" @click="sendMainboardCmd">
|
|
|
+ <view class="areas-img">
|
|
|
+ <image style="width: 50px;height: 50px" :src="imgUrl+'/seting/mainboard.png'"></image>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ <view>获取主板配置</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="areas-item" @click="resetMainboard">
|
|
|
+ <view class="areas-img">
|
|
|
+ <image style="width: 50px;height: 50px" :src="imgUrl+'/seting/reset.png'"></image>
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ <view >恢复默认配置</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="areas-item" @click="restartMainboard">
|
|
|
+ <view class="areas-img">
|
|
|
+ <image style="width: 50px;height: 50px" :src="imgUrl+'/seting/restart.png'"></image>
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ <view>重启充电桩</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {setCurrent, getMainbordConfig,sendMainboardCmd, reset, restart} from "@/utils/weitiandi/device/device.js";
|
|
|
+
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+
|
|
|
+ scriptTask:null,
|
|
|
+ deviceId: "",
|
|
|
+ ccid:"",
|
|
|
+ visitTime: "",
|
|
|
+ mainBoardInfo:{},
|
|
|
+ current: {
|
|
|
+ items: [
|
|
|
+ {text: "8A", style: "", value: 8},
|
|
|
+ {text: "10A", style: "", value: 10},
|
|
|
+ {text: "16A", style: "", value: 16},
|
|
|
+ {text: "32A", style: "", value: 32},
|
|
|
+ {text: "自定义", style: "", value: -1}
|
|
|
+ ],
|
|
|
+ custom: false,
|
|
|
+ customValue: ''
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ onUnload (){
|
|
|
+ this.closeSocket();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ imgUrl: function () {
|
|
|
+ return getApp().globalData.config.imgUrl;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(opt) {
|
|
|
+ this.deviceId = opt.id;
|
|
|
+ this.ccid = opt.ccid;
|
|
|
+ this.sendMainboardCmd();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ closeSocket(){
|
|
|
+ this.scriptTask.close();
|
|
|
+ },
|
|
|
+ initSocket(key){
|
|
|
+ let self = this;
|
|
|
+ let socketUrl = getApp().globalData.config.socketUrl
|
|
|
+ this.scriptTask = websocket({
|
|
|
+ url:"/"+key+"/",
|
|
|
+ });
|
|
|
+ let scriptTask = this.scriptTask;
|
|
|
+ scriptTask.onOpen(function (res) {
|
|
|
+ console.log('WebSocket连接已打开！');
|
|
|
+ self.connected = true;
|
|
|
+ });
|
|
|
+ scriptTask.onError(function (res) {
|
|
|
+ self.connected = false;
|
|
|
+ console.log(res);
|
|
|
+ });
|
|
|
+ scriptTask.onMessage(function (res) {
|
|
|
+ let data = JSON.parse(res.data);
|
|
|
+ let type = data.type;
|
|
|
+ let real_data = data.real_data;
|
|
|
+ if(type == 103){
|
|
|
+ self.portDetail = real_data;
|
|
|
+ self.$modal.closeLoading();
|
|
|
+ }
|
|
|
+ if(type == 116){
|
|
|
+ self.$modal.closeLoading();
|
|
|
+ }
|
|
|
+ if(type == 96){
|
|
|
+ self.mainBoardInfo = real_data;
|
|
|
+ self.formatMainboardData();
|
|
|
+ self.$modal.closeLoading();
|
|
|
+ }
|
|
|
+ console.log('收到服务器内容：' + JSON.stringify(data));
|
|
|
+ });
|
|
|
+ scriptTask.onClose(function (res) {
|
|
|
+ self.connected = true;
|
|
|
+ console.log('WebSocket 已关闭！');
|
|
|
+ });
|
|
|
+ },
|
|
|
+ formatMainboardData(){
|
|
|
+ let mainBoardInfo = this.mainBoardInfo;
|
|
|
+ let max_current = mainBoardInfo.max_current;
|
|
|
+ max_current = max_current/100;
|
|
|
+ this.setCurrent(max_current);
|
|
|
+ },
|
|
|
+ setCurrent(max_current){
|
|
|
+ this.current.currenValue = max_current;
|
|
|
+ let items = this.current.items;
|
|
|
+ let len = items.length;
|
|
|
+ let hasValue = false;
|
|
|
+ this.current.custom = false;
|
|
|
+ for (let i = 0; i < len; i++) {
|
|
|
+ let dian = items[i];
|
|
|
+ if(dian.value == max_current){
|
|
|
+ hasValue = true;
|
|
|
+ dian.style = "; background: #0E9F9B;color:white"
|
|
|
+ }else{
|
|
|
+ dian.style = "; background: rgb(227, 242, 245);color: #0E9F9B;"
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(!hasValue){
|
|
|
+ this.current.custom = true;
|
|
|
+ items[len-1].style = "; background: #0E9F9B;color:white"
|
|
|
+ }
|
|
|
+ this.current.customValue = max_current;
|
|
|
+ },
|
|
|
+ async checkItem(obj, item) {
|
|
|
+ let items = obj.items;
|
|
|
+ let len = items.length;
|
|
|
+ for (let i = 0; i < len; i++) {
|
|
|
+ let dian = items[i];
|
|
|
+ dian.style = "; background: rgb(227, 242, 245);color: #0E9F9B;"
|
|
|
+ }
|
|
|
+ item.style = "; background: #0E9F9B;color:white"
|
|
|
+ if (item.value == -1) {
|
|
|
+ obj.custom = true;
|
|
|
+ obj.customValue = 0;
|
|
|
+ } else {
|
|
|
+ obj.custom = false;
|
|
|
+ obj.customValue = item.value;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async confirm() {
|
|
|
+ let currenValue = this.current.customValue;
|
|
|
+ currenValue = currenValue *100;
|
|
|
+ let deviceId = this.deviceId;
|
|
|
+ // 发送到后端
|
|
|
+ let self = this;
|
|
|
+ this.$modal.loading("保存中。。");
|
|
|
+ setCurrent({deviceId: deviceId,ccid:this.ccid},currenValue).then(res => {
|
|
|
+ this.$modal.showToast("保存成功");
|
|
|
+ setTimeout(function(){
|
|
|
+ self.sendMainboardCmd();
|
|
|
+ },1000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ sendMainboardCmd() {
|
|
|
+ let deviceId = this.deviceId;
|
|
|
+ // 获取主板配置
|
|
|
+ sendMainboardCmd({deviceId: deviceId,ccid:this.ccid}).then(res => {
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getMainboardConfig(){
|
|
|
+ this.startTimer();
|
|
|
+ },
|
|
|
+ startTimer(){
|
|
|
+ let self = this;
|
|
|
+ this.timer = setTimeout(function (){
|
|
|
+ getMainbordConfig({deviceId: self.deviceId,ccid:this.ccid},self.visitTime).then(res=>{
|
|
|
+ let data = res.data;
|
|
|
+ if(data != null){
|
|
|
+ self.mainBoardInfo = data;
|
|
|
+ self.formatMainboardData();
|
|
|
+ self.$modal.closeLoading();
|
|
|
+ }else{
|
|
|
+ self.startTimer();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },1000);
|
|
|
+ },
|
|
|
+ resetMainboard() {
|
|
|
+ let deviceId = this.deviceId;
|
|
|
+ // 恢复默认配置
|
|
|
+ let self = this;
|
|
|
+ this.$modal.loading("正在重置，请稍等...");
|
|
|
+ reset({deviceId:deviceId,ccid:this.ccid}).then(res => {
|
|
|
+ setTimeout(function(){
|
|
|
+ self.sendMainboardCmd();
|
|
|
+ },1000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async restartMainboard() {
|
|
|
+ let deviceId = this.deviceId;
|
|
|
+ this.$modal.loading("正在重启中，请稍等...");
|
|
|
+ // 重启充电桩
|
|
|
+ let self = this;
|
|
|
+ restart({deviceId:deviceId,ccid:this.ccid}).then(res => {
|
|
|
+ setTimeout(function(){
|
|
|
+ self.sendMainboardCmd();
|
|
|
+ },1000)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+
|
|
|
+.container {
|
|
|
+ position: absolute;
|
|
|
+ inset: 0;
|
|
|
+ background: rgb(249, 252, 255);
|
|
|
+}
|
|
|
+
|
|
|
+.prop-item {
|
|
|
+ padding: 2vh;
|
|
|
+}
|
|
|
+
|
|
|
+.prop-value {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+}
|
|
|
+
|
|
|
+.prop-title {
|
|
|
+ color: #252525;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-bottom: 2.5vh;
|
|
|
+}
|
|
|
+
|
|
|
+.value-tag {
|
|
|
+ background: rgb(227, 242, 245);
|
|
|
+ color: #0E9F9B;
|
|
|
+ width: 14vw;
|
|
|
+ height: 4vh;
|
|
|
+ line-height: 4vh;
|
|
|
+ border-radius: 3vw;
|
|
|
+ text-align: center;
|
|
|
+ margin: 0 1vw;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.prop-input {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ line-height: 4vh;
|
|
|
+ margin: 2vh 0;
|
|
|
+}
|
|
|
+
|
|
|
+.input {
|
|
|
+ background: rgb(227, 242, 245);
|
|
|
+ border-radius: 30px;
|
|
|
+ font-size: 12px;
|
|
|
+ height: 4vh;
|
|
|
+ padding: 0 2vw;
|
|
|
+ margin: 0 1vw;
|
|
|
+ width: 90%;
|
|
|
+}
|
|
|
+
|
|
|
+.bottom-area {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ height: 24vh;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.btn {
|
|
|
+ background: #0E9F9B;
|
|
|
+ text-align: center;
|
|
|
+ color: white;
|
|
|
+ height: 6vh;
|
|
|
+ line-height: 6vh;
|
|
|
+ margin: 0 5vh;
|
|
|
+ border-radius: 1vh;
|
|
|
+ border-style: none;
|
|
|
+}
|
|
|
+
|
|
|
+.btn1 {
|
|
|
+ background: #f9fcff;
|
|
|
+ /* text-align: center;
|
|
|
+ color: white;
|
|
|
+ height:6vh;
|
|
|
+ line-height: 6vh;
|
|
|
+ margin:0 5vh;
|
|
|
+ border-radius: 1vh; */
|
|
|
+ border-color: transparent;
|
|
|
+}
|
|
|
+
|
|
|
+.areas {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 3vh
|
|
|
+}
|
|
|
+
|
|
|
+.areas-item {
|
|
|
+ width: 33%;
|
|
|
+}
|
|
|
+
|
|
|
+.areas-img {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+</style>
|
