@@ -13,14 +13,14 @@ VUE_APP_TITLE = MES系统 | |||
# 芋道管理系统/开发环境 | |||
# VUE_APP_BASE_API = 'http://100.64.0.26:48082' | |||
VUE_APP_BASE_API = 'http://192.168.0.33:48082' | |||
# VUE_APP_BASE_API = 'http://192.168.0.33:48082' | |||
# VUE_APP_BASE_API = 'http://192.168.4.173:48080' | |||
# VUE_APP_BASE_API = 'http://192.168.2.173:48080' | |||
# VUE_APP_BASE_API = 'http://192.168.1.49:48082' | |||
# VUE_APP_BASE_API = 'http://192.168.1.8:48082' | |||
# VUE_APP_BASE_API = 'http://192.168.4.159:48080' | |||
# VUE_APP_BASE_API = 'http://192.168.1.56:48082' | |||
# VUE_APP_BASE_API = 'http://192.168.4.159:48080' | |||
VUE_APP_BASE_API = 'http://192.168.1.62:48080' | |||
# 积木报表指向地址 | |||
VUE_APP_JIMU_API = 'http://192.168.0.33:48082' | |||
@@ -0,0 +1,92 @@ | |||
import request from '@/utils/request' | |||
// 获得环保检测指标实时数据 | |||
export function environmentalCheckRealtime(query) { | |||
return request({ | |||
url: '/base/environmental-check/realtime', | |||
method: 'get', | |||
params: query | |||
}) | |||
} | |||
// 获得环保检测指标趋势数据 | |||
export function environmentalCheckRealtimeTrend(query) { | |||
return request({ | |||
url: '/base/environmental-check-record/trend', | |||
method: 'get', | |||
params: query | |||
}) | |||
} | |||
// 获得环保检测指标分页 | |||
export function environmentalCheckPage(query) { | |||
return request({ | |||
url: '/base/environmental-check/page', | |||
method: 'get', | |||
params: query | |||
}) | |||
} | |||
// 创建环保检测指标 | |||
export function environmentalCheckCreate(data) { | |||
return request({ | |||
url: '/base/environmental-check/create', | |||
method: 'post', | |||
data: data | |||
}) | |||
} | |||
// 更新环保检测指标 | |||
export function environmentalCheckUpdate(data) { | |||
return request({ | |||
url: '/base/environmental-check/update', | |||
method: 'put', | |||
data: data | |||
}) | |||
} | |||
// 获得环保检测指标 | |||
export function environmentalCheckGet(query) { | |||
return request({ | |||
url: '/base/environmental-check/get', | |||
method: 'get', | |||
params: query | |||
}) | |||
} | |||
// 删除环保检测指标 | |||
export function environmentalCheckDelete(query) { | |||
return request({ | |||
url: '/base/environmental-check/delete', | |||
method: 'delete', | |||
params: query | |||
}) | |||
} | |||
// 获得环保检测记录分页 | |||
export function environmentalCheckRecordPage(query) { | |||
return request({ | |||
url: '/base/environmental-check-record/page', | |||
method: 'get', | |||
params: query | |||
}) | |||
} | |||
// 导出环保检测记录 Excel | |||
export function environmentalCheckRecordExport(query) { | |||
return request({ | |||
url: '/base/environmental-check-record/export-excel', | |||
method: 'get', | |||
params: query, | |||
responseType: 'blob' | |||
}) | |||
} | |||
// 获取环保检测指标code | |||
export function getEnvironmentalCheckCode(query) { | |||
return request({ | |||
url: '/base/environmental-check/getCode', | |||
method: 'get', | |||
params: query | |||
}) | |||
} |
@@ -106,6 +106,9 @@ export const DICT_TYPE = { | |||
// ============== EQUIPMENT - 设备模块 ============= | |||
MAINTAIN_TYPE: 'maintain_type', | |||
FAULT_LEVEL: 'fault-level', | |||
// ============== ENVIRONMENTAL - 环保模块 ============= | |||
ENVIRONMENT_CHECK_UNIT: 'environment_check_unit' | |||
} | |||
/** | |||
@@ -175,7 +175,7 @@ export default { | |||
btnName: '删除' | |||
} | |||
: undefined | |||
], | |||
].filter((v)=>v), | |||
// 查询参数 | |||
queryParams: { | |||
pageNo: 1, | |||
@@ -1,8 +1,167 @@ | |||
<template> | |||
<div>vocDetectionHistory</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: 'VocDetectionHistory' | |||
name: 'VocDetectionHistory', | |||
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: 3, | |||
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: 3 | |||
}).then(res => { | |||
console.log(res) | |||
this.formConfig[0].selectOptions = res.data.list || [] | |||
}) | |||
} | |||
} | |||
} | |||
</script> |
@@ -0,0 +1,124 @@ | |||
<template> | |||
<el-form ref="vocAddForm" :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: 'VocAdd', | |||
data() { | |||
return { | |||
form: { | |||
id: '', | |||
name: '', | |||
code: '', | |||
unit: '', | |||
minValue: null, | |||
maxValue: null, | |||
remark: '', | |||
checkType: 3 | |||
}, | |||
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['vocAddForm'].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.vocAddForm.resetFields() | |||
this.isEdit = false | |||
} | |||
} | |||
} | |||
</script> |
@@ -1,8 +1,205 @@ | |||
<template> | |||
<div>vocDetectionIndication</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%' | |||
> | |||
<voc-add ref="vocAdd" @successSubmit="successSubmit" /> | |||
</base-dialog> | |||
</div> | |||
</template> | |||
<script> | |||
import { parseTime } from '@/utils/ruoyi' | |||
import VocAdd from './components/vocAdd' | |||
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: 'VocDetectionIndication' | |||
name: 'VocDetectionIndication', | |||
data() { | |||
return { | |||
formConfig: [ | |||
{ | |||
type: 'input', | |||
label: '指标名称', | |||
placeholder: '指标名称', | |||
param: 'name' | |||
}, | |||
{ | |||
type: 'button', | |||
btnName: '查询', | |||
name: 'search', | |||
color: 'primary' | |||
}, | |||
{ | |||
type: this.$auth.hasPermi('base:voc:create') ? 'separate' : '', | |||
}, | |||
{ | |||
type: this.$auth.hasPermi('base:voc:create') ? 'button' : '', | |||
btnName: '新增', | |||
name: 'add', | |||
color: 'success', | |||
plain: true | |||
} | |||
], | |||
// 查询参数 | |||
queryParams: { | |||
pageNo: 1, | |||
pageSize: 20, | |||
checkType: 3, | |||
name: null | |||
}, | |||
total: 0, | |||
tableProps, | |||
list: [], | |||
tableH: this.tableHeight(260), | |||
tableBtn: [ | |||
this.$auth.hasPermi('base:voc:update') | |||
? { | |||
type: 'edit', | |||
btnName: '编辑' | |||
} | |||
: undefined, | |||
this.$auth.hasPermi('base:voc:delete') | |||
? { | |||
type: 'delete', | |||
btnName: '删除' | |||
} | |||
: undefined | |||
].filter((v)=>v), | |||
addOrEditTitle: '', | |||
centervisible: false | |||
} | |||
}, | |||
components: { VocAdd }, | |||
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.vocAdd.init() | |||
}) | |||
} | |||
}, | |||
handleClick(val) { | |||
console.log(val) | |||
switch (val.type) { | |||
case 'edit': | |||
this.addOrEditTitle = '编辑' | |||
this.centervisible = true | |||
this.$nextTick(() => { | |||
this.$refs.vocAdd.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.vocAdd.formClear() | |||
this.centervisible = false | |||
this.addOrEditTitle = '' | |||
}, | |||
handleConfirm() { | |||
this.$refs.vocAdd.submitForm() | |||
}, | |||
successSubmit() { | |||
this.handleCancel() | |||
this.getList() | |||
} | |||
} | |||
} | |||
</script> |
@@ -1,8 +1,124 @@ | |||
<template> | |||
<div>voc</div> | |||
<div class="voc"> | |||
<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: 'Voc' | |||
name: 'Voc', | |||
data(){ | |||
return { | |||
realtimeList:[] | |||
} | |||
}, | |||
mounted() { | |||
this.getMsg() | |||
}, | |||
methods: { | |||
getMsg() { | |||
environmentalCheckRealtime({checkType: 3}).then(res => { | |||
console.log(res) | |||
this.realtimeList = res.data || [] | |||
}) | |||
} | |||
} | |||
} | |||
</script> | |||
</script> | |||
<style lang='scss' scoped> | |||
.voc { | |||
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> |
@@ -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> |
@@ -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> |
@@ -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> |
@@ -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> |
@@ -1,8 +1,171 @@ | |||
<template> | |||
<div>wasteWaterDetectionHistory</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: 'WasteWaterDetectionHistory' | |||
name: 'WasteWaterDetectionHistory', | |||
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: 1, | |||
// 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 | |||
// this.queryParams.checkTime[0] = 1701014400000 | |||
// this.queryParams.checkTime[1] = 1701100800000 | |||
this.queryParams.startTime = 1701014400000 | |||
this.queryParams.endTime = 1701100800000 | |||
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: 1 | |||
}).then(res => { | |||
console.log(res) | |||
this.formConfig[0].selectOptions = res.data.list || [] | |||
}) | |||
} | |||
} | |||
} | |||
</script> |
@@ -1,9 +1,9 @@ | |||
<template> | |||
<el-form ref="wasteWaterAddForm" :rules="rules" label-width="130px" :model="form"> | |||
<el-form ref="wasteWaterAddForm" :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"></el-input> | |||
<el-input v-model="form.name" :disabled='isEdit'></el-input> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='12'> | |||
@@ -12,150 +12,113 @@ | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='12'> | |||
<el-form-item label="指标名称" prop="name1"> | |||
<el-input v-model="form.name"></el-input> | |||
<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="code11"> | |||
<el-input v-model="form.code"></el-input> | |||
<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="name12"> | |||
<el-input v-model="form.name"></el-input> | |||
<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="code1122"> | |||
<el-input v-model="form.code"></el-input> | |||
<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: 'WasteWaterAdd', | |||
data() { | |||
return { | |||
// rules: { | |||
// name: [{ required: true, message: "订单名称不能为空", trigger: "blur" }], | |||
// code: [{ required: true, message: "订单号不能为空", trigger: "blur" }], | |||
// planQuantity: [{ required: true, message: "计划加工数量不能为空", trigger: "blur" }], | |||
// planProductId: [{ required: true, message: "产品名称不能为空", trigger: "change" }] | |||
// } | |||
form: { | |||
id: '', | |||
name: '', | |||
code: '', | |||
unit: '', | |||
minValue: null, | |||
maxValue: null, | |||
remark: '', | |||
checkType: 1 | |||
}, | |||
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) { | |||
// this.getList() | |||
// if (id) { | |||
// this.isEdit = true | |||
// this.form.id = id | |||
// getOrderById({id: this.form.id}).then(res => { | |||
// if (res.code === 0) { | |||
// this.form.name = res.data.name | |||
// this.form.code = res.data.code | |||
// this.form.planQuantity = res.data.planQuantity | |||
// this.form.planProductId = res.data.planProductId | |||
// this.form.price = res.data.price | |||
// this.form.customerId = res.data.customerId | |||
// this.form.priority = res.data.priority ? res.data.priority + '' : '' | |||
// this.form.planStartTime = res.data.planStartTime ? res.data.planStartTime : null | |||
// this.form.packSpec = res.data.packSpec ? res.data.packSpec+'' : '' | |||
// this.form.workers = res.data.workers | |||
// this.form.processFlowId = res.data.processFlowId | |||
// this.form.materialMethod = res.data.materialMethod | |||
// this.form.planFinishTime = res.data.planFinishTime ? res.data.planFinishTime : null | |||
// this.form.remark = res.data.remark | |||
// // this.form.description = res.data.description | |||
// } | |||
// }) | |||
// } else { | |||
// this.isEdit = false | |||
// this.form.id = '' | |||
// // 订单号 | |||
// getOrderCode().then(res => { | |||
// this.form.code = res.data || '' | |||
// }) | |||
// } | |||
// }, | |||
// getList() { | |||
// // 产品 | |||
// getProductAll().then(res => { | |||
// this.productList = res.data || [] | |||
// }) | |||
// // 客户 | |||
// getCustomerList().then(res => { | |||
// this.customerList = res.data || [] | |||
// }) | |||
// // 工艺 | |||
// getProcessFlowList().then(res => { | |||
// this.processFlowList = res.data || [] | |||
// }) | |||
// }, | |||
// timeChange() { | |||
// if (this.form.planStartTime && this.form.planFinishTime) { | |||
// if (this.form.planStartTime > this.form.planFinishTime) { | |||
// this.$modal.msgError('计划开始时间不能大于结束时间') | |||
// } | |||
// } | |||
// }, | |||
// // 工艺变更 | |||
// materialMethodChange(val) { | |||
// if (val === 2 && !this.form.processFlowId) { | |||
// this.form.materialMethod = 1 | |||
// this.$modal.msgError("请先选择关联工艺"); | |||
// } | |||
// }, | |||
// // 工艺变更 | |||
// processFlowIdChange(val) { | |||
// console.log(val) | |||
// if (!val) { | |||
// this.form.materialMethod = 1 | |||
// } | |||
// }, | |||
// submitForm() { | |||
// this.$refs['orderAddForm'].validate((valid) => { | |||
// if (valid) { | |||
// if (this.form.planStartTime && this.form.planFinishTime) { | |||
// if (this.form.planStartTime > this.form.planFinishTime) { | |||
// this.$modal.msgError('计划开始时间不能大于结束时间') | |||
// return false | |||
// } | |||
// } | |||
// // console.log(this.form) | |||
// if (this.isEdit) { | |||
// //编辑 | |||
// orderUpdate({ ...this.form }).then((res) => { | |||
// if (res.code === 0) { | |||
// this.$modal.msgSuccess("操作成功"); | |||
// this.$emit('successSubmit') | |||
// } | |||
// }) | |||
// } else { | |||
// this.form.status = 1 | |||
// this.form.triggerOrigin = 1 | |||
// orderCreate({ ...this.form }).then((res) => { | |||
// if (res.code === 0) { | |||
// this.$modal.msgSuccess("操作成功"); | |||
// this.$emit('successSubmit') | |||
// } | |||
// }) | |||
// } | |||
// } else { | |||
// return false | |||
// } | |||
// }) | |||
// }, | |||
// formClear() { | |||
// this.$refs.orderAddForm.resetFields() | |||
// this.form.materialMethod = 1 | |||
// this.form.price = 0.00 | |||
// this.form.planQuantity = 0 | |||
// this.isEdit = false | |||
// } | |||
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['wasteWaterAddForm'].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.wasteWaterAddForm.resetFields() | |||
this.isEdit = false | |||
} | |||
} | |||
} | |||
</script> |
@@ -17,7 +17,7 @@ | |||
<method-btn | |||
v-if="tableBtn.length" | |||
slot="handleBtn" | |||
:width="120" | |||
:width="80" | |||
label="操作" | |||
:method-list="tableBtn" | |||
@clickBtn="handleClick" | |||
@@ -44,11 +44,13 @@ | |||
</template> | |||
<script> | |||
import { parseTime } from '@/utils/ruoyi' | |||
// import { publicFormatter } from '@/utils/dict' | |||
import WasteWaterAdd from './components/wasteWaterAdd' | |||
import { publicFormatter } from '@/utils/dict' | |||
import { environmentalCheckPage, environmentalCheckDelete } from '@/api/safetyEnvironmental/environmental' | |||
const tableProps = [ | |||
{ | |||
prop: 'name', | |||
label: '指示名称', | |||
label: '指标名称', | |||
minWidth: 120, | |||
showOverflowtooltip: true | |||
}, | |||
@@ -58,26 +60,22 @@ const tableProps = [ | |||
minWidth: 120 | |||
}, | |||
{ | |||
prop: 'customerId', | |||
label: '单位' | |||
prop: 'unit', | |||
label: '单位', | |||
filter: publicFormatter('environment_check_unit') | |||
}, | |||
{ | |||
prop: 'customerId1', | |||
prop: 'minValue', | |||
label: '最小值' | |||
}, | |||
{ | |||
prop: 'customerId2', | |||
prop: 'maxValue', | |||
label: '最大值' | |||
}, | |||
{ | |||
prop: 'customerId3', | |||
prop: 'creator', | |||
label: '创建人' | |||
}, | |||
// { | |||
// prop: 'triggerOrigin', | |||
// label: '来源', | |||
// filter: publicFormatter('order_Origin') | |||
// }, | |||
{ | |||
prop: 'createTime', | |||
label: '创建时间', | |||
@@ -91,11 +89,9 @@ export default { | |||
return { | |||
formConfig: [ | |||
{ | |||
type: 'select', | |||
type: 'input', | |||
label: '指标名称', | |||
selectOptions: this.getDictDatas(this.DICT_TYPE.ORDER_STATUS), | |||
labelField: 'label', | |||
valueField: 'value', | |||
placeholder: '指标名称', | |||
param: 'name' | |||
}, | |||
{ | |||
@@ -105,10 +101,10 @@ export default { | |||
color: 'primary' | |||
}, | |||
{ | |||
type: this.$auth.hasPermi('base:order-manage:create') ? 'separate' : '', | |||
type: this.$auth.hasPermi('base:waste-water:create') ? 'separate' : '', | |||
}, | |||
{ | |||
type: this.$auth.hasPermi('base:order-manage:create') ? 'button' : '', | |||
type: this.$auth.hasPermi('base:waste-water:create') ? 'button' : '', | |||
btnName: '新增', | |||
name: 'add', | |||
color: 'success', | |||
@@ -119,35 +115,42 @@ export default { | |||
queryParams: { | |||
pageNo: 1, | |||
pageSize: 20, | |||
name: null, | |||
status: null | |||
checkType: 1, | |||
name: null | |||
}, | |||
total: 0, | |||
tableProps, | |||
list: [ | |||
{name:'1111'} | |||
], | |||
list: [], | |||
tableH: this.tableHeight(260), | |||
tableBtn: [ | |||
this.$auth.hasPermi('base:order-manage:edit') | |||
this.$auth.hasPermi('base:waste-water:update') | |||
? { | |||
type: 'edit', | |||
btnName: '编辑' | |||
} | |||
: undefined, | |||
this.$auth.hasPermi('base:order-manage:delete') | |||
this.$auth.hasPermi('base:waste-water:delete') | |||
? { | |||
type: 'delete', | |||
btnName: '删除' | |||
} | |||
: undefined | |||
], | |||
].filter((v)=>v), | |||
addOrEditTitle: '', | |||
centervisible: false | |||
} | |||
}, | |||
components: { WasteWaterAdd }, | |||
mounted() { | |||
this.getList() | |||
}, | |||
methods: { | |||
getList() {}, | |||
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') { | |||
@@ -178,7 +181,7 @@ export default { | |||
// 删除 | |||
handleDelete(val) { | |||
this.$modal.confirm('是否确认删除"' + val.name + '"的数据项?').then(function() { | |||
// return wasteWaterDelete({ id: val.id }) | |||
return environmentalCheckDelete({ id: val.id }) | |||
}).then(() => { | |||
this.getList(); | |||
this.$modal.msgSuccess("操作成功"); | |||
@@ -0,0 +1,128 @@ | |||
<template> | |||
<div | |||
id="wasteWaterLine" | |||
style="width: 100%" | |||
:style="{ height: chartHeight + 'px' }" | |||
></div> | |||
</template> | |||
<script> | |||
import * as echarts from 'echarts' | |||
import resize from '@/utils/chartMixins/resize' | |||
export default { | |||
name: "LineChart", | |||
mixins: [resize], | |||
data() { | |||
return { | |||
chartDom: '', | |||
chart: '', | |||
chartHeight: this.tableHeight(420) | |||
} | |||
}, | |||
mounted() { | |||
window.addEventListener('resize', () => { | |||
this.chartHeight = this.tableHeight(420) | |||
}) | |||
this.getChart() | |||
}, | |||
methods: { | |||
getChart() { | |||
var chartDom = document.getElementById('wasteWaterLine'); | |||
var myChart = echarts.init(chartDom); | |||
var option = { | |||
tooltip: { | |||
trigger: 'axis', | |||
formatter: function (params) { | |||
return ( | |||
params[0].axisValue + | |||
`<br>` + | |||
params | |||
.map((item) => { | |||
let str = `<span style="display:inline-block;width:8px;height:8px;margin: 0 8px 0 -3px;border-radius:2px;background-color:${item.color};"></span>`; | |||
let seriesNameStr = `<span style="display:inline-block;">${item.seriesName}</span>`; | |||
let value = item.value ? item.value : '-'; | |||
let valueStr = `<span style="display:inline-block;margin-left:10px;color:rgba(0,0,0,0.45);">${value}</span>`; | |||
return `<span style="display:flex; justify-content:space-between; margin-bottom: 2px"> | |||
<span>${str}${seriesNameStr}</span> | |||
<span>${valueStr}</span> | |||
</span>`; | |||
}) | |||
.join(``) | |||
); | |||
} | |||
}, | |||
legend: { | |||
data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine'], | |||
right: '1%', | |||
icon: 'rect', | |||
itemHeight: 8, | |||
itemWidth: 8 | |||
}, | |||
grid: { | |||
left: '3%', | |||
right: '4%', | |||
bottom: '3%', | |||
containLabel: true | |||
}, | |||
toolbox: { | |||
feature: { | |||
saveAsImage: {} | |||
} | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
boundaryGap: false, | |||
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] | |||
}, | |||
yAxis: { | |||
type: 'value' | |||
}, | |||
axisPointer: { | |||
type: 'line', | |||
lineStyle: { | |||
color: 'rgba(11, 88, 255, 1)' | |||
} | |||
}, | |||
series: [ | |||
{ | |||
name: 'Email', | |||
type: 'line', | |||
stack: 'Total', | |||
symbol: 'none', | |||
data: [120, 132, 101, 134, 90, 230, 210] | |||
}, | |||
{ | |||
name: 'Union Ads', | |||
type: 'line', | |||
stack: 'Total', | |||
symbol: 'none', | |||
data: [220, 182, 191, 234, 290, 330, 310] | |||
}, | |||
{ | |||
name: 'Video Ads', | |||
type: 'line', | |||
stack: 'Total', | |||
symbol: 'none', | |||
data: [150, 232, 201, 154, 190, 330, 410] | |||
}, | |||
{ | |||
name: 'Direct', | |||
type: 'line', | |||
stack: 'Total', | |||
symbol: 'none', | |||
data: [320, 332, 301, 334, 390, 330, 320] | |||
}, | |||
{ | |||
name: 'Search Engine', | |||
type: 'line', | |||
stack: 'Total', | |||
symbol: 'none', | |||
data: [820, 932, 901, 934, 1290, 1330, 1320] | |||
} | |||
] | |||
}; | |||
option && myChart.setOption(option); | |||
} | |||
} | |||
} | |||
</script> |
@@ -1,8 +1,171 @@ | |||
<template> | |||
<div>wasteWater</div> | |||
<div class="wasteWaterManagement"> | |||
<div class="box1"> | |||
<div class="boxTitle"> | |||
<span class="blueTitle"></span> | |||
<span>检测指标实时数据</span> | |||
</div> | |||
<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 class="box2"> | |||
<div class="boxTitle"> | |||
<span class="blueTitle"></span> | |||
<span>检测指标趋势图</span> | |||
</div> | |||
<!-- 搜索工作栏 --> | |||
<search-bar | |||
:formConfigs="formConfig" | |||
ref="searchBarForm" | |||
@headBtnClick="buttonClick" | |||
/> | |||
<line-chart /> | |||
</div> | |||
</div> | |||
</template> | |||
<script> | |||
import { environmentalCheckRealtime, environmentalCheckRealtimeTrend } from '@/api/safetyEnvironmental/environmental' | |||
import LineChart from './components/lineChart' | |||
export default { | |||
name: 'WasteWater' | |||
name: 'WasteWaterManagement', | |||
data(){ | |||
return { | |||
realtimeList:[], | |||
queryParams:{ | |||
checkType: 1, | |||
timeDim: null, | |||
timeRange: [] | |||
}, | |||
formConfig: [ | |||
{ | |||
type: 'select', | |||
label: '时间维度', | |||
selectOptions: this.getDictDatas(this.DICT_TYPE.TIME_DIM), | |||
labelField: 'label', | |||
valueField: 'value', | |||
param: 'timeDim', | |||
width: 100 | |||
}, | |||
{ | |||
type: 'datePicker', | |||
label: '时间范围', | |||
dateType: 'daterange', | |||
format: 'yyyy-MM-dd', | |||
valueFormat: "yyyy-MM-dd", | |||
rangeSeparator: '-', | |||
startPlaceholder: '开始时间', | |||
endPlaceholder: '结束时间', | |||
param: 'timeVal', | |||
defaultSelect: [], | |||
width: 250 | |||
}, | |||
{ | |||
type: 'button', | |||
btnName: '查询', | |||
name: 'search', | |||
color: 'primary' | |||
} | |||
], | |||
} | |||
}, | |||
components: { LineChart }, | |||
mounted() { | |||
this.getMsg() | |||
}, | |||
methods: { | |||
getMsg() { | |||
environmentalCheckRealtime({checkType: 1}).then(res => { | |||
console.log(res) | |||
this.realtimeList = res.data || [] | |||
}) | |||
}, | |||
getTrend() { | |||
environmentalCheckRealtimeTrend({...this.queryParams}).then(res => { | |||
console.log(res) | |||
}) | |||
} | |||
} | |||
} | |||
</script> | |||
</script> | |||
<style lang='scss' scoped> | |||
.wasteWaterManagement { | |||
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> |