作业详情页面优化
This commit is contained in:
BianLzhaoMin
parent
f218b3c2cb
commit
a749b21dcf
|
|
@ -1,9 +1,176 @@
|
|||
<template>
|
||||
<view>作业计划详情---</view>
|
||||
<view class="work-plan-details">
|
||||
<u-navbar
|
||||
class="u-navbar"
|
||||
title="作业计划详情"
|
||||
placeholder
|
||||
@leftClick="leftClick"
|
||||
leftIconColor="#fff"
|
||||
bgColor="#00337A"
|
||||
:titleStyle="{ color: '#FFF', fontSize: '32rpx' }"
|
||||
/>
|
||||
|
||||
<uni-card :is-shadow="true" margin="6">
|
||||
<view class="card-header">
|
||||
<uni-icons type="list" size="16" style="color: #3f9dfd; margin-right: 8rpx"></uni-icons>
|
||||
<text>
|
||||
{{ queryInfo.proName }}
|
||||
</text>
|
||||
</view>
|
||||
<view class="card-header">
|
||||
<uni-icons type="calendar" size="16" style="margin-right: 8rpx"></uni-icons>
|
||||
<view>{{ $moment().format('YYYY-MM-DD') }}</view>
|
||||
</view>
|
||||
</uni-card>
|
||||
|
||||
<uni-section title="今日作业计划" type="line">
|
||||
<template v-slot:right>全部人员</template>
|
||||
<uni-card :is-shadow="true" margin="6">
|
||||
<view>
|
||||
<view class="row-1">
|
||||
<view>现场负责人</view>
|
||||
<view>
|
||||
<text>燕双鹰</text>
|
||||
<text>13556235623</text>
|
||||
</view>
|
||||
<view>作业人员</view>
|
||||
<view>7</view>
|
||||
</view>
|
||||
<view class="row-2">
|
||||
<view>风险等级</view>
|
||||
<view>低风险</view>
|
||||
<view>执行情况</view>
|
||||
<view>已执行</view>
|
||||
</view>
|
||||
<view class="row-3">
|
||||
<view style="padding: 8rpx 0">作业内容</view>
|
||||
<view style="color: #000">1、35kv配电室35kv配电室35kv配电室35kv配电室35kv配电室</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-card>
|
||||
</uni-section>
|
||||
|
||||
<uni-section title="作业人员" type="line">
|
||||
<uni-card :is-shadow="true" margin="6" padding="0">
|
||||
<view class="work-person">
|
||||
<view>龙海</view>
|
||||
<view>龙海</view>
|
||||
<view>龙海</view>
|
||||
<view>龙海</view>
|
||||
<view>龙海</view>
|
||||
<view>龙海</view>
|
||||
<view>龙海</view>
|
||||
<view>龙海</view>
|
||||
</view>
|
||||
</uni-card>
|
||||
</uni-section>
|
||||
|
||||
<uni-section title="人员持证" type="line">
|
||||
<uni-card :is-shadow="true" margin="6" padding="0">
|
||||
<view class="person-card">
|
||||
<view class="blue-border">低压电工作业（9）</view>
|
||||
<view class="orange-border">低压电工作业（9）</view>
|
||||
<view class="green-border">低压电工作业（9）</view>
|
||||
<view class="blue-border">低压电工作业（9）</view>
|
||||
<view class="orange-border">低压电工作业（9）</view>
|
||||
</view>
|
||||
</uni-card>
|
||||
</uni-section>
|
||||
|
||||
<uni-section title="作业票、站班会照片" type="line" style="padding-bottom: 10rpx">
|
||||
<uni-card :is-shadow="true" margin="6" padding="0">
|
||||
<view>站班会照片</view>
|
||||
</uni-card>
|
||||
</uni-section>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {}
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
queryInfo: {}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
leftClick() {
|
||||
uni.navigateTo({ url: '/pages/realName/workPlan/index' })
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
const query = JSON.parse(options.query)
|
||||
this.queryInfo = query
|
||||
// console.log('queryquery', query)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style lang="scss" scoped>
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.row-1,
|
||||
.row-2 {
|
||||
padding: 25rpx 0;
|
||||
display: flex;
|
||||
border-bottom: 1px solid #eee;
|
||||
view {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.work-person {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
view {
|
||||
width: 18%;
|
||||
margin: 12rpx 0 12rpx calc(10% / 4);
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 12rpx;
|
||||
background-color: #3f9dfd;
|
||||
}
|
||||
}
|
||||
|
||||
.work-person view:nth-child(5n + 1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.person-card {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
view {
|
||||
width: calc(32%);
|
||||
margin: 12rpx 0 12rpx calc(4% / 2);
|
||||
box-sizing: border-box;
|
||||
border-radius: 12rpx;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.blue-border {
|
||||
border: 1px solid #3f9dfd;
|
||||
color: #3f9dfd;
|
||||
background-color: #d5e7f9;
|
||||
}
|
||||
.orange-border {
|
||||
border: 1px solid #f5a208;
|
||||
color: #f5a208;
|
||||
background-color: #f7e3bf;
|
||||
}
|
||||
.green-border {
|
||||
border: 1px solid #03af03;
|
||||
color: #03af03;
|
||||
background-color: #c5f3c5;
|
||||
}
|
||||
}
|
||||
|
||||
.person-card view:nth-child(3n + 1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -35,6 +35,12 @@
|
|||
<view class="item-1">
|
||||
<view>{{ index + 1 }}</view>
|
||||
<view>{{ item.proName }}</view>
|
||||
<uni-icons
|
||||
:type="item.isCollect == 1 ? 'star-filled' : 'star'"
|
||||
size="20"
|
||||
@catchtap="onCollection($event, item)"
|
||||
:style="{ color: item.isCollect == 1 ? '#f9971e' : '' }"
|
||||
></uni-icons>
|
||||
</view>
|
||||
<view class="item-2">
|
||||
<view>{{ item.subComName }}</view>
|
||||
|
|
@ -133,7 +139,7 @@ export default {
|
|||
this.companyList = this.companyList.concat(res.subList)
|
||||
},
|
||||
leftClick() {
|
||||
uni.navigateTo({ url: '/pages/realName/index/index' })
|
||||
uni.navigateTo({ url: `/pages/realName/index/index` })
|
||||
},
|
||||
onSearchFilter() {
|
||||
// 打开底部弹框
|
||||
|
|
@ -162,7 +168,35 @@ export default {
|
|||
},
|
||||
/* 点击跳转作业计划详情 */
|
||||
onViewWorkDetails(row) {
|
||||
uni.navigateTo({ url: '/pages/realName/workPlan-details/index' })
|
||||
uni.navigateTo({ url: `/pages/realName/workPlan-details/index?query=${JSON.stringify(row)}` })
|
||||
},
|
||||
/* 收藏与取消收藏 */
|
||||
onCollection(e, row) {
|
||||
e.stopPropagation()
|
||||
// const params = {
|
||||
// id: row.collectId,
|
||||
// userId: uni.getStorageSync('realNameUser').userId,
|
||||
// foreignId: row.proId,
|
||||
// type: 1
|
||||
// }
|
||||
|
||||
// // console.log('params参数', params)
|
||||
|
||||
// uni.request({
|
||||
// url: `${config.loginBaseUrl}${
|
||||
// row.isCollect == 0 ? '/app/offLine/insertCollect' : '/app/offLine/deleteCollect'
|
||||
// }`,
|
||||
// method: 'POST',
|
||||
// data: JSON.stringify(params),
|
||||
// header: {
|
||||
// 'Content-Type': 'application/json',
|
||||
// token: this.token
|
||||
// },
|
||||
// success: res => {
|
||||
// console.log('res收藏结果', res)
|
||||
// },
|
||||
// fail: err => {}
|
||||
// })
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue