浏览代码

调整闹钟

zhengkaixin 1 年之前
父节点
当前提交
dcfa8b1c51
共有 6 个文件被更改,包括 1008 次插入288 次删除
  1. 9 3
      apis/utils/index.js
  2. 580 0
      components/u-picker2.vue
  3. 1 1
      pages/mine/electronicMonitoring.vue
  4. 5 10
      pages/remoteControl/switchDetail.vue
  5. 128 40
      pages/timing/autoOff.vue
  6. 285 234
      pages/timing/timing.vue

+ 9 - 3
apis/utils/index.js

@@ -32,10 +32,16 @@ export const nextMonth=(year,month,day,bl)=>{
 // 苹果手机时间显示bug 
 export const newDate = (date) => {
 	var time=null;
-	if (date) {
-		var reg=new RegExp('-','gi')
-		time=new Date(date.replace(reg,'/'));	
+	if (typeof date == 'string') {
+		if (date) {
+			console.log(date)
+			var reg=new RegExp('-','gi')
+			time=new Date(date.replace(reg,'/'));	
+		}
+	}else{
+		time=new Date(date);
 	}
+	
 	return time
 }
 

+ 580 - 0
components/u-picker2.vue

@@ -0,0 +1,580 @@
+<template>
+	<u-popup :maskCloseAble="maskCloseAble" mode="bottom" :popup="false" v-model="value" length="auto" :safeAreaInsetBottom="safeAreaInsetBottom" @close="close" :z-index="uZIndex">
+		<view class="u-datetime-picker">
+			<view class="u-picker-header" @touchmove.stop.prevent="">
+				<view class="u-btn-picker u-btn-picker--tips" 
+					:style="{ color: cancelColor }" 
+					hover-class="u-opacity" 
+					:hover-stay-time="150" 
+					@tap="getResult('cancel')"
+				>{{cancelText}}</view>
+				<view class="u-picker__title">{{ title }}</view>
+				<view
+					class="u-btn-picker u-btn-picker--primary"
+					:style="{ color: moving ? cancelColor : confirmColor }"
+					hover-class="u-opacity"
+					:hover-stay-time="150"
+					@touchmove.stop=""
+					@tap.stop="getResult('confirm')"
+				>
+					{{confirmText}}
+				</view>
+			</view>
+			
+			<view class="u-picker-header" >
+				<view class="u-btn-picker u-btn-picker--tips" 
+					:style="{ color: cancelColor }" 
+					
+				
+				>{{texts[0]}}</view>
+				<view class="u-picker__title">{{ title }}</view>
+				<view
+					class="u-btn-picker u-btn-picker--tips" 
+					:style="{ color: cancelColor }" 
+				
+				
+				>
+					{{texts[1]}}
+				</view>
+			</view>
+			<view class="u-picker-body">
+				 
+				<picker-view  :value="valueArr" @change="change" class="u-picker-view" @pickstart="pickstart" @pickend="pickend">
+					
+					<picker-view-column >
+						<view class="u-column-item" v-for="(item, index) in showhours1" :key="index">
+							{{ formatNumber(item) }}
+							<text class="u-text" v-if="showTimeTag">时</text>
+						</view>
+					</picker-view-column>
+					<picker-view-column >
+						<view class="u-column-item" v-for="(item, index) in showminutes1" :key="index">
+							{{ formatNumber(item) }}
+							<text class="u-text" v-if="showTimeTag">分</text>
+						</view>
+					</picker-view-column>
+					
+					
+					<picker-view-column >
+						<view class="u-column-item" v-for="(item, index) in showhours2" 
+						
+						
+						:key="index">
+							{{ formatNumber(item) }}
+							<text class="u-text" v-if="showTimeTag">时</text>
+						</view>
+					</picker-view-column>
+					<picker-view-column >
+						<view class="u-column-item" v-for="(item, index) in showminutes2"
+						
+						 :key="index">
+							{{ formatNumber(item) }}
+							<text class="u-text" v-if="showTimeTag">分</text>
+						</view>
+					</picker-view-column> 
+				</picker-view>
+				 
+				 
+			</view>
+		</view>
+	</u-popup>
+</template>
+
+<script>
+
+
+/**
+ * picker picker弹出选择器
+ * @description 此选择器有两种弹出模式:一是时间模式,可以配置年,日,月,时,分,秒参数 二是地区模式,可以配置省,市,区参数
+ * @tutorial https://www.uviewui.com/components/picker.html
+ * @property {Object} params 需要显示的参数,见官网说明
+ * @property {String} mode 模式选择,region-地区类型,time-时间类型(默认time)
+ * @property {String Number} start-year 可选的开始年份,mode=time时有效(默认1950)
+ * @property {String Number} end-year 可选的结束年份,mode=time时有效(默认2050)
+ * @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
+ * @property {Boolean} show-time-tag 时间模式时,是否显示后面的年月日中文提示
+ * @property {String} cancel-color 取消按钮的颜色(默认#606266)
+ * @property {String} confirm-color 确认按钮的颜色(默认#2979ff)
+ * @property {String} default-time 默认选中的时间,mode=time时有效
+ * @property {String} confirm-text 确认按钮的文字
+ * @property {String} cancel-text 取消按钮的文字
+ * @property {String} default-region 默认选中的地区,中文形式,mode=region时有效
+ * @property {String} default-code 默认选中的地区,编号形式,mode=region时有效
+ * @property {Boolean} mask-close-able 是否允许通过点击遮罩关闭Picker(默认true)
+ * @property {String Number} z-index 弹出时的z-index值(默认1075)
+ * @property {Array} default-selector 数组形式,其中每一项表示选择了range对应项中的第几个
+ * @property {Array} range 自定义选择的数据,mode=selector或mode=multiSelector时有效
+ * @property {String} range-key 当range参数的元素为对象时,指定Object中的哪个key的值作为选择器显示内容
+ * @event {Function} confirm 点击确定按钮,返回当前选择的值
+ * @event {Function} cancel 点击取消按钮,返回当前选择的值
+ * @example <u-picker v-model="show" mode="time"></u-picker>
+ */
+export default {
+	name: 'u-picker',
+	props: {
+		// picker中需要显示的参数
+		params: {
+			type: Object,
+			default() {
+				return {
+					
+					hour: true,
+					minute: true,
+					hour2: true,
+					minute2: true,
+					
+				};
+			}
+		},
+		// 当mode=selector或者mode=multiSelector时,提供的数组
+		range: {
+			type: Array,
+			default() {
+				return [];
+			}
+		},
+		texts: {
+			type: Array,
+			default() {
+				return ['开始时间','结束时间'];
+			}
+		},
+	 
+		// 当 range 是一个 Array<Object> 时,通过 range-key 来指定 Object 中 key 的值作为选择器显示内容
+		rangeKey: {
+			type: String,
+			default: ''
+		},
+		// 模式选择,region-地区类型,time-时间类型,selector-单列模式,multiSelector-多列模式
+		mode: {
+			type: String,
+			default: 'time'
+		},
+	
+		// "取消"按钮的颜色
+		cancelColor: {
+			type: String,
+			default: '#606266'
+		},
+		// "确定"按钮的颜色
+		confirmColor: {
+			type: String,
+			default: '#2979ff'
+		},
+		// 默认显示的时间,2025-07-02 || 2025-07-02 13:01:00 || 2025/07/02
+		defaultTime: {
+			type: String,
+			default: ''
+		},
+		defaultTime2: {
+			type: String,
+			default: ''
+		},
+		
+		// 时间模式时,是否显示后面的年月日中文提示
+		showTimeTag: {
+			type: Boolean,
+			default: true
+		},
+		
+		safeAreaInsetBottom: {
+			type: Boolean,
+			default: false
+		},
+		// 是否允许通过点击遮罩关闭Picker
+		maskCloseAble: {
+			type: Boolean,
+			default: true
+		},
+		// 通过双向绑定控制组件的弹出与收起
+		value: {
+			type: Boolean,
+			default: false
+		},
+		// 弹出的z-index值
+		zIndex: {
+			type: [String, Number],
+			default: 0
+		},
+		// 顶部标题
+		title: {
+			type: String,
+			default: ''
+		},
+		// 取消按钮的文字
+		cancelText: {
+			type: String,
+			default: '取消'
+		},
+		// 确认按钮的文字
+		confirmText: {
+			type: String,
+			default: '确认'
+		}
+	},
+	data() {
+		return {
+		
+			hours: [],
+			minutes: [],
+		
+			hour: 0,
+			minute: 0,
+			hour2: 0,
+			minute2: 0,
+			
+			reset: false,
+			startDate: '',
+			endDate: '',
+			valueArr: [0,0,0,0],
+		 	oldvalueArr: [0,0,0,0],
+		  
+			moving: false // 列是否还在滑动中,微信小程序如果在滑动中就点确定,结果可能不准确
+		};
+	},
+	mounted() {
+		this.init();
+	},
+	computed: {
+		showhours1(){
+			var sz= this.hours
+			return sz
+		},
+		 showhours2(){
+			 var sz= this.hours
+		 // 	var sz= []
+			// var i=this.valueArr[0];
+			// sz=this.hours.filter((item)=>{
+			// 	var bl=false
+			// 	if(item>=this.showhours1[i]){
+			// 		bl=true
+			// 	}
+				
+			// 	return bl
+			// })
+			
+			
+			return sz
+		 },
+		 showminutes1(){
+			 var sz=this.minutes;
+			 
+		 	return sz
+		 },
+		 showminutes2(){
+			 var sz=this.minutes;
+			 
+			 // var i1=this.valueArr[0];
+			 // var i2=this.valueArr[2];
+			 
+			 // if(this.showhours1[i1]==this.showhours2[i2]){
+				//  sz=this.minutes.filter((item)=>{
+				//  	var bl=false
+				//  	if(item>=this.minute){
+				//  		bl=true
+				//  	}
+				 	
+				//  	return bl
+				//  })
+			 // }
+			 
+			 
+			 return sz
+		 },
+		 
+		propsChange() {
+			// 引用这几个变量,是为了监听其变化
+			return `${this.mode}-${this.defaultTime}-${this.startYear}-${this.endYear}-${this.defaultRegion}-${this.areaCode}`;
+		},
+	 
+		uZIndex() {
+			// 如果用户有传递z-index值,优先使用
+			return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
+		}
+	},
+	watch: {
+		propsChange() {
+			this.reset = true;
+			setTimeout(() => this.init(), 10);
+		},
+	 
+		// 微信和QQ小程序由于一些奇怪的原因(故同时对所有平台均初始化一遍),需要重新初始化才能显示正确的值
+		value(n) {
+			if (n) {
+				this.reset = true;
+				setTimeout(() => this.init(), 10);
+			}
+		}
+	},
+	methods: {
+		// 标识滑动开始,只有微信小程序才有这样的事件
+		pickstart() {
+			// #ifdef MP-WEIXIN
+			this.moving = true;
+			// #endif
+		},
+		// 标识滑动结束
+		pickend() {
+			// #ifdef MP-WEIXIN
+			this.moving = false;
+			// #endif
+		},
+	 
+		// 小于10前面补0,用于月份,日期,时分秒等
+		formatNumber(num) {
+			return +num < 10 ? '0' + num : String(num);
+		},
+		// 生成递进的数组
+		generateArray: function(start, end) {
+			// 转为数值格式,否则用户给end-year等传递字符串值时,下面的end+1会导致字符串拼接,而不是相加
+			start = Number(start);
+			end = Number(end);
+			end = end > start ? end : start;
+			// 生成数组,获取其中的索引,并剪出来
+			return [...Array(end + 1).keys()].slice(start);
+		},
+		getIndex: function(arr, val) {
+			let index = arr.indexOf(val);
+			// 如果index为-1(即找不到index值),~(-1)=-(-1)-1=0,导致条件不成立
+			return ~index ? index : 0;
+		},
+		//日期时间处理
+		initTimeValue() {
+			// 格式化时间,在IE浏览器(uni不存在此情况),无法识别日期间的"-"间隔符号
+			let fdate = this.defaultTime.replace(/\-/g, '/');
+			let fdate2 = this.defaultTime2.replace(/\-/g, '/');
+			 
+			fdate2 = fdate2 && fdate2.indexOf('/') == -1 ? `2020/01/01 ${fdate2}` : fdate2;
+			fdate = fdate && fdate.indexOf('/') == -1 ? `2020/01/01 ${fdate}` : fdate;
+			let time = null;
+			if (fdate) time = new Date(fdate);
+			else time = new Date();
+			
+			let time2 = null;
+			if (fdate2) time2 = new Date(fdate2);
+			else time2 = new Date();
+			
+			
+		
+			this.hour = time.getHours();
+			this.minute = time.getMinutes();
+			
+			this.hour2 = time2.getHours();
+			this.minute2 = time2.getMinutes();
+		},
+		init() {
+			 
+			//this.valueArr = [0,0,0,0];
+			this.reset = false;
+			this.initTimeValue()
+				
+				if (this.params.hour) {
+					//this.valueArr.push(0);
+					this.setHours();
+				}
+				if (this.params.minute) {
+				//	this.valueArr.push(0);
+					this.setMinutes();
+				}
+				
+				if (this.params.hour2) {
+					//this.valueArr.push(0);
+					this.setHours2();
+				}
+				if (this.params.minute2) {
+					
+					//this.valueArr.push(0);
+					this.setMinutes2();
+				}
+				
+			 
+			this.oldvalueArr=[
+				...this.valueArr
+			];
+			
+			this.$forceUpdate();
+			
+		},
+	
+		setHours() {
+			this.hours = this.generateArray(0, 23);
+			this.valueArr.splice(0, 1, this.getIndex(this.showhours1, this.hour));
+		
+		},
+		setMinutes() {
+			this.minutes = this.generateArray(0, 59);
+			this.valueArr.splice(1, 1, this.getIndex(this.showminutes1, this.minute));
+	
+		},
+		setHours2() {
+			
+			this.hours2 = this.generateArray(0, 23);
+			
+			this.valueArr.splice(2, 1, this.getIndex(this.showhours2, this.hour2));
+		 
+		},
+		setMinutes2() {
+			this.minutes2 = this.generateArray(0, 59);
+			this.valueArr.splice(3, 1, this.getIndex(this.showminutes2, this.minute2));
+		 
+		},
+		
+		
+	 
+		close() {
+			this.$emit('input', false);
+		},
+		// 用户更改picker的列选项
+		change(e) {
+			 
+			this.valueArr = e.detail.value;
+		
+			 
+			this.hour = this.showhours1[this.valueArr[0]]
+			this.minute = this.showminutes1[this.valueArr[1]]
+			for(var i in this.oldvalueArr ){
+				
+			}
+			
+			if(this.oldvalueArr[0]!=this.valueArr[0]){
+				this.setHours2()
+				this.setMinutes2()
+			}
+			if(this.oldvalueArr[1]!=this.valueArr[1]){
+				if(this.hour==this.hour2){
+					this.setMinutes2()
+				}
+			}
+			if(this.oldvalueArr[2]!=this.valueArr[2]){
+				
+			}
+			if(this.oldvalueArr[1]!=this.valueArr[1]){
+				
+			}
+			
+			this.hour = this.showhours1[this.valueArr[0]]
+			this.minute = this.showminutes1[this.valueArr[1]]
+			this.hour2 = this.showhours2[this.valueArr[2]]
+			this.minute2 = this.showminutes2[this.valueArr[3]]
+			
+			
+			this.oldvalueArr=[
+				...this.valueArr
+			]; 
+		},
+		// 用户点击确定按钮
+		getResult(event = null) {
+			// #ifdef MP-WEIXIN
+			if (this.moving) return;
+			// #endif
+			let result = {};
+			var i0=this.valueArr[0];
+			var i1=this.valueArr[1];
+			var i2=this.valueArr[2];
+			var i3=this.valueArr[3];
+			this.hour =this.showhours1[i0]
+			this.minute =this.showminutes1[i1]
+			this.hour2 =this.showhours2[i2]
+			this.minute2 =this.showminutes2[i3]
+			
+			 result.hour = this.formatNumber(this.hour || 0);
+			 result.minute = this.formatNumber(this.minute || 0);
+			 result.hour2 = this.formatNumber(this.hour2 || 0);
+			 result.minute2 = this.formatNumber(this.minute2|| 0);
+				
+				
+			
+			if (event) this.$emit(event, result);
+			this.close();
+		},
+		
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+// @import '../../libs/css/style.components.scss';
+
+.u-datetime-picker {
+	position: relative;
+	z-index: 999;
+}
+
+.u-picker-view {
+	height: 100%;
+	box-sizing: border-box;
+}
+
+.u-picker-header {
+	width: 100%;
+	height: 90rpx;
+	padding: 0 40rpx;
+	//@include vue-flex;
+	    display: flex;
+	justify-content: space-between;
+	align-items: center;
+	box-sizing: border-box;
+	font-size: 30rpx;
+	background: #fff;
+	position: relative;
+}
+
+.u-picker-header::after {
+	content: '';
+	position: absolute;
+	border-bottom: 1rpx solid #eaeef1;
+	-webkit-transform: scaleY(0.5);
+	transform: scaleY(0.5);
+	bottom: 0;
+	right: 0;
+	left: 0;
+}
+
+.u-picker__title {
+	color: $u-content-color;
+}
+
+.u-picker-body {
+	width: 100%;
+	height: 500rpx;
+	overflow: hidden;
+	background-color: #fff;
+}
+
+.u-column-item {
+	//@include vue-flex;
+	    display: flex;
+	align-items: center;
+	justify-content: center;
+	font-size: 18px;
+	color: $u-main-color;
+	padding: 0 8rpx;
+}
+
+.u-text {
+	font-size: 24rpx;
+	padding-left: 8rpx;
+}
+
+.u-btn-picker {
+	padding: 16rpx;
+	box-sizing: border-box;
+	text-align: center;
+	text-decoration: none;
+}
+
+.u-opacity {
+	opacity: 0.5;
+}
+
+.u-btn-picker--primary {
+	color: $u-type-primary;
+}
+
+.u-btn-picker--tips {
+	color: $u-tips-color;
+}
+.u-column-item-dis{
+	color: #8c8c8c;
+}
+</style>

+ 1 - 1
pages/mine/electronicMonitoring.vue

@@ -102,7 +102,7 @@
 				<span>关</span>
 				<u-switch size="32" @change="switchBtnApi(meterDetail,$event)"  
 				 v-model="meterDetail.switchStatus"   inactive-color="#ff9900" ></u-switch >
-				<span>开</span>
+				<span >开</span>
 				<!-- <img src="@/assets/img/control.png"
 				 @tap.stop="switchBtnApi(meterDetail,0)"
 				 v-if="meterDetail.switchStatus"

+ 5 - 10
pages/remoteControl/switchDetail.vue

@@ -17,16 +17,11 @@
 		
 		<template  v-if="meterDetails.meter&&meterDetails.meter.type!=6" >
 			<view class="control-group" v-if="meterDetails.meter" >
-			       <view class="control">
-			       	<view class="text">
-			       		电源
-			       	</view>
-			       	
-			       </view>
+			      
 				   
 				   <view class="control">
 				   	<view class="text">
-				   		开关
+				   		电源状态
 				   	</view>
 				   	<view class="icon"  style="    display: flex;" >
 						<span>关</span>
@@ -93,12 +88,12 @@
 			</view>
 			
 			<!-- 日志 -->
-			<view class="log"  @click="gotoUrl('/pages/timing/timing?id='+meterId)">
+			<view class="log"  @click="gotoUrl('/pages/timing/timing?id='+meterId+'&title='+title)">
 			       <view class="icon">
 					  <u-icon name="clock" color="#fff" size="40" ></u-icon>
 			       </view>
 				   <view class="text">
-				   	定时
+				   	用电设置
 				   </view>
 				   <view class="more">
 				   	<u-icon name="arrow-right" size="32" color="#bbbbbb" ></u-icon>
@@ -111,7 +106,7 @@
 			       	<img src="@/assets/img/riLine-file-list-2-line.svg" alt="" />
 			       </view>
 				   <view class="text">
-				   	日志
+				   	操作日志
 				   </view>
 				   <view class="more">
 				   	<u-icon name="arrow-right" size="32" color="#bbbbbb" ></u-icon>

+ 128 - 40
pages/timing/autoOff.vue

@@ -41,12 +41,54 @@
 
 			</view>
 
-			<view class="time-item" v-show="type==0||type==1||type==3"
+			<view class="time-item" v-show="switchStatus==2"
+			 @click="pickerShow4=true">
+				<view class="time">
+					 <view class="time-slot" >
+						定时供电时间段
+						
+					 </view>
+					<view class="type">
+											
+							{{startTime?startTimeStr(startTime)+'-':'未设置'}}
+							{{showjp2time(startTime,endTime)?'次日':''}}
+							{{endTime?startTimeStr(endTime):''}}
+					</view>
+				 </view>
+				 <view class="more">
+				 	<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+				 </view>
+				 
+			</view> 
+			<view class="time-item" v-show="switchStatus==3"
+			 @click="pickerShow3=true">
+				
+				<view class="time">
+					 <view class="time-slot" >
+						智能停电时间段
+						
+					 </view>
+					 <view class="type">
+						
+						{{startTime?startTimeStr(startTime)+'-':'未设置'}}
+						{{showjp2time(startTime,endTime)?'次日':''}}
+						{{endTime?startTimeStr(endTime):''}}
+					 </view>
+				 </view>
+				 <view class="more">
+				 	<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+				 </view>
+			</view> 
+			<view class="time-item" v-show="switchStatus==1"
 			 @click="pickerShow1=true">
 				<view class="time">
-					<view class="time-slot">
-						定时送电
+					
+					<view class="time-slot" >
+						定时送电时间
+						
 					</view>
+					
+					
 					<view class="type">
 						{{startTime?startTimeStr(startTime):'未设置'}}
 					</view>
@@ -57,16 +99,19 @@
 				</view>
 
 			</view>
-
-			<view class="time-item" v-show="type==0||type==2||type==3"
+			
+			<view class="time-item" v-show="switchStatus==0"
 			 @click="pickerShow2=true">
 				<view class="time">
-					<view class="time-slot">
-						定时停电
+					
+					<view class="time-slot"  v-show="switchStatus==0">
+						定时停电时间
 					</view>
+					
 					<view class="type">
 						
-						{{showjp2time(startTime,endTime)?'次日':''}}{{endTime?startTimeStr(endTime):'未设置'}}
+						
+						{{endTime?startTimeStr(endTime):'未设置'}}
 					</view>
 				</view>
 
@@ -76,7 +121,7 @@
 
 			</view>
 
-			<view class="time-item" v-show="type==3"
+			<view class="time-item" v-show="switchStatus==3"
 			 @click="thresholdsPopup=true" >
 				<view class="time">
 					<view class="time-slot">
@@ -85,12 +130,27 @@
 					<view class="type">
 						{{formData.maxPower!=''?formData.maxPower+'kW':'未设置'}}
 					</view>
+					
+					
 				</view>
 
 				<view class="more">
 					<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
 				</view>
 
+			</view>
+			<view class="time-item" v-show="switchStatus==3"
+			>
+				<view class="time">
+					
+					<view class="type">
+						1.功率达到最大阈值时“自动停电”;<br/>
+						2.关闭自动停电时,如果处于停电状态将“开启供电”;
+					</view>
+				</view>
+			
+				
+			
 			</view>
 		</view>
 		<!-- 重复类型 -->
@@ -155,7 +215,19 @@
 		<ujpPicker mode="time" jp="2" :default-time="endTime?'2024-1-1 '+endTime+':1':''"  :defaultStartTime="startTime"
 		 v-model="pickerShow2" :params="params" @confirm="pickerShow2confirm" ></ujpPicker>
 		<!-- 自定义重复 -->
-
+		<ujpPicker2   :texts="['开启’智能停电‘','停止’智能停电‘']"
+		:defaultTime="startTime?'2024-1-1 '+startTime+':1':''"
+		:defaultTime2="endTime?'2024-1-1 '+endTime+':1':''"
+		
+		 v-model="pickerShow3"  @confirm="pickerShow1confirm2" ></ujpPicker2>
+		
+		<ujpPicker2 :texts="['供电时间','停电时间']"
+		:defaultTime="startTime?'2024-1-1 '+startTime+':1':''"
+		:defaultTime2="endTime?'2024-1-1 '+endTime+':1':''"
+		
+		 v-model="pickerShow4"  @confirm="pickerShow1confirm2" ></ujpPicker2>
+		
+		
 		<u-popup v-model="customPopup" mode="bottom">
 			<view class="custom">
 				<view class="headline">
@@ -164,7 +236,7 @@
 				<view class="radio-group">
 					<checkbox-group @change="checkboxChange" >
 					<view class="radio-item" v-for="(item,i) in weekdaysListTemp" :key="i">
-						<view class="item-title">
+						<view class="item-title" >
 							{{weeklist[i]}}
 						</view>
 						<view class="item-value">
@@ -220,11 +292,13 @@
 
 <script>
 	import ujpPicker from '@/components/u-picker.vue'
+	import ujpPicker2 from '@/components/u-picker2.vue'
+	
 	import * as API from '@/apis/pagejs/meterTimer.js'
 
 	export default {
 		components: {
-			ujpPicker
+			ujpPicker,ujpPicker2
 		},
 		data() {
 
@@ -232,12 +306,18 @@
 				typeShow: true,
 				pickerShow1: false,
 				pickerShow2: false,
+				pickerShow3: false,
+				pickerShow4: false,
 				typeShow: false,
 				customPopup: false,
 				thresholdsPopup: false,
-				listtemp: [2,1,0,3],
-				list: [{
-									text: '时间段定时',
+				listtemp: [3,2,1,0],
+				list: [
+					{
+						text:'智能停电',
+						value:3
+					},{
+									text: '供电时间',
 									value:2
 									
 								}, {
@@ -246,9 +326,6 @@
 								}, {
 									text: '定时停电' ,
 									value:0
-								},{
-									text:'智能停电',
-									value:3
 								}],
 				params: {
 					year: false,
@@ -273,6 +350,7 @@
 				 
 				maxPower:"",
 				timerSwitch:{},
+				switchStatus:"",
 				formData:{
 					meterId:"",
 					weekdays:"",
@@ -294,6 +372,7 @@
 			if(op.type){
 				this.type=op.type;
 				this.title=this.list[this.type].text
+				this.switchStatus=this.list[this.type].value
 			}
 			if(op.id){
 				this.id=op.id;
@@ -302,10 +381,11 @@
 		},
 		methods: {
 			showjp2time(time1,time2){
+				
 				if(time1&&time2){
 					var num1=parseInt(time1.replace(":",''))
 					var num2=parseInt(time2.replace(":",''))
-					return num1>=num2
+					return num1>num2
 				}else{
 					return false
 				}
@@ -324,6 +404,7 @@
 					this.formData=timerSwitch
 					this.meterId=timerSwitch.meterId
 					this.type=this.listtemp[timerSwitch.switchStatus]
+					this.switchStatus=this.list[this.type].value
 					this.title=this.list[this.type].text
 					if(timerSwitch.type==1){
 						this.typeShowIndex=0;
@@ -343,10 +424,11 @@
 					this.startTime=timerSwitch.startTime
 					this.endTime=timerSwitch.endTime
 					
-					if(this.type==2){
+					if(this.switchStatus==0){
 						this.endTime=timerSwitch.startTime
 					}
 					this.maxPower=this.formData.maxPower
+					
 				}).catch(error => {
 					uni.showToast({
 						title: error,
@@ -373,7 +455,13 @@
 					})
 				}
 			},
-			
+			pickerShow1confirm2(e){
+				console.log(e)
+				this.startTime=e.hour+":"+e.minute+""
+				
+				this.endTime=e.hour2+":"+e.minute2+""
+				
+			},
 			pickerShow1confirm(e){
 			
 				
@@ -424,42 +512,43 @@
 				this.formData.weekdays=""
 				this.formData.switchStatus=this.list[this.type].value
 				if(!this.startTime){
-					var br=false
+					
 					if(this.formData.switchStatus==1){
-						br=true
+						uni.showToast({
+							title: "请设置定时送电时间",
+							icon: "none"
+						})
+						return
 					}
 					if(this.formData.switchStatus==2){
-						br=true
+						uni.showToast({
+							title: "请设置定时供电时间段",
+							icon: "none"
+						})
+						return
 					}
 					if(this.formData.switchStatus==3){
-						br=true
-					}
-					if(br){
+						
+						
 						uni.showToast({
-							title: "请设置定时送电",
+							title: "请设置智能停电时间段",
 							icon: "none"
 						})
 						return
 					}
+					 
 				}
 				if(!this.endTime){
-					var br=false
+					
+					
 					if(this.formData.switchStatus==0){
-						br=true
-					}
-					if(this.formData.switchStatus==2){
-						br=true
-					}
-					if(this.formData.switchStatus==3){
-						br=true
-					}
-					if(br){
 						uni.showToast({
-							title: "请设置定时停电",
+							title: "请设置定时停电时间",
 							icon: "none"
 						})
 						return
 					}
+					
 				}
 				
 				
@@ -508,7 +597,6 @@
 						this.formData.maxPower=''
 					}
 				}
-
 				
 				
 				uni.showLoading({

+ 285 - 234
pages/timing/timing.vue

@@ -1,79 +1,89 @@
 <template>
 	<view>
-		<u-navbar title="定时" title-color="#101010">
-			
-			<view slot="right" @click="deleteShow=!deleteShow" >
-				
-				<img  v-if="deleteShow==true"   src="@/assets/img/arcoDesign-select-all.svg" alt="" />
-			    <img  v-else src="@/assets/img/riLine-list-settings-line.svg" alt="" />
+		<u-navbar :title="title" title-color="#101010">
+
+			<view slot="right" @click="deleteShow=!deleteShow">
+
+				<img v-if="deleteShow==true" src="@/assets/img/arcoDesign-select-all.svg" alt="" />
+				<img v-else src="@/assets/img/riLine-list-settings-line.svg" alt="" />
 			</view>
-			
+
 		</u-navbar>
 		<view class="time-group">
-			<checkbox-group @change="checkboxChange" >
-			<view class="time-item"  v-for="(item,i) in timerSwitchList"
-			 
-			 >
-				<view class="time" @click="clicksheetInfo(item)" >
-					<view class="time-slot">
-						{{item.startTime}}{{item.switchStatus==2||item.switchStatus==3?'-'+(showjp2time(item.startTime,item.endTime)?'次日':'')+item.endTime:''}}
-					</view>
-					<view class="type">
-						{{item.switchStatusN}} | {{item.type==1?'执行一次':''}}
-						<template v-if="item.type!=1">
-							<template v-if="item.weekdays=='1,2,3,4,5,6,7'">
-								每天
-							</template>
-							<template v-else >
-								<template v-for="(item,i) in item.weekdays.split(',')">
-									
+			<checkbox-group @change="checkboxChange">
+				<view class="time-item" v-for="(item,i) in timerSwitchList">
+					<view class="time" @click="clicksheetInfo(item)">
+						<view class="time-slot">
+							{{item.startTime}}
+							 
+							{{item.switchStatus==2||item.switchStatus==3?'-'+(showjp2time(item.startTime,item.endTime)?'次日':'')+item.endTime:''}}
+						</view>
+						<view class="type">
+							{{item.switchStatusN}} | {{item.type==1?'执行一次':''}}
+							<template v-if="item.type!=1">
+								<template v-if="item.weekdays=='1,2,3,4,5,6,7'">
+									每天
+								</template>
+								<template v-else>
+									<template v-for="(item,i) in item.weekdays.split(',')">
+
 										<span :key="i">
 											{{weeklist[item]}}
 										</span>
-										<span class="weeklistclassSpan" :key="i+'a'" >
+										<span class="weeklistclassSpan" :key="i+'a'">
 											,
 										</span>
-								
-									
+
+
+									</template>
 								</template>
 							</template>
-						</template> 
-						<template v-if="item.switchStatus==3">
-							 <span style="margin-left: 8rpx;">| {{item.maxPower}}kW</span>
-						</template>
+							<template v-if="item.switchStatus==3">
+								<span style="margin-left: 8rpx;">| {{item.maxPower}}kW</span>
+							</template>
+							<template v-if="item.switchStatus==0&&item.status">
+								<span style="margin-left: 8rpx;">| {{gethtml(item.startTime)}}停电</span>
+							</template>
+							<template v-if="item.switchStatus==1&&item.status">
+								<span style="margin-left: 8rpx;">| {{gethtml(item.startTime)}}供电</span>
+							</template>
+						</view>
+						<view class="type" v-if="item.switchStatus==2&&item.status">
+							<view>{{gethtml(item.startTime)}}供电</view>
+							<view>{{gethtml(item.endTime)}}停电</view>
+						</view>
+						<view class="type" v-if="item.switchStatus==3&&item.status">
+							<view>{{gethtml(item.startTime)}}开启“智能停电”</view>
+							<view>{{gethtml(item.endTime)}}关闭“智能停电”</view>
+						</view>
+					</view>
+					<!-- 开关 -->
+					<view class="switch" v-if="!deleteShow">
+						<u-switch @change="switchBtn(item,$event)" v-model="item.status" size="40"></u-switch>
+					</view>
+					<!-- 单选框 -->
+					<view class="radio" v-if="deleteShow">
+
+						<checkbox :value="item.id"></checkbox>
+
 					</view>
 				</view>
-				<!-- 开关 -->
-				<view class="switch" v-if="!deleteShow" >
-					<u-switch @change="switchBtn(item,$event)" 
-					 
-					 v-model="item.status" size="40" ></u-switch>
-				</view>
-				<!-- 单选框 -->
-				<view class="radio" v-if="deleteShow" >
-					
-					<checkbox
-					:value="item.id" ></checkbox>
-							
-				</view>
-			</view>
-			</checkbox-group  >
+			</checkbox-group>
 		</view>
-		<u-divider :isnone="timerSwitchList.length==0"  nonetext="无记录"
-			border-color="#CFD2D5">已经到底了</u-divider>
-			
+		<u-divider :isnone="timerSwitchList.length==0" nonetext="无记录" border-color="#CFD2D5">已经到底了</u-divider>
+
 		<!-- 添加按钮 -->
-		<view class="add"  @click="show=true"  v-if="deleteShow==false" >
+		<view class="add" @click="show=true" v-if="deleteShow==false">
 			<img src="@/assets/img/riLine-add-line 1.svg" alt="" />
 		</view>
-		
+
 		<!-- 新增弹窗 -->
 		<view class="add-popup">
-			<u-action-sheet :list="list"  @click="clicksheet" v-model="show" border-radius="16"  ></u-action-sheet>
+			<u-action-sheet :list="list" @click="clicksheet" v-model="show" border-radius="16"></u-action-sheet>
 		</view>
-		
+
 		<!-- 删除 -->
-		<view class="delete" v-if="deleteShow" @click="deletePopupQuery" >
+		<view class="delete" v-if="deleteShow" @click="deletePopupQuery">
 			<view class="icon">
 				<img src="@/assets/img/riLine-delete-bin-7-line 1.svg" alt="" />
 			</view>
@@ -81,9 +91,9 @@
 				删除
 			</view>
 		</view>
-		
+
 		<!-- 删除确认弹框 -->
-		<u-popup v-model="deletePopup"  mode="bottom" border-radius="12" >
+		<u-popup v-model="deletePopup" mode="bottom" border-radius="12">
 			<view class="popup">
 				<view class="headline">
 					删除定时
@@ -92,116 +102,142 @@
 					要删除选中的定时吗?
 				</view>
 				<view class="btn-box">
-					<view class="cancel" @click="deletePopup=false" >
+					<view class="cancel" @click="deletePopup=false">
 						取消
 					</view>
-					<view class="confirm"  @click="deletePopupApi"  >
+					<view class="confirm" @click="deletePopupApi">
 						确认删除
 					</view>
 				</view>
 			</view>
 		</u-popup>
-		
+
 	</view>
 </template>
 
 <script>
 	import * as API from '@/apis/pagejs/meterTimer.js'
-	
+	import {
+		hourDistanceArr,
+		parseUnixTime,
+		newDate
+	} from '@/apis/utils/index.js'
 	export default {
 		data() {
 			return {
-				checked:false,
+				checked: false,
 				show: false,
-				popShow:false,
-				deleteShow:false,
-				deletePopup:false,
-				weeklist:[
-					'','周一','周二','周三','周四','周五','周六','周日'
+				popShow: false,
+				deleteShow: false,
+				deletePopup: false,
+				weeklist: [
+					'', '周一', '周二', '周三', '周四', '周五', '周六', '周日'
 				],
 				list: [{
-									text: '时间段定时',
-									
-								}, {
-									text: '定时送电'
-								}, {
-									text: '定时停电' 
-								},{
-									text:'智能停电'
-								}],
-				timerSwitchList:[],
-				getMeterTimerListReady:false,
-				deleteIds:"",
-								
+						text: '智能停电',
+						value: 3,
+					},
+					{
+						text: '供电时间',
+						value: 0,
+					}, {
+						text: '定时送电',
+						value: 1,
+					}, {
+						text: '定时停电',
+						value: 2,
+					}
+				],
+				timerSwitchList: [],
+				getMeterTimerListReady: false,
+				deleteIds: "",
+				title: "",
+
 			}
 		},
 		onLoad(op) {
-			if(op.id){
-				
-				this.meterId=op.id;
+			if (op.id) {
+				this.title = op.title;
+				this.meterId = op.id;
 				this.getMeterTimerList()
 			}
 		},
 		onShow() {
-			if(this.meterId){
+			if (this.meterId) {
 				this.getMeterTimerList()
 			}
-			
+
 		},
 		methods: {
-			switchBtn(node,key){
+			gethtml(item) {
+				var str = parseUnixTime(new Date().getTime(), '{y}-{m}-{d}');
+				var time1 = new Date();
+				var time2 = newDate(str + ' ' + item + ':00');
+				var sz = []
+				if (time1 > time2) {
+					time2.setDate(time2.getDate() + 1)
+					sz = hourDistanceArr(time1, time2)
+				} else {
+
+					sz = hourDistanceArr(time1, time2)
+				}
+				console.log(sz[0])
+				return (sz[0] ? sz[0] + '小时' : '') + (sz[1] ? sz[1] + '分钟后' : '0分钟后')
+
+			},
+			switchBtn(node, key) {
 				uni.showLoading({
 					title: "加载中",
 					mask: true,
 				})
 				API.changeStatus({
-					id:node.id,
+					id: node.id,
 					//enabled:key
 				}).then((res) => {
 					uni.hideLoading();
-					node.status=res.data.status
-					
+					node.status = res.data.status
+
 				}).catch(error => {
-					
+
 					uni.showToast({
 						title: error,
 						icon: "none"
 					})
 				})
 			},
-			showjp2time(time1,time2){
-				if(time1&&time2){
-					var num1=parseInt(time1.replace(":",''))
-					var num2=parseInt(time2.replace(":",''))
-					return num1>=num2
-				}else{
+			showjp2time(time1, time2) {
+				if (time1 && time2) {
+					var num1 = parseInt(time1.replace(":", ''))
+					var num2 = parseInt(time2.replace(":", ''))
+					return num1 >= num2
+				} else {
 					return false
 				}
-				
+
 			},
-			deletePopupQuery(){
-				if(this.deleteIds!=''){
-					this.deletePopup=true
-				}else{
+			deletePopupQuery() {
+				if (this.deleteIds != '') {
+					this.deletePopup = true
+				} else {
 					uni.showToast({
 						title: "请至少勾选一项",
 						icon: "none"
 					})
 				}
-				
+
 			},
-			deletePopupApi(){
+			deletePopupApi() {
 				uni.showLoading({
 					title: "加载中",
 					mask: true,
 				})
 				API.deleteSwitch({
-					ids:this.deleteIds
+					ids: this.deleteIds
 				}).then((response) => {
 					uni.hideLoading();
-					this.deletePopup=false
-					this.deleteShow=false
-					this.deleteIds=""
+					this.deletePopup = false
+					this.deleteShow = false
+					this.deleteIds = ""
 					this.getMeterTimerList()
 				}).catch(error => {
 					uni.showToast({
@@ -210,38 +246,39 @@
 					})
 				})
 			},
-			checkboxChange(e){
-				var sz=e.detail.value;
-				 this.deleteIds=sz.join()
-				
+			checkboxChange(e) {
+				var sz = e.detail.value;
+				this.deleteIds = sz.join()
+
 			},
-			clicksheetInfo(item){
-				if(!this.deleteShow){
-					var url=`/pages/timing/autoOff?id=${item.id}`
+			clicksheetInfo(item) {
+				if (!this.deleteShow) {
+					var url = `/pages/timing/autoOff?id=${item.id}`
 					uni.navigateTo({
-						url:url
+						url: url
 					})
 				}
-				
+
 			},
-			clicksheet(index){
-				var url=`/pages/timing/autoOff?meterId=${this.meterId}&type=${index}`
+			clicksheet(index) {
+				var k=this.list[index].value
+				var url = `/pages/timing/autoOff?meterId=${this.meterId}&type=${index}`
 				uni.navigateTo({
-					url:url
+					url: url
 				})
 			},
-			getMeterTimerList(){
+			getMeterTimerList() {
 				uni.showLoading({
 					title: "加载中",
 					mask: true,
 				})
 				API.meterTimerList({
-					meterId:this.meterId
+					meterId: this.meterId
 				}).then((response) => {
 					uni.hideLoading();
-					this.getMeterTimerListReady=true
-					this.timerSwitchList=response.data.timerSwitchList;
-					
+					this.getMeterTimerListReady = true
+					this.timerSwitchList = response.data.timerSwitchList;
+
 				}).catch(error => {
 					uni.showToast({
 						title: error,
@@ -254,134 +291,148 @@
 </script>
 
 <style lang="scss" scoped>
-	.weeklistclassSpan:last-child{
+	.weeklistclassSpan:last-child {
 		display: none;
 	}
-	/deep/.u-slot-right{
-		margin-right:32rpx;
-		img{
+
+	/deep/.u-slot-right {
+		margin-right: 32rpx;
+
+		img {
 			width: 48rpx;
 			height: 48rpx;
 		}
 	}
-	
-	.time-group{
+
+	.time-group {
 		background-color: #fff;
-		.time-item{
-			
+
+		.time-item {
+
 			padding: 24rpx 0;
 			margin: 0 32rpx;
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
-			border-bottom: 1px solid rgba(221,221,221,1);
-			.time{
-				 width: 100%;
-				.time-slot{
-					color: rgba(16,16,16,1);
+			border-bottom: 1px solid rgba(221, 221, 221, 1);
+
+			.time {
+				width: 100%;
+
+				.time-slot {
+					color: rgba(16, 16, 16, 1);
 					font-size: 32rpx;
 				}
-				.type{
-					color: rgba(119,119,119,1);
+
+				.type {
+					color: rgba(119, 119, 119, 1);
 				}
 			}
 		}
-		.time-item:last-of-type{
+
+		.time-item:last-of-type {
 			border: none;
 		}
 	}
-   
-   // 添加按钮
-   .add{
-	   z-index: 99;
-	   width: 128rpx;
-	   height: 128rpx;
-	   background-color: rgba(22,119,255,1);
-	   border-radius: 999px;
-	   display: flex;
-	   align-items: center;
-	   justify-content: center;
-	   position: fixed;
-	   bottom: 80rpx;
-	   right: 40rpx;
-	   img{
-		   width: 80rpx;
-		   height: 80rpx;
-	   }
-   }
-   
-   .add-popup{
-	   /deep/.u-drawer{
-	   	   left: 24rpx;
-	   	   right: 24rpx;
-	   	   bottom: 24rpx;
-	   	   border-radius: 8px;
-	   }
-	   /deep/.u-action-sheet-item{
-	   	   color: #101010;
-	   }
-	   
-   }
-  
-   // 删除
-   .delete{
-	   position: fixed;
-	   left: 0;
-	   right: 0;
-	   bottom: 0;
-	   background-color:#fff;
-	   display: flex;
-	   flex-direction: column;
-	   align-items: center;
-	   justify-content: center;
-	   // padding: 20rpx 0;
-	   height: 120rpx;
-	   img{
-		   width: 48rpx;
-		   height: 48rpx;
-	   }
-	   .text{
-		   color: rgba(51,51,51,1);
-		   font-size: 20rpx;
-	   }
-   }
-   
-   // 删除确认弹框
-   .popup{
-   	padding: 32rpx;
-   	text-align: center;
-	
-   	.headline{
-   		color: rgba(16,16,16,1);
-   		font-size: 36rpx;
-   		font-weight: bold;
-   	}
-   	.hint{
-   		color: rgba(16,16,16,1);
-   		font-size: 32rpx;
-   		margin-top: 40rpx;
-   	}
-   	.btn-box{
-   		margin-top: 82rpx;
-   		display: flex;
-   		justify-content: space-between;
-   		.cancel{
-   			width: 328rpx;
-   			line-height: 80rpx;
-   			border-radius: 4px;
-   			background-color: rgba(222,225,228,1);
-   			color: rgba(51,51,51,1);
-   			font-size: 32rpx;
-   		}
-   		.confirm{
-   			width: 328rpx;
-   			line-height: 80rpx;
-   			border-radius: 4px;
-   			background-color: rgba(255,68,68,1);
-   			color: rgba(255,255,255,1);
-   			font-size: 32rpx;
-   		}
-   	}
-   }
-   
-</style>
+
+	// 添加按钮
+	.add {
+		z-index: 99;
+		width: 128rpx;
+		height: 128rpx;
+		background-color: rgba(22, 119, 255, 1);
+		border-radius: 999px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		position: fixed;
+		bottom: 80rpx;
+		right: 40rpx;
+
+		img {
+			width: 80rpx;
+			height: 80rpx;
+		}
+	}
+
+	.add-popup {
+		/deep/.u-drawer {
+			left: 24rpx;
+			right: 24rpx;
+			bottom: 24rpx;
+			border-radius: 8px;
+		}
+
+		/deep/.u-action-sheet-item {
+			color: #101010;
+		}
+
+	}
+
+	// 删除
+	.delete {
+		position: fixed;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		background-color: #fff;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		// padding: 20rpx 0;
+		height: 120rpx;
+
+		img {
+			width: 48rpx;
+			height: 48rpx;
+		}
+
+		.text {
+			color: rgba(51, 51, 51, 1);
+			font-size: 20rpx;
+		}
+	}
+
+	// 删除确认弹框
+	.popup {
+		padding: 32rpx;
+		text-align: center;
+
+		.headline {
+			color: rgba(16, 16, 16, 1);
+			font-size: 36rpx;
+			font-weight: bold;
+		}
+
+		.hint {
+			color: rgba(16, 16, 16, 1);
+			font-size: 32rpx;
+			margin-top: 40rpx;
+		}
+
+		.btn-box {
+			margin-top: 82rpx;
+			display: flex;
+			justify-content: space-between;
+
+			.cancel {
+				width: 328rpx;
+				line-height: 80rpx;
+				border-radius: 4px;
+				background-color: rgba(222, 225, 228, 1);
+				color: rgba(51, 51, 51, 1);
+				font-size: 32rpx;
+			}
+
+			.confirm {
+				width: 328rpx;
+				line-height: 80rpx;
+				border-radius: 4px;
+				background-color: rgba(255, 68, 68, 1);
+				color: rgba(255, 255, 255, 1);
+				font-size: 32rpx;
+			}
+		}
+	}
+</style>