样式等问题修改

This commit is contained in:
BianLzhaoMin 2024-10-18 16:51:09 +08:00
parent 107d2455b8
commit 69c142c35f
2 changed files with 115 additions and 10 deletions

View File

@ -24,7 +24,9 @@
</uni-card>
<uni-section title="今日作业计划" type="line">
<template v-slot:right>全部人员</template>
<template v-slot:right>
<view @tap="onSearchAllPerson" style="color: #3f9dfd">全部人员</view>
</template>
<uni-card :is-shadow="true" margin="6">
<view v-for="item in todayWorkList" :key="item.contentId" @tap="onSearchWorkPerson(item.contentId)">
<view class="row-1">
@ -53,7 +55,12 @@
<uni-section title="作业人员" type="line">
<uni-card :is-shadow="true" margin="6" padding="0">
<view class="work-person">
<view v-for="item in workPersonList" :key="item.idNumber" @tap="onClickTableTr(item.idNumber)">
<view
:class="getPersonStyle(item)"
v-for="item in workPersonList"
:key="item.idNumber"
@tap="onClickTableTr(item.idNumber)"
>
{{ item.name }}
</view>
</view>
@ -63,7 +70,12 @@
<uni-section title="人员持证" type="line">
<uni-card :is-shadow="true" margin="6" padding="0">
<view class="person-card">
<view class="blue-border" v-for="(item, index) in holdCardList" :key="index" @tap="onQueryCardDetails(item)">
<view
:class="getItemClass(index)"
v-for="(item, index) in holdCardList"
:key="index"
@tap="onQueryCardDetails(item)"
>
{{ item.certificateName }}({{ item.certificateNum }})
</view>
<!-- <view class="orange-border">低压电工作业9</view>
@ -76,7 +88,13 @@
<uni-section title="作业票、站班会照片" type="line" style="padding-bottom: 10rpx">
<uni-card :is-shadow="true" margin="6" padding="0">
<!-- <view>站班会照片</view> -->
<view class="img-container">
<view @tap="onPreviewImage(index)" v-for="(item, index) in standGuardList" :key="index">
<image class="image-content" :src="item.img_src" mode="scaleToFill" lazy-load="true"></image>
<uni-icons style="color: #ccc" type="calendar" size="14">{{ item.times }}</uni-icons>
</view>
</view>
</uni-card>
</uni-section>
@ -144,7 +162,10 @@ export default {
holdCardList: [], //
holdCardTitle: '',
holdCardDetailsList: [], //
standGuardList: [], //
standGuardList: [
{ img_src: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg', times: '9:20:06' },
{ img_src: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg', times: '9:20:06' }
], //
contentId: '',
loading: false,
commonParams: {
@ -153,6 +174,31 @@ export default {
}
}
},
computed: {
getItemClass() {
return index => {
const styleIndex = index % 3
switch (styleIndex) {
case 0:
return 'blue-border'
case 1:
return 'orange-border'
case 2:
return 'green-border'
}
}
},
getPersonStyle() {
return item => {
const { kqState, userState } = item
if (userState == 1 && kqState == 1) return 'style_1' //
if (userState == 1 && kqState != 1) return 'style_2' //
if (userState != 1 && kqState == 1) return 'style_3' //
if (userState != 1 && kqState != 1) return 'style_4' //
}
}
},
methods: {
leftClick() {
uni.navigateTo({ url: '/pages/realName/workPlan/index' })
@ -172,6 +218,7 @@ export default {
const response = await getStandGuardImgApi(params)
this.workPersonList = res.data
console.log('人员信息---', res.data)
this.holdCardList = res.datac
this.standGuardList = response.data
},
@ -190,7 +237,7 @@ export default {
})
const res = await getHoldCardInfoApi(params)
uni.hideLoading()
console.log('resresres持证信息详情--', res)
// console.log('resresres--', res)
this.holdCardDetailsList = res.data
},
/* 关闭持证信息弹框 */
@ -202,6 +249,22 @@ export default {
onClickTableTr(id) {
//
uni.navigateTo({ url: `/pages/realName/index/pages/personDetail?idNumber=${id}` })
},
/* 全部人员按钮 */
onSearchAllPerson() {
this.contentId = ''
this.getWorkPersonnelData()
},
/* 预览图片 */
onPreviewImage(index) {
uni.previewImage({
urls: [
'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
],
current: index,
loop: true
})
}
},
onLoad(options) {
@ -240,11 +303,27 @@ export default {
view {
width: 18%;
margin: 12rpx 0 12rpx calc(10% / 4);
box-sizing: border-box;
color: #fff;
text-align: center;
border-radius: 12rpx;
// background-color: #3f9dfd;
}
.style_1 {
background-color: #3f9dfd;
}
.style_2 {
border: 1px solid #3f9dfd;
color: #000;
}
.style_3 {
background-color: #fb1515;
}
.style_4 {
border: 1px solid #fb1515;
color: #000;
}
}
.work-person view:nth-child(5n + 1) {
@ -338,4 +417,27 @@ export default {
text-align: left;
}
}
.img-container {
width: 100%;
display: flex;
flex-wrap: wrap;
view {
width: 31%;
margin: 12rpx 0 12rpx calc(6% / 2);
display: flex;
flex-direction: column;
align-items: center;
.image-content {
width: 100%;
height: 160rpx;
}
}
}
.img-container view:nth-child(3n + 1) {
margin-left: 0;
}
</style>

View File

@ -40,10 +40,11 @@
<view class="item-2" @tap="onViewWorkDetails(item)">
<view>{{ item.subComName }}</view>
<view>
<text v-if="item.kjsfx > 0" style="color: #6ff6d5">可接受风险{{ item.kjsfx }}</text>
<text v-if="item.dfx > 0" style="color: #25c294">低风险{{ item.dfx }}</text>
<text v-if="item.zfx > 0" style="color: #f9971e">中风险{{ item.zfx }}</text>
<text v-if="item.gfx > 0" style="color: #f44d46">高风险{{ item.gfx }}</text>
<text v-if="item.kjsfx > 0" style="color: #6ff6d5; margin-right: 6rpx">可接受风险{{ item.kjsfx }}</text>
<text v-if="item.dfx > 0" style="color: #25c294; margin-right: 6rpx">低风险{{ item.dfx }}</text>
<text v-if="item.zfx > 0" style="color: #f9971e; margin-right: 6rpx">中风险{{ item.zfx }}</text>
<text v-if="item.gfx > 0" style="color: #f44d46; margin-right: 6rpx">高风险{{ item.gfx }}</text>
<text v-if="item.tgfx > 0" style="color: #f91008; margin-right: 6rpx">特高风险{{ item.tgfx }}</text>
</view>
</view>
<view class="item-3" @tap="onViewWorkDetails(item)">
@ -124,6 +125,8 @@ export default {
success: res => {
this.recordsTotal = res.data.recordsTotal
this.companyInfoList = res.data.data
console.log('resssss作业计划列表信息', res)
},
fail: err => {}
})