Skip to content

D
device-new-platform
Commit 4a6a7d6f authored by 赵啸非's avatar 赵啸非
Browse files
Options

添加前端页面

parent 9137e3bd
Hide whitespace changes
Inline Side-by-side
Showing with 244 additions and 145 deletions
device-manager-ui/admin/src/views/device/drawershow.vue
View file @ 4a6a7d6f
<template> <template>
<!-- 弹出框表单 --> <!-- 弹出框表单 -->
<el-drawer <el-drawer
:title="title" :title="title"
:visible.sync="open" :visible.sync="open"
:direction="direction" :direction="direction"
size="70%" size="70%"
> >
<el-form ref="form" :model="form" :rules="rules" label-width="120px"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row> <el-row>
<Field
<Field label="设备名称" prop="deviceName" v-model="form.deviceName" placeholder="请输入设备名称"/> label="设备名称"
<Field label="设备编码" prop="deviceCode" v-model="form.deviceCode" placeholder="请输入设备编码码"/> prop="deviceName"
<Field label="MAC地址" prop="deviceMac" v-model="form.deviceMac" placeholder="请输入设备的MAC地址"/> v-model="form.deviceName"
<!-- <Field label="平台类型" prop="platformId" v-model="form.platformId" type="select" :enumData="dict.platformId" placeholder="请选择平台类型"/> --> placeholder="请输入设备名称"
<Field label="产品类型" prop="productId" v-model="form.productId" type="select" :enumData="dict.productId" placeholder="请选择产品类型"/> />
<Field label="设备生产商" placeholder="请选择设备生产商" prop="deviceFirmId" v-model="form.deviceFirmId" type="select" :enumData="dict.deviceFirmId" /> <Field
<Field label="设备来源" prop="deviceSrc" v-model="form.deviceSrc" type="select" :enumData="dict.deviceSrc" placeholder="请选择设备来源"/> label="设备编码"
<Field label="数据获取方式" prop="deviceDataSourceWay" v-model="form.deviceDataSourceWay" type="select" :enumData="dict.deviceDataSourceWay" placeholder="请选择数据获取方式"/> prop="deviceCode"
<Field label="经度" prop="lon" v-model="form.lon" placeholder="请输入经度"/> v-model="form.deviceCode"
<Field label="纬度" prop="lati" v-model="form.lati" placeholder="请输入纬度"/> placeholder="请输入设备编码码"
<Field label="所属楼栋" prop="deviceInBuilding" v-model="form.deviceInBuilding" type="num" placeholder="请选择所属楼栋"></Field> />
<Field label="所属楼层" prop="deviceInFloor" v-model="form.deviceInFloor" type="num" placeholder="请选择所属楼层"/> <Field
<Field label="保修期至" prop="defectsLiabilityPeriod" v-model="form.defectsLiabilityPeriod" type="datetime" /> label="MAC地址"
<Field label="负责人" prop="leadingOfficial" v-model="form.leadingOfficial" placeholder="请输入负责人"/> prop="deviceMac"
<Field label="联系电话" prop="leadingOfficialTelephone" v-model="form.leadingOfficialTelephone" placeholder="请输入联系电话"/> v-model="form.deviceMac"
<Field label="接收异常短信" prop="isReceiveMess" v-model="form.isReceiveMess" type="select" :enumData="dict.isReceiveMess" placeholder="请选择是否接收异常短信"/> placeholder="请输入设备的MAC地址"
/>
<Field label="启用状态 " prop="enabled" v-model="form.enabled" type="select" :enumData="dict.enabled" placeholder="请选择启用状态 "/> <!-- <Field label="平台类型" prop="platformId" v-model="form.platformId" type="select" :enumData="dict.platformId" placeholder="请选择平台类型"/> -->
<Field :span="24" label="上传图片" <Field
><ImageUpload label="产品类型"
v-model="form.devicePhotoPath" prop="productId"
prePath="/file/preview" v-model="form.productId"
/></Field> type="select"
<Field label="授权码" :span="24" prop="deviceAuthCode" v-model="form.deviceAuthCode" type="textarea" placeholder="请输入授权码"/> :enumData="dict.productId"
placeholder="请选择产品类型"
<Field label="备注" :span="24" prop="deviceRemark" v-model="form.deviceRemark" type="textarea" placeholder="请输入备注"/> />
<Field
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="请选择设备来源"
/>
<Field
label="数据获取方式"
prop="deviceDataSourceWay"
v-model="form.deviceDataSourceWay"
type="select"
:enumData="dict.deviceDataSourceWay"
placeholder="请选择数据获取方式"
/>
<Field
label="经度"
prop="lon"
v-model="form.lon"
placeholder="请输入经度"
/>
<Field
label="纬度"
prop="lati"
v-model="form.lati"
placeholder="请输入纬度"
/>
<Field
label="所属楼栋"
prop="deviceInBuilding"
v-model="form.deviceInBuilding"
type="num"
placeholder="请选择所属楼栋"
></Field>
<Field
label="所属楼层"
prop="deviceInFloor"
v-model="form.deviceInFloor"
type="num"
placeholder="请选择所属楼层"
/>
<Field
label="保修期至"
prop="defectsLiabilityPeriod"
v-model="form.defectsLiabilityPeriod"
type="datetime"
/>
<Field
label="负责人"
prop="leadingOfficial"
v-model="form.leadingOfficial"
placeholder="请输入负责人"
/>
<Field
label="联系电话"
prop="leadingOfficialTelephone"
v-model="form.leadingOfficialTelephone"
placeholder="请输入联系电话"
/>
<Field
label="接收异常短信"
prop="isReceiveMess"
v-model="form.isReceiveMess"
type="select"
:enumData="dict.isReceiveMess"
placeholder="请选择是否接收异常短信"
/>
</el-row> <Field
<form-buttons @submit='submitForm' noCancelBtn /> label="启用状态 "
</el-form> prop="enabled"
v-model="form.enabled"
type="select"
:enumData="dict.enabled"
placeholder="请选择启用状态 "
/>
<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="请输入授权码"
/>
</el-drawer> <Field
label="备注"
:span="24"
prop="deviceRemark"
v-model="form.deviceRemark"
type="textarea"
placeholder="请输入备注"
/>
</el-row>
<form-buttons @submit="submitForm" noCancelBtn />
</el-form>
</el-drawer>
</template> </template>
<script> <script>
import form from "@/assets/mixins/formdialog"; import form from "@/assets/mixins/formdialog";
import ImageUpload from "@/components/ImageUpload"; import ImageUpload from "@/components/ImageUpload";
export default { export default {
mixins: [form], mixins: [form],
components: { components: {
ImageUpload, ImageUpload,
}, },
data() { data() {
return { return {
// 遮罩层 siteCode: "",
loading: true, siteName: "",
// 弹出层标题 // 遮罩层
title: "设备", loading: true,
// 是否显示弹出层 // 弹出层标题
open: false, title: "设备",
direction:"rtl", // 是否显示弹出层
toString:[ open: false,
"deviceFirmId", direction: "rtl",
"platformId", toString: [
"productId", "deviceFirmId",
"deviceSrc", "platformId",
"deviceDataSourceWay", "productId",
"isReceiveMess", "deviceSrc",
"deviceStatus", "deviceDataSourceWay",
"enabled", "isReceiveMess",
"deviceFirmId" "deviceStatus",
], "enabled",
toDate:["defectsLiabilityPeriod"], "deviceFirmId",
],
// 表单校验 toDate: ["defectsLiabilityPeriod"],
rules: {
deviceName: [
{required: true,message: "请输入设备名称", trigger: "blur" },
{max: 20,message: "最多只能录入20个字符",trigger: "blur",},
],
deviceCode: [
{required: true,message: "请输入设备编码", trigger: "blur" },
],
platformId: [
{required: true,message: "请选择平台", trigger: "blur" },
],
productId: [
{required: true,message: "请选择产品", trigger: "blur" },
],
}
};
},
methods: { // 表单校验
/** 编辑 */ rules: {
edit(row) { deviceName: [
this.reset() { required: true, message: "请输入设备名称", trigger: "blur" },
this.query = { id: row.id }; { max: 20, message: "最多只能录入20个字符", trigger: "blur" },
this.urls.currUrl =this.pageInfo.editUrl;; ],
this.getData(); deviceCode: [
this.pageInfo.type="edit" { required: true, message: "请输入设备编码", trigger: "blur" },
this.title = "修改设备"; ],
}, platformId: [
/** 新增 */ { required: true, message: "请选择平台", trigger: "blur" },
add(row) { ],
this.reset() productId: [{ required: true, message: "请选择产品", trigger: "blur" }],
},
this.urls.currUrl = this.pageInfo.addUrl; };
this.pageInfo.type="add" },
this.form.siteId = row.siteId; methods: {
this.form.siteName = row.siteName; /** 编辑 */
this.form.siteCode = row.siteCode; edit(row) {
this.getData(); this.reset();
this.title = "新增设备"; this.query = { id: row.id };
}, this.urls.currUrl = this.pageInfo.editUrl;
/** 查看*/ this.getData();
view(row) { this.pageInfo.type = "edit";
this.reset() this.title = "修改设备";
this.query = { id: row.id }; },
this.urls.currUrl =this.pageInfo.viewUrl;; /** 新增 */
this.getData(); add(row) {
this.pageInfo.type="view" this.reset();
this.title = "设备详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
console.log("form:",this.form) this.urls.currUrl = this.pageInfo.addUrl;
// if(this.pageInfo.type=='add'){ this.pageInfo.type = "add";
// this.form.siteId = this.siteId;
// this.form.siteName = this.siteName;
// this.form.siteCode = this.siteCode;
// }
this.form.siteId = row.siteId;
this.siteName = row.siteName;
this.siteCode = row.siteCode;
this.getData();
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;
}, console.log("form:", this.form);
if (this.pageInfo.type == "add") {
this.form.siteName = this.siteName;
this.form.siteCode = this.siteCode;
}
},
afterSubmit(data) { afterSubmit(data) {
this.open = false; this.open = false;
this.$emit("ok"); this.$emit("ok");
}, },
// 表单重置 // 表单重置
reset() { reset() {
this.form = {}; this.form = {};
this.resetForm("form"); this.resetForm("form");
}, },
resetForm(refName) { resetForm(refName) {
if (this.$refs[refName]) { if (this.$refs[refName]) {
this.$refs[refName].resetFields(); this.$refs[refName].resetFields();
} }
}, },
handleClose(){ handleClose() {
console.log("关闭") console.log("关闭");
} },
}, },
}; };
</script> </script>
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