You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
193 lines
7.6 KiB
193 lines
7.6 KiB
<template>
|
|
<div class="main-content">
|
|
<div class="area-form">
|
|
<el-form :inline="true" size="default">
|
|
<el-form-item label="员工名">
|
|
<el-input clearable v-model="form.name" placeholder="请输入"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="部门">
|
|
<el-input clearable v-model="form.department" placeholder="请输入"></el-input>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" @click="confirm">查 询</el-button>
|
|
<el-button @click="reset">重 置</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<el-button size="default" type="primary" @click="download">导出excel</el-button>
|
|
<div class="area-table">
|
|
<el-table :data="tableData.data" size="default" border :header-cell-style="{background: '#EEE'}">
|
|
<el-table-column prop="name" label="员工" width="240"></el-table-column>
|
|
<el-table-column prop="departmentList" label="部门" width="480">
|
|
<template #default="scope">
|
|
<el-tag style="margin-right: 8px" v-for="(item,index) in scope.row.departmentList" :key="index">
|
|
{{item.departmentName}}
|
|
</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="points" label="积分"></el-table-column>
|
|
<el-table-column prop="action" label="操作" fixed="right" width="240">
|
|
<template #default="scope">
|
|
<el-link type="primary" @click="pointDetail(scope.row.id)">积分明细</el-link>
|
|
<el-link type="primary" style="margin-left: 8px" @click="changePoint(scope.row.id)">修改积分</el-link>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-pagination
|
|
v-model:currentPage="pagination.current"
|
|
v-model:page-size="pagination.pageSize"
|
|
:page-sizes="[10, 20, 30, 40]"
|
|
background
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
:total="pagination.total"
|
|
/>
|
|
</div>
|
|
<el-dialog v-model="editVisible" width="30%" title="修改积分">
|
|
<el-form label-width="100px">
|
|
<el-form-item style="width:65%" size="default" label="修改类型">
|
|
<el-radio-group v-model="setForm.settlementMethod">
|
|
<el-radio :label="1">增加积分</el-radio>
|
|
<el-radio :label="2">扣除积分</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item style="width:65%" size="default" label="积分">
|
|
<el-input-number controls-position="right" v-model="setForm.points"></el-input-number>
|
|
</el-form-item>
|
|
<el-form-item style="width:80%" size="default" label="备注">
|
|
<el-input type="textarea" :rows="4" v-model="setForm.remarks" placeholder="请输入备注"></el-input>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<el-button @click="editClose">取消</el-button>
|
|
<el-button @click="editComfirm" type="primary">确定</el-button>
|
|
</template>
|
|
</el-dialog>
|
|
<el-drawer v-model="detailVisible" title="积分明细">
|
|
<el-table :data="detailData" size="default">
|
|
<el-table-column prop="createDate" width="200" label="日期"></el-table-column>
|
|
<el-table-column prop="settlementMethodDSC" label="明细">
|
|
<template #default="scope">
|
|
{{scope.row.settlementMethodDSC}}{{scope.row.points}}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="typeDSC" label="类型"></el-table-column>
|
|
<el-table-column prop="remarks" label="备注"></el-table-column>
|
|
</el-table>
|
|
<template #footer>
|
|
<el-button type="primary" @click="detailVisible = false" size="default">确定</el-button>
|
|
</template>
|
|
</el-drawer>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {defineComponent, reactive, ref, watch, getCurrentInstance} from 'vue'
|
|
import {statusFormatter} from './config.js'
|
|
export default defineComponent({
|
|
name: 'v-questList',
|
|
setup() {
|
|
const form = reactive({
|
|
name: undefined,
|
|
department: undefined,
|
|
});
|
|
const setForm = reactive({
|
|
userId: undefined,
|
|
settlementMethod: 1,
|
|
points: 0,
|
|
remarks: undefined,
|
|
})
|
|
const tableData = reactive({
|
|
data: [],
|
|
});
|
|
const detailData = ref([]);
|
|
const detailVisible = ref(false);
|
|
const pagination = reactive({
|
|
total: 0,
|
|
current: 1,
|
|
pageSize: 10
|
|
})
|
|
const editVisible = ref(false);
|
|
const { proxy } = getCurrentInstance();
|
|
return {
|
|
form,proxy,setForm,
|
|
tableData,pagination,editVisible,
|
|
detailData,detailVisible,
|
|
statusFormatter
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getData()
|
|
watch(() => (this.pagination.pageSize), () => {
|
|
this.getData()
|
|
});
|
|
watch(() => (this.pagination.current), () => {
|
|
this.getData()
|
|
})
|
|
},
|
|
methods: {
|
|
getData() {
|
|
let obj = Object.assign(this.form,{pageNum: this.pagination.current,pageSize: this.pagination.pageSize})
|
|
this.proxy.$post("/user/list", obj).then(res => {
|
|
if(res.code == 200) {
|
|
const data = res.data
|
|
this.tableData.data = data.records;
|
|
this.pagination.total = data.total
|
|
} else {
|
|
this.$message.error(res.msg)
|
|
}
|
|
}).catch(() => {});
|
|
},
|
|
confirm() {
|
|
this.getData()
|
|
},
|
|
reset() {
|
|
this.form.name = undefined;
|
|
this.form.department = undefined;
|
|
this.getData();
|
|
},
|
|
changePoint(value) {
|
|
this.setForm.userId = value;
|
|
this.editVisible = true;
|
|
},
|
|
editClose() {
|
|
this.setForm.settlementMethod = 1;
|
|
this.setForm.points = 0;
|
|
this.setForm.remarks = undefined;
|
|
this.editVisible = false;
|
|
},
|
|
editComfirm() {
|
|
this.proxy.$post("/user/pointsTran", this.setForm).then(res => {
|
|
if(res.code == 200) {
|
|
this.$message.success('修改成功');
|
|
this.editClose();
|
|
this.getData();
|
|
} else {
|
|
this.$message.error(res.msg)
|
|
}
|
|
}).catch(() => {});
|
|
},
|
|
download() {
|
|
this.proxy.$download("/user/excel", this.form, '员工积分列表.xlsx').then(res => {
|
|
|
|
}).catch(() => {});
|
|
},
|
|
//积分明细
|
|
pointDetail(value) {
|
|
this.proxy.$post("/user/pointsRecords", {userId: value}).then(res => {
|
|
if(res.code == 200) {
|
|
this.detailData = res.data.records;
|
|
this.detailVisible = true;
|
|
} else {
|
|
this.$message.error(res.msg)
|
|
}
|
|
}).catch(() => {});
|
|
}
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.area-table {
|
|
margin-top: 16px
|
|
}
|
|
</style> |