暂存一下
This commit is contained in:
xiongchengqiang
parent
cb42929de4
commit
0beb562a98
@ -0,0 +1,3 @@
|
|||||||
|
[.ShellClassInfo]
|
||||||
|
CLSID={645FF040-5081-101B-9F08-00AA002F954E}
|
||||||
|
LocalizedResourceName=@%SystemRoot%\system32\shell32.dll,-8964
|
||||||
6
.babelrc
6
.babelrc
@ -5,11 +5,9 @@
|
|||||||
}],
|
}],
|
||||||
"stage-2"
|
"stage-2"
|
||||||
],
|
],
|
||||||
"plugins": ["transform-runtime", ["component", [
|
"plugins": ["transform-runtime", ["component", [{
|
||||||
{
|
|
||||||
"libraryName": "element-ui"
|
"libraryName": "element-ui"
|
||||||
}
|
}]]],
|
||||||
]]],
|
|
||||||
"env": {
|
"env": {
|
||||||
"test": {
|
"test": {
|
||||||
"presets": ["env", "stage-2"],
|
"presets": ["env", "stage-2"],
|
||||||
|
|||||||
17
.gitignore
vendored
Normal file
17
.gitignore
vendored
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
.DS_Store
|
||||||
|
node_modules/
|
||||||
|
/dist/
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
/test/unit/coverage/
|
||||||
|
/test/e2e/reports/
|
||||||
|
selenium-debug.log
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.idea
|
||||||
|
.vscode
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
@ -1,13 +1,17 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<!-- <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> -->
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
<title>数字化管理系统</title>
|
<title>数字化管理系统</title>
|
||||||
<script src="./static/plugins/mock-1.0.0-beta3/mock-min.js"></script>
|
<script src="./static/plugins/mock-1.0.0-beta3/mock-min.js"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -17,6 +17,7 @@
|
|||||||
"axios": "^0.19.2",
|
"axios": "^0.19.2",
|
||||||
"babel-plugin-component": "0.10.1",
|
"babel-plugin-component": "0.10.1",
|
||||||
"babel-polyfill": "6.26.0",
|
"babel-polyfill": "6.26.0",
|
||||||
|
"echarts": "^4.7.0",
|
||||||
"element-ui": "^2.13.1",
|
"element-ui": "^2.13.1",
|
||||||
"gulp": "3.9.1",
|
"gulp": "3.9.1",
|
||||||
"gulp-concat": "2.6.1",
|
"gulp-concat": "2.6.1",
|
||||||
@ -28,6 +29,7 @@
|
|||||||
"npm": "^6.14.4",
|
"npm": "^6.14.4",
|
||||||
"sass-loader": "6.0.6",
|
"sass-loader": "6.0.6",
|
||||||
"svg-sprite-loader": "3.7.3",
|
"svg-sprite-loader": "3.7.3",
|
||||||
|
"v-charts": "^1.19.0",
|
||||||
"vue": "2.5.16",
|
"vue": "2.5.16",
|
||||||
"vue-cookie": "1.1.4",
|
"vue-cookie": "1.1.4",
|
||||||
"vue-router": "3.0.1",
|
"vue-router": "3.0.1",
|
||||||
|
|||||||
@ -5,6 +5,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -1,5 +1,12 @@
|
|||||||
// 站点主色
|
// 站点主色
|
||||||
// tips: 要达到整站主题修改效果, 请确保[$--color-primary]站点主色与[/src/element-ui-theme/index.js]文件中[import './element-[#17B3A3]/index.css']当前主题色一致
|
// tips: 要达到整站主题修改效果, 请确保[$--color-primary]站点主色与[/src/element-ui-theme/index.js]文件中[import './element-[#17B3A3]/index.css']当前主题色一致
|
||||||
|
/* 改变主题色变量 */
|
||||||
|
$--color-primary: #3E8EF7;
|
||||||
|
|
||||||
|
/* 改变 icon 字体路径变量，必需 */
|
||||||
|
$--font-path: '~element-ui/lib/theme-chalk/fonts';
|
||||||
|
|
||||||
|
@import "~element-ui/packages/theme-chalk/src/index";
|
||||||
$--color-primary: #3E8EF7;
|
$--color-primary: #3E8EF7;
|
||||||
|
|
||||||
// Navbar
|
// Navbar
|
||||||
|
|||||||
@ -1,3 +1,3 @@
|
|||||||
@import "normalize"; // api: https://github.com/necolas/normalize.css/
|
@import "normalize"; // api: https://github.com/necolas/normalize.css/
|
||||||
@import "variables"; // 站点变量
|
@import "_variables"; // 站点变量
|
||||||
@import "base";
|
@import "base";
|
||||||
|
|||||||
@ -5,12 +5,17 @@ import store from '@/store' // api: https://github.com/vuejs/v
|
|||||||
import VueCookie from 'vue-cookie' // api: https://github.com/alfhen/vue-cookie
|
import VueCookie from 'vue-cookie' // api: https://github.com/alfhen/vue-cookie
|
||||||
import '@/element-ui' // api: https://github.com/ElemeFE/element
|
import '@/element-ui' // api: https://github.com/ElemeFE/element
|
||||||
import '@/icons' // api: http://www.iconfont.cn/
|
import '@/icons' // api: http://www.iconfont.cn/
|
||||||
import '@/element-ui-theme'
|
// import '@/element-ui-theme'
|
||||||
import '@/assets/scss/index.scss'
|
import '@/assets/scss/index.scss'
|
||||||
import httpRequest from '@/utils/httpRequest' // api: https://github.com/axios/axios
|
import httpRequest from '@/utils/httpRequest' // api: https://github.com/axios/axios
|
||||||
import { isAuth } from '@/utils'
|
import { isAuth } from '@/utils'
|
||||||
// import cloneDeep from 'lodash/cloneDeep'
|
// import cloneDeep from 'lodash/cloneDeep'
|
||||||
|
import VCharts from 'v-charts'
|
||||||
|
Vue.use(VCharts)
|
||||||
|
// import echarts from 'echarts/lib/echarts'
|
||||||
|
// console.log(111)
|
||||||
|
// console.log(echarts)
|
||||||
|
// debugger
|
||||||
Vue.use(VueCookie)
|
Vue.use(VueCookie)
|
||||||
Vue.config.productionTip = false
|
Vue.config.productionTip = false
|
||||||
|
|
||||||
|
|||||||
@ -35,9 +35,9 @@ const mainRoutes = {
|
|||||||
// 提示: 如需要通过iframe嵌套展示内容, 但不通过tab打开, 请自行创建组件使用iframe处理!
|
// 提示: 如需要通过iframe嵌套展示内容, 但不通过tab打开, 请自行创建组件使用iframe处理!
|
||||||
{ path: '/home', component: _import('common/home'), name: 'home', meta: { title: '首页' } },
|
{ path: '/home', component: _import('common/home'), name: 'home', meta: { title: '首页' } },
|
||||||
{ path: '/theme', component: _import('common/theme'), name: 'theme', meta: { title: '主题' } },
|
{ path: '/theme', component: _import('common/theme'), name: 'theme', meta: { title: '主题' } },
|
||||||
{ path: '/staff-manage', component: _import('business/staff/staff-manage/index'), name: 'staff-manage', meta: { title: '员工管理', isTab: true } },
|
{ path: '/staff-manage', component: _import('business/staff/staff-manage/index'), name: 'staff-manage', meta: { title: '员工管理', isTab: true, isNoCard: true } },
|
||||||
{ path: '/staff-profile', component: _import('business/staff/staff-profile/index'), name: 'staff-profile', meta: { title: '员工概述', isTab: true } },
|
{ path: '/staff-profile', component: _import('business/staff/staff-profile/index'), name: 'staff-profile', meta: { title: '员工概述', isTab: true, isNoCard: true } },
|
||||||
{ path: '/staff-archives', component: _import('business/staff/staff-archives/index'), name: 'staff-archives', meta: { title: '员工档案', isTab: true } }
|
{ path: '/staff-archives', component: _import('business/staff/staff-archives/index'), name: 'staff-archives', meta: { title: '员工档案', isTab: true, isNoCard: true } }
|
||||||
],
|
],
|
||||||
beforeEnter (to, from, next) {
|
beforeEnter (to, from, next) {
|
||||||
let token = Vue.cookie.get('token')
|
let token = Vue.cookie.get('token')
|
||||||
|
|||||||
@ -0,0 +1,23 @@
|
|||||||
|
<!-- -->
|
||||||
|
<template>
|
||||||
|
<div>左边</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
beforeMount () { },
|
||||||
|
mounted () { },
|
||||||
|
methods: {},
|
||||||
|
watch: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang='' scoped>
|
||||||
|
</style>
|
||||||
@ -0,0 +1,170 @@
|
|||||||
|
<template>
|
||||||
|
<div class="staff-manage-right">
|
||||||
|
<div class="el-card__body">
|
||||||
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="handleGetTableList()">
|
||||||
|
<el-form-item>
|
||||||
|
<el-input v-model="dataForm.userName" placeholder="用户名" clearable></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button @click="handleGetTableList()">查询</el-button>
|
||||||
|
<el-button v-if="isAuth('sys:user:save')" type="primary" @click="handleAddOrUpdate()">新增</el-button>
|
||||||
|
<el-button
|
||||||
|
v-if="isAuth('sys:user:delete')"
|
||||||
|
type="danger"
|
||||||
|
@click="handleDelete()"
|
||||||
|
:disabled="dataListSelections.length <= 0"
|
||||||
|
>批量删除</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<div class="el-card__body">
|
||||||
|
<el-table
|
||||||
|
:data="dataList"
|
||||||
|
border
|
||||||
|
v-loading="dataListLoading"
|
||||||
|
@selection-change="handleChangeSelection"
|
||||||
|
style="width: 100%;"
|
||||||
|
>
|
||||||
|
<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
|
||||||
|
<el-table-column prop="userId" header-align="center" align="center" width="80" label="ID"></el-table-column>
|
||||||
|
<el-table-column prop="username" header-align="center" align="center" label="用户名"></el-table-column>
|
||||||
|
<el-table-column prop="email" header-align="center" align="center" label="邮箱"></el-table-column>
|
||||||
|
<el-table-column prop="mobile" header-align="center" align="center" label="手机号"></el-table-column>
|
||||||
|
<el-table-column prop="status" header-align="center" align="center" label="状态">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-tag v-if="scope.row.status === 0" size="small" type="danger">禁用</el-tag>
|
||||||
|
<el-tag v-else size="small">正常</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="createTime"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
width="180"
|
||||||
|
label="创建时间"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
v-if="isAuth('sys:user:update')"
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
@click="handleAddOrUpdate(scope.row.userId)"
|
||||||
|
>修改</el-button>
|
||||||
|
<el-button
|
||||||
|
v-if="isAuth('sys:user:delete')"
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
@click="handleDelete(scope.row.userId)"
|
||||||
|
>删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<el-pagination
|
||||||
|
@size-change="handleChangeSize"
|
||||||
|
@current-change="handleChangeCurrent"
|
||||||
|
:current-page="pageIndex"
|
||||||
|
:page-sizes="[10, 20, 50, 100]"
|
||||||
|
:page-size="pageSize"
|
||||||
|
:total="totalPage"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper"
|
||||||
|
></el-pagination>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { apiSysUserList } from '@/api/api_sys'
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
dataForm: {
|
||||||
|
userName: ''
|
||||||
|
},
|
||||||
|
dataList: [],
|
||||||
|
pageIndex: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
totalPage: 0,
|
||||||
|
dataListLoading: false,
|
||||||
|
dataListSelections: [],
|
||||||
|
addOrUpdateVisible: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
},
|
||||||
|
activated () {
|
||||||
|
this.handleGetTableList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取数据列表
|
||||||
|
handleGetTableList () {
|
||||||
|
// apiSysUserList({
|
||||||
|
// 'page': this.pageIndex,
|
||||||
|
// 'limit': this.pageSize,
|
||||||
|
// 'username': this.dataForm.userName
|
||||||
|
// }).then(res => {
|
||||||
|
// if (res && res.code === 0) {
|
||||||
|
// this.dataList = res.page.list
|
||||||
|
// this.totalPage = res.page.totalCount
|
||||||
|
// } else {
|
||||||
|
// this.dataList = []
|
||||||
|
// this.totalPage = 0
|
||||||
|
// }
|
||||||
|
// this.dataListLoading = false
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
// 每页数
|
||||||
|
handleChangeSize (val) {
|
||||||
|
this.pageSize = val
|
||||||
|
this.pageIndex = 1
|
||||||
|
this.handleGetTableList()
|
||||||
|
},
|
||||||
|
// 当前页
|
||||||
|
handleChangeCurrent (val) {
|
||||||
|
this.pageIndex = val
|
||||||
|
this.handleGetTableList()
|
||||||
|
},
|
||||||
|
// 多选
|
||||||
|
handleChangeSelection (val) {
|
||||||
|
this.dataListSelections = val
|
||||||
|
},
|
||||||
|
// 新增 / 修改
|
||||||
|
handleAddOrUpdate (id) {
|
||||||
|
this.addOrUpdateVisible = true
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.addOrUpdate.init(id)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 删除
|
||||||
|
handleDelete (id) {
|
||||||
|
var userIds = id ? [id] : this.dataListSelections.map(item => {
|
||||||
|
return item.userId
|
||||||
|
})
|
||||||
|
this.$confirm(`确定对[id=${userIds.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
}).then(() => {
|
||||||
|
this.$http({
|
||||||
|
url: this.$http.adornUrl('/sys/user/delete'),
|
||||||
|
method: 'post',
|
||||||
|
data: this.$http.adornData(userIds, false)
|
||||||
|
}).then(({ data }) => {
|
||||||
|
if (data && data.code === 0) {
|
||||||
|
this.$message({
|
||||||
|
message: '操作成功',
|
||||||
|
type: 'success',
|
||||||
|
duration: 1500,
|
||||||
|
onClose: () => {
|
||||||
|
this.handleGetTableList()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.$message.error(data.msg)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}).catch(() => { })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -1,5 +1,37 @@
|
|||||||
|
<!-- -->
|
||||||
<template>
|
<template>
|
||||||
<div class="staff-manage">
|
<div class="staff-manage">
|
||||||
员工管理
|
<staff-manage-left />
|
||||||
|
<staff-manage-right />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import staffManageLeft from './compoments/staff-manage-left'
|
||||||
|
import staffManageRight from './compoments/staff-manage-right'
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
staffManageLeft,
|
||||||
|
staffManageRight
|
||||||
|
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
beforeMount () { },
|
||||||
|
mounted () { },
|
||||||
|
methods: {},
|
||||||
|
watch: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang='scss' scoped>
|
||||||
|
.staff-manage {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,41 @@
|
|||||||
|
<!-- -->
|
||||||
|
<template>
|
||||||
|
<div class="staff-archives-charts">
|
||||||
|
<div class="staff-archives-title">性别分布</div>
|
||||||
|
<div>
|
||||||
|
<!-- <ve-ring :data="chartData"></ve-ring> -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
chartData: {
|
||||||
|
columns: ['日期', '访问用户'],
|
||||||
|
rows: [
|
||||||
|
{ '日期': '1/1', '访问用户': 1393 },
|
||||||
|
{ '日期': '1/2', '访问用户': 3530 },
|
||||||
|
{ '日期': '1/3', '访问用户': 2923 },
|
||||||
|
{ '日期': '1/4', '访问用户': 1723 },
|
||||||
|
{ '日期': '1/5', '访问用户': 3792 },
|
||||||
|
{ '日期': '1/6', '访问用户': 4593 }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
beforeMount () { },
|
||||||
|
mounted () { },
|
||||||
|
methods: {},
|
||||||
|
watch: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang='scss' scoped>
|
||||||
|
.staff-archives-charts {
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,55 @@
|
|||||||
|
<!-- -->
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="staff-archives-title">员工数量</div>
|
||||||
|
<div class="staff-archives-content">
|
||||||
|
截至
|
||||||
|
<span class="staff-archives-yellow">2020</span>年
|
||||||
|
<span class="staff-archives-yellow">2</span>月
|
||||||
|
<span class="staff-archives-yellow">20</span>日，
|
||||||
|
<span class="staff-archives-yellow">浙江霖梓控股有限公司</span>在职员工总数为
|
||||||
|
<span class="staff-archives-bule">134</span>人，其中管理人员
|
||||||
|
<span class="staff-archives-bule">134</span>人，占比
|
||||||
|
<span class="staff-archives-bule">20.5%。</span>
|
||||||
|
</div>
|
||||||
|
<div class="staff-archives-content">
|
||||||
|
<span class="staff-archives-yellow">近三个月</span>新入职员工
|
||||||
|
<span class="staff-archives-bule">134</span>人，离职员工
|
||||||
|
<span class="staff-archives-bule">134</span>人，离职率为
|
||||||
|
<span class="staff-archives-bule">134%。</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
beforeMount () { },
|
||||||
|
mounted () { },
|
||||||
|
methods: {},
|
||||||
|
watch: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang='scss'>
|
||||||
|
.staff-archives {
|
||||||
|
&-content {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
&-yellow {
|
||||||
|
color: #ed7d31;
|
||||||
|
}
|
||||||
|
&-bule {
|
||||||
|
font-weight: 700;
|
||||||
|
color: #1890ff;
|
||||||
|
font-size: 28px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,278 @@
|
|||||||
|
<!-- -->
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="staff-archives-title">条件筛选</div>
|
||||||
|
<el-form :inline="true" :model="formInline" class="demo-form-inline staff-archives-form">
|
||||||
|
<el-form-item label="选择部门">
|
||||||
|
<!-- <el-select v-model="formInline.region" placeholder="请选择业务部门">
|
||||||
|
<el-option label="全部" value="all"></el-option>
|
||||||
|
<el-option label="区域二" value="beijing"></el-option>
|
||||||
|
</el-select>-->
|
||||||
|
<el-cascader
|
||||||
|
v-model="formInline.value"
|
||||||
|
:options="options"
|
||||||
|
:props="{ expandTrigger: 'hover' }"
|
||||||
|
@change="handleChange"
|
||||||
|
></el-cascader>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="选择时间段(仅对员工数量生效)">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="formInline.value2"
|
||||||
|
type="daterange"
|
||||||
|
align="right"
|
||||||
|
unlink-panels
|
||||||
|
range-separator="至"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
:picker-options="pickerOptions"
|
||||||
|
></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="onSubmit">查询</el-button>
|
||||||
|
<el-button type="primary" @click="onSubmit">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
formInline: {},
|
||||||
|
pickerOptions: {
|
||||||
|
shortcuts: [{
|
||||||
|
text: '最近一周',
|
||||||
|
onClick (picker) {
|
||||||
|
const end = new Date()
|
||||||
|
const start = new Date()
|
||||||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
||||||
|
picker.$emit('pick', [start, end])
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
text: '最近一个月',
|
||||||
|
onClick (picker) {
|
||||||
|
const end = new Date()
|
||||||
|
const start = new Date()
|
||||||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
||||||
|
picker.$emit('pick', [start, end])
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
text: '最近三个月',
|
||||||
|
onClick (picker) {
|
||||||
|
const end = new Date()
|
||||||
|
const start = new Date()
|
||||||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
|
||||||
|
picker.$emit('pick', [start, end])
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: [{
|
||||||
|
value: 'zhinan',
|
||||||
|
label: '指南',
|
||||||
|
children: [{
|
||||||
|
value: 'shejiyuanze',
|
||||||
|
label: '设计原则',
|
||||||
|
children: [{
|
||||||
|
value: 'yizhi',
|
||||||
|
label: '一致'
|
||||||
|
}, {
|
||||||
|
value: 'fankui',
|
||||||
|
label: '反馈'
|
||||||
|
}, {
|
||||||
|
value: 'xiaolv',
|
||||||
|
label: '效率'
|
||||||
|
}, {
|
||||||
|
value: 'kekong',
|
||||||
|
label: '可控'
|
||||||
|
}]
|
||||||
|
}, {
|
||||||
|
value: 'daohang',
|
||||||
|
label: '导航',
|
||||||
|
children: [{
|
||||||
|
value: 'cexiangdaohang',
|
||||||
|
label: '侧向导航'
|
||||||
|
}, {
|
||||||
|
value: 'dingbudaohang',
|
||||||
|
label: '顶部导航'
|
||||||
|
}]
|
||||||
|
}]
|
||||||
|
}, {
|
||||||
|
value: 'zujian',
|
||||||
|
label: '组件',
|
||||||
|
children: [{
|
||||||
|
value: 'basic',
|
||||||
|
label: 'Basic',
|
||||||
|
children: [{
|
||||||
|
value: 'layout',
|
||||||
|
label: 'Layout 布局'
|
||||||
|
}, {
|
||||||
|
value: 'color',
|
||||||
|
label: 'Color 色彩'
|
||||||
|
}, {
|
||||||
|
value: 'typography',
|
||||||
|
label: 'Typography 字体'
|
||||||
|
}, {
|
||||||
|
value: 'icon',
|
||||||
|
label: 'Icon 图标'
|
||||||
|
}, {
|
||||||
|
value: 'button',
|
||||||
|
label: 'Button 按钮'
|
||||||
|
}]
|
||||||
|
}, {
|
||||||
|
value: 'form',
|
||||||
|
label: 'Form',
|
||||||
|
children: [{
|
||||||
|
value: 'radio',
|
||||||
|
label: 'Radio 单选框'
|
||||||
|
}, {
|
||||||
|
value: 'checkbox',
|
||||||
|
label: 'Checkbox 多选框'
|
||||||
|
}, {
|
||||||
|
value: 'input',
|
||||||
|
label: 'Input 输入框'
|
||||||
|
}, {
|
||||||
|
value: 'input-number',
|
||||||
|
label: 'InputNumber 计数器'
|
||||||
|
}, {
|
||||||
|
value: 'select',
|
||||||
|
label: 'Select 选择器'
|
||||||
|
}, {
|
||||||
|
value: 'cascader',
|
||||||
|
label: 'Cascader 级联选择器'
|
||||||
|
}, {
|
||||||
|
value: 'switch',
|
||||||
|
label: 'Switch 开关'
|
||||||
|
}, {
|
||||||
|
value: 'slider',
|
||||||
|
label: 'Slider 滑块'
|
||||||
|
}, {
|
||||||
|
value: 'time-picker',
|
||||||
|
label: 'TimePicker 时间选择器'
|
||||||
|
}, {
|
||||||
|
value: 'date-picker',
|
||||||
|
label: 'DatePicker 日期选择器'
|
||||||
|
}, {
|
||||||
|
value: 'datetime-picker',
|
||||||
|
label: 'DateTimePicker 日期时间选择器'
|
||||||
|
}, {
|
||||||
|
value: 'upload',
|
||||||
|
label: 'Upload 上传'
|
||||||
|
}, {
|
||||||
|
value: 'rate',
|
||||||
|
label: 'Rate 评分'
|
||||||
|
}, {
|
||||||
|
value: 'form',
|
||||||
|
label: 'Form 表单'
|
||||||
|
}]
|
||||||
|
}, {
|
||||||
|
value: 'data',
|
||||||
|
label: 'Data',
|
||||||
|
children: [{
|
||||||
|
value: 'table',
|
||||||
|
label: 'Table 表格'
|
||||||
|
}, {
|
||||||
|
value: 'tag',
|
||||||
|
label: 'Tag 标签'
|
||||||
|
}, {
|
||||||
|
value: 'progress',
|
||||||
|
label: 'Progress 进度条'
|
||||||
|
}, {
|
||||||
|
value: 'tree',
|
||||||
|
label: 'Tree 树形控件'
|
||||||
|
}, {
|
||||||
|
value: 'pagination',
|
||||||
|
label: 'Pagination 分页'
|
||||||
|
}, {
|
||||||
|
value: 'badge',
|
||||||
|
label: 'Badge 标记'
|
||||||
|
}]
|
||||||
|
}, {
|
||||||
|
value: 'notice',
|
||||||
|
label: 'Notice',
|
||||||
|
children: [{
|
||||||
|
value: 'alert',
|
||||||
|
label: 'Alert 警告'
|
||||||
|
}, {
|
||||||
|
value: 'loading',
|
||||||
|
label: 'Loading 加载'
|
||||||
|
}, {
|
||||||
|
value: 'message',
|
||||||
|
label: 'Message 消息提示'
|
||||||
|
}, {
|
||||||
|
value: 'message-box',
|
||||||
|
label: 'MessageBox 弹框'
|
||||||
|
}, {
|
||||||
|
value: 'notification',
|
||||||
|
label: 'Notification 通知'
|
||||||
|
}]
|
||||||
|
}, {
|
||||||
|
value: 'navigation',
|
||||||
|
label: 'Navigation',
|
||||||
|
children: [{
|
||||||
|
value: 'menu',
|
||||||
|
label: 'NavMenu 导航菜单'
|
||||||
|
}, {
|
||||||
|
value: 'tabs',
|
||||||
|
label: 'Tabs 标签页'
|
||||||
|
}, {
|
||||||
|
value: 'breadcrumb',
|
||||||
|
label: 'Breadcrumb 面包屑'
|
||||||
|
}, {
|
||||||
|
value: 'dropdown',
|
||||||
|
label: 'Dropdown 下拉菜单'
|
||||||
|
}, {
|
||||||
|
value: 'steps',
|
||||||
|
label: 'Steps 步骤条'
|
||||||
|
}]
|
||||||
|
}, {
|
||||||
|
value: 'others',
|
||||||
|
label: 'Others',
|
||||||
|
children: [{
|
||||||
|
value: 'dialog',
|
||||||
|
label: 'Dialog 对话框'
|
||||||
|
}, {
|
||||||
|
value: 'tooltip',
|
||||||
|
label: 'Tooltip 文字提示'
|
||||||
|
}, {
|
||||||
|
value: 'popover',
|
||||||
|
label: 'Popover 弹出框'
|
||||||
|
}, {
|
||||||
|
value: 'card',
|
||||||
|
label: 'Card 卡片'
|
||||||
|
}, {
|
||||||
|
value: 'carousel',
|
||||||
|
label: 'Carousel 走马灯'
|
||||||
|
}, {
|
||||||
|
value: 'collapse',
|
||||||
|
label: 'Collapse 折叠面板'
|
||||||
|
}]
|
||||||
|
}]
|
||||||
|
}, {
|
||||||
|
value: 'ziyuan',
|
||||||
|
label: '资源',
|
||||||
|
children: [{
|
||||||
|
value: 'axure',
|
||||||
|
label: 'Axure Components'
|
||||||
|
}, {
|
||||||
|
value: 'sketch',
|
||||||
|
label: 'Sketch Templates'
|
||||||
|
}, {
|
||||||
|
value: 'jiaohu',
|
||||||
|
label: '组件交互文档'
|
||||||
|
}]
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
beforeMount () { },
|
||||||
|
mounted () { },
|
||||||
|
methods: {},
|
||||||
|
watch: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang='' scoped>
|
||||||
|
</style>
|
||||||
@ -1,5 +1,63 @@
|
|||||||
|
<!-- -->
|
||||||
<template>
|
<template>
|
||||||
<div class="staff-archives">
|
<div class="staff-archives">
|
||||||
员工概况
|
<el-card>
|
||||||
|
<query-form />
|
||||||
|
</el-card>
|
||||||
|
<el-card>
|
||||||
|
<employees-number />
|
||||||
|
</el-card>
|
||||||
|
<el-card>
|
||||||
|
<div class="staff-archives-chart">
|
||||||
|
<chart-form v-for="i in 10" />
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import chartForm from './componments/chart-form'
|
||||||
|
import queryForm from './componments/query-form'
|
||||||
|
import employeesNumber from './componments/employees-number'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
chartForm,
|
||||||
|
queryForm,
|
||||||
|
employeesNumber
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
beforeMount () { },
|
||||||
|
mounted () { },
|
||||||
|
methods: {},
|
||||||
|
watch: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style >
|
||||||
|
.el-card {
|
||||||
|
margin: 0 0 7px 0 !important;
|
||||||
|
}
|
||||||
|
.staff-archives {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.staff-archives-title {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.staff-archives-form {
|
||||||
|
margin: 20px 0 0 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style lang="scss">
|
||||||
|
.staff-archives-chart {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -6,7 +6,8 @@
|
|||||||
v-model="mainTabsActiveName"
|
v-model="mainTabsActiveName"
|
||||||
:closable="true"
|
:closable="true"
|
||||||
@tab-click="selectedTabHandle"
|
@tab-click="selectedTabHandle"
|
||||||
@tab-remove="removeTabHandle">
|
@tab-remove="removeTabHandle"
|
||||||
|
>
|
||||||
<el-dropdown class="site-tabs__tools" :show-timeout="0">
|
<el-dropdown class="site-tabs__tools" :show-timeout="0">
|
||||||
<i class="el-icon-arrow-down el-icon--right"></i>
|
<i class="el-icon-arrow-down el-icon--right"></i>
|
||||||
<el-dropdown-menu slot="dropdown">
|
<el-dropdown-menu slot="dropdown">
|
||||||
@ -16,21 +17,33 @@
|
|||||||
<el-dropdown-item @click.native="refresh()">刷新当前标签页</el-dropdown-item>
|
<el-dropdown-item @click.native="refresh()">刷新当前标签页</el-dropdown-item>
|
||||||
</el-dropdown-menu>
|
</el-dropdown-menu>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
<el-tab-pane
|
<el-tab-pane v-for="item in mainTabs" :key="item.name" :label="item.title" :name="item.name">
|
||||||
v-for="item in mainTabs"
|
<component :is="$route.meta.isNoCard?'div':'el-card'" :body-style="siteContentViewHeight">
|
||||||
:key="item.name"
|
|
||||||
:label="item.title"
|
|
||||||
:name="item.name">
|
|
||||||
<el-card :body-style="siteContentViewHeight">
|
|
||||||
<iframe
|
<iframe
|
||||||
v-if="item.type === 'iframe'"
|
v-if="item.type === 'iframe'"
|
||||||
:src="item.iframeUrl"
|
:src="item.iframeUrl"
|
||||||
width="100%" height="100%" frameborder="0" scrolling="yes">
|
width="100%"
|
||||||
</iframe>
|
height="100%"
|
||||||
|
frameborder="0"
|
||||||
|
scrolling="yes"
|
||||||
|
></iframe>
|
||||||
<keep-alive v-else>
|
<keep-alive v-else>
|
||||||
<router-view v-if="item.name === mainTabsActiveName" />
|
<router-view v-if="item.name === mainTabsActiveName" />
|
||||||
</keep-alive>
|
</keep-alive>
|
||||||
</el-card>
|
</component>
|
||||||
|
<!-- <el-card :body-style="siteContentViewHeight">
|
||||||
|
<iframe
|
||||||
|
v-if="item.type === 'iframe'"
|
||||||
|
:src="item.iframeUrl"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
frameborder="0"
|
||||||
|
scrolling="yes"
|
||||||
|
></iframe>
|
||||||
|
<keep-alive v-else>
|
||||||
|
<router-view v-if="item.name === mainTabsActiveName" />
|
||||||
|
</keep-alive>
|
||||||
|
</el-card>-->
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
<!-- 主入口标签页 e -->
|
<!-- 主入口标签页 e -->
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user