初始化
This commit is contained in:
aixianling
207
packages/2.0.5/AppEquipmentManage/components/List.vue
vendored
Normal file
207
packages/2.0.5/AppEquipmentManage/components/List.vue
vendored
Normal file
@@ -0,0 +1,207 @@
|
||||
<template>
|
||||
<section class="AppPetitionManage">
|
||||
<ai-list>
|
||||
<ai-title slot="title" title="广播设备管理" isShowBottomBorder/>
|
||||
<template #content>
|
||||
<ai-search-bar bottomBorder>
|
||||
<template slot="left">
|
||||
<ai-select v-model="search.devStatus" placeholder="设备状态" clearable
|
||||
:selectList="$dict.getDict('dlbDevStatus')" @change=";(page.current = 1), getList()"></ai-select>
|
||||
<!-- <ai-select v-model="search.bind" placeholder="是否绑定区划" clearable :selectList="$dict.getDict('yesOrNo')" @change=";(page.current = 1), getList()"></ai-select> -->
|
||||
</template>
|
||||
<template slot="right">
|
||||
<el-input v-model="search.keyword" size="small" placeholder="设备名称/设备编号" clearable
|
||||
@keyup.enter.native=";(page.current = 1), getList()"
|
||||
@clear=";(page.current = 1), (search.keyword = ''), getList()" suffix-icon="iconfont iconSearch"/>
|
||||
</template>
|
||||
</ai-search-bar>
|
||||
<ai-search-bar class="ai-search-ba mar-t10">
|
||||
<template slot="left">
|
||||
<!-- <el-button icon="iconfont" type="primary" size="small">数据同步</el-button> -->
|
||||
<!-- <el-button icon="iconfont iconDelete" size="small" @click="removeAll" :disabled="ids.length == 0">删除 </el-button> -->
|
||||
</template>
|
||||
</ai-search-bar>
|
||||
<ai-table :tableData="tableData" :col-configs="colConfigs" :total="total" ref="aitableex"
|
||||
:current.sync="page.current" :size.sync="page.size" @getList="getList"
|
||||
@selection-change="(v) => (ids = v.map((e) => e.id))">
|
||||
<el-table-column slot="options" label="操作" align="center" width="280" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button type="text" @click="close(row.id)">停播</el-button>
|
||||
<el-button type="text" @click="bind(row)">绑定行政区划</el-button>
|
||||
<el-button type="text" @click="locate=true">地图标绘</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</ai-table>
|
||||
</template>
|
||||
</ai-list>
|
||||
<el-dialog
|
||||
title="绑定行政区划"
|
||||
:visible.sync="bindVisible"
|
||||
width="800px">
|
||||
<ai-area-get :instance="instance" v-model="areaId" :root="user.info.areaId" @select="handleAreaSelect"/>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="bindVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="bindArea">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<locate-dialog v-model="locate" :ins="instance" @confirm="bindLocate"/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapState} from 'vuex'
|
||||
import LocateDialog from "../../../monitor/components/locateDialog";
|
||||
|
||||
export default {
|
||||
name: 'List',
|
||||
components: {LocateDialog},
|
||||
props: {
|
||||
dict: Object,
|
||||
instance: Function,
|
||||
params: Object,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
isAdd: false,
|
||||
page: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
},
|
||||
total: 0,
|
||||
search: {
|
||||
bind: '',
|
||||
keyword: '',
|
||||
},
|
||||
id: '',
|
||||
ids: [],
|
||||
colConfigs: [
|
||||
{
|
||||
prop: 'deviceName',
|
||||
label: '设备名称',
|
||||
},
|
||||
{
|
||||
prop: 'areaName',
|
||||
label: '所属行政区划',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
prop: 'serialNo',
|
||||
label: '设备编号',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
prop: 'devStatus',
|
||||
label: '设备状态',
|
||||
width: '100',
|
||||
align: 'center',
|
||||
render: (h, {row}) => {
|
||||
return h('span', null, this.dict.getLabel('dlbDevStatus', row.devStatus))
|
||||
},
|
||||
},
|
||||
{
|
||||
prop: 'bind',
|
||||
label: '是否绑定区划',
|
||||
width: '120',
|
||||
align: 'center',
|
||||
render: (h, {row}) => {
|
||||
return h('span', null, this.dict.getLabel('yesOrNo', row.bind))
|
||||
},
|
||||
},
|
||||
{
|
||||
slot: 'options',
|
||||
label: '操作',
|
||||
align: 'center',
|
||||
},
|
||||
],
|
||||
tableData: [],
|
||||
areaId: '',
|
||||
bindVisible: false,
|
||||
changeInfo: {},
|
||||
locate: false
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.dict.load('dlbDevStatus', 'yesOrNo').then(() => {
|
||||
this.getList()
|
||||
})
|
||||
},
|
||||
|
||||
methods: {
|
||||
bind(item) {
|
||||
this.areaId = ''
|
||||
this.changeInfo = item
|
||||
this.bindVisible = true
|
||||
},
|
||||
handleAreaSelect(v) {
|
||||
this.changeInfo.areaName = v?.[0]?.label
|
||||
},
|
||||
bindArea() {
|
||||
if (!this.areaId) {
|
||||
return this.$message.error('请先选择行政区划')
|
||||
}
|
||||
this.changeInfo.areaId = this.areaId
|
||||
this.instance.post(`/app/appdlbquipment/addOrUpdate`, this.changeInfo).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('绑定行政区划成功！')
|
||||
this.bindVisible = false
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
},
|
||||
bindLocate(locate) {
|
||||
if (locate) {
|
||||
let {lat, lng} = locate.location, {changeInfo} = this
|
||||
this.instance.post("/app/appdlbquipment/addOrUpdate", {
|
||||
...changeInfo, lat, lng
|
||||
}).then(res => {
|
||||
if (res?.code == 0) {
|
||||
this.$message.success("地图标绘成功!")
|
||||
this.locate = true
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
close(id) {
|
||||
this.$confirm('确定停播该设备?').then(() => {
|
||||
this.instance.post(`/app/appdlbquipment/stop?deviceId=${id}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('停播成功！')
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
getList() {
|
||||
this.instance.post(`/app/appdlbquipment/getDlbDeviceList`, null, {
|
||||
params: {
|
||||
...this.page,
|
||||
...this.search,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.records
|
||||
this.total = parseInt(res.data.total)
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.AppPetitionManage {
|
||||
height: 100%;
|
||||
|
||||
.mar-t10 {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user