code-image-backup-public/fastbee
1
0
Fork 0
mirror of https://gitee.com/beecue/fastbee.git synced 2025-12-21 02:15:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

更新

Browse Source
This commit is contained in:
kerwincui
2024-03-17 14:59:23 +08:00
parent 3d44f4674c
commit 5539c1b6af
999 changed files with 115642 additions and 10757 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
vue/src/views/iot/product/index.vue
View File

@@ -23,7 +23,7 @@
</el-form>
</el-card>
<el-card style="padding-bottom:100px;">
<el-row :gutter="30" v-loading="loading" >
<el-row :gutter="30" v-loading="loading">
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" v-for="(item,index) in productList" :key="index" style="margin-bottom:30px;text-align:center;">
<el-card :body-style="{ padding: '20px'}" shadow="always" class="card-item">
<el-row type="flex" :gutter="10" justify="space-between">
@@ -35,10 +35,10 @@
</el-col>
<el-col :span="4">
<el-tooltip class="item" effect="dark" content="取消发布" placement="top-start" v-if="item.status==2">
<el-button type="success" size="mini" style="padding:5px;" @click="changeProductStatus(item.productId,1)">已发布</el-button>
<el-button type="success" size="mini" style="padding:5px;" @click="changeProductStatus(item.productId,1,item.deviceType)">已发布</el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="现在发布" placement="top-start" v-if="item.status==1">
<el-button type="info" size="mini" style="padding:5px;" @click="changeProductStatus(item.productId,2)">未发布</el-button>
<el-button type="info" size="mini" style="padding:5px;" @click="changeProductStatus(item.productId,2,item.deviceType)">未发布</el-button>
</el-tooltip>
</el-col>
</el-row>
@@ -63,12 +63,14 @@
<el-col :span="10">
<div style="margin-top:10px;">
<el-image style="width:100%;height:100px;border-radius:10px;" lazy :preview-src-list="[baseUrl+item.imgUrl]" :src="baseUrl+item.imgUrl" fit="cover" v-if="item.imgUrl!=null && item.imgUrl!=''"></el-image>
<el-image style="width:100%;height:100px;border-radius:10px;" :preview-src-list="[require('@/assets/images/product.jpg')]" :src="require('@/assets/images/product.jpg')" fit="cover" v-else></el-image>
<el-image style="width:100%;height:100px;border-radius:10px;" :preview-src-list="[require('@/assets/images/gateway.png')]" :src="require('@/assets/images/gateway.png')" fit="cover" v-else-if="item.deviceType==2"></el-image>
<el-image style="width:100%;height:100px;border-radius:10px;" :preview-src-list="[require('@/assets/images/video.png')]" :src="require('@/assets/images/video.png')" fit="cover" v-else-if="item.deviceType==3"></el-image>
<el-image style="width:100%;height:100px;border-radius:10px;" :preview-src-list="[require('@/assets/images/product.png')]" :src="require('@/assets/images/product.png')" fit="cover" v-else></el-image>
</div>
</el-col>
</el-row>
<el-button-group style="margin-top:15px;height:28px;">
<el-button size="mini" type="primary" icon="el-icon-edit" @click="handleEditProduct(item)" v-hasPermi="['iot:product:edit']">详情</el-button>
<el-button size="mini" type="primary" icon="el-icon-view" @click="handleEditProduct(item)" v-hasPermi="['iot:product:query']">详情</el-button>
<el-button size="mini" type="danger" icon="el-icon-delete" @click="handleDelete(item)" v-hasPermi="['iot:product:remove']" v-if="item.status==1">删除</el-button>
<el-button size="mini" type="success" icon="el-icon-s-check" @click="handleDeviceAuthorize(item)" v-hasPermi="['iot:product:edit']" v-if="item.status==2" :disabled="item.isAuthorize!=1">设备授权</el-button>
<el-button size="mini" type="warning" icon="el-icon-search" @click="handleViewDevice(item.productId)" v-hasPermi="['iot:device:query']">查看设备</el-button>
@@ -104,9 +106,14 @@
import {
listProduct,
delProduct,
changeProductStatus
changeProductStatus,
deviceCount,
} from "@/api/iot/product";
import {
checkPermi
} from "@/utils/permission"
export default {
name: "Product",
dicts: ['iot_yes_no', 'iot_product_status', 'iot_device_type', 'iot_network_method', 'iot_vertificate_method', 'iot_device_chip'],
@@ -162,13 +169,38 @@ export default {
this.loading = false;
});
},
/**同步获取产品下的设备数量**/
getDeviceCountByProductId(productId) {
return new Promise((resolve, reject) => {
deviceCount(productId).then(res => {
resolve(res);
}).catch(error => {
reject(error);
})
})
},
/** 更新产品状态 */
changeProductStatus(productId,status) {
let message="发生错误了";
if(status==2){
message="产品发布后不能再更改产品内容和对应物模型 ！";
}else if(status==1){
message="产品下不能有已经创建的设备，才能取消发布哦 ！"
async changeProductStatus(productId, status, deviceType) {
let message = "确定取消发布？";
if (status == 2) {
// 发布
let hasPermission = checkPermi(['iot:product:add']);
if (!hasPermission) {
this.$modal.alertError("没有操作权限");
return;
}
message = "产品发布后，可以创建对应的设备";
} else if (status == 1) {
// 取消发布
let hasPermission = checkPermi(['iot:product:edit']);
if (!hasPermission) {
this.$modal.alertError("没有操作权限");
return;
}
let result = await this.getDeviceCountByProductId(productId);
if (result.data > 0) {
message = "重要提示：产品下已有 " + result.data + " 个设备，取消发布可以修改产品信息和模型，重新发布后对应设备状态将会被重置！"
}
}
this.$confirm(message, '提示', {
confirmButtonText: '确定',
@@ -178,6 +210,7 @@ export default {
let data = {};
data.productId = productId;
data.status = status;
data.deviceType = deviceType;
changeProductStatus(data).then(response => {
this.getList();
this.$modal.alertSuccess(response.msg);
@@ -217,16 +250,16 @@ export default {
},
/** 下载SDK */
downloadSdk() {
this.$download.zip("/iot/tool/genSdk?deviceChip=" + 1, "wumeismart-sdk");
this.$download.zip("/iot/tool/genSdk?deviceChip=" + 1, "fastbee-sdk");
},
/** 删除按钮操作 */
handleDelete(row) {
const productIds = row.productId || this.ids;
let msg = "";
this.$modal.confirm('是否确认删除产品编号为"' + productIds + '"的数据项？').then(function () {
return delProduct(productIds).then(response => {
msg = response.msg;
});
// // 删除SIP配置
// delSipconfigByProductId(productIds).then(response => {});
return delProduct(productIds);
}).then(() => {
this.getList();
this.$modal.msgSuccess(msg);
@@ -246,14 +279,14 @@ export default {
}
});
},
/** 设备授权操作 */
/** 设备授权操作 */
handleDeviceAuthorize(row) {
let productId = row.productId
this.$router.push({
path: '/iot/product-edit',
query: {
productId: productId,
tabPanelName:'productAuthorize',
tabPanelName: 'productAuthorize',
pageNum: this.queryParams.pageNum
}
});
@@ -264,6 +297,6 @@ export default {
<style scoped>
.card-item {
border-radius:15px;
border-radius: 15px;
}
</style>

8
vue/src/views/iot/product/product-authorize.vue
View File

@@ -108,7 +108,7 @@
<!-- 设备详情对话框 -->
<el-dialog title="设备详情" :visible.sync="openDevice" width="600px" append-to-body>
<div v-if="device==null" style="text-align:center;"><i class="el-icon-warning" style="color:#E6A23C;"></i> 提示：查找不到设备，可能已经被删除</div>
<div v-if="device==null" style="text-align:center;"><i class="el-icon-warning" style="color:#E6A23C;"></i> 提示：查找不到设备，可能已经被删除</div>
<el-descriptions border :column="2" size="medium" v-if="device!=null">
<el-descriptions-item label="设备ID">{{device.deviceId}}</el-descriptions-item>
<el-descriptions-item label="设备名称">{{device.deviceName}}</el-descriptions-item>
@@ -277,7 +277,7 @@ export default {
},
/** 修改按钮操作 */
goToEditDevice(deviceId) {
this.openDevice=false;
this.openDevice = false;
this.$router.push({
path: '/iot/device-edit',
query: {
@@ -290,6 +290,10 @@ export default {
this.deviceLoading = true;
this.deviceParams.params = {};
listUnAuthDevice(this.deviceParams).then(response => {
//设备列表初始化isSelect值，用于单选
for (let i = 0; i < response.rows.length; i++) {
response.rows[i].isSelect = false;
}
this.deviceList = response.rows;
this.deviceTotal = response.total;
this.deviceLoading = false;

497
vue/src/views/iot/product/product-edit.vue
View File

@@ -1,136 +1,188 @@
<template>
<el-card style="margin:6px;padding-bottom:100px;">
<el-tabs v-model="activeName" tab-position="left" style="padding:10px;">
<el-tab-pane name="basic">
<span slot="label"><span style="color:red;">* </span>基本信息</span>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-row :gutter="100">
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<el-form-item label="产品名称" prop="productName">
<el-input v-model="form.productName" placeholder="请输入产品名称" :readonly="form.status==2" />
</el-form-item>
<el-form-item label="产品分类" prop="categoryId">
<el-select v-model="form.categoryId" placeholder="请选择分类" @change="selectCategory" style="width:100%" :disabled="form.status==2">
<el-option v-for="category in categoryShortList" :key="category.id" :label="category.name" :value="category.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="联网方式" prop="networkMethod">
<el-select v-model="form.networkMethod" placeholder="请选择联网方式" style="width:100%;" :disabled="form.status==2">
<el-option v-for="dict in dict.type.iot_network_method" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select>
</el-form-item>
<el-form-item label="启用授权" prop="networkMethod">
<el-switch v-model="form.isAuthorize" @change="changeIsAuthorize(form.isAuthorize)" :active-value="1" :inactive-value="0" :disabled="form.status==2" />
</el-form-item>
<el-form-item label="备注信息" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" rows="3" :readonly="form.status==2" />
<el-card style="margin:6px;padding-bottom:100px;">
<el-tabs v-model="activeName" tab-position="left" style="padding:10px;min-height:400px;" @tab-click="tabChange">
<el-tab-pane name="basic">
<span slot="label"><span style="color:red;">* </span>基本信息</span>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-row :gutter="100">
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<el-form-item label="产品名称" prop="productName">
<el-input v-model="form.productName" placeholder="请输入产品名称" :readonly="form.status == 2" />
</el-form-item>
<el-form-item label="产品分类" prop="categoryId">
<el-select v-model="form.categoryId" placeholder="请选择分类" @change="selectCategory"
style="width:100%" :disabled="form.status == 2">
<el-option v-for="category in categoryShortList" :key="category.id"
:label="category.name" :value="category.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="设备类型" prop="deviceType">
<el-select v-model="form.deviceType" placeholder="请选择设备类型" :disabled="form.status == 2"
style="width:100%">
<el-option v-for="dict in dict.type.iot_device_type" :key="dict.value"
:label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select>
</el-form-item>
<el-form-item label="传输协议" prop="transport">
<el-select v-model="form.transport" placeholder="请选择传输协议" style="width: 100%"
:disabled="form.status == 2">
<el-option v-for="dict in dict.type.iot_transport_type" :key="dict.value"
:label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item v-if="form.deviceType !== 3" label="编码协议" prop="protocolCode">
<el-select v-model="form.protocolCode" placeholder="请选择编码协议" style="width: 100%"
:disabled="form.status == 2" @change="changeProductCode">
<el-option v-for="p in protocolList" :key="p.protocolCode" :label="p.protocolName"
:value="p.protocolCode" />
</el-select>
</el-form-item>
<el-form-item label="联网方式" prop="networkMethod">
<el-select v-model="form.networkMethod" placeholder="请选择联网方式" style="width:100%;"
:disabled="form.status == 2">
<el-option v-for="dict in dict.type.iot_network_method" :key="dict.value"
:label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select>
</el-form-item>
<el-form-item label="备注信息" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" rows="3"
:readonly="form.status == 2" />
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<el-form-item label="启用授权" prop="networkMethod">
<el-switch v-model="form.isAuthorize" @change="changeIsAuthorize(form.isAuthorize)"
:active-value="1" :inactive-value="0"
:disabled="form.status == 2 || form.deviceType == 3" />
</el-form-item>
<el-form-item label="认证方式" prop="vertificateMethod">
<el-select v-model="form.vertificateMethod" placeholder="请选择认证方式" style="width:100%"
:disabled="form.status == 2 || form.deviceType == 3">
<el-option v-for="dict in dict.type.iot_vertificate_method" :key="dict.value"
:label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select>
</el-form-item>
<el-form-item label="产品编号" prop="productId">
<el-input v-model="form.productId" placeholder="自动生成"
:disabled="!form.mqttAccount || form.deviceType == 3" readonly />
</el-form-item>
<el-form-item label="Mqtt账号" prop="mqttAccount">
<el-input v-model="form.mqttAccount" placeholder="不填自动生成" :disabled="form.deviceType == 3"
:readonly="accountInputType == 'password'" :type="accountInputType">
<el-button slot="append" icon="el-icon-view" style="font-size:18px;"
@click="changeInputType('account')"></el-button>
</el-input>
</el-form-item>
<el-form-item label="Mqtt密码" prop="mqttPassword">
<el-input v-model="form.mqttPassword" placeholder="不填则自动生成" :disabled="form.deviceType == 3"
:readonly="passwordInputType == 'password'" :type="passwordInputType">
<el-button slot="append" icon="el-icon-view" style="font-size:18px;"
@click="changeInputType('password')"></el-button>
</el-input>
</el-form-item>
<el-form-item label="产品秘钥" prop="mqttSecret">
<el-input v-model="form.mqttSecret" placeholder="自动生成"
:disabled="!form.mqttAccount || form.deviceType == 3" readonly :type="keyInputType">
<el-button slot="append" icon="el-icon-view" style="font-size:18px;"
@click="changeInputType('key')"></el-button>
</el-input>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<el-form-item label="产品图片">
<div v-if="form.status == 2 && form.imgUrl == null">
<el-image style="height:145px;height:145px;border-radius:10px;"
:preview-src-list="[require('@/assets/images/gateway.png')]"
:src="require('@/assets/images/gateway.png')" fit="cover"
v-if="form.deviceType == 2"></el-image>
<el-image style="height:145px;height:145px;border-radius:10px;"
:preview-src-list="[require('@/assets/images/video.png')]"
:src="require('@/assets/images/video.png')" fit="cover"
v-else-if="form.deviceType == 3"></el-image>
<el-image style="height:145px;height:145px;border-radius:10px;"
:preview-src-list="[require('@/assets/images/product.png')]"
:src="require('@/assets/images/product.png')" fit="cover" v-else></el-image>
</div>
<div v-else>
<imageUpload ref="image-upload" :disabled="true" :value="form.imgUrl"
:limit="form.status == 2 ? 0 : 1" :fileSize="1" @input="getImagePath($event)">
</imageUpload>
</div>
<div class="el-upload__tip" style="color:#f56c6c"
v-if="form.productId == null || form.productId == 0">提示：上传后需要提交保存</div>
</el-form-item>
</el-col>
</el-row>
<el-col :span="20">
<el-form-item style="text-align: center;margin:40px 0px;">
<el-button type="primary" @click="submitForm" v-hasPermi="['iot:product:edit']"
v-show="form.productId != 0 && form.status != 2">修 改</el-button>
<el-button type="primary" @click="submitForm" v-hasPermi="['iot:product:add']"
v-show="form.productId == 0 && form.status != 2">新 增</el-button>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<el-form-item label="设备类型" prop="deviceType">
<el-select v-model="form.deviceType" placeholder="请选择设备类型" :disabled="form.status==2" style="width:100%">
<el-option v-for="dict in dict.type.iot_device_type" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select>
</el-form-item>
<el-form-item label="认证方式" prop="vertificateMethod">
<el-select v-model="form.vertificateMethod" placeholder="请选择认证方式" style="width:100%" :disabled="form.status==2">
<el-option v-for="dict in dict.type.iot_vertificate_method" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select>
</el-form-item>
<el-form-item label="产品编号" prop="productId">
<el-input v-model="form.productId" placeholder="自动生成" :disabled="!form.mqttAccount" readonly />
</el-form-item>
<el-form-item label="Mqtt账号" prop="mqttAccount">
<el-input v-model="form.mqttAccount" placeholder="自动生成" :disabled="!form.mqttAccount" readonly :type="accountInputType">
<el-button slot="append" icon="el-icon-view" style="font-size:18px;" @click="changeInputType('account')"></el-button>
</el-input>
</el-form-item>
<el-form-item label="Mqtt密码" prop="mqttPassword">
<el-input v-model="form.mqttPassword" placeholder="自动生成" :disabled="!form.mqttAccount" readonly :type="passwordInputType">
<el-button slot="append" icon="el-icon-view" style="font-size:18px;" @click="changeInputType('password')"></el-button>
</el-input>
</el-form-item>
<el-form-item label="产品秘钥" prop="mqttSecret">
<el-input v-model="form.mqttSecret" placeholder="自动生成" :disabled="!form.mqttAccount" readonly :type="keyInputType">
<el-button slot="append" icon="el-icon-view" style="font-size:18px;" @click="changeInputType('key')"></el-button>
</el-input>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<el-form-item label="产品图片">
<div v-if="form.status==2 && form.imgUrl==null">
<el-image style="height:145px;height:145px;border-radius:10px;" :preview-src-list="[require('@/assets/images/product.jpg')]" :src="require('@/assets/images/product.jpg')" fit="cover"></el-image>
</div>
<div v-else>
<imageUpload ref="image-upload" :disabled="true" :value="form.imgUrl" :limit="form.status==2 ? 0 : 1" :fileSize="1" @input="getImagePath($event)"></imageUpload>
</div>
<div class="el-upload__tip" style="color:#f56c6c" v-if="form.productId==null || form.productId==0">提示：上传后需要提交保存</div>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-tab-pane>
<el-col :span="20">
<el-form-item style="text-align: center;margin:40px 0px;">
<el-button type="primary" @click="submitForm()" v-if="form.status!=2">提交</el-button>
</el-form-item>
</el-col>
</el-form>
</el-tab-pane>
<el-tab-pane label="" name="things" :disabled="form.productId == 0">
<span slot="label"><span style="color:red;">* </span>产品模型</span>
<product-things-model ref="productThingsModel" :product="form" />
</el-tab-pane>
<el-tab-pane label="" name="things" :disabled="form.productId==0">
<span slot="label"><span style="color:red;">* </span>产品模型</span>
<product-things-model ref="productThingsModel" :product="form" />
</el-tab-pane>
<el-tab-pane label="" name="productFirmware" :disabled="form.productId==0">
<span slot="label">固件管理</span>
<product-firmware ref="productFirmware" :product="form" />
</el-tab-pane>
<el-tab-pane label="" name="productAuthorize" :disabled="form.productId == 0" v-if="form.deviceType !== 3">
<span slot="label">设备授权</span>
<product-authorize ref="productAuthorize" :product="form" />
</el-tab-pane>
<el-tab-pane label="" name="productAuthorize" :disabled="form.productId==0 || form.isAuthorize==0">
<span slot="label">设备授权</span>
<product-authorize ref="productAuthorize" :product="form" />
</el-tab-pane>
<el-tab-pane label="" name="alert" :disabled="form.productId == 0" v-if="form.deviceType !== 3">
<span slot="label"><span style="color:red;">￥ </span>告警配置</span>
<business ref="business"/>
</el-tab-pane>
<el-tab-pane label="" name="alert" :disabled="form.productId==0">
<span slot="label"> 告警配置</span>
<product-alert ref="productAlert" :product="form"></product-alert>
</el-tab-pane>
<el-tab-pane label="" name="productApp" :disabled="form.productId==0">
<span slot="label">控制界面</span>
<product-app ref="productApp" :product="form" />
</el-tab-pane>
<div style="margin-top:200px;"></div>
<el-tab-pane label="" disabled name="product01" />
<el-tab-pane label="" disabled name="product02" />
<el-tab-pane label="" disabled name="product03" />
<el-tab-pane v-if="form.status==1" name="product04">
<span slot="label">
<el-button type="success" size="mini" @click="changeProductStatus(2)">发布产品</el-button>
</span>
</el-tab-pane>
<el-tab-pane v-if="form.status==2" name="product05">
<span slot="label">
<el-button type="danger" size="mini" @click="changeProductStatus(1)">取消发布</el-button>
</span>
</el-tab-pane>
<el-tab-pane name="product06">
<span slot="label">
<el-button type="info" size="mini" @click="goBack()">返回列表</el-button>
</span>
</el-tab-pane>
</el-tabs>
<!-- 用于设置间距 -->
<el-tab-pane>
<span slot="label">
<div style="margin-top:200px;"></div>
</span>
</el-tab-pane>
</el-card>
<el-tab-pane v-if="form.status == 1" name="product04" disabled>
<span slot="label">
<el-button type="success" size="mini" @click="changeProductStatus(2)"
v-hasPermi="['iot:product:add']">发布产品</el-button>
</span>
</el-tab-pane>
<el-tab-pane v-if="form.status == 2" name="product05" disabled>
<span slot="label">
<el-button type="danger" size="mini" @click="changeProductStatus(1)"
v-hasPermi="['iot:product:edit']">取消发布</el-button>
</span>
</el-tab-pane>
<el-tab-pane name="product06" disabled>
<span slot="label">
<el-button type="info" size="mini" @click="goBack()">返回列表</el-button>
</span>
</el-tab-pane>
</el-tabs>
</el-card>
</template>
<script>
import productThingsModel from "./product-things-model";
import productFirmware from "./product-firmware";
import productApp from "./product-app"
import productAlert from "./product-alert"
import productAuthorize from "./product-authorize"
import imageUpload from "../../../components/ImageUpload/index"
import business from "../business/index"
import {
listProtocol
} from "@/api/iot/protocol";
import {
listShortCategory,
} from "@/api/iot/category";
@@ -138,53 +190,106 @@ import {
getProduct,
addProduct,
updateProduct,
changeProductStatus
changeProductStatus,
deviceCount,
} from "@/api/iot/product";
import {
getAllPoints
} from "@/api/iot/template";
export default {
name: "ProductEdit",
dicts: ['iot_device_type', 'iot_network_method', 'iot_vertificate_method'],
dicts: ['iot_device_type', 'iot_network_method', 'iot_vertificate_method', 'iot_transport_type', 'data_collect_type'],
components: {
productThingsModel,
productApp,
productAlert,
productAuthorize,
productFirmware,
imageUpload,
business,
},
data() {
return {
// 输入框类型
keyInputType: "password",
accountInputType: "text",
accountInputType: "password",
passwordInputType: "password",
// 选中选项卡
activeName: 'basic',
// 分类短列表
categoryShortList: [],
//协议列表
protocolList: [],
// 表单参数
form: {
networkMethod: 1,
deviceType: 1,
vertificateMethod: 3,
transport: 'MQTT',
imgUrl: "",
},
// 表单校验
rules: {
productName: [{
required: true,
message: "产品名称不能为空",
trigger: "blur"
}],
trigger: "blur",
},
{
min: 1,
max: 64,
message: '产品名称不能少于1个字符和超过64字符',
trigger: 'blur',
},
],
categoryId: [{
required: true,
message: "产品分类ID不能为空",
trigger: "blur"
}],
deviceType: [{
required: true,
message: "请选择设备类型",
trigger: "blur"
}],
protocolCode: [{
required: true,
message: "设备协议不能为空",
trigger: "blur"
}],
transport: [{
required: true,
message: "传输协议不能为空",
trigger: 'blur'
}]
},
// 查询参数
queryParams: {
tenantName: null,
},
pointList: [],
open: false,
// 弹出层标题
title: "",
loading: true,
tempList: [],
// 总条数
total: 0,
tempTotal: 0,
// 查询参数
pointsParams: {
pageNum: 1,
pageSize: 8,
templateId: 0,
},
tempParams: {
pageNum: 1,
pageSize: 10,
},
currentRow: {},
selectRowData: {},
isModbus: false,
};
},
@@ -202,24 +307,31 @@ export default {
}
// 获取分类信息
this.getShortCategory();
// 设置账号密码输入框类型,新增时为text，查看时为password
if (!this.form.productId || this.form.productId == 0) {
this.accountInputType = "text";
this.passwordInputType = "text";
}
this.getProtocol();
},
activated() {
const time = this.$route.query.t;
if (time != null && time != this.uniqueId) {
this.uniqueId = time;
// 获取产品信息
let productId = this.$route.query.productId
if (productId != null && productId != 0) {
this.form.productId = Number(productId);
this.getProduct();
this.getShortCategory();
}
// 切换选项卡
const tabPanelName = this.$route.query && this.$route.query.tabPanelName;
if (tabPanelName != null && tabPanelName != '') {
this.activeName = tabPanelName;
}
this.uniqueId = time;
}
// 获取产品信息
let productId = this.$route.query.productId
if (productId != null && productId != 0) {
this.form.productId = Number(productId);
this.getProduct();
this.getShortCategory();
}
// 切换选项卡
const tabPanelName = this.$route.query && this.$route.query.tabPanelName;
if (tabPanelName != null && tabPanelName != '') {
this.activeName = tabPanelName;
}
},
methods: {
// 获取简短分类列表
@@ -244,6 +356,7 @@ export default {
getProduct() {
getProduct(this.form.productId).then(response => {
this.form = response.data;
this.changeProductCode(this.form.protocolCode);
});
},
// 表单重置
@@ -262,7 +375,8 @@ export default {
mqttAccount: null,
mqttPassword: null,
mqttSecret: null,
remark: null
remark: null,
imgUrl: "",
};
this.resetForm("form");
},
@@ -272,25 +386,43 @@ export default {
if (valid) {
if (this.form.productId != null && this.form.productId != 0) {
updateProduct(this.form).then(response => {
this.changeProductCode(this.form.protocolCode);
this.$modal.alertSuccess("修改成功");
});
} else {
addProduct(this.form).then(response => {
this.$modal.alertSuccess("添加成功,可以开始定义物模型了");
if (!this.form.isModbus) {
this.$modal.alertSuccess("添加成功,可以开始定义物模型或配置");
} else {
this.$modal.alertSuccess("物模型已经从采集点模板同步至产品")
}
this.form = response.data;
this.activeName = "things";
this.changeProductCode(this.form.protocolCode);
});
}
}
});
},
/**同步获取产品下的设备数量**/
getDeviceCountByProductId(productId) {
return new Promise((resolve, reject) => {
deviceCount(productId).then(res => {
resolve(res);
}).catch(error => {
reject(error);
})
})
},
/** 更新产品状态 */
changeProductStatus(status) {
let message = "发生错误了";
async changeProductStatus(status) {
let message = "确定取消发布？";
if (status == 2) {
message = "产品发布后不能再更改产品内容和对应物模型";
message = "产品发布后，可以创建对应的设备";
} else if (status == 1) {
message = "产品下不能有已经创建的设备，才能取消发布哦"
let result = await this.getDeviceCountByProductId(this.form.productId);
if (result.data > 0) {
message = "重要提示：产品下已有 " + result.data + " 个设备，取消发布可以修改产品信息和模型，重新发布后对应设备状态将会被重置！"
}
}
this.$confirm(message, '提示', {
confirmButtonText: '确定',
@@ -300,12 +432,14 @@ export default {
let data = {};
data.productId = this.form.productId;
data.status = status;
data.deviceType = this.form.deviceType;
changeProductStatus(data).then(response => {
this.$modal.alertSuccess(response.msg);
this.goBack();
this.activeName = "basic";
this.getProduct();
}).catch(() => {
if (status == 2) {
this.activeName = "things";
this.activeName = "basic";
} else {
this.goBack();
}
@@ -349,7 +483,78 @@ export default {
}).catch(() => {
this.form.isAuthorize = 0;
});
}
},
//获取设备协议
getProtocol() {
const data = {
protocolStatus: 1
};
listProtocol(data).then(res => {
this.protocolList = res.rows;
})
},
// 取消按钮
cancel() {
this.open = false;
// this.reset();
},
getList() {
getAllPoints(this.pointsParams).then(response => {
this.pointList = response.rows;
this.total = response.total;
});
},
changeProductCode(val) {
if (val && val.startsWith("MODBUS")) {
this.form.deviceType = 2;
this.form.isModbus = true;
if (this.form.productId != 0 && this.form.productId != null) {
//this.getTempDetail()
}
} else {
this.form.isModbus = false;
}
},
/**选项卡切换事件**/
tabChange(tabItem) {
// 切换到告警配置，获取物模型
if (tabItem.paneName == "alert") {
//this.$refs.productAlert.getCacheThingsModel(this.form.productId);
}
},
/*按照模板名查询*/
queryTemp() {
this.getTempList();
},
/** 搜索按钮操作 */
handleQuery() {
this.tempParams.pageNum = 1
this.getTempList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('tempParams')
this.handleQuery()
},
}
};
</script>
<style>
.el-aside {
margin: 0;
padding: 0;
background-color: #fff;
color: #333;
}
.el-main {
margin: 0;
padding: 0 10px;
background-color: #fff;
color: #333;
}
</style>

105
vue/src/views/iot/product/product-select-template.vue
View File

@@ -1,49 +1,63 @@
<template>
<div style="margin-top:-50px;">
<el-divider></el-divider>
<el-form :model="queryParams" ref="product-select-template" :inline="true" label-width="48px">
<el-form-item label="名称" prop="templateName">
<el-input v-model="queryParams.templateName" placeholder="请输入物模型名称" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="类别" prop="type">
<el-select v-model="queryParams.type" placeholder="请选择模型类别" clearable size="small">
<el-option v-for="dict in dict.type.iot_things_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<div style="margin-top:-50px;">
<el-divider></el-divider>
<el-form :model="queryParams" ref="product-select-template" :inline="true" label-width="48px">
<el-form-item label="名称" prop="templateName">
<el-input v-model="queryParams.templateName" placeholder="请输入物模型名称" clearable size="small"
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="类别" prop="type">
<el-select v-model="queryParams.type" placeholder="请选择模型类别" clearable size="small">
<el-option v-for="dict in dict.type.iot_things_type" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="templateList" @selection-change="handleSelectionChange" ref="selectTemplateTable" size="small">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="名称" align="center" prop="templateName" />
<el-table-column label="标识符" align="center" prop="identifier" />
<el-table-column label="物模型类别" align="center" prop="type">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_things_type" :value="scope.row.type" />
</template>
</el-table-column>
<el-table-column label="首页显示" align="center" prop="isTop">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_yes_no" :value="scope.row.isTop" />
</template>
</el-table-column>
<el-table-column label="监测值" align="center" prop="isMonitor">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_yes_no" :value="scope.row.isMonitor" />
</template>
</el-table-column>
<el-table-column label="数据类型" align="center" prop="datatype">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_data_type" :value="scope.row.datatype" />
</template>
</el-table-column>
</el-table>
<el-table v-loading="loading" :data="templateList" @selection-change="handleSelectionChange"
ref="selectTemplateTable" size="small">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="名称" align="center" prop="templateName" />
<el-table-column label="标识符" align="center" prop="identifier" />
<el-table-column label="物模型类别" align="center" prop="type">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_things_type" :value="scope.row.type" />
</template>
</el-table-column>
<el-table-column label="图表展示" align="center" prop="isChart" width="75">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_yes_no" :value="scope.row.isChart" />
</template>
</el-table-column>
<el-table-column label="实时监测" align="center" prop="isMonitor" width="75">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_yes_no" :value="scope.row.isMonitor" />
</template>
</el-table-column>
<el-table-column label="只读" align="center" prop="isReadonly" width="75">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_yes_no" :value="scope.row.isReadonly" />
</template>
</el-table-column>
<el-table-column label="历史存储" align="center" prop="isHistory" width="75">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_yes_no" :value="scope.row.isHistory" />
</template>
</el-table-column>
<el-table-column label="数据类型" align="center" prop="datatype">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_data_type" :value="scope.row.datatype" />
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
</div>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
</div>
</template>
<script>
@@ -95,7 +109,7 @@ export default {
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.resetForm("product-select-template");
this.handleQuery();
},
// 多选框选中数据
@@ -104,9 +118,8 @@ export default {
this.single = selection.length !== 1;
this.multiple = !selection.length;
// Id数组传递到父组件
this.$emit('idsToParentEvent', this.ids)
this.$emit('idsToParentEvent', this.ids);
},
},
};
</script>

1508
vue/src/views/iot/product/product-things-model.vue
View File

File diff suppressed because it is too large Load Diff