This commit is contained in:
杜建超 2020-09-27 17:58:06 +08:00
parent a6fcea59b2
commit c85e45aa38
2 changed files with 347 additions and 0 deletions

View File

@ -0,0 +1,152 @@
<!-- -->
<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-input
placeholder="请选择部门"
@focus="isChoose=true"
readonly
:value="formInline.departmentName"
></el-input>
</el-form-item>
<el-form-item :label="`选择月份`">
<el-date-picker
type="month"
placeholder="选择月份"
v-model="selectMonthTime"
value-format="yyyy-MM"
@change="changeApplyMonth"
>
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
<el-button type="primary" @click="restValue">重置</el-button>
</el-form-item>
</el-form>
<el-dialog title="选择部门" :visible.sync="isChoose" width="30%">
<el-tree :data="menuList" :props="defaultProps" @node-click="handleNodeClick">
<span class="custom-tree-node" slot-scope="{ node, data }">
<span>{{ data.departmentName }}</span>
<span>({{ data.memberCount }})</span>
</span>
</el-tree>
<span slot="footer" class="dialog-footer">
<el-button size="mini" @click="isChoose = false"> </el-button>
<el-button type="primary" size="mini" @click="onsumbit"> </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { apiDepartmentSelfList } from '@/api/api_report'
export default {
props: {
monthTime: {
type: String,
default: ''
}
},
data () {
return {
selectMonthTime: this.nowDate(),
isChooseObj: {},
isChoose: false,
menuList: [],
defaultProps: {
children: 'list',
label: 'name'
},
formInline: {
value: []
}
}
},
computed: {},
beforeMount () { },
created () {
this.handleGetMenuList()
this.handleChangeData()
},
mounted () {},
beforeUpdate () {
// this.selectMonthTime = this.monthTime
},
methods: {
async handleChangeData () {
this.onSubmit()
},
//
async handleGetMenuList () {
let result = await apiDepartmentSelfList()
this.menuList = result.data
},
//
changeApplyMonth (val) {
this.$emit('listenQuery')
this.selectMonthTime = val
console.log(val)
},
onSubmit () {
let obj = {
departmentId: this.formInline.departmentId,
selectMonthTime: this.selectMonthTime
}
this.$emit('submit', obj)
},
restValue () {
this.formInline = {}
this.selectMonthTime = ''
},
onsumbit () {
this.formInline = Object.assign({}, this.formInline, this.isChooseObj)
this.isChoose = false
},
handleNodeClick (a, b) {
this.isChooseObj = {
departmentId: a.departmentId,
departmentName: a.departmentName
}
},
nowDate () {
var data = new Date()
var month = data.getMonth() < 9 ? '0' + (data.getMonth() + 1) : data.getMonth() + 1
return data.getFullYear() + '-' + month
},
resetPage () {
this.$emit('listenQuery')
}
},
watch: {}
}
</script>
<style lang='scss'>
.el-range-separator {
width: 7% !important;
}
.el-input__icon {
transition: all 0.5s;
}
.staff-archives-choose {
margin: 2px;
height: 200px;
overflow: auto;
transition: all 0.3s;
position: relative;
border: 1px solid #dcdfe6;
}
.staff-archives-choose1 {
height: 0px;
opacity: 0;
overflow: hidden;
}
</style>

View File

@ -0,0 +1,195 @@
<template>
<div class="mod-config">
<el-card class="mod-config">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="handleGetTableList()">
<query-form @submit="submit" v-on:listenQuery="initPage"/>
</el-form>
<el-table
:data="dataList"
border
v-loading="dataListLoading"
style="width: 100%">
<el-table-column
prop="businessLine"
header-align="center"
align="center"
width="150"
label="业务线">
</el-table-column>
<el-table-column
prop="departmentId"
header-align="center"
align="center"
width="150"
label="序号">
</el-table-column>
<el-table-column
prop="departmentName"
header-align="center"
align="center"
width="150"
label="部门">
</el-table-column>
<el-table-column
prop="level1"
header-align="center"
align="center"
width="100"
label="3.25">
</el-table-column>
<el-table-column
prop="level2"
header-align="center"
align="center"
width="100"
label="3.5-">
</el-table-column>
<el-table-column
prop="level3"
header-align="center"
align="center"
width="100"
label="3.5">
</el-table-column>
<el-table-column
prop="level4"
header-align="center"
align="center"
width="100"
label="3.5+">
</el-table-column>
<el-table-column
prop="level5"
header-align="center"
align="center"
width="100"
label="3.75-">
</el-table-column>
<el-table-column
prop="level6"
header-align="center"
align="center"
width="100"
label="3.75">
</el-table-column>
<el-table-column
prop="level7"
header-align="center"
align="center"
width="100"
label="3.75+">
</el-table-column>
<el-table-column
prop="level8"
header-align="center"
align="center"
width="100"
label="4">
</el-table-column>
</el-table>
<el-pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
:total="totalPage"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</el-card>
</div>
</template>
<script>
import { apiResultDistribution } from '@/api/api_report'
import queryForm from './componments/query-form'
export default {
data () {
return {
dataForm: {
key: ''
},
imageSrc: '',
dataList: [],
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
selectionDataList: [],
departmentId: '',
selectMonthTime: ''
}
},
created () {
this.handleGetTableList()
},
components: {
queryForm
},
methods: {
//
async handleGetTableList () {
const loading = this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
})
apiResultDistribution({
'currPage': this.pageIndex,
'pageSize': this.pageSize,
'departmentId': this.departmentId,
'selectMonthTime': this.selectMonthTime
}).then(res => {
if (res && res.code === 0) {
this.dataList = res.page.list
this.totalPage = res.page.totalCount
} else {
this.dataList = []
this.totalPage = 0
}
setTimeout(() => {
loading.close()
}, 500)
this.dataListLoading = false
})
},
//
sizeChangeHandle (val) {
this.pageSize = val
this.pageIndex = 1
this.handleGetTableList()
},
//
currentChangeHandle (val) {
this.pageIndex = val
this.handleGetTableList()
},
submit (data) {
this.departmentId = data.departmentId
this.selectMonthTime = data.selectMonthTime
this.handleGetTableList()
},
initPage () {
this.pageIndex = 1
this.pageSize = 10
console.log('int page')
}
}
}
</script>
<style>
</style>