安检管理页面

src/views/modules/resourceManagement/enterprise/addForm.vue

@@ -0,0 +1,426 @@
+<template>
+	<el-dialog title="提示" :visible.sync="dialogVisible" width="1370px" :before-close="handleCancle">
+		<span slot="title">
+			<span v-if="pageType == 'add'">新增</span>
+			<span v-if="pageType == 'edit'">修改</span>
+			<span v-if="pageType == 'view'">查看</span>
+		</span>
+		<div>
+			<div class="dialog-h-content scroll-h">
+				<el-form :inline="true" :model="formData" ref="form" :rules="dataRule" :label-width="'90px'" v-if="pageType != 'view'">
+					<el-row>
+						<el-col :span="6">
+							<el-form-item label="设备名称" prop="equipmentName">
+								<el-input v-model.trim="formData.equipmentName" :disabled="disabled" class="u-item-width-normal" size="small" clearable placeholder="请输入"></el-input>
+							</el-form-item>
+						</el-col>
+						<el-col :span="6">
+							<el-form-item label="设备编号" prop="equipmentNum">
+								<el-input v-model.trim="formData.equipmentNum" :disabled="disabled" class="u-item-width-normal" size="small" clearable placeholder="请输入"></el-input>
+							</el-form-item>
+						</el-col>
+						<el-col :span="6">
+							<el-form-item label="负责人" prop="principalName">
+								<el-input v-model.trim="formData.principalName" :disabled="disabled" class="u-item-width-normal" size="small" clearable placeholder="请输入"></el-input>
+							</el-form-item>
+						</el-col>
+						<el-col :span="6">
+							<el-form-item label="联系电话" prop="contactNum">
+								<el-input v-model.trim="formData.contactNum" :disabled="disabled" class="u-item-width-normal" size="small" clearable placeholder="请输入"></el-input>
+							</el-form-item>
+						</el-col>
+						<el-col :span="18">
+							<el-form-item label="所处位置" prop="location" style="display: block">
+								<el-select
+									v-model.trim="formData.location"
+									:disabled="disabled"
+									filterable
+									remote
+									:reserve-keyword="true"
+									placeholder="请输入关键词"
+									:remote-method="remoteMethod"
+									:loading="loading"
+									@keyup.enter.native="remoteMethod(formData.location)"
+								>
+									<el-option
+										v-for="(item, index) in searchOptions"
+										@click.native="handleClickKey(index)"
+										:key="item.value"
+										:label="item.label"
+										:value="item.value"
+									></el-option>
+								</el-select>
+							</el-form-item>
+						</el-col>
+					</el-row>
+					<div id="app_event" class="div_map"></div>
+				</el-form>
+				<el-form :inline="false" :model="formData" ref="form" :label-width="'90px'" v-if="pageType == 'view'">
+					<el-row>
+						<el-col :span="6">
+							<el-form-item label="设备名称" prop="equipmentName">{{ formData.equipmentName }}</el-form-item>
+						</el-col>
+						<el-col :span="6">
+							<el-form-item label="设备编号" prop="equipmentNum">{{ formData.equipmentNum }}</el-form-item>
+						</el-col>
+						<el-col :span="6">
+							<el-form-item label="负责人" prop="principalName">{{ formData.principalName }}</el-form-item>
+						</el-col>
+						<el-col :span="6">
+							<el-form-item label="联系电话" prop="contactNum">{{ formData.contactNum }}</el-form-item>
+						</el-col>
+						<el-col :span="6">
+							<el-form-item label="场所地址" prop="location" style="display: block">{{ formData.location }}</el-form-item>
+						</el-col>
+					</el-row>
+					<div id="app_event" class="div_map"></div>
+				</el-form>
+			</div>
+			<div class="div_btn" v-if="pageType != 'view'">
+				<el-button size="small" @click="handleCancle">取 消</el-button>
+				<!-- <el-button size="small" @click="resetData" v-if="pageType != 'view'">重置</el-button> -->
+				<el-button size="small" type="primary" :disabled="btnDisable" @click="handleComfirm">确 定</el-button>
+			</div>
+		</div>
+		<span slot="footer" class="dialog-footer">
+			<el-button @click="handleCancle" size="small">关 闭</el-button>
+			<!-- <el-button type="primary" @click="handleComfirm">确 定</el-button> -->
+		</span>
+	</el-dialog>
+</template>
+
+<script>
+import { isMobile } from '@/utils/validate';
+import { mapGetters } from 'vuex';
+import { Loading } from 'element-ui'; // 引入Loading服务
+import { requestPost, requestGet } from '@/js/dai/request';
+import daiMap from '@/utils/dai-map';
+import nextTick from 'dai-js/tools/nextTick';
+let loading; // 加载动画
+let map;
+var search;
+var markers;
+var infoWindowList;
+var geocoder; // 新建一个正逆地址解析类
+
+export default {
+	props: {
+		dialogVisible: {
+			type: Boolean,
+			default: ''
+		},
+		defaultData: {
+			type: Object,
+			default: null
+		},
+		pageType: {
+			type: String,
+			default: ''
+		},
+		detailId: {
+			type: String,
+			default: ''
+		},
+		detailData: {
+			type: Object,
+			default: null
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		}
+	},
+
+	data() {
+		let checkMObile = (rule, value, callback) => {
+			if (value === '') {
+				callback(new Error('请输入联系电话'));
+			} else {
+				if (!isMobile(value)) {
+					callback(new Error('联系电话格式不正确'));
+				}
+				callback();
+			}
+		};
+		return {
+			detailIdcopy:this.detailId,
+			btnDisable: false,
+			user: '',
+			agencyId: '',
+			gridList: [], //所属网格list--场所区域
+			placeTypeList: [], //场所类型
+			resultArray: [{ value: '0', label: '合格' }, { value: '1', label: '不合格' }],
+			equipmentCategoryCodeArray: [],
+			list: {},
+			formData: {
+				equipmentName: '',
+				equipmentCategoryCode: '',
+				principalName: '',
+				location: '',
+				contactNum: ''
+			},
+			dataRule: {
+				equipmentName: [{ required: true, message: '设备名称不能为空', trigger: 'bulr' }],
+				equipmentNum: [{ required: true, message: '设备编号不能为空', trigger: 'bulr' }],
+				principalName: [{ required: true, message: '负责人不能为空', trigger: 'bulr' }],
+				contactNum: [{ required: true, message: '联系电话不能为空', trigger: 'blur' }],
+				location: [{ required: true, message: '所处位置不能为空', trigger: 'blur' }]
+			},
+			//地图
+			loading: false,
+			searchValue: '',
+			searchOptions: []
+		};
+	},
+	watch: {},
+	components: {  },
+	created() {},
+	async mounted() {
+		console.log('detailId', this.detailId);
+		this.user = this.$store.state.user;
+		this.agencyId = this.user.agencyId;
+		this.startLoading();
+		this.loadCategory();
+		// this.loadGrid();
+		// this.loadplaceType();
+		if (this.pageType != 'add') {
+			this.getDetail();
+		} else {
+			this.initMap();
+		}
+		await this.endLoading();
+		this.endLoading();
+	},
+
+	methods: {
+		async loadCategory() {
+			const url = '/sys/dict/data/dictlist';
+
+			let params = {
+				dictType: 'safety_equipment_category'
+			};
+
+			const { data, code, msg } = await requestPost(url, params);
+			if (code === 0) {
+				this.equipmentCategoryCodeArray = data;
+			} else {
+				this.$message.error(msg);
+			}
+		},
+		async loadGrid() {
+			const url = '/gov/org/customergrid/gridoption';
+			let params = {
+				agencyId: this.agencyId,
+				purpose: 'query'
+			};
+			const { data, code, msg } = await requestPost(url, params);
+			if (code === 0) {
+				this.gridList = data;
+			} else {
+				this.$message.error(msg);
+			}
+		},
+		//场所类型
+		async loadplaceType() {
+			const url = '/gov/org/coverage/dict-select-list/enterprise_patrol';
+			let params = {
+				// agencyId: this.agencyId,
+				// purpose: 'query'
+			};
+			const { data, code, msg } = await requestPost(url, params);
+			if (code === 0) {
+				this.placeTypeList = data;
+			} else {
+				this.$message.error(msg);
+			}
+		},
+		async getDetail() {
+			const url = `/actual/base/monitoringEquipment/detail/${this.detailIdcopy}`;
+			const { data, code, msg } = await requestPost(url);
+			if (code === 0) {
+				console.log('详情数据', data);
+				this.formData = { ...data };
+				// this.remoteMethod("青岛");
+				 // this.list = this.searchOptions.map(item => {
+				 //                return { value: item.value, label: item.label };
+				 //            });
+				 //            this.formData.location.push(this.list[0].value);
+				 //            this.remoteMethod(this.list[0].label);//调用远程搜索函数
+				
+				
+					// this.remoteMethod("对对对");
+				this.initMap();
+			
+			} else {
+				this.$message.error(msg);
+			}
+		},
+
+		handleComfirm() {
+			this.save();
+		},
+		async handleAdd() {
+			// this.btnDisable = true;
+			// setTimeout(() => {
+			// 	this.btnDisable = false;
+			// }, 10000);
+			// nextTick(1000);
+			// const form = new Promise((resolve, reject) => {
+			// 	this.$refs['form'].validate(valid => {
+			// 		if (valid) resolve();
+			// 	});
+			// });
+			// const form1 = new Promise((resolve, reject) => {
+			// 	this.$refs['form1'].validate(valid => {
+			// 		if (valid) resolve();
+			// 	});
+			// });
+			// Promise.all([form1, form])
+			// 	.then(() => {
+			// 		this.addFuwu();
+			// 	})
+			// 	.catch(() => {
+			// 		app.util.validateRule(messageObj);
+			// 		this.btnDisable = false;
+			// 	});
+		},
+
+		async save() {
+			console.log('this.formData', this.formData);
+			var url = '';
+			var params = {};
+			if (this.pageType == 'add') {
+				url = '/actual/base/monitoringEquipment/save';
+			} else {
+				url = '/actual/base/monitoringEquipment/update';
+			}
+			params = { ...this.formData };
+			const { data, code, msg } = await requestPost(url, params);
+			if (code === 0) {
+				this.$message.success('操作成功');
+                this.detailIdcopy=data
+				// this.handleCancle();
+			} else if (code >= 8000) {
+				this.$message.error(msg);
+			}
+		},
+		handleCancle() {
+			this.resetData();
+			this.$emit('handleClose');
+		},
+		resetData() {
+			this.$refs.form.resetFields();
+		},
+		// 开启加载动画
+		startLoading() {
+			loading = Loading.service({
+				lock: true, // 是否锁定
+				text: '正在加载……', // 加载中需要显示的文字
+				background: 'rgba(0,0,0,.7)' // 背景颜色
+			});
+		},
+		// 结束加载动画
+		endLoading() {
+			// clearTimeout(timer);
+			if (loading) {
+				loading.close();
+			}
+		}, // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
+		initMap() {
+			let { latitude, longitude } = this.$store.state.user;
+
+			if (this.formData.latitude && this.formData.longitude) {
+				latitude = this.formData.latitude;
+				longitude = this.formData.longitude;
+			}
+			if (!latitude || latitude == '' || latitude == '0') {
+				latitude = 39.9088810666821;
+				longitude = 116.39743841556731;
+			}
+
+			this.$nextTick(() => {
+				map = new daiMap(
+					document.getElementById('app_event'),
+					{ latitude, longitude },
+					{
+						zoom: 16.2, // 设置地图缩放级别
+						pitch: 43.5, // 设置俯仰角
+						rotation: 45 // 设置地图旋转角度
+					}
+				);
+				// 监听地图平移结束
+				map.on('dragend', e => {
+					if (!this.disabled) {
+						this.handleMoveCenter(e);
+					}
+				});
+
+				map.setCenter(latitude, longitude);
+				if (this.formData.latitude) {
+					map.setMarker(latitude, longitude);
+				}
+			});
+		},
+		async handleMoveCenter() {
+			//修改地图中心点
+			const { lat, lng } = map.getCenter();
+			this.formData.latitude = lat;
+			this.formData.longitude = lng;
+			map.setMarker(lat, lng);
+
+			let { msg, data } = await map.getAddress(lat, lng);
+			if (msg == 'success') {
+				this.formData.location = data.address;
+				this.searchValue = data.address;
+				this.searchOptions = [];
+			}
+		},
+		async remoteMethod(query) {
+			console.log("query",query)
+			if (query !== '') {
+				this.loading = true;
+				const { msg, data } = await map.searchNearby(query);
+				this.loading = false;
+				this.resultList = [];
+
+				if (msg == 'success' && data.resultList && data.resultList.length > 0) {
+					if (data.resultList && data.resultList.length > 0) {
+						this.resultList = data.resultList;
+						this.searchOptions = this.resultList.map(item => {
+							return { value: `${item.id}`, label: `${item.address + item.name}` };
+						});
+						console.log("this.searchOptions",this.searchOptions )
+					}
+				} else {
+					this.searchOptions = [
+						{
+							value: '0',
+							label: '未检索到结果'
+						}
+					];
+				}
+			} else {
+				this.searchOptions = [];
+			}
+		},
+		handleClickKey(index) {
+			let selPosition = this.resultList[index];
+			let lonlat = selPosition.lonlat.split(' ');
+			map.setCenter(lonlat[1], lonlat[0]);
+			map.setMarker(lonlat[1], lonlat[0]);
+			this.formData.latitude = lonlat[1];
+			this.formData.longitude = lonlat[0];
+			this.formData.location = selPosition.address + selPosition.name;
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+@import '@/assets/scss/modules/management/form-main.scss';
+@import '@/assets/scss/modules/management/form.scss';
+@import '@/assets/scss/modules/visual/a_customize.scss';
+.el-dialog__body {
+    padding: 30px 80px;
+}
+</style>

src/views/modules/resourceManagement/enterprise/index.vue

@@ -0,0 +1,489 @@
+<template>
+    <div class="g-main">
+        <div>
+            <div class="m-search">
+                <el-form :inline="true" :model="formData" ref="ref_searchform" :label-width="'105px'">
+                    <div>
+                        <el-form-item label="企业名称" prop="equipmentName">
+                            <el-input v-model.trim="formData.equipmentName" class="u-item-width-normal" size="small"
+                                clearable placeholder="请输入"></el-input>
+                        </el-form-item>
+                        <el-form-item label="规模" prop="equipmentNum">
+                            <el-input v-model.trim="formData.equipmentNum" class="u-item-width-normal" size="small"
+                                clearable placeholder="请输入"></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="负责人" prop="location">
+                            <el-input v-model.trim="formData.location" class="u-item-width-normal" size="small"
+                                clearable placeholder="请输入"></el-input>
+                        </el-form-item>
+                        <el-form-item label="联系人" prop="principalName">
+                            <el-input v-model.trim="formData.principalName" class="u-item-width-normal" size="small"
+                                clearable placeholder="请输入"></el-input>
+                        </el-form-item>
+                        <el-form-item label="九小场所分类" prop="latestInspectTime">
+                            <el-select v-model.trim="formData.location" placeholder="请选择" class="u-item-width-normal"
+                                size="small">
+                                <el-option v-for="item in option" :label="item.label" :value="item.value"
+                                    :key="item.value">
+                                </el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="最新检查时间" prop="latestInspectResult">
+                            <el-date-picker class="u-item-width-normal" size="small"
+                                v-model.trim="formData.latestInspectTime"  type="datetime" format="yyyy-MM-dd HH:mm:ss"
+                                placeholder="选择日期"></el-date-picker>
+                        </el-form-item>
+                        <el-form-item label="最新检查结果" prop="latestInspectResult">
+                            <el-select v-model.trim="formData.latestInspectResult" placeholder="请选择" size="small"
+                                clearable class="u-item-width-normal">
+                                <el-option v-for="item in resultArray" :key="item.value" :label="item.label"
+                                    :value="item.value"></el-option>
+                            </el-select>
+                        </el-form-item>
+
+                        <el-row>
+                            <el-col :span="24" align="right">
+                                <el-button style="margin-left: 30px" size="small" type="primary "
+                                    @click="handleSearch">查询</el-button>
+                                <el-button style="margin-left: 10px" size="small" class="diy-button--white"
+                                    @click="resetSearch">重置</el-button>
+                            </el-col>
+                        </el-row>
+                    </div>
+                </el-form>
+            </div>
+            <div class="m-table">
+                <div class="div_btn">
+                    <el-button size="small" type="primary " @click="handleAdd({}, 'add')">新增</el-button>
+                    <el-button class="diy-button--white" size="small"
+                        @click="handleExportModule('room')">下载模板</el-button>
+                    <el-upload :headers="$getElUploadHeaders()" ref="upload" class="upload-btn" action="uploadUlr"
+                        :limit="1" :accept="'.xls,.xlsx'" :with-credentials="true" :show-file-list="false"
+                        :auto-upload="true" :on-progress="handleProgress" :on-success="handleExcelSuccess"
+                        :before-upload="beforeExcelUpload" :http-request="uploadHttpRequest"
+                        style="display: inline-block;margin:0px 10px">
+                        <el-button size="small" class="diy-button--white" :loading="importLoading">导入</el-button>
+                    </el-upload>
+
+                    <el-button @click="handleExport" class="diy-button--white" size="small">导出</el-button>
+                </div>
+                <el-table :data="tableData" border class="m-table-item" style="width: 100%"
+                    @selection-change="handleSelectionChange" :height="maxTableHeight">
+                    <!-- <el-table-column label="" fixed="left" type="selection" align="center" width="50" /> -->
+                    <el-table-column label="序号" fixed="left" type="index" align="center" width="50" />
+                    <el-table-column prop="equipmentName" align="center" label="设备名称"
+                        :show-overflow-tooltip="true"></el-table-column>
+                    <el-table-column prop="equipmentNum" align="center" label="设备编号"></el-table-column>
+
+                    <el-table-column prop="location" label="所处位置" min-width="140" align="center"
+                        :show-overflow-tooltip="true" />
+                    <el-table-column prop="principalName" align="center" label="负责人"
+                        :show-overflow-tooltip="true"></el-table-column>
+                    <el-table-column prop="contactNum" align="center" :show-overflow-tooltip="true"
+                        label="联系电话"></el-table-column>
+                    <el-table-column prop="latestInspectTime" align="center" label="最新检查时间"
+                        :show-overflow-tooltip="true"></el-table-column>
+                    <el-table-column prop="latestInspectResultName" align="center" label="最新结果"
+                        :show-overflow-tooltip="true"></el-table-column>
+                    <el-table-column fixed="right" label="操作" align="center" width="250">
+                        <template slot-scope="scope">
+                            <el-button @click="handleAdd(scope.row, 'view')" type="text" size="small">查看</el-button>
+
+                            <el-button v-if="scope.row.latitude && agencyId == scope.row.agencyId"
+                                style="margin-right: 10px" @click="handleAdd(scope.row, 'edit')" size="small"
+                                type="text">
+                                编辑
+                            </el-button>
+                            <el-button style="margin-right: 10px" @click="handleAdd(scope.row, 'edit')" size="small"
+                                type="text">
+                                巡查记录
+                            </el-button>
+                            <el-button @click="handleDel(scope.row)" v-if="agencyId == scope.row.agencyId" type="text"
+                                size="small" class="">删除</el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
+
+                <div>
+                    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+                        :current-page.sync="pageNo" :page-sizes="[20, 50, 100, 200]" :page-size="parseInt(pageSize)"
+                        layout="sizes, prev, pager, next, total" :total="total"></el-pagination>
+                </div>
+            </div>
+        </div>
+        <div>
+            <addForm v-if="dialogVisible" :dialogVisible="dialogVisible" :pageType="pageType" :disabled="disabled"
+                :detailId="detailId" :detailData="detailData" @handleClose="handleClose" @handleOk="handleOk"
+                @dialogOk="handleEditSuccess" />
+        </div>
+    </div>
+</template>
+
+<script>
+import { requestPost } from '@/js/dai/request';
+import nextTick from 'dai-js/tools/nextTick';
+import { mapGetters } from 'vuex';
+import addForm from './addForm.vue';
+import axios from 'axios';
+
+export default {
+    data() {
+        return {
+            dialogVisible: false,
+            importLoading: false,
+            disabled: false,
+            user: '',
+            agencyId: '',
+            formData: {
+                equipmentName: '',
+                equipmentCategoryCode: '',
+                principalName: '',
+                contactNum: '',
+                address: ''
+            },
+            pageType: 'list', // 列表list 新增add  处理dispose 详情info
+            gridList: [], //所属网格list--场所区域
+            placeTypeList: [], //场所类型
+            tableData: [],
+            resultArray: [{ value: '1', label: '合格' }, { value: '0', label: '不合格' }],
+            equipmentCategoryCodeArray: [],
+            pageNo: 1,
+            pageSize: window.localStorage.getItem('pageSize') || 20,
+            total: 1,
+            detailId: '',
+            detailData: {},
+            multipleSelection: [],
+            rowObj: {},
+            option: [
+                {}
+            ]
+        };
+    },
+    components: { addForm },
+    created() { },
+    computed: {
+        maxTableHeight() {
+            return this.$store.state.inIframe ? this.clientHeight - 410 + this.iframeHeigh : this.clientHeight - 410;
+        },
+        ...mapGetters(['clientHeight', 'iframeHeight'])
+    },
+    watch: {},
+    mounted() {
+        this.user = this.$store.state.user;
+        this.agencyId = this.user.agencyId;
+        this.loadGrid();
+        this.loadplaceType();
+        this.loadCategory();
+        this.getTableData();
+    },
+    methods: {
+        handleSelectionChange(val) {
+            this.multipleSelection = [];
+            val.forEach(element => {
+                this.multipleSelection.push(element.icEventId);
+            });
+        },
+        handleSearch(val) {
+            console.log(this.formData);
+            this.pageNo = 1;
+            this.getTableData();
+        },
+        async loadGrid() {
+            const url = '/gov/org/customergrid/gridoption';
+            let params = {
+                agencyId: this.agencyId,
+                purpose: 'query'
+            };
+            const { data, code, msg } = await requestPost(url, params);
+            if (code === 0) {
+                this.gridList = data;
+            } else {
+                this.$message.error(msg);
+            }
+        },
+        //场所类型
+        async loadplaceType() {
+            const url = '/gov/org/coverage/dict-select-list/enterprise_patrol';
+            let params = {
+                // agencyId: this.agencyId,
+                // purpose: 'query'
+            };
+            const { data, code, msg } = await requestPost(url, params);
+            if (code === 0) {
+                this.placeTypeList = data;
+            } else {
+                this.$message.error(msg);
+            }
+        },
+        //设备类型
+        async loadCategory() {
+            const url = '/sys/dict/data/dictlist';
+
+            let params = {
+                dictType: 'safety_equipment_category'
+            };
+
+            const { data, code, msg } = await requestPost(url, params);
+            if (code === 0) {
+                this.equipmentCategoryCodeArray = data;
+            } else {
+                this.$message.error(msg);
+            }
+        },
+        async handleImport() {
+            // 导入
+        },
+        async handleExport() {
+            // 导出
+            const url = '/actual/base/monitoringEquipment/export';
+            const { pageSize, pageNo, formData } = this;
+            axios({
+                url: window.SITE_CONFIG['apiURL'] + url,
+                method: 'post',
+                data: {
+                    pageSize,
+                    pageNo,
+                    ...formData
+                },
+                responseType: 'blob'
+            })
+                .then(res => {
+                    let fileName = window.decodeURI(res.headers['content-disposition'].split(';')[1].split('=')[1]);
+                    console.log('filename', fileName);
+                    let blob = new Blob([res.data], { type: 'application/vnd.ms-excel' });
+                    var url = window.URL.createObjectURL(blob);
+                    var aLink = document.createElement('a');
+                    aLink.style.display = 'none';
+                    aLink.href = url;
+                    aLink.setAttribute('download', fileName);
+                    document.body.appendChild(aLink);
+                    aLink.click();
+                    document.body.removeChild(aLink); //下载完成移除元素
+                    window.URL.revokeObjectURL(url); //释放掉blob对象
+                })
+                .catch(err => {
+                    console.log('获取导出情失败', err);
+                    return this.$message.error('网络错误');
+                });
+        },
+        handleAdd(row, type) {
+            if (row.id) {
+                this.detailId = row.id;
+            }
+            this.pageType = type;
+            if (type == 'view') {
+                this.disabled = true;
+            } else {
+                this.disabled = false;
+            }
+            this.dialogVisible = true;
+        },
+        handleClose() {
+            this.dialogVisible = false;
+            this.pageType = 'list';
+            this.detailId = '';
+            this.getTableData();
+        },
+        handleOk() {
+            this.pageType = 'list';
+            this.detailId = '';
+            this.pageNo = 1;
+            this.getTableData();
+        },
+        handleEditSuccess() {
+            this.handleClose();
+            this.getTableData();
+        },
+        async handleDel(rowData) {
+            let message = '确认删除?';
+            this.$confirm(message, '提示', {
+                confirmButtonText: '确定',
+                cancelButtonText: '取消',
+                type: 'warning'
+            })
+                .then(() => {
+                    this.del(rowData.id);
+                })
+                .catch(err => { });
+        },
+        async del(id) {
+            const url = `/actual/base/monitoringEquipment/delete`;
+            let idsArr = [id];
+            const { data, code, msg } = await requestPost(url, idsArr);
+            if (code === 0) {
+                this.$message.success('删除成功！');
+                this.getTableData();
+            } else {
+                this.$message.error('操作失败！');
+            }
+        },
+        async getTableData() {
+            const url = '/actual/base/monitoringEquipment/page';
+            // const url = 'http://yapi.elinkservice.cn/mock/330/actual/base/enterprise/list';
+            const { pageSize, pageNo, formData } = this;
+            const { data, code, msg } = await requestPost(url, {
+                pageSize,
+                pageNo,
+                ...formData
+            });
+            if (code === 0) {
+                this.total = data.total || 0;
+                this.tableData = data.list
+                    ? data.list.map(item => {
+                        return item;
+                    })
+                    : [];
+            } else {
+                this.$message.error(msg);
+            }
+        },
+        handleSizeChange(val) {
+            this.pageSize = val;
+            window.localStorage.setItem('pageSize', val);
+            this.getTableData();
+        },
+        handleCurrentChange(val) {
+            this.pageNo = val;
+            this.getTableData();
+        },
+        resetSearch() {
+            this.formData = {
+                equipmentName: '',
+                equipmentCategoryCode: '',
+                principalName: '',
+                contactNum: '',
+                address: ''
+            };
+            this.pageNo = 1;
+            this.getTableData();
+        },
+        async handleExportModule() {
+            let url = '/actual/base/monitoringEquipment/downloadTemplate';
+            let params = {};
+            await this.$http({
+                method: 'POST',
+                url,
+                responseType: 'blob',
+                data: params
+            })
+                .then(res => {
+                    // this.download(res.data, title + '.xls')
+                    if (res.headers['content-disposition']) {
+                        let fileName = window.decodeURI(res.headers['content-disposition'].split(';')[1].split('=')[1]);
+                        console.log('filename', fileName);
+                        let blob = new Blob([res.data], {
+                            type: 'application/vnd.ms-excel'
+                        });
+                        var url = window.URL.createObjectURL(blob);
+                        var aLink = document.createElement('a');
+                        aLink.style.display = 'none';
+                        aLink.href = url;
+                        aLink.setAttribute('download', fileName);
+                        document.body.appendChild(aLink);
+                        aLink.click();
+                        document.body.removeChild(aLink); //下载完成移除元素
+                        window.URL.revokeObjectURL(url); //释放掉blob对象
+                    } else this.$message.error('下载失败');
+                })
+                .catch(err => {
+                    console.log('err', err);
+                    return this.$message.error('网络错误');
+                });
+        },
+        handleExcelSuccess(res, file) {
+            if (res.code === 0 && res.msg === 'success') {
+                console.log('resss---ppp', res);
+            } else {
+                this.$message.error(res.msg);
+            }
+        },
+        handleProgress(event, file, fileList) {
+            console.log('percentage', file.percentage);
+        },
+
+        beforeExcelUpload(file) {
+            console.log('file', file);
+            const isType = file.type === 'application/vnd.ms-excel';
+            const isTypeComputer = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
+            const fileType = isType || isTypeComputer;
+            const isLt1M = file.size / 1024 / 1024 < 10;
+            if (!fileType) {
+                this.$message.error('上传文件只能是xls/xlsx格式！');
+            }
+
+            if (!isLt1M) {
+                this.$message.error('上传文件大小不能超过 10MB!');
+            }
+            return fileType && isLt1M;
+        },
+
+        async uploadHttpRequest(file) {
+            this.importLoading = true;
+            this.importBtnTitle = '正在上传中...';
+            this.$message({
+                showClose: true,
+                dangerouslyUseHTMLString: true,
+                message: "导入中，请到系统管理-<a id='clickA' style='cursor: pointer;'>导入记录</a>中查看进度",
+                duration: 3000
+            });
+            let than = this;
+            document.getElementById('clickA').addEventListener('click', function () {
+                than.$router.replace('/main/importRecord-index');
+            });
+            const formData = new FormData(); //FormData对象，添加参数只能通过append('key', value)的形式添加
+            formData.append('file', file.file); //添加文件对象
+            formData.append('code', ''); //添加文件对象
+            await this.$http
+                .post('/actual/base/monitoringEquipment/import', formData)
+                .then(res => {
+                    console.log('res-up', res);
+                    if (res.data.code == 0 && res.data.msg == 'success') {
+                        console.log(res.data.data);
+                        const data = res.data.data;
+
+                        this.dataList = [
+                            ...Object.keys(data.option.exist).map(k => {
+                                return {
+                                    index: k,
+                                    srcField: data.option.exist[k],
+                                    exist: true,
+                                    field: data.option.exist[k]
+                                };
+                            }),
+                            ...Object.keys(data.option.notExist).map(k => {
+                                return {
+                                    index: k,
+                                    srcField: data.option.notExist[k],
+                                    exist: false,
+                                    field: ''
+                                };
+                            })
+                        ];
+                        this.importOption = data.option;
+                        this.importCode = data.code;
+                        this.fileData = file;
+                    } else this.$message.error(res.data.msg);
+                })
+                .catch(err => {
+                    console.log('失败', err);
+                    file.onError(); //上传失败的文件会从文件列表中删除
+                    // this.$message.error('导入失败')
+                });
+            this.importLoading = false;
+            this.importBtnTitle = '导入';
+            this.$refs.upload.clearFiles();
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+@import '@/assets/scss/modules/management/list-main.scss';
+
+.m-search {
+    .u-item-width-normal {
+        width: 200px;
+    }
+}
+</style>