<template>
|
<div>
|
<a-card :bordered="false" style="margin-top: 24px">
|
<div class="tableList">
|
<div class="tableListForm">
|
<a-form-model @submit="handleSearch" layout="horizontal">
|
<a-row :gutter="[8, 0]">
|
<a-col :span="10">
|
<a-button
|
icon="plus"
|
type="primary"
|
@click="() => this.handleModalVisible(true)"
|
style="margin-left: 25px"
|
>新建
|
</a-button>
|
<a-button
|
icon="plus"
|
type="primary"
|
@click="() => this.handleModalVisible1(true)"
|
style="margin-left: 25px"
|
>批量修改准校值
|
</a-button>
|
</a-col>
|
<a-col :span="4">
|
<a-form-model-item
|
:labelCol="{ span: 2 }"
|
:wrapperCol="{ span: 10 }"
|
>
|
<a-select
|
placeholder="选择组织(输入名称搜索)"
|
allow-clear
|
show-search
|
style="width: 200px"
|
:filter-option="filterOption"
|
@change="handleChange"
|
>
|
<a-select-option
|
v-for="(item, index) in orgData"
|
:key="index"
|
:value="item.id"
|
>
|
{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="4">
|
<a-form-model-item
|
:labelCol="{ span: 2 }"
|
:wrapperCol="{ span: 10 }"
|
>
|
<a-select
|
placeholder="选择站点(输入名称搜索)"
|
allow-clear
|
show-search
|
style="width: 200px"
|
:filter-option="filterOption"
|
@change="handleChange1"
|
>
|
<a-select-option
|
v-for="(item, index) in MonitorPoints"
|
:key="index"
|
:value="item.id"
|
>{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="6">
|
<a-form-item
|
:labelCol="{ span: 2 }"
|
:wrapperCol="{ span: 12 }"
|
fieldDecoratorId="name"
|
v-bind="searchFormLayout"
|
>
|
<a-input
|
v-model="serch.name"
|
placeholder="请输入设备名称或者mac号"
|
/>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
</a-form-model>
|
</div>
|
<av-standard-table
|
:dataSource="dataSource"
|
:selectedRows="selectedRows"
|
:columns="columns"
|
:paginationProps="pagination"
|
:loading="tableLoading"
|
@tableChange="handlerTableChange"
|
@selectChange="handlerSelectChange"
|
></av-standard-table>
|
</div>
|
</a-card>
|
|
<a-modal
|
title="批量修改校准值"
|
:visible="visibleCreateModal1"
|
@cancel="handleCreateModalCancel1"
|
destroyOnClose
|
class="modalStylezhi"
|
okText="保存"
|
>
|
<template #footer>
|
<a-button key="back" @click="handleCreateModalCancel1">关闭</a-button>
|
<a-button
|
key="submit"
|
type="primary"
|
:loading="loading"
|
@click="handleOk"
|
>提交</a-button
|
>
|
</template>
|
<div class="modalone">
|
<div class="theone">
|
<a-select
|
ref="select"
|
v-model="selectvalue1"
|
allowClear
|
placeholder="请选择因子"
|
:options="selectoptions"
|
@change="handleChangevalue1"
|
style="margin-top: 40px; margin-left: 10px; width: 130px"
|
></a-select>
|
</div>
|
<div class="thetwo">
|
<div style="height: 50px">
|
<div style="margin-top: 15px; margin-left: 20px">
|
<span style="font-size: 17.5px; color: black">AQI值 :</span
|
><a-select
|
ref="select"
|
v-model="AQIvalue1"
|
style="width: 100px; margin-left: 16px"
|
allowClear
|
:options="AQIoptions"
|
@change="AQIhandleChange"
|
></a-select>
|
<a-input
|
v-model="AQIvalue"
|
style="width: 100px; margin-left: 15px"
|
@blur="ceAQIhandleChange"
|
/>
|
</div>
|
</div>
|
<div style="height: 50px">
|
<div style="margin-left: 20px">
|
<span style="font-size: 17.5px; color: black">测量值 :</span
|
><a-select
|
ref="select"
|
v-model="ceAQIvalue"
|
style="width: 100px; margin-left: 10px"
|
allowClear
|
:options="ceAQIoptions"
|
@change="AQIhandleChange"
|
></a-select>
|
<a-input
|
v-model="ceAQIvaluein"
|
style="width: 100px; margin-left: 15px"
|
@blur="ceAQIhandleChange"
|
/>
|
</div>
|
</div>
|
</div>
|
<div class="thethree">
|
<div style="margin-left: 20px; margin-top: 40px">
|
<span style="font-size: 16px; color: black">最终公式:</span>
|
<span style="font-size: 17.5px; color: black">
|
(原AQI系数 {{ AQIvalue1 }}
|
<span style="color: #cbcb28">{{ AQIvalue }} </span>) + (原测量系数
|
{{ ceAQIvalue
|
}}<span style="color: #cbcb28"> {{ ceAQIvaluein }}</span
|
>)</span
|
>
|
</div>
|
</div>
|
</div>
|
<div class="modaltwo">
|
<a-select
|
placeholder="选择站点(输入名称搜索)"
|
allow-clear
|
show-search
|
style="width: 200px"
|
>
|
<a-select-option
|
v-for="(item, index) in MonitorPoints"
|
:key="index"
|
:value="item.id"
|
@click="handleChange2"
|
>{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</div>
|
<div>
|
<a-table
|
:row-selection="{
|
getCheckboxProps: this.rowSelection.getCheckboxProps,
|
onChange: this.rowSelectionChange,
|
}"
|
:columns="tablecolumns"
|
:data-source="datatable"
|
style="margin-top: 20px"
|
bordered
|
row-key="name"
|
:scroll="{ x: 900, y: 300 }"
|
:pagination="false"
|
>
|
<template #bodyCell="{ column, text }">
|
<template v-if="column.dataIndex === 'name'">
|
<a>{{ text }}</a>
|
</template>
|
</template>
|
</a-table>
|
</div>
|
</a-modal>
|
|
<a-modal
|
title="添加-设备"
|
destroyOnClose
|
:visible="visibleCreateModal"
|
@ok="handleCreateModalOk"
|
@cancel="handleCreateModalCancel"
|
okText="保存"
|
class="modalStyle"
|
>
|
<a-row :gutter="[8, 0]" style="border: 0px">
|
<a-col :span="12">
|
<a-button
|
style="background-color: #00a0e9; color: white"
|
@click="showMap1()"
|
>
|
经纬度坐标配置
|
</a-button>
|
</a-col>
|
</a-row>
|
<a-form style="margin: 0px; padding: 0px" :form="form">
|
<a-row :gutter="[8, 0]" style="border: 0px">
|
<!-- wrapperCol 内容区大小（指input宽度） labelCol 左边留白大小 两者之和不能》24-->
|
<a-col :span="12">
|
<a-form-item
|
has-feedback
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="名称"
|
>
|
<a-input
|
placeholder="设备名称"
|
type="string"
|
v-decorator="['deviceName', { rules: [{ required: true }] }]"
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="mac"
|
>
|
<a-input
|
placeholder="mac地址"
|
type="string"
|
v-decorator="['mac', { rules: [{ required: true }] }]"
|
/>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="经度"
|
>
|
<a-input
|
v-decorator="[
|
'jingdu',
|
{
|
rules: [
|
{ required: true },
|
{
|
message: '请输入正确的经度',
|
pattern: /^[+-]?\d+(\.\d+)?$/,
|
},
|
],
|
},
|
]"
|
placeholder="-180~180之间"
|
:disabled="true"
|
type="string"
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="纬度"
|
>
|
<a-input
|
:disabled="true"
|
v-decorator="[
|
'weidu',
|
{
|
rules: [
|
{ required: true },
|
{
|
message: '请输入正确的纬度',
|
pattern: /^[+-]?\d+(\.\d+)?$/,
|
},
|
],
|
},
|
]"
|
placeholder="-90~90之间"
|
type="string"
|
/>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="设备型号"
|
>
|
<a-select
|
placeholder="选择型号（输入名称搜索）"
|
type="string"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
v-decorator="['model', { rules: [{ required: true }] }]"
|
>
|
<a-select-option
|
v-for="(item, index) in model"
|
:key="index"
|
:value="item.id"
|
>{{ item.name }}</a-select-option
|
>
|
</a-select>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="维护人"
|
>
|
<a-select
|
placeholder="选择维护人"
|
mode="multiple"
|
type="string"
|
allow-clear
|
v-decorator="['operator', { rules: [{ required: false }] }]"
|
>
|
<a-select-option
|
v-for="(item, index) in operators"
|
:key="index"
|
:value="item.id"
|
>{{ item.user_name }}
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="生产时间"
|
>
|
<a-date-picker
|
@change="onStartTimeChange"
|
v-decorator="['createTime', { rules: [{ required: false }] }]"
|
format="YYYY-MM-DD HH:mm:ss"
|
:show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
|
style="width: 299px"
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
has-feedback
|
label="安装时间"
|
>
|
<a-date-picker
|
@change="onEndTimeChange"
|
v-decorator="['updateTime', { rules: [{ required: false }] }]"
|
format="YYYY-MM-DD HH:mm:ss"
|
:show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
|
style="width: 299px"
|
/>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="监控站点"
|
>
|
<a-select
|
type="string"
|
placeholder="选择监控站点（输入名称搜索）"
|
v-decorator="['monitorPoint', { rules: [{ required: true }] }]"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in MonitorPoints"
|
:key="index"
|
:value="item.id"
|
>{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="行业"
|
>
|
<a-select
|
placeholder="选择所属行业"
|
mode="multiple"
|
v-decorator="['profession', { rules: [{ required: true }] }]"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in Professions"
|
:key="index"
|
:value="item.dataKey"
|
>{{ item.dataValue }}
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="设备工艺"
|
type="string"
|
>
|
<a-select
|
placeholder="选择设备工艺"
|
v-decorator="['tech', { rules: [{ required: false }] }]"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
@change="changeTech"
|
>
|
<a-select-option
|
v-for="(item, index) in Techs"
|
:key="index"
|
:value="item.dataKey"
|
>{{ item.dataValue }}</a-select-option
|
>
|
</a-select>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="设备检测器"
|
>
|
<a-select
|
placeholder="选择设备检测器"
|
v-decorator="['detector', { rules: [{ required: false }] }]"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in this.Detectors"
|
:key="index"
|
:value="item.dataKey"
|
>{{ item.dataValue }}
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]" v-if="techFlag">
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="烟道面积(m²)"
|
>
|
<a-input
|
v-decorator="['area', { rules: [{ required: false }] }]"
|
placeholder="烟道面积"
|
type="string"
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="烟道风速(m/s)"
|
>
|
<a-input
|
v-decorator="['speed', { rules: [{ required: false }] }]"
|
placeholder="烟道风速"
|
type="string"
|
/>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="政府站点位置"
|
>
|
<a-cascader
|
:options="areaData"
|
placeholder="双击选择城市(为显示城市下的政府站点)"
|
change-on-select
|
@change="positionLevel"
|
labelInValue
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="政府站点"
|
has-feedback
|
prop="position"
|
>
|
<a-select
|
placeholder="政府站点"
|
v-decorator="['govMonitor', { rules: [{ required: false }] }]"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in govMonitors"
|
:key="index"
|
:value="item.guid"
|
>{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="设备采购商"
|
>
|
<a-select
|
placeholder="选择设备采购商"
|
v-decorator="['purchaser', { rules: [{ required: false }] }]"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in this.Purchasers"
|
:key="index"
|
:value="item.dataKey"
|
>{{ item.dataValue }}
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
has-feedback
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="行政区划"
|
>
|
<a-input
|
disabled="disabled"
|
v-decorator="[
|
'town',
|
{ rules: [{ required: true, message: '行政区划不能为空' }] },
|
]"
|
placeholder="设备安装的行政区划（镇/街道）"
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-item
|
has-feedback
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="具体地址"
|
>
|
<a-input
|
placeholder="具体地址"
|
type="string"
|
v-decorator="['address', { rules: [{ required: false }] }]"
|
/>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
</a-form>
|
<pick-coordinate1
|
v-if="addMapFlag"
|
:typeOperation="typeOperation"
|
@mapFlag1="receiveFlag1"
|
@sendLonLat="receiveLomLat"
|
/>
|
<!-- <pick-coordinate :mapUrl="mapUrl" :mapRecord="mapRecord" v-if="!mapFlag" @mapFlag="receiveFlag"/>-->
|
</a-modal>
|
<a-modal
|
title="编辑-设备"
|
destroyOnClose
|
:visible="editTaskFormVisible"
|
@ok="handleEditModalOk"
|
@cancel="handleEditModalCancel"
|
okText="保存"
|
class="modalStyle"
|
>
|
<a-form-model
|
style="margin: 0px; padding: 0px"
|
:model="editBeforeData"
|
:rules="rules"
|
ref="editRulesForm"
|
>
|
<a-row :gutter="[8, 0]" style="border: 0px">
|
<a-col :span="12">
|
<a-button
|
style="background-color: #00a0e9; color: white"
|
@click="showMap2()"
|
>
|
经纬度坐标修改
|
</a-button>
|
</a-col>
|
</a-row>
|
<a-row :gutter="[8, 0]" style="border: 0px">
|
<!-- wrapperCol 内容区大小（指input宽度） labelCol 左边留白大小 两者之和不能》24-->
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="名称"
|
prop="name"
|
>
|
<a-input v-model="editBeforeData.name" placeholder="设备名称" />
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="mac"
|
prop="mac"
|
>
|
<a-input v-model="editBeforeData.mac" placeholder="mac地址" />
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="经度"
|
prop="longitude"
|
>
|
<a-input
|
disabled="disabled"
|
v-model="editBeforeData.longitude"
|
placeholder="-180~180之间"
|
type="string"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="纬度"
|
prop="latitude"
|
>
|
<a-input
|
disabled="disabled"
|
v-model="editBeforeData.latitude"
|
placeholder="-90~90之间"
|
type="string"
|
/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="设备型号"
|
prop="version.id"
|
>
|
<a-select
|
v-model="editBeforeData.version.id"
|
placeholder="选择型号（输入名称搜索）"
|
type="string"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in this.model"
|
:key="index"
|
:value="item.id"
|
>{{ item.name }}</a-select-option
|
>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="维护人"
|
>
|
<a-select
|
v-model="selectMaintainer"
|
placeholder="选择维护人"
|
mode="multiple"
|
type="string"
|
allow-clear
|
option-label-prop="lable"
|
>
|
<a-select-option
|
v-for="(item, index) in this.operators"
|
:key="index"
|
:value="item.id"
|
:lable="item.user_name"
|
>{{ item.user_name }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="生产时间"
|
>
|
<a-date-picker
|
v-model="editBeforeData.createTime"
|
@change="onStartTimeChange"
|
format="YYYY-MM-DD HH:mm:ss"
|
:show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
|
style="width: 299px"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
has-feedback
|
label="安装时间"
|
>
|
<a-date-picker
|
@change="onEndTimeChange"
|
v-model="editBeforeData.installTime"
|
format="YYYY-MM-DD HH:mm:ss"
|
:show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
|
style="width: 299px"
|
/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="监控站点"
|
prop="monitorPoint.id"
|
>
|
<a-select
|
v-model="editBeforeData.monitorPoint.id"
|
type="string"
|
placeholder="选择监控站点（输入名称搜索）"
|
allow-clear
|
:filter-option="filterOption"
|
@change="resetMonitor"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in this.MonitorPoints"
|
:key="index"
|
:value="item.id"
|
>{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="行业"
|
prop="profession"
|
>
|
<a-select
|
v-model="editBeforeData.profession.id"
|
placeholder="选择所属行业"
|
mode="multiple"
|
option-label-prop="lable"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in this.Professions"
|
:key="index"
|
:value="item.dataKey"
|
:lable="item.dataValue"
|
>{{ item.dataValue }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="设备工艺"
|
type="string"
|
>
|
<a-select
|
v-model="editBeforeData.tech.id"
|
placeholder="选择设备工艺"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
@change="editTech"
|
>
|
.
|
|
<a-select-option
|
v-for="(item, index) in this.Techs"
|
:key="index"
|
:value="Number(item.dataKey)"
|
>{{ item.dataValue }}</a-select-option
|
>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="设备检测器"
|
>
|
<a-select
|
v-model="editBeforeData.detector.id"
|
placeholder="选择设备检测器"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in this.Detectors"
|
:key="index"
|
:value="Number(item.dataKey)"
|
>{{ item.dataValue }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row :gutter="[8, 0]" v-if="editTechFlag">
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="烟道面积(m²)"
|
>
|
<a-input
|
v-model="editBeforeData.extand.area"
|
placeholder="烟道面积"
|
type="string"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="烟道风速(m/s)"
|
>
|
<a-input
|
v-model="editBeforeData.extand.speed"
|
placeholder="烟道风速"
|
type="string"
|
/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="位置"
|
>
|
<a-cascader
|
:options="areaData"
|
v-model="editBeforeData.positionBack"
|
placeholder="双击选择城市(为显示城市下的政府站点)"
|
change-on-select
|
@change="positionLevel"
|
labelInValue
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="政府站点"
|
has-feedback
|
prop="position"
|
>
|
<a-select
|
placeholder="政府站点"
|
v-model="editBeforeData.guid"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in govMonitors"
|
:key="index"
|
:value="item.guid"
|
>{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
<a-row :gutter="[8, 0]">
|
<a-col :span="12">
|
<a-form-model-item
|
:labelCol="{ span: 5 }"
|
has-feedback
|
:wrapperCol="{ span: 19 }"
|
label="设备采购商"
|
>
|
<a-select
|
v-model="editBeforeData.purchaser.id"
|
placeholder="选择设备采购商"
|
allow-clear
|
:filter-option="filterOption"
|
show-search
|
>
|
<a-select-option
|
v-for="(item, index) in this.Purchasers"
|
:key="index"
|
:value="Number(item.dataKey)"
|
>{{ item.dataValue }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
has-feedback
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="具体地址"
|
>
|
<a-input
|
v-model="editBeforeData.address"
|
placeholder="设备安装的具体地址"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
has-feedback
|
:labelCol="{ span: 5 }"
|
:wrapperCol="{ span: 19 }"
|
label="行政区划"
|
prop="town.townName"
|
>
|
<a-input
|
disabled="disabled"
|
v-model="editBeforeData.town.townName"
|
placeholder="设备安装的行政区划（镇/街道）"
|
/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
</a-form-model>
|
<pick-coordinate1
|
v-if="editMapFlag"
|
:typeOperation="typeOperation"
|
:lnglat="editBeforeData.latitude + ',' + editBeforeData.longitude"
|
@mapFlag1="receiveFlag2"
|
@editLonLat="receiveLomLat1"
|
/>
|
</a-modal>
|
<pick-coordinate
|
:mapUrl="mapUrl"
|
:mapRecord="mapRecord"
|
v-if="!mapFlag"
|
@mapFlag="receiveFlag"
|
/>
|
<Calibration
|
:caliRecord="caliRecord"
|
:wFlag="visibleFlag"
|
@cFlag="turnFlag"
|
/>
|
</div>
|
</template>
|
|
<script lang="tsx">
|
import {Component, Prop, Vue, Model, Watch} from "vue-property-decorator";
|
import type { TableProps, TableColumnType } from 'ant-design-vue';
|
import moment from "moment";
|
import { get, post } from "@/util/request";
|
import UpdateTaskForm from "./components/UpdateTaskFormRole.vue";
|
import DistributionMenu from "./components/DistributionMenu.vue";
|
import PickCoordinate from "@/components/map/pickCoordinate.vue";
|
import PickCoordinate1 from "@/components/map/pickCoordinate1.vue";
|
import Calibration from '@/components/device/calibration.vue';
|
import org from "@/util/org";
|
import axios from "axios";
|
import { jsonp } from 'vue-jsonp'
|
import any = jasmine.any;
|
|
const statusMap = ["default", "processing", "success", "error"];
|
const status = ["关闭", "运行中", "已上线", "异常"];
|
|
@Component({
|
components: {
|
UpdateTaskForm,
|
DistributionMenu,
|
PickCoordinate,
|
PickCoordinate1,
|
Calibration
|
}
|
})
|
export default class devicesBasic extends Vue {
|
private editMapFlag: boolean = false
|
private typeOperation: string = ''
|
private serch: any = {
|
name: ""
|
};
|
|
private searchFormLayout: any = {
|
labelCol: {
|
span: 5
|
},
|
wrapperCol: {
|
span: 18,
|
offset: 1
|
}
|
};
|
private form: any = {};
|
|
@Watch("serch.name")
|
private watchsearchInform(newVal: string, oldval: string) {
|
if (newVal === '') {
|
this.current = 1
|
}
|
this.handleSearch();
|
}
|
|
private editBeforeData: any = {
|
id: '',
|
name: '',
|
mac: '',
|
longitude: '',
|
latitude: '',
|
version: {
|
id: '',
|
name: ''
|
},
|
operators: null,
|
installTime: '',
|
createTime: '',
|
monitorPoint: {
|
id: '',
|
name: ''
|
},
|
profession: {
|
id: '',
|
name: ''
|
},
|
tech: {
|
id: '',
|
name: ''
|
},
|
detector: {
|
id: '',
|
name: ''
|
},
|
purchaser: {
|
id: '',
|
name: ''
|
},
|
address: '',
|
extand: {
|
area: '',
|
speed: ''
|
},
|
positionBack: [],
|
guid: undefined,
|
town: {
|
townCode: 0,
|
townName: ''
|
}
|
}
|
|
private expandForm: boolean = false;
|
|
private selectedRowKeys: any[] = [];
|
|
private selectedRows: any[] = [];
|
|
private tableLoading: boolean = false;
|
|
private moment: any = moment;
|
|
private dataSource: any[] = [];
|
|
private model: any[] = []; //设备型号
|
private operators: any[] = []; //维护人
|
private MonitorPoints: any[] = []; //所有站点
|
private Professions: any[] = []; //行业
|
private Techs: any[] = []; //所有工艺
|
private Detectors: any[] = []; // 所有设备检测器
|
private Purchasers: any[] = []; //所有采购商
|
private town_code!: number // 新增设备的经纬度区域code用于新增
|
|
private visibleCreateModal: boolean = false;
|
|
private visibleCreateModal1: boolean = false;
|
|
private editTaskFormVisible: boolean = false;
|
|
private distributionMenuVisible: boolean = false;
|
|
private createForm: any = null;
|
|
private editRecord: any = {};
|
|
private pagination: any = {
|
total: 0,
|
current: 1,
|
pageSize: 10,
|
showSizeChanger: true,
|
showQuickJumper: true,
|
pageSizeOptions: ["10", "30", "60", "100"],
|
showTotal: (total: number) => `共有 ${this.pagination.total} 条数据`, //分页中显示总的数据
|
};
|
|
private updateRecord1: any = {};
|
private selectvalue1:any = '请选择因子';
|
private selectoptions:any[]=[
|
{
|
value: 'a34004',
|
label: 'PM2.5',
|
},
|
{
|
value: 'a34002',
|
label: 'PM10',
|
},
|
{
|
value: 'a05024',
|
label: '臭氧',
|
},
|
{
|
value: 'a21004',
|
label: '二氧化氮',
|
},
|
{
|
value: 'a21026',
|
label: '二氧化硫',
|
},
|
{
|
value: 'a21005',
|
label: '一氧化碳',
|
},
|
{
|
value: 'a99054',
|
label: 'TVOC',
|
},
|
]
|
private AQIvalue1:any = '+';
|
private ceAQIvalue:any = '+';
|
private ceAQIvaluein:number = 0.01;
|
private AQIvalue:number = 0.01;
|
private AQIoptions:any[]=[
|
{
|
value: '+',
|
label: '+',
|
},
|
{
|
value: '-',
|
label: '-',
|
},
|
{
|
value: '*',
|
label: '*',
|
},
|
{
|
value: '/',
|
label: '/',
|
},
|
]
|
private ceAQIoptions:any[]=[
|
{
|
value: '+',
|
label: '+',
|
},
|
{
|
value: '-',
|
label: '-',
|
},
|
{
|
value: '*',
|
label: '*',
|
},
|
{
|
value: '/',
|
label: '/',
|
},
|
]
|
private changesen:number=0
|
private handleChangevalue1(value: string){
|
console.log(this.changesen);
|
if(this.changesen===1){
|
this.handleChange2(this.reskey);
|
}
|
}
|
private AQIhandleChange(value: string){
|
console.log(this.changesen);
|
if(this.changesen===1){
|
this.handleChange2(this.reskey);
|
}
|
}
|
private ceAQIhandleChange(value: string){
|
console.log(this.changesen);
|
if(this.changesen===1){
|
this.handleChange2(this.reskey);
|
}
|
}
|
private tablecolumns:TableColumnType<datatable>=[
|
{
|
title: "名称",
|
dataIndex: "name"
|
},
|
{
|
title: '修改前',
|
dataIndex: 'value',
|
},
|
{
|
title: '修改后',
|
dataIndex: 'agehou',
|
},
|
]
|
private datatable:any[]=[
|
// {
|
// key: '1',
|
// name: 'John Brown',
|
// age: 'aqi*0.93+cel*0.07',
|
// age1:0.93,
|
// age2:0.07,
|
// address: 'New York No. 1 Lake Park',
|
// agehou:''
|
// },
|
// {
|
// key: '2',
|
// name: 'Jim Green',
|
// age: 'aqi*0.93+cel*0.07',
|
// age1:0.93,
|
// age2:0.07,
|
// address: 'London No. 1 Lake Park',
|
// agehou:''
|
// },
|
// {
|
// key: '3',
|
// name: 'Joe Black',
|
// age: 'aqi*0.93+cel*0.07',
|
// age1:0.93,
|
// age2:0.07,
|
// address: 'Sidney No. 1 Lake Park',
|
// agehou:''
|
// }
|
]
|
|
private rowSelectionChange(selectedRowKeys: string[], selectedRows: DataType[]){
|
// console.log(selectedRows);
|
this.selectedtable=selectedRows
|
}
|
private selectedtable:any[]=[]
|
private rowSelection:TableProps['rowSelection']={
|
onChange: (selectedRowKeys: string[], selectedRows: DataType[]) => {
|
this.selectedtable=selectedRows
|
// console.log(this.selectedtable);
|
},
|
getCheckboxProps: (record: DataType) => ({
|
name: record.name,
|
}),
|
}
|
private handleOk(){
|
// console.log(this.selectedtable);
|
post('deviceAdjustValue/updateAllAdjust',{
|
AdjustForm:this.selectedtable
|
}).then((res:any)=>{
|
console.log(res);
|
if(res.data.code == 0){
|
this.$message.success('操作成功')
|
this.handleCreateModalCancel1()
|
}
|
})
|
// this.loading = true;
|
// setTimeout(() => {
|
// this.loading = false;
|
// }, 2000);
|
}
|
|
private columns: any[] = [
|
{
|
title: "序号",
|
dataIndex: "key",
|
key: "key",
|
align: "center",
|
customRender: (text:any, record:any, index:any) => `${index + 1}`,
|
width: 60,
|
},
|
{
|
title: "名称",
|
dataIndex: "name"
|
},
|
{
|
title: "mac",
|
dataIndex: "mac"
|
},
|
{
|
title: "型号",
|
dataIndex: "version.name"
|
},
|
{
|
title: "监控站点",
|
dataIndex: "monitorPoint.name"
|
},
|
{
|
title: "政府站点",
|
dataIndex: "govMonitorPoint.name"
|
},
|
{
|
title: "维护人",
|
dataIndex: "operators"
|
},
|
{
|
title: "生产时间",
|
dataIndex: "createTime"
|
},
|
{
|
title: "安装时间",
|
dataIndex: "installTime"
|
},
|
{
|
title: "操作",
|
customRender: this.opRender
|
}
|
];
|
// 存放地理位置信息
|
private areaData: any = JSON.parse(JSON.stringify(org))
|
|
constructor() {
|
super();
|
}
|
|
get status() {
|
return status;
|
}
|
|
get statusMap() {
|
return statusMap;
|
}
|
|
get statuFilters() {
|
return [
|
{
|
text: status[0],
|
value: 0
|
},
|
{
|
text: status[1],
|
value: 1
|
},
|
{
|
text: status[2],
|
value: 2
|
},
|
{
|
text: status[3],
|
value: 3
|
}
|
];
|
}
|
|
private startTime: any = null;
|
private endTime: any = null;
|
|
//规则指定
|
private rules: any = {
|
name: [
|
{required: true, message: '名称不能为空', trigger: ['change', 'blur']},
|
],
|
mac: [
|
{required: true, message: 'mac不能为空', trigger: ['change', 'blur']},
|
],
|
monitorPoint: {
|
id:[
|
{required: true, message: '监控站点不能为空', trigger: ['change', 'blur']},
|
],
|
},
|
version: {
|
id: [
|
{required: true, message: '设备型号不能为空', trigger: ['change', 'blur']},
|
]
|
},
|
longitude: [
|
{message: '请输入正确的经度',pattern:/^[+-]?\d+(\.\d+)?$/}
|
],
|
latitude: [
|
{message: '请输入正确的纬度',pattern:/^[+-]?\d+(\.\d+)?$/}
|
],
|
profession: [
|
{required: true, message: '所选行业不能为空', trigger: ['change', 'blur']},
|
],
|
address: [
|
{required: true, message: '位置信息不能为空'},
|
],
|
town: {
|
townName: [
|
{required: true, message: '行政区划不能为空'},
|
]
|
}
|
|
}
|
|
//date-picker时间转换
|
private onStartTimeChange(date: any, dateString: any) {
|
this.startTime = dateString;
|
}
|
|
private onEndTimeChange(date: any, dateString: any): void {
|
this.endTime = dateString;
|
}
|
|
|
private addMapFlag: boolean = false
|
|
private showMap1() {
|
this.typeOperation = 'add'
|
this.addMapFlag = true
|
}
|
private showMap2() {
|
this.typeOperation = 'upa'
|
this.editMapFlag = true
|
}
|
// 定位级别数据
|
private positionLevel(val: any) {
|
var code = val[val.length-1]
|
this.getGovPointByArea(code)
|
}
|
|
|
// 存放国控站点数据
|
private govMonitors: any[] = []
|
// 根据定位级别获取政府站点
|
private getGovPointByArea(code: any) {
|
get('govMonitorPoint/govMonitorPoints', {
|
regionCode: code
|
}).then((res: any) => {
|
if (res.data.code === 0) {
|
this.govMonitors = res.data.data
|
}
|
})
|
}
|
|
//新建选择框，查询功能
|
filterOption(input: any, option: any) {
|
return (
|
option.componentOptions.children[0].text
|
.toLowerCase()
|
.indexOf(input.toLowerCase()) >= 0
|
);
|
}
|
|
private mounted() {
|
this.getDropDownData()
|
}
|
|
// 初始下拉框数据加载
|
private getDropDownData() {
|
//初始加载型号
|
get("device/versions", {})
|
.then(res => {
|
this.model = res.data.data.reverse();
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
//初始加载维护人
|
get("device/operators", {})
|
.then(res => {
|
this.operators = res.data.data;
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
|
//初始加载所有站点
|
get("device/allMonitorPoint", {})
|
.then(res => {
|
this.MonitorPoints = res.data.data.reverse();
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
|
//初始加载行业
|
get("device/professions", {})
|
.then(res => {
|
this.Professions = res.data.data;
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
|
//初始加载所有工艺
|
get("device/techs", {})
|
.then(res => {
|
console.log(res,'res');
|
this.Techs = res.data.data;
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
|
//初始加载所有设备检测器
|
get("device/detectors", {})
|
.then(res => {
|
this.Detectors = res.data.data;
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
|
//初始加载所有设备检测器
|
get("device/purchasers", {})
|
.then(res => {
|
this.Purchasers = res.data.data;
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
|
}
|
|
//新建按钮。
|
private handleModalVisible(isVisible: boolean): void {
|
this.visibleCreateModal = isVisible;
|
this.getGovPointByArea('')
|
this.techFlag = false
|
}
|
private handleModalVisible1(isVisible: boolean): void {
|
this.visibleCreateModal1=isVisible
|
}
|
|
private toggleForm(): void {
|
this.expandForm = !this.expandForm;
|
}
|
|
private handleFormReset(): void {
|
this.serch.name = null;
|
this.loadRuleData(1);
|
}
|
|
private handleSearch(): void {
|
this.current = 1
|
this.loadRuleData(this.current)
|
}
|
|
private current: number = 1
|
private handlerTableChange(pagination: any, filter: any, sorter: any): void {
|
this.current = pagination.current
|
this.pagination.current = pagination.current;
|
this.pagination.pageSize = pagination.pageSize;
|
this.pagination.total = pagination.total;
|
this.loadRuleData(pagination.current)
|
}
|
|
|
private selectOrg: any = null
|
//下拉查询框方法
|
private handleChange(selectedItems:any) {
|
if (selectedItems === undefined) {
|
this.selectOrg = null
|
}else {
|
this.selectOrg = selectedItems;
|
}
|
this.loadRuleData(1)
|
}
|
|
private selectMt: any = null
|
|
//下拉查询框方法
|
private handleChange1(selectedItems:any) {
|
if (selectedItems === undefined) {
|
this.selectMt = null
|
}else {
|
this.selectMt = selectedItems;
|
}
|
this.loadRuleData(1)
|
}
|
private reskey:any=0
|
private handleChange2(res:any){
|
console.log(res.key);
|
this.reskey=res
|
console.log(this.reskey);
|
if(this.selectvalue1==='请选择因子'){
|
this.$message.warning('请先选择因子')
|
return
|
}
|
post('deviceAdjustValue/getAllAdjust',{
|
code:this.selectvalue1,
|
id:res.key,
|
}).then((res:any)=>{
|
this.datatable=[]
|
this.datatable=res.data.data
|
if(this.selectvalue1==='a99054'){
|
console.log(21323);
|
for(var i=0;i<this.datatable.length;i++){
|
if(this.ceAQIvalue==='+'){
|
this.datatable[i].cel=((this.datatable[i].cel-0) + (this.ceAQIvaluein-0)).toFixed(2)
|
}else if(this.ceAQIvalue==='-'){
|
this.datatable[i].cel=Number((this.datatable[i].cel - this.ceAQIvaluein).toFixed(2))
|
}else if(this.ceAQIvalue==='*'){
|
this.datatable[i].cel=Number((this.datatable[i].cel * this.ceAQIvaluein).toFixed(2))
|
}else if(this.ceAQIvalue==='/'){
|
this.datatable[i].cel=Number((this.datatable[i].cel / this.ceAQIvaluein).toFixed(3))
|
}
|
this.datatable[i].agehou='ce1*'+this.datatable[i].cel
|
}
|
}else{
|
for(var i=0;i<this.datatable.length;i++){
|
// this.datatable[i].aqi=parseFloat(this.datatable[i].aqi+this.AQIvalue).toFixed(2)
|
// this.datatable[i].cel=parseFloat(this.datatable[i].cel+this.ceAQIvaluein).toFixed(2)
|
// this.datatable[i].agehou='aqi*'+this.datatable[i].aqi+'+'+'ce1*'+this.datatable[i].cel
|
if(this.AQIvalue1==='+'){
|
this.datatable[i].aqi=((this.datatable[i].aqi-0) + (this.AQIvalue-0)).toFixed(2)
|
}else if(this.AQIvalue1==='-'){
|
this.datatable[i].aqi=Number((this.datatable[i].aqi - this.AQIvalue)).toFixed(2)
|
} else if(this.AQIvalue1==='*'){
|
this.datatable[i].aqi=Number((this.datatable[i].aqi * this.AQIvalue)).toFixed(2)
|
}else if(this.AQIvalue1==='/'){
|
this.datatable[i].aqi=Number((this.datatable[i].aqi / this.AQIvalue).toFixed(3))
|
}
|
if(this.ceAQIvalue==='+'){
|
this.datatable[i].cel=((this.datatable[i].cel-0) + (this.ceAQIvaluein-0)).toFixed(2)
|
}else if(this.ceAQIvalue==='-'){
|
this.datatable[i].cel=Number((this.datatable[i].cel - this.ceAQIvaluein)).toFixed(2)
|
}else if(this.ceAQIvalue==='*'){
|
this.datatable[i].cel=Number((this.datatable[i].cel * this.ceAQIvaluein)).toFixed(2)
|
}else if(this.ceAQIvalue==='/'){
|
this.datatable[i].cel=Number((this.datatable[i].cel / this.ceAQIvaluein).toFixed(3))
|
}
|
this.datatable[i].agehou='aqi*'+this.datatable[i].aqi+'+'+'ce1*'+this.datatable[i].cel
|
}
|
}
|
this.changesen=1;
|
})
|
}
|
|
|
|
private editTechFlag:boolean = false
|
|
private selectMaintainer: any = []
|
|
private editTech(key: any) {
|
if (key === 0) {
|
this.editTechFlag = true
|
this.editBeforeData.extand.area = this.et.area
|
this.editBeforeData.extand.speed = this.et.speed
|
}else {
|
this.editTechFlag = false
|
}
|
}
|
|
private et: any = {
|
area: '',
|
speed: ''
|
}
|
|
private testRecord: any = null
|
// 编辑动态绑定数据
|
private handleEditModalVisible(visible: boolean, record: any): void {
|
this.getGovPointByArea('')
|
this.selectMaintainer = []
|
this.testRecord = record
|
for (let i = 0; i < this.maintainer.length; i++) {
|
if (record.id === this.maintainer[i].id) {
|
if (this.maintainer[i].m.length !== 0) {
|
for (let j = 0; j < this.maintainer[i].m.length; j++) {
|
this.selectMaintainer.push((this.maintainer[i].m[j].id))
|
}
|
}
|
}
|
}
|
|
this.editRecord = record
|
// if (this.editRecord.tech === '0') {
|
// this.extend = {
|
//
|
// }
|
// }
|
const professionIds = record.professions.map((item: any) => {
|
return item.dataKey
|
})
|
this.editBeforeData.id = record.id
|
this.editBeforeData.name = record.name
|
this.editBeforeData.mac = record.mac
|
this.editBeforeData.version.id = record.version.id
|
this.editBeforeData.version.name = record.version.name
|
this.editBeforeData.longitude = record.longitude
|
this.editBeforeData.latitude = record.latitude
|
this.editBeforeData.operators = record.operators
|
this.editBeforeData.installTime = record.installTime
|
this.editBeforeData.createTime = record.createTime
|
this.editBeforeData.monitorPoint.id = record.monitorPoint.id
|
this.editBeforeData.monitorPoint.name = record.monitorPoint.name
|
this.editBeforeData.profession.id = record.professions === null || record.professions === '' || record.professions === undefined ? undefined : professionIds
|
this.editBeforeData.town.townName = record.town.townName
|
this.editBeforeData.town.townCode = record.town.townCode
|
// this.editBeforeData.profession.name = record.professionName
|
this.editBeforeData.tech.id = record.tech === null || record.tech === '' ? undefined : Number(record.tech)
|
this.editBeforeData.guid = record.govMonitorPoint.guid === null ? undefined : record.govMonitorPoint.guid
|
if ( this.editBeforeData.tech.id === 0 ){
|
this.editTechFlag = true
|
if (JSON.parse(record.extend) !== null) {
|
this.et.area = JSON.parse(record.extend).area
|
this.et.speed = JSON.parse(record.extend).speed
|
this.editBeforeData.extand.area = this.et.area
|
this.editBeforeData.extand.speed = this.et.speed
|
}else {
|
this.editBeforeData.extand.area = ''
|
this.editBeforeData.extand.speed = ''
|
}
|
}else {
|
this.editTechFlag = false
|
this.editBeforeData.extand.area = ''
|
this.editBeforeData.extand.speed = ''
|
}
|
this.editBeforeData.tech.name = record.techName
|
this.editBeforeData.detector.id = record.detector === null || record.detector === '' ? undefined : Number(record.detector)
|
this.editBeforeData.detector.name = record.detectorName
|
this.editBeforeData.purchaser.id = record.purchaser === null || record.purchaser === '' ? undefined : Number(record.purchaser)
|
this.editBeforeData.purchaser.name = record.purchaserName
|
this.editBeforeData.address = record.address
|
this.editTaskFormVisible = true;
|
}
|
|
// 编辑保存
|
private handleEditModalOk() {
|
|
this.$refs.editRulesForm.validate((valid: any) => {
|
if (valid) {
|
let stringIds: string = ''
|
if (this.selectMaintainer.length !== 0) {
|
for (let i = 0; i < this.selectMaintainer.length; i++) {
|
stringIds += this.selectMaintainer[i] + ','
|
}
|
if (stringIds.charAt(stringIds.length - 1) == ",") {
|
stringIds = stringIds.slice(0, stringIds.length - 1);
|
}
|
}
|
|
let maintainerArray = []
|
for (let i = 0; i < this.maintainer.length; i++) {
|
if (this.testRecord.id === this.maintainer[i].id) {
|
if (this.maintainer[i].m.length !== 0) {
|
for (let j = 0; j < this.maintainer[i].m.length; j++) {
|
maintainerArray.push((this.maintainer[i].m[j].id))
|
}
|
}
|
}
|
}
|
let orChange = true // 判断
|
for (let item = 0; item < this.editRecord.professions.length; item++) {
|
if (this.editBeforeData.profession.id.indexOf(this.editRecord.professions[item].dataKey) < 0) {
|
orChange = false
|
break
|
}
|
}
|
stringIds = JSON.stringify(maintainerArray) === JSON.stringify(this.selectMaintainer) ? null : stringIds
|
let name = this.editBeforeData.name === this.editRecord.name ? null : this.editBeforeData.name
|
let mac = this.editBeforeData.mac === this.editRecord.mac ? null : this.editBeforeData.mac
|
let address = this.editBeforeData.address === this.editRecord.address ? null : this.editBeforeData.address
|
let longitude = this.editBeforeData.longitude === this.editRecord.longitude ? null : this.editBeforeData.longitude
|
let latitude = this.editBeforeData.latitude === this.editRecord.latitude ? null : this.editBeforeData.latitude
|
let monitorPointId = this.editBeforeData.monitorPoint.id === this.editRecord.monitorPoint.id ? null : this.editBeforeData.monitorPoint.id
|
let deviceVersionId = this.editBeforeData.version.id === this.editRecord.version.id ? null : this.editBeforeData.version.id
|
let createTime = this.editBeforeData.createTime === this.editRecord.createTime ? null : moment(this.editBeforeData.createTime._d).format("YYYY-MM-DD HH:mm:ss")
|
let installTime = this.editBeforeData.installTime === this.editRecord.installTime ? null : moment(this.editBeforeData.installTime._d).format("YYYY-MM-DD HH:mm:ss")
|
let tech = (this.editBeforeData.tech.id === undefined && this.editRecord.tech === null || this.editBeforeData.tech.id === undefined && this.editRecord.tech === '' ||
|
(this.editBeforeData.tech.id === Number(this.editRecord.tech === '' || this.editRecord.tech === null ? undefined : this.editRecord.tech))
|
) ? null : this.editBeforeData.tech.id === undefined ? '' : this.editBeforeData.tech.id
|
let profession = orChange ? null : this.editBeforeData.profession.id.join(',')
|
let detector = ((this.editBeforeData.detector.id === undefined && this.editRecord.detector === null) || (this.editBeforeData.detector.id === undefined && this.editRecord.detector === '') ||
|
(this.editBeforeData.detector.id === Number(this.editRecord.detector === '' || this.editRecord.detector === null ? undefined : this.editRecord.detector))
|
) ? null : this.editBeforeData.detector.id === undefined ? '' : this.editBeforeData.detector.id
|
let purchaser = (this.editBeforeData.purchaser.id === undefined && this.editRecord.purchaser === null || this.editBeforeData.purchaser.id === undefined && this.editRecord.purchaser === '' ||
|
(this.editBeforeData.purchaser.id === Number(this.editRecord.purchaser === '' || this.editRecord.purchaser === null ? undefined : this.editRecord.purchaser))
|
) ? null : this.editBeforeData.purchaser.id === undefined ? '' : this.editBeforeData.purchaser.id
|
let guid = this.editBeforeData.guid === this.editRecord.govMonitorPoint.guid ? null : this.editBeforeData.guid
|
let townCode = this.editBeforeData.town.townCode === this.editRecord.town.townCode ? null : this.editBeforeData.town.townCode
|
|
|
let extend = null
|
if (this.editBeforeData.tech.id === 0) {
|
if (this.editRecord.extend === null){
|
extend = JSON.stringify(this.editBeforeData.extand)
|
}else {
|
if (JSON.stringify(this.editBeforeData.extand) === JSON.stringify(JSON.parse(this.editRecord.extend))) {
|
extend = null
|
}else{
|
extend = JSON.stringify(this.editBeforeData.extand)
|
}
|
}
|
}else {
|
this.editBeforeData.extand = {
|
speed: '',
|
area: ''
|
}
|
}
|
|
|
if ( !(name || mac || address || longitude || latitude || monitorPointId || deviceVersionId || townCode
|
|| (profession || profession === 0 || profession === '') || (tech || tech === 0 || tech === '')
|
|| (detector || detector === 0 || detector === '') || (purchaser || purchaser === 0 || purchaser === '')
|
|| createTime || installTime || stringIds !== null || extend || guid)){
|
this.$message.warning('未修改')
|
return ;
|
}
|
post("device/update", {
|
id: this.editBeforeData.id,
|
name: name,
|
mac: mac,
|
address: address,
|
longitude: longitude,
|
latitude: latitude,
|
monitorPointId: monitorPointId,
|
deviceVersionId: deviceVersionId,
|
profession: profession,
|
tech: tech ,
|
detector: detector,
|
purchaser: purchaser,
|
createTime: createTime,
|
installTime: installTime,
|
operateIds: stringIds,
|
extend: extend,
|
guid: guid,
|
townCode: townCode
|
}).then((res: any) => {
|
if (res.data.code === 0) {
|
this.$message.success("修改成功")
|
this.loadRuleData(1);
|
this.editTaskFormVisible = false;
|
}
|
})
|
|
|
} else {
|
console.log('error submit!!');
|
return false;
|
}
|
});
|
|
|
}
|
|
// 编辑取消
|
private handleEditModalCancel() {
|
this.editTaskFormVisible = false;
|
}
|
|
private resetMonitor(val: any) {
|
}
|
|
private handleUpdateModalVisible1(visible: boolean, record: any): void {
|
this.updateRecord1 = record;
|
setTimeout(() => {
|
this.distributionMenuVisible = true;
|
}, 500);
|
}
|
|
// 存放查询的组织id
|
private selectMt: any = null
|
|
private loading: boolean=false
|
|
private handleCancel(){
|
|
}
|
//新建保存
|
private handleCreateModalOk() {
|
this.form.validateFields((err: any, values: any) => {
|
if (values.jingdu === '') {
|
values.jingdu = this.addLL.lng
|
}
|
if (err) {
|
return;
|
}
|
let op = '';
|
if (values.operator) {
|
for (let i = 0; i < values.operator.length; i++) {
|
op += values.operator[i] + ",";
|
}
|
if (op.charAt(op.length - 1) == ",") {
|
op = op.slice(0, op.length - 1);
|
}
|
}
|
|
let industry = ''
|
if (values.profession) {
|
industry = values.profession.join(',')
|
|
}
|
let extend = null
|
|
|
if (values.area){
|
if (values.speed){
|
extend = JSON.stringify({speed: values.speed,area: values.area})
|
}else{
|
extend = JSON.stringify({area: values.area})
|
}
|
}else {
|
if (values.speed){
|
extend = JSON.stringify({speed: values.speed})
|
}else{
|
extend = null
|
}
|
}
|
post(
|
"device/insert",
|
{
|
name: values.deviceName,
|
mac: values.mac,
|
address: values.address ? values.address : null,
|
longitude: values.jingdu ? values.jingdu : null,
|
latitude: values.weidu ? values.weidu : null,
|
deviceVersionId: values.model ? values.model : null,
|
monitorPointId: values.monitorPoint ? values.monitorPoint : null,
|
profession: industry,
|
operateIds: op,
|
tech: values.tech ? values.tech : null,
|
detector: values.detector ? values.detector : null,
|
purchaser: values.purchaser ? values.purchaser : null,
|
createTime: this.startTime ? this.startTime : null,
|
extend: extend,
|
installTime: this.endTime ? this.endTime : null,
|
guid: values.govMonitor ? values.govMonitor : null,
|
townCode: Number(this.town_code)
|
}
|
)
|
.then((res: any) => {
|
if (res.data.code !== 0) {
|
this.$message.error(res.data.message, 2);
|
} else {
|
this.visibleCreateModal = false;
|
this.addLL = {
|
lng: '',
|
lat: ''
|
}
|
this.$message.success(res.data.message)
|
this.loadRuleData(1);
|
}
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
});
|
}
|
|
private handleUpdateOk() {
|
this.loadRuleData(1);
|
}
|
|
private handleCreateModalCancel(): any {
|
this.addLL = {
|
lng: '',
|
lat: ''
|
}
|
this.visibleCreateModal = false;
|
}
|
|
private handleCreateModalCancel1():any{
|
this.datatable=[];
|
this.selectvalue1='请选择因子';
|
this.changesen=0;
|
this.visibleCreateModal1=false;
|
}
|
|
private handlerSelectChange(arr1: any, arr2: any) {
|
this.selectedRows = arr2;
|
}
|
|
private handleMenuClick(e: any) {
|
}
|
|
private techFlag:boolean = false
|
private changeTech(key: any) {
|
if (key === '0' || key === 0) {
|
this.techFlag = true
|
}else {
|
this.techFlag = false
|
}
|
}
|
|
// 存放添加的经纬度
|
private addLL: any = {
|
lng : '',
|
lat : ''
|
}
|
|
private created() {
|
this.form = this.$form.createForm(this, {name: "devicesBasic"});
|
this.loadRuleData(1);
|
this.getAllOrg()
|
this.getAllMonitor()
|
}
|
|
// 存放维护人信息
|
private maintainer: any = []
|
|
private loadRuleData(pageSize: number) {
|
this.tableLoading = true;
|
get("device/select", {
|
organizationId: this.selectOrg,
|
monitorPointId: this.selectMt,
|
name: this.serch.name,
|
mac: this.serch.name,
|
page: pageSize,
|
size: this.pagination.pageSize,
|
})
|
.then(res => {
|
if(res.data.code === 0) {
|
this.tableLoading = false;
|
this.pagination.total = res.data.data.total;
|
this.pagination.current = res.data.data.current;
|
this.pagination.pageSize = res.data.data.pageSize;
|
this.dataSource = res.data.data.item;
|
this.maintainer = []
|
for (let i = 0; i < this.dataSource.length; i++) {
|
let operatorsInform = this.dataSource[i].operators;
|
let mObj = operatorsInform
|
let obj = {
|
}
|
|
obj.id = this.dataSource[i].id
|
obj.m = mObj
|
this.maintainer.push(obj)
|
if (operatorsInform) {
|
let op = "";
|
for (let j = 0; j < operatorsInform.length; j++) {
|
op += operatorsInform[j].name + "、";
|
}
|
if (op.charAt(op.length - 1) == "、") {
|
op = op.slice(0, op.length - 1);
|
}
|
this.dataSource[i].operators = op;
|
}
|
}
|
}else if( res.data.code === 3) {
|
this.$message.error(res.data.message,2)
|
}else {
|
this.$message.warning(res.data.message)
|
}
|
|
});
|
}
|
|
|
// 组织数据
|
private orgData:any = {}
|
|
// 获得所有组织
|
private getAllOrg(){
|
get("organization/queryNames",{}).then(res => {
|
this.orgData = res.data.data.organizationVOs.reverse()
|
})
|
}
|
|
// 站点数据
|
private monitorData:any = {}
|
// 获取所有站点
|
private getAllMonitor() {
|
|
}
|
|
|
|
|
private deleteDevice(record: any) {
|
get("device/delete", {
|
deviceId: record.id
|
})
|
.then(res => {
|
if (res.data.code === 0) {
|
this.$message.success(res.data.message)
|
this.loadRuleData(1);
|
}
|
})
|
.catch(function (error) {
|
console.log("删除失败");
|
});
|
}
|
|
|
private mapRecord: any = {}
|
|
//地图URL
|
private mapUrl:string = 'device/update'
|
|
private showMap(flag: boolean, record: any) {
|
console.log(record,'record');
|
this.mapFlag = flag
|
this.mapRecord = record
|
}
|
|
private mapFlag: boolean = true
|
|
private receiveFlag(flag: boolean) {
|
this.mapFlag = true
|
}
|
|
private receiveFlag1(flag: boolean){
|
this.addMapFlag = flag
|
}
|
|
private receiveFlag2(flag: boolean){
|
console.log('receiveFlag2');
|
this.editMapFlag = flag
|
}
|
// 接收新增经纬度点
|
private receiveLomLat(lonLat: any) {
|
|
this.addLL = lonLat
|
this.getTownData(lonLat)
|
}
|
|
private getTownData(lonLat: any) {
|
console.log(lonLat,'dsasa');
|
let self=this
|
var geocoder = new AMap.Geocoder({
|
// city 指定进行编码查询的城市，支持传入城市名、adcode 和 citycode
|
city: '010'
|
})
|
geocoder.getAddress(lonLat, function(status, result) {
|
console.log(result,'result');
|
if (status === 'complete' && result.info === 'OK') {
|
// self.formattedAddress=result.regeocode.formattedAddress
|
// console.log(result,'321312');
|
if(self.typeOperation === 'add') {
|
if(result.regeocode.addressComponent.towncode.length>9){
|
self.town_code=result.regeocode.addressComponent.towncode.slice(0,9)
|
}else{
|
self.town_code = result.regeocode.addressComponent.towncode
|
}
|
self.form.setFieldsValue({
|
jingdu: self.addLL[0],
|
weidu: self.addLL[1],
|
town: result.regeocode.addressComponent.township
|
})
|
console.log(self.town_code);
|
} else {
|
if (!(result.regeocode.addressComponent.township === '' && result.regeocode.addressComponent.towncode === '')){
|
self.editBeforeData.town.townName = result.regeocode.addressComponent.township
|
if(result.regeocode.addressComponent.towncode.length>9){
|
self.editBeforeData.town.townCode = result.regeocode.addressComponent.towncode.slice(0,9)
|
}else{
|
self.editBeforeData.town.townCode = result.regeocode.addressComponent.towncode
|
}
|
// console.log(self.editBeforeData.town.townName,self.editBeforeData.town.townCode,'222');
|
} else {
|
self.editBeforeData.town.townName = result.regeocode.addressComponent.town
|
self.editBeforeData.town.townCode = result.regeocode.addressComponent.towncode
|
self.$message.warning('选择位置信息异常')
|
}
|
|
}
|
// result为对应的地理位置详细信息
|
}
|
})
|
|
// jsonp('/proxy/reverse_geocoding/v3/', {
|
// jsonp('https://api.map.baidu.com/reverse_geocoding/v3/', {
|
// ak: 'e5ig9Z7AKFjv8wbkqDbuLkUMzBev0tgT',
|
// output: 'json',
|
// coordtype: 'wgs8411',
|
// extensions_town: true,
|
// location: lonLat.lat+ ',' + lonLat.lng
|
// }).then((res: any) => {
|
// console.log(res,'res');
|
// if(this.typeOperation === 'add') {
|
// this.town_code = res.result.addressComponent.town_code
|
// this.form.setFieldsValue({
|
// jingdu: this.addLL.lng,
|
// weidu: this.addLL.lat,
|
// town: res.result.addressComponent.town
|
// })
|
// } else {
|
// console.log(res,'555');
|
// if (!(res.result.addressComponent.town === '' && res.result.addressComponent.town_code === '')){
|
// this.editBeforeData.town.townName = res.result.addressComponent.town
|
// this.editBeforeData.town.townCode = res.result.addressComponent.town_code
|
// } else {
|
// this.editBeforeData.town.townName = res.result.addressComponent.town
|
// this.editBeforeData.town.townCode = res.result.addressComponent.town_code
|
// this.$message.warning('选择位置信息异常')
|
// }
|
|
// }
|
// })
|
}
|
// 接收修改经纬度点
|
private receiveLomLat1(lonLat: any) {
|
console.log(lonLat,'lonLat');
|
this.editBeforeData.longitude = lonLat[0]
|
this.editBeforeData.latitude = lonLat[1]
|
this.getTownData(lonLat)
|
}
|
|
@Watch('mapFlag')
|
private monitorMapFlag(newVal: boolean, oldVal: boolean) {
|
this.mapFlag = newVal
|
}
|
|
// 配置校准值----------------------------------------------------------------------------------->>>>>>>>>>>>>>>>>>>>>>>>>
|
|
private visibleFlag: boolean = false
|
private caliRecord: any = null
|
private showCalibration(record: any) {
|
this.visibleFlag = true
|
this.caliRecord = record
|
}
|
|
private turnFlag(flag: boolean) {
|
this.visibleFlag = false
|
}
|
private opRender(text: string, record: any, index: number) {
|
return (
|
<div>
|
<a onClick={() => this.handleEditModalVisible(true, record)}>
|
{" "}
|
编辑{" "}
|
</a>
|
<a-divider type="vertical"/>
|
<a-popconfirm
|
title="确认删除吗？"
|
ok-text="确定"
|
cancel-text="取消"
|
onConfirm={() => this.deleteDevice(record)}
|
>
|
<a href="#">删除</a>
|
</a-popconfirm>
|
<a-divider type="vertical"/>
|
|
<a-dropdown>
|
<a class="ant-dropdown-link">
|
更多 <a-icon type="down"/></a>
|
<a-menu slot="overlay">
|
<a-menu-item>
|
<a onClick={() => this.showCalibration(record)}>配置校准值</a>
|
</a-menu-item>
|
<a-menu-item>
|
<a onClick={() => this.showMap(false, record)}>配置坐标</a>
|
</a-menu-item>
|
</a-menu>
|
</a-dropdown>
|
</div>
|
)
|
;
|
}
|
|
|
}
|
</script>
|
|
<style lang="less">
|
.mapShow {
|
display: none;
|
}
|
|
.tableList {
|
.tableListOperator {
|
margin-bottom: 16px;
|
|
button {
|
margin-right: 8px;
|
}
|
}
|
}
|
|
.modalStyle {
|
.ant-modal-content {
|
width: 1000px;
|
}
|
|
.ant-form-item {
|
margin-bottom: 0px;
|
}
|
|
.ant-form-explain {
|
display: none;
|
min-height: 0;
|
}
|
}
|
.modalStylezhi {
|
.ant-modal-content {
|
width: 1000px;
|
margin-left: -250px;
|
}
|
.ant-modal-title {
|
font-size: 20px;
|
margin-left: -25px;
|
}
|
.ant-form-item {
|
margin-bottom: 0px;
|
}
|
|
.ant-form-explain {
|
display: none;
|
min-height: 0;
|
}
|
.ant-modal-header {
|
width: 95%;
|
margin-left: 25px;
|
}
|
}
|
.modalone {
|
height: 120px;
|
border-bottom: 1px solid #e8e8e8;
|
display: flex;
|
.theone {
|
width: 20%;
|
border-right: 1px #e8e8e8 dashed;
|
height: 100px;
|
}
|
.thetwo {
|
width: 35%;
|
border-right: 1px #e8e8e8 dashed;
|
height: 100px;
|
}
|
.thethree {
|
width: 45%;
|
height: 100px;
|
}
|
}
|
.modaltwo {
|
margin-top: 20px;
|
margin-left: 10px;
|
}
|
</style>
|
