You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
375 lines
10 KiB
375 lines
10 KiB
<template>
|
|
<view class="project">
|
|
<view class="cc-header">
|
|
<!-- 搜索框 -->
|
|
<view class="cc-search search-bar">
|
|
<view class="search-box">
|
|
<image src="/static/images/icon/search.png" />
|
|
<input v-model="searchQuery" type="text" placeholder="请输入项目名称" @confirm="handleSearchProjectList" />
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 行政区划和项目类型下拉框 -->
|
|
<view class="cc-query-dropdowns dropdowns">
|
|
<picker mode="date" @change="handleDateChange">
|
|
<view class="dropdown">检查日期<image src="/static/images/icon/down.png" /></view>
|
|
</picker>
|
|
<picker mode="selector" :range="checkTypeNames" @change="handleCheckTypeChange">
|
|
<view class="dropdown">检查类型<image src="/static/images/icon/down.png" /></view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<!-- 项目列表 -->
|
|
<view class="cc-project-list">
|
|
<view v-for="(project, index) in problemList" :key="index" class="project-card">
|
|
<view class="attr-item project-title">{{ projectName }}</view>
|
|
<view class="attr-item">
|
|
<view class="attr-title">检查日期</view>
|
|
<view class="attr-value">{{ project.inspectionDate }}</view>
|
|
</view>
|
|
<view class="attr-item">
|
|
<view class="attr-title">检查单位</view>
|
|
<view class="attr-value">{{ project.inspectionUnit }}</view>
|
|
</view>
|
|
<view class="attr-item">
|
|
<view class="attr-title">被检查单位</view>
|
|
<view class="attr-value">{{ project.inspectionPerson }}</view>
|
|
</view>
|
|
<view class="attr-item">
|
|
<view class="attr-title">检查类型</view>
|
|
<view class="attr-value">{{ project.menuTypeName }}</view>
|
|
</view>
|
|
<view class="attr-item">
|
|
<view class="attr-title">发现问题数</view>
|
|
<view class="attr-value">{{ project.problemTotal }}</view>
|
|
</view>
|
|
<view class="attr-item">
|
|
<view class="attr-title">未整改问题数</view>
|
|
<view class="attr-value">{{ project.notRectifiedNum }}</view>
|
|
</view>
|
|
<view class="operate-buttons">
|
|
<view class="buttons-group">
|
|
<view class="primary-button__text button" @click="handleEditProblem(project)">修改检查</view>
|
|
<view class="primary-button__text button" @click="handleAddProblem(project)">添加问题</view>
|
|
<view class="error-button__text button" @click="handleDeleteCheck(project)">删除</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<no-data-view v-if="problemList.length === 0" />
|
|
<uni-load-more v-if="queryParams.pageNum == pages" status="no-more"></uni-load-more>
|
|
|
|
<!-- 操作按钮 -->
|
|
<view v-if="activeTab===0" class="operation-buttons">
|
|
<view class="buttons-group">
|
|
<view class="primary-button button" @click="handleAddCheck()">新增问题</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { projectCheckListApi } from '@/api/system/project'
|
|
import NoDataView from '@/components/no-data-view/no-data-view.vue'
|
|
export default {
|
|
components: {
|
|
NoDataView
|
|
},
|
|
data() {
|
|
return {
|
|
activeTab: 0, // 当前选中的Tab索引
|
|
searchQuery: '', // 搜索框的内容
|
|
selectedDistrict: 0, // 行政区划选择的索引
|
|
selectedProjectType: 0, // 项目类型选择的索引
|
|
districts: ['请选择', '北京市', '上海市', '广州市'], // 行政区划数据
|
|
projectTypes: ['请选择', '建筑', 'IT', '教育'], // 项目类型数据
|
|
queryParams: {
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
params: {orderBy: "create_time", sortBy: "desc"},
|
|
data: {
|
|
proNo: this.$route.query.id,
|
|
projectName: this.$route.query.projectName,
|
|
menuType: '0',
|
|
checkType: '',
|
|
checkTime: ''
|
|
}
|
|
},
|
|
proNo: this.$route.query.id,
|
|
proCode: this.$route.query.proCode,
|
|
projectName: this.$route.query.projectName,
|
|
projects: [],
|
|
problemList: [],
|
|
pages: 0,
|
|
checkTypes: [],
|
|
checkTypeNames: []
|
|
};
|
|
},
|
|
created() {
|
|
this.getDicts("check_type").then((response) =>{
|
|
this.checkTypes = response.data
|
|
this.checkTypeNames = this.checkTypes.map(item => item.dictLabel)
|
|
})
|
|
this.getProjectCheckList()
|
|
},
|
|
// onReachBottom() {
|
|
// if (this.queryParams.pageNum < this.pages) {
|
|
// this.queryParams.pageNum++; // 页码加1
|
|
// this.getProjectCheckList()
|
|
// }
|
|
// },
|
|
methods: {
|
|
changeTab(index) {
|
|
this.activeTab = index
|
|
this.queryParams.pageNum = 1
|
|
this.getProjectCheckList('again')
|
|
},
|
|
// 获取项目列表
|
|
getProjectCheckList(mode) {
|
|
uni.showLoading({
|
|
title: '加载中...',
|
|
mask: true
|
|
})
|
|
projectCheckListApi(this.queryParams).then(res => {
|
|
if (mode === 'again') {
|
|
this.projectCheckList = []
|
|
uni.pageScrollTo({
|
|
scrollTop: 0, // 设置滚动到顶部
|
|
duration: 300 // 滚动动画持续时间，单位为毫秒
|
|
})
|
|
}
|
|
this.problemList = res.records[0].bsSgcJsjdBuiRegulatoryInspections
|
|
this.problemList.forEach(item => {
|
|
this.menuTypeName = this.formatMenuType(item)
|
|
})
|
|
// this.projectCheckList = [...this.projectCheckList, ...res.records]
|
|
// this.pages = res.pages
|
|
// this.projectCheckList.forEach(projectItem => {
|
|
// projectItem.adcdName = this.formatAdcd(projectItem)
|
|
// })
|
|
uni.hideLoading()
|
|
})
|
|
},
|
|
|
|
// 监督检查类型字典翻译
|
|
checkTypesFormat(row, column) {
|
|
return this.selectDictLabel(
|
|
this.checkTypes,
|
|
row.checkType
|
|
);
|
|
},
|
|
|
|
formatMenuType(row) {
|
|
let res;
|
|
switch (row?.menuType) {
|
|
case "0":
|
|
res = "项目法人履职检查";
|
|
break;
|
|
case "1":
|
|
res = "质量检查";
|
|
break;
|
|
case "2":
|
|
res = "市场监督专项检查";
|
|
break;
|
|
case "3":
|
|
res = "防洪度汛检查";
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
return res;
|
|
},
|
|
|
|
handleSearchProjectList() {
|
|
this.searchQuery = ''
|
|
this.queryParams.pageNum = 1
|
|
this.getProjectCheckList('again')
|
|
},
|
|
|
|
handleDateChange(e) {
|
|
this.queryParams.inspectionDate = e.detail.value
|
|
},
|
|
handleCheckTypeChange(e) {
|
|
this.queryParams.checkType = this.checkTypes[e.detail.value]
|
|
},
|
|
handleEditProblem(item) {
|
|
// 跳转到编辑问题页面
|
|
this.$tab.navigateTo(`/pages/monitoring/problem/edit?proNo=${this.proNo}&proCode=${this.proCode}&monitorId=${item.id}`)
|
|
},
|
|
handleAddProblem(item) {
|
|
this.$tab.navigateTo(`/pages/monitoring/problem/add?proNo=${this.proNo}&proCode=${this.proCode}&menuType=${0}&projectName=${this.projectName}&inspectionId=${item.id}`)
|
|
},
|
|
handleDeleteCheck() {
|
|
|
|
},
|
|
|
|
handleAddCheck() {
|
|
this.$tab.navigateTo(`/pages/monitoring/problem/edit?proNo=${this.proNo}&proCode=${this.proCode}&menuType=${0}&projectName=${this.projectName}`)
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.project {
|
|
// padding: 20px;
|
|
.tabs {
|
|
height: 48px;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
background-color: #fff;
|
|
.tab {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
text-align: center;
|
|
justify-content: center;
|
|
color: #595959;
|
|
cursor: pointer;
|
|
&.active {
|
|
color: #00B39D;
|
|
.tab-text {
|
|
position: relative;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
&::after {
|
|
content: '';
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 3px;
|
|
background: #00B39D;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
// .search-bar {
|
|
// padding: 12px 25px;
|
|
// background: #fff;
|
|
// border-top: 1px solid #f0f0f0;
|
|
// border-bottom: 1px solid #f0f0f0;
|
|
// .search-box {
|
|
// padding: 8px 20px;
|
|
// background: #f7f8fa;
|
|
// border-radius: 8px;
|
|
// }
|
|
// input {
|
|
// width: 100%;
|
|
// border: none;
|
|
// border-radius: 5px;
|
|
// }
|
|
// }
|
|
.dropdowns {
|
|
height: 48px;
|
|
background: #fff;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
uni-picker {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.dropdown {
|
|
flex: 1;
|
|
}
|
|
}
|
|
.project-list {
|
|
padding: 0 20px 95px;
|
|
.project-card {
|
|
background-color: #fff;
|
|
padding: 20px 0 0 0;
|
|
margin-top: 10px;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
|
margin-top: 15px;
|
|
.attr-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
color: #262626;
|
|
padding: 0 20px 20px 20px;
|
|
padding-bottom: 15px;
|
|
.attr-title {
|
|
font-size: 16px;
|
|
color: #595959;
|
|
}
|
|
.attr-value {
|
|
&.no-done {
|
|
color: #FF0000;
|
|
}
|
|
}
|
|
}
|
|
.operate-buttons {
|
|
border-top: 1px solid #f0f0f0;
|
|
display: flex;
|
|
height: 48px;
|
|
box-sizing: border-box;
|
|
.buttons-group {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
&:nth-child(1) {
|
|
.button {
|
|
border-right: 1px solid #f0f0f0;
|
|
&:nth-last-child(1) {
|
|
border-right: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.button {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
cursor: pointer;
|
|
&.primary-button__text {
|
|
color: #00B39D;
|
|
}
|
|
&.error-button__text {
|
|
color: #E04040;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.project-title {
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
.operation-buttons {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 80px;
|
|
padding: 16px 20px;
|
|
background: #fff;
|
|
border-top: 1px solid #f0f0f0;
|
|
.buttons-group {
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
.button {
|
|
cursor: pointer;
|
|
}
|
|
.primary-button {
|
|
flex: 1;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: #fff;
|
|
background-color: #00B39D;
|
|
border-radius: 8px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|