终端移植SmartAI的界面
blame | 历史 | 补丁 | 提交 | 提交对比 | ignore whitespace
zhangzengfei
2021-07-07 0b737708e696c45720499759b5c31aced87fdbb6 
 src/pages/systemSettings/views/NetSettings.vue


@@ -9,7 +9,10 @@


          @click="openRight(item, i)"



          ref="leftbar"



        >



          <div><span class="icon iconfont">&#xe646;</span>{{ item.name }}</div>



          <div>



            <span class="icon iconfont">&#xe646;</span>



            {{ item.name }}



          </div>



          <div class="status">已连接</div>



        </div>



      </div>



@@ -24,35 +27,23 @@


            label-width="150px"



          >



            <el-form-item label="设备名称" prop="deviceName">



              <el-input



                v-model="ruleForm.deviceName"



                size="small"



                placeholder="必填"



              ></el-input>



              <el-input v-model="ruleForm.deviceName" size="small" placeholder="必填"></el-input>



            </el-form-item>







            <el-form-item label="端口" prop="port">



              <el-input



                v-model="ruleForm.port"



                placeholder="选填，外部访问的端口"



                size="small"



              ></el-input>



              <el-input v-model="ruleForm.port" placeholder="选填，外部访问的端口" size="small"></el-input>



            </el-form-item>



          </el-form>



          <div class="save-btn" @click="saveServerName">保存</div>



        </div>







        <div class="wifi" v-if="activePage == '无线网络' && !inWifiDetail">



          <switchBar



            :barName="`无线网卡`"



            @switchChange="wifiControl"



            :value="isOpenWifi"



          ></switchBar>



          <switchBar :barName="`无线网卡`" @switchChange="wifiControl" :value="isOpenWifi"></switchBar>







          <div class="wifi-option" v-for="(item, i) in wifiList" :key="i">



            <div class="name">



              <span class="icon iconfont">&#xe646;</span>



              <span> {{ item.name }} </span>



              <span>{{ item.name }}</span>



            </div>







            <div class="more-detail">



@@ -61,15 +52,11 @@


                class="icon iconfont"



                style="margin-left: 10px; cursor: pointer"



                @click="checkWifi(item)"



                >&#xe640;</span



              >



              >&#xe640;</span>



            </div>



          </div>



        </div>



        <div



          class="wifi-detail"



          v-if="activePage == '无线网络' && inWifiDetail"



        >



        <div class="wifi-detail" v-if="activePage == '无线网络' && inWifiDetail">



          <div class="btns">



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



            <div class="right">断开连接</div>



@@ -89,28 +76,14 @@


            </el-form-item>







            <el-form-item label="密码" prop="password">



              <el-input



                v-model="wifiForm.password"



                placeholder="请输入密码"



                size="small"



                show-password



              ></el-input>



              <el-input v-model="wifiForm.password" placeholder="请输入密码" size="small" show-password></el-input>



            </el-form-item>



          </el-form>







          <switchBar



            :barName="`高级设置`"



            @switchChange="highClassSetting"



            :value="isHighClass"



          ></switchBar>



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



          <div class="title">IPV4</div>







          <el-form



            :model="ipv4Form"



            :rules="ipv4FormRules"



            ref="ipv4Form"



            label-width="150px"



          >



          <el-form :model="ipv4Form" :rules="ipv4FormRules" ref="ipv4Form" label-width="150px">



            <el-form-item label="方法">



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



                <el-option



@@ -118,51 +91,30 @@


                  :key="item.value"



                  :label="item.label"



                  :value="item.value"



                >



                </el-option>



                ></el-option>



              </el-select>



            </el-form-item>



            <el-form-item label="IP" prop="ip">



              <ip-input



                :ip="ipv4Form.ip"



                @on-blur="ipv4Form.ip = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv4Form.ip" @on-blur="ipv4Form.ip = arguments[0]"></ip-input>



            </el-form-item>



            <el-form-item label="子网掩码" prop="subMask">



              <ip-input



                :ip="ipv4Form.subMask"



                @on-blur="ipv4Form.subMask = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv4Form.subMask" @on-blur="ipv4Form.subMask = arguments[0]"></ip-input>



            </el-form-item>







            <el-form-item label="网关" prop="gateway">



              <ip-input



                :ip="ipv4Form.gateway"



                @on-blur="ipv4Form.gateway = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv4Form.gateway" @on-blur="ipv4Form.gateway = arguments[0]"></ip-input>



            </el-form-item>



            <el-form-item label="首选DNS" prop="dns">



              <ip-input



                :ip="ipv4Form.dns1"



                @on-blur="ipv4Form.dns1 = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv4Form.dns1" @on-blur="ipv4Form.dns1 = arguments[0]"></ip-input>



            </el-form-item>



            <el-form-item label="备用DNS" prop="dns">



              <ip-input



                :ip="ipv4Form.dns2"



                @on-blur="ipv4Form.dns2 = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv4Form.dns2" @on-blur="ipv4Form.dns2 = arguments[0]"></ip-input>



            </el-form-item>



          </el-form>







          <div class="title">IPV6</div>







          <el-form



            :model="ipv6Form"



            :rules="ipv6FormRules"



            ref="ipv4Form"



            label-width="150px"



          >



          <el-form :model="ipv6Form" :rules="ipv6FormRules" ref="ipv4Form" label-width="150px">



            <el-form-item label="方法">



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



                <el-option



@@ -170,23 +122,15 @@


                  :key="item.value"



                  :label="item.label"



                  :value="item.value"



                >



                </el-option>



                ></el-option>



              </el-select>



            </el-form-item>



            <el-form-item label="IP地址" prop="ip">



              <ip-input



                :ip="ipv6Form.ip"



                @on-blur="ipv6Form.ip = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv6Form.ip" @on-blur="ipv6Form.ip = arguments[0]"></ip-input>



            </el-form-item>



            <el-form-item label="前缀" prop="subMask">



              <div style="display: flex">



                <el-input



                  v-model="wifiForm.password"



                  placeholder=""



                  size="small"



                ></el-input>



                <el-input v-model="wifiForm.password" placeholder size="small"></el-input>







                <div class="ad">-</div>



                <div class="ad">+</div>



@@ -195,22 +139,13 @@


            </el-form-item>







            <el-form-item label="网关" prop="gateway">



              <ip-input



                :ip="ipv6Form.gateway"



                @on-blur="ipv6Form.gateway = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv6Form.gateway" @on-blur="ipv6Form.gateway = arguments[0]"></ip-input>



            </el-form-item>



            <el-form-item label="首选DNS" prop="dns">



              <ip-input



                :ip="ipv6Form.dns1"



                @on-blur="ipv6Form.dns1 = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv6Form.dns1" @on-blur="ipv6Form.dns1 = arguments[0]"></ip-input>



            </el-form-item>



            <el-form-item label="备用DNS" prop="dns">



              <ip-input



                :ip="ipv6Form.dns2"



                @on-blur="ipv6Form.dns2 = arguments[0]"



              ></ip-input>



              <ip-input :ip="ipv6Form.dns2" @on-blur="ipv6Form.dns2 = arguments[0]"></ip-input>



            </el-form-item>



          </el-form>







@@ -221,12 +156,7 @@


        </div>







        <div class="wire" v-if="activePage == '有线网络' && !inWireDetail">



          <div



            class="wire-bar"



            v-for="(item, i) in wireArr"



            :key="i"



            @click.self="checkWire(item)"



          >



          <div class="wire-bar" v-for="(item, i) in wireArr" :key="i" @click.self="checkWire(item)">



            <div class="name">{{ "网络" + item.index }}</div>







            <div class="right">



@@ -236,25 +166,13 @@


                v-model="item.active"



                active-color="rgba(61, 104, 225, 1)"



                @change="switchNetCard"



              >



              </el-switch>



              ></el-switch>



            </div>











            


          </div>



        </div>



        <div



          class="wire-detail"



          v-if="activePage == '有线网络' && inWireDetail"



        >



        <div class="wire-detail" v-if="activePage == '有线网络' && inWireDetail">



          <div class="title">网络设置</div>



          <el-form



            :model="wireForm"



            :rules="wireFormRules"



            ref="wireForm"



            label-width="150px"



          >



          <el-form :model="wireForm" :rules="wireFormRules" ref="wireForm" label-width="150px">



            <el-form-item label="网络名称" prop="name">



              <div class="wifi-name">{{ "网络" + activeWireItem.index }}</div>



            </el-form-item>



@@ -262,29 +180,17 @@


              <div class="wifi-name">{{ activeWireItem.name }}</div>



            </el-form-item>



            <el-form-item label="IP" prop="ip">



              <ip-input



                :ip="wireForm.ip"



                @on-blur="wireForm.ip = arguments[0]"



              ></ip-input>



              <ip-input :ip="wireForm.ip" @on-blur="wireForm.ip = arguments[0]"></ip-input>



            </el-form-item>



            <el-form-item label="子网掩码" prop="subMask">



              <ip-input



                :ip="wireForm.subMask"



                @on-blur="wireForm.subMask = arguments[0]"



              ></ip-input>



              <ip-input :ip="wireForm.subMask" @on-blur="wireForm.subMask = arguments[0]"></ip-input>



            </el-form-item>







            <el-form-item label="网关" prop="gateway">



              <ip-input



                :ip="wireForm.gateway"



                @on-blur="wireForm.gateway = arguments[0]"



              ></ip-input>



              <ip-input :ip="wireForm.gateway" @on-blur="wireForm.gateway = arguments[0]"></ip-input>



            </el-form-item>



            <el-form-item label="DNS" prop="dns">



              <ip-input



                :ip="wireForm.dns"



                @on-blur="wireForm.dns = arguments[0]"



              ></ip-input>



              <ip-input :ip="wireForm.dns" @on-blur="wireForm.dns = arguments[0]"></ip-input>



            </el-form-item>



          </el-form>







@@ -329,6 +235,10 @@


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







export default {



  components: {



    ipInput,



    switchBar,



  },



  data() {



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



      if (!value) {



@@ -404,7 +314,7 @@


    this.getCurServer();



    this.fetchWireList();



  },



  beforeDestroy() {},



  beforeDestroy() { },



  props: ["barName"],



  methods: {



    // parseFlags(flags) {



@@ -434,10 +344,10 @@


              return {



                flags: itm.flags,



                index: itm.index,



                mtu:itm.mtu,



                mtu: itm.mtu,



                name: itm.name,



                wireless: itm.wireless,



                active:f



                active: f



              }



            });



        }



@@ -493,7 +403,7 @@


        }



      );



    },



    wifiControl(val) {},



    wifiControl(val) { },



    checkWifi() {



      this.inWifiDetail = true;



    },