<template>
  <view class="list">
    <view v-if="false">
      <view
        v-for="(item, key) in serverList"
        :key="key"
        class="card"
        @click="handleSwitchServer(item)"
      >
        {{ item }}
      </view>
    </view>
    <view class="form">
      <div class="row">
        <text style="height: 40px;line-height: 40px;">协议</text>
        <input v-model="form.deal" placeholder="请输入协议" style="height: 40px;line-height: 40px;">
      </div>
      <div class="row">
        <text style="height: 40px;line-height: 40px;">IP</text>
        <input v-model="form.ip" placeholder="请输入IP" style="height: 40px;line-height: 40px;">
      </div>
      <div class="row">
        <text style="height: 40px;line-height: 40px;">端口</text>
        <input v-model="form.port" placeholder="请输入端口" style="height: 40px;line-height: 40px;">
      </div>
    </view>
    <view
      class="card-list-item"
      style="margin: 12px 0;display: grid;grid-template-columns: 1fr;grid-template-rows: 1fr;"
    >
      <button
        type="primary"
        style="width: calc(100% - 8px);margin: 0 4px;"
        @click="handleSaveServerConfig"
      >保存配置</button>
      <button
        type="primary"
        style="width: calc(100% - 8px);margin: 4px;"
        @click="handleReadServerConfig"
      >读取配置</button>
    </view>
  </view>
</template>

<script>
import {
  getFileStorage,
  setFileStorage
} from '@/unit/fileStorage.js'
export default {
  data() {
    return {
      form: {
        port: '',
        ip: '',
        deal: ''
      }
      // url: 'http://47.107.70.17:48080', // 测试环境'
      // url: 'http://113.105.183.190:48081', // UAT
      // url: 'http://218.2.10.30:48080', // 生产环境
    }
  },
  mounted() {
    // this.handleReadServerConfig();
  },
  methods: {
    goHome: function() {
      uni.navigateTo({
        url: '/pages/login/loginPage'
      })
    },
    handleSwitchServer: function(item) {
      uni.$baseUrl = item
    },
    handleReadServerConfig: function() {
      // #ifdef APP-PLUS
      getFileStorage('serverConfig.txt')
        .then(data => {
          if (data == null) {
            this.form = {
              port: '',
              ip: '',
              deal: ''
            }
          } else {
            Object.assign(this.form, JSON.parse(data))
          }
        })
      // #endif
    },
    handleSaveServerConfig: function() {
      // #ifdef APP-PLUS
      setFileStorage('serverConfig.txt', 0, this.form)
      // #endif

      uni.$baseUrl = this.form.deal + '://' + this.form.ip + ':' + this.form.port
      uni.showToast({
        title: '保存成功，当前服务为：' + uni.$baseUrl,
        duration: 1000,
        icon: 'none'
      })
      setTimeout(() => {
        uni.navigateTo({
          url: '/pages/login/loginPage'
        })
      }, 600)
    }

  }
}
</script>

<style lang="scss" scoped>
	uni-page {
		background-color: gray;
	}

	.gui-header-leader-btns {
		color: white;
		font-size: 24px !important;
		margin-left: 24rpx;
	}

	.list {
		.card {
			height: 35px;
			line-height: 35px;
			margin: 4px 12px;
			padding: 0 8px;
			border-radius: 8px;
			font-size: 14px;
			font-weight: bold;
			font-family: Arial, Helvetica, sans-serif;
			background-color: skyblue;
		}
	}

	.form {
		height: calc(100vh - 120px);
		background-color: #e9e9ea;

		.row {
			height: 80px;
			padding: 0 12px 4px 12px;
			margin-bottom: 2px;
			background-color: white;

			uni-text:nth-of-type(1) {
				font-size: 16px;
				font-weight: bold;
				height: 40px;
				line-height: 40px;
			}
		}
	}
</style>
