环保管理
This commit is contained in:
		| @@ -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> | ||||
		Reference in New Issue
	
	Block a user