Skip to content

P
property-management
Commit ae27b7d3 by chenjunxiong
Options

build(service):

parent 5cc80df6
Showing with 806 additions and 197 deletions
ant-design-vue-jeecg/src/mixins/JeecgListMixin.js
...@@ -13,7 +13,9 @@ export const JeecgListMixin = { ...@@ -13,7 +13,9 @@ export const JeecgListMixin = {
data(){ data(){
return { return {
/* 查询条件-请不要在queryParam中声明非字符串值的属性 */ /* 查询条件-请不要在queryParam中声明非字符串值的属性 */
queryParam: {}, queryParam: {
deleted: false,
},
/* 数据源 */ /* 数据源 */
dataSource:[], dataSource:[],
/* 分页参数 */ /* 分页参数 */
...@@ -156,7 +158,7 @@ export const JeecgListMixin = { ...@@ -156,7 +158,7 @@ export const JeecgListMixin = {
this.$refs.superQueryModal.show(); this.$refs.superQueryModal.show();
}, },
searchReset() { searchReset() {
this.queryParam = {} this.queryParam = {deleted: false}
this.loadData(1); this.loadData(1);
}, },
batchDel: function () { batchDel: function () {
......
ant-design-vue-jeecg/src/views/pm/access-control-device/PmAccessControlDeviceList.vue
...@@ -153,7 +153,6 @@ export default { ...@@ -153,7 +153,6 @@ export default {
}, },
data() { data() {
return { return {
queryParam: {deleted: false},
description: 'pm_access_control_device管理页面', description: 'pm_access_control_device管理页面',
// 表头 // 表头
columns: [ columns: [
......
ant-design-vue-jeecg/src/views/pm/access-control-device/PmAccessControlDeviceOverview.vue 0 → 100644
<template>
<a-card :bordered="false">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-form-item label="选择楼栋">
<a-select placeholder="选择楼栋" v-model="queryParam.buildingName" @change="buildingChange">
<a-select-option v-for="buildingInfo in buildingInfos" :key="buildingInfo.name">
{{ buildingInfo.name }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-form-item label="选择楼层">
<a-select placeholder="选择楼层" v-model="queryParam.floor">
<a-select-option v-for="floor in targetFloorList" :key="floor">
{{ floor }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-form-item label="设备类型">
<a-select placeholder="设备类型" v-model="queryParam.type">
<a-select-option v-for="type in types" :key="type">
{{ type }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-space style="float: left">
<a-button type="primary" @click="searchQuery">查询</a-button>
<a-button type="default" @click="searchReset">重置</a-button>
</a-space>
</a-col>
</a-row>
</a-form>
</div>
<!-- 查询区域-END -->
<!-- 操作按钮区域 -->
<!--<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button type="primary" icon="download" @click="handleExportXls('pm_access_control_device')">导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
@change="handleImportExcel">
<a-button type="primary" icon="import">导入</a-button>
</a-upload>
&lt;!&ndash; 高级查询区域 &ndash;&gt;
<j-super-query :fieldList="superFieldList" ref="superQueryModal"
@handleSuperQuery="handleSuperQuery"></j-super-query>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
删除
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>-->
<!-- table区域-begin -->
<div>
<a-row>
<a-col :span="24">
<div style="position: relative">
<img ref="floorImg" src="@/assets/floor.png" alt="floor" width="100%" height="100%"
@load="floorImgLoadComplete()"/>
<img v-for="(item, index) in list"
ref="icon"
:src="item.status === 'NORMAL'
? statusList[0].imgPath
: (item.status === 'OFFLINE' ? statusList[1].imgPath : statusList[2].imgPath)"
:alt="item.name + ':' + item.ip"/>
</div>
</a-col>
</a-row>
</div>
</a-card>
</template>
<script>
import '@/assets/less/TableExpand.less'
import {getAction} from '@/api/manage'
export default {
name: 'PmAccessControlDeviceOverview',
components: {},
data() {
return {
queryParam: {deleted: false},
description: 'pm_access_control_device管理页面',
url: {
list: "/pm/pmAccessControlDevice/list",
delete: "/pm/pmAccessControlDevice/delete",
deleteBatch: "/pm/pmAccessControlDevice/deleteBatch",
exportXlsUrl: "/pm/pmAccessControlDevice/exportXls",
importExcelUrl: "pm/pmAccessControlDevice/importExcel",
},
list: [],
dictOptions: {},
superFieldList: [],
buildingInfos: [],
targetFloorList: [],
types: [],
statusList: [
{name: '正常', value: 'NORMAL', imgPath: require('@/assets/door-close.png')},
{name: '离线', value: 'OFFLINE', imgPath: require('@/assets/door-offline.png')},
{name: '损坏', value: 'BREAKDOWN', imgPath: require('@/assets/door-warning.png')}],
}
},
created() {
getAction('/pm/pmBuildingInfo/list')
.then(value => this.buildingInfos = value.result);
getAction('/pm/pmAccessControlDevice/types')
.then(value => this.types = value.result);
},
computed: {
importExcelUrl: function () {
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
},
},
methods: {
initDictConfig() {
},
buildingChange(value) {
let targetList = this.buildingInfos.filter(buildingInfo => buildingInfo.name === value);
if (targetList != null && targetList.length > 0) {
this.targetFloorList = targetList[0].floorList;
} else {
this.targetFloorList = [];
}
},
loadComplete() {
if (this.list.length > 0) {
this.list.forEach((item, index) => {
let fixX = 20;
let fixY = 20;
let offsetWidth = this.$refs.floorImg.offsetWidth;
let offsetHeight = this.$refs.floorImg.offsetHeight;
this.$refs.icon[index].style.position = 'absolute';
this.$refs.icon[index].style.width = '40px';
this.$refs.icon[index].style.top = item.coordinate.y * offsetHeight - fixY + 'px';
this.$refs.icon[index].style.left = item.coordinate.x * offsetWidth - fixX + 'px';
});
}
},
searchQuery() {
getAction(this.url.list, this.queryParam)
.then(value => {
this.list = value.result.records;
this.$nextTick(()=>{
this.loadComplete();
})
});
},
searchReset() {
this.searchQuery();
},
floorImgLoadComplete() {
this.searchQuery();
}
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
\ No newline at end of file
ant-design-vue-jeecg/src/views/pm/monitoring-device/PmMonitoringDeviceList.vue
...@@ -4,34 +4,62 @@ ...@@ -4,34 +4,62 @@
<div class="table-page-search-wrapper"> <div class="table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery"> <a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-form-item label="区域">
<a-select placeholder="选择区域" v-model="queryParam.area" @change="buildingChange">
<a-select-option v-for="area in areas" :key="area">
{{ area }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-space style="float: left">
<a-button type="primary" @click="searchQuery">查询</a-button>
<a-button type="default" @click="searchReset">重置</a-button>
</a-space>
</a-col>
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-space style="float: right">
<a-button @click="handleExportXls('pm_access_control_device')" type="primary">导出</a-button>
</a-space>
</a-col>
</a-row> </a-row>
</a-form> </a-form>
</div> </div>
<!-- 查询区域-END --> <!-- 查询区域-END -->
<!-- 操作按钮区域 --> <!-- 操作按钮区域 -->
<div class="table-operator"> <!--<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button> <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button type="primary" icon="download" @click="handleExportXls('pm_monitoring_device')">导出</a-button> <a-button type="primary" icon="download" @click="handleExportXls('pm_access_control_device')">导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel"> <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
@change="handleImportExcel">
<a-button type="primary" icon="import">导入</a-button> <a-button type="primary" icon="import">导入</a-button>
</a-upload> </a-upload>
<!-- 高级查询区域 --> &lt;!&ndash; 高级查询区域 &ndash;&gt;
<j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query> <j-super-query :fieldList="superFieldList" ref="superQueryModal"
@handleSuperQuery="handleSuperQuery"></j-super-query>
<a-dropdown v-if="selectedRowKeys.length > 0"> <a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay"> <a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item> <a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
删除
</a-menu-item>
</a-menu> </a-menu>
<a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button> <a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown> </a-dropdown>
</div> </div>-->
<!-- table区域-begin --> <!-- table区域-begin -->
<div> <div>
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;"> <!--<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
<i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项 <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a
style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
<a style="margin-left: 24px" @click="onClearSelected">清空</a> <a style="margin-left: 24px" @click="onClearSelected">清空</a>
</div> </div>-->
<a-table <a-table
ref="table" ref="table"
...@@ -52,7 +80,8 @@ ...@@ -52,7 +80,8 @@
</template> </template>
<template slot="imgSlot" slot-scope="text"> <template slot="imgSlot" slot-scope="text">
<span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span> <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
<img v-else :src="getImgView(text)" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/> <img v-else :src="getImgView(text)" height="25px" alt=""
style="max-width:80px;font-size: 12px;font-style: italic;"/>
</template> </template>
<template slot="fileSlot" slot-scope="text"> <template slot="fileSlot" slot-scope="text">
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span> <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
...@@ -68,22 +97,13 @@ ...@@ -68,22 +97,13 @@
</template> </template>
<span slot="action" slot-scope="text, record"> <span slot="action" slot-scope="text, record">
<a @click="handleEdit(record)">编辑</a> <a-space>
<a @click="handleDetail(record)">查看</a>
<a-divider type="vertical" /> <a @click="handleEdit(record)">修改</a>
<a-dropdown> <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
<a class="ant-dropdown-link">更多 <a-icon type="down" /></a> <a>删除</a>
<a-menu slot="overlay"> </a-popconfirm>
<a-menu-item> </a-space>
<a @click="handleDetail(record)">详情</a>
</a-menu-item>
<a-menu-item>
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
<a>删除</a>
</a-popconfirm>
</a-menu-item>
</a-menu>
</a-dropdown>
</span> </span>
</a-table> </a-table>
...@@ -99,6 +119,7 @@ ...@@ -99,6 +119,7 @@
import { mixinDevice } from '@/utils/mixin' import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin' import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import PmMonitoringDeviceModal from './modules/PmMonitoringDeviceModal' import PmMonitoringDeviceModal from './modules/PmMonitoringDeviceModal'
import {getAction} from '@/api/manage'
export default { export default {
name: 'PmMonitoringDeviceList', name: 'PmMonitoringDeviceList',
...@@ -127,6 +148,11 @@ ...@@ -127,6 +148,11 @@
dataIndex: 'code' dataIndex: 'code'
}, },
{ {
title: '设备类型',
align: "center",
dataIndex: 'type'
},
{
title:'设备名称', title:'设备名称',
align:"center", align:"center",
dataIndex: 'name' dataIndex: 'name'
...@@ -151,11 +177,16 @@ ...@@ -151,11 +177,16 @@
align:"center", align:"center",
dataIndex: 'place' dataIndex: 'place'
}, },
// { {
// title:'xy值', title: 'xy值',
// align:"center", align: "center",
// dataIndex: 'coordinate' dataIndex: 'coordinate',
// }, customRender(t, r, index) {
if (t) {
return t.x + ',' + t.y;
}
},
},
{ {
title:'生产日期', title:'生产日期',
align:"center", align:"center",
...@@ -226,44 +257,59 @@ ...@@ -226,44 +257,59 @@
deleteBatch: "/pm/pmMonitoringDevice/deleteBatch", deleteBatch: "/pm/pmMonitoringDevice/deleteBatch",
exportXlsUrl: "/pm/pmMonitoringDevice/exportXls", exportXlsUrl: "/pm/pmMonitoringDevice/exportXls",
importExcelUrl: "pm/pmMonitoringDevice/importExcel", importExcelUrl: "pm/pmMonitoringDevice/importExcel",
}, },
dictOptions:{}, dictOptions:{},
superFieldList:[], superFieldList: [],
buildingInfos: [],
targetFloorList: [],
types: [],
} }
}, },
created() { created() {
this.getSuperFieldList(); this.getSuperFieldList();
getAction('/pm/pmBuildingInfo/list')
.then(value => this.buildingInfos = value.result);
getAction('/pm/pmAccessControlDevice/types')
.then(value => this.types = value.result);
},
computed: {
importExcelUrl: function () {
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
}, },
computed: { },
importExcelUrl: function(){ methods: {
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`; initDictConfig() {
},
}, },
methods: { getSuperFieldList() {
initDictConfig(){ let fieldList = [];
}, fieldList.push({type: 'string', value: 'code', text: '设备编码'})
getSuperFieldList(){ fieldList.push({type: 'string', value: 'name', text: '设备名称'})
let fieldList=[]; fieldList.push({type: 'string', value: 'ip', text: '设备ip'})
fieldList.push({type:'string',value:'code',text:'设备编码'}) fieldList.push({type: 'string', value: 'buildingName', text: '楼栋'})
fieldList.push({type:'string',value:'name',text:'设备名称'}) fieldList.push({type: 'int', value: 'floor', text: '楼层'})
fieldList.push({type:'string',value:'ip',text:'设备ip'}) fieldList.push({type: 'string', value: 'place', text: '设备位置'})
fieldList.push({type:'string',value:'buildingName',text:'楼栋'}) fieldList.push({type: 'string', value: 'coordinate', text: 'xy值'})
fieldList.push({type:'int',value:'floor',text:'楼层'}) fieldList.push({type: 'int', value: 'doorOpenTime', text: '开门时间'})
fieldList.push({type:'string',value:'place',text:'设备位置'}) fieldList.push({type: 'date', value: 'dateOfProduction', text: '生产日期'})
fieldList.push({type:'string',value:'coordinate',text:'xy值'}) fieldList.push({type: 'date', value: 'installationDate', text: '安装日期'})
fieldList.push({type:'date',value:'dateOfProduction',text:'生产日期'}) fieldList.push({type: 'date', value: 'warrantyPeriod', text: '保修截止日期'})
fieldList.push({type:'date',value:'installationDate',text:'安装日期'}) fieldList.push({type: 'date', value: 'manufacturer', text: '生产厂商'})
fieldList.push({type:'date',value:'warrantyPeriod',text:'保修截止日期'}) fieldList.push({type: 'string', value: 'status', text: '状态'})
fieldList.push({type:'date',value:'manufacturer',text:'生产厂商'}) fieldList.push({type: 'string', value: 'createUserId', text: '创建人Id（sys_user）'})
fieldList.push({type:'string',value:'status',text:'状态'}) fieldList.push({type: 'string', value: 'modifyUserId', text: '修改人Id（sys_user）'})
fieldList.push({type:'string',value:'createUserId',text:'创建人Id（sys_user）'}) fieldList.push({type: 'date', value: 'modifyTime', text: '修改时间'})
fieldList.push({type:'string',value:'modifyUserId',text:'修改人Id（sys_user）'}) this.superFieldList = fieldList
fieldList.push({type:'date',value:'modifyTime',text:'修改时间'}) },
this.superFieldList = fieldList buildingChange(value) {
let targetList = this.buildingInfos.filter(buildingInfo => buildingInfo.name === value);
if (targetList != null && targetList.length > 0) {
this.targetFloorList = targetList[0].floorList;
} else {
this.targetFloorList = [];
} }
} },
} }
}
</script> </script>
<style scoped> <style scoped>
@import '~@assets/less/common.less'; @import '~@assets/less/common.less';
......
ant-design-vue-jeecg/src/views/pm/monitoring-device/PmMonitoringDeviceOverview.vue 0 → 100644
<template>
<a-card :bordered="false">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-form-item label="选择楼栋">
<a-select placeholder="选择楼栋" v-model="queryParam.buildingName" @change="buildingChange">
<a-select-option v-for="buildingInfo in buildingInfos" :key="buildingInfo.name">
{{ buildingInfo.name }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-form-item label="选择楼层">
<a-select placeholder="选择楼层" v-model="queryParam.floor">
<a-select-option v-for="floor in targetFloorList" :key="floor">
{{ floor }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :xl="4" :lg="4" :md="5" :sm="24">
<a-space style="float: left">
<a-button type="primary" @click="searchQuery">查询</a-button>
<a-button type="default" @click="searchReset">重置</a-button>
</a-space>
</a-col>
</a-row>
</a-form>
</div>
<!-- 查询区域-END -->
<!-- 操作按钮区域 -->
<!--<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button type="primary" icon="download" @click="handleExportXls('pm_access_control_device')">导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
@change="handleImportExcel">
<a-button type="primary" icon="import">导入</a-button>
</a-upload>
&lt;!&ndash; 高级查询区域 &ndash;&gt;
<j-super-query :fieldList="superFieldList" ref="superQueryModal"
@handleSuperQuery="handleSuperQuery"></j-super-query>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
删除
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>-->
<!-- table区域-begin -->
<div>
<a-row>
<a-col :span="24">
<div style="position: relative">
<img ref="floorImg" src="@/assets/floor.png" alt="floor" width="100%" height="100%"
@load="floorImgLoadComplete()"/>
<img v-for="(item, index) in list"
ref="icon"
:src="item.status === 'NORMAL'
? statusList[0].imgPath
: (item.status === 'OFFLINE' ? statusList[1].imgPath : statusList[2].imgPath)"
:alt="item.name + ':' + item.ip"/>
</div>
</a-col>
</a-row>
</div>
</a-card>
</template>
<script>
import '@/assets/less/TableExpand.less'
import {getAction} from '@/api/manage'
export default {
name: 'PmMonitoringDeviceOverview',
components: {},
data() {
return {
queryParam: {deleted: false},
description: 'pm_monitoring_device管理页面',
url: {
list: "/pm/pmMonitoringDevice/list",
delete: "/pm/pmMonitoringDevice/delete",
deleteBatch: "/pm/pmMonitoringDevice/deleteBatch",
exportXlsUrl: "/pm/pmMonitoringDevice/exportXls",
importExcelUrl: "pm/pmMonitoringDevice/importExcel",
},
list: [],
dictOptions: {},
superFieldList: [],
buildingInfos: [],
targetFloorList: [],
types: [],
statusList: [
{name: '正常', value: 'NORMAL', imgPath: require('@/assets/door-close.png')},
{name: '离线', value: 'OFFLINE', imgPath: require('@/assets/door-offline.png')},
{name: '损坏', value: 'BREAKDOWN', imgPath: require('@/assets/door-warning.png')}],
}
},
created() {
getAction('/pm/pmBuildingInfo/list')
.then(value => this.buildingInfos = value.result);
getAction('/pm/pmAccessControlDevice/types')
.then(value => this.types = value.result);
},
computed: {
importExcelUrl: function () {
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
},
},
methods: {
initDictConfig() {
},
buildingChange(value) {
let targetList = this.buildingInfos.filter(buildingInfo => buildingInfo.name === value);
if (targetList != null && targetList.length > 0) {
this.targetFloorList = targetList[0].floorList;
} else {
this.targetFloorList = [];
}
},
loadComplete() {
if (this.list.length > 0) {
this.list.forEach((item, index) => {
console.log(item);
let fixX = 20;
let fixY = 20;
let offsetWidth = this.$refs.floorImg.offsetWidth;
let offsetHeight = this.$refs.floorImg.offsetHeight;
this.$refs.icon[index].style.position = 'absolute';
this.$refs.icon[index].style.width = '40px';
this.$refs.icon[index].style.top = item.coordinate.y * offsetHeight - fixY + 'px';
this.$refs.icon[index].style.left = item.coordinate.x * offsetWidth - fixX + 'px';
});
}
},
searchQuery() {
getAction(this.url.list, this.queryParam)
.then(value => {
this.list = value.result.records;
this.$nextTick(()=>{
this.loadComplete();
})
});
},
searchReset() {
this.searchQuery();
},
floorImgLoadComplete() {
this.searchQuery();
}
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
\ No newline at end of file
ant-design-vue-jeecg/src/views/pm/monitoring-device/modules/PmMonitoringDeviceForm.vue
...@@ -3,81 +3,103 @@ ...@@ -3,81 +3,103 @@
<j-form-container :disabled="formDisabled"> <j-form-container :disabled="formDisabled">
<a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail"> <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
<a-row> <a-row>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="设备编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="code"> <a-form-model-item label="设备编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="code">
<a-input v-model="model.code" placeholder="请输入设备编码" ></a-input> <a-input v-model="model.code" placeholder="请输入设备编码"></a-input>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="设备名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name"> <a-form-model-item label="设备名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">
<a-input v-model="model.name" placeholder="请输入设备名称" ></a-input> <a-input v-model="model.name" placeholder="请输入设备名称"></a-input>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="设备ip" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ip"> <a-form-model-item label="设备ip" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ip">
<a-input v-model="model.ip" placeholder="请输入设备ip" ></a-input> <a-input v-model="model.ip" placeholder="请输入设备ip"></a-input>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="设备类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ip">
<a-select placeholder="选择设备类型" v-model="model.type">
<a-select-option v-for="type in types" :key="type">
{{ type }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="楼栋" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="buildingName"> <a-form-model-item label="楼栋" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="buildingName">
<a-input v-model="model.buildingName" placeholder="请输入楼栋" ></a-input> <a-select placeholder="选择楼栋" v-model="model.buildingName" @change="buildingChange">
<a-select-option v-for="buildingInfo in buildingInfos" :key="buildingInfo.name">
{{ buildingInfo.name }}
</a-select-option>
</a-select>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="楼层" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="floor"> <a-form-model-item label="楼层" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="floor">
<a-input-number v-model="model.floor" placeholder="请输入楼层" style="width: 100%" /> <a-select placeholder="选择楼层" v-model="model.floor">
<a-select-option v-for="floor in targetFloorList" :key="floor">
{{ floor }}
</a-select-option>
</a-select>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="开门时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="doorOpenTime">
<a-input-number :min="0" :formatter="value => `${value}s`"
:parser="value => value.replace('s', '')" v-model="model.doorOpenTime"
placeholder="请输入开门时间" style="width: 100%" suffix="RMB"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="设备位置" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="place"> <a-form-model-item label="设备位置" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="place">
<a-input v-model="model.place" placeholder="请输入设备位置" ></a-input> <a-input v-model="model.place" placeholder="请输入设备位置"></a-input>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<!-- <a-col :span="24">--> <a-col :span="12">
<!-- <a-form-model-item label="xy值" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="coordinate">--> <a-form-model-item label="出产日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dateOfProduction">
<!-- <a-input v-model="model.coordinate" placeholder="请输入xy值" ></a-input>--> <j-date placeholder="请选择生产日期" v-model="model.dateOfProduction" style="width: 100%"/>
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<a-col :span="24">
<a-form-model-item label="生产日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dateOfProduction">
<j-date placeholder="请选择生产日期" v-model="model.dateOfProduction" style="width: 100%" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="安装日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="installationDate"> <a-form-model-item label="安装日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="installationDate">
<j-date placeholder="请选择安装日期" v-model="model.installationDate" style="width: 100%" /> <j-date placeholder="请选择安装日期" v-model="model.installationDate" style="width: 100%"/>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="保修截止日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="warrantyPeriod"> <a-form-model-item label="生产厂商" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="manufacturer">
<j-date placeholder="请选择保修截止日期" v-model="model.warrantyPeriod" style="width: 100%" /> <a-input v-model="model.manufacturer" placeholder="请输入生产厂商"></a-input>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="生产厂商" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="manufacturer"> <a-form-model-item label="保修截止日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="warrantyPeriod">
<a-input v-model="model.manufacturer" placeholder="请输入生产厂商" ></a-input> <j-date placeholder="请选择保修截止日期" v-model="model.warrantyPeriod" style="width: 100%"/>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="12">
<a-form-model-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status"> <a-form-model-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
<a-input v-model="model.status" placeholder="请输入状态" ></a-input> <a-select placeholder="选择状态" v-model="model.status" @change="statusChange">
<a-select-option v-for="status in statusList" :key="status.value">
{{ status.name }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="xy值" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="coordinateTmp">
<a-input v-model="model.coordinateTmp" disabled></a-input>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<!-- <a-col :span="24">--> <a-col :span="24">
<!-- <a-form-model-item label="创建人Id（sys_user）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="createUserId">--> <div style="position: relative">
<!-- <a-input v-model="model.createUserId" placeholder="请输入创建人Id" ></a-input>--> <img src="@/assets/floor.png" alt="floor" width="100%" height="100%"
<!-- </a-form-model-item>--> @click="imgClick($event)" ref="imgBg" @load="floorImgLoadComplete($event)"/>
<!-- </a-col>--> <img :src="doorIconPath" alt="door"
<!-- <a-col :span="24">--> :style="doorIconStyle"
<!-- <a-form-model-item label="修改人Id（sys_user）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="modifyUserId">--> v-show="doorIconPath"/>
<!-- <a-input v-model="model.modifyUserId" placeholder="请输入修改人Id（sys_user）" ></a-input>--> </div>
<!-- </a-form-model-item>--> </a-col>
<!-- </a-col>-->
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="修改时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="modifyTime">-->
<!-- <j-date placeholder="请选择修改时间" v-model="model.modifyTime" style="width: 100%" />-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
</a-row> </a-row>
</a-form-model> </a-form-model>
</j-form-container> </j-form-container>
...@@ -86,89 +108,265 @@ ...@@ -86,89 +108,265 @@
<script> <script>
import { httpAction, getAction } from '@api/manage' import {httpAction, getAction} from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util' import {validateDuplicateValue} from '@/utils/util'
export default { export default {
name: 'PmMonitoringDeviceForm', name: 'PmAccessControlDeviceForm',
components: { components: {},
props: {
//表单禁用
disabled: {
type: Boolean,
default: false,
required: false
}
},
data() {
return {
model: {
doorOpenTime: 0,
coordinateTmp: null,
},
labelCol: {
xs: {span: 24},
sm: {span: 5},
},
wrapperCol: {
xs: {span: 24},
sm: {span: 16},
},
confirmLoading: false,
validatorRules: {
code: [
{
required: true,
message: '请输入设备编码',
trigger: 'blur'
}
],
name: [
{
required: true,
message: '请输入设备名称',
trigger: 'blur'
}
],
ip: [
{
required: true,
message: '请输入设备ip',
trigger: 'blur'
}
],
type: [
{
required: true,
message: '选择设备类型',
trigger: 'change'
}
],
buildingName: [
{
required: true,
message: '选择楼栋',
trigger: 'change'
}
],
floor: [
{
required: true,
message: '选择楼层',
trigger: 'change'
}
],
doorOpenTime: [
{
required: true,
message: '请输入开门时间',
trigger: 'blur'
}
],
place: [
{
required: true,
message: '请输入设备位置',
trigger: 'blur'
}
],
dateOfProduction: [
{
required: true,
message: '请选择生产日期',
trigger: 'change'
}
],
installationDate: [
{
required: true,
message: '请选择安装日期',
trigger: 'change'
}
],
manufacturer: [
{
required: true,
message: '请输入生产厂商',
trigger: 'blur'
}
],
warrantyPeriod: [
{
required: true,
message: '请选择保修截止日期',
trigger: 'change'
}
],
status: [
{
required: true,
message: '选择状态',
trigger: 'change'
}
],
coordinateTmp: [
{
required: true,
message: '请点击平面图设置设备坐标',
trigger: ['change', 'blur']
}
],
},
url: {
add: "/pm/pmAccessControlDevice/add",
edit: "/pm/pmAccessControlDevice/edit",
queryById: "/pm/pmAccessControlDevice/queryById"
},
statusList: [
{name: '正常', value: 'NORMAL', imgPath: require('@/assets/door-close.png')},
{name: '离线', value: 'OFFLINE', imgPath: require('@/assets/door-offline.png')},
{name: '损坏', value: 'BREAKDOWN', imgPath: require('@/assets/door-warning.png')}],
doorIconStyle: {
position: 'absolute',
top: '0px',
left: '0px',
width: '40px'
},
doorIconPath: null,
buildingInfos: [],
targetFloorList: [],
types: [],
}
},
computed: {
formDisabled() {
return this.disabled
}, },
props: { },
//表单禁用 created() {
disabled: { //备份model原始值
type: Boolean, this.modelDefault = JSON.parse(JSON.stringify(this.model));
default: false, getAction('/pm/pmBuildingInfo/list')
required: false .then(value => this.buildingInfos = value.result);
} getAction('/pm/pmAccessControlDevice/types')
.then(value => this.types = value.result);
},
methods: {
add() {
this.edit(this.modelDefault);
}, },
data () { edit(record) {
return { this.model = Object.assign({}, record);
model:{ this.visible = true;
}, },
labelCol: { submitForm() {
xs: { span: 24 }, const that = this;
sm: { span: 5 }, // 触发表单验证
}, this.$refs.form.validate(valid => {
wrapperCol: { if (valid) {
xs: { span: 24 }, that.confirmLoading = true;
sm: { span: 16 }, let httpurl = '';
}, let method = '';
confirmLoading: false, if (!this.model.id) {
validatorRules: { // 设置创建用户Id
}, this.model.createUserId = this.$store.getters.userInfo.id;
url: { httpurl += this.url.add;
add: "/pm/pmMonitoringDevice/add", method = 'post';
edit: "/pm/pmMonitoringDevice/edit", } else {
queryById: "/pm/pmMonitoringDevice/queryById" httpurl += this.url.edit;
method = 'put';
}
// 初始化坐标对象并赋值
let coordinate = this.model.coordinateTmp.split(',');
this.model.coordinate = {
x: coordinate[0],
y: coordinate[1]
}
// 设置修改用户Id
this.model.modifyUserId = this.$store.getters.userInfo.id;
httpAction(httpurl, this.model, method).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.$emit('ok');
} else {
that.$message.warning(res.message);
}
}).finally(() => {
that.confirmLoading = false;
})
} }
} })
}, },
computed: { imgClick(e) {
formDisabled(){ // 获取点击目标的x,y坐标
return this.disabled // let target = e.target;
}, var event = e || window.event;
var target = event.target || event.srcElement;
console.log(target.pageX);
let fixX = this.$refs.imgBg.getBoundingClientRect().left;
let fixY = this.$refs.imgBg.getBoundingClientRect().top;
// let fixX = target.x;
// let fixY = target.y;
console.log(fixX, fixY);
// console.log(e.x, e.y);
let offsetWidth = target.offsetWidth;
let offsetHeight = target.offsetHeight;
let offsetX = (event.x - fixX);
let offsetY = (event.y - fixY);
this.doorIconStyle.top = offsetY - 20 + 'px';
this.doorIconStyle.left = offsetX - 20 + 'px';
let x = ((event.x - fixX) / offsetWidth).toFixed(4);
let y = ((event.y - fixY) / offsetHeight).toFixed(4);
this.model.coordinateTmp = x + "," + y;
this.$refs.form.validateField('coordinateTmp');
}, },
created () { statusChange(value) {
//备份model原始值 let targetList = this.statusList.filter(status => status.value === value);
this.modelDefault = JSON.parse(JSON.stringify(this.model)); this.doorIconPath = targetList.length > 0 ? targetList[0].imgPath : null;
},
buildingChange(value) {
let targetList = this.buildingInfos.filter(buildingInfo => buildingInfo.name === value);
if (targetList != null && targetList.length > 0) {
this.targetFloorList = targetList[0].floorList;
} else {
this.targetFloorList = [];
}
},
floorImgLoadComplete(e) {
if (this.model.coordinate) {
this.model.coordinateTmp = this.model.coordinate.x + ',' + this.model.coordinate.y;
this.statusChange(this.model.status);
let target = e.target;
let fixX = 20;
let fixY = 20;
let offsetWidth = target.offsetWidth;
let offsetHeight = target.offsetHeight;
this.doorIconStyle.top = this.model.coordinate.y * offsetHeight - fixY + 'px'
this.doorIconStyle.left = this.model.coordinate.x * offsetWidth - fixX + 'px';
}
}, },
methods: {
add () {
this.edit(this.modelDefault);
},
edit (record) {
this.model = Object.assign({}, record);
this.visible = true;
},
submitForm () {
const that = this;
// 触发表单验证
this.$refs.form.validate(valid => {
if (valid) {
that.confirmLoading = true;
let httpurl = '';
let method = '';
if(!this.model.id){
httpurl+=this.url.add;
method = 'post';
}else{
httpurl+=this.url.edit;
method = 'put';
}
httpAction(httpurl,this.model,method).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.$emit('ok');
}else{
that.$message.warning(res.message);
}
}).finally(() => {
that.confirmLoading = false;
})
}
})
},
}
} }
}
</script> </script>
\ No newline at end of file
jeecg-boot-parent/jeecg-boot-module-property/src/main/java/org/jeecg/pm/entity/PmAccessControlDevice.java
...@@ -128,7 +128,7 @@ public class PmAccessControlDevice implements Serializable { ...@@ -128,7 +128,7 @@ public class PmAccessControlDevice implements Serializable {
*/ */
@Excel(name = "状态", width = 15) @Excel(name = "状态", width = 15)
@ApiModelProperty(value = "状态") @ApiModelProperty(value = "状态")
private String status; private Status status;
/** /**
* 创建人Id（sys_user） * 创建人Id（sys_user）
*/ */
...@@ -165,4 +165,10 @@ public class PmAccessControlDevice implements Serializable { ...@@ -165,4 +165,10 @@ public class PmAccessControlDevice implements Serializable {
@DateTimeFormat(pattern = "yyyy-MM-dd") @DateTimeFormat(pattern = "yyyy-MM-dd")
@ApiModelProperty(value = "修改时间") @ApiModelProperty(value = "修改时间")
private Date modifyTime; private Date modifyTime;
public enum Status {
NORMAL,
OFFLINE,
BREAKDOWN
}
} }
jeecg-boot-parent/jeecg-boot-module-property/src/main/java/org/jeecg/pm/entity/PmMonitoringDevice.java
package org.jeecg.pm.entity; package org.jeecg.pm.entity;
import com.baomidou.mybatisplus.annotation.IdType; import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId; import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName; import com.baomidou.mybatisplus.annotation.TableName;
import com.fasterxml.jackson.annotation.JsonFormat; import com.fasterxml.jackson.annotation.JsonFormat;
...@@ -79,13 +80,13 @@ public class PmMonitoringDevice implements Serializable { ...@@ -79,13 +80,13 @@ public class PmMonitoringDevice implements Serializable {
@ApiModelProperty(value = "设备位置") @ApiModelProperty(value = "设备位置")
private String place; private String place;
// /** /**
// * xy值 * xy值
// */ */
// @Excel(name = "xy值", width = 15) @Excel(name = "xy值", width = 15)
// @ApiModelProperty(value = "xy值") @ApiModelProperty(value = "xy值")
// @TableField(typeHandler = Coordinate.TypeHandler.class) @TableField(typeHandler = Coordinate.TypeHandler.class)
// private Coordinate coordinate; private Coordinate coordinate;
/** /**
* 生产日期 * 生产日期
*/ */
...@@ -121,7 +122,7 @@ public class PmMonitoringDevice implements Serializable { ...@@ -121,7 +122,7 @@ public class PmMonitoringDevice implements Serializable {
*/ */
@Excel(name = "状态", width = 15) @Excel(name = "状态", width = 15)
@ApiModelProperty(value = "状态") @ApiModelProperty(value = "状态")
private String status; private Status status;
/** /**
* 创建人Id（sys_user） * 创建人Id（sys_user）
*/ */
...@@ -152,9 +153,15 @@ public class PmMonitoringDevice implements Serializable { ...@@ -152,9 +153,15 @@ public class PmMonitoringDevice implements Serializable {
/** /**
* 修改时间 * 修改时间
*/ */
@Excel(name = "修改时间", width = 15, format = "yyyy-MM-dd") @Excel(name = "修改时间", width = 15, format = "yyyy-MM-dd hh:mm:ss")
@JsonFormat(timezone = "GMT+8", pattern = "yyyy-MM-dd") @JsonFormat(timezone = "GMT+8", pattern = "yyyy-MM-dd hh:mm:ss")
@DateTimeFormat(pattern = "yyyy-MM-dd") @DateTimeFormat(pattern = "yyyy-MM-dd")
@ApiModelProperty(value = "修改时间") @ApiModelProperty(value = "修改时间")
private Date modifyTime; private Date modifyTime;
public enum Status {
NORMAL,
OFFLINE,
BREAKDOWN
}
} }
jeecg-boot-parent/jeecg-boot-module-property/src/main/java/org/jeecg/pm/service/impl/PmAccessControlDeviceServiceImpl.java
...@@ -22,6 +22,7 @@ public class PmAccessControlDeviceServiceImpl extends ServiceImpl<PmAccessContro ...@@ -22,6 +22,7 @@ public class PmAccessControlDeviceServiceImpl extends ServiceImpl<PmAccessContro
@Override @Override
public boolean save(PmAccessControlDevice entity) { public boolean save(PmAccessControlDevice entity) {
entity.setId(IdWorker.getId()) entity.setId(IdWorker.getId())
.setDeleted(false)
.setCreateTime(new Date()) .setCreateTime(new Date())
.setModifyTime(new Date()); .setModifyTime(new Date());
return super.save(entity); return super.save(entity);
......
jeecg-boot-parent/jeecg-boot-module-property/src/main/java/org/jeecg/pm/service/impl/PmMonitoringDeviceServiceImpl.java
...@@ -30,6 +30,7 @@ public class PmMonitoringDeviceServiceImpl extends ServiceImpl<PmMonitoringDevic ...@@ -30,6 +30,7 @@ public class PmMonitoringDeviceServiceImpl extends ServiceImpl<PmMonitoringDevic
@Override @Override
public boolean save(PmMonitoringDevice entity) { public boolean save(PmMonitoringDevice entity) {
entity.setId(IdWorker.getId()) entity.setId(IdWorker.getId())
.setDeleted(false)
.setCreateTime(new Date()) .setCreateTime(new Date())
.setModifyTime(new Date()); .setModifyTime(new Date());
return super.save(entity); return super.save(entity);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment