Skip to content

seeta-device / deviceManage

Go to a project
Commit f473041e by 温丽香
Options

总览页面修改

1 parent 75081ef8
Pipeline #4714 passed
in 2 minutes 2 seconds
Inline Side-by-side
Showing with 110 additions and 67 deletions
src/axios.js
...@@ -31,3 +31,6 @@ export const getApp = data => axios(GET, FRONT + APPID + '/query_list', data) ...@@ -31,3 +31,6 @@ export const getApp = data => axios(GET, FRONT + APPID + '/query_list', data)
export const deleteApp = data => axios(GET, FRONT + APPID + '/delete', data) export const deleteApp = data => axios(GET, FRONT + APPID + '/delete', data)
export const setApp = data => axios(GET, FRONT + APPID + '/set', data) export const setApp = data => axios(GET, FRONT + APPID + '/set', data)
export const addApp = data => axios(POST, FRONT + APPID + '/add', data) export const addApp = data => axios(POST, FRONT + APPID + '/add', data)
const ACCOUNt = '/account'
export const getAccount = data => axios(GET, FRONT + ACCOUNt + '/query', data)
src/layouts/components/user-info.vue
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</ul> </ul>
<template v-slot:reference> <template v-slot:reference>
<span class="user-info flex right"> <span class="user-info flex right">
<span v-if="userData.info">{{ userData.info.creater }}</span> <span>{{ name }}</span>
<i class="iconfont icon-mianxingxiala" <i class="iconfont icon-mianxingxiala"
:class="{ :class="{
'expand': showInfo, 'expand': showInfo,
...@@ -32,6 +32,7 @@ import { getUser, removeUser } from '@/utils/user' ...@@ -32,6 +32,7 @@ import { getUser, removeUser } from '@/utils/user'
import { logoutApi } from '@/axios' import { logoutApi } from '@/axios'
import Dialog from '@/helpers/dialog' import Dialog from '@/helpers/dialog'
import seetaPopover from '@/components/seeta-ui/seeta-popover.vue' import seetaPopover from '@/components/seeta-ui/seeta-popover.vue'
import browserStorage from '@/services/local-storage'
@Component({ @Component({
components: { components: {
...@@ -40,7 +41,9 @@ import seetaPopover from '@/components/seeta-ui/seeta-popover.vue' ...@@ -40,7 +41,9 @@ import seetaPopover from '@/components/seeta-ui/seeta-popover.vue'
}) })
export default class userInfo extends Vue { export default class userInfo extends Vue {
showInfo: boolean = false showInfo: boolean = false
get name() {
return browserStorage.getItem('nickname') || browserStorage.getItem('username')
}
get userData() { return getUser() } get userData() { return getUser() }
get shouldConfirmBeforeLeave(): boolean { get shouldConfirmBeforeLeave(): boolean {
......
src/views/Account/index.vue
...@@ -6,11 +6,11 @@ ...@@ -6,11 +6,11 @@
<div class="page-nav"> <div class="page-nav">
<div class="search-fields"> <div class="search-fields">
<span class="fields">用户名：</span> <span class="fields">用户名：</span>
<st-input width="240px" class="align contents" id="align-input" v-model="userName"></st-input> <st-input width="240px" class="align contents" id="align-input" v-model="nickname" @input="getData"></st-input>
<!-- <input type="text" id="raw-input" autocomplete="off" class="align contents" :style="{borderColor: borderColor}" placeholder="请输入" @blur="getData" v-model.trim="deviceName" @keyup.enter="getData" @input="checkSearchContent"> --> <!-- <input type="text" id="raw-input" autocomplete="off" class="align contents" :style="{borderColor: borderColor}" placeholder="请输入" @blur="getData" v-model.trim="deviceName" @keyup.enter="getData" @input="checkSearchContent"> -->
<span class="fields">用户角色：</span> <span class="fields">用户角色：</span>
<st-select <st-select
v-model="userRole" v-model="role"
:options="userRoleOptions" :options="userRoleOptions"
size="small" size="small"
style="width: 240px" style="width: 240px"
...@@ -66,32 +66,30 @@ ...@@ -66,32 +66,30 @@
ref="form" ref="form"
:model="form" :model="form"
:rules="rules"> :rules="rules">
<st-form-item <st-form-item :label="'账号:'" prop="username">
:label="'账号:'">
<st-input v-model="form.username" :disabled="submitType === 'edit'"></st-input> <st-input v-model="form.username" :disabled="submitType === 'edit'"></st-input>
</st-form-item> </st-form-item>
<st-form-item <st-form-item
:label="'角色:'"> :label="'昵称:'" prop="nickname">
<st-input v-model="form.role"></st-input> <st-input v-model="form.nickname"></st-input>
</st-form-item> </st-form-item>
<st-form-item <st-form-item :label="'角色:'" prop="role">
:label="'邮箱:'"> <st-select v-model="form.role" :options="userRoleOptions" clearable>
</st-select>
</st-form-item>
<st-form-item :label="'邮箱:'" prop="email">
<st-input v-model="form.email"></st-input> <st-input v-model="form.email"></st-input>
</st-form-item> </st-form-item>
<st-form-item v-if="submitType === 'create'" <st-form-item v-if="submitType === 'create'" :label="'初始密码:'" prop="passwd">
:label="'初始密码:'">
<st-input v-model="form.passwd" type="password"></st-input> <st-input v-model="form.passwd" type="password"></st-input>
</st-form-item> </st-form-item>
<st-form-item v-if="submitType === 'create'" <st-form-item v-if="submitType === 'create'" :label="'重复密码:'" prop="confirmPwd">
:label="'重复密码:'">
<st-input v-model="form.confirmPwd" type="password"></st-input> <st-input v-model="form.confirmPwd" type="password"></st-input>
</st-form-item> </st-form-item>
<st-form-item v-if="submitType === 'edit'" <st-form-item v-if="submitType === 'edit'" :label="'原密码:'" prop="passwordd">
:label="'原密码:'">
<st-input v-model="form.passwordd" type="password"></st-input> <st-input v-model="form.passwordd" type="password"></st-input>
</st-form-item> </st-form-item>
<st-form-item v-if="submitType === 'edit'" <st-form-item v-if="submitType === 'edit'" :label="'新密码:'" prop="new_passwordd">
:label="'新密码:'">
<st-input v-model="form.new_passwordd" type="password"></st-input> <st-input v-model="form.new_passwordd" type="password"></st-input>
</st-form-item> </st-form-item>
</st-form> </st-form>
...@@ -122,16 +120,16 @@ export default { ...@@ -122,16 +120,16 @@ export default {
} }
return { return {
// 查询字段 // 查询字段
userName: '', nickname: '',
userRole: '', role: '',
created_at: [], created_at: [],
showDialog: false, showDialog: false,
submitType: 'create', submitType: 'create',
form: {}, form: {},
userRoleOptions: [ userRoleOptions: [
{ value: '管理员', label: '管理员' }, { value: 'admin', label: '管理员' },
{ value: '操作员', label: '操作员' }, { value: 'operator', label: '操作员' },
{ value: '观察员', label: '观察员' }, { value: 'watcher', label: '观察员' },
], ],
currentPage: 1, currentPage: 1,
currentSize: 10, currentSize: 10,
...@@ -159,7 +157,9 @@ export default { ...@@ -159,7 +157,9 @@ export default {
}, },
{ {
label: '备注', label: '备注',
render: 'desc' render: () => {
return '-'
}
}, },
{ {
label: '操作', label: '操作',
...@@ -171,7 +171,11 @@ export default { ...@@ -171,7 +171,11 @@ export default {
tokenList: [], tokenList: [],
total: 0, total: 0,
rules: { // 表单校验 rules: { // 表单校验
passwordConfirmation: [ username: [{ required: true, message: '请输入账号', trigger: 'blur' }],
nickname: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
role: [{ required: true, message: '请选择角色', trigger: 'change' }],
passwd: [{ required: true, message: '请输入密码', trigger: 'blur' }],
confirmPwd: [
{ required: true, message: '请确认密码', trigger: 'blur' }, { required: true, message: '请确认密码', trigger: 'blur' },
{ validator: validatePasswordConfirmation, trigger: 'blur' } { validator: validatePasswordConfirmation, trigger: 'blur' }
] ]
...@@ -254,7 +258,7 @@ export default { ...@@ -254,7 +258,7 @@ export default {
}, },
async getData() { async getData() {
this.loadingStatus = true this.loadingStatus = true
const res = await getUsers({ pages: this.currentPage - 1, pagesize: this.currentSize }) const res = await getUsers({ pages: this.currentPage - 1, pagesize: this.currentSize, nickname: this.nickname, role: this.role, begin_date: this.created_at ? this.created_at[0] : '', end_date: this.created_at ? this.created_at[1] : '' })
if (res && res.data && res.data.code === 0) { if (res && res.data && res.data.code === 0) {
this.tokenList = res.data.data.users this.tokenList = res.data.data.users
this.total = res.data.data.total this.total = res.data.data.total
...@@ -276,6 +280,12 @@ export default { ...@@ -276,6 +280,12 @@ export default {
::v-deep.el-form-item__content ::v-deep.el-form-item__content
height: 32px!important height: 32px!important
line-height: 32px!important line-height: 32px!important
::v-deep input
&::placeholder
font-size: 14px
font-family: PingFangSC-Regular, PingFang SC
font-weight: 400
color:#999999
.search-fields .search-fields
::v-deep input ::v-deep input
&::placeholder &::placeholder
......
src/views/DataList/edit.vue
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
<st-button type="primary" @click="addTableData"> <st-button type="primary" @click="addTableData">
<i class="iconfont icon-tianjia"></i><span class="text">{{'插入数据'}}</span></st-button> <i class="iconfont icon-tianjia"></i><span class="text">{{'插入数据'}}</span></st-button>
<div class="search-box"> <div class="search-box">
<el-checkbox v-model="isBase64">Base64</el-checkbox> <!-- <el-checkbox v-model="isBase64">Base64</el-checkbox> -->
<st-select <!-- <st-select
v-model="inputVal" v-model="inputVal"
:options="orderOptions" :options="orderOptions"
size="small" size="small"
...@@ -17,9 +17,9 @@ ...@@ -17,9 +17,9 @@
clearable clearable
placeholder="序号" placeholder="序号"
> >
</st-select> </st-select> -->
<div class="search"> <div class="search">
<input type="text" class="search-input" placeholder="请输入搜索内容" v-model="inputVal"> <input type="text" class="search-input" placeholder="请输入搜索内容" v-model="content" @input="getData">
<i class="el-input__icon el-icon-search"></i> <i class="el-input__icon el-icon-search"></i>
</div> </div>
</div> </div>
...@@ -95,7 +95,7 @@ import { base64ToString, stringToBase64, isASCII } from '@/utils/typeConversion' ...@@ -95,7 +95,7 @@ import { base64ToString, stringToBase64, isASCII } from '@/utils/typeConversion'
export default { export default {
data() { data() {
return { return {
inputVal: '', content: '',
isBase64: false, isBase64: false,
loadingStatus: false, loadingStatus: false,
totalColumns: 0, totalColumns: 0,
...@@ -134,7 +134,7 @@ export default { ...@@ -134,7 +134,7 @@ export default {
methods: { methods: {
async getData() { async getData() {
this.loadingStatus = true this.loadingStatus = true
const res = await getData({ name: this.$route.query.name, pages: this.currentPage - 1, pagesize: this.currentSize }) const res = await getData({ name: this.$route.query.name, pages: this.currentPage - 1, pagesize: this.currentSize, content: this.content })
if (res && res.data && res.data.code === 0) { if (res && res.data && res.data.code === 0) {
this.tableData = res.data.table.data.map(item => { this.tableData = res.data.table.data.map(item => {
item.binary = item.binary.map(base64 => { item.binary = item.binary.map(base64 => {
...@@ -388,6 +388,7 @@ export default { ...@@ -388,6 +388,7 @@ export default {
width: 240px width: 240px
height: 32px height: 32px
position: relative position: relative
margin-left: 10px
.search-input .search-input
width: 100% width: 100%
padding-right: 35px padding-right: 35px
......
src/views/PersonInfo/index.vue
...@@ -29,12 +29,12 @@ ...@@ -29,12 +29,12 @@
<st-form-item <st-form-item
style="margin-bottom:10px" style="margin-bottom:10px"
:label="'账户'+':'"> :label="'账户'+':'">
<span>{{userData.role}}</span> <span>{{userData.username}}</span>
</st-form-item> </st-form-item>
<st-form-item <st-form-item
style="margin-bottom:10px" style="margin-bottom:10px"
:label="'姓名'+':'"> :label="'姓名'+':'">
<span>{{userData.creater}}</span><span class="btn-text" @click="showDialog = true;type = 'name'">编辑</span> <span>{{userData.nickname}}</span><span class="btn-text" @click="showDialog = true;type = 'name';form = JSON.parse(JSON.stringify(userData))">编辑</span>
</st-form-item> </st-form-item>
<st-form-item <st-form-item
style="margin-bottom:10px" style="margin-bottom:10px"
...@@ -63,8 +63,8 @@ ...@@ -63,8 +63,8 @@
<st-form-item v-if="type === 'email'" :label="'邮箱:'" prop="email"> <st-form-item v-if="type === 'email'" :label="'邮箱:'" prop="email">
<st-input v-model="form.email"></st-input> <st-input v-model="form.email"></st-input>
</st-form-item> </st-form-item>
<st-form-item v-if="type === 'name'" :label="'姓名:'" prop="name"> <st-form-item v-if="type === 'name'" :label="'姓名:'" prop="nickname">
<st-input v-model="form.name"></st-input> <st-input v-model="form.nickname"></st-input>
</st-form-item> </st-form-item>
<div v-if="type === 'password'"> <div v-if="type === 'password'">
<st-form-item :label="'当前密码:'" prop="password"> <st-form-item :label="'当前密码:'" prop="password">
...@@ -123,7 +123,7 @@ export default { ...@@ -123,7 +123,7 @@ export default {
newPwd: '', newPwd: '',
confirmPwd: '', confirmPwd: '',
rules: { rules: {
name: [ nickname: [
{ required: true, message: '请输入姓名' } { required: true, message: '请输入姓名' }
], ],
email: [ email: [
...@@ -147,6 +147,8 @@ export default { ...@@ -147,6 +147,8 @@ export default {
}, },
mounted() { mounted() {
this.userData = getUser().info this.userData = getUser().info
this.userData.username = browserStorage.getItem('username')
this.userData.nickname = browserStorage.getItem('nickname')
this.imageList = [{ url: browserStorage.getItem('image') }] this.imageList = [{ url: browserStorage.getItem('image') }]
this.userData.email = browserStorage.getItem('email') this.userData.email = browserStorage.getItem('email')
}, },
...@@ -156,16 +158,21 @@ export default { ...@@ -156,16 +158,21 @@ export default {
if (valid) { if (valid) {
let res = {} let res = {}
switch (this.type) { switch (this.type) {
case 'name': res = await editUser({ username: 'test', new_username: this.form.name, password: this.form.password }) case 'name': res = await editUser({ username: browserStorage.getItem('username'), nickname: this.form.nickname })
if (res && res.data && res.data.code === 0) {
browserStorage.setItem('nickname', this.form.nickname)
this.userData.nickname = browserStorage.getItem('nickname')
Toast.success('操作成功')
}
break break
case 'email': res = await editUser({ username: 'test', email: this.form.email }) case 'email': res = await editUser({ username: browserStorage.getItem('username'), email: this.form.email })
if (res && res.data && res.data.code === 0) { if (res && res.data && res.data.code === 0) {
browserStorage.setItem('email', this.form.email) browserStorage.setItem('email', this.form.email)
this.userData.email = browserStorage.getItem('email') this.userData.email = browserStorage.getItem('email')
Toast.success('操作成功') Toast.success('操作成功')
} }
break break
case 'password': res = await editUser({ username: 'test', password: this.form.password, new_password: this.form.newPwd }) case 'password': res = await editUser({ username: browserStorage.getItem('username'), password: this.form.password, new_password: this.form.newPwd })
if (res && res.data && res.data.code === 0) { if (res && res.data && res.data.code === 0) {
Toast.success('操作成功') Toast.success('操作成功')
} }
...@@ -173,9 +180,9 @@ export default { ...@@ -173,9 +180,9 @@ export default {
default: default:
break break
} }
this.showDialog = false
} }
}) })
this.showDialog = false
}, },
fileToBase64(file) { fileToBase64(file) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
...@@ -198,7 +205,7 @@ export default { ...@@ -198,7 +205,7 @@ export default {
return return
} }
const base64 = await this.fileToBase64(file.raw) const base64 = await this.fileToBase64(file.raw)
const res = await editUser({ username: 'test', image: base64 }) const res = await editUser({ username: browserStorage.getItem('username'), image: base64 })
if (res && res.data && res.data.code === 0) { if (res && res.data && res.data.code === 0) {
browserStorage.setItem('image', base64) browserStorage.setItem('image', base64)
this.imageList[0].url = base64 this.imageList[0].url = base64
...@@ -208,7 +215,7 @@ export default { ...@@ -208,7 +215,7 @@ export default {
}, },
async handleRemove(file, fileList) { async handleRemove(file, fileList) {
this.imageList = [] this.imageList = []
const res = await editUser({ username: 'test', image: '' }) const res = await editUser({ username: browserStorage.getItem('username'), image: '' })
if (res && res.data && res.data.code === 0) { if (res && res.data && res.data.code === 0) {
browserStorage.setItem('image', '') browserStorage.setItem('image', '')
} else { } else {
......
src/views/login.vue
...@@ -295,6 +295,8 @@ export default { ...@@ -295,6 +295,8 @@ export default {
browserStorage.setItem('user', JSON.stringify(res.data)) browserStorage.setItem('user', JSON.stringify(res.data))
browserStorage.setItem('image', res.data.image) browserStorage.setItem('image', res.data.image)
browserStorage.setItem('email', res.data.email) browserStorage.setItem('email', res.data.email)
browserStorage.setItem('nickname', res.data.nickname)
browserStorage.setItem('username', this.userName)
this.$router.push({ path: '/overview' }) this.$router.push({ path: '/overview' })
} else { } else {
Toast.danger(res.data.msg) Toast.danger(res.data.msg)
......
src/views/overview.vue
...@@ -12,40 +12,23 @@ ...@@ -12,40 +12,23 @@
</template> </template>
<script> <script>
import { getApp } from '@/axios' import { getApp, getAccount } from '@/axios'
import * as echarts from 'echarts' import * as echarts from 'echarts'
export default { export default {
data() { data() {
return { return {
applyInfo: {}, applyInfo: {},
option: { devicesInfo: {},
tooltip: { myChart: null,
trigger: 'item' option: {}
},
series: [
{
name: '设备状态',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: true,
labelLine: {
show: true
},
data: [
{ value: 580, name: '在线' },
{ value: 235, name: '离线' },
{ value: 100, name: '异常' },
]
}
]
}
} }
}, },
mounted() { mounted() {
const chartDom = document.getElementById('main') const chartDom = document.getElementById('main')
const myChart = echarts.init(chartDom) this.myChart = echarts.init(chartDom)
myChart.setOption(this.option)
this.getApply() this.getApply()
this.getAccount()
this.repint()
}, },
methods: { methods: {
async getApply() { async getApply() {
...@@ -54,6 +37,40 @@ export default { ...@@ -54,6 +37,40 @@ export default {
this.applyInfo = res.data.data.apps.filter(item => item.ismainapp === 1)[0] this.applyInfo = res.data.data.apps.filter(item => item.ismainapp === 1)[0]
} }
}, },
repint() {
window.onresize = () => {
setTimeout(() => {
this.myChart.resize()
}, 10)
}
},
async getAccount() {
const res = await getAccount()
if (res && res.data && res.data.code === 0) {
this.devicesInfo = res.data
this.myChart.setOption({
tooltip: {
trigger: 'item'
},
series: [
{
name: '设备状态',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: true,
labelLine: {
show: true
},
data: [
{ value: res.data.onlines, name: '在线' },
{ value: res.data.offlines, name: '离线' },
{ value: res.data.exceptions, name: '异常' },
]
}
]
})
}
}
} }
} }
</script> </script>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!