<template>
|
<default-header-page-layout ref="page" title="班组维护">
|
<view class="page-frame with-action-user-row" :style="{height:pageBodyHeight+'px'}" v-if="pageBodyHeight">
|
<action-user-row />
|
<view class="with-action-user-row-page-content">
|
<view class="content">
|
<view class="card" v-for="(item,index) in data" :key="index">
|
<view class="card-title">班组名称:{{item.shiftName}}</view>
|
<u-row
|
style="justify-content:space-between;width:100%;flex-wrap: wrap;border-bottom: 2rpx solid #eee;padding-bottom:10rpx;">
|
<!-- <u-col span="12">
|
<u-row style="width:100%;flex-wrap: wrap;">
|
<u-col span="4">：</u-col>
|
<u-col span="8">{{item.}}</u-col>
|
</u-row>
|
</u-col> -->
|
|
<u-col span="12">
|
<u-row style="width:100%">
|
<u-col span="4">是否隔日：</u-col>
|
<u-col span="8">{{item.isNextDay?'是':'否'}}</u-col>
|
</u-row>
|
</u-col>
|
<u-col span="12">
|
<view class="demo-layout bg-purple card-item">
|
<u-row>
|
<u-col :span="4">开始时间：</u-col>
|
<u-col :span="8">{{item.shiftStartTime}}</u-col>
|
</u-row>
|
</view>
|
</u-col>
|
<u-col :span="12">
|
<u-row style="width:100%">
|
<u-col span="4">结束时间：</u-col>
|
<u-col span="8">{{item.shiftEndTime}}</u-col>
|
</u-row>
|
</u-col>
|
|
<u-col span="12">
|
<u-row style="width:100%">
|
<u-col span="4">班组长：</u-col>
|
<u-col span="8">{{item.shiftRemark}}</u-col>
|
</u-row>
|
</u-col>
|
</u-row>
|
<view class="card-action">
|
<u-button @click="toCreateShift('edit',item)"
|
style="width:150rpx;height:60rpx;margin: 10rpx 0 0;" text="修改"
|
type="primary"></u-button>
|
</view>
|
</view>
|
</view>
|
|
</view>
|
</view>
|
|
<!-- 新增班组 -->
|
<template v-slot:footer>
|
<view class="bottom-btns-row" v-if="data.length<2">
|
<template>
|
<div class="btn-frame">
|
<u-button size="large" text="新增班组" :custom-style="{backgroundColor:'#F18201',color:'#fff'}"
|
@click="toCreateShift('add')"></u-button>
|
</div>
|
</template>
|
</view>
|
</template>
|
</default-header-page-layout>
|
</template>
|
|
<script>
|
import DefaultHeaderPageLayout from '@/components/DefaultHeaderPageLayout.vue'
|
import ActionUserRow from '@/components/ActionUserRow.vue'
|
import {
|
getShiftInfo
|
} from '@/api/shift/index.js'
|
import qs from 'qs'
|
export default {
|
name: 'shift',
|
components: {
|
DefaultHeaderPageLayout,
|
ActionUserRow
|
},
|
data() {
|
return {
|
pageBodyHeight: 0,
|
data: []
|
}
|
},
|
created() {
|
this.getShiftInfo()
|
},
|
methods: {
|
|
// 跳转到创建巡检任务页面
|
toCreateShift(type, item = {}) {
|
item.type = type
|
uni.navigateTo({
|
url: `/pages/shift/addOrEditShift?${qs.stringify(item)}`
|
})
|
},
|
|
// 获取班组数据
|
async getShiftInfo() {
|
try {
|
let {
|
data
|
} = await getShiftInfo({
|
pageNo: 1,
|
pageSize: 10
|
})
|
console.log(data.rows);
|
this.data = data.rows
|
} catch (e) {
|
//TODO handle the exception
|
console.log(e);
|
}
|
},
|
|
/* 页面初始化获取页面body高度的定时器 */
|
startInitInterval(callback) {
|
this.initInterVal = setInterval(() => {
|
if (this.pageBodyHeight) {
|
this.clearInitInterval()
|
callback && callback()
|
} else {
|
this.pageBodyHeight = this.$refs.page.getBodyHeight()
|
}
|
}, 200)
|
},
|
/* 清除定时器 */
|
clearInitInterval() {
|
try {
|
clearInterval(this.initInterVal)
|
this.initInterVal = null
|
} catch (e) {
|
//TODO handle the exception
|
}
|
}
|
},
|
onReady() {
|
this.startInitInterval(() => {
|
/* 页面初始化后需要执行的代码在这边调用 */
|
})
|
},
|
onUnload() {
|
this.clearInitInterval()
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.content {
|
// width:100%;
|
height: auto;
|
margin: 0 20rpx;
|
|
|
|
.card {
|
// width: 100%;
|
height: auto;
|
background-color: #fff;
|
border-radius: 10rpx;
|
padding: 10rpx 20rpx;
|
margin-bottom: 20rpx;
|
font-size: 40rpx;
|
|
.card-title {
|
font-size: 50rpx;
|
font-weight: 700;
|
padding-bottom: 5rpx;
|
border-bottom: 2rpx solid #eee;
|
}
|
|
.card-item {
|
padding: 10rpx 0 0;
|
}
|
|
.card-action {
|
width: 100%;
|
display: flex;
|
justify-content: flex-end;
|
align-items: center;
|
}
|
}
|
|
|
}
|
|
::v-deep .u-button__text {
|
font-size: 40rpx !important;
|
}
|
|
.bottom-btns-row {
|
display: flex;
|
padding: 10rpx 0;
|
background-color: #fff;
|
|
.btn-frame {
|
width: 90%;
|
box-sizing: border-box;
|
margin: 10rpx auto;
|
font-weight: bold;
|
border-radius: 5px;
|
}
|
}
|
</style>
|
