From 08271621c9a7096cc29a3cfeeb67b772b13a4dfd Mon Sep 17 00:00:00 2001
From: 陈泽平 <chenzeping>
Date: 星期三, 26 五月 2021 21:27:42 +0800
Subject: [PATCH] 事件上报页面修改

---
 src/components/base-page/enterprise-emergency/EventsReported.vue |  506 ++++++++++++++++++++++++++-----------------------------
 1 files changed, 242 insertions(+), 264 deletions(-)

diff --git a/src/components/base-page/enterprise-emergency/EventsReported.vue b/src/components/base-page/enterprise-emergency/EventsReported.vue
index 66beb36..fcc52d7 100644
--- a/src/components/base-page/enterprise-emergency/EventsReported.vue
+++ b/src/components/base-page/enterprise-emergency/EventsReported.vue
@@ -1,157 +1,161 @@
 <template>
-    <!--    <div class="event-report">-->
-<!--    <el-dialog-->
-<!--            custom-class="event-report-dialog"-->
-<!--            title="浜嬩欢涓婃姤"-->
-<!--            :visible.sync="dialogVisible"-->
-<!--            :append-to-body="true"-->
-<!--            :modal="false"-->
-<!--            v-dialogDragBottom-->
-<!--    >-->
-        <el-form :model="ruleForm" :rules="rules" 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>
+    <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-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 :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-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">
-                            <!--                            <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-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-col>
-                <!--                浣嶇疆鎻忚堪-->
-                <el-col :span="12">
-                    <el-form-item label="浣嶇疆鎻忚堪" prop="positionDescription">
-                        <el-input v-model="ruleForm.positionDescription"></el-input>
+                    <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>
-                </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>
+                </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-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>-->
-    <!--    </div>-->
+            </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 eventBus from '../../../eventBus'
+
+import ReportLocation from '../../../components/base-page/enterprise-emergency/ReportLocation'
 
 export default {
   name: 'EventsReported',
+  components: {
+    ReportLocation
+  },
   data () {
     return {
-      // 鍒ゆ柇寮规鏄惁鑳藉睍绀� temp=>涓存椂true 寮�鍙�
-      dialogVisible: false,
       // 琛ㄥ崟缁戝畾鏁版嵁
       ruleForm: {
         // 浜嬩欢鍚嶇О 缁戝畾鏁版嵁
@@ -255,75 +259,81 @@
       // 涓婁紶鍦板潃
       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: []
-      },
+      // 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,
-      // 鎺у埗鏄剧ず瀹氫綅浜岀骇椤甸潰灞曠ず/闅愯棌
-      location: 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) {
@@ -334,17 +344,7 @@
     },
     // 鐐瑰嚮瀹氫綅 杩涜浣嶇疆閫夋嫨
     locationInfo () {
-      // 鐖剁粍浠� 浼犻�掓暟鎹帶鍒朵簩绾ч檮灞炴鐨勬樉绀洪殣钘�
-      this.location = !this.location
-      // 浼犻�� 鏁版嵁 鎺у埗 涓夌骇闄勫睘妗嗙殑闅愯棌
-      eventBus.$emit('pipelineFile-choose', false)
-      // 閫氳繃 bus 鎺у埗tab 鏍� 鏄剧ず 鍝竴涓� 浼犻�掓暟鎹瀹� 姣忔閲嶆柊閫夋嫨瀹氫綅 閮芥寚瀹� 閫夋嫨绗竴涓紑濮�
-      eventBus.$emit('tab-change', 'first')
-    },
-    // 鎺ユ敹瀛愮粍浠� 浼犻�� 鏁版嵁 杩涜 浜岀骇 闄勫睘妗嗙殑鏄剧ず/闅愯棌
-    getLocalCation (value) {
-      // console.log(value)
-      this.location = value
+      this.dialogLocation = !this.dialogLocation
     },
     // 琛ㄥ崟鐨勭‘璁ゆ寜閽偣鍑讳簨浠�
     submitForm (formName) {
@@ -360,17 +360,11 @@
           return false
         }
       })
-      this.circlePopup()
       this.$refs[formName].resetFields()
-    },
-    // 鐐瑰嚮鍏抽棴 浜嬩欢涓婃姤
-    circlePopup () {
-      this.eventsReported = false
     },
     // form琛ㄥ崟鐨勫彇娑堟寜閽偣鍑讳簨浠� 閲嶇疆淇℃伅
     resetForm (formName) {
       this.$refs[formName].resetFields()
-      this.circlePopup()
     }
   }
 }
@@ -378,61 +372,47 @@
 
 <style lang="less" scoped>
 
-    .event-report-dialog {
-
+    .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: 30%;
+        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;
-        }
-    }
-
-    /deep/ .form-popup {
-        margin: 0 15px;
-    }
-
-    .report-incident {
-        position: absolute;
-        top: 0.42979rem;
-        left: 3.14583rem;
-        z-index: 999;
-        display: flex;
-
-        .report-box {
-            min-width: 3.4674324rem;
-            max-width: 3.4674324rem;
-
-            .public-bounced-title {
-                display: flex;
-                align-items: center;
-                justify-content: space-between;
-
-                span {
-                    color: #f4f7ff;
-                    margin: 0 15px;
-                    font-size: 14px;
-                }
-
-                i {
-                    color: #C0C4CC;
-                    margin: 0 15px;
-                    font-size: 22px;
-                    cursor: pointer;
-                }
-            }
+            /*.el-button {*/
+            /*    margin-right: 30px;*/
+            /*}*/
         }
     }
 
     /deep/ .el-form-item {
-        margin: 10px 0;
+        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;
@@ -450,7 +430,6 @@
     }
 
     /deep/ input {
-        /*width: 145px;*/
         border-radius: 0;
         background-color: rgba(0, 255, 246, 0.14);
         border: solid 1px #00fff6;
@@ -468,6 +447,7 @@
 
     /deep/ .el-input__inner {
         /*width: 145px;*/
+        height: 0.2rem !important;
         border-radius: 5px;
         background: rgba(0, 16, 30, 0.5);
     }
@@ -482,8 +462,6 @@
 
     .confirmCancel {
         text-align: right;
-        margin: 15px;
-        /*display: flex;*/
-        /*justify-content: flex-end;*/
+        margin: 0.071234rem !important;
     }
 </style>

--
Gitblit v1.8.0