huoran
/
FE_huoran_data
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

fix

Browse Source
ui1
yujialong 3 years ago
parent f977c533b7
commit 559a5d9382
16 changed files with 268 additions and 181 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. BIN
      src/assets/img/school.png
  2. 12
      src/layouts/footer/index.vue
  3. 83
      src/layouts/header/index.vue
  4. 25
      src/layouts/home/index.vue
  5. 17
      src/layouts/navbar/index.vue
  6. 38
      src/pages/account/login/index.vue
  7. 108
      src/pages/data/list/index.vue
  8. 17
      src/pages/index/list/index.vue
  9. 41
      src/pages/setting/person/index.vue
  10. 4
      src/pages/setting/person/info.vue
  11. 51
      src/pages/stat/list/index.vue
  12. 44
      src/pages/user/list/index.vue
  13. 2
      src/setting.js
  14. 2
      src/styles/layout/index.scss
  15. 3
      src/styles/var.scss
  16. 2
      vue.config.js

BIN
src/assets/img/school.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.7 KiB

12
src/layouts/footer/index.vue
Unescape View File

@ -1,6 +1,8 @@
<template> <template>
<div> <div>
<div class="copyright"></div> <div class="copyright">
<a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">粤ICP备20072679号</a>
</div>
</div> </div>
</template> </template>
<script> <script>
@ -24,5 +26,13 @@ export default {
color: rgba(0, 0, 0, 0.45); color: rgba(0, 0, 0, 0.45);
font-size: 12px; font-size: 12px;
text-align: center; text-align: center;
background-color: #333;
a{
color:#fff;
font-size: 12px;
&:hover{
opacity: .8;
}
}
} }
</style> </style>

83
src/layouts/header/index.vue
Unescape View File

@ -1,9 +1,13 @@
<template> <template>
<div class="header"> <div class="header">
<a class="logo" @click="toIndex"> <a class="logo" @click="toIndex">
<img width="180" v-if="isLogin || (isManager && showSetting) || !isUser" src="@/assets/img/logo.png" alt=""> <!-- <img width="180" v-if="isLogin || (isManager && showSetting) || !isUser" src="@/assets/img/logo.png" alt=""> -->
<span v-if="token && isManager && !showSetting">{{schoolName}}</span> <span v-if="token && isManager && !showSetting">{{schoolName}}</span>
</a> </a>
<div class="search" v-if="isData">
<input v-model="keyword" type="text" placeholder="请输入数据表名称">
<img src="../../assets/img/search.png" alt="" class="search-icon">
</div>
<div class="inner"> <div class="inner">
<div style="height: 80px;"></div> <div style="height: 80px;"></div>
<navbar ref="nav"></navbar> <navbar ref="nav"></navbar>
@ -25,17 +29,14 @@
</el-dropdown> </el-dropdown>
</div> </div>
<div v-else-if="!isLogin"> <div v-else-if="!isLogin">
<div class="login" @click="toLogin"> <router-link class="login" to="/login" target="_blank">
<img src="@/assets/img/user.png" alt=""> <img src="@/assets/img/user.png" alt="">
<span>登录</span> <span>登录</span>
</div> </router-link>
</div>
<div v-else>
<img class="search" src="../../assets/img/search.png" alt="" @click="toSearch">
</div> </div>
</div> </div>
<el-dialog title="修改密码" :visible.sync="passwordVisible" :close-on-click-modal="false" @close="closePassword" width="30%"> <el-dialog title="修改密码" :visible.sync="passwordVisible" :close-on-click-modal="false" :append-to-body="true" @close="closePassword" width="30%">
<el-form ref="passwordForm" label-width="82px"> <el-form ref="passwordForm" label-width="82px">
<el-form-item label="原密码"> <el-form-item label="原密码">
<el-input type="password" v-model="passwordForm.password" placeholder="请输入原密码"></el-input> <el-input type="password" v-model="passwordForm.password" placeholder="请输入原密码"></el-input>
@ -59,12 +60,17 @@ import navbar from '../navbar'
import { mapState,mapActions } from 'vuex' import { mapState,mapActions } from 'vuex'
import Setting from '@/setting' import Setting from '@/setting'
import util from '@/libs/util' import util from '@/libs/util'
import bus from '@/libs/bus'
export default { export default {
data() { data() {
return { return {
token: util.local.get(Setting.tokenKey), token: util.local.get(Setting.tokenKey),
isLogin: this.$route.path == '/login', isLogin: this.$route.path == '/login',
isData: this.$route.path == '/data/list',
customer: this.$route.query.customer, customer: this.$route.query.customer,
rendered: false,
keyword: '',
searchTimer: null,
userName: '', userName: '',
isUser: false, isUser: false,
showSetting: true, showSetting: true,
@ -87,6 +93,25 @@ export default {
'routes' 'routes'
]) ])
}, },
watch: {
keyword: function(val) {
clearTimeout(this.searchTimer)
if(!this.rendered){
this.searchTimer = setTimeout(() => {
bus.$emit('initData',this.keyword)
},500)
}
this.rendered = false
},
'$route'(to,from) {
let isData = this.$route.path == '/data/list'
if(isData){
this.rendered = true
this.keyword = ''
}
this.isData = isData
}
},
mounted(){ mounted(){
if(this.customer){ if(this.customer){
let customer = atob(decodeURI(this.customer)) == 'false' ? false : true let customer = atob(decodeURI(this.customer)) == 'false' ? false : true
@ -193,14 +218,20 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.header{ .header{
position: relative; z-index: 10;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 80px; height: 80px;
background-color: #fff; background-color: #fff;
.inner{ .inner{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
width: $inner-width; max-width: $max-width;
min-width: $min-width;
padding: 0 10px;
margin: 0 auto; margin: 0 auto;
} }
.logo{ .logo{
@ -214,7 +245,39 @@ export default {
} }
.search{ .search{
cursor: pointer; z-index: 2;
position: absolute;
top: 0;
left: 70%;
transform: translate(-50%);
display: flex;
justify-content: space-between;
align-items: center;
width: 300px;
height: 80px;
padding: 7px 20px;
margin: 0 auto;
background-color: #fff;
input{
width: 195px;
margin-left: 10px;
font-size: 14px;
color: #333;
background-color: transparent;
border: 0;
&::-webkit-input-placeholder{color: #999}
&::-moz-placeholder{color: #999}
&:-moz-placeholder{color: #999}
&:focus{
outline: none;
}
}
.remove{
cursor: pointer;
}
.search-icon{
width: 18px;
}
} }
.action{ .action{
display: inline-flex; display: inline-flex;

25
src/layouts/home/index.vue
Unescape View File

@ -9,7 +9,7 @@
</keep-alive> </keep-alive>
</transition> </transition>
<el-backtop target=".content"></el-backtop> <el-backtop target=".content"></el-backtop>
<!-- <v-footer ref="footer"></v-footer> --> <v-footer class="footer"></v-footer>
</div> </div>
</div> </div>
</div> </div>
@ -24,7 +24,6 @@ export default {
data() { data() {
return { return {
tagsList: [], tagsList: [],
collapse: false,
hideNavList: Setting.layout.hideNavList hideNavList: Setting.layout.hideNavList
}; };
}, },
@ -40,18 +39,7 @@ export default {
} }
}, },
created() { created() {
bus.$on('collapse-content', msg => {
this.collapse = msg;
});
// 只有在标签页列表里的页面才使用keep-alive，即关闭标签之后就不保存到内存中了。
bus.$on('tags', msg => {
let arr = [];
for (let i = 0, len = msg.length; i < len; i++) {
msg[i].name && arr.push(msg[i].name)
}
this.tagsList = arr
});
} }
}; };
</script> </script>
@ -59,9 +47,14 @@ export default {
.main{ .main{
min-height: 100%; min-height: 100%;
background: url(../../assets/img/login-bg.png) 0 0/100% 100% no-repeat; background: url(../../assets/img/login-bg.png) 0 0/100% 100% no-repeat;
.layout{
margin-top: 80px;
}
.view{ .view{
width: $inner-width; max-width: $max-width;
padding: 20px 0; min-width: $min-width;
min-height: calc(100vh - 56px);
padding: 20px;
margin: 0 auto; margin: 0 auto;
} }
} }

17
src/layouts/navbar/index.vue
Unescape View File

@ -17,14 +17,16 @@ export default {
managerStr: this.$route.query.mg, managerStr: this.$route.query.mg,
isManager: false, isManager: false,
active: this.$route.path, active: this.$route.path,
defaultMenus: [{ defaultMenus: [],
// 前台菜单
dataMenu: [{
index: '/index/list', index: '/index/list',
title: '首页' title: '首页'
}], },{
dataMenu: [{
index: '/data/list', index: '/data/list',
title: '数据' title: '数据'
}], }],
// 后台菜单（下面要根据获取到的该角色拥有的权限来显示哪些菜单）
managerMenus: [ managerMenus: [
{ {
index: '/stat/list', index: '/stat/list',
@ -56,7 +58,7 @@ export default {
} }
}, },
mounted() { mounted() {
if(util.local.get(Setting.tokenKey)){ if(util.local.get(Setting.tokenKey)){// 如果是登录状态
this.getPer() this.getPer()
if(this.managerStr && atob(decodeURI(this.managerStr)) === 'true'){ if(this.managerStr && atob(decodeURI(this.managerStr)) === 'true'){
this.isManager = true this.isManager = true
@ -71,7 +73,7 @@ export default {
'setManager' 'setManager'
]), ]),
initMenu(){ initMenu(){
if(this.isManager){ if(this.isManager){// 该值为true，则表示当前是在后台（是否是后台是通过url上面的managerStr来判断的）
this.defaultMenus = this.managerMenus this.defaultMenus = this.managerMenus
if(Setting.dynamicRoute){ if(Setting.dynamicRoute){
let routes = this.routes let routes = this.routes
@ -91,6 +93,7 @@ export default {
this.active = item.index this.active = item.index
this.$router.push(item.index).catch(err => {}) this.$router.push(item.index).catch(err => {})
}, },
// 获取权限列表
getPer(){ getPer(){
this.$post(this.api.getPermissions).then(res => { this.$post(this.api.getPermissions).then(res => {
let routes = res.permissions[0].children let routes = res.permissions[0].children
@ -111,10 +114,10 @@ export default {
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
display: flex; display: flex;
padding-bottom: 10px;
li{ li{
padding: 25px; padding: 0 25px;
font-size: 16px; font-size: 16px;
line-height: 80px;
color: #0d0d0d; color: #0d0d0d;
cursor: pointer; cursor: pointer;
&.active{ &.active{

38
src/pages/account/login/index.vue
Unescape View File

@ -1,11 +1,6 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<vHead></vHead>
<div class="login"> <div class="login">
<div class="names">
<img class="logo" src="../../../assets/img/three.png" alt="">
<p class="text">或然数据平台</p>
</div>
<div class="form"> <div class="form">
<ul class="tab"> <ul class="tab">
<li v-for="(item,index) in tabList" :key="index" :class="{active: form.distinguish == item.id}" @click="typeClick(item)">{{item.label}}</li> <li v-for="(item,index) in tabList" :key="index" :class="{active: form.distinguish == item.id}" @click="typeClick(item)">{{item.label}}</li>
@ -32,7 +27,7 @@
<el-dialog title="绑定手机号" :visible.sync="phoneVisible" :close-on-click-modal="false" @close="closePhone" width="30%"> <el-dialog title="绑定手机号" :visible.sync="phoneVisible" :close-on-click-modal="false" @close="closePhone" width="30%">
<el-form ref="form" label-width="60px"> <el-form ref="form" label-width="60px">
<el-form-item label="手机号"> <el-form-item label="手机号">
<el-input placeholder="请输入手机号" v-model="phone" maxlength="11"></el-input> <el-input style="width: 394px;" placeholder="请输入手机号" v-model="phone" maxlength="11"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="验证码"> <el-form-item label="验证码">
<div class="flex"> <div class="flex">
@ -46,6 +41,8 @@
<el-button size="small" type="primary" @click="phoneSubmit">确 定</el-button> <el-button size="small" type="primary" @click="phoneSubmit">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<v-footer class="footer"></v-footer>
</div> </div>
</template> </template>
@ -54,6 +51,7 @@ import { mapActions } from 'vuex'
import vHead from '@/layouts/header' import vHead from '@/layouts/header'
import util from '@/libs/util' import util from '@/libs/util'
import Setting from '@/setting' import Setting from '@/setting'
import vFooter from '@/layouts/footer'
export default { export default {
data: function() { data: function() {
return { return {
@ -87,7 +85,7 @@ export default {
phoneBtnText: '发送验证码' phoneBtnText: '发送验证码'
}; };
}, },
components: {vHead}, components: {vHead,vFooter},
mounted(){ mounted(){
this.getVerImg() this.getVerImg()
}, },
@ -203,28 +201,19 @@ export default {
overflow: hidden; overflow: hidden;
.login{ .login{
width: 500px; width: 600px;
margin: 0 auto; margin: 200px auto;
text-align: center; text-align: center;
.names{
margin: 70px 0;
.text{
margin-top: 10px;
font-size: 20px;
color: #fff;
}
}
.form{ .form{
padding: 30px; padding: 40px 40px 50px;
margin-top: 30px;
border-radius: 10px; border-radius: 10px;
background-color: #fff; background-color: #fff;
.tab{ .tab{
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin-bottom: 30px; margin-bottom: 60px;
border-bottom: 2px solid #e0e0e0; border-bottom: 2px solid #e0e0e0;
li{ li{
padding: 9px 20px; padding: 9px 20px;
@ -254,7 +243,7 @@ export default {
border-radius: 0 !important; border-radius: 0 !important;
} }
.account,.password,.code{ .account,.password,.code{
z-index: 10; z-index: 1;
position: absolute; position: absolute;
top: 11px; top: 11px;
left: 8px; left: 8px;
@ -296,5 +285,12 @@ export default {
} }
} }
} }
.footer{
z-index: 3;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
}
} }
</style> </style>

108
src/pages/data/list/index.vue
Unescape View File

@ -1,11 +1,5 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<div class="search">
<!-- <img src="../../../assets/img/remove-black.png" alt="" class="remove" @click="keyword = ''"> -->
<input v-model="keyword" type="text" placeholder="请输入数据表名称">
<img src="../../../assets/img/search.png" alt="" class="search-icon">
</div>
<div class="left"> <div class="left">
<el-menu class="menu" ref="type" @open="openType" @select="selectType" unique-opened :default-active="defaultType" :default-openeds="defaultOpenType"> <el-menu class="menu" ref="type" @open="openType" @select="selectType" unique-opened :default-active="defaultType" :default-openeds="defaultOpenType">
<template v-for="item in typeList"> <template v-for="item in typeList">
@ -81,14 +75,19 @@
<el-table :data="listData" class="table" ref="table" stripe header-align="center" row-key="id" highlight-current-row @current-change="previewCurrentChange"> <el-table :data="listData" class="table" ref="table" stripe header-align="center" row-key="id" highlight-current-row @current-change="previewCurrentChange">
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column> <el-table-column type="index" width="100" label="序号" align="center"></el-table-column>
<el-table-column prop="showName" label="数据表名称" align="center"></el-table-column> <el-table-column prop="showName" label="数据表名称" align="center"></el-table-column>
<el-table-column prop="dataTotal" label="数据总量" align="center"></el-table-column> <el-table-column prop="dataTotal" label="数据总量" width="90" align="center"></el-table-column>
<el-table-column prop="dataSize" label="数据大小" align="center"> <el-table-column label="起止时间" width="190" align="center">
<template slot-scope="scope">
{{scope.row.startTime}}-{{scope.row.endTime}}
</template>
</el-table-column>
<el-table-column prop="dataSize" label="数据大小" width="110" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.dataSize}}M {{scope.row.dataSize}}M
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="updateTime" label="更新时间" align="center"></el-table-column> <el-table-column prop="updateTime" label="更新时间" width="150" align="center"></el-table-column>
<el-table-column label="操作" width="220" align="center"> <el-table-column label="操作" width="120" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="text" @click="preview(scope.row)">预览</el-button> <el-button type="text" @click="preview(scope.row)">预览</el-button>
<el-button type="text" @click="download(scope.row)">下载</el-button> <el-button type="text" @click="download(scope.row)">下载</el-button>
@ -148,6 +147,7 @@ import { mapState } from 'vuex'
import axios from 'axios' import axios from 'axios'
import util from '@/libs/util' import util from '@/libs/util'
import Setting from '@/setting' import Setting from '@/setting'
import bus from '@/libs/bus'
let startTimeLimit = '' let startTimeLimit = ''
let endTimeLimit = '' let endTimeLimit = ''
@ -156,13 +156,12 @@ export default {
return { return {
that: this, that: this,
token: util.local.get(Setting.tokenKey), token: util.local.get(Setting.tokenKey),
keyword: '',
searchTimer: null,
typeId: this.$route.query.typeId, typeId: this.$route.query.typeId,
typeList: [], typeList: [],
defaultType: '', defaultType: '',
defaultOpenType: [], defaultOpenType: [],
introduce: '', introduce: '',
keyword: '',
listData: [], listData: [],
listDataAll: [], listDataAll: [],
searchListData: [], searchListData: [],
@ -215,15 +214,12 @@ export default {
'schoolId' 'schoolId'
]), ]),
}, },
watch: {
keyword: function(val) {
clearTimeout(this.searchTimer)
this.searchTimer = setTimeout(() => {
this.initData()
},500)
}
},
mounted() { mounted() {
bus.$on('initData',keyword => {
this.keyword = keyword
this.initData()
})
this.getType() this.getType()
if(this.$route.query.download){ if(this.$route.query.download){
this.download({ this.download({
@ -290,6 +286,7 @@ export default {
this.$post(`${this.api.getIdQueryTable}?categoryId=${this.defaultType}&showName=${this.keyword}&pageNum=${this.page}&pageSize=${this.pageSize}&updateTime=`).then(res => { this.$post(`${this.api.getIdQueryTable}?categoryId=${this.defaultType}&showName=${this.keyword}&pageNum=${this.page}&pageSize=${this.pageSize}&updateTime=`).then(res => {
this.listData = res.pageList.records this.listData = res.pageList.records
this.total = res.pageList.total this.total = res.pageList.total
this.listData.length && this.preview(this.listData[0],1)
}).catch(res => {}) }).catch(res => {})
}, },
initData(){ initData(){
@ -326,25 +323,30 @@ export default {
this.previewData = [] this.previewData = []
this.initData() this.initData()
}, },
findId(data,id){
let result = ''
data.forEach(n => {
if(n.id == id){
if(n.children[0].children.length){
return result = n.children[0].children[0].id
}else{
return result = n.children[0].id
}
}else{
this.findId(n.children,id)
}
})
return result
},
openType(index,indexPath){ openType(index,indexPath){
let typeList = this.typeList console.log(11,this.typeList)
let firstChild = typeList.find(n => n.id == index) let id = this.findId(this.typeList,index)
let id = ''
if(firstChild){
id = firstChild.children[0].id
}else{
typeList.map(n => {
n.children.map(n => {
if(n.id == index) id = n.children[0].id
})
})
}
this.selectType(id,indexPath) this.selectType(id,indexPath)
}, },
previewCurrentChange(val){ previewCurrentChange(val){
this.currentRow = val this.currentRow = val
}, },
preview(row){ preview(row,isDefault){
this.$get(`${this.api.previewData}?tableName=${row.name}&tableId=${row.id}`).then(res => { this.$get(`${this.api.previewData}?tableName=${row.name}&tableId=${row.id}`).then(res => {
this.$post(this.api.saveRecord,{ this.$post(this.api.saveRecord,{
tableId: row.id, tableId: row.id,
@ -365,7 +367,7 @@ export default {
} }
}) })
this.previewData = data this.previewData = data
this.$nextTick(() => { isDefault || this.$nextTick(() => {
document.querySelector('#previewTable').scrollIntoView() document.querySelector('#previewTable').scrollIntoView()
}) })
@ -492,41 +494,6 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.wrap{ .wrap{
display: flex; display: flex;
.search{
z-index: 2;
position: absolute;
top: 0;
left: 70%;
transform: translate(-50%);
display: flex;
justify-content: space-between;
align-items: center;
width: 300px;
height: 80px;
padding: 7px 20px;
margin: 0 auto;
background-color: #fff;
input{
width: 195px;
margin-left: 10px;
font-size: 14px;
color: #333;
background-color: transparent;
border: 0;
&::-webkit-input-placeholder{color: #999}
&::-moz-placeholder{color: #999}
&:-moz-placeholder{color: #999}
&:focus{
outline: none;
}
}
.remove{
cursor: pointer;
}
.search-icon{
width: 18px;
}
}
/deep/.left{ /deep/.left{
margin-right: 20px; margin-right: 20px;
@ -547,6 +514,9 @@ export default {
.el-submenu.is-active{ .el-submenu.is-active{
.el-submenu__title{ .el-submenu__title{
background-color: rgba(147,184,255,.3); background-color: rgba(147,184,255,.3);
&+.el-menu .el-submenu__title{
background-color: rgba(147,184,255,.15);
}
} }
} }
.el-menu-item.is-active{ .el-menu-item.is-active{

17
src/pages/index/list/index.vue
Unescape View File

@ -1,7 +1,7 @@
<template> <template>
<div class="wrap" :class="{result: keyword}"> <div class="wrap" :class="{result: keyword}">
<hr class="shadow" v-if="keyword"> <hr class="shadow" v-if="keyword">
<div class="title" v-if="!keyword">欢迎来到<br>或然数据平台</div> <div class="title" v-if="!keyword">准确，多元，海量数据</div>
<div class="search-wrap"> <div class="search-wrap">
<div class="search"> <div class="search">
<div class="icon-wrap"> <div class="icon-wrap">
@ -119,17 +119,20 @@ export default {
this.$router.push(`/data?download=true&id=${row.id}&name=${row.name}&showName=${row.showName}`) this.$router.push(`/data?download=true&id=${row.id}&name=${row.name}&showName=${row.showName}`)
}).catch(res => {}) }).catch(res => {})
}else{ }else{
this.$router.push('/login') let route = this.$router.resolve({
path: '/login'
})
window.open(route.href)
} }
}, },
toData(row){ toData(row){
if(this.token){ if(this.token){
this.$router.push(`/data?typeId=${row.categoryTwoId}`) this.$router.push(`/data?typeId=${row.categoryTwoId}`)
}else{ }else{
util.errorMsg('请先登录！') let route = this.$router.resolve({
setTimeout(() => { path: '/login'
this.$router.push('/login') })
},1500) window.open(route.href)
} }
} }
} }
@ -140,7 +143,7 @@ export default {
.wrap{ .wrap{
position: relative; position: relative;
.title{ .title{
margin: 70px 0 130px; margin: 70px 0 90px;
font-size: 50px; font-size: 50px;
color: #fff; color: #fff;
text-align: center; text-align: center;

41
src/pages/setting/person/index.vue
Unescape View File

@ -10,16 +10,13 @@
</el-upload> </el-upload>
</div> </div>
<el-menu class="menu" :default-active="active" @select="handleSelect"> <ul class="menu">
<el-menu-item v-for="item in typeList" :index="item.index" :key="item.index"> <li v-for="item in typeList" :key="item.index" :class="{active: item.index == active}" @click="selectType(item.index)">{{ item.title }}</li>
<i :class="item.icon"></i> </ul>
<span slot="title">{{ item.title }}</span>
</el-menu-item>
</el-menu>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
<info v-if="active == 1" @updateStatus="updateStatus"></info> <info ref="info" v-if="active == 1" @updateStatus="updateStatus"></info>
<download v-else></download> <download v-else></download>
</div> </div>
</div> </div>
@ -57,10 +54,11 @@ export default {
}, },
beforeRouteLeave(to, from, next) { beforeRouteLeave(to, from, next) {
if(this.edited){ if(this.edited){
this.$confirm(`您修改的信息还没有保存，是否确认离开？`, '提示', { this.$confirm(`您所更改的内容未更新，是否更新？`, '提示', {
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
next() this.$refs.info.save()
next(false)
}).catch(() => { }).catch(() => {
next(false) next(false)
}) })
@ -78,13 +76,17 @@ export default {
changeAvatar(res) { changeAvatar(res) {
this.setAvatar(res.message) this.setAvatar(res.message)
}, },
handleSelect(key, keyPath){ selectType(key){
if(key == 2 && this.edited){ if(key == 2 && this.edited){
this.$confirm(`您修改的信息还没有保存，是否确认离开？`, '提示', { this.$confirm(`您所更改的内容未更新，是否更新？`, '提示', {
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
this.active = key this.$refs.info.save()
}).catch(() => {}) this.active = '1'
}).catch(() => {
this.active = '1'
this.$forceUpdate()
})
}else{ }else{
this.active = key this.active = key
} }
@ -113,9 +115,16 @@ export default {
border-radius: 50%; border-radius: 50%;
} }
.menu{ .menu{
.el-menu-item.is-active{ li{
color: #fff; padding: 0 20px;
background-color: $main-color; color: #303133;
font-size: 14px;
line-height: 56px;
cursor: pointer;
&.active{
color: #fff;
background-color: $main-color;
}
} }
} }
} }

4
src/pages/setting/person/info.vue
Unescape View File

@ -188,7 +188,7 @@
<el-dialog :title="form.email ? '更换邮箱' : '绑定邮箱'" :visible.sync="emailVisible" :close-on-click-modal="false" @close="closeEmail" width="30%"> <el-dialog :title="form.email ? '更换邮箱' : '绑定邮箱'" :visible.sync="emailVisible" :close-on-click-modal="false" @close="closeEmail" width="30%">
<el-form ref="form" :model="form" label-width="60px"> <el-form ref="form" :model="form" label-width="60px">
<el-form-item label="邮箱"> <el-form-item label="邮箱">
<el-input placeholder="请输入邮箱" v-model="email"></el-input> <el-input style="width: 394px;" placeholder="请输入邮箱" v-model="email"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="验证码"> <el-form-item label="验证码">
<div class="flex"> <div class="flex">
@ -206,7 +206,7 @@
<el-dialog :title="form.phone ? '更换手机号' : '绑定手机号'" :visible.sync="phoneVisible" :close-on-click-modal="false" @close="closePhone" width="30%"> <el-dialog :title="form.phone ? '更换手机号' : '绑定手机号'" :visible.sync="phoneVisible" :close-on-click-modal="false" @close="closePhone" width="30%">
<el-form ref="form" :model="form" label-width="60px"> <el-form ref="form" :model="form" label-width="60px">
<el-form-item label="手机号"> <el-form-item label="手机号">
<el-input placeholder="请输入手机号" v-model="phone" maxlength="11"></el-input> <el-input style="width: 394px;" placeholder="请输入手机号" v-model="phone" maxlength="11"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="验证码"> <el-form-item label="验证码">
<div class="flex"> <div class="flex">

51
src/pages/stat/list/index.vue
Unescape View File

@ -1,17 +1,32 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<div class="left"> <div class="left">
<div class="product" v-for="(item,index) in productList" :key="index"> <div class="products">
<p class="product-name">{{item.productName}}</p> <img class="icon" width="100" src="@/assets/img/school.png" alt="">
<div class="date"> <div class="product" v-for="(item,index) in productList" :key="index">
<span class="name">使用期限：</span> <p class="product-name">{{item.productName}}</p>
<div class="val"> <div class="date">
{{item.endTime}} <span class="name">使用期限：</span>
<div class="val">
{{item.endTime}}
</div>
</div> </div>
<p class="surplus" v-if="item.deadline"><span class="name">剩余期限：</span><span class="num">{{item.deadline}}</span> 天</p>
<p class="surplus"><span class="name">账号数量：</span><span class="num">{{item.accountNum}}</span> 个</p>
<el-button class="renew" size="small" type="primary" v-if="!item.deadline">续费</el-button>
</div>
<div class="product" v-for="(item,index) in productList" :key="index">
<p class="product-name">{{item.productName}}</p>
<div class="date">
<span class="name">使用期限：</span>
<div class="val">
{{item.endTime}}
</div>
</div>
<p class="surplus" v-if="item.deadline"><span class="name">剩余期限：</span><span class="num">{{item.deadline}}</span> 天</p>
<p class="surplus"><span class="name">账号数量：</span><span class="num">{{item.accountNum}}</span> 个</p>
<el-button class="renew" size="small" type="primary" v-if="!item.deadline">续费</el-button>
</div> </div>
<p class="surplus" v-if="item.deadline"><span class="name">剩余期限：</span><span class="num">{{item.deadline}}</span> 天</p>
<p class="surplus"><span class="name">账号数量：</span><span class="num">{{item.accountNum}}</span> 个</p>
<el-button class="renew" size="small" type="primary" v-if="!item.deadline">续费</el-button>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
@ -325,12 +340,23 @@ export default {
display: flex; display: flex;
.left{ .left{
margin-right: 20px; margin-right: 20px;
.product{ .products{
width: 200px; width: 200px;
padding: 15px; padding: 15px;
margin-bottom: 15px; text-align: center;
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 8px;
.icon{
margin-bottom: 10px;
}
}
.product{
margin-bottom: 30px;
text-align: left;
&:last-child{
margin-bottom: 0;
}
.product-name{ .product-name{
margin-bottom: 15px; margin-bottom: 15px;
font-size: 16px; font-size: 16px;
@ -364,6 +390,9 @@ export default {
} }
} }
} }
.right{
max-width: calc(100% - 220px);
}
.page{ .page{
margin-bottom: 20px; margin-bottom: 20px;
.arrow{ .arrow{

44
src/pages/user/list/index.vue
Unescape View File

@ -7,7 +7,7 @@
<ul class="filter"> <ul class="filter">
<li> <li>
<label>创建时间：</label> <label>创建时间：</label>
<el-select v-model="month" placeholder="请选择创建时间" size="small" clearable class="w-150"> <el-select v-model="month" placeholder="请选择创建时间" size="small" clearable class="flex-1">
<el-option v-for="(item,index) in monthList" :key="index" :label="item.label" :value="item.id"></el-option> <el-option v-for="(item,index) in monthList" :key="index" :label="item.label" :value="item.id"></el-option>
</el-select> </el-select>
</li> </li>
@ -17,7 +17,7 @@
</li> </li>
<li> <li>
<label style="width: auto;">角色：</label> <label style="width: auto;">角色：</label>
<el-select v-model="role" placeholder="请选择角色" size="small" clearable class="w-150" @change="initData"> <el-select v-model="role" placeholder="请选择角色" size="small" clearable @change="initData">
<el-option label="不限" value=""></el-option> <el-option label="不限" value=""></el-option>
<el-option label="用户" value="0"></el-option> <el-option label="用户" value="0"></el-option>
<el-option v-for="(item,index) in roleList" :key="index" :label="item.roleName" :value="item.id"></el-option> <el-option v-for="(item,index) in roleList" :key="index" :label="item.roleName" :value="item.id"></el-option>
@ -25,7 +25,7 @@
</li> </li>
<li> <li>
<label>状态：</label> <label>状态：</label>
<el-select v-model="status" placeholder="请选择状态" size="small" clearable class="w-150" @change="initData"> <el-select v-model="status" placeholder="请选择状态" size="small" clearable class="flex-1" @change="initData">
<el-option v-for="(item,index) in statusList" :key="index" :label="item.label" :value="item.id"></el-option> <el-option v-for="(item,index) in statusList" :key="index" :label="item.label" :value="item.id"></el-option>
</el-select> </el-select>
</li> </li>
@ -34,11 +34,13 @@
<el-input style="width: 250px" placeholder="请输入员工账号/姓名/工号" v-model="keyword" suffix-icon="el-icon-search" clearable size="small"></el-input> <el-input style="width: 250px" placeholder="请输入员工账号/姓名/工号" v-model="keyword" suffix-icon="el-icon-search" clearable size="small"></el-input>
</li> </li>
</ul> </ul>
<div> <div></div>
<el-button type="primary" size="small" round @click="addTeacher" v-auth="'/user/list:新增用户'">新增账号</el-button> </div>
<el-button type="primary" size="small" round @click="batchImport" v-auth>批量导入</el-button>
<el-button type="primary" size="small" round @click="delAllSelection" v-auth>批量删除</el-button> <div class="tool" style="justify-content: flex-end;margin-bottom: 16px;">
</div> <el-button type="primary" size="small" round @click="add" v-auth="'/user/list:新增用户'">新增账号</el-button>
<el-button type="primary" size="small" round @click="batchImport" v-auth>批量导入</el-button>
<el-button type="primary" size="small" round @click="delAllSelection" v-auth>批量删除</el-button>
</div> </div>
<el-table :data="listData" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange"> <el-table :data="listData" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange">
@ -87,12 +89,12 @@
<el-input v-model="form.userName" placeholder="请输入员工姓名"></el-input> <el-input v-model="form.userName" placeholder="请输入员工姓名"></el-input>
</el-form-item> </el-form-item>
<el-form-item prop="roleId" label="账号角色"> <el-form-item prop="roleId" label="账号角色">
<el-radio v-model="defaultUser" label="user" disabled>用户</el-radio> <el-checkbox-group v-model="form.roleId" :max="2">
<el-radio-group v-model="form.roleId"> <el-checkbox label="user" disabled>用户</el-checkbox>
<template v-for="(item,index) in roleList"> <template v-for="(item,index) in roleList">
<el-radio v-if="item.id != '1409424489820102658'" :key="index" :label="item.id" :disabled="item.id == 'user'">{{item.roleName}}</el-radio> <el-checkbox v-if="item.roleName != '超级管理员'" :key="index" :label="item.id" :disabled="item.id == 'user'" @change="changeRole">{{item.roleName}}</el-checkbox>
</template> </template>
</el-radio-group> </el-checkbox-group>
</el-form-item> </el-form-item>
<el-form-item prop="uniqueIdentification" label="唯一标识"> <el-form-item prop="uniqueIdentification" label="唯一标识">
<el-input disabled v-model="form.uniqueIdentification" placeholder="唯一标识"></el-input> <el-input disabled v-model="form.uniqueIdentification" placeholder="唯一标识"></el-input>
@ -177,7 +179,7 @@ export default {
isDetail: false, isDetail: false,
userVisible: false, userVisible: false,
roleList: [], roleList: [],
defaultUser: 'user', defaultUser: true,
form: { form: {
platformId: Setting.platformId, platformId: Setting.platformId,
// type: 1, // 0->教师端 1->学生端 可不传 // type: 1, // 0->教师端 1->学生端 可不传
@ -185,7 +187,7 @@ export default {
userId: '', userId: '',
accountId: '', accountId: '',
userName: '', userName: '',
roleId: '', roleId: ['user'],
phone: '', phone: '',
uniqueIdentification: '', uniqueIdentification: '',
workNumber: '', workNumber: '',
@ -353,7 +355,7 @@ export default {
this.accountRepeat = false this.accountRepeat = false
this.workNumberRepeat = false this.workNumberRepeat = false
}, },
addTeacher(){ add(){
this.isDetail = false this.isDetail = false
this.userVisible = true this.userVisible = true
}, },
@ -387,7 +389,11 @@ export default {
this.isDetail = true this.isDetail = true
this.getDetail(row.accountId) this.getDetail(row.accountId)
}, },
changeRole(val){
console.log(11,val)
},
confirm(){ confirm(){
// return console.log(11,this.form.roleId)
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
if(this.accountRepeat) return util.errorMsg('该账号已存在！') if(this.accountRepeat) return util.errorMsg('该账号已存在！')
@ -395,7 +401,11 @@ export default {
let data = this.form let data = this.form
data.schoolId = data.schoolId ? data.schoolId : this.schoolId data.schoolId = data.schoolId ? data.schoolId : this.schoolId
if(!data.userId) data.uniqueIdentification = new Date().getTime() if(!data.userId) data.uniqueIdentification = new Date().getTime()
if(!data.roleId) data.roleId = '0' if(data.roleId.length == 1){
data.roleId = '0'
}else{
data.roleId = data.roleId[1]
}
if(this.form.userId){ if(this.form.userId){
this.$post(this.api.modifyUser,data).then(res => { this.$post(this.api.modifyUser,data).then(res => {
this.userVisible = false this.userVisible = false
@ -474,7 +484,7 @@ export default {
this.getData() this.getData()
}, },
downLoad(){ downLoad(){
location.href = this.api.userTemplate location.href = `${this.api.userTemplate}?id=${Math.random()}`
}, },
showFaild(){ showFaild(){
this.importVisible = false this.importVisible = false

2
src/setting.js
Unescape View File

@ -16,7 +16,7 @@ const Setting = {
showProgressBar: true, showProgressBar: true,
// 接口请求地址 // 接口请求地址
// apiBaseURL: env === 'development' ? 'http://192.168.31.216:9000' : 'http://39.108.250.202:9000', // apiBaseURL: env === 'development' ? 'http://192.168.31.216:9000' : 'http://39.108.250.202:9000',
apiBaseURL: env === 'development' ? 'http://192.168.31.216:9000' : 'http://39.108.250.202:9000', apiBaseURL: env === 'development' ? 'http://39.108.250.202:9000' : 'http://39.108.250.202:9000',
// 接口请求返回错误时，弹窗的持续时间，单位：秒 // 接口请求返回错误时，弹窗的持续时间，单位：秒
modalDuration: 3, modalDuration: 3,
// 接口请求返回错误时，弹窗的类型，可选值为 Message 或 Notice // 接口请求返回错误时，弹窗的类型，可选值为 Message 或 Notice

2
src/styles/layout/index.scss
Unescape View File

@ -9,7 +9,7 @@ body,
} }
body { body {
min-width: 1500px; min-width: $min-width;
font-family: 'PingFang SC', "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif; font-family: 'PingFang SC', "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif;
font-size: 14px; font-size: 14px;
background: rgba(0, 0, 0, 0.02); background: rgba(0, 0, 0, 0.02);

3
src/styles/var.scss
Unescape View File

@ -1,5 +1,6 @@
$main-color: #568DF2; $main-color: #568DF2;
$inner-width: 1440px; $max-width: 1440px;
$min-width: 1280px;
@mixin ellipsis { @mixin ellipsis {
overflow: hidden; overflow: hidden;

2
vue.config.js
Unescape View File

@ -23,6 +23,6 @@ module.exports = {
  outputDir: Setting.outputDir,   outputDir: Setting.outputDir,
  assetsDir: Setting.assetsDir,   assetsDir: Setting.assetsDir,
devServer: { devServer: {
port: 8092 port: 8081
} }
} }
Write Preview
Loading…
Cancel
Save