nxdt-uniapp/pages/projectApproval/component/BuildersAndSecurityTool.vue

120 lines
2.9 KiB
Vue

<template>
<div>
<u-list :style="{ height: dataList.length > 0 ? '500px' : '0' }">
<u-list-item v-for="(item, index) in dataList" :key="index" borderBottom>
<div class="list-wrapper">
<div class="list-item">{{ item.name }}</div>
<div class="list-item" style="width: 50%">{{ item.postName }}</div>
<div class="list-item">
<div v-if="item.annotation == 1">
<u-button type="success" plain size="mini" style="width: 50px" @click="handleApproval(item)">
已批阅
</u-button>
</div>
<div v-else>
<u-button type="error" plain size="mini" @click="handleApproval(item)">未批阅</u-button>
</div>
</div>
</div>
<u-line color="rgba(15,39,75,0.2)" />
</u-list-item>
</u-list>
<u-divider v-if="dataList.length == 0" text="暂无数据"></u-divider>
</div>
</template>
<script>
import Steps from 'pages/component/Steps'
export default {
components: { Steps },
props: {
dataList: {
type: Array,
default: () => []
},
currentIndex: {
type: Number,
default: 4
},
isDetail: {
type: Boolean,
default: false
},
isLeave: {
type: Boolean,
default: false
},
isSubcontractor: {
type: Boolean,
default: false
},
proId: {
type: String | Number,
default: ''
},
consUuid: {
type: String | Number,
default: ''
},
taskId: {
type: String | Number,
default: ''
}
},
data() {
return {}
},
mounted() {},
methods: {
// 审批按钮
handleApproval(item) {
console.log('审批状态', item.annotation, this.currentIndex, this.isDetail)
const baseUrl = this.currentIndex === 4 ? '/pages/projectInfo/builderDetails' : '/pages/projectInfo/toolDetails'
const params = {
baseUrl: this.currentIndex === 4 ? '/pages/projectInfo/builderDetails' : '/pages/projectInfo/toolDetails',
id: item.id,
uuid: item.uuid,
proId: this.proId,
consUuid: this.consUuid,
taskId: this.taskId,
isApproval: item.annotation == '0' && !this.isDetail ? true : false
}
uni.navigateTo({
url: `${baseUrl}?params=${JSON.stringify(params)}`
})
}
}
}
</script>
<style lang="scss" scoped>
.list-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
.list-item {
margin: 8px 0;
width: 25%;
font-weight: 400;
font-size: 12px;
color: #0f274b;
display: flex;
justify-content: center;
align-items: center;
// 第一个文字居左
&:first-child {
justify-content: flex-start;
}
// 第三个里面的按钮居右
&:last-child {
justify-content: flex-end;
}
}
.item-width {
width: 33.3%;
}
}
</style>