| | |
| | | <!-- <span v-if="showStatus && i == 2" class="status">已连接</span> -->
|
| | | </div>
|
| | | </div>
|
| | | <div class="net-right">
|
| | | <div class="net-right" v-loading="configLoading">
|
| | | <div class="net-set" v-if="activePage == 0">
|
| | | <div class="title">网络设置</div>
|
| | | <el-form :model="ruleForm" :rules="rules" ref="joinForm" class="join-form">
|
| | |
| | | ],
|
| | | value: "",
|
| | | IPV4_hid: false,
|
| | | IPV6_hid: false
|
| | | IPV6_hid: false,
|
| | | configLoading: false
|
| | | }
|
| | | },
|
| | | mounted() {
|
| | |
| | | },
|
| | | methods: {
|
| | | minusPrefix() {
|
| | | debugger
|
| | | this.ipv6Form.prefix
|
| | | },
|
| | | switchNetCard(item) {
|
| | |
| | | this.activePage = i
|
| | | },
|
| | | saveWire(ifname) {
|
| | | // let data = {
|
| | | // ip: this.wireForm.ip,
|
| | | // gateway: this.wireForm.gateway,
|
| | | // dns: this.wireForm.dns,
|
| | | // subMask: this.wireForm.subMask,
|
| | | // ifname: this.activeWireItem.name,
|
| | | // };
|
| | | // setNetWorkCard(data).then(
|
| | | // (res) => {
|
| | | // if (res && res.success) {
|
| | | // this.$message.success(res.data);
|
| | | // }
|
| | | // },
|
| | | // (err) => {
|
| | | // this.$message.error("保存失败:" + err.msg);
|
| | | // }
|
| | | // );
|
| | |
|
| | | this.$refs["wireForm"].validate((valid) => {
|
| | | if (valid) {
|
| | | let data = {
|
| | |
| | | ifname: this.activeWireItem.name
|
| | | }
|
| | |
|
| | | let newUri = location.protocol + "//" + data.ip + location.port == 80 ? "" : ":" + location.port
|
| | |
|
| | | if (this.wireForm.ip !== this.originalConfig.ip) {
|
| | | var changeIPTimer = setTimeout(() => {
|
| | | this.$alert(
|
| | | '<strong>您已修改了服务器ip, 请重新登录</strong><a target="_parent" href="' +
|
| | | newUri +
|
| | | '"> ' +
|
| | | newUri +
|
| | | "<a/>",
|
| | | "提示",
|
| | | {
|
| | | dangerouslyUseHTMLString: true,
|
| | | customClass: "noticeBox"
|
| | | }
|
| | | )
|
| | | }, 10000)
|
| | | }
|
| | | let newUri = location.protocol + "//" + data.ip + (location.port == 80 ? "" : ":" + location.port)
|
| | |
|
| | | this.$confirm("确认需要修改服务器配置吗?", {
|
| | | center: true,
|
| | |
| | | confirmButtonClass: "comfirm-class-sure"
|
| | | })
|
| | | .then(() => {
|
| | | this.configLoading = true
|
| | | if (this.wireForm.ip !== this.originalConfig.ip) {
|
| | | this.configLoading = false
|
| | | console.log("set time out")
|
| | | var changeIPTimer = setTimeout(() => {
|
| | | this.$alert(
|
| | | '<strong>您已修改了服务器ip, 请重新登录</strong><a target="_parent" href="' +
|
| | | newUri +
|
| | | '"> ' +
|
| | | newUri +
|
| | | "<a/>",
|
| | | "提示",
|
| | | {
|
| | | dangerouslyUseHTMLString: true,
|
| | | customClass: "noticeBox"
|
| | | }
|
| | | )
|
| | | }, 10000)
|
| | | }
|
| | |
|
| | | setNetWorkCard(data)
|
| | | .then((rsp) => {
|
| | | this.configLoading = false
|
| | | if (rsp && rsp.success) {
|
| | | this.$notify({
|
| | | type: "success",
|
| | |
| | | })
|
| | | }
|
| | | })
|
| | | .catch((err) => {
|
| | | clearTimeout(changeIPTimer)
|
| | | this.$notify({
|
| | | type: "error",
|
| | | message: "保存失败"
|
| | | })
|
| | | })
|
| | | .catch((err) => {})
|
| | | this.$message({
|
| | | message: "操作完成,请稍后",
|
| | | type: "success"
|
| | |
| | | width: 100%;
|
| | | }
|
| | | .wire {
|
| | | width: 456px;
|
| | | // width: 456px;
|
| | | margin: 0 auto;
|
| | | }
|
| | | .wire-detail {
|
| | | width: 456px;
|
| | | // width: 456px;
|
| | | margin: 0 auto;
|
| | | .title {
|
| | | font-size: 16px;
|
| | |
| | | }
|
| | | }
|
| | | .net-set {
|
| | | max-width: 456px;
|
| | | // max-width: 456px;
|
| | | margin: 0 auto;
|
| | | .title {
|
| | | font-size: 16px;
|
| | |
| | | max-width: none !important;
|
| | | }
|
| | | .wifi-set {
|
| | | max-width: 456px;
|
| | | // max-width: 456px;
|
| | | margin: 0 auto;
|
| | | .switch-bar {
|
| | | background: #f2f2f7;
|
| | |
| | | }
|
| | | }
|
| | | .wifi-detail {
|
| | | max-width: 454px;
|
| | | // max-width: 454px;
|
| | | margin: 0 auto;
|
| | | transition: all 0.3s linear 0s;
|
| | | .general-box {
|
| | |
| | | margin-bottom: 20px;
|
| | | &.fold {
|
| | | height: 342px;
|
| | |
|
| | | .in-title {
|
| | | display: flex;
|
| | | justify-content: space-between;
|
| | | }
|
| | |
|
| | | .icon-fold {
|
| | | display: inline-block;
|
| | | font-size: 14px;
|
| | | margin-left: 360px;
|
| | | transition: all 0.3s linear 0s;
|
| | | cursor: pointer;
|
| | | }
|
| | |
| | | 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%;
|
| | | margin-left: -12px;
|
| | | }
|
| | |
|
| | | .el-switch.is-checked .el-switch__core {
|
| | | background-color: var(--colorCard) !important;
|
| | | border-color: var(--colorCard) !important;
|
| | | }
|
| | |
|
| | | .el-switch__core:after {
|
| | | content: "";
|
| | | position: absolute;
|