配置页

pages/login/setup.vue

@@ -4,20 +4,24 @@
 		<view class="zd_content">
 			<view class="zd_wrapper">
 				<view class="input-wrap">
-					<view class="input-label">服务器地址</view>
-					<input type="text" class="setup-input" placeholder="请输入服务器地址" v-model="addrip">
+					<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>
-			<view class="zd_wrapper">
 				<view class="input-wrap">
-					<view class="input-label">刷新时间(s)</view>
-					<input type="text" class="setup-input" placeholder="请输入刷新时间" v-model="setTime">
+					<view class="input-label">{{$t('setting.server')}}</view>
+					<input type="text" class="setup-input" v-model="addrip">
 				</view>
-			</view>
-			<view class="zd_wrapper">
 				<view class="input-wrap">
-					<view class="input-label" style="margin-right: 20upx;">客户标签打印</view>
-					<uni-data-select v-model="index" :localdata="options" @change="selectChange"></uni-data-select>
+					<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" :localdata="options" @change="selectChange"></uni-data-select>
+					</div>
 				</view>
 			</view>
 		</view>
@@ -40,13 +44,42 @@
 				options: [],
 				index: '',
 				addrip: this.$store.getters.baseUrl,
-				setTime: this.$store.getters.setTime / 1000
+				setTime: this.$store.getters.setTime / 1000,
+				options1: [{text: '中文',value: 'zh'}, {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('index.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'
@@ -56,6 +89,10 @@
 			selectChange(e) {
 				this.index = e
 			},
+			selectChange1(e) {
+				this.onLocaleChange(e)
+				this.index1 = e
+			},
 			/** 打印机类型下拉框查询 */
 			async _virtualprintType () {
 				let res = await virtualprintType(this.addrip)
@@ -92,14 +129,23 @@
 <style lang="stylus">
 @import '../../common/style/mixin.styl';
 .input-wrap
-	width 100%
+	_wh(100%, 80rpx)
+	margin 20rpx 0
 	_fj()
 .input-label
-	wh(200rpx, 58rpx)
-	_font(28rpx,58rpx,#464646)
+	_wh(210rpx, 80rpx)
+	_font(28rpx,80rpx,#464646)
+	text-align:justify;
+	text-align-last: justify;
+	text-justify: inter-ideograph;/*兼容ie*/
 .setup-input
-	_wh(calc(100% - 200rpx), 58rpx)
+	_wh(calc(100% - 230rpx), 80rpx)
 	background #fff
-	_font(28rpx,58rpx,#323232)
+	border: 1px solid #dcdfe6;
+	border-radius: 10rpx;
+	_font(28rpx,80rpx,#323232)
 	padding 0 10rpx
+.select_wrap
+	_wh(calc(100% - 220rpx), 80rpx)
+	background #fff
 </style>