<template>
|
<div class="app-container">
|
<div class="filter-container">
|
<!-- <el-input v-model="listQuery.keyword" size="small" placeholder="请输入关键词" clearable class="filter-item w-200" /> -->
|
<el-button-group class="filter-item">
|
<!-- <el-button size="small" type="primary" icon="el-icon-search" @click="search">
|
搜索
|
</el-button> -->
|
<el-button size="small" type="primary" icon="el-icon-refresh" @click="refresh">
|
刷新
|
</el-button>
|
<!-- <el-button size="small" type="primary" icon="el-icon-plus" @click="add">
|
新增
|
</el-button> -->
|
</el-button-group>
|
</div>
|
|
<el-table v-loading="listLoading" :data="list" element-loading-text="Loading" border fit height="100%"
|
class="table-container" highlight-current-row>
|
<el-table-column fixed label="序号" width="80">
|
<template slot-scope="scope">
|
{{ scope.row.id }}
|
</template>
|
</el-table-column>
|
<el-table-column label="UDP端口">
|
<template slot-scope="scope">
|
{{ scope.row.udpport }}
|
</template>
|
</el-table-column>
|
<el-table-column label="历史数据保存时长">
|
<template slot-scope="scope">
|
{{ scope.row.savetime }}
|
</template>
|
</el-table-column>
|
<el-table-column label="视图中心">
|
<template slot-scope="scope">
|
{{ scope.row.view }}
|
</template>
|
</el-table-column>
|
<el-table-column label="时解析">
|
<template slot-scope="scope">
|
<span v-if="scope.row.dell1 == 1">开启</span>
|
<span v-if="scope.row.dell1 == 0">关闭</span>
|
<!-- {{ scope.row.dell1 }} -->
|
</template>
|
</el-table-column>
|
<el-table-column label="日解析">
|
<template slot-scope="scope">
|
<span v-if="scope.row.dell24 == 1">开启</span>
|
<span v-if="scope.row.dell24 == 0">关闭</span>
|
<!-- {{ scope.row.dell24 }} -->
|
</template>
|
</el-table-column>
|
<el-table-column label="登录方式">
|
<template slot-scope="scope">
|
<span v-if="scope.row.loginmethod == 0">仅账号</span>
|
<span v-if="scope.row.loginmethod == 1">仅短信</span>
|
<span v-if="scope.row.loginmethod == 2">账号+短信</span>
|
<!-- {{ scope.row.loginmethod }} -->
|
</template>
|
</el-table-column>
|
<!-- <el-table-column label="最近更新时间" >
|
<template slot-scope="scope">
|
{{ scope.row.alerttime }}
|
</template>
|
</el-table-column> -->
|
|
<el-table-column label="操作" width="200" v-if="uupdate == 'Yes'">
|
<template slot-scope="scope">
|
<el-button-group>
|
<el-button type="primary" icon="el-icon-edit" size="mini" @click="edit(scope)">
|
修改
|
</el-button>
|
<!-- <el-button type="danger" icon="el-icon-delete" size="mini" @click="del(scope)">
|
删除
|
</el-button> -->
|
</el-button-group>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size"
|
@pagination="fetchData" />
|
|
<el-dialog :visible.sync="dialogVisible" :title="dialogType === 'modify' ? '修改' : '新增'">
|
<el-form :ref="temp" :model="temp" label-width="120px" label-position="right" :rules="rules">
|
<!-- <el-form-item label="UDP端口" prop="udpport">
|
<el-input v-model="temp.udpport
|
" placeholder="请输入UDP端口" />
|
</el-form-item>
|
<el-form-item label="历史数据保存时长" prop="savetime">
|
<el-input v-model="temp.savetime
|
" placeholder="请输入历史数据保存时长" />
|
</el-form-item>
|
<el-form-item label="视图中心" prop="view">
|
<el-input v-model="temp.view
|
" placeholder="请输入视图中心" />
|
</el-form-item> -->
|
<el-form-item label="时解析" prop="dell1">
|
<el-switch v-model="value1" active-color="#13ce66" inactive-color="#ff4949">
|
</el-switch>
|
<!-- <el-input v-model="temp.dell1
|
" placeholder="请输入dell1" /> -->
|
</el-form-item>
|
<el-form-item label="日解析" prop="dell24">
|
<el-switch v-model="value2" active-color="#13ce66" inactive-color="#ff4949">
|
</el-switch>
|
<!-- <el-input v-model="temp.dell24
|
" placeholder="请输入dell24" /> -->
|
</el-form-item>
|
<el-form-item label="登录方式">
|
<div style="display: flex;">
|
<div v-for="option in options" :key="option.value" style="margin-right: 15px;">
|
<input type="radio" :id="option.value" :value="option.value" v-model="temp.loginmethod"
|
style="margin-right: 5px;width: 15px;height: 15px;-webkit-appearance: auto;" />
|
<label :for="option.value">{{ option.text }}</label>
|
</div>
|
</div>
|
</el-form-item>
|
</el-form>
|
<div class="text-right">
|
<el-button type="danger" @click="dialogVisible = false">
|
取消
|
</el-button>
|
<el-button type="primary" @click="submit">
|
确定
|
</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import Pagination from '@/components/Pagination'
|
import { getSystemPage, addorupSystem, addSystemOperationLog } from '@/api/settings'
|
import { deepClone } from '@/utils'
|
|
const _temp = {
|
loginmethod: '2',
|
id: '',
|
}
|
|
export default {
|
components: {
|
Pagination
|
},
|
data() {
|
return {
|
value1: true,
|
value2: true,
|
selectedOption: '',
|
options: [
|
{ text: '仅账号', value: '0' },
|
{ text: '仅短信', value: '1' },
|
{ text: '账号+短信', value: '2' },
|
],
|
// radio: '1',
|
uadd: '',
|
udelete: '',
|
uupdate: '',
|
checkList: ['超级管理员'],
|
total: 0,
|
list: [],
|
menus: [],
|
listLoading: true,
|
listQuery: {
|
current: 1,
|
size: 20,
|
keyword: undefined,
|
},
|
uploadUrl: '',
|
temp: Object.assign({}, _temp),
|
dialogVisible: false,
|
dialogType: 'create',
|
loading: false,
|
rules: {
|
loginmethod: [
|
{ required: true, message: '请选择登录方式', trigger: 'change' }
|
],
|
},
|
}
|
},
|
created() {
|
this.fetchData()
|
},
|
methods: {
|
|
refresh() {
|
this.listQuery = {
|
current: 1,
|
size: 20,
|
keyword: undefined
|
}
|
this.fetchData()
|
},
|
// 分页数据
|
fetchData() {
|
this.uadd = localStorage.getItem('uadd') || '';
|
this.udelete = localStorage.getItem('udelete') || '';
|
this.uupdate = localStorage.getItem('uupdate') || '';
|
this.listLoading = true
|
getSystemPage(this.listQuery).then(response => {
|
this.list = response.data.records
|
this.total = response.data.total
|
this.listLoading = false
|
})
|
},
|
resetTemp() {
|
this.temp = Object.assign({}, _temp)
|
},
|
// add() {
|
// this.resetTemp()
|
// this.dialogVisible = true
|
// this.dialogType = 'create'
|
// this.$nextTick(() => {
|
// this.$refs['dataForm'].clearValidate()
|
// })
|
// },
|
edit(scope) {
|
this.resetTemp()
|
this.dialogVisible = true
|
this.dialogType = 'modify'
|
this.temp = deepClone(scope.row)
|
// if (scope.row.isfk != null) {
|
// this.checkList.push("访客")
|
// }
|
// if (scope.row.ispg != null) {
|
// this.checkList.push("普通管理员")
|
// }
|
// this.$nextTick(() => {
|
// this.$refs['dataForm'].clearValidate()
|
// })
|
},
|
changeStatus(value, scope) {
|
setTimeout(() => {
|
this.list[scope.$index].status = value
|
this.$message({
|
message: '更新成功',
|
type: 'success'
|
})
|
}, 300)
|
},
|
submit() {
|
if (this.checkList) {
|
|
}
|
if (this.loading) {
|
return
|
}
|
if (this.value1) {
|
this.temp.dell1='1'
|
}else{
|
this.temp.dell1='0'
|
}
|
if (this.value2) {
|
this.temp.dell24='1'
|
}else{
|
this.temp.dell24='0'
|
}
|
this.loading = true
|
this.$refs[this.temp].validate((valid) => {
|
if (valid) {
|
addorupSystem(this.temp).then(() => {
|
this.temp.adminname = localStorage.getItem('username') || '';
|
const params = { name: this.temp.adminname, content: '修改了一个系统设置，该登录方式为：' + this.temp.loginmethod };
|
addSystemOperationLog(params).then(response => {
|
|
})
|
this.fetchData()
|
setTimeout(() => {
|
this.$message({
|
message: '提交成功',
|
type: 'success'
|
})
|
this.dialogVisible = false
|
this.loading = false
|
}, 300)
|
})
|
} else {
|
this.$message({
|
message: '提交失败，请检查表单必填项是否为空',
|
type: 'error'
|
})
|
console.log('error submit!!');
|
return false;
|
}
|
});
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.el-upload {
|
border: 1px dashed #d9d9d9 !important;
|
border-radius: 6px;
|
cursor: pointer;
|
position: relative;
|
overflow: hidden;
|
|
.el-icon-plus.avatar-uploader-icon {
|
border: 1px dashed #d9d9d9 !important;
|
border-radius: 6px;
|
font-size: 28px;
|
color: #8c939d;
|
width: 128px;
|
height: 128px;
|
line-height: 128px;
|
text-align: center;
|
}
|
}
|
|
.avatar-uploader {
|
height: 128px;
|
|
img {
|
width: 128px;
|
height: 128px;
|
}
|
}
|
</style>
|
