master
zhaowei 3 years ago
parent d025a13da1
commit 27ab84335f

@ -1,6 +1,6 @@
import request from '@/utils/request'
// 查询设备数据
export function listDevice(query) {
export function listMusic(query) {
return request({
url: '/system/device/list',
method: 'get',

@ -5,7 +5,7 @@
</div>
<div class="buttonBox">
<el-button size="mini" type="primary" icon="el-icon-plus" @click="editDevice"></el-button>
<el-button size="mini" icon="el-icon-delete" type="danger" @click="deleteDevice"></el-button>
<!-- <el-button size="mini" icon="el-icon-delete" type="danger" @click="deleteDevice"></el-button> -->
</div>
<div id="deviceBox">
<div class="deviceMsg" v-for="(item, index) in deviceData" :key="index">
@ -91,32 +91,35 @@
</div>
<!-- 新增设备对话框-->
<el-dialog title :visible.sync="addDevice" width="20%" style="top:20vh" center>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form ref="form" :model="form" :rules="rules" label-width="80px" class="el-form3">
<el-row>
<el-col :span="24">
<!-- <el-form-item label="设备编号" prop="deviceId">
<el-input placeholder="请输入设备编号" v-model="form.deviceId" class="el-input3"></el-input>
</el-form-item> -->
<el-form-item label="位置" prop="location">
<el-input placeholder="请输入位置" v-model="form.location"></el-input>
<el-input placeholder="请输入位置" v-model="form.location" class="el-input3"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="IP地址" prop="address">
<el-input placeholder="请输入IP地址" v-model="form.address"></el-input>
<el-form-item label="IP地址" prop="deviceIp">
<el-input placeholder="请输入IP地址" v-model="form.deviceIp" class="el-input3"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="音符" prop="note">
<el-input placeholder="请输入音符" v-model="form.note"></el-input>
<el-input placeholder="请输入音符" v-model="form.note" class="el-input3"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="音量" prop="volume">
<el-input placeholder="请输入音量" v-model="form.volume"></el-input>
<el-input placeholder="请输入音量" v-model="form.volume" class="el-input3"></el-input>
</el-form-item>
</el-col>
</el-row>
@ -133,7 +136,7 @@
<script>
import flexible from "@/layout/flexible.js";
import { listDevice } from "@/api/Device";
import { listMusic } from "@/api/DeviceManage";
export default {
data() {
return {
@ -141,14 +144,19 @@ export default {
queryParams: {
pageNum: 1
},
address: null,
deviceIp: null,
note: null,
volume: null,
location: null,
addDevice: false,
form: {},
forms: {},
form: {
location:null,
deviceIp:null,
note:null,
volume:null,
},
rules: {},
deviceData: []
};
@ -160,7 +168,7 @@ export default {
//
getList() {
this.loading = true;
listDevice(this.queryParams).then(result => {
listMusic(this.queryParams).then(result => {
this.deviceData = result.rows;
this.loading = false;
});
@ -168,13 +176,19 @@ export default {
//
editDevice() {
this.addDevice = true;
// var deviceId =this.form.deviceId;
// var location = this.form.location;
// var deviceIp = this.form.deviceIp;
// var note = this.form.note;
// var volume = this.form.volume;
// this.deviceData.push({deviceId,location,deviceIp,note,volume});
},
//
submitForm() {
this.addDevice = false;
// this.deviceData.push({location});
},
//
deleteDevice() {},
//
removeItem(index, deviceData) {
this.$modal
@ -226,7 +240,6 @@ export default {
display: inline-block;
width: 14px;
height: 14px;
margin-right: -15px;
}
.iconImg {
@ -249,7 +262,7 @@ export default {
.deviceMsg {
margin-left: 0rem;
margin-top: 0rem;
margin-right: 0.125rem;
margin-right: 0.1rem;
margin-bottom: 0.17rem;
width: 79px;
height: 90px;
@ -257,6 +270,7 @@ export default {
position: relative;
border: 1px solid rgba(25, 186, 139, 0.17);
}
/* 滚动条样式 */
::-webkit-scrollbar {
width: 7px;
}
@ -323,4 +337,20 @@ export default {
.deleteImg {
width: 100%;
}
/* 新增对话框样式 */
::v-deep .el-dialog {
background: #111658 !important;
border:1px solid gray;
}
::v-deep .el-dialog__body {
color: white !important;
}
::v-deep .el-form .el-form-item__label{
color:white;
}
::v-deep .el-input3 .el-input__inner{
background-color: #1c257f!important;
border: 1px solid rgba(25, 186, 139, 0.17) !important;
color:white;
}
</style>

@ -2,7 +2,13 @@
<div class="panel bar1">
<div class="titleBg">
<h2>
<el-form :inline="true" :model="queryParams" class="el-form1" ref="queryForm" label-width="1.7rem">
<el-form
:inline="true"
:model="queryParams"
class="el-form1"
ref="queryForm"
label-width="1.7rem"
>
<el-form-item label prop="musicManage">
<el-select
class="selectNav"
@ -21,13 +27,12 @@
/>
</el-select>
</el-form-item>
</el-form>
</h2>
</div>
<!-- 音乐管理表格数据 -->
<div class="musicManagement" v-show="musicShow">
<el-table :data="musicManagementList" style="width: 100%">
<el-table :data="musicManagementList" height="274" style="width: 100%">
<el-table-column prop="location" label="位置" width="140" height="25" align="center"></el-table-column>
<el-table-column prop="deviceIp" label="IP地址" width="130" height="25" align="center"></el-table-column>
<el-table-column prop="status" label="设备状态" height="25" width="80" align="center">
@ -57,6 +62,7 @@
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
@ -78,8 +84,8 @@
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="IP地址" prop="address">
<el-input placeholder="请输入IP地址" v-model="form.address" class="el-input1"></el-input>
<el-form-item label="IP地址" prop="deviceIp">
<el-input placeholder="请输入IP地址" v-model="form.deviceIp" class="el-input1"></el-input>
</el-form-item>
</el-col>
</el-row>
@ -124,7 +130,7 @@
<script>
import User from "@/layout/components/User";
import flexible from "@/layout/flexible.js";
import { listDevice } from "@/api/Device";
import { listMusic } from "@/api/DeviceManage";
export default {
components: {
User
@ -149,16 +155,23 @@ export default {
userShow: false,
//
musicHandle: false,
form:{},
//
form: {
location: null,
deviceIp: null,
note: null,
volume: null
},
rules: {},
//
queryParams: {
pageNum: 1,
pageSize: 6,
pageSize: 10,
note: null,
volume: null
},
//
total: 0,
total: 0
};
},
@ -169,7 +182,7 @@ export default {
//
getList() {
this.loading = true;
listDevice(this.queryParams).then(result => {
listMusic(this.queryParams).then(result => {
this.musicManagementList = result.rows;
this.total = result.total;
this.loading = false;
@ -191,7 +204,18 @@ export default {
this.open = false;
},
//
submitForm() {
submitForm(row) {
var location = this.form.location;
var deviceIp = this.form.deviceIp;
var note = this.form.note;
var volume = this.form.volume;
var musicManagementList = this.musicManagementList;
musicManagementList.location = location;
musicManagementList.address = address;
musicManagementList.note = note;
musicManagementList.volume = volume;
this.musicHandle = false;
},
@ -201,7 +225,6 @@ export default {
.confirm("确认要删除吗")
.then(function() {
musicManagementList.splice(index, 1);
})
.then(() => {
this.$modal.msgSuccess("删除成功");
@ -209,14 +232,27 @@ export default {
.catch(() => {});
},
//
edit() {
edit(row) {
this.musicHandle = true;
// this.form = row;
}
}
};
</script>
<style scoped>
/* 滚动条样式 */
::v-deep ::-webkit-scrollbar {
width: 7px;
}
::v-deep ::-webkit-scrollbar-thumb {
border-radius: 14px;
background: #4a6cd5;
}
::v-deep ::-webkit-scrollbar-track {
border-radius: 0;
background: none;
}
::v-deep .pagination-container .el-select .el-input .el-select__caret {
color: #618dfa !important;
}
@ -228,26 +264,25 @@ export default {
border: none !important;
color: #618dfa !important;
text-align: center !important;
}
.pagination-container[data-v-72233bcd] {
background: #111658;
}
.userManagement {
margin: 0.125rem 0 0.125rem;
}
::v-deep .el-input {
margin-left: 6px !important;
line-height: 0px !important;
}
::v-deep .el-form-item__label {
color: white !important;
}
::v-deep .el-input1 {
background: cornflowerblue!important;
background: #1c257f !important;
border: 1px solid rgba(25, 186, 139, 0.17) !important;
}
::v-deep .el-input__suffix {
right: 0.8rem !important;
}
@ -262,11 +297,12 @@ export default {
text-align: center !important;
letter-spacing: 4px !important;
}
::v-deep .el-input1 input::-webkit-input-placeholder {
color: gray !important ;
}
::v-deep .el-form1 input::-webkit-input-placeholder {
color: white !important ;
}
::v-deep .el-dialog {
background: #111658 !important;
border: 1px solid gray;

@ -1,12 +1,12 @@
<template>
<div class="navbar">
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
<!-- <div class="navbar"> -->
<!-- <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>
<top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/>
<top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/> -->
<div class="right-menu">
<template v-if="device!=='mobile'">
<!-- <template v-if="device!=='mobile'">
<search id="header-search" class="right-menu-item" />
<el-tooltip content="源码地址" effect="dark" placement="bottom">
@ -17,13 +17,14 @@
<ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
</el-tooltip>
<screenfull id="screenfull" class="right-menu-item hover-effect" />
<el-tooltip content="布局大小" effect="dark" placement="bottom">
<size-select id="size-select" class="right-menu-item hover-effect" />
</el-tooltip>
</template>
</template> -->
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
<div class="avatar-wrapper">
@ -31,19 +32,22 @@
<i class="el-icon-caret-bottom" />
</div>
<el-dropdown-menu slot="dropdown">
<router-link to="/user/profile">
<!-- <router-link to="/user/profile"> -->
<div @click="userCenter">
<el-dropdown-item>个人中心</el-dropdown-item>
</router-link>
<el-dropdown-item @click.native="setting = true">
</div>
<!-- </router-link> -->
<!-- <el-dropdown-item @click.native="setting = true">
<span>布局设置</span>
</el-dropdown-item>
</el-dropdown-item> -->
<el-dropdown-item divided @click.native="logout">
<span>退出登录</span>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
<!-- </div> -->
</template>
<script>
@ -92,6 +96,9 @@ export default {
}
},
methods: {
userCenter(){
this.$router.push("/user/profile");
},
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
@ -111,12 +118,12 @@ export default {
</script>
<style lang="scss" scoped>
.navbar {
height: 50px;
overflow: hidden;
position: relative;
background: #fff;
box-shadow: 0 1px 4px rgba(0,21,41,.08);
// .navbar {
// height: 50px;
// overflow: hidden;
// position: relative;
// background: #fff;
// box-shadow: 0 1px 4px rgba(0,21,41,.08);
.hamburger-container {
line-height: 46px;
@ -146,8 +153,11 @@ export default {
}
.right-menu {
float: right;
height: 100%;
// float: right;
position: absolute;
top:10px;
right:10px;
height: 60px;
line-height: 50px;
&:focus {
@ -196,5 +206,5 @@ export default {
}
}
}
}
// }
</style>

@ -7,7 +7,7 @@
v-model="queryParams.roleType"
placeholder="角色类型"
clearable
size="middle"
size="mini"
style="width: 200px"
>
<el-option
@ -20,7 +20,7 @@
</el-select>
</el-form-item>
<el-form-item label="姓名" prop="roleName">
<el-input v-model="queryParams.roleName" placeholder class="input2"></el-input>
<el-input v-model="queryParams.roleName" placeholder class="input2" size="mini"></el-input>
</el-form-item>
<el-button
@ -44,7 +44,7 @@
<el-table-column prop="number" type="index" label="序号" align="center"></el-table-column>
<el-table-column prop="roleName" label="用户姓名" align="center"></el-table-column>
<el-table-column prop="roleType" label="角色" align="center"></el-table-column>
<el-table-column prop="roleStatus" type="用户状态" label="序号" align="center"></el-table-column>
<el-table-column prop="roleStatus" type="用户状态" width="100" label="序号" align="center"></el-table-column>
<el-table-column prop="createBy" label="创建时间" align="center"></el-table-column>
<el-table-column prop="action" label="操作" width="250" align="center">
<template slot-scope="scope">
@ -55,6 +55,47 @@
</el-table-column>
</el-table>
</div>
<!-- 新增用户对话框 -->
<el-dialog title :visible.sync="roleHandle" width="20%" style="top:20vh" center>
<el-form ref="roleForm" :model="roleForm" label-width="80px">
<el-row>
<el-col :span="24">
<el-form-item label="姓名" prop="roleName">
<el-input placeholder="" v-model="roleForm.roleName" class="el-input1" size="mini"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="角色" prop="roleType">
<el-select
class="input2"
v-model="roleForm.roleType"
placeholder="角色类型"
clearable
size="mini"
style="width: 200px"
>
<el-option
class="option1"
v-for="dict in roleTypeArr"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="roleHandle = false"> </el-button>
<el-button type="primary" @click="submitForm"> </el-button>
</span>
</el-dialog>
</div>
</template>
<style scoped>
@ -63,12 +104,12 @@
}
.addButton {
display: block;
margin-top: -10px;
margin-top: -5px;
margin-left: 0px;
}
.searchButton {
margin-top: 5px;
margin-left: 20px;
margin-left: 25px;
}
.userBox {
width: 100%;
@ -88,22 +129,29 @@
border: 1px solid rgba(25, 186, 139, 0.17) !important;
color: white !important;
text-align: left !important;
letter-spacing: 2px !important;
letter-spacing: 0px !important;
}
::v-deep .el-input--middle {
::v-deep .input2 .el-input--mini {
font-size: 14px !important;
color: gray !important;
}
</style>
<script>
import flexible from "@/layout/flexible.js";
export default {
data() {
return {
//
queryParams: {
roleType: null,
roleName: null
roleName: null,
},
roleHandle:false,
roleForm:{
roleName:null,
roleType:null,
},
roleList: [
{
@ -133,8 +181,9 @@ export default {
{
value: 2,
label: "操作员"
}
]
},
],
};
},
@ -150,7 +199,13 @@ export default {
//
resetQuery() {},
//
editRole() {}
editRole() {
this.roleHandle=true;
},
//
submitForm(){
this.roleHandle=false;
},
}
};
</script>

@ -1,11 +1,12 @@
<template>
<div class="app-container home">
<div class="app-content home">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<header>
<h1>陵川电子音乐公路管理系统</h1>
<navbar />
</header>
<div class="mainbox">
<div class="row1">
@ -28,6 +29,7 @@ import {
TrackManagement,
MusicManage,
Device,
Navbar,
} from "./components";
import flexible from "@/layout/flexible.js";
@ -39,6 +41,7 @@ export default {
TrackManagement,
MusicManage,
Device,
Navbar,
},
methods: {},
@ -61,7 +64,7 @@ li {
font-family: electronicFont;
src: url(../DS-DIGIT.TTF);
}
.app-container {
.app-content {
font-family: Arial, Helvetica, sans-serif;
width: 100%;
height: 100%;
@ -214,6 +217,8 @@ header h1 {
.mainbox {
min-width: 1024px;
max-width: 1920px;
width:100%;
padding: 0.125rem 0.125rem 0;
}
.mainbox .row1 {

@ -67,7 +67,7 @@ export const constantRoutes = [
redirect: 'index',
children: [
{
path: 'index',
path: '/index',
component: () => import('@/views/index'),
name: 'Index',
meta: { title: '首页', icon: 'dashboard', affix:true }

@ -42,15 +42,16 @@
</div>
</el-form-item>
<el-checkbox class="el-checkbox-label" v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px; color:grey; "></el-checkbox>
<el-form-item style="width:100%;">
<el-form-item class="formItem1" style="width:100%;">
<el-button
class="loginButton"
:loading="loading"
size="medium"
type="goon"
style="width:100%;"
@click.native.prevent="handleLogin"
>
<span v-if="!loading" style="font-size:18px"> </span>
<span v-if="!loading" style="font-size:18px" class="loginSpan"> </span>
<span v-else style="font-size:18px"> ...</span>
</el-button>
<div style="float: right;" v-if="register">
@ -159,6 +160,15 @@ export default {
};
</script>
<style rel="stylesheet/scss" lang="scss">
// .loginSpan{
// background: url(../assets/images/.png) no-repeat center;
// }
.el-button.is-loading:before{
background: transparent;
}
.formItem1{
background: url(../assets/images/矩形.png) no-repeat center;
}
textarea::-webkit-input-placeholder {
color: white ;
}
@ -172,19 +182,22 @@ textarea::-webkit-input-placeholder {
}
.el-button--goon.is-active,
.el-button--goon:active {
background: rgba(68,80,204,);
// background: rgba(68,80,204,);
background: transparent;
border:none;
color: white;
}
.el-button--goon:focus,
.el-button--goon:hover {
background: rgba(68,80,204,);
// background: rgba(68,80,204,);
background: transparent;
// border-color: rgba(68,80,204,);
border:none;
color: white;
}
.el-button--goon {
background: rgba(68,80,204,);
// background: rgba(68,80,204,);
background: transparent;
// border-color: rgba(68,80,204,);
border:none;
color: white;
@ -252,7 +265,7 @@ textarea::-webkit-input-placeholder {
.login-tip {
font-size: 13px;
text-align: center;
color: #bfbfbf;
// color: #bfbfbf;
}
.login-code {
width: 33%;

@ -1,5 +1,5 @@
<template>
<div class="app-container">
<div class="mainbox">
<el-row :gutter="20">
<el-col :span="6" :xs="24">
<el-card class="box-card">
@ -89,3 +89,9 @@ export default {
}
};
</script>
<style scoped>
.mainbox{
width:100%;
height:100%;
}
</style>

Loading…
Cancel
Save