proofreadtime.vue 3.8 KB
<template>
	<div style="padding-left: 28px;">
		<el-form ref="form"  label-width="100px">
			<!-- 手动校时 -->
			<div class="lineBox big">
				<el-radio v-model="radio" label="1">手动校时</el-radio>
			</div>
			<div class="radioContent">
				<div class="lineBox">
					<el-form-item label="当前时间:">
						<span>2020-02-11 16:08:01</span>
					</el-form-item>
				</div>
				<div class="lineBox">
					<el-form-item label="设备时间:">
						<el-date-picker
						v-model="systemTime"
						value-format="yyyy-MM-dd HH:mm:ss"
						type="datetime"
						placeholder="选择日期时间">
						</el-date-picker>
						<span style="margin-left: 30px;"> <el-checkbox v-model="syncTime">与计算机时间同步</el-checkbox></span>
						<el-button type="primary" size="small" class="primaryButton rightButton">校时</el-button>
					</el-form-item>
				</div>
			</div>
			<div class="line"></div>
			<!-- NTP校时 -->
			<div class="lineBox big">
				<el-radio v-model="radio" label="2">NTP校时</el-radio>
			</div>
			<div class="radioContent">
				<div class="lineBox">
					<el-form-item label="服务器地址:">
						<span class="inputBox">
							<el-input placeholder="请输入服务器地址" v-model="url"></el-input>
						</span>
					</el-form-item>
				</div>
				<div class="lineBox">
					<el-form-item label="NTP端口:">
						<span class="inputBox">
							<el-input placeholder="请输入NTP端口" v-model="ntpPort"></el-input>
						</span>
					</el-form-item>
				</div>
				<div class="lineBox">
					<el-radio v-model="ntpRadio" label="2">定时校时</el-radio>
				</div>
				<el-form ref="inlineform"  label-width="100px" inline>
					<div class="lineBox">
						<el-form-item label="每天:">
							<el-time-select
							  v-model="time"
							  placeholder="选择时间">
							</el-time-select>
						</el-form-item>
						<el-form-item label="每天:">
							<el-time-select
							v-model="time"
							placeholder="选择时间">
							</el-time-select>
						</el-form-item>
						<el-form-item label="每天:">
							<el-time-select
							v-model="time"
							placeholder="选择时间">
							</el-time-select>
						</el-form-item>
					</div>
					<div class="lineBox">
						<el-form-item label="每天:">
							<el-time-select
							v-model="time"
							placeholder="选择时间">
							</el-time-select>
						</el-form-item>
						<el-form-item label="每天:">
							<el-time-select
							v-model="time"
							placeholder="选择时间">
							</el-time-select>
						</el-form-item>
						<el-form-item label=" ">
							<span>自动进行校时(可设置多个时间点,不得超过5个)</span>
						</el-form-item>
					</div>
				</el-form>
				<div class="lineBox">
					<el-radio v-model="ntpRadio" label="2">周期校时</el-radio>
				</div>
				<div class="lineBox">
					<el-form-item label="每隔:">
						<span class="inputBox" style="width: 60px;">
							<el-input placeholder="请输入NTP端口" v-model="ntpPort"></el-input>
						</span>
						<span style="margin-left: 14px;">秒,自动进行校时</span>
						<el-button type="primary" size="small" class="primaryButton rightButton">保存设置</el-button>
					</el-form-item>
				</div>
			</div>
		</el-form>
	</div>
</template>
<script>
	export default {
		data(){
			return{
				time:'',
				url:'',
				ntpPort:'',
				activeName: 'first',
				systemTime:'',
				syncTime:false
			}
		},
		components:{},
		mounted(){},
		methods:{
			handleClick(tab, event) {
			console.log(tab, event);
		  }
		},
	}
</script>
<style lang="scss" scoped>
	.line{
		height:1px;
		background:rgba(232,232,232,1);
		margin-top: 18px;
		margin-bottom: 15px;
	}
	.lineBox{
		padding: 12px 0 12px 50px;
	}
	.radioContent{
		    margin-left: 24px;
	}
	.rightButton{
		float: right;
		margin-right: 20%;
	}
	.inputBox{
		width: 220px;
	}
</style>