| | |
| | | <div class="header"> |
| | | <el-button type="success" icon="Plus" @click="toProcess('add',{})">新增</el-button> |
| | | <el-button type="warning" >导出</el-button> |
| | | <el-button type="primary" icon="Filter">筛选</el-button> |
| | | <el-button type="primary" icon="Filter" @click="showDrawer = true">筛选</el-button> |
| | | </div> |
| | | <div class="middle"> |
| | | <div class="card-box"> |
| | |
| | | <el-table-column label="序号" width="80" align="center" type="index" ></el-table-column> |
| | | <el-table-column label="项目名称" prop="name" align="center" :show-overflow-tooltip="true" width="180" /> |
| | | <el-table-column label="委托单位" prop="client" align="center" :show-overflow-tooltip="true" width="180"/> |
| | | <el-table-column label="所属地市" prop="updateTime" align="center" width="250"> |
| | | <el-table-column label="所属地市" align="center" width="250"> |
| | | <template #default="scope"> |
| | | {{scope.row.province}}/{{scope.row.city}} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="评价类型" prop="estimateTypeName" align="center" width="150"/> |
| | | <el-table-column label="业务范围" prop="businessName" align="center" :show-overflow-tooltip="true" width="150"/> |
| | | <el-table-column label="项目负责人" prop="" align="center" width="120" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="项目阶段" prop="" align="center" width="200"> |
| | | <el-table-column label="项目负责人" prop="leaderName" align="center" width="120" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="项目阶段" align="center" width="200"> |
| | | <template #default="scope"> |
| | | |
| | | <div v-if="scope.row.process === 1" class="process1"> |
| | | <span>风险分析及计划评价</span> |
| | | </div> |
| | | <div v-else-if="scope.row.process === 2" class="process1 process2"> |
| | | <span>现场勘验</span> |
| | | </div> |
| | | <div v-else-if="scope.row.process === 3" class="process1 process3"> |
| | | <span>项目审核</span> |
| | | </div> |
| | | <div v-else-if="scope.row.process === 4" class="process1 process4"> |
| | | <span>出具报告</span> |
| | | </div> |
| | | <div v-else class="process1 process5"> |
| | | <span>项目归档</span> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="项目实施天数" prop="" align="center" width="150"/> |
| | |
| | | @current-change="handleCurrentChange" |
| | | /> |
| | | </div> |
| | | <el-drawer v-model="showDrawer" :direction="direction" :with-header="false" :size="size" > |
| | | <template #default> |
| | | <div class="drawer"> |
| | | <el-form ref="drawerRef" class="register-form" label-position="top"> |
| | | <el-form-item label="时间选择"> |
| | | <el-date-picker |
| | | v-model="searchTime" |
| | | type="daterange" |
| | | @change="changeTime" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | value-format="YYYY-MM-DD" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="所属区域"> |
| | | <el-cascader |
| | | v-model="area" |
| | | :options="addressList" |
| | | :props="props" |
| | | @change="handleChange" |
| | | style="width: 100%" |
| | | size="large" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="项目名称" > |
| | | <el-input v-model="search.queryParams.name" placeholder="请输入项目名称"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="委托单位"> |
| | | <el-input v-model="search.queryParams.client" placeholder="委托单位"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="业务范围"> |
| | | <el-select v-model="search.queryParams.business" class="m-2" size="large" placeholder="请选择" style="width: 100%" > |
| | | <el-option |
| | | v-for="item in businessList" |
| | | :key="item.id" |
| | | :label="item.label" |
| | | :value="item.id" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="评价类型"> |
| | | <el-select v-model="search.queryParams.estimateType" class="m-2" size="large" placeholder="请选择" style="width: 100%" > |
| | | <el-option |
| | | v-for="item in estimateTypeList" |
| | | :key="item.id" |
| | | :label="item.label" |
| | | :value="item.id" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="缺失要件"> |
| | | <el-select v-model="search.queryParams.miss" class="m-2" size="large" placeholder="请选择" style="width: 100%" > |
| | | <el-option |
| | | v-for="item in missingList" |
| | | :key="item.id" |
| | | :label="item.label" |
| | | :value="item.id" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | </el-form> |
| | | </div> |
| | | </template> |
| | | <template #footer> |
| | | <div style="flex: auto"> |
| | | <el-button type="primary" @click="searchClick">查询</el-button> |
| | | <el-button type="warning" @click="reset">重置</el-button> |
| | | <el-button @click="confirmClick">取消</el-button> |
| | | |
| | | </div> |
| | | </template> |
| | | </el-drawer> |
| | | </div> |
| | | |
| | | </template> |
| | |
| | | import {delProject, getProjectList, getProjectStatistics} from "@/api/projectManage/project"; |
| | | import {ElMessage, ElMessageBox} from "element-plus"; |
| | | import {delMonitor} from "@/api/sysUsers"; |
| | | import {getRegionTree} from "@/api/area"; |
| | | import {getDict} from "@/api/login"; |
| | | import {getDictList} from "@/api/backManage/evaluate"; |
| | | const router = useRouter(); |
| | | |
| | | const loading = ref(false); |
| | | const direction = ref('rtl'); |
| | | const showDrawer = ref(false); |
| | | const size = ref('400px') |
| | | const props = { |
| | | expandTrigger: 'hover', |
| | | value: 'name', |
| | | label: 'name' |
| | | } |
| | | const search = reactive({ |
| | | queryParams: { |
| | | pageNum: 1, |
| | | pageSize: 20, |
| | | name: '', |
| | | client: '', |
| | | province: '', |
| | | city: '', |
| | | district: '', |
| | | business: '', |
| | | estimateType: '', |
| | | params:{ |
| | | projectPhase: '', |
| | | } |
| | |
| | | archiveTotal: 0 |
| | | } |
| | | }); |
| | | const searchTime = ref([]); |
| | | const area = ref([]); |
| | | const businessList = ref([]); |
| | | const addressList = ref([]); |
| | | const estimateTypeList = ref([]); |
| | | const missingList = ref([ |
| | | { |
| | | id: 0, |
| | | label: '否' |
| | | }, |
| | | { |
| | | id: 1, |
| | | label: '是' |
| | | }, |
| | | ]) |
| | | const tableRef = ref(null); |
| | | const tableHeight = ref(0); |
| | | const dataList = ref([]); |
| | |
| | | onMounted(() => { |
| | | getList(); |
| | | getStatistics(); |
| | | getArea(); |
| | | getBusinessList(); |
| | | getRiskList(); |
| | | tableHeight.value = window.innerHeight - tableRef.value.$el.offsetTop - 170; |
| | | // 监听浏览器高度变化 |
| | | window.onresize = () => { |
| | |
| | | console.log(search.queryParams,'search.queryParams') |
| | | const res = await getProjectList(search.queryParams); |
| | | if(res.code == 200){ |
| | | dataList.value = res.data.list; |
| | | dataList.value = res.data.list.map(item => { |
| | | return { |
| | | ...item, |
| | | process: item.reportProgress <=4 ? 1 : item.reportProgress >4 && item.reportProgress <=6 ? 2 : item.reportProgress >6 && item.reportProgress <=9 ? 3 :item.reportProgress >9 && item.reportProgress <=11 ? 4:5, |
| | | leaderName: item.leader ? item.leader.name : '' |
| | | } |
| | | }) |
| | | console.log('data',dataList.value) |
| | | total.value = res.data.total |
| | | loading.value = false; |
| | | }else{ |
| | |
| | | } |
| | | } |
| | | const handleSizeChange = (val) => { |
| | | search.queryParams.pageNum = 1; |
| | | search.queryParams.pageSize = val |
| | | getList() |
| | | } |
| | |
| | | value.type = type; |
| | | router.push({ path: '/process', query: {id: value.id, type: type}}); |
| | | } |
| | | |
| | | const getArea = async ()=>{ |
| | | const type = 1 |
| | | const res = await getRegionTree({name: '',parentId: null,regionType: type}) |
| | | if(res.code == 200){ |
| | | addressList.value = res.data |
| | | }else{ |
| | | ElMessage.warning(res.message) |
| | | } |
| | | } |
| | | const getBusinessList = async () => { |
| | | const res = await getDict({dictType: 'sys_business_scope'}) |
| | | if(res.code === 200){ |
| | | businessList.value = res.data |
| | | }else{ |
| | | ElMessage.warning(res.message) |
| | | } |
| | | } |
| | | const getRiskList = async () => { |
| | | const res = await getDictList({dictType: "sys_assess_type"}); |
| | | if(res.code === 200){ |
| | | estimateTypeList.value = res.data.list |
| | | }else{ |
| | | ElMessage.warning(res.message) |
| | | } |
| | | } |
| | | |
| | | const del = (val) => { |
| | | ElMessageBox.confirm( |
| | | '确定删除此条数据?', |
| | |
| | | ElMessage.warning(res.message) |
| | | } |
| | | }) |
| | | } |
| | | const confirmClick = () => { |
| | | showDrawer.value = false; |
| | | } |
| | | const changeTime=(value)=>{ |
| | | if(!value){ |
| | | search.queryParams.params.endTime = "" |
| | | search.queryParams.params.startTime = "" |
| | | } |
| | | } |
| | | const searchClick = () => { |
| | | if(searchTime.value && searchTime.value.length>0){ |
| | | search.queryParams.params.startTime = searchTime.value[0] |
| | | search.queryParams.params.endTime = searchTime.value[1] |
| | | } |
| | | getList(); |
| | | getStatistics(); |
| | | showDrawer.value = false; |
| | | } |
| | | const reset = () => { |
| | | searchTime.value = []; |
| | | area.value = []; |
| | | search.queryParams = { |
| | | pageNum: 1, |
| | | pageSize: 20, |
| | | name: '', |
| | | client: '', |
| | | province: '', |
| | | city: '', |
| | | district: '', |
| | | business: '', |
| | | estimateType: '', |
| | | } |
| | | search.queryParams.params = {} |
| | | getList(); |
| | | getStatistics(); |
| | | showDrawer.value = false; |
| | | } |
| | | const handleChange = (value) => { |
| | | // if(state.registerForm.agency.attribute == 0){ |
| | | // state.registerForm.agency.province = '新疆维吾尔自治区' |
| | | // state.registerForm.agency.city = value[0]?value[0]:'' |
| | | // state.registerForm.agency.district = value[1]?value[1]:'' |
| | | // }else{ |
| | | search.queryParams.province = value[0]?value[0]:'' |
| | | search.queryParams.city = value[1]?value[1]:'' |
| | | search.queryParams.district = value[2]?value[2]:'' |
| | | // } |
| | | } |
| | | </script> |
| | | |
| | |
| | | float: right; |
| | | margin-top: 20px; |
| | | } |
| | | .process1{ |
| | | border-radius: 5px; |
| | | color: rgb(255, 255, 255); |
| | | padding: 5px 10px; |
| | | background: linear-gradient(90deg, rgb(127, 118, 253), rgb(218, 180, 246)); |
| | | } |
| | | .process2{ |
| | | background: linear-gradient(90deg, rgb(255, 140, 138), rgb(239, 186, 141)); |
| | | } |
| | | .process3 { |
| | | background: linear-gradient(90deg, rgb(229, 119, 180), rgb(249, 159, 192));; |
| | | } |
| | | .process4 { |
| | | background: linear-gradient(90deg, rgb(54, 115, 255), rgb(124, 196, 242));; |
| | | } |
| | | .process5 { |
| | | background: linear-gradient(90deg, rgb(0, 195, 151), rgb(114, 232, 200));; |
| | | } |
| | | .drawer{ |
| | | :deep(.el-form .el-form-item__label) { |
| | | font-size: 15px; |
| | | } |
| | | } |
| | | |
| | | } |
| | | </style> |