code-image-backup-public/fastbee
1
0
Fork 0
mirror of https://gitee.com/beecue/fastbee.git synced 2026-05-07 16:24:39 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(国际化): 完善国际化

Browse Source
This commit is contained in:
Zhunianya
2026-03-20 10:55:21 +08:00
parent 7709ec6c8c
commit 69d58763ee
31 changed files with 5123 additions and 4723 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
vue/src/views/iot/device/device-log.vue
View File

@@ -45,8 +45,8 @@
<span>{{ scope.row.createTime }}</span>
</template>
</el-table-column>
<el-table-column label="标识符" align="center" prop="identify" />
<el-table-column label="动作" align="left" header-align="center" prop="logValue">
<el-table-column :label="$t('device.device-log.798283-2')" align="center" prop="identify" />
<el-table-column :label="$t('device.device-log.798283-15')" align="left" header-align="center" prop="logValue">
<template slot-scope="scope">
<div v-html="formatValueDisplay(scope.row)"></div>
</template>
@@ -54,7 +54,7 @@
<el-table-column :label="$t('device.device-log.798283-16')" header-align="center" align="left" prop="remark">
<template slot-scope="scope">
{{ scope.row.remark == null ? '无' : scope.row.remark }}
{{ scope.row.remark == null ? $t('device.device-log.798283-17') : scope.row.remark }}
</template>
</el-table-column>
</el-table>

568
vue/src/views/iot/device/device-monitor.vue
View File

@@ -1,296 +1,302 @@
<template>
<div style="padding-left: 20px">
<el-form :inline="true" label-width="100px">
<el-form-item :label="$t('device.device-monitor.817489-0') + '(ms)'">
<el-tooltip class="item" effect="light" :content="$t('device.device-monitor.817489-1')" placement="top">
<el-input v-model="monitorInterval" :placeholder="$t('device.device-monitor.817489-2')" type="number" clearable size="small" style="width: 180px" />
</el-tooltip>
</el-form-item>
<el-form-item :label="$t('device.device-monitor.817489-3')">
<el-tooltip class="item" effect="light" :content="$t('device.device-monitor.817489-4')" placement="top">
<el-input v-model="monitorNumber" :placeholder="$t('device.device-monitor.817489-5')" type="number" clearable size="small" style="width: 180px" />
</el-tooltip>
</el-form-item>
<el-form-item>
<el-button type="success" icon="el-icon-video-play" size="mini" @click="beginMonitor()" style="margin-left: 30px">{{ $t('device.device-monitor.817489-6') }}</el-button>
<el-button type="danger" icon="el-icon-video-pause" size="mini" @click="stopMonitor()">{{ $t('device.device-monitor.817489-7') }}</el-button>
</el-form-item>
</el-form>
<el-row :gutter="20" v-loading="chartLoading" :element-loading-text="$t('device.device-monitor.817489-8')" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)">
<el-col :span="12" v-for="(item, index) in monitorThings" :key="index" style="margin-bottom: 20px">
<el-card shadow="hover" :body-style="{ paddingTop: '10px', marginBottom: '-20px' }">
<div ref="monitor" style="height: 210px; padding: 0"></div>
</el-card>
</el-col>
</el-row>
</div>
<div style="padding-left: 20px">
<el-form :inline="true" label-width="100px">
<el-form-item :label="$t('device.device-monitor.817489-0') + '(ms)'">
<el-tooltip class="item" effect="light" :content="$t('device.device-monitor.817489-1')" placement="top">
<el-input v-model="monitorInterval" :placeholder="$t('device.device-monitor.817489-2')" type="number" clearable size="small" style="width: 180px" />
</el-tooltip>
</el-form-item>
<el-form-item :label="$t('device.device-monitor.817489-3')">
<el-tooltip class="item" effect="light" :content="$t('device.device-monitor.817489-4')" placement="top">
<el-input v-model="monitorNumber" :placeholder="$t('device.device-monitor.817489-5')" type="number" clearable size="small" style="width: 180px" />
</el-tooltip>
</el-form-item>
<el-form-item>
<el-button type="success" icon="el-icon-video-play" size="mini" @click="beginMonitor()" style="margin-left: 30px">{{ $t('device.device-monitor.817489-6') }}</el-button>
<el-button type="danger" icon="el-icon-video-pause" size="mini" @click="stopMonitor()">{{ $t('device.device-monitor.817489-7') }}</el-button>
</el-form-item>
</el-form>
<el-row :gutter="20" v-loading="chartLoading" :element-loading-text="$t('device.device-monitor.817489-8')" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)">
<el-col :span="12" v-for="(item, index) in monitorThings" :key="index" style="margin-bottom: 20px">
<el-card shadow="hover" :body-style="{ paddingTop: '10px', marginBottom: '-20px' }">
<div ref="monitor" style="height: 210px; padding: 0"></div>
</el-card>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
name: 'DeviceMonitor',
props: {
device: {
type: Object,
default: null,
name: 'DeviceMonitor',
props: {
device: {
type: Object,
default: null,
},
},
},
watch: {
// 获取到父组件传递的device后，刷新列表
device: function (newVal, oldVal) {
this.deviceInfo = newVal;
if (this.deviceInfo && this.deviceInfo.deviceId != 0) {
// 监测数据
this.monitorThings = this.deviceInfo.monitorList;
// 监测数据集合初始化
this.dataList = [];
for (let i = 0; i < this.monitorThings.length; i++) {
this.dataList.push({
id: this.monitorThings[i].id,
name: this.monitorThings[i].name,
data: [],
});
// this.dataList[i].data.push(["2022-03-14 23:32:09", "30"]);
}
// 绘制监测图表
this.$nextTick(function () {
this.getMonitorChart();
});
this.mqttCallback();
}
},
},
data() {
return {
// 实时监测间隔
monitorInterval: 1000,
// 实时监测次数
monitorNumber: 60,
// 图表集合
chart: [],
// 图表数据集合
dataList: [],
// 监测物模型
monitorThings: [],
// 图表遮罩层
chartLoading: false,
// 设备信息
deviceInfo: {},
};
},
created() {},
methods: {
/**
* Mqtt发布消息
* @device 设备
* @model 物模型 ,type 类型(1=属性，2=功能，3=OTA升级(商业版支持)，4=实时监测)
* */
mqttPublish(device, model) {
let topic = '';
let message = '';
if (model.type == 4) {
// 实时监测
topic = '/' + device.productId + '/' + device.serialNumber + '/monitor/get';
message = '{"count":' + model.value + ',"interval":' + this.monitorInterval + '}';
} else {
return;
}
if (topic != '') {
// 发布
this.$mqttTool
.publish(topic, message, model.name)
.then((res) => {
this.$modal.notifySuccess(res);
})
.catch((res) => {
this.$modal.notifyError(res);
});
}
},
/* Mqtt回调处理 */
mqttCallback() {
this.$mqttTool.client.on('message', (topic, message, buffer) => {
let topics = topic.split('/');
let productId = topics[1];
let deviceNum = topics[2];
message = JSON.parse(message.toString());
if (!message) {
return;
}
if (topics[3] == 'status') {
console.log('接收到【设备状态】主题：', topic);
console.log('接收到【设备状态】内容：', message);
// 更新列表中设备的状态
if (this.deviceInfo.serialNumber == deviceNum) {
this.deviceInfo.status = message.status;
this.deviceInfo.isShadow = message.isShadow;
this.deviceInfo.rssi = message.rssi;
}
}
if (topics[3] == 'monitor') {
console.log(this.$t('device.device-monitor.817489-11'), topic);
console.log(this.$t('device.device-monitor.817489-12'), message);
// 实时监测
this.chartLoading = false;
for (let k = 0; k < message.length; k++) {
let value = message[k].value;
let id = message[k].id;
let remark = message[k].remark;
// 数据加载到图表
for (let i = 0; i < this.dataList.length; i++) {
if (id == this.dataList[i].id) {
// 普通类型匹配
if (this.dataList[i].length > 50) {
this.dataList[i].shift();
watch: {
// 获取到父组件传递的device后，刷新列表
device: function (newVal, oldVal) {
this.deviceInfo = newVal;
if (this.deviceInfo && this.deviceInfo.deviceId != 0) {
// 监测数据
this.monitorThings = this.deviceInfo.monitorList;
// 监测数据集合初始化
this.dataList = [];
for (let i = 0; i < this.monitorThings.length; i++) {
this.dataList.push({
id: this.monitorThings[i].id,
name: this.monitorThings[i].name,
data: [],
});
// this.dataList[i].data.push(["2022-03-14 23:32:09", "30"]);
}
this.dataList[i].data.push([this.getTime(), value]);
// 更新图表
this.chart[i].setOption({
series: [
{
data: this.dataList[i].data,
},
],
// 绘制监测图表
this.$nextTick(function () {
this.getMonitorChart();
});
break;
} else if (this.dataList[i].id.indexOf('array_') == 0) {
// 数组类型匹配,例如：gateway_temperature,图表id去除前缀后匹配
let index = this.dataList[i].id.substring(6, 8);
let identity = this.dataList[i].id.substring(9);
if (identity == id) {
let values = value.split(',');
if (this.dataList[i].length > 50) {
this.dataList[i].shift();
}
this.dataList[i].data.push([this.getTime(), values[index]]);
// 更新图表
this.chart[i].setOption({
series: [
{
data: this.dataList[i].data,
},
],
});
break;
}
}
this.mqttCallback();
}
}
}
});
},
},
/** 更新实时监测参数*/
beginMonitor() {
if (this.deviceInfo.status != 3) {
this.$modal.alertError('设备不在线，下发指令失败');
return;
}
// 清空图表数据
for (let i = 0; i < this.dataList.length; i++) {
this.dataList[i].data = [];
}
if (this.monitorInterval < 500 || this.monitorInterval > 10000) {
this.$modal.alertError(this.$t('device.device-monitor.817489-14'));
}
if (this.monitorNumber == 0 || this.monitorNumber > 300) {
this.$modal.alertError(this.$t('device.device-monitor.817489-15'));
}
// Mqtt发布实时监测消息
let model = {};
model.name = '更新实时监测';
model.value = this.monitorNumber;
model.type = 4;
this.mqttPublish(this.deviceInfo, model);
this.chartLoading = true;
},
/** 停止实时监测 */
stopMonitor() {
if (this.deviceInfo.status != 3) {
this.$modal.alertError('设备不在线，下发指令失败');
return;
}
this.chartLoading = false;
// Mqtt发布实时监测
let model = {};
model.name = this.$t('device.device-monitor.817489-17');
model.value = 0;
model.type = 4;
this.mqttPublish(this.deviceInfo, model);
},
/**监测数据 */
getMonitorChart() {
let color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'];
for (let i = 0; i < this.monitorThings.length; i++) {
// 设置宽度
this.$refs.monitor[i].style.width = document.documentElement.clientWidth / 2 - 255 + 'px';
this.chart[i] = this.$echarts.init(this.$refs.monitor[i]);
var option;
option = {
title: {
left: 'center',
text: this.monitorThings[i].name + ' ' + this.$t('device.device-monitor.817489-18') + ' ' + (this.monitorThings[i].datatype.unit != undefined ? this.monitorThings[i].datatype.unit : this.$t('device.device-monitor.817489-19')) + '）',
textStyle: {
fontSize: 14,
},
},
grid: {
top: '50px',
left: '20px',
right: '20px',
bottom: '10px',
containLabel: true,
},
tooltip: {
trigger: 'axis',
axisPointer: {
animation: true,
},
},
xAxis: {
type: 'time',
show: false,
splitLine: {
show: false,
},
},
yAxis: {
type: 'value',
boundaryGap: [0, '100%'],
splitLine: {
show: true,
},
},
series: [
{
name: this.monitorThings[i].name,
type: 'line',
symbol: 'none',
sampling: 'lttb',
itemStyle: {
color: i > 9 ? color[0] : color[i],
},
areaStyle: {},
data: [],
},
],
data() {
return {
// 实时监测间隔
monitorInterval: 1000,
// 实时监测次数
monitorNumber: 60,
// 图表集合
chart: [],
// 图表数据集合
dataList: [],
// 监测物模型
monitorThings: [],
// 图表遮罩层
chartLoading: false,
// 设备信息
deviceInfo: {},
};
option && this.chart[i].setOption(option);
}
},
/* 获取当前时间*/
getTime() {
let date = new Date();
let y = date.getFullYear();
let m = date.getMonth() + 1;
let d = date.getDate();
let H = date.getHours();
let mm = date.getMinutes();
let s = date.getSeconds();
m = m < 10 ? '0' + m : m;
d = d < 10 ? '0' + d : d;
H = H < 10 ? '0' + H : H;
return y + '-' + m + '-' + d + ' ' + H + ':' + mm + ':' + s;
created() {},
methods: {
/**
* Mqtt发布消息
* @device 设备
* @model 物模型 ,type 类型(1=属性，2=功能，3=OTA升级(商业版支持)，4=实时监测)
* */
mqttPublish(device, model) {
let topic = '';
let message = '';
if (model.type == 4) {
// 实时监测
topic = '/' + device.productId + '/' + device.serialNumber + '/monitor/get';
message = '{"count":' + model.value + ',"interval":' + this.monitorInterval + '}';
} else {
return;
}
if (topic != '') {
// 发布
this.$mqttTool
.publish(topic, message, model.name)
.then((res) => {
this.$modal.notifySuccess(res);
})
.catch((res) => {
this.$modal.notifyError(res);
});
}
},
/* Mqtt回调处理 */
mqttCallback() {
this.$mqttTool.client.on('message', (topic, message, buffer) => {
let topics = topic.split('/');
let productId = topics[1];
let deviceNum = topics[2];
message = JSON.parse(message.toString());
if (!message) {
return;
}
if (topics[3] == 'status') {
console.log('接收到【设备状态】主题：', topic);
console.log('接收到【设备状态】内容：', message);
// 更新列表中设备的状态
if (this.deviceInfo.serialNumber == deviceNum) {
this.deviceInfo.status = message.status;
this.deviceInfo.isShadow = message.isShadow;
this.deviceInfo.rssi = message.rssi;
}
}
if (topics[3] == 'monitor') {
console.log(this.$t('device.device-monitor.817489-11'), topic);
console.log(this.$t('device.device-monitor.817489-12'), message);
// 实时监测
this.chartLoading = false;
for (let k = 0; k < message.length; k++) {
let value = message[k].value;
let id = message[k].id;
let remark = message[k].remark;
// 数据加载到图表
for (let i = 0; i < this.dataList.length; i++) {
if (id == this.dataList[i].id) {
// 普通类型匹配
if (this.dataList[i].length > 50) {
this.dataList[i].shift();
}
this.dataList[i].data.push([this.getTime(), value]);
// 更新图表
this.chart[i].setOption({
series: [
{
data: this.dataList[i].data,
},
],
});
break;
} else if (this.dataList[i].id.indexOf('array_') == 0) {
// 数组类型匹配,例如：gateway_temperature,图表id去除前缀后匹配
let index = this.dataList[i].id.substring(6, 8);
let identity = this.dataList[i].id.substring(9);
if (identity == id) {
let values = value.split(',');
if (this.dataList[i].length > 50) {
this.dataList[i].shift();
}
this.dataList[i].data.push([this.getTime(), values[index]]);
// 更新图表
this.chart[i].setOption({
series: [
{
data: this.dataList[i].data,
},
],
});
break;
}
}
}
}
}
});
},
/** 更新实时监测参数*/
beginMonitor() {
if (this.deviceInfo.status != 3) {
this.$modal.alertError(this.$t('device.device-monitor.817489-13'));
return;
}
// 清空图表数据
for (let i = 0; i < this.dataList.length; i++) {
this.dataList[i].data = [];
}
if (this.monitorInterval < 500 || this.monitorInterval > 10000) {
this.$modal.alertError(this.$t('device.device-monitor.817489-14'));
}
if (this.monitorNumber == 0 || this.monitorNumber > 300) {
this.$modal.alertError(this.$t('device.device-monitor.817489-15'));
}
// Mqtt发布实时监测消息
let model = {};
model.name = this.$t('device.device-monitor.817489-16');
model.value = this.monitorNumber;
model.type = 4;
this.mqttPublish(this.deviceInfo, model);
this.chartLoading = true;
},
/** 停止实时监测 */
stopMonitor() {
if (this.deviceInfo.status != 3) {
this.$modal.alertError(this.$t('device.device-monitor.817489-13'));
return;
}
this.chartLoading = false;
// Mqtt发布实时监测
let model = {};
model.name = this.$t('device.device-monitor.817489-17');
model.value = 0;
model.type = 4;
this.mqttPublish(this.deviceInfo, model);
},
/**监测数据 */
getMonitorChart() {
let color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'];
for (let i = 0; i < this.monitorThings.length; i++) {
// 设置宽度
this.$refs.monitor[i].style.width = document.documentElement.clientWidth / 2 - 255 + 'px';
this.chart[i] = this.$echarts.init(this.$refs.monitor[i]);
var option;
option = {
title: {
left: 'center',
text:
this.monitorThings[i].name +
' ' +
this.$t('device.device-monitor.817489-18') +
' ' +
(this.monitorThings[i].datatype.unit != undefined ? this.monitorThings[i].datatype.unit : this.$t('device.device-monitor.817489-19')) +
'）',
textStyle: {
fontSize: 14,
},
},
grid: {
top: '50px',
left: '20px',
right: '20px',
bottom: '10px',
containLabel: true,
},
tooltip: {
trigger: 'axis',
axisPointer: {
animation: true,
},
},
xAxis: {
type: 'time',
show: false,
splitLine: {
show: false,
},
},
yAxis: {
type: 'value',
boundaryGap: [0, '100%'],
splitLine: {
show: true,
},
},
series: [
{
name: this.monitorThings[i].name,
type: 'line',
symbol: 'none',
sampling: 'lttb',
itemStyle: {
color: i > 9 ? color[0] : color[i],
},
areaStyle: {},
data: [],
},
],
};
option && this.chart[i].setOption(option);
}
},
/* 获取当前时间*/
getTime() {
let date = new Date();
let y = date.getFullYear();
let m = date.getMonth() + 1;
let d = date.getDate();
let H = date.getHours();
let mm = date.getMinutes();
let s = date.getSeconds();
m = m < 10 ? '0' + m : m;
d = d < 10 ? '0' + d : d;
H = H < 10 ? '0' + H : H;
return y + '-' + m + '-' + d + ' ' + H + ':' + mm + ':' + s;
},
},
},
};
</script>

669
vue/src/views/iot/device/device-user.vue
View File

@@ -1,86 +1,98 @@
<template>
<div style="padding-left: 20px">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-share" size="mini" @click="shareDevice" v-hasPermi="['iot:device:share']">{{ $t('device.device-edit.148398-48') }}</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-refresh" size="mini" @click="getList">{{ $t('device.device-user.037521-0') }}</el-button>
</el-col>
</el-row>
<div style="padding-left: 20px">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-share" size="mini" @click="shareDevice" v-hasPermi="['iot:device:share']">{{ $t('device.device-edit.148398-48') }}</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-refresh" size="mini" @click="getList">{{ $t('device.device-user.037521-0') }}</el-button>
</el-col>
</el-row>
<el-table v-loading="loading" :data="deviceUserList" @selection-change="handleSelectionChange" size="mini">
<el-table-column :label="$t('device.device-user.037521-1')" align="center" prop="userId" width="100" />
<el-table-column :label="$t('device.device-user.037521-2')" align="center" prop="userName" />
<el-table-column :label="$t('device.device-user.037521-3')" align="center" prop="phonenumber" width="150" />
<el-table-column :label="$t('device.device-user.037521-4')" align="center" prop="isOwner" width="150">
<template slot-scope="scope">
<el-tag type="primary" v-if="scope.row.isOwner">{{ $t('device.device-user.037521-5') }}</el-tag>
<el-tag type="success" v-else>{{ $t('device.device-user.037521-6') }}</el-tag>
</template>
</el-table-column>
<el-table-column :label="$t('device.device-user.037521-7')" align="center" prop="createTime" width="150">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column :label="$t('device.device-user.037521-8')" align="left" prop="remark" header-align="center" min-width="150" />
<el-table-column :label="$t('device.index.105953-34')" align="center" class-name="small-padding fixed-width" width="180">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['iot:device:share']" v-if="scope.row.isOwner == 0">{{ $t('edit') }}</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['iot:device:share']" v-if="scope.row.isOwner == 0">{{ $t('device.device-user.037521-11') }}</el-button>
</template>
</el-table-column>
</el-table>
<el-table v-loading="loading" :data="deviceUserList" @selection-change="handleSelectionChange" size="mini">
<el-table-column :label="$t('device.device-user.037521-1')" align="center" prop="userId" width="100" />
<el-table-column :label="$t('device.device-user.037521-2')" align="center" prop="userName" />
<el-table-column :label="$t('device.device-user.037521-3')" align="center" prop="phonenumber" width="150" />
<el-table-column :label="$t('device.device-user.037521-4')" align="center" prop="isOwner" width="150">
<template slot-scope="scope">
<el-tag type="primary" v-if="scope.row.isOwner">{{ $t('device.device-user.037521-5') }}</el-tag>
<el-tag type="success" v-else>{{ $t('device.device-user.037521-6') }}</el-tag>
</template>
</el-table-column>
<el-table-column :label="$t('device.device-user.037521-7')" align="center" prop="createTime" width="150">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column :label="$t('device.device-user.037521-8')" align="left" prop="remark" header-align="center" min-width="150" />
<el-table-column :label="$t('device.index.105953-34')" align="center" class-name="small-padding fixed-width" width="180">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['iot:device:share']" v-if="scope.row.isOwner == 0">{{ $t('edit') }}</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['iot:device:share']" v-if="scope.row.isOwner == 0">
{{ $t('device.device-user.037521-11') }}
</el-button>
</template>
</el-table-column>
</el-table>
<!--设备分享对话框-->
<el-dialog :title="$t('device.device-user.037521-12')" :visible.sync="open" width="800px">
<div style="margin-top: -50px">
<el-divider></el-divider>
</div>
<!--用户查询-->
<el-form :model="permParams" ref="queryForm" :rules="rules" :inline="true" label-width="80px" v-if="type == 1">
<el-form-item :label="$t('device.device-user.037521-3')" prop="phonenumber">
<el-input type="text" :placeholder="$t('device.device-user.037521-13')" v-model="permParams.phonenumber" minlength="10" clearable size="small" show-word-limit style="width: 240px" @keyup.enter.native="handleQuery"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="userQuery">{{ $t('device.device-user.037521-14') }}</el-button>
</el-form-item>
</el-form>
<!--设备分享对话框-->
<el-dialog :title="$t('device.device-user.037521-12')" :visible.sync="open" width="800px">
<div style="margin-top: -50px">
<el-divider></el-divider>
</div>
<!--用户查询-->
<el-form :model="permParams" ref="queryForm" :rules="rules" :inline="true" label-width="80px" v-if="type == 1">
<el-form-item :label="$t('device.device-user.037521-3')" prop="phonenumber">
<el-input
type="text"
:placeholder="$t('device.device-user.037521-13')"
v-model="permParams.phonenumber"
minlength="10"
clearable
size="small"
show-word-limit
style="width: 240px"
@keyup.enter.native="handleQuery"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="userQuery">{{ $t('device.device-user.037521-14') }}</el-button>
</el-form-item>
</el-form>
<!--用户信息和权限设置-->
<div v-loading="permsLoading" style="background-color: #f8f8f9; line-height: 28px">
<div v-if="message" style="padding: 20px">{{ message }}</div>
<div v-if="form.userId" style="padding: 15px">
<div style="font-weight: bold; line-height: 28px">{{ $t('device.device-user.037521-15') }}</div>
<span style="width: 80px; display: inline-block">{{ $t('device.device-user.037521-16') }}</span>
<span>{{ form.userId }}</span>
<br />
<span style="width: 80px; display: inline-block">{{ $t('device.device-user.037521-17') }}</span>
<span>{{ form.phonenumber }}</span>
<br />
<span style="width: 80px; display: inline-block">{{ $t('device.device-user.037521-18') }}</span>
<span>{{ form.userName }}</span>
<br />
<!--选择权限-->
<div style="font-weight: bold; margin: 15px 0 10px">{{ $t('device.device-user.037521-19') }}</div>
<el-table :data="sharePermissionList" highlight-current-row size="mini" ref="multipleTable" @select="handleSelectionChange" @select-all="handleSelectionAll">
<el-table-column type="selection" width="55" align="center" />
<el-table-column :label="$t('device.device-user.037521-20')" align="center" key="modelName" prop="modelName" />
<el-table-column :label="$t('device.device-user.037521-21')" align="center" key="identifier" prop="identifier" />
<el-table-column :label="$t('device.device-edit.148398-17')" align="left" min-width="100" header-align="center" key="remark" prop="remark" />
</el-table>
<!--选择权限-->
<div style="font-weight: bold; margin: 15px 0 10px">{{ $t('device.device-edit.148398-17') }}</div>
<el-input v-model="form.remark" type="textarea" :placeholder="$t('device.device-edit.148398-18')" rows="2" />
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" :disabled="!form.userId || !deviceInfo.deviceId">{{ $t('device.product-list.058448-14') }}</el-button>
<el-button @click="closeSelectUser">{{ $t('device.device-user.037521-25') }}</el-button>
</div>
</el-dialog>
</div>
<!--用户信息和权限设置-->
<div v-loading="permsLoading" style="background-color: #f8f8f9; line-height: 28px">
<div v-if="message" style="padding: 20px">{{ message }}</div>
<div v-if="form.userId" style="padding: 15px">
<div style="font-weight: bold; line-height: 28px">{{ $t('device.device-user.037521-15') }}</div>
<span style="width: 80px; display: inline-block">{{ $t('device.device-user.037521-16') }}</span>
<span>{{ form.userId }}</span>
<br />
<span style="width: 80px; display: inline-block">{{ $t('device.device-user.037521-17') }}</span>
<span>{{ form.phonenumber }}</span>
<br />
<span style="width: 80px; display: inline-block">{{ $t('device.device-user.037521-18') }}</span>
<span>{{ form.userName }}</span>
<br />
<!--选择权限-->
<div style="font-weight: bold; margin: 15px 0 10px">{{ $t('device.device-user.037521-19') }}</div>
<el-table :data="sharePermissionList" highlight-current-row size="mini" ref="multipleTable" @select="handleSelectionChange" @select-all="handleSelectionAll">
<el-table-column type="selection" width="55" align="center" />
<el-table-column :label="$t('device.device-user.037521-20')" align="center" key="modelName" prop="modelName" />
<el-table-column :label="$t('device.device-user.037521-21')" align="center" key="identifier" prop="identifier" />
<el-table-column :label="$t('device.device-edit.148398-17')" align="left" min-width="100" header-align="center" key="remark" prop="remark" />
</el-table>
<!--选择权限-->
<div style="font-weight: bold; margin: 15px 0 10px">{{ $t('device.device-edit.148398-17') }}</div>
<el-input v-model="form.remark" type="textarea" :placeholder="$t('device.device-edit.148398-18')" rows="2" />
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" :disabled="!form.userId || !deviceInfo.deviceId">{{ $t('device.product-list.058448-14') }}</el-button>
<el-button @click="closeSelectUser">{{ $t('device.device-user.037521-25') }}</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
@@ -88,256 +100,261 @@ import { addDeviceUser, listDeviceUser, getDeviceUser, delDeviceUser, updateDevi
import { permListModel } from '@/api/iot/model';
export default {
name: 'device-user',
dicts: ['iot_yes_no'],
props: {
device: {
type: Object,
default: null,
name: 'device-user',
dicts: ['iot_yes_no'],
props: {
device: {
type: Object,
default: null,
},
},
},
watch: {
// 获取到父组件传递的device后，刷新列表
device: function (newVal, oldVal) {
this.deviceInfo = newVal;
if (this.deviceInfo && this.deviceInfo.deviceId != 0) {
this.queryParams.deviceId = this.deviceInfo.deviceId;
this.getList();
}
},
},
data() {
return {
// 类型,1=新增，2=更新
type: 1,
// 消息提示
message: '',
// 权限遮罩层
permsLoading: false,
// 权限列表
sharePermissionList: [],
// 设备信息
deviceInfo: {},
// 是否显示选择用户弹出层
open: false,
// 查询参数
permParams: {
userName: undefined,
phonenumber: undefined,
deviceId: null,
},
// 查询表单验证
rules: {
phonenumber: [
{
required: true,
message: this.$t('device.device-user.037521-26'),
trigger: 'blur',
},
{
min: 11,
max: 11,
message: this.$t('device.device-user.037521-27'),
trigger: 'blur',
},
],
},
// 遮罩层
loading: true,
// 总条数
total: 0,
// 设备用户表格数据
deviceUserList: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
deviceName: null,
userName: null,
userId: null,
tenantName: null,
isOwner: null,
},
// 表单参数
form: {},
};
},
created() {
this.queryParams.deviceId = this.device.deviceId;
this.getList();
},
methods: {
/** 查询设备用户列表 */
getList() {
this.loading = true;
listDeviceUser(this.queryParams).then((response) => {
this.deviceUserList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 表单重置
reset() {
this.form = {
deviceId: null,
userId: null,
deviceName: null,
userName: null,
perms: null,
phonenumber: null,
remark: null,
};
this.sharePermissionList = [];
this.message = '';
this.resetForm('form');
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
this.type = 2; //更新
getDeviceUser(row.deviceId, row.userId).then((response) => {
this.form = response.data;
// 查询物模型权限列表
this.getPermissionList();
this.open = true;
});
},
// 设备分享
shareDevice() {
this.type = 1; // 新增
this.open = true;
},
/** 删除按钮操作 */
handleDelete(row) {
const deviceUser = row;
this.$modal
.confirm(this.$t('device.device-user.037521-28'))
.then(function () {
return delDeviceUser(deviceUser);
})
.then(() => {
this.getList();
this.$modal.msgSuccess(this.$t('device.device-user.037521-29'));
})
.catch(() => {});
},
/** 用户按钮操作 */
userQuery() {
this.$refs['queryForm'].validate((valid) => {
if (valid) {
this.reset();
this.getShareUser();
}
});
},
/** 查询用户 */
getShareUser() {
this.permsLoading = true;
if (!this.deviceInfo.deviceId) {
this.$modal.alert(this.$t('device.device-user.037521-30'));
return;
}
this.permParams.deviceId = this.deviceInfo.deviceId;
shareUser(this.permParams).then((response) => {
if (response.data) {
this.form = response.data;
// 查询物模型权限列表
this.getPermissionList();
} else {
this.permsLoading = false;
this.message = '查询不到用户信息，或者该用户已经是设备用户';
}
});
},
/** 查询产品物模型设备权限列表 */
async getPermissionList() {
let perms = [];
if (this.form.perms) {
perms = this.form.perms.split(',');
}
console.log('deviceInfo', this.deviceInfo);
permListModel(this.deviceInfo.productId).then((response) => {
// 固定增加设备系统相关权限
this.sharePermissionList = [
{
identifier: 'timer',
modelName: this.$t('device.device-user.037521-34'),
remark: this.$t('device.device-user.037521-35'),
},
{
identifier: 'log',
modelName: '设备日志',
remark: '包含事件日志和指令日志',
},
{
identifier: 'monitor',
modelName: this.$t('device.device-user.037521-38'),
remark: this.$t('device.device-user.037521-39'),
},
{
identifier: 'statistic',
modelName: '监测统计',
remark: '图表显示存储的历史监测数据',
},
];
this.sharePermissionList = this.sharePermissionList.concat(response.data);
// 设置选中
if (perms.length > 0) {
for (let i = 0; i < this.sharePermissionList.length; i++) {
for (let j = 0; j < perms.length; j++) {
if (this.sharePermissionList[i].identifier == perms[j]) {
this.$nextTick(() => {
this.$refs.multipleTable.toggleRowSelection(this.sharePermissionList[i], true);
});
break;
}
watch: {
// 获取到父组件传递的device后，刷新列表
device: function (newVal, oldVal) {
this.deviceInfo = newVal;
if (this.deviceInfo && this.deviceInfo.deviceId != 0) {
this.queryParams.deviceId = this.deviceInfo.deviceId;
this.getList();
}
}
}
this.permsLoading = false;
});
},
},
// 重置查询
resetUserQuery() {
this.resetForm('queryForm');
this.reset();
data() {
return {
// 类型,1=新增，2=更新
type: 1,
// 消息提示
message: '',
// 权限遮罩层
permsLoading: false,
// 权限列表
sharePermissionList: [],
// 设备信息
deviceInfo: {},
// 是否显示选择用户弹出层
open: false,
// 查询参数
permParams: {
userName: undefined,
phonenumber: undefined,
deviceId: null,
},
// 查询表单验证
rules: {
phonenumber: [
{
required: true,
message: this.$t('device.device-user.037521-26'),
trigger: 'blur',
},
{
min: 11,
max: 11,
message: this.$t('device.device-user.037521-27'),
trigger: 'blur',
},
],
},
// 遮罩层
loading: true,
// 总条数
total: 0,
// 设备用户表格数据
deviceUserList: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
deviceName: null,
userName: null,
userId: null,
tenantName: null,
isOwner: null,
},
// 表单参数
form: {},
};
},
// 关闭选择用户
closeSelectUser() {
this.open = false;
this.resetUserQuery();
created() {
this.queryParams.deviceId = this.device.deviceId;
this.getList();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.form.perms = selection.map((x) => x.identifier).join(',');
methods: {
/** 查询设备用户列表 */
getList() {
this.loading = true;
listDeviceUser(this.queryParams).then((response) => {
this.deviceUserList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 表单重置
reset() {
this.form = {
deviceId: null,
userId: null,
deviceName: null,
userName: null,
perms: null,
phonenumber: null,
remark: null,
};
this.sharePermissionList = [];
this.message = '';
this.resetForm('form');
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
this.type = 2; //更新
getDeviceUser(row.deviceId, row.userId).then((response) => {
this.form = response.data;
// 查询物模型权限列表
this.getPermissionList();
this.open = true;
});
},
// 设备分享
shareDevice() {
this.type = 1; // 新增
this.open = true;
},
/** 删除按钮操作 */
handleDelete(row) {
const deviceUser = row;
this.$modal
.confirm(this.$t('device.device-user.037521-28'))
.then(function () {
return delDeviceUser(deviceUser);
})
.then(() => {
this.getList();
this.$modal.msgSuccess(this.$t('device.device-user.037521-29'));
})
.catch(() => {});
},
/** 用户按钮操作 */
userQuery() {
this.$refs['queryForm'].validate((valid) => {
if (valid) {
this.reset();
this.getShareUser();
}
});
},
/** 查询用户 */
getShareUser() {
this.permsLoading = true;
if (!this.deviceInfo.deviceId) {
this.$modal.alert(this.$t('device.device-user.037521-30'));
return;
}
this.permParams.deviceId = this.deviceInfo.deviceId;
shareUser(this.permParams).then((response) => {
if (response.data) {
this.form = response.data;
// 查询物模型权限列表
this.getPermissionList();
} else {
this.permsLoading = false;
this.message = this.$t('device.device-user.037521-31');
}
});
},
/** 查询产品物模型设备权限列表 */
async getPermissionList() {
let perms = [];
if (this.form.perms) {
perms = this.form.perms.split(',');
}
console.log('deviceInfo', this.deviceInfo);
permListModel(this.deviceInfo.productId).then((response) => {
// 固定增加设备系统相关权限
this.sharePermissionList = [
{
identifier: 'timer',
modelName: this.$t('device.device-user.037521-34'),
remark: this.$t('device.device-user.037521-35'),
},
{
identifier: 'log',
modelName: this.$t('device.device-user.037521-36'),
remark: this.$t('device.device-user.037521-37'),
},
{
identifier: 'monitor',
modelName: this.$t('device.device-user.037521-38'),
remark: this.$t('device.device-user.037521-39'),
},
{
identifier: 'statistic',
modelName: this.$t('device.device-user.037521-40'),
remark: this.$t('device.device-user.037521-41'),
},
];
this.sharePermissionList = this.sharePermissionList.concat(response.data);
// 设置选中
if (perms.length > 0) {
for (let i = 0; i < this.sharePermissionList.length; i++) {
for (let j = 0; j < perms.length; j++) {
if (this.sharePermissionList[i].identifier == perms[j]) {
this.$nextTick(() => {
this.$refs.multipleTable.toggleRowSelection(this.sharePermissionList[i], true);
});
break;
}
}
}
}
this.permsLoading = false;
});
},
// 重置查询
resetUserQuery() {
this.resetForm('queryForm');
this.reset();
},
// 关闭选择用户
closeSelectUser() {
this.open = false;
this.resetUserQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.form.perms = selection.map((x) => x.identifier).join(',');
},
// 全选事件处理
handleSelectionAll(selection) {
this.form.perms = selection.map((x) => x.identifier).join(',');
},
/** 提交按钮 */
submitForm() {
if (this.type == 2) {
// 更新设备用户
updateDeviceUser(this.form).then((response) => {
this.$modal.msgSuccess(this.$t('device.device-user.037521-42'));
this.resetUserQuery();
this.open = false;
this.getList();
});
} else if (this.type == 1) {
// 添加设备用户
this.form.deviceId = this.deviceInfo.deviceId;
this.form.deviceName = this.deviceInfo.deviceName;
addDeviceUser(this.form).then((response) => {
this.$modal.msgSuccess(this.$t('device.device-user.037521-43'));
this.resetUserQuery();
this.open = false;
this.getList();
});
}
},
},
// 全选事件处理
handleSelectionAll(selection) {
this.form.perms = selection.map((x) => x.identifier).join(',');
},
/** 提交按钮 */
submitForm() {
if (this.type == 2) {
// 更新设备用户
updateDeviceUser(this.form).then((response) => {
this.$modal.msgSuccess(this.$t('device.device-user.037521-42'));
this.resetUserQuery();
this.open = false;
this.getList();
});
} else if (this.type == 1) {
// 添加设备用户
this.form.deviceId = this.deviceInfo.deviceId;
this.form.deviceName = this.deviceInfo.deviceName;
addDeviceUser(this.form).then((response) => {
this.$modal.msgSuccess(this.$t('device.device-user.037521-43'));
this.resetUserQuery();
this.open = false;
this.getList();
};
</script>

1718
vue/src/views/iot/device/running-status.vue
View File

File diff suppressed because it is too large Load Diff

6
vue/src/views/iot/scene/product-list.vue
View File

@@ -7,13 +7,13 @@
<el-input v-model="queryParams.productName" :placeholder="$t('productList.index.470902-2')" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('common.search') }}</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{ $t('common.reset') }}</el-button>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('search') }}</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{ $t('reset') }}</el-button>
</el-form-item>
</el-form>
<el-table v-loading="loading" ref="singleTable" :data="productList" @row-click="rowClick" highlight-current-row size="mini">
<el-table-column :label="$t('common.select')" width="50" align="center">
<el-table-column :label="$t('select')" width="50" align="center">
<template slot-scope="scope">
<input type="radio" :checked="scope.row.isSelect" name="product" />
</template>

77
vue/src/views/iot/scene/script.vue
View File

@@ -1,23 +1,19 @@
<template>
<div style="padding: 6px">
<el-card v-show="showSearch" style="margin-bottom: 6px">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
label-width="68px" style="margin-bottom: -20px">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px" style="margin-bottom: -20px">
<el-form-item :label="$t('script.349087-0')" prop="scriptId">
<el-input v-model="queryParams.scriptId" :placeholder="$t('script.349087-1')" clearable
@keyup.enter.native="handleQuery" />
<el-input v-model="queryParams.scriptId" :placeholder="$t('script.349087-1')" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item :label="$t('script.349087-2')" prop="scriptName">
<el-input v-model="queryParams.scriptName" :placeholder="$t('script.349087-3')" clearable
@keyup.enter.native="handleQuery" />
<el-input v-model="queryParams.scriptName" :placeholder="$t('script.349087-3')" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('common.search') }}</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{ $t('common.reset') }}</el-button>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t('search') }}</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{ $t('reset') }}</el-button>
</el-form-item>
<el-form-item style="float: right">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['iot:script:add']">{{ $t('common.add') }}</el-button>
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['iot:script:add']">{{ $t('add') }}</el-button>
</el-form-item>
</el-form>
</el-card>
@@ -34,8 +30,7 @@
</el-table-column>
<el-table-column :label="$t('script.index.470901-5')" align="center" prop="status">
<template slot-scope="scope">
<dict-tag :options="dict.type.rule_script_action" :value="scope.row.scriptAction"
size="small" />
<dict-tag :options="dict.type.rule_script_action" :value="scope.row.scriptAction" size="small" />
</template>
</el-table-column>
<el-table-column :label="$t('script.index.470901-7')" align="center" prop="scriptLanguage" />
@@ -46,23 +41,19 @@
</template>
</el-table-column>
<el-table-column :label="$t('script.index.470901-9')" align="center" prop="scriptOrder" />
<el-table-column :label="$t('common.opation')" align="center" class-name="small-padding fixed-width" width="200">
<el-table-column :label="$t('opation')" align="center" class-name="small-padding fixed-width" width="200">
<template slot-scope="scope">
<el-button size="small" type="text" icon="el-icon-date" @click="handleLog(scope.row.scriptId)" v-hasPermi="['iot:script:query']">{{ $t('script.index.470901-23') }}</el-button>
<el-button size="mini" type="text" icon="el-icon-view" @click="handleUpdate(scope.row)"
v-hasPermi="['iot:script:query']">{{ $t('script.index.470901-24') }}</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['iot:script:remove']">{{ $t('common.del') }}</el-button>
<el-button size="mini" type="text" icon="el-icon-view" @click="handleUpdate(scope.row)" v-hasPermi="['iot:script:query']">{{ $t('script.index.470901-24') }}</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['iot:script:remove']">{{ $t('del') }}</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" />
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 添加或修改规则引擎脚本对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body :close-on-click-modal="false"
:close-on-press-escape="false">
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body :close-on-click-modal="false" :close-on-press-escape="false">
<el-form ref="form" :model="form" :rules="rules" label-width="90px">
<el-row :gutter="50">
<el-col :span="12">
@@ -72,16 +63,19 @@
</el-col>
<el-col :span="12">
<el-form-item :label="$t('script.index.470901-9')" prop="scriptOrder">
<el-input-number v-model="form.scriptOrder" :placeholder="$t('script.index.470901-10')" type="number"
controls-position="right" style="width: 100%" />
<el-input-number v-model="form.scriptOrder" :placeholder="$t('script.index.470901-10')" type="number" controls-position="right" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="$t('script.349087-6')" prop="scriptEvent">
<el-select v-model="form.scriptEvent" :placeholder="$t('script.349087-11')" style="width: 100%">
<el-option v-for="dict in dict.type.rule_script_event" :key="dict.label"
:label="dict.label" :value="Number(dict.value)"
:disabled="dict.value !== '1' && dict.value !== '2'"></el-option>
<el-option
v-for="dict in dict.type.rule_script_event"
:key="dict.label"
:label="dict.label"
:value="Number(dict.value)"
:disabled="dict.value !== '1' && dict.value !== '2'"
></el-option>
</el-select>
</el-form-item>
</el-col>
@@ -89,9 +83,7 @@
<el-col :span="12">
<el-form-item :label="$t('script.index.470901-5')" prop="scriptAction">
<el-select v-model="form.scriptAction" :placeholder="$t('script.index.470901-6')" style="width: 100%">
<el-option v-for="dict in dict.type.rule_script_action" :key="dict.label"
:label="dict.label" :value="Number(dict.value)"
:disabled="dict.value !== '1'"></el-option>
<el-option v-for="dict in dict.type.rule_script_action" :key="dict.label" :label="dict.label" :value="Number(dict.value)" :disabled="dict.value !== '1'"></el-option>
</el-select>
</el-form-item>
</el-col>
@@ -102,10 +94,8 @@
</el-col>
<el-col :span="12">
<el-form-item :label="$t('script.index.470901-2')" prop="productName">
<el-input readonly v-model="form.productName" size="small" :placeholder="$t('script.index.470901-3')"
style="margin-top: 3px">
<el-button slot="append" @click="handleSelectProduct()"
size="small">{{ $t('script.index.470901-4') }}</el-button>
<el-input readonly v-model="form.productName" size="small" :placeholder="$t('script.index.470901-3')" style="margin-top: 3px">
<el-button slot="append" @click="handleSelectProduct()" size="small">{{ $t('script.index.470901-4') }}</el-button>
</el-input>
</el-form-item>
</el-col>
@@ -113,28 +103,21 @@
</el-row>
</el-form>
<div style="padding: 0px 10px" @click="editClick">
<AceEditor ref="codeEditor" :content.sync="form.scriptData" lang="groovy" codeStyle="chrome"
:read-only="false" width="100%" height="450px"></AceEditor>
<AceEditor ref="codeEditor" :content.sync="form.scriptData" lang="groovy" codeStyle="chrome" :read-only="false" width="100%" height="450px"></AceEditor>
</div>
<div style="padding: 0 10px; margin: 10px 0">
<el-alert :title="validateMsg" type="success" show-icon v-if="isValidate && validateMsg"
:closable="false"></el-alert>
<el-alert :title="validateMsg" type="error" show-icon v-if="!isValidate && validateMsg"
:closable="false"></el-alert>
<el-alert :title="validateMsg" type="success" show-icon v-if="isValidate && validateMsg" :closable="false"></el-alert>
<el-alert :title="validateMsg" type="error" show-icon v-if="!isValidate && validateMsg" :closable="false"></el-alert>
</div>
<div slot="footer" class="dialog-footer">
<span style="float: left">
<el-link style="line-height: 40px; padding-left: 20px" icon="el-icon-question"
:underline="false" type="primary" href="https://fastbee.cn/doc/pages/rule_engine/"
target="_blank">
<el-link style="line-height: 40px; padding-left: 20px" icon="el-icon-question" :underline="false" type="primary" href="https://fastbee.cn/doc/pages/rule_engine/" target="_blank">
{{ $t('script.index.470901-17') }}
</el-link>
</span>
<el-button type="success" @click="handleValidate">{{ $t('script.index.470901-18') }}</el-button>
<el-button type="primary" @click="submitForm" v-hasPermi="['iot:script:edit']"
v-show="form.scriptId" :disabled="!isValidate">{{ $t('script.index.470901-19') }}</el-button>
<el-button type="primary" @click="submitForm" v-hasPermi="['iot:script:add']"
v-show="!form.scriptId" :disabled="!isValidate">{{ $t('common.add') }}</el-button>
<el-button type="primary" @click="submitForm" v-hasPermi="['iot:script:edit']" v-show="form.scriptId" :disabled="!isValidate">{{ $t('script.index.470901-19') }}</el-button>
<el-button type="primary" @click="submitForm" v-hasPermi="['iot:script:add']" v-show="!form.scriptId" :disabled="!isValidate">{{ $t('add') }}</el-button>
<el-button @click="cancel">{{ $t('script.index.470901-20') }}</el-button>
</div>
</el-dialog>
@@ -406,7 +389,7 @@ msgContext.setPayload(NewPayload);`,
this.getList();
this.$modal.msgSuccess(this.$i18n.t('script.index.470901-27'));
})
.catch(() => { });
.catch(() => {});
},
/** 验证按钮操作 */
handleValidate() {

24
vue/src/views/iot/sip/index.vue
View File

@@ -195,84 +195,84 @@ export default {
protocol: [
{
required: true,
message: '默认播放协议不能为空',
message: this.$t('sip.index.998533-26'),
trigger: 'blur',
},
],
ip: [
{
required: true,
message: '服务器ip不能为空',
message: this.$t('sip.index.998533-27'),
trigger: 'blur',
},
],
domain: [
{
required: true,
message: '服务器域名不能为空',
message: this.$t('sip.index.998533-28'),
trigger: 'blur',
},
],
secret: [
{
required: true,
message: '流媒体密钥不能为空',
message: this.$t('sip.index.998533-29'),
trigger: 'blur',
},
],
portHttp: [
{
required: true,
message: 'http端口不能为空',
message: this.$t('sip.index.998533-30'),
trigger: 'blur',
},
],
portHttps: [
{
required: true,
message: 'https端口不能为空',
message: this.$t('sip.index.998533-31'),
trigger: 'blur',
},
],
portRtmp: [
{
required: true,
message: 'rtmp端口不能为空',
message: this.$t('sip.index.998533-32'),
trigger: 'blur',
},
],
portRtsp: [
{
required: true,
message: 'rtsp端口不能为空',
message: this.$t('sip.index.998533-33'),
trigger: 'blur',
},
],
rtpPortRange: [
{
required: true,
message: 'rtp端口范围不能为空',
message: this.$t('sip.index.998533-34'),
trigger: 'blur',
},
],
delFlag: [
{
required: true,
message: '删除标志不能为空',
message: this.$t('sip.index.998533-35'),
trigger: 'blur',
},
],
createBy: [
{
required: true,
message: '创建者不能为空',
message: this.$t('sip.index.998533-36'),
trigger: 'blur',
},
],
createTime: [
{
required: true,
message: '创建时间不能为空',
message: this.$t('sip.index.998533-37'),
trigger: 'blur',
},
],

686
vue/src/views/iot/sip/mediaServer-edit.vue
View File

@@ -1,103 +1,108 @@
<template>
<div id="mediaServerEdit" v-loading="isLoging">
<el-dialog :title="$t('sip.mediaServerEdit.998534-0')" :width="dialogWidth" top="2rem" :close-on-click-modal="false" :visible.sync="showDialog" :destroy-on-close="true" @close="close()">
<div id="formStep" style="margin-top: 1rem; margin-right: 20px">
<el-form v-if="currentStep == 1" ref="mediaServerForm" :rules="rules" :model="mediaServerForm" label-width="280px" style="width: 70%">
<el-form-item :label="$t('sip.mediaServerEdit.998534-1')" prop="ip">
<el-input v-model="mediaServerForm.ip" :placeholder="$t('sip.mediaServerEdit.998534-2')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-3')" prop="portHttp">
<el-input v-model="mediaServerForm.portHttp" :placeholder="$t('sip.mediaServerEdit.998534-4')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-5')" prop="secret">
<el-input v-model="mediaServerForm.secret" :placeholder="$t('sip.mediaServerEdit.998534-6')" clearable></el-input>
</el-form-item>
<el-form-item>
<div style="float: right; font-size: 28px">
<el-button @click="close">{{ $t('cancel') }}</el-button>
<el-button type="success" @click="checkServer" :loading="btnLoading">{{ $t('test') }}</el-button>
<el-button type="primary" v-if="currentStep === 1 && serverCheck === 1" @click="next">{{ $t('next') }}</el-button>
<div id="mediaServerEdit" v-loading="isLoging">
<el-dialog :title="$t('sip.mediaServerEdit.998534-0')" :width="dialogWidth" top="2rem" :close-on-click-modal="false" :visible.sync="showDialog" :destroy-on-close="true" @close="close()">
<div id="formStep" style="margin-top: 1rem; margin-right: 20px">
<el-form v-if="currentStep == 1" ref="mediaServerForm" :rules="rules" :model="mediaServerForm" label-width="280px" style="width: 70%">
<el-form-item :label="$t('sip.mediaServerEdit.998534-1')" prop="ip">
<el-input v-model="mediaServerForm.ip" :placeholder="$t('sip.mediaServerEdit.998534-2')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-3')" prop="portHttp">
<el-input v-model="mediaServerForm.portHttp" :placeholder="$t('sip.mediaServerEdit.998534-4')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-5')" prop="secret">
<el-input v-model="mediaServerForm.secret" :placeholder="$t('sip.mediaServerEdit.998534-6')" clearable></el-input>
</el-form-item>
<el-form-item>
<div style="float: right; font-size: 28px">
<el-button @click="close">{{ $t('cancel') }}</el-button>
<el-button type="success" @click="checkServer" :loading="btnLoading">{{ $t('test') }}</el-button>
<el-button type="primary" v-if="currentStep === 1 && serverCheck === 1" @click="next">{{ $t('next') }}</el-button>
</div>
</el-form-item>
</el-form>
<el-row :gutter="24">
<el-col :span="12">
<el-form v-if="currentStep === 2 || currentStep === 3" ref="mediaServerForm1" :rules="rules" :model="mediaServerForm" label-width="140px" :disabled="!editFlag">
<el-form-item :label="$t('sip.mediaServerEdit.998534-7')" prop="serverId">
<el-input v-model="mediaServerForm.serverId" :placeholder="$t('sip.mediaServerEdit.998534-8')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-9')" prop="ip">
<el-input v-if="currentStep === 2" v-model="mediaServerForm.ip" disabled></el-input>
<el-input v-if="currentStep === 3" v-model="mediaServerForm.ip"></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-10')" prop="protocol">
<el-select v-model="mediaServerForm.protocol" style="width: 100%">
<el-option key="http" label="http" value="http"></el-option>
<el-option key="https" label="https" value="https"></el-option>
</el-select>
</el-form-item>
<el-form-item label="HookUrl" prop="hookurl">
<el-input v-model="mediaServerForm.hookurl" placeholder="HookUrl" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-11')" prop="portHttp">
<el-input v-if="currentStep === 2" v-model="mediaServerForm.portHttp" disabled></el-input>
<el-input v-if="currentStep === 3" v-model="mediaServerForm.portHttp"></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-12')" prop="portHttps">
<el-input v-model="mediaServerForm.portHttps" :placeholder="$t('sip.mediaServerEdit.998534-13')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-14')" prop="portRtsp">
<el-input v-model="mediaServerForm.portRtsp" :placeholder="$t('sip.mediaServerEdit.998534-15')" clearable></el-input>
</el-form-item>
</el-form>
</el-col>
<el-col :span="12">
<el-form v-if="currentStep === 2 || currentStep === 3" ref="mediaServerForm2" :rules="rules" :model="mediaServerForm" label-width="180px" :disabled="!editFlag">
<el-form-item :label="$t('sip.mediaServerEdit.998534-16')" prop="secret">
<el-input v-if="currentStep === 2" v-model="mediaServerForm.secret" disabled></el-input>
<el-input v-if="currentStep === 3" v-model="mediaServerForm.secret"></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-17')" prop="domain">
<el-input v-model="mediaServerForm.domain" :placeholder="$t('sip.mediaServerEdit.998534-18')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-19')">
<el-switch v-model="mediaServerForm.autoConfig"></el-switch>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-20')">
<el-switch
:active-text="$t('sip.mediaServerEdit.998534-21')"
:inactive-text="$t('sip.mediaServerEdit.998534-22')"
@change="portRangeChange"
v-model="mediaServerForm.rtpEnable"
></el-switch>
</el-form-item>
<el-form-item v-if="!mediaServerForm.rtpEnable" :label="$t('sip.mediaServerEdit.998534-23')" prop="rtpProxyPort">
<el-input v-model.number="mediaServerForm.rtpProxyPort" clearable></el-input>
</el-form-item>
<el-form-item v-if="mediaServerForm.rtpEnable" :label="$t('sip.mediaServerEdit.998534-23')">
<el-input v-model="rtpPortRange1" :placeholder="$t('sip.mediaServerEdit.998534-24')" @change="portRangeChange" clearable style="width: 100px" prop="rtpPortRange1"></el-input>
<el-input v-model="rtpPortRange2" :placeholder="$t('sip.mediaServerEdit.998534-25')" @change="portRangeChange" clearable style="width: 100px" prop="rtpPortRange2"></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-26')" prop="portRtmp">
<el-input v-model="mediaServerForm.portRtmp" :placeholder="$t('sip.mediaServerEdit.998534-27')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-28')" prop="recordPort">
<el-input v-model.number="mediaServerForm.recordPort" :disabled="!editFlag">
<el-button v-if="mediaServerForm.recordPort > 0" class="el-icon-check" slot="append" type="primary" @click="checkRecordServer"></el-button>
</el-input>
<i v-if="recordServerCheck === 1" class="el-icon-success" style="color: #3caf36; position: absolute; top: 14px"></i>
<i v-if="recordServerCheck === 2" class="el-icon-loading" style="color: #3caf36; position: absolute; top: 14px"></i>
<i v-if="recordServerCheck === -1" class="el-icon-error" style="color: #c80000; position: absolute; top: 14px"></i>
</el-form-item>
<el-form-item>
<div style="float: right">
<el-button type="primary" @click="onSubmit" v-if="editFlag">{{ $t('submit') }}</el-button>
<el-button @click="close" v-if="editFlag">{{ $t('close') }}</el-button>
</div>
</el-form-item>
</el-form>
</el-col>
</el-row>
</div>
</el-form-item>
</el-form>
<el-row :gutter="24">
<el-col :span="12">
<el-form v-if="currentStep === 2 || currentStep === 3" ref="mediaServerForm1" :rules="rules" :model="mediaServerForm" label-width="140px" :disabled="!editFlag">
<el-form-item :label="$t('sip.mediaServerEdit.998534-7')" prop="serverId">
<el-input v-model="mediaServerForm.serverId" :placeholder="$t('sip.mediaServerEdit.998534-8')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-9')" prop="ip">
<el-input v-if="currentStep === 2" v-model="mediaServerForm.ip" disabled></el-input>
<el-input v-if="currentStep === 3" v-model="mediaServerForm.ip"></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-10')" prop="protocol">
<el-select v-model="mediaServerForm.protocol" style="width: 100%">
<el-option key="http" label="http" value="http"></el-option>
<el-option key="https" label="https" value="https"></el-option>
</el-select>
</el-form-item>
<el-form-item label="HookUrl" prop="hookurl">
<el-input v-model="mediaServerForm.hookurl" placeholder="HookUrl" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-11')" prop="portHttp">
<el-input v-if="currentStep === 2" v-model="mediaServerForm.portHttp" disabled></el-input>
<el-input v-if="currentStep === 3" v-model="mediaServerForm.portHttp"></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-12')" prop="portHttps">
<el-input v-model="mediaServerForm.portHttps" :placeholder="$t('sip.mediaServerEdit.998534-13')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-14')" prop="portRtsp">
<el-input v-model="mediaServerForm.portRtsp" :placeholder="$t('sip.mediaServerEdit.998534-15')" clearable></el-input>
</el-form-item>
</el-form>
</el-col>
<el-col :span="12">
<el-form v-if="currentStep === 2 || currentStep === 3" ref="mediaServerForm2" :rules="rules" :model="mediaServerForm" label-width="180px" :disabled="!editFlag">
<el-form-item :label="$t('sip.mediaServerEdit.998534-16')" prop="secret">
<el-input v-if="currentStep === 2" v-model="mediaServerForm.secret" disabled></el-input>
<el-input v-if="currentStep === 3" v-model="mediaServerForm.secret"></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-17')" prop="domain">
<el-input v-model="mediaServerForm.domain" :placeholder="$t('sip.mediaServerEdit.998534-18')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-19')">
<el-switch v-model="mediaServerForm.autoConfig"></el-switch>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-20')">
<el-switch :active-text="$t('sip.mediaServerEdit.998534-21')" :inactive-text="$t('sip.mediaServerEdit.998534-22')" @change="portRangeChange" v-model="mediaServerForm.rtpEnable"></el-switch>
</el-form-item>
<el-form-item v-if="!mediaServerForm.rtpEnable" :label="$t('sip.mediaServerEdit.998534-23')" prop="rtpProxyPort">
<el-input v-model.number="mediaServerForm.rtpProxyPort" clearable></el-input>
</el-form-item>
<el-form-item v-if="mediaServerForm.rtpEnable" :label="$t('sip.mediaServerEdit.998534-23')">
<el-input v-model="rtpPortRange1" :placeholder="$t('sip.mediaServerEdit.998534-24')" @change="portRangeChange" clearable style="width: 100px" prop="rtpPortRange1"></el-input>
<el-input v-model="rtpPortRange2" :placeholder="$t('sip.mediaServerEdit.998534-25')" @change="portRangeChange" clearable style="width: 100px" prop="rtpPortRange2" ></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-26')" prop="portRtmp">
<el-input v-model="mediaServerForm.portRtmp" :placeholder="$t('sip.mediaServerEdit.998534-27')" clearable></el-input>
</el-form-item>
<el-form-item :label="$t('sip.mediaServerEdit.998534-28')" prop="recordPort">
<el-input v-model.number="mediaServerForm.recordPort" :disabled="!editFlag">
<el-button v-if="mediaServerForm.recordPort > 0" class="el-icon-check" slot="append" type="primary" @click="checkRecordServer"></el-button>
</el-input>
<i v-if="recordServerCheck === 1" class="el-icon-success" style="color: #3caf36; position: absolute; top: 14px"></i>
<i v-if="recordServerCheck === 2" class="el-icon-loading" style="color: #3caf36; position: absolute; top: 14px"></i>
<i v-if="recordServerCheck === -1" class="el-icon-error" style="color: #c80000; position: absolute; top: 14px"></i>
</el-form-item>
<el-form-item>
<div style="float: right">
<el-button type="primary" @click="onSubmit" v-if="editFlag">{{ $t('submit') }}</el-button>
<el-button @click="close" v-if="editFlag">{{ $t('close') }}</el-button>
</div>
</el-form-item>
</el-form>
</el-col>
</el-row>
</div>
</el-dialog>
<!-- 选择用户 -->
<user-list ref="userList" @userEvent="getUserData($event)" />
</div>
</el-dialog>
<!-- 选择用户 -->
<user-list ref="userList" @userEvent="getUserData($event)" />
</div>
</template>
<script>
@@ -105,252 +110,251 @@ import { addmediaServer, checkmediaServer, updatemediaServer } from '@/api/iot/m
import userList from '@/views/iot/sip/user-list.vue';
export default {
name: 'MediaServerEdit',
components: { userList },
props: {
editFlag: {
type: Boolean,
default: false,
},
},
data() {
const isValidIp = (rule, value, callback) => {
// 校验IP是否符合规则
var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
if (!reg.test(value)) {
return callback(new Error('请输入有效的IP地址'));
} else {
callback();
}
return true;
};
const isValidPort = (rule, value, callback) => {
// 校验IP是否符合规则
var reg = /^(([0-9]|[1-9]\d{1,3}|[1-5]\d{4}|6[0-5]{2}[0-3][0-5]))$/;
if (!reg.test(value)) {
return callback(new Error('请输入有效的端口号'));
} else {
callback();
}
return true;
};
return {
tempTenantId: '',
tempTenantName: '',
btnLoading: false,
dialogWidth: '',
defaultWidth: 1000,
listChangeCallback: null,
showDialog: false,
isLoging: false,
dialogLoading: false,
currentStep: 1,
platformList: [],
serverCheck: 0,
recordServerCheck: 0,
mediaServerForm: {
serverId: '',
ip: '',
domain: '',
productId: '',
productName: '',
tenantId: '',
tenantName: '',
autoConfig: true,
hookurl: '',
secret: '',
portHttp: '',
portHttps: '',
recordPort: '',
portRtmp: '',
portRtsp: '',
rtpEnable: true,
rtpPortRange: '',
rtpProxyPort: '',
},
rtpPortRange1: 30000,
rtpPortRange2: 30100,
rules: {
ip: [{ required: true, validator: isValidIp, message: this.$t('sip.mediaServerEdit.998534-24'), trigger: 'blur' }],
portHttp: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
portHttps: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
recordPort: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
portRtmp: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
portRtsp: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
rtpPortRange1: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
rtpPortRange2: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
rtpProxyPort: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
secret: [{ required: true, message: this.$t('sip.mediaServerEdit.998534-31'), trigger: 'blur' }],
},
};
},
computed: {},
created() {
this.setDialogWidth();
},
methods: {
setDialogWidth() {
let val = document.body.clientWidth;
if (val < this.defaultWidth) {
this.dialogWidth = '100%';
} else {
this.dialogWidth = this.defaultWidth + 'px';
}
name: 'MediaServerEdit',
components: { userList },
props: {
editFlag: {
type: Boolean,
default: false,
},
},
openDialog: function (param, callback) {
this.showDialog = true;
this.listChangeCallback = callback;
if (param != null) {
if (param.autoConfig === 1) {
param.autoConfig = param.autoConfig === 1;
} else if (param.autoConfig === 0) {
param.autoConfig = param.autoConfig === 1;
}
if (param.rtpEnable === 1) {
param.rtpEnable = param.rtpEnable === 1;
} else if (param.rtpEnable === 0) {
param.rtpEnable = param.rtpEnable === 1;
}
this.mediaServerForm = param;
this.currentStep = 3;
if (param.rtpPortRange) {
let rtpPortRange = this.mediaServerForm.rtpPortRange.split(',');
if (rtpPortRange.length > 0) {
this.rtpPortRange1 = rtpPortRange[0];
this.rtpPortRange2 = rtpPortRange[1];
}
}
}
data() {
const isValidIp = (rule, value, callback) => {
// 校验IP是否符合规则
var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
if (!reg.test(value)) {
return callback(new Error(this.$t('sip.mediaServerEdit.998534-24')));
} else {
callback();
}
return true;
};
const isValidPort = (rule, value, callback) => {
// 校验IP是否符合规则
var reg = /^(([0-9]|[1-9]\d{1,3}|[1-5]\d{4}|6[0-5]{2}[0-3][0-5]))$/;
if (!reg.test(value)) {
return callback(new Error(this.$t('sip.mediaServerEdit.998534-25')));
} else {
callback();
}
return true;
};
return {
tempTenantId: '',
tempTenantName: '',
btnLoading: false,
dialogWidth: '',
defaultWidth: 1000,
listChangeCallback: null,
showDialog: false,
isLoging: false,
dialogLoading: false,
currentStep: 1,
platformList: [],
serverCheck: 0,
recordServerCheck: 0,
mediaServerForm: {
serverId: '',
ip: '',
domain: '',
productId: '',
productName: '',
tenantId: '',
tenantName: '',
autoConfig: true,
hookurl: '',
secret: '',
portHttp: '',
portHttps: '',
recordPort: '',
portRtmp: '',
portRtsp: '',
rtpEnable: true,
rtpPortRange: '',
rtpProxyPort: '',
},
rtpPortRange1: 30000,
rtpPortRange2: 30100,
rules: {
ip: [{ required: true, validator: isValidIp, message: this.$t('sip.mediaServerEdit.998534-24'), trigger: 'blur' }],
portHttp: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
portHttps: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
recordPort: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
portRtmp: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
portRtsp: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
rtpPortRange1: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
rtpPortRange2: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
rtpProxyPort: [{ required: true, validator: isValidPort, message: this.$t('sip.mediaServerEdit.998534-25'), trigger: 'blur' }],
secret: [{ required: true, message: this.$t('sip.mediaServerEdit.998534-31'), trigger: 'blur' }],
},
};
},
checkServer: function () {
this.$refs.mediaServerForm.validate((valid) => {
if (valid) {
this.btnLoading = true;
this.serverCheck = 0;
let query = {
ip: this.mediaServerForm.ip,
port: this.mediaServerForm.portHttp,
secret: this.mediaServerForm.secret,
};
checkmediaServer(query)
.then((response) => {
this.btnLoading = false;
if (response.data != null) {
this.mediaServerForm = response.data;
this.mediaServerForm.autoConfig = true;
this.mediaServerForm.rtpEnable = true;
this.mediaServerForm.protocol = 'http';
this.mediaServerForm.domain = 'fastbee.com';
this.mediaServerForm.enabled = 1;
this.mediaServerForm.tenantId = this.tempTenantId;
this.mediaServerForm.tenantName = this.tempTenantName;
this.mediaServerForm.serverId = 'fastbee';
this.mediaServerForm.hookurl = 'java:8080';
this.mediaServerForm.portHttps = 8443;
this.mediaServerForm.recordPort = 18081;
this.mediaServerForm.portRtmp = 1935;
this.mediaServerForm.portRtsp = 554;
this.mediaServerForm.rtpProxyPort = '';
this.rtpPortRange1 = 30000;
this.rtpPortRange2 = 30100;
this.serverCheck = 1;
this.$modal.alertSuccess(this.$t('sip.mediaServerEdit.998534-26'));
} else {
this.serverCheck = -1;
this.$modal.alertError(this.$t('sip.mediaServerEdit.998534-27'));
}
})
.catch((error) => {
this.serverCheck = -1;
this.$message({
showClose: true,
message: error,
type: 'error',
});
computed: {},
created() {
this.setDialogWidth();
},
methods: {
setDialogWidth() {
let val = document.body.clientWidth;
if (val < this.defaultWidth) {
this.dialogWidth = '100%';
} else {
this.dialogWidth = this.defaultWidth + 'px';
}
},
openDialog: function (param, callback) {
this.showDialog = true;
this.listChangeCallback = callback;
if (param != null) {
if (param.autoConfig === 1) {
param.autoConfig = param.autoConfig === 1;
} else if (param.autoConfig === 0) {
param.autoConfig = param.autoConfig === 1;
}
if (param.rtpEnable === 1) {
param.rtpEnable = param.rtpEnable === 1;
} else if (param.rtpEnable === 0) {
param.rtpEnable = param.rtpEnable === 1;
}
this.mediaServerForm = param;
this.currentStep = 3;
if (param.rtpPortRange) {
let rtpPortRange = this.mediaServerForm.rtpPortRange.split(',');
if (rtpPortRange.length > 0) {
this.rtpPortRange1 = rtpPortRange[0];
this.rtpPortRange2 = rtpPortRange[1];
}
}
}
},
checkServer: function () {
this.$refs.mediaServerForm.validate((valid) => {
if (valid) {
this.btnLoading = true;
this.serverCheck = 0;
let query = {
ip: this.mediaServerForm.ip,
port: this.mediaServerForm.portHttp,
secret: this.mediaServerForm.secret,
};
checkmediaServer(query)
.then((response) => {
this.btnLoading = false;
if (response.data != null) {
this.mediaServerForm = response.data;
this.mediaServerForm.autoConfig = true;
this.mediaServerForm.rtpEnable = true;
this.mediaServerForm.protocol = 'http';
this.mediaServerForm.domain = 'fastbee.com';
this.mediaServerForm.enabled = 1;
this.mediaServerForm.tenantId = this.tempTenantId;
this.mediaServerForm.tenantName = this.tempTenantName;
this.mediaServerForm.serverId = 'fastbee';
this.mediaServerForm.hookurl = 'java:8080';
this.mediaServerForm.portHttps = 8443;
this.mediaServerForm.recordPort = 18081;
this.mediaServerForm.portRtmp = 1935;
this.mediaServerForm.portRtsp = 554;
this.mediaServerForm.rtpProxyPort = '';
this.rtpPortRange1 = 30000;
this.rtpPortRange2 = 30100;
this.serverCheck = 1;
this.$modal.alertSuccess(this.$t('sip.mediaServerEdit.998534-26'));
} else {
this.serverCheck = -1;
this.$modal.alertError(this.$t('sip.mediaServerEdit.998534-27'));
}
})
.catch((error) => {
this.serverCheck = -1;
this.$message({
showClose: true,
message: error,
type: 'error',
});
});
}
});
}
});
},
next: function () {
this.currentStep = 2;
this.defaultWidth = 900;
this.setDialogWidth();
},
checkRecordServer: function () {
let that = this;
that.recordServerCheck = 2;
if (that.mediaServerForm.recordPort <= 0 || that.mediaServerForm.recordPort > 65535) {
that.recordServerCheck = -1;
that.$message({
showClose: true,
message: this.$t('sip.mediaServerEdit.998534-28'),
type: 'error',
});
return;
}
},
onSubmit: function () {
this.dialogLoading = true;
this.mediaServerForm.rtpEnable = this.mediaServerForm.rtpEnable ? 1 : 0;
this.mediaServerForm.autoConfig = this.mediaServerForm.autoConfig ? 1 : 0;
if (this.mediaServerForm.id != null) {
updatemediaServer(this.mediaServerForm).then((response) => {
this.$modal.msgSuccess(this.$t('updateSuccess'));
this.showDialog = false;
});
} else {
this.portRangeChange();
addmediaServer(this.mediaServerForm).then((response) => {
this.$modal.msgSuccess(this.$t('addSuccess'));
this.showDialog = false;
});
}
this.$parent.getServerList();
this.$parent.delay();
},
close: function () {
this.showDialog = false;
this.dialogLoading = false;
this.mediaServerForm = {
serverId: '',
ip: '',
domain: '',
autoConfig: true,
hookurl: '',
secret: '',
portHttp: '',
portHttps: '',
recordPort: '',
portRtmp: '',
portRtsp: '',
rtpEnable: true,
rtpPortRange: '',
rtpProxyPort: '',
};
this.rtpPortRange1 = 30000;
this.rtpPortRange2 = 30100;
this.listChangeCallback = null;
this.currentStep = 1;
},
portRangeChange: function () {
if (this.mediaServerForm.rtpEnable) {
this.mediaServerForm.rtpPortRange = this.rtpPortRange1 + ',' + this.rtpPortRange2;
console.log(this.mediaServerForm.rtpPortRange);
}
},
selectUser() {
this.$refs.userList.open = true;
this.$refs.userList.getList();
},
getUserData(user) {
this.tempTenantId = user.userId;
this.tempTenantName = user.userName;
this.mediaServerForm.tenantId = user.userId;
this.mediaServerForm.tenantName = user.userName;
},
},
next: function () {
this.currentStep = 2;
this.defaultWidth = 900;
this.setDialogWidth();
},
checkRecordServer: function () {
let that = this;
that.recordServerCheck = 2;
if (that.mediaServerForm.recordPort <= 0 || that.mediaServerForm.recordPort > 65535) {
that.recordServerCheck = -1;
that.$message({
showClose: true,
message: this.$t('sip.mediaServerEdit.998534-28'),
type: 'error',
});
return;
}
},
onSubmit: function () {
this.dialogLoading = true;
this.mediaServerForm.rtpEnable = this.mediaServerForm.rtpEnable ? 1 : 0;
this.mediaServerForm.autoConfig = this.mediaServerForm.autoConfig ? 1 : 0;
if (this.mediaServerForm.id != null) {
updatemediaServer(this.mediaServerForm).then((response) => {
this.$modal.msgSuccess(this.$t('updateSuccess'));
this.showDialog = false;
});
} else {
this.portRangeChange();
addmediaServer(this.mediaServerForm).then((response) => {
this.$modal.msgSuccess(this.$t('addSuccess'));
this.showDialog = false;
});
}
this.$parent.getServerList();
this.$parent.delay();
},
close: function () {
this.showDialog = false;
this.dialogLoading = false;
this.mediaServerForm = {
serverId: '',
ip: '',
domain: '',
autoConfig: true,
hookurl: '',
secret: '',
portHttp: '',
portHttps: '',
recordPort: '',
portRtmp: '',
portRtsp: '',
rtpEnable: true,
rtpPortRange: '',
rtpProxyPort: '',
};
this.rtpPortRange1 = 30000;
this.rtpPortRange2 = 30100;
this.listChangeCallback = null;
this.currentStep = 1;
},
portRangeChange: function () {
if (this.mediaServerForm.rtpEnable) {
this.mediaServerForm.rtpPortRange = this.rtpPortRange1 + ',' + this.rtpPortRange2;
console.log(this.mediaServerForm.rtpPortRange);
}
},
selectUser() {
this.$refs.userList.open = true;
this.$refs.userList.getList();
},
getUserData(user) {
this.tempTenantId = user.userId;
this.tempTenantName = user.userName;
this.mediaServerForm.tenantId = user.userId;
this.mediaServerForm.tenantName = user.userName;
},
},
};
</script>

1716
vue/src/views/iot/template/index.vue
View File

File diff suppressed because it is too large Load Diff