|
|
@@ -0,0 +1,291 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-alert class="diy-tip" @close="tips_close" v-show="tips_show" type="success" description>
|
|
|
+ <p>A分余额在线下兑换/使用过后，由管理员手动结算清零；</p>
|
|
|
+ <p>清零操作为全员批量清除，请谨慎操作！</p>
|
|
|
+ <p>每次清零将清空指定月份之前的余额（不含指定月份），不可清空未结束月份的余额：</p>
|
|
|
+ <p>例如当前是2020年7月8号，指定选择2020年7月份，可清空2020年7月1号之前所有余额，不清除7月1-8号的余额。</p>
|
|
|
+ </el-alert>
|
|
|
+
|
|
|
+ <div class="box boxMinHeight">
|
|
|
+ <el-tabs v-model="active">
|
|
|
+ <el-tab-pane label="A分余额" name="balanceA"></el-tab-pane>
|
|
|
+ <el-tab-pane label="清空记录" name="clearLog"></el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+
|
|
|
+ <el-form :inline="true" v-if="active == 'balanceA'">
|
|
|
+ <el-form-item label="部门">
|
|
|
+ <el-cascader class="date-picker-width" v-model="dept_name" :options="dept_tree" ref="dept" clearable filterable change-on-select placeholder="全公司"></el-cascader>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item>
|
|
|
+ <el-input v-model="formData.keyword" placeholder="输入同事姓名" max="200" @keyup.enter.native="getList()" class="persons_name">
|
|
|
+ <el-button slot="append" icon="el-icon-search" @click="getList()"></el-button>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item style="float: right;"><el-button type="primary" @click="clearAPointShow = true">清空A分余额</el-button></el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <el-table :data="list" style="width: 100%" v-if="active == 'balanceA'" v-loading="loading">
|
|
|
+ <el-table-column label="姓名" prop="name" width="250">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="flex-box-ce">
|
|
|
+ <userImage class="fl" :id="scope.row.id" :user_name="scope.row.name" :img_url="scope.row.img_url" width="50px" height="50px"></userImage>
|
|
|
+ <span style="line-height: 50px; padding-left: 10px;">{{ scope.row.name }}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="A分余额" prop="balance_a"></el-table-column>
|
|
|
+ <template slot="empty">
|
|
|
+ <noData></noData>
|
|
|
+ </template>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <el-table :data="list" style="width: 100%" v-else v-loading="loading">
|
|
|
+ <el-table-column label="操作人" prop="name" width="250">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="flex-box-ce">
|
|
|
+ <userImage class="fl" :id="scope.row.id" :user_name="scope.row.name" :img_url="scope.row.img_url" width="50px" height="50px"></userImage>
|
|
|
+ <span style="line-height: 50px; padding-left: 10px;">{{ scope.row.name }}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="内容" prop="remark"></el-table-column>
|
|
|
+ <el-table-column prop="create_time" label="时间"></el-table-column>
|
|
|
+ <template slot="empty">
|
|
|
+ <noData></noData>
|
|
|
+ </template>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <center style="padding: 20px 0;">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :page-sizes="[10, 20, 50, 100]"
|
|
|
+ layout="total, sizes, prev, pager, next"
|
|
|
+ :page-size="formData.page_size"
|
|
|
+ :current-page="formData.page"
|
|
|
+ :total="total"
|
|
|
+ ></el-pagination>
|
|
|
+ </center>
|
|
|
+
|
|
|
+ <el-dialog title="清空A分余额" :visible.sync="clearAPointShow" width="500px" @close="clearAPointClose('popupForm')">
|
|
|
+ <el-form :model="popupForm" ref="popupForm">
|
|
|
+ <el-form-item prop="month" :rules="[{ required: true, message: '请选择月份', trigger: 'blur' }]">
|
|
|
+ <el-col :span="3">清空</el-col>
|
|
|
+ <el-col :span="8"><el-date-picker style="width: 100%" v-model="popupForm.month" value-format="yyyy-MM" type="month" placeholder="请选择月份"></el-date-picker></el-col>
|
|
|
+ <el-col :span="6">之前的A分</el-col>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <span slot="footer">
|
|
|
+ <el-button @click="resetForm('popupForm')">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="onSubmit('popupForm')">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import noData from '@/components/noData';
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ active: 'balanceA',
|
|
|
+ loading: false,
|
|
|
+ tips_show: false,
|
|
|
+ clearAPointShow: false,
|
|
|
+ list: null,
|
|
|
+ total: null,
|
|
|
+ dept_name: '',
|
|
|
+ formData: {
|
|
|
+ keyword: '',
|
|
|
+ dept_id: '0',
|
|
|
+ page: 1,
|
|
|
+ page_size: 10
|
|
|
+ },
|
|
|
+ dept_tree: null,
|
|
|
+ popupForm: {
|
|
|
+ month: ''
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ dept_name(val) {
|
|
|
+ this.formData.dept_id = val[val.length - 1];
|
|
|
+ this.$refs.dept.dropDownVisible = false;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ active(val) {
|
|
|
+ this.list = [];
|
|
|
+ this.formData = {
|
|
|
+ keyword: '',
|
|
|
+ dept_id: '0',
|
|
|
+ page: 1,
|
|
|
+ page_size: 10
|
|
|
+ };
|
|
|
+ val == 'balanceA' ? this.getList() : this.getLog();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ components: {noData},
|
|
|
+ methods: {
|
|
|
+ resetForm(formName) {
|
|
|
+ this.clearAPointShow = false;
|
|
|
+ this.$refs[formName].resetFields();
|
|
|
+ },
|
|
|
+ // 清空数据
|
|
|
+ onSubmit(formName) {
|
|
|
+ this.$refs[formName].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.$axios('post', '/api/integral/site/a/clear', this.popupForm)
|
|
|
+ .then(res => {
|
|
|
+ if (res.data.code == 1) {
|
|
|
+ this.$message.success('清除成功');
|
|
|
+ this.resetForm(formName);
|
|
|
+ this.getList();
|
|
|
+ this.clearAPointShow = false;
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.data.data.msg);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 关闭弹窗
|
|
|
+ clearAPointClose(formName) {
|
|
|
+ this.$refs[formName].resetFields();
|
|
|
+ },
|
|
|
+ // 提示信息
|
|
|
+ tips_close() {
|
|
|
+ localStorage.setItem('balanceA_tips', 'true');
|
|
|
+ this.tips_show = false;
|
|
|
+ },
|
|
|
+ // 页码变更
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.formData.page = val;
|
|
|
+ this.active == 'balanceA' ? this.getList() : this.getLog();
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.formData.page_size = val;
|
|
|
+ this.active == 'balanceA' ? this.getList() : this.getLog();
|
|
|
+ },
|
|
|
+ // 获取列表
|
|
|
+ getList() {
|
|
|
+ let self = this;
|
|
|
+ self.loading = true;
|
|
|
+ self.$axios('get', '/api/integral/site/a/balance', this.formData)
|
|
|
+ .then(res => {
|
|
|
+ if (res.data.code == 1) {
|
|
|
+ self.list = res.data.data.list;
|
|
|
+ self.total = res.data.data.total;
|
|
|
+ } else {
|
|
|
+ self.$message.error(res.data.data.msg);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ self.$message.error(e.data.data.msg);
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ self.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 获取日志列表
|
|
|
+ getLog() {
|
|
|
+ let self = this;
|
|
|
+ self.loading = true;
|
|
|
+ let data = {
|
|
|
+ page: this.formData.page,
|
|
|
+ page_size: this.formData.page_size
|
|
|
+ };
|
|
|
+ self
|
|
|
+ .$axios('get', '/api/integral/site/a/logs', data)
|
|
|
+ .then(res => {
|
|
|
+ if (res.data.code == 1) {
|
|
|
+ self.list = res.data.data.list;
|
|
|
+ self.total = res.data.data.total;
|
|
|
+ } else {
|
|
|
+ self.$message.error(res.data.data.msg);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ self.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 递归判断列表，把最后的children设为undefined
|
|
|
+ getTreeData(data) {
|
|
|
+ for (var i = 0; i < data.length; i++) {
|
|
|
+ if (data[i].children.length < 1) {
|
|
|
+ // children若为空数组，则将children设为undefined
|
|
|
+ data[i].children = undefined;
|
|
|
+ } else {
|
|
|
+ // children若不为空数组，则继续 递归调用 本方法
|
|
|
+ this.getTreeData(data[i].children);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ if (localStorage.getItem('dept_tree')) {
|
|
|
+ this.dept_tree = this.getTreeData(JSON.parse(localStorage.getItem('dept_tree')));
|
|
|
+ }
|
|
|
+ if (localStorage.getItem('balanceA_tips')) {
|
|
|
+ this.tips_show = false;
|
|
|
+ } else {
|
|
|
+ this.tips_show = true;
|
|
|
+ }
|
|
|
+ this.getList();
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style scoped lang="scss">
|
|
|
+.box {
|
|
|
+ background-color: #ffffff;
|
|
|
+ padding: 20px;
|
|
|
+}
|
|
|
+.listData {
|
|
|
+ position: relative;
|
|
|
+ display: table-cell;
|
|
|
+ margin: 0 !important;
|
|
|
+ padding: 20px;
|
|
|
+ min-height: 600px;
|
|
|
+ &::after {
|
|
|
+ content: ' ';
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ width: 1px;
|
|
|
+ background: #ebeef5;
|
|
|
+ }
|
|
|
+ & .groups_name {
|
|
|
+ display: block;
|
|
|
+ font-size: 20px;
|
|
|
+ color: rgb(48, 49, 51);
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+}
|
|
|
+::v-deep .el-menu-item {
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ &.is-active {
|
|
|
+ background-color: #ecf5ff;
|
|
|
+ }
|
|
|
+}
|
|
|
+.diy-tip {
|
|
|
+ margin-bottom: 15px;
|
|
|
+ border: 1px solid #67c23a;
|
|
|
+ padding: 20px 16px;
|
|
|
+ p {
|
|
|
+ color: #67c23a !important;
|
|
|
+ font-size: 14px;
|
|
|
+ margin: 0 !important;
|
|
|
+ padding: 4px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
347617796@qq.com