LAPTOP-S9HJSOEB\昊天
2 years ago
parent
8252e2aa26
commit
c684394339
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
@ -0,0 +1,222 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="button-box">
|
||||||
|
<a-button type="primary" class="add" @click="showModel('add','')">
|
||||||
|
新增球机
|
||||||
|
</a-button>
|
||||||
|
<a-button type="primary" class="plc" @click="goIo">
|
||||||
|
PLC IO表配置
|
||||||
|
</a-button>
|
||||||
|
<a-button type="primary" class="add" @click="videoConfig">
|
||||||
|
视频流配置
|
||||||
|
</a-button>
|
||||||
|
</div>
|
||||||
|
<a-table
|
||||||
|
style="margin-top:40px"
|
||||||
|
:columns="columns"
|
||||||
|
:row-key="record => record.id"
|
||||||
|
:data-source="data"
|
||||||
|
:pagination="pagination"
|
||||||
|
@change="handleGetCameraList"
|
||||||
|
>
|
||||||
|
<span slot="action" slot-scope="text, record">
|
||||||
|
<!-- <a @click="showModel('test',record)">
|
||||||
|
测试
|
||||||
|
</a> -->
|
||||||
|
<a-divider type="vertical"/>
|
||||||
|
<a @click="showModel('config',record)">
|
||||||
|
配置
|
||||||
|
</a>
|
||||||
|
<a-divider type="vertical"/>
|
||||||
|
<a @click="showModel('edit',record)">
|
||||||
|
编辑
|
||||||
|
</a>
|
||||||
|
<a-divider type="vertical"/>
|
||||||
|
<a-popconfirm
|
||||||
|
title="是否删除?"
|
||||||
|
@confirm="() => delDosage(record)"
|
||||||
|
>
|
||||||
|
<a>删除</a>
|
||||||
|
</a-popconfirm>
|
||||||
|
</span>
|
||||||
|
</a-table>
|
||||||
|
<Model
|
||||||
|
:visible.sync="visible"
|
||||||
|
:modelType="modelType"
|
||||||
|
:modelData.sync="modelData"
|
||||||
|
@sure="submit"
|
||||||
|
@close="closeModel"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Model from "./model.vue"
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: '球机名称',
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '球机IP',
|
||||||
|
dataIndex: 'ip',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '视频流IP',
|
||||||
|
dataIndex: 'rtcServer',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '连接状态',
|
||||||
|
dataIndex: 'status',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '修改时间',
|
||||||
|
dataIndex: 'updateTime',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'action',
|
||||||
|
scopedSlots: { customRender: 'action' }
|
||||||
|
},
|
||||||
|
];
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
pageNum:1,
|
||||||
|
pageSize:10,
|
||||||
|
data: [],
|
||||||
|
pagination:{
|
||||||
|
total:0,
|
||||||
|
defaultPageSize:10, // 默认每页显示数量
|
||||||
|
showTotal: total => `共 ${total} 条数据`, // 显示总数
|
||||||
|
showSizeChanger:true, // 显示可改变每页数量
|
||||||
|
pageSizeOptions: ['10', '20', '30'],
|
||||||
|
onShowSizeChange:(current, pageSize)=>this.pageSize = pageSize // 改变每页数量时更新显示
|
||||||
|
},
|
||||||
|
loading: false,
|
||||||
|
columns,
|
||||||
|
visible:false,
|
||||||
|
modelType:'',
|
||||||
|
modelData:[]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.handleGetCameraList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleGetCameraList(pagination) {
|
||||||
|
if(pagination){
|
||||||
|
this.pagination.current = pagination.current;
|
||||||
|
this.pagination.pageSize = pagination.pageSize;
|
||||||
|
this.pageNum = pagination.current;
|
||||||
|
this.pageSize = pagination.pageSize;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.request();
|
||||||
|
},
|
||||||
|
request(){
|
||||||
|
this.$api.httpApi.getCameraList({
|
||||||
|
data: {
|
||||||
|
pageNum:this.pageNum,
|
||||||
|
pageSize:this.pageSize,
|
||||||
|
}
|
||||||
|
}).then(res => {
|
||||||
|
const pagination = { ...this.pagination };
|
||||||
|
pagination.total = res.data.total;
|
||||||
|
this.data = res.data.list;
|
||||||
|
this.pagination = pagination;
|
||||||
|
}).catch(err => {
|
||||||
|
|
||||||
|
});
|
||||||
|
},
|
||||||
|
showModel(type,data){
|
||||||
|
console.log(type)
|
||||||
|
if (type == 'test') {
|
||||||
|
this.$router.push({
|
||||||
|
name: 'deviceManageModel',
|
||||||
|
query: {modelType: type, modelData: data}
|
||||||
|
})
|
||||||
|
} else if (type == 'config') {
|
||||||
|
this.$router.push({
|
||||||
|
name: 'deviceManageModel',
|
||||||
|
query: {modelType: type, modelData: data}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.visible = true
|
||||||
|
this.modelType = type
|
||||||
|
this.modelData = data
|
||||||
|
}
|
||||||
|
},
|
||||||
|
submit(visible){
|
||||||
|
this.visible = visible
|
||||||
|
this.handleGetCameraList()
|
||||||
|
},
|
||||||
|
closeModel(visible,data){
|
||||||
|
this.visible = visible
|
||||||
|
this.modelData=data
|
||||||
|
},
|
||||||
|
delDosage(data){
|
||||||
|
console.log(data.id)
|
||||||
|
var id=data.id
|
||||||
|
this.$axios.delete('/camera/'+id, {
|
||||||
|
data: {}
|
||||||
|
}).then(res => {
|
||||||
|
if(res.code==200){
|
||||||
|
this.$message.success('删除球机成功');
|
||||||
|
this.handleGetCameraList()
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
|
||||||
|
})
|
||||||
|
},
|
||||||
|
goIo(){
|
||||||
|
this.$router.push({ name: "ioTable"});
|
||||||
|
},
|
||||||
|
videoConfig(){
|
||||||
|
const that = this
|
||||||
|
this.$confirm({
|
||||||
|
title: "生成全部视频流",
|
||||||
|
content: "确认生成全部视频流？",
|
||||||
|
okText: '确认',
|
||||||
|
onOk() {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
that.downConfig();
|
||||||
|
setTimeout(resolve, 1000);
|
||||||
|
}).catch(() => console.log('Oops errors!'));
|
||||||
|
},
|
||||||
|
cancelText: '取消',
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
downConfig(){
|
||||||
|
this.$api.httpApi.videoConfig({
|
||||||
|
|
||||||
|
}).then(res => {
|
||||||
|
|
||||||
|
}).catch(err => {
|
||||||
|
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
Model
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.button-box{
|
||||||
|
position: absolute;
|
||||||
|
top:20px;
|
||||||
|
right: 40px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
.add{
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
.plc{
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue