From 593f6ccd3aec8045a26b4b330f2b034df05bfd9f Mon Sep 17 00:00:00 2001 From: seatonwan9 <seatonwan9@163.com> Date: 星期五, 28 五月 2021 09:27:55 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/components/base-page/enterprise-emergency/event-handling/DisposalProposed.vue | 98 ++ /dev/null | 365 ------------- src/components/base-page/enterprise-emergency/events-reported/ReportLocationSection.vue | 353 +++++++++++++ src/views/MapTemplate.vue | 2 src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue | 43 src/components/panel/topicSearch/SewersSearch.vue | 1 src/components/base-page/enterprise-emergency/events-reported/EventsReported.vue | 466 +++++++++++++++++ src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue | 120 ++-- src/components/base-page/enterprise-emergency/events-reported/ReportFile.vue | 10 src/components/base-page/enterprise-emergency/events-reported/ReportLocation.vue | 152 +++++ 10 files changed, 1,132 insertions(+), 478 deletions(-) diff --git a/src/components/base-page/enterprise-emergency/EventsReported.vue b/src/components/base-page/enterprise-emergency/EventsReported.vue deleted file mode 100644 index fcc52d7..0000000 --- a/src/components/base-page/enterprise-emergency/EventsReported.vue +++ /dev/null @@ -1,467 +0,0 @@ -<template> - <div class="event-report"> -<!-- :rules="rules"--> -<!-- :show-close="false"--> - <el-form :model="ruleForm" ref="ruleForm" label-width="90px" class="search-form"> - <!-- 浜嬩欢鍚嶇О--> - <el-form-item class="input-event-name" label="浜嬩欢鍚嶇О" prop="nameOfEvent"> - <el-input - v-model="ruleForm.nameOfEvent" - placeholder="灏嗕簨浠跺懡鍚�" - ></el-input> - </el-form-item> - <!-- 浜嬩欢绫诲瀷--> - <el-form-item label="浜嬩欢绫诲瀷" prop="eventOfType"> - <el-radio-group v-model="ruleForm.eventOfType"> - <el-col :span="8" v-for="(item,index) in ruleForm.eventOfTypeList" :key="index" - :style="{margin:'5px 0'}"> - <el-radio :label="item.value"> - <span>{{ item.name }}</span> - </el-radio> - </el-col> - </el-radio-group> - </el-form-item> - <!-- 浜嬩欢绛夌骇--> - <el-form-item label="浜嬩欢鍒嗙骇" prop="eventOfLevel"> - <el-radio-group v-model="ruleForm.eventOfLevel"> - <el-col :span="8" v-for="(item,index) in ruleForm.eventOfLevelList" :key="index" - :style="{margin:'5px 0'}"> - <el-radio :label="item.value"> - <span>{{ item.name }}</span> - </el-radio> - </el-col> - </el-radio-group> - </el-form-item> - <el-row> - <!-- 浜嬪彂鍗曚綅--> - <el-col :span="12"> - <el-form-item label="浜嬪彂鍗曚綅" prop="unit"> - <el-select v-model="ruleForm.unit" placeholder="鍗曚綅,瑁呯疆閫夋嫨"> - <el-option - v-for="item in ruleForm.unitList" - :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 class="search-panel-item" label="浜嬪彂鏃堕棿" prop="atTime"> - <el-date-picker - v-model="ruleForm.atTime" - type="datetime" - placeholder="骞�/鏈�/鏃�"> - </el-date-picker> - </el-form-item> - </el-col> - </el-row> - <el-row> - <!-- 浜嬪彂浣嶇疆--> - <el-col :span="12"> - <el-form-item label="浜嬪彂浣嶇疆" prop="positionOf"> - <el-input v-model="ruleForm.positionOf" clearable> - <!-- <el-button slot="suffix" type="text" class="el-icon-location-information"--> - <!-- @click="locationInfo"></el-button>--> - <el-button style="padding-right:10px;" slot="suffix" type="text" - @click="locationInfo"> - <img src="../../../../public/assets/images/map/loc.png" alt=""> - </el-button> - </el-input> - </el-form-item> - </el-col> - <!-- 浣嶇疆鎻忚堪--> - <el-col :span="12"> - <el-form-item label="浣嶇疆鎻忚堪" prop="positionDescription"> - <el-input v-model="ruleForm.positionDescription"></el-input> - </el-form-item> - </el-col> - </el-row> - <el-row> - <!-- 绠$嚎鍚嶇О--> - <el-col :span="12"> - <el-form-item label="绠$嚎鍚嶇О" prop="lineName" class="search-panel-item"> - <el-input disabled v-model="ruleForm.lineName" placeholder="鑷姩甯﹀嚭涓嶅彲淇敼" - class="report-input"></el-input> - </el-form-item> - </el-col> - <!-- 绠$嚎绫诲瀷--> - <el-col :span="12"> - <el-form-item label="绠$嚎绫诲瀷" prop="lineType"> - <label>{{ ruleForm.lineTypeText }}</label> - </el-form-item> - </el-col> - </el-row> - <!-- 鐐瑰嚮涓婁紶--> - <el-form-item label="闄勪欢涓婁紶" prop="upload"> - <el-upload - class="upload-demo" - action="uploadAction" - multiple - :limit="3" - :file-list="fileList"> - <el-button size="small" type="primary">鐐瑰嚮涓婁紶</el-button> - </el-upload> - </el-form-item> - <!-- 娑堟伅鎺ㄩ��--> - <el-form-item label="娑堟伅鎺ㄩ��" prop="beingPush"> - <el-checkbox-group v-model="ruleForm.beingPushed" @change="infoChange"> - <el-checkbox v-for="item in ruleForm.beingPushList" - :key="item.name" - :label="item.name" - > - </el-checkbox> - </el-checkbox-group> - </el-form-item> - <!-- // 鎻忚堪 鎺ユ敹 灞曠ず銆侀殣钘�--> - <div v-show="wayTo" class="way-to"> - <el-form-item label="浜嬩欢鎻忚堪" prop="desc"> - <el-input type="textarea" resize="none" v-model="ruleForm.desc" - placeholder="甯﹀嚭浜嬩欢绫诲瀷锛屼簨浠朵綅缃紝浜嬩欢鍗曚綅锛屼簨浠舵椂闂寸瓑瀛楁鑷姩鐢熶骇涓�閮ㄥ垎鎻忚堪"> - </el-input> - <el-button type="primary">涓�閿�<br/>鐢熸垚</el-button> - </el-form-item> - <el-form-item label="鎺ユ敹浜哄憳" prop="receiveOne"> - <el-input type="textarea" resize="none" v-model="ruleForm.receiveOne" - placeholder="寮犱笁锛涙潕鍥涳紝"></el-input> - <el-button type="primary">+</el-button> - </el-form-item> - </div> - <el-form-item class="confirmCancel"> - <el-button type="primary" @click="submitForm('ruleForm')">纭</el-button> - <el-button @click="resetForm('ruleForm')">鍙栨秷</el-button> - </el-form-item> - </el-form> - <el-dialog - custom-class="el-dialog--center" - :visible.sync="dialogLocation" - :append-to-body="true" - :modal="false" - v-dialogDragBottom - > - <ReportLocation @locationClick="getlocaltionClick"></ReportLocation> - </el-dialog> - </div> -</template> - -<script> - -import ReportLocation from '../../../components/base-page/enterprise-emergency/ReportLocation' - -export default { - name: 'EventsReported', - components: { - ReportLocation - }, - data () { - return { - // 琛ㄥ崟缁戝畾鏁版嵁 - ruleForm: { - // 浜嬩欢鍚嶇О 缁戝畾鏁版嵁 - nameOfEvent: '', - // 浜嬩欢绫诲瀷 缁戝畾鏁版嵁鍊� - eventOfType: '', - // 浜嬩欢绫诲瀷鍙�夋嫨鏁版嵁radio 缁戝畾鏁版嵁 - eventOfTypeList: [ - { - name: '娴�(姘�)涓婃孩娌规薄鏌�', - value: 1 - }, - { - name: '娌规皵绠¢亾娉勬紡姹℃煋', - value: 2 - }, - { - name: '杈愬皠姹℃煋', - value: 3 - }, - { - name: '鐢熸�佺幆澧冪牬鍧�', - value: 4 - }, - { - name: '鍏朵粬', - value: 5 - } - ], - // 浜嬩欢绛夌骇 - eventOfLevel: '', - // 浜嬩欢绛夌骇鍙�夋嫨鏁版嵁radio 缁戝畾鏁版嵁 - eventOfLevelList: [ - { - name: '鐗瑰埆閲嶅ぇ鐜浜嬩欢', - value: 1 - }, - { - name: '閲嶅ぇ鐜浜嬩欢', - value: 2 - }, - { - name: '杈冨ぇ鐜浜嬩欢', - value: 3 - }, - { - name: '涓�鑸珹绾�', - value: 4 - }, - { - name: '涓�鑸珺绾�', - value: 5 - }, - { - name: '涓�鑸珻绾�', - value: 6 - } - ], - // 浜嬪彂鍗曚綅 缁戝畾鏁版嵁鍊� - unit: '', - unitList: [ - { - label: '鎵瓙', - value: '1' - }, - { - label: '鍗椾含', - value: '2' - } - ], - // 浜嬪彂鏃堕棿 缁戝畾鏁版嵁 - atTime: '', - // 浜嬪彂浣嶇疆 - positionOf: '', - // 浣嶇疆鎻忚堪 - positionDescription: '', - // 绠$嚎鍚嶇О - lineName: '', - // 绠$嚎绫诲瀷 - lineType: '', - lineTypeText: '鑷姩甯﹀嚭涓嶅彲淇敼', - // 娑堟伅鎺ㄩ�� - beingPushed: [], - beingPushList: [ - { - name: '鐭俊鎺ㄩ��', - value: false - }, - { - name: '鎵嬫満搴旂敤鎺ㄩ��', - value: false - } - ], - // 浜嬩欢鎻忚堪 - desc: '', - // 鎺ユ敹浜哄憳 - receiveOne: '' - }, - // 涓婁紶鍒楄〃 - fileList: [], - // 涓婁紶鍦板潃 - uploadAction: '', - // 琛ㄥ崟楠岃瘉 - // rules: { - // // 浜嬩欢鍚嶇О鏍¢獙 - // nameOfEvent: [ - // { - // required: true, - // message: '璇疯緭鍏ユ椿鍔ㄥ悕绉�', - // trigger: 'blur' - // } - // ], - // // 浜嬩欢绫诲瀷鏍¢獙 - // eventOfType: [ - // { - // required: true, - // message: '璇烽�夋嫨浜嬩欢绫诲瀷', - // trigger: 'blur' - // } - // ], - // // 浜嬩欢绛夌骇鏍¢獙 - // eventOfLevel: [ - // { - // required: true, - // message: '璇烽�夋嫨浜嬩欢绛夌骇', - // trigger: 'blur' - // } - // ], - // // 浜嬪彂鍗曚綅 缁戝畾鏁版嵁鍊� - // unit: [ - // { - // required: true, - // message: '璇烽�夋嫨娲诲姩鍖哄煙', - // trigger: 'change' - // } - // ], - // // 浜嬪彂鏃堕棿 - // atTime: [ - // { - // required: true, - // message: '璇烽�夋嫨娲诲姩璧勬簮', - // trigger: 'change' - // } - // ], - // // 浜嬩欢浣嶇疆鏍¢獙 - // positionOf: [ - // { - // required: true, - // message: '璇疯緭鍏ユ椿鍔ㄤ綅缃�', - // trigger: 'blur' - // } - // ], - // // 浣嶇疆鎻忚堪鏍¢獙 - // positionDescription: [ - // { - // required: true, - // message: '璇疯緭鍏ヤ綅缃弿杩�', - // trigger: 'blur' - // } - // ], - // // 绠$嚎鍚嶇О - // lineName: [], - // // 绠$嚎绫诲瀷 - // lineType: [] - // }, - // 鎻忚堪 鎺ユ敹 => 灞曠ず/闅愯棌 - wayTo: false, - // 瀹氫綅浣嶇疆閫夋嫨寮规 - dialogLocation: false - } - }, - methods: { - // 鎺ユ敹瀛愮粍浠朵紶閫掔殑鏁版嵁 - getlocaltionClick (val) { - console.log(val) - this.ruleForm.positionOf = val.latPos + '-' + val.longPos - this.dialogLocation = !this.dialogLocation - }, - // 娑堟伅鎺ㄩ�� 閫夋嫨鎺ㄩ�佺殑瀵硅薄 - infoChange () { - if (this.ruleForm.beingPushed.indexOf('鐭俊鎺ㄩ��') > -1 || this.ruleForm.beingPushed.indexOf('鎵嬫満搴旂敤鎺ㄩ��') > -1) { - this.wayTo = true - } else { - this.wayTo = false - } - }, - // 鐐瑰嚮瀹氫綅 杩涜浣嶇疆閫夋嫨 - locationInfo () { - this.dialogLocation = !this.dialogLocation - }, - // 琛ㄥ崟鐨勭‘璁ゆ寜閽偣鍑讳簨浠� - submitForm (formName) { - this.$refs[formName].validate((valid) => { - if (valid) { - // alert('submit!') - this.$message({ - message: '浜嬩欢涓婃姤鎻愪氦鎴愬姛', - type: 'success' - }) - } else { - this.$message('浜嬩欢涓婃姤鎻愪氦澶辫触') - return false - } - }) - this.$refs[formName].resetFields() - }, - // form琛ㄥ崟鐨勫彇娑堟寜閽偣鍑讳簨浠� 閲嶇疆淇℃伅 - resetForm (formName) { - this.$refs[formName].resetFields() - } - } -} -</script> - -<style lang="less" scoped> - - .event-report { - margin: 0 10px !important; - } - - /deep/ .el-dialog--center { - /*left: 5.3rem !important;*/ - margin-top: 0.13979rem !important; - margin-left: 5.5rem !important; - } - - /*.event-report-dialog {*/ - /* left: 2rem !important;*/ - /* top: 0.73979rem !important;*/ - /*}*/ - - /deep/ .el-dialog { - width: 20%; - } - /deep/.el-dialog__header { - /*display: none;*/ - /*max-height: 0.05rem !important;*/ - border: none !important; - } - - .way-to { - /deep/ .el-form-item__content { - display: flex; - /*.el-button {*/ - /* margin-right: 30px;*/ - /*}*/ - } - } - - /deep/ .el-form-item { - margin: 2px 0 !important; - color: #00fff6 !important; - } - - /deep/ .el-textarea__inner { - height: 0.28rem !important; - max-height: 0.45rem !important; - width: 2rem; - color: darkgrey; - border: solid 1px #00fff6; - background-color: rgba(0, 255, 246, 0.14); - outline: none; - font-size: 0.01rem; - } - - /deep/ .el-checkbox__label { - color: #00fff6 !important; - } - - /deep/ .el-icon-time:before { - content: " "; - } - - /deep/ input { - border-radius: 0; - background-color: rgba(0, 255, 246, 0.14); - border: solid 1px #00fff6; - color: #C0C4CC; - font-size: 0.01rem; - } - - /deep/ .el-input.is-disabled .el-input__inner { - color: #C0C4CC; - font-size: 0.01rem; - border-radius: 4px; - background: @background-color; - border-color: @color; - } - - /deep/ .el-input__inner { - /*width: 145px;*/ - height: 0.2rem !important; - border-radius: 5px; - background: rgba(0, 16, 30, 0.5); - } - - /deep/ .el-form-item__label { - color: @color; - } - - /deep/ .el-radio__label { - color: @color; - } - - .confirmCancel { - text-align: right; - margin: 0.071234rem !important; - } -</style> diff --git a/src/components/base-page/enterprise-emergency/ReportLocation.vue b/src/components/base-page/enterprise-emergency/ReportLocation.vue deleted file mode 100644 index cff83dc..0000000 --- a/src/components/base-page/enterprise-emergency/ReportLocation.vue +++ /dev/null @@ -1,365 +0,0 @@ -<template> - <div class="report-location-box"> - <div class="report-location"> - <el-tabs v-model="activeName"> - <el-tab-pane label="鐐瑰嚮瀹氫綅" name="first"> - <div class="click-location"> - <el-row> - <el-input type="text" v-model="clickLocation" clearable @focus="focusLocation"></el-input> - </el-row> - <el-row> - <el-button type="primary" @click="confirm">纭</el-button> - </el-row> - </div> - </el-tab-pane> - <el-tab-pane label="绠℃瀹氫綅" name="second"> - <div class="place"> - <div class="place-top"> - <!-- <div class="place-left">--> - <el-form :model="linePos" label-width="90px"> - <el-row class="elrow"> - <el-col :span="16"> -<!-- 绠℃缂栫爜--> - <el-form-item label="绠$嚎鍚嶇О:"> - <el-input v-model="linePos.lineName"></el-input> - </el-form-item> - </el-col> - <el-col :span="8" style="vertical-align: middle !important;"> - <el-button type="primary" size="mini" @click="fileChoose">...</el-button> - <el-button type="primary" size="mini" @click="tableAccod">鎼滅储</el-button> - </el-col> - </el-row> - <el-form-item label="闄勫睘璁炬柦:"> - <el-select v-model="linePos.affFac"> - <el-option - v-for="item in linePos.affFacList" - :key="item.code" - :label="item.name" - :value="item.code"> - </el-option> - </el-select> - </el-form-item> - </el-form> - </div> - <div class="place-bottom"> - <el-button type="primary" @click="confirm">纭</el-button> - </div> - </div> - <div class="pipe-table" v-show="pipeTable"> - <el-table - :data="tableData.slice((currentPage-1)*pageSize,currentPage*pageSize)" - border - style="width: 100%"> - <el-table-column - prop="number" - label="搴忓彿"> - </el-table-column> - <el-table-column - prop="seares" - label="鎼滅储缁撴灉"> - </el-table-column> - <el-table-column - prop="restype" - label="缁撴灉绫诲瀷"> - </el-table-column> - </el-table> - <!-- <el-card class="footer-page" v-if="total >= 0">--> - <el-pagination - mini - @size-change="handleSizeChange" - @current-change="handlePage" - :page-size=pageSize - :current-page="currentPage" - layout="prev, pager, next" - :total=total - class="warnPagination" - > - </el-pagination> - <!-- </el-card>--> - </div> - </el-tab-pane> - <el-tab-pane label="缁忕含搴﹀畾浣�" name="third"> - <el-row class="place-box"> - <div class="place-left"> - <el-form :model="LongLatPos" label-width="90px"> - <el-form-item label="缁忓害:"> - <el-input v-model="LongLatPos.longPos"></el-input> - </el-form-item> - <el-form-item label="绾害:"> - <el-input v-model="LongLatPos.latPos"></el-input> - </el-form-item> - </el-form> - </div> - <div class="place-right"> - <el-button type="primary" @click="mapPoints">瀹氫綅</el-button> - </div> - </el-row> - <div class="place-bottom"> - <el-button type="primary" @click="confirm">纭</el-button> - </div> - </el-tab-pane> - </el-tabs> - </div> - <el-dialog - custom-class="el-dialog--center" - :visible.sync="dialogFile" - :append-to-body="true" - :modal="false" - v-dialogDragBottom - > - <ReportFile></ReportFile> - </el-dialog> - </div> -</template> - -<script> -import eventBus from '../../../eventBus' -import ReportFile from '../../../components/base-page/enterprise-emergency/ReportFile' - -import { LayerFsss } from '../../../conf/layers/LayerFsss' - -export default { - name: 'ReportLocation', - components: { - ReportFile - }, - data () { - return { - dialogFile: false, - pipelineFile: false, - // active tab鍒囨崲 - activeName: 'first', - // 绠℃鏌ヨtable - pipeTable: false, - // 鍒嗛〉鍔熻兘 - pageSize: 3, - total: 0, - currentPage: 1, - // 鐐瑰嚮瀹氫綅缁戝畾鏁版嵁 - clickLocation: '', - // 缁忕含搴﹀畾浣� - LongLatPos: { - longPos: '', - latPos: '' - }, - // 绠℃瀹氫綅 - linePos: { - lineName: '', - affFac: '', - affFacList: LayerFsss.layers - }, - tableData: [ - { - number: 1, - seares: '20璺洦姘寸绾�', - restype: '绠$嚎鍚嶇О' - }, { - number: 2, - seares: '20璺洦姘寸绾�', - restype: '绠$嚎鍚嶇О' - }, { - number: 3, - seares: '100020', - restype: '绠℃缂栫爜' - }, - { - number: 4, - seares: '20璺洦姘寸绾�', - restype: '绠$嚎鍚嶇О' - }, { - number: 5, - seares: '20璺洦姘寸绾�', - restype: '绠$嚎鍚嶇О' - }, { - number: 6, - seares: '100020', - restype: '绠℃缂栫爜' - } - ] - } - }, - mounted () { - // 鎺ユ敹瑙勫畾 姣忔閲嶆柊閫夋嫨瀹氫綅 閮芥寚瀹� 閫夋嫨绗竴涓紑濮� - eventBus.$on('tab-change', (obj) => { - this.activeName = obj - }) - }, - methods: { - // 鍦板浘涓婄偣鍑� - selectPipeLine () { - window.map.on('click', this.selectClick) - // window.mapManager.clickDialogSwitch = false - }, - // 鍦板浘涓婄偣鍑诲洖璋� - selectClick (e) { - window.map.off('click', this.selectClick) - // const point = [e.latlng.lng, e.latlng.lat] - const pointX = e.latlng.lng - const pointY = e.latlng.lat - this.clickLocation = '\'' + pointX + '\'' + pointY + '' - this.mapPointResult(e) - }, - mapPointResult (e) { - console.log(e) - this.LongLatPos.longPos = e.latlng.lng - this.LongLatPos.latPos = e.latlng.lat - }, - // 鑾峰緱鐒︾偣 杩涜瀹氫綅 - focusLocation () { - this.selectPipeLine() - }, - // 缁忕含搴﹀畾浣� - mapPoints () { - this.selectPipeLine() - }, - // 鍒嗛〉鍔熻兘 currentPage 鏀瑰彉鏃朵細瑙﹀彂 - handlePage (val) { - // console.log(val) - this.currentPage = val - }, - // 鍒嗛〉鍔熻兘 pageSize 鏀瑰彉鏃朵細瑙﹀彂 - handleSizeChange (val) { - // console.log(val) - this.pageSize = val - }, - // 鐐瑰嚮鏂囦欢閫夋嫨 鏄剧ず绗笁绾ч〉闈� 杩涜绠$嚎/娈甸�夋嫨 - fileChoose () { - this.dialogFile = !this.dialogFile - }, - // 鐐瑰嚮纭鎸夐挳浜嬩欢 - confirm () { - // 閫氳繃瀛愮粍浠跺悜鐖剁粍浠朵紶閫掓暟鎹� - this.$emit('locationClick', this.LongLatPos) - this.clickLocation = '' - this.LongLatPos.longPos = '' - this.LongLatPos.latPos = '' - }, - // 绠℃鏌ヨ琛ㄦ牸灞曠ず - tableAccod () { - this.pipeTable = !this.pipeTable - } - } -} -</script> - -<style lang="less" scoped> - - /deep/ .el-dialog--center { - /*left: 2rem !important;*/ - margin-left: 8rem !important; - margin-top: 0.13979rem !important; - } - - /deep/ .el-dialog { - width: 20%; - } - - .place-box { - display: flex; - align-items: center; - justify-content: space-around; - } - - #pane-third { - text-align: center; - } - - /*/deep/ .el-dialog .el-dialog__header {*/ - /* display: none;*/ - /*}*/ - /deep/ - .warnPagination { - .btn-quicknext, .btn-quickprev { - color: #e4e8f1 !important; - background-color: transparent; - // border: 1px solid #25AECD; - border-left: 1px solid #25AECD; - border-bottom: 1px solid #25AECD; - border-top: 1px solid #25AECD; - color: #e4e8f1; - } - - .el-pager li { - color: #e4e8f1; - background: transparent; - // border: 1px solid #25AECD; - border-left: 1px solid #25AECD; - border-bottom: 1px solid #25AECD; - border-top: 1px solid #25AECD; - } - - .el-pager li.active { - border-color: #25AECD; - background-color: rgba(38, 222, 253, 0.3); - color: #e4e8f1; - } - - .el-pager li:hover { - border-color: #25AECD; - background-color: rgba(38, 222, 253, 0.3); - color: #34e0ff; - } - - .btn-prev { - background-color: transparent; - // border: 1px solid #25AECD; - border-left: 1px solid #25AECD; - border-bottom: 1px solid #25AECD; - border-top: 1px solid #25AECD; - color: #e4e8f1; - } - - .btn-next { - background-color: transparent; - border: 1px solid #25AECD; - color: #e4e8f1; - } - } - - .elrow { - display: flex; - align-items: center; - justify-content: space-around; - } - - .event-report-dialog { - min-width: 1.94532rem; - max-width: 1.94532rem; - } - - .click-location { - margin: 0 auto; - text-align: center; - - .el-input { - width: 80%; - margin: 15px auto; - } - - .el-button { - margin: 15px auto; - } - } - - .place { - text-align: center; - - .place-top { - display: flex; - align-items: center; - justify-content: space-around; - - .place-right { - .el-button { - margin: 15px; - } - } - } - - .place-bottom { - .el-button { - margin: 15px; - } - } - } -</style> diff --git a/src/components/base-page/enterprise-emergency/event-handling/DisposalProposed.vue b/src/components/base-page/enterprise-emergency/event-handling/DisposalProposed.vue index d668751..e22182f 100644 --- a/src/components/base-page/enterprise-emergency/event-handling/DisposalProposed.vue +++ b/src/components/base-page/enterprise-emergency/event-handling/DisposalProposed.vue @@ -1,25 +1,25 @@ <template> - <div> -<!-- <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%">--> -<!-- <el-table-column prop="define" label="寤鸿澶勭疆鎺柦" show-overflow-tooltip></el-table-column>--> -<!-- <el-table-column type="selection" label="棰勮" width="55"></el-table-column>--> + <div> + <!-- <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%">--> + <!-- <el-table-column prop="define" label="寤鸿澶勭疆鎺柦" show-overflow-tooltip></el-table-column>--> + <!-- <el-table-column type="selection" label="棰勮" width="55"></el-table-column>--> -<!-- </el-table>--> - <div class="" style="padding: 5px;"> -<!-- <div v-for="o in tableData" :key="o" class="text item">--> -<!-- {{ o.content }}--> -<!-- </div>--> - <div> - 1銆佸叧闂榾闂˙銆侀榾闂–锛屽涓婃父绠¢亾杩涜鎴祦锛涘叧闂榾闂―锛屽涓嬫父绠¢亾杩涜鎴祦 - <div> + <!-- </el-table>--> + <div class="" style="padding: 5px;"> + <!-- <div v-for="o in tableData" :key="o" class="text item">--> + <!-- {{ o.content }}--> + <!-- </div>--> + <div> + 1銆佸叧闂榾闂˙銆侀榾闂–锛屽涓婃父绠¢亾杩涜鎴祦锛涘叧闂榾闂―锛屽涓嬫父绠¢亾杩涜鎴祦 + <div> + </div> + </div> </div> - </div> - </div> - <div > -</div> + <div> + </div> - </div> + </div> </template> <script> @@ -35,9 +35,25 @@ type: 'closeFM', fmGxList: { // 涓婃父闃�闂� - syfm: [{ name: '闃�闂˙', lng: 114, lat: 32 }, { name: '闃�闂╝', lng: 114, lat: 32 }], + syfm: [{ + name: '闃�闂˙', + lng: 114, + lat: 32 + }, { + name: '闃�闂╝', + lng: 114, + lat: 32 + }], // 涓嬫父闃�闂� - xyfm: [{ name: '闃�闂‥', lng: 114, lat: 32 }, { name: '闃�闂‵', lng: 114, lat: 32 }] + xyfm: [{ + name: '闃�闂‥', + lng: 114, + lat: 32 + }, { + name: '闃�闂‵', + lng: 114, + lat: 32 + }] } }, { no: 1, @@ -46,9 +62,25 @@ type: 'closeFM', fmGxList: { // 涓婃父闃�闂� - syfm: [{ name: '闃�闂˙', lng: 114, lat: 32 }, { name: '闃�闂╝', lng: 114, lat: 32 }], + syfm: [{ + name: '闃�闂˙', + lng: 114, + lat: 32 + }, { + name: '闃�闂╝', + lng: 114, + lat: 32 + }], // 涓嬫父闃�闂� - xyfm: [{ name: '闃�闂‥', lng: 114, lat: 32 }, { name: '闃�闂‵', lng: 114, lat: 32 }] + xyfm: [{ + name: '闃�闂‥', + lng: 114, + lat: 32 + }, { + name: '闃�闂‵', + lng: 114, + lat: 32 + }] } }, { no: 1, @@ -57,17 +89,31 @@ type: 'closeFM', fmGxList: { // 涓婃父闃�闂� - syfm: [{ name: '闃�闂˙', lng: 114, lat: 32 }, { name: '闃�闂╝', lng: 114, lat: 32 }], + syfm: [{ + name: '闃�闂˙', + lng: 114, + lat: 32 + }, { + name: '闃�闂╝', + lng: 114, + lat: 32 + }], // 涓嬫父闃�闂� - xyfm: [{ name: '闃�闂‥', lng: 114, lat: 32 }, { name: '闃�闂‵', lng: 114, lat: 32 }] + xyfm: [{ + name: '闃�闂‥', + lng: 114, + lat: 32 + }, { + name: '闃�闂‵', + lng: 114, + lat: 32 + }] } }] } }, - methods: { - - } + methods: {} } </script> diff --git a/src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue b/src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue index e4ff10f..c002aab 100644 --- a/src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue +++ b/src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue @@ -1,34 +1,39 @@ <template> - <div> + <div> -<!--<!– 鍩烘湰淇℃伅–>--> -<!-- <event-base-info>--> + <!--<!– 鍩烘湰淇℃伅–>--> + <!-- <event-base-info>--> -<!-- </event-base-info>--> -<!-- 寤鸿澶勭疆--> - <disposal-proposed> + <!-- </event-base-info>--> + <!-- 寤鸿澶勭疆--> + <disposal-proposed> - </disposal-proposed> - <!-- 鏈夋晥瀹圭Н璁$畻--> - <div class="footer"> - <el-button type="primary" size="mini" @click="toggleShowCalc">浜嬫晠姘磋绠�</el-button> - <el-button type="primary" size="mini" @click="rimRes">鍛ㄨ竟璧勬簮</el-button> - <el-button type="primary" size="mini" @click="report">鐢熸垚鎶ュ憡</el-button> - <el-button type="primary" size="mini" @click="close">杩斿洖</el-button> + </disposal-proposed> + <!-- 鏈夋晥瀹圭Н璁$畻--> + <div class="footer"> + <el-button type="primary" size="mini" @click="toggleShowCalc">浜嬫晠姘磋绠�</el-button> + <el-button type="primary" size="mini" @click="rimRes">鍛ㄨ竟璧勬簮</el-button> + <el-button type="primary" size="mini" @click="report">鐢熸垚鎶ュ憡</el-button> + <el-button type="primary" size="mini" @click="close">杩斿洖</el-button> + </div> + <effective-volume-calc ref="effectVolCalc"></effective-volume-calc> </div> - <effective-volume-calc ref="effectVolCalc"></effective-volume-calc> - </div> </template> <script> -import EventBaseInfo from '@components/base-page/enterprise-emergency/event-handling/EventBaseInfo' +// import EventBaseInfo from '@components/base-page/enterprise-emergency/event-handling/EventBaseInfo' import DisposalProposed from '@components/base-page/enterprise-emergency/event-handling/DisposalProposed' import EffectiveVolumeCalc from '@components/base-page/enterprise-emergency/EffectiveVolumeCalc' + export default { name: 'EventHandling', - components: { DisposalProposed, EventBaseInfo, EffectiveVolumeCalc }, + components: { + DisposalProposed, + // EventBaseInfo, + EffectiveVolumeCalc + }, methods: { toggleShowCalc () { @@ -43,7 +48,9 @@ report () { console.log('鐢熸垚鎶ュ憡') }, - close () { console.log('杩斿洖') } + close () { + console.log('杩斿洖') + } } } diff --git a/src/components/base-page/enterprise-emergency/events-reported/EventsReported.vue b/src/components/base-page/enterprise-emergency/events-reported/EventsReported.vue new file mode 100644 index 0000000..934a193 --- /dev/null +++ b/src/components/base-page/enterprise-emergency/events-reported/EventsReported.vue @@ -0,0 +1,466 @@ +<template> + <div class="event-report"> + <el-form :model="ruleForm" ref="ruleForm" label-width="90px" class="search-form"> + <!-- 浜嬩欢鍚嶇О--> + <el-form-item class="input-event-name" label="浜嬩欢鍚嶇О" prop="nameOfEvent"> + <el-input + v-model="ruleForm.nameOfEvent" + placeholder="灏嗕簨浠跺懡鍚�" + ></el-input> + </el-form-item> + <!-- 浜嬩欢绫诲瀷--> + <el-form-item label="浜嬩欢绫诲瀷" prop="eventOfType"> + <el-radio-group v-model="ruleForm.eventOfType"> + <el-col :span="8" v-for="(item,index) in ruleForm.eventOfTypeList" :key="index" + :style="{margin:'5px 0'}"> + <el-radio :label="item.value"> + <span>{{ item.name }}</span> + </el-radio> + </el-col> + </el-radio-group> + </el-form-item> + <!-- 浜嬩欢绛夌骇--> + <el-form-item label="浜嬩欢鍒嗙骇" prop="eventOfLevel"> + <el-radio-group v-model="ruleForm.eventOfLevel"> + <el-col :span="8" v-for="(item,index) in ruleForm.eventOfLevelList" :key="index" + :style="{margin:'5px 0'}"> + <el-radio :label="item.value"> + <span>{{ item.name }}</span> + </el-radio> + </el-col> + </el-radio-group> + </el-form-item> + <el-row> + <!-- 浜嬪彂鍗曚綅--> + <el-col :span="12"> + <el-form-item label="浜嬪彂鍗曚綅" prop="unit"> + <el-select v-model="ruleForm.unit" placeholder="鍗曚綅,瑁呯疆閫夋嫨"> + <el-option + v-for="item in ruleForm.unitList" + :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 class="search-panel-item" label="浜嬪彂鏃堕棿" prop="atTime"> + <el-date-picker + v-model="ruleForm.atTime" + type="datetime" + placeholder="骞�/鏈�/鏃�"> + </el-date-picker> + </el-form-item> + </el-col> + </el-row> + <el-row> + <!-- 浜嬪彂浣嶇疆--> + <el-col :span="12"> + <el-form-item label="浜嬪彂浣嶇疆" prop="positionOf"> + <el-input v-model="ruleForm.positionOf" clearable> + <!-- <el-button slot="suffix" type="text" class="el-icon-location-information"--> + <!-- @click="locationInfo"></el-button>--> + <el-button style="padding-right:10px;" slot="suffix" type="text" + @click="locationInfo"> + <img src="../../../../../public/assets/images/map/loc.png" alt=""> + </el-button> + </el-input> + </el-form-item> + </el-col> + <!-- 浣嶇疆鎻忚堪--> + <el-col :span="12"> + <el-form-item label="浣嶇疆鎻忚堪" prop="positionDescription"> + <el-input v-model="ruleForm.positionDescription"></el-input> + </el-form-item> + </el-col> + </el-row> + <el-row> + <!-- 绠$嚎鍚嶇О--> + <el-col :span="12"> + <el-form-item label="绠$嚎鍚嶇О" prop="lineName" class="search-panel-item"> + <el-input disabled v-model="ruleForm.lineName" placeholder="鑷姩甯﹀嚭涓嶅彲淇敼" + class="report-input"></el-input> + </el-form-item> + </el-col> + <!-- 绠$嚎绫诲瀷--> + <el-col :span="12"> + <el-form-item label="绠$嚎绫诲瀷" prop="lineType"> + <label>{{ ruleForm.lineTypeText }}</label> + </el-form-item> + </el-col> + </el-row> + <!-- 鐐瑰嚮涓婁紶--> + <el-form-item label="闄勪欢涓婁紶" prop="upload"> + <el-upload + class="upload-demo" + action="uploadAction" + multiple + :limit="3" + :file-list="fileList"> + <el-button size="small" type="primary">鐐瑰嚮涓婁紶</el-button> + </el-upload> + </el-form-item> + <!-- 娑堟伅鎺ㄩ��--> + <el-form-item label="娑堟伅鎺ㄩ��" prop="beingPush"> + <el-checkbox-group v-model="ruleForm.beingPushed" @change="infoChange"> + <el-checkbox v-for="item in ruleForm.beingPushList" + :key="item.name" + :label="item.name" + > + </el-checkbox> + </el-checkbox-group> + </el-form-item> + <!-- // 鎻忚堪 鎺ユ敹 灞曠ず銆侀殣钘�--> + <div v-show="wayTo" class="way-to"> + <el-form-item label="浜嬩欢鎻忚堪" prop="desc"> + <el-input type="textarea" resize="none" v-model="ruleForm.desc" + placeholder="甯﹀嚭浜嬩欢绫诲瀷锛屼簨浠朵綅缃紝浜嬩欢鍗曚綅锛屼簨浠舵椂闂寸瓑瀛楁鑷姩鐢熶骇涓�閮ㄥ垎鎻忚堪"> + </el-input> + <el-button type="primary">涓�閿�<br/>鐢熸垚</el-button> + </el-form-item> + <el-form-item label="鎺ユ敹浜哄憳" prop="receiveOne"> + <el-input type="textarea" resize="none" v-model="ruleForm.receiveOne" + placeholder="寮犱笁锛涙潕鍥涳紝"></el-input> + <el-button type="primary">+</el-button> + </el-form-item> + </div> + <el-form-item class="confirmCancel"> + <el-button type="primary" @click="submitForm('ruleForm')">纭</el-button> + <el-button @click="resetForm('ruleForm')">鍙栨秷</el-button> + </el-form-item> + </el-form> + <el-dialog + custom-class="el-dialog--center" + :visible.sync="dialogLocation" + :append-to-body="true" + :modal="false" + v-dialogDrag + > + <ReportLocation @locationClick="getlocaltionClick"></ReportLocation> + </el-dialog> + </div> +</template> +<!-- :rules="rules"--> +<!-- :show-close="false"--> +<script> + +import ReportLocation from './ReportLocation' +import eventBus from '../../../../eventBus' + +export default { + name: 'EventsReported', + components: { + ReportLocation + }, + data () { + return { + // 琛ㄥ崟缁戝畾鏁版嵁 + ruleForm: { + // 浜嬩欢鍚嶇О 缁戝畾鏁版嵁 + nameOfEvent: '', + // 浜嬩欢绫诲瀷 缁戝畾鏁版嵁鍊� + eventOfType: '', + // 浜嬩欢绫诲瀷鍙�夋嫨鏁版嵁radio 缁戝畾鏁版嵁 + eventOfTypeList: [ + { + name: '娴�(姘�)涓婃孩娌规薄鏌�', + value: 1 + }, + { + name: '娌规皵绠¢亾娉勬紡姹℃煋', + value: 2 + }, + { + name: '杈愬皠姹℃煋', + value: 3 + }, + { + name: '鐢熸�佺幆澧冪牬鍧�', + value: 4 + }, + { + name: '鍏朵粬', + value: 5 + } + ], + // 浜嬩欢绛夌骇 + eventOfLevel: '', + // 浜嬩欢绛夌骇鍙�夋嫨鏁版嵁radio 缁戝畾鏁版嵁 + eventOfLevelList: [ + { + name: '鐗瑰埆閲嶅ぇ鐜浜嬩欢', + value: 1 + }, + { + name: '閲嶅ぇ鐜浜嬩欢', + value: 2 + }, + { + name: '杈冨ぇ鐜浜嬩欢', + value: 3 + }, + { + name: '涓�鑸珹绾�', + value: 4 + }, + { + name: '涓�鑸珺绾�', + value: 5 + }, + { + name: '涓�鑸珻绾�', + value: 6 + } + ], + // 浜嬪彂鍗曚綅 缁戝畾鏁版嵁鍊� + unit: '', + unitList: [ + { + label: '鎵瓙', + value: '1' + }, + { + label: '鍗椾含', + value: '2' + } + ], + // 浜嬪彂鏃堕棿 缁戝畾鏁版嵁 + atTime: '', + // 浜嬪彂浣嶇疆 + positionOf: '', + // 浣嶇疆鎻忚堪 + positionDescription: '', + // 绠$嚎鍚嶇О + lineName: '', + // 绠$嚎绫诲瀷 + lineType: '', + lineTypeText: '鑷姩甯﹀嚭涓嶅彲淇敼', + // 娑堟伅鎺ㄩ�� + beingPushed: [], + beingPushList: [ + { + name: '鐭俊鎺ㄩ��', + value: false + }, + { + name: '鎵嬫満搴旂敤鎺ㄩ��', + value: false + } + ], + // 浜嬩欢鎻忚堪 + desc: '', + // 鎺ユ敹浜哄憳 + receiveOne: '' + }, + // 涓婁紶鍒楄〃 + fileList: [], + // 涓婁紶鍦板潃 + uploadAction: '', + // 琛ㄥ崟楠岃瘉 + // rules: { + // // 浜嬩欢鍚嶇О鏍¢獙 + // nameOfEvent: [ + // { + // required: true, + // message: '璇疯緭鍏ユ椿鍔ㄥ悕绉�', + // trigger: 'blur' + // } + // ], + // // 浜嬩欢绫诲瀷鏍¢獙 + // eventOfType: [ + // { + // required: true, + // message: '璇烽�夋嫨浜嬩欢绫诲瀷', + // trigger: 'blur' + // } + // ], + // // 浜嬩欢绛夌骇鏍¢獙 + // eventOfLevel: [ + // { + // required: true, + // message: '璇烽�夋嫨浜嬩欢绛夌骇', + // trigger: 'blur' + // } + // ], + // // 浜嬪彂鍗曚綅 缁戝畾鏁版嵁鍊� + // unit: [ + // { + // required: true, + // message: '璇烽�夋嫨娲诲姩鍖哄煙', + // trigger: 'change' + // } + // ], + // // 浜嬪彂鏃堕棿 + // atTime: [ + // { + // required: true, + // message: '璇烽�夋嫨娲诲姩璧勬簮', + // trigger: 'change' + // } + // ], + // // 浜嬩欢浣嶇疆鏍¢獙 + // positionOf: [ + // { + // required: true, + // message: '璇疯緭鍏ユ椿鍔ㄤ綅缃�', + // trigger: 'blur' + // } + // ], + // // 浣嶇疆鎻忚堪鏍¢獙 + // positionDescription: [ + // { + // required: true, + // message: '璇疯緭鍏ヤ綅缃弿杩�', + // trigger: 'blur' + // } + // ], + // // 绠$嚎鍚嶇О + // lineName: [], + // // 绠$嚎绫诲瀷 + // lineType: [] + // }, + // 鎻忚堪 鎺ユ敹 => 灞曠ず/闅愯棌 + wayTo: false, + // 瀹氫綅浣嶇疆閫夋嫨寮规 + dialogLocation: false + } + }, + mounted () { + eventBus.$on('section-search', (obj) => { + if (obj) { + this.dialogLocation = false + } + }) + }, + methods: { + // 鎺ユ敹瀛愮粍浠朵紶閫掔殑鏁版嵁 + getlocaltionClick (val) { + console.log(val) + this.ruleForm.positionOf = val.latPos + '-' + val.longPos + this.dialogLocation = !this.dialogLocation + }, + // 娑堟伅鎺ㄩ�� 閫夋嫨鎺ㄩ�佺殑瀵硅薄 + infoChange () { + if (this.ruleForm.beingPushed.indexOf('鐭俊鎺ㄩ��') > -1 || this.ruleForm.beingPushed.indexOf('鎵嬫満搴旂敤鎺ㄩ��') > -1) { + this.wayTo = true + } else { + this.wayTo = false + } + }, + // 鐐瑰嚮瀹氫綅 杩涜浣嶇疆閫夋嫨 + locationInfo () { + this.dialogLocation = !this.dialogLocation + }, + // 琛ㄥ崟鐨勭‘璁ゆ寜閽偣鍑讳簨浠� + submitForm (formName) { + this.$refs[formName].validate((valid) => { + if (valid) { + // alert('submit!') + this.$message({ + message: '浜嬩欢涓婃姤鎻愪氦鎴愬姛', + type: 'success' + }) + } else { + this.$message('浜嬩欢涓婃姤鎻愪氦澶辫触') + return false + } + }) + this.$refs[formName].resetFields() + }, + // form琛ㄥ崟鐨勫彇娑堟寜閽偣鍑讳簨浠� 閲嶇疆淇℃伅 + resetForm (formName) { + this.$refs[formName].resetFields() + } + } +} +</script> + +<style lang="less" scoped> + + /*/deep/ .el-dialog .el-dialog--center {*/ + /* margin-top: 1rem !important;*/ + /* margin-left: 6.4rem !important;*/ + /*}*/ + + /deep/ .el-dialog--center { + left: 5rem; + top: 1rem; + margin-top: 2rem; + margin-left: 2rem; + } + + /deep/ .el-dialog { + width: 3.087834rem; + } + + .event-report { + margin: 0 5px !important; + } + + .way-to { + /deep/ .el-form-item__content { + display: flex; + } + } + + /deep/ .el-form-item { + margin: 2px 0 !important; + color: #00fff6 !important; + } + + /deep/ .el-textarea__inner { + height: 0.28rem !important; + max-height: 0.45rem !important; + width: 2rem; + color: darkgrey; + border: solid 1px #00fff6; + background-color: rgba(0, 255, 246, 0.14); + outline: none; + font-size: 0.01rem; + } + + /deep/ .el-checkbox__label { + color: #00fff6 !important; + } + + /deep/ .el-icon-time:before { + content: " "; + } + + /deep/ input { + border-radius: 0; + background-color: rgba(0, 255, 246, 0.14); + border: solid 1px #00fff6; + color: #C0C4CC; + font-size: 0.01rem; + } + + /deep/ .el-input.is-disabled .el-input__inner { + color: #C0C4CC; + font-size: 0.01rem; + border-radius: 4px; + background: @background-color; + border-color: @color; + } + + /deep/ .el-input__inner { + height: 0.2rem !important; + border-radius: 5px; + background: rgba(0, 16, 30, 0.5); + } + + /deep/ .el-form-item__label { + color: @color; + } + + /deep/ .el-radio__label { + color: @color; + } + + .confirmCancel { + text-align: right; + margin: 0.071234rem !important; + } +</style> diff --git a/src/components/base-page/enterprise-emergency/ReportFile.vue b/src/components/base-page/enterprise-emergency/events-reported/ReportFile.vue similarity index 89% rename from src/components/base-page/enterprise-emergency/ReportFile.vue rename to src/components/base-page/enterprise-emergency/events-reported/ReportFile.vue index efa0e23..3c8e317 100644 --- a/src/components/base-page/enterprise-emergency/ReportFile.vue +++ b/src/components/base-page/enterprise-emergency/events-reported/ReportFile.vue @@ -6,7 +6,7 @@ <el-form-item label="绠$嚎鍚嶇О"> <el-input v-model="form.pipeName"> <el-button style="padding-right:10px;" slot="suffix" type="text"> - <img src="../../../../public/assets/images/map/emergency/search.png" alt=""> + <img src="../../../../../public/assets/images/map/emergency/search.png" alt=""> </el-button> </el-input> </el-form-item> @@ -15,7 +15,7 @@ <el-form-item label="绠℃缂栫爜"> <el-input v-model="form.pipeCode"> <el-button style="padding-right:10px;" slot="suffix" type="text"> - <img src="../../../../public/assets/images/map/emergency/search.png" alt=""> + <img src="../../../../../public/assets/images/map/emergency/search.png" alt=""> </el-button> </el-input> </el-form-item> @@ -41,9 +41,9 @@ </template> <script> -import eventBus from '../../../eventBus' -import foldPng from '../../../../public/assets/images/map/emergency/fold.png' -import filePng from '../../../../public/assets/images/map/emergency/file.png' +import eventBus from '../../../../eventBus' +import foldPng from '../../../../../public/assets/images/map/emergency/fold.png' +import filePng from '../../../../../public/assets/images/map/emergency/file.png' export default { name: 'ReportFile', diff --git a/src/components/base-page/enterprise-emergency/events-reported/ReportLocation.vue b/src/components/base-page/enterprise-emergency/events-reported/ReportLocation.vue new file mode 100644 index 0000000..bfb60e1 --- /dev/null +++ b/src/components/base-page/enterprise-emergency/events-reported/ReportLocation.vue @@ -0,0 +1,152 @@ +<template> + <div class="report-location-box"> + <div class="report-location"> + <el-tabs v-model="activeName"> + <el-tab-pane label="鐐瑰嚮瀹氫綅" name="first"> + <div class="click-location"> + <el-row> + <el-input type="text" v-model="clickLocation" clearable @focus="focusLocation"></el-input> + </el-row> + <el-row> + <el-button type="primary" @click="confirm">纭</el-button> + </el-row> + </div> + </el-tab-pane> + <el-tab-pane label="绠℃瀹氫綅" name="second"> + <ReportLocationSection></ReportLocationSection> + </el-tab-pane> + <el-tab-pane label="缁忕含搴﹀畾浣�" name="third"> + <el-row class="place-box"> + <div class="place-left"> + <el-form :model="LongLatPos" label-width="90px"> + <el-form-item label="缁忓害:"> + <el-input v-model="LongLatPos.longPos"></el-input> + </el-form-item> + <el-form-item label="绾害:"> + <el-input v-model="LongLatPos.latPos"></el-input> + </el-form-item> + </el-form> + </div> + <div class="place-right"> + <el-button type="primary" @click="mapPoints">瀹氫綅</el-button> + </div> + </el-row> + <div class="place-bottom" style="text-align: center;margin: 10px"> + <el-button type="primary" @click="confirm">纭</el-button> + </div> + </el-tab-pane> + </el-tabs> + </div> + </div> +</template> + +<script> +// import eventBus from '../../../../eventBus' +// 绠℃瀹氫綅缁勪欢 +import ReportLocationSection from './ReportLocationSection' + +export default { + name: 'ReportLocation', + components: { + ReportLocationSection + }, + data () { + return { + // active tab鍒囨崲 + activeName: 'first', + // 鐐瑰嚮瀹氫綅缁戝畾鏁版嵁 + clickLocation: '', + // 缁忕含搴﹀畾浣� + LongLatPos: { + longPos: '', + latPos: '' + } + } + }, + // mounted () { + // // 鎺ユ敹瑙勫畾 姣忔閲嶆柊閫夋嫨瀹氫綅 閮芥寚瀹� 閫夋嫨绗竴涓紑濮� + // eventBus.$on('tab-change', (obj) => { + // this.activeName = obj + // }) + // }, + methods: { + // 鍦板浘涓婄偣鍑� + selectPipeLine () { + window.map.on('click', this.selectClick) + // window.mapManager.clickDialogSwitch = false + }, + // 鍦板浘涓婄偣鍑诲洖璋� + selectClick (e) { + window.map.off('click', this.selectClick) + // const point = [e.latlng.lng, e.latlng.lat] + const pointX = e.latlng.lng + const pointY = e.latlng.lat + this.clickLocation = '\'' + pointX + '\'' + pointY + '' + this.mapPointResult(e) + }, + mapPointResult (e) { + console.log(e) + this.LongLatPos.longPos = e.latlng.lng + this.LongLatPos.latPos = e.latlng.lat + }, + // 鑾峰緱鐒︾偣 杩涜瀹氫綅 + focusLocation () { + this.selectPipeLine() + }, + // 缁忕含搴﹀畾浣� + mapPoints () { + this.selectPipeLine() + }, + // 鐐瑰嚮纭鎸夐挳浜嬩欢 + confirm () { + // 閫氳繃瀛愮粍浠跺悜鐖剁粍浠朵紶閫掓暟鎹� + this.$emit('locationClick', this.LongLatPos) + this.clickLocation = '' + this.LongLatPos.longPos = '' + this.LongLatPos.latPos = '' + } + } +} +</script> + +<style lang="less" scoped> + .place-box { + display: flex; + align-items: center; + justify-content: space-around; + } + .click-location { + margin: 0 auto; + text-align: center; + + .el-input { + width: 80%; + margin: 15px auto; + } + + .el-button { + margin: 15px auto; + } + } + .place { + text-align: center; + + .place-top { + display: flex; + align-items: center; + justify-content: space-around; + + .place-right { + .el-button { + margin: 15px; + } + } + } + + .place-bottom { + .el-button { + /*margin: 15px;*/ + } + } + } +</style> diff --git a/src/components/base-page/enterprise-emergency/events-reported/ReportLocationSection.vue b/src/components/base-page/enterprise-emergency/events-reported/ReportLocationSection.vue new file mode 100644 index 0000000..f899d47 --- /dev/null +++ b/src/components/base-page/enterprise-emergency/events-reported/ReportLocationSection.vue @@ -0,0 +1,353 @@ +<template> + <div class="ReportLocationSection"> + <el-form :model="form" label-width="90px"> + <el-row class="pipe-line-search"> + <el-col :span="12"> + <el-form-item label="绠$嚎鍚嶇О:"> + <el-input v-model="form.pipeName"> + <el-button style="padding-right:10px;" slot="suffix" type="text" @click="pipelineSearch"> + <img src="../../../../../public/assets/images/map/emergency/search.png" alt=""> + </el-button> + </el-input> + </el-form-item> + </el-col> + <el-col :span="8"> + <el-button type="primary" size="small" icon="el-icon-search" @click="pipeClickLocation">瀹氫綅</el-button> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="绠℃缂栫爜:"> + <el-input v-model="form.sectionName" disabled></el-input> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="闄勫睘璁炬柦:"> + <el-input v-model="form.affiliatedFacilities" disabled></el-input> + </el-form-item> + </el-col> + </el-row> + </el-form> + <div class="pipe-table" v-show="this.tableList.length>=1"> + <el-card> + <span class="fixed-style">绠$嚎鍚嶇О</span> + <el-table + :data="tableList" + border + height="240" + max-height="280" + @row-click="sectionShowClick" + style="width: 100%"> + <el-table-column + label="搴忓彿" + type="index" + > + </el-table-column> + <el-table-column + show-overflow-tooltip + prop="properties.pipename" + label="绠$嚎鍚嶇О"> + </el-table-column> + <el-table-column + show-overflow-tooltip + prop="properties.mediumtype" + label="绠$嚎绫诲瀷"> + </el-table-column> + <el-table-column width="40" fixed="right" label="鎿嶄綔"> + <template slot-scope="scope"> + <el-button @click="localAdr(scope.row)" type="text" size="small">瀹氫綅</el-button> + </template> + </el-table-column> + </el-table> + </el-card> + <el-card> + <span class="fixed-style">绠℃鍒楄〃</span> + <el-table + :data="tableListSection" + border + @row-click="sectionCode" + height="100" + max-height="120" + style="width: 100%"> + <el-table-column + show-overflow-tooltip + prop="properties.pipesegcode" + label="绠℃缂栫爜"> + </el-table-column> + <el-table-column + show-overflow-tooltip + prop="properties.startpointnumber" + label="璧风偣鎺㈡煡鍙�"> + </el-table-column> + <el-table-column + show-overflow-tooltip + prop="properties.endpointnumber" + label="缁堢偣鎺㈡煡鍙�"> + </el-table-column> + <el-table-column + show-overflow-tooltip + prop="properties.material" + label="鏉愯川"> + </el-table-column> + <el-table-column + show-overflow-tooltip + prop="properties.embeddingmode" + label="鍩嬭鏂瑰紡"> + </el-table-column> + <el-table-column width="40" fixed="right" label="鎿嶄綔"> + <template slot-scope="scope"> + <el-button @click="localAdr(scope.row)" type="text" size="small">瀹氫綅</el-button> + </template> + </el-table-column> + </el-table> + <span class="fixed-style">闄勫睘璁炬柦鍒楄〃</span> + <el-table + :data="tableDataAffFac" + border + @row-click="affFacName" + height="100" + max-height="120" + style="width: 120%"> + <el-table-column + show-overflow-tooltip + prop="properties.name" + label="闄勫睘璁炬柦鍚嶇О"> + </el-table-column> + <el-table-column + show-overflow-tooltip + prop="properties.type" + label="闄勫睘璁炬柦绫诲瀷"> + </el-table-column> + <el-table-column width="40" fixed="right" label="鎿嶄綔"> + <template slot-scope="scope"> + <el-button @click="localAdr(scope.row)" type="text" size="small">瀹氫綅</el-button> + </template> + </el-table-column> + </el-table> + </el-card> + </div> + <el-row style="text-align: center;margin: 10px"> + <el-button type="primary" @click="confirm">纭</el-button> + </el-row> + </div> +</template> + +<script> +import WfsHelper from '@components/helpers/WfsHelper' +import AjaxUtils from '@utils/AjaxUtils' +// import { pulseEffect } from '../../../../utils/utils' +// import mapApi from '../../../../api/mapApi' + +import { fitBounds, highlight } from '../../../../components/helpers/LocateHelper' +import eventBus from '../../../../eventBus' +// import MapManager from '../../../helpers/MapManager' + +export default { + name: 'ReportLocationSection', + data () { + return { + form: { + pipeName: '', + sectionName: '', + affiliatedFacilities: '' + }, + // 绠$嚎鏌ヨ鏁版嵁鍒楄〃 + tableList: [], + // 绠℃鏌ヨ鏁版嵁鍒楄〃 + tableListSection: [], + // 闄勫睘璁炬柦鏌ヨ鍒楄〃鏁版嵁 + tableDataAffFac: [], + // 鍒嗛〉鍔熻兘 + pageSize: 3, + total: 0, + currentPage: 1 + } + }, + mounted () { + this.wfsHelper = new WfsHelper() + }, + methods: { + // 鐐瑰嚮绠$嚎鍒楄〃 灞曠ず绠℃鍐呭 + async sectionShowClick (val) { + console.log(val) + // 绠℃鏌ヨ + const sectionNameSearch = val.properties.pipename + this.tableListSection = [] + this.wfsHelper.clearFilter() + this.wfsHelper.setTypeName(['sewer:pipesegment']) + this.wfsHelper.addLike('pipename', sectionNameSearch) + this.wfsHelper.addEquals('pipename', '\'' + sectionNameSearch + '\'') + const res = await AjaxUtils.GetDataAsynByUrl(this.wfsHelper.getUrl(), {}) + // console.log(res) + if (res instanceof Object && Object.prototype.hasOwnProperty.call(res, 'features')) { + this.tableListSection = res.features + } + this.wfsHelper = new WfsHelper() + // 闄勫睘璁炬柦鏌ヨ + this.tableDataAffFac = [] + const AffFacSearch = val.properties.pipename + this.wfsHelper.clearFilter() + this.wfsHelper.setTypeName(['sewer:view_pipeline']) + this.wfsHelper.addLike('name', AffFacSearch) + this.wfsHelper.addEquals('name', '\'' + AffFacSearch + '\'') + const resAffFac = await AjaxUtils.GetDataAsynByUrl(this.wfsHelper.getUrl(), {}) + console.log(resAffFac) + if (resAffFac instanceof Object && Object.prototype.hasOwnProperty.call(resAffFac, 'features')) { + this.tableDataAffFac = resAffFac.features + } + this.wfsHelper = new WfsHelper() + }, + // 鐐瑰嚮绠℃鍒楄〃 绠℃缂栫爜浼犻�� + sectionCode (val) { + console.log(val) + this.form.sectionName = val.properties.pipecode + }, + // 鐐瑰嚮闄勫睘璁炬柦鍒楄〃 绠℃缂栫爜浼犻�� + affFacName (val) { + console.log(val) + this.form.affiliatedFacilities = val.properties.name + }, + // 瀹氫綅鍔熻兘 + localAdr (val) { + fitBounds(val) + highlight(val) + }, + // 绠$嚎鐐瑰嚮鐐瑰嚮瀹氫綅鍔熻兘 + pipeClickLocation () { + // console.log('val') + // this.selectPipeLine() + window.mapManager.clickDialogSwitch = false + this.tableList = [] + window.map.on('click', (e) => { + window.mapManager.loadWfsDatas(e.latlng).then((res) => { + // console.log(res) + for (let i = 0; i < res.features.length; i++) { + // console.log(res.features[i].properties) + this.tableList.push(res.features[i]) + } + // console.log(this.tableList) + }) + }) + }, + // 绠$嚎鎼滅储 + async pipelineSearch () { + // this.pipeTable = !this.pipeTable + this.tableList = [] + this.wfsHelper.clearFilter() + this.wfsHelper.setTypeName(['sewer:pipeline']) + if (this.form.pipeName) { + this.wfsHelper.addLike('name', this.form.pipeName) + } + // this.wfsHelper.addEquals('type', '\'' + this.form.pipeName + '\'') + const res = await AjaxUtils.GetDataAsynByUrl(this.wfsHelper.getUrl(), {}) + console.log(res) + if (res instanceof Object && Object.prototype.hasOwnProperty.call(res, 'features')) { + this.total = res.totalFeatures + // console.log(res.features) + this.tableList = res.features + } + this.wfsHelper = new WfsHelper() + }, + // 鍒嗛〉鍔熻兘 currentPage 鏀瑰彉鏃朵細瑙﹀彂 + handlePage (val) { + // console.log(val) + this.currentPage = val + }, + // 鍒嗛〉鍔熻兘 pageSize 鏀瑰彉鏃朵細瑙﹀彂 + handleSizeChange (val) { + // console.log(val) + this.pageSize = val + }, + // 鐐瑰嚮纭 + confirm () { + console.log('鐐瑰嚮纭畾閫夋嫨瀹屾垚') + eventBus.$emit('section-search', true) + } + } +} +</script> + +<style lang="less" scoped> + /*/deep/ .el-input {*/ + /* width: 0.74353rem;*/ + /*}*/ + + .pipe-line-search { + display: flex; + align-items: center; + + .el-button { + margin: 0 15px; + } + } + + .pipe-table { + display: flex; + align-items: center; + justify-content: space-around; + + /deep/ .el-card { + width: 1.39523rem; + max-width: 1.39523rem; + height: 1.9343rem; + max-height: 1.9343rem; + + .el-table { + margin: 0.07345rem auto; + } + } + } + + .fixed-style { + color: @color; + } + + /deep/ + .warnPagination { + .btn-quicknext, .btn-quickprev { + color: #e4e8f1 !important; + background-color: transparent; + // border: 1px solid #25AECD; + border-left: 1px solid #25AECD; + border-bottom: 1px solid #25AECD; + border-top: 1px solid #25AECD; + color: #e4e8f1; + } + + .el-pager li { + color: #e4e8f1; + background: transparent; + // border: 1px solid #25AECD; + border-left: 1px solid #25AECD; + border-bottom: 1px solid #25AECD; + border-top: 1px solid #25AECD; + } + + .el-pager li.active { + border-color: #25AECD; + background-color: rgba(38, 222, 253, 0.3); + color: #e4e8f1; + } + + .el-pager li:hover { + border-color: #25AECD; + background-color: rgba(38, 222, 253, 0.3); + color: #34e0ff; + } + + .btn-prev { + background-color: transparent; + // border: 1px solid #25AECD; + border-left: 1px solid #25AECD; + border-bottom: 1px solid #25AECD; + border-top: 1px solid #25AECD; + color: #e4e8f1; + } + + .btn-next { + background-color: transparent; + border: 1px solid #25AECD; + color: #e4e8f1; + } + } +</style> diff --git a/src/components/panel/topicSearch/SewersSearch.vue b/src/components/panel/topicSearch/SewersSearch.vue index 7eedeb7..dfa3a7c 100644 --- a/src/components/panel/topicSearch/SewersSearch.vue +++ b/src/components/panel/topicSearch/SewersSearch.vue @@ -193,6 +193,7 @@ // } // const _this = this const res = await AjaxUtils.GetDataAsynByUrl(this.wfsHelper.getUrl(), {}) + console.log(res) if (res instanceof Object && Object.prototype.hasOwnProperty.call(res, 'features')) { this.total = res.totalFeatures this.list = res.features diff --git a/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue b/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue index c84fcda..77b0263 100644 --- a/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue +++ b/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue @@ -1,49 +1,47 @@ <template> <div class="search-panel"> <el-form ref="form" :model="form" label-width="90px" class="search-form"> - <el-form ref="form" :model="form" label-width="90px" class="search-form"> - <el-form-item label="浼佷笟鍚嶇О锛�" size="mini" class="search-panel-item"> - <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType" - :popper-class="'select-down'"> - <el-option - v-for="item in items" - :key="item.code" - :label="item.name" - :value="item.name"> - </el-option> - </el-select> - </el-form-item> - <el-form-item label="浜嬩欢鐘舵�侊細" size="mini"> - <el-select style="width: 100%" v-model="form.dataType" value-key="code" - :popper-class="'select-down'" @change="handleDataType"> - <el-option - v-for="item in subItems" - :key="item.code" - :label="item.name" - :value="item"> - </el-option> - </el-select> - </el-form-item> - <el-form-item label="浜嬩欢绫诲瀷锛�"> - <el-radio-group v-model="form.transferData" class="levelOfRisk"> - <el-radio v-for="(item,index) in form.levelOfRisk" :label="item.value" :key="index" - @change="redioChange(item.name)"> - <span class="levelOfRisk-type">{{ item.name }}</span> - </el-radio> - </el-radio-group> - </el-form-item> - <el-button type="primary" small @click="dialogVisibleChange">浜嬩欢涓婃姤</el-button> - <div class="page_total"> - <p>鍏辫 - <span>{{total}}</span> - 鏉¤褰� - </p> - </div> - <div class="rightButtonSearch"> - <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input> - <el-button class="el-icon-search" @click="handleSearch"></el-button> - </div> - </el-form> + <el-form-item label="浼佷笟鍚嶇О锛�" size="mini" class="search-panel-item"> + <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType" + :popper-class="'select-down'"> + <el-option + v-for="item in items" + :key="item.code" + :label="item.name" + :value="item.name"> + </el-option> + </el-select> + </el-form-item> + <el-form-item label="浜嬩欢鐘舵�侊細" size="mini"> + <el-select style="width: 100%" v-model="form.dataType" value-key="code" + :popper-class="'select-down'" @change="handleDataType"> + <el-option + v-for="item in subItems" + :key="item.code" + :label="item.name" + :value="item"> + </el-option> + </el-select> + </el-form-item> + <el-form-item label="浜嬩欢绫诲瀷锛�"> + <el-radio-group v-model="form.transferData" class="levelOfRisk"> + <el-radio v-for="(item,index) in form.levelOfRisk" :label="item.value" :key="index" + @change="redioChange(item.name)"> + <span class="levelOfRisk-type">{{ item.name }}</span> + </el-radio> + </el-radio-group> + </el-form-item> + <el-button type="primary" small @click="dialogVisibleChange">浜嬩欢涓婃姤</el-button> + <div class="page_total"> + <p>鍏辫 + <span>{{total}}</span> + 鏉¤褰� + </p> + </div> + <div class="rightButtonSearch"> + <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input> + <el-button class="el-icon-search" @click="handleSearch"></el-button> + </div> </el-form> <el-scrollbar style="height:286.22px"> <!-- <div class="environmental-risk-list" v-for="(item,index) in list" :key="index" :class="activeNum===index?'hover':''" @click="accordPopup(item)">--> @@ -92,19 +90,16 @@ </el-scrollbar> <div class="event-report"> <el-dialog - custom-class="el-dialog--center" + custom-class="event-report-dialog" title="浜嬩欢涓婃姤" :visible.sync="dialogVisible" :append-to-body="true" :modal="false" - v-dialogDragBottom + v-dialogDrag > <EventsReported></EventsReported> </el-dialog> </div> -<!-- <Dialog ref="EReported" title="浜嬩欢涓婃姤2">--> -<!-- <EventsReported></EventsReported>--> -<!-- </Dialog>--> </div> </template> @@ -116,14 +111,11 @@ import DisposalEvent from '../../../base-page/enterprise-emergency/DisposalEvent' import EventHandling from '@components/base-page/enterprise-emergency/event-handling/EventHandling' import eventBus from '../../../../eventBus' -import EventsReported from '../../../../components/base-page/enterprise-emergency/EventsReported' - -// import Dialog from '../../../../views/popup/Dialog' +import EventsReported from '../../../base-page/enterprise-emergency/events-reported/EventsReported' export default { name: 'EventQuery', components: { - // Dialog, EventsReported }, data () { @@ -228,18 +220,20 @@ </script> <style lang="less" scoped> + /*/deep/ .event-report-dialog {*/ + /* left: 3rem;*/ + /* top: 1rem;*/ + /*}*/ /*.event-report {*/ - /deep/ .el-dialog--center { - /*left: 2rem !important;*/ - margin-left: 2rem !important; - margin-top: 0.73979rem !important; - /*bottom: 0 !important;*/ - } - //} - /*.event-report {*/ - /deep/ .el-dialog { - /*width: 30%;*/ - width: 550px; + /deep/ .el-dialog { + width: 3.343545rem; } /*}*/ + + /deep/ .event-report-dialog { + left: 3rem; + top: 1rem; + margin-top: 2rem; + margin-left: 2rem; + } </style> diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue index d5d363d..cfd9a1c 100644 --- a/src/views/MapTemplate.vue +++ b/src/views/MapTemplate.vue @@ -44,7 +44,7 @@ import Emergency from '@components/emergency/index' import MapManager from '../components/helpers/MapManager' import Message from '@components/message/index' -import EventsReported from '../components/base-page/enterprise-emergency/EventsReported' +import EventsReported from '../components/base-page/enterprise-emergency/events-reported/EventsReported' export default { name: 'MapTemplate', -- Gitblit v1.8.0