Merge branch 'bhomebus' of http://192.168.5.5:10010/r/web/vue-smart-ai into...

heyujie

2022-01-26 46588b9183c0067fd5fc570c36cfd5ff02dad223

 src/pages/settings/views/NetSettings.vue

@@ -79,7 +79,11 @@
            </div>

          </div>

        </div>

        <div class="wifi-detail" v-if="activePage == 1 && inWifiDetail" ref="ipvHolder">

        <div

          class="wifi-detail"

          v-if="activePage == 1 && inWifiDetail"

          ref="ipvHolder"

        >

          <div class="title">无线网络</div>

          <div class="btns">

            <div class="cancel">删除</div>

@@ -89,11 +93,7 @@
          <div class="general-box">

            <div class="in-title">通用</div>



            <el-form

              :model="wifiForm"

              ref="wifiForm"

              class="join-form"

            >

            <el-form :model="wifiForm" ref="wifiForm" class="join-form">

              <el-form-item prop="name">

                <div class="p-title">名称</div>

                <!-- <div class="wifi-name">{{ 12123 }}</div> -->

@@ -116,22 +116,27 @@
            </el-form>

          </div>



          <switchBar

            :barName="`高级设置`"

            :value="isHighClass"

          ></switchBar>

          <switchBar :barName="`高级设置`" :value="isHighClass"></switchBar>



          <div class="general-box fold" :class="{'hidden':IPV4_hid}" >

            <div class="in-title">IPV4 
              <span class="icon iconfont icon-fold"

               @click="toggleFold('IPV4_hid')">&#xe757;</span>

          <div class="general-box fold" :class="{ hidden: IPV4_hid }">

            <div class="in-title">

              IPV4

              <span

                class="icon iconfont icon-fold"

                @click="toggleFold('IPV4_hid')"

                >&#xe757;</span

              >

            </div>



            <el-form :model="ipv4Form" :rules="ipv4FormRules" ref="ipv4Form">

              <el-form-item>

                <div class="p-title">方法</div>

                <el-select v-model="value" placeholder="请选择" size="small"

                :popper-append-to-body="false">

                <el-select

                  v-model="value"

                  placeholder="请选择"

                  size="small"

                  :popper-append-to-body="false"

                >

                  <el-option

                    v-for="item in options"

                    :key="item.value"

@@ -179,16 +184,29 @@
            </el-form>

          </div>



          <div class="general-box fold" :class="{'hidden':IPV6_hid}" ref="ipv6Holder">

            <div class="in-title">IPV6 
              <span class="icon iconfont icon-fold"

              @click="toggleFold('IPV6_hid')">&#xe757;</span>

          <div

            class="general-box fold"

            :class="{ hidden: IPV6_hid }"

            ref="ipv6Holder"

          >

            <div class="in-title">

              IPV6

              <span

                class="icon iconfont icon-fold"

                @click="toggleFold('IPV6_hid')"

                >&#xe757;</span

              >

            </div>



            <el-form :model="ipv6Form" :rules="ipv6FormRules" ref="ipv6Form">

              <el-form-item>

                <div class="p-title">方法</div>

                <el-select v-model="value" placeholder="请选择" size="small" :popper-append-to-body="false">

                <el-select

                  v-model="value"

                  placeholder="请选择"

                  size="small"

                  :popper-append-to-body="false"

                >

                  <el-option

                    v-for="item in options"

                    :key="item.value"

@@ -217,9 +235,17 @@
                    <i class="el-icon-remove-outline" @click="minusPrefix"></i>

                  </div>

                  <div class="ad">

                    <i class="el-icon-circle-plus-outline" @click="+(ipv6Form.prefix)++"></i>

                    <i

                      class="el-icon-circle-plus-outline"

                      @click="+ipv6Form.prefix++"

                    ></i>

                  </div>

                  <div class="ad"><i class="el-icon-refresh-left" @click="ipv6Form.prefix=''"></i></div>

                  <div class="ad">

                    <i

                      class="el-icon-refresh-left"

                      @click="ipv6Form.prefix = ''"

                    ></i>

                  </div>

                </div>

              </el-form-item>



@@ -352,9 +378,9 @@
import ipInput from "../components/IPInput";

import switchBar from "../components/switchBar";



import WifiGateway from '../components/WifiGateway'

import LoraGateway from '../components/LoraGateway'

import MqttGateway from '../components/MqttGateway'

import WifiGateway from "../components/WifiGateway";

import LoraGateway from "../components/LoraGateway";

import MqttGateway from "../components/MqttGateway";



export default {

  components: {

@@ -362,7 +388,7 @@
    switchBar,

    WifiGateway,

    LoraGateway,

    MqttGateway

    MqttGateway,

  },

  data() {

    const checkPwd = (rule, value, callback) => {

@@ -433,7 +459,7 @@
      ],

      value: "",

      IPV4_hid: false,

      IPV6_hid: false

      IPV6_hid: false,

    };

  },

  mounted() {

@@ -442,8 +468,8 @@
  },

  methods: {

    minusPrefix(){

      debugger

      this.ipv6Form.prefix

      debugger;

      this.ipv6Form.prefix;

    },

    switchNetCard(item) {

      if (item.active) {

@@ -512,7 +538,7 @@
      if (i == 0) {

        this.ruleForm.deviceName = "";

        this.ruleForm.port = "";

        this.getCurServer()

        this.getCurServer();

      }      

      if (i == 1) {

        this.inWifiDetail = false;

@@ -575,16 +601,18 @@
      });

    },

    toggleFold(tog) {

    const demo = this.$refs.ipvHolder

      const demo = this.$refs.ipvHolder;

    if(!(this.IPV4_hid&&!this.IPV6_hid)){

       setTimeout(() => {

       demo.scrollIntoView({block: "end", inline: "nearest",behavior: 'smooth'})

          demo.scrollIntoView({

            block: "end",

            inline: "nearest",

            behavior: "smooth",

          });

       }, 300);

    }

    this[tog] = !this[tog]

     
     
     }

      this[tog] = !this[tog];

    },

  },

  computed: {

    showStatus() {

@@ -727,8 +755,9 @@
      height: 48px;

      font-size: 16px;

      line-height: 48px;

      color: #4F4F4F;

      font-weight: bold;    background: #F2F2F7;

      color: #4f4f4f;

      font-weight: bold;

      background: #f2f2f7;

    border-radius: 8px;

    margin-bottom: 4px;

    }

@@ -757,7 +786,7 @@
        border: 2px solid #409eff !important;

      }

      .el-select-dropdown__item {

        color: #4F4F4F;

        color: #4f4f4f;

        height: 32px;

        font-size: 12px;

        line-height: 32px;

@@ -806,7 +835,7 @@
        width: 100%;

      }

      .el-select .el-input .el-select__caret {

        color: #4F4F4F;

        color: #4f4f4f;

        font-size: 14px;

        font-weight: 600;

      }

@@ -823,7 +852,7 @@
      }

      .switch-bar .name {

        font-size: 14px;

        color: #4F4F4F;

        color: #4f4f4f;

        font-weight: bold;

      }

      .wifi-option {

@@ -839,7 +868,7 @@
        border-radius: 8px;

        .name {

          font-size: 14px;

          color: #4F4F4F;

          color: #4f4f4f;

          font-weight: bold;

          .icon {

            color: #4e94ff;

@@ -900,7 +929,7 @@
          padding: 14px 20px;

          font-weight: bold;

          font-size: 14px;

          color: #4F4F4F;

          color: #4f4f4f;

        }

        .ip-input-container {

          max-width: none !important;

@@ -966,13 +995,15 @@
          font-size: 15px;

          font-weight: bold;

          font-size: 14px;

          color: #4F4F4F;

          color: #4f4f4f;

        }

        .right {

          display: flex;

          align-items: center;

          .el-switch__core {

            height: 14px;

            background-color: var(--colorCard) !important;

            border-color: var(--colorCard) !important;

          }

          .el-switch.is-checked .el-switch__core::after {

            left: 100%;

@@ -995,7 +1026,7 @@
            margin-right: 15px;

          }

          .good {

            color: #4e94ff;

            color: var(--colorCard);

            font-size: 16px;

          }

          .bad {