bonus
/
SafetyAlertSystem-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of http://192.168.0.56:3000/bonus/SafetyAlertSystem-ui

This commit is contained in:
jjLv 2024-09-29 11:00:02 +08:00
parent 21d974f7ba 9c52ab2819
commit bafab4120b
5 changed files with 302 additions and 190 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
prettier.config.js Normal file
View File

@ -0,0 +1,10 @@
module.exports = {
tabWidth: 4,
semi: false,
vueIndentScriptAndStyle: false,
singleQuote: true,
trailingComma: 'all',
proseWrap: 'never',
htmlWhitespaceSensitivity: 'strict',
endOfLine: 'auto',
}

15
src/api/base/edgeDevice.js
View File

@ -4,9 +4,16 @@
import request from '@/utils/request' import request from '@/utils/request'
/** 边代设备列表查询 */ /** 边代设备列表查询 */
export const queryEdgeDeviceListApiTwo = (data) => { export const queryEdgeDeviceListApiTwo = (data) => {
return request.get('/base/tbBdDeviceRecord//getDeviceList', { return request.get('/base/tbBdDeviceRecord//getDeviceList', {
params: data params: data,
}) })
} }
/* 获取杆塔数据 */
export const getPowerListApi = (params) => {
return request.get('/base/tbBdDeviceRecord/getPowerList', { params })
}
/* 修改边带与杆塔的绑定关系 */
export const putPowerDataApi = (params) => {
return request.post('/base/tbBdDeviceRecord/updatePowerId', params)
}

302
src/components/TableModelTwo/index.vue
View File

@ -46,17 +46,24 @@
:props="item.optionProps" :props="item.optionProps"
:show-all-levels="false" :show-all-levels="false"
clearable clearable
@change="handleCasAdd($event, item.f_model, cascaderFunc, extraTableProp)" @change="
handleCasAdd(
$event,
item.f_model,
cascaderFunc,
extraTableProp,
)
"
style="width: 240px" style="width: 240px"
/> />
<el-cascader <el-cascader
v-if="item.f_type === 'selCas'" v-if="item.f_type === 'selCas'"
v-model="queryParams[item.f_model]" v-model="queryParams[item.f_model]"
:options="item.f_selList" :options="item.f_selList"
:props="item.optionProps" :props="item.optionProps"
:show-all-levels="false" :show-all-levels="false"
@change="handleCas($event, item.f_model)" @change="handleCas($event, item.f_model)"
style="width: 240px" style="width: 240px"
/> />
<el-date-picker <el-date-picker
v-if="item.f_type === 'date'" v-if="item.f_type === 'date'"
@ -66,20 +73,20 @@
type="date" type="date"
/> />
<el-date-picker <el-date-picker
v-if="item.f_type === 'dateRange'" v-if="item.f_type === 'dateRange'"
v-model="queryParams[item.f_model]" v-model="queryParams[item.f_model]"
style="width: 240px" style="width: 240px"
type="daterange" type="daterange"
value-format="yyyy-MM-dd" value-format="yyyy-MM-dd"
range-separator="至" range-separator="至"
start-placeholder="开始日期" start-placeholder="开始日期"
end-placeholder="结束日期" end-placeholder="结束日期"
/> />
<el-input-number <el-input-number
v-if="item.f_type === 'num'" v-if="item.f_type === 'num'"
v-model="queryParams[item.f_model]" v-model="queryParams[item.f_model]"
:min="0" :min="0"
style="width: 240px" style="width: 240px"
></el-input-number> ></el-input-number>
</el-form-item> </el-form-item>
<el-form-item v-if="showBtnCrews"> <el-form-item v-if="showBtnCrews">
@ -109,7 +116,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<!-- 按钮集群 --> <!-- 按钮集群 -->
<el-row class="btn-container" > <el-row class="btn-container">
<div class="btn-handler"> <div class="btn-handler">
<slot name="btn" :queryParams="queryParams"></slot> <slot name="btn" :queryParams="queryParams"></slot>
</div> </div>
@ -132,8 +139,9 @@
select-on-indeterminate select-on-indeterminate
style="width: 100%" style="width: 100%"
v-loading="loading" v-loading="loading"
@selection-change="handleSelectionChange"> @selection-change="handleSelectionChange"
> >
>
<!-- <el-table-column <!-- <el-table-column
type="selection" type="selection"
width="45" width="45"
@ -170,18 +178,18 @@
</template> </template>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column <el-table-column
align="center" align="center"
label="操作" label="操作"
v-if="handleShow && showOperation" v-if="handleShow && isShowHandle"
:min-width="dynamicWidth" :min-width="dynamicWidth"
> >
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div class="optionDivRef"> <div class="optionDivRef">
<slot :data="row" name="handle">-</slot> <slot :data="row" name="handle"></slot>
</div> </div>
</template> </template>
</el-table-column> --> </el-table-column>
</el-table> </el-table>
<!-- 分页 --> <!-- 分页 -->
@ -221,57 +229,62 @@ export default {
}, },
/** 传递参数 */ /** 传递参数 */
sendParams: { sendParams: {
type: Object, type: Object,
default: () => null default: () => null,
}, },
sendId: { sendId: {
type: Number, type: Number,
default: () => null default: () => null,
}, },
/** 是否显示查询按钮 */ /** 是否显示查询按钮 */
showSearchBtn: { showSearchBtn: {
type: Boolean, type: Boolean,
default: true, default: true,
}, },
showBtnCrews: { showBtnCrews: {
type: Boolean, type: Boolean,
default: true, default: true,
}, },
cascaderFunc: { cascaderFunc: {
type: Function, type: Function,
default: () => null default: () => null,
}, },
extraTableProp: { extraTableProp: {
type: Object, type: Object,
default: () => null default: () => null,
}, },
showOperation: { showOperation: {
type: Boolean, type: Boolean,
default: true default: true,
}, },
showRightTools: { showRightTools: {
type: Boolean, type: Boolean,
default: true default: true,
}, },
selectable: { selectable: {
type: Function, type: Function,
default: () => { default: () => {
return true return true
} },
}, },
selSingle: { selSingle: {
type: Boolean, type: Boolean,
default: false default: false,
}, },
showIndex: { showIndex: {
type: Boolean, type: Boolean,
default: true default: true,
} },
isShowHandle: {
type: Boolean,
default: () => false,
},
}, },
computed: { computed: {
/* 根据操作栏控制表头是否显示 */ /* 根据操作栏控制表头是否显示 */
tableColumCheckProps() { tableColumCheckProps() {
return this.columCheckList.filter(e => { return this.columCheckList.filter((e) => {
return e.checked != false return e.checked != false
}) })
}, },
@ -286,17 +299,17 @@ export default {
}, },
columnsList: { columnsList: {
handler(nv, ov) { handler(nv, ov) {
if(nv !== ov) { if (nv !== ov) {
this.columnsList = nv this.columnsList = nv
this.columCheckList = this.columnsList.map(e => { this.columCheckList = this.columnsList.map((e) => {
this.$set(e, 'checked', true) this.$set(e, 'checked', true)
return e return e
}) })
} }
}, },
deep: true deep: true,
} },
/* sendParams: { /* sendParams: {
handler(nv, ov) { handler(nv, ov) {
console.log(nv, ov) console.log(nv, ov)
if(nv !== ov) { if(nv !== ov) {
@ -311,9 +324,7 @@ export default {
data() { data() {
return { return {
// 表单校验 // 表单校验
formRules: { formRules: {},
},
loading: false, loading: false,
// 列表接口查询参数 // 列表接口查询参数
queryParams: { queryParams: {
@ -338,37 +349,37 @@ export default {
columCheckList: [], columCheckList: [],
// 操作列最小宽度 // 操作列最小宽度
dynamicWidth: 0, dynamicWidth: 0,
idCount: 1 idCount: 1,
} }
}, },
created() { created() {
this.columCheckList = this.columnsList.map(e => { this.columCheckList = this.columnsList.map((e) => {
this.$set(e, 'checked', true) this.$set(e, 'checked', true)
return e return e
}) })
/* 生成查询参数 */ /* 生成查询参数 */
this.formLabel.map(e => { this.formLabel.map((e) => {
this.$set(this.queryParams, e.f_model, '') this.$set(this.queryParams, e.f_model, '')
// 设置表单必填 // 设置表单必填
if(e.f_rule) { if (e.f_rule) {
this.$set(this.formRules, e.f_rule, [ this.$set(this.formRules, e.f_rule, [
{ {
required: true, required: true,
message: `请填写${e.f_label}`, message: `请填写${e.f_label}`,
trigger: 'blur' trigger: 'blur',
} },
]) ])
} }
}) })
if(this.sendParams !== null) { if (this.sendParams !== null) {
Object.assign(this.queryParams, this.sendParams) Object.assign(this.queryParams, this.sendParams)
/* for(let key in this.sendParams) { /* for(let key in this.sendParams) {
console.log(key, this.sendParams[key]) console.log(key, this.sendParams[key])
this.$set(this.queryParams, key, this.sendParams[key]) this.$set(this.queryParams, key, this.sendParams[key])
} */ } */
} }
if(this.sendId !== null) this.queryParams.id = this.sendId if (this.sendId !== null) this.queryParams.id = this.sendId
this.getTableList() this.getTableList()
}, },
updated() { updated() {
@ -378,46 +389,45 @@ export default {
methods: { methods: {
/** 获取列表数据 */ /** 获取列表数据 */
async getTableList() { async getTableList() {
if(this.queryParams.time && this.queryParams.time.length !== 0) { if (this.queryParams.time && this.queryParams.time.length !== 0) {
this.queryParams.startTime = this.queryParams.time[0] this.queryParams.startTime = this.queryParams.time[0]
this.queryParams.endTime = this.queryParams.time[1] this.queryParams.endTime = this.queryParams.time[1]
delete this.queryParams.time delete this.queryParams.time
} }
console.log(this.queryParams) console.log(this.queryParams)
if(Object.keys(this.formRules).length !== 0) { if (Object.keys(this.formRules).length !== 0) {
this.$refs.queryFormRef.validate(async valid => { this.$refs.queryFormRef.validate(async (valid) => {
if (valid) { if (valid) {
this.loading = true
const res = await this.requestApi(this.queryParams)
this.loading = false
console.log(res, '列表数据')
if (res.code === 200) {
if (res.data) {
this.tableList = res.data.rows || res.data
this.total = res.data.total || res.data.length
} else {
this.tableList = res.rows || res.data
this.total = res.data.total || res.rows.length
}
}
}
})
} else {
this.loading = true this.loading = true
const res = await this.requestApi(this.queryParams) const res = await this.requestApi(this.queryParams)
this.loading = false this.loading = false
console.log(res, '列表数据') console.log(res, '列表数据2')
if (res.code === 200) { if (res.code === 200) {
if (res.data) { if (res.data) {
this.tableList = res.data.rows || res.data this.tableList = res.data.rows || res.data
this.total = res.data.total || res.data.length this.total = res.data.total
} else { } else {
this.tableList = res.rows || res.data this.tableList = res.rows || res.data
this.total = res.data.total || res.rows.length this.total = res.total
} }
} }
}
})
} else {
this.loading = true
const res = await this.requestApi(this.queryParams)
this.loading = false
console.log(res, '列表数据2')
if (res.code === 200) {
if (res.data) {
this.tableList = res.data.rows || res.data
this.total = res.data.total
} else {
this.tableList = res.rows || res.data
this.total = res.total
}
} }
}
}, },
/** 查询按钮 */ /** 查询按钮 */
handleQuery() { handleQuery() {
@ -425,7 +435,7 @@ export default {
}, },
/** 填充按钮 */ /** 填充按钮 */
handleFill() { handleFill() {
/* this.tableList.forEach(obj => { /* this.tableList.forEach(obj => {
Object.assign(obj, this.formLabel) Object.assign(obj, this.formLabel)
}) */ }) */
}, },
@ -438,39 +448,36 @@ export default {
}, },
/** 级联选择 */ /** 级联选择 */
handleCas(e, val) { handleCas(e, val) {
this.queryParams[val] = e[e.length - 1] this.queryParams[val] = e[e.length - 1]
}, },
/** 级联选择只选最后一级 */ /** 级联选择只选最后一级 */
handleCasAdd( handleCasAdd(e, val, func, prop) {
e, if (e.length !== 0) {
val, this.queryParams[val] = e[e.length - 1]
func, let setObj = {}
prop // 合并
) { if (prop) {
if(e.length !== 0) { Object.assign(setObj, prop)
this.queryParams[val] = e[e.length - 1] }
let setObj = {} // 设置id自增
// 合并 this.$set(setObj, 'id', this.idCount)
if(prop) { this.idCount++
Object.assign(setObj, prop) // 获取单位
func({
id: e[e.length - 1],
})
.then((res) => {
this.$set(setObj, 'name', res.data.parentName)
this.$set(setObj, 'unitName', res.data.unitName)
this.$set(setObj, 'typeName', res.data.name)
})
.catch((err) => {})
for (let key in this.queryParams) {
this.$set(setObj, key, this.queryParams[key])
}
this.tableList.unshift(setObj)
console.log(this.tableList)
} }
// 设置id自增
this.$set(setObj, 'id', this.idCount)
this.idCount++
// 获取单位
func({
id: e[e.length - 1]
}).then(res => {
this.$set(setObj, 'name', res.data.parentName)
this.$set(setObj, 'unitName', res.data.unitName)
this.$set(setObj, 'typeName', res.data.name)
}).catch(err => {})
for(let key in this.queryParams) {
this.$set(setObj, key, this.queryParams[key])
}
this.tableList.unshift(setObj)
console.log(this.tableList)
}
}, },
/** 动态设置操作列的列宽 */ /** 动态设置操作列的列宽 */
getOperatorWidth() { getOperatorWidth() {
@ -500,16 +507,15 @@ export default {
}, },
queryTableList(params) { queryTableList(params) {
Object.assign(this.queryParams, params) Object.assign(this.queryParams, params)
this.getTableList() this.getTableList()
}, },
handleSelectionChange(e) { handleSelectionChange(e) {
console.log(e, 'e') console.log(e, 'e')
this.msgList = e this.msgList = e
this.$emit('transIdList', this.msgList) this.$emit('transIdList', this.msgList)
}, },
}, },
} }
</script> </script>

163
src/views/base/edgeDeviceManage/index.vue
View File

@ -1,50 +1,139 @@
<template> <template>
<!-- 工程管理页面 --> <!-- 工程管理页面 -->
<div class="app-container"> <div class="app-container">
<!-- 表格 --> <!-- 表格 -->
<TableModelTwo <TableModelTwo
:formLabel="formLabel" :isShowHandle="true"
:columnsList="columnsList" :formLabel="formLabel"
:request-api="queryEdgeDeviceListApiTwo" :columnsList="columnsList"
ref="tableRef" :request-api="queryEdgeDeviceListApiTwo"
> ref="tableRef"
<template slot="devUserPhone" slot-scope="{ data }"> >
{{ phoneCrypto(data.devUserPhone) || '-' }} <template slot="devUserPhone" slot-scope="{ data }">
</template> {{ phoneCrypto(data.devUserPhone) || '-' }}
</TableModelTwo> </template>
</div> <template slot="handle" slot-scope="{ data }">
<el-button
size="mini"
@click="handleClick(data)"
v-if="data.proType === '2'"
>{{ data.bindId ? '修改杆塔' : '绑定杆塔' }}</el-button
>
</template>
</TableModelTwo>
<!-- 绑定弹框 -->
<el-dialog
width="40%"
title="绑定杆塔"
v-if="bindVisible"
:visible.sync="bindVisible"
>
<el-form
label-width="80px"
ref="bindPowerFormRef"
:model="bindPowerForm"
:rules="bindPowerFormRules"
>
<el-form-item label="绑定杆塔" prop="powerId">
<el-select
clearable
placeholder="请选择需要绑定的杆塔"
v-model="bindPowerForm.powerId"
>
<el-option
v-for="item in powerList"
:key="item.powerId"
:label="item.powerName"
:value="item.powerId"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="mini" type="primary" @click="onSubmit"
>确 定</el-button
>
<el-button size="mini" @click="onCancel">取 消</el-button>
</el-form-item>
</el-form>
</el-dialog>
</div>
</template> </template>
<script> <script>
import { formLabel, columnsList, } from './config' import { formLabel, columnsList } from './config'
import { commonMixin } from '../mixins/common' import { commonMixin } from '../mixins/common'
import { import {
queryEdgeDeviceListApiTwo getPowerListApi,
putPowerDataApi,
queryEdgeDeviceListApiTwo,
} from '@/api/base/edgeDevice' } from '@/api/base/edgeDevice'
export default { export default {
name: 'EdgeDevice', name: 'EdgeDevice',
methods: { methods: {
queryEdgeDeviceListApiTwo async handleClick(row) {
if (row.bindId) {
this.bindPowerForm.powerId = row.bindId
} else {
this.bindPowerForm.powerId = ''
}
const { id } = row
this.bindPowerForm.id = id
const res = await getPowerListApi({ id })
this.powerList = res.rows
this.bindVisible = true
},
}, /* 确定 */
onSubmit() {
this.$refs.bindPowerFormRef.validate(async (valid) => {
if (valid) {
const res = await putPowerDataApi(this.bindPowerForm)
if (res.code === 200) {
this.$message.success('绑定成功！')
this.bindVisible = false
this.$refs.tableRef.getTableList()
}
}
})
},
/* 取消 */
onCancel() {
this.bindVisible = false
},
},
mixins: [commonMixin], mixins: [commonMixin],
components: { components: {},
created() {},
}, data() {
created() { return {
}, // 搜索区表单配置项
data() { formLabel,
return { // // 表格导出id列表
// 搜索区表单配置项 // exportList: [],
formLabel, // 列表区配置项
// // 表格导出id列表 columnsList,
// exportList: [], powerList: [], // 杆塔数据源
// 列表区配置项 bindVisible: false,
columnsList, queryEdgeDeviceListApiTwo,
// 弹框区配置项 bindPowerForm: {
} powerId: '',
}, id: '',
},
bindPowerFormRules: {
powerId: [
{
required: true,
message: '请选择需要绑定的杆塔',
trigger: 'change',
},
],
},
// 弹框区配置项
}
},
} }
</script> </script>

2
vue.config.js
View File

@ -35,7 +35,7 @@ module.exports = {
proxy: { proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy // detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: { [process.env.VUE_APP_BASE_API]: {
target: `http://192.168.2.12:18080`, target: `http://192.168.0.110:18080`,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
["^" + process.env.VUE_APP_BASE_API]: "", ["^" + process.env.VUE_APP_BASE_API]: "",