|
|
@ -3,7 +3,7 @@ |
|
|
<!--工具栏--> |
|
|
<!--工具栏--> |
|
|
<div class="head-container"> |
|
|
<div class="head-container"> |
|
|
<!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'--> |
|
|
<!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'--> |
|
|
<crudOperation :permission="permission"/> |
|
|
<crudOperation :permission="permission" /> |
|
|
<!--表单组件--> |
|
|
<!--表单组件--> |
|
|
<el-dialog |
|
|
<el-dialog |
|
|
:close-on-click-modal="false" |
|
|
:close-on-click-modal="false" |
|
|
@ -14,13 +14,13 @@ |
|
|
> |
|
|
> |
|
|
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px"> |
|
|
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px"> |
|
|
<el-form-item label="编码" prop="code"> |
|
|
<el-form-item label="编码" prop="code"> |
|
|
<el-input v-model="form.code" style="width: 370px;"/> |
|
|
<el-input v-model="form.code" style="width: 370px;" /> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item label="名字" prop="name"> |
|
|
<el-form-item label="名字" prop="name"> |
|
|
<el-input v-model="form.name" style="width: 370px;"/> |
|
|
<el-input v-model="form.name" style="width: 370px;" /> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item label="值" prop="value"> |
|
|
<el-form-item label="值" prop="value"> |
|
|
<el-input v-model="form.value" style="width: 370px;"/> |
|
|
<el-input v-model="form.value" style="width: 370px;" /> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item label="启用" prop="is_active"> |
|
|
<el-form-item label="启用" prop="is_active"> |
|
|
<el-radio-group v-model="form.is_active" size="mini"> |
|
|
<el-radio-group v-model="form.is_active" size="mini"> |
|
|
@ -29,7 +29,7 @@ |
|
|
</el-radio-group> |
|
|
</el-radio-group> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item label="备注" prop="description"> |
|
|
<el-form-item label="备注" prop="description"> |
|
|
<el-input v-model="form.remark" style="width: 380px;" rows="5" type="textarea"/> |
|
|
<el-input v-model="form.remark" style="width: 380px;" rows="5" type="textarea" /> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
</el-form> |
|
|
</el-form> |
|
|
<div slot="footer" class="dialog-footer"> |
|
|
<div slot="footer" class="dialog-footer"> |
|
|
@ -46,19 +46,19 @@ |
|
|
style="width: 100%;" |
|
|
style="width: 100%;" |
|
|
@selection-change="crud.selectionChangeHandler" |
|
|
@selection-change="crud.selectionChangeHandler" |
|
|
> |
|
|
> |
|
|
<el-table-column type="selection" width="55"/> |
|
|
<el-table-column type="selection" width="55" /> |
|
|
<el-table-column v-if="false" prop="id" label="id"/> |
|
|
<el-table-column v-if="false" prop="id" label="id" /> |
|
|
<el-table-column prop="code" label="编码"/> |
|
|
<el-table-column prop="code" label="编码" /> |
|
|
<el-table-column prop="name" label="名称"/> |
|
|
<el-table-column prop="name" label="名称" /> |
|
|
<el-table-column prop="value" label="值"/> |
|
|
<el-table-column prop="value" label="值" /> |
|
|
<el-table-column prop="remark" label="备注"/> |
|
|
<el-table-column prop="remark" label="备注" /> |
|
|
<el-table-column prop="is_active" label="启用" width="75px"> |
|
|
<el-table-column prop="is_active" label="启用" width="75px"> |
|
|
<template slot-scope="scope"> |
|
|
<template slot-scope="scope"> |
|
|
<span v-if="scope.row.is_active==0">否</span> |
|
|
<span v-if="scope.row.is_active==0">否</span> |
|
|
<span v-else>是</span> |
|
|
<span v-else>是</span> |
|
|
</template> |
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
<el-table-column prop="create_by" label="创建者"/> |
|
|
<el-table-column prop="create_by" label="创建者" /> |
|
|
<el-table-column v-permission="['admin','param:edit','param:del']" label="操作" width="150px" align="center"> |
|
|
<el-table-column v-permission="['admin','param:edit','param:del']" label="操作" width="150px" align="center"> |
|
|
<template slot-scope="scope"> |
|
|
<template slot-scope="scope"> |
|
|
<udOperation |
|
|
<udOperation |
|
|
@ -69,7 +69,7 @@ |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
</el-table> |
|
|
</el-table> |
|
|
<!--分页组件--> |
|
|
<!--分页组件--> |
|
|
<pagination/> |
|
|
<pagination /> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
@ -99,7 +99,7 @@ export default { |
|
|
components: { pagination, crudOperation, rrOperation, udOperation }, |
|
|
components: { pagination, crudOperation, rrOperation, udOperation }, |
|
|
mixins: [presenter(), header(), form(defaultForm), crud()], |
|
|
mixins: [presenter(), header(), form(defaultForm), crud()], |
|
|
cruds() { |
|
|
cruds() { |
|
|
return CRUD({ title: '系统参数', url: 'api/param', idField: 'id', sort: 'id,desc', crudMethod: { ...crudParam } }) |
|
|
return CRUD({ title: '系统参数', url: 'api/param', idField: 'id', sort: 'id,desc', crudMethod: { ...crudParam }}) |
|
|
}, |
|
|
}, |
|
|
data() { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
|
@ -128,6 +128,9 @@ export default { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
|
|
|
created() { |
|
|
|
|
|
this.webSocket() |
|
|
|
|
|
}, |
|
|
methods: { |
|
|
methods: { |
|
|
// 钩子：在获取表格数据之前执行，false 则代表不获取数据 |
|
|
// 钩子：在获取表格数据之前执行，false 则代表不获取数据 |
|
|
[CRUD.HOOK.beforeRefresh]() { |
|
|
[CRUD.HOOK.beforeRefresh]() { |
|
|
@ -135,7 +138,7 @@ export default { |
|
|
}, |
|
|
}, |
|
|
webSocket() { |
|
|
webSocket() { |
|
|
const that = this |
|
|
const that = this |
|
|
if (typeof (WebSocket) == 'undefined') { |
|
|
if (typeof (WebSocket) === 'undefined') { |
|
|
this.$notify({ |
|
|
this.$notify({ |
|
|
title: '提示', |
|
|
title: '提示', |
|
|
message: '当前浏览器无法接收实时报警信息，请使用谷歌浏览器！', |
|
|
message: '当前浏览器无法接收实时报警信息，请使用谷歌浏览器！', |
|
|
@ -143,7 +146,7 @@ export default { |
|
|
duration: 0 |
|
|
duration: 0 |
|
|
}) |
|
|
}) |
|
|
} else { |
|
|
} else { |
|
|
let id = '123' |
|
|
const id = '123' |
|
|
// 获取token保存到vuex中的用户信息，此处仅适用于本项目，注意删除或修改 |
|
|
// 获取token保存到vuex中的用户信息，此处仅适用于本项目，注意删除或修改 |
|
|
// 实例化socket，这里我把用户名传给了后台，使后台能判断要把消息发给哪个用户，其实也可以后台直接获取用户IP来判断并推送 |
|
|
// 实例化socket，这里我把用户名传给了后台，使后台能判断要把消息发给哪个用户，其实也可以后台直接获取用户IP来判断并推送 |
|
|
const socketUrl = process.env.VUE_APP_WS_API + id |
|
|
const socketUrl = process.env.VUE_APP_WS_API + id |
|
|
@ -151,17 +154,16 @@ export default { |
|
|
// 监听socket打开 |
|
|
// 监听socket打开 |
|
|
this.socket.onopen = function() { |
|
|
this.socket.onopen = function() { |
|
|
console.log('浏览器WebSocket已打开') |
|
|
console.log('浏览器WebSocket已打开') |
|
|
that.socket.send("测试客户端发送消息"); |
|
|
that.socket.send('测试客户端发送消息') |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 监听socket消息接收 |
|
|
// 监听socket消息接收 |
|
|
|
|
|
|
|
|
this.socket.onmessage = function(msg) { |
|
|
this.socket.onmessage = function(msg) { |
|
|
console.log(msg); |
|
|
console.log(msg) |
|
|
|
|
|
|
|
|
// 转换为json对象 |
|
|
// 转换为json对象 |
|
|
/* const data = JSON.parse(msg.data);*/ |
|
|
/* const data = JSON.parse(msg.data);*/ |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 监听socket错误 |
|
|
// 监听socket错误 |
|
|
@ -177,12 +179,8 @@ export default { |
|
|
this.socket.onclose = function() { |
|
|
this.socket.onclose = function() { |
|
|
console.log('WebSocket已关闭') |
|
|
console.log('WebSocket已关闭') |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
|
|
|
created() { |
|
|
|
|
|
this.webSocket() |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</script> |
|
|
|
