XW-AIOT/wvp-platform
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1078-调整页面

Browse Source
This commit is contained in:
648540858
2024-06-07 14:03:41 +08:00
parent 972ef30f8d
commit 0103d5819b
7 changed files with 224 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
web_src/src/components/JTChannelList.vue
View File

@@ -57,16 +57,6 @@
</el-button>
<el-divider direction="vertical"></el-divider>
<el-button
v-if="scope.row.edit"
size="medium"
type="text"
icon="el-icon-edit-outline"
@click="handleSave(scope.row)"
>
保存
</el-button>
<el-button
v-else
size="medium"
type="text"
icon="el-icon-edit"
@@ -122,9 +112,9 @@
<script>
import devicePlayer from './dialog/devicePlayer.vue'
import uiHeader from '../layout/UiHeader.vue'
import DeviceService from "./service/DeviceService";
import DeviceTree from "./common/DeviceTree";
import channelEdit from "./dialog/jtChannelEdit.vue";
import JTDeviceService from "./service/JTDeviceService";
export default {
name: 'channelList',
@@ -136,7 +126,7 @@ export default {
},
data() {
return {
deviceService: new DeviceService(),
deviceService: new JTDeviceService(),
device: null,
deviceId: this.$route.params.deviceId,
parentChannelId: this.$route.params.parentChannelId,
@@ -240,9 +230,11 @@ export default {
let that = this;
this.$axios({
method: 'get',
url: '/api/play/start/' + deviceId + '/' + channelId,
url: '/api/jt1078/live/start' + deviceId + '/' + channelId,
params: {
isSubStream: this.isSubStream
phoneNumber: deviceId,
channelId: channelId,
type: 0,
}
}).then(function (res) {
console.log(res)

81
web_src/src/components/JTDeviceList.vue
View File

@@ -10,20 +10,21 @@
</div>
</div>
<!--设备列表-->
<el-table :data="deviceList" style="width: 100%;font-size: 12px;" :height="winHeight" header-row-class-name="table-header">
<el-table :data="deviceList" style="width: 100%;font-size: 12px;" :height="winHeight"
header-row-class-name="table-header">
<el-table-column prop="phoneNumber" label="终端手机号" min-width="160">
</el-table-column>
<el-table-column prop="terminalId" label="终端ID" min-width="160" >
<el-table-column prop="terminalId" label="终端ID" min-width="160">
</el-table-column>
<el-table-column prop="provinceText" label="省域" min-width="160">
</el-table-column>
<el-table-column prop="cityText" label="市县域" min-width="160" >
<el-table-column prop="cityText" label="市县域" min-width="160">
</el-table-column>
<el-table-column prop="makerId" label="制造商" min-width="160" >
<el-table-column prop="makerId" label="制造商" min-width="160">
</el-table-column>
<el-table-column prop="model" label="型号" min-width="160" >
<el-table-column prop="model" label="型号" min-width="160">
</el-table-column>
<el-table-column label="车牌颜色" min-width="160" >
<el-table-column label="车牌颜色" min-width="160">
<template slot-scope="scope">
<div slot="reference" class="name-wrapper">
<span v-if="scope.row.plateColor === 1">蓝色</span>
@@ -35,13 +36,13 @@
<span v-else-if="scope.row.plateColor === 92">农绿色</span>
<span v-else-if="scope.row.plateColor === 93">黄绿色</span>
<span v-else-if="scope.row.plateColor === 94">渐变绿</span>
<span v-else >未上牌</span>
<span v-else>未上牌</span>
</div>
</template>
</el-table-column>
<el-table-column prop="plateNo" label="车牌" min-width="160" >
<el-table-column prop="plateNo" label="车牌" min-width="160">
</el-table-column>
<el-table-column prop="registerTime" label="注册时间" min-width="160" >
<el-table-column prop="registerTime" label="注册时间" min-width="160">
</el-table-column>
<el-table-column label="状态" min-width="160">
<template slot-scope="scope">
@@ -51,7 +52,7 @@
</div>
</template>
</el-table-column>
<el-table-column label="操作" min-width="450" fixed="right">
<el-table-column label="操作" min-width="280" fixed="right">
<template slot-scope="scope">
<el-divider direction="vertical"></el-divider>
<el-button type="text" size="medium" icon="el-icon-video-camera"
@@ -60,7 +61,9 @@
<el-divider direction="vertical"></el-divider>
<el-button size="medium" icon="el-icon-edit" type="text" @click="edit(scope.row)">编辑</el-button>
<el-divider direction="vertical"></el-divider>
<el-button size="medium" icon="el-icon-delete" type="text" @click="deleteDevice(scope.row)" style="color: #f56c6c">删除</el-button>
<el-button size="medium" icon="el-icon-delete" type="text" @click="deleteDevice(scope.row)"
style="color: #f56c6c">删除
</el-button>
</template>
</el-table-column>
</el-table>
@@ -83,6 +86,7 @@
import uiHeader from '../layout/UiHeader.vue'
import deviceEdit from './dialog/jtDeviceEdit.vue'
import syncChannelProgress from './dialog/SyncChannelProgress.vue'
import JTDeviceService from "./service/JTDeviceService";
export default {
name: 'app',
@@ -93,12 +97,9 @@ export default {
},
data() {
return {
deviceService: new JTDeviceService(),
deviceList: [], //设备列表
currentDevice: {}, //当前操作设备对象
videoComponentList: [],
updateLooper: 0, //数据刷新轮训标志
currentDeviceChannelsLenth: 0,
winHeight: window.innerHeight - 200,
currentPage: 1,
count: 15,
@@ -106,19 +107,6 @@ export default {
getListLoading: false,
};
},
computed: {
getcurrentDeviceChannels: function () {
let data = this.currentDevice['channelMap'];
let channels = null;
if (data) {
channels = Object.keys(data).map(key => {
return data[key];
});
this.currentDeviceChannelsLenth = channels.length;
}
return channels;
}
},
mounted() {
this.initData();
this.updateLooper = setInterval(this.initData, 10000);
@@ -141,23 +129,16 @@ export default {
},
getList: function () {
this.getListLoading = true;
this.$axios({
method: 'get',
url: `/api/jt1078/terminal/list`,
params: {
page: this.currentPage,
count: this.count
this.deviceService.getDeviceList(this.currentPage, this.count, (data) => {
if (data.code === 0) {
this.total = data.data.total;
this.deviceList = data.data.list;
}
this.getListLoading = false;
}, () => {
this.getListLoading = false;
}
}).then( (res)=> {
if (res.data.code === 0) {
this.total = res.data.data.total;
this.deviceList = res.data.data.list;
}
this.getListLoading = false;
}).catch( (error)=> {
console.error(error);
this.getListLoading = false;
});
)
},
deleteDevice: function (row) {
this.$confirm("确定删除此设备？", '提示', {
@@ -167,17 +148,9 @@ export default {
center: true,
type: 'warning'
}).then(() => {
this.$axios({
method: 'delete',
url: '/api/jt1078/terminal/delete',
params: {
deviceId: row.deviceId
}
}).then((res) => {
this.deviceService.deleteDevice(row.id, (data) => {
this.getList();
}).catch((error) => {
console.error(error);
});
})
}).catch(() => {
});

173
web_src/src/components/service/JTDeviceService.js Executable file
View File

@@ -0,0 +1,173 @@
import axios from 'axios';
class JTDeviceService{
constructor() {
this.$axios = axios;
}
getDeviceList(currentPage, count, callback, errorCallback){
this.$axios({
method: 'get',
url: `/api/jt1078/terminal/list`,
params: {
page: currentPage,
count: count
}
}).then( (res)=> {
if (typeof (callback) == "function") callback(res.data)
}).catch( (error)=> {
console.error(error);
if (typeof (errorCallback) == "function") errorCallback(error)
});
}
getDevice(deviceId, callback, errorCallback){
this.$axios({
method: 'get',
url:`/api/jt1078/terminal/query`,
params: {
deviceId: deviceId
},
}).then((res) => {
if (typeof (callback) == "function") callback(res.data)
}).catch((error) => {
console.log(error);
if (typeof (errorCallback) == "function") errorCallback(error)
});
}
deleteDevice(deviceId, callback, errorCallback){
this.$axios({
method: 'delete',
url: '/api/jt1078/terminal/delete',
params: {
deviceId: deviceId
}
}).then((res) => {
if (typeof (callback) == "function") callback(res.data)
}).catch((error) => {
if (typeof (errorCallback) == "function") errorCallback(error)
});
}
getAllChannel(isCatalog, catalogUnderDevice, deviceId, callback, endCallback, errorCallback) {
let currentPage = 1;
let count = 100;
let catalogList = []
this.getAllChannelIteration(isCatalog, catalogUnderDevice, deviceId, catalogList, currentPage, count, callback, endCallback, errorCallback)
}
getAllChannelIteration(isCatalog, catalogUnderDevice, deviceId, catalogList, currentPage, count, callback, endCallback, errorCallback) {
this.getChanel(isCatalog, catalogUnderDevice, deviceId, currentPage, count, (data) => {
if (data.list) {
if (typeof (callback) == "function") callback(data.list)
catalogList = catalogList.concat(data.list);
if (catalogList.length < data.total) {
currentPage ++
this.getAllChannelIteration(isCatalog,catalogUnderDevice, deviceId, catalogList, currentPage, count, callback, errorCallback)
}else {
console.log(1)
if (typeof (endCallback) == "function") endCallback(catalogList)
}
}
}, errorCallback)
}
getChanel(isCatalog, catalogUnderDevice, deviceId, currentPage, count, callback, errorCallback) {
this.$axios({
method: 'get',
url: `/api/device/query/devices/${deviceId}/channels`,
params:{
page: currentPage,
count: count,
query: "",
online: "",
channelType: isCatalog,
catalogUnderDevice: catalogUnderDevice
}
}).then((res) =>{
if (typeof (callback) == "function") callback(res.data)
}).catch(errorCallback);
}
getAllSubChannel(isCatalog, deviceId, channelId, callback, endCallback, errorCallback) {
let currentPage = 1;
let count = 100;
let catalogList = []
this.getAllSubChannelIteration(isCatalog, deviceId, channelId, catalogList, currentPage, count, callback, endCallback, errorCallback)
}
getAllSubChannelIteration(isCatalog, deviceId,channelId, catalogList, currentPage, count, callback, endCallback, errorCallback) {
this.getSubChannel(isCatalog, deviceId, channelId, currentPage, count, (data) => {
if (data.list) {
if (typeof (callback) == "function") callback(data.list)
catalogList = catalogList.concat(data.list);
if (catalogList.length < data.total) {
currentPage ++
this.getAllSubChannelIteration(isCatalog, deviceId, channelId, catalogList, currentPage, count, callback, endCallback, errorCallback)
}else {
if (typeof (endCallback) == "function") endCallback(catalogList)
}
}
}, errorCallback)
}
getSubChannel(isCatalog, deviceId, channelId, currentPage, count, callback, errorCallback) {
this.$axios({
method: 'get',
url: `/api/device/query/sub_channels/${deviceId}/${channelId}/channels`,
params:{
page: currentPage,
count: count,
query: "",
online: "",
channelType: isCatalog
}
}).then((res) =>{
if (typeof (callback) == "function") callback(res.data)
}).catch(errorCallback);
}
getTree(deviceId, parentId, onlyCatalog, callback, endCallback, errorCallback) {
let currentPage = 1;
let count = 100;
let catalogList = []
this.getTreeIteration(deviceId, parentId, onlyCatalog, catalogList, currentPage, count, callback, endCallback, errorCallback)
}
getTreeIteration(deviceId, parentId, onlyCatalog, catalogList, currentPage, count, callback, endCallback, errorCallback) {
this.getTreeInfo(deviceId, parentId, onlyCatalog, currentPage, count, (data) => {
if (data.code === 0 && data.data.list) {
if (typeof (callback) == "function") callback(data.data.list)
catalogList = catalogList.concat(data.data.list);
if (catalogList.length < data.data.total) {
currentPage ++
this.getTreeIteration(deviceId, parentId, onlyCatalog, catalogList, currentPage, count, callback, endCallback, errorCallback)
}else {
if (typeof (endCallback) == "function") endCallback(catalogList)
}
}
}, errorCallback)
}
getTreeInfo(deviceId, parentId, onlyCatalog, currentPage, count, callback, errorCallback) {
if (onlyCatalog == null || typeof onlyCatalog === "undefined") {
onlyCatalog = false;
}
this.$axios({
method: 'get',
url: `/api/device/query/tree/${deviceId}`,
params:{
page: currentPage,
count: count,
parentId: parentId,
onlyCatalog: onlyCatalog
}
}).then((res) =>{
if (typeof (callback) == "function") callback(res.data)
}).catch(errorCallback);
}
}
export default JTDeviceService;