作业详情页面优化
This commit is contained in:
BianLzhaoMin
parent
f218b3c2cb
commit
a749b21dcf
|
|
@ -1,9 +1,176 @@
|
||||||
<template>
|
<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>
|
</template>
|
||||||
|
|
||||||
<script>
|
<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>
|
</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 class="item-1">
|
||||||
<view>{{ index + 1 }}</view>
|
<view>{{ index + 1 }}</view>
|
||||||
<view>{{ item.proName }}</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>
|
||||||
<view class="item-2">
|
<view class="item-2">
|
||||||
<view>{{ item.subComName }}</view>
|
<view>{{ item.subComName }}</view>
|
||||||
|
|
@ -133,7 +139,7 @@ export default {
|
||||||
this.companyList = this.companyList.concat(res.subList)
|
this.companyList = this.companyList.concat(res.subList)
|
||||||
},
|
},
|
||||||
leftClick() {
|
leftClick() {
|
||||||
uni.navigateTo({ url: '/pages/realName/index/index' })
|
uni.navigateTo({ url: `/pages/realName/index/index` })
|
||||||
},
|
},
|
||||||
onSearchFilter() {
|
onSearchFilter() {
|
||||||
// 打开底部弹框
|
// 打开底部弹框
|
||||||
|
|
@ -162,7 +168,35 @@ export default {
|
||||||
},
|
},
|
||||||
/* 点击跳转作业计划详情 */
|
/* 点击跳转作业计划详情 */
|
||||||
onViewWorkDetails(row) {
|
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