فهرست منبع

充电枪设置 ,保持一致

zhengkaixin 3 سال پیش
والد
کامیت
f32df1f72d

+ 573 - 0
components/u-double-picker.vue

@@ -0,0 +1,573 @@
+<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 }" 
+					
+				
+				>开始时间</view>
+				<view class="u-picker__title">{{ title }}</view>
+				<view
+					class="u-btn-picker u-btn-picker--tips" 
+					:style="{ color: cancelColor }" 
+				
+				
+				>
+					结束时间
+				</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 [];
+			}
+		},
+	 
+		// 当 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= []
+			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>

+ 635 - 429
pagesFinance/user/chargingGunSetup.vue

@@ -1,7 +1,26 @@
 <template>
 	<view>
+		
 		<u-navbar title="充电枪设置"></u-navbar>
 		<u-tabs :list="list" :is-scroll="false" :current="current" @change="change" active-color="#101010"></u-tabs>
+		
+		<u-modal v-model="show2" @confirm="submitApi()" :show-cancel-button='true' :confirm-text="'继续提交'" >
+			<view style="padding: 10px;text-align: center;">
+				<p style="padding-bottom: 10px;">以下预约时段存在问题:</p>
+				<p v-for="(item,i) in errorlist" :key="i" >
+					{{item.name}}{{item.value}}
+				</p>
+			</view>
+		</u-modal>
+
+	<u-select v-model="show" :title="'开始时间-结束时间'"
+	mode="mutil-column-auto" :list="listmutilcolumnauto" :default-value="defaultTime" @confirm="confirm"></u-select>
+
+		<!-- <udoublepicker v-model="show" 
+		:defaultTime="defaultTime" 
+		:defaultTime2="defaultTime2"
+		 @confirm="confirm" ></udoublepicker> -->
+
 <!-- 开放共享 -->
 		<view class="" v-if="current==0">
 			<view class="share-set" >
@@ -9,220 +28,20 @@
 					开放共享
 				</view>
 				<view class="">
-					<u-radio-group v-model="value">
-						<u-radio v-for="(item, index) in shareList" :key="index" :name="item.name"
-							:disabled="item.disabled">
-							{{item.name}}
-						</u-radio>
-					</u-radio-group>
-				</view>
-			
-			</view>
-			<!-- 开发时间设置 -->
-			<view class="main">
-				<view class="title">
-					每周开发时间段设置
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周一
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00b962"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 08:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add.png" alt="">
-						</view>
-						
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 08:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/sub.png" alt="">
-						</view>
-						
-					</view>
-				</view>
-				
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周二
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
-					</view>
-					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周三
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
-					</view>
+					<u-radio-group v-model="detail.enableShare" >
 					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周四
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
-					</view>
+						<u-radio  v-for="(item, index) in list2" :key="index+'a'" :name="item.value"
+							:disabled="item.disabled" active-color="#00b962">
 					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周五
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
-					</view>
-					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周六
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
-					</view>
+							{{item.name}}
 					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周日
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
-					</view>
+						</u-radio>
 					
+					</u-radio-group>
 				</view>
+			
 			</view>
+		
 		</view>
 		<!-- 预约设置 -->
 		<view class="" v-if="current==1">
@@ -231,11 +50,15 @@
 					开放预约
 				</view>
 				<view class="">
-					<u-radio-group v-model="value">
-						<u-radio  v-for="(item, index) in shareList" :key="index" :name="item.name"
-							:disabled="item.disabled">
+					<u-radio-group  v-model="detail.enableAppointment" >
+					
+						<u-radio  v-for="(item, index) in list2" :key="index+'b'" :name="item.value"
+							:disabled="item.disabled" active-color="#00b962">
+					
 							{{item.name}}
+					
 						</u-radio>
+					
 					</u-radio-group>
 					
 				</view>
@@ -246,11 +69,15 @@
 					预约自动确认
 				</view>
 				<view class="">
-					<u-radio-group v-model="value">
-						<u-radio  v-for="(item, index) in shareList" :key="index" :name="item.name"
-							:disabled="item.disabled">
+					<u-radio-group  v-model="detail.autoConfirm" >
+					
+						<u-radio   v-for="(item, index) in list2" :key="index+'c'" :name="item.value"
+							active-color="#00b962">
+					
 							{{item.name}}
+					
 						</u-radio>
+					
 					</u-radio-group>
 					
 				</view>
@@ -262,241 +89,189 @@
 					预留时长选项
 				</view>
 					<view class="radio-box">
-						<u-checkbox-group @change="checkboxGroupChange">
-							<u-checkbox 
-								
-								v-model="item.checked" 
-								v-for="(item, index) in timeList" :key="index" 
-								:name="item.name"
-							>{{item.name}}</u-checkbox>
-						</u-checkbox-group>
+						<u-checkbox-group  shape="square">
 						
-					</view>
-			</view>
-			<view class="main">
-				<view class="title">
-					每周开发时间段设置
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周一
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00b962"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 08:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add.png" alt="">
-						</view>
+							<u-checkbox   v-for="(item, index) in timeList"
+							 	v-model="item.checked"  @change="checkboxChange(item,$event)" 
+								:key="index" :name="item.value"
+								:disabled="item.disabled" active-color="#00b962">
 						
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 08:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/sub.png" alt="">
-						</view>
+								{{item.name}}
 						
-					</view>
-				</view>
-				
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周二
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
+							</u-checkbox>
+						</u-checkbox-group>
 						
 					</view>
-					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周三
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
+			</view>
+			 
+		</view>
+		
+		<!-- 开发时间设置 -->
+		<view class="main">
+			<view class="title">
+				{{current?'预约':'共享'}}时段 <span style="
+					float: right;
+					color: #53b56b;
+					font-size: 14px;
+				"
+				@click="copy"
+				v-show="current==1">
+				<u-icon name="file-text"></u-icon>
+				同步共享设置</span>
+			</view>
+			<view class="item" v-for="(item,i) in  weekSz" :key="i">
+				<view class="switch">
+					<view class="week">
+						{{item}} <!-- {{weekOpenSz[i].lookcollect}} -->
 					</view>
-					
+					<u-switch v-model="weekOpenSz[i].op" @change="change2($event,i)" size="40" active-color="#00b962"></u-switch>
 				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周四
+				
+				<view class="frame-box"   v-for="(item2,index) in  weekOpenSz[i].list"  :key="index">
+					<view class="time-frame">
+						<view class="frame-title">
+							开放时段 
 						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
+						<view class="time" @click="showDbTime(item2,index,i)">
+							{{item2.startTime }} 至 {{item2.endTime}}
 						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
+						<view class="iconfont more" @click="showDbTime(item2,index,i)" >
+							&#xe600;
 						</view>
-						
 					</view>
+					<view class="img" 
 					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周五
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
+					v-if="index==0&&weekOpenSz[i].list.length==2" >
+						<img src="../../assets/img/add.png" alt="">
 					</view>
+					<view class="img" 
 					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周六
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
+					 v-else-if="index==1" >
+						<img 
+						 @click="delItem(i)"
+						src="../../assets/img/sub.png" alt="">
 					</view>
+					<view class="img" 
 					
-				</view>
-				<view class="item">
-					<view class="switch">
-						<view class="week">
-							周日
-						</view>
-						<u-switch v-model="checked" size="40" active-color="#00e266"></u-switch>
-					</view>
-					<view class="frame-box">
-						<view class="time-frame">
-							<view class="frame-title">
-								开放时段
-							</view>
-							<view class="time">
-								00:00 至 24:00
-							</view>
-							<view class="iconfont more">
-								&#xe600;
-							</view>
-						</view>
-						<view class="img">
-							<img src="../../assets/img/add1.png" alt="">
-						</view>
-						
+					v-else >
+						<img 
+						@click="addItem(i)"
+						src="../../assets/img/add1.png" alt="">
 					</view>
-					
 				</view>
+				
 			</view>
+			
 		</view>
-		
 		<!-- 底部 -->
 		<view class="bottom">
 			<view class="radio-box">
-				<label class="radio">
-					<radio value="" />
-				</label>
+				
+				
+				
+				<u-checkbox-group>
+					<u-checkbox  v-model="detail.changeOther" shape="circle" ></u-checkbox>
+				</u-checkbox-group>
+				
 				<text class="text">将该设置同步到其他充电枪</text>
 			</view>
-				<u-button class="save" type="primary" >保存</u-button>
+				<u-button class="save" type="primary" @click="submit"  >保存</u-button>
 		</view>
 
 	</view>
 </template>
 
 <script>
+	import udoublepicker from '@/components/u-double-picker.vue'
+	import * as API from '@/apis/finance.js'
+	
 	export default {
+		components: {
+			udoublepicker
+		},
 		data() {
 			return {
+				listmutilcolumnauto:[],
+				list2: [{
+						value:"1",
+						name: "是"
+					},
+					{
+						value:"0",
+						name: "否"
+					}
+				],
+				errorlist:[],
+				detail:{
+				
+				},
+				weekSz:[
+					'周一','周二','周三','周四',
+					'周五','周六','周日',
+				],
+				weekOpenSzData:[
+					[{
+						op:0,
+						list:[]
+					},
+					{
+						op:0,
+						list:[]
+					},
+					{
+						op:0,
+						list:[]
+					},
+					{
+						op:0,
+						list:[]
+					},
+					{
+						op:0,
+						list:[]
+					},
+					{
+						op:0,
+						list:[]
+					},
+					{
+						op:0,
+						list:[]
+					}],[
+						{
+							op:0,
+							list:[]
+						},
+						{
+							op:0,
+							list:[]
+						},
+						{
+							op:0,
+							list:[]
+						},
+						{
+							op:0,
+							list:[]
+						},
+						{
+							op:0,
+							list:[]
+						},
+						{
+							op:0,
+							list:[]
+						},
+						{
+							op:0,
+							list:[]
+						}
+					]
+				],
+				obj1:[],
+				obj2:[],
+				show:false,
+				show2:false,
 				list: [{
 					name: '共享设置'
 				}, {
@@ -512,28 +287,459 @@
 						disabled: false
 					}
 				],
-				timeList:[{
-					name:"10分钟",
-					disabled: false
-				},
-				{
-					name:"20分钟",
-					disabled: false
-				},
-				{
-					name:"30分钟",
-					disabled: false
-				}],
+				timeList: [
+					{
+						value:"10",
+						name: "10分钟"
+					},
+					{
+						value:"20",
+						name: "20分钟"
+					},
+					{
+						value:"30",
+						name: "30分钟"
+					}
+				],
 				// u-radio-group的v-model绑定的值如果设置为某个radio的name,就会被默认选中
 				value: '',
-				current: 1,
-				checked:false
+				current: 0,
+				checked:false,
+				defaultTime:[],
+				defaultTime2:'',
+				selectIndex:0,
+				selectI:0,
+			}
+		},
+		onLoad(op){
+			this.initlistmutilcolumnauto();
+			this.id=op.id;
+			this.getInfo()
+		},
+		computed:{
+			weekOpenSz(){
+				
+				return this.weekOpenSzData[this.current]
 			}
 		},
 		methods: {
+			
+			initlistmutilcolumnauto(){
+				
+				function	formatNumber(num) {
+					return +num < 10 ? '0' + num : String(num);
+				}
+				function	getSz(obj,ivalue,jvalue) {
+					
+					if(jvalue==0){
+						var item={
+							value:ivalue*100+30,
+							label:formatNumber(ivalue)+":30",
+						}
+						obj.children.push(item)
+					}
+					
+					for(var i=ivalue+1;i< 24;i++){
+						for(var j=0;j< 2;j++){
+							var item={
+								value:i*100+j*30,
+								label:formatNumber(i)+":"+(j==0?'00':'30'),
+							}
+							obj.children.push(item)
+							
+						}
+					}
+					
+						var item={
+							value:24*100,
+							label:formatNumber(24)+":00",
+						}
+						obj.children.push(item)
+					
+					return obj.children;
+				}
+				this.listmutilcolumnauto=[]
+				for(var i=0;i< 24;i++){
+					for(var j=0;j< 2;j++){
+						var obj={
+							value:i*100+j*30,
+							label:formatNumber(i)+":"+(j==0?'00':'30'),
+							children:[]
+						}
+						obj.children=getSz(obj,i,j)
+						this.listmutilcolumnauto.push(obj)
+					}
+				}
+				console.log(this.listmutilcolumnauto);
+			},
+			copy(){
+				var list= this.weekOpenSzData[1]
+				 for(var i in  list){
+					 var obj1=  this.weekOpenSzData[1][i]
+					var obj0=  this.weekOpenSzData[0][i]
+					obj1.op=obj0.op;
+					obj1.list=[];
+					for(var j in  obj0.list){
+						var item=obj0.list[j]
+						var newObj=Object.assign({},item)
+						obj1.list.push(newObj);
+					}
+					
+					
+				 }
+				
+				
+				this.$nextTick(()=>{
+					 this.$forceUpdate()
+				})
+			},
+			
+			checkoverflow(){
+				
+				function getTime(time){
+					return new Date("2020/01/01 "+time).getTime();
+				}
+				var step =false;
+				this.errorlist=[];
+				
+				var list= this.weekOpenSzData[1]
+				 for(var i in  list){
+					//预约
+					var obj1=  this.weekOpenSzData[1][i]
+					//开放
+					var obj0=  this.weekOpenSzData[0][i]
+					//obj1.op=obj0.op;
+					//obj1.list=[];
+					
+					if(obj1.op&&!obj0.op){
+						this.errorlist.push({
+							name:this.weekSz[i],
+							value:"未开启共享"
+						})
+					}else if(obj1.op==0&&obj0.op==0){
+						
+					} else{
+						var optionList=[];
+						if(obj0.list.length==2){
+							//判断是否有交集
+							var startTime1=getTime(obj0.list[1].startTime);
+							var endTime1=getTime(obj0.list[1].endTime);
+							
+							var startTime0=getTime(obj0.list[0].startTime);
+							var endTime0=getTime(obj0.list[0].endTime);
+							
+							
+							if(startTime1>=startTime0&&endTime1<=endTime0){
+								optionList.push(obj0.list[0]);//并集
+								obj0.lookcollect="并集"
+								
+							}else if(startTime1<=startTime0&&endTime1>=endTime0){
+								optionList.push(obj0.list[1]);//并集
+								obj0.lookcollect="并集"
+								
+							}
+							else  if(endTime0<startTime1&&endTime0<=endTime1){
+								//不相交
+								optionList=obj0.list;
+								obj0.lookcollect="不相交"
+								
+							}else  if(endTime1<startTime0&&endTime1<=endTime0){
+								//不相交
+								
+								obj0.lookcollect="不相交"
+								optionList=obj0.list;
+							}else{
+								obj0.lookcollect="交集"
+								
+								//交集
+								if(startTime0<startTime1){
+									optionList.push({
+										startTime:obj0.list[0].startTime,
+										endTime:obj0.list[1].endTime
+									});
+								}else{
+									optionList.push({
+										startTime:obj0.list[1].startTime,
+										endTime:obj0.list[0].endTime
+									});
+								}
+								
+							}
+							
+							// if(){
+							// 	optionList.push({
+							// 		startTime:obj0.list[1].startTime
+							// 		endTime:obj0.list[1].startTime
+							// 	})
+							// }
+							
+						}else{
+							optionList=obj0.list;
+						}
+						
+						
+						for(var j in  obj1.list){
+						
+							var item1=obj1.list[j]
+							var bl=true;
+							for(var k in  optionList){
+								var item2=optionList[k];
+								var startTime1=getTime(item1.startTime);
+								var endTime1=getTime(item1.endTime);
+								
+								var startTime0=getTime(item2.startTime);
+								var endTime0=getTime(item2.endTime);
+								
+								if(startTime1>=startTime0&&endTime1<=endTime0){
+									
+									bl=false;
+								}
+							}
+							if(bl){
+								this.errorlist.push({
+									name:this.weekSz[i],
+									value:"不在开放时段"
+								})
+							}
+						}
+					}
+				
+					
+					//this.weekOpenSzData[0][i]=obj0
+					
+				 }
+				 
+				 if(this.errorlist.length==0){
+					
+					 this.submitApi()
+				 }else{
+					 this.show2=true;
+				 }
+				 
+			},
+			submit(){
+				this.detail.sharedWeekSetting=""
+				this.detail.reserveWeekSetting=""
+				
+				var list = this.weekOpenSzData[0];
+				var listJson=[]
+				for(var i in list){
+					var obj=list[i];
+					listJson=listJson.concat(obj.list);
+				}
+				this.detail.sharedWeekSetting=JSON.stringify(listJson)
+				
+				if(this.detail.enableShare=="1"){
+				
+					if(listJson.length==0){
+						uni.showToast({
+							title:"开放共享功能需要添加【共享时段】"
+						})
+						return
+					}
+				}
+				// var sz=[]
+				// for(var i in this.weekList){
+				// 	var item=this.weekList[i]
+				// 	if(item.checked){
+				// 		sz.push(item.value)
+				// 	}
+				// }
+				// var weekDay=sz.join();
+				
+				
+				var sz2=[]
+				for(var i in this.timeList){
+					var item=this.timeList[i]
+					if(item.checked){
+						sz2.push(item.value)
+					}
+				}
+				var reserveMinutes=sz2.join();
+				this.detail.reserveMinutes=reserveMinutes
+				
+				var list = this.weekOpenSzData[1];
+				var listJson=[]
+				for(var i in list){
+					var obj=list[i];
+					listJson=listJson.concat(obj.list);
+				}
+				this.detail.reserveWeekSetting=JSON.stringify(listJson)
+				
+				if(this.detail.enableAppointment=="1"){
+					
+				
+					if(listJson.length==0){
+						uni.showToast({
+							title:"开放预约功能需要添加【预约时段】"
+						})
+						return
+					}
+					 
+					if(reserveMinutes==""){
+						uni.showToast({
+							title:"开放预约功能需要选择【预留时长】"
+						})
+						return
+					}
+					this.checkoverflow()
+					
+					
+				}else{
+					this.submitApi()
+				}
+				
+			},
+			submitApi(){
+				uni.showLoading({
+					title:"加载中",mask:true,
+				})
+				API.saveGunShare(this.detail).then((res) => {
+					
+					uni.hideLoading()
+					uni.showToast({
+						title:"操作成功"
+					})
+				
+					
+				}).catch(error => {
+						uni.showToast({
+							
+							title:error
+						})
+				})
+			},
+			getInfo(){
+				uni.showLoading({
+					title:"加载中",mask:true,
+				})
+				API.gunShareDetail({
+					gunId:this.id
+				}).then((res) => {
+					this.detail={};
+					this.detail.sharedSettingList=res.data.sharedSettingList
+					this.detail.reserveSettingList=res.data.reserveSettingList
+					var obj=res.data.gunShare;
+					for(var i in obj){
+						
+						if(obj[i]===true){
+							this.detail[i]="1";
+						}else if(obj===false){
+							this.detail[i]="0";
+						}else {
+							this.detail[i]=obj[i];
+						}
+					}
+					
+					if(this.detail.reserveMinutes){
+						var sz=this.detail.reserveMinutes.split(",")
+						for(var i in this.timeList){
+							var item=this.timeList[i]
+						
+							if(sz.indexOf(item.value)!=-1){
+								item.checked=true;
+							}
+						}
+					}
+					
+					if(this.detail.sharedSettingList.length){
+						
+						var list=this.detail.sharedSettingList;
+						var weekOpenSzDataList=this.weekOpenSzData[0]
+						for(var i in list){
+							var obj={
+								weekDay:list[i].weekDay,
+								startTime:list[i].startTime,
+								endTime:list[i].endTime
+							}
+							weekOpenSzDataList[parseInt(list[i].weekDay)-1].op=1;
+							weekOpenSzDataList[parseInt(list[i].weekDay)-1].list.push(obj)
+						}
+					}
+					if(this.detail.reserveSettingList.length){
+						var list=this.detail.reserveSettingList;
+						var weekOpenSzDataList=this.weekOpenSzData[1]
+						for(var i in list){
+							var obj={
+								weekDay:list[i].weekDay,
+								startTime:list[i].startTime,
+								endTime:list[i].endTime
+							}
+							weekOpenSzDataList[parseInt(list[i].weekDay)-1].op=1;
+							weekOpenSzDataList[parseInt(list[i].weekDay)-1].list.push(obj)
+						}
+					}
+				
+					uni.hideLoading()
+					 
+				}).catch(error => {
+						uni.showToast({
+							
+							title:error
+						})
+				})
+			},
+			checkboxChange(item,e){
+				item.checked=e.value
+				this.$forceUpdate()
+				console.log(e)
+			},
+			confirm(e){
+				console.log(e)
+				
+				
+				var obj=this.weekOpenSz[this.selectI].list[this.selectIndex];
+				obj.startTime=e[0].label;
+				obj.endTime=e[1].label;
+			},
+			showDbTime(item,index,i){
+				this.show=true;
+				var sz=[];
+				for(var i in this.listmutilcolumnauto){
+					var obj=this.listmutilcolumnauto[i]
+					if(obj.label==item.startTime){
+						sz.push(parseInt(i))
+						
+						for(var j in obj.children){
+							var ob=obj.children[j]
+							if(ob.label==item.endTime){
+								sz.push(parseInt(j))
+							}
+						}
+					}
+				}
+				this.defaultTime=sz;
+				console.log(sz)
+			},
 			change(index) {
 				this.current = index;
+			},
+			change2(index,szindex) {
+				
+				if(index){
+					
+					if(this.weekOpenSz[szindex].list.length==0){
+						this.weekOpenSz[szindex].list.push({
+							weekDay:szindex+1,
+							startTime:'00:00',
+							endTime:'08:00'
+						})
+					}	
+				}else{
+					this.weekOpenSz[szindex].list=[]
+				}
+			},
+			addItem(szindex){
+				this.weekOpenSz[szindex].list.push({
+					weekDay:szindex+1,
+					startTime:'20:00',
+					endTime:'24:00'
+				})
+			},
+			delItem(szindex){
+				this.weekOpenSz[szindex].list.pop()
 			}
+			
 		}
 	}
 </script>

+ 2 - 2
pagesFinance/user/deviceList.vue

@@ -24,8 +24,8 @@
 				
 			}"
 			class="deviceList-item " >
-				<view class="deviceList-head">{{item.name}}</view>
-				<view class="deviceList-main">{{item.deviceNo}}</view>
+				<view class="deviceList-head">{{item.name}} <span style="float: right;font-size: 12px;" class="iconfont more">详情&#xe600;</span></view>
+				<view class="deviceList-main">{{item.deviceNo}} </view>
  				<view class="deviceList-foot">
 					<view class="deviceList-label">{{ options0[item.type].label}}</view>
 					<view class="deviceList-label" 

+ 5 - 2
pagesFinance/user/pileManagement.vue

@@ -98,7 +98,7 @@
 			</view>
 			
 			<view class="iconfont more"  v-if="isAllow"	
-				 @click="gotoUrl('pagesFinance/user/myPile?id='+item.id)" 
+				 @click="gotoUrl('pagesFinance/user/chargingGunSetup?id='+item.id)" 
 			>
 				<text class="set" >设置</text>&#xe600;
 			</view>
@@ -267,10 +267,13 @@
 		padding: 16px 0 0px 16px;
 
 		.name {
-			height: 20px;
+			height: 30px;
 			color: rgba(16, 16, 16, 100);
 			font-size: 20px;
 			font-weight: 600;
+			    overflow: hidden;
+			    text-overflow: ellipsis;
+			    white-space: nowrap;
 		}
 
 		.info {

+ 1 - 1
pagesFinance/user/stationsList.vue

@@ -20,7 +20,7 @@
 				<span class="btn12 btn1"  v-if="item.type=='1'"  >慢冲</span>
 				<span class="btn12 btn2" v-if="item.type=='2'" >快冲</span>
 				{{item.name}}</view>
- 				<view class="deviceList-head">{{item.address}}<span style="float: right;">></span></view>
+ 				<view class="deviceList-head">{{item.address}}<span style="float: right;" class="iconfont more">&#xe600;</span></view>
 				<view class="deviceList-foot">
 					
 					<view class="deviceList-label" style="color: #333333;"  >总数{{item.totalNum}}</view>