<template>
|
<TableLayout :permissions="['business:collectionStation:query']">
|
<div ref="QueryFormRef" slot="search-form">
|
<el-form ref="searchForm" :model="searchForm" label-width="100px" inline>
|
<el-form-item label="名称" prop="name">
|
<el-input v-model="searchForm.name" placeholder="采集站名称" @keypress.enter.native="search" />
|
</el-form-item>
|
<el-form-item label="IP" prop="ip">
|
<el-input v-model="searchForm.ip" placeholder="设备IP" @keypress.enter.native="search" />
|
</el-form-item>
|
<el-form-item label="在线状态" prop="online">
|
<el-select v-model="searchForm.online" placeholder="请选择" clearable>
|
<el-option label="离线" :value="0" />
|
<el-option label="在线" :value="1" />
|
</el-select>
|
</el-form-item>
|
<section>
|
<el-button type="primary" @click="search">搜索</el-button>
|
<el-button @click="reset">重置</el-button>
|
</section>
|
</el-form>
|
</div>
|
|
<template v-slot:table-wrap>
|
<ul class="toolbar">
|
<li>
|
<el-button type="primary" icon="el-icon-plus" v-permissions="['business:collectionStation:create']"
|
@click="$refs.operaWindow.open('新建采集站')">新建</el-button>
|
</li>
|
<li>
|
<el-button type="primary" v-permissions="['business:collectionStation:sync']" @click="handleSyncAll">同步状态</el-button>
|
</li>
|
<li>
|
<el-button type="primary" v-permissions="['business:collectionMedia:sync', 'business:collectionStation:sync']" @click="handleSyncMedia">同步媒体索引</el-button>
|
</li>
|
<li>
|
<el-button type="primary" v-permissions="['business:collectionMedia:download', 'business:collectionStation:sync']" @click="handleBatchDownload">批量下载</el-button>
|
</li>
|
</ul>
|
<el-table :height="tableHeightNew" v-loading="isWorking.search" :data="tableData.list" stripe>
|
<el-table-column label="序号" width="55"><template slot-scope="scope">{{ scope.$index + 1 }}</template></el-table-column>
|
<el-table-column prop="name" label="名称" min-width="120" />
|
<el-table-column prop="ip" label="IP" min-width="120" />
|
<el-table-column prop="port" label="端口" width="80" />
|
<el-table-column prop="model" label="型号" min-width="100" />
|
<el-table-column prop="serialNo" label="序列号" min-width="140" />
|
<el-table-column prop="online" label="在线" width="80">
|
<template slot-scope="{row}">
|
<el-link type="success" :underline="false" v-if="row.online === 1">在线</el-link>
|
<el-link type="danger" :underline="false" v-else>离线</el-link>
|
</template>
|
</el-table-column>
|
<el-table-column label="存储(GB)" min-width="180">
|
<template slot-scope="{row}">
|
<span v-if="row.totalSpace != null">{{ formatStorage(row.freeSpace) }} / {{ formatStorage(row.totalSpace) }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column prop="softwareVersion" label="版本" min-width="100" />
|
<el-table-column prop="lastSyncTime" label="最近同步" min-width="160" />
|
<el-table-column label="操作" min-width="220" fixed="right">
|
<template slot-scope="{row}">
|
<el-button type="text" v-permissions="['business:collectionStation:update']"
|
@click="$refs.operaWindow.open('编辑采集站', row)">编辑</el-button>
|
<el-button type="text" v-permissions="['business:collectionStation:sync']" @click="handleSyncOne(row)">同步</el-button>
|
<el-button type="text" v-permissions="['business:collectionStation:sync']" @click="handleProbe(row)">ISAPI探测</el-button>
|
<el-button type="text" v-permissions="['business:collectionStation:delete']" @click="deleteById(row)">删除</el-button>
|
<el-button type="text" @click="goMedia(row)">媒体</el-button>
|
<el-button type="text" @click="goDockDevice(row)">执法记录仪</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<pagination @size-change="handleSizeChange" @current-change="handlePageChange" :pagination="tableData.pagination" />
|
</template>
|
<OperaCollectionStationWindow ref="operaWindow" @success="handlePageChange" />
|
</TableLayout>
|
</template>
|
|
<script>
|
import BaseTable from '@/components/base/BaseTable'
|
import TableLayout from '@/layouts/TableLayout'
|
import Pagination from '@/components/common/Pagination'
|
import OperaCollectionStationWindow from '@/components/business/OperaCollectionStationWindow'
|
import { syncDevices, syncDevice, syncMedia, batchDownloadMedia, probeIsapi } from '@/api/business/collectionStation'
|
|
export default {
|
name: 'CollectionStation',
|
extends: BaseTable,
|
components: { TableLayout, Pagination, OperaCollectionStationWindow },
|
data () {
|
return {
|
searchForm: {
|
name: '',
|
ip: '',
|
online: null
|
}
|
}
|
},
|
created () {
|
this.config({
|
module: '采集站',
|
api: '/business/collectionStation',
|
'field.id': 'id',
|
'field.main': 'id'
|
})
|
this.search()
|
},
|
methods: {
|
formatStorage (val) {
|
if (val == null || val === '') {
|
return '0'
|
}
|
const num = Number(val)
|
if (Number.isNaN(num)) {
|
return val
|
}
|
return Number.isInteger(num) ? String(num) : num.toFixed(2)
|
},
|
goMedia (row) {
|
this.$router.push({ path: '/business/collectionMedia', query: { stationId: row.id } })
|
},
|
goDockDevice (row) {
|
this.$router.push({ path: '/business/collectionDockDevice', query: { stationId: row.id } })
|
},
|
handleSyncAll () {
|
syncDevices().then(res => {
|
this.$message.success(res.data || '同步完成')
|
this.search()
|
})
|
},
|
handleSyncOne (row) {
|
syncDevice(row.id).then(res => {
|
this.$message.success(res.data || '同步成功')
|
this.search()
|
})
|
},
|
handleSyncMedia () {
|
syncMedia({}).then(res => {
|
this.$message.success(res.data || '同步完成')
|
})
|
},
|
handleBatchDownload () {
|
batchDownloadMedia({ limit: 10 }).then(res => {
|
this.$message.success(res.data || '下载完成')
|
})
|
},
|
handleProbe (row) {
|
probeIsapi(row.id).then(res => {
|
this.$alert('<pre style="max-height:400px;overflow:auto;text-align:left">' + (res.data || '') + '</pre>', 'ISAPI探测', {
|
dangerouslyUseHTMLString: true,
|
customClass: 'isapi-probe-dialog'
|
})
|
})
|
}
|
}
|
}
|
</script>
|