Vent-App/pages/ipConfig/ipConfig.vue

  <template>
  <view class="zai-box">
    <scroll-view scroll-y class="page">
      <view class="IPSet">
        <span class="text-style"
          ><u-button
            :plain="true"
            color="#18a5ff"
            size="small"
            :text="IPSet ? IPSet : '选择IP地址'"
            @tap="changeIP()"
          ></u-button
        ></span>
        <u-picker
          :show="ipShow"
          :columns="IpConfig"
          @cancel="ipShow = false"
          @confirm="selectIpAddr"
          keyName="label"
        ></u-picker>
      </view>
    </scroll-view>
  </view>
</template>

<script>
import configService from "@/common/service/config.service.js";

export default {
  data() {
    return {
      ipShow: false,
      IPSet: "",
      IpConfig: [
        [
          { label: "大海则煤矿", value: "http://172.16.53.16:9999" },
          { label: "大柳塔井", value: "http://10.248.135.10:9999" },
          { label: "活鸡兔井", value: "http://10.248.135.121:9999" },
          { label: "寸草塔二矿", value: "http://10.246.63.5:9999" },
          { label: "乌兰木伦", value: "http://10.246.183.35:9999" },
          { label: "哈拉沟煤矿", value: "http://10.248.223.12:9999" },
          { label: "布尔台", value: "http://10.246.95.4:9999" },
          { label: "上湾", value: "http://10.246.167.205:9999" },
          { label: "锦界", value: "http://10.248.151.42:9999" },
          { label: "补连塔", value: "http://10.246.175.16:9999" },
          { label: "寸草塔", value: "http://10.246.23.171:9999" },
          { label: "柳塔", value: "http://10.246.87.121:9999" },
          { label: "石圪台", value: "http://10.246.191.13:9999" },
          { label: "榆家梁", value: "http://10.248.143.211:9999" },
          { label: "开发", value: "http://182.92.126.35:9999" },
          { label: "测试", value: "http://182.92.126.35:9998" },
        ],
      ],
      fromSetting: false, // 是否来自设置页
      ip: "",
    };
  },
  onLoad(options) {
    this.fromSetting = options.from === "settings"; // 判断来源
    this.ip = uni.getStorageSync("serverIP") || ""; // 读取已存IP
  },
  computed: {},
  methods: {
    selectIpAddr(e) {
      this.ipShow = false;
      this.ip = e.value[0].value;
      const fullURL = e.value[0].value;
      this.IPSet = e.value[0].label;
      configService.apiUrl = fullURL;
      uni.setStorageSync("selectedIP", true);
      uni.setStorageSync("apiUrl", fullURL);
      // uni.showModal({
      //   title: "提示",
      //   content: fullURL,
      //   cancelText: "取消",
      //   confirmText: "确认",
      // });
      uni.redirectTo({
        url: "/pages/login/login?reload=" + 1,
      });
    },
    changeIP() {
      this.ipShow = true;
    },
  },
  beforeDestroy() {},
};
</script>

<style>
.login-paddingtop {
  padding-top: 300upx;
}

.zai-box {
  height: 100vh;
  background-image: url(/static/desk-img/loginBg.png);
  background-size: cover;
  padding: 0 20upx;
  padding-top: 100upx;
  position: relative;
}

.zai-logo {
  width: 200upx;
  height: 150px;
}

.zai-title {
  margin-top: 20upx;
  font-size: 58upx;
  color: #000000;
  text-align: center;
}

.input-placeholder,
.zai-input {
  color: #94afce;
}

.zai-btn {
  background: #ff65a3;
  color: #fff;
  border: 0;
  border-radius: 100upx;
  font-size: 36upx;
}

.zai-btn:after {
  border: 0;
}

/*按钮点击效果*/
.zai-btn.button-hover {
  transform: translate(1upx, 1upx);
}

.IPSet {
  display: flex;
  flex-direction: column;
}

.text-style {
  margin: 20px;
}
</style>