wy

components/lyy-table/lyy-table.vue

@@ -51,7 +51,11 @@
 									:class="[content[header.key] ==2?'warnColor':'']">{{content[header.key] === 0 ? '待处理':content[header.key] === 1 ? '处理中' : '已处理'}}</text>
 							</template>
 							<template v-else>
-								<view v-if="header.label == '操作'" class="editColor" @click="EditAlarm(content)">处理
+								<view v-if="header.label == '操作' && !battery" class="editColor" @click="EditAlarm(content)">处理
+								</view>
+								<view v-if="header.label == '操作' && battery" class="editColor" @click="EditAlarmInfo(content)">详情
+								</view>
+								<view v-if="header.label == '时段明细'" class="editColor" @click="EditAlarmDetail(content)">明细
 								</view>
 								<text v-else>{{content[header.key]||emptyString}}</text>
 							</template>
@@ -120,6 +124,11 @@
 				type: Boolean,
 				default: false
 			},
+			//服务记录是否显示详情
+			battery: {
+				type: Number,
+				default:3
+			},
 			//固定首列 ver1.3.3弃用
 			/*firstColumnFixed: {
 			    type: Boolean,
@@ -260,6 +269,14 @@
 			EditAlarm(row) {
 				this.$emit('faultDrawer', row)
 			},
+			//换电详情弹出框
+			EditAlarmInfo(row) {
+				this.$emit('drawer', row)
+			},
+			//充电明细弹出框
+			EditAlarmDetail(row) {
+				this.$emit('charging', row)
+			},
 			//点击排序表头时存储上次排序列名，并循环切换排序方式
 			doSort(item) {
 

pages/fault-alarm/components/Fault.vue

@@ -28,7 +28,7 @@
 		</view>
 		<view class="main_table">
 			<!-- <FaultTable :loading="loading" :datalist="datalist"></FaultTable> -->
-			<lyy-table @faultDrawer="faultDrawer" :headerFixed="true" :showLoadMore="showLoadMore" :loadMore="loadMore"
+			<lyy-table @faultDrawer="faultDrawer" :headerFixed="true" :showLoadMore="showLoadMore" :loadMore="loadMore" :battery="0"
 				:columnFixed=1 :contents="datalist" :headers="headers" @onPullup="pullup">
 			</lyy-table>
 		</view>

pages/fault-alarm/components/FireAlarm.vue

@@ -28,7 +28,7 @@
 		</view>
 		<view class="main_table">
 			<!-- <FaultTable :loading="loading" :datalist="datalist"></FaultTable> -->
-			<lyy-table @faultDrawer="faultDrawer" :headerFixed="true" :showLoadMore="showLoadMore" :loadMore="loadMore"
+			<lyy-table @faultDrawer="faultDrawer" :headerFixed="true" :showLoadMore="showLoadMore" :loadMore="loadMore" :battery="0"
 				:columnFixed=1 :contents="datalist" :headers="headers" @onPullup="pullup">
 			</lyy-table>
 		</view>

pages/service-recode/components/change.vue

@@ -23,18 +23,44 @@
 		</view>
 		<view class="main_table box">
 			<view style="margin: 20px;">
-				<lyy-table :headerFixed="true"  :showLoadMore="showLoadMore" :loadMore="loadMore" :columnFixed = 1 :contents="changelist" :headers="headers" @onPullup="pullup"></lyy-table>
+				<lyy-table @drawer='drawer' :headerFixed="true" :battery="1" :showLoadMore="showLoadMore" :loadMore="loadMore" :columnFixed = 1 :contents="changelist" :headers="headers" @onPullup="pullup"></lyy-table>
 			</view>
 		</view>
+		<!--右侧抽屉 -->
+		<uni-drawer ref="showRight" mode="right" :width="400" :mask-click="true">
+			<scroll-view style="height: 100%;" scroll-y="true">
+				<PublicDrawer :flag="true" :title="titlenum" @closeDrawer="closeDrawer">
+					<view class="header_drawer_btn">
+						<view class="header_drawer_btn_left" :class="batteryInfoActive == 0?'active':''" @click="batteryInfoActive = 0">
+							基本信息
+						</view>
+						<view class="header_drawer_btn_right" :class="batteryInfoActive == 1?'active':''" @click="batteryInfoActive = 1">
+							车辆信息
+						</view>
+						<view class="header_drawer_btn_right" :class="batteryInfoActive == 2?'active':''" @click="batteryInfoActive = 2">
+							预选电池
+						</view>
+						<view class="header_drawer_btn_right" :class="batteryInfoActive == 3?'active':''" @click="batteryInfoActive = 3">
+							同步信息
+						</view>
+					</view>
+					<view class="drawer_main">
+						<changeDrawer :batteryInfoActive = 'batteryInfoActive' :infodata = "dataInfo"></changeDrawer>
+					</view>
+				</PublicDrawer>
+			</scroll-view>
+		</uni-drawer>
+		<!-- 右侧抽屉结束 -->
 	</view>
 </template>
 
 <script>
 	import lyyTable from '@/components/lyy-table/lyy-table.vue'
+	import changeDrawer from "../components/changeDrawer.vue"
 	export default {
 		name: 'change',
 		components:{
-			lyyTable
+			lyyTable,changeDrawer
 		},
 		data() {
 			return {
@@ -49,6 +75,9 @@
 					swapEndTime: undefined,
 					 orderByWays: 'desc'// 排序方式
 				},
+				dataInfo:{},
+				batteryInfoActive:0,//0代表基本信息1代表车辆信息2预选电池3同步信息
+				titlenum:'换电详情',
 				time:[],//换电日期
 				range: [
 					{
@@ -80,7 +109,12 @@
 					label: '车牌号',
 					key: 'vehiclePlate',
 					widtd: 100
-				}, {
+				}, 
+				{
+					label: '车辆识别码',
+					key: 'vehicleVin',
+					widtd: 100
+				},{
 					label: '换电开始时间',
 					key: 'swapBeginTime',
 					widtd: 200
@@ -95,15 +129,15 @@
 					
 				},{
 					label: '亏电电池SN',
-					key: 'vehicleVin',
+					key: 'vehicleSn',
 					widtd: 200,
 				}, {
 					label: '亏电电池SOC',
-					key: 'swapDuration',
+					key: 'vehicleSoc',
 					widtd: 125,
 				}, {
 					label: '亏电电池SOH',
-					key: 'swapDuration',
+					key: 'vehicleSoh',
 					widtd: 125,
 				},  {
 					label: '满电电池SN',
@@ -115,13 +149,18 @@
 					widtd: 125,
 				},  {
 					label: '满电电池SOH',
-					key: 'vehicleSoh',
+					key: 'swapSoh',
 					widtd: 125,
 				},  {
 					label: '换电结果',
 					key: 'swapState',
 					widtd: 125,
-				}, ],
+				}, 
+				{
+					label: '操作',
+					key: 'id',
+					widtd: 98,
+				}],
 				changelist:[],
 				
 				// 数据总量
@@ -135,6 +174,10 @@
 			this.getswapList()
 		},
 		methods: {
+			//关闭抽屉
+			closeDrawer() {
+				this.$refs.showRight.close();
+			},
 			//充电机下拉选择事件
 			changeId(e) {
 				if(e == 4){
@@ -163,7 +206,6 @@
 							})
 							this.total = res.total;
 						}
-						console.log(res,'res换电')
 					}).catch(err => {
 						console.error(err)
 					})
@@ -202,6 +244,17 @@
 					this.loadMore = 'loading'
 				}
 			},
+			//抽屉
+			drawer(item) {
+				// console.log(1111111111111111)
+				this.$refs.showRight.open();
+				this.dataInfo = item;
+				// console.log(item, 'item')
+			},
+			//关闭抽屉
+			closeDrawer(){
+				this.$refs.showRight.close();
+			},
 		}
 	}
 </script>
@@ -299,4 +352,34 @@
 	.last_box{
 		width: 390px;
 	}
+	.header_drawer_btn{
+		display: flex;
+		font-size: 14px;
+		font-family: PingFang SC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #FFFFFF;
+		.header_drawer_btn_left{
+			width: 74px;
+			height: 32px;
+			background: #263042;
+			border-radius: 2px 0px 0px 2px;
+			line-height: 32px;
+			text-align: center;
+		}
+		.header_drawer_btn_right{
+			line-height: 32px;
+			text-align: center;
+			width: 74px;
+			height: 32px;
+			background: #263042;
+			border-radius: 0px 2px 2px 0px;
+		}
+		.active{
+			color: black;
+			background: #91FDB9;
+		}
+	}
+	.drawer_main{
+		padding-top: 20px;
+	}
 </style>

pages/service-recode/components/changeDrawer.vue

@@ -0,0 +1,121 @@
+<template>
+	<view class="content_main">
+		<uni-forms :modelValue="infodata" v-if="batteryInfoActive == 0">
+			<uni-forms-item label="换电编号:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.swapId || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="车牌号:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.vehiclePlate || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="换电结果:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.swapState || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="换电开始时间:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.swapBeginTime || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="安装满电时长:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.fullDuration || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="换电时长:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.swapDuration || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="满电电池SN:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.swapSn|| '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="满电电池SOC:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.swapSoc|| '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="满电电池SOH:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.swapSoh || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="亏电电池SN:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.vehicleSn || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="亏电电池SOC:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.vehicleSoc || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="亏电电池SOH:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.vehicleSoh || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+
+		</uni-forms>
+		<uni-forms :modelValue="infodata" v-if="batteryInfoActive == 1">
+			<uni-forms-item label="车牌号:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.vehiclePlate || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="车辆识别码:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.vehicleVin || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="车辆里程(km):" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.vehicleOdo || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+		</uni-forms>
+		<uni-forms :modelValue="infodata" v-if="batteryInfoActive == 2">
+			<uni-forms-item label="预选电池仓位:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.preselectionCode || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="预选满电电池SN:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.preselectionSn || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="预选满电电池SOC:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.preselectionSoc || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="预选满电电池SOH:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.preselectionSoh || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+		</uni-forms>
+		<uni-forms :modelValue="infodata" v-if="batteryInfoActive == 3">
+			<uni-forms-item label="同步状态:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.state || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+			<uni-forms-item label="同步时间:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.uploadTime || '-'" placeholder="请输入" disabled />
+			</uni-forms-item>
+		</uni-forms>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'changeDrawer',
+		props: ['infodata', 'batteryInfoActive'],
+		data() {
+			return {}
+		},
+	
+		created() {
+			if (this.infodata.state == 0) {
+				this.infodata.state = '待上传'
+			} else if (this.infodata.state == 1) {
+				this.infodata.state ='上传成功'
+			} else if (this.infodata.state == 2) {
+				this.infodata.state ='上传失败'
+			} else {
+				this.infodata.state = null
+			}
+		}
+	}
+</script>
+<style lang="scss" scoped>
+	::v-deep .uni-forms-item__content {
+		background: rgba(255, 255, 255, 0);
+		border-radius: 2px 2px 2px 2px;
+		border: 1px solid #263042;
+
+		.uni-easyinput__content {
+			background: none !important;
+			border: none !important;
+			color: #fff;
+		}
+
+	}
+
+	::v-deep .uni-forms-item {
+		width: auto !important;
+	}
+
+	.content_main {
+		height: 665px;
+		overflow: auto;
+	}
+</style>

pages/service-recode/components/recharge.vue

@@ -25,19 +25,34 @@
 		<view class="main_table box">
 			<!-- <PublicTable :loading="loading" :tableData="tableData"></PublicTable> -->
 			<view style="margin: 20px;">
-				<lyy-table :headerFixed="true" :showLoadMore="showLoadMore" :loadMore="loadMore" :columnFixed=1
-					:contents="contents" :headers="headers" @onPullup="pullup"></lyy-table>
+				<lyy-table :headerFixed="true" :battery="1" :showLoadMore="showLoadMore" :loadMore="loadMore"
+					:columnFixed=1 :contents="contents" :headers="headers" @onPullup="pullup" @charging="charging">
+				</lyy-table>
 			</view>
 		</view>
+
+		<!--右侧抽屉 -->
+		<uni-drawer ref="showRight" mode="right" :width="400" :mask-click="true">
+			<scroll-view style="height: 100%;" scroll-y="true">
+				<PublicDrawer :flag="true" :title="titlenum" @closeDrawer="closeDrawer">
+					<view class="drawer_main">
+						<rechargeDrawer :infodata="dataInfo"></rechargeDrawer>
+					</view>
+				</PublicDrawer>
+			</scroll-view>
+		</uni-drawer>
+		<!-- 右侧抽屉结束 -->
 	</view>
 </template>
 
 <script>
 	import lyyTable from '@/components/lyy-table/lyy-table.vue'
+	import rechargeDrawer from "../components/rechargeDrawer.vue"
 	export default {
 		name: 'recharge',
 		components: {
-			lyyTable
+			lyyTable,
+			rechargeDrawer
 		},
 		data() {
 			return {
@@ -45,7 +60,7 @@
 				rechargeData: {
 					chgSn: undefined, //电池编号
 					chargerId: undefined, //充电机id号
-					
+
 					chgBeginTime: undefined, //开始时间
 					chgEndTime: undefined, //结束时间
 					// 每页数据量
@@ -54,6 +69,8 @@
 					page: 1,
 					orderByWays: "desc", //降序
 				},
+				dataInfo: {}, //弹出框数据
+				titlenum: '充电明细',
 				time: [], //时间
 				chargerList: [], //充电机数据
 				// 数据总量
@@ -109,6 +126,11 @@
 						key: 'chgCapacity',
 						widtd: 125,
 					},
+					{
+						label: '时段明细',
+						key: 'id',
+						widtd: 98,
+					}
 				],
 				contents: [],
 				showLoadMore: false,
@@ -121,6 +143,16 @@
 			this.getchargeList()
 		},
 		methods: {
+			//关闭抽屉
+			closeDrawer() {
+				this.$refs.showRight.close();
+			},
+			//抽屉
+			charging(item) {
+				this.$refs.showRight.open();
+				this.dataInfo = item;
+				// console.log(item, 'item')
+			},
 			//充电机下拉选择事件
 			changeId(e) {
 				console.log(e, 'e')
@@ -167,7 +199,6 @@
 			getchargeList() {
 				this.$http.chargeList(this.rechargeData)
 					.then(res => {
-						console.log(res, 'res')
 						if (res.code == 0) {
 							this.showLoadMore = false
 							this.contents.push(...res.data.records);
@@ -182,7 +213,6 @@
 			ChargeCode() {
 				this.$http.getChargeCode()
 					.then(res => {
-						console.log(res, 'res充电机的数据')
 						if (res.code == 0) {
 							res.data.forEach(item => {
 								this.chargerList.push({

pages/service-recode/components/rechargeDrawer.vue

@@ -0,0 +1,41 @@
+<template>
+	<view>
+		<uni-forms :modelValue="infodata">
+			<uni-forms-item label="开始时间段:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.chgBeginTime || '-'" placeholder="请输入" disabled/>
+			</uni-forms-item>
+			<uni-forms-item label="结束时间段:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.chgEndTime || '-'" placeholder="请输入" disabled/>
+			</uni-forms-item>
+			<uni-forms-item label="充电量KWH:" name="name" label-align="right" label-width="120px">
+				<uni-easyinput type="text" v-model="infodata.chgCapacity || '-'" placeholder="请输入" disabled/>
+			</uni-forms-item>
+		</uni-forms>
+	</view>
+</template>
+
+<script>
+export default {
+	name:'rechargeDrawer',
+	props:['infodata'],
+	data() {
+		return {
+		
+		}
+	},
+	}
+
+	
+</script>
+<style lang="scss" scoped>
+	::v-deep .uni-forms-item__content{
+		background: rgba(255,255,255,0);
+		border-radius: 2px 2px 2px 2px;
+		border: 1px solid #263042;
+		.uni-easyinput__content{
+			background: none !important;
+			border: none !important;
+			color: #fff;
+		}
+	}
+</style>