xytSk-App/pages/mypage/compents/wxyh/index.vue

<template>
	<view>
		<u-navbar title="维修养护" :autoBack="true" :titleStyle="{
				fontSize:'18px'
			}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
		</u-navbar>
		<view style="background-color: #f0f0f0;padding: 10px;margin-top: 44px;">
			<!-- <view style="padding:0 10px;backgroundColor:#fff"> -->
				<view class="time-ranger">
					<view class="start-time">
						<text>开始时间</text>
						<text @click="showTime=true" style="margin-left:15%;color:#3399ef">{{startTime}}</text>
					</view>
					<view class="end-time">
						<text>结束时间</text>
						<text @click="showTime1=true" style="margin:0 15%;color:#3399ef">{{endTime}}</text>
						<view class="search-btn" @click="searchTm">
							搜索
						</view>
					</view>
				</view>
			<!-- </view> -->
			<view class="" style="height:calc(100vh - 150px);overflow: auto;" v-if="dataList.length !== 0">
				<view class="" v-for="item in dataList" class="contentItemWx" @click="toDetail(item)">
					<view class="contentItem">
						<view class="itemWxyhT">
							<text>{{type[item.maintainType]}}</text>
							<uni-icons type="right"></uni-icons>
						</view>
						<view class="itemWxyhB">
							<text>{{item.reportTime}}</text>
						</view>
					</view>
				</view>
			</view>
			<view style="height:calc(100vh - 150px);display: flex;align-items: center;justify-content: center;background-color: #fff;" v-else>
				<image src="../../../../static/empty.png" mode="" ></image>
			</view>
			<!-- <view class="content">
				<formTop labelWidth="150rpx" />
			</view> -->
			<!-- 			<view class="content" style="margin-top: 10px;">
				<formBottom  labelWidth="150rpx" @submitForm='submitForm'/>
			</view> -->
		</view>
		<!-- <button @click="submitForm">Submit</button> -->
		<u-datetime-picker :show="showTime" v-model="stm" mode="date" @confirm="showTime=false"
			@cancel="showTime=false"></u-datetime-picker>
		<u-datetime-picker :show="showTime1" v-model="etm" mode="date" @confirm="showTime1=false"
			@cancel="showTime1=false"></u-datetime-picker>
	</view>
</template>

<script>
	import formTop from './formZdy/formTop.vue'
	import formBottom from './formZdy/formBottom.vue'
	import moment from 'moment'
	export default {
		components: {
			formTop,
			formBottom
		},
		data() {
			return {
				formData: {
					reportUserName: '',
					reportTime: moment().format('YYYY-MM-DD HH:mm:ss'),
					userId: ''
				},
				showTime: false,
				showTime1: false,
				start: '请选择开始时间',
				end: '请选择结束时间',
				stm:moment().startOf('year').format('YYYY-MM-DD'),
				etm:moment().format('YYYY-MM-DD'),
				dataList: [],
				type: {
					1: "溢洪道清障",
					2: "除草除杂",
					3: "设备养护",
					4: "环境清洁",
					5: "危险提示",
					6: "其他",
				},
			}
		},
		onShow() {
			this.getList()
		},
		computed: {
			startTime: function () {
		
				return this.stm ? moment(this.stm).format('YYYY-MM-DD') : this.start
			},
			endTime: function () {
				return this.etm ? moment(this.etm).format('YYYY-MM-DD') : this.end
			}
		},
		methods: {
			toDetail(item){
				uni.navigateTo({
					url:'/pages/mypage/compents/wxyh/formZdy/index?item='+JSON.stringify(item)
				})
			},
			getList() {
				let params = {
					"pageSo": {
						"pageSize": 999,
						"pageNumber": 1
					},
					"dateTimeSo": {
						start:this.stm?moment(this.stm).format('YYYY-MM-DD 00:00:00'):'',
						end:this.etm?moment(this.etm).format('YYYY-MM-DD 23:59:59'):''
					}
				}
				uni.$http.post('/gunshiApp/xyt/maintain/service/page', params).then(res => {
					this.dataList = res.data.data.records
				})
			},
			submitForm(params) {
				// 
				console.log({
					...params,
					...this.formData
				});
				uni.$http.post('/gunshiApp/xyt/maintain/service/insert', {
					...params,
					...this.formData
				}).then(res => {
					if (res.data.code == 200) {
						uni.$u.toast('新增成功')
						uni.navigateBack()
					}
				})
			},
			goBack() {
				console.log(12121);

				uni.navigateBack()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		/* margin: 10px; */
		padding: 10px;
		/* width: 95%; */
		background-color: #fff;
	}

	.itemWxyhT {

		display: flex;
		justify-content: space-between;
		    font-family: "微软雅黑 Bold", "微软雅黑 Regular", 微软雅黑, sans-serif;
		    font-weight: 700;
		    font-style: normal;
		    font-size: 15px;
		    color: rgb(102, 102, 102);
			padding-bottom: 10px;
			border-bottom: 1px solid #f0f0f0;
	}
	.itemWxyhB{
		    color: rgba(127, 127, 127, 0.8);
			padding-top: 10px;
	}
	.contentItemWx{
		background-color: rgba(255, 255, 255, 1);
		padding: 10px;
		margin-bottom: 10px;
		margin-top: 10px;
	}
</style>