From 4462b1bf81d82cf690b16aad2cc0955a7c6e0b01 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Tue, 09 Jan 2024 17:27:14 +0800 Subject: [PATCH] fix:地图 --- src/views/toCarryOutLegislativeReforms/components/locationMap.vue | 125 +++- src/main.js | 3 src/views/toCarryOutLegislativeReforms/reform/index.vue | 460 ++++++++++++++---- src/views/toCarryOutLegislativeReforms/components/newWorkOrder.vue | 325 +++++++++++-- src/App.vue | 1 src/views/toCarryOutLegislativeReforms/components/workOrderInformation.vue | 485 ++++++++++++++++--- 6 files changed, 1,107 insertions(+), 292 deletions(-) diff --git a/src/App.vue b/src/App.vue index 3336e60..fe89222 100644 --- a/src/App.vue +++ b/src/App.vue @@ -22,4 +22,5 @@ #app { height: 100%; } +.amap-sug-result { z-index: 99999 !important; } </style> diff --git a/src/main.js b/src/main.js index d4f3b30..2e04d03 100644 --- a/src/main.js +++ b/src/main.js @@ -58,7 +58,8 @@ 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor', - 'AMap.DistrictSearch' + 'AMap.DistrictSearch', + 'AMap.Geolocation' ], // ������������ sdk ��������� 1.4.4 v: '1.4.4' diff --git a/src/views/toCarryOutLegislativeReforms/components/locationMap.vue b/src/views/toCarryOutLegislativeReforms/components/locationMap.vue index 847753a..fdda51b 100644 --- a/src/views/toCarryOutLegislativeReforms/components/locationMap.vue +++ b/src/views/toCarryOutLegislativeReforms/components/locationMap.vue @@ -7,25 +7,25 @@ width="1000px" center :before-close="close" + @closed="close" > - <div class="searchBox"> - <el-input - v-model="placeSearch" - placeholder="���������������" - class="input-with-select" - > - <el-button - slot="append" - icon="el-icon-search" - @click="search" - /> - </el-input> - </div> - <div id="panel" /> <div v-if="visible" class="mapBox" > + <div + class="searchBox" + > + <el-input + id="tipinput" + v-model="placeSearchName" + :disabled="$parent.mapType!=='edit'" + prefix-icon="el-icon-search" + placeholder="���������������" + class="input-with-select" + @keyup.enter.native="searchPlace" + /> + </div> <div id="mapd" /> </div> </el-dialog> @@ -41,7 +41,11 @@ return { title: '������������', map: null, - placeSearch: null + geolocation: null, + marker: null, + placeSearchName: null, + mapPlaceSearch: null, + position: [] } }, mounted () { @@ -61,37 +65,71 @@ resizeEnable: true, zooms: [3, 18], zoom: 15, - center: [120.9781494, 31.4265156] }) this.map = map - - const lnglat = new AMap.LngLat('120.9781494', '31.4265156') - const marker = new AMap.Marker({ - position: lnglat - }) - - // ������������������������������������������������������ - marker.setAnimation('AMAP_ANIMATION_BOUNCE') - marker.setMap(this.map) - AMap.service(['AMap.PlaceSearch'], function () { - // ��������������������� - var placeSearch = new AMap.PlaceSearch({ - pageSize: 5, // ������������������������ - pageIndex: 1, // ������ - city: '010', // ��������������� - citylimit: true, // ��������������������������������������������� - map: map, // ��������������������������� - panel: 'panel', // ��������������������������������������������� - autoFitView: true // ������������������������������������������ Marker��������������������������������� + let that = this + AMap.plugin(['AMap.Autocomplete', 'AMap.PlaceSearch'], function () { + // ���������Autocomplete + let autoOptions = { + // city ��������������������������� + city: '������', + input: 'tipinput', + } + that.mapPlaceSearch = new AMap.PlaceSearch({ + map: map, }) - // ��������������� - placeSearch.search('������������') + // that.geolocation = new AMap.Geolocation({}) + let autoComplete = new AMap.Autocomplete(autoOptions) + AMap.event.addListener(autoComplete, 'select', function (e) { + that.map.clearMap() + that.mapPlaceSearch.search(e.poi.name) + }) + AMap.event.addListener(that.mapPlaceSearch, 'markerClick', function (e) { + that.position = [e.data.location.lng, e.data.location.lat] + this.placeSearchName = e.data.cityname + e.data.adname + e.data.address + console.log(e) + console.log(this.placeSearchName) + document.getElementById('tipinput').value = e.data.name + }) + }) + if (this.$parent.mapType === 'edit') { + map.on('click', function (ev) { + that.map.clearMap() + that.position = [ev.lnglat.lng, ev.lnglat.lat] + that.marker = new AMap.Marker({ + position: that.position, + offset: new AMap.Pixel(-13, -30) + }) + that.marker.setMap(map) + that.getAddress(that.position) + }) + } else { + this.map.clearMap() + let marker = new AMap.Marker({ + map: map, + position: this.$parent.position + }) + marker.setMap(map) + marker.setAnimation('AMAP_ANIMATION_BOUNCE') + this.placeSearchName = this.$parent.address + } + }, + getAddress (position) { + AMap.plugin('AMap.Geocoder', () => { + const geocoder = new AMap.Geocoder({}) + geocoder.getAddress(position, (status, result) => { + if (status === 'complete' && result.info === 'OK') { + this.placeSearchName = result.regeocode.formattedAddress + } + }) }) }, - search () { - let this_ = this + searchPlace () { + this.mapPlaceSearch.search(this.placeSearchName) }, close () { + this.map.destroy() + this.$emit('addressAndLnt', this.position, this.placeSearchName) this.$emit('update:visible', false) } } @@ -101,13 +139,16 @@ <style scoped lang="scss"> /deep/.el-dialog__body { height: 600px; - .searchBox { - margin-bottom: 10px; - } .mapBox { width: 100%; height: 100%; padding-bottom: 30px; + position: relative; + .searchBox{ + position: absolute; + z-index: 100; + width: 100%; + } } } #mapd { diff --git a/src/views/toCarryOutLegislativeReforms/components/newWorkOrder.vue b/src/views/toCarryOutLegislativeReforms/components/newWorkOrder.vue index 8781c41..7430bde 100644 --- a/src/views/toCarryOutLegislativeReforms/components/newWorkOrder.vue +++ b/src/views/toCarryOutLegislativeReforms/components/newWorkOrder.vue @@ -1,120 +1,322 @@ <template> <div> - <el-dialog :title="title" :visible.sync="visible" top="30px" width="900px" center :before-close="close"> - <div slot="title" class="titBox"> + <el-dialog + :title="title" + :visible.sync="visible" + top="30px" + width="900px" + center + :before-close="close" + > + <div + slot="title" + class="titBox" + > <div>{{ parentFormData.allocationNum }}</div> <div>{{ title }}</div> </div> <div> - <el-form ref="ruleForm" :disabled="pageState === 'detail'" label-width="120px" :model="formData" class="demo-form-inline" :rules="rules"> + <el-form + ref="ruleForm" + :disabled="pageState === 'detail'" + label-width="120px" + :model="formData" + class="demo-form-inline" + :rules="rules" + > <el-row> <el-col :span="12"> - <el-form-item label="���������������" prop="escalationTime" class="span"> - <el-date-picker v-model="formData.escalationTime" value-format="yyyy-MM-dd" size="small" type="date" placeholder="������������" /> + <el-form-item + label="���������������" + prop="escalationTime" + class="span" + > + <el-date-picker + v-model="formData.escalationTime" + value-format="yyyy-MM-dd" + size="small" + type="date" + placeholder="������������" + /> </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="���������������" prop="pollutePosition" class="span"> - <el-input v-model="formData.pollutePosition" type="text" placeholder="���������" size="small" /> + <el-form-item + label="���������������" + prop="pollutePosition" + class="span" + > + <!-- el-icon-map-location --> + <el-input + v-model="formData.pollutePosition" + type="text" + placeholder="���������" + size="small" + > + <template + slot="append" + > + <div + style="line-height: 2;" + @click="toMap()" + > + ������ + </div> + </template> + </el-input> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> - <el-form-item label="���������������" prop="unitId" class="span"> - <el-select v-model="formData.unitId" placeholder="���������" size="small"> - <el-option v-for="item in unitList" :key="item.unitId" :label="item.unitName" :value="item.unitId" /> + <el-form-item + label="���������������" + prop="unitId" + class="span" + > + <el-select + v-model="formData.unitId" + placeholder="���������" + size="small" + > + <el-option + v-for="item in unitList" + :key="item.unitId" + :label="item.unitName" + :value="item.unitId" + /> </el-select> </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="���������������" prop="polluteType" class="span"> - <el-select v-model="formData.polluteType" placeholder="���������" size="small"> - <el-option v-for="item in polluteList" :key="item.dataKey" :label="item.dataValue" :value="item.dataKey" /> + <el-form-item + label="���������������" + prop="polluteType" + class="span" + > + <el-select + v-model="formData.polluteType" + placeholder="���������" + size="small" + > + <el-option + v-for="item in polluteList" + :key="item.dataKey" + :label="item.dataValue" + :value="item.dataKey" + /> </el-select> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> - <el-form-item label="���������������" prop="changeType" class="span"> - <el-select v-model="formData.changeType" placeholder="���������" size="small" @change="changeEnumList"> - <el-option v-for="item in Dic.changeEnum" :key="item.value" :label="item.name" :value="item.value" /> + <el-form-item + label="���������������" + prop="changeType" + class="span" + > + <el-select + v-model="formData.changeType" + placeholder="���������" + size="small" + @change="changeEnumList" + > + <el-option + v-for="item in Dic.changeEnum" + :key="item.value" + :label="item.name" + :value="item.value" + /> </el-select> </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="���������������" prop="changeDay" class="span"> - <el-input-number v-model="formData.changeDay" :disabled="formData.changeType === 1" :min="0" label="���������" /> + <el-form-item + label="���������������" + prop="changeDay" + class="span" + > + <el-input-number + v-model="formData.changeDay" + :disabled="formData.changeType === 1" + :min="0" + label="���������" + /> <!-- <el-input v-model.number="formData.changeDay" :disabled="formData.changeType===1" type="text" placeholder="���������" size="small" /> --> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> - <el-form-item label="���������������" prop="escalationUnitId" class="span"> - <el-select v-model="formData.escalationUnitId" placeholder="���������" size="small"> - <el-option v-for="item in unitList" :key="item.unitId" :label="item.unitName" :value="item.unitId" /> + <el-form-item + label="���������������" + prop="escalationUnitId" + class="span" + > + <el-select + v-model="formData.escalationUnitId" + placeholder="���������" + size="small" + > + <el-option + v-for="item in unitList" + :key="item.unitId" + :label="item.unitName" + :value="item.unitId" + /> </el-select> </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="������������" prop="escalationName" class="span"> - <el-input v-model="formData.escalationName" type="text" placeholder="���������" size="small" /> + <el-form-item + label="������������" + prop="escalationName" + class="span" + > + <el-input + v-model="formData.escalationName" + type="text" + placeholder="���������" + size="small" + /> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="24"> - <el-form-item label="���������������" prop="investigationType" class="span"> - <el-radio-group v-model="formData.investigationType" size="small"> - <el-radio v-for="item in Dic.investigationEnum" :key="item.value" :label="item.value">{{ item.name }}</el-radio> + <el-form-item + label="���������������" + prop="investigationType" + class="span" + > + <el-radio-group + v-model="formData.investigationType" + size="small" + > + <el-radio + v-for="item in Dic.investigationEnum" + :key="item.value" + :label="item.value" + > + {{ item.name }} + </el-radio> </el-radio-group> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="24"> - <el-form-item label="���������������" prop="keyPointlist" class="span"> - <el-radio-group v-model="formData.keyPoint" size="small"> - <el-radio v-for="item in Dic.emphasisEnum" :key="item.value" :label="item.value">{{ item.name }}</el-radio> + <el-form-item + label="���������������" + prop="keyPointlist" + class="span" + > + <el-radio-group + v-model="formData.keyPoint" + size="small" + > + <el-radio + v-for="item in Dic.emphasisEnum" + :key="item.value" + :label="item.value" + > + {{ item.name }} + </el-radio> </el-radio-group> </el-form-item> </el-col> </el-row> <el-row> - <el-form-item label="���������������" prop="problemDescribe" class="span"> - <el-input v-model="formData.problemDescribe" type="textarea" :rows="4" placeholder="���������������" /> + <el-form-item + label="���������������" + prop="problemDescribe" + class="span" + > + <el-input + v-model="formData.problemDescribe" + type="textarea" + :rows="4" + placeholder="���������������" + /> </el-form-item> </el-row> <el-row> <el-form-item label="���������"> <div> <div v-if="pageState === 'edit'"> - <div v-for="(file, index) in fileBaseListCover" :key="file.fileId + index" class="block"> - <el-image v-if="file.fileType === 1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list=" + <div + v-for="(file, index) in fileBaseListCover" + :key="file.fileId + index" + class="block" + > + <el-image + v-if="file.fileType === 1" + style="width: 100px; height: 100px" + :src="file.url" + :preview-src-list=" getPreviewImages(file.fileId, fileBaseList) - " :initial-index="index" /> - <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)"> + " + :initial-index="index" + /> + <video + v-else + :src="file.url" + style="width: 100px; height: 100px" + @click="openVideo(file)" + > ������������������������ video ��������� </video> </div> </div> </div> - <uploadFile v-if="pageState !== 'detail'" :upload-url="uploadTermExcelUrl" :sys-code="sysCode" /> + <uploadFile + v-if="pageState !== 'detail'" + :upload-url="uploadTermExcelUrl" + :sys-code="sysCode" + /> </el-form-item> </el-row> </el-form> </div> - <div slot="footer" class="dialog-footer"> - <el-button @click="close">������</el-button> - <el-button v-if="pageState !== 'detail'" type="info" @click="handleSubmit('9')">������</el-button> - <el-button v-if="pageState !== 'detail'" type="primary" @click="handleSubmit('10')">������</el-button> + <div + slot="footer" + class="dialog-footer" + > + <el-button @click="close"> + ������ + </el-button> + <el-button + v-if="pageState !== 'detail'" + type="info" + @click="handleSubmit('9')" + > + ������ + </el-button> + <el-button + v-if="pageState !== 'detail'" + type="primary" + @click="handleSubmit('10')" + > + ������ + </el-button> </div> </el-dialog> - <el-dialog :visible.sync="videoVisible" width="600px" :modal-append-to-body="false" :destroy-on-close="true" @close="handleCancel"> + <el-dialog + :visible.sync="videoVisible" + width="600px" + :modal-append-to-body="false" + :destroy-on-close="true" + @close="handleCancel" + > <div style="text-align: center"> - <video ref="video" style="width: 300px; height: 500px" :src="dialogImageUrl" controls autoplay /> + <video + ref="video" + style="width: 300px; height: 500px" + :src="dialogImageUrl" + controls + autoplay + /> </div> </el-dialog> </div> @@ -130,10 +332,11 @@ props: { title: { type: String, default: '' }, visible: { type: Boolean, required: true }, + isToMap: { type: Boolean, required: true, default: false }, pageState: { type: String, required: true, default: 'add' }, parentFormData: { type: Object, default: () => {} } }, - data() { + data () { return { videoVisible: false, formData: { @@ -146,7 +349,8 @@ escalationName: '', keyPoint: 0, changeDay: 0, - investigationType: 1 + investigationType: 1, + pollutePosition: '' }, fileBaseList: [], fileBaseListCover: [], @@ -188,13 +392,13 @@ } }, computed: { - uploadTermExcelUrl() { + uploadTermExcelUrl () { return `${requestObj.baseUrl}/file/upload` } }, watch: { pageState: { - handler(newVal) { + handler (newVal) { if (this.pageState === 'edit') { if ( this.parentFormData.fileBaseList && @@ -226,7 +430,7 @@ immediate: true } }, - async created() { + async created () { this.getUnitList() console.log('oldValue', this.parentFormData) @@ -244,10 +448,13 @@ }) }, methods: { - changeKeyPoint(data) { + toMap () { + this.$emit('update:isToMap', true) + }, + changeKeyPoint (data) { this.$forceUpdate() }, - getPreviewImages(index, list) { + getPreviewImages (index, list) { let startIndex = 0 const chechList = _.cloneDeep(list) chechList.forEach((item, i) => { @@ -266,22 +473,22 @@ var remain = imgList.splice(0, startIndex) return start.concat(remain) }, - openVideo(item) { + openVideo (item) { console.log('item', item) this.dialogImageUrl = item.url this.videoVisible = true }, - handleCancel() { + handleCancel () { this.dialogImageUrl = '' this.videoVisible = false }, - changeEnumList(val) { + changeEnumList (val) { if (val === 1) { this.formData.changeDay = 0 } }, // ������������������list - getUnitList() { + getUnitList () { this.$request({ url: '/allocation/unit', method: 'get' @@ -290,7 +497,7 @@ this.getContaminateList() }) }, - getContaminateList() { + getContaminateList () { this.$request({ url: '/allocation/contaminate', method: 'get' @@ -310,13 +517,13 @@ } }) }, - close() { + close () { this.$nextTick(function () { this.$refs.ruleForm.resetFields() }) this.$emit('update:visible', false) }, - handleSubmit(val) { + handleSubmit (val) { console.log('this.formData', this.formData) if (this.fileBaseListCover && this.fileBaseListCover.length > 0) { this.fileBaseListCover.forEach(item => { @@ -386,4 +593,10 @@ /deep/.el-checkbox__inner { border-radius: 50%; } +/deep/.el-input-group__append { + width: 60px !important; + padding: 0; + text-align: center; + cursor: pointer; +} </style> diff --git a/src/views/toCarryOutLegislativeReforms/components/workOrderInformation.vue b/src/views/toCarryOutLegislativeReforms/components/workOrderInformation.vue index f67231a..2ee73ab 100644 --- a/src/views/toCarryOutLegislativeReforms/components/workOrderInformation.vue +++ b/src/views/toCarryOutLegislativeReforms/components/workOrderInformation.vue @@ -1,37 +1,137 @@ <template> <div> - <el-dialog :title="dialogData.title" top="30px" :visible.sync="visible" width="900px" center :before-close="close"> - <div slot="title" class="titBox"> + <el-dialog + :title="dialogData.title" + top="30px" + :visible.sync="visible" + width="900px" + center + :before-close="close" + > + <div + slot="title" + class="titBox" + > <div>{{ parentFormData.allocationNum }}</div> <div>{{ dialogData.title }}</div> </div> <div> - <div v-if="dialogData.pageType !=='delay'" class="stepsList"> - <el-steps :space="200" :active="activeLeng" align-center> - <el-step v-for="(item,index) in setepList" :key="index" :title="'' + item.createName + ' ' + item.stateName" :description="item.createTime" /> + <div + v-if="dialogData.pageType !=='delay'" + class="stepsList" + > + <el-steps + :space="200" + :active="activeLeng" + align-center + > + <el-step + v-for="(item,index) in setepList" + :key="index" + :title="'' + item.createName + ' ' + item.stateName" + :description="item.createTime" + /> </el-steps> </div> <div class="inforData"> - <el-descriptions title="������������" :column="parseInt('4')"> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ parentFormData.escalationTime }}</el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ unitIdFormatter }}</el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ polluteTypeFormatter }}</el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ dictObj.changeEnum[parentFormData.changeType] }}</el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ parentFormData.changeDay }}</el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ updataUnitIdFormatter }}</el-descriptions-item> - <el-descriptions-item label="���������" label-class-name="itemSpan">{{ parentFormData.escalationName }}</el-descriptions-item> + <el-descriptions + title="������������" + > + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ parentFormData.escalationTime }} + </el-descriptions-item> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ unitIdFormatter }} + </el-descriptions-item> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ polluteTypeFormatter }} + </el-descriptions-item> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ dictObj.changeEnum[parentFormData.changeType] }} + </el-descriptions-item> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ parentFormData.changeDay }} + </el-descriptions-item> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ updataUnitIdFormatter }} + </el-descriptions-item> + <el-descriptions-item + label="���������" + label-class-name="itemSpan" + > + {{ parentFormData.escalationName }} + </el-descriptions-item> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ dictObj.emphasisEnum[parentFormData.keyPoint] }} + </el-descriptions-item> </el-descriptions> - <el-descriptions :column="parseInt('2')"> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ parentFormData.pollutePosition }}</el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ dictObj.emphasisEnum[parentFormData.keyPoint] }}</el-descriptions-item> + <el-descriptions> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ parentFormData.pollutePosition }} + <i + v-if="parentFormData.latitude&&parentFormData.longitude" + style="color:#409EFF;margin-left:10px;font-size:18px;cursor:pointer" + class="el-icon-location-outline" + @click="toMap" + /> + </el-descriptions-item> </el-descriptions> <el-descriptions :column="parseInt('1')"> - <el-descriptions-item label="������������" label-class-name="itemSpan" :content-style="{'width': '80%'}">{{ parentFormData.problemDescribe }}</el-descriptions-item> - <el-descriptions-item label="������" label-class-name="itemSpan" :content-style="{'width': '80%'}"> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + :content-style="{'width': '80%'}" + > + {{ parentFormData.problemDescribe }} + </el-descriptions-item> + <el-descriptions-item + label="������" + label-class-name="itemSpan" + :content-style="{'width': '80%'}" + > <div> - <div v-for="(file,index) in fileBaseListCover" :key="file.id+index" class="block"> - <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileBaseList)" :initial-index="index" /> - <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)"> + <div + v-for="(file,index) in fileBaseListCover" + :key="file.id+index" + class="block" + > + <el-image + v-if="file.fileType ===1" + style="width: 100px; height: 100px" + :src="file.url" + :preview-src-list="getPreviewImages(file.id,fileBaseList)" + :initial-index="index" + /> + <video + v-else + :src="file.url" + style="width: 100px; height: 100px" + @click="openVideo(file)" + > ������������������������ video ��������� </video> </div> @@ -40,29 +140,50 @@ </el-descriptions> </div> <!-- ������������������ --> - <div v-if="dialogData.pageType ==='work'" class="rectification"> + <div + v-if="dialogData.pageType ==='work'" + class="rectification" + > <div> - <el-form label-width="90px" class="demo-form-inline"> + <el-form + label-width="90px" + class="demo-form-inline" + > <div style="display: flex;"> <el-form-item label="������������:"> <el-radio-group v-model="workForme.isChange"> - <el-radio :label="1">���</el-radio> - <el-radio :label="0">���</el-radio> + <el-radio :label="1"> + ��� + </el-radio> + <el-radio :label="0"> + ��� + </el-radio> </el-radio-group> </el-form-item> <el-form-item label="���������:"> - <el-input v-model="workForme.changeName" size="mini" placeholder="������������������" /> + <el-input + v-model="workForme.changeName" + size="mini" + placeholder="������������������" + /> </el-form-item> </div> <el-form-item label="������������:"> - <el-input v-model="workForme.changeDescribe" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="���������������" /> + <el-input + v-model="workForme.changeDescribe" + type="textarea" + :autosize="{ minRows: 2, maxRows: 4}" + placeholder="���������������" + /> </el-form-item> <el-row> <el-form-item label="������:"> - <uploadFile :upload-url="uploadTermExcelUrl" :sys-code="dialogData.sysCode" /> + <uploadFile + :upload-url="uploadTermExcelUrl" + :sys-code="dialogData.sysCode" + /> </el-form-item> </el-row> - </el-form> </div> </div> @@ -71,26 +192,62 @@ <el-row class="rectificationContent"> <el-col :span="12"> <div class="grid-content bg-purple" /> - <el-descriptions title="������������" :column="parseInt('2')"> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ dictObj.yesOrNo[parentFormData.isChange] }}</el-descriptions-item> - <el-descriptions-item label="���������" label-class-name="itemSpan">{{ parentFormData.changeName }}</el-descriptions-item> + <el-descriptions + title="������������" + :column="parseInt('2')" + > + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ dictObj.yesOrNo[parentFormData.isChange] }} + </el-descriptions-item> + <el-descriptions-item + label="���������" + label-class-name="itemSpan" + > + {{ parentFormData.changeName }} + </el-descriptions-item> </el-descriptions> <el-descriptions :column="parseInt('1')"> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ parentFormData.changeDescribe }}</el-descriptions-item> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ parentFormData.changeDescribe }} + </el-descriptions-item> </el-descriptions> </el-col> <el-col :span="12"> <div class="grid-content bg-purple-light" /> <el-row> - <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;"> + <el-col + :span="3" + style="margin-top: 40px;font-size: 15px;color: #101010;" + > <div class="grid-content bg-purple" />��������� </el-col> <el-col :span="21"> <div class="grid-content bg-purple-light" /> <div> - <div v-for="(file,index) in fileChangeListCover" :key="file.id+index" class="block"> - <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileChangeList)" :initial-index="index" /> - <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)"> + <div + v-for="(file,index) in fileChangeListCover" + :key="file.id+index" + class="block" + > + <el-image + v-if="file.fileType ===1" + style="width: 100px; height: 100px" + :src="file.url" + :preview-src-list="getPreviewImages(file.id,fileChangeList)" + :initial-index="index" + /> + <video + v-else + :src="file.url" + style="width: 100px; height: 100px" + @click="openVideo(file)" + > ������������������������ video ��������� </video> </div> @@ -105,26 +262,57 @@ <el-row class="rectificationContent"> <el-col :span="12"> <div class="grid-content bg-purple" /> - <el-descriptions title="������������" :column="2"> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ parentFormData.checkScore }}</el-descriptions-item> + <el-descriptions + title="������������" + :column="2" + > + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ parentFormData.checkScore }} + </el-descriptions-item> </el-descriptions> <el-descriptions :column="1"> - <el-descriptions-item label="������" label-class-name="itemSpan">{{ parentFormData.checkDescribe }}</el-descriptions-item> + <el-descriptions-item + label="������" + label-class-name="itemSpan" + > + {{ parentFormData.checkDescribe }} + </el-descriptions-item> </el-descriptions> </el-col> <el-col :span="12"> <div class="grid-content bg-purple-light" /> <el-row> - <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;"> + <el-col + :span="3" + style="margin-top: 40px;font-size: 15px;color: #101010;" + > <div class="grid-content bg-purple" />��������� </el-col> <el-col :span="21"> <div class="grid-content bg-purple-light" /> <div> <div> - <div v-for="(file,index) in fileApproveListCover" :key="file.id+index" class="block"> - <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileApproveList)" :initial-index="index" /> - <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)"> + <div + v-for="(file,index) in fileApproveListCover" + :key="file.id+index" + class="block" + > + <el-image + v-if="file.fileType ===1" + style="width: 100px; height: 100px" + :src="file.url" + :preview-src-list="getPreviewImages(file.id,fileApproveList)" + :initial-index="index" + /> + <video + v-else + :src="file.url" + style="width: 100px; height: 100px" + @click="openVideo(file)" + > ������������������������ video ��������� </video> </div> @@ -140,23 +328,54 @@ <el-row class="rectificationContent"> <el-col :span="12"> <div class="grid-content bg-purple" /> - <el-descriptions title="������������" :column="1"> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ parentFormData.extensionNum }}</el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan">{{ parentFormData.remake }}</el-descriptions-item> + <el-descriptions + title="������������" + :column="1" + > + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ parentFormData.extensionNum }} + </el-descriptions-item> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > + {{ parentFormData.remake }} + </el-descriptions-item> </el-descriptions> </el-col> <el-col :span="12"> <div class="grid-content bg-purple-light" /> <el-row> - <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;"> + <el-col + :span="3" + style="margin-top: 40px;font-size: 15px;color: #101010;" + > <div class="grid-content bg-purple" />��������� </el-col> <el-col :span="21"> <div class="grid-content bg-purple-light" /> <div> - <div v-for="(file,index) in fileDelayListCover" :key="file.id+index" class="block"> - <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileDelayList)" :initial-index="index" /> - <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)"> + <div + v-for="(file,index) in fileDelayListCover" + :key="file.id+index" + class="block" + > + <el-image + v-if="file.fileType ===1" + style="width: 100px; height: 100px" + :src="file.url" + :preview-src-list="getPreviewImages(file.id,fileDelayList)" + :initial-index="index" + /> + <video + v-else + :src="file.url" + style="width: 100px; height: 100px" + @click="openVideo(file)" + > ������������������������ video ��������� </video> </div> @@ -167,47 +386,131 @@ </el-row> </div> <!-- ������������ --> - <div v-if="dialogData.pageType ==='approve'" class="examineAndApprove"> - <el-form label-width="90px" :model="rectificationFromData" class="demo-form-inline"> + <div + v-if="dialogData.pageType ==='approve'" + class="examineAndApprove" + > + <el-form + label-width="90px" + :model="rectificationFromData" + class="demo-form-inline" + > <el-form-item label="������������:"> - <el-input v-model="approveForm.checkScore" style="width: 120px;" size="mini" /> + <el-input + v-model="approveForm.checkScore" + style="width: 120px;" + size="mini" + /> </el-form-item> <el-form-item label="������:"> - <el-input v-model="approveForm.checkDescribe" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="���������������" /> + <el-input + v-model="approveForm.checkDescribe" + type="textarea" + :autosize="{ minRows: 2, maxRows: 4}" + placeholder="���������������" + /> </el-form-item> <el-form-item label="������:"> - <uploadFile :upload-url="uploadTermExcelUrl" :sys-code="dialogData.sysCode" /> + <uploadFile + :upload-url="uploadTermExcelUrl" + :sys-code="dialogData.sysCode" + /> </el-form-item> </el-form> </div> <!-- ������������ --> - <div v-if="dialogData.pageType ==='delay' && ( dialogData.pageState ==='approve')" class="examineAndApprove"> - <el-form label-width="90px" :model="rectificationFromData" class="demo-form-inline"> + <div + v-if="dialogData.pageType ==='delay' && ( dialogData.pageState ==='approve')" + class="examineAndApprove" + > + <el-form + label-width="90px" + :model="rectificationFromData" + class="demo-form-inline" + > <el-form-item label="������������:"> - <el-input v-model="delayForm.extensionNum" style="width: 200px;" /> + <el-input + v-model="delayForm.extensionNum" + style="width: 200px;" + /> </el-form-item> <el-form-item label="������������:"> - <el-input v-model="delayForm.remake" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="���������������" /> + <el-input + v-model="delayForm.remake" + type="textarea" + :autosize="{ minRows: 2, maxRows: 4}" + placeholder="���������������" + /> </el-form-item> <el-form-item label="������:"> - <uploadFile :upload-url="uploadTermExcelUrl" :sys-code="dialogData.sysCode" /> + <uploadFile + :upload-url="uploadTermExcelUrl" + :sys-code="dialogData.sysCode" + /> </el-form-item> </el-form> </div> </div> - <el-alert v-if="parentFormData.isInvalid===1" title="���������" type="warning" show-icon :description="`���������${parentFormData.invalidReason}`" :closable="false"> - </el-alert> - <div slot="footer" class="dialog-footer"> - <el-button @click="close()">������</el-button> - <el-button v-if="dialogData.pageType ==='approve'" type="danger" @click="handleSubmit(50)">������</el-button> - <el-button v-if="dialogData.pageType ==='delay'&& dialogData.pageState ==='edit'" type="danger" @click="handleDelaySubmit(50)">������</el-button> - <el-button v-if="dialogData.pageType ==='delay'&& dialogData.pageState ==='edit'" type="primary" @click="handleDelaySubmit(40)">������</el-button> - <el-button v-if="dialogData.pageType !=='detail'&& dialogData.pageState ==='approve'" type="primary" @click="handleSubmit(40)">������</el-button> + <el-alert + v-if="parentFormData.isInvalid===1" + title="���������" + type="warning" + show-icon + :description="`���������${parentFormData.invalidReason}`" + :closable="false" + /> + <div + slot="footer" + class="dialog-footer" + > + <el-button @click="close()"> + ������ + </el-button> + <el-button + v-if="dialogData.pageType ==='approve'" + type="danger" + @click="handleSubmit(50)" + > + ������ + </el-button> + <el-button + v-if="dialogData.pageType ==='delay'&& dialogData.pageState ==='edit'" + type="danger" + @click="handleDelaySubmit(50)" + > + ������ + </el-button> + <el-button + v-if="dialogData.pageType ==='delay'&& dialogData.pageState ==='edit'" + type="primary" + @click="handleDelaySubmit(40)" + > + ������ + </el-button> + <el-button + v-if="dialogData.pageType !=='detail'&& dialogData.pageState ==='approve'" + type="primary" + @click="handleSubmit(40)" + > + ������ + </el-button> </div> </el-dialog> - <el-dialog :visible.sync="videoVisible" width="600px" :modal-append-to-body="false" :destroy-on-close="true" @close="handleCancel"> + <el-dialog + :visible.sync="videoVisible" + width="600px" + :modal-append-to-body="false" + :destroy-on-close="true" + @close="handleCancel" + > <div style="text-align: center;"> - <video ref="video" style="width: 300px;height: 500px" :src="dialogImageUrl" controls autoplay /> + <video + ref="video" + style="width: 300px;height: 500px" + :src="dialogImageUrl" + controls + autoplay + /> </div> </el-dialog> </div> @@ -224,10 +527,11 @@ uploadFile }, props: { + isToMap: { type: Boolean, required: true, default: false }, dialogData: { type: Object, default: () => {} }, visible: { type: Boolean, required: true } }, - data() { + data () { return { centerDialogVisible: true, workForme: { @@ -277,11 +581,11 @@ } }, computed: { - uploadTermExcelUrl() { + uploadTermExcelUrl () { return `${requestObj.baseUrl}/file/upload` }, - parentFormData() { - console.log('parentFormData.approveList', this.dialogData.parentFormData) + parentFormData () { + console.log('parentFormData.approveList', this.dialogData) return this.dialogData.parentFormData }, updataUnitIdFormatter: function () { @@ -306,20 +610,22 @@ ) return data ? data.dataValue : '' }, - setepList() { + setepList () { const leng = this.dialogData.parentFormData.approveList.length let data = _.cloneDeep(this.dialogData.parentFormData.approveList) - console.log('setepList', this.dialogData.parentFormData.approveList) if (leng === 1) { data = [...data, ...this.setepListAdd.set1] + // eslint-disable-next-line vue/no-side-effects-in-computed-properties this.activeLeng = 1 } if (leng === 2) { data = [...data, ...this.setepListAdd.set2] + // eslint-disable-next-line vue/no-side-effects-in-computed-properties this.activeLeng = 2 } if (leng === 3) { data = [...data, ...this.setepListAdd.set3] + // eslint-disable-next-line vue/no-side-effects-in-computed-properties this.activeLeng = 4 } console.log('datadata', data) @@ -328,14 +634,14 @@ }, watch: { parentFormData: { - handler(newVal) { + handler (newVal) { this.searchthisFileList(newVal) }, deep: true, immediate: true } }, - created() { + created () { const name = this.$store.state.user.name this.workForme.changeName = name this.getContaminateList() @@ -353,7 +659,10 @@ }) }, methods: { - getPreviewImages(index, list) { + toMap () { + this.$emit('update:isToMap', true) + }, + getPreviewImages (index, list) { let startIndex = 0 const chechList = _.cloneDeep(list) chechList.forEach((item, i) => { @@ -369,16 +678,16 @@ var remain = imgList.splice(0, startIndex) return start.concat(remain) }, - openVideo(item) { + openVideo (item) { console.log('item', item) this.dialogImageUrl = item.url this.videoVisible = true }, - handleCancel() { + handleCancel () { this.dialogImageUrl = '' this.videoVisible = false }, - searchthisFileList(newVal) { + searchthisFileList (newVal) { if (newVal.fileBaseList && newVal.fileBaseList.length > 0) { newVal.fileBaseList.forEach(item => { if (item.fileType === 1) { @@ -456,11 +765,11 @@ }) } }, - close() { + close () { this.$emit('update:visible', false) }, // ������������������list - getUnitList() { + getUnitList () { this.$request({ url: '/allocation/unit', method: 'get' @@ -468,7 +777,7 @@ this.unitList = res.data }) }, - handleDelaySubmit(state) { + handleDelaySubmit (state) { this.$request({ url: '/allocationExtension/check', method: 'get', @@ -485,7 +794,7 @@ } }) }, - handleSubmit(state) { + handleSubmit (state) { // ������ let api = '/allocation/change' let data = {} @@ -527,7 +836,7 @@ } }) }, - getContaminateList() { + getContaminateList () { this.$request({ url: '/allocation/contaminate', method: 'get' diff --git a/src/views/toCarryOutLegislativeReforms/reform/index.vue b/src/views/toCarryOutLegislativeReforms/reform/index.vue index 5f05f20..2019831 100644 --- a/src/views/toCarryOutLegislativeReforms/reform/index.vue +++ b/src/views/toCarryOutLegislativeReforms/reform/index.vue @@ -1,17 +1,43 @@ <template> - <div v-loading="loading" class="main"> + <div + v-loading="loading" + class="main" + > <div> - <searchBar v-if="searchType" :search-type="'reform'" @handleSearch="handleSearchBut" @handleAdd="handleOpenDialog(null, 'add')" /> - <newWorkOrder v-if="centerDialogVisible" ref="newWorkOrder" :isToMap.sync='isToMap' :parent-form-data="parentFormData" :title="title" :page-state="pageState" :visible.sync="centerDialogVisible" @handleSubmit="newHandleSubmit" /> + <searchBar + v-if="searchType" + :search-type="'reform'" + @handleSearch="handleSearchBut" + @handleAdd="handleOpenDialog(null, 'add')" + /> + <newWorkOrder + v-if="centerDialogVisible" + ref="newWorkOrder" + :is-to-map.sync="isToMap" + :parent-form-data="parentFormData" + :title="title" + :page-state="pageState" + :visible.sync="centerDialogVisible" + @handleSubmit="newHandleSubmit" + /> <!-- <el-divider></el-divider> --> <div class="tab"> <div class="exportBox"> <div>������������</div> <div> - <el-button type="primary" size="mini" @click="handleOpenDialog(null, 'add')"> + <el-button + type="primary" + size="mini" + @click="handleOpenDialog(null, 'add')" + > ������ </el-button> - <el-button :disabled="!(selectionRows.length>0)" type="info" size="mini" @click="isNowDonw"> + <el-button + :disabled="!(selectionRows.length>0)" + type="info" + size="mini" + @click="isNowDonw" + > ������ </el-button> </div> @@ -20,8 +46,15 @@ <div style="position: relative;"> <div> <div v-if="sealList.length>0"> - <div v-for="(item,index) in sealList" :key="index" :style="{'height':item.styleHeight}"> - <div v-if="item.isInvalid===1" class="yingzhang"> + <div + v-for="(item,index) in sealList" + :key="index" + :style="{'height':item.styleHeight}" + > + <div + v-if="item.isInvalid===1" + class="yingzhang" + > <div class="seal-red"> ��������� </div> @@ -30,12 +63,28 @@ </div> </div> <div style="position: absolute;top:0;width: 100%;"> - <el-table size="mini" :data="tableData" border style="width: 100%" :header-cell-style="{ + <el-table + size="mini" + :data="tableData" + border + style="width: 100%" + :header-cell-style="{ color: '#101111', fontSize: '16px' - }" @selection-change="handleSelectionChange"> - <el-table-column type="selection" width="40" align="center" /> - <el-table-column type="index" label="������" width="60px" align="center" /> + }" + @selection-change="handleSelectionChange" + > + <el-table-column + type="selection" + width="40" + align="center" + /> + <el-table-column + type="index" + label="������" + width="60px" + align="center" + /> <el-table-column align="center"> <template slot="header"> <div>������</div> @@ -46,8 +95,20 @@ <div>{{ scope.row.escalationTime }}</div> </template> </el-table-column> - <el-table-column align="center" prop="unitId" label="������������" width="150px" :formatter="unitIdFormatter" /> - <el-table-column align="center" prop="polluteType" label="������������" width="120px" :formatter="polluteTypeFormatter" /> + <el-table-column + align="center" + prop="unitId" + label="������������" + width="150px" + :formatter="unitIdFormatter" + /> + <el-table-column + align="center" + prop="polluteType" + label="������������" + width="120px" + :formatter="polluteTypeFormatter" + /> <el-table-column align="center"> <template slot="header"> <div>������������</div> @@ -55,7 +116,10 @@ </template> <template slot-scope="scope"> <div>{{ dictObj.changeEnum[scope.row.changeType] }}</div> - <div v-show="scope.row.changeType && scope.row.changeType === 2" :class="[Number(scope.row.residueDay) < 0 ? errorClass : '']"> + <div + v-show="scope.row.changeType && scope.row.changeType === 2" + :class="[Number(scope.row.residueDay) < 0 ? errorClass : '']" + > <span v-if="Number(scope.row.residueDay) < 0"> ������ {{ Math.abs(scope.row.residueDay) }}��� </span> @@ -63,31 +127,63 @@ </div> </template> </el-table-column> - <el-table-column align="center" prop="investigationType" label="������������" width="100px" :formatter="investigationTypeFormatter" /> - <el-table-column align="center" prop="state" width="100px" label="������������"> + <el-table-column + align="center" + prop="investigationType" + label="������������" + width="100px" + :formatter="investigationTypeFormatter" + /> + <el-table-column + align="center" + prop="state" + width="100px" + label="������������" + > <template slot-scope="scope"> - <el-tag v-if="scope.row.state === 40" type="success"> + <el-tag + v-if="scope.row.state === 40" + type="success" + > {{ stateFormatter(scope.row) }} </el-tag> - <el-tag v-if="scope.row.state === 50" type="danger"> + <el-tag + v-if="scope.row.state === 50" + type="danger" + > {{ stateFormatter(scope.row) }} </el-tag> - <el-tag v-if="scope.row.state === 9" type="info"> + <el-tag + v-if="scope.row.state === 9" + type="info" + > {{ stateFormatter(scope.row) }} </el-tag> - <el-tag v-if="scope.row.state === 20" type="warning"> + <el-tag + v-if="scope.row.state === 20" + type="warning" + > {{ stateFormatter(scope.row) }} </el-tag> - <el-tag v-if="scope.row.state === 10" type="warning"> + <el-tag + v-if="scope.row.state === 10" + type="warning" + > {{ stateFormatter(scope.row) }} </el-tag> - <el-tag v-if="scope.row.state === 30" type="warning"> + <el-tag + v-if="scope.row.state === 30" + type="warning" + > {{ stateFormatter(scope.row) }} </el-tag> </template> </el-table-column> <!-- <el-table-column align="center" prop="isInvalid" label="������������" width="60px" :formatter="isInvalidFormatter" /> --> - <el-table-column align="center" width="150px"> + <el-table-column + align="center" + width="150px" + > <template slot="header"> <div>������������</div> <div>���������</div> @@ -107,27 +203,66 @@ <div>{{ scope.row.updateTime }}</div> </template> </el-table-column> - <el-table-column align="center" prop="createTime" min-width="100px" label="������"> + <el-table-column + align="center" + prop="createTime" + min-width="100px" + label="������" + > <template slot-scope="scope"> - <el-button type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'detail')"> + <el-button + type="text" + size="medium" + @click="openWorkOrdinDialog(scope.row, 'detail')" + > ������ </el-button> - <el-button v-if="scope.row.isCode==='1'" type="text" size="medium" @click="openEditDialog(scope.row)"> + <el-button + v-if="scope.row.isCode==='1'" + type="text" + size="medium" + @click="openEditDialog(scope.row)" + > ������������ </el-button> - <el-button v-if="scope.row.state === 9" type="text" size="medium" @click="handleOpenDialog(scope.row, 'edit')"> + <el-button + v-if="scope.row.state === 9" + type="text" + size="medium" + @click="handleOpenDialog(scope.row, 'edit')" + > ������ </el-button> - <el-button v-if="scope.row.state > 30 && scope.row.isInvalid === 0" type="text" size="medium" @click="handleCancel(scope.row)"> + <el-button + v-if="scope.row.state > 30 && scope.row.isInvalid === 0" + type="text" + size="medium" + @click="handleCancel(scope.row)" + > ������ </el-button> - <el-button v-if="scope.row.state === 20" type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'work')"> + <el-button + v-if="scope.row.state === 20" + type="text" + size="medium" + @click="openWorkOrdinDialog(scope.row, 'work')" + > ������ </el-button> - <el-button v-if="scope.row.state === 30 && scope.row.isApprove === 1" type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'approve')"> + <el-button + v-if="scope.row.state === 30 && scope.row.isApprove === 1" + type="text" + size="medium" + @click="openWorkOrdinDialog(scope.row, 'approve')" + > ������ </el-button> - <el-button v-if="scope.row.state === 20 && scope.row.changeType === 2 &&scope.row.applyState === 0" type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'delay')"> + <el-button + v-if="scope.row.state === 20 && scope.row.changeType === 2 &&scope.row.applyState === 0" + type="text" + size="medium" + @click="openWorkOrdinDialog(scope.row, 'delay')" + > ������������ </el-button> </template> @@ -137,52 +272,119 @@ </div> </div> <div class="pagina"> - <el-pagination background :current-page="pagination.currentPage" :page-sizes="pagination.pageSizes" :page-size="pagination.pageSize" :total="pagination.totalCount" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> + <el-pagination + background + :current-page="pagination.currentPage" + :page-sizes="pagination.pageSizes" + :page-size="pagination.pageSize" + :total="pagination.totalCount" + layout="total, sizes, prev, pager, next, jumper" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + /> </div> </div> - <workOrderInformation v-if="workOrdinDialogVisible" :dialog-data="dialogData" :visible.sync="workOrdinDialogVisible" @handeleSumit="handeleSumit" /> - <el-dialog title="������" :visible.sync="dialogVisible" width="600px" :before-close="handleClose" center> + <workOrderInformation + v-if="workOrdinDialogVisible" + :dialog-data="dialogData" + :is-to-map.sync="isToMap" + :visible.sync="workOrdinDialogVisible" + @handeleSumit="handeleSumit" + /> + <el-dialog + title="������" + :visible.sync="dialogVisible" + width="600px" + :before-close="handleClose" + center + > <div> <el-form label-width="100px"> - <el-form-item label="���������������" style="margin-right: 30px"> - <el-input v-model="invalidReason" type="textarea" :autosize="{ minRows: 2, maxRows: 10 }" placeholder="���������������" /> + <el-form-item + label="���������������" + style="margin-right: 30px" + > + <el-input + v-model="invalidReason" + type="textarea" + :autosize="{ minRows: 2, maxRows: 10 }" + placeholder="���������������" + /> </el-form-item> </el-form> </div> - <span slot="footer" class="dialog-footer"> + <span + slot="footer" + class="dialog-footer" + > <el-button @click="handleClose">��� ���</el-button> - <el-button type="primary" @click="handleInvalid">��� ���</el-button> + <el-button + type="primary" + @click="handleInvalid" + >��� ���</el-button> </span> </el-dialog> - <el-dialog v-if="dialogEditVisible" title="������" :visible.sync="dialogEditVisible" width="800px" top="5vh" :before-close="handleClose" center> + <el-dialog + v-if="dialogEditVisible" + title="������" + :visible.sync="dialogEditVisible" + width="800px" + top="5vh" + :before-close="handleClose" + center + > <el-descriptions title="������������"> <template slot="extra"> <div> {{ editEscalationUnitData.allocationNum }} </div> </template> - <el-descriptions-item label="������������" label-class-name="itemSpan"> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > {{ editEscalationUnitData.escalationTime }} </el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan"> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > {{ updataUnitIdFormatter }} </el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan"> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > {{ polluteTypeeDITFormatter }} </el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan"> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > {{ dictObj.changeEnum[editEscalationUnitData.changeType] }} </el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan"> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > {{ editEscalationUnitData.changeDay || 0 }} ��� </el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan"> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > {{ updataEscalationUnitIdFormatter }} </el-descriptions-item> - <el-descriptions-item label="���������" label-class-name="itemSpan"> + <el-descriptions-item + label="���������" + label-class-name="itemSpan" + > {{ editEscalationUnitData.escalationName }} </el-descriptions-item> - <el-descriptions-item label="������������" label-class-name="itemSpan"> + <el-descriptions-item + label="������������" + label-class-name="itemSpan" + > {{ editEscalationUnitData.pollutePosition }} </el-descriptions-item> </el-descriptions> @@ -191,24 +393,55 @@ <p class="editTile"> ������������ </p> - <el-form :inline="true" class="demo-form-inline"> + <el-form + :inline="true" + class="demo-form-inline" + > <el-form-item label="������������:"> - <el-select v-model="formInEdit.unitId" size="small" clearable placeholder="���������"> - <el-option v-for="item in unitList" :key="item.unitId" :label="item.unitName" :value="item.unitId" /> + <el-select + v-model="formInEdit.unitId" + size="small" + clearable + placeholder="���������" + > + <el-option + v-for="item in unitList" + :key="item.unitId" + :label="item.unitName" + :value="item.unitId" + /> </el-select> </el-form-item> <el-form-item label="������������:"> - <el-select v-model="formInEdit.polluteType" size="small" clearable placeholder="���������"> - <el-option v-for="item in polluteList" :key="item.dataKey" :label="item.dataValue" :value="item.dataKey" /> + <el-select + v-model="formInEdit.polluteType" + size="small" + clearable + placeholder="���������" + > + <el-option + v-for="item in polluteList" + :key="item.dataKey" + :label="item.dataValue" + :value="item.dataKey" + /> </el-select> </el-form-item> </el-form> </div> <el-collapse> - <el-collapse-item title="������������" name="1"> + <el-collapse-item + title="������������" + name="1" + > <div class="block"> <el-timeline> - <el-timeline-item v-for="(activity, index) in operatingLog" :key="index" :color="'#0bbd87'" :timestamp="activity.createTime"> + <el-timeline-item + v-for="(activity, index) in operatingLog" + :key="index" + :color="'#0bbd87'" + :timestamp="activity.createTime" + > <div v-if="activity.content"> ���������: {{ activity.userName }} </div> @@ -224,12 +457,22 @@ </el-collapse-item> </el-collapse> - <span slot="footer" class="dialog-footer"> + <span + slot="footer" + class="dialog-footer" + > <el-button @click="handleClose">��� ���</el-button> - <el-button type="primary" @click="handleEditChange">��� ���</el-button> + <el-button + type="primary" + @click="handleEditChange" + >��� ���</el-button> </span> </el-dialog> - <mapContainer :visible.sync="isToMap" v-if="isToMap"></mapContainer> + <mapContainer + v-if="isToMap" + :visible.sync="isToMap" + @addressAndLnt="getaddressAndLnt" + /> </div> </template> @@ -250,11 +493,12 @@ workOrderInformation }, // mixins: [mixins], - data() { + data () { return { loading: false, isToMap: false, selectionRows: [], + position: [], errorClass: 'errorClass', searchType: 'reform', pagination: { @@ -284,7 +528,9 @@ dictObj: JSON.parse(localStorage.getItem('dictObj')), parentFormData: {}, pageState: 'add', + mapType: 'edit', invalidReason: '', + address: '', slectRow: {}, title: '', searchData: { @@ -297,11 +543,6 @@ }, operatingLog: [], sealList: [] - } - }, - watch: { - isToMap(newVal, oldVal) { - this.isToMap = newVal } }, computed: { @@ -327,32 +568,28 @@ return data ? data.dataValue : '' } }, - created() { + watch: { + isToMap (newVal, oldVal) { + this.isToMap = newVal + } + }, + created () { this.handleSearch({ isInvalid: 0, state: [9, 20, 30] }) this.getUnitList() this.getContaminateList() - if (navigator.geolocation) { - navigator.geolocation.getCurrentPosition( - this.successCallback, - this.errorCallback - ) - } else { - alert('���������������������������������������������') - } }, methods: { - successCallback(position) { - const latitude = position.coords.latitude // ������ - const longitude = position.coords.longitude // ������ - console.log('���������' + longitude) - console.log('���������' + latitude) + getaddressAndLnt (position, address) { + if (this.mapType === 'edit') { + this.$refs.newWorkOrder.formData.pollutePosition = address + this.position = position + } }, - errorCallback() {}, - handleSelectionChange(rows) { + handleSelectionChange (rows) { console.log(rows) this.selectionRows = rows }, - isNowDonw() { + isNowDonw () { this.$confirm('������������������������������?', '������', { confirmButtonText: '������������', cancelButtonText: '������������', @@ -372,7 +609,7 @@ } }) }, - exportData() { + exportData () { // this.dowOrgFile('���������������.xlsx') let that = this const CancelToken = axios.CancelToken @@ -396,10 +633,10 @@ params: { id: this.selectionRows.map(item => item.allocationId) }, - cancelToken: new CancelToken(function executor(c) { + cancelToken: new CancelToken(function executor (c) { cancel = c }), - onDownloadProgress(progress) { + onDownloadProgress (progress) { console.log('onDownloadProgress', progress) const loaded = progress.loaded // progress������������loaded������������������������������total������������������������������������������ @@ -436,10 +673,11 @@ }) .catch(err => { clearTimeout(timer) + console.log('������������', err) this.loading = false }) }, - getOutExcel(fileName, res) { + getOutExcel (fileName, res) { const blob = new Blob([res], { type: 'application/x-xls' }) if (window.navigator.msSaveOrOpenBlob) { // ������ IE & EDGE @@ -466,7 +704,7 @@ this.loading = false } }, - openEditDialog(row) { + openEditDialog (row) { this.editEscalationUnitData = row this.dialogEditVisible = true this.$request({ @@ -485,15 +723,15 @@ console.log(err) }) }, - handleCancel(row) { + handleCancel (row) { this.dialogVisible = true this.slectRow = row }, - handleClose() { + handleClose () { this.dialogVisible = false this.dialogEditVisible = false }, - handleEditChange() { + handleEditChange () { if (this.formInEdit.polluteType === '' && this.formInEdit.unitId === '') { this.$message({ message: '���������������������', @@ -529,7 +767,7 @@ console.log(err) }) }, - handleInvalid() { + handleInvalid () { this.$request({ url: '/allocation/invalid', method: 'get', @@ -550,12 +788,13 @@ }) }, // ������ - handleOpenDialog(row, type) { + handleOpenDialog (row, type) { this.pageState = type this.parentFormData = {} if (type === 'add') { this.title = '���������������' this.centerDialogVisible = true + this.mapType = 'edit' } else { this.title = '���������������' this.$request({ @@ -571,35 +810,35 @@ }) } }, - updatUnitIdFormatter(val) { + updatUnitIdFormatter (val) { const data = this.unitList.find( item => item && item.unitId === val.escalationUnitId ) return data ? data.unitName : '' }, - unitIdFormatter(val) { + unitIdFormatter (val) { const data = this.unitList.find( item => item && item.unitId === val.unitId ) return data ? data.unitName : '' }, - polluteTypeFormatter(val) { + polluteTypeFormatter (val) { const data = this.polluteList.find( item => item && parseInt(item.dataKey) === val.polluteType ) return data ? data.dataValue : '' }, - investigationTypeFormatter(val) { + investigationTypeFormatter (val) { return this.dictObj.investigationEnum[val.investigationType] }, - stateFormatter(val) { + stateFormatter (val) { return this.dictObj.allocationApproveEnum[val.state] }, - isInvalidFormatter(val) { + isInvalidFormatter (val) { return this.dictObj.yesOrNo[val.isInvalid] }, // ������������������list - getUnitList() { + getUnitList () { this.$request({ url: '/allocation/unit', method: 'get' @@ -611,7 +850,7 @@ } }) }, - getContaminateList() { + getContaminateList () { this.$request({ url: '/allocation/contaminate', method: 'get' @@ -623,11 +862,11 @@ } }) }, - handeleSumit() { + handeleSumit () { this.handleSearch() }, // ������ - newHandleSubmit(obj) { + newHandleSubmit (obj) { console.log(obj) console.log(this.parentFormData) let api = '/allocation/insert' @@ -635,10 +874,18 @@ api = '/allocation/update' // obj.fileBaseList = [...this.parentFormData.fileBaseList, ... obj.fileBaseList] } + let latitude = '' + let longitude = '' + if (this.position.length > 0) { + latitude = this.position[1] + longitude = this.position[0] + } this.$request({ url: api, method: 'post', data: { + 'latitude': latitude, + 'longitude': longitude, ...obj } }).then(res => { @@ -651,7 +898,7 @@ } }) }, - handleSearchBut(obj) { + handleSearchBut (obj) { const pageSize = this.pagination.pageSize this.pagination = { currentPage: 1, @@ -664,7 +911,7 @@ } this.handleSearch(obj) }, - handleSearch(obj) { + handleSearch (obj) { this.selectionRows = [] if (obj) { this.searchData = obj @@ -701,7 +948,7 @@ }, // ������ // ��������������������� - handleSizeChange(val) { + handleSizeChange (val) { // ��������������������������� console.log('345') this.pagination.pageSize = val @@ -710,14 +957,14 @@ this.handleSearch() }, // ��������������� - handleCurrentChange(val) { + handleCurrentChange (val) { // ��������������������� console.log('123') this.pagination.currentPage = val this.handleSearch() // console.log(val) }, - openWorkOrdinDialog(row, type) { + openWorkOrdinDialog (row, type) { this.$request({ url: '/allocation/detail', method: 'get', @@ -744,6 +991,9 @@ sysCode: '1010203' } } else if (type === 'detail') { + this.mapType = 'view' + this.position = [res.data.longitude, res.data.latitude] + this.address = res.data.pollutePosition this.dialogData = { title: '���������������', parentFormData: res.data, -- Gitblit v1.8.0