Commit 9f2f3854 authored by 赵啸非's avatar 赵啸非

Merge remote-tracking branch 'origin/master'

parents 32d7b20d 39d05e00
export default {
created() {
// this.getData();
// this.getData();
},
beforeDestroy() {
clearTimeout(this.loadingTimer);
......@@ -8,30 +8,28 @@ export default {
methods: {
// 渲染前置处理
beforeRender(data) {
return data
return data;
},
// 渲染后置处理
afterRender(data) {
},
afterRender(data) {},
// 提交表单的前置处理
beforeSubmit(data) {
return data
return data;
},
// 提交表单的后置处理, 会阻断默认的回退行为
afterSubmit(data) {
this.$router.go(-1);
},
// 开启、关闭
changePath(path) {
this.pageInfo.list = path + "/list";
this.pageInfo.del = path + "/delete";
this.pageInfo.add = path + "/add";
this.pageInfo.edit = path + "/edit";
this.pageInfo.view = path + "/view";
},
// 开启、关闭
changePath(path) {
this.pageInfo.list = path + "/list";
this.pageInfo.del = path + "/delete";
this.pageInfo.add = path + "/add";
this.pageInfo.edit = path + "/edit";
this.pageInfo.view = path + "/view";
},
// 默认拉取数据
getData() {
this.loading = true;
......@@ -46,19 +44,18 @@ export default {
res.entity = this.util_toDateStr(res.entity, this.toDate);
this.form = Object.assign({}, this.form, res.entity);
this.dict = Object.assign({}, this.dict, res.dict);
this.afterRender(res);
})
.catch(error => {
this.$message.error(error.message)
throw error
.catch((error) => {
this.$message.error(error.message);
throw error;
})
.then(data => {
.then((data) => {
clearTimeout(this.loadingTimer);
this.loadingTimer = setTimeout(() => {
this.loading = false;
}, 300);
})
});
},
// 提交表单
submitForm(ref) {
......@@ -66,70 +63,81 @@ export default {
el.validate((valid) => {
if (!valid) return;
this.loading = true;
this.$post(this.urls.saveUrl || this.pageInfo.saveUrl, this.beforeSubmit(this.form))
.then(res => {
this.$post(
this.urls.saveUrl || this.pageInfo.saveUrl,
this.beforeSubmit(this.form)
)
.then((res) => {
this.$message.success(res.msg);
this.afterSubmit(res);
})
.catch(error => {
.catch((error) => {
this.$message.error(error.message);
})
.then(data => {
.then((data) => {
clearTimeout(this.loadingTimer);
this.loadingTimer = setTimeout(() => {
this.loading = false;
}, 200);
})
});
});
},
// 复制一个数组或对象
util_copy(data) {
return JSON.parse(JSON.stringify(data))
return JSON.parse(JSON.stringify(data));
},
// 工具方法,把数字转化为字符串
util_toString(data, array) {
//原始数据
const dataCopy = Object.assign({}, data);
array.forEach(item => {
array.forEach((item) => {
//如果相等做操作
dataCopy[item] = dataCopy[item] === undefined ? '' : dataCopy[item] + '';
})
dataCopy[item] =
dataCopy[item] === undefined ? "" : dataCopy[item] + "";
});
return dataCopy;
},
// 工具方法,把字符串转化为数组
util_toArrays(data, array) {
const dataCopy = Object.assign({}, data);
array.forEach(item => {
dataCopy[item] = dataCopy[item] === undefined ? [] : dataCopy[item].split(",");
})
array.forEach((item) => {
dataCopy[item] =
dataCopy[item] === undefined ? [] : dataCopy[item].split(",");
});
return dataCopy;
},
// 工具方法,把字符串转化为格式化日期
util_toDateStr(data, array) {
const dataCopy = Object.assign({}, data);
array.forEach(item => {
dataCopy[item] = dataCopy[item] === undefined ? '' : this.util_formatterDate(dataCopy[item]);
})
array.forEach((item) => {
dataCopy[item] =
dataCopy[item] === undefined
? ""
: this.util_formatterDate(dataCopy[item]);
});
return dataCopy;
},
util_formatterDate(time) {
let date = new Date(Number(time));
let Y = date.getFullYear() + '-';
let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
let D = this.panLeft(date.getDate()) + ' ';
let h = this.panLeft(date.getHours()) + ':';
let m = this.panLeft(date.getMinutes()) + ':';
let Y = date.getFullYear() + "-";
let M =
(date.getMonth() + 1 < 10
? "0" + (date.getMonth() + 1)
: date.getMonth() + 1) + "-";
let D = this.panLeft(date.getDate()) + " ";
let h = this.panLeft(date.getHours()) + ":";
let m = this.panLeft(date.getMinutes()) + ":";
let s = this.panLeft(date.getSeconds());
return Y + M + D + h + m + s;
},
panLeft(num) {
return num < 10 ? '0' + num : num;
return num < 10 ? "0" + num : num;
},
// 从dict字段暴力取值,取不到则返回原值
util_formatter(key, val) {
try {
return this.dict[key][val]
return this.dict[key][val];
} catch (error) {
return val;
}
......@@ -142,24 +150,24 @@ export default {
}
});
}, 0);
}
},
},
computed: {
pageInfo() {
let currUrl = this.$route.path;
let urlArray = currUrl.split('/');
let urlArray = currUrl.split("/");
let type = urlArray.pop();
urlArray.push('save');
let saveUrl = urlArray.join('/');
urlArray.push("save");
let saveUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('edit');
let editUrl = urlArray.join('/');
urlArray.push("edit");
let editUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('add');
let addUrl = urlArray.join('/');
urlArray.push("add");
let addUrl = urlArray.join("/");
urlArray.pop();
urlArray.push('view');
let viewUrl = urlArray.join('/');
urlArray.push("view");
let viewUrl = urlArray.join("/");
return {
type,
currUrl,
......@@ -183,9 +191,6 @@ export default {
toString: [], // 需要把number转化为string的表单字段name数组
toArrays: [], // 需要把number转化为arrays的表单字段name数组
toDate: [], // 需要把number转化为date的表单字段name数组
}
}
}
};
},
};
......@@ -176,13 +176,14 @@ export default {
// 格式化单元格数据
formatter(row, column, val) {
const content = formatter(this.tableData, column, val);
return content ? (
<el-tag type={"info"} size="mini">
{content}
</el-tag>
) : (
) : val ? (
val
) : (
"--"
);
},
......
......@@ -64,36 +64,52 @@
<div class="center">
<div class="center-top">
<div class="center-top-item">
<img src="@/assets/images/icon1.png" alt="">
<img src="@/assets/images/icon1.png" alt="" />
<div>
<h2 style="color: #69f3ff;text-shadow: 0 0 10px #69f3ff5b,0 0 20px #69f3ff5b,0 0 30px #69f3ff5b,0 0 40px #69f3ff5b;">{{centerTop.deviceTotalCount || 0}}</h2>
<h2
style="color: #69f3ff;text-shadow: 0 0 10px #69f3ff5b,0 0 20px #69f3ff5b,0 0 30px #69f3ff5b,0 0 40px #69f3ff5b;"
>
{{ centerTop.deviceOnlineCount || 0 }}
</h2>
<p>在线设备总数</p>
</div>
</div>
<div class="center-top-item">
<img src="@/assets/images/icon2.png" alt="">
<img src="@/assets/images/icon2.png" alt="" />
<div>
<h2 style="color: #ffba69;text-shadow: 0 0 10px #ffb9693d,0 0 20px #ffb9693d,0 0 30px #ffb9693d,0 0 40px #ffb9693d;">{{centerTop.deviceOfflineCount || 0}}</h2>
<h2
style="color: #ffba69;text-shadow: 0 0 10px #ffb9693d,0 0 20px #ffb9693d,0 0 30px #ffb9693d,0 0 40px #ffb9693d;"
>
{{ centerTop.deviceOfflineCount || 0 }}
</h2>
<p>离线设备总数</p>
</div>
</div>
<div class="center-top-item">
<img src="@/assets/images/icon3.png" alt="">
<img src="@/assets/images/icon3.png" alt="" />
<div>
<h2 style="color: #ff69b3;text-shadow: 0 0 10px #ff69b452,0 0 20px #ff69b452,0 0 30px #ff69b452,0 0 40px #ff69b452;">{{centerTop.deviceStopCount || 0}}</h2>
<h2
style="color: #ff69b3;text-shadow: 0 0 10px #ff69b452,0 0 20px #ff69b452,0 0 30px #ff69b452,0 0 40px #ff69b452;"
>
{{ centerTop.deviceStopCount || 0 }}
</h2>
<p>停用设备总数</p>
</div>
</div>
<div class="center-top-item">
<img src="@/assets/images/icon4.png" alt="">
<img src="@/assets/images/icon4.png" alt="" />
<div>
<h2 style="color: #25f06c;text-shadow: 0 0 10px #25f06c3a,0 0 20px #25f06c3a,0 0 30px #25f06c3a,0 0 40px #25f06c3a;">{{centerTop.pushTotalCount || 0}}</h2>
<h2
style="color: #25f06c;text-shadow: 0 0 10px #25f06c3a,0 0 20px #25f06c3a,0 0 30px #25f06c3a,0 0 40px #25f06c3a;"
>
{{ centerTop.pushTotalCount || 0 }}
</h2>
<p>今日消息推送总数</p>
</div>
</div>
</div>
<div class="center-three">
<three :floorArr="floorArr" lv="1" :checkItem="checkDeviceItem"/>
<three :floorArr="floorArr" lv="1" :checkItem="checkDeviceItem" />
</div>
</div>
<div class="right">
......@@ -204,19 +220,20 @@ export default {
components: {
HeaderSite,
TitleItem,
three
three,
},
data() {
return {
floorArr:[],
floorArr: [],
siteId: session.getSession("siteid"),
warningInfo: {
data: [],
rowNum: 5,
waitTime: 2000,
unit: "",
},
realTimeInfo: {
header: ["设备名称", "告警次数", "告警时间", "告警类型",'设备编码'],
header: ["设备名称", "告警次数", "告警时间", "告警类型", "设备编码"],
headerHeight: 30,
headerBGC: "#3B5A9E",
oddRowBGC: "",
......@@ -237,38 +254,38 @@ export default {
deviceFirmCollect: {}, // 设备厂家排名
alarmLevelCollect: {}, // 今日告警等级分布
deviceAlarmMapInfoList: [], // 实施告警消息
Statlist:[],//设备列表
checkDeviceItem:{},//选中设备
centerTop:{}
Statlist: [], //设备列表
checkDeviceItem: {}, //选中设备
centerTop: {},
};
},
created() {
this.getStatlist()
this.getStatlist();
this.getDevAlarm();
this.getData();
setTimeout(()=>{
this.floorArr = floorArr
},500)
this.centerDeviceType()
setTimeout(() => {
this.floorArr = floorArr;
}, 500);
this.centerDeviceType();
},
methods: {
// 中间设备状态
centerDeviceType(){
this.$post("/device/stat/list", { siteId: this.siteId,selected:0 }).then(res=>{
const {code,data} = res
console.log(data,"@@@@@")
if(code == 1 && data.data.length>0){
this.centerTop = data.data[0]
centerDeviceType() {
this.$post("/device/stat/list", {
siteId: this.siteId,
selected: 0,
}).then((res) => {
const { code, data } = res;
if (code == 1 && data.data.length > 0) {
this.centerTop = data.data[0];
console.log(this.centerTop);
}
})
});
},
// 点击设备
tabelRow(arr){
const {rowIndex} = arr
this.checkDeviceItem = this.Statlist[rowIndex]
console.log(this.checkDeviceItem,"111")
tabelRow(arr) {
const { rowIndex } = arr;
this.checkDeviceItem = this.Statlist[rowIndex];
},
// 获取今日告警设备统计
getDevAlarm() {
......@@ -285,7 +302,7 @@ export default {
alarmTypeCollect,
deviceFirmCollect,
alarmLevelCollect,
deviceAlarmMapInfoList,
// deviceAlarmMapInfoList,
} = res.data;
this.deviceTotalCount = deviceTotalCount;
this.siteSize = siteSize;
......@@ -297,24 +314,31 @@ export default {
this.deviceFirmCollect = deviceFirmCollect;
this.siteDeviceAlarmCollect = siteDeviceAlarmCollect;
this.alarmLevelCollect = alarmLevelCollect;
this.deviceAlarmMapInfoList = deviceAlarmMapInfoList;
// this.deviceAlarmMapInfoList = deviceAlarmMapInfoList;
// if (deviceAlarmMapInfoList.length) {
// let arr = deviceAlarmMapInfoList.map((v) => {
// return [
// v.deviceName,
// v.deviceName || "--",
// v.count,
// v.alarmTime,
// this.filterDevAlarmType(v.alarmType),
// ];
// });
// this.realTimeInfo = { ...this.realTimeInfo, data: arr };
// }
let { 直连设备, 子设备, 网关设备 } = deviceConnTypeCollect;
let { 在线, 离线, 缺纸 } = alarmTypeCollect;
let firmName = Object.keys(deviceFirmCollect).map((key) => key);
let firmValues = Object.keys(deviceFirmCollect).map((key) =>
Number(deviceFirmCollect[key])
let arr = Object.entries(deviceFirmCollect).sort((a, b) => {
return parseFloat(b[1]) - parseFloat(a[1]);
});
let newDeviceFirmCollect = {};
arr.forEach((v) => {
newDeviceFirmCollect[v[0]] = v[1];
});
let firmName = Object.keys(newDeviceFirmCollect).map((key) => key);
let firmValues = Object.keys(newDeviceFirmCollect).map((key) =>
Number(newDeviceFirmCollect[key])
);
if (Object.keys(siteDeviceAlarmCollect).length) {
let arr = Object.keys(siteDeviceAlarmCollect).map((key) => {
......@@ -337,28 +361,29 @@ export default {
);
},
// 查询单个异常设备
getStatlist(){
this.$post("/device/alarm/info/statlist", { siteId: this.siteId }).then(res=>{
const {code,data} = res
if(code == 1){
this.Statlist = data || []
if (data.length) {
let arr = data.map((v) => {
return [
v.device.deviceName,
v.todayAlarmDeviceCount,
this.$moment(v.alarmTime).format('YYYY-MM-DD HH:mm'),
v.alarmTypeStr,
v.device.deviceCode
];
});
this.realTimeInfo = { ...this.realTimeInfo, data: arr };
getStatlist() {
this.$post("/device/alarm/info/statlist", { siteId: this.siteId }).then(
(res) => {
const { code, data } = res;
if (code == 1) {
this.Statlist = data || [];
if (data.length) {
let arr = data.map((v) => {
return [
v.device.deviceName || "--",
v.todayAlarmInfoCount,
this.$moment(v.alarmTime).format("YYYY-MM-DD HH:mm"),
this.filterDevAlarmType(v.alarmTypeStr),
v.device.deviceCode,
];
});
this.realTimeInfo = { ...this.realTimeInfo, data: arr };
}
}
}
})
);
},
// 获取设备类型分布图标
// 获取设备类型分布
getDevTypeDisEchart(direct, subset, network) {
let chartDom = document.getElementById("devTypeDis");
this.devType = this.$echarts.init(chartDom);
......@@ -712,17 +737,18 @@ export default {
// 过滤设备告警类型
filterDevAlarmType(type) {
if (type == "离线") {
return `<span style='color:#FF4A4A'>${type}</span>`;
return `<span style='color:#FF964A'>${type}</span>`;
} else if (type == "在线") {
return `<span style='color:#5ceeff'>${type}</span>`;
} else if (type == "停用") {
return `<span style='color:#FF964A'>${type}</span>`;
return `<span style='color:#FF4A4A'>${type}</span>`;
}
},
// 定时获取数据
getData() {
this.timer = setInterval(() => {
this.getDevAlarm();
this.getStatlist();
}, 1000 * 60);
},
},
......@@ -839,27 +865,27 @@ export default {
.center {
width: 780px;
position: relative;
.center-top{
.center-top {
display: flex;
align-items: center;
justify-content:space-around;
justify-content: space-around;
}
.center-three{
.center-three {
height: 780px;
width: 780px;
}
.center-top-item{
.center-top-item {
display: flex;
align-items: center;
img{
img {
display: block;
width: 55px;
margin-right: 5px;
}
h2{
h2 {
font-size: 20px;
}
p{
p {
font-size: 12px;
}
}
......@@ -946,4 +972,4 @@ export default {
}
}
}
</style>
\ No newline at end of file
</style>
<template>
<!-- 弹出框表单 -->
<el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<!-- <Field :span="20" label="设备名称" prop="deviceName" v-model="form.deviceName" placeholder="请输入设备名称"/> -->
<Field :span="20" label="设备编码" prop="deviceCode" v-model="form.deviceCode" placeholder="请输入设备编码"/>
<Field :span="20" label="平台类型" prop="platformId" v-model="form.platformId" type="select" :enumData="dict.platformId" placeholder="请选择平台类型"/>
<Field :span="20" label="产品类型" prop="productId" v-model="form.productId" type="select" :enumData="dict.productId" placeholder="请选择产品类型"/>
<Field :span="20" label="设备的MAC地址" prop="deviceMac" v-model="form.deviceMac" placeholder="请输入设备的MAC地址"/>
<!-- <Field :span="20" label="中心设备编码" v-model="form.centernum" placeholder="请输入中心设备编码"/> -->
<Field :span="20" disabled label="设备访问ip" v-model="form.ip" />
<Field :span="20" disabled label="端口" v-model="form.port" />
<Field :span="20" disabled label="站点编号" v-model="form.siteNum" />
<Field
<!-- 弹出框表单 -->
<el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<!-- <Field :span="20" label="设备名称" prop="deviceName" v-model="form.deviceName" placeholder="请输入设备名称"/> -->
<Field
:span="20"
label="设备编码"
prop="deviceCode"
v-model="form.deviceCode"
placeholder="请输入设备编码"
/>
<Field
:span="20"
label="平台类型"
prop="platformId"
v-model="form.platformId"
type="select"
:enumData="dict.platformId"
placeholder="请选择平台类型"
/>
<Field
:span="20"
label="产品类型"
prop="productId"
v-model="form.productId"
type="select"
:enumData="dict.productId"
placeholder="请选择产品类型"
/>
<Field
:span="20"
label="设备的MAC地址"
prop="deviceMac"
v-model="form.deviceMac"
placeholder="请输入设备的MAC地址"
/>
<!-- <Field :span="20" label="中心设备编码" v-model="form.centernum" placeholder="请输入中心设备编码"/> -->
<Field :span="20" disabled label="设备访问ip" v-model="form.ip" />
<Field :span="20" disabled label="端口" v-model="form.port" />
<Field :span="20" disabled label="站点编号" v-model="form.siteNum" />
<Field
:span="20"
label="设备生产商:"
placeholder="请选择设备生产商"
......@@ -21,133 +49,144 @@
type="select"
:enumData="dict.deviceFirmId"
/>
<Field :span="20" label="备注" prop="deviceRemark" v-model="form.deviceRemark" type="textarea" placeholder="请输入备注"/>
<Field :span="20" label="启用状态 " prop="status" v-model="form.status" type="radio" :enumData="dict.status" placeholder="请选择启用状态 "/>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" class="addclass" v-if="pageInfo.type !== 'view'" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<Field
:span="20"
label="备注"
prop="deviceRemark"
v-model="form.deviceRemark"
type="textarea"
placeholder="请输入备注"
/>
<Field
:span="20"
label="启用状态 "
prop="status"
v-model="form.status"
type="radio"
:enumData="dict.status"
placeholder="请选择启用状态 "
/>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button
type="primary"
class="addclass"
v-if="pageInfo.type !== 'view'"
@click="submitForm"
>确 定</el-button
>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
import form from "@/assets/mixins/formdialog";
import dialogShow from "./dialogshow";
export default {
mixins: [form],
components: {
dialogShow ,
},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "设备",
// 是否显示弹出层
open: false,
direction:"rtl",
toString:[
"deviceType",
"deviceOnlineStatus",
"status",
"deviceFirmId"
],
// 表单校验
rules: {
deviceName: [
{required: true,message: "请输入设备名称", trigger: "blur" },
{max: 20,message: "最多只能录入20个字符",trigger: "blur",},
],
deviceType: [
{required: true,message: "请输入设备类型", trigger: "blur" },
],
deviceOnlineStatus: [
{required: true,message: "请输入在线状态 ", trigger: "blur" },
],
status: [
{required: true,message: "请输入启用状态 ", trigger: "blur" },
],
createTime: [
{required: true,message: "请选择创建时间" },
],
}
};
},
import form from "@/assets/mixins/formdialog";
import dialogShow from "./dialogshow";
export default {
mixins: [form],
components: {
dialogShow,
},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "设备",
// 是否显示弹出层
open: false,
direction: "rtl",
toString: ["deviceType", "deviceOnlineStatus", "status", "deviceFirmId"],
// 表单校验
rules: {
deviceName: [
{ required: true, message: "请输入设备名称", trigger: "blur" },
{ max: 20, message: "最多只能录入20个字符", trigger: "blur" },
],
deviceType: [
{ required: true, message: "请输入设备类型", trigger: "blur" },
],
deviceOnlineStatus: [
{ required: true, message: "请输入在线状态 ", trigger: "blur" },
],
status: [
{ required: true, message: "请输入启用状态 ", trigger: "blur" },
],
createTime: [{ required: true, message: "请选择创建时间" }],
},
};
},
methods: {
/** 编辑 */
edit(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl =this.pageInfo.editUrl;;
this.getData();
this.pageInfo.type="edit"
this.title = "修改设备";
},
/** 新增 */
add(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl = this.pageInfo.addUrl;
this.getData();
this.pageInfo.type="add"
this.title = "新增设备";
},
/** 查看*/
view(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl =this.pageInfo.viewUrl;;
this.getData();
this.pageInfo.type="view"
this.title = "设备详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
methods: {
/** 编辑 */
edit(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = this.pageInfo.editUrl;
this.getData();
this.pageInfo.type = "edit";
this.title = "修改设备";
},
/** 新增 */
add(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = this.pageInfo.addUrl;
this.getData();
this.pageInfo.type = "add";
this.title = "新增设备";
},
/** 查看*/
view(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = this.pageInfo.viewUrl;
this.getData();
this.pageInfo.type = "view";
this.title = "设备详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
// 表单重置
reset() {
this.form = {
deviceName : "",
deviceCode : "",
deviceType : 1,
deviceMac : "",
ip : "",
centernum : "",
port : "",
siteNum : "",
deviceFirmId : null,
deviceFirmname : "",
deviceOnlineStatus : 0,
status : 0,
deviceRemark : "",
onlineTime : null,
offlineTime : null,
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
// 表单重置
reset() {
this.form = {
deviceName: "",
deviceCode: "",
deviceType: 1,
deviceMac: "",
ip: "",
centernum: "",
port: "",
siteNum: "",
deviceFirmId: null,
deviceFirmname: "",
deviceOnlineStatus: 0,
status: 0,
deviceRemark: "",
onlineTime: null,
offlineTime: null,
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
</script>
<template>
<!-- 弹出框表单 -->
<el-drawer
:title="title"
:visible.sync="open"
:direction="direction"
size="70%"
:title="title"
:visible.sync="open"
:direction="direction"
size="70%"
>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<Field
label="设备名称"
prop="deviceName"
v-model="form.deviceName"
placeholder="请输入设备名称"
label="设备名称"
prop="deviceName"
v-model="form.deviceName"
placeholder="请输入设备名称"
/>
<!-- <Field
label="设备编码"
......@@ -21,51 +21,51 @@
placeholder="请输入设备编码码"
/> -->
<Field
label="MAC地址"
prop="deviceCode"
v-model="form.deviceCode"
placeholder="请输入设备的MAC地址"
label="MAC地址"
prop="deviceCode"
v-model="form.deviceCode"
placeholder="请输入设备的MAC地址"
/>
<Field
label="所属机构"
prop="orgName"
v-model="form.orgName"
placeholder="请输入设备的所属机构"
label="所属机构"
prop="orgName"
v-model="form.orgName"
placeholder="请输入设备的所属机构"
/>
<!-- <Field label="平台类型" prop="platformId" v-model="form.platformId" type="select" :enumData="dict.platformId" placeholder="请选择平台类型"/> -->
<Field
label="产品类型"
prop="productId"
v-model="form.productId"
type="select"
:enumData="dict.productId"
@change="changeProduct"
placeholder="请选择产品类型"
label="产品类型"
prop="productId"
v-model="form.productId"
type="select"
:enumData="dict.productId"
@change="changeProduct"
placeholder="请选择产品类型"
/>
<Field
label="设备生产商"
placeholder="请选择设备生产商"
prop="deviceFirmId"
v-model="form.deviceFirmId"
type="select"
:enumData="dict.deviceFirmId"
label="设备生产商"
placeholder="请选择设备生产商"
prop="deviceFirmId"
v-model="form.deviceFirmId"
type="select"
:enumData="dict.deviceFirmId"
/>
<Field
label="设备来源"
prop="deviceSrc"
v-model="form.deviceSrc"
type="select"
:enumData="dict.deviceSrc"
placeholder="请选择设备来源"
label="设备来源"
prop="deviceSrc"
v-model="form.deviceSrc"
type="select"
:enumData="dict.deviceSrc"
placeholder="请选择设备来源"
/>
<Field
label="数据获取方式"
prop="deviceDataSourceWay"
v-model="form.deviceDataSourceWay"
type="select"
:enumData="dict.deviceDataSourceWay"
placeholder="请选择数据获取方式"
label="数据获取方式"
prop="deviceDataSourceWay"
v-model="form.deviceDataSourceWay"
type="select"
:enumData="dict.deviceDataSourceWay"
placeholder="请选择数据获取方式"
/>
<!-- <Field
label="经度"
......@@ -80,107 +80,125 @@
placeholder="请输入纬度"
/> -->
<Field
label="默认首页"
prop="skinId"
v-model="form.skinId"
@change="skinSelect"
:enumData="
label="默认首页"
prop="skinId"
v-model="form.skinId"
@change="skinSelect"
:enumData="
!form.productCode
? { 0: '无' }
: dict.skinProductCodeMap[form.productCode]
"
type="select"
placeholder="选择首页"
type="select"
placeholder="选择首页"
/>
<Field
label="所属楼栋"
prop="deviceInBuilding"
v-model="form.deviceInBuilding"
type="num"
placeholder="请选择所属楼栋"
label="所属楼栋"
prop="deviceInBuilding"
v-model="form.deviceInBuilding"
type="num"
placeholder="请选择所属楼栋"
></Field>
<Field
label="所属楼层"
prop="deviceInFloor"
v-model="form.deviceInFloor"
type="num"
placeholder="请选择所属楼层"
label="所属楼层"
prop="deviceInFloor"
v-model="form.deviceInFloor"
type="num"
placeholder="请选择所属楼层"
/>
<Field
label="保修期至"
prop="defectsLiabilityPeriod"
v-model="form.defectsLiabilityPeriod"
type="datetime"
label="保修期至"
prop="defectsLiabilityPeriod"
v-model="form.defectsLiabilityPeriod"
type="datetime"
/>
<Field
label="负责人"
prop="leadingOfficial"
v-model="form.leadingOfficial"
placeholder="请输入负责人"
label="负责人"
prop="leadingOfficial"
v-model="form.leadingOfficial"
placeholder="请输入负责人"
/>
<Field
label="联系电话"
prop="leadingOfficialTelephone"
v-model="form.leadingOfficialTelephone"
placeholder="请输入联系电话"
label="联系电话"
prop="leadingOfficialTelephone"
v-model="form.leadingOfficialTelephone"
placeholder="请输入联系电话"
/>
<Field
label="接收异常短信"
prop="isReceiveMess"
v-model="form.isReceiveMess"
type="select"
:enumData="dict.isReceiveMess"
placeholder="请选择是否接收异常短信"
label="接收异常短信"
prop="isReceiveMess"
v-model="form.isReceiveMess"
type="select"
:enumData="dict.isReceiveMess"
placeholder="请选择是否接收异常短信"
/>
<Field
label="利旧设备"
prop="source"
v-model="form.source"
type="select"
:enumData="dict.source"
placeholder="请选择状态 "
label="利旧设备"
prop="source"
v-model="form.source"
type="select"
:enumData="dict.source"
placeholder="请选择状态 "
/>
<Field
label="启用状态"
prop="enabled"
v-model="form.enabled"
type="select"
:enumData="dict.enabled"
placeholder="请选择启用状态 "
label="启用状态"
prop="enabled"
v-model="form.enabled"
type="select"
:enumData="dict.enabled"
placeholder="请选择启用状态 "
/>
<Field label="显示短信" prop="showSms" v-model="form.showSms" type="radio" :enumData="dict.showSms" placeholder="请选择是否显示短信"/>
<Field label="显示打印机" prop="showPrint" v-model="form.showPrint" type="radio" :enumData="dict.showPrint" placeholder="请选择是否显示打印机"/>
<Field label="小程序二维码" prop="showWechatQrCode" v-model="form.showWechatQrCode" type="radio" :enumData="dict.showWechatQrCode" placeholder="请选择是否显示小程序二维码"/>
<Field
label="显示短信"
prop="showSms"
v-model="form.showSms"
type="radio"
:enumData="dict.showSms"
placeholder="请选择是否显示短信"
/>
<Field
label="显示打印机"
prop="showPrint"
v-model="form.showPrint"
type="radio"
:enumData="dict.showPrint"
placeholder="请选择是否显示打印机"
/>
<Field
label="小程序二维码"
prop="showWechatQrCode"
v-model="form.showWechatQrCode"
type="radio"
:enumData="dict.showWechatQrCode"
placeholder="请选择是否显示小程序二维码"
/>
<Field :span="24" label="上传图片"
>
<ImageUpload v-model="form.devicePhotoPath" prePath="/file/preview"
/>
<Field :span="24" label="上传图片">
<ImageUpload v-model="form.devicePhotoPath" prePath="/file/preview" />
</Field>
<Field
label="授权码"
:span="24"
prop="deviceAuthCode"
v-model="form.deviceAuthCode"
type="textarea"
placeholder="请输入授权码"
label="授权码"
:span="24"
prop="deviceAuthCode"
v-model="form.deviceAuthCode"
type="textarea"
placeholder="请输入授权码"
/>
<Field
label="备注"
:span="24"
prop="deviceRemark"
v-model="form.deviceRemark"
type="textarea"
placeholder="请输入备注"
label="备注"
:span="24"
prop="deviceRemark"
v-model="form.deviceRemark"
type="textarea"
placeholder="请输入备注"
/>
</el-row>
<form-buttons @submit="submitForm" noCancelBtn/>
<form-buttons @submit="submitForm" noCancelBtn />
</el-form>
</el-drawer>
</template>
......@@ -229,20 +247,20 @@ export default {
// 表单校验
rules: {
deviceName: [
{required: true, message: "请输入设备名称", trigger: "blur"},
{max: 20, message: "最多只能录入20个字符", trigger: "blur"},
{ required: true, message: "请输入设备名称", trigger: "blur" },
{ max: 20, message: "最多只能录入20个字符", trigger: "blur" },
],
deviceCode: [
{required: true, message: "请输入设备编码", trigger: "blur"},
{ required: true, message: "请输入设备编码", trigger: "blur" },
],
deviceMac: [
{required: true, message: "请输入Mac地址", trigger: "blur"},
{ required: true, message: "请输入Mac地址", trigger: "blur" },
],
platformId: [
{required: true, message: "请选择平台", trigger: "blur"},
{ required: true, message: "请选择平台", trigger: "blur" },
],
productId: [{required: true, message: "请选择产品", trigger: "blur"}],
productId: [{ required: true, message: "请选择产品", trigger: "blur" }],
},
};
},
......@@ -252,13 +270,14 @@ export default {
this.form.productCode = this.dict.productCode[val];
},
skinSelect(val) {
this.form.skinName =
this.dict.skinProductCodeMap[this.form.productCode][val];
this.form.skinName = this.dict.skinProductCodeMap[this.form.productCode][
val
];
},
/** 编辑 */
edit(row) {
this.reset();
this.query = {id: row.id};
this.query = { id: row.id };
this.urls.currUrl = "/device/edit";
this.siteName = row.siteName;
this.siteCode = row.siteCode;
......@@ -280,7 +299,7 @@ export default {
/** 查看*/
view(row) {
this.reset();
this.query = {id: row.id};
this.query = { id: row.id };
this.urls.currUrl = "/device/view";
this.getData();
this.pageInfo.type = "view";
......@@ -314,8 +333,7 @@ export default {
this.$refs[refName].resetFields();
}
},
handleClose() {
},
handleClose() {},
},
};
</script>
......@@ -10,7 +10,7 @@
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-tabs style="margin-left: 10px" v-model="activeName">
<el-tab-pane label="设备详情" name="deviceDetail">
<view-show :form="viewInfo" :dict="dict" />
<view-show :siteInfo="siteInfo" :form="viewInfo" :dict="dict" />
</el-tab-pane>
<el-tab-pane label="告警记录" name="alarmLog">
<alarm-list :queryIn="{ alarmDevice: form.id }" />
......@@ -42,6 +42,13 @@ export default {
alarmList,
moduleList,
},
props: {
siteInfo: {
type: Object,
required: true,
default: () => {},
},
},
data() {
return {
activeName: "deviceDetail",
......
......@@ -254,7 +254,7 @@
<drawer-show ref="drawerform" @ok="getData" />
<drawer-view ref="drawerViewform" @ok="getData" />
<drawer-view ref="drawerViewform" :siteInfo="siteInfo" @ok="getData" />
</div>
</template>
......@@ -310,7 +310,7 @@ export default {
siteId: null,
siteName: "",
siteCode: "",
siteInfo: {},
updateSiteId: null,
updateSiteName: "",
updateSiteCode: "",
......@@ -476,6 +476,7 @@ export default {
//this.info=res.data
this.siteName = res.data.siteName;
this.siteCode = res.data.siteCode;
this.siteInfo = res.data;
}
})
.catch((error) => {
......
......@@ -102,7 +102,7 @@
{{ form.lon }}
</el-descriptions-item>
<el-descriptions-item
label="度"
label="度"
label-class-name="labelClass"
content-class-name="contentClass"
>
......@@ -231,7 +231,27 @@
设备位置
</template>
</el-descriptions>
<Map></Map>
<!-- <Map></Map> -->
<div class="map">
<el-amap
vid="amaps"
:zoom="20"
viewMode="3D"
expandZoomRange
:center="[siteInfo.longitude, siteInfo.latitude]"
>
<el-amap-marker
vid="2"
topWhenClick
:label="{
content: `我在${siteInfo.detailAddress}`,
offset: [0, -20],
}"
:position="[siteInfo.longitude, siteInfo.latitude]"
:icon="require('@/assets/images/d.png')"
></el-amap-marker>
</el-amap>
</div>
</layout-view>
</template>
......@@ -248,6 +268,11 @@ export default {
type: Object,
default: null,
},
siteInfo: {
type: Object,
required: true,
default: () => {},
},
},
components: {},
created() {},
......@@ -326,4 +351,8 @@ export default {
.contentClass {
width: 600px;
}
</style>
\ No newline at end of file
.map {
width: 100%;
height: 600px;
}
</style>
......@@ -139,7 +139,7 @@
<el-divider></el-divider>
<el-row
v-for="(v, index) in tableData.data"
v-for="(v, index) in productList.data"
:key="index"
type="flex"
style="border-bottom: 1px solid #e8eaec; padding: 10px"
......@@ -245,6 +245,7 @@ export default {
});
},
switchChange(val) {
this.$forceUpdate();
let arr = [];
for (let item in this.items) {
if (this.items[item] && this.items[item] != 0)
......@@ -258,6 +259,7 @@ export default {
afterRender(data) {
if (!this.sync) {
this.$nextTick(() => {
this.productList = data;
let count = 0;
for (let i of data.data) {
this.items[count] = i.productId + "";
......@@ -298,6 +300,7 @@ export default {
data() {
return {
originData: [],
productList: [],
value1: 1,
sync: false,
// 用户导入参数
......
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