<template>
	<view class="zd_container">
		<nav-bar :title="$t('login.settings')" :inner2="true" @goIn="goIn" :show1="false"></nav-bar>
		<view class="zd_content">
			<view class="zd_wrapper">
				<view class="input-wrap">
					<view class="input-label">{{$t('setting.language')}}</view>
					<div class="select_wrap">
						<uni-data-select v-model="index1" :localdata="options1" @change="selectChange1"></uni-data-select>
					</div>
				</view>
				<view class="input-wrap">
					<view class="input-label">{{$t('setting.server')}}</view>
					<input type="text" class="setup-input" v-model="addrip">
				</view>
				<view class="input-wrap">
					<view class="input-label">{{$t('setting.refresh')}}(s)</view>
					<input type="text" class="setup-input" v-model="setTime">
				</view>
				<view class="input-wrap">
					<view class="input-label">{{$t('setting.customer-label-printing')}}</view>
					<div class="select_wrap">
						<uni-data-select v-model="index" :placeholder="$t('uni.dataSelect.placeholder')" :emptyTips="$t('uni.dataSelect.emptyTips')" :localdata="options" @change="selectChange"></uni-data-select>
					</div>
				</view>
			</view>
		</view>
		<view class="submit-bar">
		  <button class="submit-button" @click="_submit">{{$t('button.confirm')}}</button>
		  <button class="submit-button" @click="_virtualprintType">{{$t('button.search')}}</button>
		</view>
	</view>
</template>

<script>
	import {virtualprintType} from '@/utils/getData2.js'
	import NavBar from '@/components/NavBar.vue'
	export default {
		components: {
			NavBar
		},
		data() {
			return {
				options: [],
				index: '',
				addrip: this.$store.getters.baseUrl,
				setTime: this.$store.getters.setTime / 1000,
				options1: [{text: '中文',value: 'zh-Hans'}, {text: 'English', value: 'en'}, {text: 'Indonesia', value: 'id'}],
				index1: '',
				systemLocale: '',
				applicationLocale: ''
			};
		},
		created () {
			// this._virtualprintType()
		},
		onLoad() {
		  let systemInfo = uni.getSystemInfoSync();
		  this.systemLocale = systemInfo.language;
		  this.applicationLocale = uni.getLocale();
		  this.index1 = this.applicationLocale.split('-')[0]
		  this.isAndroid = systemInfo.platform.toLowerCase() === 'android';
		  uni.onLocaleChange((e) => {
		    this.applicationLocale = e.locale;
		  })
		},
		methods: {
			onLocaleChange(e) {
			  if (this.isAndroid) {
			    uni.showModal({
			      content: this.$t('setting.language-change-confirm'),
			      success: (res) => {
			        if (res.confirm) {
			          uni.setLocale(e);
			        }
			      }
			    })
			  } else {
				uni.setLocale(e);
			    this.$i18n.locale = e;
			  }
			},
			goIn () {
				uni.redirectTo({
					url: '/pages/login/login'
				})
			},
			/** 选择器 */
			selectChange(e) {
				this.index = e
			},
			selectChange1(e) {
				this.onLocaleChange(e)
				this.index1 = e
			},
			/** 打印机类型下拉框查询 */
			async _virtualprintType () {
				let res = await virtualprintType(this.addrip)
				this.options = [...res.data]
				// if (this.$store.getters.setPrintName !== '') {
				// 	this.index = this.$store.getters.setPrintName
				// }
			},
			_submit () {
				if (this.addrip === '') {
					uni.showToast({
						title: '服务器地址',
						icon: 'none'
					})
					return
				}
				if (this.setTime === '') {
					uni.showToast({
						title: '请填写刷新时间',
						icon: 'none'
					})
					return
				}
				// 存值
				this.$store.dispatch('setConfig',{baseUrl: this.addrip, setTime: this.setTime * 1000, setPrintName: this.index})
				uni.redirectTo({
					url: '/pages/login/login'
				})
			}
		}
	}
</script>

<style lang="stylus">
@import '../../common/style/mixin.styl';
.input-wrap
	_wh(100%, 80rpx)
	margin 20rpx 0
	_fj()
.input-label
	_wh(210rpx, 80rpx)
	_font(28rpx,80rpx,#464646)
	text-align:justify;
	text-align-last: justify;
	text-justify: inter-ideograph;/*兼容ie*/
.setup-input
	_wh(calc(100% - 230rpx), 80rpx)
	background #fff
	border: 1px solid #dcdfe6;
	border-radius: 10rpx;
	_font(28rpx,80rpx,#323232)
	padding 0 10rpx
.select_wrap
	_wh(calc(100% - 220rpx), 80rpx)
	background #fff
</style>
