环保管理

This commit is contained in:
2023-12-08 17:03:01 +08:00
parent fe0c84bc3a
commit 8fdaa3e968
19 changed files with 2670 additions and 1011 deletions

View File

@@ -1,8 +1,167 @@
<template>
<div>wasteGasDetectionHistory</div>
<div class="app-container">
<!-- 搜索工作栏 -->
<search-bar
:formConfigs="formConfig"
ref="searchBarForm"
@headBtnClick="buttonClick"
/>
<!-- 列表 -->
<base-table
:page="queryParams.pageNo"
:limit="queryParams.pageSize"
:table-props="tableProps"
:table-data="list"
:max-height="tableH"
/>
<pagination
:page.sync="queryParams.pageNo"
:limit.sync="queryParams.pageSize"
:total="total"
@pagination="getList"
/>
</div>
</template>
<script>
import { publicFormatter } from '@/utils/dict'
import { parseTime } from '@/utils/ruoyi'
import { environmentalCheckRecordPage, environmentalCheckRecordExport, environmentalCheckPage } from '@/api/safetyEnvironmental/environmental'
import moment from 'moment'
const tableProps = [
{
prop: 'checkName',
label: '指标名称'
},
{
prop: 'checkValue',
label: '检测数值'
},
{
prop: 'unit',
label: '单位',
filter: publicFormatter('environment_check_unit')
},
{
prop: 'checkTime',
label: '检测时间',
filter: parseTime,
minWidth: 160
},
{
prop: 'origin',
label: '来源',
filter: (val) => ['手动', '自动'][val]
},
{
prop: 'recordPerson',
label: '录入人'
},
{
prop: 'recordTime',
label: '录入时间',
filter: parseTime,
minWidth: 160
}
]
export default {
name: 'WasteGasDetectionHistory'
name: 'WasteGasDetectionHistory',
data() {
return {
formConfig: [
{
type: 'select',
label: '指标名称',
selectOptions: [],
param: 'checkId'
},
{
type: 'datePicker',
label: '时间',
dateType: 'datetimerange',
format: 'yyyy-MM-dd HH:mm:ss',
valueFormat: "yyyy-MM-dd HH:mm:ss",
rangeSeparator: '-',
startPlaceholder: '开始时间',
endPlaceholder: '结束时间',
param: 'timeVal',
defaultSelect: [],
width: 350
},
{
type: 'button',
btnName: '查询',
name: 'search',
color: 'primary'
},
{
type: this.$auth.hasPermi('base:order-manage:create') ? 'separate' : '',
},
{
type: this.$auth.hasPermi('base:order-manage:create') ? 'button' : '',
btnName: '导出',
name: 'export',
color: 'primary',
plain: true
}
],
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 20,
checkId: null,
checkType: 2,
checkTime: [],
},
tableProps,
list: [],
total: 0,
tableH: this.tableHeight(260)
}
},
created() {
window.addEventListener('resize', () => {
this.tableH = this.tableHeight(260)
})
let end = moment().format('YYYY-MM-DD 23:59:59')
let start = moment().format('YYYY-MM-DD 00:00:00')
this.formConfig[1].defaultSelect = [start, end]
this.queryParams.checkTime[0] = start
this.queryParams.checkTime[1] = end
this.getSelectList()
this.getList()
},
methods: {
buttonClick(val) {
this.queryParams.pageNo = 1;
this.queryParams.checkId = val.checkId
this.queryParams.checkTime[0] = val.timeVal ? val.timeVal[0] : null
this.queryParams.checkTime[1] = val.timeVal ? val.timeVal[1] : null
if (val.btnName === 'search') {
this.getList()
} else {
this.$modal.confirm('是否确认导出').then(() => {
return environmentalCheckRecordExport({...this.queryParams});
}).then(response => {
this.$download.excel(response, '废水检测历史记录.xls');
}).catch(() => {})
}
},
getList() {
environmentalCheckRecordPage({...this.queryParams}).then(res => {
this.list = res.data.list || []
this.total = res.data.total || 0
})
},
getSelectList() {
environmentalCheckPage({
pageNo: 1,
pageSize: 100,
checkType: 2
}).then(res => {
console.log(res)
this.formConfig[0].selectOptions = res.data.list || []
})
}
}
}
</script>

View File

@@ -0,0 +1,124 @@
<template>
<el-form ref="wasteGasAddForm" :rules="rules" label-width="80px" :model="form">
<el-row :gutter="20">
<el-col :span='12'>
<el-form-item label="指标名称" prop="name">
<el-input v-model="form.name" :disabled='isEdit'></el-input>
</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item label="指标编码" prop="code">
<el-input v-model="form.code"></el-input>
</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item label="单位" prop="unit">
<el-select v-model="form.unit" placeholder="请选择" style="width: 100%;" :disabled='form.method == 2'>
<el-option
v-for="item in getDictDatas(DICT_TYPE.ENVIRONMENT_CHECK_UNIT)"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item label="最小值" prop="minValue">
<el-input-number v-model="form.minValue" placeholder="最小值" :max="9999999" style="width: 100%;"></el-input-number>
</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item label="最大值" prop="maxValue">
<el-input-number v-model="form.maxValue" placeholder="最大值" :max="9999999" style="width: 100%;"></el-input-number>
</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</template>
<script>
import { environmentalCheckGet, environmentalCheckUpdate, environmentalCheckCreate, getEnvironmentalCheckCode } from '@/api/safetyEnvironmental/environmental'
export default {
name: 'WasteGasAdd',
data() {
return {
form: {
id: '',
name: '',
code: '',
unit: '',
minValue: null,
maxValue: null,
remark: '',
checkType: 2
},
isEdit: false,
rules: {
name: [{ required: true, message: "指标名称不能为空", trigger: "blur" }],
code: [{ required: true, message: "指标编码不能为空", trigger: "blur" }],
// unit: [{ required: true, message: "unit不能为空", trigger: "change" }],
minValue: [{ required: true, message: "最小值不能为空", trigger: "blur" }],
maxValue: [{ required: true, message: "最大值不能为空", trigger: "blur" }]
}
}
},
methods: {
init(id) {
if (id) {
this.isEdit = true
this.form.id = id
environmentalCheckGet({id: this.form.id}).then(res => {
if (res.code === 0) {
this.form = res.data
}
})
} else {
this.isEdit = false
this.form.id = ''
// 编码
getEnvironmentalCheckCode().then(res => {
this.form.code = res.data || ''
})
}
},
submitForm() {
this.$refs['wasteGasAddForm'].validate((valid) => {
if (valid) {
if (this.form.minValue > this.form.maxValue) {
this.$modal.msgError('最小值不能大于最大值')
return false
}
console.log(this.form)
if (this.isEdit) {
//编辑
environmentalCheckUpdate({ ...this.form }).then((res) => {
if (res.code === 0) {
this.$modal.msgSuccess("操作成功");
this.$emit('successSubmit')
}
})
} else {
environmentalCheckCreate({ ...this.form }).then((res) => {
if (res.code === 0) {
this.$modal.msgSuccess("操作成功");
this.$emit('successSubmit')
}
})
}
} else {
return false
}
})
},
formClear() {
this.$refs.wasteGasAddForm.resetFields()
this.isEdit = false
}
}
}
</script>

View File

@@ -1,8 +1,205 @@
<template>
<div>wasteGasDetectionIndication</div>
<div class="app-container">
<!-- 搜索工作栏 -->
<search-bar
:formConfigs="formConfig"
ref="searchBarForm"
@headBtnClick="buttonClick"
/>
<!-- 列表 -->
<base-table
:page="queryParams.pageNo"
:limit="queryParams.pageSize"
:table-props="tableProps"
:table-data="list"
:max-height="tableH"
>
<method-btn
v-if="tableBtn.length"
slot="handleBtn"
:width="80"
label="操作"
:method-list="tableBtn"
@clickBtn="handleClick"
/>
</base-table>
<pagination
:page.sync="queryParams.pageNo"
:limit.sync="queryParams.pageSize"
:total="total"
@pagination="getList"
/>
<!-- 新增&编辑 -->
<base-dialog
:dialogTitle="addOrEditTitle"
:dialogVisible="centervisible"
@cancel="handleCancel"
@confirm="handleConfirm"
:before-close="handleCancel"
width='60%'
>
<waste-gas-add ref="wasteGasAdd" @successSubmit="successSubmit" />
</base-dialog>
</div>
</template>
<script>
import { parseTime } from '@/utils/ruoyi'
import WasteGasAdd from './components/wasteGasAdd'
import { publicFormatter } from '@/utils/dict'
import { environmentalCheckPage, environmentalCheckDelete } from '@/api/safetyEnvironmental/environmental'
const tableProps = [
{
prop: 'name',
label: '指标名称',
minWidth: 120,
showOverflowtooltip: true
},
{
prop: 'code',
label: '指示编码',
minWidth: 120
},
{
prop: 'unit',
label: '单位',
filter: publicFormatter('environment_check_unit')
},
{
prop: 'minValue',
label: '最小值'
},
{
prop: 'maxValue',
label: '最大值'
},
{
prop: 'creator',
label: '创建人'
},
{
prop: 'createTime',
label: '创建时间',
filter: parseTime,
minWidth: 160
}
]
export default {
name: 'WasteGasDetectionIndication'
name: 'WasteGasDetectionIndication',
data() {
return {
formConfig: [
{
type: 'input',
label: '指标名称',
placeholder: '指标名称',
param: 'name'
},
{
type: 'button',
btnName: '查询',
name: 'search',
color: 'primary'
},
{
type: this.$auth.hasPermi('base:waste-gas:create') ? 'separate' : '',
},
{
type: this.$auth.hasPermi('base:waste-gas:create') ? 'button' : '',
btnName: '新增',
name: 'add',
color: 'success',
plain: true
}
],
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 20,
checkType: 2,
name: null
},
total: 0,
tableProps,
list: [],
tableH: this.tableHeight(260),
tableBtn: [
this.$auth.hasPermi('base:waste-gas:update')
? {
type: 'edit',
btnName: '编辑'
}
: undefined,
this.$auth.hasPermi('base:waste-gas:delete')
? {
type: 'delete',
btnName: '删除'
}
: undefined
].filter((v)=>v),
addOrEditTitle: '',
centervisible: false
}
},
components: { WasteGasAdd },
mounted() {
this.getList()
},
methods: {
getList() {
environmentalCheckPage({...this.queryParams}).then(res => {
this.list = res.data.list || []
this.total = res.data.total || 0
})
},
buttonClick(val) {
console.log(val)
if (val.btnName === 'search') {
this.queryParams.name = val.name
this.getList()
} else {
this.addOrEditTitle = '新增'
this.centervisible = true
this.$nextTick(() => {
this.$refs.wasteGasAdd.init()
})
}
},
handleClick(val) {
console.log(val)
switch (val.type) {
case 'edit':
this.addOrEditTitle = '编辑'
this.centervisible = true
this.$nextTick(() => {
this.$refs.wasteGasAdd.init(val.data.id)
})
break
default:
this.handleDelete(val.data)
}
},
// 删除
handleDelete(val) {
this.$modal.confirm('是否确认删除"' + val.name + '"的数据项?').then(function() {
return environmentalCheckDelete({ id: val.id })
}).then(() => {
this.getList();
this.$modal.msgSuccess("操作成功");
}).catch(() => {});
},
// 新增
handleCancel() {
this.$refs.wasteGasAdd.formClear()
this.centervisible = false
this.addOrEditTitle = ''
},
handleConfirm() {
this.$refs.wasteGasAdd.submitForm()
},
successSubmit() {
this.handleCancel()
this.getList()
}
}
}
</script>

View File

@@ -1,8 +1,124 @@
<template>
<div>wasteGas</div>
<div class="wasteGasManagement">
<div class="box1">
<div class="boxTitle">
<span class="blueTitle"></span>
<span>检测指标实时数据</span>
</div>
<div class="itemBox">
<div class="itemBox">
<div class="itemClass" v-for="(item, index) in realtimeList" :key='index'>
<div class="itemSub">
<p class="itemNum">{{item.checkValue}}</p>
<p class="itemDescribe">
<img src="./../../../../../assets/images/detectionData.png" alt="">
{{item.name}}</p>
</div>
</div>
</div>
</div>
</div>
<div class="box2">
<div class="boxTitle">
<span class="blueTitle"></span>
<span>检测指标趋势图</span>
</div>
</div>
</div>
</template>
<script>
import { environmentalCheckRealtime } from '@/api/safetyEnvironmental/environmental'
export default {
name: 'WasteGas'
name: 'WasteGasManagement',
data(){
return {
realtimeList:[]
}
},
mounted() {
this.getMsg()
},
methods: {
getMsg() {
environmentalCheckRealtime({checkType: 2}).then(res => {
console.log(res)
this.realtimeList = res.data || []
})
}
}
}
</script>
</script>
<style lang='scss' scoped>
.wasteGasManagement {
background-color: #f2f4f9;
.box1 {
height: 172px;
padding: 12px 16px 0;
margin-bottom: 8px;
background-color: #fff;
border-radius: 9px;
.itemBox {
display: flex;
flex-flow: row nowrap;
overflow: auto;
.itemClass {
width: 198px;
height: 88px;
// border: 1px solid green;
padding: 12px 0px 12px 18px;
.itemSub {
width: 176px;
height: 65px;
padding-right: 26px;
border-right: 1px solid #E8E8E8;
P{
margin: 0;
img {
width: 24px;
height: 24px;
vertical-align: middle;
}
}
.itemNum {
font-size: 32px;
font-weight: 600;
height: 43px;
color: #3E6AF7;
text-align: right;
}
.itemDescribe {
font-size: 16px;
text-align: right;
}
}
}
}
.itemClass:last-child > .itemSub{
border: none !important;
}
}
.box2 {
background-color: #fff;
border-radius: 9px;
padding: 16px;
height: calc(100vh - 308px);
}
.boxTitle {
display: inline-block;
font-size: 16px;
font-weight: 400;
color: #000000;
margin:0 10px 20px 0;
}
.blueTitle {
content: '';
display: inline-block;
width: 4px;
height: 18px;
background-color: #0B58FF;
border-radius: 1px;
margin-right: 8px;
vertical-align: bottom;
}
}
</style>