考核结果提交

GuLiMmo

2024-01-08 035f6b8494db842ae4d1e8ccd72244834d1cf59a

考核结果提交

 src/views/evaluate/components/firstRoundResult.vue

New file
@@ -0,0 +1,106 @@
<template>
    <avue-crud v-model:page="page" :option="option" :table-loading="loading" :data="data" @current-change="currentChange"
        @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
    </avue-crud>
</template>

<script>
import { getCandidateResult } from '@/api/evaluate/evaluateTask'

export default {
    props: {
        params: {
            type: Object,
            default: () => {
                return {
                    data: {}
                }
            }
        }
    },
    data() {
        return {
            loading: true,
            query: {},
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            option: {
                height: '400',
                calcHeight: 30,
                tip: false,
                searchShow: true,
                searchMenuSpan: 6,
                border: true,
                index: true,
                viewBtn: false,
                addBtn: false,
                editBtn: false,
                delBtn: false,
                viewBtn: false,
                header: false,
                menuWidth: 150,
                dialogClickModal: false,
                column: [
                    {
                        label: '姓名',
                        prop: 'user_name',
                        type: 'input'
                    },
                    {
                        label: '部门',
                        prop: 'user_name',
                        type: 'input'
                    },
                    {
                        label: '职位',
                        prop: 'dept_name',
                        type: 'input'
                    },
                    {
                        label: '票数',
                        prop: 'voteNum',
                        type: 'input'
                    },
                ]
            },
            data: []
        }
    },
    methods: {
        currentChange(currentPage) {
            this.page.currentPage = currentPage;
        },
        sizeChange(pageSize) {
            this.page.pageSize = pageSize;
        },
        refreshChange() {
            this.onLoad(this.page, this.query);
        },
        onLoad(page, params = {}) {
            this.loading = true;

            const { id } = this.params.data

            const {
            } = this.query;

            let values = {
                ...this.query,
                ...params
            };
            getCandidateResult(page.currentPage, page.pageSize, id).then(res => {
                const data = res.data.data;
                this.page.total = data.total;
                this.data = data.records;
                this.loading = false;
                this.selectionClear();
            });
        },
    }
}
</script>

<style lang="scss" scoped></style>

 src/views/evaluate/components/secondRoundResult.vue

New file
@@ -0,0 +1,106 @@
<template>
    <avue-crud v-model:page="page" :option="option" :table-loading="loading" :data="data" @current-change="currentChange"
        @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
    </avue-crud>
</template>

<script>
import { getCandidateResult } from '@/api/evaluate/evaluateTask'

export default {
    props: {
        params: {
            type: Object,
            default: () => {
                return {
                    data: {}
                }
            }
        }
    },
    data() {
        return {
            loading: true,
            query: {},
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            option: {
                height: '400',
                calcHeight: 30,
                tip: false,
                searchShow: true,
                searchMenuSpan: 6,
                border: true,
                index: true,
                viewBtn: false,
                addBtn: false,
                editBtn: false,
                delBtn: false,
                viewBtn: false,
                header: false,
                menuWidth: 150,
                dialogClickModal: false,
                column: [
                    {
                        label: '姓名',
                        prop: 'user_name',
                        type: 'input'
                    },
                    {
                        label: '部门',
                        prop: 'user_name',
                        type: 'input'
                    },
                    {
                        label: '职位',
                        prop: 'dept_name',
                        type: 'input'
                    },
                    {
                        label: '票数',
                        prop: 'voteNum',
                        type: 'input'
                    },
                ]
            },
            data: []
        }
    },
    methods: {
        currentChange(currentPage) {
            this.page.currentPage = currentPage;
        },
        sizeChange(pageSize) {
            this.page.pageSize = pageSize;
        },
        refreshChange() {
            this.onLoad(this.page, this.query);
        },
        onLoad(page, params = {}) {
            this.loading = true;

            const { id } = this.params.data

            const {
            } = this.query;

            let values = {
                ...this.query,
                ...params
            };
            getCandidateResult(page.currentPage, page.pageSize, id).then(res => {
                const data = res.data.data;
                this.page.total = data.total;
                this.data = data.records;
                this.loading = false;
                this.selectionClear();
            });
        },
    }
}
</script>

<style lang="scss" scoped></style>

 src/views/evaluate/evaluateResult.vue

@@ -1,256 +1,157 @@
<template>

  <basic-container>

    <avue-tabs :option="taskTypeList" @change="tabChange"></avue-tabs>

    <avue-crud :option="option" v-model:search="search" v-model:page="page" v-model="form" :table-loading="loading"

      :data="data" :permission="permissionList" :before-open="beforeOpen" ref="crud" @row-update="rowUpdate"

      @row-save="rowSave" @row-del="rowDel" @search-change="searchChange" @search-reset="searchReset"

      @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"

      @refresh-change="refreshChange" @on-load="onLoad">

      <template #referrer="{row}">

        <template v-if="row.voteNum !== 0">

          <referrerPopover :params="row">

            <template #default>

              <el-button type="success" text icon="el-icon-pointer">推荐人预览</el-button>

            </template>

          </referrerPopover>

    <el-container class="container">

      <el-aside width="250px">

        <el-input v-model="taskWord" class="search-box" clearable placeholder="请输入任务名称">

          <template #append>

            <el-button icon="el-icon-search"></el-button>

          </template>

        </el-input>

        <ul class="aside-box">

          <template v-if="this.taskList.length > 0">

            <li v-for="(item, index) in this.taskList" :key="item.id" :class="{ 'is-active': taskActive === index }"

              @click="handleActive(index)">

              <div class="text">

                <el-icon size="20px">

                  <Document />

                </el-icon>

                {{ item.taskName }}

              </div>

            </li>

          </template>

          <template v-else>

            <el-empty description="暂无任务" />

          </template>

        </ul>

        <div class="pagination">

          <el-pagination v-model:current-page="page.current" v-model:page-size="page.size" background pager-count="3"

            layout="prev, pager, next" :total="page.total" @size-change="handleSizeChange" small hide-on-single-page

            @current-change="handleCurrentChange" />

        </div>

      </el-aside>

      <el-main>

        <template v-if="this.taskList.length > 0">

          <el-collapse v-model="activeNames">

            <el-collapse-item title="第一轮评优结果" name="1">

              <firstRoundResult :params="{ data: taskList[taskActive] }" />

            </el-collapse-item>

            <el-collapse-item title="第二轮评优结果" name="2">

              <secondRoundResult :params="{ data: taskList[taskActive] }" />

            </el-collapse-item>

          </el-collapse>

        </template>

        <template v-else>

            <el-button type="warning" text icon="el-icon-circle-close">暂无推荐人</el-button>

          <el-empty description="暂无任务信息" />

        </template>

      </template>

    </avue-crud>

      </el-main>

    </el-container>

  </basic-container>

</template>



<script>

import { getList, getDetail, add, update, remove } from "@/api/evaluate/evaluateResult";

import { option, personColumn, sectionColumn } from "@/option/evaluate/evaluateResult";

import { mapGetters } from "vuex";

import { exportBlob } from "@/api/common";

import { getToken } from '@/utils/auth';

import { downloadXls } from "@/utils/util";

import { dateNow } from "@/utils/date";

import NProgress from 'nprogress';

import 'nprogress/nprogress.css';

import referrerPopover from './components/referrerPopover.vue'

import { getList } from '@/api/evaluate/evaluateTask'

import firstRoundResult from './components/firstRoundResult.vue'

import secondRoundResult from './components/secondRoundResult.vue'



export default {

  components: {

    referrerPopover

    firstRoundResult,

    secondRoundResult

  },

  data() {

    return {

      form: {},

      query: {},

      search: {},

      loading: true,

      activeNames: ['1'],

      taskList: [],

      taskWord: '',

      taskActive: 0,

      page: {

        pageSize: 10,

        currentPage: 1,

        current: 1,

        size: 10,

        total: 0

      },

      selectionList: [],

      option: option,

      data: [],

      // 考核结果参数

      defaultTaskType: 0,

      taskTypeList: {

        column: [

          {

            label: '个人评优结果',

            label: '个人评优',

            prop: 0,

          },

          {

            label: '部门评优结果',

            label: '部门评优',

            prop: 1,

          },

        ],

      },

    };

  },

  computed: {

    ...mapGetters(["permission"]),

    permissionList() {

      return {

        addBtn: this.validData(this.permission.evaluateResult_add, false),

        viewBtn: this.validData(this.permission.evaluateResult_view, false),

        delBtn: this.validData(this.permission.evaluateResult_delete, false),

        editBtn: this.validData(this.permission.evaluateResult_edit, false)

      };

    },

    ids() {

      let ids = [];

      this.selectionList.forEach(ele => {

        ids.push(ele.id);

      });

      return ids.join(",");

    }

  },

  watch: {

    defaultTaskType: {

      handler(n) {

        this.query = {};

        this.query['type'] = n;

        let params = {

          type: n,

        };

        console.log(option.column.length);

        if (n) {

          this.option.column = sectionColumn

        } else {

          this.option.column = personColumn

        }

        this.page.currentPage = 1;

        this.onLoad(this.page, params);

      },

      immediate: true,

    },

  },

  methods: {

    rowSave(row, done, loading) {

      add(row).then(() => {

        this.onLoad(this.page);

        this.$message({

          type: "success",

          message: "操作成功!"

        });

        done();

      }, error => {

        loading();

        window.console.log(error);

      });

    initData() {

      this.getTaskList()

    },

    rowUpdate(row, index, done, loading) {

      update(row).then(() => {

        this.onLoad(this.page);

        this.$message({

          type: "success",

          message: "操作成功!"

        });

        done();

      }, error => {

        loading();

        console.log(error);

      });

    },

    rowDel(row) {

      this.$confirm("确定将选择数据删除?", {

        confirmButtonText: "确定",

        cancelButtonText: "取消",

        type: "warning"

      })

        .then(() => {

          return remove(row.id);

        })

        .then(() => {

          this.onLoad(this.page);

          this.$message({

            type: "success",

            message: "操作成功!"

          });

        });

    },

    handleDelete() {

      if (this.selectionList.length === 0) {

        this.$message.warning("请选择至少一条数据");

        return;

    getTaskList() {

      const { current, size } = this.page

      const values = {

        type: this.defaultTaskType

      }

      this.$confirm("确定将选择数据删除?", {

        confirmButtonText: "确定",

        cancelButtonText: "取消",

        type: "warning"

      getList(current, size, values).then(res => {

        const result = res.data.data

        this.page.total = result.total

        this.taskList = result.records

      })

        .then(() => {

          return remove(this.ids);

        })

        .then(() => {

          this.onLoad(this.page);

          this.$message({

            type: "success",

            message: "操作成功!"

          });

          this.$refs.crud.toggleSelection();

        });

    },

    handleExport() {

      let downloadUrl = `/evaluate/evaluateResult/export-evaluateResult?${this.website.tokenHeader}=${getToken()}`;

      const {

      } = this.query;

      let values = {

      };

      this.$confirm("是否导出数据?", "提示", {

        confirmButtonText: "确定",

        cancelButtonText: "取消",

        type: "warning"

      }).then(() => {

        NProgress.start();

        exportBlob(downloadUrl, values).then(res => {

          downloadXls(res.data, `评优结果${dateNow()}.xlsx`);

          NProgress.done();

        })

      });

    },

    beforeOpen(done, type) {

      if (["edit", "view"].includes(type)) {

        getDetail(this.form.id).then(res => {

          this.form = res.data.data;

        });

      }

      done();

    },

    searchReset() {

      this.query = {};

      this.onLoad(this.page);

    },

    searchChange(params, done) {

      this.query = {

        type: this.defaultTaskType,

        ...params

      };

      this.page.currentPage = 1;

      this.onLoad(this.page, params);

      done();

    },

    selectionChange(list) {

      this.selectionList = list;

    },

    selectionClear() {

      this.selectionList = [];

      this.$refs.crud.toggleSelection();

    },

    currentChange(currentPage) {

      this.page.currentPage = currentPage;

    },

    sizeChange(pageSize) {

      this.page.pageSize = pageSize;

    },

    refreshChange() {

      this.onLoad(this.page, this.query);

    },

    onLoad(page, params = {}) {

      this.loading = true;



      const {

      } = this.query;



      let values = {

        ...this.query,

        ...params

      };



      getList(page.currentPage, page.pageSize, values).then(res => {

        const data = res.data.data;

        this.page.total = data.total;

        this.data = data.records;

        this.loading = false;

        this.selectionClear();

      });

    },

    tabChange(value) {

      this.defaultTaskType = value.prop;

    },

      this.getTaskList()

    }

  },

  mounted() {

    this.initData()

  }

};

}

</script>



<style></style>

<style lang="scss" scoped>

.container {

  .el-aside {

    margin-right: 10px;

    padding-right: 10px;

    border-right: 1px solid var(--el-card-border-color);



    .aside-box {

      list-style: none;

      padding: 0;

      margin: 0;



      li {

        cursor: pointer;

        padding: 10px 0;

        margin-top: 10px;



        .text {

          display: flex;

          align-items: center;

          border-left: 3px solid var(--el-color-primary);

          padding-left: 10px;

        }



        .el-icon {

          margin-right: 5px;

        }

      }

    }



    .pagination {

      margin-top: 10px;

      display: flex;

      justify-content: center;

    }

  }



}



.is-active {

  color: var(--el-color-primary);

  background-color: rgba(var(--el-color-primary-rgb), .1);

}

</style>