|
|
@@ -1,928 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="box boxMinHeight">
|
|
|
- <el-alert class="bounce animated" type="warning" :title="alertTilte" :closable="false" show-icon
|
|
|
- style="width: 100%; margin-bottom: 10px;"></el-alert>
|
|
|
- <header class="header">
|
|
|
- <div class="header-content flex-box-ce">
|
|
|
- <!-- 返回按钮 -->
|
|
|
- <div class="flex-box-ce header-left">
|
|
|
- <el-tooltip class="item" effect="dark" :content="templateTitle" placement="bottom">
|
|
|
- <div>{{ templateTitle }}</div>
|
|
|
- </el-tooltip>
|
|
|
- <el-popover ref="popoverRef" placement="right" width="400" trigger="click">
|
|
|
- <div class="flex-box-ce">
|
|
|
- <el-input v-model="title" placeholder="请输入模板名称" size="small"></el-input>
|
|
|
- <el-button v-if="$getRole(1)" type="primary" size="small" style="margin-left: 10px;"
|
|
|
- @click="editTitle()">确定</el-button>
|
|
|
- </div>
|
|
|
- <i class="el-icon-edit" slot="reference" style="margin-left: 10px; color: #999;"></i>
|
|
|
- </el-popover>
|
|
|
- </div>
|
|
|
-
|
|
|
- <!-- 发布按钮 -->
|
|
|
- <div class="header-right">
|
|
|
- <el-button type="primary" size="small" @click="addData()">添加指标</el-button>
|
|
|
-
|
|
|
- <el-button type="danger" :disabled="!(multipleSelection && multipleSelection.length > 0)"
|
|
|
- @click="confirmDelete()" size="small">批量删除</el-button>
|
|
|
-
|
|
|
- <div class="flex-box-ce" style="margin-left: 10px; color: #999;">
|
|
|
- <el-popover placement="right" trigger="hover" class="popover" @show="showPopover">
|
|
|
- <div class="flex-box-ce" style="width: 200px; justify-content: space-between;">
|
|
|
- <el-checkbox v-model="checkAll" @change="checkAllChangeFn">全选</el-checkbox>
|
|
|
- <el-button type="text" @click="reset(true)">重置</el-button>
|
|
|
- </div>
|
|
|
- <div style="height: 1px; background-color: #DCDFE6; margin: 5px 0;"></div>
|
|
|
- <el-checkbox-group v-model="checkColumns" @change="changeColumns"
|
|
|
- style="width: 200px; display: flex; flex-direction: column;">
|
|
|
- <el-checkbox v-for="(item, key) in this.tableColumn" :label="item.label"
|
|
|
- :key="item.label"></el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- <div class="flex-box-ce" slot="reference">
|
|
|
- <el-button class="primaryBtn" icon="el-icon-s-tools" type="primary"
|
|
|
- size="mini">设置考核流程</el-button>
|
|
|
- </div>
|
|
|
- </el-popover>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </header>
|
|
|
-
|
|
|
- <div style="height: 1px; background-color: #DCDFE6; margin-top: 5px;"></div>
|
|
|
-
|
|
|
- <el-table :data="tableData" v-loading="loading" stripe style="width: 100%; margin-top: 10px;" border
|
|
|
- :header-cell-style="{ background: '#f5f7fa' }" @selection-change="handleSelectChange">
|
|
|
- <el-table-column type="selection"></el-table-column>
|
|
|
- <template v-for="item in tableColumn">
|
|
|
-
|
|
|
- <el-table-column v-if="item.isShow && item.label === '规则'" :key="item.prop" :prop="item.prop"
|
|
|
- :label="item.label" align="center" :min-width="item.width">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-tooltip v-if="scope.row.content" class="item" effect="dark" placement="top">
|
|
|
- <div v-html="scope.row.content" slot="content"
|
|
|
- style="max-width: 300px; white-space: pre-line;">
|
|
|
- </div>
|
|
|
- <div class="oneLine"
|
|
|
- @click="editContent(scope.$index, scope.row.content, scope.row.indicatorId)">
|
|
|
- {{ scope.row.content }}
|
|
|
- </div>
|
|
|
- </el-tooltip>
|
|
|
- <el-button v-else
|
|
|
- @click="editContent(scope.$index, scope.row.content, scope.row.indicatorId)">编辑规则</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
-
|
|
|
- <el-table-column v-else-if="item.isShow && ['目标', '权重(%)'].includes(item.label)" :key="item.prop"
|
|
|
- :prop="item.prop" :label="item.label" align="center" :min-width="item.width">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input v-model="scope.row[item.prop]" :placeholder="item.label" clearable
|
|
|
- @blur="handleEdit(item.prop, scope.row[item.prop], scope.row.indicatorId)"
|
|
|
- oninput="value=value.replace(/[^\d.]/g,'')"></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
-
|
|
|
- <el-table-column v-else-if="item.isShow && item.label === '计算公式'" prop="formulae" label="计算公式"
|
|
|
- align="center" min-width="130">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button @click="openFormula(scope.row, scope.$index)">
|
|
|
- {{ scope.row.expression && scope.row.expression.formulas.length > 0 ? `公式
|
|
|
- ${scope.row.expression.formulas.length} 条` : '公式' }}
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
-
|
|
|
- <el-table-column v-else-if="item.isShow && ['指标', '单位'].includes(item.label)" :key="item.prop"
|
|
|
- :prop="item.prop" :label="item.label" align="center" :min-width="item.width">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input v-model="scope.row[item.prop]" :placeholder="item.label" clearable
|
|
|
- @blur="handleEdit(item.prop, scope.row[item.prop], scope.row.indicatorId)"></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
-
|
|
|
- <el-table-column v-else-if="item.isShow && ['过程跟踪'].includes(item.label)" :key="item.prop"
|
|
|
- :prop="item.prop" :label="item.label" align="center" :min-width="item.width">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input v-model="scope.row[item.prop]" :placeholder="item.label" clearable
|
|
|
- @blur="handleEdit(item.prop, scope.row[item.prop], scope.row.indicatorId)"></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
-
|
|
|
- <el-table-column v-if="item.isShow && flowColumn.includes(item.label)" :key="item.prop"
|
|
|
- :prop="item.prop" :label="item.label" :render-header="(h, obj) => renderHeader(h, item, item.prop)"
|
|
|
- align="center" :min-width="item.width" fixed="right">
|
|
|
- <template slot-scope="scope">
|
|
|
- <template v-if="item.label === '确认目标'">
|
|
|
- <el-switch v-if="!scope.row.flow.nodes[0].enable" :value="scope.row.flow.nodes[0].enable"
|
|
|
- @input="handleStatusChange(-1, scope.row, 'targetConfirms')"></el-switch>
|
|
|
- <ShowDataComp v-else-if="scope.row.flow.nodes[0].enable && isDataShow"
|
|
|
- :show-data="scope.row.flow.nodes[0]" :select-nodes="scope.row"
|
|
|
- @btnClick="handleBtnClick" />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="item.label === '录入结果'">
|
|
|
- <el-switch v-if="!scope.row.flow.nodes[1].enable" :value="scope.row.flow.nodes[1].enable"
|
|
|
- @input="handleStatusChange(-1, scope.row, 'resultInput')"></el-switch>
|
|
|
- <ShowDataComp v-else-if="scope.row.flow.nodes[1].enable && isDataShow"
|
|
|
- :show-data="scope.row.flow.nodes[1]" :select-nodes="scope.row"
|
|
|
- @btnClick="handleBtnClick" />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="item.label === '自评'">
|
|
|
- <el-switch v-model="scope.row.flow.nodes[2].enable"
|
|
|
- @change="handleScoreSelf(scope.row, scope.$index)"></el-switch>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="item.label === '互评'">
|
|
|
- <el-switch :value="scope.row.flow.nodes[3].enable"
|
|
|
- @input="handleStatusChange(-1, scope.row, 'scoreEachOther')"></el-switch>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="item.label === '评分'">
|
|
|
- <el-switch v-if="!scope.row.flow.nodes[4].enable" :value="scope.row.flow.nodes[4].enable"
|
|
|
- @input="handleStatusChange(-1, scope.row, 'scores')"></el-switch>
|
|
|
- <ShowDataComp v-else-if="scope.row.flow.nodes[4].enable && isDataShow"
|
|
|
- :show-data="scope.row.flow.nodes[4]" :select-nodes="scope.row"
|
|
|
- @btnClick="handleBtnClick" />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="item.label === '审批'">
|
|
|
- <el-switch v-if="!scope.row.flow.nodes[5].enable" :value="scope.row.flow.nodes[5].enable"
|
|
|
- @input="handleStatusChange(-1, scope.row, 'reviews')"></el-switch>
|
|
|
- <ShowDataComp v-else-if="scope.row.flow.nodes[5].enable && isDataShow"
|
|
|
- :show-data="scope.row.flow.nodes[5]" :select-nodes="scope.row"
|
|
|
- @btnClick="handleBtnClick" />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="item.label === '抄送'">
|
|
|
- <el-switch v-if="!scope.row.flow.nodes[6].enable" :value="scope.row.flow.nodes[6].enable"
|
|
|
- @input="handleStatusChange(-1, scope.row, 'cc')"></el-switch>
|
|
|
- <ShowDataComp v-else-if="scope.row.flow.nodes[6].enable && isDataShow"
|
|
|
- :show-data="scope.row.flow.nodes[6]" :select-nodes="scope.row"
|
|
|
- @btnClick="handleBtnClick" />
|
|
|
- </template>
|
|
|
-
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </template>
|
|
|
-
|
|
|
- </el-table>
|
|
|
-
|
|
|
- <div style="height: 50px;"></div>
|
|
|
- <!-- <TiptapComp /> -->
|
|
|
- <!-- 编辑流程节点 -->
|
|
|
- <!-- <HandleNode v-if="currentIndicator" v-model="dialogVisible" :form-label="formLabel" :dialog-title="dialogTitle"
|
|
|
- :node-type="nodeType" :template-id="templateId" :select-nodes="selectNodes"
|
|
|
- :indicator-id="selectIndicatorId" @closeDialog="closeDialog" :tag-index="tagIndex"
|
|
|
- @onConfirm="finishHandle" /> -->
|
|
|
-
|
|
|
- <!-- 编辑计算公式 -->
|
|
|
- <FormulaComp v-if="showFormula" v-model="showFormula"
|
|
|
- :fixed-props="[{ key: 'target', name: '目标' }, { key: 'weight', name: '权重' }, { key: 'result', name: '结果值' }]"
|
|
|
- :expressions-props="currentIndicator.expression.formulas || []" @onConfirm="onFormulaConfirm" />
|
|
|
-
|
|
|
- <!-- 发布考核弹框 -->
|
|
|
- <PublishComp v-if="showPublish" v-model="showPublish" :template-ids="[templateId]"
|
|
|
- @onConfirm="onPubishConfirm" />
|
|
|
-
|
|
|
- <!-- 编辑规则 -->
|
|
|
- <EditContentComp v-if="showEditContent" v-model="showEditContent" :content="content"
|
|
|
- :indicator-id="selectIndicatorId" :template-id="templateId" @finishEdit="finishEditContent" />
|
|
|
-
|
|
|
- <!-- 批量修改流程节点 -->
|
|
|
- <BatchHandleNode v-if="batchHandleDialog" v-model="batchHandleDialog" :template-id="templateId"
|
|
|
- :form-label="formLabel" :dialog-title="dialogTitle" :node-type="nodeType" :handle-node="handleNode"
|
|
|
- @onConfirm="finishBatchHandle" />
|
|
|
-
|
|
|
- <!-- 编辑确认目标节点 -->
|
|
|
- <TargetConfirms v-if="targetConfirms" v-model="targetConfirms" :form-label="formLabel"
|
|
|
- :dialog-title="dialogTitle" :node-type="nodeType" :template-id="templateId" :select-nodes="selectNodes"
|
|
|
- :indicator-id="selectIndicatorId" @closeDialog="closeDialog" :tag-index="tagIndex"
|
|
|
- @onConfirm="finishHandle" />
|
|
|
-
|
|
|
- <!-- 编辑录入结果节点 -->
|
|
|
- <ResultInput v-if="resultInput" v-model="resultInput" :form-label="formLabel" :dialog-title="dialogTitle"
|
|
|
- :node-type="nodeType" :template-id="templateId" :select-nodes="selectNodes"
|
|
|
- :indicator-id="selectIndicatorId" @closeDialog="closeDialog" :tag-index="tagIndex"
|
|
|
- @onConfirm="finishHandle" />
|
|
|
-
|
|
|
- <!-- 编辑互评节点 -->
|
|
|
- <ScoreEachOther v-if="scoreEachOther" v-model="scoreEachOther" :form-label="formLabel"
|
|
|
- :dialog-title="dialogTitle" :node-type="nodeType" :template-id="templateId" :select-nodes="selectNodes"
|
|
|
- :indicator-id="selectIndicatorId" @closeDialog="closeDialog" :tag-index="tagIndex"
|
|
|
- @onConfirm="finishHandle" />
|
|
|
-
|
|
|
- <!-- 编辑评分节点 -->
|
|
|
- <Scores v-if="scores" v-model="scores" :form-label="formLabel" :dialog-title="dialogTitle" :node-type="nodeType"
|
|
|
- :template-id="templateId" :select-nodes="selectNodes" :indicator-id="selectIndicatorId"
|
|
|
- @closeDialog="closeDialog" :tag-index="tagIndex" @onConfirm="finishHandle" />
|
|
|
-
|
|
|
- <Reviews v-if="reviews" v-model="reviews" :form-label="formLabel" :dialog-title="dialogTitle"
|
|
|
- :node-type="nodeType" :template-id="templateId" :select-nodes="selectNodes"
|
|
|
- :indicator-id="selectIndicatorId" @closeDialog="closeDialog" :tag-index="tagIndex"
|
|
|
- @onConfirm="finishHandle" />
|
|
|
-
|
|
|
- <!-- 编辑审批节点 -->
|
|
|
- <CC v-if="cc" v-model="cc" :form-label="formLabel" :dialog-title="dialogTitle" :node-type="nodeType"
|
|
|
- :template-id="templateId" :select-nodes="selectNodes" :indicator-id="selectIndicatorId"
|
|
|
- @closeDialog="closeDialog" :tag-index="tagIndex" @onConfirm="finishHandle" />
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import { mapGetters } from 'vuex';
|
|
|
-import FormulaComp from '@/newPerformance/components/TemplateDetails/FormulaComp'; // 计算公式弹框
|
|
|
-import HandleNode from '@/newPerformance/components/TemplateDetails/HandleNode'; //单独设置流程节点弹框
|
|
|
-import PublishComp from '@/newPerformance/components/TemplateDetails/PublishComp'; // 发布考核弹框
|
|
|
-import ShowDataComp from '@/newPerformance/components/PublicComp/ShowData'; // 显示节点数据组件
|
|
|
-import EditContentComp from '@/newPerformance/components/TemplateDetails/EditContent'; // 编辑规则组件
|
|
|
-import BatchHandleNode from '@/newPerformance/components/TemplateDetails/BatchHandleNode'; // 批量设置流程节点
|
|
|
-import TargetConfirms from '@/newPerformance/components/TemplateDetails/TargetConfirms'; // 确认目标流程节点
|
|
|
-import ResultInput from '@/newPerformance/components/TemplateDetails/ResultInput'; // 结果录入流程节点
|
|
|
-import ScoreEachOther from '@/newPerformance/components/TemplateDetails/ScoreEachOther'; // 互评流程节点
|
|
|
-import Scores from '@/newPerformance/components/TemplateDetails/Scores'; // 评分流程节点
|
|
|
-import Reviews from '@/newPerformance/components/TemplateDetails/Reviews'; // 审批流程节点
|
|
|
-import CC from '@/newPerformance/components/TemplateDetails/CC'; // 审批流程节点
|
|
|
-
|
|
|
-export default {
|
|
|
- components: {
|
|
|
- HandleNode,
|
|
|
- FormulaComp,
|
|
|
- PublishComp,
|
|
|
- ShowDataComp,
|
|
|
- EditContentComp,
|
|
|
- BatchHandleNode,
|
|
|
- TargetConfirms,
|
|
|
- ResultInput,
|
|
|
- ScoreEachOther,
|
|
|
- Scores,
|
|
|
- Reviews,
|
|
|
- CC
|
|
|
- },
|
|
|
- props: {
|
|
|
- // 模板ID
|
|
|
- templateId: {
|
|
|
- type: Number | String,
|
|
|
- default: ''
|
|
|
- }
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- isDataShow: false,
|
|
|
- isShow: false,
|
|
|
- templateTitle: "模板名称",
|
|
|
- loading: false,
|
|
|
- title: "模板名称",
|
|
|
- alertTilte: "可在表格中直接编辑指标,规则 (规则支持富文本) ,目标,单位,权重,计算公式以及流程节点, 注意: 每个指标的标题不能为空!每个指标的评分节点一定要开启!",
|
|
|
- tableData: [], // 表格数据
|
|
|
- showFormula: false, // 编辑计算公式弹框显示
|
|
|
- showPublish: false, // 发布考核弹框显示
|
|
|
- dialogVisible: false, // 编辑流程节点弹框显示
|
|
|
- dialogTitle: "", // 编辑流程节点弹框标题
|
|
|
- isDisable: false, // 是否禁用
|
|
|
- nodeType: "", // 节点类型
|
|
|
- currentIndicator: null, // 操作的指标
|
|
|
- selectIndicatorId: "", // 选择的指标ID
|
|
|
- selectNodes: [], // 选中指标所有的节点
|
|
|
- selectIndex: 0, // 表格行索引
|
|
|
- formLabel: "",
|
|
|
- tagIndex: 0,
|
|
|
- multipleSelection: [],
|
|
|
- content: "", // 指标规则
|
|
|
- showEditContent: false, // 编辑指标内容弹框
|
|
|
- deptList: [], // 部门列表 - 树形结构
|
|
|
- dept_list: [], // 部门列表
|
|
|
- postList: [], // 岗位列表
|
|
|
- flowColumn: ["确认目标", "录入结果", "自评", "互评", "评分", "审批", "抄送", "过程跟踪"],
|
|
|
- tableColumn: [
|
|
|
- { label: "指标", prop: "title", isShow: true, width: 150 },
|
|
|
- { label: "规则", prop: "content", isShow: true, width: 150 },
|
|
|
- { label: "目标", prop: "target", isShow: true, width: 80},
|
|
|
- { label: "单位", prop: "unit", isShow: true, width: 100 },
|
|
|
- { label: "权重(%)", prop: "weight", isShow: true, width: 100 },
|
|
|
- { label: "计算公式", prop: "formulae", isShow: true, width: 120 },
|
|
|
- { label: "过程跟踪", prop: "okrs", isShow: true, width: 120 },
|
|
|
- { label: "确认目标", prop: "targetConfirms", isShow: false, width: 100 },
|
|
|
- { label: "录入结果", prop: "resultInput", isShow: false, width: 100 },
|
|
|
- { label: "自评", prop: "scoreSelf", isShow: false, width: 100 },
|
|
|
- { label: "互评", prop: "scoreEachOther", isShow: false, width: 100 },
|
|
|
- { label: "评分", prop: "scores", isShow: false, width: 100 },
|
|
|
- { label: "审批", prop: "reviews", isShow: false, width: 100 },
|
|
|
- { label: "抄送", prop: "cc", isShow: false, width: 100 }
|
|
|
- ],
|
|
|
- checkColumns: [],
|
|
|
- checkAll: false,
|
|
|
- flowInfo: {},
|
|
|
- handleNode: {},
|
|
|
- batchHandleDialog: false,
|
|
|
- targetConfirms: false,
|
|
|
- resultInput: false,
|
|
|
- scoreEachOther: false,
|
|
|
- scores: false,
|
|
|
- reviews: false,
|
|
|
- cc: false
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- computed: {
|
|
|
- ...mapGetters(['user_info']),
|
|
|
- // 指标标题为空不能发起考核
|
|
|
- isTitleNull() {
|
|
|
- return this.tableData.find(item => item.title == '' || item.title == null) ? true : false
|
|
|
- },
|
|
|
- // 指标评分为禁用不能发起考核
|
|
|
- isScoreNull() {
|
|
|
- return this.tableData.find(item => !item.flow.nodes[4].enable) ? true : false
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- created() {
|
|
|
- this.get_template_detail();
|
|
|
- this.get_table_data();
|
|
|
- this.isDataShow = false
|
|
|
- // 请求岗位列表,部门列表
|
|
|
- Promise.all([this.get_dept_list(), this.get_post_list()]).then(([deptRes, postRes]) => {
|
|
|
- if (deptRes.data.code !== 1) return this.$message.error(deptRes.data.msg || "请求部门列表数据出错")
|
|
|
- if (postRes.data.code !== 1) return this.$message.error(postRes.data.msg || "请求岗位列表数据出错")
|
|
|
- this.dept_list = deptRes.data.data.list;
|
|
|
- this.deptList = this.getTreeData(this.dept_list); // 处理成树状结构
|
|
|
- this.postList = postRes.data.data.list
|
|
|
- localStorage.setItem("dept_list", JSON.stringify(this.dept_list))
|
|
|
- localStorage.setItem("deptList", JSON.stringify(this.deptList))
|
|
|
- localStorage.setItem("postList", JSON.stringify(this.postList))
|
|
|
- this.isDataShow = true
|
|
|
- })
|
|
|
- },
|
|
|
- methods: {
|
|
|
-
|
|
|
- // 处理部门树状结构数据
|
|
|
- getTreeData(data) {
|
|
|
- for (var i = 0; i < data.length; i++) {
|
|
|
- data[i].checked = false;
|
|
|
- if (data[i].children.length < 1) {
|
|
|
- // children若为空数组,则将children设为undefined
|
|
|
- data[i].children = undefined;
|
|
|
- } else {
|
|
|
- // children若不为空数组,则继续 递归调用 本方法
|
|
|
- this.getTreeData(data[i].children);
|
|
|
- }
|
|
|
- }
|
|
|
- return data;
|
|
|
- },
|
|
|
-
|
|
|
- // 获取部门
|
|
|
- get_dept_list() {
|
|
|
- return this.$axiosUser('get', '/api/pro/department/tree', '', 'v2')
|
|
|
- },
|
|
|
-
|
|
|
- // 岗位列表
|
|
|
- get_post_list() {
|
|
|
- let data = {
|
|
|
- page: 1,
|
|
|
- page_size: 999,
|
|
|
- cate_id: -1,
|
|
|
- name: ''
|
|
|
- }
|
|
|
- return this.$axiosUser('get', '/api/pro/post/cate_post_list', data)
|
|
|
- },
|
|
|
-
|
|
|
- // 自定义表头
|
|
|
- renderHeader(h, item, type) {
|
|
|
- let label = ""
|
|
|
- const labels = {
|
|
|
- 'targetConfirms': '确认目标',
|
|
|
- 'resultInput': '录入结果',
|
|
|
- 'scoreSelf': '自评',
|
|
|
- 'scoreEachOther': '互评',
|
|
|
- 'scores': '评分',
|
|
|
- 'reviews': '审批',
|
|
|
- 'cc': '抄送'
|
|
|
- }
|
|
|
- label = labels[type];
|
|
|
- let that = this;
|
|
|
-
|
|
|
- return h('div', {
|
|
|
- style: { display: "flex", alignItems: "center", justifyContent: "center" }
|
|
|
- }, [
|
|
|
-
|
|
|
- h('el-button', {
|
|
|
- props: {
|
|
|
- size: 'small'
|
|
|
- },
|
|
|
- on: {
|
|
|
- click: function () {
|
|
|
- that.clickButton(type);
|
|
|
- }
|
|
|
- }
|
|
|
- }, label),
|
|
|
- ])
|
|
|
- },
|
|
|
-
|
|
|
- clickButton(nodeType) {
|
|
|
- this.handleNode = this.flowInfo.nodes.find(node => node.type === nodeType)
|
|
|
- let options = {
|
|
|
- 'targetConfirms': ['确认目标', '确认人'],
|
|
|
- 'resultInput': ['录入结果', '录入人'],
|
|
|
- 'scoreSelf': ['自评', ''],
|
|
|
- 'scoreEachOther': ['互评', '互评人'],
|
|
|
- 'scores': ['评分', '评分人'],
|
|
|
- 'reviews': ['审批', '审批人'],
|
|
|
- 'cc': ['抄送', '抄送人']
|
|
|
- }
|
|
|
- this.dialogTitle = options[nodeType][0]
|
|
|
- this.formLabel = options[nodeType][1]
|
|
|
- this.nodeType = nodeType; // 节点类型
|
|
|
- this.batchHandleDialog = true;
|
|
|
- },
|
|
|
-
|
|
|
- // 打开编辑规则内容弹框
|
|
|
- editContent(index, content, indicatorId) {
|
|
|
- this.selectIndex = index;
|
|
|
- this.content = content;
|
|
|
- this.selectIndicatorId = indicatorId;
|
|
|
- this.showEditContent = true
|
|
|
- },
|
|
|
-
|
|
|
- finishEditContent(content) {
|
|
|
- this.tableData[this.selectIndex].content = content
|
|
|
- },
|
|
|
-
|
|
|
- // 获取模板详情
|
|
|
- get_template_detail() {
|
|
|
- this.$axiosUser("get", `/performance/template/info/${this.user_info.site_id}/` + this.templateId).then(res => {
|
|
|
- let { data: { data: { title, flow } } } = res
|
|
|
- this.templateTitle = title || '模板名称'
|
|
|
- this.title = title || '模板名称'
|
|
|
- this.flowInfo = flow || {}
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 获取表格数据
|
|
|
- get_table_data() {
|
|
|
- this.loading = true
|
|
|
- this.$axiosUser("get", `/performance/indicator/list/${this.user_info.site_id}/` + this.templateId).then(res => {
|
|
|
- this.loading = false
|
|
|
- this.tableData = res.data.data.list
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- editTableData() {
|
|
|
- },
|
|
|
- // 编辑模板标题
|
|
|
- editTitle() {
|
|
|
- let title = this.title
|
|
|
- if (title !== null && title !== '') {
|
|
|
- let url = `/performance/template/title/${this.user_info.site_id}`
|
|
|
- this.$http.post(url, { templateId: this.templateId, title }).then(res => {
|
|
|
- if (res.code == 1) {
|
|
|
- this.$refs.popoverRef && this.$refs.popoverRef.doClose();
|
|
|
- this.get_template_detail();
|
|
|
- }
|
|
|
-
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- // 编辑指标名称,规则,权重,目标,单位
|
|
|
- handleEdit(props, value, id) {
|
|
|
- let url = '', data = {};
|
|
|
- url = `/performance/indicator/${props}/${this.user_info.site_id}/${this.templateId}`;
|
|
|
- data[props] = value;
|
|
|
- data['indicatorId'] = id;
|
|
|
- this.$http.post(url, data).then(res => {
|
|
|
- if(res.code == 0) return this.$message.error(res.msg || '操作失败')
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- handleBtnClick(index, node, row) {
|
|
|
- this.handleStatusChange(index, row, node.type)
|
|
|
- },
|
|
|
-
|
|
|
- // 自评节点单独操作
|
|
|
- handleScoreSelf(row, index) {
|
|
|
- let { indicatorId, flow: { nodes } } = row
|
|
|
- let data = {
|
|
|
- indicatorId, // 指标ID
|
|
|
- nodes
|
|
|
- }
|
|
|
- let url = `/performance/indicator/flow/${this.user_info.site_id}/${this.templateId}`
|
|
|
- this.$http.post(url, data).then(res => {
|
|
|
- let { code, data } = res
|
|
|
- if (code == 1) {
|
|
|
- this.tableData.splice(index, 1, data); //替换元素
|
|
|
- this.$message.success("操作成功");
|
|
|
- } else {
|
|
|
- this.$message.error(res.message || '操作失败');
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 操作节点
|
|
|
- handleStatusChange(index, row, nodeType) {
|
|
|
- if (index !== -1) this.tagIndex = index // 子节点索引
|
|
|
- this.currentIndicator = row;
|
|
|
- let { indicatorId } = row;
|
|
|
- this.selectIndicatorId = indicatorId; // 指标ID
|
|
|
- this.selectNodes = row.flow.nodes; // 所有节点
|
|
|
- this.nodeType = nodeType; // 节点类型
|
|
|
- if (nodeType == 'targetConfirms') {
|
|
|
- this.dialogTitle = "确认目标"
|
|
|
- this.formLabel = "确认人"
|
|
|
- this.targetConfirms = true;
|
|
|
- }
|
|
|
- if (nodeType == 'resultInput') {
|
|
|
- this.dialogTitle = "录入结果"
|
|
|
- this.formLabel = "录入人"
|
|
|
- this.resultInput = true;
|
|
|
- }
|
|
|
- if (nodeType == 'scoreSelf') {
|
|
|
- this.dialogTitle = "自评"
|
|
|
- }
|
|
|
- if (nodeType == 'scoreEachOther') {
|
|
|
- this.dialogTitle = "互评"
|
|
|
- this.formLabel = "互评人"
|
|
|
- this.scoreEachOther = true
|
|
|
- }
|
|
|
- if (nodeType == 'scores') {
|
|
|
- this.dialogTitle = "评分"
|
|
|
- this.formLabel = "评分人"
|
|
|
- this.scores = true
|
|
|
-
|
|
|
- }
|
|
|
- if (nodeType == 'reviews') {
|
|
|
- this.dialogTitle = "审批"
|
|
|
- this.formLabel = "审批人"
|
|
|
- this.reviews = true
|
|
|
- }
|
|
|
- if (nodeType == 'cc') {
|
|
|
- this.dialogTitle = "抄送"
|
|
|
- this.formLabel = "抄送人"
|
|
|
- this.cc = true
|
|
|
- }
|
|
|
- // this.dialogVisible = true;
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- // 添加指标
|
|
|
- addData() {
|
|
|
- let url = `/performance/indicator/create/${this.user_info.site_id}/${this.templateId}`
|
|
|
- this.$http.post(url, {}).then(res => {
|
|
|
- let { data, code } = res
|
|
|
- if (code) this.tableData.push(data)
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- handleSelectChange(val) {
|
|
|
- this.multipleSelection = val;
|
|
|
- },
|
|
|
- // 取消删除
|
|
|
- cancelDelete() {
|
|
|
- console.log("取消删除");
|
|
|
- },
|
|
|
- // 确认删除
|
|
|
- confirmDelete() {
|
|
|
- if (this.multipleSelection && this.multipleSelection.length > 0) {
|
|
|
- this.$confirm('确定删除选中的指标吗?', '提示', {
|
|
|
- type: 'warning'
|
|
|
- }).then(() => {
|
|
|
- // 创建一个包含异步任务的数组,每个任务都是一个 axios 请求
|
|
|
- const arrays = []
|
|
|
- this.multipleSelection.forEach(item => {
|
|
|
- arrays.push(this.deleteIndicator(item))
|
|
|
- })
|
|
|
-
|
|
|
- // 当所有请求都成功完成时,responses 是一个包含所有响应的数组
|
|
|
- Promise.all(arrays).then(responses => {
|
|
|
- // console.log(responses)
|
|
|
- this.get_table_data();
|
|
|
- }).catch(error => {
|
|
|
- // 如果任何一个请求失败,将会进入这个 catch 块
|
|
|
- console.log(error)
|
|
|
- })
|
|
|
- }).catch(() => { });
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- // 删除指标
|
|
|
- deleteIndicator(item) {
|
|
|
- let url = `/performance/indicator/remove/${this.user_info.site_id}/${this.templateId}/${item.indicatorId}`
|
|
|
- return this.$axiosUser('post', url).then(res => {
|
|
|
- return res.data
|
|
|
- })
|
|
|
- },
|
|
|
- // 打开计算公式弹框
|
|
|
- openFormula(row, index) {
|
|
|
- this.currentIndicator = null;
|
|
|
- this.selectIndex = -1;
|
|
|
- this.currentIndicator = row;
|
|
|
- this.selectIndex = index;
|
|
|
- this.showFormula = true;
|
|
|
- },
|
|
|
- // 关闭编辑计算公式弹框
|
|
|
- closeDialog() {
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- // 全选复选框事件监听
|
|
|
- checkAllChangeFn(val) {
|
|
|
- if (val) {
|
|
|
- // 全选
|
|
|
- this.tableColumn.forEach(item => {
|
|
|
- item.isShow = true
|
|
|
- })
|
|
|
- } else {
|
|
|
- // 反全选
|
|
|
- this.tableColumn.forEach(item => {
|
|
|
- if (this.flowColumn.includes(item.label)) {
|
|
|
- item.isShow = false;
|
|
|
- } else {
|
|
|
- item.isShow = true
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- this.showPopover();
|
|
|
- },
|
|
|
- // 重置,flag: Boolean,全部重置为flag
|
|
|
- reset(flag) {
|
|
|
- this.tableColumn.forEach(item => {
|
|
|
- if (this.flowColumn.includes(item.label)) {
|
|
|
- item.isShow = false;
|
|
|
- } else {
|
|
|
- item.isShow = true
|
|
|
- }
|
|
|
- })
|
|
|
- this.showPopover();
|
|
|
- this.refreshTable();
|
|
|
- },
|
|
|
- // 表格列是否显示的方法
|
|
|
- showColumn(currentColumn) {
|
|
|
- return this.tableColumn.find(item => item.prop == currentColumn).isShow;
|
|
|
- },
|
|
|
- /* 选择列 */
|
|
|
- changeColumns(val) {
|
|
|
- this.tableColumn.forEach(item => {
|
|
|
- item.isShow = false;
|
|
|
- })
|
|
|
- // columns将val数组存在的值设为true,不存在的设为false
|
|
|
- val && val.forEach(item => {
|
|
|
- let current = this.tableColumn.find(i => i.label == item)
|
|
|
- current.isShow = true;
|
|
|
- })
|
|
|
- // 判断是否全选
|
|
|
- this.judgeIsCheckAll();
|
|
|
- // this.refreshTable();
|
|
|
- },
|
|
|
- // 重新渲染表格
|
|
|
- refreshTable() {
|
|
|
- this.$nextTick(() => {
|
|
|
- if (this.$refs.fmeaTableRef) this.$refs.fmeaTableRef.doLayout();
|
|
|
- })
|
|
|
- },
|
|
|
- // 气泡框出现
|
|
|
- showPopover() {
|
|
|
- this.checkColumns = []
|
|
|
- this.tableColumn.forEach(item => {
|
|
|
- if (item.isShow) {
|
|
|
- this.checkColumns.push(item.label)
|
|
|
- }
|
|
|
- })
|
|
|
- // 判断是否全选
|
|
|
- this.judgeIsCheckAll();
|
|
|
- },
|
|
|
- // 判断是否全选
|
|
|
- judgeIsCheckAll() {
|
|
|
- // 选中的长度 = 表格列的长度 全选按钮就选中
|
|
|
- if (this.checkColumns.length == this.tableColumn.length)
|
|
|
- this.checkAll = true
|
|
|
- else
|
|
|
- this.checkAll = false
|
|
|
- },
|
|
|
-
|
|
|
- finishHandle(nodes) {
|
|
|
- let data = nodes
|
|
|
- let url = `/performance/indicator/flow/${this.user_info.site_id}/${this.templateId}`
|
|
|
- this.$http.post(url, data).then(res => {
|
|
|
- let { code, data } = res
|
|
|
- if (code == 1) {
|
|
|
- let { indicatorId } = this.currentIndicator;
|
|
|
- let index = this.tableData.findIndex(table => table.indicatorId === indicatorId)
|
|
|
- this.tableData.splice(index, 1, data); //替换元素
|
|
|
- this.$message.success("操作成功");
|
|
|
- this.nodeType = ''
|
|
|
- this.dialogTitle = ''
|
|
|
- this.selectNodes = []
|
|
|
- this.currentIndicator = []
|
|
|
- this.selectIndicatorId = ''
|
|
|
- this.tagIndex = -1
|
|
|
- } else {
|
|
|
- this.$message.error(res.message || '操作失败');
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 批量操作成功
|
|
|
- finishBatchHandle(data) {
|
|
|
- this.flowInfo = data;
|
|
|
- this.get_table_data();
|
|
|
- },
|
|
|
-
|
|
|
- // 编辑计算公式确定的回调
|
|
|
- onFormulaConfirm(formulas) {
|
|
|
- let url = `/performance/indicator/expression/${this.user_info.site_id}/${this.templateId}`;
|
|
|
- let { indicatorId } = this.currentIndicator;
|
|
|
- let params = {
|
|
|
- indicatorId,
|
|
|
- expression: {
|
|
|
- formulas: formulas.map(item => {
|
|
|
- return {
|
|
|
- condition: item.condition,
|
|
|
- expression: item.expression
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- this.$http.post(url, params).then(res => {
|
|
|
- let { data, code } = res
|
|
|
- if (code) {
|
|
|
- this.tableData.splice(this.selectIndex, 1, data); //替换元素
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 发布考核
|
|
|
- publish() {
|
|
|
- this.showPublish = true;
|
|
|
- },
|
|
|
- // 发布考核弹框的回调
|
|
|
- onPubishConfirm(params, selectOkrs) {
|
|
|
- let templateId = this.templateId;
|
|
|
- let { title, startDate, endDate, cycleType, employeeIds, okrs, cateId } = params
|
|
|
- let employees = employeeIds.map(employee => ({
|
|
|
- employeeId: employee,
|
|
|
- ids: [],
|
|
|
- interviewFlow: {
|
|
|
- nodes: [
|
|
|
- {
|
|
|
- id: "IT_1894283564934688769",
|
|
|
- type: "interview",
|
|
|
- allows: [],
|
|
|
- enable: false,
|
|
|
- weight: 0,
|
|
|
- children: [],
|
|
|
- assigneeIds: [],
|
|
|
- leaderLevel: 1,
|
|
|
- assigneeType: "self",
|
|
|
- multipleType: "or"
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- }))
|
|
|
-
|
|
|
- let requireParams = {
|
|
|
- title,
|
|
|
- cycleType,
|
|
|
- startDate,
|
|
|
- endDate,
|
|
|
- okrs,
|
|
|
- templates: [
|
|
|
- {
|
|
|
- templateId,
|
|
|
- employees
|
|
|
- }
|
|
|
- ],
|
|
|
- cateId
|
|
|
- }
|
|
|
- // let url = `/performance/review/publish/${this.user_info.site_id}`;
|
|
|
- // console.log(requireParams)
|
|
|
- let url = `/performance/review/publish/templates/${this.user_info.site_id}`;
|
|
|
- this.loading = true
|
|
|
- this.$http.post(url, requireParams).then(res => {
|
|
|
- console.log(res)
|
|
|
- let { data, code } = res
|
|
|
- this.loading = false
|
|
|
- if (code == 1) {
|
|
|
- this.$message.success("发布成功");
|
|
|
- setTimeout(() => {
|
|
|
- this.$router.go(-1)
|
|
|
- }, 1000);
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss">
|
|
|
-.box {
|
|
|
- .el-switch__core {
|
|
|
- width: 30px !important;
|
|
|
- height: 16px;
|
|
|
- }
|
|
|
-
|
|
|
- .el-switch__core::after {
|
|
|
- width: 14px;
|
|
|
- height: 14px;
|
|
|
- margin-top: -1px;
|
|
|
- }
|
|
|
-
|
|
|
- .el-switch.is-checked .el-switch__core::after {
|
|
|
- margin-left: -15px;
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|
|
|
-<style scoped="scoped" lang="scss">
|
|
|
-.oneLine {
|
|
|
- overflow: hidden;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
-}
|
|
|
-.box {
|
|
|
- padding: 0 10px;
|
|
|
- font-size: 14px;
|
|
|
- background-color: #fff;
|
|
|
- box-sizing: border-box;
|
|
|
- border-radius: 4px;
|
|
|
-
|
|
|
- /* 设置滚动条的宽度和背景色 */
|
|
|
- ::v-deep .el-table__body-wrapper::-webkit-scrollbar {
|
|
|
- width: 10px;
|
|
|
- height: 10px;
|
|
|
- background-color: #f9f9f9;
|
|
|
- }
|
|
|
-
|
|
|
- /* 设置滚动条滑块的样式 */
|
|
|
- ::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
|
|
|
- border-radius: 6px;
|
|
|
- background-color: #c1c1c1;
|
|
|
- }
|
|
|
-
|
|
|
- /* 设置滚动条滑块hover样式 */
|
|
|
- ::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
|
|
|
- background-color: #a8a8a8;
|
|
|
- }
|
|
|
-
|
|
|
- /* 设置滚动条轨道的样式 */
|
|
|
- ::v-deep .el-table__body-wrapper::-webkit-scrollbar-track {
|
|
|
- box-shadow: inset 0 0 5px rgba(87, 175, 187, 0.1);
|
|
|
- border-radius: 6px;
|
|
|
- background: #ededed;
|
|
|
- }
|
|
|
-
|
|
|
- /*头部样式*/
|
|
|
- .header-content {
|
|
|
- position: relative;
|
|
|
- box-sizing: border-box;
|
|
|
- height: 40px;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .header-left {
|
|
|
- width: 230px;
|
|
|
- box-sizing: border-box;
|
|
|
- height: 40px;
|
|
|
- cursor: pointer;
|
|
|
- .item {
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
- .el-icon-arrow-left {
|
|
|
- font-size: 22px;
|
|
|
- }
|
|
|
-
|
|
|
- &:hover {
|
|
|
- .el-icon-arrow-left {
|
|
|
- background-color: #f5f7fa;
|
|
|
- color: #222;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .text {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 600;
|
|
|
- padding-left: 50px;
|
|
|
-
|
|
|
- &::before {
|
|
|
- position: absolute;
|
|
|
- content: '';
|
|
|
- width: 1px;
|
|
|
- height: 36px;
|
|
|
- background-color: #ebebeb;
|
|
|
- left: 44px;
|
|
|
- top: 50%;
|
|
|
- margin-top: -18px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .header-right {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .plus-button {
|
|
|
- display: block;
|
|
|
- margin: 10px auto;
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-</style>
|